:root{
  --ink:#1E1A25;
  --ink-2:#2A2635;
  --paper:#FFF8EA;
  --paper-2:#F3E5C8;
  --paper-3:#E5CF9E;
  --line:rgba(30,26,37,0.13);
  --brass:#FFC857;
  --brass-rgb:255,200,87;
  --brass-soft:rgba(255,200,87,.34);
  --teal:#20B8AE;
  --teal-rgb:32,184,174;
  --green:#2F9C58;
  --red:#C85544;
  --gray:#8B93A1;
  --berry:#6D72E8;
  --berry-rgb:109,114,232;
  --theme-deep-1:#249FBE;
  --theme-deep-2:#557ED1;
  --theme-tint:#E3FAF7;
  --theme-tint-2:#F8FFFF;
  --theme-tint-3:#EDFCFA;
  --theme-readable:#FFF3B5;
  --theme-button-top:#FFE07D;
  --theme-button-bottom:#ECA52E;
  --theme-button-shadow:#B77715;
  --theme-button-ink:#3B2805;
  --theme-action-top:#55D7CD;
  --theme-action-shadow:#137E78;
  --ink-soft:rgba(255,248,234,0.66);
  --ink-faint:rgba(255,248,234,0.36);
  --serif:"Iowan Old Style","Palatino Linotype","Book Antiqua",Georgia,serif;
  --mono:ui-monospace,"SF Mono","Cascadia Code","Roboto Mono",Menlo,Consolas,monospace;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  --r-lg:28px;
  --r-md:22px;
  --r-sm:15px;
}
body.theme-ocean{--brass:#FFC857;--brass-rgb:255,200,87;--brass-soft:rgba(255,200,87,.34);--teal:#20B8AE;--teal-rgb:32,184,174;--berry:#6D72E8;--berry-rgb:109,114,232;--theme-deep-1:#249FBE;--theme-deep-2:#557ED1;--theme-tint:#E3FAF7;--theme-tint-2:#F8FFFF;--theme-tint-3:#EDFCFA;--theme-readable:#FFF3B5;--theme-button-top:#FFE07D;--theme-button-bottom:#ECA52E;--theme-button-shadow:#B77715;--theme-button-ink:#3B2805;--theme-action-top:#55D7CD;--theme-action-shadow:#137E78;}
body.theme-rose{--brass:#FFB84D;--brass-rgb:255,184,77;--brass-soft:rgba(255,184,77,.32);--teal:#8E63D7;--teal-rgb:142,99,215;--berry:#F14F87;--berry-rgb:241,79,135;--theme-deep-1:#E84F83;--theme-deep-2:#B85AB5;--theme-tint:#FFE8F0;--theme-tint-2:#FFF9FC;--theme-tint-3:#FFF0F5;--theme-readable:#FFF0A8;--theme-button-top:#FFD06A;--theme-button-bottom:#F09A2C;--theme-button-shadow:#B96818;--theme-button-ink:#3B2105;--theme-action-top:#B78AE9;--theme-action-shadow:#7043A1;}
body.theme-forest{--brass:#FFD34E;--brass-rgb:255,211,78;--brass-soft:rgba(255,211,78,.34);--teal:#249F83;--teal-rgb:36,159,131;--berry:#F07A52;--berry-rgb:240,122,82;--theme-deep-1:#69AD4A;--theme-deep-2:#2F9B82;--theme-tint:#F1F9D9;--theme-tint-2:#FCFFF5;--theme-tint-3:#F6FCE7;--theme-readable:#FFF4B0;--theme-button-top:#FFE578;--theme-button-bottom:#E6AC25;--theme-button-shadow:#A87210;--theme-button-ink:#352705;--theme-action-top:#51C69D;--theme-action-shadow:#167357;}
body.theme-mono{--brass:#FFD24D;--brass-rgb:255,210,77;--brass-soft:rgba(255,210,77,.34);--teal:#EA4D62;--teal-rgb:234,77,98;--berry:#F47B45;--berry-rgb:244,123,69;--theme-deep-1:#F28B38;--theme-deep-2:#E85D5C;--theme-tint:#FFF0D8;--theme-tint-2:#FFFCF5;--theme-tint-3:#FFF5E6;--theme-readable:#FFF3B2;--theme-button-top:#FFE474;--theme-button-bottom:#E9A629;--theme-button-shadow:#AB6E12;--theme-button-ink:#392505;--theme-action-top:#FA7182;--theme-action-shadow:#A62C40;}
body.theme-classic{--brass:#D5962E;--brass-rgb:213,150,46;--brass-soft:rgba(213,150,46,.32);--teal:#278F82;--teal-rgb:39,143,130;--berry:#A84E64;--berry-rgb:168,78,100;--theme-deep-1:#2B2230;--theme-deep-2:#171922;--theme-tint:#F8EBD1;--theme-tint-2:#FFFDF7;--theme-tint-3:#FFF6E7;--theme-readable:#F0C96C;--theme-button-top:#F2C35F;--theme-button-bottom:#B67820;--theme-button-shadow:#7C4E16;--theme-button-ink:#241A05;--theme-action-top:#36A998;--theme-action-shadow:#176158;}

*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html,body{margin:0;padding:0;touch-action:manipulation;overscroll-behavior:none;}
html.game-fixed-root,
html.game-fixed-root body{height:100%;overflow:hidden;overscroll-behavior:none;}
body.game-fixed{position:fixed;inset:0;width:100%;height:100vh;height:var(--app-height,100dvh);overflow:hidden;}
body{
  min-height:100vh;
  background:
    radial-gradient(ellipse 82% 58% at 50% -12%,rgba(var(--brass-rgb),.32),transparent 62%),
    linear-gradient(135deg,rgba(var(--brass-rgb),.24) 0%,rgba(var(--brass-rgb),0) 42%),
    linear-gradient(165deg,rgba(var(--teal-rgb),.24) 0%,rgba(var(--teal-rgb),0) 38%),
    linear-gradient(180deg,var(--theme-deep-1) 0%,var(--theme-deep-2) 100%);
  color:var(--paper);
  font-family:var(--sans);
  -webkit-font-smoothing:antialiased;
  position:relative;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background-image:
    radial-gradient(circle at 8% 18%,rgba(255,255,255,.15) 0 5.5rem,transparent 5.6rem),
    radial-gradient(circle at 94% 72%,rgba(255,255,255,.11) 0 8rem,transparent 8.1rem),
    radial-gradient(circle at 28% 96%,rgba(var(--brass-rgb),.18) 0 6rem,transparent 6.1rem);
  opacity:.9;
}
@media(prefers-reduced-motion:reduce){*{animation-duration:.001ms!important;transition-duration:.001ms!important;}}

.icon{display:inline-block;vertical-align:-0.14em;flex-shrink:0;}

.screen{display:none;min-height:100vh;min-height:100dvh;justify-content:center;padding:28px 16px 52px;position:relative;z-index:1;}
.screen.active{display:flex;animation:screenIn .22s ease;}
@keyframes screenIn{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:translateY(0);}}
.screen-inner{width:100%;max-width:560px;}
body.game-fixed #screenGame{position:fixed;inset:0;width:100%;height:100vh;height:var(--app-height,100dvh);min-height:0;overflow:hidden;overscroll-behavior:none;touch-action:none;padding:16px 12px;}
body.game-fixed #screenGame .screen-inner{height:100%;display:flex;flex-direction:column;min-height:0;}
body.game-fixed #screenGame .top-nav{margin-bottom:8px;min-height:32px;flex-shrink:0;}
body.game-fixed #screenGame .progress-wrap{margin-bottom:8px;flex-shrink:0;}
body.game-fixed #questionCard{display:flex;flex-direction:column;min-height:0;margin-bottom:0;flex:1;padding:14px 14px 12px;}
body.game-fixed #questionCard .countdown-wrap{margin:10px 0 9px;}
body.game-fixed #questionCard .input-display{min-height:46px;padding:9px 12px;font-size:22px;margin-bottom:8px;}
body.game-fixed #questionCard #negativePrefix{font-size:22px;}
body.game-fixed #questionCard .numpad{gap:6px;margin-bottom:0;}
body.game-fixed #questionCard .np-btn{height:clamp(38px,6.1dvh,52px);}
body.game-fixed #questionCard .prestart-card.show{margin:9px 0 8px;padding:10px;max-height:118px;}
body.game-fixed #questionCard .prestart-ring,
body.game-fixed #questionCard .prestart-ring svg{width:50px;height:50px;}
body.game-fixed #questionCard .prestart-num{font-size:25px;}
body.game-fixed #questionCard .prestart-title{font-size:17px;}
body.game-fixed #questionCard .prestart-note{font-size:11.5px;line-height:1.32;margin-top:3px;}
body.game-fixed #questionCard .prestart-meter{margin-top:7px;}
body.game-fixed #questionCard.has-result .prestart-card,
body.game-fixed #questionCard.has-result .countdown-wrap,
body.game-fixed #questionCard.has-result .input-display,
body.game-fixed #questionCard.has-result .numpad{display:none;}
body.game-fixed #questionCard.has-result .card-row{margin-bottom:7px;flex-shrink:0;}
body.game-fixed #questionCard.has-result .question{font-size:20px;line-height:1.22;margin:0 0 8px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;flex-shrink:0;}
body.game-fixed #questionCard.has-result .mini-result.show{display:flex;flex-direction:column;flex:1;min-height:0;margin-top:0;}
body.game-fixed #questionCard.has-result .result-header{gap:9px;padding:8px 10px;flex-shrink:0;}
body.game-fixed #questionCard.has-result .result-ic{width:30px;height:30px;}
body.game-fixed #questionCard.has-result .result-acc-big{font-size:18px;}
body.game-fixed #questionCard.has-result .result-sub{font-size:11px;}
body.game-fixed #questionCard.has-result .result-score-pill .pts{font-size:17px;}
body.game-fixed #questionCard.has-result .reveal-card{display:flex;flex-direction:column;gap:6px;padding:8px 10px;min-height:0;flex:0 0 auto;overflow:visible;}
body.game-fixed #questionCard.has-result .reveal-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;flex-shrink:0;}
body.game-fixed #questionCard.has-result .reveal-cell{padding:6px 7px;}
body.game-fixed #questionCard.has-result .reveal-label{font-size:8px;margin-bottom:2px;}
body.game-fixed #questionCard.has-result .reveal-value{font-size:11px;line-height:1.2;}
body.game-fixed #questionCard.has-result .ruler-wrap{flex:1 1 auto;min-height:138px;padding:34px 14px 28px;display:flex;flex-direction:column;justify-content:center;gap:17px;overflow:visible;background:radial-gradient(ellipse 62% 55% at 50% 58%,rgba(var(--brass-rgb),.18),transparent 72%),linear-gradient(180deg,var(--theme-tint),rgba(var(--brass-rgb),.08));}
body.game-fixed #questionCard.has-result .ruler-track{height:16px;flex-shrink:0;box-shadow:0 6px 18px rgba(var(--teal-rgb),.22),0 2px 5px rgba(0,0,0,.16),0 1px 0 rgba(255,255,255,.5) inset;}
body.game-fixed #questionCard.has-result .ruler-gap{height:6px;background:rgba(17,24,38,.28);}
body.game-fixed #questionCard.has-result .marker .marker-label{font-size:9px;padding:5px 9px;bottom:20px;max-width:min(210px,34vw);overflow:hidden;text-overflow:ellipsis;}
body.game-fixed #questionCard.has-result .marker .pin{width:24px;height:24px;border-width:4px;}
body.game-fixed #questionCard.has-result .ruler-endlabels{margin-top:0;font-size:11px;}
body.game-fixed #questionCard.has-result .ruler-ticks{top:18px;bottom:18px;left:14px;right:14px;}
body.game-fixed #questionCard.has-result .result-banter{font-size:12px;line-height:1.28;min-height:0;padding:8px 10px;flex-shrink:0;}
body.game-fixed #questionCard.has-result .next-btn-wrap{flex-shrink:0;}
body.game-fixed #questionCard.has-result .btn-next{padding:11px;}

.top-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;min-height:36px;}
.nav-back{display:flex;align-items:center;gap:7px;font-size:13px;font-weight:700;color:var(--ink-soft);background:linear-gradient(135deg,rgba(var(--brass-rgb),.13),rgba(var(--teal-rgb),.07));border:1px solid rgba(var(--brass-rgb),.22);border-radius:var(--r-md);cursor:pointer;padding:8px 12px;transition:color .15s,background .15s,border-color .15s,transform .1s;}
.nav-back:hover{color:var(--paper);background:linear-gradient(135deg,rgba(var(--brass-rgb),.19),rgba(var(--teal-rgb),.12));border-color:rgba(var(--brass-rgb),.34);}
.nav-back:active{transform:translateY(1px);}
.nav-title{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-faint);}

.card{background:linear-gradient(180deg,var(--theme-tint-2) 0%,var(--paper) 100%);color:var(--ink);border:1px solid rgba(var(--brass-rgb),.2);border-radius:var(--r-lg);box-shadow:0 1px 0 rgba(255,255,255,.72) inset,0 12px 0 rgba(0,0,0,.12),0 24px 46px rgba(0,0,0,.34);padding:22px 20px;margin-bottom:16px;position:relative;overflow:hidden;}
.card::before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--brass),var(--teal),var(--berry));opacity:.95;}

