:root{--bg-body: #f2f2f7;--bg-card: #ffffff;--bg-elevated: #ffffff;--fill: rgba(120, 120, 128, .12);--material: rgba(249, 249, 249, .78);--scrim: rgba(0, 0, 0, .35);--text-main: #000000;--text-secondary: rgba(60, 60, 67, .6);--text-tertiary: rgba(60, 60, 67, .3);--text-inverse: #ffffff;--separator: rgba(60, 60, 67, .18);--accent-blue: #007aff;--accent-green: #34c759;--accent-red: #ff3b30;--gold: #ffcc00;--silver: #aeaeb2;--bronze: #c69c6d;--radius-lg: 20px;--radius: 12px;--shadow-card: 0 1px 2px rgba(0, 0, 0, .04);--shadow-float: 0 10px 40px rgba(0, 0, 0, .18);--spring: cubic-bezier(.32, .72, 0, 1);color-scheme:light}:root.dark-mode{--bg-body: #000000;--bg-card: #1c1c1e;--bg-elevated: #2c2c2e;--fill: rgba(118, 118, 128, .24);--material: rgba(37, 37, 37, .72);--scrim: rgba(0, 0, 0, .55);--text-main: #ffffff;--text-secondary: rgba(235, 235, 245, .6);--text-tertiary: rgba(235, 235, 245, .3);--separator: rgba(84, 84, 88, .6);--accent-blue: #0a84ff;--accent-green: #30d158;--accent-red: #ff453a;--gold: #ffd60a;--silver: #8e8e93;--bronze: #ac8e68;--shadow-card: none;--shadow-float: 0 10px 40px rgba(0, 0, 0, .6);color-scheme:dark}*,*:before,*:after{box-sizing:border-box}body{margin:0;background:var(--bg-body);color:var(--text-main);font:17px/1.47 -apple-system,BlinkMacSystemFont,SF Pro Text,system-ui,Helvetica Neue,sans-serif;letter-spacing:-.022em;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;min-height:100vh;transition:background-color .3s ease,color .3s ease}#root{max-width:560px;margin:0 auto;padding:0 16px calc(40px + env(safe-area-inset-bottom))}h1,h2,h3,h4{margin:0;color:var(--text-main)}h1{font-size:34px;line-height:1.12;font-weight:700;letter-spacing:-.03em}h2{font-size:28px;line-height:1.15;font-weight:700;letter-spacing:-.025em}h3{font-size:20px;line-height:1.25;font-weight:600;letter-spacing:-.02em}p{margin:0;color:var(--text-secondary)}.page{display:flex;flex-direction:column;gap:24px}.stack{display:flex;flex-direction:column;gap:12px}.row{display:flex;gap:12px}.row>*{flex:1}.center{text-align:center}.section-label{margin:0 0 6px 16px;font-size:13px;font-weight:400;letter-spacing:0;text-transform:uppercase;color:var(--text-secondary)}.footnote{font-size:13px;letter-spacing:-.005em;color:var(--text-secondary)}.topbar{position:sticky;top:0;z-index:100;display:flex;align-items:center;justify-content:space-between;margin:0 -16px 8px;padding:calc(8px + env(safe-area-inset-top)) 16px 8px;background:var(--material);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border-bottom:.5px solid var(--separator)}.topbar-title{font-size:17px;font-weight:600;color:var(--text-main);text-decoration:none}.app-icon{display:block;border-radius:22.5%;box-shadow:0 4px 14px #0000001f}.card{background:var(--bg-card);border-radius:var(--radius-lg);padding:20px;box-shadow:var(--shadow-card)}.list{list-style:none;margin:0;padding:0;background:var(--bg-card);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-card)}.list>li{position:relative;padding:14px 16px;min-height:50px}.list>li+li:before{content:"";position:absolute;top:0;left:16px;right:0;border-top:.5px solid var(--separator)}button{font:inherit;letter-spacing:inherit;color:inherit;background:none;border:none;padding:0;cursor:pointer;-webkit-user-select:none;user-select:none;transition:transform .12s ease-out,opacity .12s ease-out,background-color .2s ease}button:disabled{cursor:default}button:focus-visible{outline:3px solid color-mix(in srgb,var(--accent-blue) 50%,transparent);outline-offset:2px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;padding:0 20px;border-radius:14px;font-size:17px;font-weight:600}.btn:not(:disabled):active{transform:scale(.97);opacity:.8}.btn:disabled{opacity:.4}.btn-primary{background:var(--accent-blue);color:#fff}.btn-success{background:var(--accent-green);color:#fff}.btn-tinted{background:color-mix(in srgb,var(--accent-blue) 15%,transparent);color:var(--accent-blue)}.btn-gray{background:var(--fill);color:var(--text-main)}.btn-block{width:100%}.btn-text{color:var(--accent-blue);font-size:15px;font-weight:400;padding:6px 0}.btn-text:active{opacity:.5}.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:var(--fill);color:var(--accent-blue)}.icon-btn:active{transform:scale(.92)}.icon-btn svg{width:18px;height:18px}input{width:100%;min-height:50px;padding:12px 16px;font:inherit;letter-spacing:inherit;color:var(--text-main);background:var(--bg-card);border:none;border-radius:var(--radius);box-shadow:var(--shadow-card),inset 0 0 0 .5px var(--separator);transition:box-shadow .2s ease}input::placeholder{color:var(--text-tertiary)}input:focus{outline:none;box-shadow:inset 0 0 0 2px var(--accent-blue)}input:disabled{opacity:.6}.game-header{display:flex;flex-direction:column;align-items:center;gap:6px;padding-top:8px;text-align:center}.code-pill{display:inline-block;padding:3px 10px;border-radius:999px;background:var(--fill);color:var(--text-secondary);font-size:13px;font-weight:600;letter-spacing:.08em;font-variant-numeric:tabular-nums}.question{font-size:22px;line-height:1.3;font-weight:600;letter-spacing:-.02em;color:var(--text-main)}.stats{display:grid;grid-template-columns:1fr 1fr;gap:12px 16px;font-size:15px}.stats dt{font-size:13px;color:var(--text-secondary)}.stats dd{margin:2px 0 0;color:var(--text-main)}.stats .full{grid-column:1 / -1}.turn{display:flex;align-items:center;gap:14px;padding:16px 20px;border-radius:var(--radius-lg);background:var(--accent-blue);color:#fff}.turn.done{background:var(--accent-green)}.turn-eyebrow{font-size:13px;font-weight:600;text-transform:uppercase;opacity:.75;letter-spacing:.02em}.turn-name{font-size:22px;font-weight:700;letter-spacing:-.02em}.turn-dot{flex:none;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:#fff3;font-size:20px}.answer{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:54px;padding:14px 16px;text-align:left;font-size:17px;color:var(--text-main)}.answer:not(:disabled):active{background:var(--fill)}.answer:not(:disabled) .chevron{color:var(--text-tertiary)}.answer:disabled{color:var(--text-secondary)}.answer.guessed{color:var(--text-secondary)}.answer-author{flex:none;font-size:15px;font-weight:600;color:var(--accent-blue)}.chevron{flex:none;font-size:20px;line-height:1}.list>li.answer-row{padding:0}.mine{color:var(--accent-blue);font-weight:600}.hidden-answer{filter:blur(6px);color:var(--text-secondary);-webkit-user-select:none;user-select:none}.score-row{display:flex;align-items:center;gap:12px}.rank{flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:700;letter-spacing:-.02em;background:var(--fill);color:var(--text-secondary)}.rank-1{background:var(--gold);color:#000}.rank-2{background:var(--silver);color:#000}.rank-3{background:var(--bronze);color:#000}.score-name{flex:1;font-weight:500}.score-value{font-weight:600;font-variant-numeric:tabular-nums;color:var(--text-secondary)}.overlay{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:16px;background:var(--scrim)}.dialog{width:100%;max-width:360px;max-height:85vh;overflow-y:auto;padding:24px 20px 20px;border-radius:24px;background:var(--material);backdrop-filter:blur(40px) saturate(180%);-webkit-backdrop-filter:blur(40px) saturate(180%);box-shadow:var(--shadow-float);text-align:center}.dialog h3{margin-bottom:8px}.dialog p{margin-bottom:20px;font-size:15px}.dialog .stack{gap:8px}.toast-wrap{position:fixed;top:calc(12px + env(safe-area-inset-top));left:0;right:0;z-index:2000;display:flex;justify-content:center;padding:0 16px;pointer-events:none}.toast{display:flex;align-items:center;gap:10px;max-width:480px;padding:12px 18px;border-radius:999px;background:var(--material);backdrop-filter:blur(30px) saturate(180%);-webkit-backdrop-filter:blur(30px) saturate(180%);box-shadow:var(--shadow-float);color:var(--text-main);font-size:15px;font-weight:600}.toast-dot{flex:none;width:10px;height:10px;border-radius:50%;background:var(--accent-green)}.toast.error .toast-dot{background:var(--accent-red)}.spinner{display:inline-block;width:16px;height:16px;border-radius:50%;border:2px solid currentColor;border-top-color:transparent;opacity:.8;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.btn:not(:disabled):active,.icon-btn:active{transform:none}}@media(prefers-reduced-transparency:reduce){.topbar,.dialog,.toast{background:var(--bg-elevated);backdrop-filter:none;-webkit-backdrop-filter:none}}
