:root{--bg-top:#120f25;--bg-bottom:#05030c;--panel:#0d081fd1;--panel-strong:#171030f0;--gold:#f4cf72;--violet:#8c62ff;--violet-soft:#bb9dff;--clue-glow:#95ebff;--text:#fff7df;--muted:#d7c9f4;--danger:#ff8f8f;--success:#9ff5bf;--shadow:0 24px 60px #00000073;--border:#ffffff14}*{box-sizing:border-box}html,body,#root{min-height:100%}body{min-height:100vh;color:var(--text);background:radial-gradient(circle at 50% 10%, #fff4c414, transparent 16%), radial-gradient(circle at top, #8d62ff42, transparent 32%), radial-gradient(circle at 20% 20%, #f4cf7224, transparent 18%), radial-gradient(circle at 82% 18%, #92d6ff1f, transparent 20%), linear-gradient(180deg, #171033 0%, var(--bg-top) 35%, var(--bg-bottom) 100%);margin:0;font-family:Nunito,sans-serif;overflow-x:hidden}body:before{content:"";pointer-events:none;opacity:.22;background-image:linear-gradient(#ffffff05 1px,#0000 1px),linear-gradient(90deg,#ffffff05 1px,#0000 1px);background-size:36px 36px;position:fixed;inset:0}body:after{content:"";pointer-events:none;mix-blend-mode:screen;opacity:.75;background:radial-gradient(circle at 50% 14%,#fff3be24,#0000 11%),radial-gradient(circle at 22% 78%,#92d6ff1a,#0000 22%),radial-gradient(circle at 78% 70%,#bb9dff1f,#0000 24%),linear-gradient(#ffffff08,#0000 28%);position:fixed;inset:0}.stars,.orb,.magic-decor{pointer-events:none;position:fixed}.stars{opacity:.95;background-image:radial-gradient(circle at 15% 25%,#ffffffe6 0 1px,#0000 1.5px),radial-gradient(circle at 80% 18%,#ffffffb8 0 1px,#0000 1.5px),radial-gradient(circle at 38% 70%,#f4cf72e6 0 1.2px,#0000 1.7px),radial-gradient(circle at 64% 52%,#92d6ffd1 0 1.2px,#0000 1.7px),radial-gradient(circle at 22% 88%,#ffffffd6 0 1px,#0000 1.6px),radial-gradient(circle at 52% 14%,#fff3bee0 0 2px,#0000 2.8px);animation:6.5s ease-in-out infinite twinkle;inset:0}.orb{filter:blur(24px);opacity:.24;border-radius:999px;width:24rem;height:24rem;animation:10s ease-in-out infinite drift}.orb-left{background:radial-gradient(circle,#f4cf72b3,#0000 65%);top:6%;left:-8%}.orb-right{background:radial-gradient(circle,#8c62ffd1,#0000 65%);animation-delay:-8s;bottom:4%;right:-8%}.magic-decor{z-index:0;opacity:.2;filter:drop-shadow(0 0 14px #f4cf721a)}.magic-wand{width:150px;height:150px}.magic-wand:before,.magic-wand:after,.magic-broom:before,.magic-broom:after{content:"";position:absolute}.magic-wand:before{background:linear-gradient(#704628eb,#31160994);border-radius:999px;width:6px;height:118px;top:16px;left:72px}.magic-wand:after{background:radial-gradient(circle,#fff5ccf5 0 10%,#0000 11%),radial-gradient(circle at 24% 70%,#92d6ffdb 0 8%,#0000 9%),radial-gradient(circle at 76% 30%,#f4cf72e0 0 8%,#0000 9%),radial-gradient(circle,#bb9dff6b,#0000 66%);width:56px;height:56px;top:-8px;left:47px}.magic-wand-left{top:18%;left:4%;transform:rotate(-18deg)}.magic-wand-right{top:12%;right:7%;transform:rotate(22deg)}.magic-broom{width:220px;height:90px}.magic-broom:before{background:linear-gradient(90deg,#6c4427e6,#32180b8f);border-radius:999px;width:150px;height:6px;top:42px;left:20px}.magic-broom:after{clip-path:polygon(0% 50%,24% 0%,100% 18%,100% 82%,24% 100%);background:linear-gradient(90deg,#846136b8,#4a321866);width:54px;height:42px;top:24px;right:16px;box-shadow:inset 8px 0 #562c1333}.magic-broom-left{bottom:18%;left:-1%;transform:rotate(-14deg)}.magic-broom-right{bottom:12%;right:-2%;transform:rotate(12deg)scaleX(-1)}.app-shell{z-index:1;grid-template-columns:1.12fr .88fr;align-items:stretch;gap:20px;width:min(1240px,100% - 32px);min-height:100vh;margin:0 auto;padding:20px 0;display:grid;position:relative}.hero-panel,.reveal-panel{background:var(--panel);border:1px solid var(--border);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);border-radius:28px}.hero-panel{flex-direction:column;gap:16px;padding:24px;display:flex}.reveal-panel{grid-template-rows:auto auto 1fr auto;gap:16px;padding:22px;display:grid}.brand-row{align-items:center;gap:18px;display:flex}.player-panel{background:linear-gradient(135deg,#f4cf721f,#8c62ff29);border:1px solid #ffffff14;border-radius:20px;grid-template-columns:1.2fr 1fr;align-items:center;gap:14px;padding:14px 16px;display:grid}.greeting-copy{gap:4px;display:grid}.greeting-copy h2{font-size:clamp(1.15rem,1.9vw,1.7rem)}.player-entry{grid-template-columns:1fr auto;gap:10px;display:grid}.crest{color:#1d1028;background:linear-gradient(135deg, var(--gold), #ffe8a7);border-radius:18px;place-items:center;width:68px;height:68px;font-family:Cinzel,serif;font-size:1.2rem;font-weight:800;display:grid;box-shadow:0 0 24px #f4cf7273}.eyebrow,.reveal-label,.history-title,.status-label,.level-picker span,.clue-index,.answer-label,.countdown-label{text-transform:uppercase;letter-spacing:.18em;color:var(--muted);font-size:.72rem}h1,h2{margin:0;font-family:Cinzel,serif}h1{font-size:clamp(2rem,2.8vw,3.2rem)}h2{font-size:clamp(1.7rem,2.2vw,2.5rem)}.hero-copy,#characterFact,.result-text,.voice-text,.portrait-placeholder p,#historyList,#countdownText{margin:0;line-height:1.55}.hero-copy{font-size:1rem}.status-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;display:grid}.status-card,.clue-card,.feedback-panel,.history-box,.level-picker,.portrait-frame,.answer-banner,.countdown-panel{background:var(--panel-strong);border:1px solid #ffffff0f}.status-card{border-radius:18px;flex-direction:column;gap:8px;padding:14px 16px;display:flex}.status-card strong{color:var(--gold);font-size:clamp(1.45rem,2vw,1.95rem)}.controls-row,.guess-row,.action-row{flex-wrap:wrap;gap:12px;display:flex}.controls-row-main{align-items:end}.level-picker{border-radius:18px;flex-direction:column;flex:1;gap:8px;min-width:210px;padding:12px 14px;display:flex}select,input,button{font:inherit}select,input{width:100%;color:var(--text);background:#ffffff14;border:none;border-radius:14px;outline:none;padding:15px 16px;font-size:1rem}select:focus,input:focus{box-shadow:0 0 0 3px #92d6ff47}input::placeholder{color:#d9d0ec}.guess-row input{flex:1;min-width:240px}.button{cursor:pointer;border:none;border-radius:16px;min-height:56px;padding:14px 18px;font-size:1rem;font-weight:800;transition:transform .18s,box-shadow .18s,opacity .18s}.button-large{min-height:58px;font-size:1rem}.button:hover:not(:disabled){transform:translateY(-2px)}.button:disabled{cursor:not-allowed;opacity:.45}.button-primary{background:linear-gradient(135deg, var(--gold), #f7a800);color:#281506;box-shadow:0 12px 28px #f7b50047}.button-secondary{color:#08243f;background:linear-gradient(135deg,#8ee7ff,#86b8ff)}.button-voice{background:linear-gradient(135deg, var(--violet-soft), var(--violet));color:#fff8ff;box-shadow:0 10px 24px #8c62ff47}.button-ghost{color:var(--text);background:#ffffff17}.button-danger{color:#3d0711;background:linear-gradient(135deg,#ff9e9e,#ff6f83);box-shadow:0 10px 24px #ff6f833d}.clue-stack{display:grid}.clue-card{background:linear-gradient(135deg,#0e2d50e6,#17123af5);border-radius:24px;min-height:128px;padding:18px 20px;position:relative;overflow:hidden}.clue-card:after{content:"";background:radial-gradient(circle,#7de4ff33,#0000 68%);border-radius:999px;width:170px;height:170px;position:absolute;inset:auto -10% -70% auto}.clue-card-waiting{background:linear-gradient(135deg,#2a1b53d1,#100b21f5)}.clue-body{color:var(--clue-glow);text-shadow:0 0 10px #7de4ff24;margin:8px 0 0;font-size:1.06rem;font-weight:800;line-height:1.7}.countdown-panel{background:linear-gradient(135deg,#2c1c58e0,#110c22f5);border-radius:24px;grid-template-columns:76px 1fr;align-items:center;gap:14px;padding:12px 16px;display:grid;box-shadow:0 0 18px #7de4ff1a}.hourglass{justify-self:center;width:70px;height:84px;position:relative}.hourglass-frame:before,.hourglass-frame:after{content:"";border:3px solid #f4cf72cc;border-radius:50%/30%;width:56px;height:28px;position:absolute;left:50%;transform:translate(-50%);box-shadow:0 0 12px #f4cf722e}.hourglass-frame:before{top:4px}.hourglass-frame:after{bottom:4px}.hourglass:before,.hourglass:after{content:"";background:linear-gradient(#f4cf72e6,#f4cf7240);width:4px;height:20px;position:absolute;left:50%;transform:translate(-50%)}.hourglass:before{top:20px}.hourglass:after{bottom:20px}.hourglass-top-sand,.hourglass-bottom-sand{border-left:14px solid #0000;border-right:14px solid #0000;width:0;height:0;position:absolute;left:50%;transform:translate(-50%)}.hourglass-top-sand{border-top:0;border-bottom:22px solid #f4cf72c7;animation:3s linear infinite sand-top;top:18px}.hourglass-stream{background:linear-gradient(#f4cf72f2,#f4cf7233);border-radius:999px;width:3px;height:14px;animation:1s linear infinite sand-stream;position:absolute;top:38px;left:50%;transform:translate(-50%)}.hourglass-bottom-sand{border-top:10px solid #f4cf72e6;border-bottom:0;animation:3s linear infinite sand-bottom;bottom:18px}.hourglass-number{color:var(--gold);text-shadow:0 0 10px #f4cf723d;place-items:center;font-family:Cinzel,serif;font-size:1.45rem;display:grid;position:absolute;inset:0}.countdown-copy{gap:4px;display:grid}#countdownText{color:#90ffd4;font-size:.98rem;font-weight:700}.feedback-panel,.history-box,.answer-banner{border-radius:20px;padding:16px}.answer-banner{background:linear-gradient(135deg,#f4cf722e,#8c62ff33);gap:8px;display:grid;box-shadow:0 0 24px #f4cf7229}.answer-banner strong{color:var(--gold);font-size:clamp(1.3rem,2vw,1.8rem)}.result-text{font-size:1.02rem;font-weight:800}.voice-text{color:var(--muted);margin-top:8px}.portrait-frame{background:radial-gradient(circle at top,#ffffff24,#0000 30%),linear-gradient(#1d1034e6,#060510fa);border-radius:26px;place-items:center;min-height:340px;display:grid;position:relative;overflow:hidden}#characterImage,.portrait-placeholder{width:100%;height:100%}#characterImage{object-fit:cover}.portrait-placeholder{text-align:center;place-items:center;padding:24px;display:grid}.portrait-placeholder span{color:var(--gold);text-shadow:0 0 22px #f4cf7266;font-family:Cinzel,serif;font-size:5rem}#historyList{gap:10px;margin-top:12px;padding:0;list-style:none;display:grid}#historyList li{color:var(--muted);background:#ffffff0d;border-radius:14px;padding:10px 12px}.success{color:var(--success)}.error{color:var(--danger)}@keyframes twinkle{0%{opacity:.82;transform:translateY(0)scale(1)}50%{opacity:1;transform:translateY(-4px)scale(1.02)}to{opacity:.82;transform:translateY(0)scale(1)}}@keyframes drift{0%,to{transform:translate(0,0)scale(1)}50%{transform:translate(18px,-12px)scale(1.05)}}@keyframes sand-top{0%{opacity:1;transform:translate(-50%)scaleY(1)}to{opacity:.6;transform:translate(-50%)scaleY(.45)}}@keyframes sand-bottom{0%{opacity:.7;transform:translate(-50%)scale(.55)}to{opacity:1;transform:translate(-50%)scale(1)}}@keyframes sand-stream{0%,to{opacity:.45}50%{opacity:1}}@media (width<=980px){.magic-wand-left{top:16%;left:0;transform:scale(.82)rotate(-18deg)}.magic-wand-right{top:10%;right:0;transform:scale(.82)rotate(20deg)}.magic-broom-left{bottom:14%;left:-6%;transform:scale(.82)rotate(-12deg)}.magic-broom-right{bottom:9%;right:-6%;transform:scale(.82)rotate(12deg)scaleX(-1)}.app-shell{grid-template-columns:1fr;min-height:auto}.reveal-panel{grid-template-rows:auto auto auto auto}.player-panel{grid-template-columns:1fr}}@media (width<=640px){.magic-wand-right,.magic-broom-right{display:none}.magic-wand-left{opacity:.14;top:14%;left:-8%;transform:scale(.62)rotate(-16deg)}.magic-broom-left{opacity:.12;bottom:10%;left:-14%;transform:scale(.62)rotate(-10deg)}.app-shell{width:min(100% - 18px,100%);padding:10px 0 18px}.hero-panel,.reveal-panel{border-radius:22px;padding:16px}.status-grid{grid-template-columns:1fr}.controls-row,.guess-row,.action-row,.countdown-panel,.player-entry{flex-direction:column;grid-template-columns:1fr}.countdown-panel{text-align:center;justify-items:center}.button{width:100%}.portrait-frame{min-height:280px}}