
:root{
  --bg:#07111f;--bg2:#0a1627;--panel:#0f1c30;--panel2:#13243d;
  --text:#f7f9fc;--muted:#aab6c8;--line:#233956;--gold:#f6c94a;
  --gold2:#ffdf79;--blue:#67b7ff;--green:#41d6a1;--danger:#ff7d8a;
  --shadow:0 22px 60px rgba(0,0,0,.28);--max:1180px;--r:18px
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Arial,sans-serif;background:
radial-gradient(circle at 80% -10%,rgba(103,183,255,.09),transparent 32%),
var(--bg);color:var(--text);line-height:1.6}
img{max-width:100%;display:block}
a{color:var(--blue)}
button,input,select{font:inherit}
.wrap{width:min(var(--max),92%);margin:auto}
header{position:sticky;top:0;z-index:50;background:rgba(7,17,31,.94);backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.07)}
.nav{display:flex;justify-content:space-between;align-items:center;gap:22px;padding:13px 0}
.brand img{width:185px;height:auto}
.menu{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.menu a{color:#dce5f2;text-decoration:none;font-weight:650;font-size:.94rem}
.menu a:hover{color:white}
.nav-cta{padding:9px 13px;border-radius:10px;border:1px solid var(--line);background:#0f1d31}
.hero{padding:74px 0 58px;background:
radial-gradient(circle at 80% 0%,rgba(103,183,255,.16),transparent 30%),
radial-gradient(circle at 15% 0%,rgba(246,201,74,.13),transparent 28%),
linear-gradient(180deg,#10213b 0%,#081321 76%,#07111f 100%)}
.kicker{text-transform:uppercase;letter-spacing:.12em;color:var(--gold);font-weight:850;font-size:.78rem}
h1{font-size:clamp(2.7rem,5.6vw,5.4rem);line-height:1.02;letter-spacing:-2.8px;margin:12px 0 18px;max-width:980px}
h2{font-size:clamp(1.8rem,3vw,2.55rem);line-height:1.13;margin:0 0 12px}
h3{margin:0 0 8px;line-height:1.25}
p{margin:0 0 14px}
.lead{max-width:820px;font-size:1.12rem;color:var(--muted)}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:27px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 15px;border-radius:11px;text-decoration:none;font-weight:800;border:1px solid var(--line);cursor:pointer}
.btn-primary{background:linear-gradient(180deg,var(--gold2),var(--gold));color:#111827;border-color:var(--gold);box-shadow:0 9px 30px rgba(246,201,74,.15)}
.btn-secondary{background:#11213a;color:white}
.btn-soft{background:#0d1a2e;color:#e7edf6}
.btn-disabled{background:#17263e;color:#8390a5;cursor:not-allowed;pointer-events:none}
.trustbar{background:#0b1729;border-block:1px solid var(--line)}
.trustgrid{display:grid;grid-template-columns:repeat(4,1fr)}
.trustitem{padding:18px;text-align:center;border-right:1px solid var(--line);font-size:.91rem}
.trustitem:last-child{border-right:0}
.muted{color:var(--muted)}
section{padding:56px 0}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:22px;margin-bottom:22px}
.section-head p{max-width:650px;color:var(--muted);margin:0}
.feature-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:28px}
.feature-chip{background:rgba(255,255,255,.035);border:1px solid var(--line);border-radius:14px;padding:15px}
.feature-chip strong{display:block;margin-bottom:3px}
.filterbar{display:flex;gap:9px;flex-wrap:wrap;margin:18px 0 22px}
.filterbtn{padding:8px 12px;border-radius:999px;border:1px solid var(--line);background:#102039;color:#e8edf6;cursor:pointer}
.filterbtn.active{background:var(--gold);color:#111;border-color:var(--gold)}
.searchrow{display:grid;grid-template-columns:1fr 220px;gap:12px;margin:18px 0 22px}
.searchrow input,.searchrow select{width:100%;padding:11px 12px;border-radius:10px;border:1px solid var(--line);background:#0c192b;color:white;outline:none}
.rank-list{display:grid;gap:14px}
.rank-card{display:grid;grid-template-columns:62px 1.25fr .75fr 1fr auto;gap:18px;align-items:center;background:linear-gradient(180deg,#0f1b30,#0b1728);border:1px solid var(--line);border-radius:var(--r);padding:18px;box-shadow:0 10px 28px rgba(0,0,0,.12)}
.rank-card:hover{border-color:#335077;transform:translateY(-1px)}
.rank-no{width:48px;height:48px;border-radius:13px;background:#172a47;color:var(--gold);display:flex;align-items:center;justify-content:center;font-weight:900;font-size:1.15rem}
.op-name{font-weight:900;font-size:1.08rem}
.badges{display:flex;gap:6px;flex-wrap:wrap;margin-top:7px}
.badge{display:inline-block;padding:4px 8px;border:1px solid var(--line);border-radius:999px;font-size:.75rem;color:#dfe7f2;background:#132039}
.badge.good{border-color:#245b4b;color:#bdf4df;background:#102820}
.rating{font-weight:900;color:var(--gold);font-size:1.02rem}
.mini{font-size:.83rem;color:var(--muted)}
.offer strong{display:block}
.offer span{display:block;font-size:.83rem;color:var(--muted)}
.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.card{background:linear-gradient(180deg,var(--panel),#0b1728);border:1px solid var(--line);border-radius:var(--r);padding:22px}
.card p{color:var(--muted)}
.iconbox{width:42px;height:42px;border-radius:12px;background:#172a47;display:flex;align-items:center;justify-content:center;font-size:1.2rem;margin-bottom:13px}
.guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.guide{background:#0d1a2d;border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.cover{height:138px;background:linear-gradient(135deg,#1a3a65,#10203a);display:flex;align-items:center;justify-content:center;font-size:2.2rem}
.guide-body{padding:18px}.guide-body p{color:var(--muted)}
.notice{padding:20px;border:1px solid #66551f;background:#211d10;border-radius:14px;color:#e0d7b2}
.tablewrap{overflow:auto;border:1px solid var(--line);border-radius:14px}
table{width:100%;min-width:820px;border-collapse:collapse;background:#0c1829}
th,td{text-align:left;padding:14px;border-bottom:1px solid var(--line)}
th{color:var(--gold);font-size:.9rem}
.status{display:inline-block;padding:5px 9px;border:1px solid var(--line);border-radius:999px;font-size:.78rem}
.compare-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.scorebox{background:#0f1d31;border:1px solid var(--line);border-radius:14px;padding:22px}
.score{font-size:3.1rem;color:var(--gold);font-weight:900}
.ratingbars{display:grid;gap:12px;margin-top:14px}
.barline{display:grid;grid-template-columns:150px 1fr 45px;gap:10px;align-items:center;font-size:.9rem}
.bar{height:8px;border-radius:999px;background:#17243a;overflow:hidden}
.bar>span{display:block;height:100%;background:linear-gradient(90deg,var(--gold),#ffe99c);border-radius:999px}
.callout{padding:18px;border-radius:14px;border:1px solid #264c64;background:#0d2230}
.legal{max-width:860px}
.legal h1{font-size:clamp(2.2rem,4vw,3.6rem);letter-spacing:-1.2px}
.legal h2{margin-top:34px}
.legal p,.legal li{color:#c6cfdd}
footer{background:#050b14;border-top:1px solid var(--line);padding:38px 0;color:var(--muted);font-size:.92rem}
.footergrid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:30px}
.footer-logo{width:175px;margin-bottom:12px}
.footerlinks a{display:block;margin:7px 0;text-decoration:none}
.agegate{position:fixed;inset:0;background:rgba(2,8,18,.97);display:flex;align-items:center;justify-content:center;z-index:100;padding:20px}
.agebox{width:min(520px,96%);background:#0f1a2e;border:1px solid var(--line);border-radius:18px;padding:30px;text-align:center;box-shadow:var(--shadow)}
.agebox button{padding:11px 17px;border:0;border-radius:9px;margin:6px;font-weight:800;cursor:pointer}
.yes{background:var(--gold)}.no{background:#273650;color:white}
.cookie{position:fixed;left:50%;transform:translateX(-50%);bottom:16px;width:min(800px,92%);background:#0f1b2f;border:1px solid var(--line);border-radius:12px;padding:13px 15px;display:none;z-index:80;box-shadow:var(--shadow)}
.cookie-row{display:flex;justify-content:space-between;align-items:center;gap:12px}
.cookie p{margin:0;color:var(--muted);font-size:.88rem}
.cookie button{padding:8px 10px;border-radius:8px;border:1px solid var(--line);font-weight:700}
.mobile-note{display:none}
@media(max-width:980px){
  .rank-card{grid-template-columns:52px 1fr;align-items:start}
  .rank-card>*:nth-child(n+3){grid-column:2}
  .card-grid,.guide-grid,.trustgrid,.footergrid,.compare-grid,.feature-strip{grid-template-columns:1fr}
  .trustitem{border-right:0;border-bottom:1px solid var(--line)}
  .searchrow{grid-template-columns:1fr}
  .menu{gap:11px}
  h1{letter-spacing:-1.5px}
}
@media(max-width:700px){
  .nav{align-items:flex-start}
  .brand img{width:160px}
  .menu{display:none}
  .mobile-note{display:block;color:#9fb0c4;font-size:.82rem}
  section{padding:44px 0}
  .cookie-row{flex-direction:column;align-items:flex-start}
  h1{font-size:2.55rem}
}

.operator-brand{display:flex;align-items:center;gap:14px;min-width:0}
.operator-logo-box{width:108px;height:58px;border-radius:12px;background:#fff;display:flex;align-items:center;justify-content:center;padding:7px;border:1px solid var(--line);overflow:hidden;flex:0 0 auto}
.operator-logo{width:100%;height:100%;object-fit:contain}
.review-brand{display:flex;align-items:center;gap:18px;margin:16px 0 10px}
.review-brand-logo{width:150px;height:80px;object-fit:contain;background:#fff;border-radius:14px;padding:10px;border:1px solid var(--line)}
@media(max-width:700px){
  .operator-brand{align-items:flex-start;flex-direction:column}
  .operator-logo-box{width:96px;height:52px}
}

.operator-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
@media(max-width:980px){.operator-actions{justify-content:flex-start}}