/* ── LANDING ── */
#screenHome .screen-inner{position:relative;}
.welcome-user{position:static;max-width:min(90%,440px);display:flex;align-items:center;justify-content:center;gap:5px;margin:7px auto 5px;color:rgba(255,255,255,.82);font-size:clamp(17px,2.2vw,21px);font-weight:650;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.welcome-user[hidden]{display:none;}
.welcome-user strong{color:#fff;font-weight:900;overflow:hidden;text-overflow:ellipsis;}
.profile-menu-wrap{position:absolute;top:0;right:0;z-index:20;}
.profile-btn{position:relative;width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--paper);background:rgba(255,255,255,.2);border:1.5px solid rgba(255,255,255,.38);box-shadow:0 7px 18px rgba(50,30,20,.13),0 1px 0 rgba(255,255,255,.25) inset;backdrop-filter:blur(10px);transition:transform .12s,background .15s,border-color .15s;}
.profile-btn:hover{background:rgba(255,255,255,.28);border-color:rgba(255,255,255,.55);transform:translateY(-1px);}
.profile-btn:active{transform:translateY(1px);}
.profile-status-dot{position:absolute;right:1px;bottom:2px;width:11px;height:11px;border-radius:50%;background:var(--brass);border:2px solid var(--theme-deep-1);transition:background .15s;}
.profile-status-dot.signed-in{background:#5EE09A;}
.profile-popover{position:absolute;top:56px;right:0;width:min(330px,calc(100vw - 24px));padding:18px;color:var(--ink);background:linear-gradient(155deg,var(--theme-tint-2),var(--theme-tint));border:1.5px solid rgba(255,255,255,.72);border-radius:24px;box-shadow:0 20px 50px rgba(43,27,30,.28),0 0 0 4px rgba(var(--brass-rgb),.12);animation:profileMenuIn .18s ease;}
.profile-popover[hidden],#profileSignedOut[hidden],#profileSignedIn[hidden]{display:none;}
@keyframes profileMenuIn{from{opacity:0;transform:translateY(-6px) scale(.98);}to{opacity:1;transform:translateY(0) scale(1);}}
.profile-popover-head{display:flex;align-items:center;gap:11px;margin-bottom:13px;}
.profile-mini-avatar{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--theme-button-ink);background:linear-gradient(145deg,var(--theme-button-top),var(--brass));box-shadow:0 3px 0 var(--theme-button-shadow);}
.profile-popover-title{font-family:var(--serif);font-size:18px;font-weight:800;line-height:1.1;}
.profile-popover-kicker{font-family:var(--mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:rgba(30,26,37,.46);margin-top:3px;}
.profile-copy{font-size:12.5px;line-height:1.5;color:rgba(30,26,37,.62);margin:0 0 12px;}
.profile-action{width:100%;min-height:44px;border-radius:999px;display:flex;align-items:center;justify-content:center;gap:9px;font-size:13px;font-weight:800;padding:10px 14px;}
.google-action{color:var(--ink);background:#fff;border:1px solid rgba(30,26,37,.13);box-shadow:0 3px 0 rgba(30,26,37,.1);}
.google-mark{width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--sans);font-weight:950;color:#4285F4;background:#fff;border:1px solid rgba(30,26,37,.12);}
.profile-email-form{margin-top:13px;}
.profile-email-form label{display:block;font-size:10px;font-weight:750;color:rgba(30,26,37,.5);margin:0 0 6px 5px;}
.profile-email-row{display:flex;gap:7px;}
.profile-email-row input{min-width:0;flex:1;height:42px;border:1.5px solid rgba(var(--brass-rgb),.25);border-radius:999px;background:rgba(255,255,255,.72);color:var(--ink);font:600 13px var(--sans);padding:0 14px;outline:none;}
.profile-email-row input:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(var(--teal-rgb),.13);}
.profile-email-row button{width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;background:linear-gradient(180deg,var(--theme-action-top),var(--teal));box-shadow:0 3px 0 var(--theme-action-shadow);}
.profile-account-row{display:flex;align-items:center;gap:11px;padding:12px;background:rgba(255,255,255,.62);border-radius:17px;margin-bottom:12px;}
.profile-account-avatar{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;background:linear-gradient(145deg,var(--theme-action-top),var(--teal));color:#fff;font-weight:900;font-size:17px;}
.profile-account-copy{min-width:0;display:flex;flex-direction:column;gap:2px;}
.profile-account-copy strong{font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.profile-account-copy span{font-size:11px;color:rgba(30,26,37,.52);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.profile-name-form{margin:0 0 12px;}
.profile-name-form label{display:block;font-size:10px;font-weight:750;color:rgba(30,26,37,.5);margin:0 0 6px 5px;}
.profile-name-row{display:flex;gap:7px;}
.profile-name-row input{min-width:0;flex:1;height:42px;border:1.5px solid rgba(var(--brass-rgb),.25);border-radius:999px;background:rgba(255,255,255,.72);color:var(--ink);font:700 13px var(--sans);padding:0 14px;outline:none;}
.profile-name-row input:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(var(--teal-rgb),.13);}
.profile-name-row button{height:42px;border-radius:999px;padding:0 14px;background:linear-gradient(180deg,var(--theme-action-top),var(--teal));color:#fff;font-weight:850;font-size:12px;box-shadow:0 3px 0 var(--theme-action-shadow);}
.signout-action{color:var(--red);background:rgba(200,85,68,.08);border:1px solid rgba(200,85,68,.2);}
.hero{text-align:center;margin-bottom:22px;padding-top:58px;}
.hero-mark{width:52px;height:52px;margin:0 auto 13px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--theme-button-ink);background:linear-gradient(160deg,var(--theme-button-top),var(--brass));box-shadow:0 6px 0 var(--theme-button-shadow),0 13px 26px rgba(0,0,0,.18),0 1px 0 rgba(255,255,255,.5) inset;}
.hero-eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--theme-readable);margin-bottom:10px;}
.hero h1{font-family:var(--serif);font-weight:700;font-size:52px;margin:0 0 10px;letter-spacing:0;line-height:1.04;text-shadow:0 3px 0 rgba(0,0,0,.18);}
.hero h1 em{font-style:italic;color:var(--brass);}
.hero-sub{font-size:14px;color:var(--ink-soft);line-height:1.55;max-width:330px;margin:0 auto;}
.streak-badge{display:inline-flex;align-items:center;gap:6px;background:rgba(var(--brass-rgb),.16);border:1px solid rgba(var(--brass-rgb),.36);border-radius:100px;padding:6px 12px;margin-top:14px;font-family:var(--mono);font-size:11px;color:var(--theme-readable);}

.home-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:20px 0;}
.hs-cell{background:linear-gradient(180deg,rgba(255,255,255,.2),rgba(var(--brass-rgb),.13));border:1px solid rgba(255,255,255,.28);border-radius:28px;padding:14px 12px;text-align:center;box-shadow:0 1px 0 rgba(255,255,255,.18) inset,0 8px 18px rgba(70,40,20,.08);}
.hs-val{font-family:var(--serif);font-size:26px;font-weight:700;line-height:1;}
.hs-label{font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);margin-top:6px;}
.home-panel{background:linear-gradient(135deg,rgba(255,255,255,.18),rgba(var(--brass-rgb),.1));border:1px solid rgba(255,255,255,.25);border-radius:26px;padding:15px 16px;margin:0 0 14px;box-shadow:0 1px 0 rgba(255,255,255,.14) inset,0 10px 24px rgba(70,40,20,.08);}
.home-panel-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;}
.home-panel-title{display:flex;align-items:center;gap:8px;font-weight:800;font-size:14px;color:var(--paper);}
.home-panel-title .icon{color:var(--theme-readable);}
.home-panel-sub{font-family:var(--mono);font-size:10px;color:var(--ink-faint);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;}
.history-list{display:flex;flex-direction:column;gap:7px;}
.history-row{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;background:rgba(var(--brass-rgb),.08);border:1px solid rgba(var(--brass-rgb),.18);border-radius:var(--r-sm);padding:9px 10px;}
.history-date{font-family:var(--mono);font-size:10.5px;color:var(--ink-soft);}
.history-score{font-family:var(--mono);font-size:12.5px;font-weight:800;color:var(--theme-readable);}
.history-empty{font-size:12.5px;line-height:1.45;color:var(--ink-soft);background:rgba(var(--brass-rgb),.075);border:1px dashed rgba(var(--brass-rgb),.24);border-radius:var(--r-sm);padding:10px 11px;}

.home-buttons{display:flex;flex-direction:column;gap:10px;}
.btn-play{
  display:flex;align-items:center;justify-content:center;gap:10px;
  width:100%;padding:18px 26px;border-radius:999px;border:none;cursor:pointer;
  background:linear-gradient(180deg,var(--theme-button-top) 0%,var(--brass) 58%,var(--theme-button-bottom) 100%);
  color:var(--theme-button-ink);
  font-family:var(--serif);font-size:20px;font-weight:800;letter-spacing:0;
  box-shadow:0 6px 0 var(--theme-button-shadow),0 14px 24px rgba(var(--brass-rgb),.28),0 1px 0 rgba(255,255,255,.44) inset;
  transition:transform .12s,box-shadow .12s,filter .15s;
  flex-wrap:wrap;
}
.btn-play:hover{transform:translateY(-2px);filter:brightness(1.04);box-shadow:0 8px 0 var(--theme-button-shadow),0 18px 30px rgba(var(--brass-rgb),.31),0 1px 0 rgba(255,255,255,.44) inset;}
.btn-play:active{transform:translateY(3px);box-shadow:0 3px 0 var(--theme-button-shadow),0 8px 18px rgba(var(--brass-rgb),.22),0 1px 0 rgba(255,255,255,.4) inset;}
.btn-play .play-ic{width:30px;height:30px;border-radius:999px;background:rgba(255,248,234,.32);display:flex;align-items:center;justify-content:center;box-shadow:0 1px 0 rgba(255,255,255,.25) inset;}
.btn-play .play-sub{flex-basis:100%;font-family:var(--mono);font-size:10.5px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;opacity:.62;margin-top:2px;}
.btn-play.already-played{background:linear-gradient(180deg,var(--theme-action-top),var(--teal));color:var(--theme-button-ink);box-shadow:0 6px 0 var(--theme-action-shadow),0 14px 24px rgba(var(--teal-rgb),.28),0 1px 0 rgba(255,255,255,.25) inset;}

.btn-secondary{display:flex;align-items:center;gap:13px;width:100%;padding:12px 18px 12px 14px;border-radius:999px;cursor:pointer;background:rgba(255,255,255,.18);border:1.5px solid rgba(255,255,255,.3);color:var(--paper);font-size:14.5px;font-weight:700;text-align:left;box-shadow:0 7px 16px rgba(70,40,20,.08),0 1px 0 rgba(255,255,255,.16) inset;transition:background .15s,border-color .15s,transform .1s;}
.btn-secondary:hover{background:rgba(255,255,255,.26);border-color:rgba(255,255,255,.45);transform:translateY(-1px);}
.btn-secondary:active{transform:translateY(1px);}
.btn-secondary .btn-ic{width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;color:var(--theme-readable);flex-shrink:0;}
.btn-secondary .btn-text{flex:1;}
.btn-secondary .btn-text small{display:block;font-size:11px;font-weight:400;color:var(--ink-soft);margin-top:2px;}
.btn-secondary .btn-arrow{color:var(--ink-faint);}

