:root{--bg: #0c1017;--panel: #141b24;--panel-2: #10161e;--border: #243041;--text: #eef3f8;--muted: #8b9bb0;--accent: #4aa3f0;--good: #3dd68c;--warn: #f0c14d;--bad: #e85d5d;--mono: ui-monospace, SFMono-Regular, Menlo, monaco, monospace;--sans: "Segoe UI", system-ui, sans-serif}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font-family:var(--sans);font-size:14px}button,input,textarea{font:inherit;color:inherit}a{color:var(--accent)}code{font-family:var(--mono);font-size:12px;background:#0b1018;padding:1px 5px;border-radius:4px}.app{min-height:100%;display:flex;flex-direction:column}.topbar{display:flex;align-items:center;gap:14px;padding:10px 16px;border-bottom:1px solid var(--border);background:var(--panel);flex-wrap:wrap}.brand{display:flex;gap:10px;align-items:center}.logo{width:34px;height:34px;border-radius:8px;background:linear-gradient(135deg,#1b4d8f,#3d9cf0);display:grid;place-items:center;font-weight:800;font-size:11px}.title{font-weight:700;font-size:15px}.sub{color:var(--muted);font-size:12px}.status-pill{display:flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;font-weight:650;font-size:13px;border:1px solid var(--border)}.status-pill.ok{background:#10261c;color:var(--good);border-color:#1e5c3d}.status-pill.bad{background:#2a1416;color:var(--bad);border-color:#6b2a30}.status-pill.mini{font-size:11px;padding:3px 8px;gap:4px}.status-pill .dot{width:8px;height:8px;border-radius:50%;background:currentColor}.health{display:flex;flex-direction:column;align-items:flex-end;font-size:12px;margin-left:auto;gap:4px}.ok{color:var(--good)}.bad{color:var(--bad)}.muted{color:var(--muted)}.timebar,.gallery-filters{display:flex;flex-wrap:wrap;gap:6px;align-items:center}.timebar button,.ghost,.form-grid button,.row button{background:#1a2330;border:1px solid var(--border);border-radius:8px;padding:6px 12px;cursor:pointer}.timebar button:hover,.ghost:hover{border-color:#3d5470}.timebar button.on{background:#17324c;border-color:#3d9cf0;color:#c5e3ff}.ghost{background:transparent}.banner{padding:8px 16px;font-weight:600;font-size:13px}.banner.alarm{background:#3a1518;color:#ffb4b4}.banner.warn{background:#3a2e10;color:#ffe08a}.setup{margin:12px 16px;padding:16px 18px;background:var(--panel);border:1px solid var(--border);border-radius:12px}.setup h2{margin:0 0 8px;font-size:16px}.form-grid{display:grid;gap:10px;max-width:640px;margin-top:12px}.form-grid label{display:grid;gap:4px;font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}.form-grid input{background:#0b1018;border:1px solid var(--border);border-radius:8px;padding:8px 10px;text-transform:none;letter-spacing:0;font-size:14px;color:var(--text)}.form-grid button:disabled{opacity:.5;cursor:not-allowed}.row{display:flex;gap:8px}.err{color:var(--bad)}.camera-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px;padding:16px}.cam-card{text-align:left;background:var(--panel);border:1px solid var(--border);border-radius:12px;overflow:hidden;padding:0;cursor:pointer;color:inherit}.cam-card:hover{border-color:#3d5470}.cam-thumb{position:relative;aspect-ratio:16 / 10;background:#0b1018}.cam-thumb img{width:100%;height:100%;object-fit:cover;display:block}.cam-placeholder{display:grid;place-items:center;height:100%;color:var(--muted)}.cam-thumb .status-pill{position:absolute;top:8px;left:8px}.cam-body{padding:10px 12px 12px}.cam-name{font-weight:650}.cam-model{font-size:12px;margin:2px 0 8px}.meters{display:grid;gap:6px}.meter-lab{display:flex;justify-content:space-between;font-size:11px;color:var(--muted)}.meter-track{height:6px;background:#0b1018;border-radius:99px;overflow:hidden}.meter-track i{display:block;height:100%;background:var(--good)}.meter-track i.warn{background:var(--warn)}.meter-track i.bad{background:var(--bad)}.cam-meta{font-size:12px;margin-top:8px}.gallery{display:flex;flex-direction:column;min-width:0;flex:1}.pane-head{display:flex;align-items:center;gap:12px;padding:10px 16px 8px;flex-wrap:wrap}.pane-head h2{margin:0;font-size:16px;font-weight:650}.gallery-filters{padding:0 16px 12px}.photo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;padding:0 16px 24px}.photo-card{padding:0;border:1px solid var(--border);border-radius:10px;overflow:hidden;background:var(--panel);cursor:pointer;text-align:left;color:inherit}.photo-card img{width:100%;aspect-ratio:4 / 3;object-fit:cover;display:block}.photo-cap{display:flex;justify-content:space-between;gap:8px;padding:6px 8px;font-size:11px;color:var(--muted)}.empty{padding:24px 16px}.lightbox{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000d1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;z-index:20;cursor:zoom-out}.lightbox img{max-width:min(1100px,100%);max-height:calc(100vh - 90px);border-radius:8px;cursor:default}.lightbox-cap{margin-top:10px;color:var(--muted);font-size:13px}@media (max-width: 700px){.camera-grid,.photo-grid{grid-template-columns:1fr}.health{width:100%;align-items:flex-start}}