:root{--bg: #07090c;--ink: #e8ecf1;--ink-quiet: #7d8894;--signal-gray: #3d444d;--signal-green: #3fb950;--signal-yellow: #d29922;--signal-red: #f85149;--signal-private: #21262d;--edge-opacity: .3;--breathe: 7s}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--ink);font-family:system-ui,-apple-system,Segoe UI,sans-serif;-webkit-font-smoothing:antialiased}#app{width:100vw;height:100vh}.screen{position:relative;width:100%;height:100%;display:block}.screen-stage{width:100%;height:100%;animation:breathe var(--breathe) ease-in-out infinite;transition:opacity 1.2s ease,filter 1.2s ease}.screen[data-stale=yes] .screen-stage{opacity:.28;filter:saturate(.4) blur(1px);animation:none}.tree{display:block;width:100%;height:100%}.tree-edge{fill:none;stroke-width:3;stroke-opacity:var(--edge-opacity);stroke-linecap:round}.tree-node{color:var(--signal-gray);transition:color 1.6s ease}.tree-node[data-signal=green]{color:var(--signal-green)}.tree-node[data-signal=yellow]{color:var(--signal-yellow)}.tree-node[data-signal=red]{color:var(--signal-red)}.tree-node[data-signal=private]{color:var(--signal-private)}.tree-node-fill{fill:currentColor;fill-opacity:.9;filter:drop-shadow(0 0 14px currentColor)}.tree-node[data-scope=out] .tree-node-fill{fill:none;filter:none}.tree-node-ring{fill:none;stroke:currentColor;stroke-width:2;stroke-opacity:.55}.tree-node[data-scope=out] .tree-node-ring{stroke-dasharray:4 7;stroke-opacity:.7}.tree-label{fill:var(--ink-quiet);font-size:26px;letter-spacing:.16em;text-anchor:middle;text-transform:uppercase}@keyframes breathe{0%,to{opacity:1;transform:scale(1)}50%{opacity:.9;transform:scale(1.012)}}.screen-clock{position:absolute;right:clamp(1.5rem,3vw,3.5rem);bottom:clamp(1.25rem,3vh,3rem);display:flex;flex-direction:column;align-items:flex-end;gap:.2em;color:var(--ink-quiet);text-align:right}.screen-time{font-size:clamp(2rem,5vw,4.5rem);font-weight:200;font-variant-numeric:tabular-nums;letter-spacing:.02em;line-height:1}.screen-date{font-size:clamp(.8rem,1.4vw,1.25rem);letter-spacing:.18em;text-transform:uppercase}.screen-ribbon{position:absolute;left:50%;bottom:clamp(1.25rem,3vh,3rem);transform:translate(-50%);padding:.5em 1.4em;border-radius:999px;background:#ffffff0f;color:var(--ink-quiet);font-size:clamp(.9rem,1.6vw,1.4rem);letter-spacing:.14em}.pairing{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(1rem,3vh,2.5rem);padding:2rem;text-align:center}.pairing[data-busy=yes]{opacity:.5}.pairing-title{font-size:clamp(1.5rem,4vw,3rem);font-weight:200;letter-spacing:.4em;text-transform:uppercase;color:var(--ink-quiet)}.pairing-code{display:flex;gap:clamp(.4rem,1.5vw,1.25rem)}.pairing-cell{display:flex;align-items:center;justify-content:center;width:clamp(3rem,9vw,8rem);height:clamp(4rem,12vw,11rem);border:2px solid #1d232b;border-radius:.35em;font-size:clamp(2.5rem,8vw,7rem);font-weight:300;font-variant-numeric:tabular-nums}.pairing-cell[data-filled=yes]{border-color:var(--signal-green);color:var(--ink)}.pairing-instructions{max-width:34ch;color:var(--ink-quiet);font-size:clamp(.95rem,1.8vw,1.5rem);line-height:1.5}.pairing-error{color:var(--signal-red);font-size:clamp(.9rem,1.6vw,1.3rem)}.pairing-keypad{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:clamp(.25rem,.7vw,.6rem);width:min(90vw,60rem)}.pairing-key{padding:.6em 0;border:1px solid #1d232b;border-radius:.3em;background:transparent;color:var(--ink-quiet);font:inherit;font-size:clamp(.85rem,1.5vw,1.2rem);cursor:pointer}.pairing-key:hover,.pairing-key:focus-visible{border-color:var(--ink-quiet);color:var(--ink)}.pairing-key--wide{grid-column:span 2}.screen-notice{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.75rem;padding:2rem;text-align:center;color:var(--ink-quiet)}@media (prefers-reduced-motion: reduce){.screen-stage,.tree-node{animation:none;transition:none}}