@font-face{font-family:"Press Start 2P";src:url(/assets/press-start-2p-xj9lRvVs.woff2)format("woff2");font-weight:400;font-style:normal;font-display:swap}:root{--bg:#0b0a14;--bg-mid:#12102a;--bg-glow-inner:#2e1855;--bg-glow-outer:#18102b;--cube-top:#1e1a38;--cube-side:#130f25;--cube-edge:#2a2250;--accent-amber:#ffb84a;--amber-shadow:#b87820;--accent-cyan:#5ee9ff;--cyan-dim:#2a7a8a;--alert-pink:#ff4d8d;--hit-green:#3eea8a;--text-primary:#e8dfc8;--text-muted:#7a7292;--text-cyan:var(--accent-cyan);--surface:#120e20d1;--surface-hover:#1a1430eb;--surface-border:#5ee9ff2e;--surface-radius:2px;--cube-shadow:0 4px 0 var(--cube-side), 0 4px 0 1px var(--cube-edge), inset 0 1px 0 #ffffff0f;--cube-shadow-hover:0 6px 0 var(--cube-side), 0 6px 0 1px var(--cube-edge), inset 0 1px 0 #ffffff1a, 0 0 24px #5ee9ff1f;--btn-cta-shadow:0 4px 0 var(--amber-shadow), 0 4px 0 1px #6b4010, inset 0 1px 0 #ffffff26;--btn-cta-shadow-hover:0 6px 0 var(--amber-shadow), 0 6px 0 1px #6b4010, inset 0 1px 0 #ffffff38, 0 0 28px #ffb84a4d;--surface-glass:var(--surface);--surface-glass-hover:var(--surface-hover);--surface-shadow:var(--cube-shadow);--surface-shadow-hover:var(--cube-shadow-hover);--focus-ring:0 0 0 2px var(--accent-cyan);--s-1:4px;--s-2:8px;--s-3:12px;--s-4:16px;--s-5:20px;--s-6:24px;--s-7:28px;--s-8:32px;--s-9:36px;--s-10:40px;--s-12:48px;--s-14:56px;--s-16:64px;--font-display:"Press Start 2P", system-ui, sans-serif;--font-body:system-ui, -apple-system, sans-serif;--font-mono:ui-monospace, "SF Mono", Menlo, monospace;--text-2xs:10px;--text-xs:12px;--text-sm:13px;--text-md:14px;--text-lg:16px;--text-xl:20px;--text-2xl:28px;--text-3xl:40px;--hud-h:52px;--spring-ease:cubic-bezier(.34, 1.56, .64, 1);--ease-out-fast:cubic-bezier(0, 0, .2, 1);--transition-ms:.22s}body{background:radial-gradient(ellipse at 35% 55%, var(--bg-glow-inner) 0%, var(--bg-glow-outer) 42%, var(--bg) 85%) fixed, var(--bg);color:var(--text-primary);font-family:var(--font-body);background-image:repeating-linear-gradient(0deg, transparent, transparent 3px, #00000014 3px, #00000014 4px), radial-gradient(ellipse at 35% 55%, var(--bg-glow-inner) 0%, var(--bg-glow-outer) 42%, var(--bg) 85%)}:focus-visible{box-shadow:var(--focus-ring);outline:none}@media (prefers-reduced-motion:reduce){:root{--transition-ms:0s;--spring-ease:linear}}.screen{transition:transform var(--transition-ms) var(--spring-ease), opacity var(--transition-ms) ease-out}.screen[data-entering]{opacity:0;transform:translateY(10px)}.screen[data-leaving]{opacity:0;transform:translateY(-10px)}.corner-ornament{pointer-events:none;width:10px;height:10px;position:absolute}.corner-ornament--tl{background:linear-gradient(135deg, var(--accent-cyan) 4px, transparent 4px), linear-gradient(225deg, var(--accent-cyan) 4px, transparent 4px);clip-path:polygon(0 0,10px 0,10px 2px,2px 2px,2px 10px,0 10px);background-position:0,100%;background-repeat:no-repeat;background-size:50% 100%,50% 100%;top:0;left:0}.corner-ornament--tr{clip-path:polygon(0 0,10px 0,10px 10px,8px 10px,8px 2px,0 2px);background:var(--accent-cyan);opacity:.5;top:0;right:0}.corner-ornament--br{clip-path:polygon(10px 10px,0 10px,0 8px,8px 8px,8px 0,10px 0);background:var(--accent-cyan);opacity:.35;bottom:0;right:0}.pixel-btn{font-family:var(--font-display);border-radius:var(--surface-radius);cursor:pointer;transition:transform var(--transition-ms) var(--spring-ease), box-shadow var(--transition-ms) ease;border:1px solid}.pixel-btn:active{transform:translateY(2px);box-shadow:none!important}button.primary{padding:var(--s-4) var(--s-7);font-family:var(--font-display);font-size:var(--text-xs);letter-spacing:3px;background:linear-gradient(180deg, var(--accent-amber) 0%, #d49434 100%);color:#0b0a14;border:1px solid var(--amber-shadow);border-radius:var(--surface-radius);cursor:pointer;box-shadow:var(--btn-cta-shadow);transition:transform var(--transition-ms) var(--spring-ease), box-shadow var(--transition-ms) ease}button.primary:hover{box-shadow:var(--btn-cta-shadow-hover);transform:translateY(-2px)}button.primary:active{box-shadow:none;transform:translateY(2px)}button.primary:disabled{opacity:.4;cursor:not-allowed;transform:none}button.secondary{padding:var(--s-3) var(--s-5);font-family:var(--font-mono);font-size:var(--text-sm);background:var(--surface);color:var(--text-primary);border:1px solid var(--surface-border);border-radius:var(--surface-radius);cursor:pointer;box-shadow:var(--cube-shadow);transition:background var(--transition-ms) ease, box-shadow var(--transition-ms) ease, transform var(--transition-ms) var(--spring-ease)}button.secondary:hover{background:var(--surface-hover);box-shadow:var(--cube-shadow-hover);transform:translateY(-2px)}button.secondary:active{box-shadow:none;transform:translateY(1px)}button.tiny{padding:var(--s-1) var(--s-3);font-size:var(--text-xs);font-family:var(--font-mono)}button.danger{color:var(--alert-pink);border:1px solid var(--alert-pink);border-radius:var(--surface-radius);cursor:pointer;padding:var(--s-3) var(--s-5);font-family:var(--font-mono);font-size:var(--text-sm);transition:background var(--transition-ms) ease, transform var(--transition-ms) var(--spring-ease);background:#ff4d8d24;box-shadow:0 2px #b41e5080}button.danger:hover{background:#ff4d8d47;transform:translateY(-1px)}button.danger:active{transform:translateY(1px)}@media (prefers-reduced-motion:reduce){button.primary,button.secondary,button.danger{transition:none}}:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}body{font-family:var(--font-body);margin:0}.float-num{pointer-events:none;font-family:var(--font-display);opacity:1;text-shadow:0 0 12px;font-size:24px;font-weight:700;transition:transform 1s ease-out,opacity 1s ease-out;position:absolute;transform:translate(-50%,-50%)}.float-num.animate{opacity:0;transform:translate(-50%,-200%)}.shake{animation:50ms 4 alternate shake}@keyframes shake{0%{transform:translate(-2px)}to{transform:translate(2px)}}.combo-banner{background:linear-gradient(90deg, var(--accent-amber), var(--alert-pink));color:#0b0a14;font-family:var(--font-display);letter-spacing:2px;opacity:1;pointer-events:none;border-radius:999px;padding:10px 32px;font-size:18px;transition:left .6s ease-out,opacity .6s ease-out .4s;position:absolute;top:80px;left:-50%;box-shadow:0 0 32px #ffb84a80}.combo-banner.animate{opacity:0;left:150%}.confetti{pointer-events:none;z-index:100;position:fixed;inset:0;overflow:hidden}.confetti-piece{width:8px;height:14px;animation:linear forwards fall;position:absolute;top:-10px}@keyframes fall{to{opacity:.2;transform:translateY(100vh)rotate(720deg)}}.app-controls{top:var(--s-2);right:var(--s-3);gap:var(--s-2);z-index:60;display:flex;position:fixed}.app-controls button{background:var(--surface);color:var(--text-primary);border:1px solid var(--surface-border);border-radius:var(--surface-radius);cursor:pointer;width:36px;height:36px;box-shadow:var(--cube-shadow);transition:background var(--transition-ms) ease, box-shadow var(--transition-ms) ease;font-family:inherit}.app-controls button:hover{background:var(--surface-hover);box-shadow:var(--cube-shadow-hover)}.modal-backdrop{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);z-index:200;background:#000000bf;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal{background:var(--surface);color:var(--text-primary);border-radius:var(--surface-radius);padding:var(--s-7);border:1px solid var(--accent-amber);min-width:320px;max-width:480px;box-shadow:var(--btn-cta-shadow), 0 0 40px #ffb84a2e;position:relative;overflow:hidden}.modal:before{content:"";border-top:2px solid var(--accent-cyan);border-left:2px solid var(--accent-cyan);width:12px;height:12px;position:absolute;top:0;left:0}.modal h2{margin:0 0 var(--s-2);font-family:var(--font-display);color:var(--accent-amber);letter-spacing:3px;font-size:var(--text-lg);text-shadow:2px 2px 0 var(--amber-shadow)}.modal .subtitle{color:var(--text-muted);margin:0 0 var(--s-4);font-size:var(--text-sm);font-family:var(--font-mono)}.modal input[type=text]{width:100%;padding:var(--s-3) var(--s-4);font-family:var(--font-mono);font-size:var(--text-md);color:var(--text-primary);border:1px solid var(--surface-border);border-radius:var(--surface-radius);box-sizing:border-box;background:#0006;box-shadow:inset 0 2px 4px #0000004d}.modal input[type=text]:focus{border-color:var(--accent-cyan);box-shadow:var(--focus-ring), inset 0 2px 4px #0000004d;outline:none}.modal .error{color:var(--alert-pink);margin-top:var(--s-3);font-size:var(--text-sm);min-height:1.2em;font-family:var(--font-mono)}.modal .suggestions{margin-top:var(--s-3);gap:var(--s-2);flex-wrap:wrap;align-items:center;display:flex}.modal .suggestions p{margin:0 var(--s-2) 0 0;font-size:var(--text-sm);color:var(--text-muted);font-family:var(--font-mono)}.modal .suggestions .suggestion{padding:var(--s-2) var(--s-3);font-size:var(--text-sm)}.modal-actions{justify-content:flex-end;gap:var(--s-3);margin-top:var(--s-5);display:flex}@media (prefers-reduced-motion:reduce){.float-num,.combo-banner,.confetti-piece,.shake{transition:none;animation:none}}.home-screen{grid-template:"header header""modes sidebar"1fr"footer sidebar"/1fr 280px;gap:0;max-width:1200px;min-height:100vh;margin:0 auto;padding:0;display:grid}.home-header{align-items:baseline;gap:var(--s-6);padding:var(--s-5) var(--s-6) var(--s-4);border-bottom:1px solid var(--surface-border);background:var(--surface);box-shadow:0 2px 0 var(--cube-side);grid-area:header;display:flex}.home-title{font-family:var(--font-display);font-size:clamp(var(--text-lg), 3.5vw, 32px);color:var(--accent-amber);letter-spacing:5px;text-shadow:2px 2px 0 var(--amber-shadow), 0 0 20px #ffb84a66;margin:0;line-height:1}.home-subtitle{color:var(--text-muted);font-family:var(--font-mono);font-size:var(--text-xs);letter-spacing:1px;align-self:center;margin:0}.home-modes{gap:var(--s-4);padding:var(--s-6);grid-area:modes;grid-template-rows:auto auto;grid-template-columns:repeat(6,1fr);align-content:start;display:grid}.home-mode-card{grid-column:span 2}.home-mode-card:nth-child(4),.home-mode-card:nth-child(5){grid-column:span 3}.home-mode-card{text-align:left;cursor:pointer;background:var(--surface);border:1px solid var(--surface-border);border-radius:var(--surface-radius);padding:var(--s-5) var(--s-5) var(--s-5) var(--s-6);color:var(--text-primary);align-items:start;gap:var(--s-2) var(--s-3);box-shadow:var(--cube-shadow);transition:transform var(--transition-ms) var(--spring-ease), box-shadow var(--transition-ms) ease;grid-template-rows:auto auto;grid-template-columns:44px 1fr auto;display:grid;position:relative;overflow:hidden}.home-mode-card:before{content:"";background:linear-gradient(to bottom, var(--accent-cyan), transparent);opacity:0;width:3px;height:100%;transition:opacity var(--transition-ms) ease;position:absolute;top:0;left:0}.home-mode-card:hover{background:var(--surface-hover);box-shadow:var(--cube-shadow-hover);transform:translateY(-3px)}.home-mode-card:hover:before{opacity:1}.home-mode-card:active{box-shadow:none;transform:translateY(1px)}.home-mode-icon{font-size:var(--text-xl);color:var(--accent-amber);text-shadow:0 0 12px #ffb84a80;grid-row:1/span 2;align-self:center}.home-mode-name{font-family:var(--font-display);font-size:var(--text-xs);color:var(--text-primary);letter-spacing:2px;line-height:1.4}.home-mode-blurb{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-muted);grid-column:2;margin:0}.home-mode-best{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--accent-cyan);white-space:nowrap;padding:var(--s-1) var(--s-2);border:1px solid var(--cyan-dim);border-radius:var(--surface-radius);grid-area:1/3/span 2;align-self:center}.home-sidebar{background:var(--bg-mid);border-left:2px solid var(--surface-border);padding:var(--s-6) var(--s-5);gap:var(--s-5);box-shadow:inset 2px 0 0 var(--cube-edge);flex-direction:column;grid-area:sidebar;display:flex}.home-sidebar-label{font-family:var(--font-display);font-size:var(--text-2xs);color:var(--accent-cyan);letter-spacing:3px;text-transform:uppercase;margin:0 0 var(--s-3);border-bottom:1px solid var(--surface-border);padding-bottom:var(--s-2)}.home-social{gap:var(--s-3);flex-direction:column;display:flex}.home-friends-btn,.home-social-btn{width:100%;padding:var(--s-3) var(--s-4);font-family:var(--font-mono);font-size:var(--text-sm);background:var(--surface);color:var(--text-primary);border:1px solid var(--surface-border);border-radius:var(--surface-radius);cursor:pointer;text-align:left;box-shadow:var(--cube-shadow);transition:background var(--transition-ms) ease, box-shadow var(--transition-ms) ease, transform var(--transition-ms) var(--spring-ease)}.home-friends-btn:hover,.home-social-btn:hover{background:var(--surface-hover);box-shadow:var(--cube-shadow-hover);transform:translateY(-2px)}.home-friends-btn:active,.home-social-btn:active{box-shadow:none;transform:translateY(1px)}.home-footer{padding:var(--s-4) var(--s-6);border-top:1px solid var(--surface-border);align-items:center;gap:var(--s-4);grid-area:footer;display:flex}@media (max-width:680px){.home-screen{grid-template-columns:1fr;grid-template-areas:"header""modes""sidebar""footer"}.home-sidebar{border-left:none;border-top:2px solid var(--surface-border);box-shadow:none;padding:var(--s-4);flex-flow:wrap}.home-modes{grid-template-columns:repeat(2,1fr)}.home-mode-card:nth-child(4){grid-column:1/-1}}@media (max-width:420px){.home-modes{grid-template-columns:1fr}.home-mode-card:nth-child(4){grid-column:1}}@media (prefers-reduced-motion:reduce){.home-mode-card,.home-friends-btn,.home-social-btn{transition:none}}.fb-stage{filter:drop-shadow(0 0 10px #5ee9ff1f)}.fretboard{width:100%;max-width:960px;height:auto;display:block}.fb-halo{transform-origin:50%;transform-box:fill-box;animation:1.3s ease-in-out infinite fb-halo-pulse}@keyframes fb-halo-pulse{0%,to{opacity:.5;transform:scale(1)}50%{opacity:1;transform:scale(1.22)}}.fb-cell{cursor:pointer;transition:fill .12s}.fb-cell:hover{fill:#ffb84a12}.fb-cell.hit{fill:var(--hit-green);animation:.65s ease-out fb-pop}.fb-cell.miss{fill:var(--alert-pink);animation:.38s ease-out fb-shake}.fb-cell.highlight{fill:#ff4d8d52}.fb-cell.reveal{fill:#5ee9ff61}.fb-cell.fb-non-position{fill:#0000004d}.fb-cell.fb-non-position:hover{fill:#0006}@keyframes fb-pop{0%{transform:scale(1)}30%{transform:scale(1.16)}to{transform:scale(1)}}@keyframes fb-shake{0%,to{transform:translate(0)}25%{transform:translate(-3px)}75%{transform:translate(3px)}}.fb-fret-num{fill:var(--fb-label,#c8b898);opacity:.6;font-family:ui-monospace,monospace;font-size:11px}.fb-pos-dot{fill:var(--accent-amber,#ffb84a);opacity:.82;filter:drop-shadow(0 0 4px #ffb84a66)}.fb-pos-dot-root{fill:#b8731f;opacity:1;filter:drop-shadow(0 0 6px #b8731fb8)}@media (prefers-reduced-motion:reduce){.fb-halo,.fb-cell.hit,.fb-cell.miss{animation:none}}.note-buttons{gap:var(--s-2);margin-top:var(--s-5);padding:0 var(--s-2);flex-wrap:wrap;justify-content:flex-start;display:flex}.note-btn{min-width:54px;min-height:52px;padding:var(--s-2) var(--s-3) var(--s-4);font-family:var(--font-mono);background:var(--surface);color:var(--text-primary);border:1px solid var(--surface-border);border-radius:var(--surface-radius);cursor:pointer;box-shadow:var(--cube-shadow);transition:transform var(--transition-ms) var(--spring-ease), background var(--transition-ms) ease, box-shadow var(--transition-ms) ease;font-size:18px;font-weight:600;position:relative}.note-btn:hover{background:var(--surface-hover);box-shadow:var(--cube-shadow-hover);transform:translateY(-2px)}.note-btn:active{box-shadow:none;transform:translateY(2px)scale(.97)}.note-btn:disabled{opacity:.38;cursor:not-allowed}.note-btn.hit{background:var(--hit-green);color:#0b0a14;transform:scale(1.1);box-shadow:0 0 16px #3eea8a80}.note-btn.miss{background:var(--alert-pink);color:#0b0a14;box-shadow:0 0 12px #ff4d8d73}.note-btn-label{display:block}.note-btn-hint{right:var(--s-1);font-size:var(--text-2xs);color:var(--text-muted);font-family:var(--font-mono);letter-spacing:.5px;position:absolute;bottom:3px}@media (prefers-reduced-motion:reduce){.note-btn{transition:none}}.hud-outer{gap:var(--s-2);padding:var(--s-2) var(--s-4);flex-direction:column;display:flex}.hud-stage{background:var(--surface);border:1px solid var(--surface-border);border-radius:var(--surface-radius);padding:var(--s-3) var(--s-5);box-shadow:var(--cube-shadow);border-left:3px solid var(--accent-amber);grid-template-columns:auto 1fr auto;align-items:center;transition:transform .12s ease-out;display:grid}.hud-stage.beat{transform:scale(1.004)}.hud-left{justify-self:start}.hud-center{justify-self:center}.hud-right{justify-self:end;align-items:center;gap:var(--s-4);display:flex}.hud-score{font-family:var(--font-display);color:var(--accent-amber);text-shadow:2px 2px 0 var(--amber-shadow), 0 0 16px #ffb84a73;font-variant-numeric:tabular-nums;font-size:26px}.hud-lives{gap:var(--s-2);margin-top:var(--s-1);display:flex}.heart.full{color:var(--alert-pink);text-shadow:0 0 8px #ff4d8d99;font-size:18px}.heart.empty{color:#ff4d8d38;font-size:18px}.hud-clock{font-family:var(--font-display);color:var(--text-muted);font-variant-numeric:tabular-nums;border:1px solid var(--surface-border);padding:var(--s-1) var(--s-3);border-radius:var(--surface-radius);background:#0000004d;font-size:20px}.hud-clock.warn{color:var(--alert-pink);border-color:var(--alert-pink);text-shadow:0 0 10px #ff4d8d8c;animation:.45s ease-in-out infinite alternate hud-warn}.hud-combo{font-family:var(--font-display);font-size:var(--text-xs);padding:var(--s-1) var(--s-3);border-radius:var(--surface-radius);border:1px solid var(--surface-border);color:var(--text-primary);transition:background .2s ease, color .2s ease, transform .12s var(--spring-ease);background:#0000004d}.hud-combo.hot{background:linear-gradient(90deg, var(--accent-amber), var(--alert-pink));color:#0b0a14;border-color:#0000;transform:scale(1.05)}.hud-combo.blazing{animation:.65s ease-in-out infinite alternate hud-blazing}.hud-xp-bar{border-radius:var(--surface-radius);border:1px solid var(--surface-border);height:10px;margin:0 var(--s-2);background:#00000080;position:relative;overflow:hidden}.hud-xp-fill{background:linear-gradient(90deg, var(--accent-cyan), var(--hit-green));width:0%;height:100%;transition:width .4s var(--ease-out-fast);box-shadow:0 0 10px #5ee9ff73}.hud-xp-text{font-family:var(--font-mono);font-size:var(--text-2xs);color:var(--text-primary);pointer-events:none;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.hud-outer.paused{opacity:.25}@keyframes hud-warn{0%{opacity:.65}to{opacity:1}}@keyframes hud-blazing{0%{box-shadow:0 0 6px #ffb84a66}to{box-shadow:0 0 18px #ff4d8dbf}}@media (prefers-reduced-motion:reduce){.hud-stage,.hud-combo,.hud-clock.warn,.hud-combo.blazing{transition:none;animation:none}}.round-screen{gap:var(--s-3);padding:var(--s-4) var(--s-5);flex-direction:column;max-width:1100px;min-height:100vh;margin:0 auto;display:flex}.round-screen .prompt{text-align:center;font-family:var(--font-display);font-size:clamp(var(--text-lg), 3.5vw, 28px);color:var(--text-primary);padding:var(--s-3);text-shadow:0 0 16px #5ee9ff33;letter-spacing:1px}.round-screen .prompt strong{color:var(--accent-amber);text-shadow:0 0 14px #ffb84a73, 2px 2px 0 var(--amber-shadow);font-size:1.2em}.fret-host{padding:var(--s-2);background:var(--surface);border:1px solid var(--surface-border);border-radius:var(--surface-radius);box-shadow:var(--cube-shadow);justify-content:center;display:flex}.pause-overlay{z-index:200;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#000000bf;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.pause-card{background:var(--surface);border:1px solid var(--accent-amber);border-radius:var(--surface-radius);padding:var(--s-8) var(--s-12);text-align:center;box-shadow:var(--btn-cta-shadow), 0 0 40px #ffb84a33;gap:var(--s-3);flex-direction:column;min-width:260px;display:flex;position:relative;overflow:hidden}.pause-card:before{content:"";border-top:2px solid var(--accent-cyan);border-left:2px solid var(--accent-cyan);width:12px;height:12px;position:absolute;top:0;left:0}.pause-card h2{font-family:var(--font-display);font-size:var(--text-2xl);color:var(--accent-amber);margin:0 0 var(--s-3);letter-spacing:4px;text-shadow:2px 2px 0 var(--amber-shadow), 0 0 16px #ffb84a4d}.round-end-btn{right:var(--s-4);bottom:var(--s-4);padding:var(--s-3) var(--s-5);font-family:var(--font-mono);font-size:var(--text-sm);letter-spacing:2px;text-transform:uppercase;background:var(--surface);color:var(--accent-cyan);border:1px solid var(--accent-cyan);border-radius:var(--surface-radius);cursor:pointer;box-shadow:var(--cube-shadow);z-index:5;position:fixed}.round-end-btn:hover{box-shadow:var(--cube-shadow-hover);transform:translateY(-2px)}.round-end-btn:active{box-shadow:none;transform:translateY(1px)}.result-screen{max-width:860px;padding:var(--s-8) var(--s-6);gap:var(--s-5) var(--s-8);grid-template:"title title""score stats""xp stats""actions actions"/1fr 1fr;align-items:start;margin:0 auto;display:grid}.result-title{font-family:var(--font-display);font-size:clamp(var(--text-lg), 3.5vw, 28px);color:var(--accent-amber);letter-spacing:4px;text-align:left;text-shadow:2px 2px 0 var(--amber-shadow), 0 0 18px #ffb84a61;grid-area:title;margin:0}.big-score{font-family:var(--font-display);color:var(--accent-amber);text-shadow:4px 4px 0 var(--amber-shadow), 0 0 32px #ffb84a73;font-variant-numeric:tabular-nums;grid-area:score;margin:0;font-size:clamp(56px,14vw,120px);line-height:1}.xp-earned{font-family:var(--font-display);font-size:var(--text-lg);color:var(--accent-cyan);text-shadow:0 0 14px #5ee9ff66;grid-area:xp;margin:0}.result-stats{column-gap:var(--s-6);row-gap:var(--s-2);background:var(--surface);border:1px solid var(--surface-border);border-radius:var(--surface-radius);padding:var(--s-5) var(--s-6);font-family:var(--font-mono);box-shadow:var(--cube-shadow);text-align:left;grid-area:stats;grid-template-columns:max-content auto;display:grid;position:relative;overflow:hidden}.result-stats:before{content:"";border-top:2px solid var(--accent-cyan);border-left:2px solid var(--accent-cyan);width:10px;height:10px;position:absolute;top:0;left:0}.result-stats dt{color:var(--text-muted);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:1px;align-self:center}.result-stats dd{color:var(--text-primary);font-size:var(--text-sm);align-self:center;margin:0}.result-actions{gap:var(--s-3);flex-wrap:wrap;grid-area:actions;display:flex}@media (max-width:600px){.result-screen{grid-template-columns:1fr;grid-template-areas:"title""score""xp""stats""actions"}}@media (prefers-reduced-motion:reduce){button.primary,button.secondary{transition:none}}.profile-screen{max-width:860px;padding:var(--s-6) var(--s-6);gap:var(--s-5);flex-direction:column;margin:0 auto;display:flex}.profile-screen .back-btn{background:var(--surface);color:var(--text-muted);border:1px solid var(--surface-border);border-radius:var(--surface-radius);padding:var(--s-2) var(--s-4);cursor:pointer;font-family:var(--font-mono);font-size:var(--text-xs);box-shadow:var(--cube-shadow);transition:color var(--transition-ms) ease, box-shadow var(--transition-ms) ease, transform var(--transition-ms) var(--spring-ease);align-self:flex-start}.profile-screen .back-btn:hover{color:var(--text-primary);box-shadow:var(--cube-shadow-hover);transform:translateY(-2px)}.profile-screen .back-btn:active{box-shadow:none;transform:translateY(1px)}.profile-card{background:var(--surface);border:1px solid var(--surface-border);border-radius:var(--surface-radius);padding:var(--s-5);box-shadow:var(--cube-shadow);position:relative;overflow:hidden}.profile-card:before{content:"";background:linear-gradient(to bottom, var(--accent-cyan), var(--accent-amber));opacity:.7;width:3px;height:100%;position:absolute;top:0;left:0}.profile-row{align-items:center;gap:var(--s-4);padding:var(--s-2) 0;border-bottom:1px solid #5ee9ff14;display:flex}.profile-row:last-child{border-bottom:none}.profile-row .label{min-width:140px;color:var(--text-muted);font-size:var(--text-2xs);text-transform:uppercase;letter-spacing:2px;font-family:var(--font-mono)}.profile-row .value{font-size:var(--text-md);color:var(--text-primary);font-family:var(--font-mono);flex:1}.profile-row .badge.verified{background:var(--accent-cyan);color:#0b0a14;padding:var(--s-1) var(--s-3);border-radius:var(--surface-radius);font-size:var(--text-xs);margin-left:var(--s-2);font-family:var(--font-mono);font-weight:700;display:inline-block}.follow-btn{padding:var(--s-3) var(--s-7);font-family:var(--font-display);font-size:var(--text-xs);letter-spacing:2px;background:linear-gradient(180deg, var(--accent-amber) 0%, #d49434 100%);color:#0b0a14;border:1px solid var(--amber-shadow);border-radius:var(--surface-radius);cursor:pointer;box-shadow:var(--btn-cta-shadow);transition:transform var(--transition-ms) var(--spring-ease), box-shadow var(--transition-ms) ease}.follow-btn:hover{box-shadow:var(--btn-cta-shadow-hover);transform:translateY(-2px)}.follow-btn:active{box-shadow:none;transform:translateY(1px)}.view-achievements{padding:var(--s-4) var(--s-7);font-family:var(--font-display);font-size:var(--text-xs);letter-spacing:2px;background:var(--surface);color:var(--accent-cyan);border:1px solid var(--accent-cyan);border-radius:var(--surface-radius);cursor:pointer;box-shadow:var(--cube-shadow);transition:background var(--transition-ms) ease, box-shadow var(--transition-ms) ease, transform var(--transition-ms) var(--spring-ease);align-self:flex-start}.view-achievements:hover{background:var(--surface-hover);box-shadow:var(--cube-shadow-hover);transform:translateY(-2px)}.view-achievements:active{box-shadow:none;transform:translateY(1px)}.pb-table table{border-collapse:collapse;width:100%}.pb-table th,.pb-table td{text-align:left;padding:var(--s-3) var(--s-4);border-bottom:1px solid var(--surface-border);font-family:var(--font-mono);font-size:var(--text-sm)}.pb-table th{color:var(--text-muted);font-size:var(--text-2xs);text-transform:uppercase;letter-spacing:2px}.pb-table tr:hover td{background:#5ee9ff0a}@media (prefers-reduced-motion:reduce){.profile-screen .back-btn,.follow-btn,.view-achievements,button.tiny{transition:none}}.achievements-screen{max-width:960px;padding:var(--s-5) var(--s-6);gap:var(--s-5);flex-direction:column;margin:0 auto;display:flex}.ach-back{background:var(--surface);color:var(--text-muted);border:1px solid var(--surface-border);border-radius:var(--surface-radius);padding:var(--s-2) var(--s-4);cursor:pointer;font-family:var(--font-mono);font-size:var(--text-xs);box-shadow:var(--cube-shadow);transition:color var(--transition-ms) ease, box-shadow var(--transition-ms) ease, transform var(--transition-ms) var(--spring-ease);align-self:flex-start}.ach-back:hover{color:var(--text-primary);box-shadow:var(--cube-shadow-hover);transform:translateY(-2px)}.ach-back:active{box-shadow:none;transform:translateY(1px)}.ach-title{font-family:var(--font-display);font-size:var(--text-2xl);color:var(--accent-amber);letter-spacing:4px;text-align:left;text-shadow:2px 2px 0 var(--amber-shadow), 0 0 18px #ffb84a4d;margin:0}.ach-loading,.ach-error{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--text-muted);padding:var(--s-3) 0}.ach-error{color:var(--alert-pink)}.ach-capstone{background:var(--surface);border:1px solid var(--surface-border);border-radius:var(--surface-radius);padding:var(--s-4);box-shadow:var(--cube-shadow);position:relative;overflow:hidden}.ach-capstone:before{content:"";background:var(--accent-amber);width:3px;height:100%;position:absolute;top:0;left:0}.ach-capstone.unlocked{border-color:var(--accent-amber);box-shadow:var(--btn-cta-shadow), 0 0 20px #ffb84a33}.ach-capstone.unlocked:before{background:var(--hit-green)}.ach-capstone-header{align-items:center;gap:var(--s-3);font-family:var(--font-display);letter-spacing:3px;color:var(--accent-amber);margin-bottom:var(--s-1);display:flex}.ach-capstone-icon{font-size:18px}.ach-capstone-title{font-size:var(--text-lg)}.ach-capstone-desc{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--text-primary);margin-bottom:var(--s-3)}.ach-capstone-progress{align-items:center;gap:var(--s-3);display:flex}.ach-bar{border:1px solid var(--surface-border);border-radius:var(--surface-radius);background:#00000073;flex:1;height:8px;overflow:hidden}.ach-bar-fill{background:linear-gradient(90deg, var(--accent-cyan), var(--hit-green));height:100%;transition:width .22s var(--spring-ease);box-shadow:0 0 8px #5ee9ff59}.ach-bar-label{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-muted);text-align:right;min-width:64px}.ach-capstone-date{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-muted);margin-top:var(--s-2)}.ach-family{background:var(--surface);border:1px solid var(--surface-border);border-radius:var(--surface-radius);box-shadow:var(--cube-shadow);overflow:hidden}.ach-family-header{align-items:center;gap:var(--s-3);width:100%;padding:var(--s-4) var(--s-4);color:var(--text-primary);cursor:pointer;font-family:var(--font-mono);font-size:var(--text-sm);text-align:left;transition:background var(--transition-ms) ease;background:0 0;border:0;display:flex}.ach-family-header:hover{background:var(--surface-hover)}.ach-chevron{width:14px;color:var(--text-muted)}.ach-family-icon{width:18px}.ach-family-title{flex:1}.ach-family-progress{color:var(--text-muted);font-size:var(--text-xs)}.ach-grid{padding:0 var(--s-4) var(--s-4);display:none}.ach-family.expanded .ach-grid{display:block}.ach-scale-row{align-items:center;gap:var(--s-3);padding:var(--s-2) 0;display:flex}.ach-scale-label{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--text-muted);flex:0 0 110px}.ach-chips{gap:var(--s-1);flex-wrap:wrap;display:flex}.ach-chip{align-items:center;gap:var(--s-1);color:var(--text-primary);border:1px solid var(--surface-border);border-radius:var(--surface-radius);padding:var(--s-1) var(--s-2);cursor:pointer;font-family:var(--font-mono);font-size:var(--text-xs);box-shadow:var(--cube-shadow);transition:background var(--transition-ms) ease, box-shadow var(--transition-ms) ease;background:#00000059;display:inline-flex}.ach-chip:hover{background:var(--surface-hover);box-shadow:var(--cube-shadow-hover)}.ach-chip-key{font-weight:700}.ach-chip-glyph{opacity:.75;font-size:11px}.ach-chip-locked{opacity:.48}.ach-chip-in-progress{border-color:var(--accent-cyan)}.ach-chip-unlocked{background:var(--accent-amber);color:#0b0a14;border-color:var(--accent-amber);box-shadow:var(--btn-cta-shadow)}.ach-chip-unlocked .ach-chip-glyph{opacity:1}.ach-detail{margin:var(--s-2) 0 var(--s-3) 110px;padding:var(--s-3) var(--s-3);border:1px solid var(--surface-border);border-radius:var(--surface-radius);font-family:var(--font-mono);font-size:var(--text-xs);background:#00000059;box-shadow:inset 0 1px #0003}.ach-detail-title{color:var(--accent-cyan);letter-spacing:1px;margin-bottom:var(--s-1)}.ach-detail-desc{color:var(--text-primary);margin-bottom:var(--s-1)}.ach-detail-status{color:var(--text-muted)}@media (max-width:600px){.ach-scale-row{align-items:flex-start;gap:var(--s-1);flex-direction:column}.ach-scale-label{flex:none}.ach-detail{margin-left:0}}@media (prefers-reduced-motion:reduce){.ach-bar-fill,.ach-chip,.ach-back,.ach-family-header{transition:none}}.splash-screen{padding:var(--s-8);cursor:pointer;z-index:100;background: linear-gradient(135deg, transparent 0%, transparent 45%, #5ee9ff05 45%, #5ee9ff05 55%, transparent 55%), radial-gradient(ellipse at 30% 65%, var(--bg-glow-inner) 0%, var(--bg-glow-outer) 40%, var(--bg) 80%), var(--bg);grid-template-rows:auto 1fr auto;grid-template-columns:1fr auto;display:grid;position:fixed;inset:0;overflow:hidden}.splash-cta{font-family:var(--font-display);font-size:clamp(var(--text-2xs), 1.2vw, var(--text-xs));color:var(--accent-cyan);letter-spacing:3px;text-transform:uppercase;padding:var(--s-2) var(--s-3);border-radius:var(--surface-radius);border:1px solid #5ee9ff4d;grid-area:1/2;align-self:start;animation:1.2s ease-in-out infinite splash-cta-pulse}.splash-logo{font-family:var(--font-display);color:var(--accent-amber);letter-spacing:4px;margin-bottom:var(--s-4);text-shadow:0 0 8px var(--accent-amber), 0 0 24px #ffb84a8c, 0 0 56px #ffb84a40, 4px 4px 0 var(--amber-shadow);animation:splash-logo-in .5s var(--spring-ease) backwards;grid-area:3/1/auto/span 2;align-self:end;font-size:clamp(28px,9vw,88px);line-height:1}.splash-screen:before{content:"";top:var(--s-8);bottom:var(--s-8);left:var(--s-5);background:linear-gradient(to bottom, transparent 0%, var(--accent-cyan) 20%, var(--accent-amber) 60%, transparent 100%);opacity:.4;width:2px;position:absolute}.splash-screen:after{content:"";top:var(--s-6);left:var(--s-6);border-top:2px solid var(--accent-cyan);border-left:2px solid var(--accent-cyan);opacity:.6;width:16px;height:16px;position:absolute}@keyframes splash-logo-in{0%{opacity:0;transform:translate(-20px)skew(-3deg)}to{opacity:1;transform:translate(0)skew(0)}}@keyframes splash-cta-pulse{0%,to{opacity:.3}50%{opacity:1}}@media (prefers-reduced-motion:reduce){.splash-logo{animation:none}.splash-cta{opacity:.85;animation:none}}.loadout-screen{max-width:860px;padding:var(--s-5) var(--s-6);gap:var(--s-5);flex-direction:column;min-height:100vh;margin:0 auto;display:flex}.loadout-back{background:var(--surface);color:var(--text-muted);border:1px solid var(--surface-border);border-radius:var(--surface-radius);padding:var(--s-2) var(--s-4);cursor:pointer;font-family:var(--font-mono);font-size:var(--text-xs);box-shadow:var(--cube-shadow);transition:box-shadow var(--transition-ms) ease, transform var(--transition-ms) var(--spring-ease), color var(--transition-ms) ease;align-self:flex-start}.loadout-back:hover{color:var(--text-primary);box-shadow:var(--cube-shadow-hover);transform:translateY(-2px)}.loadout-back:active{box-shadow:none;transform:translateY(1px)}.loadout-title{font-family:var(--font-display);font-size:var(--text-2xl);color:var(--accent-amber);letter-spacing:4px;text-align:left;text-shadow:2px 2px 0 var(--amber-shadow), 0 0 18px #ffb84a59;margin:0}.loadout-section{background:var(--surface);border:1px solid var(--surface-border);border-radius:var(--surface-radius);padding:var(--s-4);box-shadow:var(--cube-shadow);position:relative;overflow:hidden}.loadout-section:before{content:"";border-top:2px solid var(--accent-cyan);border-left:2px solid var(--accent-cyan);opacity:.7;width:10px;height:10px;position:absolute;top:0;left:0}.loadout-section h2{font-family:var(--font-display);font-size:var(--text-2xs);color:var(--accent-cyan);letter-spacing:3px;margin:0 0 var(--s-3);text-transform:uppercase}.loadout-key-wheel{gap:var(--s-2);grid-template-columns:repeat(6,1fr);display:grid}.loadout-key,.loadout-scale,.loadout-range,.loadout-position,.loadout-time{color:var(--text-primary);border:1px solid var(--surface-border);border-radius:var(--surface-radius);padding:var(--s-3) var(--s-3);cursor:pointer;font-family:var(--font-mono);font-size:var(--text-sm);box-shadow:var(--cube-shadow);transition:background var(--transition-ms) ease, box-shadow var(--transition-ms) ease, transform var(--transition-ms) var(--spring-ease), color var(--transition-ms) ease;background:#00000059}.loadout-key:hover,.loadout-scale:hover,.loadout-range:hover,.loadout-position:hover,.loadout-time:hover{background:var(--surface-hover);box-shadow:var(--cube-shadow-hover);transform:translateY(-2px)}.loadout-key:active,.loadout-scale:active,.loadout-range:active,.loadout-position:active,.loadout-time:active{box-shadow:none;transform:translateY(1px)}.loadout-key.selected,.loadout-scale.selected,.loadout-range.selected,.loadout-position.selected,.loadout-time.selected{background:var(--accent-amber);color:#0b0a14;border-color:var(--accent-amber);box-shadow:var(--btn-cta-shadow)}.loadout-key.selected:hover,.loadout-scale.selected:hover,.loadout-range.selected:hover,.loadout-position.selected:hover,.loadout-time.selected:hover{box-shadow:var(--btn-cta-shadow-hover);transform:translateY(-2px)}.loadout-position-random{border-style:dashed}.loadout-position-loading,.loadout-position-error,.loadout-position-empty{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--text-muted);padding:var(--s-2) 0}.loadout-position-error{color:var(--alert-pink)}.loadout-scale-group+.loadout-scale-group{margin-top:var(--s-4)}.loadout-scale-group-label{font-size:var(--text-2xs);color:var(--text-muted);margin-bottom:var(--s-2);font-family:var(--font-mono);letter-spacing:1px;text-transform:uppercase}.loadout-scale-row,.loadout-range-row,.loadout-position-row,.loadout-time-row{gap:var(--s-2);flex-wrap:wrap;display:flex}.loadout-position-helpers{gap:var(--s-2);margin-bottom:var(--s-3);display:flex}.loadout-position-helpers button{color:var(--text-muted);border:1px solid var(--surface-border);border-radius:var(--surface-radius);padding:var(--s-1) var(--s-3);cursor:pointer;font-family:var(--font-mono);font-size:var(--text-xs);box-shadow:var(--cube-shadow);transition:background var(--transition-ms) ease, color var(--transition-ms) ease, transform var(--transition-ms) var(--spring-ease);background:#0000004d}.loadout-position-helpers button:hover{background:var(--surface-hover);color:var(--text-primary);transform:translateY(-1px)}.loadout-position-helpers button:active{transform:translateY(1px)}.loadout-options-section{padding:var(--s-1) 0}.loadout-toggle{color:var(--text-muted);border:1px solid var(--surface-border);border-radius:var(--surface-radius);padding:var(--s-2) var(--s-3);cursor:pointer;font-family:var(--font-mono);font-size:var(--text-sm);box-shadow:var(--cube-shadow);transition:background var(--transition-ms) ease, color var(--transition-ms) ease;background:#0000004d}.loadout-toggle:hover{background:var(--surface-hover);color:var(--text-primary)}.loadout-toggle.selected{color:var(--accent-amber);border-color:var(--accent-amber);background:#ffb84a24;box-shadow:0 0 0 1px #ffb84a40}.loadout-cta-row{align-items:center;gap:var(--s-3);margin-top:var(--s-2);flex-wrap:wrap;display:flex}.loadout-leaderboard{padding:var(--s-3) var(--s-5);font-family:var(--font-mono);font-size:var(--text-sm);background:var(--surface);color:var(--accent-cyan);border:1px solid var(--accent-cyan);border-radius:var(--surface-radius);cursor:pointer;box-shadow:var(--cube-shadow);transition:box-shadow var(--transition-ms) ease, transform var(--transition-ms) var(--spring-ease);letter-spacing:1px;text-transform:uppercase}.loadout-leaderboard:hover{box-shadow:var(--cube-shadow-hover);transform:translateY(-2px)}.loadout-leaderboard:active{box-shadow:none;transform:translateY(1px)}.drop-in{padding:var(--s-4) var(--s-12);font-family:var(--font-display);font-size:var(--text-lg);letter-spacing:4px;background:linear-gradient(180deg, var(--accent-amber) 0%, #d49434 100%);color:#0b0a14;border:1px solid var(--amber-shadow);border-radius:var(--surface-radius);cursor:pointer;box-shadow:var(--btn-cta-shadow);transition:transform var(--transition-ms) var(--spring-ease), box-shadow var(--transition-ms) ease}.drop-in:hover{box-shadow:var(--btn-cta-shadow-hover);transform:translateY(-3px)}.drop-in:active{box-shadow:none;transform:translateY(2px)}.drop-in:disabled{opacity:.4;cursor:not-allowed;box-shadow:none;transform:none}@media (max-width:600px){.loadout-key-wheel,.loadout-scale-row,.loadout-range-row,.loadout-position-row,.loadout-time-row{gap:var(--s-2);scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:var(--s-1);flex-wrap:nowrap;display:flex;overflow-x:auto}.loadout-key-wheel::-webkit-scrollbar{display:none}.loadout-scale-row::-webkit-scrollbar{display:none}.loadout-range-row::-webkit-scrollbar{display:none}.loadout-position-row::-webkit-scrollbar{display:none}.loadout-time-row::-webkit-scrollbar{display:none}.loadout-key,.loadout-scale,.loadout-range,.loadout-position,.loadout-time{scroll-snap-align:start;flex:none}.loadout-cta-row{background:linear-gradient(to top, var(--surface) 60%, transparent 100%);padding:var(--s-3) 0 var(--s-2);margin:0 calc(-1 * var(--s-6));padding-left:var(--s-6);padding-right:var(--s-6);z-index:2;position:sticky;bottom:0}.drop-in{text-align:center;flex:1}}@media (prefers-reduced-motion:reduce){.loadout-key,.loadout-scale,.loadout-range,.loadout-position,.loadout-time,.drop-in,.loadout-back,.loadout-toggle,.loadout-position-helpers button{transition:none}}.leaderboard-screen{max-width:880px;min-height:100vh;padding:var(--s-5) var(--s-6);gap:var(--s-4);flex-direction:column;margin:0 auto;display:flex}.leaderboard-screen .back-btn{background:var(--surface);color:var(--text-muted);border:1px solid var(--surface-border);border-radius:var(--surface-radius);padding:var(--s-2) var(--s-4);cursor:pointer;font-family:var(--font-mono);font-size:var(--text-xs);box-shadow:var(--cube-shadow);transition:color var(--transition-ms) ease, box-shadow var(--transition-ms) ease, transform var(--transition-ms) var(--spring-ease);align-self:flex-start}.leaderboard-screen .back-btn:hover{color:var(--text-primary);box-shadow:var(--cube-shadow-hover);transform:translateY(-2px)}.leaderboard-screen .lb-header{padding-bottom:var(--s-4);border-bottom:2px solid var(--surface-border);box-shadow:0 2px 0 var(--cube-side)}.leaderboard-screen .lb-title{font-family:var(--font-display);font-size:var(--text-2xl);color:var(--accent-amber);letter-spacing:3px;margin:0 0 var(--s-2);text-shadow:2px 2px 0 var(--amber-shadow), 0 0 18px #ffb84a40;text-transform:uppercase}.leaderboard-screen .lb-subtitle{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--text-muted);letter-spacing:1px;text-transform:uppercase;margin:0}.leaderboard-screen .lb-list{gap:var(--s-1);background:var(--surface);border:1px solid var(--surface-border);border-radius:var(--surface-radius);padding:var(--s-3);box-shadow:var(--cube-shadow);flex-direction:column;display:flex}.leaderboard-screen .lb-row{gap:var(--s-3);padding:var(--s-2) var(--s-3);border-radius:var(--surface-radius);font-family:var(--font-mono);font-size:var(--text-sm);cursor:pointer;transition:background var(--transition-ms) ease, border-color var(--transition-ms) ease;border:1px solid #0000;grid-template-columns:36px 1fr 50px 80px 90px;align-items:center;display:grid}.leaderboard-screen .lb-row:hover{background:var(--surface-hover);border-color:var(--surface-border)}.leaderboard-screen .lb-row.is-me{border-color:var(--accent-cyan);cursor:default;background:#5ee9ff14}.leaderboard-screen .lb-row.is-me:hover{background:#5ee9ff1f}.leaderboard-screen .lb-rank{color:var(--text-muted);text-align:right;font-weight:700}.leaderboard-screen .lb-row.is-me .lb-rank{color:var(--accent-cyan)}.leaderboard-screen .lb-handle{color:var(--accent-cyan);white-space:nowrap;text-overflow:ellipsis;font-weight:700;overflow:hidden}.leaderboard-screen .lb-level{color:var(--text-muted);font-size:var(--text-xs)}.leaderboard-screen .lb-score{color:var(--text-primary);text-align:right;font-weight:700}.leaderboard-screen .lb-when{color:var(--text-muted);font-size:var(--text-xs);text-align:right}.leaderboard-screen .lb-divider{background:var(--surface-border);height:1px;margin:var(--s-2) 0}.leaderboard-screen .lb-me-pin{border:1px solid var(--accent-cyan);background:#5ee9ff0a}.leaderboard-screen .lb-empty{text-align:center;font-family:var(--font-mono);font-size:var(--text-sm);color:var(--text-muted);padding:var(--s-5)}@media (max-width:600px){.leaderboard-screen .lb-row{grid-template-columns:32px 1fr 70px 70px}.leaderboard-screen .lb-when{display:none}}.leaderboard-list-screen{background:var(--bg);grid-template:"rail topbar""rail list"1fr/220px 1fr;min-height:100vh;display:grid}.lb-list-rail{background:var(--bg-mid);border-right:2px solid var(--surface-border);box-shadow:inset -2px 0 0 var(--cube-edge);padding:var(--s-6) var(--s-4);gap:var(--s-4);flex-direction:column;grid-area:rail;display:flex}.lb-list-rail-title{font-family:var(--font-display);font-size:var(--text-xs);color:var(--accent-amber);letter-spacing:3px;margin:0 0 var(--s-3);text-shadow:0 0 12px #ffb84a4d;text-transform:uppercase}.leaderboard-list-screen .lb-list-header{padding:var(--s-5) var(--s-6) var(--s-3);border-bottom:1px solid var(--surface-border);background:var(--surface);box-shadow:0 2px 0 var(--cube-side);grid-area:topbar}.leaderboard-list-screen .lb-list-header h1{font-family:var(--font-display);font-size:var(--text-xl);color:var(--text-primary);letter-spacing:2px;margin:0}.leaderboard-list-screen .back-btn{background:var(--surface);color:var(--text-muted);border:1px solid var(--surface-border);border-radius:var(--surface-radius);padding:var(--s-2) var(--s-4);cursor:pointer;font-family:var(--font-mono);font-size:var(--text-xs);box-shadow:var(--cube-shadow);align-self:flex-start}.leaderboard-list-screen .back-btn:hover{color:var(--text-primary);box-shadow:var(--cube-shadow-hover);transform:translateY(-2px)}.leaderboard-list-screen .lb-list{padding:var(--s-4) var(--s-6);gap:var(--s-2);flex-direction:column;grid-area:list;display:flex;overflow-y:auto}.leaderboard-list-screen .lb-list-row{gap:var(--s-3);padding:var(--s-3) var(--s-4);cursor:pointer;border-radius:var(--surface-radius);transition:background var(--transition-ms) ease;border-bottom:1px solid #5ee9ff14;grid-template-columns:1fr 1fr 100px 24px;align-items:center;display:grid}.leaderboard-list-screen .lb-list-row:hover{background:var(--surface-hover)}.leaderboard-list-screen .lb-list-board{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--accent-cyan);white-space:nowrap;text-overflow:ellipsis;font-weight:700;overflow:hidden}.leaderboard-list-screen .lb-list-leader{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-primary)}.leaderboard-list-screen .lb-list-when{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-muted);text-align:right}.leaderboard-list-screen .lb-list-arrow{color:var(--text-muted);text-align:center}.leaderboard-list-screen .empty{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--text-muted);padding:var(--s-6) 0;text-align:center}@media (max-width:600px){.leaderboard-list-screen{grid-template-columns:1fr;grid-template-areas:"topbar""list"}.lb-list-rail{display:none}.leaderboard-list-screen .lb-list-row{grid-template-columns:1fr 80px 16px}.leaderboard-list-screen .lb-list-leader{display:none}}.auth-gate-screen{gap:var(--s-8);min-height:100vh;padding:var(--s-8);grid-template:". ."1fr"head cards"". ."1fr/1fr 2fr;max-width:900px;margin:0 auto;display:grid}.auth-gate-header{text-align:left;padding-right:var(--s-8);border-right:2px solid var(--surface-border);grid-area:head;align-self:center}.auth-gate-title{font-family:var(--font-display);font-size:clamp(var(--text-xl), 4vw, 36px);color:var(--accent-amber);letter-spacing:5px;margin:0 0 var(--s-4);text-shadow:2px 2px 0 var(--amber-shadow), 0 0 24px #ffb84a59;line-height:1.2}.auth-gate-subtitle{color:var(--text-muted);font-family:var(--font-mono);font-size:var(--text-sm);margin:0;line-height:1.6}.auth-gate-options{align-self:center;gap:var(--s-4);flex-direction:column;grid-area:cards;display:flex}.auth-gate-card{text-align:left;cursor:pointer;background:var(--surface);border:1px solid var(--surface-border);border-radius:var(--surface-radius);padding:var(--s-5) var(--s-6);color:var(--text-primary);align-items:start;gap:var(--s-2) var(--s-4);box-shadow:var(--cube-shadow);transition:transform var(--transition-ms) var(--spring-ease), box-shadow var(--transition-ms) ease, background var(--transition-ms) ease;grid-template-rows:auto auto;grid-template-columns:48px 1fr;display:grid;position:relative;overflow:hidden}.auth-gate-card:after{content:"";background:linear-gradient(to bottom, var(--accent-amber), var(--accent-cyan));opacity:0;width:3px;height:100%;transition:opacity var(--transition-ms) ease;position:absolute;top:0;left:0}.auth-gate-card:hover:not([disabled]){background:var(--surface-hover);box-shadow:var(--cube-shadow-hover);transform:translateY(-3px)}.auth-gate-card:hover:not([disabled]):after{opacity:1}.auth-gate-card:active:not([disabled]){box-shadow:none;transform:translateY(1px)}.auth-gate-card[disabled]{opacity:.45;cursor:wait}.auth-gate-card-icon{font-family:var(--font-display);font-size:var(--text-xl);color:var(--accent-amber);text-shadow:0 0 12px #ffb84a80;text-align:center;grid-row:1/span 2;align-self:center}.auth-gate-card-name{font-family:var(--font-display);font-size:var(--text-xs);color:var(--text-primary);letter-spacing:2px;line-height:1.4}.auth-gate-card-blurb{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-muted);grid-column:2;margin:0;line-height:1.5}@media (max-width:600px){.auth-gate-screen{gap:var(--s-6);padding:var(--s-5);grid-template-columns:1fr;grid-template-areas:"head""cards"}.auth-gate-header{border-right:none;border-bottom:1px solid var(--surface-border);padding-right:0;padding-bottom:var(--s-4);text-align:left}}@media (prefers-reduced-motion:reduce){.auth-gate-card{transition:none}}.find-users-screen{max-width:600px;padding:var(--s-5) var(--s-6);gap:var(--s-4);flex-direction:column;min-height:100vh;margin:0 auto;display:flex}.find-users-screen h1{font-family:var(--font-display);font-size:var(--text-2xl);color:var(--accent-amber);letter-spacing:4px;text-align:left;text-shadow:2px 2px 0 var(--amber-shadow), 0 0 18px #ffb84a4d;margin:0}.find-users-screen .search-input{width:100%;padding:var(--s-3) var(--s-4);background:var(--surface);color:var(--text-primary);border:1px solid var(--surface-border);border-radius:var(--surface-radius);font-family:var(--font-mono);font-size:var(--text-md);box-shadow:inset 0 2px 6px #00000059, var(--cube-shadow);transition:border-color var(--transition-ms) ease, box-shadow var(--transition-ms) ease;box-sizing:border-box}.find-users-screen .search-input:focus{border-color:var(--accent-cyan);box-shadow:var(--focus-ring), inset 0 2px 6px #00000059;outline:none}.find-users-screen .search-input::placeholder{color:var(--text-muted)}.find-users-screen .results{flex-direction:column;gap:0;display:flex}.find-users-screen .result-row{padding:var(--s-3) var(--s-4);cursor:pointer;border-radius:var(--surface-radius);transition:background var(--transition-ms) ease;align-items:center;gap:var(--s-3);border-bottom:1px solid #5ee9ff14;display:flex}.find-users-screen .result-row:hover{background:var(--surface-hover)}.find-users-screen .result-handle{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--accent-cyan);font-weight:700}.find-users-screen .empty-state{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--text-muted);padding:var(--s-4) 0}.find-users-screen .back-btn{background:var(--surface);color:var(--text-muted);border:1px solid var(--surface-border);border-radius:var(--surface-radius);padding:var(--s-2) var(--s-4);cursor:pointer;font-family:var(--font-mono);font-size:var(--text-xs);box-shadow:var(--cube-shadow);transition:color var(--transition-ms) ease, box-shadow var(--transition-ms) ease, transform var(--transition-ms) var(--spring-ease);align-self:flex-start}.find-users-screen .back-btn:hover{color:var(--text-primary);box-shadow:var(--cube-shadow-hover);transform:translateY(-2px)}.find-users-screen .back-btn:active{box-shadow:none;transform:translateY(1px)}@media (prefers-reduced-motion:reduce){.find-users-screen .search-input,.find-users-screen .result-row,.find-users-screen .back-btn{transition:none}}.friends-screen{background:var(--bg);grid-template:"rail topbar""rail tabs""rail list"1fr/220px 1fr;min-height:100vh;display:grid}.friends-rail{background:var(--bg-mid);border-right:2px solid var(--surface-border);box-shadow:inset -2px 0 0 var(--cube-edge);padding:var(--s-6) var(--s-4);gap:var(--s-4);flex-direction:column;grid-area:rail;display:flex}.friends-rail-title{font-family:var(--font-display);font-size:var(--text-xs);color:var(--accent-amber);letter-spacing:3px;margin:0 0 var(--s-3);text-shadow:0 0 12px #ffb84a4d;text-transform:uppercase}.friends-header{padding:var(--s-5) var(--s-6) var(--s-3);border-bottom:1px solid var(--surface-border);background:var(--surface);box-shadow:0 2px 0 var(--cube-side);grid-area:topbar;justify-content:space-between;align-items:center;display:flex}.friends-header h1{font-family:var(--font-display);font-size:var(--text-xl);color:var(--text-primary);letter-spacing:2px;margin:0}.find-users-btn{padding:var(--s-2) var(--s-5);font-family:var(--font-display);font-size:var(--text-2xs);letter-spacing:2px;background:linear-gradient(180deg, var(--accent-amber) 0%, #d49434 100%);color:#0b0a14;border:1px solid var(--amber-shadow);border-radius:var(--surface-radius);cursor:pointer;box-shadow:var(--btn-cta-shadow);transition:transform var(--transition-ms) var(--spring-ease), box-shadow var(--transition-ms) ease}.find-users-btn:hover{box-shadow:var(--btn-cta-shadow-hover);transform:translateY(-2px)}.find-users-btn:active{box-shadow:none;transform:translateY(1px)}.back-btn{background:var(--surface);color:var(--text-muted);border:1px solid var(--surface-border);border-radius:var(--surface-radius);padding:var(--s-2) var(--s-4);cursor:pointer;font-family:var(--font-mono);font-size:var(--text-xs);box-shadow:var(--cube-shadow);margin:var(--s-4) var(--s-4) 0;transition:color var(--transition-ms) ease, box-shadow var(--transition-ms) ease, transform var(--transition-ms) var(--spring-ease);align-self:flex-start}.back-btn:hover{color:var(--text-primary);box-shadow:var(--cube-shadow-hover);transform:translateY(-2px)}.back-btn:active{box-shadow:none;transform:translateY(1px)}.friends-screen .tabs{padding:0 var(--s-6);border-bottom:2px solid var(--surface-border);background:var(--surface);grid-area:tabs;gap:0;display:flex}.friends-screen .tab{padding:var(--s-3) var(--s-5);font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-muted);cursor:pointer;transition:color var(--transition-ms) ease, border-color var(--transition-ms) ease;white-space:nowrap;background:0 0;border:none;border-bottom:2px solid #0000;margin-bottom:-2px}.friends-screen .tab:hover{color:var(--text-primary)}.friends-screen .tab.active{color:var(--accent-amber);border-bottom-color:var(--accent-amber);font-family:var(--font-display);font-size:var(--text-2xs);letter-spacing:1px}.friends-screen .list{padding:var(--s-4) var(--s-6);grid-area:list;overflow-y:auto}.friends-screen .member-row{gap:var(--s-4);padding:var(--s-3) var(--s-4);cursor:pointer;transition:background var(--transition-ms) ease;border-radius:var(--surface-radius);border-bottom:1px solid #5ee9ff14;grid-template-columns:1fr 1fr auto auto;align-items:center;display:grid}.friends-screen .member-row:hover{background:var(--surface-hover)}.friends-screen .row-handle{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--accent-cyan);font-weight:700}.friends-screen .row-name{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--text-primary)}.friends-screen .row-level{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-muted)}.friends-screen .row-actions{gap:var(--s-2);display:flex}.accept-btn,.decline-btn,.unfollow-btn{padding:var(--s-1) var(--s-3);font-family:var(--font-mono);font-size:var(--text-xs);border-radius:var(--surface-radius);cursor:pointer;box-shadow:var(--cube-shadow);transition:transform var(--transition-ms) var(--spring-ease), box-shadow var(--transition-ms) ease;border:1px solid}.accept-btn{background:linear-gradient(180deg, var(--accent-amber) 0%, #d49434 100%);color:#0b0a14;border-color:var(--amber-shadow);box-shadow:var(--btn-cta-shadow)}.accept-btn:hover{box-shadow:var(--btn-cta-shadow-hover);transform:translateY(-1px)}.decline-btn,.unfollow-btn{background:var(--surface);color:var(--text-primary);border-color:var(--surface-border)}.decline-btn:hover,.unfollow-btn:hover{background:var(--surface-hover);box-shadow:var(--cube-shadow-hover);transform:translateY(-1px)}@media (max-width:600px){.friends-screen{grid-template-columns:1fr;grid-template-areas:"topbar""tabs""list"}.friends-rail{display:none}.friends-screen .member-row{grid-template-columns:1fr auto auto}}@media (prefers-reduced-motion:reduce){.friends-screen .tab,.friends-screen .member-row,.accept-btn,.decline-btn,.unfollow-btn,.find-users-btn,.back-btn{transition:none}}.groups-screen{background:var(--bg);grid-template:"rail topbar""rail tabs""rail list"1fr/220px 1fr;min-height:100vh;display:grid}.groups-rail{background:var(--bg-mid);border-right:2px solid var(--surface-border);box-shadow:inset -2px 0 0 var(--cube-edge);padding:var(--s-6) var(--s-4);gap:var(--s-4);flex-direction:column;grid-area:rail;display:flex}.groups-rail-title{font-family:var(--font-display);font-size:var(--text-xs);color:var(--accent-amber);letter-spacing:3px;margin:0 0 var(--s-3);text-shadow:0 0 12px #ffb84a4d;text-transform:uppercase}.groups-screen .groups-header{padding:var(--s-5) var(--s-6) var(--s-3);border-bottom:1px solid var(--surface-border);background:var(--surface);box-shadow:0 2px 0 var(--cube-side);grid-area:topbar;justify-content:space-between;align-items:center;display:flex}.groups-screen .groups-header h1{font-family:var(--font-display);font-size:var(--text-xl);color:var(--text-primary);letter-spacing:2px;margin:0}.groups-screen .create-btn{padding:var(--s-2) var(--s-5);font-family:var(--font-display);font-size:var(--text-2xs);letter-spacing:2px;background:linear-gradient(180deg, var(--accent-amber) 0%, #d49434 100%);color:#0b0a14;border:1px solid var(--amber-shadow);border-radius:var(--surface-radius);cursor:pointer;box-shadow:var(--btn-cta-shadow);transition:transform var(--transition-ms) var(--spring-ease), box-shadow var(--transition-ms) ease}.groups-screen .create-btn:hover{box-shadow:var(--btn-cta-shadow-hover);transform:translateY(-2px)}.groups-screen .create-btn:active{box-shadow:none;transform:translateY(1px)}.groups-screen .back-btn{background:var(--surface);color:var(--text-muted);border:1px solid var(--surface-border);border-radius:var(--surface-radius);padding:var(--s-2) var(--s-4);cursor:pointer;font-family:var(--font-mono);font-size:var(--text-xs);box-shadow:var(--cube-shadow);transition:color var(--transition-ms) ease, box-shadow var(--transition-ms) ease, transform var(--transition-ms) var(--spring-ease);align-self:flex-start}.groups-screen .back-btn:hover{color:var(--text-primary);box-shadow:var(--cube-shadow-hover);transform:translateY(-2px)}.groups-screen .back-btn:active{box-shadow:none;transform:translateY(1px)}.groups-screen .tabs{padding:0 var(--s-6);border-bottom:2px solid var(--surface-border);background:var(--surface);grid-area:tabs;gap:0;display:flex}.groups-screen .tab{padding:var(--s-3) var(--s-5);font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-muted);cursor:pointer;transition:color var(--transition-ms) ease, border-color var(--transition-ms) ease;white-space:nowrap;background:0 0;border:none;border-bottom:2px solid #0000;margin-bottom:-2px}.groups-screen .tab:hover{color:var(--text-primary)}.groups-screen .tab.active{color:var(--accent-amber);border-bottom-color:var(--accent-amber);font-family:var(--font-display);font-size:var(--text-2xs);letter-spacing:1px}.groups-screen .list{padding:var(--s-4) var(--s-6);gap:var(--s-2);flex-direction:column;grid-area:list;display:flex;overflow-y:auto}.groups-screen .my-group-row{gap:var(--s-4);padding:var(--s-3) var(--s-4);cursor:pointer;transition:background var(--transition-ms) ease;border-radius:var(--surface-radius);border-bottom:1px solid #5ee9ff14;grid-template-columns:1fr 1fr 1fr;align-items:center;display:grid}.groups-screen .my-group-row:hover{background:var(--surface-hover)}.groups-screen .invite-row{gap:var(--s-3);padding:var(--s-3) var(--s-4);border-radius:var(--surface-radius);transition:background var(--transition-ms) ease;border-bottom:1px solid #5ee9ff14;grid-template-columns:1fr 1fr auto auto;align-items:center;display:grid}.groups-screen .invite-row:hover{background:var(--surface-hover)}.groups-screen .public-group-row{gap:var(--s-3);padding:var(--s-3) var(--s-4);border-radius:var(--surface-radius);transition:background var(--transition-ms) ease;border-bottom:1px solid #5ee9ff14;grid-template-columns:1fr 1fr auto;align-items:center;display:grid}.groups-screen .public-group-row:hover{background:var(--surface-hover)}.groups-screen .row-name{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--accent-cyan);white-space:nowrap;text-overflow:ellipsis;font-weight:700;overflow:hidden}.groups-screen .row-meta{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-muted)}.groups-screen .row-goal{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-primary)}.groups-screen .invite-accept,.groups-screen .invite-decline,.groups-screen .join-btn{padding:var(--s-1) var(--s-3);font-family:var(--font-mono);font-size:var(--text-xs);border-radius:var(--surface-radius);cursor:pointer;box-shadow:var(--cube-shadow);transition:transform var(--transition-ms) var(--spring-ease), box-shadow var(--transition-ms) ease;border:1px solid}.groups-screen .invite-accept,.groups-screen .join-btn{background:linear-gradient(180deg, var(--accent-amber) 0%, #d49434 100%);color:#0b0a14;border-color:var(--amber-shadow);box-shadow:var(--btn-cta-shadow)}.groups-screen .invite-accept:hover,.groups-screen .join-btn:hover{box-shadow:var(--btn-cta-shadow-hover);transform:translateY(-1px)}.groups-screen .invite-decline{background:var(--surface);color:var(--text-primary);border-color:var(--surface-border)}.groups-screen .invite-decline:hover{background:var(--surface-hover);box-shadow:var(--cube-shadow-hover);transform:translateY(-1px)}@media (max-width:600px){.groups-screen{grid-template-columns:1fr;grid-template-areas:"topbar""tabs""list"}.groups-rail{display:none}.groups-screen .my-group-row{grid-template-columns:1fr 1fr}.groups-screen .my-group-row .row-goal{grid-column:1/-1}.groups-screen .invite-row,.groups-screen .public-group-row{grid-template-columns:1fr auto auto}}@media (prefers-reduced-motion:reduce){.groups-screen .tab,.groups-screen .my-group-row,.groups-screen .invite-row,.groups-screen .public-group-row,.groups-screen .create-btn,.groups-screen .invite-accept,.groups-screen .invite-decline,.groups-screen .join-btn,.groups-screen .back-btn{transition:none}}.create-group-screen{max-width:560px;padding:var(--s-6) var(--s-6);gap:var(--s-5);flex-direction:column;min-height:100vh;margin:0 auto;display:flex}.create-group-screen h1{font-family:var(--font-display);font-size:var(--text-2xl);color:var(--accent-amber);letter-spacing:4px;text-align:left;text-shadow:2px 2px 0 var(--amber-shadow), 0 0 18px #ffb84a4d;margin:0}.create-group-screen form{gap:var(--s-5);flex-direction:column;display:flex}.create-group-screen label{gap:var(--s-2);font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-muted);text-transform:uppercase;letter-spacing:1px;flex-direction:column;display:flex}.create-group-screen .name-input{width:100%;padding:var(--s-3) var(--s-4);background:var(--surface);color:var(--text-primary);border:1px solid var(--surface-border);border-radius:var(--surface-radius);font-family:var(--font-mono);font-size:var(--text-md);box-shadow:inset 0 2px 6px #00000059, var(--cube-shadow);transition:border-color var(--transition-ms) ease, box-shadow var(--transition-ms) ease;box-sizing:border-box}.create-group-screen .name-input:focus{border-color:var(--accent-cyan);box-shadow:var(--focus-ring), inset 0 2px 6px #00000059;outline:none}.create-group-screen .name-input::placeholder{color:var(--text-muted)}.create-group-screen fieldset{border:1px solid var(--surface-border);border-radius:var(--surface-radius);padding:var(--s-4) var(--s-5);background:var(--surface);box-shadow:var(--cube-shadow)}.create-group-screen legend{font-family:var(--font-display);font-size:var(--text-2xs);color:var(--accent-cyan);letter-spacing:3px;text-transform:uppercase;padding:0 var(--s-2)}.create-group-screen fieldset label{align-items:center;gap:var(--s-3);font-size:var(--text-sm);text-transform:none;letter-spacing:0;color:var(--text-primary);cursor:pointer;margin-bottom:var(--s-2);flex-direction:row}.create-group-screen fieldset label:last-child{margin-bottom:0}.create-group-screen .error{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--alert-pink);padding:var(--s-2) var(--s-3);border-radius:var(--surface-radius);background:#ff4d8d1a;border:1px solid #ff4d8d59}.create-group-screen .form-actions{gap:var(--s-3);justify-content:flex-start;display:flex}.create-group-screen .cancel-btn{padding:var(--s-3) var(--s-6);font-family:var(--font-mono);font-size:var(--text-sm);background:var(--surface);color:var(--text-primary);border:1px solid var(--surface-border);border-radius:var(--surface-radius);cursor:pointer;box-shadow:var(--cube-shadow);transition:background var(--transition-ms) ease, box-shadow var(--transition-ms) ease, transform var(--transition-ms) var(--spring-ease)}.create-group-screen .cancel-btn:hover{background:var(--surface-hover);box-shadow:var(--cube-shadow-hover);transform:translateY(-2px)}.create-group-screen .cancel-btn:active{box-shadow:none;transform:translateY(1px)}.create-group-screen button[type=submit]{padding:var(--s-3) var(--s-8);font-family:var(--font-display);font-size:var(--text-xs);letter-spacing:3px;background:linear-gradient(180deg, var(--accent-amber) 0%, #d49434 100%);color:#0b0a14;border:1px solid var(--amber-shadow);border-radius:var(--surface-radius);cursor:pointer;box-shadow:var(--btn-cta-shadow);transition:transform var(--transition-ms) var(--spring-ease), box-shadow var(--transition-ms) ease}.create-group-screen button[type=submit]:hover{box-shadow:var(--btn-cta-shadow-hover);transform:translateY(-2px)}.create-group-screen button[type=submit]:active{box-shadow:none;transform:translateY(1px)}@media (prefers-reduced-motion:reduce){.create-group-screen .name-input,.create-group-screen .cancel-btn,.create-group-screen button[type=submit]{transition:none}}.group-detail-screen{max-width:1100px;min-height:100vh;padding:var(--s-5) var(--s-6);gap:var(--s-5);flex-direction:column;margin:0 auto;display:flex}.group-detail-screen .header{padding-bottom:var(--s-4);border-bottom:2px solid var(--surface-border);box-shadow:0 2px 0 var(--cube-side);justify-content:space-between;align-items:baseline;display:flex}.group-detail-screen .header h1{font-family:var(--font-display);font-size:var(--text-2xl);color:var(--accent-amber);letter-spacing:3px;text-shadow:2px 2px 0 var(--amber-shadow), 0 0 18px #ffb84a40;margin:0}.group-detail-screen .meta{align-items:center;gap:var(--s-3);font-family:var(--font-mono);font-size:var(--text-sm);color:var(--text-muted);display:flex}.group-detail-screen .badge{background:var(--surface);border:1px solid var(--surface-border);color:var(--accent-cyan);padding:var(--s-1) var(--s-3);border-radius:var(--surface-radius);font-size:var(--text-xs);font-family:var(--font-mono);text-transform:uppercase;letter-spacing:1px;box-shadow:var(--cube-shadow)}.group-detail-screen h2{font-family:var(--font-display);font-size:var(--text-2xs);color:var(--accent-cyan);letter-spacing:3px;margin:0 0 var(--s-3);text-transform:uppercase}.group-detail-screen .goal-count{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-muted);letter-spacing:0;text-transform:none;margin-left:var(--s-2);font-weight:400}.group-detail-screen .rollup-list{gap:var(--s-2);background:var(--surface);border:1px solid var(--surface-border);border-radius:var(--surface-radius);padding:var(--s-3);box-shadow:var(--cube-shadow);flex-direction:column;display:flex}.group-detail-screen .rollup-row{border:1px solid var(--surface-border);border-radius:var(--surface-radius);transition:border-color var(--transition-ms) ease;background:#0003;overflow:hidden}.group-detail-screen .rollup-row.expanded{border-color:var(--accent-cyan)}.group-detail-screen .rollup-summary{gap:var(--s-3);width:100%;padding:var(--s-3) var(--s-4);cursor:pointer;font-family:var(--font-mono);font-size:var(--text-sm);color:var(--text-primary);text-align:left;transition:background var(--transition-ms) ease;background:0 0;border:none;grid-template-columns:minmax(120px,1.4fr) 60px 1fr 110px 22px;align-items:center;display:grid}.group-detail-screen .rollup-summary:hover{background:var(--surface-hover)}.group-detail-screen .rollup-summary:focus-visible{outline:2px solid var(--accent-cyan);outline-offset:-2px}.group-detail-screen .rollup-handle{color:var(--accent-cyan);white-space:nowrap;text-overflow:ellipsis;font-weight:700;overflow:hidden}.group-detail-screen .rollup-level{color:var(--text-muted);font-size:var(--text-xs)}.group-detail-screen .rollup-bar{border:1px solid var(--surface-border);background:#0006;border-radius:2px;height:10px;display:block;position:relative;overflow:hidden}.group-detail-screen .rollup-bar-fill{background:linear-gradient(90deg, var(--accent-cyan), var(--accent-amber));height:100%;transition:width var(--transition-ms) ease;display:block}.group-detail-screen .rollup-count{font-size:var(--text-xs);color:var(--text-muted);white-space:nowrap;text-align:right}.group-detail-screen .rollup-chevron{font-size:var(--text-xs);color:var(--text-muted);text-align:center}.group-detail-screen .rollup-detail{padding:var(--s-3) var(--s-4) var(--s-4);border-top:1px solid var(--surface-border);gap:var(--s-2);background:#00000026;flex-direction:column;display:flex}.group-detail-screen .rollup-detail[hidden]{display:none}.group-detail-screen .rollup-scale-row{align-items:center;gap:var(--s-3);font-family:var(--font-mono);font-size:var(--text-xs);display:flex}.group-detail-screen .rollup-scale-name{color:var(--accent-amber);min-width:110px;font-weight:700}.group-detail-screen .rollup-keys{gap:var(--s-2);flex-wrap:wrap;display:flex}.group-detail-screen .rollup-key{min-width:22px;font-family:var(--font-mono);font-size:var(--text-2xs);border:1px solid #0000;border-radius:2px;flex-direction:column;align-items:center;padding:2px 4px;line-height:1.1;display:inline-flex}.group-detail-screen .rollup-key.done{color:var(--hit-green);background:#3eea8a24;border-color:#3eea8a66}.group-detail-screen .rollup-key.todo{color:#8a829899}.group-detail-screen .rollup-key-name{opacity:.85;font-size:9px}.group-detail-screen .rollup-key-glyph{font-weight:700}.group-detail-screen .rollup-other{margin-top:var(--s-3);padding-top:var(--s-2);border-top:1px dashed var(--surface-border)}.group-detail-screen .rollup-other-label{font-family:var(--font-display);font-size:var(--text-2xs);color:var(--accent-amber);letter-spacing:2px;text-transform:uppercase;margin-bottom:var(--s-2)}.group-detail-screen .rollup-other-row{font-family:var(--font-mono);font-size:var(--text-xs);justify-content:space-between;padding:2px 0;display:flex}.group-detail-screen .rollup-other-row.done .rollup-other-glyph{color:var(--hit-green)}.group-detail-screen .rollup-other-row.todo .rollup-other-glyph{color:#8a829880}@media (max-width:720px){.group-detail-screen .rollup-summary{grid-template-columns:1fr 50px 90px 22px}.group-detail-screen .rollup-bar{display:none}.group-detail-screen .rollup-scale-name{min-width:80px}}.group-detail-screen .member-row{gap:var(--s-4);padding:var(--s-3) var(--s-4);border-radius:var(--surface-radius);transition:background var(--transition-ms) ease;border-bottom:1px solid #5ee9ff14;grid-template-columns:1fr auto auto;align-items:center;display:grid}.group-detail-screen .member-row:hover{background:var(--surface-hover)}.group-detail-screen .row-name{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--accent-cyan);font-weight:700}.group-detail-screen .row-level{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-muted)}.group-detail-screen .lvl{color:var(--text-muted);font-size:var(--text-xs);font-family:var(--font-mono)}.group-detail-screen .invite-row{gap:var(--s-3);margin-bottom:var(--s-3);display:flex}.group-detail-screen .invite-input{padding:var(--s-2) var(--s-3);background:var(--surface);color:var(--text-primary);border:1px solid var(--surface-border);border-radius:var(--surface-radius);font-family:var(--font-mono);font-size:var(--text-sm);flex:1;box-shadow:inset 0 2px 4px #0000004d}.group-detail-screen .invite-input:focus{border-color:var(--accent-cyan);box-shadow:var(--focus-ring), inset 0 2px 4px #0000004d;outline:none}.group-detail-screen .invite-input::placeholder{color:var(--text-muted)}.group-detail-screen .invite-btn{padding:var(--s-2) var(--s-5);font-family:var(--font-mono);font-size:var(--text-sm);background:linear-gradient(180deg, var(--accent-amber) 0%, #d49434 100%);color:#0b0a14;border:1px solid var(--amber-shadow);border-radius:var(--surface-radius);cursor:pointer;box-shadow:var(--btn-cta-shadow);transition:transform var(--transition-ms) var(--spring-ease), box-shadow var(--transition-ms) ease}.group-detail-screen .invite-btn:hover{box-shadow:var(--btn-cta-shadow-hover);transform:translateY(-2px)}.group-detail-screen .invite-btn:active{box-shadow:none;transform:translateY(1px)}.group-detail-screen .danger,.kick-btn,.delete-btn,.leave-btn{padding:var(--s-2) var(--s-4);font-family:var(--font-mono);font-size:var(--text-xs);color:var(--alert-pink);border:1px solid var(--alert-pink);border-radius:var(--surface-radius);cursor:pointer;transition:background var(--transition-ms) ease, transform var(--transition-ms) var(--spring-ease);background:#ff4d8d24;box-shadow:0 2px #b41e5080}.group-detail-screen .danger:hover,.kick-btn:hover,.delete-btn:hover,.leave-btn:hover{background:#ff4d8d40;transform:translateY(-1px)}.group-detail-screen .danger:active,.kick-btn:active,.delete-btn:active,.leave-btn:active{transform:translateY(1px)}.goal-actions{gap:var(--s-3);margin-top:var(--s-3);display:flex}.goal-picker{background:var(--surface);border:1px solid var(--surface-border);border-radius:var(--surface-radius);padding:var(--s-4);box-shadow:var(--cube-shadow);margin-top:var(--s-3)}.goal-picker h3{font-family:var(--font-display);font-size:var(--text-xs);color:var(--accent-cyan);letter-spacing:2px;margin:0 0 var(--s-3)}.goal-picker fieldset{border:1px solid var(--surface-border);border-radius:var(--surface-radius);padding:var(--s-3);margin:0 0 var(--s-3)}.goal-picker legend{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-muted);padding:0 var(--s-2)}.goal-picker label{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--text-primary);margin-bottom:var(--s-2);cursor:pointer;display:block}.goal-picker .picker-pane{margin-bottom:var(--s-3)}.goal-picker .single-options{display:block}.goal-picker .single-row{align-items:center;gap:var(--s-3);margin-bottom:var(--s-3);display:flex}.goal-picker .single-row select{background:var(--surface);color:var(--text-primary);border:1px solid var(--surface-border);border-radius:var(--surface-radius);padding:var(--s-1) var(--s-2);font-family:var(--font-mono);font-size:var(--text-xs)}.goal-picker .single-row select:disabled{opacity:.4;cursor:not-allowed}.goal-picker .set-search{width:100%;padding:var(--s-2) var(--s-3);margin-bottom:var(--s-3);background:var(--surface);color:var(--text-primary);border:1px solid var(--surface-border);border-radius:var(--surface-radius);font-family:var(--font-mono);font-size:var(--text-sm);box-shadow:inset 0 2px 4px #0000004d}.goal-picker .set-search:focus{border-color:var(--accent-cyan);box-shadow:var(--focus-ring), inset 0 2px 4px #0000004d;outline:none}.goal-picker .set-pills{gap:var(--s-2);padding:var(--s-2) var(--s-3);margin-bottom:var(--s-3);border:1px solid var(--surface-border);border-radius:var(--surface-radius);z-index:1;background:#00000040;flex-wrap:wrap;align-items:center;min-height:36px;display:flex;position:sticky;top:0}.goal-picker .set-empty{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-muted)}.goal-picker .set-count{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-muted);margin-right:var(--s-2)}.goal-picker .set-pill{align-items:center;gap:var(--s-1);padding:2px var(--s-2);color:var(--accent-cyan);border:1px solid var(--accent-cyan);border-radius:var(--surface-radius);font-family:var(--font-mono);font-size:var(--text-2xs);background:#5ee9ff1f;display:inline-flex}.goal-picker .set-pill-remove{color:var(--accent-cyan);cursor:pointer;padding:0 0 0 var(--s-1);font-size:var(--text-sm);background:0 0;border:none;line-height:1}.goal-picker .set-pill-remove:hover{color:var(--alert-pink)}.goal-picker .set-matrix-wrap{border:1px solid var(--surface-border);border-radius:var(--surface-radius);background:#0003;max-height:360px;overflow:auto}.goal-picker .set-matrix{border-collapse:collapse;font-family:var(--font-mono);font-size:var(--text-2xs)}.goal-picker .set-matrix th,.goal-picker .set-matrix td{text-align:center;white-space:nowrap;border:1px solid #5ee9ff14;padding:4px 6px}.goal-picker .set-matrix thead th{color:var(--accent-cyan);text-transform:uppercase;letter-spacing:1px;z-index:1;background:#0009;position:sticky;top:0}.goal-picker .set-matrix .set-corner{text-align:left;z-index:2;position:sticky;left:0}.goal-picker .set-matrix .set-row-name{text-align:left;color:var(--text-primary);z-index:1;background:#0006;font-weight:700;position:sticky;left:0}.goal-picker .set-matrix .set-cell{cursor:pointer}.goal-picker .set-row-all{background:var(--surface);color:var(--text-muted);border:1px solid var(--surface-border);border-radius:var(--surface-radius);padding:0 var(--s-2);cursor:pointer;font-family:var(--font-mono);font-size:var(--text-xs);line-height:1.4}.goal-picker .set-row-all:hover{color:var(--accent-cyan);border-color:var(--accent-cyan)}.goal-picker .set-row-all.all-on{color:var(--accent-cyan);border-color:var(--accent-cyan);background:#5ee9ff2e}.goal-picker .picker-confirm:disabled{opacity:.4;cursor:not-allowed;transform:none}.picker-actions{gap:var(--s-3);display:flex}.subtitle{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--text-muted)}.empty{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--text-muted);padding:var(--s-4) 0}.group-detail-screen .back-btn{background:var(--surface);color:var(--text-muted);border:1px solid var(--surface-border);border-radius:var(--surface-radius);padding:var(--s-2) var(--s-4);cursor:pointer;font-family:var(--font-mono);font-size:var(--text-xs);box-shadow:var(--cube-shadow);transition:color var(--transition-ms) ease, box-shadow var(--transition-ms) ease, transform var(--transition-ms) var(--spring-ease);align-self:flex-start}.group-detail-screen .back-btn:hover{color:var(--text-primary);box-shadow:var(--cube-shadow-hover);transform:translateY(-2px)}.group-detail-screen .back-btn:active{box-shadow:none;transform:translateY(1px)}.set-goal-btn,.change-goal-btn,.clear-goal-btn,.picker-confirm,.picker-cancel{padding:var(--s-2) var(--s-5);font-family:var(--font-mono);font-size:var(--text-sm);border-radius:var(--surface-radius);cursor:pointer;box-shadow:var(--cube-shadow);transition:transform var(--transition-ms) var(--spring-ease), box-shadow var(--transition-ms) ease;border:1px solid}.set-goal-btn,.picker-confirm{background:linear-gradient(180deg, var(--accent-amber) 0%, #d49434 100%);color:#0b0a14;border-color:var(--amber-shadow);box-shadow:var(--btn-cta-shadow)}.set-goal-btn:hover,.picker-confirm:hover{box-shadow:var(--btn-cta-shadow-hover);transform:translateY(-2px)}.change-goal-btn,.clear-goal-btn,.picker-cancel{background:var(--surface);color:var(--text-primary);border-color:var(--surface-border)}.change-goal-btn:hover,.clear-goal-btn:hover,.picker-cancel:hover{background:var(--surface-hover);box-shadow:var(--cube-shadow-hover);transform:translateY(-1px)}@media (prefers-reduced-motion:reduce){.group-detail-screen .member-row,.group-detail-screen .danger,.kick-btn,.delete-btn,.leave-btn,.set-goal-btn,.change-goal-btn,.clear-goal-btn,.picker-confirm,.picker-cancel{transition:none}}