:root{color:#f6edd5;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--gold:#f8c962;--gold-bright:#ffde86;--jade:#4ce0af;--panel:#060f0bb8;--panel-border:#f8c96240;--shadow:0 28px 70px #0000008c;background:radial-gradient(circle at top,#ffc25a24,#0000 30%),linear-gradient(#02130f 0%,#04100d 28%,#081a16 100%);font-family:Trebuchet MS,Segoe UI,sans-serif;font-weight:400;line-height:1.5}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}body{min-height:100vh;overflow:hidden}button{font:inherit}.app-shell{place-items:center;min-height:100vh;padding:16px;display:grid;position:relative}.backdrop-grid{pointer-events:none;background-color:#0000;background-image:linear-gradient(#4ce0af0d 1px,#0000 1px),linear-gradient(90deg,#4ce0af0d 1px,#0000 1px);background-position:0 0,0 0;background-repeat:repeat,repeat;background-size:34px 34px;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box;position:fixed;inset:0;-webkit-mask-image:linear-gradient(#00000080,#0000);mask-image:linear-gradient(#00000080,#0000)}.frame-shell{aspect-ratio:9/16;width:min(100%,1520px);max-height:calc(100vh - 32px);box-shadow:var(--shadow);background:radial-gradient(circle at top,#ffe79f14,#0000 26%),linear-gradient(#0a1411e6,#070c0abd);border:1px solid #ffde8629;border-radius:32px;position:relative;overflow:hidden}.game-canvas,.game-canvas canvas{width:100%;height:100%;position:absolute;inset:0}.cinematic-vignette,.screen-flash{pointer-events:none;position:absolute;inset:0}.cinematic-vignette{background:radial-gradient(circle,#0000 36%,#00000061 100%),linear-gradient(#0000006b,#0000 22% 78%,#00000080)}.screen-flash{background:radial-gradient(circle,#ffeabaf2,#ffab2f59,#0000 62%);transition:opacity .18s ease-out}.hud-layer{pointer-events:none;flex-direction:column;justify-content:space-between;padding:18px;display:flex;position:absolute;inset:0}.hud-top,.status-ribbon,.floating-pause,.hero-card,.result-card{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:var(--panel);border:1px solid var(--panel-border);box-shadow:0 16px 34px #00000057}.hud-top{border-radius:18px;justify-content:space-between;align-items:flex-start;gap:12px;padding:14px 16px;display:flex}.brand-kicker{text-transform:uppercase;letter-spacing:.24em;color:#ffe19bcc;font-size:.75rem}.brand-title{letter-spacing:.08em;color:var(--gold-bright);text-shadow:0 0 24px #ffb12c47;font-size:clamp(1.35rem,3.8vw,2.3rem);font-weight:900;line-height:1}.audio-chip{color:var(--jade);background:#4ce0af1f;border-radius:999px;align-self:center;padding:8px 12px;font-size:.85rem}.result-stats span{color:#f4e7c7b8;letter-spacing:.08em;text-transform:uppercase;font-size:.8rem}.result-stats strong{font-size:clamp(1.1rem,2.8vw,1.6rem)}.overlay{place-items:center;padding:22px;display:grid;position:absolute;inset:0}.intro-overlay{background:linear-gradient(#030d0966,#030d09c2),radial-gradient(circle at 50% 15%,#ffc64c29,#0000 30%)}.hero-card,.result-card{border-radius:28px;width:min(100%,620px);padding:clamp(22px,4vw,34px)}.eyebrow{text-transform:uppercase;letter-spacing:.22em;color:#ffe19bb8;margin:0 0 10px;font-size:.76rem}.hero-card h1,.result-card h2{color:var(--gold-bright);margin:0 0 14px;font-size:clamp(2rem,7vw,4.5rem);line-height:.95}.hero-copy{color:#efe1b1;margin:0;font-size:clamp(1rem,2.8vw,1.18rem)}.feature-strip{flex-wrap:wrap;gap:10px;margin:20px 0;display:flex}.difficulty-panel{background:#ffffff0a;border:1px solid #ffde861f;border-radius:22px;margin-top:18px;padding:16px}.difficulty-head{color:#f4e0a0;justify-content:space-between;gap:12px;margin-bottom:14px;display:flex}.difficulty-head strong{font-size:1rem}.difficulty-head span{color:#f2ebdbb8;font-size:.92rem}.difficulty-control{gap:10px;margin-top:12px;display:grid}.difficulty-meta{color:#f2ebdbdb;justify-content:space-between;align-items:center;display:flex}.difficulty-meta strong{color:var(--gold-bright)}.difficulty-control input[type=range]{width:100%;accent-color:var(--gold)}.feature-strip span,.control-grid div,.result-stats div,.tutorial-banner{background:#ffffff0d;border:1px solid #ffde861a;border-radius:16px;padding:12px 14px}.cta-row{flex-wrap:wrap;gap:12px;margin-top:20px;display:flex}.primary-btn,.secondary-btn,.floating-pause{cursor:pointer;border:none;transition:transform .18s,box-shadow .18s,background .18s}.primary-btn:hover,.secondary-btn:hover,.floating-pause:hover{transform:translateY(-2px)}.primary-btn{color:#201103;background:linear-gradient(135deg, var(--gold), #ffeb97);border-radius:999px;min-width:168px;padding:14px 18px;font-weight:800;box-shadow:0 12px 26px #f8c96240}.secondary-btn{color:#eff5db;background:#ffffff0f;border-radius:999px;min-width:140px;padding:14px 18px}.control-grid,.result-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:18px;display:grid}.control-grid strong{color:var(--gold-bright);margin-bottom:6px;display:block}.control-grid span{color:#f2ebdbcc}.tutorial-banner{color:#f5df9c;margin-top:14px;font-weight:700;line-height:1.45}.countdown-overlay{background:radial-gradient(circle,#ffc9621f,#0000 35%)}.countdown-ring{background:radial-gradient(circle,#ffe2a72e,#ffa02214),#00000038;border:1px solid #ffde8659;border-radius:50%;place-items:center;width:180px;height:180px;display:grid;box-shadow:0 0 80px #ffad332e}.countdown-ring span{font-size:4.8rem;font-weight:900;line-height:1}.countdown-ring small{color:#f8ecccc7;letter-spacing:.14em;text-transform:uppercase;margin-top:-24px}.result-stats{margin-top:22px}.result-stats strong{margin-top:8px;display:block}.status-ribbon{color:#f1e7d1bd;border-radius:14px;justify-content:space-between;gap:12px;padding:11px 14px;font-size:.86rem;display:flex;position:absolute;bottom:18px;left:18px;right:18px}.floating-pause{z-index:2;color:var(--gold-bright);background:#020b07ad;border-radius:999px;padding:10px 14px;position:absolute;top:112px;right:18px}@media (width<=720px){.app-shell{padding:0}.frame-shell{aspect-ratio:auto;border-radius:0;width:100vw;height:100vh;max-height:100vh}.hud-layer{padding:12px}.status-ribbon{flex-wrap:wrap;bottom:12px;left:12px;right:12px}.difficulty-head,.difficulty-meta{flex-direction:column;align-items:flex-start}.floating-pause{top:auto;bottom:76px;right:12px}}