:root{--coral: #F75D5D;--bg: #0E1124;--cream: #FAF6EC;--hint: rgba(255, 255, 255, .45);--status-bg: rgba(255, 255, 255, .04);--status-text: rgba(255, 255, 255, .7);--status-muted: rgba(255, 255, 255, .4)}*{box-sizing:border-box}[hidden]{display:none!important}html,body{margin:0;padding:0;height:100%;background:var(--bg);color:#fff;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,system-ui,sans-serif;overflow:hidden}#stage{display:grid;place-items:center;height:100vh;width:100vw}#start-panel,#qr-panel,#word-stage,#dots-stage{grid-area:1 / 1}#start-panel{display:grid;place-items:center}#start-btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--coral);color:var(--cream);border:none;border-radius:999px;padding:1.25rem 3.5rem;font:inherit;font-size:1.05rem;letter-spacing:.18em;text-transform:lowercase;cursor:pointer;box-shadow:0 8px 28px #f75d5d59;transition:transform .2s cubic-bezier(.2,.7,.3,1),box-shadow .2s ease}#start-btn:hover{transform:scale(1.04);box-shadow:0 12px 36px #f75d5d73}#start-btn:active{transform:scale(.97)}#qr-panel{position:fixed;top:20px;right:20px;z-index:5;display:flex;flex-direction:column;align-items:center;gap:.75rem;pointer-events:none}.qr-card{background:var(--cream);padding:1.25rem;border-radius:16px;box-shadow:0 12px 32px #00000059}#qr{display:block}.control-url{margin:0;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.7rem;color:#ffffff73;letter-spacing:.03em;text-align:center;max-width:260px;word-break:break-all}.hint{color:var(--hint);font-size:.875rem;letter-spacing:.06em;text-transform:lowercase;margin:0}#dots-stage{position:relative;width:100vmin;height:100vmin;display:grid;place-items:center;pointer-events:none}.word-stage{display:grid;place-items:center;z-index:6;pointer-events:none}.word-display{font-size:clamp(3rem,12vmin,11rem);font-weight:600;letter-spacing:-.02em;text-transform:lowercase;color:var(--coral);opacity:0;transform:scale(.96);transition:opacity .55s cubic-bezier(.2,.7,.3,1),transform .55s cubic-bezier(.2,.7,.3,1),color .4s ease;text-shadow:0 0 60px currentColor;will-change:opacity,transform}.word-display.visible{opacity:1;transform:scale(1)}.dot-slot{position:absolute;left:50%;top:50%;width:0;height:0;transform:translate(0);transition:transform .6s cubic-bezier(.2,.7,.3,1);pointer-events:none}:root{--dot-size: 14vmin}.dot-circle{position:absolute;width:var(--dot-size);height:var(--dot-size);left:calc(var(--dot-size) / -2);top:calc(var(--dot-size) / -2);border-radius:50%;z-index:2;will-change:transform;pointer-events:auto;-webkit-tap-highlight-color:transparent;transition:width .4s ease,height .4s ease,left .4s ease,top .4s ease}.dot-halo{position:absolute;width:calc(var(--dot-size) * 1.86);height:calc(var(--dot-size) * 1.86);left:calc(var(--dot-size) * -.93);top:calc(var(--dot-size) * -.93);border-radius:50%;opacity:.2;pointer-events:none;z-index:1;will-change:opacity,transform}.dot-circle.wobble{animation:dot-wobble .8s cubic-bezier(.3,.8,.3,1)}.dot-halo.halo-flare{animation:dot-halo-flare .8s ease-out}@keyframes dot-wobble{0%{transform:scale(1.4)}18%{transform:scale(1.7)}35%{transform:scale(.85)}55%{transform:scale(1.15)}75%{transform:scale(.95)}to{transform:scale(1)}}@keyframes dot-halo-flare{0%{opacity:.6;transform:scale(1.4)}35%{opacity:.45;transform:scale(2.4)}to{opacity:0;transform:scale(3.2)}}.status{position:fixed;top:14px;left:14px;z-index:10;display:flex;flex-direction:column;gap:4px;padding:10px 14px;background:var(--status-bg);border-radius:10px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;color:var(--status-text);letter-spacing:.02em;pointer-events:none;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.status-row{display:flex;align-items:center;gap:8px}.dot{width:8px;height:8px;border-radius:50%;background:#fa3;box-shadow:0 0 6px currentColor}.dot.connecting{background:#fa3;color:#fa3}.dot.open{background:#ffd966;color:#ffd966}.dot.paired{background:#56e39f;color:#56e39f}.dot.closed{background:#f75d5d;color:#f75d5d}.dot.on{background:#56e39f;color:#56e39f}.dot.off{background:#555;color:#555;box-shadow:none}.event-log{margin-top:6px;padding-top:6px;border-top:1px solid rgba(255,255,255,.08);white-space:pre;color:var(--status-muted);min-height:60px}.connections-svg{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none;z-index:1}.dot-slot.route-entry .dot-circle{box-shadow:0 0 0 3px #ffffffe6,0 0 14px 4px #fff3}.dot-slot.route-hop .dot-circle{opacity:.35}.dot-slot.route-hop .dot-halo{opacity:0!important}.dot-slot.route-current .dot-circle{animation:route-fire .9s cubic-bezier(.2,.8,.3,1) forwards;box-shadow:0 0 24px 8px #ffffff59}@keyframes route-fire{0%{transform:scale(1)}22%{transform:scale(1.55)}55%{transform:scale(.92)}78%{transform:scale(1.08)}to{transform:scale(1)}}.route-overlay{position:fixed;bottom:0;left:0;right:0;z-index:8;padding:60px 48px 52px;background:linear-gradient(to bottom,transparent,rgba(14,17,36,.96));display:flex;flex-direction:column;align-items:center;gap:22px;pointer-events:none;grid-area:1 / 1}.route-query-text{margin:0;font-size:clamp(1rem,2.2vmin,1.7rem);color:#fff9;text-align:center;font-style:italic;letter-spacing:-.01em;font-weight:400}.route-chips{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;align-items:center;max-width:90vw}.route-chip{display:flex;align-items:center;gap:8px;padding:7px 16px 7px 9px;border-radius:999px;border:1px solid rgba(255,255,255,.12);background:#ffffff12;transition:opacity .3s ease}.route-chip-dot{width:22px;height:22px;border-radius:50%;flex-shrink:0}.route-chip-word{font-size:clamp(.9rem,1.9vmin,1.25rem);font-weight:500;color:#ffffffe6;letter-spacing:.02em;min-width:1ch}.route-chip-pending{opacity:.25}.route-chip-pending .route-chip-word{display:none}.route-chip-current{border-color:#fff6;background:#ffffff21;animation:chip-pulse 1.4s ease-in-out infinite}.route-chip-current .route-chip-word{color:#ffffff80;font-style:italic}@keyframes chip-pulse{0%,to{opacity:1}50%{opacity:.6}}.route-history{position:fixed;bottom:0;left:0;right:0;z-index:7;padding:0 48px 28px;display:flex;flex-direction:column;gap:14px;pointer-events:none;grid-area:1 / 1}.history-run{display:flex;flex-direction:column;align-items:center;gap:8px;opacity:.45}.history-query{font-size:clamp(.7rem,1.4vmin,1rem);color:#ffffff80;font-style:italic;letter-spacing:-.01em}.history-chips{display:flex;flex-wrap:wrap;gap:6px;justify-content:center}.history-chips .route-chip{padding:4px 10px 4px 6px;gap:5px}.history-chips .route-chip-dot{width:14px;height:14px}.history-chips .route-chip-word{font-size:clamp(.7rem,1.3vmin,.9rem)}.prompt-overlay{position:fixed;bottom:0;left:0;right:0;z-index:8;padding:28px 48px 44px;background:linear-gradient(to bottom,transparent,rgba(14,17,36,.92));text-align:center;pointer-events:none;grid-area:1 / 1}.prompt-overlay .prompt-text{font-size:clamp(1.1rem,2.8vmin,2.2rem);color:#ffffffd9;font-weight:500;margin:0 0 14px;letter-spacing:-.01em}.prompt-overlay .prompt-options{display:flex;justify-content:center;gap:48px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:clamp(.75rem,1.6vmin,1.1rem);letter-spacing:.06em}.prompt-overlay .opt-a{color:#4ade80}.prompt-overlay .opt-b{color:#60a5fa}
