:root{--font-sans: "IBM Plex Sans", "Noto Sans KR", sans-serif;--font-mono: "IBM Plex Mono", "Noto Sans Mono CJK KR", monospace;--surface-canvas-start: #f5f7fb;--surface-canvas-mid: #e8edf5;--surface-canvas-end: #dde4ef;--surface-panel: #ffffffd9;--surface-panel-strong: #ffffff;--surface-panel-muted: #f9fbff;--surface-panel-soft: #f4f8ff;--surface-info-soft: #eef4ff;--surface-healthy-soft: #e8f8ef;--surface-warning-soft: #fff4df;--surface-danger-soft: #fff0f0;--border-default: #cfd8e6;--border-strong: #9cb1d1;--border-accent: #1f4a8f;--text-default: #182230;--text-strong: #132847;--text-muted: #4d5d76;--accent: #2253a0;--accent-strong: #1f3d70;--accent-soft: #edf4ff;--brand-cobalt: #143e86;--brand-cobalt-bright: #1b62d1;--info: #214472;--healthy: #2c6a3f;--warning: #8c5712;--danger: #7a2323;--shadow-panel: 0 12px 24px #4f5f7a14;color-scheme:light;font-family:var(--font-sans);line-height:1.4;font-weight:400;background:radial-gradient(circle at top left,var(--surface-canvas-start),var(--surface-canvas-mid) 45%,var(--surface-canvas-end) 100%);color:var(--text-default)}*{box-sizing:border-box}body{margin:0;min-height:100vh;min-height:100dvh;overflow-x:hidden}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:absolute;left:16px;top:12px;z-index:20;padding:10px 14px;border-radius:999px;background:var(--accent-strong);color:#fff;text-decoration:none;transform:translateY(-160%);transition:transform .16s ease}.skip-link:focus,.skip-link:focus-visible{transform:translateY(0)}.operator-shell{max-width:1360px;margin:0 auto;padding:max(24px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left));display:flex;flex-direction:column;gap:16px}.panel{background:var(--surface-panel);border:1px solid var(--border-default);border-radius:14px;padding:18px;box-shadow:var(--shadow-panel)}.shell-hero{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);align-items:end;gap:16px}.shell-hero h1,.workspace-panel-head h2{margin:0 0 6px}.shell-hero h1{font-size:clamp(1.85rem,4vw,2.8rem);line-height:1.02;max-width:11ch}.shell-hero-copy{display:grid;gap:8px}.shell-brand-lockup{display:flex;align-items:center;gap:14px}.shell-brand-mark{width:68px;height:68px;flex:0 0 auto;filter:drop-shadow(0 10px 14px rgba(20,62,134,.14))}.shell-brand-note{margin:0;font-size:13px;color:var(--text-muted)}.shell-hero-copy p{margin:0}.shell-hero-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.shell-hero-actions button{width:100%}.status-strip-panel{position:sticky;top:12px;z-index:5;padding:12px;background:linear-gradient(180deg,#ffffffeb,#f4f8ffeb);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.shell-eyebrow{margin:0 0 6px;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--brand-cobalt)}.status-strip{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.status-chip{display:grid;gap:4px;padding:12px 14px;border-radius:12px;border:1px solid var(--border-default);background:linear-gradient(180deg,#f7faff,var(--surface-info-soft))}.status-chip-label{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted)}.status-chip strong{font-size:18px;color:var(--text-strong);font-variant-numeric:tabular-nums}.status-chip-detail{color:var(--text-muted);font-size:13px;font-variant-numeric:tabular-nums}.status-chip.tone-ready{border-color:#7bb78d;background:linear-gradient(180deg,#f3fff8,var(--surface-healthy-soft))}.status-chip.tone-working{border-color:#d2a35f;background:linear-gradient(180deg,#fff9ef,#fff2dc)}.status-chip.tone-blocked{border-color:#d99292;background:linear-gradient(180deg,#fff4f4,#ffe8e8)}.status-chip.tone-idle{border-color:#b7c4d8;background:linear-gradient(180deg,#f7f9fc,#eef2f8)}.muted{color:var(--text-muted)}label{display:block;margin-bottom:12px;font-weight:600}input,textarea,select{width:100%;margin-top:6px;padding:10px 12px;border:1px solid #b9c7dd;border-radius:8px;font-size:14px;font:inherit;color:var(--text-default);background:var(--surface-panel-strong)}textarea{min-height:96px;resize:vertical}.row{display:flex;gap:8px;margin:8px 0 12px;flex-wrap:wrap}button{border:1px solid var(--accent-strong);border-radius:8px;background:var(--accent);color:#fff;padding:9px 12px;font-weight:600;cursor:pointer;font:inherit}button.button-secondary{background:var(--surface-panel-strong);color:var(--accent-strong);border-color:var(--border-strong)}button,input:not([type=checkbox]),textarea,select{min-height:44px;touch-action:manipulation}input[type=checkbox]{accent-color:#2253a0;touch-action:manipulation}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #f08a36;outline-offset:2px;box-shadow:0 0 0 4px #fff5e6}.panel:focus-within{box-shadow:var(--shadow-panel),0 0 0 2px #dbe7fb}button:disabled{opacity:.45;cursor:not-allowed}.workspace-panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}.draft-recovery-panel{border-color:#d4ac76;background:linear-gradient(180deg,#fffaf1,#fffdf8)}.workspace-nav-panel{display:grid;gap:14px}.workspace-tab-row{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.workspace-tab{display:grid;gap:6px;text-align:left;padding:14px;border-radius:12px;border-color:var(--border-strong);background:var(--surface-panel-soft);color:#14305c}.workspace-tab.active{border-color:var(--border-accent);background:linear-gradient(180deg,var(--accent-soft),#dfeafe);box-shadow:inset 0 0 0 1px #6b8fc8}.workspace-tab-label{font-size:15px;font-weight:700}.workspace-tab-helper{color:var(--text-muted);font-size:13px;line-height:1.4}.status-badge{display:inline-flex;align-items:center;justify-content:center;min-height:32px;padding:0 12px;border-radius:999px;border:1px solid var(--border-default);background:#f4f7fc;color:#27405f;font-size:12px;font-weight:700;white-space:nowrap}.status-badge.tone-info{border-color:var(--border-strong);background:var(--surface-info-soft);color:var(--info)}.status-badge.tone-warning{border-color:#d2a35f;background:var(--surface-warning-soft);color:var(--warning)}.status-badge.tone-danger{border-color:#d99292;background:var(--surface-danger-soft);color:var(--danger)}.workspace-card-grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));margin-top:14px}.panel-subsection{border:1px solid #d7e1ef;border-radius:12px;padding:14px;background:var(--surface-panel-muted)}.panel-subsection h3{margin:0 0 10px}.metric-grid{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));margin-top:12px}.metric-grid-tight{margin-top:10px}.metric-card{display:grid;gap:4px;padding:12px 13px;border-radius:12px;border:1px solid #d6dfec;background:linear-gradient(180deg,#fcfdff,#f4f8ff)}.metric-card.tone-info{border-color:var(--border-strong);background:linear-gradient(180deg,#f8fbff,var(--surface-info-soft))}.metric-card.tone-healthy{border-color:#84b894;background:linear-gradient(180deg,#f6fff9,var(--surface-healthy-soft))}.metric-card.tone-warning{border-color:#d4ac76;background:linear-gradient(180deg,#fffaf2,var(--surface-warning-soft))}.metric-card.tone-danger{border-color:#d9a0a0;background:linear-gradient(180deg,#fff6f6,var(--surface-danger-soft))}.metric-card-label{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#667892}.metric-card-value{font-size:16px;line-height:1.2;color:var(--text-strong);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}.metric-card-value.mono{font-family:var(--font-mono);font-size:13px}.metric-card-detail{color:var(--text-muted);font-size:12px;line-height:1.45;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}.workspace-footnotes{display:grid;gap:6px;margin-top:12px}.activity-panel .log-list{margin-top:0}.advanced-recovery-section{background:linear-gradient(180deg,var(--surface-panel-soft),#ffffff);border-style:dashed}.advanced-recovery-section>summary{cursor:pointer;font-weight:700;list-style:none}.advanced-recovery-section>summary::-webkit-details-marker{display:none}.advanced-recovery-section>summary:after{content:"+";float:right;color:var(--accent);font-size:18px}.advanced-recovery-section[open]>summary:after{content:"−"}.advanced-recovery-body{display:grid;gap:12px;padding-top:12px}.log-list{list-style:none;padding:0;margin:0;display:grid;gap:8px}.log-list li{border-radius:8px;padding:8px 10px;border:1px solid #d6deea;background:#f8faff}.log-list li.error{border-color:#e9b4b4;background:#fff4f4}.room-session-list{list-style:none;margin:8px 0 12px;padding:0;display:grid;gap:8px}.room-session-list li{border:1px solid #c8d5ea;border-radius:8px;padding:8px;background:#fff}.room-session-list li.online{border-color:#7db68a}.room-session-list li.offline{border-color:#c4a87a;background:#fff9ef}.room-session-list li.webrtc-connected{border-color:#72b58d;background:#f4fff8}.room-session-list li.webrtc-reconnecting{border-color:#9e85c7;background:#faf6ff}.room-session-list li.webrtc-stale{border-color:#d08f5f;background:#fff6ed}.room-session-list li.webrtc-closed{border-color:#9ca7ba;background:#f5f8fc}.room-session-list li.transport-relay_active,.room-session-list li.transport-relay_recovered{border-color:#7a9fd4;background:#f4f8ff}.room-session-list li.transport-direct_probe,.room-session-list li.transport-direct_active{border-color:#72b58d;background:#f3fff8}.room-session-list li.transport-direct_degraded{border-color:#d08f5f;background:#fff6ed}.room-webrtc-meta{margin:4px 0 0;font-size:12px;font-variant-numeric:tabular-nums}.room-session-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:6px}.room-session-capabilities{display:flex;flex-wrap:wrap;gap:10px}.calibration-panel{grid-column:span 2}.browser-panel{width:100%}.browser-toolbar{display:grid;gap:10px}.webview-shell{border:1px solid #b8c7df;border-radius:12px;overflow:hidden;background:#edf3fe;box-shadow:inset 0 1px #fff,0 8px 18px #2a3c5d1a;margin-bottom:12px}.webview-tab-strip{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 12px;background:linear-gradient(180deg,#dce7fb,#cad9f4);border-bottom:1px solid #b7c8e5}.webview-tab{display:inline-flex;align-items:center;gap:8px;font-size:13px;border:1px solid #8fa7ce;border-bottom-color:#d6e3fb;border-radius:8px 8px 0 0;padding:6px 10px 5px;background:linear-gradient(180deg,#f8fbff,#e6efff);color:#19345d}.webview-tab.active{border-color:#7f9ecb;background:linear-gradient(180deg,#fff,#ecf3ff)}.webview-tab:before{content:"";width:8px;height:8px;border-radius:999px;background:#3f7de0;box-shadow:12px 0 #f2b637,24px 0 #de6d62;margin-right:20px}.webview-tab-status{font-size:12px;color:#3f5270;font-variant-numeric:tabular-nums}.webview-toolbar-row{display:flex;align-items:center;gap:8px;padding:10px;border-bottom:1px solid #ccd8ec;background:#f6f9ff}.webview-toolbar-row button{min-width:72px;padding:8px 10px;background:#f1f6ff;color:#264673;border-color:#9fb5d8}.webview-address-form{display:flex;align-items:center;gap:8px;flex:1}.webview-address-form input{margin-top:0;border-radius:999px;padding:10px 14px;background:#fff}.webview-address-form button{border-radius:999px;min-width:56px}.webview-frame-wrap{position:relative;width:100%;background:#f4f7fc;min-height:min(52vw,420px)}.webview-frame{width:100%;height:min(52vw,420px);border:0;background:#fff}.preview-options-row{align-items:flex-end;row-gap:10px}.checkbox-label{display:inline-flex;align-items:center;gap:8px;margin:0}.checkbox-label input{width:auto;margin-top:0}.compact-field{width:220px}.browser-url-bar{border:1px solid #bdcbe0;border-radius:8px;padding:10px 12px;background:#f3f7ff;color:#27405f;font-family:var(--font-mono);font-size:13px;font-variant-numeric:tabular-nums;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.room-qr-wrap{margin-top:10px;display:flex;justify-content:center}.room-qr-image{width:220px;max-width:100%;border:1px solid #bdcbe0;border-radius:10px;background:#fff;padding:8px}.preview-stage{margin-top:10px;border:1px solid #b8c9e4;border-radius:12px;overflow:hidden;background:linear-gradient(160deg,#e3eaf7,#cedaf0);min-height:200px;display:flex;align-items:center;justify-content:center}.preview-frame-wrap{position:relative;width:100%}.preview-image{width:100%;display:block;cursor:crosshair}.preview-overlay-layer{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.preview-overlay-segment{position:absolute;border:2px solid #2f5ea8aa;background:#2f5ea814;display:flex;align-items:flex-start;justify-content:flex-start;padding:4px}.preview-overlay-segment.active{border-color:#ef7a2fcc;background:#ef7a2f26}.preview-overlay-segment.display-off{border-color:#3a465c;background:#1e2738a3}.preview-overlay-label{color:#fff;background:#20304fbd;border-radius:4px;padding:2px 4px;font-size:11px}.preview-overlay-empty{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;background:#1f2a3a9c}.keyboard-relay-form,.preview-fallback-block{margin-top:12px}.preview-fallback-controls{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.preview-fallback-label{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted)}.field-help{margin:6px 0 0;font-size:13px;line-height:1.4}.diagnostic-subsection-title{margin:14px 0 8px;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#667892}.meta-chip-row{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}.meta-chip-row-tight{margin-top:4px}.meta-chip{display:inline-flex;align-items:center;gap:6px;min-height:26px;padding:4px 8px;border-radius:999px;border:1px solid #d4ddea;background:#f6f9ff;color:var(--text-muted);font-size:12px;font-variant-numeric:tabular-nums}.meta-chip.tone-info{border-color:var(--border-strong);background:var(--surface-info-soft);color:var(--info)}.meta-chip.tone-healthy{border-color:#84b894;background:#f4fff7;color:var(--healthy)}.meta-chip.tone-warning{border-color:#d4ac76;background:#fff9ef;color:var(--warning)}.meta-chip.tone-danger{border-color:#d9a0a0;background:#fff5f5;color:var(--danger)}.meta-chip-label{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase}.meta-chip-value{color:var(--text-strong)}.meta-chip.mono .meta-chip-value{font-family:var(--font-mono)}.log-list.compact li{font-size:13px;padding:7px 9px}.audio-relay-player{width:100%;margin-bottom:10px}.layout-settings-panel{margin:12px 0;border:1px solid #c2d2eb;border-radius:10px;padding:12px;background:#f5f9ff}.layout-diagram{position:relative;width:100%;aspect-ratio:16 / 9;border:1px dashed #7f98bf;border-radius:10px;background:linear-gradient(160deg,#e9f0fb,#d5e2f8);overflow:hidden;margin-bottom:10px}.layout-cell{position:absolute;border:1px solid #2f5ea8;background:#2f5ea82e;color:#0f1f39;display:flex;flex-direction:column;justify-content:center;gap:4px;text-align:left;font-size:11px;padding:6px;border-radius:6px}.layout-cell.active{border-color:#d35d22;background:#d35d222e}.layout-cell.display-off{border-color:#4f607a;background:#4f607a54}.layout-cell strong{font-size:12px}.layout-cell span{font-family:var(--font-mono);font-variant-numeric:tabular-nums}.layout-screen-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}.layout-screen-list li{border:1px solid #c8d5ea;border-radius:8px;padding:8px;background:#fff}.layout-screen-list li.active{border-color:#d35d22}.layout-screen-head{display:flex;align-items:center;justify-content:space-between}.layout-screen-select{background:#1f4a8f;border-color:#163869;padding:6px 10px;font-size:12px}.layout-screen-toggles{display:flex;gap:10px;margin-top:8px;flex-wrap:wrap}.layout-screen-device-input{margin-top:8px}.calibration-header{margin-bottom:10px}.calibration-header h2{margin-bottom:6px}.calibration-canvas-wrap{width:100%;aspect-ratio:16 / 9;border-radius:12px;border:1px solid #bacbe6;overflow:hidden;background:#dbe6f8}.calibration-canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab}.calibration-canvas:active{cursor:grabbing}.calibration-actions{margin-top:12px}.calibration-meta{margin:10px 0}.calibration-readout{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:8px}.calibration-readout li{border:1px solid #d2deef;border-radius:8px;background:#f8fbff;padding:8px 10px;display:flex;justify-content:space-between;gap:8px}.diagnostics-panel{display:grid;gap:14px}.diagnostic-group-list{display:grid;gap:12px}.diagnostic-group{border:1px solid #d3ddec;border-radius:12px;background:#f9fbff;overflow:hidden}.diagnostic-group summary{list-style:none;cursor:pointer;padding:14px 16px;font-weight:700;color:#183257;background:linear-gradient(180deg,#f7faff,#edf3ff)}.diagnostic-group summary::-webkit-details-marker{display:none}.diagnostic-body{padding:14px 16px 16px}@media (max-width: 900px){.operator-shell{padding:max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}.compact-field{width:100%}.workspace-panel-head{flex-direction:column;align-items:stretch}.workspace-tab-row,.workspace-card-grid{grid-template-columns:1fr}.status-strip-panel{top:8px;padding:10px}.status-strip{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(220px,78vw);grid-template-columns:none;overflow-x:auto;padding-bottom:2px}.webview-toolbar-row{flex-wrap:wrap}.webview-toolbar-row button{min-width:0;flex:1}.webview-address-form{width:100%}.webview-frame-wrap,.webview-frame{height:42vh;min-height:240px}.shell-hero h1{font-size:2rem}}@media (max-width: 720px){.operator-shell{padding-bottom:max(96px,calc(env(safe-area-inset-bottom) + 88px))}.shell-hero{grid-template-columns:1fr}.workspace-nav-panel{position:sticky;bottom:0;z-index:7;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:#fffffff0;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:0 -10px 24px #44536f1f}.workspace-nav-panel .workspace-panel-head{display:none}.workspace-tab-row{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.workspace-tab{min-height:64px;padding:10px 8px;justify-items:center;text-align:center}.workspace-tab-label{font-size:13px}.workspace-tab-helper{display:none}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}