:root{--bg:#020403;--panel:#07100e;--panel2:#0b1714;--line:#12382f;--text:#d8f8ec;--muted:#6f9186;--green:#37ff8b;--green2:#00b86b;--red:#ff3f64;--amber:#e8c84f;--shadow:0 30px 80px rgba(0,0,0,.55)}*{box-sizing:border-box}html,body{height:100%}body{margin:0;background:radial-gradient(circle at 20% 0%,#0a2b1e 0,#020403 36%,#010101 100%);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}.mono{font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace;letter-spacing:.12em;text-transform:uppercase}.dim{color:var(--muted)}a{color:inherit;text-decoration:none}.noise{position:fixed;inset:0;pointer-events:none;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 300 300' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E")}.scanlines{position:fixed;inset:0;background:linear-gradient(rgba(255,255,255,.025) 50%,rgba(0,0,0,0) 50%);background-size:100% 4px;pointer-events:none;mix-blend-mode:overlay}.login-shell{min-height:100%;display:grid;place-items:center;padding:28px;position:relative}.login-terminal{width:min(520px,100%);border:1px solid rgba(55,255,139,.22);background:linear-gradient(180deg,rgba(9,18,17,.94),rgba(3,8,7,.98));box-shadow:var(--shadow),inset 0 0 40px rgba(55,255,139,.03);border-radius:20px;overflow:hidden}.terminal-topline{height:42px;display:flex;align-items:center;gap:8px;padding:0 18px;border-bottom:1px solid rgba(55,255,139,.14);background:rgba(255,255,255,.025)}.dot{width:10px;height:10px;border-radius:50%;display:inline-block}.red{background:var(--red)}.amber{background:var(--amber)}.green{background:var(--green)}.term-label{margin-left:auto;font-size:11px;color:var(--muted);letter-spacing:.12em}.terminal-grid{padding:34px}.terminal-grid h1{font-size:40px;line-height:1;margin:6px 0 10px}.sub{color:#94b7ab;margin:0 0 22px}.signal-row{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin:0 0 22px}.signal-row span{height:4px;background:linear-gradient(90deg,var(--green),transparent);box-shadow:0 0 14px rgba(55,255,139,.5)}.alert{border:1px solid rgba(255,63,100,.7);background:rgba(255,63,100,.08);color:#ff8ca1;padding:12px 14px;border-radius:12px;margin-bottom:16px}label{display:block;color:#95b4aa;margin:14px 0 7px}input{width:100%;height:48px;border-radius:12px;border:1px solid rgba(55,255,139,.22);background:#010605;color:var(--text);padding:0 14px;font-size:16px;outline:none}input:focus{border-color:var(--green);box-shadow:0 0 0 3px rgba(55,255,139,.12)}button{width:100%;height:48px;margin-top:24px;border-radius:12px;border:1px solid rgba(55,255,139,.45);background:linear-gradient(90deg,rgba(0,184,107,.28),rgba(55,255,139,.14));color:var(--green);font-weight:800;letter-spacing:.08em;cursor:pointer}.foot{font-size:10px;color:#56756b;margin:20px 0 0}.app-shell{min-height:100%;display:grid;grid-template-columns:290px 1fr}.sidebar{background:rgba(3,8,7,.94);border-right:1px solid rgba(55,255,139,.15);padding:24px;display:flex;flex-direction:column;gap:24px}.brand{display:flex;gap:12px;align-items:center}.brand-mark{width:32px;height:32px;background:radial-gradient(circle,var(--green),#083);box-shadow:0 0 22px rgba(55,255,139,.5);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}.brand strong{display:block}.brand small{color:var(--muted)}nav{display:grid;gap:8px}nav a,.logout{padding:13px 14px;border:1px solid transparent;border-radius:12px;color:#9eb8ae}nav a:hover,nav a.active{border-color:rgba(55,255,139,.25);background:rgba(55,255,139,.06);color:var(--green)}.logout{margin-top:auto;border-color:rgba(255,63,100,.2);color:#ff899d}.workspace{padding:28px;overflow:auto}.topbar{height:52px;border:1px solid rgba(55,255,139,.14);background:rgba(7,16,14,.7);border-radius:16px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;color:#8db1a5;font-family:monospace;letter-spacing:.12em}.hero-panel,.panel{margin-top:24px;border:1px solid rgba(55,255,139,.16);background:linear-gradient(180deg,rgba(9,18,17,.86),rgba(5,10,9,.94));border-radius:22px;padding:28px;box-shadow:var(--shadow)}.hero-panel h1{font-size:42px;margin:0 0 10px}.hero-panel p:not(.mono){color:#a2bcb3;max-width:760px}.card-grid,.camera-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:18px}.module-card,.camera-card{border:1px solid rgba(55,255,139,.15);background:rgba(7,16,14,.75);border-radius:18px;padding:20px;min-height:160px;transition:.2s}.module-card:hover,.camera-card:hover{transform:translateY(-2px);border-color:rgba(55,255,139,.45);box-shadow:0 0 35px rgba(55,255,139,.08)}.module-card span,.camera-card span{font-family:monospace;color:var(--green)}.module-card h2,.camera-card h3{margin:18px 0 8px}.module-card p,.camera-card p{color:#8eaaa0}.badge{display:inline-flex;align-items:center;gap:8px;padding:5px 10px;border-radius:999px;background:rgba(55,255,139,.08);border:1px solid rgba(55,255,139,.2);color:var(--green);font-size:12px}.viewer{margin-top:14px;aspect-ratio:16/9;border-radius:14px;border:1px solid rgba(55,255,139,.12);display:grid;place-items:center;background:repeating-linear-gradient(0deg,#030706,#030706 3px,#06110e 4px);color:#53786d}.action{display:inline-flex;margin-top:12px;padding:10px 12px;border-radius:10px;border:1px solid rgba(55,255,139,.25);color:var(--green)}@media(max-width:1000px){.app-shell{grid-template-columns:1fr}.sidebar{position:relative}.card-grid,.camera-grid{grid-template-columns:1fr 1fr}}@media(max-width:640px){.card-grid,.camera-grid{grid-template-columns:1fr}.terminal-grid{padding:24px}.terminal-grid h1{font-size:32px}}
