:root{
  --bg:#080c11;--surface:#0e1520;--surface-2:#131c2a;--surface-3:#1a2535;
  --border:#1d2a3d;--border-2:#253347;
  --text:#eef1f8;--text-2:#7d90a8;--text-3:#3d5068;
  --blue:#3b82f6;--blue-dim:rgba(59,130,246,.1);--blue-glow:rgba(59,130,246,.22);
  --green:#10b981;--green-dim:rgba(16,185,129,.1);--green-glow:rgba(16,185,129,.18);
  --red:#f43f5e;--red-dim:rgba(244,63,94,.1);--red-glow:rgba(244,63,94,.2);
  --gold:#f59e0b;--gold-dim:rgba(245,158,11,.08);
  --purple:#8b5cf6;--purple-dim:rgba(139,92,246,.1);
  --cyan:#06b6d4;--cyan-dim:rgba(6,182,212,.1);
  --r-xs:6px;--r-sm:10px;--r-md:14px;--r-lg:20px;--r-full:999px;
  /* Fixed bottom-nav height + clearance for any scrollable surface.
     Scales with browser zoom (CSS px) and respects the device safe area. */
  --nav-h:66px;
  --bottom-space:calc(env(safe-area-inset-bottom,0px) + 90px);
  --content-max:480px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{height:100%}
body{
  background:var(--bg);
  background-image:
    radial-gradient(ellipse 80% 40% at 15% -5%,rgba(59,130,246,.05) 0%,transparent 100%),
    radial-gradient(ellipse 60% 40% at 85% 110%,rgba(16,185,129,.04) 0%,transparent 100%);
  background-attachment:fixed;color:var(--text);
  font-family:'Outfit',system-ui,sans-serif;font-size:16px;line-height:1.5;
  -webkit-font-smoothing:antialiased;min-height:100%;
  padding-top:env(safe-area-inset-top,0px);
}
input,select,button{font-family:inherit}
/* Mouse/touch focus: sin outline (los inputs ya tienen box-shadow de foco).
   Teclado (:focus-visible): outline SIEMPRE visible — accesibilidad WCAG 2.4.7.
   Nunca usar outline:none sin alternativa :focus-visible. */
input:focus,select:focus{outline:none}
:focus-visible{outline:2px solid var(--blue);outline-offset:2px;border-radius:4px}
button:focus:not(:focus-visible){outline:none}
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
input[type=number]{-moz-appearance:textfield}

/* ── Layout ──────────── */
/* min-height fallback: engines without dvh support (older Android WebView)
   drop an unknown unit entirely, collapsing the page to content height and
   letting the static SEO footer ride up behind the fixed bottom-nav. The
   100vh line is the universal fallback; dvh-capable engines use the tighter
   value. Keep both — never rely on dvh alone. */
.vh-fill{min-height:100vh;min-height:100dvh}
.page{padding:20px 16px var(--bottom-space);max-width:var(--content-max);width:100%;margin:0 auto;min-height:100vh;min-height:100dvh;animation:fadeUp .22s ease}
.page-wide{max-width:544px}
/* Desktop/tablet: widen the centered column so it isn't a thin strip
   in a sea of empty space, without breaking the mobile-first card layout. */
@media (min-width:768px){
  :root{--content-max:600px}
  .page-wide{max-width:680px}
}
@keyframes fadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@keyframes livePulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.65)}}
.live-badge{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:5px;background:rgba(220,38,38,.15);border:1px solid rgba(220,38,38,.35);color:#ef4444;font-size:11px;font-weight:800;letter-spacing:1.2px}
.live-dot{width:8px;height:8px;border-radius:50%;background:#ef4444;animation:livePulse 1.2s ease-in-out infinite;flex-shrink:0}

/* ── Brand ──────────── */
.brand{text-align:center;padding:32px 0 24px;border-bottom:1px solid var(--border);margin-bottom:24px}
.brand-logo{
  font-family:'Bebas Neue',sans-serif;font-size:44px;letter-spacing:5px;
  background:linear-gradient(135deg,#60a5fa,#3b82f6 40%,#818cf8);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1;
}
.brand-sub{font-size:11px;color:var(--text-3);letter-spacing:2.5px;text-transform:uppercase;margin-top:6px;font-weight:600}

/* ── Cards ──────────── */
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:16px;margin-bottom:12px;box-shadow:0 2px 16px rgba(0,0,0,.22)}

/* ── Labels ──────────── */
.sec-label{font-size:11px;font-weight:700;color:var(--text-3);letter-spacing:1.5px;text-transform:uppercase;margin-bottom:12px}
.field-lbl{font-size:12px;color:var(--text-2);display:block;margin-bottom:5px;font-weight:600}

/* ── Inputs ──────────── */
.inp{width:100%;padding:12px 14px;border-radius:var(--r-sm);border:1px solid var(--border-2);background:var(--surface-2);color:var(--text);font-size:15px;font-weight:500;transition:border-color .15s,box-shadow .15s}
.inp:focus{border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-dim)}
.inp-money-wrap{position:relative}
.inp-money-wrap .sym{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--text-2);font-size:15px;font-weight:600}
.inp-money{padding-left:28px}
.inp-score{width:100%;text-align:center;font-family:'Bebas Neue',sans-serif;font-size:58px;letter-spacing:1px;padding:10px 8px;background:var(--surface-2);border:2px solid var(--border-2);border-radius:var(--r-md);color:var(--text);transition:border-color .15s,box-shadow .15s;-webkit-appearance:none}
.inp-score.team-a:focus{border-color:var(--green);box-shadow:0 0 0 3px var(--green-dim)}
.inp-score.team-b:focus{border-color:var(--red);box-shadow:0 0 0 3px var(--red-dim)}
.inp-putt{width:100%;text-align:center;font-size:20px;font-weight:700;padding:10px 4px;background:var(--surface-2);border:1px solid var(--border-2);border-radius:var(--r-sm);color:var(--cyan);transition:border-color .15s;-webkit-appearance:none}
.inp-putt:focus{border-color:var(--cyan);box-shadow:0 0 0 3px var(--cyan-dim)}

