:root{--bg:#0b132b;--card:#1c2541;--muted:#3a506b;--accent:#5bc0be;--text:#eaeaea;--danger:#e63946;--border:#2b3b57}
body.theme-light{--bg:#f5f7fb;--card:#ffffff;--muted:#cfd8e3;--accent:#3b82f6;--text:#0b132b;--danger:#dc2626;--border:#e5e7eb}
*{box-sizing:border-box}
body{font-family:Inter, system-ui, Arial, sans-serif;margin:0;background:var(--bg);color:var(--text);transition:background .2s,color .2s}
header{display:flex;justify-content:space-between;align-items:center;padding:10px 16px;background:#111a2f;border-bottom:1px solid #0f1b33;position:sticky;top:0;z-index:10}
body.theme-light header{background:#ffffff;border-bottom:1px solid var(--border)}
header h1{margin:0;font-size:18px;color:#cde7ff}
body.theme-light header h1{color:#0b132b}
.container{padding:20px}
.layout{max-width:1400px;margin:0 auto}
.sidebar{display:none}
.topnav{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.topnav .menu{display:flex;gap:10px;flex-wrap:wrap}
.topnav .dd{position:relative}
.topnav .dd-btn{padding:8px 12px;border-radius:8px;border:1px solid var(--border);background:#0e1c31;color:#e8f0ff}
body.theme-light .topnav .dd-btn{background:#ffffff;color:#0b132b}
.topnav .dd:hover .dd-menu{display:block}
.topnav .dd-menu{display:none;position:absolute;top:100%;left:0;background:var(--card);border:1px solid var(--border);border-radius:8px;min-width:240px;z-index:20;box-shadow:0 10px 30px rgba(0,0,0,.3)}
.topnav .dd-menu a{display:block;padding:8px 12px;color:var(--text);text-decoration:none}
.topnav .dd-menu a:hover{background:#122443}
body.theme-light .topnav .dd-menu a:hover{background:#f5f7fb}
.topnav .dd-menu .sep{height:1px;background:var(--border);margin:6px 0}
.content{min-width:0}
.tabs{display:none}
.tab{display:none}
.card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:16px;margin-bottom:16px}
.row{display:flex;gap:16px;flex-wrap:wrap}
.col{flex:1;min-width:320px}
label{display:block;font-size:12px;color:#c2d3e6;margin-bottom:4px}
input,select,button{width:100%;padding:10px;border-radius:10px;border:1px solid var(--border);background:#0e1c31;color:#e8f0ff}
body.theme-light input,body.theme-light select,body.theme-light button{background:#ffffff;color:#0b132b}
button{cursor:pointer;background:var(--accent);border-color:var(--accent);color:#02131a;font-weight:600}
button.outline{background:transparent;color:var(--accent)}
.badge{display:inline-flex;align-items:center;gap:6px;padding:2px 8px;border-radius:999px;font-size:12px;border:1px solid #2a415f;background:#0f1e33;color:#a9c9ff}
.badge .dot{width:8px;height:8px;border-radius:50%}
.dot.green{background:#2ecc71}.dot.red{background:#e74c3c}.dot.yellow{background:#f1c40f}
.table{width:100%;border-collapse:separate;border-spacing:0 6px}
.table th,.table td{padding:10px 12px;text-align:left}
.table tr{background:#15233a;border:1px solid var(--border)}
body.theme-light .table tr{background:#ffffff}
.table th{font-size:12px;color:#a9c9ff}
.kv{display:grid;grid-template-columns:160px 1fr;gap:6px;font-size:14px}
.helper{font-size:12px;color:#9eb5d4}
.flex{display:flex;gap:8px}
.search{max-width:280px}
.notice{padding:10px 12px;border-radius:10px;background:#0e1e2a;border:1px solid #244558;color:#bfe6ff}
body.theme-light .notice{background:#f9fafb;border-color:var(--border);color:#0b132b}

/* Responsive */
@media (max-width: 980px){
  .topnav .dd{width:100%}
}
.msg{color:#2ecc71;margin:8px 0}
.err{color:#e63946;margin:8px 0}
