html,body,#root{min-height:100%;margin:0}:root{--ink:#e8eef5;--muted:#d2deeb9e;--glass:#121c2a47;--line:#e6eef82e;--lamp:#d9b88c;--accent:#8eb8d8;--safe-t:env(safe-area-inset-top,0px);--safe-b:env(safe-area-inset-bottom,0px);--font-brand:"ZCOOL XiaoWei", "Songti SC", "Noto Serif SC", serif;--font-body:"Noto Sans SC", "PingFang SC", "Hiragino Sans GB", sans-serif;color:var(--ink);font-family:var(--font-body);-webkit-font-smoothing:antialiased}*,:before,:after{box-sizing:border-box}html,body,#root{background:#070b12;width:100%;height:100%;margin:0;overflow:hidden}button,input{font:inherit;color:inherit}button{cursor:pointer}.app{width:100%;height:100%;min-height:100dvh}.home{isolation:isolate;grid-template-rows:1fr auto;width:100%;height:100svh;display:grid;position:relative;overflow:hidden}.sky{z-index:0;background:radial-gradient(1200px 700px at 78% 8%, hsla(var(--hue), 55%, 42%, .28), transparent 55%), radial-gradient(900px 600px at 12% 70%, #28466459, transparent 50%), linear-gradient(180deg, #0a1422 0%, #0c1828 38%, #101820 100%);transition:background .8s;position:absolute;inset:0}.sky__glow{background:radial-gradient(at 50% 0,#d9b88c29,#0000 60%);height:45%;animation:7s ease-in-out infinite breathe;position:absolute;inset:auto -10% -20%}.sky__moon{background:radial-gradient(circle at 32% 32%,#f4ecd8,#c9b89a 72%);border-radius:50%;width:clamp(42px,9vw,64px);height:clamp(42px,9vw,64px);animation:9s ease-in-out infinite floaty;position:absolute;top:11%;right:14%;box-shadow:0 0 48px #d9b88c59}.sky__star{opacity:.55;background:#eef4fa;border-radius:50%;width:2px;height:2px;animation:3.8s ease-in-out infinite twinkle;position:absolute}.sky__star.s1{top:18%;left:16%}.sky__star.s2{width:3px;height:3px;animation-delay:.7s;top:26%;left:38%}.sky__star.s3{animation-delay:1.3s;top:14%;left:58%}.sky__star.s4{animation-delay:2s;top:34%;left:72%}.sky__rain{opacity:.55;background-image:repeating-linear-gradient(-18deg,#0000 0 14px,#c8dcf00b 14px 15px);animation:1.1s linear infinite rain;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#0000,#000 20% 80%,#0000);mask-image:linear-gradient(#0000,#000 20% 80%,#0000)}.home.is-playing .sky__rain{opacity:.85}.window{z-index:1;min-height:0;margin:calc(12px + var(--safe-t)) 14px 0;display:grid;position:relative}.window__frame{border:1px solid var(--line);pointer-events:none;z-index:4;border-radius:18px;position:absolute;inset:0;box-shadow:inset 0 0 0 1px #ffffff0a,0 24px 60px #00000059}.window__mullion-v,.window__mullion-h{background:#e6eef81a;position:absolute;box-shadow:0 0 0 1px #00000026}.window__mullion-v{width:1px;top:8%;bottom:14%;left:50%;transform:translate(-50%)}.window__mullion-h{height:1px;top:46%;left:6%;right:6%}.window__sill{background:linear-gradient(#d9b88c38,#7864461f);border-radius:0 0 14px 14px;height:10px;position:absolute;bottom:-2px;left:-1%;right:-1%}.window__glass{background:var(--glass);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);border-radius:18px;grid-template-rows:auto 1fr auto;gap:.6rem;height:100%;min-height:0;padding:clamp(1rem,3.5vw,1.6rem);display:grid;position:relative;overflow:hidden}.dm-stage{z-index:3;pointer-events:none;height:58%;position:absolute;top:0;left:0;right:0;overflow:hidden}.hero{z-index:5;padding-top:.2rem;position:relative}.hero__top{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.hero__brand{font-family:var(--font-brand);letter-spacing:.08em;text-shadow:0 10px 40px #00000059;margin:0;font-size:clamp(2.4rem,10vw,4rem);line-height:1.1}.hero__hint{color:var(--muted);letter-spacing:.12em;margin:.45rem 0 0;font-size:.9rem}.hero .dm-form{z-index:6;margin-top:.85rem;position:relative}.now{z-index:2;padding-bottom:.2rem;animation:.55s both rise;position:relative}.now__no{color:var(--lamp);letter-spacing:.18em;font-variant-numeric:tabular-nums;margin:0;font-size:.78rem}.now__title{font-family:var(--font-brand);letter-spacing:.04em;margin:.45rem 0 0;font-size:clamp(1.55rem,5vw,2.1rem);font-weight:400}.now__line{max-width:22rem;color:var(--muted);margin:.45rem 0 0;font-size:.92rem;line-height:1.65}.dock{z-index:20;padding:14px 18px calc(16px + var(--safe-b));pointer-events:auto;background:linear-gradient(#0000,#050a10b8 28%);gap:12px;display:grid;position:relative}.scrub{grid-template-columns:auto 1fr auto;align-items:center;gap:10px;display:grid}.dm-toggle{border:1px solid var(--line);color:var(--muted);letter-spacing:.08em;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#080e1673;border-radius:999px;flex-shrink:0;padding:.45rem .8rem;font-size:.75rem}.dm-toggle.is-on{color:var(--ink);background:#8eb8d82e;border-color:#8eb8d873}.dm-form{grid-template-columns:1fr auto;gap:8px;display:grid}.dm-form input{border:1px solid var(--line);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#080e168c;border-radius:999px;outline:none;padding:.75rem 1rem;font-size:.9rem}.dm-form input::placeholder{color:#d2deeb66}.dm-form input:focus{border-color:#8eb8d880}.dm-form button{color:#e8f4fc;letter-spacing:.06em;background:#8eb8d847;border:none;border-radius:999px;padding:0 1.1rem;font-weight:600}.scrub__track input[type=range]{appearance:none;background:linear-gradient(90deg, var(--lamp) 0 var(--progress), #ffffff29 var(--progress) 100%);border-radius:999px;outline:none;width:100%;height:2px}.scrub__track input[type=range]::-webkit-slider-thumb{appearance:none;background:#f2e6d4;border-radius:50%;width:12px;height:12px;box-shadow:0 0 0 4px #d9b88c2e}.scrub__time{color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap;font-size:.72rem}.ctrl{z-index:21;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;width:100%;max-width:320px;margin:0 auto;display:grid;position:relative}.ctrl__skip{color:#e8eef5d1;-webkit-tap-highlight-color:transparent;touch-action:manipulation;background:0 0;border:none;place-items:center;height:52px;transition:color .2s,transform .2s;display:grid}.ctrl__skip:hover{color:#fff}.ctrl__skip:active{transform:scale(.94)}.ctrl__play{color:#1a140c;-webkit-tap-highlight-color:transparent;touch-action:manipulation;background:linear-gradient(160deg,#efe0c8,#d4b58a);border:none;border-radius:50%;justify-self:center;place-items:center;width:72px;height:72px;transition:transform .2s;display:grid;box-shadow:0 12px 36px #00000059,inset 0 0 0 1px #ffffff1f}.ctrl__play:hover{transform:scale(1.04)}.ctrl__play:active{transform:scale(.97)}.dm{pointer-events:none;position:absolute;inset:0;overflow:hidden}.dm__item{white-space:nowrap;letter-spacing:.04em;color:#f0f6fceb;text-shadow:0 0 2px #000000bf,1px 0 1px #0000008c,-1px 0 1px #0000008c,0 1px 1px #0000008c;will-change:transform;font-size:.95rem;font-weight:500;animation-name:fly;animation-timing-function:linear;animation-fill-mode:forwards;position:absolute;left:100%}@keyframes fly{0%{transform:translate(0)}to{transform:translate(calc(-100% - 100vw))}}@keyframes breathe{0%,to{opacity:.65}50%{opacity:1}}@keyframes floaty{0%,to{transform:translateY(0)}50%{transform:translateY(8px)}}@keyframes twinkle{0%,to{opacity:.25}50%{opacity:.95}}@keyframes rain{0%{background-position:0 0}to{background-position:0 28px}}@keyframes rise{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media (width>=900px){.window{width:min(720px,100% - 48px);margin-left:auto;margin-right:auto}}