*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{scroll-behavior:smooth}
::selection{background:rgba(255,51,102,.2);color:var(--t)}
:root{--bg:#06080f;--c:#0a0f1a;--bd:rgba(255,255,255,0.04);--bd2:rgba(255,255,255,0.08);--t:#eaedf5;--t2:#7e849e;--t3:#3d4260;--g:#2DDE98;--gbg:rgba(45,222,152,0.06);--gb:rgba(45,222,152,0.14);--b:#06B6D4;--bbg:rgba(6,182,212,0.06);--a:#FFC837;--abg:rgba(255,200,55,0.06);--r:#FF3366;--rbg:rgba(255,51,102,0.06);--m:'JetBrains Mono',monospace;--glow:0 0 60px rgba(255,51,102,.06);--accent:#FF3366;--accent2:#FF6B35;--accent3:#FFC837;--accent4:#2DDE98;--card:rgba(10,15,28,0.75);--glass:rgba(255,255,255,0.02);--radius:16px;--radius-sm:10px;--transition:all .25s cubic-bezier(.4,0,.2,1);--neon:0 0 12px rgba(255,51,102,.15);--rainbow:linear-gradient(135deg,#FF3366,#FF6B35,#FFC837,#2DDE98,#06B6D4,#2563EB,#A855F7)}
body{background:var(--bg);color:var(--t);font-family:'Plus Jakarta Sans',sans-serif;min-height:100vh;background-image:radial-gradient(ellipse at 10% 0%,rgba(139,92,246,.05) 0%,transparent 50%),radial-gradient(ellipse at 90% 100%,rgba(56,189,248,.04) 0%,transparent 50%),radial-gradient(ellipse at 50% 50%,rgba(45,222,152,.015) 0%,transparent 60%),radial-gradient(circle at 80% 20%,rgba(244,63,94,.02) 0%,transparent 40%);background-attachment:fixed;-webkit-font-smoothing:antialiased}
/* Noise overlay */
body::before{content:'';position:fixed;inset:0;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.015'/%3E%3C/svg%3E");pointer-events:none;z-index:0;opacity:.6}
::-webkit-scrollbar{width:5px}::-webkit-scrollbar-thumb{background:rgba(255,51,102,.15);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:rgba(255,51,102,.3)}::-webkit-scrollbar-track{background:transparent}
.ctr{max-width:1440px;margin:0 auto;padding:0 24px}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
/* ===== REDESIGNED APP HEADER ===== */
.hd{padding:14px 0;padding-top:calc(14px + env(safe-area-inset-top,0px));display:flex;align-items:center;justify-content:space-between;gap:12px;position:sticky;top:0;z-index:100;background:rgba(6,8,15,.85);backdrop-filter:blur(20px);border-bottom:1px solid var(--bd);margin:0 -24px;padding-left:max(24px,env(safe-area-inset-left,24px));padding-right:max(24px,env(safe-area-inset-right,24px))}
.hd::after{content:'';position:absolute;bottom:-1px;left:0;right:0;height:1px;background:var(--rainbow);opacity:.15}
.logo{display:flex;align-items:center;gap:12px;text-decoration:none;flex-shrink:0}
.li{width:44px;height:44px;border-radius:14px;overflow:hidden;box-shadow:0 4px 20px rgba(255,51,102,.2);position:relative;flex-shrink:0;transition:transform .3s,box-shadow .3s}
.li:hover{transform:scale(1.05);box-shadow:0 6px 28px rgba(255,51,102,.3)}
.li svg{width:100%;height:100%;display:block}
@keyframes logoShine{0%,100%{transform:translateX(-100%)}50%{transform:translateX(100%)}}
.lt{font-size:22px;font-weight:800;letter-spacing:-1px}.lt span{background:var(--rainbow);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.bg{display:inline-flex;padding:3px 10px;border-radius:6px;font-size:10px;font-weight:600;white-space:nowrap;letter-spacing:.4px;backdrop-filter:blur(4px)}
.bg-g{background:rgba(45,222,152,0.08);color:var(--g);border:1px solid rgba(45,222,152,.18)}
.bg-b{background:rgba(107,159,255,0.08);color:var(--b);border:1px solid rgba(107,159,255,.18)}
.bg-a{background:rgba(255,202,58,0.08);color:var(--a);border:1px solid rgba(255,202,58,.18)}
.bg-r{background:rgba(255,77,106,0.08);color:var(--r);border:1px solid rgba(255,77,106,.18)}
.bg-m{background:rgba(255,255,255,.025);color:var(--t2);border:1px solid var(--bd)}
.bk{display:flex;align-items:center;gap:10px;padding:8px 14px;background:rgba(255,255,255,.02);border-radius:12px;border:1px solid var(--bd);backdrop-filter:blur(16px);position:relative;z-index:100}
.bk-label{font-size:10px;color:var(--t3);text-transform:uppercase;letter-spacing:1.2px;font-weight:700}
.bk-val{font-size:17px;font-weight:700;font-family:var(--m);color:var(--g);text-shadow:var(--neon)}
.bk-pnl{font-size:13px;font-weight:700;font-family:var(--m)}
.bk-pnl.pos{color:var(--g)}.bk-pnl.neg{color:var(--r)}
.bk-hist{display:flex;gap:3px;align-items:flex-end;height:26px}
.bk-bar{width:4px;border-radius:2px;min-height:2px;transition:height .3s}
.bk-bar.w{background:var(--g)}.bk-bar.l{background:var(--r)}
/* ===== REDESIGNED TABS ===== */
.tabs{display:flex;gap:4px;padding:16px 0 0;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tab{padding:9px 16px;border-radius:50px;font-size:12px;font-weight:500;border:1px solid transparent;white-space:nowrap;display:flex;align-items:center;gap:6px;transition:var(--transition);position:relative}
.tab.on{background:linear-gradient(135deg,#FF3366,#FF6B35);color:#fff;font-weight:700;box-shadow:0 4px 16px rgba(255,51,102,.25);border-color:transparent}
.tab.on::after,.tab.on::before{display:none}
.tab:not(.on){color:var(--t3)}
.tab:not(.on):hover{color:var(--t2);background:rgba(255,255,255,.04);border-color:var(--bd2)}
/* ===== REDESIGNED FILTERS ===== */
.flt{display:flex;gap:6px;padding:14px 0 0;flex-wrap:wrap;align-items:center}
.fb{padding:7px 14px;border-radius:50px;font-size:11px;font-weight:600;border:1px solid var(--bd2);transition:var(--transition);letter-spacing:.3px}
.fb.on{background:rgba(255,51,102,.1);border-color:rgba(255,51,102,.25);color:var(--accent)}
.fb:not(.on){color:var(--t3)}
.fb:not(.on):hover{border-color:var(--bd2);color:var(--t2);background:rgba(255,255,255,.03)}
/* Region filter bar */
.rgn{display:flex;align-items:center;gap:6px;padding:10px 0 0;flex-wrap:wrap}
.rgn-tab{padding:6px 14px;border-radius:50px;font-size:11px;font-weight:600;border:1px solid var(--bd2);transition:var(--transition);letter-spacing:.3px;cursor:pointer;background:transparent;color:var(--t3)}
.rgn-tab.on{background:linear-gradient(135deg,rgba(45,222,152,.15),rgba(91,140,255,.1));border-color:rgba(45,222,152,.3);color:var(--g);font-weight:700}
.rgn-tab:not(.on):hover{border-color:var(--bd2);color:var(--t2);background:rgba(255,255,255,.03)}
.rgn-hint{font-size:10px;color:var(--t3);margin-left:4px;font-style:italic}
@media(max-width:480px){.rgn-hint{display:none}}
.sel{padding:7px 14px;border-radius:8px;font-size:11px;background:var(--c);border:1px solid var(--bd);color:var(--t2);outline:none;margin-left:auto;font-weight:500}
.mn{display:grid;grid-template-columns:1fr 340px;gap:20px;padding:20px 0 60px;align-items:start}
.mn.fl{grid-template-columns:1fr}
.ct{display:flex;flex-direction:column;gap:10px;min-width:0}
.rh{display:grid;grid-template-columns:40px 1fr 70px 58px 50px 50px 34px;gap:6px;padding:6px 14px;font-size:9px;color:var(--t3);text-transform:uppercase;letter-spacing:1px;font-weight:700}
.rw{background:var(--card);border-radius:18px;border:1px solid var(--bd);overflow:hidden;animation:fi .4s cubic-bezier(.4,0,.2,1) both;transition:all .3s cubic-bezier(.4,0,.2,1);backdrop-filter:blur(8px)}
.rw:hover{border-color:rgba(255,51,102,.12);box-shadow:0 8px 30px rgba(0,0,0,.15),0 0 20px rgba(255,51,102,.03);transform:translateY(-3px)}
.rm{display:grid;grid-template-columns:40px 1fr 70px 58px 50px 50px 34px;gap:6px;padding:12px 14px;align-items:center;cursor:pointer;transition:background .2s}
.rm:hover{background:rgba(255,255,255,.02)}
.rn{width:30px;height:30px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;font-family:var(--m)}
.rs{background:rgba(76,232,162,.12);color:var(--g);border:1px solid rgba(76,232,162,.3)}
.ra{background:rgba(106,160,255,.12);color:var(--b);border:1px solid rgba(106,160,255,.3)}
.rb{background:rgba(255,184,77,.12);color:var(--a);border:1px solid rgba(255,184,77,.3)}
.rc{background:rgba(255,255,255,.04);color:var(--t3);border:1px solid var(--bd)}
.dt{padding:0 14px 16px;border-top:1px solid var(--bd)}
.ds{display:grid;grid-template-columns:repeat(5,1fr);gap:7px;margin:14px 0}
.sb{background:rgba(255,255,255,.02);border-radius:var(--radius-sm);padding:10px 6px;text-align:center;transition:var(--transition);border:1px solid var(--bd);position:relative;overflow:hidden}
.sb::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% 0%,rgba(255,51,102,.04),transparent 70%);pointer-events:none;opacity:0;transition:opacity .3s}
.sb:hover{background:rgba(255,255,255,.035);transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.1)}.sb:hover::before{opacity:1}
.sl{font-size:9px;color:var(--t3);text-transform:uppercase;letter-spacing:.7px;margin-bottom:4px;font-weight:600}
.sv{font-size:17px;font-weight:700;font-family:var(--m)}
.ax{background:rgba(255,255,255,.015);border-radius:var(--radius-sm);padding:14px;margin-top:10px;border:1px solid var(--bd);backdrop-filter:blur(4px)}
.at{font-size:12px;font-weight:700;margin-bottom:8px;display:flex;align-items:center;gap:6px}
.atx{font-size:12.5px;line-height:1.8;color:var(--t2)}
.af{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:10px}
.fc{display:flex;align-items:center;justify-content:space-between;padding:6px 10px;background:rgba(255,255,255,.015);border-radius:8px;font-size:11px;transition:var(--transition)}
.fc:hover{background:rgba(255,255,255,.03)}
.fn{color:var(--t2)}.fbar{width:55px;height:4px;border-radius:2px;background:rgba(255,255,255,.05);margin:0 7px;overflow:hidden}.ffl{height:100%;border-radius:2px;transition:width .6s cubic-bezier(.4,0,.2,1)}.fv{font-weight:600;font-family:var(--m);min-width:26px;text-align:right}
.lg{display:flex;align-items:center;gap:7px;margin:10px 0}.lgl{font-size:11px;color:var(--t3)}
.gc{width:30px;height:26px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:600;font-family:var(--m)}
.gc.h{background:var(--gbg);color:var(--g)}.gc.ms{background:var(--rbg);color:var(--r)}
.ab{width:30px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;border:1px solid var(--bd2);font-size:15px;color:var(--t3);transition:all .15s}
.ab:hover{border-color:var(--g);color:var(--g)}.ab.in{background:var(--gbg);border-color:var(--gb);color:var(--g)}
.cd{background:var(--card);border-radius:20px;border:1px solid var(--bd);padding:20px;transition:all .35s cubic-bezier(.4,0,.2,1);backdrop-filter:blur(12px);position:relative;overflow:hidden}
.cd::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:var(--rainbow);opacity:0;transition:opacity .3s}
.cd:hover{border-color:rgba(255,51,102,.15);box-shadow:0 12px 40px rgba(0,0,0,.2),0 0 30px rgba(255,51,102,.03);transform:translateY(-4px)}
.cd:hover::before{opacity:1}
.bb{display:flex;justify-content:space-between;align-items:center;padding:9px 12px;border-radius:var(--radius-sm);border:1px solid var(--bd);background:rgba(255,255,255,.01);transition:var(--transition);font-size:12px;width:100%}
.bb:hover{border-color:rgba(255,51,102,.15);background:rgba(255,51,102,.03);transform:translateY(-1px);box-shadow:0 2px 10px rgba(0,0,0,.1)}.bb.s{border-color:var(--gb);background:var(--gbg);box-shadow:0 0 15px rgba(45,222,152,.05)}
.par{background:var(--card);border-radius:var(--radius);border:1px solid var(--bd);padding:16px;position:sticky;top:16px;z-index:50;backdrop-filter:blur(16px);box-shadow:0 4px 20px rgba(0,0,0,.15)}
.tl{display:flex;gap:14px;justify-content:center;margin-top:16px;font-size:11px}
.ti{display:flex;align-items:center;gap:5px}
.td{width:18px;height:18px;border-radius:5px;display:flex;align-items:center;justify-content:center;font-size:9px;font-weight:700}
/* Tracker */
.trk{background:var(--card);border-radius:var(--radius);border:1px solid var(--bd);padding:18px;margin-bottom:16px;backdrop-filter:blur(12px);position:relative;overflow:hidden}
.trk::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,51,102,.15),rgba(45,222,152,.1),transparent)}
.trk-hd{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.trk-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:14px}
.trk-box{background:rgba(255,255,255,.02);border-radius:var(--radius-sm);padding:12px 8px;text-align:center;border:1px solid var(--bd);transition:var(--transition)}
.trk-box:hover{border-color:rgba(255,51,102,.1);transform:translateY(-1px)}
.trk-history{max-height:220px;overflow-y:auto}
.trk-row{display:flex;align-items:center;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--bd);font-size:12px;transition:background .15s}
.trk-row:hover{background:rgba(255,255,255,.01)}
.trk-row:last-child{border:none}
.trk-w{color:var(--g);font-weight:700}.trk-l{color:var(--r);font-weight:700}
@keyframes fi{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(max-width:900px){.mn{grid-template-columns:1fr}.rh,.rm{grid-template-columns:34px 1fr 58px 48px 38px}.rh span:nth-child(6),.rm>div:nth-child(6){display:none}.ds{grid-template-columns:repeat(3,1fr)}.trk-grid{grid-template-columns:repeat(2,1fr)}}
/* Theme toggle */
body.light{--bg:#f5f5f0;--c:#ffffff;--card:rgba(255,255,255,.9);--bd:rgba(0,0,0,0.04);--bd2:rgba(0,0,0,0.08);--t:#0f1729;--t2:#4a5070;--t3:#8890a8;--gbg:rgba(45,222,152,0.08);--gb:rgba(45,222,152,0.15);--g:#0fa968;--bbg:rgba(6,150,180,0.08);--b:#0596b4;--abg:rgba(200,160,0,0.08);--a:#c8a000;--rbg:rgba(220,30,70,0.08);--r:#dc1e46;--glow:0 0 30px rgba(255,51,102,.04);--accent:#e02858;--accent2:#e05a28;--accent3:#d4a800;--accent4:#1ab87a;--glass:rgba(0,0,0,.01);--neon:none;--rainbow:linear-gradient(135deg,#e02858,#e05a28,#d4a800,#1ab87a,#0596b4,#1d4ed8,#9333ea)}
body.light::before{opacity:.03}
body.light{background-image:radial-gradient(ellipse at 10% 0%,rgba(139,92,246,.04) 0%,transparent 50%),radial-gradient(ellipse at 90% 100%,rgba(99,102,241,.03) 0%,transparent 50%)}
body.light .cd{box-shadow:0 1px 12px rgba(0,0,0,.05)}
body.light .rw{box-shadow:0 1px 8px rgba(0,0,0,.04)}
body.light .cd::before{opacity:.3}
body.light .trk::before{background:linear-gradient(90deg,transparent,rgba(139,92,246,.12),rgba(0,180,100,.08),transparent)}
.thm{width:36px;height:36px;border-radius:var(--radius-sm);border:1px solid var(--bd);display:flex;align-items:center;justify-content:center;font-size:16px;cursor:pointer;background:var(--card);transition:var(--transition);backdrop-filter:blur(8px)}
.thm:hover{border-color:rgba(255,51,102,.2);background:rgba(255,51,102,.05);transform:scale(1.05)}
/* Notifications */
.notif-bell{position:relative;width:36px;height:36px;border-radius:var(--radius-sm);border:1px solid var(--bd);display:flex;align-items:center;justify-content:center;font-size:16px;cursor:pointer;background:var(--card);transition:var(--transition);backdrop-filter:blur(8px)}
.notif-bell:hover{border-color:var(--gb);background:var(--gbg);transform:scale(1.05)}
.notif-dot{position:absolute;top:4px;right:4px;width:8px;height:8px;border-radius:50%;background:var(--r);box-shadow:0 0 6px rgba(255,77,106,.5)}
.notif-panel{position:absolute;top:46px;right:0;width:380px;max-height:460px;overflow-y:auto;background:var(--card);border:1px solid var(--bd2);border-radius:var(--radius);padding:16px;z-index:10000;display:none;box-shadow:0 16px 50px rgba(0,0,0,.5),0 0 40px rgba(255,51,102,.03);backdrop-filter:blur(20px)}
.notif-panel.show{display:block;animation:notifIn .25s cubic-bezier(.4,0,.2,1)}
@keyframes notifIn{from{opacity:0;transform:translateY(-6px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
.notif-item{padding:10px 0;border-bottom:1px solid var(--bd);font-size:12px;transition:background .15s}
.notif-item:hover{background:rgba(255,255,255,.01)}
.notif-item:last-child{border:none}
/* Notes */
.note-area{width:100%;padding:10px 12px;border-radius:var(--radius-sm);border:1px solid var(--bd);background:rgba(255,255,255,.015);color:var(--t);font-size:12px;font-family:inherit;resize:vertical;min-height:40px;margin-top:8px;transition:border-color .2s;outline:none}
.note-area:focus{border-color:rgba(255,51,102,.2)}
/* Search */
.search-bar{width:100%;padding:10px 14px 10px 38px;border-radius:var(--radius-sm);border:1px solid var(--bd);background:rgba(255,255,255,.02);color:var(--t);font-size:14px;font-family:inherit;outline:none;transition:var(--transition)}
.search-bar:focus{border-color:rgba(255,51,102,.25);box-shadow:0 0 20px rgba(255,51,102,.05)}
.search-wrap{position:relative;flex:1;min-width:180px}
.search-wrap::before{content:'🔍';position:absolute;left:12px;top:50%;transform:translateY(-50%);font-size:14px}
/* Favorites */
.fav-star{font-size:16px;cursor:pointer;filter:grayscale(1) opacity(.4);transition:all .15s}
.fav-star.on{filter:none}
/* Chart */
.chart-svg{width:100%;height:120px;display:block}
/* Live indicator */
.live-dot{width:8px;height:8px;border-radius:50%;background:#ff4444;display:inline-block;animation:livePulse 1.5s infinite;box-shadow:0 0 8px rgba(255,68,68,.4)}
@keyframes livePulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.3;transform:scale(.85)}}
/* Score display */
.live-score{font-size:20px;font-weight:800;font-family:var(--m);color:var(--g);letter-spacing:1px;text-shadow:0 0 16px rgba(45,222,152,.2)}
/* PDF */
@media print{body{background:#fff!important;color:#000!important}.hd,.tabs,.flt,.par,.ab,.bb,.notif-bell,.thm,.search-wrap{display:none!important}.mn{display:block!important}.cd,.rw{break-inside:avoid;border-color:#ddd!important}.bg{border-color:#ccc!important}}
/* Better mobile */
@media(max-width:600px){
  .ctr{padding:0 8px}
  /* Compact header: logo + essential buttons only, secondary hidden in menu */
  .hd{gap:6px;flex-wrap:nowrap;padding:8px 12px;align-items:center}
  .bk{gap:4px;padding:6px 8px;flex-wrap:nowrap;overflow:hidden}
  /* Hide secondary header items on mobile — moved to hamburger menu */
  .bk .bk-hist,
  .bk #lastUpdate,
  .bk #autoLiveBtn,
  .bk #quotaBadge{display:none!important}
  .bk>div{font-size:10px}
  .logo .li{width:34px;height:34px;border-radius:10px}
  .logo .lt{font-size:16px!important}
  .logo .lt span{font-size:16px!important}
  /* Compact bankroll display */
  .bk-val{font-size:13px!important}
  .bk-pnl{font-size:10px!important}
  .tabs{gap:2px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:4px}
  .tabs::-webkit-scrollbar{display:none}
  .tab{font-size:11px;padding:8px 12px;white-space:nowrap;flex-shrink:0;border-radius:10px}
  .cd{padding:12px;border-radius:14px}
  .mn{grid-template-columns:1fr!important;padding:12px 0 80px}
  .search-bar{font-size:14px;padding:10px 12px 10px 36px;border-radius:12px}
  .float-slip{bottom:72px;left:0;right:0;width:100%;transform:none;padding:14px 16px;border-radius:18px 18px 0 0;flex-wrap:wrap}
  .sb{padding:10px 8px}
  .sb .sv{font-size:18px!important}
  .auth-box{padding:24px 18px;border-radius:18px;max-width:100%;margin:0 8px}
  .pricing-card{padding:18px}
  .rw{border-radius:12px}
  .rw:hover{transform:none;box-shadow:none}
  .cd:hover{transform:none}
  .ds{grid-template-columns:repeat(2,1fr)!important;gap:6px!important}
  .user-pill{padding:4px 8px!important;font-size:11px!important}
  footer{padding:16px 0 10px}
  footer>div>div:first-child>div:last-child{display:none}
  /* Touch targets: 44px minimum per Apple HIG */
  .fb{padding:10px 14px!important;font-size:12px!important;min-height:44px}
  .bg{padding:4px 8px!important;font-size:10px!important}
  button{min-height:44px}
  .thm{width:40px;height:40px;min-height:40px}
  .notif-bell{width:40px;height:40px;min-height:40px}
  .ab{width:44px;height:44px;border-radius:12px;font-size:18px}
  .fav-star{font-size:20px;padding:4px}
  /* Better grids on mobile */
  [style*="grid-template-columns:repeat(3"]{grid-template-columns:repeat(2,1fr)!important}
  [style*="grid-template-columns:repeat(4"]{grid-template-columns:repeat(2,1fr)!important}
  /* Readable text */
  h2{font-size:20px!important}
  /* Notifications panel — fit screen */
  .notif-panel{width:calc(100vw - 16px)!important;max-width:380px;right:-60px}
  /* User menu — fit screen */
  #userMenu{right:-8px!important;min-width:200px!important;max-width:calc(100vw - 16px)}
  /* Odds grid: horizontal scroll with hint */
  .og-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;position:relative}
  .og-wrap::-webkit-scrollbar{display:none}
  .og-grid{min-width:max-content}
  /* Filters: horizontal scroll on mobile */
  .flt{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;gap:4px;padding:10px 0}
  .flt::-webkit-scrollbar{display:none}
  .flt .fb{flex-shrink:0}
  .flt .search-wrap{min-width:160px;flex-shrink:0}
  /* Reduce card hover effects — no hover on touch */
  .rw:active{background:rgba(255,255,255,.02)}
  .cd:active{border-color:rgba(255,51,102,.15)}
  /* Analysis panel expand for mobile */
  .analysis-panel.open{max-height:600px}
  /* Tracker grid compact */
  .trk-grid{grid-template-columns:repeat(2,1fr)!important;gap:6px}
  .trk{padding:12px}
}
@media(max-width:380px){
  .tab{font-size:10px;padding:6px 8px}
  .cd{padding:10px}
  .sb{padding:8px 4px}
  .auth-box{padding:20px 14px}
  .logo .li{width:28px;height:28px;border-radius:8px}
  .bk{padding:4px 6px}
}
/* Floating bet slip */
.float-slip{position:fixed;bottom:16px;left:50%;transform:translateX(-50%);width:min(620px,calc(100% - 32px));background:var(--card);border:1px solid var(--gb);border-radius:20px;padding:16px 20px;z-index:1000;box-shadow:0 -4px 40px rgba(0,0,0,.5),0 0 60px rgba(45,222,152,.06),inset 0 1px 0 rgba(255,255,255,.04);backdrop-filter:blur(20px);display:none;animation:slideUp .35s cubic-bezier(.4,0,.2,1)}
.float-slip.show{display:flex;align-items:center;gap:14px}
@keyframes slideUp{from{transform:translateX(-50%) translateY(24px);opacity:0}to{transform:translateX(-50%) translateY(0);opacity:1}}
/* Tab transitions */
#C{transition:opacity .2s cubic-bezier(.4,0,.2,1);min-height:200px}
#C.loading{opacity:.3;pointer-events:none;filter:blur(1px)}
/* Skeleton loading */
@keyframes shimmer{0%{background-position:-300px 0}100%{background-position:300px 0}}
.skel{border-radius:var(--radius-sm);background:linear-gradient(90deg,rgba(255,255,255,.015) 25%,rgba(255,255,255,.04) 50%,rgba(255,255,255,.015) 75%);background-size:600px 100%;animation:shimmer 2s infinite linear}
.skel-card{height:180px;margin-bottom:10px;border-radius:var(--radius)}
.skel-row{height:48px;margin-bottom:6px}
.skel-stat{height:70px}
/* LIVE pulse */
@keyframes livePulse{0%,100%{opacity:1}50%{opacity:.4}}
.live-dot{width:8px;height:8px;border-radius:50%;background:var(--r);display:inline-block;animation:livePulse 1.2s infinite;margin-right:4px}
.live-badge{display:inline-flex;align-items:center;gap:3px;padding:2px 8px;border-radius:6px;font-size:9px;font-weight:700;background:rgba(255,77,106,.08);border:1px solid rgba(255,77,106,.18);color:var(--r);font-family:var(--m);animation:fi .3s ease both}
/* Confidence bar */
.conf-bar{height:6px;border-radius:3px;background:rgba(255,255,255,.03);overflow:hidden;margin-top:4px}
.conf-fill{height:100%;border-radius:3px;transition:width .6s cubic-bezier(.4,0,.2,1)}
/* Streak badge */
.streak{display:inline-flex;align-items:center;gap:3px;padding:2px 8px;border-radius:6px;font-size:9px;font-weight:700;font-family:var(--m)}
.streak.hot{background:var(--gbg);color:var(--g);border:1px solid var(--gb);box-shadow:0 0 8px rgba(45,222,152,.06)}
.streak.cold{background:var(--rbg);color:var(--r);border:1px solid rgba(255,77,106,.18)}
/* Deep link button */
.dl-btn{padding:5px 10px;border-radius:7px;font-size:10px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:4px;transition:var(--transition);text-decoration:none}
.dl-btn:hover{filter:brightness(1.15);transform:translateY(-1px)}
/* Card transitions — handled above */
/* Auth modal */
.auth-overlay{position:fixed;inset:0;background:rgba(4,6,11,.85);z-index:9999;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(12px)}
.auth-box{background:var(--card);border:1px solid var(--bd2);border-radius:24px;padding:40px 36px;width:min(440px,90vw);box-shadow:0 24px 80px rgba(0,0,0,.5),0 0 80px rgba(255,51,102,.04);backdrop-filter:blur(20px);position:relative;overflow:hidden;animation:authIn .4s cubic-bezier(.4,0,.2,1)}
.auth-box::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:var(--rainbow);opacity:.8}
@keyframes authIn{from{opacity:0;transform:translateY(16px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}
.auth-box h2{font-size:24px;font-weight:800;margin-bottom:4px;letter-spacing:-.5px}
.auth-box .sub{font-size:13px;color:var(--t3);margin-bottom:22px}
.auth-input{width:100%;padding:13px 16px;border-radius:var(--radius-sm);border:1px solid var(--bd);background:rgba(255,255,255,.02);color:var(--t);font-size:14px;font-family:var(--m);margin-bottom:10px;outline:none;transition:var(--transition)}
.auth-input:focus{border-color:rgba(255,51,102,.3);box-shadow:0 0 16px rgba(255,51,102,.05)}
.auth-btn{width:100%;padding:14px 0;border-radius:12px;font-size:14px;font-weight:700;border:none;cursor:pointer;margin-top:6px;transition:var(--transition);letter-spacing:.3px}
.auth-btn.primary{background:linear-gradient(135deg,#FF3366,#FF6B35,#FFC837);color:#fff;box-shadow:0 4px 16px rgba(255,51,102,.25)}
.auth-btn.primary:hover{filter:brightness(1.1);transform:translateY(-2px);box-shadow:0 8px 24px rgba(255,51,102,.3)}
.auth-btn.secondary{background:transparent;border:1px solid var(--bd);color:var(--t2)}
.auth-btn.secondary:hover{border-color:rgba(255,51,102,.2);color:var(--accent);background:rgba(255,51,102,.03)}
.auth-link{font-size:12px;color:var(--accent);cursor:pointer;text-decoration:underline;text-align:center;display:block;margin-top:12px;transition:color .15s}
.auth-link:hover{color:var(--b)}
.user-pill{display:flex;align-items:center;gap:6px;padding:6px 12px;border-radius:var(--radius-sm);background:rgba(255,51,102,.06);border:1px solid rgba(255,51,102,.12);cursor:pointer;font-size:11px;font-weight:600;color:var(--accent);transition:var(--transition)}
.user-pill:hover{background:rgba(255,51,102,.1);border-color:rgba(255,51,102,.2);transform:scale(1.02)}
/* Paywall */
.plan-badge{display:inline-flex;align-items:center;gap:3px;padding:2px 8px;border-radius:6px;font-size:9px;font-weight:700;font-family:var(--m)}
.plan-badge.free{background:rgba(255,255,255,.04);color:var(--t3);border:1px solid var(--bd)}
.plan-badge.pro{background:rgba(107,159,255,.08);color:var(--b);border:1px solid rgba(107,159,255,.18)}
.plan-badge.sharp{background:rgba(255,51,102,.08);color:var(--accent);border:1px solid rgba(255,51,102,.2)}
.lock-overlay{position:relative}
.lock-overlay::after{content:"🔒 PRO";display:flex;align-items:center;justify-content:center;position:absolute;inset:0;background:rgba(4,6,11,.88);backdrop-filter:blur(8px);border-radius:var(--radius);font-size:14px;font-weight:700;color:var(--b);z-index:5;cursor:pointer}
.lock-overlay.sharp::after{content:"🔒 SHARP MASTER";color:var(--accent)}
.pricing-card{border-radius:20px;padding:28px;border:1px solid var(--bd);transition:var(--transition);position:relative;overflow:hidden;background:var(--card);backdrop-filter:blur(12px)}
.pricing-card::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% 0%,rgba(255,51,102,.03),transparent 60%);pointer-events:none}
.pricing-card:hover{border-color:rgba(255,51,102,.15);transform:translateY(-4px);box-shadow:0 12px 40px rgba(0,0,0,.2),0 0 40px rgba(255,51,102,.04)}
.pricing-card.popular::before{content:"POPULAIRE";position:absolute;top:16px;right:-32px;bottom:auto;left:auto;width:auto;height:auto;inset:auto;transform:rotate(45deg);background:linear-gradient(135deg,var(--g),var(--b));color:var(--bg);font-size:9px;font-weight:800;padding:5px 36px;letter-spacing:1px;z-index:2;pointer-events:none;border-radius:0}
/* ========== PREMIUM ADDITIONS ========== */
/* Animated gradient text */
.grad-text{background:linear-gradient(135deg,#FF3366,#FF6B35,#FFC837,#2DDE98,#06B6D4,#2563EB,#A855F7,#FF3366);background-size:300% 300%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:gradShift 4s ease infinite}
@keyframes gradShift{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
/* Glow pulse for important values */
@keyframes glowPulse{0%,100%{text-shadow:0 0 8px rgba(45,222,152,.15)}50%{text-shadow:0 0 20px rgba(45,222,152,.3)}}
.glow-val{animation:glowPulse 2.5s ease infinite}
/* Premium card shine effect */
@keyframes cardShine{0%{left:-100%}100%{left:200%}}
.cd-shine:hover::after{content:'';position:absolute;top:0;left:-100%;width:50%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.02),transparent);animation:cardShine .8s ease}
/* Stagger animation delays */
.rw:nth-child(1){animation-delay:.05s}.rw:nth-child(2){animation-delay:.1s}.rw:nth-child(3){animation-delay:.15s}.rw:nth-child(4){animation-delay:.2s}.rw:nth-child(5){animation-delay:.25s}.rw:nth-child(6){animation-delay:.3s}
/* Floating orbs background */
@keyframes orbFloat{0%{transform:translate(0,0) scale(1)}33%{transform:translate(30px,-20px) scale(1.05)}66%{transform:translate(-15px,15px) scale(.95)}100%{transform:translate(0,0) scale(1)}}
/* Counter animation */
@keyframes countUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.count-anim{animation:countUp .5s cubic-bezier(.4,0,.2,1) both}
/* Tooltip styles */
[data-tip]{position:relative}
[data-tip]:hover::after{content:attr(data-tip);position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);padding:6px 12px;border-radius:8px;background:var(--card);border:1px solid var(--bd2);color:var(--t);font-size:11px;white-space:nowrap;z-index:1000;backdrop-filter:blur(12px);box-shadow:0 4px 16px rgba(0,0,0,.3);animation:fi .2s ease}
/* Better select styling */
.sel{padding:7px 14px;border-radius:8px;font-size:11px;background:var(--card);border:1px solid var(--bd);color:var(--t2);outline:none;margin-left:auto;font-weight:500;transition:var(--transition);cursor:pointer;backdrop-filter:blur(8px)}
.sel:hover{border-color:rgba(255,51,102,.15)}
.sel:focus{border-color:rgba(255,51,102,.25);box-shadow:0 0 12px rgba(255,51,102,.04)}
/* Toast improvements */
.toast-msg{position:fixed;bottom:80px;left:50%;transform:translateX(-50%);padding:12px 24px;border-radius:14px;background:var(--card);border:1px solid var(--bd2);color:var(--t);font-size:13px;font-weight:600;z-index:10001;backdrop-filter:blur(20px);box-shadow:0 8px 32px rgba(0,0,0,.3),0 0 20px rgba(255,51,102,.03);animation:toastIn .35s cubic-bezier(.4,0,.2,1)}
@keyframes toastIn{from{opacity:0;transform:translateX(-50%) translateY(12px) scale(.95)}to{opacity:1;transform:translateX(-50%) translateY(0) scale(1)}}
/* EV badge premium glow */
.ev-badge-high{position:relative}
.ev-badge-high::before{content:'';position:absolute;inset:-2px;border-radius:inherit;background:linear-gradient(135deg,var(--g),var(--b));opacity:.15;filter:blur(4px)}
/* Better link colors */
a{color:var(--b);text-decoration:none}
a:hover{color:var(--accent)}
/* Win rate ring */
.wr-ring{position:relative;display:inline-flex;align-items:center;justify-content:center}
.wr-ring svg{transform:rotate(-90deg)}
/* Section divider */
.section-divider{height:1px;background:linear-gradient(90deg,transparent,rgba(255,51,102,.1),rgba(45,222,152,.05),transparent);margin:16px 0}
/* Better mobile responsiveness */
@media(max-width:700px){.pricing-card{padding:16px}.pricing-card .auth-btn{font-size:12px}}
@media(min-width:601px) and (max-width:900px){footer>div>div:first-child{flex-direction:column}}
/* Command palette */
#cmdPalette .cmd-item:hover{background:rgba(255,51,102,.06)}
#cmdPalette input::placeholder{color:var(--t3)}
/* Footer links */
footer span[onclick]:hover{color:var(--accent)!important;transition:color .15s}
/* Smart parlay cards premium */
.smart-parlay{position:relative;overflow:hidden}
.smart-parlay::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--g),var(--b));opacity:0;transition:opacity .2s}
.smart-parlay:hover::before{opacity:1}
/* Pulse animation for live elements */
@keyframes softPulse{0%,100%{opacity:1}50%{opacity:.7}}
.soft-pulse{animation:softPulse 2s ease infinite}
/* Progress ring animation */
@keyframes progressFill{from{stroke-dashoffset:100}to{stroke-dashoffset:var(--offset,0)}}
/* KBD styling */
kbd{font-family:var(--m);line-height:1}

/* ========== ACCESSIBILITY & UTILITY ADDITIONS ========== */
/* Focus visible */
*:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 4px; }
/* Skip link */
.skip-link { position: absolute; top: -40px; left: 0; background: var(--accent); color: #fff; padding: 8px 16px; z-index: 100000; font-weight: 700; font-size: 14px; border-radius: 0 0 8px 0; transition: top 0.2s; }
.skip-link:focus { top: 0; }
/* Loading spinner */
.loading-spinner { width: 24px; height: 24px; border: 3px solid var(--bd); border-top-color: var(--accent); border-radius: 50%; animation: spin 0.8s linear infinite; margin: 0 auto; }
@keyframes spin { to { transform: rotate(360deg); } }
/* Error message */
.error-msg { padding: 12px 16px; border-radius: var(--radius-sm); background: var(--rbg); border: 1px solid rgba(255,77,106,.2); color: var(--r); font-size: 13px; text-align: center; }
/* Screen reader only */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border-width: 0; }

/* Mobile bottom navigation */
.mobile-nav{display:none;position:fixed;bottom:0;left:0;right:0;z-index:999;background:rgba(6,8,15,.92);border-top:1px solid var(--bd2);padding:8px 0 env(safe-area-inset-bottom,8px);backdrop-filter:blur(24px);box-shadow:0 -8px 32px rgba(0,0,0,.4)}
.mobile-nav-inner{display:flex;justify-content:space-around;align-items:center;max-width:500px;margin:0 auto}
.mobile-nav-btn{display:flex;flex-direction:column;align-items:center;gap:3px;padding:8px 10px;border-radius:14px;font-size:20px;color:var(--t3);transition:all .25s;background:none;border:none;cursor:pointer;min-width:56px}
.mobile-nav-btn span{font-size:9px;font-weight:700;letter-spacing:.5px;text-transform:uppercase}
.mobile-nav-btn.on{color:#fff;background:linear-gradient(135deg,rgba(255,51,102,.15),rgba(255,107,53,.1));box-shadow:0 0 16px rgba(255,51,102,.1)}
@media(max-width:600px){
  .mobile-nav{display:block}
  .tabs{display:none!important}
  body{padding-bottom:calc(72px + env(safe-area-inset-bottom,0px))}
  .float-slip{bottom:calc(72px + env(safe-area-inset-bottom,0px))!important}
}

/* === ODDS GRID === */
.og-wrap{padding:8px 10px;border-radius:10px;background:rgba(91,140,255,.03);border:1px solid rgba(91,140,255,.08);margin-bottom:8px}
.og-tabs{display:flex;gap:4px;margin-bottom:6px;align-items:center}
.og-tab{padding:3px 10px;border-radius:6px;font-size:10px;font-weight:600;background:rgba(255,255,255,.03);border:1px solid var(--bd);color:var(--t3);cursor:pointer;transition:all .15s}
.og-tab.on{background:var(--gbg);border-color:var(--gb);color:var(--g)}
.og-grid{display:grid;gap:1px 0;font-size:10px;overflow-x:auto;align-items:center}
.og-hdr{text-align:center;color:var(--t3);font-weight:600;font-size:9px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:4px 2px;background:rgba(255,255,255,.02)}
.og-team{font-weight:600;color:var(--t2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:4px 2px;font-size:10px}
.og-cell{text-align:center;font-family:var(--m);font-weight:600;padding:4px 2px;font-size:11px;border-radius:4px}
.og-cell.best{color:var(--g);font-weight:800;background:var(--gbg)}
.og-cell.worst{color:var(--r);opacity:.6}
.og-cell.mid{color:var(--t2)}
.og-expand-btn{display:block;width:100%;padding:4px 0;margin-top:4px;font-size:10px;color:var(--b);background:none;border:1px dashed rgba(91,140,255,.15);border-radius:6px;cursor:pointer;text-align:center}
.og-expand-btn:hover{background:rgba(91,140,255,.05)}
.og-row{display:contents}
.og-single{font-size:11px;color:var(--t3);padding:4px 0}
@media(max-width:480px){
  .og-grid{font-size:9px}
  .og-cell{font-size:9px;padding:2px 0}
  .og-hdr{font-size:8px}
}

/* === ANALYSIS PANEL === */
.analysis-panel{max-height:0;overflow:hidden;transition:max-height .28s cubic-bezier(.4,0,.2,1)}
.analysis-panel.open{max-height:420px}