:root{color-scheme:dark;--bg:#101315;--panel:#1a1e20;--line:#32393c;--text:#edf0e8;--muted:#a0aaa5;--accent:#dcf38b}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:15px/1.5 system-ui,-apple-system,sans-serif}button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.shell{max-width:1380px;margin:auto;padding:0 44px}.brand{font-weight:800;letter-spacing:.18em;font-size:18px;display:flex;align-items:center;gap:12px}.mark{color:var(--accent);font-size:30px}header{height:96px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.eyebrow{font-size:11px;font-weight:700;letter-spacing:.17em;color:var(--muted);margin:0 0 12px}h1{font-size:clamp(27px,3vw,42px);font-weight:500;line-height:1.15;letter-spacing:-.04em;margin:0}h2{font-size:23px;line-height:1.2;font-weight:500;margin:0 0 14px}.heading{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:44px 0 32px}.badge{border:1px solid var(--line);border-radius:25px;padding:8px 16px;white-space:nowrap;color:var(--accent)}.badge.offline{color:#edac8d}.grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px}.camera-card,.panel{background:var(--panel);border:1px solid var(--line);border-radius:16px;overflow:hidden}.card-head{min-height:58px;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 22px}.chip{font-size:10px;letter-spacing:.08em;border:1px solid #59624f;color:var(--accent);border-radius:5px;padding:4px 8px}.viewport{position:relative;background:#050606;aspect-ratio:64/51;display:flex;align-items:center;justify-content:center;overflow:hidden}.viewport img{width:100%;height:100%;object-fit:contain}.placeholder{color:var(--muted)}.camera-foot{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 22px}.quiet{color:var(--text);background:transparent;border:1px solid var(--line);padding:8px 14px;border-radius:8px}.quiet:hover{border-color:var(--accent)}.muted{color:var(--muted)}.tiny{font-size:11px}.panel{padding:25px;margin-bottom:20px}.panel.compact{font-size:13px}.storage-number{margin:32px 0 12px}.storage-number strong{font-size:34px;font-weight:500;letter-spacing:-.04em}.storage-number span{color:var(--muted)}progress{appearance:none;width:100%;height:6px;border:0;border-radius:5px;overflow:hidden;background:#353e38}progress::-webkit-progress-bar{background:#353e38}progress::-webkit-progress-value{background:var(--accent)}progress::-moz-progress-bar{background:var(--accent)}.dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--accent);margin-right:7px}.archive{margin-top:42px}.archive-head{display:flex;align-items:center;justify-content:space-between;gap:15px}.clip{border-top:1px solid var(--line);padding:15px 6px;display:flex;gap:20px;align-items:center}.clip .date{flex:1}.clip small{color:var(--muted)}#clips{max-height:420px;overflow:auto}#playback{margin-top:20px;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#050606}video{display:block;width:100%;max-height:70vh}footer{display:flex;justify-content:space-between;color:var(--muted);font-size:11px;padding:36px 0;margin-top:24px;border-top:1px solid var(--line)}.login-body{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(ellipse at 20% 0%,#283329 0,transparent 55%),var(--bg)}.login-card{width:min(440px,100%);background:var(--panel);padding:38px;border:1px solid var(--line);border-radius:22px}.login-card .brand{margin-bottom:42px}.login-card h1{font-size:36px}.login-card label{display:block;font-size:13px;margin-top:22px}.login-card input{width:100%;display:block;padding:13px 14px;margin-top:7px;background:var(--bg);color:var(--text);border:1px solid var(--line);border-radius:8px}.primary{width:100%;padding:13px 16px;display:flex;justify-content:space-between;background:var(--accent);border:0;color:#1b2115;border-radius:8px;font-weight:700;margin:24px 0 18px}[hidden]{display:none!important}@media(max-width:900px){.grid{grid-template-columns:1fr}aside{display:grid;grid-template-columns:1fr 1fr;gap:16px}.panel{margin:0}.shell{padding:0 22px}}@media(max-width:580px){header{height:76px}.heading{align-items:flex-start;flex-direction:column;padding:28px 0 24px}aside{display:block}.panel{margin-bottom:16px}.camera-foot,.card-head{padding:14px}.clip{gap:10px}.clip small{display:none}footer{display:block}.login-card{padding:27px}.chip{font-size:9px}}

.notice{color:#edac8d;font-size:13px}
