*{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;height:100%;overflow:hidden;background:#070b18;font-family:Segoe UI,system-ui,-apple-system,sans-serif;color:#fff}#app{position:relative;width:100vw;height:100vh;display:flex;align-items:center;justify-content:center;overflow:hidden;background:radial-gradient(ellipse at 25% 15%,#243a6e 0%,transparent 55%),radial-gradient(ellipse at 80% 85%,#4a1a5c 0%,transparent 50%),radial-gradient(ellipse at 50% 50%,#12182e,#070b18 70%)}#stage{position:relative;width:min(100vw - 24px,calc((100vh - 24px) * 16 / 9));height:min(100vh - 24px,calc((100vw - 24px)*.5625));border-radius:12px;overflow:hidden;box-shadow:0 0 0 3px #ffd166,0 0 0 6px #f7258566,0 24px 70px #000000a6,0 0 90px #ffd16629;background:#111}#game{display:block;width:100%;height:100%;image-rendering:auto;background:#111;cursor:pointer;touch-action:none}#ui{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding-bottom:max(env(safe-area-inset-bottom,8px),10px)}#caption{pointer-events:none;max-width:min(720px,88vw);background:#080c1ceb;border:2px solid #ffd166;border-radius:12px;padding:8px 18px;font-size:clamp(13px,1.8vw,16px);line-height:1.25;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-shadow:0 6px 18px #00000073;margin-bottom:6px;transition:opacity .2s,transform .2s;letter-spacing:.01em}#caption.hidden{opacity:0;transform:translateY(14px) scale(.96)}@keyframes caption-pop{0%{transform:translateY(10px) scale(.94);opacity:0}60%{transform:translateY(-2px) scale(1.02);opacity:1}to{transform:translateY(0) scale(1);opacity:1}}#caption:not(.hidden){animation:caption-pop .35s ease-out}#hud{position:absolute;top:10px;left:12px;right:12px;width:auto;transform:none;display:flex;justify-content:space-between;align-items:center;font-weight:800;font-size:clamp(13px,1.8vw,18px);text-shadow:0 2px 6px #000;opacity:.95;gap:12px;flex-wrap:wrap;pointer-events:none}#app.title-screen #hud,#app.title-screen #caption{display:none}#hud .hud-btn,#hud span{pointer-events:auto}#hud span{background:#0a0e1e8c;border:1px solid rgba(255,209,102,.35);border-radius:999px;padding:6px 14px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}#overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#0508149e;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);pointer-events:auto}#overlay.hidden{display:none}#overlay.overlay-clear{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;align-items:flex-end;padding-bottom:22px;pointer-events:none}#overlay.overlay-clear .title-cta{pointer-events:auto;text-align:center}#overlay.overlay-clear .title-cta p{margin-top:10px;opacity:.9;font-size:13px;text-shadow:0 2px 8px #000,0 0 12px #000}.btn{pointer-events:auto;background:linear-gradient(180deg,#ffe9a8,#ffd166 45%,#f0a202);color:#1a1200;border:none;border-radius:999px;padding:16px 42px;font-size:22px;font-weight:800;cursor:pointer;letter-spacing:.02em;box-shadow:0 6px #b36b00,0 14px 28px #0006,inset 0 1px #ffffff8c;transition:transform .08s,box-shadow .08s,filter .15s;text-transform:none}.btn:hover{transform:translateY(-3px);filter:brightness(1.05);box-shadow:0 9px #b36b00,0 18px 32px #0006,inset 0 1px #ffffff8c}.btn:active{transform:translateY(4px);box-shadow:0 2px #b36b00,0 6px 12px #00000059,inset 0 1px #fff6}.quiz-panel{background:linear-gradient(160deg,#121834f7,#0c1024f5);border:3px solid #7ec8ff;border-radius:22px;padding:28px 34px;max-width:min(640px,92vw);text-align:center;box-shadow:0 24px 60px #0000008c,0 0 40px #7ec8ff26,inset 0 1px #ffffff0f}.quiz-panel h2{color:#7ec8ff;margin-bottom:8px;font-size:1.45rem;text-shadow:0 0 20px rgba(126,200,255,.35)}.quiz-panel .q{font-size:1.15rem;margin:16px 0 20px;line-height:1.45;color:#e8eefc}.quiz-options{display:flex;flex-direction:column;gap:10px}.quiz-options button{pointer-events:auto;background:linear-gradient(180deg,#243456,#1a2744);color:#fff;border:2px solid #4a6a9a;border-radius:14px;padding:13px 18px;font-size:1rem;cursor:pointer;text-align:left;transition:background .15s,border-color .15s,transform .08s,box-shadow .15s;box-shadow:0 4px #00000040}.quiz-options button:hover{background:linear-gradient(180deg,#2f4570,#243456);border-color:#ffd166;transform:scale(1.02) translateY(-1px);box-shadow:0 6px #0003,0 0 16px #ffd16626}.quiz-options button:active{transform:scale(.99) translateY(2px);box-shadow:0 2px #00000040}.quiz-face{width:128px;height:128px;object-fit:contain;margin:0 auto 10px;border-radius:50%;background:radial-gradient(circle at 40% 35%,#222,#000 70%);box-shadow:0 0 0 3px #7ec8ff,0 0 24px #7ec8ff59}#caption{border-width:3px;background:linear-gradient(180deg,#080c1cf5,#060a18f2);color:#fffef5}.quiz-options button:focus-visible,.btn:focus-visible{outline:3px solid #ffd166;outline-offset:3px}@media(prefers-reduced-motion:reduce){.btn,.quiz-options button,#caption{transition:none}}#overlay p{animation:hintPulse 2.4s ease-in-out infinite}@keyframes hintPulse{0%,to{opacity:.7}50%{opacity:1}}@media(prefers-reduced-motion:reduce){#overlay p{animation:none}}@media(pointer:coarse){.btn{padding:18px 48px;font-size:24px}#caption{font-size:clamp(15px,3.5vw,20px);padding:14px 18px}}.quiz-options button.opt-correct{border-color:#06d6a0;background:linear-gradient(180deg,#1b4332,#2d6a4f);box-shadow:0 0 16px #06d6a059}.quiz-options button.opt-wrong{border-color:#ff6b6b;background:linear-gradient(180deg,#5c1a1a,#3d1010);animation:wrongShake .35s ease}@keyframes wrongShake{0%,to{transform:translate(0)}25%{transform:translate(-6px)}75%{transform:translate(6px)}}.btn-pulse{box-shadow:0 0 #ffd1668c;animation:startPulse 1.6s ease-in-out infinite}@keyframes startPulse{0%,to{transform:translateY(0) scale(1);box-shadow:0 6px #b36b00,0 14px 28px #0006,0 0 #ffd16673,0 0 24px #f7258526}50%{transform:translateY(-5px) scale(1.045);box-shadow:0 11px #b36b00,0 20px 40px #0000007a,0 0 0 12px #ffd16600,0 0 36px #f7258547}}@media(prefers-reduced-motion:reduce){.btn-pulse{box-shadow:0 0 #ffd1668c;animation:none}}#score{color:#ffd166;letter-spacing:.03em;font-weight:800;text-shadow:0 0 14px rgba(255,209,102,.55),0 0 28px rgba(255,209,102,.2),0 2px 6px #000}#level-name{color:#c5d4ff}.btn{animation:btnGlow 2.2s ease-in-out infinite}@keyframes btnGlow{0%,to{filter:brightness(1)}50%{filter:brightness(1.08)}}@media(prefers-reduced-motion:reduce){.btn{animation:none}}.hud-btn{pointer-events:auto;background:#0a0e1ea6;border:1px solid rgba(255,209,102,.45);border-radius:999px;padding:6px 12px;font-size:16px;cursor:pointer;line-height:1;box-shadow:0 2px 8px #00000059;transition:transform .08s,filter .15s,background .15s}.hud-btn:hover{filter:brightness(1.15);transform:scale(1.06)}.hud-btn:active{transform:scale(.96)}.hud-btn.muted{background:#501428b3;border-color:#ff6b6b8c;opacity:.85}@media(pointer:coarse){.hud-btn{padding:10px 16px;font-size:20px;min-width:44px;min-height:44px}}.quiz-panel .quiz-hint{margin-top:12px;font-size:12px;opacity:.65;letter-spacing:.02em}@media(pointer:coarse){.quiz-options button{padding:16px 18px;font-size:1.05rem;min-height:48px}#hud{top:max(env(safe-area-inset-top,8px),8px)}}#share-line{user-select:all;-webkit-user-select:all}#caption:not(.hidden){animation:captionPop .28s ease-out}@keyframes captionPop{0%{transform:translateY(18px) scale(.96);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}.quiz-panel h2{text-shadow:0 0 18px rgba(126,200,255,.45)}.quiz-options button:focus-visible{outline:2px solid #ffd166;outline-offset:2px}.btn{letter-spacing:.04em}#caption{text-shadow:0 1px 0 rgba(0,0,0,.45)}#mute-btn{transition:transform .15s ease,box-shadow .15s ease}#mute-btn:hover{transform:scale(1.08);box-shadow:0 0 0 3px #ffd16659}@media(prefers-reduced-motion:reduce){#mute-btn{transition:none}}#level-name{letter-spacing:.02em}.hud-btn:hover{filter:brightness(1.12)}@keyframes captionGoldPulse{0%,to{border-color:#ffd166;box-shadow:0 8px 28px #00000080,inset 0 1px #ffffff14}50%{border-color:#ffe9a8;box-shadow:0 8px 28px #00000080,0 0 18px #ffd16633,inset 0 1px #ffffff14}}#caption:not(.hidden){animation:caption-pop .28s ease-out}@media(prefers-reduced-motion:reduce){#caption:not(.hidden){animation:none}}#caption:not(.hidden){border-color:#ffd166a6;box-shadow:0 0 18px #ffd16647}.quiz-face{animation:jqFaceBob 2.4s ease-in-out infinite}@keyframes jqFaceBob{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@media(prefers-reduced-motion:reduce){.quiz-face{animation:none}}