:root{--bg-0: #09080d;--bg-1: #150e16;--bg-2: #1c1118;--wine-glow: rgba(108, 56, 73, .35);--midnight-glow: rgba(32, 57, 92, .24);--card-bg: rgba(19, 18, 22, .44);--card-border: rgba(238, 238, 244, .16);--card-text: rgba(240, 237, 232, .92);--muted-text: rgba(207, 203, 196, .72);--accent: rgba(238, 214, 184, .8)}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden;background:#07070b;color:var(--card-text);font-family:Iowan Old Style,Palatino Linotype,Times New Roman,serif}#app{position:relative}.bg-system{--city-blur-amount: 10px;--city-opacity: .44;--city-scale: 1.08;--city-drift-x: 0px;--city-drift-y: 0px;--haze-strength: .1;--vignette-strength: .46;--warm-glow-strength: .2;--center-lift-strength: .18;--lyric-support-strength: .13;--hud-clean-strength: .46;position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}.bg-system>div{position:absolute;inset:-10%;pointer-events:none}.bg-velvet{inset:-14%;background:radial-gradient(120% 92% at 14% 18%,rgba(36,50,86,.52),transparent 62%),radial-gradient(104% 90% at 84% 14%,rgba(98,45,66,.4),transparent 64%),radial-gradient(95% 120% at 30% 90%,rgba(69,38,62,.32),transparent 66%),radial-gradient(110% 120% at 78% 76%,rgba(52,42,76,.22),transparent 70%),linear-gradient(140deg,#07070c,#13101c 40%,#1a121c 68%,#120d13);animation:velvet-breathe 32s ease-in-out infinite alternate}.bg-haze{opacity:var(--haze-strength);mix-blend-mode:soft-light;background:repeating-radial-gradient(circle at 14% 20%,rgba(255,255,255,.12) 0 1px,transparent 1px 4px),repeating-radial-gradient(circle at 74% 66%,rgba(255,255,255,.09) 0 1px,transparent 1px 5px),linear-gradient(125deg,#80708029,#262c3e0f);filter:blur(.4px);animation:haze-drift 72s linear infinite alternate}.bg-city,.bg-city-halo{background-image:url(/generated/background/city-atmosphere.webp);background-size:cover;background-position:center;transform:translate3d(var(--city-drift-x),var(--city-drift-y),0) scale(var(--city-scale));transform-origin:center}.bg-city{opacity:var(--city-opacity);mix-blend-mode:normal;filter:blur(var(--city-blur-amount)) saturate(1.03) brightness(.9) contrast(1.04)}.bg-city-halo{opacity:calc(var(--warm-glow-strength) * .72);mix-blend-mode:soft-light;filter:blur(calc(var(--city-blur-amount) * 2.2)) hue-rotate(-16deg) saturate(1.1) brightness(.52)}.bg-center-lift{background:radial-gradient(circle at 50% 52%,#d5c4ba3d,#1c181e00 52%);opacity:var(--center-lift-strength)}.bg-right-warm{background:radial-gradient(74% 86% at 92% 54%,#bc806242,#36242000 58%),radial-gradient(52% 74% at 82% 24%,#9a5c561f,#18121500 72%);opacity:var(--warm-glow-strength)}.bg-lyric-support{background:radial-gradient(70% 85% at 18% 86%,#765c6a33,#110f1400 58%);opacity:var(--lyric-support-strength)}.bg-hud-clean{background:radial-gradient(46% 40% at 89% 11%,#0a0a0ead,#0a0a0e00 86%);opacity:var(--hud-clean-strength)}.bg-vignette{inset:0;background:radial-gradient(circle at center,#0000 56%,#030305bd),linear-gradient(180deg,#0000002e,#00000057);opacity:var(--vignette-strength)}@keyframes velvet-breathe{0%{transform:translate3d(-1.4%,-.8%,0) scale(1);opacity:.88}to{transform:translate3d(1.2%,.8%,0) scale(1.04);opacity:.97}}@keyframes haze-drift{0%{transform:translate3d(-1.2%,-.7%,0) scale(1.02)}to{transform:translate3d(1.1%,.8%,0) scale(1.05)}}#photo-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:2}.ambient-lyrics{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:6}.ambient-phrase,.ambient-keyline{position:absolute;color:#e6dfd470;text-shadow:0 8px 24px rgba(0,0,0,.35);white-space:pre-wrap;-webkit-user-select:none;user-select:none;transform:translateZ(0);will-change:transform,opacity;opacity:0}.ambient-phrase{font-family:STSong,Songti SC,"Noto Serif SC","Source Han Serif SC",serif;font-size:clamp(14px,1.22vw,24px);letter-spacing:.11em;line-height:1.62;filter:blur(.35px)}.ambient-phrase.tier-s{font-size:clamp(12px,1.02vw,19px);letter-spacing:.13em}.ambient-phrase.tier-m{font-size:clamp(15px,1.28vw,24px)}.ambient-phrase.tier-l{font-size:clamp(18px,1.62vw,30px);letter-spacing:.1em}.ambient-phrase.tier-xl{font-size:clamp(22px,2.02vw,38px);letter-spacing:.08em}.ambient-phrase.vertical{writing-mode:vertical-rl;letter-spacing:.1em;line-height:1.3}.ambient-keyline{font-family:STSong,Songti SC,"Noto Serif SC","Source Han Serif SC",serif;font-size:clamp(14px,1.26vw,22px);letter-spacing:.08em;line-height:1.45;max-width:min(42vw,460px);color:#ece4d5a8}.startup-overlay{position:absolute;inset:0;z-index:30;display:grid;place-items:center;background:radial-gradient(circle at center,#14121a73,#07060bc2);opacity:1;transition:opacity .52s ease,visibility .52s ease}.startup-overlay.hidden{opacity:0;visibility:hidden}.startup-panel{min-width:min(480px,86vw);padding:18px 22px;border-radius:16px;border:1px solid rgba(240,235,225,.2);background:linear-gradient(160deg,#201b23a6,#121017b8);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 18px 44px #00000052;display:inline-flex;align-items:center;justify-content:center;gap:12px}.startup-panel p{margin:0;font-size:14px;letter-spacing:.08em;color:#f4efe4eb}.startup-overlay.ready .startup-panel p{color:#ebdfc7eb}.startup-overlay.error .startup-panel p{color:#ebcfcbeb}.startup-spinner{width:16px;height:16px;border-radius:999px;border:2px solid rgba(232,226,214,.28);border-top-color:#eed8b7e0;animation:startup-spin .98s linear infinite}.startup-overlay.ready .startup-spinner,.startup-overlay.error .startup-spinner{animation:none;border-color:#eed8b7bd;background:#eed8b73d}@keyframes startup-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.music-unlock{position:absolute;z-index:28;left:50%;bottom:15vh;transform:translate(-50%);border:1px solid rgba(240,230,212,.32);border-radius:999px;padding:10px 18px;background:#181419b8;color:#f1eadef2;font-family:Iowan Old Style,Palatino Linotype,Times New Roman,serif;font-size:13px;letter-spacing:.08em;cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:0;pointer-events:none;transition:opacity .36s ease,transform .36s ease}.music-unlock.visible{opacity:1;pointer-events:auto}.music-unlock:hover{transform:translate(-50%) translateY(-1px)}.story-overlay{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at center,transparent 0%,rgba(7,6,9,.66) 100%);opacity:0;transition:opacity .68s ease}.story-overlay.active{opacity:1}.subtitle-layer{position:absolute;bottom:10vh;left:50%;transform:translate(-50%);max-width:min(76vw,1020px);text-align:center;letter-spacing:.11em;font-size:clamp(19px,2.08vw,36px);color:#f7e9d0f0;text-shadow:0 12px 34px rgba(0,0,0,.48);line-height:1.28;z-index:14;opacity:0;transition:opacity .52s ease;pointer-events:none}.subtitle-layer.visible{opacity:1}.subtitle-layer.typing:after{content:"";display:inline-block;width:1px;height:1.05em;margin-left:8px;vertical-align:-.08em;background:#f6dfb9c7;animation:narration-caret .86s steps(2,end) infinite}@keyframes narration-caret{0%,45%{opacity:1}50%,to{opacity:0}}.gesture-cursor{position:absolute;left:0;top:0;width:34px;height:34px;border-radius:50%;border:1.3px solid rgba(244,229,204,.88);background:radial-gradient(circle at center,#f5e9d633,#0000);box-shadow:0 0 0 1px #f6e9d038,0 0 16px #f2e2c440;transform:translate(-50%,-50%) scale(.74);transform-origin:center;opacity:0;pointer-events:none;z-index:16;transition:opacity .16s ease,transform .16s ease,border-color .16s ease}.gesture-cursor:after{content:"";position:absolute;left:50%;top:50%;width:7px;height:7px;border-radius:50%;background:#f8e8cbe6;transform:translate(-50%,-50%)}.gesture-cursor.active{opacity:.92;transform:translate(-50%,-50%) scale(1)}.gesture-cursor.locked{border-color:#ffedcefa;box-shadow:0 0 0 1px #faebcf6b,0 0 26px #f8e0b057;transform:translate(-50%,-50%) scale(1.15)}.gesture-card{position:absolute;top:20px;right:22px;width:min(320px,64vw);padding:14px 16px;border-radius:14px;border:1px solid var(--card-border);background:linear-gradient(145deg,rgba(28,24,29,.58),var(--card-bg));-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 18px 32px #0000003d;color:var(--card-text);opacity:.43;transition:opacity .52s ease,transform .52s ease,border-color .52s ease}.gesture-card.active{opacity:.9;transform:translateY(-1px);border-color:#eeeef44d}.gesture-card h3{margin:0 0 8px;font-size:13px;font-weight:500;letter-spacing:.08em;color:#f2e6d3e6}.gesture-card ul{list-style:none;margin:0;padding:0;display:grid;gap:6px;font-size:12px;color:var(--muted-text)}.gesture-card li{display:flex;justify-content:space-between;gap:10px}.gesture-card li span:first-child{color:#f3efe8d1}.gesture-video{position:absolute;width:1px;height:1px;left:-9999px;top:-9999px;opacity:0;pointer-events:none}@media(max-width:700px){.gesture-card{top:12px;right:12px;width:min(92vw,330px);padding:12px}.gesture-card ul{font-size:11px;gap:4px}}