/* ── HOW ── */
.how-section h3{font-family:var(--serif);font-size:18px;font-weight:700;margin:0 0 10px;display:flex;align-items:center;gap:9px;}
.how-section h3 .icon{color:var(--brass);}
.how-row{display:flex;align-items:flex-start;gap:12px;padding:10px 0;border-bottom:1px solid var(--line);}
.how-row:last-child{border-bottom:none;}
.how-num{font-family:var(--mono);font-size:13px;font-weight:700;color:var(--brass);width:20px;flex-shrink:0;padding-top:1px;}
.how-num.how-ic{display:flex;align-items:center;justify-content:center;padding-top:2px;}
.how-text{font-size:13.5px;line-height:1.55;color:rgba(17,24,38,.74);}
.how-text strong{color:var(--ink);}
.score-formula-card{background:var(--ink);color:var(--paper);border-radius:var(--r-md);padding:18px;margin:14px 0;text-align:center;}
.sfc-row{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;}
.sfc-chip{padding:9px 14px;border-radius:var(--r-sm);font-family:var(--mono);font-size:12.5px;font-weight:700;line-height:1.5;}
.sfc-chip small{font-size:10px;opacity:.68;font-weight:500;display:block;}
.sfc-chip.acc{background:rgba(var(--teal-rgb),.24);color:var(--theme-action-top);}
.sfc-chip.spd{background:rgba(var(--brass-rgb),.24);color:var(--theme-button-top);}
.sfc-chip.tot{background:rgba(250,246,238,.12);}
.sfc-op{color:var(--ink-faint);font-size:18px;}
.sfc-note{font-size:11.5px;color:var(--ink-soft);margin-top:10px;line-height:1.55;}
.ex-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;text-align:center;margin-top:10px;}
.ex-cell{background:#fff;border-radius:9px;padding:9px 4px;border:1px solid var(--line);}
.ex-cell .v{font-family:var(--mono);font-size:15px;font-weight:700;}
.ex-cell .l{font-size:10px;color:rgba(17,24,38,.5);margin-top:2px;}
.ex-box{background:var(--paper-2);border-radius:var(--r-md);padding:12px 14px;margin-top:10px;border:1px solid var(--line);}
.ex-box-title{font-family:var(--mono);font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:rgba(17,24,38,.42);}
.rating-table{width:100%;border-collapse:collapse;margin-top:8px;}
.rating-table td{padding:8px 6px;font-size:13px;border-bottom:1px solid var(--line);vertical-align:middle;}
.rating-table tr:last-child td{border-bottom:none;}
.rating-table .r-ic{width:28px;color:var(--brass);}
.rating-table .r-label{font-weight:600;}
.rating-table .r-range{font-family:var(--mono);font-size:11px;color:rgba(17,24,38,.45);white-space:nowrap;}
.rating-table .r-desc{font-size:11px;color:rgba(17,24,38,.42);}

/* ── SETTINGS ── */
.settings-label{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:rgba(17,24,38,.45);margin:0 0 8px;padding:0 4px;}
.setting-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 16px;background:var(--theme-tint);border-bottom:1px solid var(--line);}
.setting-row:first-of-type{border-radius:var(--r-md) var(--r-md) 0 0;}
.setting-row:last-of-type{border-radius:0 0 var(--r-md) var(--r-md);border-bottom:none;}
.setting-name{font-size:14px;font-weight:600;}
.setting-desc{font-size:11.5px;color:rgba(17,24,38,.46);margin-top:2px;}
.toggle{position:relative;width:44px;height:26px;flex-shrink:0;}
.toggle input{opacity:0;width:0;height:0;position:absolute;}
.toggle-track{position:absolute;inset:0;border-radius:100px;background:rgba(17,24,38,.18);cursor:pointer;transition:background .2s;}
.toggle input:checked+.toggle-track{background:var(--teal);}
.toggle-thumb{position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.22);transition:transform .2s;pointer-events:none;}
.toggle input:checked~.toggle-thumb{transform:translateX(18px);}
.theme-grid{display:grid;grid-template-columns:repeat(5,minmax(48px,64px));justify-content:center;gap:12px;padding:16px;background:var(--theme-tint);border-radius:var(--r-md);}
.theme-swatch{width:100%;aspect-ratio:1;border-radius:50%;cursor:pointer;border:3px solid rgba(255,255,255,.85);transition:transform .12s,border-color .15s,box-shadow .15s;position:relative;display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:0 4px 0 rgba(30,26,37,.14),0 8px 15px rgba(30,26,37,.1);}
.theme-swatch:hover{transform:scale(1.07);}
.theme-swatch.active{border-color:var(--ink);box-shadow:0 0 0 3px rgba(var(--brass-rgb),.3),0 4px 0 rgba(30,26,37,.16);}
.theme-swatch .check-ic{display:none;}
.theme-swatch.active .check-ic{display:block;}
.btn-danger{width:100%;padding:13px;border-radius:var(--r-md);cursor:pointer;background:rgba(200,86,63,.09);color:var(--red);font-weight:600;font-size:14px;border:1px solid rgba(200,86,63,.28);transition:background .15s;}
.btn-danger:hover{background:rgba(200,86,63,.16);}

/* ── GAME ── */
.progress-wrap{margin-bottom:14px;}
.progress-row{display:flex;justify-content:space-between;align-items:center;}
.progress-label{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);}
.progress-dots{display:flex;gap:6px;}
.progress-dot{width:22px;height:8px;border-radius:999px;background:rgba(255,248,234,.15);border:1px solid rgba(255,248,234,.24);transition:all .3s;}
.progress-dot.done{background:var(--teal);border-color:var(--teal);}
.progress-dot.active{background:var(--brass);border-color:var(--brass);box-shadow:0 0 0 3px var(--brass-soft);}

.card-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;}
.category-tag{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;background:var(--theme-tint);color:var(--theme-button-ink);padding:6px 11px;border-radius:999px;border:1px solid rgba(var(--brass-rgb),.28);box-shadow:0 1px 0 rgba(255,255,255,.6) inset;}
.puzzle-number{font-family:var(--mono);font-size:12px;color:rgba(17,24,38,.44);}
.question{font-family:var(--serif);font-size:23px;line-height:1.32;font-weight:700;margin:6px 0 4px;}
.unit-hint{display:none;}
.prestart-card{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:14px;max-height:0;margin:0;padding:0 14px;opacity:0;overflow:hidden;pointer-events:none;background:linear-gradient(135deg,rgba(var(--brass-rgb),.16),rgba(var(--teal-rgb),.11));border:0 solid rgba(var(--brass-rgb),.26);border-radius:var(--r-md);box-shadow:0 3px 0 rgba(30,26,37,.08),0 1px 0 rgba(255,255,255,.75) inset;transform:translateY(-5px);transition:max-height .28s ease,margin .2s ease,padding .2s ease,opacity .2s ease,transform .22s ease,border-width .2s ease;}
.prestart-card.show{max-height:172px;margin:14px 0 12px;padding:14px;opacity:1;pointer-events:auto;border-width:1px;transform:translateY(0);}
.prestart-card::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 18% 20%,rgba(var(--brass-rgb),.18),transparent 36%),radial-gradient(circle at 84% 86%,rgba(var(--teal-rgb),.14),transparent 34%);pointer-events:none;}
.prestart-ring{position:relative;width:62px;height:62px;z-index:1;flex-shrink:0;}
.prestart-ring svg{width:62px;height:62px;transform:rotate(-90deg);display:block;}
.prestart-ring-bg{stroke:rgba(30,26,37,.1);}
.prestart-ring-arc{stroke:var(--brass);transition:stroke-dashoffset .08s linear,stroke .2s;}
.prestart-num{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:30px;font-weight:800;color:var(--ink);line-height:1;}
.prestart-num.tick{animation:readyPop .22s ease;}
.prestart-content{position:relative;z-index:1;min-width:0;}
.prestart-kicker{display:flex;align-items:center;gap:7px;font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--theme-button-ink);font-weight:800;margin-bottom:4px;}
.prestart-title{font-family:var(--serif);font-size:20px;font-weight:800;line-height:1.12;color:var(--ink);}
.prestart-note{font-size:12.5px;color:rgba(30,26,37,.62);line-height:1.45;margin-top:4px;}
.prestart-meter{height:7px;border-radius:999px;background:rgba(30,26,37,.1);overflow:hidden;margin-top:10px;box-shadow:0 1px 0 rgba(255,255,255,.55) inset;}
.prestart-meter-fill{height:100%;width:100%;border-radius:inherit;background:linear-gradient(90deg,var(--brass),var(--teal));transition:width .08s linear;}
#questionCard.is-preparing .countdown-wrap{opacity:.48;}
#questionCard.is-preparing .input-display,#questionCard.is-preparing .numpad{opacity:.55;filter:saturate(.72);}
#questionCard.is-preparing .input-display{cursor:default;}
#questionCard.is-preparing .input-cursor{display:none;}
@keyframes readyPop{0%{transform:scale(.86);}70%{transform:scale(1.08);}100%{transform:scale(1);}}

