:root{--bg:#06121e;--panel:#0c2134;--panel2:#102a42;--line:#1d3a56;--text:#e8f1f8;--muted:#8fb0cc;--cyan:#67e8f9;--gold:#d7b35a;--green:#7ee2b8;--red:#ff9aa2;--blue:#8ec5ff}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.5 Arial,Helvetica,sans-serif}
a{color:var(--cyan)}button{font-family:inherit}.hidden{display:none!important}
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;background:radial-gradient(circle at 80% 20%,rgba(34,211,238,.12),transparent 35%),linear-gradient(135deg,#071827,#06121e)}
.login-card{width:420px;max-width:100%;background:#0c2134;border:1px solid var(--line);border-radius:16px;padding:26px;box-shadow:0 20px 60px rgba(0,0,0,.35)}
.brand{display:flex;align-items:center;gap:12px}.brand img{width:58px;height:58px;border-radius:50%}.brand b{display:block;font-size:19px;letter-spacing:.08em}.brand span{display:block;font-size:10px;color:var(--muted);letter-spacing:.12em}
h1{font-size:26px;margin:18px 0 4px;color:#fff}.muted{color:var(--muted);font-size:12px}
label{display:block;font-size:11px;color:var(--muted);font-weight:700;margin:10px 0 3px}
input,select,textarea{width:100%;background:#071a2b;border:1px solid #1d4a68;border-radius:7px;color:var(--text);padding:9px;font:13px Arial;outline:none}input:focus,select:focus,textarea:focus{border-color:var(--cyan)}
.btn{border:0;border-radius:7px;padding:9px 13px;font-size:12px;font-weight:800;cursor:pointer;background:var(--cyan);color:#062033}.btn:hover{background:#a5f3fc}.btn.gold{background:var(--gold);color:#1d1606}.btn.ghost{background:#163a52;color:#b8e4ee}.btn.danger{background:#4a1f2a;color:#ffb3b8}.btn.small{padding:6px 9px;font-size:10px;font-weight:700}
.app{display:flex;min-height:100vh}.sidebar{width:248px;background:#081b2c;border-right:1px solid var(--line);padding:18px 12px;position:sticky;top:0;height:100vh;overflow:auto;flex-shrink:0}
.side-brand{display:flex;align-items:center;gap:10px;padding:0 8px 16px;border-bottom:1px solid var(--line);margin-bottom:13px}.side-brand img{width:42px;height:42px;border-radius:50%}.side-brand b{display:block;font-size:15px;letter-spacing:.08em}.side-brand span{display:block;font-size:9px;color:var(--muted);letter-spacing:.1em}
.navsec{font-size:9px;letter-spacing:.14em;color:#6e8fa8;font-weight:800;margin:13px 8px 5px}
.nav a{display:flex;align-items:center;gap:8px;padding:8px 9px;border-radius:7px;color:#a9c2d2;text-decoration:none;font-size:12px;margin:2px 0;cursor:pointer}.nav a:hover{background:#102a42;color:#fff}.nav a.active{background:#16405a;color:#fff;border-left:3px solid var(--cyan)}
.nav a i{font-style:normal;color:var(--cyan);width:16px;text-align:center}
.side-foot{margin-top:20px;padding:10px 8px;border-top:1px solid var(--line);font-size:9px;color:#5f7c91;line-height:1.5}
.main{flex:1;min-width:0}.topbar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:15px 24px;border-bottom:1px solid var(--line);background:rgba(6,18,30,.9);position:sticky;top:0;z-index:5}.kicker{font-size:9px;letter-spacing:.16em;color:var(--gold);font-weight:800;text-transform:uppercase}.topbar h1{font-size:20px;margin:0}.topbar p{margin:0;color:var(--muted);font-size:11px}.userbox{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--muted)}.avatar{width:30px;height:30px;border-radius:50%;background:#15506a;display:flex;align-items:center;justify-content:center;font-weight:800;color:#d9fbff}
.view{padding:20px 24px 40px;max-width:1400px}.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:6px 0 14px}.kpi{background:var(--panel);border:1px solid var(--line);border-radius:11px;padding:13px}.kpi .l{font-size:9px;letter-spacing:.12em;color:var(--muted);text-transform:uppercase;font-weight:800}.kpi .v{font-size:26px;font-weight:800;color:#fff;margin:2px 0}.kpi .d{font-size:11px;color:var(--muted)}.kpi.gold{border-color:#6b5521;background:#211d10}.kpi.green{border-color:#1c5d4b;background:#0c2a25}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:15px;margin:12px 0}.panel h2{font-size:15px;margin:0 0 4px;color:#fff}.panel .hint{font-size:11px;color:var(--muted);margin-bottom:10px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.card{background:#0a1c2d;border:1px solid var(--line);border-radius:10px;padding:12px}.card h3{font-size:13px;margin:0 0 4px}.card p{font-size:11px;color:var(--muted);margin:0 0 8px}
.table{width:100%;border-collapse:collapse;font-size:11.5px}.table th{font-size:9px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);text-align:left;border-bottom:1px solid var(--line);padding:7px 6px}.table td{border-bottom:1px solid #16344b;padding:7px 6px;vertical-align:top}.table tr:last-child td{border-bottom:0}
.badge{display:inline-block;border-radius:12px;padding:2px 7px;font-size:9px;font-weight:800}.badge.high{background:#431d24;color:#ffb3b8}.badge.mid{background:#3c2f15;color:#f0c878}.badge.low{background:#123a31;color:#8ff0c8}.badge.blue{background:#163a52;color:#9fe8f2}
.form{display:grid;grid-template-columns:1fr 1fr;gap:10px}.form .full{grid-column:1/-1}.form label{font-size:10px;margin-top:0}.form input,.form select,.form textarea{margin-top:2px}
.row{display:grid;grid-template-columns:1.4fr .8fr .8fr .8fr 32px;gap:6px;align-items:end;margin:5px 0}.row label{font-size:9px;margin:0}.row input,.row select{padding:6px;font-size:11px}.iconbtn{background:#3a1e28;color:#ffb3b8;border:0;border-radius:6px;padding:6px;cursor:pointer;font-weight:800}
.bar{height:8px;background:#102a42;border-radius:5px;overflow:hidden}.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--cyan),#22d3ee)}
.matrix{position:relative;height:330px;background:#081b2c;border:1px solid var(--line);border-radius:10px;margin:10px 0;overflow:hidden}.matrix .q{position:absolute;width:50%;height:50%;border:1px solid #173b55;color:#496b80;font-size:10px;padding:7px;text-transform:uppercase;letter-spacing:.08em}.matrix .dot{position:absolute;width:13px;height:13px;border-radius:50%;background:var(--gold);border:2px solid #fff;transform:translate(-50%,50%);cursor:default}.matrix .axis-x,.matrix .axis-y{position:absolute;font-size:9px;color:var(--muted)}.matrix .axis-x{right:10px;bottom:8px}.matrix .axis-y{left:8px;top:8px;writing-mode:vertical-rl;transform:rotate(180deg)}
.empty{border:1px dashed #2b4b64;border-radius:9px;padding:18px;text-align:center;color:var(--muted);font-size:12px}
.msg{font-size:12px;color:var(--muted);margin-top:8px}.msg.err{color:var(--red)}.msg.ok{color:var(--green)}
.footer-note{font-size:9px;color:#5f7c91;margin-top:18px}
@media(max-width:900px){.sidebar{width:190px}.kpis{grid-template-columns:1fr 1fr}.grid3,.grid4{grid-template-columns:1fr 1fr}.topbar{padding:12px 14px}.view{padding:14px}}
@media(max-width:650px){.app{display:block}.sidebar{width:100%;height:auto;position:relative}.nav{display:flex;overflow:auto;gap:4px}.nav a{white-space:nowrap}.side-foot{display:none}.topbar{align-items:flex-start}.grid2,.grid3,.grid4,.kpis{grid-template-columns:1fr}.form{grid-template-columns:1fr}.form .full{grid-column:auto}.row{grid-template-columns:1fr 1fr}.row .wide{grid-column:1/-1}}
@media print{body{background:#fff;color:#111}.sidebar,.topbar,.no-print{display:none!important}.app{display:block}.view{padding:0;max-width:none}.panel,.kpi,.card{border-color:#ccc;background:#fff;color:#111;break-inside:avoid}.panel h2,.kpi .v,.card h3{color:#0b3d6b}.muted,.hint,.kpi .l,.kpi .d{color:#555}.matrix{border-color:#999;background:#fff}.matrix .q{color:#777;border-color:#ccc}}