:root{--ink: #f3ead9;--ink-dim: rgba(243, 234, 217, .55);--ink-faint: rgba(243, 234, 217, .28);--ember: #ffb45c;--ember-hot: #fff1d8;--cand: #cfe6ff;--bg: #04050b;--mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;--serif: "Cormorant Garamond", "Cormorant", Georgia, "Times New Roman", serif;--ease-out: cubic-bezier(.16, 1, .3, 1)}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:var(--bg);color:var(--ink);font-family:var(--mono);font-size:12px;letter-spacing:.02em;overflow:hidden;-webkit-font-smoothing:antialiased;cursor:crosshair}#sky{position:fixed;inset:0;width:100vw;height:100vh;display:block;touch-action:none}#labels{position:fixed;inset:0;pointer-events:none;z-index:2}.label{position:absolute;left:0;top:0;transform:translate3d(-9999px,-9999px,0);will-change:transform,opacity;opacity:0;transition:opacity .42s var(--ease-out);font-family:var(--serif);font-style:italic;font-weight:400;font-size:17px;color:var(--ink);text-shadow:0 0 10px rgba(255,240,210,.35),0 0 22px rgba(255,220,160,.15);white-space:nowrap}.label.on{opacity:1}.label.on.under{opacity:.12!important}.label .w{position:absolute;left:0;top:0;transform:translate(-50%,12px)}.label .ord{position:absolute;left:0;top:0;transform:translate(-50%,-30px);font-family:var(--mono);font-style:normal;font-size:10px;letter-spacing:.18em;color:var(--ember);opacity:0;transition:opacity .3s}.label[data-kind=candidate]{color:var(--cand);font-size:16px}.label[data-kind=candidate].on{opacity:.95}.label[data-kind=persistent]{font-size:15px}.label[data-kind=persistent].on{opacity:.42}.label[data-kind=hover]{font-size:18px}.label[data-kind=selected]{color:var(--ember-hot);font-size:21px;font-weight:500;text-shadow:0 0 14px rgba(255,180,92,.65),0 0 40px rgba(255,180,92,.3)}.label[data-kind=selected] .ord{opacity:.9}.label[data-kind=selected].ghost{color:var(--ember);font-weight:400;font-size:18px;text-shadow:0 0 10px rgba(255,180,92,.35)}.label[data-kind=selected].ghost.on{opacity:.85}#overlay{position:fixed;inset:0;pointer-events:none;z-index:3}#overlay>*{pointer-events:auto}#overlay .corner{position:absolute;opacity:0;transform:translateY(6px);transition:opacity 1.4s var(--ease-out),transform 1.4s var(--ease-out)}#overlay.ready .corner{opacity:1;transform:none}#overlay.ready #title{transition-delay:.2s}#overlay.ready #stats{transition-delay:.6s}#overlay.ready #status{transition-delay:1s}#overlay.ready #foot{transition-delay:1.3s}#title{left:32px;top:28px}#title h1{margin:0;font-family:var(--mono);font-weight:500;font-size:12px;letter-spacing:.32em;color:var(--ink)}#title h1 em{font-style:normal;color:var(--ink-faint)}#title p{margin:8px 0 0;font-family:var(--serif);font-style:italic;font-weight:300;font-size:22px;letter-spacing:.01em;color:var(--ink-dim)}#stats{right:32px;top:26px;text-align:right;display:flex;gap:34px}#stats .stat b{display:block;font-family:var(--serif);font-weight:300;font-size:38px;line-height:1;color:var(--ink);font-variant-numeric:tabular-nums;letter-spacing:-.01em}#stats .stat span{display:block;margin-top:6px;font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-faint)}#status{left:50%;bottom:46px;transform:translate(-50%,6px);display:flex;align-items:center;gap:14px;font-size:12px;letter-spacing:.26em;text-transform:uppercase;color:var(--ink-dim);white-space:nowrap}#overlay.ready #status{transform:translate(-50%)}#status .dot{width:6px;height:6px;border-radius:50%;background:var(--ink-faint);box-shadow:0 0 #f3ead900;animation:breathe 3.2s ease-in-out infinite}#status[data-kind=observing]{color:var(--cand)}#status[data-kind=observing] .dot{background:var(--cand);animation-duration:1.1s;box-shadow:0 0 12px var(--cand)}#status[data-kind=recorded]{color:var(--ember)}#status[data-kind=recorded] .dot{background:var(--ember);box-shadow:0 0 14px var(--ember);animation:none}#status[data-kind=error]{color:#ff8a7a}#status[data-kind=ghost]{color:var(--ember);opacity:.8}#status[data-kind=ghost] .dot{background:var(--ember);opacity:.6;animation:none}#status .text.swap{animation:swap .5s var(--ease-out)}@keyframes breathe{0%,to{opacity:.35}50%{opacity:1}}@keyframes swap{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}#caption{position:absolute;left:50%;bottom:112px;transform:translate(-50%);max-width:min(92vw,1100px);text-align:center;pointer-events:none;opacity:0;transition:opacity .9s var(--ease-out)}#caption.on{opacity:1}#caption .head{font-family:var(--mono);font-size:11px;letter-spacing:.42em;text-transform:uppercase;color:var(--ember);text-shadow:0 0 18px rgba(255,180,92,.5)}#caption .words{margin-top:18px;font-family:var(--serif);font-style:italic;font-weight:300;font-size:clamp(22px,3.4vw,40px);color:var(--ember-hot);text-shadow:0 0 24px rgba(255,220,170,.35);line-height:1.25}#caption .words span{display:inline-block;opacity:0;animation:rise 1.1s var(--ease-out) forwards}#caption .words span:nth-child(1){animation-delay:.05s}#caption .words span:nth-child(3){animation-delay:.2s}#caption .words span:nth-child(5){animation-delay:.35s}#caption .words span:nth-child(7){animation-delay:.5s}#caption .words span:nth-child(9){animation-delay:.65s}#caption .words span:nth-child(11){animation-delay:.8s}#caption .words i{font-style:normal;color:var(--ember);opacity:.6;margin:0 .45em}@keyframes rise{0%{opacity:0;transform:translateY(10px);filter:blur(4px)}to{opacity:1;transform:none;filter:none}}#foot{left:32px;right:32px;bottom:26px;display:flex;justify-content:space-between;align-items:flex-end;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-faint)}#foot .left,#foot .right{display:flex;gap:22px;align-items:center}#help-toggle{all:unset;cursor:pointer;color:var(--ink-dim);letter-spacing:.2em;text-transform:uppercase;border-bottom:1px solid var(--ink-faint);padding-bottom:2px;transition:color .3s,border-color .3s}#help-toggle:hover{color:var(--ink);border-color:var(--ink-dim)}#live{display:inline-flex;align-items:center;gap:8px}#live:before{content:"";width:5px;height:5px;border-radius:50%;background:var(--ink-faint)}#live[data-kind=live]:before{background:#7fe3a1;box-shadow:0 0 8px #7fe3a1}#live[data-kind=polling]:before{background:var(--ember)}#live[data-kind=reconnecting]:before{background:#ff8a7a;animation:breathe .8s infinite}#webmcp[data-kind=on]{color:var(--cand)}#help{position:absolute;left:32px;bottom:64px;width:min(440px,calc(100vw - 64px));padding:26px 28px 24px;background:#060710c7;border:1px solid rgba(243,234,217,.12);backdrop-filter:blur(14px) saturate(120%);-webkit-backdrop-filter:blur(14px) saturate(120%);opacity:0;transform:translateY(10px);pointer-events:none;transition:opacity .5s var(--ease-out),transform .5s var(--ease-out)}#help.open{opacity:1;transform:none;pointer-events:auto}#help h2{margin:0 0 14px;font-family:var(--serif);font-style:italic;font-weight:300;font-size:26px;color:var(--ink)}#help p{margin:0 0 12px;font-family:var(--serif);font-size:16px;line-height:1.5;color:var(--ink-dim);letter-spacing:0}#help ol{margin:0 0 16px;padding-left:20px;font-family:var(--serif);font-size:16px;line-height:1.55;color:var(--ink)}#help ol li::marker{color:var(--ember);font-family:var(--mono);font-size:11px}#help .prompt{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:0 0 16px;padding:12px 14px;border:1px solid rgba(255,180,92,.35);background:#ffb45c0f}#help .prompt q{font-family:var(--serif);font-style:italic;font-size:17px;color:var(--ember-hot);quotes:"“" "”"}#help .prompt button{all:unset;cursor:pointer;font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--ember);padding:4px 8px;border:1px solid rgba(255,180,92,.4)}#help .tools{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:0 0 16px;font-size:11px}#help .tools code{color:var(--cand);font-family:var(--mono)}#help .tools span{color:var(--ink-dim)}#help small{display:block;font-size:10px;line-height:1.6;letter-spacing:.04em;color:var(--ink-faint)}#help-close{all:unset;position:absolute;right:16px;top:14px;cursor:pointer;color:var(--ink-faint);font-size:14px}#help-close:hover{color:var(--ink)}#grain{position:fixed;inset:-50%;width:200%;height:200%;pointer-events:none;z-index:4;opacity:.045;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");animation:grain .9s steps(4) infinite}@keyframes grain{0%{transform:translate(0)}25%{transform:translate(-2%,1%)}50%{transform:translate(1%,-2%)}75%{transform:translate(-1%,-1%)}to{transform:translate(2%,1%)}}#vignette{position:fixed;inset:0;pointer-events:none;z-index:1;background:radial-gradient(ellipse at 50% 42%,#0000 55%,#0000008c)}#fatal{position:fixed;inset:0;z-index:10;display:grid;place-items:center;background:var(--bg);text-align:center;padding:24px}#fatal[hidden]{display:none}#fatal h1{font-family:var(--serif);font-style:italic;font-weight:300;font-size:34px;margin:0 0 10px}#fatal p{font-family:var(--mono);color:var(--ink-dim);max-width:520px;line-height:1.6}@media(max-width:720px){#title{left:20px;top:18px}#title p{font-size:18px}#stats{right:20px;top:18px;gap:18px}#stats .stat b{font-size:26px}#stats .stat:nth-child(3){display:none}#status{bottom:74px;font-size:10px;letter-spacing:.2em}#caption{bottom:120px}#foot{left:20px;right:20px;bottom:18px;flex-direction:column;align-items:flex-start;gap:10px}#foot .right{gap:14px}#help{left:20px;bottom:96px;padding:20px}.label{font-size:14px}}
