*{box-sizing:border-box;margin:0;padding:0}:root{--font-display: "Inter", "Helvetica Neue", system-ui, -apple-system, sans-serif;--font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;--font-ui: "Inter", system-ui, -apple-system, sans-serif}html,body{width:100%;height:100%;background:#000;overflow:hidden;font-family:var(--font-ui);color:#cfeaff;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}button,a,input[type=range],.splash-play,.settings-toggle,#fullscreen-btn,.credits-replay{cursor:pointer}#app{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0}#app canvas{display:block;width:100%!important;height:100%!important}#splash{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;z-index:10;background:radial-gradient(ellipse at center,#000c1873,#000000b8);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:opacity .8s ease,visibility .8s ease;-webkit-user-select:none;user-select:none}#splash.hidden{opacity:0;visibility:hidden;pointer-events:none}.splash-stack{display:flex;flex-direction:column;align-items:center;gap:28px;padding:30px}.splash-title{font-family:var(--font-display);font-size:44px;font-weight:200;letter-spacing:.42em;color:#f0fbff;text-shadow:0 0 32px rgba(120,200,255,.35);padding-left:.42em;animation:splash-title-breath 6s ease-in-out infinite}@keyframes splash-title-breath{0%,to{text-shadow:0 0 28px rgba(120,200,255,.32)}50%{text-shadow:0 0 42px rgba(160,220,255,.55)}}.splash-subtitle{font-family:var(--font-display);font-size:11px;font-weight:300;letter-spacing:.4em;color:#b4dcf08c;text-transform:uppercase;padding-left:.4em}.splash-play{position:relative;display:inline-flex;align-items:center;justify-content:center;width:78px;height:78px;border-radius:50%;background:#ffffff0a;border:1px solid rgba(200,230,255,.3);color:#f0fbff;transition:background .22s ease,border-color .22s ease,transform .22s cubic-bezier(.2,.7,.2,1);margin:12px 0;padding:0}.splash-play:hover{background:#ffffff1a;border-color:#c8e6ff8c;transform:scale(1.05)}.splash-play svg{margin-left:4px;opacity:.92;transition:opacity .2s ease}.splash-play:hover svg{opacity:1}.splash-play.loading svg{display:none}.splash-play.loading:before{content:"";position:absolute;width:24px;height:24px;border-radius:50%;border:2px solid rgba(200,230,255,.15);border-top-color:#c8e6ffd9;animation:splash-spinner .8s linear infinite}@keyframes splash-spinner{to{transform:rotate(360deg)}}.splash-hint{font-family:var(--font-mono);font-size:10px;letter-spacing:.35em;color:#a0c8e673;text-transform:uppercase;padding-left:.35em}.splash-hint.error{color:#ff8c8cd9}#intro-title{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;pointer-events:none;-webkit-user-select:none;user-select:none;z-index:7;opacity:1;transition:opacity 1.2s cubic-bezier(.2,.6,.3,1)}#intro-title.dissolving{opacity:0}.intro-stack{display:flex;flex-direction:column;align-items:center;gap:14px}.intro-title-text{font-family:var(--font-display);font-size:48px;letter-spacing:.5em;font-weight:200;color:#f0fbff;text-shadow:0 0 32px rgba(120,220,255,.55);white-space:nowrap;padding-left:.5em}.intro-letter{display:inline-block;opacity:0;transform-origin:50% 50%;transform:translate3d(var(--ox, 0),var(--oy, 0),0) rotate(var(--rz, 0deg)) scale(.5);filter:blur(14px);will-change:transform,opacity,filter}#intro-title.playing .intro-letter{animation:intro-letter-in 1.1s cubic-bezier(.2,.7,.2,1) forwards}@keyframes intro-letter-in{0%{opacity:0;transform:translate3d(var(--ox, 0),var(--oy, 0),0) rotate(var(--rz, 0deg)) scale(.5);filter:blur(14px)}55%{opacity:1;transform:translateZ(0) rotate(0) scale(1.04);filter:blur(0)}to{opacity:1;transform:translateZ(0) rotate(0) scale(1);filter:blur(0)}}.intro-subtitle{font-family:var(--font-display);font-size:11px;letter-spacing:.4em;color:#b4dcf08c;font-weight:300;text-transform:uppercase;opacity:0;transform:translateY(4px);transition:opacity .8s ease,transform .8s ease;transition-delay:.85s}#intro-title.playing .intro-subtitle{opacity:1;transform:translateY(0)}.intro-divider{width:0;height:1px;background:linear-gradient(90deg,transparent,rgba(140,230,255,.5),transparent);margin-top:8px;transition:width 1.2s cubic-bezier(.4,0,.2,1);transition-delay:1.1s}#intro-title.playing .intro-divider{width:320px}.intro-meta{font-family:var(--font-mono);font-size:9px;letter-spacing:.45em;color:#78b4dc66;opacity:0;transform:translateY(4px);transition:opacity .7s ease,transform .7s ease;transition-delay:1.4s;text-transform:uppercase}#intro-title.playing .intro-meta{opacity:1;transform:translateY(0)}body.cinema-mode #fullscreen-btn,body.cinema-mode #settings,body.cinema-mode #debug-hud{opacity:0;pointer-events:none}#cinema-mode-hint{position:fixed;top:18px;left:50%;transform:translate(-50%);font-family:var(--font-mono);font-size:10px;letter-spacing:.35em;color:#b4dcf08c;pointer-events:none;-webkit-user-select:none;user-select:none;opacity:0;text-transform:uppercase;transition:opacity .4s ease;z-index:50}#cinema-mode-hint.visible{opacity:.7}#fullscreen-btn{position:fixed;top:18px;right:18px;width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;background:#00000026;border:1px solid rgba(200,230,255,.1);border-radius:6px;color:#dcf0ff73;z-index:40;transition:opacity .6s ease,color .2s ease,background .2s ease,border-color .2s ease;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}#fullscreen-btn svg{width:16px;height:16px}#fullscreen-btn:hover{color:#dcf0fff2;background:#00000040;border-color:#c8e6ff4d}body.idle #fullscreen-btn,body.idle #settings{opacity:0;pointer-events:none}#settings{position:fixed;top:18px;right:62px;z-index:40;display:flex;flex-direction:column;align-items:flex-end;gap:8px;transition:opacity .6s ease}.settings-toggle{width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;background:#00000026;border:1px solid rgba(200,230,255,.1);border-radius:6px;color:#dcf0ff73;transition:opacity .6s ease,color .2s ease,background .2s ease,border-color .2s ease;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}.settings-toggle:hover{color:#dcf0fff2;background:#00000040;border-color:#c8e6ff4d}.settings-toggle svg{width:16px;height:16px}.settings-panel{background:#000810c7;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(200,230,255,.1);border-radius:6px;padding:12px 14px;min-width:180px;display:flex;flex-direction:column;gap:8px}#settings.collapsed .settings-panel{display:none}.settings-title{font-family:var(--font-mono);font-size:9px;letter-spacing:.3em;color:#b4dcf073;text-transform:uppercase;padding-bottom:4px;border-bottom:1px solid rgba(200,230,255,.07)}.settings-row{display:flex;align-items:center;gap:10px;font-family:var(--font-mono);font-size:10px;color:#dcf0ffb3}.settings-label{flex-shrink:0;letter-spacing:.15em;width:60px;text-transform:uppercase}.settings-val{font-variant-numeric:tabular-nums;width:32px;text-align:right;color:#b4dcf08c}.settings-row input[type=range]{flex:1;-moz-appearance:none;appearance:none;-webkit-appearance:none;background:transparent;height:16px}.settings-row input[type=range]::-webkit-slider-runnable-track{height:2px;background:#78b4dc40;border-radius:1px}.settings-row input[type=range]::-moz-range-track{height:2px;background:#78b4dc40;border-radius:1px}.settings-row input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:10px;height:10px;border-radius:50%;background:#dcf0fff2;margin-top:-4px;border:none}.settings-row input[type=range]::-moz-range-thumb{width:10px;height:10px;border-radius:50%;background:#dcf0fff2;border:none}#debug-hud{position:fixed;bottom:14px;right:18px;font-family:var(--font-mono);font-size:10px;letter-spacing:.05em;color:#dcf0ffa6;background:#000810c7;border:1px solid rgba(200,230,255,.1);border-radius:6px;padding:8px 12px;z-index:40;pointer-events:none;-webkit-user-select:none;user-select:none;min-width:180px;transition:opacity .3s ease;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}#debug-hud.hidden{opacity:0;visibility:hidden}#debug-hud .row{display:flex;justify-content:space-between;gap:14px;line-height:1.4em}#debug-hud .row.fps-cyan span:last-child{color:#88e0ff}#debug-hud .row.fps-amber span:last-child{color:#ffc266}#debug-hud .row.fps-red span:last-child{color:#ff7a7a}#debug-hud .label{color:#a0c8e680;letter-spacing:.1em}#debug-hud .val{color:#dcf0ffd9;font-variant-numeric:tabular-nums}#cinematic-bars{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:5}#cinematic-bars .cb-bar{position:absolute;left:0;right:0;height:0;background:linear-gradient(var(--cb-grad-dir, 180deg),#000 0%,rgba(0,0,0,.92) 88%,rgba(0,0,0,0) 100%);transition:height 1.4s cubic-bezier(.4,0,.2,1)}#cinematic-bars .cb-bar-top{top:0;--cb-grad-dir: 180deg}#cinematic-bars .cb-bar-bottom{bottom:0;--cb-grad-dir: 0deg}#cinematic-bars.extended .cb-bar{height:9vh}#progress-bar{position:fixed;left:0;right:0;bottom:0;height:1px;background:#ffffff0a;z-index:3;pointer-events:none}#progress-bar .fill{height:100%;width:0%;background:linear-gradient(90deg,#78c8ff66,#b4e6ffa6);transition:width .2s linear}body.cinema-mode #progress-bar,body.idle #progress-bar{opacity:.4}#credits{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;z-index:9;background:radial-gradient(ellipse at center,#0004088c,#000000c7);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);opacity:0;visibility:hidden;transition:opacity 1.2s ease,visibility 1.2s ease;-webkit-user-select:none;user-select:none}#credits.hidden{opacity:0;visibility:hidden;pointer-events:none}#credits.visible{opacity:1;visibility:visible}.credits-stack{display:flex;flex-direction:column;align-items:center;gap:16px;padding:30px;max-width:420px}.credits-title{font-family:var(--font-display);font-size:28px;letter-spacing:.42em;font-weight:200;color:#f0fbff;text-shadow:0 0 28px rgba(120,220,255,.45);padding-left:.42em}.credits-epitaph{font-family:var(--font-display);font-size:12px;letter-spacing:.32em;font-weight:300;color:#b4dcf08c;text-transform:uppercase;margin-bottom:6px}.credits-divider{width:240px;height:1px;background:linear-gradient(90deg,transparent,rgba(160,220,255,.35),transparent);margin:6px 0 16px}.credits-line{display:flex;align-items:center;gap:14px;font-family:var(--font-mono);font-size:10px;letter-spacing:.15em}.credits-label{color:#a0c8e673;text-transform:uppercase;width:90px;text-align:right}.credits-value{color:#dcf0ffd9}.credits-link{color:#8cdcffd9;text-decoration:none;border-bottom:1px solid rgba(140,220,255,.3);transition:color .2s ease,border-color .2s ease}.credits-link:hover{color:#c8f0ff;border-color:#c8f0ffb3}.credits-replay{margin-top:18px;padding:9px 22px;background:#ffffff0a;border:1px solid rgba(200,230,255,.3);border-radius:4px;color:#dcf0ffeb;font-family:var(--font-mono);font-size:11px;letter-spacing:.3em;text-transform:uppercase;transition:background .2s ease,border-color .2s ease,color .2s ease}.credits-replay:hover{background:#ffffff1a;border-color:#c8e6ff8c;color:#fff}