: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;--mobile-control-size:28px;--mobile-control-gap:4px;--mobile-level-width:108px}*{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}.mobile-icon{flex:none;place-items:center;width:20px;height:20px;display:inline-grid}.mobile-icon svg{width:20px;height:20px;display:block}.mobile-page-header{display:none}.mobile-page-footer{margin-top:12px}.mobile-modal-backdrop{z-index:30;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#04030cb8;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.mobile-modal{background:#110b25f5;border:1px solid #ffffff14;border-radius:22px;gap:12px;width:min(100%,360px);padding:20px;display:grid;box-shadow:0 24px 60px #0000006b}.mobile-modal-copy{color:var(--muted);margin:0;line-height:1.5}.mobile-modal-entry{gap:10px;display:grid}.mobile-nav-button{width:100%;min-height:46px;color:var(--text);font:inherit;cursor:pointer;background:#ffffff0d;border:1px solid #ffffff14;border-radius:16px;justify-content:center;align-items:center;gap:10px;font-weight:800;display:inline-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-icon{justify-content:center;gap:8px}.button-icon-only{padding-inline:0}.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}.mobile-hidden-panel{display:none}}@media (width<=640px){body:before{opacity:.1}body:after{opacity:.45}.orb{opacity:.14;filter:blur(36px)}.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{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-radius:20px;padding:14px}.status-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.controls-row,.guess-row,.action-row{flex-direction:column}.controls-row-main{grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;gap:8px;display:grid}.controls-row-main .level-picker{grid-column:1/-1}.guess-row,.action-row,.player-entry{grid-template-columns:1fr;gap:8px;display:grid}.countdown-panel{text-align:center;grid-template-columns:1fr;justify-items:center;gap:10px;padding:10px 12px}.button{border-radius:14px;width:100%;min-height:52px;padding:12px 14px}.portrait-frame{min-height:220px}.app-shell-mobile{gap:12px}.app-shell-mobile .brand-row{align-items:center;gap:12px}.app-shell-mobile .eyebrow,.app-shell-mobile .reveal-label,.app-shell-mobile .history-title,.app-shell-mobile .status-label,.app-shell-mobile .level-picker span,.app-shell-mobile .clue-index,.app-shell-mobile .answer-label,.app-shell-mobile .countdown-label{letter-spacing:.12em}.app-shell-mobile .crest{border-radius:14px;width:52px;height:52px;font-size:1rem}.app-shell-mobile h1{font-size:1.45rem}.app-shell-mobile h2{font-size:1.15rem}.app-shell-mobile .player-panel{border-radius:16px;gap:10px;padding:12px}.app-shell-mobile .player-entry{gap:8px}.app-shell-mobile .status-card{text-align:center;border-radius:14px;gap:4px;padding:10px 8px}.app-shell-mobile .status-card strong{font-size:1.1rem}.app-shell-mobile .status-label{letter-spacing:.12em;font-size:.58rem}.app-shell-mobile .controls-row-main{gap:8px}.app-shell-mobile .mobile-page-header{background:#ffffff0d;border:1px solid #ffffff0f;border-radius:16px;justify-content:space-between;align-items:center;gap:12px;padding:12px 14px;display:flex}.app-shell-mobile .mobile-page-header h2{font-size:1.05rem}.app-shell-mobile .mobile-page-header .eyebrow{margin-bottom:4px}.app-shell-mobile .mobile-page-header .mobile-icon{width:22px;height:22px;color:var(--gold)}.app-shell-mobile .mobile-page-header .mobile-icon svg{width:22px;height:22px}.app-shell-mobile .level-picker{border-radius:14px;min-width:0;padding:10px 12px}.app-shell-mobile select,.app-shell-mobile input{border-radius:12px;padding:13px 14px;font-size:.98rem}.app-shell-mobile .clue-card{border-radius:18px;min-height:104px;padding:14px 16px}.app-shell-mobile .clue-body{font-size:.96rem;line-height:1.5}.app-shell-mobile .hourglass{width:58px;height:72px}.app-shell-mobile .hourglass-number{font-size:1.15rem}.app-shell-mobile #countdownText{font-size:.9rem}.app-shell-mobile .feedback-panel,.app-shell-mobile .answer-banner{border-radius:16px;padding:12px}.app-shell-mobile .button-icon{font-size:.92rem}.app-shell-mobile .button-icon-only{width:var(--mobile-control-size);min-width:var(--mobile-control-size);min-height:var(--mobile-control-size);flex:0 0 var(--mobile-control-size);border-radius:8px;padding:0}.app-shell-mobile .button-icon-only>span:not(.mobile-icon){display:none}.app-shell-mobile .controls-row-main{grid-template-columns:var(--mobile-level-width) repeat(3, var(--mobile-control-size));gap:var(--mobile-control-gap);justify-content:space-between;align-items:stretch;width:100%;max-width:100%}.app-shell-mobile .controls-row-main .level-picker{min-width:var(--mobile-level-width);width:var(--mobile-level-width);border-radius:8px;grid-column:auto;justify-content:center;height:30px;margin:0 auto 0 0;padding:3px 6px}.app-shell-mobile .controls-row-main .level-picker span{color:#f3ecff;margin-bottom:1px;font-size:.54rem;line-height:1}.app-shell-mobile .controls-row-main .level-picker select{padding:4px 18px 4px 8px;font-size:.8rem}.app-shell-mobile .controls-row-main .button-primary{color:#f7fff8;background:linear-gradient(135deg,#44c96b,#178c45);border:1px solid #ffffff2e;min-width:0;box-shadow:0 6px 16px #178c453d}.app-shell-mobile .controls-row-main .button-secondary{color:#17324f;border:1px solid #ffffff29;box-shadow:0 6px 16px #5c99d633}.app-shell-mobile .controls-row-main .button-danger{color:#5b1724;border:1px solid #ffffff29;box-shadow:0 6px 16px #b454682e}.app-shell-mobile .button-icon-only .mobile-icon,.app-shell-mobile .button-icon-only .mobile-icon svg{width:16px;height:16px}.app-shell-mobile .action-row{grid-template-columns:var(--mobile-control-size) minmax(0, 1fr) minmax(0, 1.1fr);align-items:stretch;gap:6px}.app-shell-mobile .action-row .button-ghost,.app-shell-mobile .action-row .button-mobile-guess{border-radius:10px;min-height:32px;padding:6px 8px;font-size:.84rem}.app-shell-mobile .action-row .button-ghost span{white-space:nowrap}.app-shell-mobile .action-row .button-ghost{color:#ffd7dd;background:linear-gradient(135deg,#ffb6c147,#e87b922e);border:1px solid #ffb6c147;box-shadow:0 6px 16px #b35d7424}.app-shell-mobile .mobile-nav-button{border-radius:14px;gap:8px;min-height:44px;font-size:.92rem}.app-shell-mobile .portrait-frame{border-radius:18px}.app-shell-mobile .reveal-copy{gap:6px;display:grid}.app-shell-mobile .result-text,.app-shell-mobile .voice-text{font-size:.92rem}.app-shell-mobile .reveal-panel-mobile{gap:12px}.app-shell-mobile .reveal-copy h2{font-size:1.2rem}.app-shell-mobile #characterFact{font-size:.94rem;line-height:1.45}.app-shell-mobile .mobile-hidden-panel{display:none}}