:root{--bg:#0f1115;--panel:#171a21;--panel-2:#1e222b;--border:#2a2f3a;--text:#e6e8ec;--muted:#8b93a1;--accent:#ff5a3c;--good:#4ade80;--bad:#f87171}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font-family:-apple-system,Segoe UI,Roboto,sans-serif;font-size:14px}.centered{justify-content:center;align-items:center;height:100%;display:flex}.muted{color:var(--muted)}.error{color:var(--bad)}.brand{letter-spacing:-.02em;font-size:18px;font-weight:800}.brand span{color:var(--accent)}.brand.big{margin-bottom:8px;font-size:26px}.login-card{background:var(--panel);border:1px solid var(--border);border-radius:12px;flex-direction:column;gap:14px;width:320px;padding:28px;display:flex}.login-card label{color:var(--muted);flex-direction:column;gap:6px;display:flex}input{background:var(--panel-2);border:1px solid var(--border);color:var(--text);border-radius:8px;padding:9px 11px;font-size:14px}input:focus{outline:1px solid var(--accent)}.btn{background:var(--panel-2);border:1px solid var(--border);color:var(--text);cursor:pointer;border-radius:8px;padding:9px 14px;font-size:13px}.btn:hover{border-color:var(--accent)}.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}.btn:disabled{opacity:.5;cursor:default}.layout{height:100%;display:flex}.sidebar{background:var(--panel);border-right:1px solid var(--border);flex-direction:column;flex-shrink:0;width:220px;display:flex}.sidebar .brand{border-bottom:1px solid var(--border);padding:18px 16px}.sidebar nav{padding:8px;overflow-y:auto}.nav-item{color:var(--muted);border-radius:7px;margin-bottom:2px;padding:8px 12px;text-decoration:none;display:block}.nav-item:hover{background:var(--panel-2);color:var(--text)}.nav-item.active{background:var(--panel-2);color:var(--text);box-shadow:inset 2px 0 0 var(--accent)}.main{flex-direction:column;flex:1;min-width:0;display:flex}.topbar{border-bottom:1px solid var(--border);align-items:center;gap:16px;padding:12px 20px;display:flex}.search{flex:1;max-width:480px}.user{align-items:center;gap:10px;margin-left:auto;display:flex}.user .role{background:var(--panel-2);border:1px solid var(--border);color:var(--muted);border-radius:20px;padding:2px 10px;font-size:11px}.content{padding:24px;overflow-y:auto}.content h1{margin:0 0 4px;font-size:22px}.kpis{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px;margin-top:18px;display:grid}.kpi{background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:16px}.kpi-label{color:var(--muted);margin-bottom:8px;font-size:12px}.kpi-value{font-size:26px;font-weight:700}.kpi-value.good{color:var(--good)}.kpi-value.bad{color:var(--bad)}.placeholder-box{background:var(--panel);border:1px dashed var(--border);color:var(--muted);border-radius:10px;max-width:640px;margin-top:18px;padding:20px}.filter{width:100%;max-width:420px;margin:14px 0}.table{border-collapse:collapse;width:100%;margin-top:8px;font-size:13px}.table th,.table td{text-align:left;border-bottom:1px solid var(--border);padding:9px 12px}.table th{color:var(--muted);text-transform:uppercase;letter-spacing:.04em;font-size:11px;font-weight:600}.table tbody tr.clickable{cursor:pointer}.table tbody tr:hover{background:var(--panel)}.badge{border:1px solid var(--border);background:var(--panel-2);border-radius:20px;padding:2px 9px;font-size:11px;display:inline-block}.badge.ok{color:var(--good);border-color:#2f6f4a}.badge.info{color:#7cc4ff;border-color:#2f547a}.badge.warn{color:#f5c451;border-color:#7a6630}.badge.bad{color:var(--bad);border-color:#7a3535}.good{color:var(--good)}.bad{color:var(--bad)}.small{margin-top:12px;font-size:12px}.drawer-backdrop{z-index:50;background:#00000080;justify-content:flex-end;display:flex;position:fixed;inset:0}.drawer{background:var(--panel);border-left:1px solid var(--border);width:420px;max-width:90vw;height:100%;padding:20px;overflow-y:auto}.drawer-head{justify-content:space-between;align-items:center;margin-bottom:14px;display:flex}.drawer-head h2{margin:0;font-size:18px}.drawer h3{color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin:18px 0 6px;font-size:13px}.field{border-bottom:1px solid var(--border);justify-content:space-between;gap:16px;padding:7px 0;display:flex}.field-label{color:var(--muted)}.field-value{text-align:right}select,textarea{background:var(--panel-2);border:1px solid var(--border);color:var(--text);border-radius:8px;padding:9px 11px;font-family:inherit;font-size:14px}select:focus,textarea:focus{outline:1px solid var(--accent)}.row-tools{align-items:center;gap:10px;margin:10px 0;display:flex}.row-tools .filter,.row-tools input,.row-tools select{margin:0}.row-tools input[type=text]{flex:1;max-width:460px}.tabs{border-bottom:1px solid var(--border);gap:6px;margin:14px 0;display:flex}.tab{color:var(--muted);cursor:pointer;background:0 0;border:none;border-bottom:2px solid #0000;padding:8px 14px;font-size:13px}.tab.active{color:var(--text);border-bottom-color:var(--accent)}.thumbs{flex-wrap:wrap;gap:8px;margin-bottom:14px;display:flex}.thumbs img{object-fit:cover;border:1px solid var(--border);border-radius:6px;width:88px;height:66px}.content-row{background:var(--panel);border:1px solid var(--border);border-radius:9px;margin-bottom:8px;padding:12px}.content-key{color:var(--accent);margin-bottom:6px;font-family:monospace;font-size:12px}.content-row textarea{resize:vertical;width:100%;font-size:13px}.content-image{align-items:flex-start;gap:12px;display:flex}.content-image img{object-fit:cover;border:1px solid var(--border);border-radius:6px;width:120px;height:90px}.content-image>div{flex-direction:column;flex:1;gap:6px;display:flex}.content-image input{width:100%}.content-actions{align-items:center;gap:8px;margin-top:8px;display:flex}.file-btn{display:inline-block}.content h3{margin:22px 0 8px;font-size:14px}code{background:var(--panel-2);border-radius:4px;padding:1px 6px;font-family:monospace;font-size:12px}button.badge{cursor:pointer}.form-card{background:var(--panel);border:1px solid var(--border);border-radius:10px;margin:14px 0;padding:16px}.form-card h3{margin-top:0}.form-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;margin-bottom:12px;display:grid}.form-grid label,label.block{color:var(--muted);flex-direction:column;gap:5px;font-size:12px;display:flex}label.block{margin-bottom:12px}