:root {
    --bg: #f6f8fb;
    --panel: #ffffff;
    --panel-2: #f1f5f9;
    --text: #0f172a;
    --muted: #64748b;
    --border: rgba(15, 23, 42, .10);
    --primary: #111827;
    --red: #dc2626;
    --red-2: #ef4444;
    --green: #10b981;
    --blue: #2563eb;
    --amber: #f59e0b;
    --shadow: 0 24px 80px rgba(15, 23, 42, .10);
    --radius: 24px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    margin: 0;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    background: var(--bg);
    color: var(--text);
}
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }

.login-body, .ground-body, .control-body, .response-body {
    min-height: 100vh;
}

.login-body {
    display: grid;
    place-items: center;
    padding: 24px;
    background:
        radial-gradient(circle at top left, rgba(220,38,38,.18), transparent 34%),
        radial-gradient(circle at bottom right, rgba(37,99,235,.16), transparent 36%),
        #07111f;
    color: #fff;
}

.login-card {
    width: min(460px, 100%);
    padding: 34px;
    border-radius: 32px;
    background: rgba(15, 23, 42, .78);
    border: 1px solid rgba(255,255,255,.10);
    box-shadow: 0 34px 100px rgba(0,0,0,.42);
    backdrop-filter: blur(20px);
}
.brand-row { display: flex; gap: 14px; align-items: center; margin-bottom: 22px; }
.brand-logo {
    width: 48px; height: 48px; border-radius: 16px;
    display: grid; place-items: center;
    background: linear-gradient(145deg, #ef4444, #991b1b);
    box-shadow: 0 18px 40px rgba(220, 38, 38, .35);
    font-weight: 900;
}
.brand-title { font-weight: 900; font-size: 20px; letter-spacing: -.03em; }
.brand-sub { color: #94a3b8; font-size: 13px; margin-top: 2px; }

.form-group { margin-bottom: 16px; }
.label { display: block; margin-bottom: 7px; font-size: 13px; color: var(--muted); font-weight: 700; }
.login-card .label { color: #cbd5e1; }
.input, .select, .textarea {
    width: 100%; border: 1px solid var(--border); border-radius: 16px;
    background: #fff; padding: 14px 15px; outline: none;
    transition: border-color .2s, box-shadow .2s, background .2s;
}
.login-card .input { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.14); color: #fff; }
.input:focus, .select:focus, .textarea:focus { border-color: rgba(37,99,235,.55); box-shadow: 0 0 0 4px rgba(37,99,235,.12); }
.btn {
    display: inline-flex; justify-content: center; align-items: center; gap: 8px;
    min-height: 44px; padding: 12px 17px; border: none; border-radius: 15px;
    background: #111827; color: #fff; font-weight: 900; cursor: pointer;
    transition: transform .16s, opacity .16s, background .16s;
}
.btn:hover { transform: translateY(-1px); }
.btn:active { transform: translateY(0); }
.btn.primary { background: linear-gradient(135deg, #111827, #374151); }
.btn.red { background: linear-gradient(135deg, #ef4444, #b91c1c); }
.btn.green { background: linear-gradient(135deg, #10b981, #047857); }
.btn.blue { background: linear-gradient(135deg, #2563eb, #1d4ed8); }
.btn.ghost { background: transparent; color: var(--text); border: 1px solid var(--border); }
.btn.full { width: 100%; }
.btn.large { min-height: 62px; border-radius: 20px; font-size: 18px; }

.alert {
    padding: 14px 16px; border-radius: 16px; margin-bottom: 16px; font-size: 14px;
    border: 1px solid rgba(255,255,255,.1);
}
.alert.error { background: rgba(220,38,38,.13); color: #fecaca; border-color: rgba(248,113,113,.26); }
.alert.success { background: rgba(16,185,129,.12); color: #a7f3d0; border-color: rgba(16,185,129,.24); }
.page-shell { display: flex; min-height: 100vh; }
.sidebar {
    width: 280px; padding: 22px; background: #0f172a; color: #fff;
    border-right: 1px solid rgba(255,255,255,.08); position: sticky; top: 0; height: 100vh;
}
.side-nav { margin-top: 28px; display: grid; gap: 8px; }
.side-link {
    padding: 12px 14px; border-radius: 15px; color: #cbd5e1; display: flex; justify-content: space-between; align-items: center;
}
.side-link:hover, .side-link.active { background: rgba(255,255,255,.08); color: #fff; }
.main-content { flex: 1; padding: 28px; min-width: 0; }
.topbar { display: flex; justify-content: space-between; gap: 16px; align-items: center; margin-bottom: 22px; }
.page-title { margin: 0; font-size: clamp(24px, 3vw, 36px); letter-spacing: -.04em; }
.page-subtitle { margin: 6px 0 0; color: var(--muted); }
.grid { display: grid; gap: 18px; }
.grid.cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.grid.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid.cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.card {
    background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius);
    box-shadow: var(--shadow); padding: 22px;
}
.card.flat { box-shadow: none; }
.stat-label { color: var(--muted); font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.stat-value { font-size: 38px; font-weight: 950; letter-spacing: -.05em; margin-top: 8px; }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { padding: 13px 12px; text-align: left; border-bottom: 1px solid var(--border); font-size: 14px; vertical-align: middle; }
th { color: var(--muted); font-size: 12px; text-transform: uppercase; letter-spacing: .08em; }
.badge { display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px; border-radius: 999px; font-size: 12px; font-weight: 900; background: #eef2ff; color: #3730a3; }
.badge.good { background: rgba(16,185,129,.12); color: #047857; }
.badge.danger { background: rgba(220,38,38,.12); color: #b91c1c; }
.badge.warn { background: rgba(245,158,11,.15); color: #b45309; }
.badge.muted { background: #e5e7eb; color: #475569; }
.actions { display: flex; flex-wrap: wrap; gap: 8px; }

.control-body {
    background:
        radial-gradient(circle at top left, rgba(220,38,38,.16), transparent 32%),
        #050b14;
    color: #fff;
}
.control-shell { min-height: 100vh; padding: 22px; }
.control-header { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding-bottom: 18px; border-bottom: 1px solid rgba(255,255,255,.08); }
.control-title { margin: 0; font-size: 30px; letter-spacing: -.05em; }
.live-dot { width: 10px; height: 10px; border-radius: 999px; background: #10b981; box-shadow: 0 0 0 8px rgba(16,185,129,.12); display: inline-block; }
.bento { display: grid; grid-template-columns: repeat(12, 1fr); gap: 16px; margin-top: 20px; }
.tile { background: rgba(15,23,42,.86); border: 1px solid rgba(255,255,255,.09); border-radius: 28px; padding: 20px; box-shadow: 0 24px 80px rgba(0,0,0,.28); }
.tile.red { background: linear-gradient(145deg, rgba(127,29,29,.78), rgba(15,23,42,.9)); border-color: rgba(248,113,113,.25); }
.tile.c3 { grid-column: span 3; } .tile.c4 { grid-column: span 4; } .tile.c5 { grid-column: span 5; } .tile.c6 { grid-column: span 6; } .tile.c7 { grid-column: span 7; } .tile.c8 { grid-column: span 8; } .tile.c12 { grid-column: span 12; }
.dark-muted { color: #94a3b8; }
.feed { display: grid; gap: 12px; max-height: 560px; overflow: auto; padding-right: 3px; }
.incident-card { border: 1px solid rgba(255,255,255,.09); background: rgba(2,6,23,.55); border-radius: 20px; padding: 16px; }
.incident-head { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; }
.map-box { height: 520px; border-radius: 22px; overflow: hidden; border: 1px solid rgba(255,255,255,.08); background: #0f172a; }
.map-fallback { height: 100%; display:grid; place-items:center; color:#64748b; text-align:center; padding:22px; }

.ground-body {
    background: radial-gradient(circle at top, rgba(239,68,68,.20), transparent 33%), #050b14;
    color: #fff; display: grid; place-items: center; padding: 22px; touch-action: manipulation;
}
.ground-card { width: min(520px, 100%); text-align: center; }
.safety-pill { display:inline-flex; gap:9px; align-items:center; padding: 10px 14px; border-radius:999px; color:#a7f3d0; background: rgba(16,185,129,.10); border:1px solid rgba(16,185,129,.22); font-weight:800; font-size:13px; }
.sos-zone { position: relative; height: 330px; display: grid; place-items: center; margin: 18px 0; }
.sos-btn {
    position: relative; width: 260px; height: 260px; border-radius: 999px; border: 6px solid rgba(254,202,202,.36);
    background: radial-gradient(circle at 35% 20%, #fb7185, #dc2626 45%, #7f1d1d);
    color: #fff; cursor: pointer; box-shadow: 0 0 0 14px rgba(220,38,38,.12), 0 0 0 34px rgba(220,38,38,.07), 0 32px 90px rgba(220,38,38,.36);
    display: flex; flex-direction: column; align-items: center; justify-content: center; transition: transform .15s;
}
.sos-btn:active { transform: scale(.96); }
.sos-main { font-size: 62px; font-weight: 1000; letter-spacing: -.07em; }
.sos-sub { font-size: 13px; text-transform: uppercase; letter-spacing: .24em; color:#fee2e2; }
.pulse-ring { position: absolute; width: 270px; height: 270px; border-radius: 999px; background: rgba(239,68,68,.25); animation: pulseRing 1.8s infinite; }
@keyframes pulseRing { 0%{ transform: scale(.92); opacity:.9; } 100%{ transform: scale(1.22); opacity:0; } }
.hidden { display: none !important; }
.countdown-box { border-radius: 28px; background: rgba(127,29,29,.48); border: 1px solid rgba(248,113,113,.25); padding: 20px; }
.countdown-number { font-size: 72px; font-weight: 1000; color: #fca5a5; line-height: 1; }
.status-box { min-height: 30px; color: #cbd5e1; margin-top: 15px; }

.response-body { background: #08111f; color: #fff; padding: 16px; }
.response-header { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:18px; }
.response-list { display:grid; gap:14px; }
.response-card { border-radius:26px; padding:18px; background:rgba(15,23,42,.9); border:1px solid rgba(255,255,255,.08); }
.big-actions { display:grid; gap:10px; margin-top:14px; }
.status-slider { position:relative; background:#172033; border:1px solid rgba(255,255,255,.08); border-radius:999px; height:62px; overflow:hidden; margin-top:12px; }
.status-slider button { width:100%; height:100%; border:0; color:#fff; background:transparent; font-weight:1000; cursor:pointer; }
.status-slider::before { content:""; position:absolute; inset:0; width:35%; background:linear-gradient(135deg, rgba(16,185,129,.5), rgba(37,99,235,.35)); border-radius:999px; pointer-events:none; }
.camera-input { width:100%; border:1px dashed rgba(255,255,255,.20); border-radius:18px; padding:14px; margin-top:10px; color:#cbd5e1; }

@media (max-width: 1100px) {
    .grid.cols-4, .grid.cols-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .bento { grid-template-columns: repeat(6, 1fr); }
    .tile.c3, .tile.c4, .tile.c5, .tile.c6, .tile.c7, .tile.c8 { grid-column: span 6; }
}
@media (max-width: 760px) {
    .page-shell { display:block; }
    .sidebar { width:100%; height:auto; position:relative; }
    .main-content { padding:18px; }
    .topbar { align-items:flex-start; flex-direction:column; }
    .grid.cols-4, .grid.cols-3, .grid.cols-2 { grid-template-columns: 1fr; }
    .bento { grid-template-columns: 1fr; }
    .tile, .tile.c3, .tile.c4, .tile.c5, .tile.c6, .tile.c7, .tile.c8, .tile.c12 { grid-column: span 1; }
    .control-shell { padding:14px; }
    .control-header { flex-direction:column; align-items:flex-start; }
    .map-box { height: 360px; }
    .sos-btn { width:230px; height:230px; }
    .sos-zone { height: 300px; }
}

/* Standalone department login portals */
.department-login::before,
.portal-hub-body::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
    background-size: 42px 42px;
    mask-image: radial-gradient(circle at center, black 0%, transparent 72%);
}
.department-card { position: relative; overflow: hidden; }
.department-card::after {
    content: "";
    position: absolute;
    inset: auto -30% -45% -30%;
    height: 180px;
    background: radial-gradient(circle, rgba(255,255,255,.10), transparent 68%);
    pointer-events: none;
}
.portal-badge {
    display: inline-flex;
    margin-bottom: 18px;
    padding: 8px 12px;
    border-radius: 999px;
    color: #e2e8f0;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.12);
}
.login-note {
    color: #94a3b8;
    font-size: 13px;
    line-height: 1.6;
    margin: 18px 0 0;
}
.department-switcher {
    margin-top: 18px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
}
.department-switcher a {
    text-align: center;
    padding: 10px 8px;
    border-radius: 13px;
    color: #cbd5e1;
    font-size: 12px;
    font-weight: 900;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.10);
}
.department-switcher a:hover { background: rgba(255,255,255,.10); color:#fff; }
.department-admin {
    background:
        radial-gradient(circle at top left, rgba(245,158,11,.20), transparent 34%),
        radial-gradient(circle at bottom right, rgba(239,68,68,.18), transparent 36%),
        #07111f;
}
.department-control {
    background:
        radial-gradient(circle at top left, rgba(37,99,235,.22), transparent 34%),
        radial-gradient(circle at bottom right, rgba(220,38,38,.18), transparent 36%),
        #050b14;
}
.department-response {
    background:
        radial-gradient(circle at top left, rgba(16,185,129,.20), transparent 34%),
        radial-gradient(circle at bottom right, rgba(37,99,235,.18), transparent 36%),
        #06121f;
}
.department-ground {
    background:
        radial-gradient(circle at top left, rgba(220,38,38,.26), transparent 34%),
        radial-gradient(circle at bottom right, rgba(245,158,11,.14), transparent 36%),
        #080b12;
}
.portal-hub {
    width: min(1080px, 100%);
    position: relative;
    z-index: 1;
}
.hub-brand {
    justify-content: center;
    text-align: left;
    margin-bottom: 26px;
}
.portal-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}
.portal-card {
    min-height: 245px;
    padding: 24px;
    border-radius: 30px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    border: 1px solid rgba(255,255,255,.11);
    background: rgba(15, 23, 42, .76);
    box-shadow: 0 34px 100px rgba(0,0,0,.36);
    backdrop-filter: blur(18px);
    position: relative;
    overflow: hidden;
    transition: transform .18s, border-color .18s, background .18s;
}
.portal-card:hover {
    transform: translateY(-4px);
    border-color: rgba(255,255,255,.22);
    background: rgba(15, 23, 42, .90);
}
.portal-card::before {
    content: "";
    position: absolute;
    inset: -40% -40% auto auto;
    width: 180px;
    height: 180px;
    border-radius: 999px;
    opacity: .35;
    background: #ef4444;
}
.portal-card.admin::before { background: #f59e0b; }
.portal-card.control::before { background: #2563eb; }
.portal-card.response::before { background: #10b981; }
.portal-card.ground::before { background: #ef4444; }
.portal-card span {
    color: #cbd5e1;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .10em;
    font-weight: 900;
    position: relative;
}
.portal-card strong {
    color: #fff;
    font-size: 25px;
    letter-spacing: -.04em;
    margin-top: 8px;
    position: relative;
}
.portal-card small {
    color: #94a3b8;
    line-height: 1.55;
    margin-top: 12px;
    position: relative;
}
.hub-note {
    margin: 20px auto 0;
    max-width: 760px;
    text-align: center;
    color: #94a3b8;
    line-height: 1.7;
    font-size: 14px;
}
@media (max-width: 950px) {
    .portal-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
    .portal-grid { grid-template-columns: 1fr; }
    .portal-card { min-height: 190px; }
    .department-switcher { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.map-header { display:flex; justify-content:space-between; align-items:flex-start; gap:14px; margin-bottom:12px; }
.map-legend { display:flex; flex-wrap:wrap; gap:8px; justify-content:flex-end; font-size:12px; font-weight:900; color:#cbd5e1; }
.map-legend span { display:inline-flex; align-items:center; gap:6px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.08); border-radius:999px; padding:7px 9px; }
.legend-dot { width:10px; height:10px; border-radius:999px; display:inline-block; box-shadow:0 0 0 4px rgba(255,255,255,.05); }
.legend-dot.green { background:#10b981; }
.legend-dot.red { background:#dc2626; }
.legend-dot.yellow { background:#f59e0b; }
.legend-dot.blue { background:#2563eb; }
.marker-person { width:34px; height:34px; border-radius:999px; display:grid; place-items:center; color:white; border:3px solid white; box-shadow:0 10px 28px rgba(0,0,0,.42); font-size:12px; font-weight:1000; }
.marker-person.response { width:28px; height:28px; font-size:11px; }
.signal-badge { display:inline-flex; align-items:center; gap:6px; border-radius:999px; padding:6px 10px; font-size:12px; font-weight:1000; border:1px solid rgba(255,255,255,.12); }
.signal-badge.normal { color:#a7f3d0; background:rgba(16,185,129,.13); }
.signal-badge.armed { color:#fecaca; background:rgba(220,38,38,.18); }
.signal-badge.medical { color:#fde68a; background:rgba(245,158,11,.18); }
.signal-badge.suspicion { color:#bfdbfe; background:rgba(37,99,235,.18); }
.alert-type-grid { display:grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap:10px; margin-top:10px; }
.alert-action { border:1px solid rgba(255,255,255,.11); border-radius:20px; padding:14px; color:#fff; cursor:pointer; text-align:left; min-height:86px; box-shadow:0 20px 52px rgba(0,0,0,.2); transition: transform .15s, opacity .15s; }
.alert-action:active { transform:scale(.98); }
.alert-action strong { display:block; font-size:15px; margin-bottom:5px; }
.alert-action span { color:rgba(255,255,255,.78); font-size:12px; line-height:1.35; }
.alert-action.medical { background:linear-gradient(135deg, rgba(245,158,11,.95), rgba(146,64,14,.92)); }
.alert-action.suspicion { background:linear-gradient(135deg, rgba(37,99,235,.95), rgba(30,64,175,.92)); }
.gps-panel { margin-top:16px; padding:13px 14px; border-radius:20px; background:rgba(16,185,129,.10); border:1px solid rgba(16,185,129,.18); color:#d1fae5; font-size:13px; line-height:1.45; }
@media (max-width: 720px) {
    .map-header { display:block; }
    .map-legend { justify-content:flex-start; margin-top:10px; }
    .alert-type-grid { grid-template-columns: 1fr; }
}

/* Ground duty logout lock */
.duty-lock-panel {
    margin: 16px auto 0;
    padding: 14px 16px;
    border-radius: 20px;
    background: rgba(245, 158, 11, .12);
    border: 1px solid rgba(245, 158, 11, .28);
    color: #fde68a;
    font-size: 13px;
    line-height: 1.45;
    text-align: left;
    max-width: 460px;
}
.duty-lock-panel strong {
    display: block;
    color: #fff7ed;
    font-size: 14px;
    margin-bottom: 4px;
}
.duty-lock-panel.duty-warning {
    background: rgba(220, 38, 38, .14);
    border-color: rgba(248, 113, 113, .28);
    color: #fecaca;
}
.duty-logout.locked,
.btn[disabled].duty-logout {
    opacity: .56;
    cursor: not-allowed;
    color: #cbd5e1 !important;
    border-color: rgba(255,255,255,.12) !important;
}
.duty-logout.locked:hover,
.btn[disabled].duty-logout:hover {
    transform: none;
}

/* Professional department chat */
.ops-chat-widget {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 9999;
    font-family: inherit;
}
.ops-chat-launcher {
    min-width: 92px;
    height: 54px;
    border: 0;
    border-radius: 999px;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    background: linear-gradient(135deg, #111827, #dc2626);
    box-shadow: 0 18px 55px rgba(0,0,0,.32);
    font-weight: 1000;
}
.ops-chat-pulse {
    width: 10px;
    height: 10px;
    border-radius: 999px;
    background: #10b981;
    box-shadow: 0 0 0 7px rgba(16,185,129,.17);
}
.ops-chat-panel {
    display: none;
    position: absolute;
    right: 0;
    bottom: 66px;
    width: min(420px, calc(100vw - 28px));
    height: min(660px, calc(100vh - 110px));
    border-radius: 28px;
    overflow: hidden;
    color: #fff;
    background: rgba(15, 23, 42, .97);
    border: 1px solid rgba(255,255,255,.11);
    box-shadow: 0 30px 110px rgba(0,0,0,.48);
    backdrop-filter: blur(18px);
}
.ops-chat-widget.open .ops-chat-panel { display: grid; grid-template-rows: auto auto 1fr auto auto; }
.ops-chat-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    padding: 16px 16px 12px;
    border-bottom: 1px solid rgba(255,255,255,.08);
}
.ops-chat-header strong { display:block; font-size: 16px; letter-spacing: -.02em; }
.ops-chat-header span { color:#94a3b8; font-size: 12px; display:block; margin-top:2px; }
.ops-chat-close {
    width: 34px;
    height: 34px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.07);
    color: #fff;
    font-size: 24px;
    cursor: pointer;
}
.ops-chat-room-row { display:flex; gap:8px; padding: 12px 14px; border-bottom:1px solid rgba(255,255,255,.07); }
.ops-chat-room, .ops-chat-input {
    width: 100%;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(2,6,23,.72);
    color: #fff;
    border-radius: 14px;
    padding: 10px 11px;
    outline: none;
}
.ops-chat-refresh, .ops-chat-send, .ops-chat-delete {
    border: 0;
    border-radius: 14px;
    padding: 10px 12px;
    color: #fff;
    background: #2563eb;
    cursor: pointer;
    font-weight: 900;
}
.ops-chat-messages {
    overflow: auto;
    padding: 14px;
    display: grid;
    align-content: start;
    gap: 10px;
}
.ops-chat-empty {
    color: #94a3b8;
    border: 1px dashed rgba(255,255,255,.12);
    border-radius: 18px;
    padding: 16px;
    text-align: center;
    font-size: 13px;
    line-height: 1.5;
}
.ops-chat-message { max-width: 92%; justify-self: start; }
.ops-chat-message.mine { justify-self: end; }
.ops-chat-meta { display:flex; gap:8px; align-items:center; margin: 0 4px 5px; font-size: 11px; color:#94a3b8; flex-wrap:wrap; }
.ops-chat-meta strong { color:#e2e8f0; }
.ops-chat-bubble {
    padding: 11px 13px;
    border-radius: 18px 18px 18px 6px;
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.08);
    color: #e2e8f0;
    white-space: pre-wrap;
    line-height: 1.45;
    font-size: 13px;
}
.ops-chat-message.mine .ops-chat-bubble {
    border-radius: 18px 18px 6px 18px;
    background: rgba(37,99,235,.22);
    border-color: rgba(37,99,235,.26);
}
.ops-chat-message.deleted .ops-chat-bubble { opacity: .68; font-style: italic; }
.ops-chat-delete {
    margin: 5px 0 0 4px;
    padding: 6px 9px;
    border-radius: 999px;
    font-size: 11px;
    background: rgba(220,38,38,.88);
}
.ops-chat-form { display:grid; grid-template-columns: 1fr auto; gap:8px; padding: 12px 14px; border-top:1px solid rgba(255,255,255,.08); }
.ops-chat-input { resize: none; min-height: 48px; }
.ops-chat-send { background: linear-gradient(135deg, #10b981, #047857); }
.ops-chat-footnote { padding: 0 14px 12px; color:#64748b; font-size: 11px; line-height: 1.4; }
.activity-row-critical td,
.activity-row-security td { background: rgba(220,38,38,.045); }
@media (max-width: 560px) {
    .ops-chat-widget { right: 10px; bottom: 10px; }
    .ops-chat-panel { width: calc(100vw - 20px); height: calc(100vh - 88px); bottom: 62px; }
}

/* Mobile-app experience for Ground and Response portals */
.legend-dot.purple { background:#7c3aed; }

.mobile-app-shell {
    width: min(560px, 100%);
    margin: 0 auto;
    min-height: 100vh;
    padding: 18px 16px calc(90px + env(safe-area-inset-bottom));
}
.mobile-app-topbar {
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:14px;
    padding-top: env(safe-area-inset-top);
    margin-bottom:14px;
}
.mobile-app-topbar h1 {
    margin: 6px 0 4px;
    font-size: 32px;
    line-height: .95;
    letter-spacing: -.06em;
}
.mobile-app-topbar p {
    margin:0;
    color:#94a3b8;
    line-height:1.4;
    font-size:13px;
}
.mobile-eyebrow {
    display:inline-flex;
    align-items:center;
    gap:8px;
    color:#a7f3d0;
    background:rgba(16,185,129,.10);
    border:1px solid rgba(16,185,129,.18);
    padding:8px 11px;
    border-radius:999px;
    font-weight:1000;
    font-size:12px;
    letter-spacing:.04em;
    text-transform:uppercase;
}
.mobile-status-card {
    border-radius: 28px;
    background: linear-gradient(145deg, rgba(15,23,42,.95), rgba(2,6,23,.86));
    border:1px solid rgba(255,255,255,.09);
    padding:14px;
    box-shadow:0 24px 80px rgba(0,0,0,.32);
    margin-bottom:14px;
}
.status-grid-mini {
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:10px;
}
.status-grid-mini div {
    background:rgba(255,255,255,.055);
    border:1px solid rgba(255,255,255,.075);
    border-radius:20px;
    padding:12px;
}
.status-grid-mini span {
    display:block;
    color:#94a3b8;
    font-size:11px;
    text-transform:uppercase;
    letter-spacing:.08em;
    font-weight:900;
}
.status-grid-mini strong {
    display:block;
    margin-top:6px;
    color:#fff;
    font-size:26px;
    letter-spacing:-.05em;
}
.shift-strip {
    margin-top:12px;
    padding:12px 13px;
    border-radius:18px;
    background:rgba(37,99,235,.12);
    border:1px solid rgba(37,99,235,.18);
    color:#dbeafe;
    text-align:left;
}
.shift-strip strong { display:block; font-size:14px; margin-bottom:4px; }
.shift-strip span { display:block; font-size:12px; color:#93c5fd; line-height:1.45; }
.mobile-app-footer {
    position: fixed;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    width: min(560px, 100%);
    padding: 12px 16px calc(12px + env(safe-area-inset-bottom));
    background: linear-gradient(180deg, rgba(8,17,31,0), rgba(8,17,31,.94) 28%, rgba(8,17,31,1));
    z-index: 50;
}
.mobile-app-footer .btn { width: 100%; justify-content:center; min-height:52px; }

.response-app-body {
    min-height:100vh;
    background:
        radial-gradient(circle at top left, rgba(16,185,129,.20), transparent 34%),
        radial-gradient(circle at top right, rgba(37,99,235,.16), transparent 30%),
        #06111f;
    padding:0;
    overflow-x:hidden;
}
.response-app-shell { position:relative; }
.response-app-topbar { position:sticky; top:0; z-index:20; padding-top:14px; backdrop-filter: blur(16px); }
.response-avatar {
    width:48px; height:48px; border-radius:18px;
    display:grid; place-items:center;
    background:linear-gradient(135deg, #10b981, #2563eb);
    color:#fff; font-weight:1000;
    box-shadow:0 16px 45px rgba(37,99,235,.25);
}
.response-status-card { border-color:rgba(16,185,129,.14); }
.response-gps-panel {
    background:rgba(37,99,235,.11);
    border-color:rgba(37,99,235,.22);
    color:#dbeafe;
    text-align:left;
    margin-bottom:14px;
}
.response-empty-card { text-align:center; padding:34px 18px; }
.empty-icon {
    width:64px; height:64px; border-radius:999px;
    display:grid; place-items:center;
    margin:0 auto 14px;
    color:#a7f3d0;
    background:rgba(16,185,129,.12);
    border:1px solid rgba(16,185,129,.22);
    font-size:32px;
    font-weight:1000;
}
.mobile-incident-card {
    position:relative;
    overflow:hidden;
    border-radius:30px;
    padding:18px;
    background:linear-gradient(145deg, rgba(15,23,42,.94), rgba(2,6,23,.92));
}
.mobile-incident-card::before {
    content:"";
    position:absolute;
    inset:0 auto 0 0;
    width:5px;
    background:#dc2626;
}
.mobile-incident-card.medical::before { background:#f59e0b; }
.mobile-incident-card.suspicion::before { background:#2563eb; }
.mobile-card-ref { font-size:21px; font-weight:1000; letter-spacing:-.04em; color:#fff; }
.response-location-box {
    margin:14px 0;
    padding:14px;
    border-radius:22px;
    background:rgba(255,255,255,.055);
    border:1px solid rgba(255,255,255,.08);
    text-align:left;
}
.response-location-box span {
    display:block;
    color:#94a3b8;
    font-size:11px;
    text-transform:uppercase;
    letter-spacing:.08em;
    font-weight:900;
}
.response-location-box strong { display:block; color:#fff; font-size:17px; margin:4px 0; }
.response-location-box small { color:#94a3b8; }
.nav-button {
    min-height:58px;
    border-radius:20px;
    font-size:15px;
    display:flex;
    justify-content:center;
    align-items:center;
}
.response-slider {
    height:66px;
    border-radius:24px;
    background:linear-gradient(135deg, rgba(15,23,42,.92), rgba(30,41,59,.92));
}
.response-slider::before {
    width:42%;
    background:linear-gradient(135deg, rgba(16,185,129,.72), rgba(37,99,235,.45));
}
.evidence-button {
    min-height:52px;
    border-color:rgba(255,255,255,.16) !important;
    color:#fff !important;
}
.response-duty-lock { border-color:rgba(37,99,235,.25); background:rgba(37,99,235,.10); color:#dbeafe; }

@media (max-width: 560px) {
    html, body.response-app-body, body.ground-body { min-height: 100%; }
    .ground-body {
        display:block;
        padding:0;
        background:
            radial-gradient(circle at top, rgba(239,68,68,.22), transparent 32%),
            #050b14;
    }
    .ground-card {
        width:100%;
        min-height:100vh;
        padding:18px 16px calc(86px + env(safe-area-inset-bottom));
        box-sizing:border-box;
    }
    .ground-card h1 { font-size:32px !important; }
    .safety-pill { margin-top: env(safe-area-inset-top); }
    .sos-zone { height:300px; margin:8px 0; }
    .sos-btn { width:min(250px, 72vw); height:min(250px, 72vw); }
    .sos-main { font-size:58px; }
    .alert-type-grid { grid-template-columns:1fr; }
    .alert-action { min-height:74px; border-radius:22px; }
    .countdown-box { position:relative; z-index:3; }
    .response-list { padding-bottom:10px; }
    .response-card { border-radius:28px; }
    .incident-head { align-items:flex-start; }
    .big-actions .btn.large { min-height:60px; border-radius:20px; }
    .camera-input { min-height:56px; }
}

/* Professional Control Room 2.0 */
.pro-control-body {
    background:
        radial-gradient(circle at 8% 0%, rgba(37,99,235,.18), transparent 32%),
        radial-gradient(circle at 92% 10%, rgba(220,38,38,.18), transparent 30%),
        linear-gradient(135deg, #020617 0%, #07111f 50%, #020617 100%);
    color: #fff;
}
.pro-control-shell {
    display: grid;
    grid-template-columns: 272px minmax(0, 1fr);
    gap: 18px;
    min-height: 100vh;
    padding: 18px;
}
.control-rail {
    position: sticky;
    top: 18px;
    height: calc(100vh - 36px);
    border-radius: 30px;
    padding: 18px;
    background: rgba(2, 6, 23, .72);
    border: 1px solid rgba(255,255,255,.10);
    box-shadow: 0 30px 100px rgba(0,0,0,.34);
    backdrop-filter: blur(18px);
    display: flex;
    flex-direction: column;
    gap: 18px;
}
.rail-brand {
    display: flex;
    gap: 12px;
    align-items: center;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(255,255,255,.08);
}
.rail-logo {
    width: 48px;
    height: 48px;
    border-radius: 18px;
    display: grid;
    place-items: center;
    font-weight: 1000;
    background: linear-gradient(145deg, #ef4444, #1d4ed8);
    box-shadow: 0 16px 45px rgba(37,99,235,.24);
}
.rail-brand strong { display:block; font-size: 15px; }
.rail-brand span { display:block; color:#94a3b8; font-size: 12px; margin-top:2px; }
.rail-nav { display:grid; gap:8px; }
.rail-nav a {
    padding: 12px 13px;
    border-radius: 16px;
    color: #cbd5e1;
    font-size: 13px;
    font-weight: 900;
    background: rgba(255,255,255,.035);
    border: 1px solid transparent;
}
.rail-nav a:hover,
.rail-nav a.active {
    color:#fff;
    background: rgba(37,99,235,.18);
    border-color: rgba(96,165,250,.22);
}
.rail-card {
    margin-top: auto;
    display: grid;
    gap: 5px;
    padding: 15px;
    border-radius: 22px;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.09);
}
.rail-card .mini-label {
    color:#94a3b8;
    text-transform:uppercase;
    letter-spacing:.09em;
    font-size: 11px;
    font-weight: 1000;
}
.rail-card small { color:#94a3b8; }
.control-main { min-width: 0; }
.pro-control-header {
    position: sticky;
    top: 18px;
    z-index: 60;
    padding: 18px 18px 16px;
    border-radius: 30px;
    background: rgba(2, 6, 23, .76);
    border: 1px solid rgba(255,255,255,.10);
    box-shadow: 0 22px 80px rgba(0,0,0,.25);
    backdrop-filter: blur(18px);
}
.eyebrow {
    color: #93c5fd;
    text-transform: uppercase;
    letter-spacing: .14em;
    font-size: 11px;
    font-weight: 1000;
    margin-bottom: 6px;
}
.control-header-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
}
.control-sound-btn,
.control-logout,
.map-actions .btn.ghost {
    color: #fff !important;
    border-color: rgba(255,255,255,.14) !important;
    background: rgba(255,255,255,.065) !important;
}
.control-sound-btn.audio-on {
    color: #a7f3d0 !important;
    border-color: rgba(16,185,129,.24) !important;
    background: rgba(16,185,129,.10) !important;
}
.control-sound-btn.audio-off {
    color: #fecaca !important;
    border-color: rgba(239,68,68,.22) !important;
    background: rgba(239,68,68,.08) !important;
}
.control-sound-btn .sound-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 999px;
    margin-right: 8px;
    vertical-align: 1px;
}
.control-sound-btn .sound-dot.on {
    background: #34d399;
    box-shadow: 0 0 0 4px rgba(52,211,153,.12);
}
.control-sound-btn .sound-dot.off {
    background: #f87171;
    box-shadow: 0 0 0 4px rgba(248,113,113,.12);
}
.control-live-badge {
    color:#a7f3d0 !important;
    border: 1px solid rgba(16,185,129,.20);
    background: rgba(16,185,129,.10) !important;
}
.pro-bento { margin-top: 18px; }
.pro-bento .tile {
    border-radius: 30px;
    background: rgba(15,23,42,.78);
    border: 1px solid rgba(255,255,255,.10);
    box-shadow: 0 28px 95px rgba(0,0,0,.28);
    backdrop-filter: blur(14px);
}
.command-strip {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:18px;
    background: linear-gradient(135deg, rgba(15,23,42,.94), rgba(30,41,59,.76)) !important;
}
.command-left { display:flex; align-items:center; gap:16px; min-width:0; }
.command-left h2 { margin:0 0 4px; font-size: clamp(20px, 2.3vw, 32px); letter-spacing:-.05em; }
.command-left p { margin:0; }
.command-right {
    min-width: 178px;
    display:grid;
    justify-items:end;
    gap:4px;
    padding: 13px 14px;
    border-radius: 20px;
    background: rgba(255,255,255,.055);
    border: 1px solid rgba(255,255,255,.08);
}
.command-right strong { font-size: 14px; }
.command-severity {
    min-width: 92px;
    height: 92px;
    border-radius: 28px;
    display:grid;
    place-items:center;
    text-align:center;
    padding: 10px;
    font-size: 11px;
    font-weight: 1000;
    text-transform: uppercase;
    letter-spacing: .06em;
    border: 1px solid rgba(255,255,255,.12);
}
.command-severity.calm { color:#a7f3d0; background:rgba(16,185,129,.13); }
.command-severity.armed { color:#fecaca; background:rgba(220,38,38,.24); box-shadow:0 0 0 10px rgba(220,38,38,.07); }
.command-severity.medical { color:#fde68a; background:rgba(245,158,11,.22); }
.command-severity.suspicion { color:#bfdbfe; background:rgba(37,99,235,.22); }
.metric-tile {
    display:flex;
    align-items:center;
    gap:14px;
    min-height: 130px;
}
.metric-icon {
    width: 56px;
    height: 56px;
    border-radius: 20px;
    display:grid;
    place-items:center;
    font-weight: 1000;
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.09);
    flex: 0 0 auto;
}
.metric-icon.danger { color:#fecaca; background:rgba(220,38,38,.18); }
.metric-icon.green { color:#a7f3d0; background:rgba(16,185,129,.14); }
.metric-icon.purple { color:#ddd6fe; background:rgba(124,58,237,.16); }
.metric-icon.blue { color:#bfdbfe; background:rgba(37,99,235,.16); }
.severity-board {
    display:grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    padding: 12px !important;
}
.severity-card {
    min-height: 96px;
    border-radius: 23px;
    padding: 16px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap: 12px;
    border: 1px solid rgba(255,255,255,.09);
}
.severity-card span { color:#cbd5e1; font-size: 13px; font-weight: 900; }
.severity-card strong { font-size: 40px; letter-spacing:-.05em; }
.severity-card.armed { background:linear-gradient(135deg, rgba(220,38,38,.22), rgba(15,23,42,.42)); }
.severity-card.medical { background:linear-gradient(135deg, rgba(245,158,11,.22), rgba(15,23,42,.42)); }
.severity-card.suspicion { background:linear-gradient(135deg, rgba(37,99,235,.22), rgba(15,23,42,.42)); }
.severity-card.unassigned { background:linear-gradient(135deg, rgba(148,163,184,.18), rgba(15,23,42,.42)); }
.panel-head {
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap: 12px;
    margin-bottom: 14px;
}
.panel-head h2,
.pro-map-header h2 { margin: 0 0 5px; letter-spacing:-.03em; }
.panel-head p,
.pro-map-header p { margin:0; }
.incident-panel { min-height: 610px; }
.incident-tools {
    display:flex;
    flex-wrap:wrap;
    gap: 8px;
    margin-bottom: 13px;
}
.filter-chip {
    border: 1px solid rgba(255,255,255,.10);
    color: #cbd5e1;
    background: rgba(255,255,255,.055);
    border-radius: 999px;
    padding: 9px 11px;
    font-size: 12px;
    font-weight: 1000;
    cursor: pointer;
}
.filter-chip:hover,
.filter-chip.active {
    color:#fff;
    background: rgba(37,99,235,.20);
    border-color: rgba(96,165,250,.30);
}
.professional-feed {
    max-height: 708px;
    scrollbar-width: thin;
    scrollbar-color: rgba(148,163,184,.5) transparent;
}
.pro-incident-card {
    position: relative;
    overflow: hidden;
    background: rgba(2,6,23,.58) !important;
    border-radius: 24px !important;
}
.pro-incident-card::before {
    content:"";
    position:absolute;
    left:0;
    top:0;
    bottom:0;
    width: 5px;
    background:#dc2626;
}
.pro-incident-card.medical::before { background:#f59e0b; }
.pro-incident-card.suspicion::before { background:#2563eb; }
.incident-card-top {
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap: 12px;
}
.incident-ref {
    display:inline-flex;
    margin-bottom: 8px;
    color:#cbd5e1;
    font-size: 12px;
    font-weight: 1000;
    letter-spacing: .08em;
    text-transform: uppercase;
}
.pro-incident-card h3 {
    margin: 0 0 5px;
    font-size: 19px;
    letter-spacing: -.04em;
}
.pro-incident-card p { margin:0; }
.map-link { min-height: 40px; padding: 10px 13px; border-radius: 14px; }
.incident-meta-row {
    display:flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 13px;
}
.incident-location-row {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap: 12px;
    margin-top: 12px;
    color:#94a3b8;
    font-size: 12px;
}
.incident-location-row strong { color:#e2e8f0; }
.dispatch-row {
    display:grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    margin-top: 13px;
}
.control-select {
    background: rgba(15,23,42,.95) !important;
    color:#fff !important;
    border-color: rgba(255,255,255,.15) !important;
    min-height: 44px;
}
.pro-map-header { align-items:flex-start; margin-bottom: 14px; }
.map-actions { display:grid; justify-items:end; gap:10px; }
.pro-legend { max-width: 560px; }
.pro-map-box {
    height: 708px;
    border-radius: 26px;
    border-color: rgba(255,255,255,.10);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.03);
}
.incident-map-marker {
    width: 24px;
    height: 24px;
    border-radius: 999px;
    border: 4px solid #fff;
    box-shadow: 0 0 0 10px rgba(220,38,38,.16), 0 12px 30px rgba(0,0,0,.44);
    animation: incidentPulse 1.45s infinite;
}
.incident-map-marker.medical { box-shadow: 0 0 0 10px rgba(245,158,11,.16), 0 12px 30px rgba(0,0,0,.44); }
.incident-map-marker.suspicion { box-shadow: 0 0 0 10px rgba(37,99,235,.16), 0 12px 30px rgba(0,0,0,.44); }
@keyframes incidentPulse {
    0% { transform: scale(.92); }
    50% { transform: scale(1.09); }
    100% { transform: scale(.92); }
}
.table-panel { min-height: 440px; }
.pro-table-wrap {
    border-radius: 22px;
    border: 1px solid rgba(255,255,255,.08);
    overflow: auto;
    max-height: 440px;
}
.pro-table th,
.pro-table td {
    border-bottom-color: rgba(255,255,255,.08);
    color:#e2e8f0;
}
.pro-table th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: rgba(15,23,42,.98);
    color:#94a3b8;
}
.pro-table tr:hover td { background: rgba(255,255,255,.035); }
.status-pill { color:#dbeafe !important; background:rgba(37,99,235,.13) !important; }
.table-subtle { color:#64748b; font-size: 11px; margin-top: 4px; }
.empty-state {
    display:grid;
    gap: 7px;
    place-items:center;
    min-height: 170px;
    color:#94a3b8;
    text-align:center;
    border: 1px dashed rgba(255,255,255,.12);
    border-radius: 22px;
    background: rgba(255,255,255,.035);
}
.empty-state strong { color:#e2e8f0; }
@media (max-width: 1280px) {
    .pro-control-shell { grid-template-columns: 1fr; }
    .control-rail {
        position: relative;
        top: auto;
        height: auto;
        flex-direction: row;
        align-items: center;
        flex-wrap: wrap;
    }
    .rail-brand { border-bottom: 0; padding-bottom: 0; }
    .rail-nav { grid-template-columns: repeat(5, auto); overflow:auto; }
    .rail-card { margin-top: 0; margin-left: auto; }
    .pro-control-header { top: 10px; }
}
@media (max-width: 1100px) {
    .severity-board { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .incident-panel, .map-panel, .table-panel { min-height: auto; }
    .pro-map-box { height: 520px; }
}
@media (max-width: 760px) {
    .pro-control-shell { padding: 10px; }
    .control-rail { display:none; }
    .pro-control-header { position: relative; top:auto; border-radius: 24px; }
    .control-header-actions { justify-content:flex-start; }
    .command-strip, .command-left { display:block; }
    .command-severity { min-width: 100%; height:auto; min-height: 48px; border-radius: 18px; margin-bottom:12px; }
    .command-right { justify-items:start; margin-top:12px; }
    .metric-tile { min-height: 108px; }
    .severity-board { grid-template-columns: 1fr; }
    .severity-card { min-height: 78px; }
    .pro-map-header, .map-actions { display:block; justify-items:start; }
    .pro-legend { margin-top: 10px; }
    .pro-map-box { height: 430px; }
    .dispatch-row { grid-template-columns: 1fr; }
    .professional-feed { max-height: 520px; }
}

/* Control Room case closure controls */
.case-close-row {
    margin-top: 12px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding-top: 12px;
    border-top: 1px solid rgba(148, 163, 184, 0.16);
}

.case-close-row .btn.green {
    white-space: nowrap;
    background: linear-gradient(135deg, #16a34a, #047857);
    border-color: rgba(34, 197, 94, 0.35);
}

.case-close-hint {
    color: #94a3b8;
    font-size: 12px;
    line-height: 1.35;
}

@media (max-width: 720px) {
    .case-close-row {
        align-items: stretch;
        flex-direction: column;
    }

    .case-close-row .btn.green {
        width: 100%;
        justify-content: center;
    }
}

/* Dedicated Tactical Map View */
.tactical-page-body {
    min-height: 100vh;
    background:
        radial-gradient(circle at 20% 0%, rgba(37,99,235,.18), transparent 36%),
        radial-gradient(circle at 80% 10%, rgba(220,38,38,.12), transparent 34%),
        #020617;
}
.tactical-shell { min-height: 100vh; }
.tactical-main { min-width: 0; }
.tactical-header { margin-bottom: 14px; }
.tactical-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 380px;
    gap: 16px;
    min-height: calc(100vh - 160px);
}
.tactical-map-card {
    background: rgba(15,23,42,.74);
    border: 1px solid rgba(148,163,184,.18);
    box-shadow: 0 24px 80px rgba(0,0,0,.35);
    border-radius: 30px;
    padding: 14px;
    min-width: 0;
}
.tactical-stats-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(120px, 1fr)) minmax(220px, 1.4fr);
    gap: 10px;
    margin-bottom: 12px;
}
.tactical-stat {
    display: grid;
    gap: 4px;
    min-height: 74px;
    padding: 14px;
    border-radius: 22px;
    background: rgba(2,6,23,.62);
    border: 1px solid rgba(255,255,255,.08);
}
.tactical-stat span {
    color: #94a3b8;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.tactical-stat strong {
    color: #f8fafc;
    font-size: clamp(20px, 2.4vw, 34px);
    line-height: 1;
}
.tactical-stat.wide strong { font-size: 18px; }
.tactical-legend {
    justify-content: flex-start;
    margin-bottom: 12px;
    padding: 10px 12px;
    background: rgba(2,6,23,.46);
    border-radius: 18px;
    border: 1px solid rgba(255,255,255,.08);
}
.tactical-map-box {
    position: relative;
    height: calc(100vh - 292px);
    min-height: 560px;
    width: 100%;
    overflow: hidden;
    border-radius: 24px;
    border: 1px solid rgba(255,255,255,.12);
    background: #0f172a;
}
.tactical-side-panel {
    display: grid;
    gap: 14px;
    align-content: start;
    min-width: 0;
}
.tactical-side-section {
    background: rgba(15,23,42,.78) !important;
    border-color: rgba(148,163,184,.18) !important;
    padding: 16px !important;
}
.tactical-side-section h2 {
    color: #f8fafc;
    font-size: 17px;
    margin-bottom: 12px;
}
.tactical-side-list {
    display: grid;
    gap: 9px;
    max-height: 28vh;
    overflow: auto;
    padding-right: 4px;
}
.tactical-side-card {
    display: grid;
    gap: 5px;
    padding: 12px;
    border-radius: 18px;
    background: rgba(2,6,23,.55);
    border: 1px solid rgba(255,255,255,.08);
    border-left: 4px solid rgba(16,185,129,.75);
}
.tactical-side-card.armed { border-left-color: #dc2626; }
.tactical-side-card.medical { border-left-color: #f59e0b; }
.tactical-side-card.suspicion { border-left-color: #2563eb; }
.tactical-side-card strong { color:#f8fafc; font-size: 14px; }
.tactical-side-card span { color:#cbd5e1; font-size: 12px; font-weight: 900; }
.tactical-side-card small { color:#94a3b8; line-height: 1.35; }
.tactical-alert-marker { width:26px; height:26px; }
.tactical-person-marker {
    width: 38px !important;
    height: 38px !important;
    border-radius: 999px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    font-weight:1000;
    font-size:13px;
    border: 3px solid rgba(255,255,255,.95);
    box-shadow: 0 12px 34px rgba(0,0,0,.46), 0 0 0 7px rgba(16,185,129,.12);
}
.tactical-person-marker.response { box-shadow: 0 12px 34px rgba(0,0,0,.46), 0 0 0 7px rgba(124,58,237,.14); }
.empty-state.compact { min-height: 90px; padding: 12px; }
@media (max-width: 1280px) {
    .tactical-layout { grid-template-columns: 1fr; }
    .tactical-side-panel { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .tactical-side-list { max-height: 240px; }
    .tactical-map-box { height: 620px; }
}
@media (max-width: 820px) {
    .tactical-stats-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .tactical-side-panel { grid-template-columns: 1fr; }
    .tactical-map-card { padding: 10px; border-radius: 24px; }
    .tactical-map-box { height: 520px; min-height: 420px; border-radius: 20px; }
}
@media (max-width: 540px) {
    .tactical-stats-row { grid-template-columns: 1fr; }
    .tactical-stat { min-height: 62px; }
    .tactical-map-box { height: 460px; min-height: 380px; }
}

/* Response Team accepted-job live tactical map */
.response-live-job-map-card {
    margin: 14px 0 18px;
    padding: 16px;
    border-radius: 28px;
    background:
        radial-gradient(circle at 10% 0%, rgba(56,189,248,.18), transparent 36%),
        linear-gradient(145deg, rgba(15,23,42,.98), rgba(2,6,23,.98));
    border: 1px solid rgba(148,163,184,.18);
    box-shadow: 0 26px 70px rgba(0,0,0,.36);
}
.response-live-job-map-card.armed { border-color: rgba(220,38,38,.35); }
.response-live-job-map-card.medical { border-color: rgba(245,158,11,.35); }
.response-live-job-map-card.suspicion { border-color: rgba(37,99,235,.38); }
.response-map-topline {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
    margin-bottom:14px;
}
.response-map-topline h2 {
    margin: 6px 0 2px;
    font-size: 24px;
    letter-spacing: -.04em;
    color: #fff;
}
.response-map-topline p {
    margin: 0;
    color: #94a3b8;
    font-size: 13px;
    font-weight: 800;
    text-transform: capitalize;
}
.response-job-metrics {
    display:grid;
    grid-template-columns: repeat(3, 1fr);
    gap:10px;
    margin-bottom:12px;
}
.response-job-metrics div {
    padding: 12px;
    border-radius: 18px;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.08);
    min-width:0;
}
.response-job-metrics span {
    display:block;
    color:#94a3b8;
    font-size:11px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.08em;
    margin-bottom:5px;
}
.response-job-metrics strong {
    display:block;
    color:#f8fafc;
    font-size:14px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.response-job-map {
    height: 380px;
    min-height: 320px;
    border-radius: 24px;
    overflow:hidden;
    background:#0f172a;
    border:1px solid rgba(255,255,255,.10);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.03);
}
.response-job-marker {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    display:grid;
    place-items:center;
    color:white;
    font-weight:1000;
    font-size:17px;
    border: 3px solid rgba(255,255,255,.94);
    box-shadow: 0 0 0 10px rgba(56,189,248,.16), 0 16px 34px rgba(0,0,0,.38);
}
.response-job-div-icon.target .response-job-marker {
    animation: responseTargetPulse 1.5s infinite;
}
.response-job-div-icon.responder .response-job-marker {
    box-shadow: 0 0 0 9px rgba(16,185,129,.18), 0 16px 34px rgba(0,0,0,.38);
}
@keyframes responseTargetPulse {
    0% { box-shadow: 0 0 0 0 rgba(248,113,113,.34), 0 16px 34px rgba(0,0,0,.38); }
    70% { box-shadow: 0 0 0 16px rgba(248,113,113,0), 0 16px 34px rgba(0,0,0,.38); }
    100% { box-shadow: 0 0 0 0 rgba(248,113,113,0), 0 16px 34px rgba(0,0,0,.38); }
}
.response-map-actions {
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap:10px;
    margin-top:12px;
}
.response-app-body .leaflet-container {
    font-family: inherit;
}
.response-app-body .leaflet-popup-content-wrapper,
.response-app-body .leaflet-popup-tip {
    background:#020617;
    color:#e2e8f0;
    border:1px solid rgba(148,163,184,.25);
}
@media (max-width: 720px) {
    .response-live-job-map-card {
        border-radius: 26px;
        padding: 12px;
        margin-left: -2px;
        margin-right: -2px;
    }
    .response-map-topline {
        align-items:center;
    }
    .response-map-topline h2 {
        font-size: 20px;
    }
    .response-job-metrics {
        grid-template-columns: 1fr;
        gap:8px;
    }
    .response-job-map {
        height: 360px;
        min-height: 320px;
        border-radius: 22px;
    }
    .response-map-actions {
        grid-template-columns: 1fr;
    }
}

/* Built-in fallback map for response team when external map library/CDN is unavailable */
.response-fallback-map {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: inherit;
    overflow: hidden;
    background:
        radial-gradient(circle at 20% 15%, rgba(56,189,248,.24), transparent 28%),
        radial-gradient(circle at 78% 75%, rgba(16,185,129,.18), transparent 24%),
        linear-gradient(145deg, #020617, #0f172a 48%, #111827);
    color: #e2e8f0;
}
.response-fallback-map .fallback-grid {
    position:absolute;
    inset:0;
    background-image:
        linear-gradient(rgba(148,163,184,.08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(148,163,184,.08) 1px, transparent 1px);
    background-size: 34px 34px;
    mask-image: radial-gradient(circle at center, black, transparent 88%);
}
.fallback-map-header,
.fallback-map-footer {
    position:absolute;
    left: 14px;
    right: 14px;
    z-index: 4;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding: 10px 12px;
    border-radius: 16px;
    background: rgba(2,6,23,.72);
    border: 1px solid rgba(148,163,184,.18);
    backdrop-filter: blur(10px);
}
.fallback-map-header { top: 14px; }
.fallback-map-footer { bottom: 14px; font-size: 11px; color:#cbd5e1; flex-wrap: wrap; }
.fallback-map-header strong { font-size: 13px; letter-spacing: -.02em; }
.fallback-map-header span { font-size: 11px; color:#38bdf8; font-weight:900; text-transform:uppercase; letter-spacing:.08em; }
.fallback-route {
    position:absolute;
    inset: 0;
    width:100%;
    height:100%;
    z-index: 2;
}
.fallback-route line {
    stroke:#38bdf8;
    stroke-width: 1.2;
    stroke-dasharray: 4 4;
    filter: drop-shadow(0 0 5px rgba(56,189,248,.85));
}
.fallback-pin {
    position:absolute;
    z-index: 3;
    width: 44px;
    height: 44px;
    transform: translate(-50%, -50%);
    border-radius: 999px;
    display:grid;
    place-items:center;
    color:white;
    font-weight:1000;
    border: 3px solid rgba(255,255,255,.96);
    box-shadow: 0 18px 40px rgba(0,0,0,.42), 0 0 0 10px rgba(56,189,248,.13);
}
.fallback-pin.incident {
    animation: responseTargetPulse 1.5s infinite;
}
.fallback-pin.responder {
    background:#10b981;
    box-shadow: 0 18px 40px rgba(0,0,0,.42), 0 0 0 10px rgba(16,185,129,.17);
}
@media (max-width: 720px) {
    .fallback-map-header,
    .fallback-map-footer {
        left: 10px;
        right: 10px;
        border-radius: 14px;
    }
    .fallback-map-footer {
        display:block;
        line-height:1.7;
    }
    .fallback-map-footer span { display:block; }
}

/* Incident lifecycle status visibility across all departments */
.incident-status-timeline {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 6px;
    margin: 12px 0;
}
.incident-status-timeline.compact {
    gap: 4px;
    margin: 10px 0;
}
.status-step {
    position: relative;
    min-height: 32px;
    display: grid;
    place-items: center;
    padding: 7px 8px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 950;
    letter-spacing: .02em;
    text-transform: uppercase;
    color: #94a3b8;
    background: rgba(148,163,184,.10);
    border: 1px solid rgba(148,163,184,.14);
    text-align: center;
}
.status-step.done {
    color: #d1fae5;
    background: rgba(16,185,129,.13);
    border-color: rgba(16,185,129,.22);
}
.status-step.current {
    color: #fff;
    background: linear-gradient(135deg, rgba(37,99,235,.72), rgba(16,185,129,.48));
    border-color: rgba(125,211,252,.35);
    box-shadow: 0 0 0 4px rgba(56,189,248,.08);
}
.control-timeline .status-step {
    background: rgba(255,255,255,.055);
}
.response-status-row {
    margin-top: 12px;
}
.ground-response-status {
    margin: 18px auto 0;
    text-align: left;
    width: min(520px, 100%);
    padding: 18px;
    border-radius: 28px;
    background: linear-gradient(145deg, rgba(15,23,42,.96), rgba(2,6,23,.92));
    border: 1px solid rgba(56,189,248,.16);
    box-shadow: 0 24px 80px rgba(0,0,0,.32);
}
.ground-status-header {
    display:flex;
    justify-content:space-between;
    gap:12px;
    align-items:flex-start;
    margin-bottom: 10px;
}
.ground-status-header h2 {
    margin: 4px 0 0;
    font-size: 20px;
    letter-spacing: -.04em;
}
.ground-status-ref {
    font-weight: 1000;
    color: #f8fafc;
    font-size: 22px;
    letter-spacing: -.04em;
}
.ground-status-type {
    color: #cbd5e1;
    font-weight: 800;
    margin-top: 4px;
}
.ground-status-grid {
    display:grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 10px;
    margin-top: 12px;
}
.ground-status-grid div {
    padding: 12px;
    border-radius: 18px;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.08);
}
.ground-status-grid span {
    display:block;
    color:#94a3b8;
    text-transform:uppercase;
    font-size: 10px;
    font-weight: 950;
    letter-spacing:.08em;
    margin-bottom: 5px;
}
.ground-status-grid strong {
    display:block;
    color:#fff;
    font-size: 13px;
    line-height:1.35;
}
.admin-lifecycle {
    display:grid;
    gap:4px;
    font-size: 12px;
    color:#475569;
    min-width: 220px;
}
.admin-lifecycle span {
    display:block;
    white-space: nowrap;
}
@media (max-width: 760px) {
    .incident-status-timeline {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .status-step {
        min-height: 30px;
        font-size: 9px;
        padding: 6px;
    }
    .ground-status-grid {
        grid-template-columns: 1fr;
    }
}

/* --------------------------------------------------------------------------
   Final production visual polish
   -------------------------------------------------------------------------- */
:root {
    --ink: #0b1220;
    --surface: rgba(255,255,255,.86);
    --surface-solid: #ffffff;
    --stroke: rgba(15,23,42,.10);
    --brand-red: #dc2626;
    --brand-blue: #2563eb;
    --brand-green: #10b981;
    --brand-amber: #f59e0b;
}

body {
    -webkit-font-smoothing: antialiased;
    text-rendering: geometricPrecision;
}

body:not(.login-body):not(.control-body):not(.ground-body):not(.response-body) {
    background:
        radial-gradient(circle at 4% 0%, rgba(37,99,235,.08), transparent 28%),
        radial-gradient(circle at 100% 2%, rgba(220,38,38,.06), transparent 30%),
        linear-gradient(180deg, #f8fafc, #eef2f7);
}

.login-body,
.portal-hub-body,
.department-login {
    background:
        radial-gradient(circle at 12% 12%, rgba(248,113,113,.26), transparent 28%),
        radial-gradient(circle at 90% 15%, rgba(59,130,246,.20), transparent 30%),
        radial-gradient(circle at 55% 100%, rgba(16,185,129,.12), transparent 32%),
        linear-gradient(145deg, #020617 0%, #07111f 44%, #0f172a 100%);
}

.login-card,
.portal-card,
.card,
.tile,
.response-card,
.mobile-status-card,
.response-live-job-map-card,
.duty-lock-panel,
.ground-card .countdown-box {
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

.login-card {
    border-radius: 34px;
    border: 1px solid rgba(255,255,255,.14);
    box-shadow: 0 34px 110px rgba(0,0,0,.46), inset 0 1px 0 rgba(255,255,255,.08);
}

.brand-logo,
.rail-logo,
.response-avatar {
    box-shadow: 0 18px 48px rgba(220,38,38,.28), inset 0 1px 0 rgba(255,255,255,.20);
}

.btn {
    letter-spacing: -.01em;
    box-shadow: 0 14px 34px rgba(15,23,42,.12);
}
.btn.ghost { box-shadow: none; }
.btn.red { box-shadow: 0 18px 42px rgba(220,38,38,.24); }
.btn.blue { box-shadow: 0 18px 42px rgba(37,99,235,.22); }
.btn.green { box-shadow: 0 18px 42px rgba(16,185,129,.20); }

.input,
.select,
.textarea {
    min-height: 48px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.45);
}

.sidebar {
    background:
        radial-gradient(circle at 0% 0%, rgba(220,38,38,.18), transparent 38%),
        linear-gradient(180deg, #0b1220, #111827);
    box-shadow: 18px 0 70px rgba(15,23,42,.10);
}
.side-link {
    border: 1px solid transparent;
    transition: background .16s, border-color .16s, color .16s, transform .16s;
}
.side-link:hover,
.side-link.active {
    border-color: rgba(255,255,255,.10);
    background: rgba(255,255,255,.10);
    transform: translateX(2px);
}

.main-content {
    background:
        radial-gradient(circle at 12% 4%, rgba(37,99,235,.07), transparent 24%),
        transparent;
}
.topbar {
    padding: 8px 0 12px;
    border-bottom: 1px solid rgba(15,23,42,.07);
}
.card {
    border-color: rgba(15,23,42,.08);
    background: rgba(255,255,255,.90);
    box-shadow: 0 22px 70px rgba(15,23,42,.08), inset 0 1px 0 rgba(255,255,255,.75);
}
.card.flat {
    background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(248,250,252,.92));
}

.table-wrap {
    border: 1px solid rgba(15,23,42,.07);
    border-radius: 20px;
    background: rgba(255,255,255,.72);
}
th {
    background: rgba(248,250,252,.88);
    position: sticky;
    top: 0;
    z-index: 1;
}
tbody tr:hover { background: rgba(37,99,235,.035); }

.control-body.pro-control-body,
.control-body {
    background:
        radial-gradient(circle at 0% 0%, rgba(220,38,38,.20), transparent 32%),
        radial-gradient(circle at 92% 6%, rgba(37,99,235,.22), transparent 30%),
        radial-gradient(circle at 50% 100%, rgba(16,185,129,.10), transparent 34%),
        #020617;
}
.control-rail,
.tile,
.command-strip,
.incident-card,
.map-box,
.tactical-full-map {
    box-shadow: 0 24px 90px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.055);
}
.control-header,
.pro-control-header {
    background: rgba(2,6,23,.48);
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 28px;
    padding: 18px;
    backdrop-filter: blur(16px);
}
.command-strip {
    background: linear-gradient(135deg, rgba(15,23,42,.92), rgba(30,41,59,.74));
}
.metric-tile {
    min-height: 138px;
    display: flex;
    align-items: center;
    gap: 16px;
}
.severity-card,
.filter-chip,
.team-row,
.ground-row {
    transition: transform .16s, border-color .16s, background .16s;
}
.severity-card:hover,
.team-row:hover,
.ground-row:hover {
    transform: translateY(-1px);
}
.filter-chip.active {
    box-shadow: 0 14px 38px rgba(37,99,235,.18);
}
.professional-feed::-webkit-scrollbar,
.feed::-webkit-scrollbar,
.ops-chat-messages::-webkit-scrollbar {
    width: 8px;
}
.professional-feed::-webkit-scrollbar-thumb,
.feed::-webkit-scrollbar-thumb,
.ops-chat-messages::-webkit-scrollbar-thumb {
    background: rgba(148,163,184,.38);
    border-radius: 999px;
}

.ground-body,
.response-body {
    min-height: 100svh;
}
.ground-body {
    background:
        radial-gradient(circle at 50% -10%, rgba(248,113,113,.34), transparent 34%),
        radial-gradient(circle at 100% 18%, rgba(245,158,11,.12), transparent 30%),
        linear-gradient(180deg, #020617, #07111f 46%, #020617);
}
.ground-card,
.mobile-app-shell {
    border-radius: 34px;
}
.mobile-app-shell {
    width: min(760px, 100%);
    margin: 0 auto;
}
.mobile-app-topbar,
.mobile-status-card,
.response-card,
.response-live-job-map-card,
.gps-panel,
.duty-lock-panel,
.ground-card .countdown-box {
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(15,23,42,.74);
    box-shadow: 0 24px 82px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.06);
}
.response-body {
    background:
        radial-gradient(circle at 20% 0%, rgba(16,185,129,.16), transparent 32%),
        radial-gradient(circle at 100% 0%, rgba(37,99,235,.20), transparent 34%),
        #020817;
}
.response-card.mobile-incident-card,
.response-empty-card {
    overflow: hidden;
    position: relative;
}
.response-card.mobile-incident-card::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: #ef4444;
}
.response-card.mobile-incident-card.medical::before { background: #f59e0b; }
.response-card.mobile-incident-card.suspicion::before { background: #2563eb; }
.response-job-map,
#responseJobMap {
    min-height: 340px;
    border-radius: 24px;
    border: 1px solid rgba(255,255,255,.10);
    overflow: hidden;
    background: #0f172a;
}

.sos-btn {
    box-shadow:
        0 0 0 14px rgba(220,38,38,.13),
        0 0 0 34px rgba(220,38,38,.07),
        0 32px 90px rgba(220,38,38,.36),
        inset 0 2px 0 rgba(255,255,255,.22);
}
.alert-action,
.sos-btn,
.portal-card,
.response-card,
.tile,
.card {
    transform: translateZ(0);
}

.ops-chat-panel {
    box-shadow: 0 34px 120px rgba(0,0,0,.56), inset 0 1px 0 rgba(255,255,255,.06);
}
.ops-chat-launcher {
    box-shadow: 0 22px 70px rgba(220,38,38,.22), 0 12px 42px rgba(0,0,0,.28);
}

@media (max-width: 760px) {
    body:not(.control-body):not(.ground-body):not(.response-body):not(.login-body) {
        background: #f8fafc;
    }
    .sidebar {
        border-radius: 0 0 28px 28px;
        height: auto;
        position: relative;
    }
    .side-nav {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }
    .side-link {
        justify-content: center;
        text-align: center;
    }
    .main-content { padding: 18px 14px 90px; }
    .login-card { padding: 26px; border-radius: 28px; }
    .control-header,
    .pro-control-header { border-radius: 22px; }
    .control-header-actions { width: 100%; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
    .control-header-actions .badge { justify-content: center; }
    .map-box { height: 430px; }
    .mobile-app-shell { padding-bottom: calc(86px + env(safe-area-inset-bottom)); }
    .mobile-app-footer {
        backdrop-filter: blur(18px);
        -webkit-backdrop-filter: blur(18px);
    }
    .response-job-map,
    #responseJobMap { min-height: 300px; }
    .ops-chat-widget { right: 12px; bottom: 12px; }
    .ops-chat-panel {
        width: calc(100vw - 24px);
        height: min(620px, calc(100vh - 92px));
        border-radius: 24px;
    }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}

/* Duty location and shift assignment polish */
.section-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
}
.field-help {
    margin-top: 7px;
    font-size: 12px;
    color: var(--muted, #8ea0b6);
    line-height: 1.5;
}
.mini-card span,
.mini-metric span {
    display: block;
    color: var(--muted, #8ea0b6);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .08em;
    margin-bottom: 6px;
}
.mini-card strong,
.mini-metric strong {
    display: block;
    font-size: 18px;
    color: var(--text, #f8fafc);
}
.mini-card p {
    margin: 8px 0 0;
    color: var(--muted, #8ea0b6);
    font-size: 13px;
    line-height: 1.5;
}
.command-card {
    background: linear-gradient(145deg, rgba(15,23,42,.98), rgba(30,41,59,.88));
}
.mini-metric {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 13px 0;
    border-bottom: 1px solid rgba(148,163,184,.13);
}
.mini-metric:last-child {
    border-bottom: 0;
}