:root{
  --bg-start:#0b2b5a;
  --bg-end:#0b3e7a;
  --chip:#0e4d96;
  --chip-hover:#135fb7;
  --text:#e8f0ff;
  --muted:#9bb5da;
  --orange:#ff6a00;
  --orange-hover:#ff7f24;
  --yellow:#ffd400;
  --outline:rgba(255,255,255,.18);
  --shadow:0 6px 18px rgba(0,0,0,.22);
  --radius:16px;
  --maxw:1280px;
}

*{box-sizing:border-box}
body{
  margin:0; color:var(--text);
  background:linear-gradient(180deg,var(--bg-start),var(--bg-end));
  font:14px/1.4 system-ui,-apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, "Helvetica Neue", Arial, "Apple Color Emoji","Segoe UI Emoji";
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}
.container{max-width:var(--maxw); margin:0 auto; padding:0 16px}

.topbar{border-bottom:1px solid var(--outline); backdrop-filter:saturate(120%) blur(8px)}
.topbar-inner{display:flex; align-items:center; gap:10px; padding:10px; min-height:42px}
.chip{display:inline-flex; align-items:center; gap:8px; padding:8px 12px; background:var(--chip); border:1px solid var(--outline); border-radius:999px; color:#fff; text-decoration:none; transition:.18s ease; white-space:nowrap}
.chip:hover{background:var(--chip-hover)}
.chip .icon{width:16px; height:16px; display:inline-block}
.top-spacer{flex:1}
.time{opacity:.9}

header.site{position:sticky; top:0; z-index:50; box-shadow:var(--shadow)}
.site-inner{display:flex; align-items:center; gap:16px; min-height:68px}
.brand{display:flex; align-items:center; gap:12px}
.logo{display:inline-block; line-height:0}
.logo img{height:28px; width:auto; display:block}

.nav{flex:1}
.nav ul{list-style:none; margin:0; padding:0; display:flex; align-items:center; gap:8px}
.nav a{display:inline-flex; align-items:center; gap:8px; padding:10px 14px; border-radius:var(--radius); color:#fff; text-decoration:none; border:1px solid transparent; transition:.18s ease}
.nav a:hover{background:rgba(255,255,255,.06); border-color:var(--outline)}
.nav .active>a{background:rgba(255,255,255,.08); border-color:var(--outline)}
.aviator{font-family:"Brush Script MT","Segoe Script",cursive}
.bonus-buy>a{border:2px solid var(--yellow); border-radius:999px; padding:9px 16px; font-weight:700}

.auth{display:flex; align-items:center; gap:10px}
.btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:10px 16px; border-radius:999px; text-decoration:none; color:#fff; border:1px solid transparent; transition:.18s ease}
.btn:focus{outline:2px solid rgba(255,255,255,.5); outline-offset:2px}
.btn-login{background:rgba(255,255,255,.14)}
.btn-login:hover{background:rgba(255,255,255,.24)}
.btn-reg{background:var(--orange)}
.btn-reg:hover{background:var(--orange-hover)}

.burger{display:none; position:relative; z-index:120; width:42px; height:42px; border-radius:12px; border:1px solid var(--outline); align-items:center; justify-content:center; background:rgba(255,255,255,.06)}
.burger span,.burger span:before,.burger span:after{content:""; display:block; width:20px; height:2px; background:#fff; position:relative; transition:transform .25s ease,opacity .2s ease}
.burger span:before{position:absolute; transform:translateY(-6px)}
.burger span:after{position:absolute; transform:translateY(6px)}
.burger.active span{background:transparent}
.burger.active span:before{transform:translateY(0) rotate(45deg)}
.burger.active span:after{transform:translateY(0) rotate(-45deg)}

.scrim{position:fixed; inset:0; background:rgba(4,14,34,.55); opacity:0; pointer-events:none; transition:opacity .25s ease; z-index:90}
body.menu-open{overflow:hidden}
body.menu-open .scrim{opacity:1; pointer-events:auto}

.nav-close{display:none}

@media (max-width:1100px){
  .nav ul{gap:4px}
  .nav a{padding:8px 10px}
}
@media (max-width:960px){
  .topbar-inner{flex-wrap:wrap; gap:8px}
  .hide-md{display:none}
}
@media (max-width:1036px){
  .burger{display:inline-flex}
  .nav{
    position:fixed; top:120px; left:0; bottom:0; width:min(92vw,340px);
    background:linear-gradient(180deg,var(--bg-start),var(--bg-end));
    border-right:1px solid var(--outline); box-shadow:var(--shadow);
    padding:18px 14px; border-top-right-radius:18px;
    transform:translateX(-110%); transition:transform .30s cubic-bezier(.22,.61,.36,1); z-index:100;
  }
  .nav.open{transform:translateX(0)}
  .nav ul{flex-direction:column; align-items:stretch; gap:10px; overflow:auto; max-height:calc(100vh - 150px)}
  .nav a{padding:14px 16px; border-radius:18px; background:rgba(255,255,255,.06)}
  .site-inner{min-height:64px}
  .brand{flex:1}
  .nav-close{display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px; margin-bottom:10px; border-radius:10px; border:1px solid var(--outline); background:rgba(255,255,255,.06); color:#fff}
}
@media (max-width:475px){
  .topbar-inner{display:none}
  .nav{top:71px}
}

main{padding:28px 0 80px}

.bonuses{padding:28px 0 40px}
.bonuses-grid{display:grid; grid-template-columns:repeat(4,minmax(240px,1fr)); gap:18px; align-items:stretch}
@media (max-width:1100px){.bonuses-grid{grid-template-columns:repeat(3,minmax(220px,1fr))}}
@media (max-width:860px){.bonuses-grid{grid-template-columns:repeat(2,minmax(220px,1fr))}}
@media (max-width:560px){.bonuses-grid{grid-template-columns:1fr}}

.bonus-card{position:relative; display:flex; flex-direction:column; background:radial-gradient(120% 140% at 20% 0%,rgba(255,255,255,.04) 0%,rgba(255,255,255,0) 60%),linear-gradient(180deg,#0b2f64,#0b3e7a); border:1px solid var(--outline); border-radius:18px; overflow:hidden; box-shadow:0 6px 20px rgba(0,0,0,.18); transition:transform .18s ease,box-shadow .18s ease; min-height:290px}
.bonus-card:hover{transform:translateY(-3px); box-shadow:0 10px 26px rgba(0,0,0,.24)}
.bonus-card .thumb{height:150px; background:rgba(0,0,0,.18)}
.bonus-card .thumb img{width:100%; height:100%; object-fit:cover; display:block}
.card-body{padding:16px 16px 54px}
.title{margin:0 0 8px; font-size:18px; line-height:1.2; font-weight:800; letter-spacing:.2px}
.desc{margin:0; color:var(--muted)}
.badge{position:absolute; top:10px; left:10px; padding:6px 10px; border-radius:999px; font-size:12px; font-weight:700; letter-spacing:.2px; border:1px solid rgba(255,255,255,.22); background:rgba(8,22,48,.55); backdrop-filter:saturate(120%)}
.badge-casino{color:#6ee3ff}
.badge-bonus{color:#7cff7a}
.plus{position:absolute; right:14px; bottom:14px; width:40px; height:40px; border-radius:50%; border:2px solid #ffd400; color:#fff; background:transparent; display:inline-flex; align-items:center; justify-content:center; font-size:20px; line-height:1; cursor:pointer; transition:transform .16s ease,background .16s ease}
.plus:hover{background:rgba(255,212,0,.12); transform:scale(1.06)}

.page-hero{padding:28px 0 12px; text-align:center}
.page-hero h1{margin:0; font-size:clamp(22px,3.2vw,36px); line-height:1.15; font-weight:900; letter-spacing:.2px; color:#fff; position:relative; display:inline-block; padding-bottom:14px}
.page-hero h1:after{content:""; position:absolute; left:50%; transform:translateX(-50%); bottom:0; width:min(320px,60%); height:4px; border-radius:999px; background:linear-gradient(90deg,#ffd400,#ff6a00 50%,#7fb7ff); box-shadow:0 2px 10px rgba(0,0,0,.25)}
.page-sub{margin:12px auto 0; max-width:720px; color:var(--muted); font-size:clamp(14px,1.6vw,16px)}

.promo-slider{position:relative; margin:28px auto 10px; border:1px solid var(--outline); border-radius:18px; overflow:hidden; box-shadow:var(--shadow)}
.ps-track{display:flex; will-change:transform; transition:transform .45s cubic-bezier(.22,.61,.36,1)}
.ps-slide{position:relative; min-width:100%; height:clamp(220px,42vw,360px); overflow:hidden; background:#061936}
.ps-slide img{width:100%; height:100%; object-fit:cover; display:block; transform:scale(1.02)}
.ps-slide::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,0) 40%, rgba(0,0,0, 1.55) 100%)}
.ps-content{position:absolute; left:clamp(14px,4vw,28px); bottom:clamp(16px,4vw,28px); z-index:2; max-width:min(540px,86%)}
.ps-content h3{margin:0 0 6px; font-size:clamp(18px,3.6vw,28px); font-weight:900; letter-spacing:.2px; color:#fff}
.ps-content p{margin:0 0 12px; color:var(--muted); font-size:clamp(14px,2vw,16px)}
.btn-cta{background:var(--orange); color:#fff; border:none; padding:10px 16px; border-radius:999px; font-weight:700; text-decoration:none; display:inline-flex; align-items:center; justify-content:center}
.btn-cta:hover{background:var(--orange-hover)}
.ps-arrow{position:absolute; top:50%; transform:translateY(-50%); width:42px; height:42px; border-radius:50%; border:1px solid var(--outline); background:rgba(255,255,255,.08); color:#fff; display:flex; align-items:center; justify-content:center; font-size:28px; line-height:1; z-index:3; cursor:pointer; transition:background .16s ease}
.ps-prev{left:10px}
.ps-next{right:10px}
.ps-arrow:hover{background:rgba(255,255,255,.16)}
.ps-dots{position:absolute; left:50%; transform:translateX(-50%); bottom:10px; z-index:3; display:flex; gap:8px}
.ps-dots button{width:8px; height:13px; border-radius:50%; border:1px solid rgba(255,255,255,.6); background:rgba(255,255,255,.15); cursor:pointer}
.ps-dots button[aria-current="true"]{background:#fff; border-color:#fff}
@media (max-width:680px){
  .ps-arrow{width:36px; height:36px; font-size:24px}
}

.theme-content{
  --tc-head:#fff;
  --tc-text:var(--text,#e8f0ff);
  --tc-muted:var(--muted,#9bb5da);
  --tc-accent:var(--orange,#ff6a00);
  --tc-accent-2:#ffd400;
  --tc-line:var(--outline,rgba(255,255,255,.18));
  --tc-chip:rgba(255,255,255,.06);
  color:var(--tc-text);
  padding:28px 0 40px;
  font-size:16px;
  line-height:1.7;
  position:relative;
  isolation:isolate;
  background:transparent;
}
.theme-content *{box-sizing:border-box}
.theme-content :where(h1,h2,h3,h4,h5,h6){color:var(--tc-head); margin:0 0 .5em; line-height:1.22; font-weight:900; letter-spacing:.2px}
.theme-content h1{font-size:clamp(26px,4vw,38px)}
.theme-content h2{font-size:clamp(22px,3.2vw,30px); margin-top:1.2em}
.theme-content h3{font-size:clamp(18px,2.6vw,24px); margin-top:1.1em}
.theme-content h4{font-size:18px}
.theme-content h5{font-size:16px}
.theme-content h6{font-size:14px; color:var(--tc-muted); text-transform:uppercase; letter-spacing:.3px}
.theme-content p{margin:.8em 0}
.theme-content p:empty{display:none}
.theme-content a{color:var(--tc-accent); text-decoration:none; border-bottom:1px dashed currentColor}
.theme-content a:hover{color:var(--tc-accent-2); border-bottom-color:transparent}
.theme-content strong{font-weight:800}
.theme-content em{font-style:italic}
.theme-content small{font-size:.875em; color:var(--tc-muted)}
.theme-content mark{background:rgba(255,212,0,.25); padding:.05em .3em; border-radius:.3em}
.theme-content sup,.theme-content sub{font-size:.75em; line-height:0}
.theme-content ul,.theme-content ol{margin:.6em 0 .9em 1.25em; padding:0}
.theme-content li{margin:.35em 0}
.theme-content ul li::marker{color:var(--tc-accent-2)}
.theme-content ol li::marker{color:var(--tc-accent)}
.theme-content dl{margin:1em 0}
.theme-content dt{font-weight:800}
.theme-content dd{margin:0 0 .6em 1.25em; color:var(--tc-muted)}
.theme-content img,.theme-content video,.theme-content iframe{max-width:100%; height:auto; display:block; border-radius:12px; box-shadow:0 8px 24px rgba(0,0,0,.18)}
.theme-content figure{margin:1em 0}
.theme-content figcaption{color:var(--tc-muted); font-size:.9em; margin-top:.4em; text-align:center}
.theme-content blockquote{margin:1em 0; padding:14px 16px; border-left:4px solid var(--tc-accent); background:var(--tc-chip); border-radius:12px}
.theme-content code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; background:rgba(255,255,255,.08); padding:.15em .35em; border-radius:.35em}
.theme-content pre{background:rgba(0,0,0,.35); padding:14px 16px; border:1px solid var(--tc-line); border-radius:12px; overflow:auto}
.theme-content pre code{background:transparent; padding:0}
.theme-content table{width:100%; border-collapse:collapse; margin:1em 0; display:block; overflow-x:auto; border:1px solid var(--tc-line); border-radius:12px}
.theme-content thead{background:rgba(255,255,255,.06)}
.theme-content th,.theme-content td{padding:12px 14px; text-align:left; border-bottom:1px solid var(--tc-line); white-space:nowrap}
.theme-content tbody tr:last-child td{border-bottom:none}
.theme-content th{font-weight:800; color:#fff}
.theme-content caption{caption-side:bottom; padding:8px 0; color:var(--tc-muted); font-size:.9em}
.theme-content hr{border:none; height:1px; background:linear-gradient(90deg,transparent,var(--tc-line),transparent); margin:20px 0}
.theme-content kbd{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:.85em; padding:.15em .4em; border:1px solid var(--tc-line); border-bottom-width:2px; background:#0b2f64; border-radius:.35em}
.theme-content .chip{display:inline-block; padding:.35em .7em; border:1px solid var(--tc-line); background:var(--tc-chip); border-radius:999px; color:var(--tc-muted); font-weight:700}
@media (max-width:680px){.theme-content{font-size:15px}}

.theme-content::before,.theme-content::after{content:""; position:absolute; top:-40px; bottom:-40px; left:50%; width:100vw; transform:translateX(-50%); pointer-events:none; z-index:-1}
.theme-content::before{background:radial-gradient(40% 55% at 12% 20%,rgba(255,212,0,.25) 0%,rgba(255,212,0,0) 60%),radial-gradient(45% 50% at 85% 25%,rgba(255,106,0,.22) 0%,rgba(255,106,0,0) 62%),radial-gradient(55% 60% at 70% 85%,rgba(127,183,255,.20) 0%,rgba(127,183,255,0) 60%),linear-gradient(180deg,rgba(255,255,255,.03),rgba(0,0,0,0)); filter:blur(18px); animation:blob 22s ease-in-out infinite alternate}
.theme-content::after{background:radial-gradient(rgba(255,255,255,.07) 1px,transparent 1px) 0 0/22px 22px,radial-gradient(120% 120% at 50% 120%,rgba(0,0,0,.18),transparent 60%); opacity:.3}
@keyframes blob{0%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(0,-6px,0) scale(1.02)}100%{transform:translate3d(0,6px,0) scale(1.03)}}

.site-footer{margin-top:36px; background:linear-gradient(180deg,#0b2b5a,#0b3a73); color:#cfe1ff; border-top:1px solid var(--outline)}
.sf-top{padding:18px 0 8px}
.sf-links{display:flex; flex-wrap:wrap; justify-content:center; gap:18px 28px}
.sf-links a{color:#cfe1ff; text-decoration:none; font-weight:800; letter-spacing:.3px; opacity:.9; text-transform:uppercase; font-size:13px}
.sf-links a:hover{opacity:1; color:#fff}
.sf-payments-wrap{padding:14px 0 12px}
.sf-payments{display:flex; align-items:center; gap:16px; overflow:auto; padding:6px 2px; scroll-snap-type:x proximity}
.sf-payments::-webkit-scrollbar{height:6px}
.sf-payments::-webkit-scrollbar-thumb{background:rgba(255,255,255,.15); border-radius:999px}
.pill{display:flex; align-items:center; gap:14px; background:#0e3b78; border:1px solid var(--outline); border-radius:16px; padding:12px 16px; scroll-snap-align:center; white-space:nowrap}
.pill img{height:22px; width:auto; display:block; filter:drop-shadow(0 1px 0 rgba(0,0,0,.2))}
.pill .label{display:inline-flex; align-items:center; gap:10px; padding-right:8px; font-weight:800; color:#fff}
.pill-icon{padding:10px 12px}
.pill-icon img{height:22px}
.sf-brands{background:#0b2f64; border-top:1px solid var(--outline); border-bottom:1px solid var(--outline)}
.sf-brands-row{display:flex; align-items:center; justify-content:space-between; gap:26px; padding:16px 0; overflow:auto}
.sf-brands-row img{height:34px; width:auto; opacity:.5; filter:grayscale(1); transition:opacity .15s ease,filter .15s ease}
.sf-brands-row img:hover{opacity:.8; filter:grayscale(.1)}
.sf-copy{text-align:center; padding:14px 0 20px; color:#9bb5da; font-size:13px}
@media (max-width:860px){
  .sf-links{gap:12px 18px}
  .pill{padding:10px 12px}
  .pill img{height:20px}
  .sf-brands-row img{height:28px}
}
@media (max-width:560px){
  .sf-links a{font-size:12px}
  .sf-brands-row{justify-content:flex-start}
}
html, body { overflow-x: clip; }