:root{--bg:#0a1014;--surface:#101a22;--surface-hover:#16242f;--border:#1f3544;--text:#e6f2f4;--text-dim:#7d9aaa;--accent:#22d3ee;--accent-hover:#67e8f9;--danger:#fb7185;--success:#4ade80;--warning:#fbbf24;--radius:8px;--font:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--mono:"JetBrains Mono", "SF Mono", "Fira Code", monospace}[data-theme=obsidian]{--bg:#070b0e;--surface:#0e151a;--surface-hover:#141f27;--border:#1a2c38;--accent:#2dd4bf;--accent-hover:#5eead4}[data-theme=graphite]{--bg:#0c1116;--surface:#131c24;--surface-hover:#1a2732;--border:#243545;--accent:#38bdf8;--accent-hover:#7dd3fc}[data-theme=slate]{--bg:#0f1419;--surface:#161f28;--surface-hover:#1e2a36;--border:#2a3d4f;--accent:#14b8a6;--accent-hover:#2dd4bf}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font);background:var(--bg);color:var(--text);min-height:100vh;line-height:1.5}#root{min-height:100vh;display:flex}a{color:var(--accent);text-decoration:none}a:hover{color:var(--accent-hover)}.nav-version a{color:var(--text-dim);opacity:.55}.nav-version a:hover{color:var(--accent);opacity:1}button{font-family:var(--font);cursor:pointer;border-radius:var(--radius);border:none;padding:8px 16px;font-size:14px;font-weight:500;transition:background .15s}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent-hover)}.btn-primary:disabled{opacity:.5;cursor:default}.btn-secondary{color:var(--accent);border:1px solid color-mix(in srgb, var(--accent) 45%, var(--border));background:0 0}.btn-secondary:hover{background:color-mix(in srgb, var(--accent) 12%, transparent);color:var(--accent-hover)}.btn-secondary:disabled{opacity:.45;cursor:default}.btn-danger{background:var(--danger);color:#fff}.btn-danger:hover{background:#e03030}.btn-ghost{color:var(--text-dim);border:1px solid var(--border);background:0 0}.btn-ghost:hover{background:var(--surface-hover);color:var(--text)}input,select,textarea{font-family:var(--font);background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:var(--radius);outline:none;width:100%;padding:8px 12px;font-size:14px;transition:border-color .15s}input[type=checkbox],input[type=radio]{width:auto}input:focus,select:focus,textarea:focus{border-color:var(--accent)}label{color:var(--text-dim);margin-bottom:4px;font-size:13px;font-weight:500;display:block}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:20px}.cam-card--recording-collapsed{border-color:color-mix(in srgb, var(--danger) 55%, var(--border));box-shadow:0 0 0 1px color-mix(in srgb, var(--danger) 55%, transparent), 0 0 0 4px color-mix(in srgb, var(--danger) 20%, transparent)}.badge{text-transform:uppercase;border-radius:4px;padding:2px 8px;font-size:12px;font-weight:600;display:inline-block}.badge-running{color:var(--success);background:#4caf5026}.badge-stopped{color:var(--text-dim);background:#8b90a026}.badge-error{color:var(--danger);background:#ff444426}.badge-connecting{color:var(--warning);background:#ffa72626}.badge-motion{background:color-mix(in srgb, var(--accent) 16%, transparent);color:var(--accent)}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.spin{animation:.8s linear infinite spin;display:inline-block}@keyframes pulse-dot{0%,to{opacity:1}50%{opacity:.4}}.recording-indicator{color:var(--danger);background:#fb71851f;border-radius:4px;align-items:center;gap:4px;padding:4px 8px;font-size:12px;font-weight:500;display:inline-flex}.recording-indicator__dot{background:var(--danger);border-radius:50%;width:6px;height:6px;animation:1.4s ease-in-out infinite pulse-dot;display:inline-block}table{border-collapse:collapse;width:100%}th,td{border-bottom:1px solid var(--border);text-align:left;vertical-align:top;padding:10px 8px}th{color:var(--text-dim);text-transform:uppercase;letter-spacing:.02em;font-size:12px;font-weight:600}.settings-compact{max-width:38rem}.settings-compact .settings-two{grid-template-columns:1fr 1fr;align-items:start;gap:10px 14px;display:grid}.settings-compact .settings-three{grid-template-columns:repeat(3,minmax(0,11.5rem));align-items:start;gap:10px 12px;display:grid}@media (width<=640px){.settings-compact .settings-two,.settings-compact .settings-three{grid-template-columns:1fr}}.settings-tip-abbr{cursor:help;text-underline-offset:3px;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none;-webkit-text-decoration:underline dotted #8b90a08c;text-decoration:underline dotted #8b90a08c}.settings-field-row{align-items:center;gap:12px;margin-bottom:8px;display:flex}.settings-field-row__label{color:var(--text-dim);flex:0 0 min(14rem,45%);font-size:13px;font-weight:500;line-height:1.35}.settings-field-row__control{flex:1;justify-content:flex-end;min-width:0;display:flex}.settings-field-row__control input[type=number],.settings-field-row__control select{box-sizing:border-box;width:9rem;max-width:9rem}.cam-row__continuous{flex-shrink:0}.cam-row__stream-dot{width:10px;height:10px;box-shadow:0 0 0 1px color-mix(in srgb, var(--bg) 40%, transparent);border-radius:50%;display:block}.cam-row__stream-dot--loading{opacity:.45}.cam-row__stream-dot--muted{opacity:.55}.cam-expanded{box-sizing:border-box;width:100%}.cam-expanded input[type=text],.cam-expanded input[type=password]{box-sizing:border-box;width:100%;max-width:15rem}.cam-expanded input.cam-expanded__rtsp{max-width:min(32rem,100%)}.cam-expanded input[type=number]{box-sizing:border-box;width:100%;max-width:5.5rem}.cam-expanded__row2{grid-template-columns:1fr 1fr;align-items:start;gap:0 14px;max-width:38rem;display:grid}.cam-expanded .cam-expanded__row2 input[type=text],.cam-expanded .cam-expanded__row2 input[type=password],.cam-expanded .cam-expanded__row2 input[type=number],.cam-expanded .cam-expanded__row2 input.cam-expanded__rtsp{width:100%;max-width:100%}.cam-expanded__connection-grid{grid-template-columns:1fr 100px 1fr 1fr;align-items:end;gap:12px;max-width:720px;display:grid}.cam-expanded .cam-expanded__connection-grid input[type=text],.cam-expanded .cam-expanded__connection-grid input[type=password],.cam-expanded .cam-expanded__connection-grid input[type=number]{box-sizing:border-box;width:100%;max-width:100%}.cam-expanded__rtsp-row{max-width:720px}.cam-expanded .cam-expanded__rtsp-url{width:100%;max-width:100%}.cam-expanded__stream-select{box-sizing:border-box;width:100%;max-width:100%}.cam-expanded__row-hostport{grid-template-columns:minmax(0,1fr) 5.25rem;align-items:start;gap:0 12px;max-width:28rem;display:grid}.cam-expanded .cam-expanded__row-hostport input[type=text],.cam-expanded .cam-expanded__row-hostport input.cam-expanded__rtsp{box-sizing:border-box;width:100%;max-width:100%}.cam-expanded .cam-expanded__row-hostport input[type=number]{width:100%;max-width:100%}@media (width<=700px){.cam-expanded__connection-grid{grid-template-columns:1fr 1fr}}@media (width<=540px){.cam-expanded__row2,.cam-expanded__row-hostport,.cam-expanded__connection-grid{grid-template-columns:1fr}.cam-expanded .cam-expanded__row-hostport input[type=number]{max-width:5.5rem}}.settings-mqtt{max-width:36rem;padding:16px 18px}.settings-mqtt__head{border-bottom:1px solid var(--border);justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:4px;padding-bottom:14px;display:flex}.settings-mqtt__title{color:var(--text);letter-spacing:-.01em;font-size:15px;font-weight:600}.settings-mqtt__lede{color:var(--text-dim);max-width:28rem;margin-top:4px;font-size:12px;line-height:1.45}.settings-mqtt__master{cursor:pointer;-webkit-user-select:none;user-select:none;flex-direction:column;flex-shrink:0;align-items:flex-end;gap:6px;display:flex}.settings-mqtt__master-label{text-transform:uppercase;letter-spacing:.06em;color:var(--text-dim);font-size:11px;font-weight:600}.settings-mqtt__body{border:none;min-width:0;margin:0;padding:14px 0 0}.settings-mqtt__body:disabled{opacity:.48;pointer-events:none}.settings-mqtt__section-label{text-transform:uppercase;letter-spacing:.05em;color:var(--text-dim);margin:18px 0 10px;font-size:11px;font-weight:600}.settings-mqtt__section-label:first-child{margin-top:0}.settings-mqtt .settings-field-row{margin-bottom:6px}.settings-mqtt .settings-field-row__label{flex:0 0 min(11rem,38%);font-size:12px;font-weight:500}.settings-mqtt .settings-field-row__control{justify-content:flex-start}.settings-mqtt .settings-field-row__control input[type=text],.settings-mqtt .settings-field-row__control input[type=password]{border-radius:4px;width:100%;max-width:22rem;padding:7px 10px;font-size:13px}.settings-mqtt .settings-field-row__control input[type=number]{border-radius:4px;width:5.5rem;max-width:5.5rem;padding:7px 10px;font-size:13px}.settings-mqtt .settings-mqtt__inline-switch{align-items:center;min-height:32px;display:flex}.toggle-track:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.visually-hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.settings-tabs.settings-tabs--nested{margin-bottom:14px}.settings-tabs.settings-tabs--nested button{padding:6px 12px;font-size:13px}.recording-filters{padding:14px}.recording-filters__grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;display:grid}.recording-modal{z-index:300;background:#05080cc7;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.recording-modal__panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);width:min(920px,100%);padding:14px}.recording-modal__head{justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px;display:flex}.recording-actions-root{display:inline-block;position:relative}.recording-actions-menu__panel{z-index:250;background:var(--surface);border:1px solid var(--border);border-radius:8px;min-width:10.5rem;margin:0;padding:4px 0;list-style:none;position:absolute;top:calc(100% + 4px);right:0;box-shadow:0 8px 28px #0006}.recording-actions-menu__item{box-sizing:border-box;text-align:left;width:100%;color:var(--text);cursor:pointer;background:0 0;border:none;padding:8px 14px;font-family:inherit;font-size:13px;line-height:1.3;text-decoration:none;display:block}.recording-actions-menu__item:hover,.recording-actions-menu__item:focus-visible{background:color-mix(in srgb, var(--accent) 12%, transparent);outline:none}nav.sidebar .nav-label,nav.sidebar .nav-logo-text,nav.sidebar .nav-footer-label{display:inline}.nav-theme-chooser-wrap{flex-shrink:0;align-items:center;gap:6px;min-width:0;display:flex}.nav-theme-chooser-wrap .nav-theme-swatch{width:10px;height:10px;box-shadow:0 0 0 1px color-mix(in srgb, var(--border) 85%, transparent);border-radius:50%;flex-shrink:0}.nav-theme-chooser-wrap .nav-theme-chooser{width:auto;min-width:0}@media (width<=768px){nav.sidebar{padding:8px 0;width:56px!important}nav.sidebar .nav-label,nav.sidebar .nav-logo-text,nav.sidebar .nav-footer-label,nav.sidebar .nav-version{display:none}nav.sidebar .nav-theme-chooser-wrap{display:none!important}nav.sidebar button{justify-content:center;padding:12px 0}nav.sidebar .nav-icon{width:auto;font-size:20px}nav.sidebar .logo-box{width:40px!important;height:40px!important;margin:0 auto 12px!important}nav.sidebar .nav-footer-link{justify-content:center}main.app-main{padding:12px!important}.cam-grid{grid-template-columns:1fr!important}.cam-modal{padding:12px!important}.settings-tabs{flex-wrap:wrap!important}.settings-grid,.recording-filters__grid{grid-template-columns:1fr!important}.log-filter-select{width:100%!important;min-width:0!important}}