:root{--bg:#1a1626;--ink:#f4efe6;--ink-dim:#f4efe68c;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px);--safe-right:env(safe-area-inset-right,0px)}html,body{overscroll-behavior:none;background:var(--bg);height:100dvh;color:var(--ink);-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;margin:0;font:16px/1.4 -apple-system,PingFang SC,Hiragino Sans GB,Noto Sans CJK SC,system-ui,sans-serif;overflow:hidden}#room{touch-action:none;width:100%;height:100%;display:block;position:fixed;inset:0}#hud{padding:var(--safe-top) var(--safe-right) var(--safe-bottom) var(--safe-left);pointer-events:none;position:fixed;inset:0}#chip{left:calc(var(--safe-left) + 12px);top:calc(var(--safe-top) + 10px);color:var(--ink-dim);background:#1a1626b8;border-radius:14px;align-items:center;gap:8px;padding:8px 12px;font-size:12px;display:flex;position:absolute}#chip[hidden]{display:none}#chip-dot{background:var(--ink-dim);border-radius:50%;flex:none;width:8px;height:8px;transition:background .3s}#chip-dot[data-online=true]{background:#7bd88f}#chip-lines{flex-direction:column;line-height:1.3;display:flex}#chip-status{color:var(--ink)}#hud-tools{right:calc(var(--safe-right) + 12px);bottom:calc(var(--safe-bottom) + 10px);color:var(--ink-dim);align-items:center;gap:10px;font-size:12px;display:flex;position:absolute}#version{font-variant-numeric:tabular-nums}#conn{background:var(--ink-dim);border-radius:50%;width:8px;height:8px;transition:background .3s}#conn[data-status=live]{background:#7bd88f}#conn[data-status=connecting]{background:#f0b46a}#conn[data-status=offline]{background:var(--ink-dim)}#conn[data-status=unlinked]{background:#ff9c9c}#hud-lang{color:var(--ink-dim);pointer-events:auto;background:#1a1626b8;border:1px solid #f4efe640;border-radius:10px;padding:5px 10px;font-size:12px}#hud-relink{right:calc(var(--safe-right) + 12px);top:calc(var(--safe-top) + 10px);color:var(--ink-dim);pointer-events:auto;background:#1a1626b8;border:1px solid #f4efe640;border-radius:12px;padding:7px 12px;font-size:12px;position:absolute}#hud-relink[hidden]{display:none}#hud-relink[disabled]{opacity:.5}#hud-together{left:calc(var(--safe-left) + 12px);bottom:calc(var(--safe-bottom) + 10px);color:var(--ink);pointer-events:auto;background:0 0;border:1px solid #f4efe659;border-radius:14px;padding:9px 14px;font-size:13px;position:absolute}#hud-together[data-on=true]{color:#1a1626;background:#f0b46a;border-color:#f0b46a;font-weight:600}#hud-together[hidden]{display:none}#hud-together[disabled]{opacity:.5}#toast{left:50%;bottom:calc(var(--safe-bottom) + 56px);max-width:min(320px,80vw);color:var(--ink);text-align:center;background:#1a1626db;border-radius:14px;padding:10px 14px;font-size:14px;transition:opacity .25s;position:absolute;transform:translate(-50%)}#toast[hidden]{display:none}#overlay{z-index:3;text-align:center;background:#1a1626eb;place-items:center;padding:24px;display:grid;position:fixed;inset:0}#overlay[hidden]{display:none}button{touch-action:manipulation;font:inherit}.screen{z-index:2;padding:calc(var(--safe-top) + 32px) 24px calc(var(--safe-bottom) + 24px);background:var(--bg);flex-direction:column;gap:16px;display:flex;position:fixed;inset:0;overflow-y:auto}.screen[hidden]{display:none}.screen h1{margin:0;font-size:28px}.screen .tagline{color:var(--ink-dim);margin:0}#pair-choice,#pair-show{flex-direction:column;gap:12px;display:flex}#pair-choice[hidden],#pair-show[hidden]{display:none}#pair-enter-label{color:var(--ink-dim);flex-direction:column;gap:6px;display:flex}#pair-input{letter-spacing:.25em;text-transform:uppercase;color:var(--ink);-webkit-user-select:text;user-select:text;-webkit-touch-callout:default;background:#f4efe60f;border:1px solid #f4efe640;border-radius:12px;padding:12px;font:24px/1.2 ui-monospace,Menlo,monospace}#pair-was-paired{color:var(--ink-dim);margin:0;font-size:14px}#pair-was-paired[hidden]{display:none}#pair-code{letter-spacing:.3em;margin:0;font:40px/1.1 ui-monospace,Menlo,monospace}.screen button{color:#1a1626;background:#f0b46a;border:0;border-radius:14px;padding:14px 18px;font-weight:600}.screen button.secondary{color:var(--ink);background:0 0;border:1px solid #f4efe659}.screen button[disabled]{opacity:.5}.screen button[hidden]{display:none}.screen .row{gap:12px;display:flex}#pair-error{color:#ff9c9c;margin:0}#pair-waiting{color:var(--ink-dim)}