@import "https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@300;400;500&display=swap";:root{color:#f2ead6;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;--cream:#f2ead6;--gold:#e4c57d;--muted:#c6c9c7;--line:#ebd9af38;--serif:"Noto Serif SC", "Songti SC", "STSong", "SimSun", serif;--gutter:clamp(24px, 4vw, 72px);background:#051127;font-family:Microsoft YaHei,PingFang SC,sans-serif}*{box-sizing:border-box}html,body,#root{width:100%;height:100%;margin:0}body{min-width:320px}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:disabled{opacity:.35;cursor:default}button:focus-visible,a:focus-visible{outline:2px solid var(--gold);outline-offset:5px}button:active:not(:disabled){transform:scale(.96)}button svg{flex:none;width:20px;height:20px}.experience{isolation:isolate;background:#051127;height:100svh;min-height:480px;position:relative;overflow:hidden}.art-backdrop,.painting-canvas,.vignette{width:100%;height:100%;position:absolute;inset:0}.art-backdrop{z-index:-4;background:#051127 url(/assets/starry-night-background-Djoexsml.png) 50%/cover no-repeat}.painting-canvas{z-index:-3;opacity:0;display:block}.vignette{z-index:-2;pointer-events:none;background:linear-gradient(#020b1e70,#0000 23% 50%,#020b1e3d 72%,#020916d9),linear-gradient(90deg,#020a1850,#0000 48%);transition:opacity 1.2s}.topbar{z-index:3;padding:30px var(--gutter);justify-content:space-between;align-items:center;gap:24px;display:flex;position:absolute;top:0;left:0;right:0}.brand{color:var(--cream);align-items:center;gap:13px;text-decoration:none;display:flex}.brand>svg{width:31px;height:31px;color:var(--gold)}.brand>span{font-family:var(--serif);letter-spacing:.2em;font-size:21px;line-height:1.4}.brand small{letter-spacing:.21em;color:#dfd9c9c4;margin-top:6px;font-family:Georgia,serif;font-size:8px;display:block}.header-note{font-family:var(--serif);letter-spacing:.3em;color:#dfdfd1b5;font-size:12px;position:absolute;left:50%;transform:translate(-50%)}.top-actions{align-items:center;gap:19px;display:flex}.quiet-button,.icon-button{letter-spacing:.08em;background:0 0;border:0;justify-content:center;align-items:center;gap:10px;min-height:44px;padding:0 4px;font-size:12px;transition:color .2s,opacity .2s,transform .2s;display:inline-flex}.quiet-button:hover,.icon-button:hover{color:var(--gold)}.icon-button{width:44px}.control-divider{background:var(--line);width:1px;height:16px}.sound-waves{align-items:center;gap:3px;height:15px;margin-left:5px;display:inline-flex}.sound-waves i{background:var(--gold);width:1px;height:3px;display:block}.sound-waves.is-on i{height:11px;animation:1.2s ease-in-out infinite alternate sound-wave}.sound-waves.is-on i:nth-child(2){animation-delay:-.8s}.sound-waves.is-on i:nth-child(3){animation-delay:-.4s}.hero{left:var(--gutter);pointer-events:none;position:absolute;bottom:clamp(148px,19vh,225px)}.hero-copy{pointer-events:auto}.eyebrow{letter-spacing:.25em;color:var(--gold);align-items:center;gap:12px;margin:0 0 20px;font-family:Georgia,serif;font-size:10px;display:flex}.eyebrow>span{background:var(--gold);width:24px;height:1px}h1{font-family:var(--serif);letter-spacing:.09em;text-shadow:0 3px 35px #02091840;margin:0 0 18px -5px;font-size:clamp(60px,6.5vw,106px);font-weight:400;line-height:1.3}.title-dot{color:var(--gold);margin-left:-.1em}.poem{font-family:var(--serif);letter-spacing:.23em;color:#e3e3d7;margin:0;font-size:clamp(15px,1.3vw,20px);font-weight:300}.enter-button{min-height:48px;font-family:var(--serif);letter-spacing:.15em;background:0 0;border:0;border-bottom:1px solid #e4c57d8a;align-items:center;gap:36px;margin-top:35px;padding:0 0 10px;font-size:14px;transition:color .25s,border-color .25s;display:flex}.enter-arrow{border:1px solid var(--line);border-radius:50%;place-items:center;width:30px;height:30px;transition:transform .3s,background .3s,color .3s;display:grid}.enter-arrow svg{width:16px;height:16px}.enter-button:hover{color:var(--gold);border-color:var(--gold)}.enter-button:hover .enter-arrow{background:var(--gold);color:#0c203b;transform:translate(6px)}.art-caption{right:var(--gutter);text-align:right;color:#e9e6d7d9;flex-direction:column;align-items:flex-end;gap:18px;display:flex;position:absolute;bottom:155px}.caption-rule{background:var(--gold);width:24px;height:1px}.art-caption>span:not(.caption-rule){font-family:var(--serif);letter-spacing:.16em;font-size:14px;font-weight:300;line-height:1.9}.art-caption small{letter-spacing:.17em;color:#dad9c9aa;font-family:Georgia,serif;font-size:9px}.bottom-rail{left:var(--gutter);right:var(--gutter);bottom:max(19px, env(safe-area-inset-bottom));border-top:1px solid var(--line);justify-content:space-between;align-items:center;gap:24px;min-height:62px;padding-top:12px;display:flex;position:absolute}.art-credit{white-space:nowrap;color:#ced0c9c7;align-items:center;gap:27px;font-size:10px;display:flex}.edition{color:var(--gold);letter-spacing:.05em;font-family:Georgia,serif;font-size:11px}.edition>span{color:#cacac060;padding:0 6px}.artist{letter-spacing:.12em;margin-left:6px;font-family:Georgia,serif;font-size:9px}.gesture-hint{font-family:var(--serif);letter-spacing:.12em;color:#d8dcd3c4;align-items:center;gap:9px;font-size:11px;display:flex}.live-dot{background:var(--gold);border-radius:50%;flex:none;width:4px;height:4px;box-shadow:0 0 9px #ecc97880}.is-playing .live-dot{animation:3s ease-in-out infinite breathe}.is-paused .live-dot{box-shadow:none;background:#a9b3b2}.playback-controls{align-items:center;gap:18px;display:flex}.play-button{padding:0 3px;font-size:11px}.play-button svg{width:17px;height:17px}.speed-control{align-items:center;gap:3px;display:flex}.speed-control>svg{color:#d5d7c3a3;width:17px;height:17px;margin-right:7px}.speed-control button{color:#d5d7c3b8;min-width:44px;min-height:44px;font-family:var(--serif);background:0 0;border:0;padding:0 8px;font-size:11px;transition:color .2s;position:relative}.speed-control button:hover,.speed-control button.is-selected{color:var(--gold)}.speed-control button.is-selected:after{content:"";background:var(--gold);width:13px;height:1px;position:absolute;bottom:6px;left:50%;transform:translate(-50%)}.topbar,.hero,.art-caption,.art-credit,.gesture-hint{transition:opacity .7s,transform .9s cubic-bezier(.2,.7,.2,1),visibility .7s}.is-immersed .topbar,.is-immersed .hero,.is-immersed .art-caption{opacity:0;pointer-events:none;transform:translateY(10px)}.is-immersed .vignette{opacity:.15}.is-immersed .art-credit,.is-immersed .gesture-hint{opacity:0;visibility:hidden}.is-immersed .bottom-rail{border-color:#0000}.is-immersed .playback-controls{opacity:.28;transition:opacity .3s}.is-immersed .playback-controls:hover,.is-immersed .playback-controls:focus-within{opacity:1}.return-button{z-index:5;left:var(--gutter);opacity:0;pointer-events:none;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#03112668;border-radius:3px;padding:0 12px;transition:opacity .6s;position:absolute;top:30px}.return-button kbd{color:#e4e2d0a1;border:1px solid var(--line);margin-left:8px;padding:3px 4px;font:9px Georgia,serif}.is-immersed .return-button{opacity:.5;pointer-events:auto}.is-immersed .return-button:hover,.is-immersed .return-button:focus-visible{opacity:1}.loading-curtain{z-index:20;color:var(--gold);background:#051127;flex-direction:column;justify-content:center;align-items:center;gap:20px;transition:opacity 1s,visibility 1s;display:flex;position:absolute;inset:0}.loading-curtain>svg{width:36px;height:36px;animation:2s ease-in-out infinite breathe}.loading-curtain>span{font:12px var(--serif);letter-spacing:.3em}.is-ready .loading-curtain{opacity:0;visibility:hidden;pointer-events:none}.is-ready .hero-copy{animation:1.4s .2s both arrive}.is-ready .topbar{animation:1.2s .1s both arrive}.is-ready.is-immersed .topbar{animation:none}.notice{z-index:10;border:1px solid var(--line);opacity:0;visibility:hidden;background:#071529ee;max-width:calc(100% - 40px);margin:0;padding:12px 18px;font-size:12px;line-height:1.7;position:absolute;bottom:95px;left:50%;transform:translate(-50%)}.notice.is-visible{opacity:1;visibility:visible}.sr-only{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@keyframes arrive{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes breathe{0%,to{opacity:.4}50%{opacity:1}}@keyframes sound-wave{0%{transform:scaleY(.3)}to{transform:scaleY(1)}}@media (width<=1100px){.gesture-hint,.header-note{display:none}.art-credit{gap:20px}}@media (width<=650px){.experience{min-height:520px}.art-backdrop{background-position:82%}.topbar{padding:24px var(--gutter);gap:16px}.brand{gap:9px}.brand>svg{width:25px;height:25px}.brand>span{font-size:18px}.brand small{margin-top:4px;font-size:7px}.top-actions{gap:8px}.sound-button{width:44px;padding:0}.sound-button>span,.top-actions .control-divider{display:none}.vignette{background:linear-gradient(#0209166e,#0000 26% 40%,#02091666 66%,#020916e8)}.hero{bottom:172px}.eyebrow{letter-spacing:.2em;margin-bottom:16px;font-size:8px}h1{margin-bottom:15px;margin-left:-3px;font-size:clamp(57px,14.6vw,84px)}.poem{letter-spacing:.15em;font-size:14px}.enter-button{gap:30px;margin-top:27px;font-size:13px}.art-caption{display:none}.bottom-rail{bottom:max(17px, env(safe-area-inset-bottom));flex-wrap:wrap;row-gap:0;padding-top:5px}.playback-controls{order:-1;justify-content:space-between;gap:12px;width:100%}.playback-controls>.control-divider{margin-left:auto;margin-right:5px}.speed-control{gap:4px}.speed-control button{min-width:44px}.art-credit{justify-content:space-between;width:100%;margin-top:9px;font-size:9px}.artist{letter-spacing:.09em;font-size:8px}.edition{font-size:9px}.return-button{top:24px}.notice{width:max-content;bottom:122px}}@media (height<=600px) and (width>=651px){.experience{min-height:360px}.topbar{padding-top:20px;padding-bottom:20px}.hero{bottom:100px}.eyebrow{margin-bottom:8px}h1{margin-bottom:10px;font-size:58px}.poem{font-size:14px}.enter-button{margin-top:16px}.art-caption{bottom:116px}.bottom-rail{min-height:54px;padding-top:6px;bottom:12px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}