:root{--paper:#151517;--ink:#f1eee8;--quiet:#8c8c92;--line:#ffffff1f;--accent:#efe4d2;color:var(--ink);background:var(--paper);font-family:Inter,ui-sans-serif,system-ui,sans-serif}*{box-sizing:border-box;margin:0}html,body{height:100%}body{background:radial-gradient(120% 90% at 50% 35%, #1d1d20, var(--paper) 70%);overflow:hidden}#stage{width:100%;height:100%;display:block;position:fixed;inset:0}header{padding:clamp(16px,3vw,32px);position:fixed;top:0;left:0}h1{letter-spacing:-.02em;font-size:1.05rem;font-weight:650}header p{color:var(--quiet);margin-top:4px;font-size:.8rem}#note:not(:empty):before{content:"· "}main{gap:14px;width:min(560px,100vw - 32px);display:grid;position:fixed;bottom:clamp(16px,4vh,44px);left:50%;translate:-50%}#caption{text-align:center;letter-spacing:.14em;text-transform:uppercase;min-height:1.2em;color:color-mix(in oklab, var(--ink) 24%, transparent);overflow-wrap:anywhere;font-size:clamp(1.6rem,5vw,2.6rem);font-weight:650}#caption span{transition:color .12s,translate .12s;display:inline-block}#caption .now{color:var(--accent);translate:0 -.08em}form{border:1px solid var(--line);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#1c1c1fc7;border-radius:999px;align-items:center;gap:4px;padding:6px;display:flex;box-shadow:0 14px 40px -20px #000}form:focus-within{border-color:color-mix(in oklab, var(--accent) 55%, transparent)}input[type=text]{min-width:0;font:inherit;color:inherit;background:0 0;border:0;outline:0;flex:1;padding:8px 6px;font-size:1rem}input[type=text]::placeholder{color:var(--quiet)}select{font:inherit;color:var(--quiet);cursor:pointer;background:0 0;border:0;border-radius:999px;padding:8px 10px;font-size:.85rem}#toggle{background:var(--ink);cursor:pointer;border:0;border-radius:50%;flex:none;place-items:center;width:38px;height:38px;display:grid}#toggle:before{content:"";background:var(--paper);clip-path:polygon(15% 0,100% 50%,15% 100%);width:12px;height:12px}#toggle[data-state=playing]:before{clip-path:polygon(8% 0,38% 0,38% 100%,62% 100%,62% 0,92% 0,92% 100%,8% 100%)}:is(#toggle,select,input[type=range]):focus-visible{outline:2px solid var(--accent);outline-offset:2px}input[type=range]{appearance:none;cursor:pointer;background:0 0;width:calc(100% - 28px);height:14px;margin:0 14px}input[type=range]::-webkit-slider-runnable-track{background:var(--line);height:2px}input[type=range]::-moz-range-track{background:var(--line);height:2px}input[type=range]::-webkit-slider-thumb{appearance:none;background:var(--ink);border-radius:50%;width:12px;height:12px;margin-top:-5px}input[type=range]::-moz-range-thumb{background:var(--ink);border:0;border-radius:50%;width:12px;height:12px}