:root{--page-bg:#090e19;--surface:#151d2c;--ink:#edf3ff;--muted:#a0adbf;--accent:#b9f35a;--on-accent:#142009;--soft:#202d40;--line:#2a3547;--font:'Segoe UI',Arial,sans-serif;--page-width:1250px;--dialog-radius:16px}
body{background-image:radial-gradient(ellipse at 80% 0,#162a3a55,transparent 38%)}
.site-header{min-height:91px}
.logo__text{font-family:Impact,'Arial Narrow',sans-serif;font-size:31px;font-style:italic;font-weight:500;letter-spacing:.5px}
.logo__text:after{content:'';display:inline-block;width:9px;height:9px;margin-left:7px;background:var(--accent);transform:skew(-12deg)}
.instruction-btn{border-radius:8px;background:#ffffff05}
.instruction-btn:hover{background:var(--soft)}
.hero{min-height:330px;position:relative;isolation:isolate;border-radius:20px;overflow:hidden;display:flex;align-items:center;justify-content:center;text-align:center;margin:0 0 24px;border:1px solid #314052}
.hero__image{position:absolute;inset:0;background:linear-gradient(0deg,#0c1524b3,#090e191a),url('../assets/stadium-night.png') center 42%/cover;z-index:-1}
.hero__copy{max-width:650px;padding:42px 15px}
.hero__caption{font-size:10px;color:#b2becf;max-width:300px;margin:0 auto 23px;letter-spacing:.08em;text-transform:uppercase}
.hero__title{font-family:Impact,'Arial Narrow',sans-serif;font-weight:400;font-style:italic;font-size:61px;text-transform:uppercase;line-height:1.04;letter-spacing:.005em}
.hero__brand{font-family:'Segoe UI',Arial,sans-serif;font-style:normal;font-size:11px;letter-spacing:.26em;color:#d1dcea}
.seo-links{gap:8px;margin-bottom:30px;justify-content:center}
.seo-links a{padding:8px 13px;background:#141d2c;border:1px solid #243145;border-radius:7px;color:#b9c5d7;font-size:10px;min-height:36px}
.seo-links a .icon{color:var(--accent);width:15px;height:15px}
.seo-links a:hover{background:#1d2a3d;border-color:#51673b}
.rating-toolbar{display:flex;justify-content:center;border-bottom:1px solid var(--line);padding-bottom:24px;margin-bottom:25px}
.sort-tabs{gap:6px;padding:5px;background:#121b2a;border:1px solid #243145;border-radius:10px}
.sort-tabs__btn{border-radius:6px;padding:10px 19px;font-size:11px}
.rating__list{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.card{padding:23px;border:1px solid #293549;border-radius:14px;background:linear-gradient(125deg,#192437,#121a29);display:flex;flex-direction:column;gap:19px;overflow:hidden;transition:border-color .2s,transform .2s}
.card:hover{border-color:#728e51;transform:translateY(-3px)}
.card:first-child{border-color:#98c44c;background:linear-gradient(135deg,#25352d,#141f2b 60%)}
.card__top{display:flex;align-items:center;justify-content:space-between}
.card__num{font-family:Impact,'Arial Narrow',sans-serif;font-size:29px;font-style:italic;color:#68798e;line-height:1}
.card:first-child .card__num{color:var(--accent)}
.bonus__accept{font-size:9px;gap:6px}
.flag{width:21px;height:15px}
.brand{display:flex;align-items:center;gap:15px;min-height:68px}
.brand__logo-link{width:135px;height:64px;border-radius:8px}
.brand__logo{padding:11px}
.brand__name{font-size:19px;font-weight:700}
.info-list{font-size:11px;line-height:1.65;min-height:88px}
.info-list li{margin-top:9px}
.info-list .icon{width:14px;height:14px}
.brand__tags{gap:7px;margin-top:auto}
.tag{background:#09111e70;border:1px solid #2c3a50;border-radius:5px;padding:7px 9px;font-size:10px;min-height:35px}
.tag:hover{background:#25354b}
.tag .icon{color:#9dadc1;width:14px;height:14px}
.bonus{border-top:1px solid #314054;padding-top:18px;display:grid;gap:14px}
.bonus__cta{min-height:40px;gap:15px}
.bonus__value{font-size:17px;color:var(--accent);letter-spacing:-.025em}
.bonus__btn{border-radius:50%;width:31px;height:31px;background:#b9f35a15;color:var(--accent)}
.brand__play{width:100%;border-radius:7px;border:1px solid #6c8e414d;background:#b9f35a;min-height:43px;color:#142009;justify-content:space-between;padding:10px 15px;font-size:12px}
.brand__play:hover{background:#cbff77}
.site-footer{background:#070c15}
.site-footer__age{border-color:#7b9251;color:var(--accent)}
@media(max-width:1180px){.rating__list{grid-template-columns:repeat(2,minmax(0,1fr))}.hero__title{font-size:57px}.card{padding:24px}.info-list{min-height:80px}.seo-links a{font-size:10px}}
@media(max-width:760px){
 .site-header{min-height:83px}
 .logo__text{font-size:26px}
 .logo__text:after{width:6px;height:6px;margin-left:4px}
 .instruction-btn,.menu-toggle{border-radius:6px}
 .hero{min-height:305px;border-radius:12px;margin-bottom:20px}
 .hero__image{background-size:auto 100%;background-position:center}
 .hero__copy{padding:32px 20px}
 .hero__caption{font-size:9px;max-width:220px;line-height:1.6;margin-bottom:25px}
 .hero__title{font-size:43px}
 .hero__brand{font-size:10px;letter-spacing:.2em;margin-top:22px}
 .rating-toolbar{display:block;padding-bottom:14px;margin-bottom:18px;min-width:0}
 .sort-tabs{display:flex;padding:4px;gap:3px;border-radius:8px;max-width:100%}
 .sort-tabs__btn{padding:10px 12px;font-size:10px;min-height:39px}
 .rating__list{grid-template-columns:minmax(0,1fr);gap:14px}
 .card{padding:23px;gap:20px}
 .brand{gap:18px}
 .brand__logo-link{width:137px;height:65px}
 .brand__name{font-size:20px}
 .info-list{font-size:12px;min-height:0}
 .tag{font-size:11px;padding:7px 10px;min-height:40px}
 .bonus__value{font-size:18px}
 .brand__play{min-height:47px}
}
@media(max-width:370px){.brand__logo-link{width:112px}.brand__name{font-size:18px}.card{padding:19px}.hero__title{font-size:38px}.tag{font-size:10px}}
