:root{--bg:#f6f7f9;--panel:#fff;--text:#1a1d21;--muted:#6b7280;--line:#e5e7eb;--accent:#2563eb;--accent-text:#fff;--danger:#dc2626;--ok:#16a34a;--warn:#d97706;--radius:10px;--font:-apple-system, BlinkMacSystemFont, "Segoe UI", Inter, sans-serif}@media (prefers-color-scheme:dark){:root{--bg:#111318;--panel:#1b1f27;--text:#e8eaf0;--muted:#9aa3b2;--line:#2a303b;--accent:#3b82f6}}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:var(--font);background:var(--bg);color:var(--text);-webkit-user-select:none;user-select:none;font-size:14px}button,input,select{font:inherit}.screen{flex-direction:column;gap:16px;min-height:100%;padding:24px;display:flex}.center{text-align:center;justify-content:center;align-items:center}.muted{color:var(--muted)}.row{align-items:center;gap:10px;display:flex}.spread{justify-content:space-between}.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:16px}h1{margin:0;font-size:20px}h2{margin:0 0 8px;font-size:15px}.btn{border:1px solid var(--line);background:var(--panel);color:var(--text);cursor:pointer;border-radius:8px;padding:8px 14px}.btn:hover{border-color:var(--muted)}.btn.primary{background:var(--accent);color:var(--accent-text);border-color:var(--accent)}.btn.danger{color:var(--danger)}.btn:disabled{opacity:.5;cursor:default}.input{border:1px solid var(--line);background:var(--bg);color:var(--text);border-radius:8px;width:100%;padding:10px 12px}.input.id{letter-spacing:2px;text-align:center;font-variant-numeric:tabular-nums;font-size:22px}.own-id{letter-spacing:3px;font-variant-numeric:tabular-nums;-webkit-user-select:text;user-select:text;font-size:34px}.dot{background:var(--muted);border-radius:50%;width:9px;height:9px;display:inline-block}.dot.ok{background:var(--ok)}.dot.warn{background:var(--warn)}.dot.bad{background:var(--danger)}.tiles{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;display:grid}.tile{text-align:left;padding:12px}.tile .id{font-variant-numeric:tabular-nums;font-weight:600}.overlay{background:#00000073;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}.sheet{flex-direction:column;gap:12px;width:min(420px,100%);display:flex}.steps{flex-direction:column;gap:6px;display:flex}.step{color:var(--muted);align-items:center;gap:8px;display:flex}.step.active{color:var(--text);font-weight:600}.step.done{color:var(--ok)}.toggle{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;padding:8px 0;display:flex}.toggle:last-child{border-bottom:0}.tabs{gap:6px;display:flex}.tabs .btn.active{border-color:var(--accent);color:var(--accent)}.field{flex-direction:column;gap:4px;margin-bottom:10px;display:flex}.field label{color:var(--muted);font-size:12px}.error{color:var(--danger)}:root{--sab:env(safe-area-inset-bottom,0px)}html.in-session,html.in-session body{overscroll-behavior:none;height:100%;overflow:hidden}.session{color:#fff;background:#000;flex-direction:column;display:flex;position:fixed;inset:0}.session.kbd{--sab:0px}.stage{touch-action:none;flex:1;justify-content:center;align-items:center;min-height:0;display:flex;position:relative;overflow:hidden}canvas{background:#0b0d12;outline:1px solid #2a303b;max-width:100%;max-height:100%}.badge{background:#2a303b;border-radius:999px;padding:2px 8px;font-size:12px}.badge.direct{background:#14532d}.badge.relay{background:#78350f}.countdown{background:var(--line);border-radius:2px;height:4px;margin-top:6px;overflow:hidden}.countdown-bar{background:var(--accent);height:100%;transition:width 1s linear}.stage .frame{position:absolute;inset:0}.stage .frame canvas{outline:0;width:100%;max-width:none;height:100%;max-height:none;display:block}.stage .cursor{pointer-events:none;filter:drop-shadow(0 1px 1.5px #000000b3);position:absolute}.stage .help{max-width:300px;color:var(--text);font-size:13px;line-height:1.6;position:absolute;top:12px;right:12px}.stage .stage-fit{left:10px;bottom:calc(10px + var(--sab));position:absolute}.tool{color:#e8eaf0;cursor:pointer;-webkit-tap-highlight-color:transparent;background:#1b1f27f2;border:1px solid #2a303b;border-radius:10px;flex-direction:column;justify-content:center;align-items:center;gap:1px;width:44px;height:44px;padding:0;display:inline-flex;position:relative}.tool:hover{border-color:#9aa3b2}.tool.on{background:var(--accent);border-color:var(--accent);color:#fff}.tool.danger{color:#f87171}.tool:disabled{opacity:.4;cursor:default}.tool .cap{letter-spacing:.2px;font-variant-numeric:tabular-nums;font-size:9px;line-height:1}.tool:has(.cap) svg{width:18px;height:18px}.tool select{opacity:0;cursor:pointer;width:100%;height:100%;position:absolute;inset:0}.dock{left:0;right:0;bottom:var(--dock-base,0px);z-index:2;pointer-events:none;touch-action:none;flex-direction:column;align-items:center;transition:transform .25s,bottom .25s;display:flex;position:absolute;transform:translateY(0)}.dock.closed{bottom:calc(var(--dock-base,0px) + var(--sab));transform:translateY(calc(100% - 44px))}.dock-handle{pointer-events:auto;cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;justify-content:center;align-items:flex-end;width:120px;height:44px;padding:0 0 8px;display:flex}.dock-handle span{background:#e8eaf08c;border-radius:3px;width:44px;height:5px;display:block;box-shadow:0 0 0 1px #0006}.dock-handle:hover span,.dock.open .dock-handle span{background:#e8eaf0}.dock-panel{pointer-events:auto;width:100%;padding:8px 12px calc(10px + var(--sab));background:#1b1f27f7;border-top:1px solid #2a303b;flex-direction:column;gap:8px;transition:visibility;display:flex}.dock.closed .dock-panel{visibility:hidden;transition:visibility 0s .25s}.dock-head{flex-wrap:wrap;align-items:center;gap:8px;font-size:12px;display:flex}.dock-head .peer{font-variant-numeric:tabular-nums;font-size:13px}.dock-tools{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.typebar{z-index:3;background:#1b1f27;border-top:1px solid #2a303b;flex:none;align-items:center;gap:6px;height:40px;margin-top:auto;padding:0 8px;display:flex}.session:not(.kbd) .typebar{height:calc(40px + var(--sab));padding-bottom:var(--sab)}.typebar-field{flex:1;height:30px;position:relative}.typebar-field input{color:#e8eaf0;width:100%;height:100%;caret-color:var(--accent);-webkit-user-select:text;user-select:text;background:#0b0d12;border:1px solid #2a303b;border-radius:8px;outline:0;padding:0 10px;font-size:16px}.typebar-field input:focus{border-color:var(--accent)}.typebar-hint{color:#6b7280;pointer-events:none;font-size:14px;line-height:30px;position:absolute;top:0;left:11px}.typebar .tool{border-radius:8px;width:36px;height:30px}