:root{ --bg:#030712;--bg2:#06111f;--panel:#081424e6;--panel2:#0d1b30;--card:#0a1323; --line:#1e3a5f;--line2:#22d3ee55;--text:#e5edf7;--muted:#91a4bd; --cyan:#22d3ee;--blue:#38bdf8;--amber:#f59e0b;--red:#fb7185;--green:#34d399; --radius:22px;--shadow:0 22px 70px rgba(0,0,0,.45);--side:292px;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;background:radial-gradient(circle at 12% 0%,rgba(34,211,238,.18),transparent 32%),radial-gradient(circle at 92% 8%,rgba(245,158,11,.13),transparent 30%),linear-gradient(135deg,#020617,#030712 58%,#071523);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,Segoe UI,Arial,sans-serif;line-height:1.55}body:before{content:"";position:fixed;inset:0;pointer-events:none;background-image:linear-gradient(rgba(34,211,238,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(34,211,238,.05) 1px,transparent 1px);background-size:34px 34px;mask-image:linear-gradient(to bottom,#000,transparent 90%)}
button,input,select,textarea{font:inherit}.app-shell{display:flex;min-height:100vh}.sidebar{position:fixed;left:0;top:0;bottom:0;width:var(--side);padding:18px;background:rgba(2,6,23,.88);border-right:1px solid var(--line2);backdrop-filter:blur(18px);z-index:70;overflow:auto}.brand-card{display:flex;align-items:center;gap:12px;padding:14px;border-radius:24px;border:1px solid var(--line2);background:linear-gradient(135deg,rgba(34,211,238,.12),rgba(15,23,42,.62));box-shadow:var(--shadow)}.brand-mark{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;background:linear-gradient(135deg,var(--cyan),#0ea5e9);color:#001018;font-weight:1000;letter-spacing:.04em}.brand-card h1{margin:0;font-size:1.05rem}.brand-card p{margin:3px 0 0;color:var(--muted);font-size:.78rem}.nav{display:grid;gap:8px;margin-top:18px}.nav button{width:100%;display:flex;align-items:center;gap:12px;text-align:left;border:1px solid transparent;border-radius:16px;background:rgba(255,255,255,.045);color:#cbd5e1;padding:12px 12px;cursor:pointer;transition:.18s}.nav button:hover,.nav button.active{background:rgba(34,211,238,.12);border-color:var(--line2);color:#fff;transform:translateX(3px)}.nav .ico{width:28px;height:28px;display:grid;place-items:center;border-radius:10px;background:rgba(34,211,238,.12);color:var(--cyan)}.side-status{margin-top:18px;padding:13px;border:1px solid rgba(52,211,153,.28);border-radius:18px;background:rgba(52,211,153,.08);display:flex;gap:10px;align-items:center}.side-status small{display:block;color:var(--muted)}.pulse-dot{width:10px;height:10px;border-radius:50%;background:var(--green);box-shadow:0 0 0 8px rgba(52,211,153,.12),0 0 20px var(--green)}.main{margin-left:var(--side);width:calc(100% - var(--side));padding:18px 24px 80px}.topbar{position:sticky;top:0;z-index:60;margin:-18px -24px 20px;padding:12px 24px;display:flex;align-items:center;justify-content:space-between;gap:14px;border-bottom:1px solid var(--line);background:rgba(3,7,18,.75);backdrop-filter:blur(18px)}.top-title small{display:block;color:var(--cyan);font-family:ui-monospace,Consolas,monospace;letter-spacing:.08em;text-transform:uppercase}.top-title strong{font-size:1.05rem}.top-actions{display:flex;gap:8px;flex-wrap:wrap}.pill-btn,.icon-btn,.primary-btn,.danger-btn,.ghost-btn{border:1px solid var(--line2);background:rgba(15,23,42,.75);color:var(--text);border-radius:999px;padding:9px 13px;font-weight:800;cursor:pointer}.pill-btn:hover,.ghost-btn:hover{background:rgba(34,211,238,.16)}.pill-btn.officer{border-color:rgba(245,158,11,.5);background:rgba(245,158,11,.12)}.pill-btn.danger,.danger-btn{border-color:rgba(251,113,133,.55);background:rgba(251,113,133,.14);color:#fecdd3}.primary-btn{background:linear-gradient(135deg,rgba(34,211,238,.9),rgba(14,165,233,.9));color:#001018;border:0}.full{width:100%}.officer-only{display:none}.officer-mode .officer-only{display:inline-flex}.mobile-only{display:none}.view{animation:fade .22s ease}@keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.hero{position:relative;overflow:hidden;border:1px solid var(--line2);border-radius:30px;padding:30px;background:linear-gradient(135deg,rgba(34,211,238,.14),rgba(15,23,42,.85) 48%,rgba(245,158,11,.10));box-shadow:var(--shadow)}.hero:after{content:"TRB1";position:absolute;right:26px;bottom:-32px;font-size:6.2rem;font-weight:1000;color:rgba(34,211,238,.045)}.eyebrow{font-family:ui-monospace,Consolas,monospace;color:var(--green);letter-spacing:.12em}.hero h2{font-size:clamp(2rem,4.2vw,4.5rem);line-height:1.02;margin:8px 0 12px}.hero p{color:#cbd5e1;max-width:960px}.dashboard-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:16px;margin-top:16px}.kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.kpi-card,.panel,.module-card,.intel-card{border:1px solid rgba(148,163,184,.18);border-radius:22px;background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.025));box-shadow:0 14px 42px rgba(0,0,0,.24)}.kpi-card{padding:16px}.kpi-card small{display:block;color:var(--muted);font-weight:700}.kpi-card strong{display:block;font-size:1.55rem;margin-top:2px}.section{margin-top:16px;border:1px solid var(--line2);border-radius:28px;background:rgba(8,20,36,.78);box-shadow:var(--shadow);padding:22px}.section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.section-head h3{margin:0;font-size:1.35rem}.tag{display:inline-flex;align-items:center;border:1px solid rgba(245,158,11,.45);background:rgba(245,158,11,.12);color:#fcd34d;border-radius:999px;padding:6px 10px;font-size:.76rem;font-weight:1000;letter-spacing:.06em;text-transform:uppercase}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.grid.two{grid-template-columns:repeat(2,1fr)}.grid.four{grid-template-columns:repeat(4,1fr)}.panel,.module-card,.intel-card{padding:17px}.module-card{cursor:pointer;transition:.18s}.module-card:hover{transform:translateY(-4px);border-color:var(--line2);background:rgba(34,211,238,.08)}.module-card .module-top{display:flex;align-items:center;justify-content:space-between}.module-icon{width:42px;height:42px;border-radius:15px;display:grid;place-items:center;background:rgba(34,211,238,.13);color:var(--cyan);font-size:1.25rem}.module-card h4,.panel h4,.intel-card h4{margin:10px 0 6px}.muted,.panel p,.module-card p,.intel-card p{color:var(--muted)}.bar{height:13px;border:1px solid rgba(255,255,255,.10);border-radius:999px;background:rgba(148,163,184,.16);overflow:hidden}.bar span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--green),var(--cyan),var(--amber));transition:.25s}.check-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.check-card{display:grid;grid-template-columns:44px 1fr auto;align-items:center;gap:12px;min-height:76px;padding:13px 15px;border:1px solid rgba(148,163,184,.18);border-radius:20px;background:rgba(3,7,18,.42)}.check-card input{width:22px;height:22px;margin:0;accent-color:var(--cyan);justify-self:center}.check-card span{font-weight:850;color:#dbeafe;line-height:1.35}.check-card small{color:var(--muted);display:block}.status-badge{display:inline-flex;align-items:center;border-radius:999px;padding:5px 9px;font-size:.72rem;font-weight:1000}.status-green{background:rgba(52,211,153,.15);color:#86efac}.status-yellow{background:rgba(245,158,11,.15);color:#fcd34d}.status-red{background:rgba(251,113,133,.15);color:#fda4af}.timeline{display:grid;gap:12px}.phase-card{display:grid;grid-template-columns:112px 1fr auto;gap:14px;align-items:center;padding:15px;border:1px solid rgba(148,163,184,.18);border-radius:20px;background:rgba(3,7,18,.42)}.phase-code{color:var(--cyan);font-weight:1000;font-family:ui-monospace,Consolas,monospace}.phase-card b{color:#fff}.alert{border:1px solid rgba(251,113,133,.42);background:linear-gradient(135deg,rgba(251,113,133,.14),rgba(8,20,36,.74));border-radius:22px;padding:16px}.alert.amber{border-color:rgba(245,158,11,.42);background:linear-gradient(135deg,rgba(245,158,11,.13),rgba(8,20,36,.74))}.alert.green{border-color:rgba(52,211,153,.38);background:linear-gradient(135deg,rgba(52,211,153,.12),rgba(8,20,36,.74))}.form-card{border:1px solid rgba(148,163,184,.18);border-radius:24px;background:rgba(3,7,18,.42);padding:16px}.form-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.field,.textarea,select{width:100%;border:1px solid rgba(34,211,238,.32);background:rgba(2,6,23,.72);color:var(--text);border-radius:14px;padding:11px 12px;outline:none}.field:focus,.textarea:focus,select:focus{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(34,211,238,.10)}.table-wrap{overflow:auto;border:1px solid rgba(148,163,184,.18);border-radius:22px;background:rgba(3,7,18,.36)}table{width:100%;border-collapse:collapse;min-width:900px}th,td{padding:13px;border-bottom:1px solid rgba(148,163,184,.13);text-align:left}th{color:var(--cyan);background:rgba(34,211,238,.08);font-size:.75rem;text-transform:uppercase;letter-spacing:.06em}td{color:#dbeafe}.row-actions{display:flex;gap:8px}.mini-btn{border:1px solid rgba(148,163,184,.25);background:rgba(255,255,255,.04);color:var(--text);border-radius:12px;padding:7px 9px;font-weight:800;cursor:pointer}.mini-btn:hover{background:rgba(34,211,238,.12)}.danger-box{border:1px solid rgba(251,113,133,.42);background:rgba(251,113,133,.12);border-radius:16px;padding:12px;margin-bottom:12px}.modal{border:1px solid var(--line2);border-radius:24px;background:#020617;color:var(--text);padding:0;box-shadow:0 30px 90px rgba(0,0,0,.72);width:min(520px,92vw)}.modal.wide{width:min(920px,94vw)}.modal::backdrop{background:rgba(0,0,0,.72);backdrop-filter:blur(4px)}.modal-head{display:flex;align-items:center;justify-content:space-between;padding:15px 17px;border-bottom:1px solid var(--line)}.modal-body{padding:17px}.form-msg{min-height:20px;color:#fda4af}.mobile-tabbar{display:none}.briefing-mode .sidebar,.briefing-mode .top-actions,.briefing-mode .mobile-tabbar{display:none}.briefing-mode .main{margin:0 auto;width:100%;max-width:1180px}.briefing-mode .topbar{justify-content:center}.briefing-mode .section,.briefing-mode .hero{box-shadow:none}.hide{display:none!important}
@media(max-width:1180px){.kpi-grid,.grid.four{grid-template-columns:repeat(2,1fr)}.grid{grid-template-columns:repeat(2,1fr)}.form-grid{grid-template-columns:repeat(2,1fr)}.dashboard-grid{grid-template-columns:1fr}}@media(max-width:820px){.mobile-only{display:inline-flex}.sidebar{transform:translateX(-106%);transition:.25s}.sidebar.open{transform:translateX(0)}.main{margin:0;width:100%;padding:14px 14px 92px}.topbar{margin:-14px -14px 14px;padding:10px 12px}.top-title strong{font-size:.95rem}.pill-btn{padding:8px 10px;font-size:.82rem}.hero{padding:22px}.hero:after{font-size:3.4rem}.kpi-grid,.grid,.grid.two,.grid.four,.check-grid,.form-grid{grid-template-columns:1fr}.phase-card{grid-template-columns:1fr}.check-card{grid-template-columns:42px 1fr}.check-card .status-badge{grid-column:2}.section{padding:17px;border-radius:22px}.mobile-tabbar{position:fixed;left:10px;right:10px;bottom:10px;z-index:90;display:grid;grid-template-columns:repeat(5,1fr);gap:6px;padding:7px;border:1px solid var(--line2);border-radius:22px;background:rgba(2,6,23,.88);backdrop-filter:blur(18px)}.mobile-tabbar button{border:0;background:transparent;color:var(--muted);display:grid;gap:2px;place-items:center;font-size:.68rem}.mobile-tabbar button.active{color:var(--cyan)}}@media print{body{background:white;color:#111}.sidebar,.topbar,.mobile-tabbar,.row-actions,.form-card,.officer-only{display:none!important}.main{margin:0;width:100%;padding:0}.hero,.section,.panel,.module-card,.intel-card,.check-card,.phase-card,.alert{box-shadow:none;background:white;border-color:#ddd;color:#111;break-inside:avoid}.hero h2,.section-head h3,.panel h4,.module-card h4,.intel-card h4,td{color:#111}.muted,.panel p,.module-card p,.intel-card p{color:#333}} /* v10.8 Production Pro Expansion */
.doctrine-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.doctrine-item{border:1px solid rgba(34,211,238,.24);border-radius:22px;background:linear-gradient(180deg,rgba(34,211,238,.08),rgba(255,255,255,.03));padding:16px}.doctrine-item b{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:14px;background:rgba(34,211,238,.15);color:var(--cyan);margin-bottom:10px}.doctrine-item span{display:block;font-weight:900;color:#fff;font-size:1.02rem}.doctrine-item p{color:var(--muted);margin:.4rem 0 0}.ops-step{display:grid;grid-template-columns:105px 1fr;gap:14px;align-items:start;border:1px solid rgba(148,163,184,.18);border-radius:20px;background:rgba(2,6,23,.42);padding:15px}.step-code{font-weight:1000;color:#031019;background:linear-gradient(135deg,var(--cyan),#38bdf8);border-radius:16px;padding:10px;text-align:center;box-shadow:0 10px 30px rgba(34,211,238,.12)}.ops-step h4{margin:0 0 4px}.ops-step p{margin:.2rem 0;color:#cbd5e1}.ops-step small,.ops-card small,.intel-card small,.panel small{display:block;margin-top:8px;color:#93c5fd}.ops-card{border:1px solid rgba(245,158,11,.24);border-radius:22px;background:linear-gradient(180deg,rgba(245,158,11,.08),rgba(255,255,255,.025));padding:16px}.ops-card h4{margin:0 0 7px;color:#fff}.phase-card{position:relative;overflow:hidden}.phase-card:after{content:"";position:absolute;right:-30px;bottom:-30px;width:100px;height:100px;border-radius:50%;background:rgba(34,211,238,.06)}.intel-card small{font-weight:800}.table-wrap small.muted{font-size:.76rem}.mobile-tabbar button{font-size:.72rem}
@media(max-width:1100px){.doctrine-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:760px){.doctrine-grid{grid-template-columns:1fr}.ops-step{grid-template-columns:1fr}.step-code{text-align:left;width:max-content}.grid.four{grid-template-columns:1fr}.grid.three{grid-template-columns:1fr}} /* === v10.8 TRB1 Command Hub visual fix === */
:root{ --bg:#020611;--bg2:#050b17;--panel:#061222e8;--card:#071325; --line:#123b5a;--line2:#12d4e666;--text:#edf5ff;--muted:#9eb1c8; --cyan:#12f0d2;--blue:#35a8ff;--amber:#ffb12d;--red:#ff5f5f;--green:#2ee69b; --shadow:0 24px 80px rgba(0,0,0,.55);
}
body{ background: radial-gradient(circle at 9% 13%,rgba(0,214,255,.12),transparent 34%), radial-gradient(circle at 86% 18%,rgba(255,177,45,.10),transparent 34%), linear-gradient(135deg,#020611,#040914 58%,#07111f);
}
body:before{ background-image: linear-gradient(rgba(18,240,210,.045) 1px,transparent 1px), linear-gradient(90deg,rgba(18,240,210,.045) 1px,transparent 1px); background-size:36px 36px;
}
.topbar{ border-bottom:1px solid rgba(18,240,210,.20); background:rgba(2,6,17,.86);
}
.top-title strong{font-size:1.18rem;letter-spacing:.01em}.top-title small{color:var(--cyan)}
.pill-btn{border-radius:18px;padding:12px 18px;text-transform:uppercase;letter-spacing:.03em}
.pill-btn.officer{color:#ffd166;border-color:rgba(255,177,45,.55);background:rgba(255,177,45,.12)}
.sidebar{background:rgba(2,6,17,.90);border-right:1px solid rgba(18,240,210,.20)}
.brand-card{background:linear-gradient(135deg,rgba(18,240,210,.11),rgba(8,19,37,.82));border-color:rgba(18,240,210,.28)}
.brand-mark{background:linear-gradient(145deg,#ffd166,#9a6b17);color:#0a0d12;border-radius:14px;box-shadow:0 0 26px rgba(255,177,45,.18)}
.nav button{background:rgba(255,255,255,.035);border-color:rgba(255,255,255,.04)}
.nav button:hover,.nav button.active{background:rgba(18,240,210,.105);border-color:rgba(18,240,210,.35);transform:translateX(2px)}
.hero{ min-height:430px; padding:38px 42px 36px; border:1px solid rgba(18,240,210,.45); border-radius:30px; background: linear-gradient(112deg,rgba(8,70,91,.52) 0%,rgba(8,17,33,.88) 42%,rgba(255,177,45,.12) 100%); box-shadow:0 28px 90px rgba(0,0,0,.48), inset 0 0 0 1px rgba(255,255,255,.03);
}
.hero:before{ content:"TRB1"; position:absolute; right:5%; top:11%; font-size:clamp(8rem,22vw,23rem); line-height:.72; font-weight:1000; letter-spacing:-.08em; color:transparent; -webkit-text-stroke:2px rgba(18,240,210,.18); text-stroke:2px rgba(18,240,210,.18); opacity:.72; pointer-events:none; z-index:0;
}
.hero:after{ content:"TRB1"!important; position:absolute; right:3.5%; bottom:-2.6rem; font-size:clamp(7rem,18vw,18rem); line-height:.8; font-weight:1000; letter-spacing:-.08em; color:rgba(18,240,210,.075)!important; pointer-events:none; z-index:0;
}
.hero>*{position:relative;z-index:1}
.eyebrow{color:var(--green);font-size:1.05rem;font-weight:900;letter-spacing:.20em;text-transform:uppercase}
.hero h2{ font-size:clamp(3.4rem,7vw,7.4rem); letter-spacing:-.055em; line-height:.92; margin:18px 0 18px; text-shadow:0 10px 30px rgba(0,0,0,.45);
}
.hero h2::first-letter{color:var(--cyan)}
.hero p{font-size:1.15rem;line-height:1.75;max-width:1020px;color:#d6e6f8}
.kpi-grid{margin-top:24px;gap:20px}
.kpi-card{ min-height:168px; padding:24px 24px; border-radius:24px; border:1px solid rgba(148,163,184,.23); background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.025)); box-shadow:inset 0 0 0 1px rgba(255,255,255,.025),0 16px 45px rgba(0,0,0,.24); position:relative;overflow:hidden;
}
.kpi-card:before{content:"";position:absolute;left:22px;top:22px;width:52px;height:52px;border-radius:18px;background:rgba(18,240,210,.12);box-shadow:0 0 30px rgba(18,240,210,.14)}
.kpi-card:nth-child(2):before{background:rgba(53,168,255,.13);box-shadow:0 0 30px rgba(53,168,255,.14)}
.kpi-card:nth-child(3):before{background:rgba(255,95,95,.14);box-shadow:0 0 30px rgba(255,95,95,.14)}
.kpi-card:nth-child(4):before{background:rgba(255,177,45,.14);box-shadow:0 0 30px rgba(255,177,45,.14)}
.kpi-card small,.kpi-card strong,.kpi-card .bar,.kpi-card .status-badge{position:relative;z-index:1;margin-left:74px}
.kpi-card small{font-size:.95rem;color:#aabbd0;font-weight:900}.kpi-card strong{font-size:3.1rem;line-height:1.05;color:#f5f9ff}.kpi-card .bar{max-width:260px;margin-top:14px}.status-badge{margin-top:10px}
.kpi-card:nth-child(1) small{color:#50e9ad}.kpi-card:nth-child(2) small{color:#48b8ff}.kpi-card:nth-child(3) small{color:#ff6c6c}.kpi-card:nth-child(4) small{color:#ffc247}
.section{ border-color:rgba(18,212,230,.34); background:linear-gradient(180deg,rgba(6,18,34,.88),rgba(4,12,25,.82)); border-radius:28px;
}
.section-head h3{text-transform:none;letter-spacing:.01em}.tag{border-color:rgba(255,177,45,.45);color:#ffd166;background:rgba(255,177,45,.10)}
.intel-card,.panel,.module-card,.kpi-card{ backdrop-filter:blur(10px);
}
.intel-card h4,.panel h4,.module-card h4{color:#f2f7ff}
.module-icon{background:rgba(18,240,210,.12);color:var(--cyan)}
@media(max-width:820px){ .hero{min-height:auto;padding:24px 20px}.hero h2{font-size:clamp(2.6rem,14vw,4.2rem)}.hero:before{font-size:38vw;right:0;top:10%}.hero:after{font-size:32vw;right:0;bottom:-1rem}.kpi-card{min-height:132px}.kpi-card small,.kpi-card strong,.kpi-card .bar,.kpi-card .status-badge{margin-left:64px}.kpi-card strong{font-size:2.2rem}.kpi-card:before{width:44px;height:44px}.eyebrow{font-size:.83rem}.hero p{font-size:1rem}
}