.countdown-wrap{margin:15px 0 13px;}
.countdown-track{height:11px;background:rgba(17,24,38,.1);border-radius:100px;overflow:hidden;box-shadow:0 1px 0 rgba(255,255,255,.7) inset;}
.countdown-fill{height:100%;border-radius:100px;background:linear-gradient(90deg,var(--teal),var(--theme-action-top));transition:width .1s linear;width:100%;}
.countdown-fill.urgent{background:linear-gradient(90deg,var(--red),#D9705B);}
.countdown-numbers{display:flex;justify-content:space-between;align-items:baseline;margin-top:7px;}
.countdown-time{font-family:var(--mono);font-size:19px;font-weight:700;transition:color .3s;font-variant-numeric:tabular-nums;}
.countdown-time.urgent{color:var(--red);}
.countdown-label{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:rgba(17,24,38,.4);}

/* Input display — value renders exactly where placeholder sits */
.input-display{
  font-family:var(--mono);font-size:25px;font-weight:700;
  background:var(--theme-tint-2);border:2px solid var(--line);border-radius:var(--r-md);
  padding:13px 16px;min-height:58px;
  display:flex;align-items:center;
  transition:border-color .18s,box-shadow .18s;
  margin-bottom:10px;cursor:text;
  font-variant-numeric:tabular-nums;
  box-shadow:0 3px 0 rgba(30,26,37,.08),0 1px 0 rgba(255,255,255,.7) inset;
}
.input-display:focus-visible{outline:2px solid var(--brass);outline-offset:3px;}
.input-display.state-empty{border-color:rgba(var(--brass-rgb),.72);box-shadow:0 0 0 4px rgba(var(--brass-rgb),.18),0 3px 0 rgba(30,26,37,.08),0 1px 0 rgba(255,255,255,.7) inset;}
.input-display.state-filled{border-color:var(--teal);box-shadow:0 0 0 4px rgba(var(--teal-rgb),.18),0 3px 0 rgba(30,26,37,.08),0 1px 0 rgba(255,255,255,.7) inset;}
#negativePrefix{font-family:var(--mono);font-size:25px;font-weight:700;user-select:none;flex-shrink:0;margin-right:2px;}
#inputValue{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:0 1 auto;}
.input-cursor{display:inline-block;width:2px;height:1.1em;background:var(--brass);margin-left:1px;animation:blink 1.06s step-end infinite;vertical-align:-0.16em;flex-shrink:0;}
.input-display.state-empty .input-cursor{display:none;}
@keyframes blink{0%,100%{opacity:1;}50%{opacity:0;}}
.placeholder-text{color:rgba(17,24,38,.32);font-weight:600;font-size:16px;font-family:var(--sans);margin-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:1;}
.input-unit-label{margin-left:auto;padding-left:10px;font-family:var(--sans);font-size:13px;font-weight:900;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:42%;flex-shrink:0;}

.numpad{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:6px;}
.np-btn{
  background:linear-gradient(180deg,var(--theme-tint-3),var(--paper-2));color:var(--ink);border:1px solid rgba(30,26,37,.12);
  border-radius:var(--r-md);font-family:var(--mono);font-size:20px;font-weight:600;
  height:56px;display:flex;align-items:center;justify-content:center;
  cursor:pointer;user-select:none;
  box-shadow:0 4px 0 rgba(30,26,37,.14),0 1px 0 rgba(255,255,255,.7) inset;
  transition:background .1s,transform .07s,box-shadow .07s,border-color .12s;
}
.np-btn:hover:not(:disabled){border-color:rgba(var(--brass-rgb),.38);filter:brightness(1.02);}
.np-btn:active,.np-btn.tap{background:var(--paper-3);transform:translateY(3px);box-shadow:0 1px 0 rgba(30,26,37,.14);}
.np-btn.np-submit{grid-column:span 3;background:linear-gradient(180deg,#2A2D34,#11151D);color:#fff;font-family:var(--sans);font-size:15px;font-weight:850;letter-spacing:.02em;border:none;box-shadow:0 4px 0 #05070B,0 1px 0 rgba(255,255,255,.14) inset;}
.np-btn.np-submit:hover:not(:disabled){filter:brightness(1.08);}
.np-btn.np-submit:active{background:#0F131A;}
.np-btn:disabled{opacity:.42;cursor:not-allowed;filter:saturate(.55);}
.np-btn.np-submit:disabled{background:linear-gradient(180deg,#B9BDC5,#8F96A1);color:rgba(255,255,255,.82);box-shadow:0 3px 0 #737B87;opacity:1;filter:saturate(.45);}

/* Mini result */
#questionCard.has-result .prestart-card,
#questionCard.has-result .countdown-wrap,
#questionCard.has-result .input-display,
#questionCard.has-result .numpad{display:none;}
.mini-result{display:none;margin-top:14px;}
.mini-result.show{display:block;animation:slideDown .25s ease;}
@keyframes slideDown{from{opacity:0;transform:translateY(-4px);}to{opacity:1;transform:translateY(0);}}
.result-header{display:flex;align-items:center;gap:13px;padding:14px 16px;background:var(--theme-tint);border-radius:var(--r-md) var(--r-md) 0 0;border:1px solid var(--line);border-bottom:none;}
.result-ic{width:38px;height:38px;border-radius:var(--r-sm);background:var(--theme-tint-2);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--brass);flex-shrink:0;box-shadow:0 2px 0 rgba(30,26,37,.08);}
.result-acc-big{font-family:var(--serif);font-size:22px;font-weight:700;line-height:1.15;}
.result-label{font-size:11.5px;color:rgba(17,24,38,.5);margin-top:1px;}
.result-score-pill{margin-left:auto;text-align:right;}
.result-score-pill .pts{font-family:var(--mono);font-size:20px;font-weight:700;}
.result-score-pill .pts-label{font-family:var(--mono);font-size:9.5px;color:rgba(17,24,38,.45);text-transform:uppercase;letter-spacing:.06em;}
.reveal-card{background:var(--theme-tint-2);border:1px solid var(--line);border-top:none;padding:13px 16px;display:grid;gap:9px;}
.reveal-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.reveal-cell{background:var(--theme-tint);border:1px solid rgba(var(--brass-rgb),.18);border-radius:var(--r-sm);padding:9px 10px;}
.reveal-label{font-family:var(--mono);font-size:9px;text-transform:uppercase;letter-spacing:.08em;color:rgba(30,26,37,.46);margin-bottom:4px;}
.reveal-value{font-family:var(--mono);font-size:13px;font-weight:800;color:var(--ink);overflow-wrap:anywhere;}

.ruler-wrap{padding:44px 14px 22px;position:relative;background:var(--theme-tint);border-left:1px solid var(--line);border-right:1px solid var(--line);}
.ruler-track{position:relative;height:10px;border-radius:100px;background:linear-gradient(90deg,#C8563F 0%,#D08245 18%,var(--brass) 34%,var(--teal) 50%,var(--brass) 66%,#D08245 82%,#C8563F 100%);box-shadow:0 2px 9px rgba(var(--teal-rgb),.16),0 1px 3px rgba(0,0,0,.1);}
.ruler-track::after{content:"";position:absolute;inset:0;border-radius:100px;background:rgba(var(--brass-rgb),.12);pointer-events:none;}
.ruler-gap{position:absolute;top:50%;transform:translateY(-50%);height:3px;border-radius:2px;background:rgba(17,24,38,.2);transition:left 1s cubic-bezier(.22,1,.36,1),width 1s cubic-bezier(.22,1,.36,1);pointer-events:none;z-index:1;}
.marker{position:absolute;top:50%;left:50%;width:0;height:0;transform:translate(-50%,-50%);transition:left 1s cubic-bezier(.22,1,.36,1);z-index:3;pointer-events:none;}
.marker .marker-label{position:absolute;left:50%;bottom:15px;transform:translateX(-50%);font-family:var(--mono);font-size:10px;font-weight:700;white-space:nowrap;padding:3px 8px;border-radius:6px;color:#fff;box-shadow:0 2px 6px rgba(0,0,0,.18);}
.marker .pin{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:18px;height:18px;border-radius:50%;border:3px solid #fff;transition:box-shadow .4s;}
.marker.guess .pin{background:var(--gray);box-shadow:0 0 0 2px rgba(139,147,161,.4),0 2px 7px rgba(0,0,0,.24);}
.marker.guess .marker-label{background:#6C7482;}
.marker.truth .pin{background:var(--green);box-shadow:0 0 0 3px rgba(47,163,92,.32),0 0 12px rgba(47,163,92,.38),0 2px 7px rgba(0,0,0,.18);}
.marker.truth .marker-label{background:#268A4D;box-shadow:0 2px 8px rgba(47,163,92,.34);}
.ruler-endlabels{display:flex;justify-content:space-between;margin-top:16px;font-family:var(--mono);font-size:10px;color:rgba(17,24,38,.38);}
.ruler-ticks{position:absolute;top:-9px;left:14px;right:14px;bottom:34px;display:flex;justify-content:space-between;pointer-events:none;}
.ruler-ticks span{width:1px;background:rgba(17,24,38,.07);}

.result-banter{font-family:var(--serif);font-size:14.5px;font-style:italic;text-align:center;padding:13px 18px 11px;color:rgba(17,24,38,.62);background:var(--theme-tint);border-left:1px solid var(--line);border-right:1px solid var(--line);line-height:1.5;min-height:44px;}
.next-btn-wrap{border:1px solid var(--line);border-top:none;border-radius:0 0 var(--r-md) var(--r-md);background:#11151D;overflow:hidden;}
.btn-next{position:relative;width:100%;min-height:52px;background:linear-gradient(180deg,#2A2D34,#11151D);color:#fff;font-weight:950;font-size:16px;padding:15px 14px 13px;border:none;cursor:pointer;transition:background .15s,filter .15s,transform .08s;display:flex;align-items:center;justify-content:center;gap:10px;text-shadow:0 1px 1px rgba(0,0,0,.35);letter-spacing:.01em;box-shadow:0 1px 0 rgba(255,255,255,.14) inset;}
.btn-next .icon{filter:drop-shadow(0 1px 1px rgba(0,0,0,.35));stroke-width:3;}
.btn-next:hover{filter:brightness(1.08);}
.btn-next:active{transform:translateY(1px);filter:brightness(.98);}

/* Day complete */
#dayCard{display:none;}
#dayCard.show{display:block;animation:screenIn .35s ease;}
.day-banner{text-align:center;padding:6px 0 16px;}
.day-ic{width:52px;height:52px;border-radius:var(--r-md);background:var(--theme-tint);border:1px solid var(--line);display:inline-flex;align-items:center;justify-content:center;color:var(--brass);margin-bottom:10px;box-shadow:0 3px 0 rgba(30,26,37,.08);}
.day-title{font-family:var(--serif);font-size:24px;font-weight:700;}
.day-sub{font-family:var(--mono);font-size:11.5px;color:rgba(17,24,38,.48);margin-top:4px;}
.score-ring-wrap{display:flex;justify-content:center;margin:4px 0 18px;}
.score-ring{position:relative;width:112px;height:112px;}
.score-ring svg{transform:rotate(-90deg);}
.score-ring-num{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;}
.score-ring-num .big{font-family:var(--serif);font-size:29px;font-weight:700;line-height:1;}
.score-ring-num .small{font-family:var(--mono);font-size:9.5px;text-transform:uppercase;letter-spacing:.08em;color:rgba(17,24,38,.44);margin-top:3px;}
.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.stat{background:var(--theme-tint-2);border-radius:var(--r-sm);padding:11px 13px;border:1px solid var(--line);box-shadow:0 1px 0 rgba(255,255,255,.7) inset;}
.stat-label{font-size:9.5px;text-transform:uppercase;letter-spacing:.08em;color:rgba(17,24,38,.44);margin-bottom:4px;}
.stat-value{font-family:var(--mono);font-size:16px;font-weight:700;}

.breakdown-title{font-family:var(--serif);font-size:15px;font-weight:700;margin:16px 0 10px;display:flex;align-items:center;gap:8px;}
.breakdown-title .line{flex:1;height:1px;background:var(--line);}
.bi-card{background:var(--theme-tint-2);border:1px solid var(--line);border-radius:var(--r-md);margin-bottom:8px;overflow:hidden;}
.bi-header{display:flex;align-items:center;gap:10px;padding:11px 14px;cursor:pointer;user-select:none;transition:background .12s;}
.bi-header:hover{background:rgba(17,24,38,.04);}
.bi-dot{width:9px;height:9px;border-radius:50%;flex-shrink:0;}
.bi-q{flex:1;font-size:12px;color:rgba(17,24,38,.66);line-height:1.35;}
.bi-right{display:flex;align-items:center;gap:8px;flex-shrink:0;}
.bi-acc{font-family:var(--mono);font-size:12.5px;font-weight:700;}
.bi-chevron{color:rgba(17,24,38,.34);transition:transform .25s;display:flex;}
.bi-chevron.open{transform:rotate(180deg);}
.bi-expand{max-height:0;overflow:hidden;transition:max-height .35s cubic-bezier(.4,0,.2,1);}
.bi-expand.open{max-height:640px;}
.bi-expand-inner{padding:0 14px 14px;}
.bi-divider{height:1px;background:var(--line);margin-bottom:12px;}
.bi-stat-row{display:flex;justify-content:space-between;align-items:baseline;padding:4px 0;}
.bi-stat-label{font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:rgba(17,24,38,.42);}
.bi-stat-val{font-family:var(--mono);font-size:13px;font-weight:700;}
.bi-stat-val.good{color:var(--teal);}
.bi-stat-val.bad{color:var(--red);}
.bi-mini-ruler{margin:8px 0 6px;position:relative;padding:24px 4px 18px;}
.bi-ruler-track{height:6px;background:linear-gradient(90deg,#C8563F 0%,var(--brass) 34%,var(--teal) 50%,var(--brass) 66%,#C8563F 100%);border-radius:100px;opacity:.9;position:relative;}
.bi-marker{position:absolute;top:50%;left:50%;width:0;height:0;transform:translate(-50%,-50%);z-index:2;pointer-events:none;}
.bi-marker .bi-pin{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:11px;height:11px;border-radius:50%;border:2px solid var(--paper-2);}
.bi-marker .bi-mlabel{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);font-family:var(--mono);font-size:9px;font-weight:700;white-space:nowrap;padding:1px 5px;border-radius:4px;color:#fff;}
.bi-marker.bi-guess .bi-pin{background:var(--gray);}
.bi-marker.bi-guess .bi-mlabel{background:#6C7482;}
.bi-marker.bi-truth .bi-pin{background:var(--green);}
.bi-marker.bi-truth .bi-mlabel{background:#268A4D;}
.bi-end-labels{display:flex;justify-content:space-between;margin-top:6px;font-family:var(--mono);font-size:9px;color:rgba(17,24,38,.35);}
.bi-score-breakdown{margin-top:10px;padding:10px 12px;background:rgba(17,24,38,.045);border-radius:var(--r-sm);}
.bi-score-line{display:flex;justify-content:space-between;align-items:center;padding:3px 0;gap:8px;}
.bi-score-line-label{font-size:11.5px;color:rgba(17,24,38,.56);}
.bi-score-line-val{font-family:var(--mono);font-size:13px;font-weight:700;}
.bi-score-total{border-top:1px solid var(--line);margin-top:6px;padding-top:7px;}

.share-block{margin-top:16px;padding-top:14px;border-top:1px dashed var(--line);}
.share-preview{background:linear-gradient(135deg,var(--theme-tint-2) 0%,var(--theme-tint) 100%);color:var(--ink);padding:15px 16px;border-radius:var(--r-md);margin-bottom:10px;border:1px solid rgba(var(--brass-rgb),.28);box-shadow:0 3px 0 rgba(30,26,37,.08),0 1px 0 rgba(255,255,255,.8) inset;}
.share-preview-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;}
.share-preview-kicker{display:flex;align-items:center;gap:7px;font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--theme-button-ink);font-weight:800;}
.share-preview-date{font-family:var(--mono);font-size:10px;color:rgba(30,26,37,.42);white-space:nowrap;}
.share-preview-main{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;}
.share-preview-score{font-family:var(--serif);font-size:33px;font-weight:800;line-height:.95;color:var(--ink);}
.share-preview-score small{font-family:var(--mono);font-size:12px;font-weight:700;color:rgba(30,26,37,.42);margin-left:4px;}
.share-preview-rating{font-size:13px;font-weight:800;color:var(--teal);text-align:right;line-height:1.25;}
.share-preview-streak{display:block;margin-top:4px;font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:.04em;color:var(--brass);}
.share-q-list{display:grid;grid-template-columns:1fr;gap:6px;margin-top:13px;}
.share-q-row{display:flex;align-items:center;justify-content:space-between;gap:10px;background:rgba(var(--brass-rgb),.08);border:1px solid rgba(var(--brass-rgb),.16);border-radius:var(--r-sm);padding:7px 9px;}
.share-q-num{font-family:var(--mono);font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:rgba(30,26,37,.45);font-weight:800;}
.share-q-pts{font-family:var(--serif);font-size:15px;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums;}
.share-q-pts small{font-family:var(--mono);font-size:9.5px;font-weight:700;color:rgba(30,26,37,.4);margin-left:2px;}
.btn-copy{width:100%;background:linear-gradient(180deg,var(--theme-action-top),var(--teal));color:#fff;font-weight:800;font-size:14px;padding:12px;border-radius:var(--r-md);border:none;cursor:pointer;transition:filter .15s;display:flex;align-items:center;justify-content:center;gap:8px;box-shadow:0 3px 0 var(--theme-action-shadow);}
.btn-copy:hover{filter:brightness(1.05);}
.btn-copy.copied{background:var(--ink);}
.share-actions{display:grid;gap:9px;}
/* When the native share sheet exists it becomes the primary action and Copy
   steps down, so the two never compete for the same tap. */
.btn-copy-alt{background:transparent;color:var(--ink);border:1.5px solid rgba(var(--brass-rgb),.34);box-shadow:none;}
.btn-copy-alt:hover{background:rgba(var(--brass-rgb),.09);filter:none;}
.btn-copy-alt.copied{background:var(--ink);color:#fff;border-color:var(--ink);}
.btn-invite-inline{width:100%;margin-top:9px;padding:11px;border-radius:var(--r-md);border:1px dashed rgba(var(--brass-rgb),.42);background:rgba(var(--brass-rgb),.07);color:var(--theme-button-ink);font-weight:700;font-size:13px;cursor:pointer;transition:background .15s;display:flex;align-items:center;justify-content:center;gap:8px;}
.btn-invite-inline:hover{background:rgba(var(--brass-rgb),.14);}
.btn-invite-inline.copied{background:var(--ink);color:#fff;border-style:solid;border-color:var(--ink);}
.comeback-box{margin-top:12px;text-align:center;padding:14px;background:rgba(var(--brass-rgb),.08);border:1px dashed rgba(var(--brass-rgb),.34);border-radius:var(--r-md);}
.comeback-label{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--brass);margin-bottom:6px;}
.comeback-countdown{font-family:var(--mono);font-size:22px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums;}
.btn-home-after{width:100%;margin-top:12px;padding:13px;border-radius:var(--r-md);border:1.5px solid var(--line);background:transparent;color:var(--ink);font-weight:600;font-size:14px;cursor:pointer;transition:background .15s;display:flex;align-items:center;justify-content:center;gap:8px;}
.btn-home-after:hover{background:var(--theme-tint);}

.modal-overlay{display:none;position:fixed;inset:0;background:rgba(17,24,38,.76);backdrop-filter:blur(4px);z-index:100;align-items:center;justify-content:center;padding:20px;}
.modal-overlay.show{display:flex;animation:fadeIn .18s ease;}
@keyframes fadeIn{from{opacity:0;}to{opacity:1;}}
.modal{background:var(--paper);color:var(--ink);border-radius:var(--r-lg);padding:24px;width:100%;max-width:340px;box-shadow:0 24px 60px rgba(0,0,0,.5);}
.modal h3{font-family:var(--serif);font-size:21px;font-weight:700;margin:0 0 6px;}
.modal p{font-size:13.5px;color:rgba(17,24,38,.62);line-height:1.55;margin:0 0 20px;}
.modal-btns{display:flex;flex-direction:column;gap:8px;}
.btn-modal-danger{padding:13px;border-radius:var(--r-md);border:none;cursor:pointer;background:var(--red);color:#fff;font-weight:600;font-size:14px;transition:opacity .15s;}
.btn-modal-danger:hover{opacity:.9;}
.btn-modal-cancel{padding:13px;border-radius:var(--r-md);border:1.5px solid var(--line);cursor:pointer;background:transparent;color:var(--ink);font-weight:600;font-size:14px;transition:background .15s;}
.btn-modal-cancel:hover{background:var(--paper-2);}

/* ── FRIENDLY GAME FLOW ── */
#screenGame .top-nav{padding:0 4px;}
#screenGame .nav-back{border-radius:999px;background:rgba(255,255,255,.18);border-color:rgba(255,255,255,.3);box-shadow:0 5px 14px rgba(70,40,20,.08);}
#screenGame .nav-back:hover{background:rgba(255,255,255,.27);border-color:rgba(255,255,255,.45);}
#screenGame .nav-title,#screenGame .progress-label{color:rgba(255,255,255,.72);}
#screenGame .progress-dots{gap:7px;}
#screenGame .progress-dot{width:24px;height:10px;border:0;background:rgba(255,255,255,.24);box-shadow:0 1px 0 rgba(255,255,255,.16) inset;}
#screenGame .progress-dot.done{background:var(--teal);}
#screenGame .progress-dot.active{background:var(--brass);box-shadow:0 0 0 4px rgba(var(--brass-rgb),.24);}

#questionCard,#dayCard{
  border:1.5px solid rgba(255,255,255,.62);
  background:linear-gradient(155deg,var(--theme-tint-2),var(--paper));
  box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 14px 34px rgba(86,45,20,.2);
}
#questionCard::before,#dayCard::before{height:7px;border-radius:999px;left:22px;right:22px;top:8px;}
#questionCard .card-row{margin-top:5px;}
#questionCard .category-tag{border:0;background:rgba(var(--brass-rgb),.2);box-shadow:none;padding:7px 13px;}
#questionCard .question{letter-spacing:-.01em;}
.prestart-card{border-radius:24px;background:linear-gradient(135deg,rgba(var(--brass-rgb),.22),rgba(var(--teal-rgb),.14));box-shadow:0 8px 20px rgba(80,45,20,.08),0 1px 0 rgba(255,255,255,.8) inset;}
.countdown-track{height:12px;background:rgba(var(--brass-rgb),.13);box-shadow:0 1px 0 rgba(255,255,255,.75) inset;}
.countdown-fill{background:linear-gradient(90deg,var(--teal),var(--theme-action-top),var(--brass));}

.input-display{
  border-radius:999px;
  border:2px solid rgba(var(--brass-rgb),.28);
  background:#fffdf8;
  padding-left:20px;
  padding-right:20px;
  box-shadow:0 7px 17px rgba(83,47,20,.08),0 1px 0 #fff inset;
}
.input-display.state-empty{box-shadow:0 0 0 4px rgba(var(--brass-rgb),.14),0 7px 17px rgba(83,47,20,.08);}
.input-display.state-filled{box-shadow:0 0 0 4px rgba(var(--teal-rgb),.14),0 7px 17px rgba(83,47,20,.08);}
.numpad{gap:9px;}
.np-btn{
  border-radius:999px;
  border:1.5px solid rgba(var(--brass-rgb),.16);
  background:linear-gradient(180deg,#fff,var(--theme-tint));
  box-shadow:0 4px 0 rgba(var(--brass-rgb),.18),0 7px 14px rgba(80,45,20,.06),0 1px 0 #fff inset;
}
.np-btn:hover:not(:disabled){border-color:rgba(var(--brass-rgb),.5);background:linear-gradient(180deg,#fff,var(--theme-tint-3));}
.np-btn:active,.np-btn.tap{background:var(--theme-tint);box-shadow:0 1px 0 rgba(var(--brass-rgb),.22);}
.np-btn.np-submit{
  border-radius:999px;
  background:linear-gradient(180deg,var(--theme-action-top),var(--teal));
  color:#fff;
  border:0;
  text-shadow:0 1px 1px rgba(0,0,0,.15);
  box-shadow:0 5px 0 var(--theme-action-shadow),0 10px 20px rgba(var(--teal-rgb),.2),0 1px 0 rgba(255,255,255,.3) inset;
}
.np-btn.np-submit:active{background:var(--teal);box-shadow:0 2px 0 var(--theme-action-shadow);}
.np-btn.np-submit:disabled{background:linear-gradient(180deg,var(--paper-3),#D8C9A7);color:rgba(30,26,37,.4);box-shadow:0 4px 0 #BCAF91;opacity:1;}

.mini-result.show{gap:7px;}
.result-header,.reveal-card,.ruler-wrap,.result-banter{
  border:1px solid rgba(var(--brass-rgb),.14);
  border-radius:20px;
  background:linear-gradient(145deg,var(--theme-tint),rgba(255,255,255,.72));
}
.result-header{border-bottom:1px solid rgba(var(--brass-rgb),.14);}
.result-ic{border:0;border-radius:50%;background:rgba(var(--brass-rgb),.2);box-shadow:none;}
.reveal-card{border-top:1px solid rgba(var(--brass-rgb),.14);}
.reveal-cell{border:0;border-radius:15px;background:rgba(255,255,255,.64);}
body.game-fixed #questionCard.has-result .reveal-card{flex:1 1 auto;min-height:150px;}
body.game-fixed #questionCard.has-result .reveal-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;flex:1;}
body.game-fixed #questionCard.has-result .reveal-cell{
  min-height:clamp(62px,9vh,88px);
  padding:clamp(10px,1.8vh,16px);
  display:flex;
  flex-direction:column;
  justify-content:center;
}
body.game-fixed #questionCard.has-result .reveal-value{font-size:clamp(12px,3.2vw,16px);}
.result-direction-cell{--result-color:#B97813;--result-rgb:185,120,19;background:rgba(255,255,255,.64);}
.result-direction-cell.tone-perfect{--result-color:#167A52;--result-rgb:22,122,82;}
.result-direction-cell.tone-close{--result-color:#168A83;--result-rgb:22,138,131;}
.result-direction-cell.tone-near{--result-color:#B97813;--result-rgb:185,120,19;}
.result-direction-cell.tone-wide{--result-color:#C45B2C;--result-rgb:196,91,44;}
.result-direction-cell.tone-far{--result-color:#B9443A;--result-rgb:185,68,58;}
.result-direction-cell.tone-blank{--result-color:#6C7482;--result-rgb:108,116,130;}
.result-direction-cell .reveal-label,.result-direction-cell .reveal-value{color:var(--result-color);}
.result-direction-cell .reveal-value{font-weight:950;}
.ruler-wrap{border-left:1px solid rgba(var(--brass-rgb),.14);border-right:1px solid rgba(var(--brass-rgb),.14);}
.result-banter{border-left:1px solid rgba(var(--brass-rgb),.14);border-right:1px solid rgba(var(--brass-rgb),.14);}
.next-btn-wrap{border:0;border-radius:999px;background:transparent;overflow:visible;margin-top:1px;}
.btn-next{
  border-radius:999px;
  background:linear-gradient(180deg,var(--theme-button-top),var(--brass));
  color:var(--theme-button-ink);
  text-shadow:none;
  box-shadow:0 5px 0 var(--theme-button-shadow),0 10px 20px rgba(var(--brass-rgb),.22),0 1px 0 rgba(255,255,255,.38) inset;
}
.btn-next .icon{filter:none;}
.btn-next:active{transform:translateY(3px);box-shadow:0 2px 0 var(--theme-button-shadow);}

.day-ic{border:0;border-radius:50%;background:rgba(var(--brass-rgb),.18);box-shadow:0 5px 0 rgba(var(--brass-rgb),.13);}
.score-ring{filter:drop-shadow(0 8px 12px rgba(var(--teal-rgb),.12));}
.stat{border:0;border-radius:20px;background:linear-gradient(145deg,var(--theme-tint),rgba(255,255,255,.78));box-shadow:0 5px 13px rgba(80,45,20,.06);}
.bi-card{border:1px solid rgba(var(--brass-rgb),.16);border-radius:20px;background:rgba(255,255,255,.64);box-shadow:0 5px 13px rgba(80,45,20,.05);}
.bi-score-breakdown{border-radius:16px;}
.share-preview{border:0;border-radius:22px;box-shadow:0 7px 18px rgba(80,45,20,.08);}
.share-q-row{border:0;border-radius:14px;background:rgba(255,255,255,.65);}
.btn-copy,.btn-home-after,.btn-invite-inline{border-radius:999px;}
.btn-copy{padding:14px;box-shadow:0 5px 0 var(--theme-action-shadow),0 10px 18px rgba(var(--teal-rgb),.18);}
.btn-copy-alt{box-shadow:none;border-color:rgba(var(--brass-rgb),.28);background:rgba(255,255,255,.5);}
.comeback-box{border:0;border-radius:22px;background:rgba(var(--brass-rgb),.11);}
.btn-home-after{border:1.5px solid rgba(var(--brass-rgb),.25);background:rgba(255,255,255,.5);}

@media(min-width:800px){
  .screen{padding:36px 28px 64px;}
  .screen-inner{width:min(82vw,880px);max-width:880px;}

  /* Keep the same vertical rhythm as mobile, scaled for a monitor. */
  #screenHome .hero{padding-top:18px;}
  #screenHome .hero-mark{width:62px;height:62px;margin-bottom:18px;}
  #screenHome .hero h1{font-size:clamp(60px,6vw,76px);}
  #screenHome .hero-sub{font-size:16px;max-width:500px;}
  #screenHome .home-stats{grid-template-columns:repeat(4,1fr);gap:12px;margin:26px 0;}
  #screenHome .hs-cell{padding:18px 10px;}
  #screenHome .hs-val{font-size:30px;}
  #screenHome .home-panel{padding:20px 22px;margin-bottom:16px;}
  #screenHome .home-buttons{gap:13px;}
  #screenHome .btn-play{min-height:80px;font-size:22px;}
  #screenHome .btn-secondary{min-height:66px;padding-left:18px;padding-right:22px;}

  #screenHow .card,#screenSettings .card,#dayCard{padding:28px 30px;}

  body.game-fixed #screenGame{padding:20px 28px 24px;}
  body.game-fixed #screenGame .screen-inner{width:min(78vw,820px);max-width:820px;margin:0 auto;}
  body.game-fixed #screenGame .top-nav{margin-bottom:12px;}
  body.game-fixed #screenGame .progress-wrap{margin-bottom:12px;}
  body.game-fixed #questionCard{
    display:flex;
    padding:20px 24px 18px;
  }
  body.game-fixed #questionCard .question{font-size:clamp(24px,2.3vw,30px);line-height:1.22;-webkit-line-clamp:3;}
  body.game-fixed #questionCard .prestart-card.show{max-height:136px;margin:10px 0;padding:13px 16px;}
  body.game-fixed #questionCard .input-display{min-height:56px;font-size:26px;}
  body.game-fixed #questionCard .numpad{gap:9px;}
  body.game-fixed #questionCard .np-btn{height:clamp(46px,6.4dvh,58px);font-size:22px;}
  body.game-fixed #questionCard .np-submit{font-size:16px;}

  /* Result and completion screens retain the same single reading path. */
  body.game-fixed #questionCard.has-result .mini-result.show{
    display:flex;
    flex-direction:column;
    gap:7px;
  }
  #dayCard.show{display:block;}
  #dayCard .stat-grid{grid-template-columns:repeat(4,1fr);}
}

@media(max-width:460px){
  .screen{padding:20px 10px 38px;}
  .screen-inner{max-width:100%;}
  body.game-fixed #screenGame{padding:12px 10px;}
  body.game-fixed #questionCard{padding:12px 12px 10px;}
  body.game-fixed #questionCard .question{font-size:19px;line-height:1.2;}
  body.game-fixed #questionCard .countdown-wrap{margin:8px 0;}
  body.game-fixed #questionCard .input-display{min-height:44px;font-size:21px;}
  body.game-fixed #questionCard #negativePrefix{font-size:21px;}
  body.game-fixed #questionCard .prestart-card.show{grid-template-columns:auto 1fr;gap:9px;margin:8px 0;padding:9px;max-height:104px;}
  body.game-fixed #questionCard .prestart-ring,
  body.game-fixed #questionCard .prestart-ring svg{width:46px;height:46px;}
  body.game-fixed #questionCard .prestart-kicker{font-size:8.5px;margin-bottom:2px;}
  body.game-fixed #questionCard .prestart-title{font-size:16px;}
  body.game-fixed #questionCard .prestart-note{font-size:11px;line-height:1.25;}
  body.game-fixed #questionCard.has-result .question{font-size:18px;}
  body.game-fixed #questionCard.has-result .reveal-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  body.game-fixed #questionCard.has-result .ruler-wrap{min-height:126px;padding:30px 12px 24px;gap:14px;}
  body.game-fixed #questionCard.has-result .ruler-track{height:14px;}
  body.game-fixed #questionCard.has-result .ruler-gap{height:5px;}
  body.game-fixed #questionCard.has-result .marker .marker-label{font-size:8px;max-width:42vw;padding:4px 7px;bottom:18px;}
  body.game-fixed #questionCard.has-result .marker .pin{width:22px;height:22px;}
  body.game-fixed #questionCard.has-result .ruler-endlabels{font-size:10px;}
  .hero-mark{width:42px;height:42px;margin-bottom:11px;}
  .hero h1{font-size:42px;}
  .hero-sub{font-size:13.5px;}
  .home-stats{gap:8px;}
  .hs-cell{padding:12px 8px;}
  .btn-secondary{padding:13px 12px;gap:10px;}
  .card{padding:18px 14px;}
  .question{font-size:20px;}
  .prestart-card{gap:11px;}
  .prestart-card.show{padding:12px;max-height:190px;}
  .prestart-ring{width:56px;height:56px;}
  .prestart-ring svg{width:56px;height:56px;}
  .prestart-num{font-size:27px;}
  .prestart-title{font-size:18px;}
  .prestart-note{font-size:12px;}
  .input-display{font-size:22px;padding:12px 13px;}
  #negativePrefix{font-size:22px;}
  .placeholder-text{font-size:15px;}
  .input-unit-label{font-size:11.5px;max-width:38%;}
  .home-panel-head{align-items:flex-start;flex-direction:column;gap:4px;}
  .home-panel-sub{white-space:normal;}
  .np-btn{height:52px;}
  .reveal-grid{grid-template-columns:1fr;}
  .marker .marker-label{max-width:43vw;overflow:hidden;text-overflow:ellipsis;}
  .bi-header{align-items:flex-start;}
  .bi-q{min-width:0;}
  .bi-stat-row{gap:10px;align-items:flex-start;}
  .bi-stat-val{text-align:right;overflow-wrap:anywhere;}
  .share-preview{padding:14px;}
  .share-preview-score{font-size:30px;}
  .share-preview-main{align-items:flex-start;}
}

/* ── FOCUSED QUESTION PREVIEW ── */
#questionCard,#dayCard{
  background:
    radial-gradient(circle at 92% 4%,rgba(var(--teal-rgb),.18),transparent 34%),
    radial-gradient(circle at 4% 96%,rgba(var(--brass-rgb),.2),transparent 38%),
    linear-gradient(155deg,var(--theme-tint-2),var(--theme-tint));
  border:2px solid rgba(255,255,255,.5);
  box-shadow:
    0 0 0 5px rgba(var(--brass-rgb),.1),
    0 1px 0 rgba(255,255,255,.9) inset,
    0 18px 42px rgba(86,45,20,.2);
}
#questionCard::after,#dayCard::after{
  content:"";
  position:absolute;
  inset:8px;
  border:1px solid rgba(var(--brass-rgb),.13);
  border-radius:calc(var(--r-lg) - 7px);
  pointer-events:none;
}
#questionCard.is-preparing{
  background:
    radial-gradient(circle at 18% 10%,rgba(var(--brass-rgb),.25),transparent 38%),
    radial-gradient(circle at 88% 92%,rgba(var(--teal-rgb),.22),transparent 42%),
    linear-gradient(145deg,var(--theme-tint-2),var(--theme-tint));
}
#questionCard.is-preparing > .card-row,
#questionCard.is-preparing > .question,
#questionCard.is-preparing > .countdown-wrap,
#questionCard.is-preparing > .input-display,
#questionCard.is-preparing > .numpad{display:none!important;}
body.game-fixed #questionCard.is-preparing .prestart-card.show{
  display:flex;
  position:relative;
  flex:1 1 auto;
  min-height:0;
  max-height:none;
  margin:0;
  padding:clamp(20px,4vh,42px) clamp(18px,5vw,52px);
  opacity:1;
  overflow:hidden;
  transform:none;
  pointer-events:auto;
  border:0;
  border-radius:24px;
  background:transparent;
  box-shadow:none;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  gap:clamp(9px,1.7vh,18px);
  text-align:center;
}
#questionCard.is-preparing .prestart-card::before{
  background:
    radial-gradient(circle at 14% 20%,rgba(var(--brass-rgb),.15),transparent 30%),
    radial-gradient(circle at 86% 82%,rgba(var(--teal-rgb),.13),transparent 32%);
}
#questionCard.is-preparing .prestart-kicker{
  position:relative;
  z-index:1;
  margin:0;
  padding:7px 13px;
  border-radius:999px;
  background:rgba(var(--brass-rgb),.18);
  color:var(--theme-button-ink);
  font-size:11px;
}
.preview-question{
  position:relative;
  z-index:1;
  flex:1 1 auto;
  min-height:0;
  width:100%;
  max-width:820px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:var(--serif);
  font-size:clamp(42px,5.8vw,68px);
  font-weight:800;
  line-height:1.06;
  letter-spacing:-.025em;
  color:var(--ink);
  text-wrap:balance;
}
.preview-question.preview-short{font-size:clamp(48px,6.5vw,76px);}
.preview-question.preview-long{font-size:clamp(36px,4.7vw,56px);}
.preview-unit{
  position:relative;
  z-index:1;
  padding:9px 16px;
  border-radius:999px;
  background:rgba(var(--teal-rgb),.13);
  color:var(--ink);
  font-size:clamp(13px,1.5vw,17px);
  font-weight:850;
}
.preview-unit strong{color:#111018;font-weight:950;}
#questionCard.is-preparing .prestart-ring,
#questionCard.is-preparing .prestart-ring svg{
  width:clamp(74px,11vh,108px);
  height:clamp(74px,11vh,108px);
}
#questionCard.is-preparing .prestart-ring{margin-top:2px;}
#questionCard.is-preparing .prestart-num{font-size:clamp(34px,5vh,48px);}
#questionCard.is-preparing .prestart-title{
  position:relative;
  z-index:1;
  font-size:clamp(17px,2vw,22px);
}
#questionCard.is-preparing .prestart-note{
  position:relative;
  z-index:1;
  margin:0;
  font-size:13px;
}
#questionCard.is-preparing .prestart-meter{
  position:relative;
  z-index:1;
  width:min(100%,420px);
  height:9px;
  margin:0 0 2px;
  flex-shrink:0;
}
#questionCard:not(.is-preparing) > .card-row,
#questionCard:not(.is-preparing) > .question,
#questionCard:not(.is-preparing) > .countdown-wrap,
#questionCard:not(.is-preparing) > .input-display,
#questionCard:not(.is-preparing) > .numpad{animation:answerStageIn .32s ease both;}
body.game-fixed #questionCard:not(.is-preparing):not(.has-result) .numpad{
  flex:1 1 auto;
  min-height:0;
  grid-template-rows:repeat(4,minmax(42px,1fr)) minmax(48px,1fr);
}
body.game-fixed #questionCard:not(.is-preparing):not(.has-result) .np-btn{
  height:auto;
  min-height:0;
}
@keyframes answerStageIn{
  from{opacity:0;transform:translateY(8px);}
  to{opacity:1;transform:translateY(0);}
}
@media(max-width:460px){
  body.game-fixed #questionCard.is-preparing{padding:12px;}
  body.game-fixed #questionCard.is-preparing .prestart-card.show{padding:18px 10px;gap:9px;}
  .preview-question{font-size:clamp(38px,10.5vw,48px);line-height:1.04;}
  .preview-question.preview-short{font-size:clamp(43px,12vw,54px);}
  .preview-question.preview-long{font-size:clamp(32px,8.7vw,40px);}
  .preview-unit{font-size:14px;padding:8px 14px;}
  .input-unit-label{font-size:13px;font-weight:950;color:#111018;max-width:44%;}
  .theme-grid{grid-template-columns:repeat(3,minmax(56px,72px));gap:14px 18px;}
  #questionCard.is-preparing .prestart-ring,
  #questionCard.is-preparing .prestart-ring svg{width:72px;height:72px;}
  #questionCard.is-preparing .prestart-num{font-size:33px;}
  #questionCard.is-preparing .prestart-title{font-size:17px;}
  #questionCard.is-preparing .prestart-note{font-size:11.5px;}
  body.game-fixed #questionCard:not(.is-preparing):not(.has-result) .question{font-size:21px;}
  body.game-fixed #questionCard:not(.is-preparing):not(.has-result) .numpad{gap:8px;}
}

button{font-family:var(--sans);border:none;cursor:pointer;touch-action:manipulation;}
button:focus-visible{outline:2px solid var(--brass);outline-offset:2px;}

/* ============================================================
   CLOSEENOUGH ADDITIONS
   Components the design handoff has no equivalent for: the
   first-run intro, the welcome/sign-in screen, the daily-average
   comparison, and the tone-aware result text. Written with the
   handoff's own tokens so they read as one design.
   ============================================================ */

/* --- first-run intro --- */
.intro-inner{display:flex;flex-direction:column;justify-content:center;min-height:100%;position:relative;}
.intro-close{position:absolute;top:-2px;right:0;width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:27px;line-height:1;color:var(--paper);background:rgba(255,255,255,.2);border:1.5px solid rgba(255,255,255,.38);box-shadow:0 7px 18px rgba(50,30,20,.13),0 1px 0 rgba(255,255,255,.25) inset;backdrop-filter:blur(10px);cursor:pointer;transition:background .15s,border-color .15s,transform .12s;}
.intro-close:hover{background:rgba(255,255,255,.3);border-color:rgba(255,255,255,.6);transform:translateY(-1px);}
.intro-close:active{transform:translateY(1px);}
.intro-top{text-align:center;margin-bottom:22px;}
.intro-eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--theme-readable);margin-bottom:9px;}
.intro-title{font-family:var(--serif);font-weight:800;font-size:clamp(42px,11vw,58px);margin:0 0 11px;line-height:1.02;letter-spacing:-.02em;text-shadow:0 4px 0 rgba(0,0,0,.14);}
.intro-title em{font-style:italic;color:var(--theme-readable);}
.intro-pitch{font-size:15px;color:var(--ink-soft);line-height:1.5;margin:0;}
.intro-points{display:flex;flex-direction:column;gap:10px;margin-bottom:20px;}
.intro-point{display:flex;align-items:flex-start;gap:13px;background:rgba(255,255,255,.18);border:1.5px solid rgba(255,255,255,.3);border-radius:var(--r-md);padding:14px 16px;box-shadow:0 7px 16px rgba(70,40,20,.08),0 1px 0 rgba(255,255,255,.16) inset;}
.intro-ic{width:38px;height:38px;flex-shrink:0;border-radius:50%;background:linear-gradient(160deg,var(--theme-button-top),var(--brass));color:var(--theme-button-ink);display:flex;align-items:center;justify-content:center;box-shadow:0 4px 0 var(--theme-button-shadow);}
.intro-text{font-size:13.5px;line-height:1.5;color:var(--ink-soft);}
.intro-text b{color:#fff;font-weight:850;}
.intro-go{margin-bottom:13px;}
.intro-foot{text-align:center;font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;color:var(--ink-faint);}

/* --- welcome / sign-in --- */
.welcome-inner{display:flex;flex-direction:column;justify-content:center;min-height:100%;}
.welcome-card{display:flex;flex-direction:column;gap:11px;}
.welcome-lead{text-align:center;font-size:14px;color:var(--ink-soft);line-height:1.5;margin-bottom:3px;}
.btn-guest{width:100%;padding:14px;border-radius:999px;cursor:pointer;background:rgba(255,255,255,.12);border:1.5px solid rgba(255,255,255,.26);color:var(--ink-soft);font-size:14px;font-weight:800;transition:background .15s,border-color .15s,color .15s,transform .1s;}
.btn-guest:hover{background:rgba(255,255,255,.22);border-color:rgba(255,255,255,.44);color:#fff;transform:translateY(-1px);}
.btn-guest:active{transform:translateY(1px);}
.welcome-note{text-align:center;font-family:var(--mono);font-size:10.5px;line-height:1.5;color:var(--ink-faint);margin-top:2px;}
.welcome-divider{display:flex;align-items:center;gap:11px;font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint);margin:3px 0;}
.welcome-divider::before,.welcome-divider::after{content:"";flex:1;height:1px;background:rgba(255,255,255,.24);}
.auth-field{width:100%;height:50px;border-radius:999px;border:1.5px solid rgba(255,255,255,.3);background:rgba(255,255,255,.9);color:var(--ink);font:700 14.5px var(--sans);padding:0 18px;outline:none;transition:border-color .15s,box-shadow .15s;}
.auth-field::placeholder{color:rgba(30,26,37,.38);font-weight:600;}
.auth-field:focus{border-color:var(--teal);box-shadow:0 0 0 4px rgba(var(--teal-rgb),.2);}
.auth-error{display:none;font-size:12.5px;font-weight:700;color:#fff;background:rgba(200,85,68,.86);border:1.5px solid rgba(255,255,255,.28);border-radius:var(--r-sm);padding:10px 13px;line-height:1.4;box-shadow:0 6px 14px rgba(80,20,10,.18);}
.auth-error.show{display:block;}
.btn-google{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:52px;border-radius:999px;border:1px solid rgba(30,26,37,.13);background:#fff;color:var(--ink);font-family:var(--sans);font-size:15px;font-weight:850;cursor:pointer;box-shadow:0 4px 0 rgba(30,26,37,.12),0 10px 20px rgba(50,30,20,.12);transition:filter .15s,transform .1s;}
.btn-google:hover{filter:brightness(.98);transform:translateY(-1px);}
.btn-google:active{transform:translateY(2px);box-shadow:0 2px 0 rgba(30,26,37,.12);}
.btn-google:disabled,.btn-guest:disabled{opacity:.55;cursor:not-allowed;}

/* --- how you did vs everyone today --- */
.vs-card{background:linear-gradient(150deg,var(--theme-tint-2),var(--theme-tint));border:1px solid rgba(var(--brass-rgb),.28);border-radius:var(--r-md);padding:15px 16px;margin-bottom:11px;box-shadow:0 4px 0 rgba(30,26,37,.07),0 1px 0 rgba(255,255,255,.8) inset;}
.vs-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;}
.vs-kicker{display:flex;align-items:center;gap:7px;font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;font-weight:800;color:rgba(30,26,37,.6);}
.vs-players{font-family:var(--mono);font-size:9.5px;color:rgba(30,26,37,.44);white-space:nowrap;}
.vs-verdict{font-family:var(--serif);font-size:21px;font-weight:850;line-height:1.15;color:var(--ink);margin-bottom:24px;letter-spacing:-.01em;}
.vs-verdict.above{color:var(--green);}
.vs-verdict.below{color:var(--red);}
.vs-bar{position:relative;height:12px;border-radius:999px;background:rgba(30,26,37,.1);box-shadow:0 1px 0 rgba(255,255,255,.6) inset;}
.vs-bar-fill{height:100%;width:0;border-radius:999px;background:linear-gradient(90deg,var(--brass),var(--teal));transition:width .9s cubic-bezier(.22,1,.36,1);}
.vs-bar-avg{position:absolute;top:-5px;bottom:-5px;width:3px;background:rgba(30,26,37,.6);border-radius:3px;transition:left .9s cubic-bezier(.22,1,.36,1);}
.vs-bar-avg-label{position:absolute;left:50%;top:-16px;transform:translateX(-50%);font-family:var(--mono);font-size:8.5px;letter-spacing:.06em;text-transform:uppercase;color:rgba(30,26,37,.5);}
.vs-numbers{display:flex;justify-content:space-between;margin-top:11px;font-family:var(--mono);font-size:11px;color:rgba(30,26,37,.5);}
.vs-numbers b{font-size:15px;font-weight:900;color:var(--ink);}
.vs-card.is-pending .vs-bar,.vs-card.is-pending .vs-numbers{opacity:.4;}

/* --- result direction text (arrows + magnitude + closeness tier) --- */
.dir-line{display:flex;align-items:center;gap:5px;line-height:1.15;font-weight:950;}
.dir-line .icon{flex-shrink:0;stroke-width:3;}


/* --- profile popover: real auth needs a password + signup affordance --- */
.profile-stack-input{width:100%;height:42px;border:1.5px solid rgba(var(--brass-rgb),.25);border-radius:999px;background:rgba(255,255,255,.72);color:var(--ink);font:600 13px var(--sans);padding:0 14px;outline:none;margin-bottom:7px;transition:border-color .15s,box-shadow .15s;}
.profile-stack-input:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(var(--teal-rgb),.13);}
.profile-auth-error{display:none;margin-top:9px;font-size:11.5px;font-weight:700;line-height:1.4;color:var(--red);background:rgba(200,85,68,.09);border:1px solid rgba(200,85,68,.22);border-radius:var(--r-sm);padding:8px 11px;}
.profile-auth-error.show{display:block;}
.profile-signup-link{display:block;width:100%;margin-top:10px;padding:8px;border:0;background:transparent;color:var(--teal);font:800 12px var(--sans);cursor:pointer;text-align:center;border-radius:999px;transition:background .15s;}
.profile-signup-link:hover{background:rgba(var(--teal-rgb),.1);}
button.theme-swatch{padding:0;font:inherit;-webkit-appearance:none;appearance:none;}

/* ── LEADERBOARD ──
   Reuses the card surface from the How/Settings screens so the board reads as
   part of the app rather than a bolted-on page. */
.lb-tabs{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:14px;}
.lb-tab{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px;border-radius:999px;border:1.5px solid rgba(255,255,255,.3);background:rgba(255,255,255,.14);color:var(--ink-soft);font:800 13.5px var(--sans);cursor:pointer;transition:background .15s,color .15s,border-color .15s;backdrop-filter:blur(8px);}
.lb-tab:hover{background:rgba(255,255,255,.22);color:var(--paper);}
.lb-tab.active{background:var(--paper);color:var(--ink);border-color:var(--paper);box-shadow:0 6px 16px rgba(40,25,15,.16);}
.lb-panel[hidden]{display:none;}
.lb-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:14px;}
.lb-title{font-family:var(--serif);font-size:20px;font-weight:800;color:var(--ink);}
.lb-date{font-family:var(--mono);font-size:11px;color:rgba(30,26,37,.45);white-space:nowrap;}
.lb-copy{font-size:13px;line-height:1.5;color:rgba(30,26,37,.68);margin-bottom:14px;}

.lb-row{display:flex;align-items:center;gap:12px;padding:11px 13px;border-radius:var(--r-md);background:rgba(255,255,255,.6);margin-bottom:7px;}
.lb-row.is-me{background:rgba(var(--teal-rgb),.13);box-shadow:inset 0 0 0 1.5px rgba(var(--teal-rgb),.4);}
.lb-rank{flex-shrink:0;width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:11.5px;font-weight:800;color:rgba(30,26,37,.5);background:rgba(var(--brass-rgb),.16);}
.lb-rank.lb-1{background:var(--brass);color:#3B2805;}
.lb-rank.lb-2{background:#D9DDE3;color:#3A3F47;}
.lb-rank.lb-3{background:#E3B58C;color:#4A2E17;}
.lb-name{flex:1;min-width:0;font-size:14px;font-weight:700;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.lb-you{display:inline-block;margin-left:7px;padding:2px 7px;border-radius:999px;background:var(--teal);color:#fff;font:800 9.5px var(--mono);letter-spacing:.06em;text-transform:uppercase;vertical-align:1px;}
.lb-score{flex-shrink:0;font-family:var(--serif);font-size:18px;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums;}
.lb-score small{font-family:var(--mono);font-size:10px;font-weight:700;color:rgba(30,26,37,.4);margin-left:2px;}
.lb-score em{font-style:normal;font-family:var(--sans);font-size:11.5px;font-weight:700;color:rgba(30,26,37,.38);}
.lb-empty{padding:22px 14px;text-align:center;font-size:13px;line-height:1.5;color:rgba(30,26,37,.5);background:rgba(var(--brass-rgb),.07);border:1px dashed rgba(var(--brass-rgb),.3);border-radius:var(--r-md);}
.lb-foot{margin-top:12px;text-align:center;font-size:12px;font-weight:700;color:var(--teal);}
.lb-foot:empty{display:none;}

.lb-form{margin-bottom:4px;}
.lb-form label{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;font-weight:800;color:var(--theme-button-ink);margin-bottom:7px;}
.lb-form-row{display:flex;gap:8px;}
.lb-form-row input{flex:1;min-width:0;height:44px;border:1.5px solid rgba(var(--brass-rgb),.25);border-radius:999px;background:rgba(255,255,255,.72);color:var(--ink);font:600 14px var(--sans);padding:0 16px;outline:none;transition:border-color .15s,box-shadow .15s;}
.lb-form-row input:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(var(--teal-rgb),.13);}
#lbJoinCodeInput{font-family:var(--mono);font-weight:800;letter-spacing:.16em;text-transform:uppercase;}
.lb-form-row button{flex-shrink:0;padding:0 20px;height:44px;border:0;border-radius:999px;background:linear-gradient(180deg,var(--theme-action-top),var(--teal));color:#fff;font:800 13.5px var(--sans);cursor:pointer;box-shadow:0 4px 0 var(--theme-action-shadow);transition:filter .15s;}
.lb-form-row button:hover{filter:brightness(1.05);}
.lb-or{text-align:center;font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:rgba(30,26,37,.35);margin:14px 0;}
.lb-error{margin-top:12px;font-size:12px;font-weight:700;line-height:1.4;color:var(--red);}
.lb-error:empty{display:none;}

.lb-code-box{text-align:center;padding:16px;margin-bottom:16px;border-radius:var(--r-md);background:linear-gradient(135deg,var(--theme-tint-2),var(--theme-tint));border:1px dashed rgba(var(--brass-rgb),.4);}
.lb-code-label{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;font-weight:800;color:var(--theme-button-ink);margin-bottom:8px;}
.lb-code{font-family:var(--mono);font-size:29px;font-weight:800;letter-spacing:.2em;color:var(--ink);margin-bottom:12px;user-select:all;word-break:break-all;}
.lb-code-copy{display:inline-flex;align-items:center;gap:8px;padding:10px 20px;border-radius:999px;border:0;background:linear-gradient(180deg,var(--theme-action-top),var(--teal));color:#fff;font:800 13px var(--sans);cursor:pointer;box-shadow:0 4px 0 var(--theme-action-shadow);transition:filter .15s;}
.lb-code-copy:hover{filter:brightness(1.05);}
.lb-code-copy.copied{background:var(--ink);box-shadow:0 4px 0 rgba(0,0,0,.3);}
.lb-leave{width:100%;margin-top:14px;padding:12px;border-radius:999px;border:1.5px solid rgba(200,85,68,.3);background:transparent;color:var(--red);font:700 13px var(--sans);cursor:pointer;transition:background .15s;}
.lb-leave:hover{background:rgba(200,85,68,.09);}

@media(min-width:800px){
  .lb-tabs{max-width:420px;margin-left:auto;margin-right:auto;}
}
/* ── INVITE LANDING ── */
.join-inner{display:flex;flex-direction:column;justify-content:center;min-height:100%;}
.join-card{background:linear-gradient(155deg,var(--theme-tint-2),var(--theme-tint));border:1.5px solid rgba(255,255,255,.72);border-radius:var(--r-lg);padding:24px 20px;box-shadow:0 20px 50px rgba(43,27,30,.22),0 0 0 4px rgba(var(--brass-rgb),.1);text-align:center;}
.join-state[hidden]{display:none;}
.join-lead{font-size:14px;font-weight:700;color:rgba(30,26,37,.6);padding:14px 0;}
.join-group-name{font-family:var(--serif);font-size:26px;font-weight:800;line-height:1.15;color:var(--ink);margin-bottom:7px;word-break:break-word;}
.join-group-meta{font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:rgba(30,26,37,.45);margin-bottom:16px;}
.join-copy{font-size:13.5px;line-height:1.55;color:rgba(30,26,37,.7);margin-bottom:18px;}
.join-problem-title{font-family:var(--serif);font-size:21px;font-weight:800;color:var(--ink);margin-bottom:10px;}
.join-card .btn-play{margin-bottom:8px;}
/* .btn-guest is built for the dark page background, where cream text reads.
   Inside this cream card it would be invisible, so restate it dark-on-light. */
.join-card .btn-guest{width:100%;background:transparent;border:1.5px solid rgba(30,26,37,.18);color:rgba(30,26,37,.62);}
.join-card .btn-guest:hover{background:rgba(30,26,37,.06);border-color:rgba(30,26,37,.3);color:var(--ink);}

/* ── GROUP SWITCHER + MODERATION ── */
.lb-switcher{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:16px;}
.lb-switcher[hidden]{display:none;}
.lb-chip{padding:8px 14px;border-radius:999px;border:1.5px solid rgba(var(--brass-rgb),.3);background:rgba(255,255,255,.55);color:rgba(30,26,37,.62);font:800 12.5px var(--sans);cursor:pointer;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:background .15s,color .15s,border-color .15s;}
.lb-chip:hover{background:rgba(255,255,255,.85);color:var(--ink);}
.lb-chip.active{background:var(--teal);border-color:var(--teal);color:#fff;}

.lb-tag{display:inline-block;margin-left:7px;padding:2px 7px;border-radius:999px;font:800 9.5px var(--mono);letter-spacing:.06em;text-transform:uppercase;vertical-align:1px;}
.lb-tag-owner{background:var(--brass);color:#3B2805;}
.lb-tag-admin{background:rgba(var(--berry-rgb),.16);color:var(--berry);}
.lb-mini{display:inline-block;margin-left:7px;padding:3px 9px;border-radius:999px;border:1px solid rgba(30,26,37,.18);background:rgba(255,255,255,.7);color:rgba(30,26,37,.6);font:700 10px var(--sans);cursor:pointer;vertical-align:1px;transition:background .15s,color .15s,border-color .15s;}
.lb-mini:hover{background:#fff;color:var(--ink);}
.lb-mini-kick{border-color:rgba(200,85,68,.3);color:var(--red);}
.lb-mini-kick:hover{background:rgba(200,85,68,.1);color:var(--red);}
.lb-mini:disabled{opacity:.5;cursor:default;}
/* The name column holds the badges, so let it wrap instead of clipping them. */
.lb-row .lb-name{white-space:normal;}

.lb-owner-note{margin-top:12px;padding:11px 13px;border-radius:var(--r-md);background:rgba(var(--brass-rgb),.1);border:1px dashed rgba(var(--brass-rgb),.34);font-size:11.5px;line-height:1.45;color:rgba(30,26,37,.62);}
.lb-owner-note[hidden]{display:none;}
.lb-leave[hidden]{display:none;}

.lb-add{margin-top:18px;border-top:1px dashed var(--line);padding-top:16px;}
.lb-add summary{cursor:pointer;font:800 13px var(--sans);color:var(--teal);list-style:none;padding:6px 0;}
.lb-add summary::-webkit-details-marker{display:none;}
.lb-add summary::before{content:"+";display:inline-block;margin-right:8px;font-weight:800;}
.lb-add[open] summary::before{content:"\2212";}
.lb-add summary:hover{filter:brightness(.9);}
.lb-add .lb-form{margin-top:12px;}
/* ── WEEKLY GROUP SCORES ── */
.lb-week-leader{display:flex;align-items:center;gap:12px;padding:13px 15px;margin-bottom:14px;border-radius:var(--r-md);background:linear-gradient(135deg,rgba(var(--brass-rgb),.22),rgba(var(--brass-rgb),.1));border:1px solid rgba(var(--brass-rgb),.4);}
.lb-week-leader[hidden]{display:none;}
.lb-week-ic{flex-shrink:0;width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--brass);color:#3B2805;}
.lb-week-copy{min-width:0;}
.lb-week-label{font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;font-weight:800;color:var(--theme-button-ink);opacity:.75;margin-bottom:3px;}
.lb-week-name{font-size:15px;font-weight:800;color:var(--ink);display:flex;align-items:baseline;gap:9px;min-width:0;}
.lb-week-name>b{font-family:var(--mono);font-size:14px;color:var(--theme-button-ink);flex-shrink:0;}

/* Column header lines the two number columns up with the rows below. */
.lb-colhead{display:flex;align-items:center;gap:12px;padding:0 13px 7px;font-family:var(--mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;font-weight:800;color:rgba(30,26,37,.38);}
.lb-colhead-name{flex:1;min-width:0;}
.lb-colhead .lb-rank{display:none;}
.lb-colhead .lb-two{gap:12px;}
.lb-colhead .lb-day,.lb-colhead .lb-week{font-size:9px;font-weight:800;color:inherit;}

.lb-two{display:flex;align-items:baseline;gap:12px;flex-shrink:0;text-align:right;}
.lb-day{min-width:44px;font-family:var(--serif);font-size:18px;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums;}
.lb-day em{font-style:normal;font-family:var(--sans);font-size:14px;color:rgba(30,26,37,.3);}
.lb-week{min-width:52px;font-family:var(--mono);font-size:13px;font-weight:700;color:rgba(30,26,37,.5);font-variant-numeric:tabular-nums;}
.lb-row-group.is-me .lb-week{color:rgba(30,26,37,.68);}
/* Distinct from the brass "leader" pill, which often sits right beside it. */
.lb-tag-week{background:var(--teal);color:#fff;}

@media(max-width:380px){
  .lb-two{gap:8px;}
  .lb-day{min-width:38px;font-size:16px;}
  .lb-week{min-width:44px;font-size:12px;}
}

/* Invite context on the sign-in screen, so being asked for an account mid-join
   does not read as an unrelated demand. */
.welcome-invite-note{margin-bottom:14px;padding:12px 14px;border-radius:var(--r-md);background:rgba(var(--brass-rgb),.13);border:1px solid rgba(var(--brass-rgb),.34);font-size:12.5px;line-height:1.5;font-weight:600;color:var(--ink);}
.welcome-invite-note[hidden]{display:none;}
.welcome-lead[hidden]{display:none;}
/* Name screening feedback and the report affordance. */
.profile-name-error{display:none;margin-top:8px;font-size:11.5px;font-weight:700;line-height:1.4;color:var(--red);}
.profile-name-error.show{display:block;}
.lb-mini-report{border-color:rgba(30,26,37,.16);color:rgba(30,26,37,.45);}
.lb-mini-report:hover{background:rgba(200,85,68,.09);border-color:rgba(200,85,68,.3);color:var(--red);}
.lb-mini-report:disabled{opacity:.6;color:var(--red);border-color:rgba(200,85,68,.3);background:rgba(200,85,68,.07);}