:root{--ground: #14100f;--surface: #201a17;--surface-2: #2b2320;--surface-3: #372d28;--line: #3a2f2a;--line-strong: #52443c;--ink: #f7f1e8;--muted: #a79a8e;--dim: #7a6e64;--accent: #ff9e5e;--accent-bright: #ffb27c;--accent-deep: #c9673a;--accent-wash: rgb(255 158 94 / 12%);--affirm: #7fb069;--deny: #d9614c;--token-gold: #e8b45c;--warning: var(--token-gold);--error: var(--deny);--spotify: #1db954;--spotify-hover: #1ed760;--radius-sm: 10px;--radius: 16px;--radius-lg: 28px;--radius-pill: 999px;--bloom-sm: 0 6px 20px rgb(0 0 0 / 35%);--bloom: 0 16px 48px rgb(0 0 0 / 45%);--bloom-accent: 0 0 0 1px rgb(255 158 94 / 28%), 0 12px 40px rgb(255 158 94 / 16%);--s1: 4px;--s2: 8px;--s3: 16px;--s4: 24px;--s5: 40px;--s6: 64px;--ease-soft: cubic-bezier(.22, .61, .36, 1);--ease-lift: cubic-bezier(.34, 1.28, .64, 1);--t-fast: .18s;--t-base: .32s;--t-slow: .56s;--font-display: "Bricolage Grotesque", "Segoe UI", sans-serif;--font-body: "Instrument Sans", "Segoe UI", sans-serif;--z-page: 1;--z-affix: 40;--z-popover: 60;--z-toast: 80}*{box-sizing:border-box}*{scrollbar-width:thin;scrollbar-color:var(--line-strong) transparent}*::-webkit-scrollbar{width:8px;height:6px}*::-webkit-scrollbar-track{background:transparent}*::-webkit-scrollbar-thumb{background:var(--line-strong);border-radius:var(--radius-pill)}*::-webkit-scrollbar-thumb:hover{background:var(--accent-deep)}*::-webkit-scrollbar-corner{background:transparent}html,body{margin:0;padding:0;min-height:100%}body{background:radial-gradient(ellipse 60% 45% at 12% -8%,rgb(255 158 94 / 14%) 0%,transparent 62%),radial-gradient(ellipse 55% 40% at 88% -4%,rgb(201 103 58 / 12%) 0%,transparent 58%),var(--ground);background-attachment:fixed;color:var(--ink);font-family:var(--font-body);font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased;text-wrap:pretty;overscroll-behavior-y:none}#root{min-height:100dvh;display:flex;flex-direction:column}body:after{content:"";position:fixed;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:none;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E")}h1,h2,h3,h4{margin:0;font-family:var(--font-display);font-weight:800;line-height:1.05;letter-spacing:-.025em}h1{font-size:clamp(2.25rem,6vw,4rem)}h2{font-size:clamp(1.5rem,3.5vw,2.25rem)}h3{font-size:1.25rem;font-weight:600}p{margin:0 0 var(--s2)}a{color:var(--accent)}.page{flex:1;display:flex;flex-direction:column;padding:max(var(--s3),env(safe-area-inset-top)) var(--s3) max(var(--s3),env(safe-area-inset-bottom));gap:var(--s3);max-width:1400px;width:100%;margin:0 auto}.page--narrow{max-width:460px;justify-content:center}.stack{display:flex;flex-direction:column;gap:var(--s3)}.stack--tight{gap:var(--s2)}.row{display:flex;align-items:center;gap:var(--s2);flex-wrap:wrap}.row--between{justify-content:space-between}.spacer{flex:1}.grid-2{display:grid;grid-template-columns:1fr;gap:var(--s3)}@media (min-width: 900px){.grid-2{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr)}}.settings-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--s2) var(--s3);align-items:start}.panel{position:relative;padding:0;animation:rise .32s var(--ease-soft) both}.panel--solid{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:var(--s4)}.panel__title{display:flex;align-items:center;gap:var(--s2);font-family:var(--font-display);font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.14em;color:var(--dim);margin-bottom:var(--s3)}.panel__title:after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--line) 0%,transparent 100%)}@keyframes rise{0%{opacity:0;transform:translateY(10px)}}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);min-height:48px;padding:.7rem 1.35rem;border:1px solid var(--line-strong);border-radius:var(--radius-pill);background:var(--surface-2);color:var(--ink);font-family:var(--font-body);font-size:1rem;font-weight:600;cursor:pointer;text-decoration:none;touch-action:manipulation;transition:background var(--t-fast) var(--ease-soft),border-color var(--t-fast) var(--ease-soft),box-shadow var(--t-fast) var(--ease-soft),transform .12s var(--ease-soft)}.btn:hover:not(:disabled){background:var(--surface-3);border-color:var(--accent-deep);transform:translateY(-1px)}.btn:active:not(:disabled){transform:translateY(0) scale(.985)}.btn:focus-visible{outline:none;box-shadow:0 0 0 3px #ff9e5e66}.btn:disabled{opacity:.4;cursor:not-allowed}.btn--primary{background:var(--accent);border-color:var(--accent);color:#2b1508;box-shadow:0 8px 28px #ff9e5e38}.btn--primary:hover:not(:disabled){background:var(--accent-bright);border-color:var(--accent-bright);box-shadow:0 12px 36px #ff9e5e52}.btn--spotify{background:var(--spotify);border-color:var(--spotify);color:#06210f}.btn--spotify:hover:not(:disabled){background:var(--spotify-hover);border-color:var(--spotify-hover)}.btn--danger{border-color:var(--deny);color:#f0a396}.btn--danger:hover:not(:disabled){background:#d9614c24;border-color:var(--deny)}.btn--ghost{background:transparent;border-color:transparent;color:var(--muted);min-height:40px;padding:.4rem .8rem}.btn--ghost:hover:not(:disabled){background:var(--surface-2);border-color:transparent;color:var(--ink)}.btn--block{width:100%}.btn--lg{min-height:60px;font-size:1.125rem;padding:1rem 1.9rem}.field{display:flex;flex-direction:column;gap:var(--s1)}.field__label{font-size:.875rem;font-weight:600;color:var(--muted)}.field__hint{font-size:.8125rem;line-height:1.45;color:var(--dim)}.input{min-height:48px;padding:.7rem 1rem;background:var(--surface-2);border:1px solid var(--line-strong);border-radius:var(--radius);color:var(--ink);font-family:var(--font-body);font-size:16px;width:100%;transition:border-color var(--t-fast) var(--ease-soft),box-shadow var(--t-fast) var(--ease-soft)}.input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px #ff9e5e33}.input--code{font-family:var(--font-display);text-align:center;font-size:2.25rem;font-weight:800;letter-spacing:.35em;text-indent:.35em;text-transform:uppercase;min-height:72px;border-radius:var(--radius-lg)}.input--number{max-width:110px}.switch{display:flex;align-items:center;gap:var(--s2);cursor:pointer;padding:var(--s1) 0;min-height:44px}.switch input{width:20px;height:20px;accent-color:var(--accent);cursor:pointer;flex-shrink:0}.timeline-wrap{position:relative}.timeline-wrap--live:before{content:"";position:absolute;top:-12%;right:-6%;bottom:-12%;left:-6%;border-radius:50%;background:radial-gradient(ellipse at center,var(--accent-wash) 0%,transparent 70%);pointer-events:none;z-index:0;animation:breathe 4.5s var(--ease-soft) infinite}@keyframes breathe{0%,to{opacity:.5;transform:scale(.94)}50%{opacity:1;transform:scale(1.04)}}.timeline{position:relative;z-index:1;display:flex;align-items:stretch;overflow-x:auto;overflow-y:hidden;padding:6px 0 var(--s2);-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity;--art-size: 84px;--node-size: 11px;--art-gap: var(--s1);--node-shift: 2px;--rail-y: calc( var(--art-size) + var(--art-gap) + var(--node-shift) + var(--node-size) / 2 );scrollbar-width:thin;scrollbar-color:var(--accent-deep) transparent}.timeline--compact{--art-size: 44px}.timeline::-webkit-scrollbar{height:6px}.timeline::-webkit-scrollbar-track{background:var(--surface-2);border-radius:var(--radius-pill)}.timeline::-webkit-scrollbar-thumb{background:var(--accent-deep);border-radius:var(--radius-pill)}.timeline::-webkit-scrollbar-thumb:hover{background:var(--accent)}.timeline__rail{position:absolute;left:0;right:0;top:calc(var(--rail-y) + 6px);height:1px;--rail-tone: color-mix(in srgb, var(--player, var(--line-strong)) 70%, var(--line-strong));background:linear-gradient(90deg,transparent 0%,var(--rail-tone) 6%,var(--rail-tone) 94%,transparent 100%);pointer-events:none}.timeline__empty{align-self:center;color:var(--dim);font-size:.875rem}.tl-group{display:flex;align-items:stretch}.tl-card{position:relative;flex:0 0 auto;width:124px;display:flex;flex-direction:column;align-items:center;gap:var(--s1);padding:0 var(--s1);text-align:center;scroll-snap-align:center;animation:card-in .34s var(--ease-lift) both}@keyframes card-in{0%{opacity:0;transform:translateY(12px) scale(.93)}}.tl-card__art{display:block;width:var(--art-size);height:var(--art-size);border-radius:18px;overflow:hidden;background:var(--surface-2);box-shadow:var(--bloom-sm);transition:transform var(--t-base) var(--ease-lift),box-shadow var(--t-base) var(--ease-soft)}.tl-card:hover .tl-card__art{transform:translateY(-4px) scale(1.04);box-shadow:var(--bloom)}.tl-card__cover{display:block;width:100%;height:100%;object-fit:cover;background:var(--surface-3)}.tl-card__node{width:var(--node-size);height:var(--node-size);border-radius:50%;background:var(--surface);border:2px solid color-mix(in srgb,var(--player, var(--line-strong)) 85%,var(--line-strong));margin:var(--node-shift) 0 var(--s1);transition:background var(--t-base) var(--ease-soft),border-color var(--t-base) var(--ease-soft),box-shadow var(--t-base) var(--ease-soft)}.tl-card__year{font-family:var(--font-display);font-size:1.6rem;font-weight:800;letter-spacing:-.03em;line-height:1}.tl-card__meta{display:flex;flex-direction:column;gap:1px;max-width:100%}.tl-card__title{font-size:.7rem;font-weight:500;color:var(--muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.tl-card__artist{font-size:.65rem;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tl-card--new{animation:card-won .62s var(--ease-lift) both}.tl-card--new .tl-card__node{background:var(--accent);border-color:var(--accent);box-shadow:0 0 0 5px var(--accent-wash)}.tl-card--new .tl-card__year{color:var(--accent)}.tl-card--new .tl-card__art{box-shadow:var(--bloom-accent)}@keyframes card-won{0%{opacity:0;transform:scale(.68) rotate(-7deg)}58%{transform:scale(1.06) rotate(2deg)}to{opacity:1;transform:scale(1) rotate(0)}}.timeline--compact .tl-card{width:74px}.timeline--compact .tl-card__art{border-radius:10px}.timeline--compact .tl-card__year{font-size:1.1rem}.timeline--compact .tl-card__title,.timeline--compact .tl-card__artist{display:none}.timeline--compact .tl-card{cursor:pointer}.timeline--compact .tl-card:focus-visible{outline:none}.timeline--compact .tl-card:hover .tl-card__art,.timeline--compact .tl-card:focus-visible .tl-card__art{transform:translateY(-3px) scale(1.06);box-shadow:var(--bloom-accent)}.timeline__detail{display:flex;align-items:baseline;gap:var(--s2);min-height:1.25rem;padding:0 var(--s1);font-size:.8125rem;line-height:1.25rem;white-space:nowrap;overflow:hidden}.timeline__detail-title{font-weight:600;color:var(--ink);overflow:hidden;text-overflow:ellipsis}.timeline__detail-artist{flex-shrink:0;color:var(--muted)}.tl-slot{flex:0 0 auto;width:14px;border:none;background:transparent;padding:0;display:flex;flex-direction:column;align-items:center;cursor:default;color:var(--dim);position:relative;touch-action:manipulation;transition:width var(--t-base) var(--ease-lift)}.tl-slot--active{width:44px;cursor:pointer}.tl-slot--selected{width:96px}.tl-slot__marker{--marker-size: 30px;margin-top:calc(var(--rail-y) - var(--marker-size) / 2);width:0;height:var(--marker-size);border-radius:var(--radius-pill);background:transparent;border:2px dashed transparent;display:flex;align-items:center;justify-content:center;overflow:hidden;transition:width var(--t-base) var(--ease-lift),height var(--t-base) var(--ease-lift),margin var(--t-base) var(--ease-lift),background var(--t-base) var(--ease-soft),border-color var(--t-base) var(--ease-soft),box-shadow var(--t-base) var(--ease-soft)}.tl-slot--active .tl-slot__marker{width:var(--marker-size);border-color:var(--line-strong);background:var(--surface)}.tl-slot--active:hover .tl-slot__marker{border-color:var(--accent);color:var(--accent)}.tl-slot--selected .tl-slot__marker{width:84px;height:84px;margin-top:0;border-radius:18px;border-style:solid;border-color:var(--accent);background:var(--accent-wash);box-shadow:var(--bloom-accent)}.tl-slot--selected .tl-slot__marker:after{content:"?";font-family:var(--font-display);color:var(--accent);font-size:2rem;font-weight:800}.podium{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--s2)}.podium__row{display:flex;align-items:center;gap:var(--s3);padding:.6rem .85rem;border-radius:var(--radius);background:var(--surface-2);border:1px solid transparent}.podium__row--winner{border-color:color-mix(in srgb,var(--player, var(--accent)) 55%,transparent);background:linear-gradient(90deg,color-mix(in srgb,var(--player, var(--accent)) 18%,transparent) 0%,var(--surface-2) 70%)}.podium__place{flex-shrink:0;width:1.75rem;font-family:var(--font-display);font-size:1.5rem;font-weight:800;font-variant-numeric:tabular-nums;text-align:right;color:var(--dim)}.podium__row--winner .podium__place{color:var(--token-gold)}.podium__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:.3rem}.podium__head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s2)}.podium__name{display:inline-flex;align-items:center;gap:.35rem;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--player, var(--ink))}.podium__score{flex-shrink:0;font-size:.8125rem;color:var(--muted)}.podium__track{height:8px;border-radius:var(--radius-pill);background:var(--surface-3);overflow:hidden}.podium__bar{display:block;height:100%;width:var(--share, 0%);border-radius:var(--radius-pill);background:linear-gradient(90deg,color-mix(in srgb,var(--player, var(--accent)) 70%,transparent),var(--player, var(--accent)));transform-origin:left center;animation:podium-grow .7s var(--delay, 0ms) var(--ease-lift) both}@keyframes podium-grow{0%{transform:scaleX(0)}}@media (prefers-reduced-motion: reduce){.podium__bar{animation:none}}.phase-timer{display:flex;flex-direction:column;gap:var(--s1)}.phase-timer__head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s2)}.phase-timer__label{font-size:.8125rem;color:var(--muted)}.phase-timer__seconds{font-family:var(--font-display);font-size:1.75rem;font-weight:800;line-height:1;font-variant-numeric:tabular-nums;color:var(--token-gold);transition:color var(--t-fast) var(--ease-soft)}.phase-timer__track{height:6px;border-radius:var(--radius-pill);background:var(--surface-3);overflow:hidden}.phase-timer__fill{height:100%;width:100%;transform-origin:left center;border-radius:var(--radius-pill);background:linear-gradient(90deg,var(--accent-deep),var(--token-gold));transition:background var(--t-base) var(--ease-soft)}.phase-timer--urgent .phase-timer__seconds{color:var(--deny)}.phase-timer--urgent .phase-timer__fill{background:linear-gradient(90deg,var(--deny),#f0a396)}.phase-timer--urgent .phase-timer__seconds{animation:urgent 1s var(--ease-soft) infinite}@media (prefers-reduced-motion: reduce){.phase-timer--urgent .phase-timer__seconds{animation:none}}.turntable{--disc-size: 132px;position:relative;display:grid;place-items:center;width:var(--disc-size);height:var(--disc-size);margin:0 auto}.turntable--lg{--disc-size: 260px}.turntable__disc{position:relative;z-index:1;width:100%;height:100%;border-radius:50%;background:radial-gradient(circle at 32% 26%,rgb(255 255 255 / 9%) 0%,transparent 46%),repeating-radial-gradient(circle at 50% 50%,#17110f,#17110f 2px,#221a17 2px,#221a17 4px),#14100f;box-shadow:var(--bloom),inset 0 0 0 1px #f7f1e80f}.turntable__disc:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;background:conic-gradient(from 0deg,transparent 0deg,rgb(255 245 235 / 11%) 24deg,transparent 60deg,transparent 172deg,rgb(255 245 235 / 7%) 202deg,transparent 240deg,transparent 360deg);pointer-events:none}.turntable__label{position:absolute;top:34%;right:34%;bottom:34%;left:34%;border-radius:50%;background:radial-gradient(circle at 34% 30%,var(--accent-bright),var(--accent-deep));box-shadow:inset 0 0 0 1px #00000059}.turntable__label:before{content:"";position:absolute;top:14%;left:50%;width:10%;height:24%;transform:translate(-50%);border-radius:var(--radius-pill);background:#0000004d}.turntable__label:after{content:"";position:absolute;top:42%;right:42%;bottom:42%;left:42%;border-radius:50%;background:var(--ground)}.turntable--spinning .turntable__disc{animation:disc-spin 12s linear infinite}@keyframes disc-spin{to{transform:rotate(360deg)}}.turntable--spinning:after{content:"";position:absolute;width:calc(var(--disc-size) * 1.5);height:calc(var(--disc-size) * 1.5);border-radius:50%;background:radial-gradient(circle,var(--accent-wash) 0%,transparent 62%);animation:breathe 5.5s var(--ease-soft) infinite;pointer-events:none;z-index:-1}.turntable{position:relative}@media (prefers-reduced-motion: reduce){.turntable--spinning .turntable__disc,.turntable--spinning:after{animation:none}}.guess-choice{flex-direction:column;align-items:flex-start;gap:0;padding:.7rem 1rem;text-align:left}.guess-choice__title{font-weight:600;line-height:1.3}.guess-choice__artist{font-size:.8125rem;color:var(--muted);line-height:1.3}.tokens{display:inline-flex;gap:var(--s1);align-items:center}.token{width:18px;height:18px;border-radius:50%;background:radial-gradient(circle at 32% 28%,#f6d79a 0%,var(--token-gold) 55%,#a9762d 100%);animation:token-pop .42s var(--ease-lift) both}.token--spent{background:transparent;border:2px solid var(--line-strong)}@keyframes token-pop{0%{transform:scale(0)}}.player-row{display:flex;align-items:center;gap:var(--s2);padding:.6rem .85rem;border-radius:var(--radius);background:var(--surface-2);border:1px solid transparent;transition:background var(--t-base) var(--ease-soft),border-color var(--t-base) var(--ease-soft)}.player-row--active{border-color:color-mix(in srgb,var(--player, var(--accent-deep)) 65%,transparent);background:linear-gradient(90deg,color-mix(in srgb,var(--player, var(--accent)) 16%,transparent) 0%,var(--surface-2) 65%)}.player-row__timeline{margin:var(--s1) 0 var(--s2) var(--s4);padding-left:var(--s3);border-left:2px solid color-mix(in srgb,var(--player, var(--line-strong)) 55%,transparent);animation:rise .24s var(--ease-soft) both}@media (prefers-reduced-motion: reduce){.player-row__timeline{animation:none}}.player-row__dot{flex-shrink:0;width:9px;height:9px;border-radius:50%;background:var(--player, var(--muted));box-shadow:0 0 0 3px color-mix(in srgb,var(--player, var(--muted)) 18%,transparent)}.player-row--disconnected{opacity:.45}.player-row__name{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.player-row__meta{font-size:.75rem;color:var(--dim)}.badge{display:inline-flex;align-items:center;gap:var(--s1);padding:.15rem .6rem;border-radius:var(--radius-pill);font-family:var(--font-display);font-size:.6875rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;background:var(--surface-3);color:var(--muted);white-space:nowrap}.badge--host{background:var(--accent-wash);color:var(--accent-bright)}.badge--speaker{background:#7fb06929;color:#a8cf94}.badge--premium{background:#e8b45c29;color:var(--token-gold)}.badge--you{background:var(--accent);color:#2b1508}.alert{display:flex;align-items:flex-start;gap:var(--s2);padding:.85rem 1rem;border-radius:var(--radius);border:1px solid;font-size:.9375rem;line-height:1.5;animation:rise .26s var(--ease-soft) both}.alert--error{background:#d9614c1f;border-color:#d9614c66;color:#f0a396}.alert--warning{background:#e8b45c1f;border-color:#e8b45c61;color:#efcd91}.alert--info{background:var(--accent-wash);border-color:#ff9e5e4d;color:var(--accent-bright)}.alert--success{background:#7fb0691f;border-color:#7fb06961;color:#a8cf94}.toast{position:fixed;left:var(--s3);bottom:max(var(--s3),env(safe-area-inset-bottom));z-index:var(--z-toast);display:flex;align-items:flex-start;gap:var(--s2);padding:.8rem .6rem .8rem 1rem;max-width:min(26rem,calc(100vw - 2 * var(--s3)));background:var(--surface-2);border:1px solid var(--line-strong);border-left:3px solid var(--error);border-radius:var(--radius);box-shadow:var(--bloom);font-size:.9375rem;line-height:1.45;animation:toast-in var(--t-base) var(--ease-lift) both}@keyframes toast-in{0%{opacity:0;transform:translateY(12px) scale(.98)}}.toast__body{flex:1;min-width:0;padding-top:.15rem;color:var(--ink)}.toast__detail{display:block;margin-top:.15rem;font-size:.75rem;color:var(--muted)}.toast__close{flex-shrink:0;display:grid;place-items:center;width:40px;height:40px;padding:0;background:transparent;border:0;border-radius:var(--radius-pill);color:var(--muted);cursor:pointer;transition:color var(--t-fast) var(--ease-soft),background-color var(--t-fast) var(--ease-soft)}.toast__close:hover{background:#f7f1e814;color:var(--ink)}.toast__close:focus-visible{outline:none;box-shadow:0 0 0 3px #ff9e5e66}@media (max-width: 30rem){.toast{left:var(--s2);right:var(--s2);max-width:none}}@media (prefers-reduced-motion: reduce){.toast{animation:none}}.progress{height:6px;background:var(--surface-3);border-radius:var(--radius-pill);overflow:hidden}.progress__bar{height:100%;border-radius:var(--radius-pill);background:linear-gradient(90deg,var(--accent-deep),var(--accent),var(--accent-deep));background-size:200% 100%;animation:shimmer 2.4s linear infinite;transition:width var(--t-base) var(--ease-soft)}@keyframes shimmer{to{background-position:-200% 0}}.room-code{font-family:var(--font-display);font-size:clamp(3rem,13vw,5.5rem);font-weight:800;letter-spacing:.12em;line-height:1;color:var(--accent)}.qr{background:var(--ink);padding:.7rem;border-radius:var(--radius);display:block;width:176px;height:176px}.reveal{display:flex;flex-direction:column;align-items:center;gap:var(--s3);text-align:center;padding:var(--s4);border-radius:var(--radius-lg);border:1px solid;animation:reveal-in .48s var(--ease-lift) both}.reveal--correct{--tone: rgb(127 176 105);border-color:color-mix(in srgb,var(--cover, var(--tone)) 45%,transparent);background:radial-gradient(ellipse 120% 80% at 50% -10%,color-mix(in srgb,var(--cover, var(--tone)) 22%,transparent) 0%,transparent 65%),var(--surface)}.reveal--wrong{--tone: rgb(217 97 76);border-color:color-mix(in srgb,var(--cover, var(--tone)) 45%,transparent);background:radial-gradient(ellipse 120% 80% at 50% -10%,color-mix(in srgb,var(--cover, var(--tone)) 22%,transparent) 0%,transparent 65%),var(--surface)}.reveal{transition:background .6s var(--ease-soft),border-color .6s var(--ease-soft)}@keyframes reveal-in{0%{opacity:0;transform:perspective(900px) rotateX(12deg) translateY(20px) scale(.94)}}.reveal__cover{width:168px;height:168px;border-radius:20px;object-fit:cover;box-shadow:var(--bloom);background:var(--surface-3);animation:cover-in .48s var(--ease-lift) both}@keyframes cover-in{0%{opacity:0;transform:scale(.86) rotate(-4deg)}}.reveal__year{font-family:var(--font-display);font-size:clamp(3.25rem,15vw,6.5rem);font-weight:800;line-height:.95;letter-spacing:-.04em;animation:year-in .52s .1s var(--ease-lift) both}@keyframes year-in{0%{opacity:0;transform:scale(.55);filter:blur(8px)}}.reveal__verdict{font-family:var(--font-display);font-size:1.5rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em}.reveal--correct .reveal__verdict{color:#a8cf94}.reveal--wrong .reveal__verdict{color:#f0a396}.reveal--pending{border-color:color-mix(in srgb,var(--cover, var(--line-strong)) 35%,transparent);background:radial-gradient(ellipse 120% 80% at 50% -10%,color-mix(in srgb,var(--cover, var(--surface-3)) 18%,transparent) 0%,transparent 65%),var(--surface)}.reveal__result{position:relative;display:flex;flex-direction:column;align-items:center;gap:var(--s3);width:100%}.reveal__result:not(.reveal__result--shown)>.reveal__verdict,.reveal__result:not(.reveal__result--shown)>.reveal__outcome{visibility:hidden}.reveal__suspense{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center}.reveal__suspense:after{content:"· · ·";font-family:var(--font-display);font-size:1.5rem;letter-spacing:.1em;color:var(--dim);animation:suspense-pulse 1.4s var(--ease-soft) infinite}@keyframes suspense-pulse{0%,to{opacity:.35}50%{opacity:.9}}.reveal__result--shown>.reveal__verdict{animation:verdict-in .42s var(--ease-lift) both}.reveal__result--shown>.reveal__outcome{animation:verdict-in .42s .12s var(--ease-lift) both}@keyframes verdict-in{0%{opacity:0;transform:scale(.86)}}@media (prefers-reduced-motion: reduce){.reveal__suspense:after,.reveal__result--shown>.reveal__verdict,.reveal__result--shown>.reveal__outcome{animation:none}}.countdown{display:inline-flex;align-items:center;gap:var(--s1);font-family:var(--font-display);font-variant-numeric:tabular-nums;font-weight:600;color:var(--token-gold)}.countdown--urgent{color:var(--deny);animation:urgent .9s var(--ease-soft) infinite}@keyframes urgent{50%{opacity:.4;transform:scale(1.08)}}.log{display:flex;flex-direction:column-reverse;gap:var(--s1);max-height:220px;overflow-x:hidden;overflow-y:auto;font-size:.8125rem;color:var(--muted)}.log__entry{padding:var(--s1) 0;border-bottom:1px solid var(--line)}.playlist-list{display:flex;flex-direction:column;gap:var(--s1);max-height:320px;overflow-x:hidden;overflow-y:auto;padding:2px;margin:-2px}.playlist-item{display:flex;align-items:center;gap:var(--s2);padding:var(--s2);border-radius:var(--radius);border:1px solid transparent;background:var(--surface-2);cursor:pointer;text-align:left;font:inherit;color:inherit;width:100%;transition:background var(--t-fast) var(--ease-soft),border-color var(--t-fast) var(--ease-soft),transform var(--t-fast) var(--ease-soft)}.playlist-item:hover:not(:disabled){border-color:var(--accent-deep);background:var(--surface-3);box-shadow:inset 3px 0 0 var(--accent)}.playlist-item--selected{border-color:var(--accent);background:var(--accent-wash)}.playlist-item__cover{width:48px;height:48px;border-radius:12px;object-fit:cover;flex-shrink:0;background:var(--surface-3)}.playlist-item__name{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.playlist-item__meta{font-size:.75rem;color:var(--dim)}.dropdown{position:relative}.dropdown__panel{position:absolute;top:calc(100% + var(--s2));right:0;z-index:var(--z-popover);width:max(260px,18rem);max-width:min(88vw,360px);padding:var(--s3);background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--radius-lg);box-shadow:var(--bloom);max-height:min(70vh,32rem);overflow-x:hidden;overflow-y:auto;transform-origin:top right;animation:menu-in .2s var(--ease-lift) both}@keyframes menu-in{0%{opacity:0;transform:scale(.94) translateY(-8px)}}.screen-view{font-size:1.25rem}.screen-view .tl-card{width:148px}.screen-view .tl-card__year{font-size:1.85rem}.screen-view .panel__title{font-size:.95rem}.text-muted{color:var(--muted)}.text-dim{color:var(--dim)}.text-sm{font-size:.875rem}.text-xs{font-size:.75rem}.text-center{text-align:center}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.min-w-0{min-width:0}.spinner{width:18px;height:18px;border:2px solid var(--line-strong);border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite;flex-shrink:0}@keyframes spin{to{transform:rotate(360deg)}}.icon{width:1.15em;height:1.15em;flex-shrink:0;stroke:currentColor;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}.icon--filled{fill:currentColor;stroke:none}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}.hero{display:flex;flex-direction:column;gap:.15rem;padding:var(--s2) 0 var(--s1)}.hero__eyebrow{font-family:var(--font-display);font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.16em;color:var(--accent);min-height:1.1em}.hero__title{font-size:clamp(2rem,7vw,4.25rem);line-height:.98}.screen-view .hero__title{font-size:clamp(2.75rem,6vw,5.5rem)}.screen-view .hero__eyebrow{font-size:1rem}.add-player{display:flex;align-items:center;gap:var(--s2);margin-top:var(--s1);padding:.35rem .45rem .35rem .85rem;border:1px dashed var(--line-strong);border-radius:var(--radius);transition:border-color var(--t-fast) var(--ease-soft)}.add-player:focus-within{border-color:var(--accent);border-style:solid}.add-player__input{flex:1;min-width:0;background:transparent;border:none;color:var(--ink);font-family:var(--font-body);font-size:16px;font-weight:600;padding:.35rem 0}.add-player__input::placeholder{color:var(--dim);font-weight:400}.add-player__input:focus{outline:none}.callout{position:relative;padding:var(--s3);border-radius:var(--radius-lg);background:var(--accent-wash);border:1px solid rgb(255 158 94 / 26%);animation:rise .32s var(--ease-soft) both}.callout:after{content:"";position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;border-radius:inherit;box-shadow:0 0 40px #ff9e5e1f;pointer-events:none}.page{position:relative}.page--lit:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 90% 55% at 50% 0%,color-mix(in srgb,var(--cover) 16%,transparent) 0%,transparent 62%);animation:room-light .9s var(--ease-soft) both}@keyframes room-light{0%{opacity:0}}.deck{display:inline-flex;align-items:center;gap:.55rem}.deck__stack{position:relative;width:22px;height:28px;flex-shrink:0}.deck__stack span{position:absolute;top:0;right:0;bottom:0;left:0;border:1px solid var(--line-strong);border-radius:5px;background:var(--surface-2)}.deck__stack span{transform:translate(calc(var(--layer, 0) * -2px),calc(var(--layer, 0) * -1.5px)) rotate(calc(var(--layer, 0) * -3deg));opacity:calc(1 - var(--layer, 0) * .16);transition:transform var(--t-base) var(--ease-soft)}.deck__stack span:last-child{background:var(--surface-3)}.deck__count{font-family:var(--font-display);font-weight:600;font-variant-numeric:tabular-nums;color:var(--muted)}.deck--low .deck__count{color:var(--token-gold)}.brand{margin-bottom:var(--s2)}.brand__title{font-size:clamp(3rem,14vw,5rem);line-height:.92;margin-left:-.04em}.brand__accent{color:var(--accent)}.brand__tagline{margin:var(--s2) 0 0;color:var(--muted);font-size:1.05rem;max-width:34ch}.choice{display:flex;flex-direction:column;align-items:flex-start;gap:.2rem;width:100%;padding:var(--s4);border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface);color:var(--ink);font:inherit;text-align:left;cursor:pointer;transition:border-color var(--t-fast) var(--ease-soft),background var(--t-fast) var(--ease-soft),transform var(--t-fast) var(--ease-soft)}.choice:hover{border-color:var(--accent);background:var(--surface-2);transform:translateY(-2px)}.choice:focus-visible{outline:none;box-shadow:0 0 0 3px #ff9e5e66}.choice__label{font-family:var(--font-display);font-size:1.5rem;font-weight:800;letter-spacing:-.02em}.choice__hint{font-size:.9rem;color:var(--dim)}.choice--primary{background:linear-gradient(135deg,var(--accent) 0%,#e07d42 100%);border-color:transparent;color:#2b1508}.choice--primary .choice__hint{color:#2b1508b3}.choice--primary:hover{background:linear-gradient(135deg,var(--accent-bright) 0%,var(--accent) 100%);border-color:transparent}
