*{box-sizing:border-box}body{color:#e8eaed;background:#0f1117;margin:0;font-family:system-ui,-apple-system,sans-serif}#root{min-height:100vh}.app{width:100%;max-width:1600px;margin:0 auto;padding:1.5rem}.app-header{justify-content:space-between;align-items:center;margin-bottom:1.5rem;display:flex}.app-header h1{margin:0;font-size:1.25rem;font-weight:600}.app-header__title{flex-direction:column;gap:.25rem;display:flex}.app-header__actions{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:.75rem;display:flex}.wifi-settings-trigger{color:#e5e7eb;cursor:pointer;background:#1f2937;border:1px solid #374151;border-radius:.375rem;flex-direction:column;align-items:flex-start;gap:.125rem;max-width:14rem;padding:.35rem .65rem;display:inline-flex}.wifi-settings-trigger:hover:not(:disabled){background:#273244;border-color:#4b5563}.wifi-settings-trigger:disabled{opacity:.5;cursor:not-allowed}.wifi-settings-trigger__label{text-transform:uppercase;letter-spacing:.04em;color:#9ca3af;font-size:.6875rem;font-weight:600}.wifi-settings-trigger__value{text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-size:.8125rem;overflow:hidden}.modal-overlay{z-index:1000;background:#000000a6;justify-content:center;align-items:center;padding:1rem;display:flex;position:fixed;inset:0}.modal{background:#151922;border:1px solid #374151;border-radius:.5rem;flex-direction:column;width:min(100%,28rem);max-height:min(90vh,40rem);display:flex;box-shadow:0 16px 48px #00000073}.modal__header{border-bottom:1px solid #2a3140;justify-content:space-between;align-items:center;gap:.75rem;padding:.875rem 1rem;display:flex}.modal__title{margin:0;font-size:1rem;font-weight:600}.modal__close{color:#9ca3af;cursor:pointer;background:0 0;border:none;padding:.125rem .25rem;font-size:1.5rem;line-height:1}.modal__close:hover{color:#e5e7eb}.modal__body{padding:1rem;overflow:auto}.wifi-panel{flex-direction:column;gap:.75rem;display:flex}.app-back-link{color:#93c5fd;font-size:.75rem;text-decoration:none}.app-back-link:hover{text-decoration:underline}.app--home .relay-dashboard{margin-bottom:0}.relay-open-link{color:#93c5fd;white-space:nowrap;font-size:.75rem;font-weight:600;text-decoration:none}.relay-open-link:hover{text-decoration:underline}.relay-open-link--disabled{color:#6b7280;pointer-events:none}.relay-cell--action{text-align:right}.relay-dashboard{margin-bottom:1.5rem}.relay-dashboard__header{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1rem;display:flex}.relay-dashboard__title{margin:0;font-size:1rem;font-weight:600}.relay-dashboard__subtitle{color:#9ca3af;margin:.25rem 0 0;font-size:.75rem}.relay-dashboard__error{color:#f87171;margin:0 0 .75rem;font-size:.8125rem}.relay-summary{gap:1.25rem;display:flex}.relay-summary__item{flex-direction:column;align-items:flex-end;min-width:4.5rem;display:flex}.relay-summary__value{font-variant-numeric:tabular-nums;font-size:1.25rem;font-weight:700;line-height:1.1}.relay-summary__label{color:#9ca3af;text-transform:uppercase;letter-spacing:.04em;font-size:.6875rem}.relay-table-wrap{overflow-x:auto}.relay-table{border-collapse:collapse;width:100%;font-size:.8125rem}.relay-table th{text-align:left;color:#9ca3af;text-transform:uppercase;letter-spacing:.04em;border-bottom:1px solid #2a2f3d;padding:.5rem .75rem;font-size:.6875rem;font-weight:600}.relay-table td{vertical-align:middle;border-bottom:1px solid #22262f;padding:.65rem .75rem}.relay-row--current{background:#3b82f614}.relay-cell--id{white-space:nowrap}.relay-agent-id{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-weight:600}.relay-tag{color:#93c5fd;text-transform:uppercase;vertical-align:middle;background:#172033;border:1px solid #3b82f6;border-radius:4px;margin-left:.5rem;padding:.1rem .35rem;font-size:.625rem;font-weight:600;display:inline-block}.relay-pills{flex-wrap:wrap;gap:.35rem;display:flex}.relay-pill{background:#12151c;border:1px solid #2a2f3d;border-radius:999px;align-items:center;gap:.3rem;padding:.15rem .45rem;font-size:.6875rem;display:inline-flex}.relay-pill--on{border-color:#166534}.relay-pill--off{color:#9ca3af}.relay-channel-label{color:#6b7280;text-transform:uppercase;letter-spacing:.04em;margin-top:.2rem;font-size:.625rem;display:block}.relay-cell--device{color:#d1d5db}.relay-cell--meta{color:#9ca3af;font-variant-numeric:tabular-nums}.relay-cell--wifi{text-overflow:ellipsis;white-space:nowrap;max-width:12rem;overflow:hidden}.relay-stream-state{text-transform:uppercase;color:#9ca3af;background:#2a2f3d;border-radius:4px;padding:.1rem .4rem;font-size:.6875rem;font-weight:600;display:inline-block}.relay-stream-state--live{color:#86efac;background:#14532d}.relay-empty{text-align:center;color:#6b7280;padding:1.5rem .75rem!important}.app-body{grid-template-columns:300px minmax(0,1fr);align-items:start;gap:1.5rem;display:grid}.app-sidebar{flex-direction:column;gap:0;max-height:calc(100vh - 5rem);display:flex;position:sticky;top:1.5rem;overflow-y:auto}.app-sidebar>*+*{border-top:1px solid #2a2f3d;margin-top:1.25rem;padding-top:1.25rem}.app-content{flex-direction:column;gap:1.5rem;min-width:0;display:flex}@media (width<=900px){.app-body{grid-template-columns:1fr}.app-sidebar{max-height:none;position:static}}.panel{background:#1a1d27;border:1px solid #2a2f3d;border-radius:8px;padding:1rem}.video-panel{min-width:0}.video-shell{position:relative}.video-placeholder{aspect-ratio:16/9;color:#6b7280;background:#000;border-radius:4px;justify-content:center;align-items:center;font-size:.875rem;display:flex}.video-fps{color:#e8eaed;font-variant-numeric:tabular-nums;pointer-events:none;white-space:nowrap;background:#000000a6;border-radius:4px;padding:.2rem .5rem;font-size:.7rem;position:absolute;top:.5rem;right:.5rem}.controls label{margin-bottom:.75rem;font-size:.875rem;display:block}.controls input[type=range],.controls input[type=number],.controls select{width:100%;margin-top:.25rem}.controls .row{align-items:center;gap:.5rem;display:flex}.stream-controls{margin:0}.stream-controls-actions{flex-direction:column;gap:.5rem;display:flex}.stream-btn{color:#e8eaed;cursor:pointer;background:#2a2f3d;border:1px solid #2a2f3d;border-radius:6px;flex:1;padding:.5rem .75rem;font-size:.875rem;font-weight:500}.stream-btn:disabled{opacity:.45;cursor:not-allowed}.stream-btn--start:not(:disabled):hover{background:#166534;border-color:#22c55e}.stream-btn--stop:not(:disabled):hover{background:#7f1d1d;border-color:#ef4444}.stream-btn--reset{width:100%;margin-top:.5rem}.stream-btn--reset:not(:disabled):hover{background:#1e3a5f;border-color:#3b82f6}.stream-controls-status{color:#9ca3af;margin:.75rem 0 0;font-size:.75rem}.stream-modes{border-top:none;flex-direction:column;gap:.5rem;margin-top:0;padding-top:0;display:flex}.stream-field{align-items:center;gap:.5rem;display:flex}.stream-field__label{color:#9ca3af;text-transform:uppercase;letter-spacing:.04em;flex:0 0 2rem;font-size:.6875rem;font-weight:600}.stream-field__hint{color:#6b7280;font-size:.75rem}.stream-segments{flex-wrap:wrap;flex:1;gap:.25rem;display:flex}.stream-segment{color:#e8eaed;font-variant-numeric:tabular-nums;cursor:pointer;white-space:nowrap;background:#12151c;border:1px solid #2a2f3d;border-radius:4px;padding:.25rem .45rem;font-size:.6875rem;font-weight:600;line-height:1.2}.stream-segment--active{color:#93c5fd;background:#172033;border-color:#3b82f6}.stream-segment:disabled{opacity:.45;cursor:not-allowed}.stream-roi-details{color:#9ca3af;margin-top:.25rem;font-size:.75rem}.stream-roi-details summary{cursor:pointer;-webkit-user-select:none;user-select:none;color:#9ca3af;font-weight:600}.stream-roi-details[open] summary{margin-bottom:.5rem}.stream-roi{margin-top:.75rem}.stream-roi__hint{color:#9ca3af;margin:0 0 .5rem;font-size:.75rem}.stream-roi__grid{grid-template-columns:repeat(2,1fr);gap:.5rem;display:grid}.stream-roi__grid label{color:#9ca3af;flex-direction:column;gap:.2rem;font-size:.75rem;display:flex}.stream-roi__grid input{color:#e8eaed;background:#0f1117;border:1px solid #2a2f3d;border-radius:4px;width:100%;padding:.35rem .4rem}.stream-roi__actions{gap:.5rem;margin-top:.5rem;display:flex}.stream-roi__actions button,.stream-roi__btn{color:#e8eaed;cursor:pointer;background:#2a2f3d;border:1px solid #2a2f3d;border-radius:4px;padding:.25rem .5rem;font-size:.6875rem}.stream-roi__actions button:disabled{opacity:.45;cursor:not-allowed}.status-badge{background:#2a2f3d;border-radius:999px;align-items:center;gap:.375rem;padding:.25rem .5rem;font-size:.75rem;display:inline-flex}.status-dot{background:#6b7280;border-radius:50%;width:8px;height:8px}.status-dot.connected{background:#22c55e}.status-dot.disconnected{background:#ef4444}.agent-logs{flex-direction:column;min-height:0;display:flex}.logs-panel .agent-logs{height:100%}.agent-logs-list{flex:1;max-height:280px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.75rem;line-height:1.4;overflow-y:auto}.agent-logs-empty{color:#6b7280;margin:0}.agent-log{color:#d1d5db;grid-template-columns:4.5rem 4rem 1fr;gap:.75rem;padding:.2rem 0;display:grid}.agent-log-time{color:#6b7280}.agent-log-source{color:#9ca3af;font-weight:600}.agent-log--warn .agent-log-message{color:#fbbf24}.agent-log--error .agent-log-message{color:#f87171}.parameter-panel{flex-direction:column;gap:1.25rem;display:flex}.parameter-panel__section{flex-direction:column;gap:.75rem;display:flex}.parameter-panel__title{margin:0;font-size:1rem}.wifi-panel__status,.wifi-panel__form,.wifi-panel__actions{flex-direction:column;gap:.5rem;display:flex}.wifi-panel__row{justify-content:space-between;gap:.75rem;font-size:.875rem;display:flex}.wifi-panel__label{color:#9ca3af}.wifi-panel__button{color:#e5e7eb;cursor:pointer;background:#1f2937;border:1px solid #374151;border-radius:.375rem;align-self:flex-start;padding:.4rem .75rem}.wifi-panel__button:disabled{opacity:.5;cursor:not-allowed}.wifi-panel__field{color:#9ca3af;flex-direction:column;gap:.25rem;font-size:.8125rem;display:flex}.wifi-panel__field input{color:#e5e7eb;background:#111827;border:1px solid #374151;border-radius:.375rem;padding:.4rem .5rem}.wifi-panel__scan-list,.wifi-panel__profiles{flex-direction:column;gap:.5rem;margin:0;padding:0;list-style:none;display:flex}.wifi-panel__scan-item,.wifi-panel__profile{justify-content:space-between;align-items:center;gap:.5rem;font-size:.8125rem;display:flex}.wifi-panel__scan-meta{color:#9ca3af;font-size:.75rem}.wifi-panel__profile-actions{gap:.5rem;display:flex}.wifi-panel__link{color:#60a5fa;cursor:pointer;background:0 0;border:none;padding:0;font-size:.75rem}.wifi-panel__link--danger{color:#f87171}.wifi-panel__error{color:#f87171;margin:0;font-size:.8125rem}.parameter-field{flex-direction:column;gap:.35rem;font-size:.875rem;display:flex}.parameter-field.row{flex-direction:row;align-items:center;gap:.5rem}.parameter-field__header{justify-content:space-between;align-items:baseline;gap:.5rem;display:flex}.parameter-field__label{color:#9ca3af;font-size:.75rem}.parameter-field__value{font-variant-numeric:tabular-nums;color:#e5e7eb;font-size:.8125rem}.parameter-field__error{color:#f87171;font-size:.75rem}.parameter-field__hint{color:#9ca3af;margin-top:.2rem;font-size:.7rem;display:block}.protocol-version-warning{color:#fbbf24;background:#ca8a0433;border-radius:4px;margin:.5rem 1rem 0;padding:.5rem .75rem;font-size:.85rem}.parameter-slider{accent-color:#3b82f6;cursor:pointer;width:100%;height:.35rem;margin:.15rem 0}.parameter-slider:disabled{opacity:.45;cursor:not-allowed}.parameter-field--pending input,.parameter-field--pending .parameter-slider,.parameter-field--pending .stream-segment{outline:1px solid #f59e0b}.parameter-field--draft .parameter-field__value{color:#bfdbfe}.parameter-field--error input,.parameter-field--error .parameter-slider{outline:1px solid #ef4444}.live-preview{flex-direction:column;gap:.5rem;display:flex}.live-preview--active{border-radius:6px;outline:1px solid #3b82f6;margin:-.35rem;padding:.35rem}.live-preview__header{justify-content:space-between;align-items:center;gap:.5rem;display:flex}.live-preview__label{color:#9ca3af;text-transform:uppercase;letter-spacing:.04em;font-size:.75rem;font-weight:600}.live-preview__badge{color:#fca5a5;letter-spacing:.06em;align-items:center;gap:.3rem;font-size:.625rem;font-weight:700;display:inline-flex}.live-preview__dot{background:#ef4444;border-radius:50%;width:6px;height:6px;animation:1.5s ease-in-out infinite live-pulse}@keyframes live-pulse{0%,to{opacity:1}50%{opacity:.35}}.live-preview__frame{aspect-ratio:16/9;background:#000;border-radius:4px;position:relative;overflow:hidden}.live-preview__canvas{width:100%;height:100%;display:block}.live-preview__nosignal{color:#6b7280;background:#0000008c;justify-content:center;align-items:center;font-size:.6875rem;display:flex;position:absolute;inset:0}.stream-transport{flex-direction:column;gap:.5rem;margin-top:.75rem;display:flex}.stream-transport--review{background:#3b82f614;border:1px solid #3b82f640;border-radius:6px;margin:.75rem -.5rem -.5rem;padding:.5rem}.stream-transport__row{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.stream-transport__row--primary{justify-content:space-between}.stream-transport__btn{color:#e8eaed;cursor:pointer;white-space:nowrap;background:#2a2f3d;border:1px solid #2a2f3d;border-radius:6px;padding:.35rem .65rem;font-size:.75rem;font-weight:500}.stream-transport__btn:disabled{opacity:.45;cursor:not-allowed}.stream-transport__btn--record{color:#fca5a5;background:#2a1515;border-color:#7f1d1d}.stream-transport__btn--record:not(:disabled):hover{background:#3f1515;border-color:#ef4444}.stream-transport__btn--live{color:#86efac;background:#142818;border-color:#166534}.stream-transport__btn--live:hover{background:#1a3320;border-color:#22c55e}.stream-transport__btn--icon{min-width:2rem;padding:.35rem .45rem;font-size:.6875rem}.stream-transport__playback{align-items:center;gap:.25rem;display:flex}.stream-transport__speed{gap:.2rem;display:flex}.stream-transport__speed-btn{color:#9ca3af;cursor:pointer;background:#12151c;border:1px solid #2a2f3d;border-radius:4px;padding:.25rem .4rem;font-size:.6875rem;font-weight:600}.stream-transport__speed-btn--active{color:#93c5fd;background:#172033;border-color:#3b82f6}.stream-transport__speed-btn:disabled{opacity:.45;cursor:not-allowed}.stream-transport__timeline{flex-direction:column;gap:.25rem;display:flex}.stream-transport__slider{accent-color:#3b82f6;cursor:pointer;width:100%}.stream-transport__slider:disabled{opacity:.45;cursor:not-allowed}.stream-transport__time{font-variant-numeric:tabular-nums;color:#9ca3af;font-size:.6875rem}.stream-transport__time-sep{color:#6b7280;margin:0 .15rem}.stream-transport__time-max{color:#6b7280}.stream-transport__warn{color:#fbbf24;margin:0;font-size:.6875rem}