:root{
  --brand:#1a3c6e; --brand-light:#2a5298; --accent:#e85d04;
  --bg:#f4f6fb; --card:#fff; --border:#d1d9e6; --text:#1e2535; --muted:#6b7280;
  --green:#16a34a; --red:#dc2626; --yellow:#d97706; --blue:#1d4ed8; --row:#f8faff;
}
*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:'Segoe UI',system-ui,sans-serif;background:var(--bg);color:var(--text);font-size:14px;}
h1{font-size:16px;} label{display:block;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin:8px 0 3px;}
input,select,textarea{width:100%;padding:7px 9px;border:1px solid var(--border);border-radius:6px;font-size:13px;background:#fff;color:var(--text);font-family:inherit;}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--brand-light);box-shadow:0 0 0 3px rgba(42,82,152,.12);}
.logo{width:42px;height:42px;background:var(--accent);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:19px;font-weight:900;color:#fff;flex-shrink:0;}

/* login */
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--brand),var(--brand-light));}
.login-card{background:#fff;border-radius:14px;width:400px;max-width:92vw;overflow:hidden;box-shadow:0 24px 60px rgba(0,0,0,.35);}
.login-head{background:var(--brand);color:#fff;padding:18px 22px;display:flex;gap:12px;align-items:center;border-bottom:3px solid var(--accent);}
.login-head p{font-size:11px;opacity:.75;}
.login-body{padding:20px 22px 24px;}
.login-note{font-size:10.5px;color:var(--muted);text-align:center;margin-top:14px;}

/* shell */
header{background:var(--brand);color:#fff;padding:10px 22px;display:flex;align-items:center;gap:13px;border-bottom:3px solid var(--accent);}
header p{font-size:11px;opacity:.75;}
.phase-tag{background:var(--accent);font-size:10px;padding:2px 8px;border-radius:10px;vertical-align:2px;margin-left:6px;}
.user-chip{margin-left:auto;display:flex;align-items:center;gap:9px;font-size:12.5px;}
.btn-ghost{background:rgba(255,255,255,.12);border:none;color:#fff;padding:5px 11px;border-radius:6px;cursor:pointer;font-size:12px;}
.btn-ghost:hover{background:rgba(255,255,255,.25);}
.nav{display:flex;gap:2px;background:#fff;border-bottom:2px solid var(--border);padding:0 18px;overflow-x:auto;position:sticky;top:0;z-index:40;}
.nav button{background:none;border:none;padding:11px 14px;font-size:12.5px;font-weight:600;color:var(--muted);cursor:pointer;border-bottom:3px solid transparent;white-space:nowrap;font-family:inherit;}
.nav button:hover{color:var(--brand);background:var(--bg);}
.nav button.active{color:var(--brand);border-bottom-color:var(--accent);}
main{padding:16px 20px;max-width:1500px;margin:0 auto;}

/* cards / tables */
.card{background:var(--card);border:1px solid var(--border);border-radius:10px;overflow:hidden;margin-bottom:16px;}
.card-header{background:var(--brand);color:#fff;padding:9px 14px;font-weight:600;font-size:12.5px;display:flex;align-items:center;gap:9px;}
.card-body{padding:14px;}
.toolbar{display:flex;gap:8px;align-items:center;padding:9px 14px;border-bottom:1px solid var(--border);flex-wrap:wrap;}
.toolbar input[type=text]{width:230px;padding:5px 9px;}
.count{margin-left:auto;font-size:11.5px;color:var(--muted);background:var(--bg);border:1px solid var(--border);border-radius:5px;padding:3px 9px;}
.table-wrap{overflow-x:auto;max-height:calc(100vh - 275px);overflow-y:auto;}
table{width:100%;border-collapse:collapse;font-size:12.5px;}
thead th{background:var(--brand);color:#fff;padding:8px 9px;text-align:left;font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap;position:sticky;top:0;z-index:2;}
tbody tr{border-bottom:1px solid var(--border);}
tbody tr:nth-child(even){background:var(--row);}
tbody tr:hover{background:#eff6ff;}
td{padding:7px 9px;vertical-align:middle;}
td.mono{font-family:'Courier New',monospace;font-weight:700;color:var(--brand);}
.empty{text-align:center;padding:32px;color:var(--muted);}

/* tiles */
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-bottom:16px;}
.tile{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:13px 15px;border-left:4px solid var(--brand);}
.tile b{font-size:23px;color:var(--brand);display:block;margin-top:3px;}
.tile span{font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:600;}
.tile.warn{border-left-color:var(--yellow);} .tile.warn b{color:var(--yellow);}
.tile.good{border-left-color:var(--green);} .tile.good b{color:var(--green);}

/* form grid */
.fgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px 12px;}
.fgrid .span2{grid-column:span 2;} .fgrid .span4{grid-column:span 4;}
@media(max-width:900px){.fgrid{grid-template-columns:1fr 1fr;}}

/* buttons & badges */
.btn-primary{padding:9px 18px;background:var(--brand);color:#fff;border:none;border-radius:7px;font-size:13px;font-weight:600;cursor:pointer;width:100%;margin-top:10px;font-family:inherit;}
.btn-primary:hover{background:var(--brand-light);}
.btn-secondary{padding:6px 13px;background:#fff;color:var(--brand);border:1px solid var(--brand);border-radius:6px;font-size:12px;font-weight:600;cursor:pointer;font-family:inherit;}
.btn-secondary:hover{background:var(--brand);color:#fff;}
.btn-sm{padding:4px 10px;font-size:11.5px;border-radius:5px;cursor:pointer;border:1px solid var(--border);background:#fff;font-family:inherit;font-weight:600;}
.btn-sm.edit{color:var(--blue);border-color:#bfdbfe;} .btn-sm.edit:hover{background:#dbeafe;}
.btn-sm.ok{color:var(--green);border-color:#bbf7d0;} .btn-sm.ok:hover{background:#dcfce7;}
.btn-sm.warn{color:var(--yellow);border-color:#fde68a;} .btn-sm.warn:hover{background:#fef3c7;}
.badge{display:inline-block;padding:2px 8px;border-radius:4px;font-size:10.5px;font-weight:700;}
.badge-blue{background:#dbeafe;color:var(--blue);} .badge-green{background:#dcfce7;color:var(--green);}
.badge-red{background:#fee2e2;color:var(--red);} .badge-yellow{background:#fef3c7;color:var(--yellow);}
.badge-gray{background:#f3f4f6;color:var(--muted);}
.err{color:var(--red);font-size:12px;min-height:16px;margin-top:6px;}

/* modal & toast */
.overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:100;display:none;align-items:center;justify-content:center;}
.overlay.open{display:flex;}
.modal{background:#fff;border-radius:12px;width:560px;max-width:94vw;max-height:92vh;display:flex;flex-direction:column;overflow:hidden;}
.modal-head{background:var(--brand);color:#fff;padding:11px 16px;font-weight:700;display:flex;justify-content:space-between;align-items:center;}
.modal-head button{background:rgba(255,255,255,.15);border:none;color:#fff;width:26px;height:26px;border-radius:5px;cursor:pointer;}
.modal-body{padding:16px;overflow-y:auto;}
.modal-foot{padding:12px 16px;border-top:1px solid var(--border);display:flex;gap:10px;justify-content:flex-end;background:#fafbff;}
.toast{position:fixed;bottom:22px;right:22px;color:#fff;padding:9px 16px;border-radius:8px;font-size:13px;font-weight:600;opacity:0;transform:translateY(10px);transition:all .3s;pointer-events:none;z-index:999;background:var(--green);}
.toast.show{opacity:1;transform:translateY(0);}
.toast.warn{background:var(--yellow);}
.mh-row{display:grid;grid-template-columns:2fr 1fr auto;gap:8px;margin-bottom:6px;align-items:center;}
.gate-note{background:#eff6ff;border:1px solid #bfdbfe;color:#1e40af;border-radius:7px;padding:8px 11px;font-size:11.5px;margin:10px 0;line-height:1.5;}
