:root{
    --bg:#050B18; --panel:rgba(13,23,44,.72); --panel-2:rgba(17,29,54,.78); --ink:#EAF1FB; --muted:#8DA0BF; --dim:#5E6E8C;
    --line:rgba(110,160,255,.14); --line-2:rgba(110,160,255,.08);
    --gold:#3B82F6; --gold-2:#4DA3FF; --sky:#38BDF8; --green:#2ECC8F; --red:#E5544B; --violet:#8B5CF6;
    --accent-deep:#2563EB; --ink-max:#F4F8FF; --crest:#C8A95E;
    /* solid "one screen" surfaces (redesign — app-feel, replaces transparency) */
    --surface:#0A1224; --surface-2:#0C1326; --hair:#1F2A44;
    --grad-brand:linear-gradient(135deg,#38BDF8 0%,#4DA3FF 38%,#7C6AFB 100%);
    --cat:#3B82F6; --s1:8px; --s2:14px; --s3:22px; --s4:34px;
    --sans:'Plus Jakarta Sans', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
    --serif:'Cormorant Garamond', Georgia, serif;
  }
  *{box-sizing:border-box; margin:0; padding:0}
  html{scroll-behavior:smooth}
  body{background:var(--bg); color:var(--ink); font-family:var(--sans); -webkit-font-smoothing:antialiased; line-height:1.5}
  img{display:block; max-width:100%}
  a{color:inherit; text-decoration:none}
  ::selection{background:rgba(77,163,255,.3)}
  button{font-family:inherit; cursor:pointer}

  /* ========== ELECTRIC PULSE — ambient layers (lowest: ComfyUI image, then veil, then content) ========== */
  .bgimg{position:fixed; inset:0; z-index:0; background:url('assets/bg_poly.png') center/cover no-repeat; opacity:.5; pointer-events:none}
  .bgveil{position:fixed; inset:0; z-index:1; pointer-events:none; background:
    radial-gradient(620px 420px at 18% -6%, rgba(59,130,246,.26), transparent 62%),
    radial-gradient(540px 460px at 108% 36%, rgba(46,204,143,.12), transparent 60%),
    radial-gradient(480px 380px at -10% 78%, rgba(37,99,235,.14), transparent 60%),
    linear-gradient(180deg, rgba(5,11,24,.66) 0%, rgba(5,11,24,.84) 34%, rgba(5,11,24,.96) 72%, #050B18 100%)}

  /* ========== ELECTRIC PULSE — game hero (svajp-karusel) ========== */
  .gh-wrap{margin-bottom:14px}
  .gh-rail{display:flex; gap:12px; overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; scrollbar-width:none; padding-bottom:2px}
  .gh-rail::-webkit-scrollbar{display:none}
  .gh-rail .gh{flex:0 0 calc(100% - 32px); scroll-snap-align:start; margin-bottom:0}
  .gh-rail .gh:only-child{flex-basis:100%}
  .gh-dots{display:flex; justify-content:center; gap:8px; margin-top:12px}
  .gh-dots i{width:7px; height:7px; border-radius:99px; background:rgba(141,160,191,.3); cursor:pointer; transition:all .25s ease; padding:0; border:none}
  .gh-dots i.on{width:18px; background:var(--gold-2); box-shadow:0 0 8px rgba(77,163,255,.5)}
  .gh{position:relative; overflow:hidden; background:linear-gradient(180deg,rgba(13,23,44,.62),rgba(10,18,36,.8)), url('assets/bg_poly_inner.png') center/cover no-repeat; border:1px solid var(--line); border-radius:16px; box-shadow:0 18px 44px rgba(2,6,18,.5); padding:24px 18px 20px; text-align:center; margin-bottom:14px}
  .gh::before{content:""; position:absolute; inset:-40% -20% auto; height:300px; background:radial-gradient(closest-side, rgba(59,130,246,.22), transparent 70%); pointer-events:none}
  .gh>*{position:relative}
  .gh-kick{font-size:11px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--gold-2); margin-bottom:12px}
  .gh-q{font-size:21px; line-height:1.3; font-weight:800; margin:0 auto 18px; max-width:34ch; color:#E2EBF8}
  .gh-ringwrap{position:relative; width:190px; height:190px; margin:0 auto 6px}
  .gh-ringglow{position:absolute; inset:-22px; border-radius:50%; background:radial-gradient(circle, rgba(77,163,255,.34), transparent 68%); filter:blur(18px); animation:ghGlow 3.2s ease-in-out infinite; pointer-events:none}
  @keyframes ghGlow{0%,100%{opacity:.55; transform:scale(1)}50%{opacity:.9; transform:scale(1.04)}}
  .gh-ring{position:absolute; inset:0; border-radius:50%; -webkit-mask:radial-gradient(farthest-side, transparent calc(100% - 11px), #000 calc(100% - 10px)); mask:radial-gradient(farthest-side, transparent calc(100% - 11px), #000 calc(100% - 10px))}
  .gh-ringin{position:absolute; inset:14px; border-radius:50%; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; background:radial-gradient(circle at 50% 38%, rgba(20,34,62,.55), rgba(8,15,30,.35))}
  .gh-num{font-size:clamp(44px,12vw,52px); font-weight:800; color:var(--ink-max); font-variant-numeric:tabular-nums; letter-spacing:-.02em; line-height:1; text-shadow:0 0 28px rgba(77,163,255,.45)}
  .gh-num small{font-size:.48em; font-weight:700; color:var(--gold-2); margin-left:2px}
  .gh-rsub{font-size:11px; font-weight:600; letter-spacing:.06em; color:var(--muted); text-transform:uppercase}
  .gh-stamp{font-size:11px; color:var(--muted); margin-bottom:16px}
  .gh-vq{font-size:13px; font-weight:600; color:var(--ink); margin-bottom:12px}
  .gh-votes{display:flex; gap:26px; justify-content:center; margin:0 auto 8px}
  .gh-btn{flex:none; width:78px; height:78px; border-radius:50%; display:flex; align-items:center; justify-content:center; border:none; cursor:pointer; font-size:15px; font-weight:800; letter-spacing:.08em; color:#fff; background:var(--grad-brand); box-shadow:0 1px 0 rgba(255,255,255,.28) inset, 0 -2px 0 rgba(8,20,52,.42) inset, 0 8px 22px rgba(37,99,235,.38); transition:transform .12s ease, box-shadow .12s ease, opacity .25s ease}
  .gh-btn.yes{background:rgba(46,204,143,.13); border:1px solid rgba(46,204,143,.4); color:#5FE3B3; box-shadow:none}
  .gh-btn.no{background:rgba(229,84,75,.12); border:1px solid rgba(229,84,75,.38); color:#F0867F; box-shadow:none}
  .gh-btn.yes:hover{background:rgba(46,204,143,.2)} .gh-btn.no:hover{background:rgba(229,84,75,.19)}
  .gh-btn:active{transform:translateY(2px) scale(.985)}
  .gh-btn.picked{outline:2px solid rgba(77,163,255,.85); outline-offset:2px}
  .gh-btn.dimmed{opacity:.38; filter:saturate(.5)}
  .gh-btn:disabled{cursor:default}
  .gh-note{font-size:11px; color:var(--muted)}
  .gh-fb{font-size:12px; font-weight:600; color:var(--green); margin-top:8px}
  .gh-chip{display:inline-flex; align-items:center; gap:6px; margin-top:12px; padding:6px 12px; border-radius:999px; border:1px solid var(--line-2); background:rgba(10,18,36,.5); font-size:11px; font-weight:600; color:var(--muted); font-variant-numeric:tabular-nums}
  .gh-chip .ok{color:var(--green); font-weight:700}
  .gh-cap{font-size:11px; color:var(--muted); margin-top:12px; line-height:1.5}
  .sig{font-weight:700; font-size:12px; white-space:nowrap}
  .sig.up{color:var(--green)} .sig.down{color:var(--red)} .sig.flat{color:var(--muted)}
  .edu-row{display:flex; justify-content:center; margin:4px 0 8px}
  .edu-chip{display:inline-flex; align-items:center; gap:8px; padding:8px 16px; border-radius:999px; border:1px solid var(--line); background:var(--panel); font-size:12px; font-weight:600; color:var(--ink)}
  .edu-chip i{width:6px; height:6px; border-radius:50%; background:var(--gold-2); box-shadow:0 0 8px var(--gold-2)}
  .educ-intro{background:linear-gradient(135deg,rgba(59,130,246,.12),rgba(124,106,251,.06)); border:1px solid rgba(77,163,255,.25); border-radius:16px; padding:16px 18px; margin-bottom:14px}
  .educ-intro b{font-size:15px; color:var(--ink-max)}
  .educ-intro p{font-size:13px; color:var(--muted); margin-top:6px; line-height:1.55}
  .educ{background:linear-gradient(180deg,var(--panel-2),var(--panel)); border:1px solid var(--line-2); border-radius:16px; padding:16px 16px 14px; margin-bottom:12px}
  .educ-h{display:flex; align-items:center; gap:10px; margin-bottom:8px}
  .educ-n{flex:none; font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:#fff; background:var(--grad-brand); padding:4px 10px; border-radius:99px}
  .educ-h b{font-size:15px; color:var(--ink-max); line-height:1.3}
  .educ p{font-size:13px; color:var(--body, #B9C5DC); line-height:1.6}
  .educ p b{color:var(--ink)}
  .educ-ex{margin-top:12px; background:rgba(8,15,30,.55); border:1px solid var(--line-2); border-radius:12px; padding:12px 14px}
  .educ-exl{font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--gold-2); margin-bottom:5px}
  .educ-big{font-size:30px; font-weight:800; color:var(--ink-max); font-variant-numeric:tabular-nums; line-height:1.1}
  .educ-ext{font-size:12px; color:var(--muted); margin-top:4px; line-height:1.5}
  .educ-src{font-size:10px; color:var(--dim); margin-top:8px}

  /* ========== KABINET (profil) + APP window — ecosystem style ========== */
  .pf-head{position:relative; overflow:hidden; text-align:center; padding:26px 18px 20px; border-radius:20px; border:1px solid var(--line); background:linear-gradient(180deg,rgba(13,23,44,.66),rgba(10,18,36,.85)), url('assets/bg_poly_inner.png') center/cover no-repeat; margin-bottom:12px}
  .pf-ava{width:74px; height:74px; border-radius:22px; margin:0 auto 10px; display:flex; align-items:center; justify-content:center; font-size:28px; font-weight:800; color:#fff; background:var(--grad-brand); box-shadow:0 10px 30px rgba(37,99,235,.4)}
  .pf-head b{display:block; font-size:16px; color:var(--ink-max)}
  .pf-head small{display:block; font-size:11px; color:var(--muted); margin-top:4px; line-height:1.5; max-width:40ch; margin-left:auto; margin-right:auto}
  .pf-kyc{display:inline-flex; align-items:center; gap:5px; margin-top:10px; padding:5px 12px; border-radius:99px; border:1px solid var(--line); background:rgba(10,18,36,.55); font-size:11px; font-weight:600; color:var(--muted)}
  .pf-card{border:1px solid var(--line); border-radius:16px; background:linear-gradient(180deg,rgba(17,29,54,.7),rgba(13,23,44,.85)), url('assets/bg_poly_inner.png') center/cover no-repeat; padding:14px 16px; margin-bottom:12px}
  .pf-card-h{display:flex; align-items:center; justify-content:space-between}
  .pf-card-h b{font-size:14px; color:var(--ink)}
  .pf-plus{width:32px; height:32px; border-radius:10px; display:flex; align-items:center; justify-content:center; border:1px solid rgba(77,163,255,.4); color:var(--gold-2); font-size:18px; font-weight:700; cursor:pointer; transition:.15s}
  .pf-plus:hover{background:rgba(59,130,246,.14)}
  .pf-empty{text-align:center; font-size:12px; color:var(--dim); padding:14px 0 6px}
  .pf-list{display:flex; flex-direction:column; gap:8px}
  .pf-row{display:flex; align-items:center; gap:12px; padding:12px 14px; border-radius:14px; border:1px solid var(--line-2); background:var(--panel); cursor:pointer; transition:.15s}
  .pf-row:hover{border-color:rgba(77,163,255,.35); background:var(--panel-2)}
  .pf-ic{flex:none; width:36px; height:36px; border-radius:10px; display:flex; align-items:center; justify-content:center; font-size:16px; background:rgba(59,130,246,.12); border:1px solid var(--line-2)}
  .pf-tx{min-width:0; flex:1}
  .pf-tx b{display:block; font-size:14px; color:var(--ink)}
  .pf-tx small{display:block; font-size:11px; color:var(--muted); margin-top:1px}
  .pf-ar{flex:none; color:var(--dim); font-size:15px}

  /* ========== BOOKMAKER-STYLE MATCH LIST (šport) ========== */
  .bk-lg{font-size:11px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--green); padding:14px 2px 6px}
  .bk-m{background:linear-gradient(180deg,var(--panel-2),var(--panel)); border:1px solid var(--line-2); border-radius:14px; padding:12px 12px 12px; margin-bottom:8px}
  .bk-mh{display:flex; justify-content:space-between; gap:10px; font-size:11px; color:var(--dim); margin-bottom:3px; font-variant-numeric:tabular-nums}
  .bk-teams{font-size:14px; font-weight:700; color:var(--ink); margin-bottom:8px; line-height:1.35}
  .bk-odds{display:flex; gap:8px}
  .bk-o{flex:1; min-width:0; border:1px solid var(--line); background:rgba(10,18,36,.55); border-radius:10px; padding:8px 4px 8px; text-align:center; transition:.15s; color:var(--ink)}
  .bk-o small{display:block; font-size:10px; font-weight:700; letter-spacing:.04em; color:var(--muted); text-transform:uppercase; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; padding:0 2px}
  .bk-o b{display:block; font-size:16px; font-weight:800; font-variant-numeric:tabular-nums; margin-top:2px}
  .bk-o i{display:block; font-style:normal; font-size:10px; color:var(--dim); font-variant-numeric:tabular-nums; margin-top:1px}
  .bk-o.fav{border-color:rgba(46,204,143,.45); background:rgba(46,204,143,.10)}
  .bk-o.fav b{color:var(--green)}
  .bk-o.picked{border-color:var(--gold-2); background:rgba(59,130,246,.16); box-shadow:0 0 0 1px var(--gold-2) inset}
  .bk-o.picked b{color:var(--gold-2)}
  .bk-o:active{transform:scale(.97)}
  .bk-ou{display:flex; align-items:center; gap:8px; margin-top:8px; font-size:11px; color:var(--muted)}
  .bk-ou .lbl{flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
  .bk-ob{border:1px solid var(--line); background:rgba(10,18,36,.55); color:var(--ink); border-radius:8px; padding:6px 10px; font-size:12px; font-weight:700; font-variant-numeric:tabular-nums; transition:.15s}
  .bk-ob.picked{border-color:var(--gold-2); background:rgba(59,130,246,.16); color:var(--gold-2)}
  .bk-ob:active{transform:scale(.97)}
  .bk-ticket{display:flex; align-items:center; gap:8px; margin:2px 0 10px; padding:8px 12px; border-radius:12px; border:1px solid rgba(77,163,255,.3); background:rgba(59,130,246,.10); font-size:12px; color:var(--ink)}
  .bk-ticket b{color:var(--gold-2)}
  .bk-ticket .clr{margin-left:auto; font-size:11px; color:var(--muted); cursor:pointer; padding:4px 6px}
  .bk-ticket .clr:hover{color:var(--red)}

  /* ========== POLYMARKET-STYLE event board (prognózy) ========== */
  .mk-ev{background:linear-gradient(180deg,rgba(17,29,54,.7),rgba(13,23,44,.85)), url('assets/bg_poly_inner.png') center/cover no-repeat; border:1px solid var(--line-2); border-radius:14px; padding:12px 14px 12px; margin-bottom:8px}
  .mk-q{font-size:14px; font-weight:700; color:var(--ink); line-height:1.4; margin-bottom:10px}
  .mk-row{display:flex; align-items:center; gap:12px}
  .mk-pct{display:flex; align-items:baseline; gap:3px; min-width:86px}
  .mk-pct b{font-size:26px; font-weight:800; color:var(--ink-max); font-variant-numeric:tabular-nums; letter-spacing:-.01em}
  .mk-pct small{font-size:13px; font-weight:700; color:var(--green)}
  .mk-pct span{display:block; font-size:9px; letter-spacing:.06em; text-transform:uppercase; color:var(--dim); margin-left:4px}
  .mk-btns{display:flex; gap:8px; margin-left:auto}
  .mk-b{border-radius:10px; padding:8px 12px; font-size:12px; font-weight:800; font-variant-numeric:tabular-nums; transition:.15s; border:1px solid}
  .mk-b.yes{color:var(--green); border-color:rgba(46,204,143,.4); background:rgba(46,204,143,.10)}
  .mk-b.no{color:var(--red); border-color:rgba(229,84,75,.4); background:rgba(229,84,75,.10)}
  .mk-b.picked{outline:2px solid var(--gold-2); outline-offset:1px}
  .mk-b:active{transform:scale(.96)}
  .mk-track{height:4px; border-radius:2px; background:rgba(110,160,255,.12); margin-top:12px; overflow:hidden}
  .mk-track i{display:block; height:100%; border-radius:2px; background:linear-gradient(90deg,#1F9D6E,var(--green))}
  .mk-foot{display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:8px}
  .mk-conv{font-size:10px}
  .mk-out{font-size:11px; color:var(--dim)}
  .mk-out a{color:var(--gold-2); font-weight:600}

  /* ========== X-STYLE trending list ========== */
  .trx{background:linear-gradient(180deg,var(--panel-2),var(--panel)); border:1px solid var(--line-2); border-radius:14px; padding:4px 0; overflow:hidden}
  .trx-row{display:flex; align-items:center; gap:12px; padding:12px 16px; border-bottom:1px solid var(--line-2); transition:background .15s}
  .trx-row:last-child{border-bottom:none}
  .trx-row:hover{background:rgba(110,123,242,.06)}
  .trx-rk{font-size:17px; font-weight:800; color:#6E7BF2; font-variant-numeric:tabular-nums; width:24px; text-align:center; flex:none}
  .trx-tx{min-width:0}
  .trx-k{display:block; font-size:10px; letter-spacing:.07em; text-transform:uppercase; color:var(--dim); margin-bottom:1px}
  .trx-tx b{display:block; font-size:14px; font-weight:700; color:var(--ink); line-height:1.3}
  .trx-tx span{display:block; font-size:12px; color:var(--muted); margin-top:2px; line-height:1.45}
  .trx-up{margin-left:auto; flex:none; color:#6E7BF2; font-size:13px; opacity:.8}

  /* ========== DENSE token-screener mode (krypto mobile) ========== */
  @media (max-width:720px){
    .nmb-wrap.dense tbody tr{display:grid; grid-template-columns:minmax(56px,1.1fr) 74px 46px 62px 58px 8px; align-items:center; gap:6px; padding:12px 8px; border-bottom:1px solid var(--line-2)}
    .nmb-wrap.dense td{display:block; width:auto; padding:0; border:none; text-align:right}
    .nmb-wrap.dense td::before{content:none}
    .nmb-wrap.dense td:first-child{text-align:left}
    .nmb-wrap.dense td:nth-child(4){display:none}
    .nmb-wrap.dense tr.nmb-xrow{display:block; padding:0}
    .nmb-wrap.dense td.nmb-x{display:block; width:100%; padding:0 4px 10px}
    .nmb-wrap.dense .nm-match b{font-size:13px}
    .nmb-wrap.dense .nm-match span{font-size:10px}
    .nmb-wrap.dense td b{font-size:13px}
    .nmb-wrap.dense td small{font-size:11px}
    .nmb-wrap.dense .sig{font-size:11px}
    .nmb-wrap.dense4 tbody tr{display:grid; grid-template-columns:minmax(64px,1.2fr) 90px 76px 44px; align-items:center; gap:6px; padding:12px 8px; border-bottom:1px solid var(--line-2)}
    .nmb-wrap.dense4 td{display:block; width:auto; padding:0; border:none; text-align:right}
    .nmb-wrap.dense4 td::before{content:none}
    .nmb-wrap.dense4 td:first-child{text-align:left}
    .nmb-wrap.dense4 .nm-match b{font-size:13px}
    .nmb-wrap.dense4 .nm-match span{font-size:10px}
    .nmb-wrap.dense4 td b{font-size:13px}
  }

  /* ========== GATE ========== */
  .gate{position:fixed; inset:0; z-index:200; display:flex; align-items:center; justify-content:center; padding:22px; background:#04060A; overflow:hidden}
  .gate.hidden{display:none}
  .gate .bgph{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.28; transform:scale(1.1); animation:gz 24s ease-in-out infinite alternate}
  @keyframes gz{from{transform:scale(1.06)}to{transform:scale(1.16)}}
  .gate .gov{position:absolute; inset:0; background:radial-gradient(120% 90% at 50% 30%, rgba(6,8,12,.6), rgba(4,6,10,.92))}
  .gcard{position:relative; z-index:2; width:100%; max-width:400px; background:rgba(11,15,22,.82); backdrop-filter:blur(16px); border:1px solid var(--line); border-radius:24px; padding:34px 30px 30px; box-shadow:0 50px 100px rgba(0,0,0,.6)}
  .gcard .logo{display:flex; align-items:center; gap:8px; justify-content:center; margin-bottom:6px}
  .gcard .logo img{height:26px; filter:brightness(0) invert(1)}
  .gcard .logo b{font-weight:700; font-size:19px}
  .gcard .logo span{font-family:var(--serif); font-style:normal; color:var(--crest); font-size:18px}
  .gcard .lead{text-align:center; color:var(--muted); font-size:14px; margin-bottom:22px}
  .gcard .lead b{color:var(--gold-2); font-weight:600}
  .gtabs{display:flex; background:var(--panel-2); border:1px solid var(--line); border-radius:99px; padding:4px; margin-bottom:18px}
  .gtabs button{flex:1; border:none; background:transparent; color:var(--muted); font-size:14px; font-weight:600; padding:8px; border-radius:99px; transition:.2s}
  .gtabs button.on{background:var(--grad-brand); color:#fff}
  .gfield{margin-bottom:12px}
  .gfield label{display:block; font-size:12px; color:var(--dim); letter-spacing:.06em; text-transform:uppercase; margin-bottom:8px}
  .gfield input{width:100%; background:var(--panel-2); border:1px solid var(--line); border-radius:12px; padding:12px 14px; color:var(--ink); font-size:14px; outline:none; transition:.2s}
  .gfield input:focus{border-color:rgba(77,163,255,.5)}
  .gname{display:none}
  .gate.reg .gname{display:block}
  .gbtn{width:100%; margin-top:8px; border:none; border-radius:12px; padding:14px; font-size:15px; font-weight:700; color:#fff; background:var(--grad-brand); transition:.2s}
  .gbtn:hover{filter:brightness(1.06)}
  .gnote{margin-top:16px; text-align:center; font-size:12px; color:var(--dim); line-height:1.6}
  .gnote .soon{color:var(--sky)}
  .gskip{display:block; width:100%; margin-top:12px; background:rgba(59,130,246,.08); border:1px solid rgba(77,163,255,.35); color:var(--gold-2); border-radius:12px; padding:12px; font-size:13px; font-weight:700; transition:.2s}
  .gskip:hover{color:#fff; border-color:rgba(77,163,255,.6); background:rgba(59,130,246,.16)}
  .gben{display:flex; flex-direction:column; gap:8px; margin-bottom:18px}
  .gben > div{display:flex; align-items:center; gap:10px; font-size:12px; color:var(--body, #B9C5DC); line-height:1.4}
  .gben i{flex:none; width:28px; height:28px; border-radius:8px; display:flex; align-items:center; justify-content:center; font-style:normal; font-size:13px}
  .gben b{color:var(--ink); font-weight:700}
  .gben #gateTrk b{color:var(--green)}

  /* ========== PREDPLATNÉ (subscription v1 — koncept, nič sa neúčtuje) ========== */
  .sub-pill{display:inline-flex; align-items:center; gap:5px; padding:12px 8px; min-height:44px; border:none; background:transparent; color:#E0B358; font-size:13px; font-weight:700; font-variant-numeric:tabular-nums; cursor:pointer; white-space:nowrap; transition:.2s; opacity:.92}
  .sub-pill:hover{opacity:1; text-shadow:0 0 10px rgba(224,179,88,.5)}
  .core-btn{width:46px; height:46px; border-radius:50%; overflow:visible; cursor:pointer; flex:none; border:none; transition:transform .2s; padding:0; background:transparent; animation:corePulse 3.8s ease-out infinite}
  .core-btn img{width:100%; height:100%; object-fit:cover; transform:scale(1.12); border-radius:50%}
  .core-btn:hover{transform:scale(1.06)}
  @keyframes corePulse{0%{box-shadow:0 0 0 0 rgba(247,147,26,.16)}70%{box-shadow:0 0 0 5px rgba(247,147,26,0)}100%{box-shadow:0 0 0 0 rgba(247,147,26,0)}}
  .sub-dot{width:7px; height:7px; border-radius:50%; flex:none; animation:subPulse 1.8s ease-out infinite}
  @keyframes subPulse{0%{box-shadow:0 0 0 0 currentColor; opacity:1}70%{box-shadow:0 0 0 7px transparent; opacity:.85}100%{box-shadow:0 0 0 0 transparent; opacity:1}}
  .catdots{display:flex; justify-content:center; gap:6px; padding:8px 0 3px}
  .catdots i{width:6px; height:6px; border-radius:99px; background:rgba(141,160,191,.3); cursor:pointer; transition:all .25s ease}
  .catdots i.on{width:16px; background:var(--gold-2)}
  .lockwrap{position:relative}
  .lockwrap .lockcont{filter:blur(7px); pointer-events:none; user-select:none}
  .lockov{position:absolute; inset:0; z-index:3; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; text-align:center; padding:20px}
  .lockov b{font-size:14px; color:var(--ink-max)}
  .lockov small{font-size:12px; color:var(--muted); max-width:34ch; line-height:1.5}
  .lockbtn{border:none; border-radius:12px; padding:12px 20px; font-size:13px; font-weight:800; color:#fff; background:var(--grad-brand); cursor:pointer}
  .submodal{position:fixed; inset:0; z-index:220; display:none; justify-content:center; background:rgba(3,7,16,.88); padding:14px; overflow-y:auto; -webkit-overflow-scrolling:touch}
  .submodal.on{display:flex}
  /* margin-auto pattern: bottom-sheet na mobile, centrované ≥600px; karta vyššia než okno → scroll, vrch dosiahnuteľný */
  .sub-card{position:relative; width:100%; max-width:420px; margin:auto 0 0; border-radius:22px; border:1px solid var(--line); background:linear-gradient(180deg,rgba(13,23,44,.94),rgba(8,15,30,.97)), url('assets/bg_poly_inner.png') center/cover no-repeat; padding:24px 20px 16px; box-shadow:0 40px 90px rgba(0,0,0,.6)}
  @media (min-width:600px){ .sub-card{margin:auto 0} }
  .sub-x{position:absolute; top:10px; right:10px; width:34px; height:34px; border-radius:50%; border:1px solid var(--line); background:rgba(10,18,36,.6); color:var(--muted); font-size:15px; cursor:pointer}
  .sub-x:hover{color:var(--ink)}
  .sub-kick{font-size:10px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; color:var(--gold-2); text-align:center; margin-bottom:8px}
  .sub-h{font-size:20px; font-weight:800; color:var(--ink-max); text-align:center; line-height:1.3; margin-bottom:6px}
  .sub-sub{font-size:12px; color:var(--muted); text-align:center; margin-bottom:14px; line-height:1.5}
  .sub-free{border:1px solid rgba(46,204,143,.35); background:rgba(46,204,143,.1); color:var(--ink); border-radius:12px; padding:10px 12px; font-size:12px; text-align:center; margin-bottom:14px; line-height:1.5}
  .sub-free b{color:var(--green)}
  .sub-plans{display:flex; gap:10px}
  .sub-plan{flex:1; position:relative; border:1px solid var(--line); border-radius:14px; padding:16px 10px 12px; text-align:center; cursor:pointer; background:rgba(10,18,36,.55); transition:.15s}
  .sub-plan:hover{border-color:rgba(77,163,255,.4)}
  .sub-plan.picked{border-color:var(--gold-2)}
  .sub-badge{position:absolute; top:-9px; left:50%; transform:translateX(-50%); background:var(--grad-brand); color:#fff; font-size:9px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; padding:3px 8px; border-radius:99px; white-space:nowrap}
  .sub-plan .pn{font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); margin-bottom:5px}
  .sub-plan .pp{font-size:22px; font-weight:800; color:var(--green); font-variant-numeric:tabular-nums}
  .sub-plan .pp small{font-size:11px; color:var(--muted); font-weight:600}
  .sub-plan .pm{font-size:11px; color:var(--dim); margin-top:4px; line-height:1.4}
  .sub-plan .pm b{color:var(--green)}
  .sub-cta{width:100%; margin-top:14px; border:none; border-radius:13px; padding:14px; font-size:14px; font-weight:800; color:#fff; background:var(--grad-brand); cursor:pointer}
  .sub-later{display:block; width:100%; margin-top:6px; background:transparent; border:none; color:var(--muted); font-size:12px; font-weight:600; padding:8px; cursor:pointer}
  .sub-later:hover{color:var(--ink)}
  .sub-note{margin-top:10px; text-align:center; font-size:11px; color:var(--dim); line-height:1.55}

  /* ========== TOP BAR ========== */
  .topbar{position:sticky; top:0; z-index:50; background:rgba(5,11,24,.85); backdrop-filter:blur(14px); border-bottom:1px solid var(--line)}
  .topbar .inner{max-width:1000px; margin:0 auto; padding:0 20px; height:60px; display:flex; align-items:center; gap:18px; justify-content:space-between}
  .logo{display:flex; align-items:center; gap:8px}
  .logo img{height:40px}
  .logo b{font-weight:800; font-size:19px; letter-spacing:.4px; color:#F4F8FF}
  .logo .cl{font-family:var(--serif); font-style:normal; color:var(--crest); font-size:17px; margin-left:2px}
  .tnav{display:flex; align-items:center; gap:12px}
  .tnav .ic{width:44px; height:44px; border-radius:50%; display:flex; align-items:center; justify-content:center; color:var(--muted); transition:.2s; cursor:pointer}
  .tnav .ic:hover{background:var(--panel-2); color:var(--ink)}
  .tnav .me{width:42px; height:42px; border-radius:50%; background:var(--grad-brand); display:flex; align-items:center; justify-content:center; color:#fff; font-weight:800; font-size:15px; cursor:pointer; position:relative}
  .tnav .me::after{content:''; position:absolute; inset:-4px}

  /* ========== LAYOUT ========== */
  .app{position:relative; z-index:2; max-width:1040px; margin:0 auto; padding:0 20px 70px; display:grid; grid-template-columns:minmax(0,660px) 320px; gap:32px; justify-content:center; align-items:start}
  .side.mobile{display:none}

  /* ========== CAT NAV (sticky chips) ========== */
  /* tabs do NOT follow the scroll — they stay at the top of the page like cards */
  .catnav{position:static; display:flex; flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; gap:8px; padding:12px 0 12px; margin-bottom:8px; background:transparent; -webkit-overflow-scrolling:touch; -webkit-mask-image:linear-gradient(90deg,#000 88%,transparent); mask-image:linear-gradient(90deg,#000 88%,transparent)}
  .catnav .chip{text-shadow:0 1px 8px rgba(0,0,0,.6)}
  .catnav::-webkit-scrollbar{display:none}
  .catnav .chip{flex:none; font-size:13px; font-weight:700; color:var(--muted); background:transparent; border:1px solid transparent; padding:8px 14px; border-radius:99px; cursor:pointer; white-space:nowrap; transition:.2s}
  .catnav .chip:hover{color:var(--ink)}
  .catnav .chip.on{color:#fff; background:var(--grad-brand); border-color:transparent}

  /* ========== HERO STORY ========== */
  .hero-story{position:relative; border-radius:20px; overflow:hidden; margin-bottom:26px; min-height:300px; display:flex; align-items:flex-end; border:1px solid var(--line)}
  .hero-story img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.6; transform:scale(1.05); animation:hz 16s ease-in-out infinite alternate}
  @keyframes hz{from{transform:scale(1.04)}to{transform:scale(1.12)}}
  .hero-story .hgrad{position:absolute; inset:0; background:linear-gradient(180deg,rgba(6,8,12,.1),rgba(6,8,12,.5) 55%,rgba(6,8,12,.93))}
  .hero-story .hbody{position:relative; z-index:2; padding:24px}
  .hero-story .hkick{font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; margin-bottom:10px}
  .hero-story h2{font-family:var(--serif); font-style:normal; font-weight:600; font-size:clamp(22px,3.6vw,34px); line-height:1.14; color:#fff; max-width:24ch}
  .hero-story .hmeta{margin-top:12px; font-size:12px; color:#9FB3CC; display:flex; gap:10px}

  /* ========== SECTION ========== */
  .sec{margin:0 0 32px}
  .sechead{display:flex; align-items:center; gap:12px; margin-bottom:12px}
  .sechead .ttl{font-size:13px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; display:flex; align-items:center; gap:8px}
  .sechead .ln{flex:1; height:1px; background:var(--line)}
  .sechead .all{font-size:12px; color:var(--muted); cursor:pointer; padding:12px 2px; margin:-12px -2px; position:relative}
  .sechead .all:hover{color:var(--gold-2)}

  /* ========== NEWS CARD ========== */
  .ncard{display:flex; gap:12px; padding:14px 6px; border-bottom:1px solid var(--line-2); cursor:pointer; transition:.2s; border-radius:10px}
  .ncard:hover{background:var(--panel)}
  .ncard .acc{width:3px; border-radius:3px; flex:none; align-self:stretch}
  .ncard .nbody{flex:1; min-width:0}
  .ncard h4{font-size:15px; font-weight:700; line-height:1.34}
  .ncard .nmeta{margin-top:8px; font-size:12px; color:var(--dim); display:flex; gap:10px; align-items:center}
  .ncard .nmeta .src{color:var(--muted); font-weight:600}

  /* ========== CRYPTO STRIP ========== */

  /* ========== CRYPTO SECTION (10 coins + charts) ========== */
  .cx-top{background:var(--panel-2); border:1px solid var(--line); border-radius:14px; padding:12px 16px; margin-bottom:12px; font-size:13px; color:#C7D0DC; line-height:1.5}
  .cx-top b{color:var(--gold-2)}
  .cx-cat{margin-top:8px; font-size:12px; color:var(--sky)}
  .cx-list{display:flex; flex-direction:column; gap:8px}
  .cx-card{background:var(--panel); border:1px solid var(--line); border-radius:14px; overflow:hidden; transition:.2s}
  .cx-card.open{border-color:rgba(247,147,26,.35)}
  .cx-row{display:flex; align-items:center; gap:12px; padding:12px 16px; cursor:pointer}
  .cx-row:hover{background:var(--panel-2)}
  .cx-sym{width:78px; flex:none}
  .cx-sym b{font-size:14px; font-weight:800; display:block}
  .cx-sym small{font-size:11px; color:var(--dim)}
  .cx-spark{flex:1; height:30px; display:flex; align-items:center; min-width:0}
  .cx-spark svg{width:100%; height:30px}
  .cx-px{text-align:right; flex:none}
  .cx-px b{font-size:14px; font-weight:800; display:block; font-variant-numeric:tabular-nums}
  .cx-px span{font-size:12px; font-weight:700}
  .cx-detail{padding:0 16px 16px}
  .cx-tf{display:flex; align-items:center; gap:8px; margin-bottom:10px}
  .cx-tf button{border:1px solid var(--line); background:var(--panel-2); color:var(--muted); border-radius:8px; padding:5px 12px; font-size:12px; font-weight:700; cursor:pointer}
  .cx-tf button.on{background:var(--grad-brand); color:#fff; border-color:transparent}
  .cx-load{font-size:11px; color:var(--dim)}
  .cx-chart{background:var(--panel-2); border:1px solid var(--line); border-radius:10px; padding:10px; margin-bottom:10px}
  .cx-chart svg{width:100%; height:auto; display:block}
  .cx-meta{font-size:12px; color:var(--muted); margin-bottom:6px}
  .cx-take{font-size:14px; color:#D6DEE8; line-height:1.5}
  .cx-take b{color:var(--gold-2)}
  .cx-src{font-size:11px; color:rgba(208,184,134,.72); margin-top:8px}
  .cx-events{background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:12px 16px; margin-bottom:12px}
  .cx-evh{font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--gold-2); margin-bottom:10px}
  .cx-ev{display:flex; gap:12px; padding:8px 0; border-bottom:1px solid var(--line-2); font-size:13px}
  .cx-ev:last-child{border-bottom:none}
  .cx-evd{color:var(--gold-2); font-weight:700; width:96px; flex:none; font-variant-numeric:tabular-nums}
  .cx-evt{color:#C7D0DC}
  /* sport sub-tabs */
  .subnav{display:flex; flex-wrap:wrap; gap:8px; margin:0 0 16px}
  .subchip{display:inline-flex; align-items:center; gap:8px; font-size:13px; font-weight:600; color:var(--muted); background:var(--panel-2); border:1px solid var(--line); padding:6px 12px; border-radius:99px; cursor:pointer}
  .subchip img{width:22px; height:22px; border-radius:50%; display:block; filter:drop-shadow(0 2px 6px rgba(0,0,0,.5))}
  .subchip.on{color:#06210f; background:linear-gradient(135deg,#34D399,#10B981); border-color:transparent}
  /* channels (tracked forecast sources) */
  .chan{display:flex; align-items:center; gap:12px; padding:12px 8px; border-bottom:1px solid var(--line-2); transition:.2s; border-radius:10px}
  .chan:hover{background:var(--panel-2)}
  .chan .pf{width:34px; height:34px; border-radius:9px; flex:none; display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:800}
  .chan .pf.x{background:#000; color:#fff} .chan .pf.youtube{background:#FF0000; color:#fff} .chan .pf.tiktok{background:#111; color:#25F4EE}
  .chan .ci{flex:1; min-width:0}
  .chan .ci b{font-size:14px; font-weight:700; display:block}
  .chan .ci small{font-size:12px; color:var(--dim)}
  .chan .cs{font-size:11px; color:var(--muted); flex:none}

  /* ========== POST (lifestyle) ========== */
  .post{background:var(--panel); border:1px solid var(--line); border-radius:20px; overflow:hidden; margin-bottom:22px}
  .post .head{display:flex; align-items:center; gap:12px; padding:14px 16px}
  .post .av{width:38px; height:38px; border-radius:50%; flex:none; display:flex; align-items:center; justify-content:center; font-weight:800; font-size:14px; color:#0c0c0c}
  .post .av.g{background:var(--grad-brand)}
  .post .av.b{background:linear-gradient(135deg,#7FB6E6,#2E7CF6); color:#fff}
  .post .av.t{background:linear-gradient(135deg,#34D399,#10B981); color:#06210f}
  .post .av img{height:18px; filter:brightness(0) invert(1)}
  .post .who{flex:1; min-width:0}
  .post .who b{font-size:14px; font-weight:700; display:block}
  .post .who small{font-size:12px; color:var(--dim)}
  .post .more{color:var(--muted); font-size:20px}
  .post .media{position:relative; aspect-ratio:4/5; overflow:hidden; background:#05070b}
  .post .media img{width:100%; height:100%; object-fit:cover; transition:transform .8s cubic-bezier(.2,.7,.2,1)}
  .post:hover .media img{transform:scale(1.04)}
  .post .media .tagloc{position:absolute; left:12px; bottom:12px; font-size:12px; color:#fff; background:rgba(6,8,12,.5); backdrop-filter:blur(6px); border:1px solid rgba(255,255,255,.16); padding:5px 12px; border-radius:99px}
  .post .acts{display:flex; align-items:center; gap:16px; padding:12px 16px 6px}
  .post .acts .a{display:flex; align-items:center; gap:8px; color:var(--ink); font-size:14px; font-weight:600; cursor:pointer; transition:.2s}
  .post .acts .a.like:hover{color:var(--red)}
  .post .acts .save{margin-left:auto; color:var(--muted); cursor:pointer}
  .post .cap{padding:4px 16px 16px; font-size:14px; line-height:1.55}
  .post .cap b{font-weight:700; margin-right:8px}
  .post .cap .hash{color:var(--sky)}
  .heart{width:21px;height:21px} .bubble{width:20px;height:20px} .send{width:20px;height:20px} .bm{width:19px;height:19px}

  /* ========== FOOTBALL forecast ========== */
  .fb-media{position:relative; overflow:hidden}
  .fb-media img{width:100%; height:140px; object-fit:cover; opacity:.5}
  .fb-media .fb-ov{position:absolute; inset:0; background:linear-gradient(180deg,rgba(6,8,12,.4),rgba(6,8,12,.92))}
  .fb-media .fb-h{position:absolute; left:16px; bottom:12px; z-index:2}
  .fb-media .fb-h b{font-family:var(--serif); font-style:normal; font-size:21px; color:#fff; display:block}
  .fb-media .fb-h small{font-size:12px; color:var(--sky)}
  .fb-card{background:var(--panel); border:1px solid var(--line); border-radius:18px; overflow:hidden}
  .fb-list{padding:14px 16px 4px}
  .fb-row{display:flex; align-items:center; gap:12px; padding:8px 0}
  .fb-row .flag{font-size:18px; width:22px; text-align:center; flex:none}
  .fb-row .nm{width:96px; flex:none; font-size:14px; font-weight:600}
  .fb-row .bar{flex:1; height:8px; border-radius:99px; background:rgba(255,255,255,.07); overflow:hidden}
  .fb-row .bar i{display:block; height:100%; border-radius:99px; background:linear-gradient(90deg,var(--gold),var(--gold-2)); width:0; transition:width 1s cubic-bezier(.2,.7,.2,1)}
  .fb-row .pct{width:46px; text-align:right; flex:none; font-size:13px; font-weight:700; color:var(--gold-2); font-variant-numeric:tabular-nums}
  .fb-tip{margin:8px 16px 0; padding:12px 14px; background:var(--panel-2); border:1px solid var(--line); border-radius:13px; font-size:13px; color:#C7D0DC; line-height:1.5}
  .fb-tip b{color:var(--gold-2)}
  .disc{padding:10px 16px 16px; font-size:11px; color:var(--muted); line-height:1.5; display:flex; align-items:flex-start; gap:8px}
  .disc svg{flex:none; margin-top:1px}

  /* ========== POLYMARKET ========== */
  .pm-card{background:var(--panel); border:1px solid var(--line); border-radius:18px; overflow:hidden}
  .pm-head{display:flex; align-items:center; gap:12px; padding:14px 16px}
  .pm-head .av{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#A78BFA,#7C3AED);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;flex:none}
  .pm-head b{font-size:14px;font-weight:700;display:block} .pm-head small{font-size:12px;color:var(--dim)}
  .pm-head .badge{margin-left:auto;font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:4px 8px;border-radius:99px;color:var(--green);background:rgba(52,211,153,.1);border:1px solid rgba(52,211,153,.3);display:flex;align-items:center;gap:5px}
  .pm-head .badge i{width:7px;height:7px;border-radius:50%;background:var(--green);animation:pulse 2s infinite}
  @keyframes pulse{0%{box-shadow:0 0 0 0 rgba(52,211,153,.5)}70%{box-shadow:0 0 0 6px rgba(52,211,153,0)}100%{box-shadow:0 0 0 0 rgba(52,211,153,0)}}
  .pm{padding:6px 16px 4px}

  /* ========== LIGA v2: mesačná súťaž + skupiny + rebríček + redeem-modal ========== */
  .lprize{position:relative; margin:4px 0 14px; padding:14px 16px; border-radius:16px; border:1px solid rgba(224,179,88,.32); background:linear-gradient(135deg,rgba(224,179,88,.12),rgba(59,130,246,.05))}
  .lpz-h{font-size:12px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:#E0B358; margin-bottom:8px}
  .lpz-row{display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:8px}
  .lpz-p{font-size:13px; font-weight:800; padding:6px 12px; border-radius:99px; font-variant-numeric:tabular-nums}
  .lpz-p.g1{background:rgba(224,179,88,.18); color:#F0CE82}
  .lpz-p.g2{background:rgba(200,205,215,.14); color:#D7DEE9}
  .lpz-p.g3{background:rgba(205,140,90,.16); color:#E2A878}
  .lpz-cd{margin-left:auto; font-size:12px; font-weight:700; color:#7FA3D9; font-variant-numeric:tabular-nums}
  .lpz-me{font-size:12px; color:var(--ink); margin-bottom:6px}
  .lpz-rule{font-size:11px; color:rgba(208,184,134,.72); line-height:1.45}
  .lgrp{font-size:11px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:#7FA3D9; padding:12px 2px 2px}
  .lkurz-note{font-size:11px; color:rgba(208,184,134,.72); margin:4px 0 8px; line-height:1.45}
  .pbtn .kz{display:inline-block; margin-left:8px; font-size:12px; font-weight:800; font-variant-numeric:tabular-nums; opacity:.95; background:rgba(255,255,255,.14); border-radius:8px; padding:2px 8px}
  .lb-dots{text-align:center; color:var(--dim); font-size:13px; letter-spacing:.3em; padding:2px 0}
  .lb-total{text-align:center; font-size:11px; color:var(--dim); padding:8px 0 0}
  .lpmodal{position:fixed; inset:0; z-index:130; display:none; align-items:center; justify-content:center; background:rgba(3,7,16,.72); padding:18px}
  .lpmodal.on{display:flex}
  .lpm-card{position:relative; width:min(420px,100%); background:rgba(10,18,34,.99); border:1px solid rgba(224,179,88,.3); border-radius:18px; padding:22px 20px; box-shadow:0 24px 70px rgba(0,0,0,.6)}
  .lpm-card b{font-size:15px}
  .lpm-card p{font-size:13px; color:var(--ink); line-height:1.65; margin-top:10px}
  .lpm-card small{display:block; margin-top:10px; font-size:11px; color:rgba(208,184,134,.72)}
  .lpm-code{margin-top:12px; font-family:var(--mono,monospace); font-size:21px; font-weight:800; letter-spacing:.12em; color:#F0CE82; background:rgba(224,179,88,.1); border:1px dashed rgba(224,179,88,.4); border-radius:12px; padding:12px; text-align:center; user-select:all}
  .lpm-x{position:absolute; top:10px; right:12px; background:transparent; border:none; color:var(--muted); font-size:18px; cursor:pointer; padding:6px}

  /* ========== AI ANALYTIK (slide-up panel, Nansen-style) ========== */
  .ai-btn{flex:none; font-size:14px; font-weight:800; letter-spacing:.4px; color:#fff; background:var(--grad-brand); border:none; border-radius:99px; padding:12px 18px; min-height:44px; cursor:pointer; box-shadow:0 4px 16px rgba(77,163,255,.3)}
  .ai-btn:hover{transform:translateY(-1px)}
  /* AI panel — V2 (): solid surface, avatar-ring header, contrasted bubbles */
  .aipanel{position:fixed; bottom:18px; right:18px; z-index:120; width:min(460px,calc(100vw - 20px)); height:min(660px,calc(100vh - 90px)); display:flex; flex-direction:column; background:var(--surface); border:1px solid var(--hair); border-radius:16px; box-shadow:0 24px 70px rgba(0,0,0,.6); overflow:hidden}
  .aipanel[hidden]{display:none}
  .aip-head{display:flex; align-items:center; gap:12px; padding:13px 14px; border-bottom:1px solid var(--hair); background:#0B1428}
  .aip-ava{width:38px; height:38px; border-radius:50%; background:var(--surface-2); border:2px solid var(--sky); display:flex; align-items:center; justify-content:center; box-shadow:0 0 0 3px rgba(56,189,248,.12); flex:none; overflow:hidden}
  .aip-ava img{width:24px; height:auto}
  .aip-tt{flex:1; min-width:0}
  .aip-tt b{font-size:14px; display:block; line-height:1.1}
  .aip-tt small{font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:var(--sky); display:flex; align-items:center; gap:6px; margin-top:3px}
  .aip-dot{width:7px; height:7px; border-radius:50%; background:var(--green); box-shadow:0 0 8px var(--green); display:inline-block}
  .aip-x{background:transparent; border:none; color:var(--muted); font-size:18px; cursor:pointer; padding:4px 6px}
  .aip-msgs{flex:1; overflow-y:auto; padding:16px 14px 8px; display:flex; flex-direction:column; gap:11px; scrollbar-width:none; font-size:14.5px; line-height:1.5}
  .aip-msgs::-webkit-scrollbar{display:none}
  .aim{max-width:88%; padding:11px 13px; border-radius:14px 14px 14px 4px; background:#101B30; border:1px solid #233152; color:#E3ECF8; font-size:13px; line-height:1.55; white-space:pre-wrap; word-break:break-word}
  .aim.user{align-self:flex-end; border-radius:14px 14px 4px 14px; background:#1E3A5F; border-color:#2A4A75; color:#fff}
  .aim.err{background:rgba(229,84,75,.12); border-color:rgba(229,84,75,.3); color:#F1A09A; font-size:12px}
  .aip-sug{display:flex; flex-direction:column; gap:4px; margin-top:2px}
  .aip-sg{font-size:10px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--gold-2); padding:8px 2px 1px}
  /* prompt chips — finger-swipeable row per group (R3) */
  .aip-sgrow{display:flex; gap:8px; overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch; padding-bottom:4px; -webkit-mask-image:linear-gradient(90deg,#000 93%,transparent); mask-image:linear-gradient(90deg,#000 93%,transparent)}
  .aip-sgrow::-webkit-scrollbar{display:none}
  .aip-sgrow button{flex:none; white-space:nowrap}
  /* AI-HERO v3 — first home block (professional composition, ) */
  /* AI hero — V2 "Analytik-karta" (): solid surface, left accent bar, avatar, live data strip */
  .aihero{position:relative; margin:6px 0 20px; padding:22px 24px 20px 28px; border-radius:16px; border:1px solid var(--hair); background:var(--surface); box-shadow:0 8px 28px rgba(0,0,0,.38); overflow:hidden}
  .aihero::before{content:''; position:absolute; left:0; top:0; bottom:0; width:4px; background:linear-gradient(180deg,var(--sky),#7C6AFB); pointer-events:none; z-index:1}
  .aih-bg{position:absolute; inset:0; z-index:0; background:url(assets/bg_ai_hero.png) center/cover no-repeat; opacity:.20; pointer-events:none}
  .aihero > *:not(.aih-bg){position:relative; z-index:1}
  .aih-id{position:relative; display:flex; align-items:center; gap:12px; margin-bottom:14px}
  .aih-ava{width:46px; height:46px; border-radius:50%; background:var(--surface-2); border:2px solid var(--sky); display:flex; align-items:center; justify-content:center; font-weight:800; color:var(--sky); font-size:18px; box-shadow:0 0 0 4px rgba(56,189,248,.12); flex:none}
  .aih-name b{font-size:15px; display:block; color:#fff}
  .aih-name small{font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:#7CC0FF; display:flex; align-items:center; gap:6px; margin-top:3px}
  .aih-name small i{width:7px; height:7px; border-radius:50%; background:var(--green); box-shadow:0 0 8px var(--green); display:inline-block; animation:pulse 2.4s infinite}
  .aih-q{position:relative; font-weight:800; font-size:clamp(22px,3.8vw,30px); letter-spacing:-.01em; line-height:1.12; color:#fff; margin-bottom:4px}
  .aih-row{position:relative; display:flex; gap:16px; align-items:flex-start; flex-wrap:wrap; margin-top:14px}
  .aih-main{flex:1; min-width:300px}
  .aibar{display:flex; align-items:center; gap:10px; background:var(--surface-2); border:2px solid var(--gold-2); border-radius:14px; padding:7px 7px 7px 16px; box-shadow:inset 0 0 22px rgba(77,163,255,.15), 0 6px 22px rgba(77,163,255,.10)}
  .aib-mic{background:#15203A; border:none; border-radius:11px; color:var(--ink); width:42px; height:42px; font-size:15px; cursor:pointer; flex:none}
  .aibar input{flex:1; min-width:0; height:40px; background:transparent; border:none; outline:none; color:var(--ink-max); font-size:16px; font-family:inherit}
  .aibar input::placeholder{color:#5B6F8A}
  .aib-send{background:var(--grad-brand); border:none; border-radius:11px; color:#fff; padding:0 16px; height:42px; font-size:15px; font-weight:800; cursor:pointer; flex:none}
  .aih-strip{display:flex; gap:12px; flex-wrap:wrap; margin-top:10px; padding:7px 12px; background:#0B1326; border:1px solid var(--hair); border-radius:10px}
  .aih-strip span{font-size:11px; color:var(--muted); display:flex; align-items:center; gap:5px}
  /* live "ready forecasts" teaser under subtitle (R3) */
  .aih-ready{display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin:2px 0 2px; font-size:12px; color:#A9BCD8; font-variant-numeric:tabular-nums}
  .aih-ready .aih-rl{font-size:10px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--green); background:rgba(46,204,143,.12); border-radius:6px; padding:2px 7px}
  .aih-strip b{color:#fff; font-weight:700; font-variant-numeric:tabular-nums}
  .aih-sd{width:7px; height:7px; border-radius:50%; display:inline-block; flex:none}
  /* hypothetical-model disclaimer (R3.3, ): informačný pohľad, nie priama rada */
  .aih-disc{margin-top:9px; font-size:10.5px; line-height:1.45; color:var(--dim); opacity:.9}
  /* hero hot-buttons — finger-swipeable horizontal rail (R3) */
  .aib-chips{display:flex; gap:10px; width:300px; overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch; -webkit-mask-image:linear-gradient(90deg,#000 92%,transparent); mask-image:linear-gradient(90deg,#000 92%,transparent); padding-bottom:2px}
  .aib-chips::-webkit-scrollbar{display:none}
  .aib-chip{flex:none; display:inline-flex; align-items:center; gap:9px; font-size:13px; font-weight:700; color:#D7E2F2; background:var(--surface-2); border:1px solid var(--hair); border-radius:12px; padding:12px 14px; cursor:pointer; white-space:nowrap; transition:transform .12s, border-color .15s}
  .aib-chip i{width:8px; height:8px; border-radius:50%; display:inline-block; flex:none}
  .aib-chip:hover{transform:translateY(-2px); border-color:#39507E}
  @media(max-width:760px){ .aib-chips{width:100%} .aib-chip{font-size:14px; padding:13px 16px} }
  .aib-lbl{position:relative; margin:16px 0 10px; font-size:12px; font-weight:700; letter-spacing:.04em; color:#8FA6C4}
  .aib-cards{position:relative; display:flex; gap:10px; overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch; -webkit-mask-image:linear-gradient(90deg,#000 94%,transparent); mask-image:linear-gradient(90deg,#000 94%,transparent); padding-bottom:2px}
  .aib-cards::-webkit-scrollbar{display:none}
  .aib-card{flex:none; width:250px; display:flex; align-items:flex-start; gap:11px; text-align:left; padding:15px 14px; background:var(--surface-2); border:1px solid var(--hair); border-left:3px solid var(--ac,#4DA3FF); border-radius:12px; cursor:pointer; transition:transform .12s, border-color .15s, background .15s}
  .aib-card:hover{transform:translateY(-2px); background:rgba(255,255,255,.04); border-color:#39507E}
  .aib-ct{flex:1; font-size:15px; line-height:1.45; color:#E7EEF7; font-weight:500}
  .aib-ca{flex:none; color:var(--ac,#4DA3FF); font-size:15px; margin-top:1px}
  @media(max-width:760px){ .aib-card{width:240px} }
  /* liga teaser — social-proof card after hero */
  .lteaser{margin:12px 0 4px; padding:14px 16px; border-radius:16px; border:1px solid rgba(224,179,88,.32); background:linear-gradient(135deg,rgba(224,179,88,.1),rgba(59,130,246,.05)); cursor:pointer}
  .lteaser:hover{border-color:rgba(224,179,88,.55)}
  .lt-h{display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; font-family:var(--serif); font-style:normal; font-weight:600; font-size:18px; letter-spacing:.01em; text-transform:none; color:#E9C77C; margin-bottom:8px}
  .lt-prize{margin-left:auto; font-family:'Plus Jakarta Sans',system-ui,sans-serif; font-style:normal; font-size:11px; font-weight:700; letter-spacing:.02em; text-transform:none; color:#F0CE82}
  .lt-row{display:flex; align-items:center; gap:10px; padding:8px 2px; border-top:1px solid var(--line-2); font-size:13px}
  .lt-row .pos{flex:none; width:26px; font-family:var(--serif); font-style:normal; color:#E0B358; font-size:13px}
  .lt-row .nm{flex:1; font-weight:600; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
  .lt-row .nm small{color:var(--dim); font-weight:600}
  .lt-row .pp{font-weight:800; color:#E0B358; font-variant-numeric:tabular-nums}
  .lt-row.me{background:rgba(77,163,255,.08); border-radius:10px; border-top:none; padding:8px 8px}
  .lt-row.me .pos,.lt-row.me .pp{color:#7CC0FF}
  .lt-dots{text-align:center; color:var(--dim); font-size:12px; letter-spacing:.3em; padding:1px 0}
  .lt-foot{display:flex; align-items:center; justify-content:space-between; margin-top:8px; font-size:11px; color:rgba(208,184,134,.75)}
  .lt-cta{font-size:13px; font-weight:800; color:#E0B358}
  .aip-sug button{font-size:12px; font-weight:700; color:var(--ink); background:rgba(77,163,255,.08); border:1px solid rgba(77,163,255,.3); border-radius:99px; padding:8px 12px; cursor:pointer}
  .aip-sug button:hover{background:rgba(77,163,255,.18)}
  .aip-typing{align-self:flex-start; display:inline-flex; gap:4px; padding:10px 12px; border-radius:14px 14px 14px 4px; background:rgba(255,255,255,.05)}
  .aip-typing i{width:6px; height:6px; border-radius:50%; background:var(--muted); animation:aidot 1.1s ease-in-out infinite}
  .aip-typing i:nth-child(2){animation-delay:.14s} .aip-typing i:nth-child(3){animation-delay:.28s}
  @keyframes aidot{0%,80%,100%{opacity:.35; transform:translateY(0)} 40%{opacity:1; transform:translateY(-3px)}}
  .aip-cap{font-size:10px; color:var(--dim); line-height:1.45; padding:6px 14px 2px}
  .aip-modes{display:flex; gap:8px; padding:8px 12px 0}
  .aip-mode{flex:1; font-size:13px; font-weight:800; color:var(--muted); background:rgba(255,255,255,.05); border:1px solid var(--line); border-radius:99px; padding:10px 12px; cursor:pointer; white-space:nowrap}
  .aip-mode.on{color:#fff; background:var(--grad-brand); border-color:transparent}
  .aip-mic{background:rgba(255,255,255,.07); border:none; border-radius:10px; color:var(--ink); padding:10px 12px; font-size:14px; cursor:pointer; flex:none}
  .aip-mic.rec{background:rgba(229,84,75,.3); box-shadow:0 0 0 2px rgba(229,84,75,.5); animation:pulse 1.4s infinite}
  .aih-sub{position:relative; font-size:13px; color:#A9BCD8; line-height:1.5; margin:0 0 12px; max-width:56ch}
  .aip-comp{display:flex; gap:8px; padding:10px; border-top:1px solid var(--line); align-items:flex-end}
  .aip-comp textarea{flex:1; resize:none; min-height:40px; max-height:110px; padding:11px 13px; border-radius:10px; border:none; background:rgba(255,255,255,.06); color:var(--ink); font-size:15px; font-family:inherit; outline:none; line-height:1.45}
  .aip-send{background:var(--grad-brand); border:none; border-radius:10px; color:#fff; padding:10px 14px; font-size:14px; font-weight:800; cursor:pointer}
  @media (max-width:480px){ .aipanel{right:8px; left:8px; bottom:8px; width:auto; height:min(74vh,560px)} }

  /* ========== SIDEBAR ========== */
  .side{position:sticky; top:84px; display:flex; flex-direction:column; gap:18px; margin-top:24px}
  .panel{background:var(--panel); border:1px solid var(--line); border-radius:18px; padding:18px}
  .panel .ph{font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--dim); font-weight:700; margin-bottom:14px; display:flex; align-items:center; justify-content:space-between}
  .pfp{display:flex; align-items:center; gap:12px}
  .pfp .big{width:58px; height:58px; display:flex; align-items:center; justify-content:center}
  .pfp .big img{width:100%; height:auto}
  .pfp .meta b{font-size:15px; font-weight:700; display:block}
  .pfp .meta small{font-family:var(--serif); font-style:normal; color:var(--gold-2); font-size:15px}
  .pfp .out{margin-left:auto; font-size:12px; color:var(--dim); border:1px solid var(--line); padding:6px 12px; border-radius:99px}
  .news{display:flex; flex-direction:column; gap:2px}
  .news a{display:flex; gap:12px; padding:10px 8px; border-radius:12px; transition:.2s; align-items:flex-start}
  .news a:hover{background:var(--panel-2)}
  .news .nx b{font-size:13px; font-weight:600; line-height:1.34; display:block}
  .news .nx small{font-size:11px; color:var(--dim); letter-spacing:.04em}
  .news .nx .kk{color:var(--gold-2); text-transform:uppercase; letter-spacing:.08em; font-weight:700}
  .nets{display:flex; flex-direction:column; gap:12px}
  .net{display:flex; align-items:center; gap:12px; font-size:14px}
  .net .ic{width:26px; height:26px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-weight:800; font-size:12px; color:#0b1220; flex:none}
  .net .nm{flex:1; color:var(--ink); font-weight:600}
  .net .st{font-size:11px; color:var(--green); display:flex; align-items:center; gap:6px}
  .net .st i{width:7px; height:7px; border-radius:50%; background:var(--green); animation:pulse 2.4s infinite}
  /* asset rail — Nansen-style dense swipeable list, fills viewport height */
  .arail{margin-top:2px; max-height:calc(100vh - 470px); min-height:320px; overflow-y:auto; -webkit-overflow-scrolling:touch; overscroll-behavior:contain; scrollbar-width:none}
  .arail::-webkit-scrollbar{display:none}
  .ar-h{font-size:10px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--dim); padding:12px 2px 6px}
  .arail .ar-h:first-child{padding-top:0}
  .ar-row{display:flex; align-items:center; gap:10px; padding:8px 4px; border-bottom:1px solid var(--line-2); cursor:pointer; border-radius:8px}
  .ar-row:hover{background:var(--panel-2)}
  .ar-sym{flex:1; min-width:0}
  .ar-sym b{font-size:13px; font-weight:700; display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
  .ar-sym small{font-size:11px; color:var(--dim); display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
  .ar-track{height:4px; border-radius:99px; background:rgba(255,255,255,.07); margin-top:5px; overflow:hidden}
  .ar-track i{display:block; height:100%; border-radius:99px}
  .ar-num{text-align:right; font-variant-numeric:tabular-nums; flex:none}
  .ar-num b{font-size:13px; display:block}
  .ar-num small{font-size:11px; display:block; color:var(--dim)}
  .ar-lock{display:flex; align-items:center; gap:8px; padding:10px 4px; font-size:12px; color:var(--muted); cursor:pointer}
  .ar-lock:hover{color:var(--ink)}
  .ar-cap{font-size:10px; color:var(--dim); line-height:1.5; padding:10px 2px 2px}
  .sfoot{font-size:11px; color:var(--dim); line-height:1.6; padding:2px 4px}
  .sfoot a{color:var(--gold-2)}
  .mfoot{max-width:600px; margin:8px auto 0; padding:24px 20px 40px; text-align:center; color:var(--dim); font-size:12px; line-height:1.7}
  .mfoot a{color:var(--gold-2)}

  /* ========== NAŠA PROGNÓZA ========== */
  .fc-top{display:flex; align-items:center; gap:8px; margin-bottom:8px}
  .fc-cat{font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:#fff; background:var(--grad-brand); padding:4px 10px; border-radius:99px}
  .fc-hor{font-size:11px; color:#7FA3D9; font-weight:600}
  .fc-soc{margin-top:8px; font-size:12px; color:#A99BD9; font-weight:600}
  .fc-row{padding:14px 0; border-bottom:1px solid var(--line-2)}
  .fc-row:last-child{border-bottom:none}
  .fc-ev{font-size:15px; font-weight:700; line-height:1.3}
  .fc-mean{font-size:13px; color:#D8C08A; line-height:1.5; margin-top:6px}
  .fc-out{font-size:13px; color:#9ED0BC; line-height:1.5; margin-top:6px}
  .fc-mean b,.fc-out b{color:var(--gold-2); font-weight:600}
  .fc-bar{display:flex; align-items:center; gap:10px; margin-top:10px}
  .fc-bar .t{flex:1; height:8px; border-radius:99px; background:rgba(255,255,255,.07); overflow:hidden}
  .fc-bar .t i{display:block; height:100%; border-radius:99px; background:linear-gradient(90deg,var(--accent-deep),var(--gold-2)); box-shadow:0 0 8px rgba(77,163,255,.5)}
  .fc-bar .pc{font-size:13px; font-weight:800; color:var(--gold-2); width:42px; text-align:right; font-variant-numeric:tabular-nums}

  /* ========== FORECAST VIDEO (YouTube) ========== */
  .fc-vid{display:flex; align-items:center; gap:12px; margin-top:12px; padding:8px; background:var(--panel-2); border:1px solid var(--line); border-radius:12px; cursor:pointer; transition:.2s}
  .fc-vid:hover{border-color:rgba(77,163,255,.4)}
  .fc-vid img{width:88px; height:50px; border-radius:8px; object-fit:cover; flex:none; background:#05070b}
  .fc-vid .pl{position:absolute; margin-left:30px; color:#fff; font-size:14px; text-shadow:0 1px 6px rgba(0,0,0,.7); pointer-events:none}
  .fc-vid .vt{font-size:12px; line-height:1.35; color:#C7D0DC}
  .fc-vid .vt b{color:var(--gold-2); display:block; font-size:11px; font-weight:600; margin-top:3px}

  /* ========== CASINO (concept) ========== */

  /* ========== RAFFLE / BONUS (concept) ========== */
  .raffle{display:flex; flex-direction:column; gap:12px}
  .raf-card{display:flex; gap:14px; align-items:flex-start; background:var(--panel); border:1px solid var(--line); border-radius:16px; padding:16px}
  .raf-card .ri{font-size:26px; flex:none; width:46px; height:46px; border-radius:12px; background:linear-gradient(135deg,rgba(224,179,88,.18),rgba(56,189,248,.08)); display:flex; align-items:center; justify-content:center}
  .raf-card b{font-size:15px; font-weight:700; display:block}
  .raf-card p{font-size:13px; color:var(--muted); margin-top:4px; line-height:1.45}
  .raf-cta{width:100%; margin-top:14px; border:none; border-radius:13px; padding:14px; font-size:15px; font-weight:700; color:#fff; background:var(--grad-brand); cursor:pointer}
  .raf-cta:hover{filter:brightness(1.06)}

  /* ========== BRÍFING AUDIO ========== */
  .brief audio{width:100%; margin-top:12px; height:38px; filter:saturate(.9)}

  /* ========== CATEGORY COVER BANNER ========== */
  .covban{position:relative; height:104px; border-radius:16px; overflow:hidden; margin-bottom:12px; border:1px solid var(--line)}
  .covban.covban-tall{height:132px}
  .covban img{width:100%; height:100%; object-fit:cover; opacity:.7}
  .covban .covov{position:absolute; inset:0; background:linear-gradient(180deg,rgba(6,8,12,.15),rgba(6,8,12,.78))}
  .covban .covlbl{position:absolute; left:16px; bottom:12px; z-index:2; font-family:var(--serif); font-style:normal; font-size:19px; color:#fff; text-shadow:0 2px 14px rgba(0,0,0,.5)}

  /* ========== BRÍFING DŇA ========== */
  .brief{background:linear-gradient(135deg, rgba(59,130,246,.10), rgba(56,189,248,.04)); border:1px solid rgba(77,163,255,.22); border-radius:18px; padding:18px 20px; margin-bottom:20px}
  .brief .bh{display:flex; align-items:center; gap:8px; margin-bottom:10px}
  .brief .bh b{font-family:var(--serif); font-style:normal; font-size:18px; color:var(--gold-2)}
  .brief .bh .tag{margin-left:auto; font-size:10px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--dim)}
  .brief p{font-size:15px; line-height:1.62; color:#D6DEE8}

  /* ========== ODDS (Kurzy) ========== */

  /* ========== LIGA (mini-Polymarket prototype) ========== */
  .pts{display:flex; align-items:center; gap:14px; background:linear-gradient(135deg, rgba(224,179,88,.14), rgba(56,189,248,.05)); border:1px solid rgba(224,179,88,.3); border-radius:16px; padding:16px 18px; margin-bottom:16px}
  .pts .bal{font-family:var(--display)}
  .pts .bal b{font-size:26px; font-weight:800; color:#E0B358; font-variant-numeric:tabular-nums}
  .pts .bal small{display:block; font-size:11px; color:var(--dim); letter-spacing:.06em; text-transform:uppercase}
  .pts .rk{margin-left:auto; text-align:right}
  .pts .rk b{font-size:16px; font-weight:700} .pts .rk small{display:block; font-size:11px; color:var(--dim)}
  .lhead{font-size:12px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:#E0B358; margin:18px 0 10px}
  .pcard{background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:14px; margin-bottom:10px}
  .pcard .pq{font-size:14px; font-weight:600; line-height:1.4}
  .pcard .pmeta{font-size:11px; color:var(--dim); margin-top:5px}
  .pcard .pbtns{display:flex; gap:8px; margin-top:12px}
  .pbtn{flex:1; border:1px solid var(--line); background:var(--panel-2); color:var(--ink); border-radius:10px; padding:10px; font-size:13px; font-weight:700; cursor:pointer; transition:.15s}
  .pbtn.yes:hover{border-color:var(--green); color:var(--green)} .pbtn.no:hover{border-color:var(--red); color:var(--red)}
  .pbtn.on{background:var(--grad-brand); color:#fff; border-color:transparent}
  .pdone{margin-top:10px; font-size:12px; color:var(--green); font-weight:600}
  .lb-row{display:flex; align-items:center; gap:12px; padding:10px 6px; border-bottom:1px solid var(--line-2)}
  .lb-row:last-child{border-bottom:none}
  .lb-row.me{background:rgba(224,179,88,.08); border-radius:10px}
  .lb-row .pos{width:24px; font-family:var(--serif); font-style:normal; font-size:18px; color:#E0B358; flex:none}
  .lb-row .nm{flex:1; font-size:14px; font-weight:600}
  .lb-row .pp{font-weight:800; color:#E0B358; font-variant-numeric:tabular-nums}
  .vrow{display:flex; align-items:center; gap:12px; padding:12px 0; border-bottom:1px solid var(--line-2)}
  .vrow:last-child{border-bottom:none}
  .vrow .vt{flex:1; font-size:14px; font-weight:600}
  .vbtn{border:1px solid var(--line); background:var(--panel-2); border-radius:9px; padding:6px 12px; font-size:13px; cursor:pointer; color:var(--muted)}
  .vbtn.on{color:#E0B358; border-color:rgba(224,179,88,.45)}
  .rew-card{display:flex; align-items:center; gap:12px; background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:14px; margin-bottom:8px}
  .rew-card .ri{font-size:24px; width:44px; height:44px; border-radius:11px; background:linear-gradient(135deg,rgba(224,179,88,.18),rgba(56,189,248,.08)); display:flex; align-items:center; justify-content:center; flex:none}
  .rew-card b{font-size:14px; display:block} .rew-card small{font-size:12px; color:var(--dim)}
  .rew-card .rb{margin-left:auto; border:none; border-radius:10px; padding:8px 14px; font-size:13px; font-weight:700; color:#fff; background:var(--grad-brand); cursor:pointer}
  .rew-card .rb:disabled{background:var(--panel-2); color:var(--dim); cursor:not-allowed}
  #toast{position:fixed; left:50%; bottom:26px; transform:translateX(-50%) translateY(20px); z-index:300; background:#10141d; border:1px solid var(--line); color:var(--ink); padding:12px 20px; border-radius:12px; font-size:14px; font-weight:600; opacity:0; transition:.3s; pointer-events:none; box-shadow:0 20px 50px rgba(0,0,0,.5)}
  #toast.on{opacity:1; transform:translateX(-50%) translateY(0)}
  .aff{display:block; text-align:center; margin-top:10px; font-size:13px; color:var(--green); font-weight:600}
  .stats{display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-bottom:14px}
  .stat{background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:12px 6px; text-align:center}
  .stat b{font-size:19px; font-weight:800; color:#E0B358; display:block; font-variant-numeric:tabular-nums}
  .stat small{font-size:10px; color:var(--dim); text-transform:uppercase; letter-spacing:.04em}
  .stake{display:flex; align-items:center; gap:8px; margin-bottom:12px; font-size:13px; color:var(--muted)}
  .stake button{border:1px solid var(--line); background:var(--panel-2); color:var(--ink); border-radius:8px; padding:6px 12px; font-size:13px; font-weight:700; cursor:pointer}
  .stake button.on{background:var(--grad-brand); color:#fff; border-color:transparent}
  .pbar{height:6px; border-radius:99px; background:rgba(255,255,255,.07); overflow:hidden; margin:8px 0 5px}
  .pbar i{display:block; height:100%; background:linear-gradient(90deg,#10B981,#34D399)}
  .pwhen{margin-top:8px; font-size:12px; color:var(--sky); font-weight:600}
  .pstatus{margin-top:10px; font-size:13px; font-weight:700}
  .pstatus.correct{color:var(--green)} .pstatus.wrong{color:var(--red)} .pstatus.pending{color:var(--muted)}
  .resbtn{width:100%; border:1px solid rgba(224,179,88,.4); background:rgba(224,179,88,.1); color:#E0B358; border-radius:11px; padding:12px; font-size:13px; font-weight:700; cursor:pointer; margin-bottom:12px}
  .namebox{display:flex; gap:8px; margin-bottom:14px}
  .namebox input{flex:1; background:var(--panel-2); border:1px solid var(--line); border-radius:10px; padding:8px 12px; color:var(--ink); font-size:13px; outline:none}
  .namebox button{border:1px solid var(--line); border-radius:10px; padding:8px 14px; font-weight:700; background:var(--panel-2); color:var(--gold-2); cursor:pointer}
  .lreset{display:block; text-align:center; margin-top:14px; font-size:12px; color:var(--dim); cursor:pointer}
  .lreset:hover{color:var(--muted)}

  /* ========== WEEKLY TEASER ========== */
  .weekly{position:relative; overflow:hidden; border:1px solid rgba(56,189,248,.22); border-radius:18px; padding:18px 20px; margin-bottom:20px; background:linear-gradient(135deg, rgba(56,189,248,.08), rgba(139,92,246,.06))}
  .weekly .wk{display:flex; align-items:center; gap:10px}
  .weekly .wk .soon{font-size:10px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:#06210f; background:linear-gradient(135deg,#34D399,#10B981); padding:4px 10px; border-radius:99px}
  .weekly b{font-size:17px; font-weight:700; display:block; margin-top:10px}
  .weekly p{font-size:14px; color:var(--muted); margin-top:5px; line-height:1.5}

  /* ========== ARTICLE MODAL (news "ours") ========== */
  .amodal{position:fixed; inset:0; z-index:150; display:none; align-items:flex-end; justify-content:center; background:rgba(4,6,10,.72); backdrop-filter:blur(6px)}
  .amodal.on{display:flex}
  .amcard{width:100%; max-width:560px; max-height:92vh; overflow-y:auto; background:var(--panel); border:1px solid var(--line); border-radius:24px 24px 0 0; box-shadow:0 -30px 80px rgba(0,0,0,.6)}
  @media(min-width:620px){ .amodal{align-items:center} .amcard{border-radius:22px} }
  .amclose{position:sticky; top:0; display:flex; justify-content:flex-end; padding:12px 14px 0}
  .amclose button{width:34px;height:34px;border-radius:50%;border:1px solid var(--line);background:var(--panel-2);color:var(--ink);font-size:15px;cursor:pointer}
  .ambody{padding:0 22px 26px}
  .amimg{width:100%; border-radius:14px; margin-bottom:16px; aspect-ratio:16/9; object-fit:cover; background:#05070b}
  .amkick{font-size:11px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; margin-bottom:10px}
  .ambody h2{font-family:var(--serif); font-style:normal; font-weight:600; font-size:clamp(22px,3.4vw,30px); line-height:1.24; color:#fff}
  .amlede{font-size:15px; line-height:1.62; color:#C7D0DC; margin-top:14px}
  .amsrc{font-size:12px; color:var(--dim); margin-top:16px}
  .ambtn{display:inline-block; margin-top:16px; background:var(--panel-2); border:1px solid var(--line); color:var(--gold-2); padding:12px 18px; border-radius:12px; font-size:14px; font-weight:600}
  .ambtn:hover{border-color:rgba(77,163,255,.4)}

  /* ========== MARKET SNAPSHOT (title-page hook) ========== */
  .ms{background:linear-gradient(135deg, rgba(59,130,246,.12), rgba(56,189,248,.05)); border:1px solid rgba(77,163,255,.28); border-radius:18px; padding:16px 18px; margin-bottom:18px}
  .ms-h{display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:12px}
  .ms-badge{font-size:10px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:#fff; background:var(--grad-brand); padding:4px 10px; border-radius:99px}
  .ms-h b{font-family:var(--serif); font-style:normal; font-size:17px; color:#fff}
  .ms-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:10px}
  .ms-a{background:rgba(11,15,22,.5); border:1px solid var(--line); border-radius:12px; padding:12px 10px}
  .ms-n{font-size:11px; color:var(--muted); font-weight:600}
  .ms-d{font-size:14px; font-weight:800; margin-top:4px}
  .ms-note{font-size:11px; color:var(--dim); margin-top:3px; line-height:1.3}
  .ms-pick{margin-top:12px; font-size:13px; color:var(--gold-2); font-weight:600}
  .ms-src{margin-top:8px; font-size:10px; color:var(--dim)}
  @media(max-width:600px){ .ms-grid{grid-template-columns:repeat(2,1fr)} }

  /* ========== TICKER (3-sec hook) ========== */
  .ticker{position:relative; overflow:hidden; border:1px solid var(--line); border-radius:12px; background:var(--panel); margin-bottom:18px}
  .ticker .tk{display:flex; align-items:center; gap:28px; width:max-content; padding:12px 16px; animation:tkroll 34s linear infinite}
  .ticker:hover .tk{animation-play-state:paused}
  @keyframes tkroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
  .ticker .t{display:flex; align-items:center; gap:8px; font-size:13px; color:var(--ink); font-weight:600; white-space:nowrap}
  .ticker .t .dot{width:6px;height:6px;border-radius:50%;background:var(--red);flex:none; animation:pulse 2s infinite}
  .ticker .t .lead{font-size:10px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--gold-2)}

  /* ========== NEWS CARD IMAGE ========== */
  .ncard .nthumb{width:92px; height:66px; border-radius:10px; object-fit:cover; flex:none; background:#05070b}

  /* ========== TRENDING ========== */

  /* ========== SENTIMENT ========== */
  .senti{background:var(--panel); border:1px solid var(--line); border-radius:18px; padding:18px}
  .senti .gv{display:flex; align-items:baseline; gap:10px}
  .senti .gv b{font-size:30px; font-weight:800; font-variant-numeric:tabular-nums}
  .senti .gv span{font-size:14px; font-weight:700}
  .gauge{height:10px; border-radius:99px; background:linear-gradient(90deg,#F87171,#FBBF24,#34D399); position:relative; margin:12px 0 8px}
  .gauge .mk{position:absolute; top:-5px; width:4px; height:20px; border-radius:3px; background:#fff; box-shadow:0 0 0 2px var(--bg)}
  .senti .scale{display:flex; justify-content:space-between; font-size:10px; color:var(--dim)}
  .senti .mood{margin-top:14px; padding-top:14px; border-top:1px solid var(--line)}
  .senti .mood .lbl{font-size:11px; color:var(--dim); text-transform:uppercase; letter-spacing:.1em}
  .senti .mood b{font-size:16px; font-weight:700; color:var(--gold-2); display:block; margin-top:4px}
  .senti .mood p{font-size:14px; color:#C7D0DC; margin-top:6px; line-height:1.5}
  .senti .drv{display:flex; flex-wrap:wrap; gap:8px; margin-top:12px}
  .senti .drv span{font-size:12px; color:var(--muted); background:var(--panel-2); border:1px solid var(--line); padding:5px 10px; border-radius:99px}

  /* ========== RESPONSIVE ========== */
  @media (max-width:940px){
    .app{grid-template-columns:minmax(0,680px); justify-content:center}
    aside.side{display:none}
    .side.mobile{display:block; margin-top:8px}
  }
  @media (max-width:600px){
    .topbar .inner{gap:10px}
    .app{padding:0 12px 64px}
    .fb-row .nm{width:84px}
    .post .media{aspect-ratio:1/1}
  }
  @media (max-width:380px){ .logo .cl{display:none} .tnav{gap:8px} .ai-btn{padding:12px 14px} }
  @media (prefers-reduced-motion:reduce){ .gate .bgph,.hero-story img{animation:none} .net .st i,.pm-head .badge i{animation:none} .nmp-live i{animation:none} .gh-ringglow{animation:none} .core-btn,.sub-dot{animation:none} }

  /* ========== CLUB PULSE (wow first-screen) ========== */
  .nm-pulse{position:relative; margin:2px 0 26px; padding:20px 20px 16px; border-radius:16px; overflow:hidden;
    background:linear-gradient(150deg,rgba(59,130,246,.10),rgba(13,23,44,.6) 46%,rgba(11,18,33,.88)), url('assets/bg_poly_inner.png') center/cover no-repeat;
    border:1px solid rgba(77,163,255,.26); box-shadow:0 24px 60px rgba(0,0,0,.45)}
  .nm-pulse::before{content:""; position:absolute; inset:0; background:radial-gradient(120% 130% at 12% -10%, rgba(77,163,255,.16), transparent 55%); pointer-events:none}
  .nmp-top{position:relative; display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:12px}
  .nmp-kick{font-size:11px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; color:var(--gold-2)}
  .nmp-live{display:inline-flex; align-items:center; gap:6px; font-size:11px; font-weight:700; color:var(--green)}
  .nmp-live i{width:7px; height:7px; border-radius:50%; background:var(--green); animation:nmpls 1.8s infinite}
  @keyframes nmpls{0%{box-shadow:0 0 0 0 rgba(52,211,153,.55)}70%{box-shadow:0 0 0 7px rgba(52,211,153,0)}100%{box-shadow:0 0 0 0 rgba(52,211,153,0)}}
  .nmp-time{margin-left:auto; font-size:11px; color:var(--dim)}
  .nmp-h{position:relative; font-family:var(--serif); font-style:normal; font-weight:600; font-size:clamp(23px,4vw,34px); line-height:1.12; color:#fff; max-width:22ch; margin-bottom:4px}
  .nmp-sub{position:relative; font-size:13px; color:var(--muted); margin-bottom:16px; max-width:48ch}
  .nmp-grid{position:relative; display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-bottom:12px}
  @media (max-width:560px){ .nmp-grid{grid-template-columns:repeat(2,1fr)} }
  .nmp-tile{background:rgba(6,8,12,.5); border:1px solid var(--line); border-radius:14px; padding:12px 12px; min-width:0}
  .nmp-tl{font-size:10px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--dim); margin-bottom:6px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
  .nmp-tv{font-size:19px; font-weight:800; color:var(--ink); font-variant-numeric:tabular-nums; line-height:1.1}
  .nmp-td{font-size:11px; color:var(--muted); margin-top:3px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
  .nmp-cta{position:relative; display:flex; gap:8px; flex-wrap:wrap}
  .nmp-cta button{flex:none; border:1px solid rgba(77,163,255,.4); background:rgba(59,130,246,.08); color:var(--gold-2); font-size:13px; font-weight:700; padding:8px 16px; border-radius:99px; transition:.2s}
  .nmp-cta button:hover{background:var(--grad-brand); color:#fff; border-color:transparent}
  .nmp-disc{position:relative; margin-top:12px; font-size:11px; color:var(--dim); display:flex; gap:8px; align-items:flex-start; line-height:1.45}

  /* ========== CLUB TRACK-RECORD ========== */
  .nm-trk{position:relative; margin-top:12px; background:rgba(6,8,12,.45); border:1px solid var(--line); border-radius:16px; padding:14px 16px}
  .nm-trk-h{display:flex; align-items:baseline; gap:8px; margin-bottom:8px; flex-wrap:wrap}
  .nm-trk-h b{font-size:13px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--ink)}
  .nm-trk-h .sub{font-size:11px; color:var(--dim)}
  .nm-trk-big{margin-left:auto; text-align:right}
  .nm-trk-big b{font-family:var(--serif); font-style:normal; font-size:25px; font-weight:700; color:var(--green)}
  .nm-trk-big small{display:block; font-size:10px; color:var(--dim); letter-spacing:.03em}
  .nm-trk-row{display:flex; align-items:flex-start; gap:8px; padding:8px 0; border-top:1px solid var(--line-2)}
  .nm-trk-ic{flex:none; width:20px; height:20px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:800; margin-top:1px}
  .nm-trk-ic.ok{background:rgba(52,211,153,.16); color:var(--green)}
  .nm-trk-ic.pend{background:rgba(232,179,60,.16); color:#E8B33C}
  .nm-trk-tx{min-width:0; flex:1}
  .nm-trk-tx b{font-size:13px; font-weight:600; color:var(--ink); display:block; margin-bottom:1px}
  .nm-trk-tx small{font-size:11px; color:var(--muted); line-height:1.4}
  .nm-trk-p{flex:none; font-size:11px; font-weight:700; color:var(--dim); font-variant-numeric:tabular-nums; margin-top:1px}

  /* ========== SCROLL REVEAL (premium motion) ========== */
  .reveal{opacity:0; transform:translateY(10px); transition:opacity .55s cubic-bezier(.22,.61,.36,1), transform .55s cubic-bezier(.22,.61,.36,1)}
  .reveal.in{opacity:1; transform:none}
  @media (prefers-reduced-motion:reduce){ .reveal{opacity:1 !important; transform:none !important; transition:none} }

  /* ========== CRYPTO CHART NUMBERS ========== */
  .cx-chart{position:relative}
  .cx-hi,.cx-lo{position:absolute; right:6px; font-size:10px; font-weight:700; color:var(--muted); font-variant-numeric:tabular-nums; background:rgba(6,8,12,.6); padding:1px 6px; border-radius:6px; pointer-events:none; z-index:2}
  .cx-hi{top:4px} .cx-lo{bottom:4px}
  .cx-stats{display:flex; gap:8px; margin-top:10px}
  .cx-stats > div{flex:1; background:rgba(6,8,12,.45); border:1px solid var(--line); border-radius:11px; padding:8px 10px}
  .cx-stats small{display:block; font-size:10px; letter-spacing:.05em; text-transform:uppercase; color:var(--dim); margin-bottom:3px}
  .cx-stats b{font-size:14px; font-weight:800; color:var(--ink); font-variant-numeric:tabular-nums}

  /* ========== NANSEN-GRADE BOARDS (sport flagship + reusable) ========== */
  .sport-mod{margin:0 0 var(--s3)}
  .sport-modh{display:flex; align-items:baseline; gap:10px; margin-bottom:10px; flex-wrap:wrap}
  .sport-modh b{font-size:13px; font-weight:800; letter-spacing:.06em; text-transform:uppercase}
  .sport-modh .dim{font-size:11px; color:#E8D27C} /* board hints in yellow */
  .nmb-note{font-size:12px; color:var(--muted); background:rgba(59,130,246,.07); border:1px solid rgba(77,163,255,.2); border-left:2px solid var(--gold); border-radius:8px; padding:8px 12px; margin-bottom:10px; line-height:1.45}
  .nmb-note b{color:var(--gold-2)}
  .nmb-wrap{border:1px solid var(--line); border-top:2px solid var(--cat); border-radius:12px; overflow:hidden; background:var(--panel)}
  .nmb{width:100%; border-collapse:collapse; font-variant-numeric:tabular-nums}
  .nmb thead th{text-align:left; font-size:10px; font-weight:800; letter-spacing:.07em; text-transform:uppercase; color:var(--dim); padding:10px 12px; background:rgba(255,255,255,.02); border-bottom:1px solid var(--line); white-space:nowrap; user-select:none}
  .nmb th.r,.nmb td.r{text-align:right}
  .nmb th.nm-th-mkt{color:var(--green)} .nmb th.nm-th-own{color:var(--gold-2)}
  .nmb .nm-arr{font-size:9px; opacity:.9} .nmb .nm-arr.dim{opacity:.3}
  .nmb tbody td{padding:12px 12px; border-bottom:1px solid var(--line-2); font-size:13px; color:var(--ink); vertical-align:middle}
  .nmb tbody tr:nth-child(even){background:rgba(255,255,255,.015)}
  .nmb tbody tr:hover{background:rgba(77,163,255,.06)}
  .nmb tbody tr:last-child td{border-bottom:none}
  .nmb tr.nmb-xrow:hover{background:transparent}
  .nmb tr.nmb-xrow td.nmb-x{padding:0 10px 12px; border-bottom:1px solid var(--line-2)}
  .nmb tr.nmb-xrow .cx-detail.open{margin-top:4px}
  .nmb b{font-weight:700} .nmb b.mkt{color:var(--green)} .nmb .dim{color:var(--dim)}
  .nm-match b{display:block; font-weight:700; font-size:13px} .nm-match span{display:block; font-size:12px; color:var(--muted)} .nm-match small{display:block; font-size:11px; color:var(--dim); margin-top:2px}
  .nm-tip{display:flex; align-items:center; gap:8px; flex-wrap:wrap} .nm-tip b{color:var(--gold-2)}
  .conv{font-size:10px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; border:1px solid; border-radius:99px; padding:2px 8px; white-space:nowrap}
  .nmb-cap{display:flex; align-items:center; gap:6px; font-size:11px; color:rgba(208,184,134,.7); padding:8px 12px; background:rgba(0,0,0,.2); border-top:1px solid var(--line-2); line-height:1.45}
  .nm-tip-lnk b{display:block; font-weight:700; color:var(--ink)} .nm-tip-lnk small{display:block; font-size:11px; color:var(--dim)} .nm-tip-lnk:hover b{color:var(--gold-2)}
  .audit-badge{display:inline-flex; align-items:center; gap:4px; font-size:11px; font-weight:700; color:var(--green); background:rgba(52,211,153,.12); border:1px solid rgba(52,211,153,.3); border-radius:99px; padding:3px 8px}
  .audit-badge:hover{background:rgba(52,211,153,.2)}
  .nm-spark{width:64px; height:22px; display:inline-block; vertical-align:middle}
  .cx-detail-h{display:flex; justify-content:space-between; align-items:center; margin-bottom:10px}
  .cx-detail-h b{font-size:14px; font-weight:700}
  .cx-close{background:none; border:1px solid var(--line); color:var(--muted); border-radius:8px; width:28px; height:28px; font-size:13px; line-height:1}
  .cx-close:hover{color:var(--ink); border-color:rgba(255,255,255,.2)}
  .cx-detail.open{margin-top:12px; background:var(--panel-2); border:1px solid var(--line); border-radius:14px; padding:14px}
  /* Step 8: number-wins on WC favorites (bar -> 4px track, % is the hero glyph) */
  .fb-list .fb-row .bar{height:4px}
  .fb-list .fb-row .pct{font-size:15px; font-weight:800; font-variant-numeric:tabular-nums; color:var(--gold-2); min-width:48px; text-align:right}
  /* Step 9 (safe a11y subset): focus ring + catnav scroll-fade hint on mobile */
  :focus-visible{outline:2px solid var(--gold); outline-offset:2px; border-radius:6px}
  .match-hero{position:relative; border:1px solid rgba(46,204,143,.28); border-radius:18px; padding:18px 18px 14px; margin-bottom:18px; background:linear-gradient(150deg,rgba(46,204,143,.06),rgba(11,18,33,.92))}
  .mh-kick{font-size:11px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--gold-2); margin-bottom:8px}
  .mh-teams{display:flex; align-items:center; gap:12px; font-family:var(--serif); font-style:normal; font-size:clamp(20px,3.4vw,28px); color:#fff; line-height:1.1}
  .mh-teams i{font-style:normal; font-size:12px; color:var(--dim); font-family:var(--sans)}
  .mh-when{font-size:12px; color:var(--muted); margin:6px 0 12px}
  .mh-stats{display:flex; gap:8px; margin-bottom:12px; flex-wrap:wrap}
  .mh-s{flex:1; min-width:64px; background:rgba(6,8,12,.5); border:1px solid var(--line); border-radius:11px; padding:8px 10px}
  .mh-s small{display:block; font-size:10px; letter-spacing:.05em; text-transform:uppercase; color:var(--dim); margin-bottom:3px}
  .mh-s b{font-size:18px; font-weight:800; font-variant-numeric:tabular-nums} .mh-s b.mkt{color:var(--green)}
  .mh-tip{display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-size:13px} .mh-tip .own b{color:var(--gold-2)}
  .match-hero .nmb-cap{background:none; border-top:none; padding:8px 0 0}
  @media(max-width:720px){
    .nmb thead{position:absolute; left:-9999px}
    .nmb,.nmb tbody,.nmb tr,.nmb td{display:block; width:100%}
    .nmb tr{border-bottom:1px solid var(--line); padding:6px 0}
    .nmb tbody tr:nth-child(even){background:transparent}
    .nmb td{display:flex; justify-content:space-between; align-items:center; gap:12px; padding:8px 12px; border-bottom:none; text-align:right}
    .nmb td::before{content:attr(data-label); font-size:10px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--dim); text-align:left; flex:none}
    .nmb td.nolbl::before{content:none}
    .nmb td.nolbl{justify-content:flex-end}
    .nmb td.nmb-x{display:block; text-align:left; padding:0 8px 10px}
    .nmb td.nmb-x::before{content:none}
    .nmb tr.nmb-xrow{padding:0}
    .nm-match,.nm-tip-lnk{text-align:left} .nm-match b,.nm-match span,.nm-match small{text-align:left}
  }
/* ===== · interaction-states layer (additive, design-to-9 pass) ===== */
:focus-visible{outline:2px solid var(--gold-2); outline-offset:2px}
button:focus-visible,[role="button"]:focus-visible,a:focus-visible{outline:2px solid var(--gold-2); outline-offset:2px; border-radius:8px}
button,[role="button"]{transition:transform .12s ease, opacity .15s ease}
button:not(:disabled):active,[role="button"]:active{transform:scale(.985)}
button:disabled,[disabled],.disabled{opacity:.45; pointer-events:none}
/* iOS: input font-size <16px triggers auto-zoom on focus — mobile only, desktop look unchanged */
@media (max-width:720px){
  input[type="text"],input[type="email"],input[type="password"],input:not([type]),textarea{font-size:16px !important}
}
/* carousel dots: visual 7px, tap area 31px (mobile thumb) */
.gh-dots i{position:relative}
.gh-dots i::after{content:'';position:absolute;inset:-12px}
  /* "2 zápasy dňa · naša prognóza" — our Grok match forecasts (Round 2) */
  .mpv-grid{display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:4px 0 8px}
  .mpv{background:var(--surface); border:1px solid var(--hair); border-radius:14px; padding:14px 16px}
  .mpv-h{display:flex; justify-content:space-between; align-items:center; gap:8px; margin-bottom:8px}
  .mpv-sport{font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:#2ECC8F}
  .mpv-when{font-size:11px; color:var(--dim); font-variant-numeric:tabular-nums}
  .mpv-teams{font-size:15px; font-weight:700; color:#fff; line-height:1.25}
  .mpv-teams i{font-style:normal; color:var(--dim); font-weight:600; font-size:12px; margin:0 4px}
  .mpv-tip{display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-top:10px}
  .mpv-pick{font-size:13px; color:var(--muted)}
  .mpv-pick b{color:#fff; font-weight:800}
  .mpv-pct{font-size:13px; font-weight:800; color:#2ECC8F; font-variant-numeric:tabular-nums}
  .mpv-why{margin-top:8px; font-size:12.5px; color:#A9BCD8; line-height:1.5; padding-top:8px; border-top:1px solid var(--line-2)}
  @media(max-width:680px){ .mpv-grid{grid-template-columns:1fr} }

  /* Komodity & meny board (Wave 1, R3) */
  .komo-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin:4px 0 8px}
  .komo-t{background:var(--surface); border:1px solid var(--hair); border-radius:12px; padding:12px 14px}
  .komo-l{font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--dim)}
  .komo-v{font-size:18px; font-weight:800; color:var(--ink-max); margin-top:5px; font-variant-numeric:tabular-nums}
  .komo-s{font-size:11px; color:var(--muted); margin-top:3px; display:flex; gap:6px; align-items:center; font-variant-numeric:tabular-nums}
  @media(max-width:560px){ .komo-grid{grid-template-columns:repeat(2,1fr)} }

  /* Návody — USDT/USDC funding guide (R3): clean step-cards, our own walkthrough style */
  .groute{background:var(--gbg,var(--surface)); border:1px solid var(--hair); border-radius:14px; padding:14px 16px; margin-bottom:12px; position:relative; overflow:hidden}
  .groute::before{content:''; position:absolute; left:0; top:0; bottom:0; width:4px; background:var(--gc,#5B6FF5)}
  .grh{display:flex; align-items:center; gap:10px; margin-bottom:10px}
  .grh .grdot{width:10px; height:10px; border-radius:50%; background:var(--gc,#5B6FF5); box-shadow:0 0 10px var(--gc,#5B6FF5)}
  .grh .grlogo{flex:none; height:24px; display:inline-flex; align-items:center; justify-content:center}
  .grh .grlogo svg{display:block; border-radius:7px}
  .grh .grimg{height:24px; width:auto; display:block; object-fit:contain}
  .grh .grimg.wide{height:19px}
  .grh b{font-size:15px; color:#fff}
  .grh small{font-size:11px; color:var(--muted); margin-left:auto}
  .gstep{display:flex; gap:11px; align-items:flex-start; padding:8px 0; border-top:1px solid var(--line-2)}
  .gstep:first-of-type{border-top:none}
  .gn{flex:none; width:24px; height:24px; border-radius:50%; background:var(--gc,#5B6FF5); color:#08101F; font-size:12px; font-weight:800; display:flex; align-items:center; justify-content:center; margin-top:1px}
  .gn.i{background:rgba(232,179,60,.18); color:#E8B33C; font-style:normal}
  .gn.x{background:rgba(229,84,75,.18); color:#E5544B}
  .gtx{font-size:13px; line-height:1.55; color:#D7E2F2}
  .gtx b{color:#fff; font-weight:700}
  .groute.basics{--gc:#E8B33C}
  .gstep.warn .gtx{color:#F1C7A0}

  /* draggable rails — visible "you can swipe / drag on desktop" affordance (R3.1) */
  .aib-chips,.aib-cards,.aip-sgrow,.catnav,.subnav{cursor:grab; touch-action:pan-x}
  .aib-chips.dragging,.aib-cards.dragging,.aip-sgrow.dragging,.catnav.dragging,.subnav.dragging{cursor:grabbing; user-select:none}
  .aib-chips.dragging *,.aib-cards.dragging *,.aip-sgrow.dragging *,.catnav.dragging *,.subnav.dragging *{pointer-events:none}

  /* Siete — per-network reference rows (R3) */
  .gnet-row{padding:9px 0; border-top:1px solid var(--line-2)}
  .gnet-top{display:flex; align-items:center; gap:8px; flex-wrap:wrap}
  .gnet-top b{font-size:13.5px; color:#fff}
  .gnet-sub{font-size:11px; color:var(--muted)}
  .gnet-fee{margin-left:auto; font-size:10.5px; font-weight:700; border:1px solid; border-radius:99px; padding:2px 9px; white-space:nowrap}
  .gnet-d{font-size:12.5px; color:#C7D4E6; line-height:1.5; margin-top:3px}
  .gnet-d b{color:#fff}
  .gnet-coins{display:inline-block; font-weight:800; color:#7CC0FF; margin-right:7px; font-size:12px}
  .gnet-map{margin-top:11px; padding:11px 12px; background:#0B1326; border:1px solid var(--hair); border-radius:11px; display:flex; flex-direction:column; gap:8px}
  .gnet-mrow{display:flex; align-items:center; gap:9px; font-size:12.5px; color:#C7D4E6}
  .gnet-c{flex:none; font-size:11px; font-weight:800; border-radius:7px; padding:3px 9px; color:#08101F}
  .gnet-c.usdt{background:#26A17B}
  .gnet-c.usdc{background:#2775CA; color:#fff}

  /* ===== R3.3 TEST — liquid-glass on clickable, flat on non-clickable ===== */
  /* clickable shells get a soft sliding sheen on hover/active (iOS/Google "liquid glass") */
  .aib-chip,.aip-sug button,.lteaser,.ncard,.mk-ev,.pf-row,.mk-b,.bk-o,.catnav .chip.on,.subchip.on{position:relative; overflow:hidden}
  .aib-chip::after,.aip-sug button::after,.lteaser::after,.ncard::after,.mk-ev::after,.pf-row::after,.mk-b::after,.bk-o::after,.catnav .chip.on::after,.subchip.on::after{
    content:''; position:absolute; inset:0; border-radius:inherit; pointer-events:none; z-index:2;
    background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,.13) 50%,transparent 60%);
    transform:translateX(-130%); opacity:0; transition:transform .65s cubic-bezier(.4,0,.2,1), opacity .2s}
  .aib-chip:hover::after,.aip-sug button:hover::after,.lteaser:hover::after,.ncard:hover::after,.mk-ev:hover::after,.pf-row:hover::after,.mk-b:hover::after,.bk-o:hover::after,.catnav .chip.on:hover::after,.subchip.on:hover::after,
  .aib-chip:active::after,.lteaser:active::after,.ncard:active::after,.mk-ev:active::after,.pf-row:active::after,.mk-b:active::after,.bk-o:active::after{transform:translateX(130%); opacity:1}
  /* subtle glass tint on active nav / sub chip */
  .catnav .chip.on,.subchip.on{box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 2px 12px rgba(0,0,0,.28)}
  /* glass border on key clickable cards */
  .aib-chip,.lteaser,.bk-o,.mk-b{box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
  /* NON-clickable display cells → flat & transparent (blend into page bg, no "boxes") */
  .nmp-tile,.mpv,.komo-t,.aih-strip{background:transparent !important; border-color:transparent !important; box-shadow:none !important}
  .subchip:not(.on){background:transparent; border-color:transparent}

  /* ===== R3.3b — TANGIBLE tap feel (touch, no hover) + flatten ALL non-clickable cells ===== */
  /* press feedback on TAP — element presses in + cyan glow ring, so the click is FELT on mobile */
  .aib-chip:active,.aip-sug button:active,.lteaser:active,.ncard:active,.mk-ev:active,.mk-b:active,.bk-o:active,.bk-m:active,.pf-row:active,.core-btn:active,.catnav .chip:active,.subchip:active,.fc-vid:active,.edu-chip:active,.nmp-cta button:active,.gh:active,.mh-tip:active{
    transform:scale(.96) !important;
    box-shadow:0 0 0 1px rgba(56,189,248,.6),0 6px 22px rgba(56,189,248,.30),inset 0 1px 0 rgba(255,255,255,.16) !important}
  /* sheen sweep also on the match card + ensure smooth */
  .bk-m{position:relative; overflow:hidden}
  .bk-m::after{content:''; position:absolute; inset:0; border-radius:inherit; pointer-events:none; z-index:2; background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,.13) 50%,transparent 60%); transform:translateX(-130%); opacity:0; transition:transform .6s,opacity .2s}
  .bk-m:hover::after,.bk-m:active::after{transform:translateX(130%); opacity:1}
  /* clickable rest-state glass hint so it reads tappable even on scroll */
  .ncard,.mk-ev,.bk-m,.pf-row,.core-btn,.nmp-cta button{box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
  /* extend flatten — ALL non-clickable data cells transparent (keep ambient modules + branded guide cards) */
  .mh-s,.senti,.gauge,.ms,.nm-trk,.gnet-map,.educ-ex,.educ,.educ-intro,.panel,.cx-detail,.fc-vid{background:transparent !important; border-color:transparent !important; box-shadow:none !important}

  /* ===== R3.3c — Liquid-Glass feel (Apple-inspired, own CSS) + flatten per photos ===== */
  /* clickable cards/buttons = frosted glass: translucency + specular edges + light blur */
  .lteaser,.ncard,.mk-ev,.bk-m,.pf-row,.namebox button,.core-btn{
    backdrop-filter:blur(7px) saturate(1.12); -webkit-backdrop-filter:blur(7px) saturate(1.12);
    border:1px solid rgba(255,255,255,.10) !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.16), inset 0 -1px 0 rgba(0,0,0,.22), 0 3px 14px rgba(0,0,0,.22) !important}
  /* chips = specular glass (no heavy blur — they scroll) */
  .aib-chip,.aip-sug button,.mk-b,.bk-o,.catnav .chip.on,.subchip.on{
    box-shadow:inset 0 1px 0 rgba(255,255,255,.16), inset 0 -1px 0 rgba(0,0,0,.18) !important}
  /* PRESS = liquid "loupe" bloom: presses in + bright glass highlight + cyan lens glow (felt on touch) */
  .aib-chip:active,.aip-sug button:active,.lteaser:active,.ncard:active,.mk-ev:active,.mk-b:active,.bk-o:active,.bk-m:active,.pf-row:active,.core-btn:active,.catnav .chip:active,.subchip:active,.fc-vid:active,.edu-chip:active,.nmp-cta button:active,.namebox button:active,.stat:active{
    transform:scale(.965) !important;
    box-shadow:0 0 0 1px rgba(120,210,255,.75), 0 8px 26px rgba(56,189,248,.34), inset 0 1px 0 rgba(255,255,255,.55), inset 0 0 22px rgba(120,210,255,.22) !important;
    filter:brightness(1.12) !important}
  /* hero chips a touch bigger everywhere */
  .aib-chip{font-size:13.5px; padding:13px 16px}
  /* FLATTEN guide cards (photos 2-3): no outer shell, KEEP coloured left bar (::before) */
  .groute{background:transparent !important; box-shadow:none !important; border-color:transparent !important; padding-left:18px}
  .groute.basics{--gc:#E8B33C}
  /* FLATTEN Liga display cells (photo 4); clickable buttons keep their glass */
  .lprize,.pts,.stat{background:transparent !important; border-color:transparent !important; box-shadow:none !important}
  .covban{border-color:transparent !important}
  /* USDT 30/20/10 prizes: underline emphasis, NO outer pill */
  .lpz-p{background:transparent !important; padding:2px 1px 4px !important; border-radius:0 !important; border-bottom:2px solid currentColor}

  /* ===== R3.3d — compact flattened cells (no shells ⇒ tighter height, ) ===== */
  .lprize{padding:4px 2px 8px !important; margin:2px 0 10px !important}
  .lpz-row{margin-bottom:6px !important}
  .pts{padding:6px 2px !important; margin-bottom:10px !important}
  .stat{padding:6px 4px !important}
  .namebox{margin-bottom:10px !important}
  .mpv{padding:8px 2px 10px !important}
  .komo-t{padding:6px 4px !important}
  .nmp-tile{padding:6px 4px !important}
  .nmp-grid{gap:8px !important}
  .mh-s{padding:7px 4px !important}
  .educ{padding:8px 2px !important; margin-bottom:8px !important}
  .educ-ex{padding:8px 2px !important}
  .educ-intro{padding:6px 2px !important}
  .groute{padding:12px 4px 12px 16px !important}
  .gstep{padding:7px 0 !important}
  .gnet-map{padding:9px 2px !important}
  .senti,.ms{padding:6px 2px !important}

  /* Liga teaser — swipeable example bets (R3.3, ): tap → open Liga */
  .lt-betsl{font-size:10px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--dim); margin:8px 0 6px}
  .lt-bets{display:flex; gap:8px; overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch; cursor:grab; margin-bottom:10px; padding-bottom:2px; -webkit-mask-image:linear-gradient(90deg,#000 90%,transparent); mask-image:linear-gradient(90deg,#000 90%,transparent)}
  .lt-bets::-webkit-scrollbar{display:none}
  .lt-bet{flex:none; display:flex; flex-direction:column; gap:3px; align-items:flex-start; min-width:128px; max-width:170px; padding:9px 12px; border-radius:12px; background:rgba(255,255,255,.05); border:1px solid rgba(224,179,88,.28); cursor:pointer; text-align:left; box-shadow:inset 0 1px 0 rgba(255,255,255,.14)}
  .lt-bet .lt-bq{font-size:12px; font-weight:700; color:#EAF1FB; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:148px}
  .lt-bet .lt-bk{font-size:11px; font-weight:800; color:#E0B358; font-variant-numeric:tabular-nums}
  .lt-bet:active{transform:scale(.96); box-shadow:0 0 0 1px rgba(120,210,255,.7),0 6px 20px rgba(56,189,248,.3),inset 0 1px 0 rgba(255,255,255,.4); filter:brightness(1.1)}

  /* ===== R3.3e — NAV icons (delicate) + bigger nav chips + kill big-card "spark" (keep press) ===== */
  .catnav .chip{display:inline-flex; align-items:center; gap:7px; font-size:13.5px; padding:9px 15px}
  .nv-ic{width:15px; height:15px; flex:none; opacity:.62}
  .catnav .chip:hover .nv-ic{opacity:.9}
  .catnav .chip.on .nv-ic{opacity:1}
  @media(max-width:760px){ .catnav .chip{font-size:14px; padding:10px 16px; gap:8px} .nv-ic{width:16px; height:16px} }
  /* remove the sliding sheen from LARGE cards — keep only press feedback */
  .lteaser::after,.ncard::after,.mk-ev::after,.bk-m::after,.pf-row::after{display:none !important}

  /* ===== Subscription/payment + access gate (R3.3, ) ===== */
  .sub-plans-3{display:flex; flex-direction:column; gap:8px}
  .sub-plans-3 .sub-plan{display:flex; align-items:center; gap:10px; text-align:left; padding:11px 14px; flex-wrap:wrap}
  .sub-plans-3 .sub-plan .pn{flex:none; min-width:74px}
  .sub-plans-3 .sub-plan .pp{margin-left:auto; font-size:18px}
  .sub-plans-3 .sub-plan .pm{flex-basis:100%; order:3; font-size:10.5px; color:var(--muted)}
  .sub-plans-3 .sub-badge{order:-1}
  .sub-pm{font-size:11px; color:var(--muted); text-align:center; margin:10px 0 4px}
  .sub-pay{background:rgba(255,255,255,.04); border:1px solid var(--line); border-radius:12px; padding:12px 14px; margin:8px 0; text-align:left}
  .sub-payr{display:flex; justify-content:space-between; gap:10px; font-size:12.5px; padding:4px 0; color:var(--muted); align-items:center}
  .sub-payr b{color:#fff} .sub-payr code{color:#7CC0FF; font-size:11px; word-break:break-all; background:rgba(124,192,255,.08); padding:3px 7px; border-radius:6px}
  .sub-payhint{font-size:11px; color:var(--dim); margin-top:7px; line-height:1.5}
  .sub-txid{width:100%; background:var(--panel-2); border:1px solid var(--line); border-radius:10px; padding:11px 12px; color:var(--ink); font-size:13px; outline:none; margin-bottom:10px}
  .sub-txid:focus{border-color:var(--gold-2)}
  .sub-free.ok{color:#9ED0BC; border-color:rgba(46,204,143,.32)}
  .paywall{background:rgba(13,25,48,.62); border:1px solid rgba(77,163,255,.32); border-radius:16px; padding:18px 18px 16px; text-align:center; margin:6px 0 14px; box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
  .paywall .pw-ic{font-size:22px; margin-bottom:4px}
  .paywall b{font-size:16px; color:#fff; display:block}
  .paywall p{font-size:12.5px; color:var(--muted); line-height:1.55; margin:7px auto 12px; max-width:42ch}
  .pw-cta{background:var(--grad-brand); border:none; border-radius:12px; color:#fff; font-weight:800; font-size:14px; padding:12px 22px; cursor:pointer; box-shadow:0 6px 20px rgba(77,163,255,.3)}

  /* payment coin/network selector (R3.3) */
  .pay-sel{display:flex; align-items:center; gap:10px; margin:8px 0}
  .pay-l{font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--dim); min-width:46px}
  .pay-opts{display:flex; gap:7px; flex:1}
  .pay-opt{flex:1; font-size:12.5px; font-weight:700; color:var(--muted); background:var(--surface-2); border:1px solid var(--hair); border-radius:10px; padding:9px 6px; cursor:pointer; transition:.15s}
  .pay-opt.on{color:#fff; background:var(--grad-brand); border-color:transparent; box-shadow:inset 0 1px 0 rgba(255,255,255,.2)}
  .pay-opt:active{transform:scale(.96)}

  /* saved wallets in profile (R3.3) */
  .pf-wal{display:flex; align-items:center; justify-content:space-between; gap:10px; padding:8px 0; border-top:1px solid var(--line-2)}
  .pf-wal:first-of-type{border-top:none}
  .pf-wal code{font-size:12px; color:#7CC0FF; word-break:break-all}
  .pf-waln{font-size:11px; color:var(--muted); white-space:nowrap}

/* ===== GATE v2 — app visual language (unified auth; tokens from app Login.tsx) ===== */
/* card = app-login glass (rgba .75 + backdrop-blur-md) so the particle bg reads through */
.gate .gcard{background:rgba(13,20,33,.75); border:1px solid rgba(56,189,248,.10); border-radius:16px; padding:24px 22px 22px; backdrop-filter:blur(12px) saturate(120%); -webkit-backdrop-filter:blur(12px) saturate(120%); font-family:'Inter','Plus Jakarta Sans',sans-serif}
.gate .ghead{text-align:center; margin-bottom:12px}
.gate .glogo{display:block; width:140px; height:auto; margin:0 auto 4px; object-fit:contain; filter:drop-shadow(0 0 12px rgba(56,189,248,.4))}
.gate .gword{font-size:28px; font-weight:800; letter-spacing:.4px; background:linear-gradient(90deg,#38BDF8,#818CF8); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; line-height:1.15}
.gate .gword .gclub{font-family:'Cormorant Garamond',serif; font-weight:600; font-size:20px; -webkit-text-fill-color:#E0B358}
.gate .gsub{font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:2px; color:rgba(129,140,248,.75); margin-top:2px}
.gate .gbadges{display:flex; justify-content:center; gap:14px; margin-top:10px; font-size:11px; font-weight:600; letter-spacing:.02em}
.gate .gbadges .gb-ssl{color:#4ADE80}
.gate .gbadges .gb-2fa{color:#38BDF8}
.gate .gbadges .gb-mem{color:#FFB547}
.gate .gfield input{background:rgba(13,20,33,.6); border:1px solid rgba(56,189,248,.15); color:#E8F1FF}
.gate .gfield input:focus{border-color:rgba(56,189,248,.45); outline:none}
.gate .gbtn{background:linear-gradient(135deg,#38BDF8,#818CF8); font-weight:700}
.gate .gbtn:disabled{opacity:.55}
.gate .gtabs button.on{background:linear-gradient(135deg,#38BDF8,#818CF8); color:#fff}
.gmsg{margin:0 0 10px; padding:10px 12px; border-radius:10px; font-size:13px; line-height:1.45}
.gmsg.err{background:rgba(229,84,75,.12); border:1px solid rgba(229,84,75,.35); color:#FF9B94}
.gmsg.ok{background:rgba(74,222,128,.10); border:1px solid rgba(74,222,128,.3); color:#7DEFA8}
.gresend{margin-left:8px; background:none; border:none; color:#38BDF8; font-weight:700; cursor:pointer; text-decoration:underline; font-size:12px}

/* ===== iOS FLOATING GLASS TAB BAR (mobile) — ===== */
.mobnav{display:none}
@media (max-width:720px){
  .mobnav{
    display:flex; align-items:center; position:fixed; z-index:60;
    bottom:calc(12px + env(safe-area-inset-bottom,0px)); left:50%; transform:translateX(-50%);
    width:calc(100% - 24px); max-width:520px; height:58px; padding:0;
    border-radius:24px; border:1px solid rgba(255,255,255,.10);
    background:linear-gradient(180deg,rgba(15,23,38,.66),rgba(11,17,29,.84));
    backdrop-filter:blur(24px) saturate(180%); -webkit-backdrop-filter:blur(24px) saturate(180%);
    box-shadow:0 14px 42px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.10);
    overflow:hidden;
  }
  .mn-pill{position:absolute; top:6px; bottom:6px; left:0; padding:0 7px; pointer-events:none; box-sizing:border-box;
    transition:transform .42s cubic-bezier(.34,1.56,.64,1), opacity .2s ease}
  .mn-pill i{display:block; width:100%; height:100%; border-radius:16px;
    background:linear-gradient(180deg,rgba(56,189,248,.20),rgba(124,106,251,.14));
    border:1px solid rgba(56,189,248,.30); box-shadow:0 0 16px rgba(56,189,248,.26), inset 0 1px 0 rgba(255,255,255,.25)}
  .mn-tab{flex:1; position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; gap:2px;
    background:none; border:none; cursor:pointer; padding:6px 0; color:#7E92AE; font-size:10px; font-weight:600; letter-spacing:.2px; transition:color .25s ease}
  .mn-tab .nv-ic{width:21px; height:21px; opacity:.6; transition:opacity .3s ease, transform .36s cubic-bezier(.34,1.56,.64,1), filter .3s ease}
  .mn-tab.on{color:#7CC4FF}
  .mn-tab.on .nv-ic{opacity:1; transform:translateY(-1px) scale(1.08); filter:drop-shadow(0 0 6px rgba(56,189,248,.6))}
  .mn-tab:active{transform:scale(.95)}
  /* breathing room so the floating bar never covers the last content / footer */
  .app{padding-bottom:84px}
  .mfoot{margin-bottom:78px}
}
@media (max-width:720px) and (prefers-reduced-motion:reduce){
  .mn-pill,.mn-tab .nv-ic{transition:none}
}

/* ===== themed shortcut cards (ComfyUI bg) — ===== */
.nmsc-rail{display:flex; gap:10px; overflow-x:auto; scrollbar-width:none; padding:2px 0 4px; margin-bottom:14px; -webkit-overflow-scrolling:touch; cursor:grab}
.nmsc-rail::-webkit-scrollbar{display:none}
.nmsc-rail.dragging{cursor:grabbing}
.nmsc{flex:none; width:142px; height:86px; position:relative; border-radius:16px; overflow:hidden; border:1px solid rgba(255,255,255,.10); cursor:pointer; padding:0; background:#0B1326; box-shadow:0 6px 18px rgba(0,0,0,.32); transition:transform .18s ease, box-shadow .18s ease}
.nmsc::before{content:''; position:absolute; inset:0; background:var(--cbg) center/cover no-repeat; opacity:.92}
.nmsc-ov{position:absolute; inset:0; background:linear-gradient(180deg, rgba(6,10,20,.04) 0%, rgba(6,10,20,.74) 100%)}
.nmsc-tx{position:absolute; left:11px; right:11px; bottom:9px; text-align:left; z-index:1; display:block}
.nmsc-tx b{display:block; font-size:14px; font-weight:800; color:#fff; text-shadow:0 1px 6px rgba(0,0,0,.65)}
.nmsc-tx small{display:block; font-size:10.5px; color:rgba(232,240,252,.85); margin-top:1px; text-shadow:0 1px 4px rgba(0,0,0,.6)}
.nmsc:active{transform:scale(.97); box-shadow:0 0 0 1px rgba(120,210,255,.6), 0 10px 26px rgba(56,189,248,.28)}
.nmsc-rail.dragging *{pointer-events:none}

/* payment: coin-vs-network warning */
.sub-paywarn{margin-top:8px; font-size:12px; line-height:1.5; color:#F1C7A0; background:rgba(232,179,60,.08); border:1px solid rgba(232,179,60,.28); border-radius:10px; padding:9px 11px}
.sub-paywarn b{color:#FFD79A}
/* gate background = app login bg.jpg (one ecosystem visual language, ) */
/* background = app-login 1:1: full bg image (no fade, no zoom) + flat rgba(6,11,20,.7) overlay */
.gate{background:#050B18}
.gate .bgph{opacity:1; transform:none; animation:none}
.gate .gov{background:rgba(6,11,20,.7)}