:root{color-scheme:dark;--void: #04050a;--ink: #e9edff;--ink-dim: rgba(233, 237, 255, .58);--ink-faint: rgba(233, 237, 255, .3);--glass: rgba(10, 12, 24, .46);--edge: rgba(196, 208, 255, .15);--edge-hi: rgba(196, 208, 255, .34);--focus: #9fe7ff;--display: "Cormorant Garamond", "Cormorant", Georgia, "Times New Roman", serif;--mono: "DM Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace}[hidden]{display:none!important}html{height:100%;overflow:hidden;background:var(--void)}body{height:100%;margin:0;overflow:hidden;background:var(--void);color:var(--ink);font-family:var(--mono);font-weight:300;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}#stage{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block;touch-action:none;cursor:crosshair}.ui{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;display:flex;flex-direction:column;justify-content:space-between;padding:calc(env(safe-area-inset-top,0px) + 20px) calc(env(safe-area-inset-right,0px) + 20px) calc(env(safe-area-inset-bottom,0px) + 18px) calc(env(safe-area-inset-left,0px) + 22px);transition:opacity .6s ease}.ui.off{opacity:0}.ui.off .dock{pointer-events:none}.mark{transition:opacity 1.8s ease}.mark.dim{opacity:.3}.mark h1{margin:0;line-height:1;font-family:var(--display);font-style:italic;font-weight:300;font-size:clamp(30px,4.2vw,48px);letter-spacing:.005em;color:var(--ink);text-shadow:0 0 28px rgba(140,180,255,.35)}.bottom{display:flex;align-items:flex-end;justify-content:space-between;gap:14px 20px;flex-wrap:wrap}.hint{margin:0;max-width:52ch;font-size:11.5px;line-height:1.8;letter-spacing:.05em;color:var(--ink-dim);transition:opacity 1.4s ease}.hint.gone{opacity:0}.hint b{font-weight:400;color:var(--ink)}.hint kbd{font:inherit;font-size:10px;color:var(--ink);padding:1px 5px;border:1px solid var(--edge);border-radius:4px}.hint .touch{display:none}@media (hover: none) and (pointer: coarse){.hint .desk{display:none}.hint .touch{display:inline}}.dock{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;pointer-events:auto}.dock button{display:inline-flex;align-items:center;gap:9px;font:inherit;font-size:10.5px;font-weight:400;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-dim);background:var(--glass);border:1px solid var(--edge);border-radius:999px;padding:9px 14px;cursor:pointer;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:color .2s,border-color .2s}.dock button:hover{color:var(--ink);border-color:var(--edge-hi)}.dock button:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.swatch{width:28px;height:7px;border-radius:4px;flex:none}.rec{width:7px;height:7px;border-radius:50%;flex:none;background:#ff5468;opacity:.75}#btnRecord.on{color:var(--ink);border-color:#ff546873}#btnRecord.on .rec{opacity:1;box-shadow:0 0 8px #ff5468;animation:pulse 1.2s ease-in-out infinite}@keyframes pulse{50%{opacity:.35}}.clip{position:fixed;top:0;right:0;bottom:0;left:0;display:grid;place-content:center;justify-items:center;gap:16px;padding:calc(env(safe-area-inset-top,0px) + 20px) 16px calc(env(safe-area-inset-bottom,0px) + 20px);background:#04050ab8}.clip-open .ui{opacity:0}.clip-open .ui .dock{pointer-events:none}.clip video{display:block;max-width:86vw;max-height:calc(100vh - 140px);max-height:calc(100dvh - 140px);border-radius:14px;border:1px solid var(--edge);background:#000;box-shadow:0 0 60px #78a0ff29;cursor:pointer}.clip .dock{justify-content:center}.key{color:var(--ink-faint);letter-spacing:.08em;text-transform:none}.fallback{position:fixed;top:0;right:0;bottom:0;left:0;display:grid;place-content:center;gap:10px;padding-inline:24px;text-align:center;background:var(--void)}.fallback h2{margin:0;font-family:var(--display);font-style:italic;font-weight:300;font-size:34px;color:var(--ink)}.fallback p{margin:0;font-size:12.5px;color:var(--ink-dim)}@media (max-width: 520px){.hint{font-size:11px}.dock button{padding:8px 12px;letter-spacing:.12em}}
