:root{
  --bg:#07111f;
  --panel:#101d31;
  --panel-2:#14243b;
  --line:rgba(172,190,224,.18);
  --text:#f4f7fb;
  --muted:#a9b7d1;
  --blue:#6fa0ff;
  --green:#27d49b;
  --amber:#f0bd4f;
  --red:#ff6b7d;
  --shadow:0 24px 70px rgba(0,0,0,.34);
}
*{box-sizing:border-box}
body{margin:0;background:radial-gradient(circle at 88% 8%,rgba(39,212,155,.13),transparent 32%),linear-gradient(180deg,#081426,#050c17);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
button,input,select,textarea{font:inherit}
button{border:1px solid var(--line);background:#1a2941;color:var(--text);border-radius:14px;padding:11px 16px;font-weight:800;cursor:pointer}
button:hover{border-color:rgba(111,160,255,.52);transform:translateY(-1px)}
button.primary{background:linear-gradient(180deg,#2b5599,#203c72);border-color:rgba(111,160,255,.7)}
button.danger{background:#3a1c28;border-color:rgba(255,107,125,.42)}
button.good{background:#123b32;border-color:rgba(39,212,155,.5)}
input,select,textarea{width:100%;border:1px solid var(--line);border-radius:13px;background:#08111f;color:var(--text);padding:12px 13px;outline:none}
textarea{min-height:96px;resize:vertical}
label{display:grid;gap:7px;color:var(--muted);font-size:13px;font-weight:700}
table{width:100%;border-collapse:collapse}
th,td{padding:13px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
th{color:#bdc9e4;font-size:13px}
.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 28px;background:rgba(7,17,31,.88);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:14px;min-width:0}
.brand-mark{width:56px;height:56px;border-radius:18px;border:1px solid rgba(111,160,255,.42);display:grid;place-items:center;background:#0e1d33;font-weight:900;overflow:hidden;color:#ff9f43}
.brand-mark img{width:100%;height:100%;object-fit:cover}
h1,h2,h3,p{margin:0}
h1{font-size:24px;line-height:1.1}
h2{font-size:24px}
h3{font-size:20px}
p{color:var(--muted);line-height:1.45}
.top-actions,.tabs,.section-head,.search-row,.modal-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.session-pill,.pill{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.04);padding:8px 12px;color:#d9e3f8;font-weight:800}
.pill.good{border-color:rgba(39,212,155,.45);color:#a7f3d0}
.pill.warn{border-color:rgba(240,189,79,.45);color:#ffe0a3}
.pill.bad{border-color:rgba(255,107,125,.45);color:#ffc0c8}
.shell{max-width:1480px;margin:0 auto;padding:24px}
.tabs{margin-bottom:18px}
.tabs button{border-radius:16px;background:#111d30}
.tabs button.active{background:#233c67;border-color:rgba(111,160,255,.72)}
.hidden{display:none!important}
.notice{border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.04);padding:14px;color:var(--muted)}
.kpi-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;margin-bottom:22px}
.kpi{border:1px solid var(--line);background:linear-gradient(180deg,var(--panel-2),var(--panel));border-radius:20px;padding:16px;box-shadow:var(--shadow)}
.kpi small{display:block;color:var(--muted);font-weight:800}
.kpi b{display:block;font-size:28px;margin-top:8px}
.section-head{justify-content:space-between;margin:18px 0 14px}
.route-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.route-card,.unit-card,.panel,.table-panel{border:1px solid var(--line);background:rgba(16,29,49,.92);border-radius:22px;padding:16px;box-shadow:var(--shadow)}
.route-card{display:grid;gap:13px}
.route-card.selected{outline:2px solid rgba(111,160,255,.62)}
.route-title{display:flex;justify-content:space-between;gap:12px}
.route-title b{font-size:18px}
.meta-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.meta-tile{border:1px solid var(--line);border-radius:14px;background:#0a1525;padding:10px;color:var(--muted)}
.meta-tile b{display:block;color:var(--text);font-size:17px;margin-top:3px}
.card-actions{display:flex;gap:8px;flex-wrap:wrap}
.ops-layout{display:grid;grid-template-columns:minmax(320px,430px) minmax(0,1fr);gap:16px;align-items:start}
.stack{display:grid;gap:10px}
.route-row{border:1px solid var(--line);border-radius:16px;background:#0b1728;padding:13px;cursor:pointer}
.route-row:hover,.route-row.active{border-color:rgba(111,160,255,.7);background:#142640}
.route-row b{display:block}
.route-row small{color:var(--muted)}
.route-ops{min-height:520px}
.empty-state{min-height:300px;display:grid;place-items:center;color:var(--muted);text-align:center}
.ops-head{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;margin-bottom:14px}
.ops-sections{display:grid;gap:14px}
.op-section{border:1px solid var(--line);border-radius:18px;background:#0b1728;padding:14px}
.op-section h3{font-size:17px;margin-bottom:10px}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}
.form-grid .full{grid-column:1/-1}
.inline-form{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;align-items:end}
.inline-form .wide{grid-column:span 2}
.mini-list{max-height:260px;overflow:auto;border:1px solid var(--line);border-radius:14px;margin-top:12px}
.vehicle-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.unit-card{display:grid;gap:10px}
.unit-avatar{height:130px;border-radius:16px;border:1px solid var(--line);background:#08111f;display:grid;place-items:center;overflow:hidden;color:var(--muted);font-weight:900}
.unit-avatar img{width:100%;height:100%;object-fit:contain}
.modal{position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:22px}
.modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.62);backdrop-filter:blur(6px)}
.modal-card{position:relative;z-index:1;width:min(1040px,96vw);max-height:90vh;overflow:auto;border:1px solid var(--line);border-radius:24px;background:#111b2d;padding:18px;box-shadow:var(--shadow)}
.modal-card.small{width:min(720px,96vw)}
.modal-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;border-bottom:1px solid var(--line);padding-bottom:14px;margin-bottom:14px}
.chat-card{width:min(780px,96vw)}
.chat-log{height:430px;overflow:auto;border:1px solid var(--line);border-radius:18px;background:#08111f;padding:14px;display:grid;gap:10px;align-content:start}
.chat-msg{display:grid;grid-template-columns:44px 1fr;gap:10px}
.chat-avatar-wrap{position:relative;display:grid;place-items:start center;min-width:44px}
.chat-avatar{width:38px;height:38px;border-radius:14px;background:#213858;display:grid;place-items:center;overflow:hidden;font-weight:900}
.chat-avatar img{width:100%;height:100%;object-fit:cover}
.chat-bubble{border:1px solid var(--line);background:#101d31;border-radius:16px;padding:10px}
.chat-bubble small{display:flex;align-items:center;gap:6px;flex-wrap:wrap;color:var(--muted);margin-bottom:4px}
.chat-seat-badge{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:20px;padding:0 7px;border-radius:999px;border:1px solid rgba(255,138,42,.42);background:linear-gradient(135deg,rgba(255,138,42,.24),rgba(245,199,91,.13));color:#ffe4c2;font-size:10px;font-weight:950;line-height:1}
.chat-avatar-wrap>.chat-seat-badge{position:absolute;left:50%;bottom:-9px;transform:translateX(-50%);max-width:54px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;box-shadow:0 6px 14px rgba(0,0,0,.18)}
.chat-compose{display:grid;grid-template-columns:1fr auto;gap:10px;margin-top:12px}
.right{text-align:right}
@media (max-width:1100px){
  .kpi-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .route-grid,.ops-layout{grid-template-columns:1fr}
  .vehicle-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .inline-form{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:720px){
  .topbar{align-items:flex-start;flex-direction:column;padding:16px}
  .shell{padding:14px}
  .kpi-grid,.vehicle-grid,.form-grid,.inline-form{grid-template-columns:1fr}
  .inline-form .wide{grid-column:auto}
}