/* ── Buttons ──────────── */
.btn{display:inline-flex;align-items:center;justify-content:center;border:none;border-radius:var(--r-sm);font-weight:600;cursor:pointer;transition:all .15s;user-select:none;-webkit-tap-highlight-color:transparent}
.btn:active{transform:scale(.96)}
.btn-primary{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;box-shadow:0 4px 14px var(--blue-glow)}
.btn-primary:hover{background:linear-gradient(135deg,#60a5fa,#3b82f6);box-shadow:0 6px 20px var(--blue-glow)}
.btn-primary[disabled],.btn-primary.disabled{background:var(--border-2);color:var(--text-3);box-shadow:none;cursor:not-allowed}
.btn-primary[disabled]:active,.btn-primary.disabled:active{transform:none}
.btn-ghost{background:transparent;color:var(--text-2);border:1px solid var(--border-2)}
.btn-ghost:hover{background:var(--surface-2);color:var(--text)}
.btn-full{width:100%}
.btn-lg{font-size:15px;font-weight:700;padding:15px 20px;border-radius:var(--r-md)}
.btn-md{font-size:14px;padding:10px 18px}
.btn-sm{font-size:12px;padding:8px 14px}
.btn-danger{background:transparent;color:var(--red);border:1px solid rgba(244,63,94,.3)}
.btn-danger:hover{background:var(--red-dim)}
.btn-back{padding:8px 16px;border-radius:var(--r-sm);border:1px solid var(--border-2);background:transparent;color:var(--text-2);font-size:14px;cursor:pointer;font-family:inherit;font-weight:500;transition:all .15s}
.btn-back:hover{background:var(--surface-2);color:var(--text)}

/* ── Segment buttons ──────────── */
.seg-wrap{display:flex;gap:6px}
.seg-btn{flex:1;padding:11px;border-radius:var(--r-sm);font-weight:700;font-size:14px;cursor:pointer;border:2px solid var(--border-2);background:var(--surface-2);color:var(--text-2);transition:all .15s;font-family:inherit}
.seg-btn.active{border-color:var(--blue);background:var(--blue-dim);color:var(--blue)}
.seg-btn:active{transform:scale(.97)}

/* ── Toggle ──────────── */
.toggle-row{display:flex;align-items:center;justify-content:space-between;padding:14px 0;border-bottom:1px solid var(--border)}
.toggle-row:last-child{border-bottom:none}
.toggle-label{font-size:15px;font-weight:600;color:var(--text)}
.toggle-sub{font-size:12px;color:var(--text-3);margin-top:2px}
.toggle-track{width:50px;height:28px;border-radius:14px;border:none;position:relative;cursor:pointer;transition:background .2s;flex-shrink:0}
.toggle-track.off{background:var(--border-2)}
.toggle-track.on{background:var(--blue)}
.toggle-thumb{width:22px;height:22px;border-radius:11px;background:#fff;position:absolute;top:3px;transition:left .2s;box-shadow:0 1px 4px rgba(0,0,0,.3)}
.toggle-track.off .toggle-thumb{left:3px}
.toggle-track.on .toggle-thumb{left:25px}

/* ── Tee selector ──────────── */
.tee-wrap{display:flex;gap:6px}
.tee-btn{flex:1;padding:10px 4px;border-radius:var(--r-sm);cursor:pointer;border:2px solid transparent;background:var(--surface-2);font-size:10px;font-weight:700;transition:all .15s;font-family:inherit;display:flex;flex-direction:column;align-items:center;gap:5px}
.tee-dot{width:12px;height:12px;border-radius:50%}

/* ── Hole strip ──────────── */
.hole-strip-wrap{overflow-x:auto;margin-bottom:14px;padding-bottom:4px;scrollbar-width:none}
.hole-strip-wrap::-webkit-scrollbar{display:none}
.hole-strip{display:flex;gap:4px;min-width:max-content;padding:2px 0}
.hole-divider{width:2px;background:var(--blue);border-radius:1px;margin:0 3px;align-self:stretch}
.hole-btn{width:40px;height:40px;border-radius:10px;border:none;font-size:13px;font-weight:700;cursor:pointer;transition:all .12s;font-family:inherit;-webkit-tap-highlight-color:transparent}
.hole-btn.pending{background:var(--surface-2);color:var(--text-3)}
.hole-btn.cur{background:var(--blue);color:#fff;box-shadow:0 2px 12px var(--blue-glow)}
.hole-btn.win{background:var(--green-dim);color:var(--green)}
.hole-btn.loss{background:var(--red-dim);color:var(--red)}
.hole-btn.tie{background:var(--border-2);color:var(--text-2)}
.hole-btn:active{transform:scale(.88)}

/* ── Pills ──────────── */
.pill{display:inline-flex;align-items:center;padding:4px 10px;border-radius:var(--r-full);font-size:13px;font-weight:700;min-width:38px;justify-content:center}
.pill-win{background:var(--green-dim);color:var(--green)}
.pill-loss{background:var(--red-dim);color:var(--red)}
.pill-tie{background:var(--border-2);color:var(--text-3)}

/* ── Pres display ──────────── */
.pres-row{display:flex;align-items:center;gap:5px;flex-wrap:wrap;margin-bottom:6px}
.pres-label{font-size:11px;color:var(--text-3);min-width:28px;font-weight:700}
.pres-empty{font-size:13px;color:var(--text-3)}

/* ── Badges ──────────── */
.badge{display:inline-flex;padding:4px 10px;border-radius:var(--r-full);font-size:11px;font-weight:700;letter-spacing:.5px;text-transform:uppercase}
.badge-stroke{background:var(--purple-dim);color:var(--purple)}
.badge-ohyes{background:var(--gold-dim);color:var(--gold)}

/* ── Team headers ──────────── */
.team-hdr{font-size:11px;font-weight:800;letter-spacing:1.5px;text-transform:uppercase;margin-bottom:8px}
.team-hdr-a{color:var(--green)}
.team-hdr-b{color:var(--red)}

/* ── Result box ──────────── */
.result-box{text-align:center;padding:20px 16px;border-radius:var(--r-md);animation:fadeUp .2s ease}
.result-win{background:var(--green-dim);border:1px solid rgba(16,185,129,.2)}
.result-loss{background:var(--red-dim);border:1px solid rgba(244,63,94,.2)}
.result-tie{background:var(--surface-2);border:1px solid var(--border-2)}
.result-name{font-family:'Bebas Neue',sans-serif;font-size:30px;letter-spacing:2px;margin-top:4px}
.result-sub{font-size:13px;color:var(--text-2);margin-bottom:4px}

/* ── Oh Yes ──────────── */
.ohyes-box{padding:14px;border-radius:var(--r-md);border:1px solid rgba(245,158,11,.2);background:rgba(245,158,11,.04);margin-bottom:12px}
.ohyes-title{font-size:12px;font-weight:700;color:var(--gold);margin-bottom:10px;letter-spacing:.5px}
.ohyes-btns{display:flex;gap:8px;flex-wrap:wrap}
.ohyes-btn{flex:1;min-width:0;padding:12px;border-radius:var(--r-sm);font-size:14px;font-weight:700;cursor:pointer;border:2px solid var(--border-2);background:transparent;color:var(--text-2);transition:all .15s;font-family:inherit;word-break:break-word}
.ohyes-nobody{padding:12px 14px}

/* ── Marca ──────────── */
.marca-section{margin-top:16px;padding-top:16px;border-top:1px solid var(--border)}
.marca-btns{display:flex;gap:4px;flex-wrap:wrap;margin-top:8px}
.marca-btn{padding:7px 13px;border-radius:var(--r-full);font-size:12px;font-weight:600;cursor:pointer;border:1px solid var(--border-2);background:transparent;color:var(--text-2);transition:all .15s;font-family:inherit}
.marca-btn.sel{border-color:var(--blue);background:var(--blue-dim);color:var(--blue)}
.marca-btn:active{transform:scale(.95)}

/* ── Money rows ──────────── */
.money-row{display:flex;justify-content:space-between;align-items:center;padding:9px 0;font-size:14px}
.money-lbl{color:var(--text-2);flex:1}
.money-detail{font-size:11px;color:var(--text-3);margin-left:4px}
.money-amt{font-weight:800;white-space:nowrap;margin-left:12px}
.money-win{color:var(--green)}
.money-loss{color:var(--red)}
.money-zero{color:var(--text-3)}
.money-total{border-top:2px solid var(--border-2);margin-top:10px;padding-top:14px;display:flex;justify-content:space-between;align-items:center;font-weight:800;font-size:20px}
.total-win{background:linear-gradient(135deg,var(--green),#34d399);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.total-loss{background:linear-gradient(135deg,var(--red),#fb7185);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.total-tie{color:var(--text-3)}

/* ── Scorecard table ──────────── */
.sc-scroll{overflow-x:auto;scrollbar-width:none}
.sc-scroll::-webkit-scrollbar{display:none}
.sc-table{width:100%;border-collapse:collapse;font-size:11px;min-width:380px}
.sc-th{padding:6px 5px;text-align:center;color:var(--text-3);font-weight:700;border-bottom:1px solid var(--border)}
.sc-td{padding:7px 5px;text-align:center;border-bottom:1px solid var(--border)}
.sc-hdr{font-weight:700;font-size:10px;color:var(--text-2);text-align:left!important}
.sc-win{background:var(--green-dim);color:var(--green);font-weight:700}
.sc-loss{background:var(--red-dim);color:var(--red);font-weight:700}
.sc-tot{border-left:2px solid var(--border-2)}
/* ── Score badges (golf classic) ── */
.sc-score{display:inline-flex;align-items:center;justify-content:center;min-width:18px;min-height:18px;font-size:11px;font-weight:700;line-height:1;padding:2px 3px;box-sizing:border-box;}
.sc-score-hio{border:2px solid var(--gold);border-radius:50%;outline:2px solid var(--gold);outline-offset:2px;color:var(--gold);}
.sc-score-eagle{border:2px solid var(--green);border-radius:50%;outline:2px solid var(--green);outline-offset:2px;color:var(--green);}
.sc-score-birdie{border:2px solid var(--green);border-radius:50%;color:var(--green);}
.sc-score-bogey{border:1.5px solid #f97316;}
.sc-score-dbl{border:2px solid var(--red);outline:2px solid var(--red);outline-offset:2px;color:var(--red);}
.sc-score-triple{border:2px solid var(--red);outline:2px solid var(--red);outline-offset:2px;background:rgba(244,63,94,.12);color:var(--red);}

/* ── Stat boxes ──────────── */
.stat-box{text-align:center;padding:6px}
.stat-num{font-family:'Bebas Neue',sans-serif;font-size:36px;letter-spacing:1px;line-height:1}
.stat-lbl{font-size:11px;color:var(--text-3);margin-top:2px;font-weight:500}
.vuelta-lbl{font-size:12px;font-weight:700;color:var(--blue);margin-bottom:8px;letter-spacing:.5px}
.carry-note{font-size:10px;color:var(--gold);font-weight:600;margin:2px 0 4px 34px}

/* ── Presion card ──────────── */
.pres-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-md);padding:14px;margin-bottom:12px}
.pres-card-title{font-size:11px;font-weight:700;color:var(--text-3);letter-spacing:1.5px;text-transform:uppercase;margin-bottom:10px}

/* ── Gameplay header ──────────── */
.play-hdr{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:14px}
.play-title{font-size:17px;font-weight:900;letter-spacing:-.5px}
.play-sub{font-size:12px;color:var(--text-2);margin-top:2px}
.play-actions{display:flex;gap:6px}

/* ── Misc ──────────── */
.divider{height:1px;background:var(--border);margin:12px 0}
.vs{font-size:13px;color:var(--text-3);font-weight:700}

/* ── Finish / action CTAs ──────────── */
.btn-finish{width:100%;padding:18px;border-radius:var(--r-md);border:none;background:linear-gradient(135deg,#3b82f6 0%,#10b981 100%);color:#fff;font-size:16px;font-weight:800;cursor:pointer;letter-spacing:.5px;box-shadow:0 4px 20px rgba(59,130,246,.25);font-family:inherit;margin-top:8px;animation:fadeUp .3s ease}
.btn-finish:active{transform:scale(.98)}
.btn-new{width:100%;padding:14px;border-radius:var(--r-md);border:1px solid var(--border-2);background:transparent;color:var(--text-2);font-size:14px;font-weight:600;cursor:pointer;font-family:inherit;margin-top:16px;transition:all .15s}
.btn-new:hover{background:var(--surface-2);color:var(--text)}
.btn-start-round{width:100%;padding:18px;border-radius:var(--r-md);border:none;background:linear-gradient(135deg,#3b82f6 0%,#10b981 100%);color:#fff;font-size:16px;font-weight:800;cursor:pointer;letter-spacing:.8px;box-shadow:0 4px 24px rgba(59,130,246,.28),0 1px 0 rgba(255,255,255,.1) inset;font-family:inherit;margin-bottom:14px;transition:all .15s;text-transform:uppercase}
.btn-start-round:hover{box-shadow:0 6px 28px rgba(59,130,246,.38),0 1px 0 rgba(255,255,255,.1) inset;transform:translateY(-1px)}
.btn-start-round:active{transform:scale(.98);box-shadow:0 2px 12px rgba(59,130,246,.3)}
.btn-resume-round{width:100%;padding:14px;border-radius:var(--r-md);border:1.5px solid var(--green);background:var(--green-dim);color:var(--green);font-size:15px;font-weight:800;cursor:pointer;letter-spacing:.5px;font-family:inherit;margin-bottom:8px;transition:all .15s}
.btn-resume-round:hover{background:rgba(16,185,129,.18)}
.btn-resume-round:active{transform:scale(.98)}

/* ── Utilities ──────────── */
.ext-amt{max-width:140px;margin-top:8px;margin-left:50px}
.flex{display:flex}.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-around{justify-content:space-around}
.gap-4{gap:4px}.gap-6{gap:6px}.gap-8{gap:8px}.gap-10{gap:10px}.gap-12{gap:12px}
.mb-4{margin-bottom:4px}.mb-6{margin-bottom:6px}.mb-8{margin-bottom:8px}.mb-10{margin-bottom:10px}.mb-12{margin-bottom:12px}.mb-16{margin-bottom:16px}.mb-20{margin-bottom:20px}.mb-24{margin-bottom:24px}
.mt-4{margin-top:4px}.mt-8{margin-top:8px}.mt-12{margin-top:12px}.mt-16{margin-top: 16px}
.flex-1{flex:1}.w-full{width:100%}

/* ── Error message ──────────── */
.err-msg{color:var(--red);font-size:13px;font-weight:600;padding:10px 12px;background:var(--red-dim);border-radius:var(--r-sm);border:1px solid rgba(244,63,94,.2)}

/* ── Dashboard ──────────── */
.dash-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:20px;border-bottom:1px solid var(--border);margin-bottom:20px}
.dash-avatar{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,var(--blue),var(--purple));display:flex;align-items:center;justify-content:center;font-weight:800;font-size:16px;color:#fff;flex-shrink:0;letter-spacing:-.5px;box-shadow:0 2px 12px rgba(59,130,246,.3)}

/* ── Text link ──────────── */
.text-link{background:none;border:none;color:var(--blue);font-size:12px;font-weight:600;cursor:pointer;font-family:inherit}
.text-link:hover{color:#93c5fd}

/* ── Rival rows ──────────── */
.rival-row{display:flex;align-items:center;justify-content:space-between;padding:14px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-md);margin-bottom:8px;cursor:pointer;transition:all .15s}
.rival-row:active{background:var(--surface-2);border-color:var(--border-2);transform:scale(.99)}
.rival-name{font-weight:700;font-size:15px;margin-bottom:4px}
.rival-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.rival-strokes{font-size:11px;color:var(--purple);font-weight:600;background:var(--purple-dim);padding:3px 8px;border-radius:var(--r-full)}
.rival-record{font-size:11px;color:var(--text-3)}
.rival-money{font-size:15px;font-weight:800;min-width:50px;text-align:right}

/* ── Match rows ──────────── */
.match-row{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-md);margin-bottom:8px;transition:background .12s}

/* ── Rival select rows ──────────── */
.rival-select-row{display:flex;align-items:center;gap:12px;padding:14px;border:2px solid var(--border-2);border-radius:var(--r-md);margin-bottom:8px;cursor:pointer;transition:all .15s;background:var(--surface-2)}
.rival-select-row.selected{border-color:var(--blue);background:var(--blue-dim)}
.rival-select-row:active{transform:scale(.99)}
.rival-select-check{width:26px;height:26px;border-radius:7px;border:2px solid var(--border-2);display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:800;flex-shrink:0;transition:all .15s;color:#fff}
.rival-select-check.checked{background:var(--blue);border-color:var(--blue)}

/* ── Modal ──────────── */
.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.8);display:flex;align-items:flex-end;justify-content:center;z-index:100;animation:fadeIn .2s ease}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.modal-box{background:var(--surface);border:1px solid var(--border-2);border-radius:var(--r-lg) var(--r-lg) 0 0;padding:24px 20px calc(48px + env(safe-area-inset-bottom,0px));width:100%;max-width:480px;max-height:90dvh;overflow-y:auto;box-shadow:0 -12px 48px rgba(0,0,0,.5);animation:slideUp .25s ease}
@keyframes slideUp{from{transform:translateY(30px);opacity:0}to{transform:translateY(0);opacity:1}}

/* ── Scan table ──────────── */
.scan-tbl{width:100%;border-collapse:collapse;font-size:12px;margin:8px 0}
.scan-tbl th{background:var(--surface-2);color:var(--text-3);font-size:10px;font-weight:700;letter-spacing:1px;padding:5px 8px;text-align:center}
.scan-tbl td{padding:5px 8px;text-align:center;border-top:1px solid var(--border);font-weight:600}
.scan-tbl tr:nth-child(even) td{background:rgba(255,255,255,.02)}
.scan-null{color:var(--text-3);font-weight:400}
.scan-warn{color:var(--gold);font-weight:700}

/* ── Game tabs ──────────── */
.game-tabs{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px;scrollbar-width:none;margin-bottom:14px}
.game-tabs::-webkit-scrollbar{display:none}
.game-tab{flex-shrink:0;padding:9px 16px;border-radius:var(--r-md);border:2px solid var(--border-2);background:var(--surface-2);color:var(--text-2);font-size:13px;font-weight:700;cursor:pointer;transition:all .15s;font-family:inherit;white-space:nowrap}
.game-tab.active{border-color:var(--blue);background:var(--blue-dim);color:var(--blue)}
.game-tab.done{border-color:var(--green);background:var(--green-dim);color:var(--green)}
.game-tab:active{transform:scale(.96)}

/* ── Bottom nav ──────────── */
.bottom-nav{position:fixed;bottom:0;left:0;right:0;background:rgba(13,20,32,.97);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border-top:1px solid var(--border);display:flex;z-index:50;padding-bottom:env(safe-area-inset-bottom,0)}
.nav-tab{flex:1;display:flex;flex-direction:column;align-items:center;padding:10px 0 13px;border:none;background:none;cursor:pointer;font-family:inherit;color:var(--text-3);transition:color .15s;-webkit-tap-highlight-color:transparent;position:relative}
.nav-tab.active{color:var(--blue)}
.nav-tab.active::after{content:'';position:absolute;top:0;left:25%;right:25%;height:2px;background:var(--blue);border-radius:0 0 3px 3px}
.nav-icon{font-size:22px;margin-bottom:3px;line-height:1;transition:transform .15s}
.nav-tab.active .nav-icon{transform:scale(1.08)}
.nav-label{font-size:11px;font-weight:600;letter-spacing:.3px}
.nav-dot{display:none}

/* ── Session banner ──────────── */
.session-banner{background:linear-gradient(135deg,rgba(16,185,129,.1),rgba(59,130,246,.07));border:1px solid rgba(16,185,129,.3);border-radius:var(--r-lg);padding:14px 16px;margin-bottom:14px}

/* ── Empty states ──────────── */
.empty-state{text-align:center;padding:40px 20px;color:var(--text-3);font-size:13px}
.empty-state-card{text-align:center;padding:36px 20px}
.setup-notice{font-size:12px;color:var(--text-3);margin-top:4px}

/* ── Foursome ──────────── */
.foursome-teams{display:flex;gap:10px;margin-bottom:12px}
.foursome-teams > *{flex:1;min-width:0}
.foursome-team{border-radius:var(--r-md);padding:10px;border:2px solid var(--border-2)}
.foursome-team-a{border-color:var(--green)!important}
.foursome-team-b{border-color:var(--red)!important}
.foursome-player{display:flex;align-items:center;justify-content:space-between;padding:6px 8px;border-radius:var(--r-sm);background:var(--surface-2);margin-bottom:4px;font-size:13px;font-weight:700}
.foursome-player:last-child{margin-bottom:0}

/* ── Stat tiles ──────────── */
.stat-tiles{display:flex;gap:8px;margin-bottom:14px}
.stat-tile{flex:1;min-width:0;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-md);padding:14px 8px;text-align:center;position:relative;overflow:hidden}
.stat-tile::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,.02),transparent);pointer-events:none}
.stat-tile-num{font-family:'Bebas Neue',sans-serif;font-size:32px;letter-spacing:1px;line-height:1;margin-bottom:3px}
.stat-tile-lbl{font-size:10px;color:var(--text-3);font-weight:600;letter-spacing:.5px;text-transform:uppercase}

/* ── Score distribution ──────────── */
.score-dist-bar{height:8px;border-radius:var(--r-full);overflow:hidden;display:flex;gap:1px;margin:8px 0}
.score-dist-legends{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:4px}
.score-dist-dot{width:8px;height:8px;border-radius:3px;flex-shrink:0}

/* ── Balance hero ──────────── */
.balance-hero{background:linear-gradient(135deg,rgba(59,130,246,.07) 0%,rgba(16,185,129,.05) 100%);border:1px solid rgba(59,130,246,.18);border-radius:var(--r-lg);padding:16px;margin-bottom:14px}
.balance-hero-total{font-family:'Bebas Neue',sans-serif;font-size:50px;letter-spacing:2px;line-height:1;margin:4px 0 2px}
.balance-hero-sub{display:flex;flex-wrap:wrap;gap:0;margin-top:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,.06)}
.balance-hero-item{flex:1 1 80px;min-width:70px;padding:0 10px;border-right:1px solid rgba(255,255,255,.06)}
.balance-hero-item:first-child{padding-left:0}
.balance-hero-item:last-child{padding-right:0;border-right:none}

/* ── Section headers ──────────── */
.section-hdr{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.section-title{font-size:11px;font-weight:700;color:var(--text-3);letter-spacing:1.5px;text-transform:uppercase}

/* ── Auth page ──────────── */
.auth-brand-logo{font-family:'Bebas Neue',sans-serif;font-size:54px;letter-spacing:5px;background:linear-gradient(135deg,#60a5fa,#3b82f6 40%,#818cf8);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1}

/* ── Boot shell: static LCP placeholder shown before React mounts ──────── */
.boot-shell{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--bg)}
.boot-logo{font-family:'Bebas Neue',sans-serif;font-size:54px;letter-spacing:5px;background:linear-gradient(135deg,#60a5fa,#3b82f6 40%,#818cf8);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1}
.boot-sub{font-size:12px;color:#94a3b8;letter-spacing:2px;text-transform:uppercase;margin-top:8px;font-family:'Outfit',system-ui,sans-serif}
