:root{color-scheme:dark;--ink: #e8e6df;--dim: #8d8b84;--gold: #ffd27a;--panel: rgba(8, 10, 20, .55);--serif: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;font-family:var(--serif)}*{box-sizing:border-box}html,body{margin:0;height:100%;background:#05060c;color:var(--ink);overflow:hidden}#stage{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block}.tip{position:fixed;z-index:10;max-width:300px;padding:10px 12px;border-radius:8px;background:#0c0e1af0;border:1px solid rgba(255,255,255,.12);box-shadow:0 8px 30px #00000080;font-size:12.5px;line-height:1.45;color:var(--ink);pointer-events:none}.tip b{display:block;font-size:13px;margin-bottom:4px;letter-spacing:.02em}.tip .formula{display:block;margin-top:6px;font-family:ui-monospace,Menlo,monospace;font-size:11px;color:var(--dim)}.tip .now{display:block;margin-top:4px;font-variant-numeric:tabular-nums}.control{position:fixed;left:50%;bottom:22px;transform:translate(-50%);z-index:4;width:min(720px,calc(100vw - 240px));display:grid;grid-template-columns:auto minmax(220px,1fr) auto;align-items:center;gap:0 20px;grid-template-areas:"poleL slider poleR"}.control:before{content:"";position:absolute;top:-34px;right:-14vw;bottom:-30px;left:-14vw;z-index:-1;pointer-events:none;background:radial-gradient(64% 150% at 50% 92%,#04050bb3,#04050b5c 48%,#04050b00 80%)}#bars{position:fixed;left:26px;bottom:20px;z-index:4;display:block;width:216px;height:auto;cursor:help;opacity:.92}.pole.left{grid-area:poleL}.pole.right{grid-area:poleR}.slider-wrap{grid-area:slider}.pole{display:flex;flex-direction:column;gap:3px;font-size:14px;line-height:1.1;letter-spacing:.03em}.pole.left{text-align:right;align-items:flex-end}.pole small{font-size:10px;font-style:italic;line-height:1.3;color:var(--dim);letter-spacing:.015em;max-width:17ch}.pole.right{text-align:left;align-items:flex-start}.slider-wrap{position:relative}.marks{position:absolute;left:0;right:0;top:13px;height:0;pointer-events:none}.mark{position:absolute;top:0;width:3px;height:3px;margin:-1.5px 0 0 -1.5px;border-radius:50%;background:#e8e6df4d;transition:background .6s ease,box-shadow .6s ease,transform .6s ease}.mark.on{background:var(--gold);box-shadow:0 0 9px #ffd27ad9;transform:scale(1.5)}.notch{position:absolute;top:13px;width:2px;height:14px;margin-left:-1px;transform:translateY(-50%);background:#ff7a90d9;border-radius:1px;pointer-events:none;box-shadow:0 0 6px #ff7a9099;transition:height .15s,box-shadow .15s}.notch.hit{height:22px;box-shadow:0 0 14px #ff7a90e6}.stepper{display:flex;justify-content:center;align-items:center;gap:12px;margin-top:5px;font-size:10.5px;color:var(--dim);letter-spacing:.14em;text-transform:uppercase}.stepper button{width:24px;height:21px;border-radius:999px;border:1px solid rgba(255,255,255,.1);background:#ffffff09;color:var(--dim);font-size:14px;line-height:1;cursor:pointer;transition:background .2s ease,color .2s ease,border-color .2s ease}.stepper button:hover{background:#ffd27a24;border-color:#ffd27a73;color:var(--gold)}.stepper span{min-width:136px;text-align:center;font-variant-numeric:tabular-nums}.next{position:absolute;left:50%;top:0;transform:translate(-50%,5px);display:flex;align-items:baseline;justify-content:center;gap:.55em;margin:0;padding:3px 10px 4px;background:none;border:0;color:var(--gold);font:inherit;font-size:12.5px;letter-spacing:.22em;text-transform:uppercase;cursor:pointer;position:relative;opacity:0;transform:translateY(5px);pointer-events:none;transition:opacity 1.6s cubic-bezier(.16,.72,.26,1),transform 1.6s cubic-bezier(.16,.72,.26,1)}.next.on{opacity:1;transform:translate(-50%);pointer-events:auto;animation:next-breathe 3.2s ease-in-out infinite}.next-arrow{font-family:Georgia,serif;letter-spacing:0;transition:transform .5s ease}.next:hover .next-arrow{transform:translate(4px)}.next:after{content:"";position:absolute;left:10px;right:10px;bottom:1px;height:1px;background:linear-gradient(90deg,#ffd27a00,#ffd27ab3 30%,#ffd27ab3 70%,#ffd27a00);transform:scaleX(0);transition:transform 1.8s cubic-bezier(.16,.72,.26,1) .4s}.next.on:after{transform:scaleX(1)}@keyframes next-breathe{50%{text-shadow:0 0 14px rgba(255,210,122,.55)}}@media(prefers-reduced-motion:reduce){.next.on{animation:none}}#h{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:26px;background:transparent;cursor:pointer;display:block}#h::-webkit-slider-runnable-track{height:3px;border-radius:2px;background:linear-gradient(90deg,#ffd27a,#d9cfa9 35%,#9fb4ff 50%,#6b6f7c 70%,#2c2e38)}#h::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;margin-top:-7.5px;border-radius:50%;background:#f5f2e9;border:2px solid #05060c;box-shadow:0 0 0 2px #ffffff40,0 0 18px #ffffff59}#h::-moz-range-track{height:3px;border-radius:2px;background:linear-gradient(90deg,#ffd27a,#9fb4ff 50%,#2c2e38)}#h::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#f5f2e9;border:2px solid #05060c}#listen{position:fixed;right:26px;bottom:24px;z-index:4;width:34px;height:34px;border-radius:50%;border:1px solid rgba(255,255,255,.15);background:#ffffff0f;color:var(--ink);font-size:15px;cursor:pointer;line-height:1;transition:background .2s ease,border-color .2s ease,color .2s ease}#listen.on{background:#ffd27a38;border-color:#ffd27a99;color:var(--gold)}#listen.muted{opacity:.45;text-decoration:line-through}#listen.loading{animation:listen-pulse .9s ease-in-out infinite}@keyframes listen-pulse{50%{opacity:.35}}.tune{position:fixed;right:22px;top:20px;width:250px;padding:8px 12px;border-radius:10px;font-size:12px;background:var(--panel);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.06);color:var(--dim)}.tune summary{cursor:pointer;letter-spacing:.1em;text-transform:uppercase;font-size:10.5px;display:flex;align-items:baseline;justify-content:space-between;gap:10px}.tune summary::-webkit-details-marker{display:none}.fps{font-size:10px;letter-spacing:.06em;text-transform:none;color:#8d8b84bf;font-variant-numeric:tabular-nums;font-family:ui-monospace,Menlo,monospace;white-space:nowrap}.tune label{display:grid;grid-template-columns:1fr 80px;align-items:center;gap:8px;margin:6px 0}.tune input{width:100%;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);color:var(--ink);border-radius:4px;padding:2px 6px;font:inherit;font-size:12px}.tune .hint{margin:6px 0 2px;font-style:italic}.tune h4{margin:8px 0 2px;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);font-weight:500}.tune input[type=range]{width:100%;height:18px;padding:0;background:transparent;border:none;accent-color:rgb(255,122,144)}.tune input[type=checkbox]{width:auto;justify-self:end;accent-color:rgb(255,122,144)}@media(max-width:900px){.control{width:calc(100vw - 124px);grid-template-columns:1fr;grid-template-areas:"slider"}.pole{display:none}#bars{left:50%;transform:translate(-50%);bottom:80px}#listen{bottom:22px;right:18px}.tune{display:none}}.intro{position:fixed;top:0;right:0;bottom:0;left:0;z-index:20;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;background:#04050adb;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);text-align:center;padding:24px;transition:opacity 1.2s ease;overflow:hidden}.intro.gone{opacity:0;pointer-events:none}.intro-title{position:relative;width:100vw;display:flex;align-items:center;justify-content:center}.intro h1{margin:0;font-size:clamp(28px,6vw,62px);font-weight:500;letter-spacing:.03em;line-height:1.06}#introcloud{position:absolute;left:0;width:100%;top:-70%;height:240%;display:block;pointer-events:none}.intro p{margin:0 0 12px;font-size:15px;color:var(--dim);font-style:italic}#start{padding:16px 40px;border-radius:999px;border:1px solid rgba(255,210,122,.7);background:#ffd27a29;color:var(--gold);font:inherit;font-size:19px;letter-spacing:.06em;cursor:pointer;box-shadow:0 0 28px #ffd27a59;animation:start-breathe 2.4s ease-in-out infinite}#start:hover{background:#ffd27a4d;box-shadow:0 0 40px #ffd27a8c}@keyframes start-breathe{50%{box-shadow:0 0 46px #ffd27a99;transform:scale(1.03)}}.intro small{font-size:12px;color:var(--dim);letter-spacing:.04em}.verses{position:fixed;z-index:5;left:50%;top:0;transform:translate(-50%);width:min(46rem,86vw);height:0;pointer-events:none}.verse{position:absolute;left:0;right:0;top:0;margin:0;text-align:center;text-wrap:balance;font-size:clamp(17px,1.75vw,26px);line-height:1.46;letter-spacing:.004em;color:var(--ink)}.verse .w{display:inline-block;opacity:0;filter:blur(11px);transform:translateY(.42em) scale(1.06);text-shadow:0 0 22px rgba(3,4,9,.95),0 0 52px rgba(3,4,9,.8);transition:opacity .9s ease,filter .9s ease,transform .9s ease;transition-delay:0s}.verse.on .w{opacity:var(--o, 1);filter:blur(0);transform:none;transition:opacity 2.1s cubic-bezier(.16,.72,.26,1),filter 2.1s cubic-bezier(.16,.72,.26,1),transform 2.1s cubic-bezier(.16,.72,.26,1);transition-delay:calc(var(--i, 0) * 1s)}.verse.on{animation:verse-breathe 12s ease-in-out infinite}@keyframes verse-breathe{0%,to{filter:drop-shadow(0 0 18px rgba(255,210,122,.14))}50%{filter:drop-shadow(0 0 30px rgba(255,210,122,.28))}}.verse em{font-style:italic;color:var(--gold)}.verse[data-tone=clear]{color:#eef1f7}.verse[data-tone=mid]{color:#f6e7c3;font-size:clamp(20px,2.2vw,31px);line-height:1.34;letter-spacing:.012em}.verse[data-tone=dark]{color:#a9abb8}@media(max-width:900px){.verses{width:90vw}}@media(max-height:720px){.verse{font-size:clamp(15px,1.5vw,21px)}.verse[data-tone=mid]{font-size:clamp(17px,1.8vw,25px)}}@media(prefers-reduced-motion:reduce){.verse .w{filter:none;transform:none;transition:opacity .6s ease;transition-delay:0s}.verse.on .w{transition:opacity 1s ease;transition-delay:0s}.verse.on{animation:none}}