:root{--ink:#0b174d;--purple:#5829e6;--blue:#2f63d9;--teal:#058d8e;--line:#e3e6f5;--soft:#f5f4ff;--canvas-w:864px;--canvas-h:1821px}*{box-sizing:border-box}html,body{margin:0;background:#eef0f8;color:var(--ink);font-family:Arial,"Helvetica Neue",sans-serif}button,input{font:inherit}.page{position:relative;width:var(--canvas-w);height:var(--canvas-h);margin:0 auto;overflow:hidden;background:linear-gradient(135deg,#fff 0%,#fafaff 45%,#f4f2ff 100%);box-shadow:0 0 45px #cdd0df}.header{height:104px;padding:22px 42px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e5e7f1;background:rgba(255,255,255,.82)}.brand{display:flex;align-items:center;gap:14px;color:var(--ink);text-decoration:none}.brand-shield{width:50px;height:58px;display:grid;place-items:center;color:white;background:linear-gradient(145deg,#714cff,#4023d6);font-size:28px;font-weight:900;clip-path:polygon(50% 0,95% 20%,90% 72%,50% 100%,10% 72%,5% 20%)}.brand strong{display:block;font-size:31px;line-height:32px}.brand small{display:block;color:#4f2ee1;font-size:17px;font-weight:900;letter-spacing:7px}.header-actions{display:flex;align-items:center;gap:30px}.icon-btn{width:45px;height:45px;border:0;background:none;position:relative}.login-btn{width:104px;height:54px;border:0;border-radius:12px;color:white;background:linear-gradient(135deg,#6738ea,#4924d5);font-size:19px;font-weight:700}.search-icon{display:block;width:27px;height:27px;border:3px solid currentColor;border-radius:50%;position:relative}.search-icon:after{content:"";position:absolute;width:13px;height:3px;right:-10px;bottom:-5px;background:currentColor;transform:rotate(48deg);border-radius:2px}.menu-icon,.menu-icon:before,.menu-icon:after{position:absolute;left:4px;width:33px;height:3px;background:var(--ink);content:""}.menu-icon{top:21px}.menu-icon:before{left:0;top:-12px}.menu-icon:after{left:0;top:12px}.hero{position:relative;height:410px;padding:42px 50px}.hero-copy{position:relative;z-index:2}.hero h1{margin:0;font-size:46px;line-height:1.1;letter-spacing:-1.8px}.hero p{margin:21px 0 0;font-size:18px;line-height:1.65}.hero-art{position:absolute;right:0;top:38px;width:402px;height:356px;object-fit:cover;object-position:100% 50%;mix-blend-mode:multiply}.search-bar{position:absolute;z-index:3;left:43px;bottom:13px;width:416px;height:58px;padding:7px 7px 7px 20px;display:flex;align-items:center;gap:17px;border:1px solid #d8dced;border-radius:32px;background:white;box-shadow:0 8px 24px rgba(42,38,105,.1)}.search-bar .search-icon{width:21px;height:21px;border-width:2px}.search-bar input{min-width:0;flex:1;border:0;outline:0;color:#485178;font-size:14px}.search-bar button{width:99px;height:44px;border:0;border-radius:23px;color:white;background:linear-gradient(135deg,#6f3df1,#4d28da);font-weight:700}.trust-row{height:74px;margin:0 50px;display:grid;grid-template-columns:repeat(4,1fr);gap:10px;align-items:center}.trust-row div{height:47px;display:flex;align-items:center;justify-content:center;gap:10px;border-radius:24px;background:#f0efff;font-size:14px;white-space:nowrap}.trust-row span{color:#6535ea;font-size:20px}.top-card{height:720px;margin:0 42px;border:1px solid var(--line);border-radius:15px;background:rgba(255,255,255,.9);box-shadow:0 8px 24px rgba(33,42,103,.07);overflow:hidden}.section-head{height:96px;padding:19px 24px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.title-wrap{display:flex;align-items:flex-start;gap:18px}.crown{color:#5c2ee7;font-size:34px}.section-head h2,.categories h2{margin:0;font-size:22px}.section-head p{margin:8px 0 0;color:#4c567b;font-size:15px}.text-link{border:0;background:none;color:#4d24df;font-weight:700}.casino-row{height:208px;padding:14px;display:grid;grid-template-columns:34px 132px 1fr 160px;gap:14px;align-items:center;border-bottom:1px solid var(--line)}.casino-row:last-child{border-bottom:0}.rank{align-self:start;width:34px;height:47px;padding-top:9px;text-align:center;color:white;background:var(--rank);font-size:20px;font-weight:700;clip-path:polygon(0 0,100% 0,100% 100%,50% 82%,0 100%)}.casino-logo{width:132px;height:148px;border-radius:12px;object-fit:cover}.casino-info h3{margin:0 0 12px;font-size:21px}.rating-line{display:flex;align-items:center;gap:11px}.licensed{padding:4px 8px;border-radius:8px;color:#087b43;background:#e7f8ed;font-size:12px;font-weight:700}.stars{color:#f8a800;font-size:20px;letter-spacing:1px}.rating{color:#435078;font-size:13px}.facts{margin-top:23px;display:grid;grid-template-columns:1.25fr .8fr 1fr;gap:8px;color:#4d567b;font-size:12px;line-height:1.35}.facts b{display:block;margin-top:4px;color:var(--ink);font-size:13px}.offer{height:160px;padding:14px 12px;text-align:center;border-radius:13px;background:linear-gradient(135deg,#f4f3ff,#fbfbff)}.offer small{display:block;line-height:1.4}.offer strong{display:block;margin:9px 0 12px;color:var(--rank);font-size:27px}.offer button{width:135px;height:39px;border:0;border-radius:9px;color:white;background:var(--rank);font-weight:700}.offer a{display:block;margin-top:10px;color:var(--rank);font-size:13px;text-decoration:none}.categories{height:265px;margin:16px 42px 0;padding:20px 22px;border:1px solid var(--line);border-radius:15px;background:white;box-shadow:0 8px 24px rgba(33,42,103,.06)}.category-grid{margin-top:17px;display:grid;grid-template-columns:repeat(3,1fr);gap:16px 12px}.category-grid button{height:79px;padding:13px 13px 10px 76px;position:relative;text-align:left;border:0;border-radius:12px;color:var(--ink);background:#f5f4ff}.category-grid span{position:absolute;left:14px;top:15px;width:48px;height:48px;display:grid;place-items:center;border-radius:50%;color:#4f32df;background:white;font-weight:900}.category-grid b,.category-grid small{display:block}.category-grid b{font-size:15px}.category-grid small{margin-top:7px;color:#526086;font-size:13px}.bonus-banner{height:128px;margin:14px 42px 0;padding:15px 22px;display:flex;align-items:center;border-radius:15px;color:white;background:linear-gradient(115deg,#151d62,#1d286e 60%,#161d5a)}.bonus-banner img{width:112px;height:90px;object-fit:cover;mix-blend-mode:screen}.bonus-banner h2{margin:0 0 9px;font-size:20px}.bonus-banner p{margin:0;font-size:14px;line-height:1.45}.bonus-banner button{margin-left:auto;width:216px;height:52px;border:0;border-radius:12px;color:#4e2adf;background:white;font-weight:800}.bottom-nav{position:fixed;z-index:20;left:50%;bottom:0;transform:translateX(-50%);width:864px;height:96px;padding:13px 54px 8px;display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid #e5e6ef;background:rgba(255,255,255,.96);box-shadow:0 -6px 18px rgba(28,37,95,.05)}.bottom-nav button{border:0;background:none;color:#526087;font-weight:700}.bottom-nav span{display:block;margin-bottom:6px;font-size:30px}.bottom-nav .active{color:#5829e6}.overlay{position:fixed;z-index:50;inset:0;display:grid;place-items:center;background:rgba(5,12,50,.42)}.overlay[hidden]{display:none}.modal{position:relative;width:430px;padding:36px;border-radius:20px;background:white;box-shadow:0 30px 90px rgba(0,0,0,.25)}.modal h2{font-size:28px}.modal input{width:100%;height:50px;margin:7px 0;padding:0 14px;border:1px solid #d8dbea;border-radius:10px}.modal .primary{width:100%;height:50px;margin-top:8px;border:0;border-radius:10px;color:white;background:#5829e6}.close{position:absolute;right:16px;top:12px;border:0;background:none;font-size:30px}.drawer{position:fixed;z-index:45;right:-360px;top:0;width:340px;height:100vh;padding:76px 30px;background:white;box-shadow:-20px 0 60px rgba(7,15,55,.2);transition:right .25s}.drawer.open{right:0}.drawer a{display:block;padding:18px 0;border-bottom:1px solid #e9eaf2;color:var(--ink);font-size:18px;text-decoration:none}.toast{position:fixed;z-index:80;left:50%;bottom:116px;transform:translateX(-50%);padding:12px 20px;border-radius:22px;color:white;background:#111b52}.toast[hidden]{display:none}@media(max-width:864px){.page{transform-origin:top left;transform:scale(calc(100vw / 864));margin-bottom:calc((1821px * (100vw / 864)) - 1821px)}.bottom-nav{width:100vw;height:calc(96px * (100vw / 864));padding:calc(13px * (100vw / 864)) calc(54px * (100vw / 864)) calc(8px * (100vw / 864));}.bottom-nav span{font-size:calc(30px * (100vw / 864));margin-bottom:calc(6px * (100vw / 864))}.bottom-nav button{font-size:calc(16px * (100vw / 864))}}
