: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)}.session{color:#fff;background:#000;flex-direction:column;height:100%;display:flex}.toolbar{background:#1b1f27f2;border-bottom:1px solid #2a303b;align-items:center;gap:8px;padding:6px 10px;display:flex}.toolbar .btn{color:#e8eaf0;background:0 0;border-color:#2a303b;padding:5px 10px}.toolbar.collapsed{border:1px solid #2a303b;border-top:0;border-radius:0 0 10px 10px;position:absolute;top:0;left:50%;transform:translate(-50%)}.stage{flex:1;justify-content:center;align-items:center;display:flex;position:relative}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}.toolbar{flex-wrap:wrap;row-gap:4px}.toolbar .peer{font-variant-numeric:tabular-nums}.stage{touch-action:none}@media (width<=600px){.toolbar select.btn{max-width:120px}}.stage{overflow:hidden}.stage .frame{will-change:transform;max-width:100%;max-height:100%;line-height:0;display:inline-block;position:relative}.stage .frame canvas{max-width:100%;max-height:100%}.stage .cursor{pointer-events:none;filter:drop-shadow(0 1px 1.5px #000000b3);position:absolute}.stage .help{max-width:280px;color:var(--text);font-size:13px;line-height:1.6;position:absolute;top:12px;right:12px}