/* ================================================================
   PIT v36 — Production Control Centre
   Production Facility — INTERNAL USE ONLY — NOT FOR DISTRIBUTION
   No external resources. Fully offline. GDPR compliant.
   ================================================================ */

/* ── Reset ───────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

/* ── Design Tokens ───────────────────────────────────────────── */
:root {
  /* Backgrounds — layered depth */
  --void:        #03040a;
  --bg-0:        #060810;
  --bg-1:        #0b0d18;
  --bg-2:        #101320;
  --bg-3:        #161a28;
  --bg-4:        #1c2133;
  --bg-5:        #222740;

  /* Borders */
  --b0: rgba(255,255,255,0.03);
  --b1: rgba(255,255,255,0.07);
  --b2: rgba(255,255,255,0.12);
  --b3: rgba(255,255,255,0.20);

  /* Text */
  --t0: #f0f2f8;       /* primary */
  --t1: #8b91aa;       /* secondary */
  --t2: #565c7a;       /* muted */
  --t3: #363b58;       /* dim */

  /* Brand accents */
  --green:       #00e676;
  --green-d:     rgba(0,230,118,0.12);
  --green-glow:  rgba(0,230,118,0.35);
  --red:         #ff4444;
  --red-d:       rgba(255,68,68,0.12);
  --red-glow:    rgba(255,68,68,0.3);
  --amber:       #ffab40;
  --amber-d:     rgba(255,171,64,0.12);
  --amber-glow:  rgba(255,171,64,0.3);
  --blue:        #40c4ff;
  --blue-d:      rgba(64,196,255,0.12);
  --cyan:        #00e5ff;
  --yellow:      #ffd740;

  /* Semantic status */
  --ok:   var(--green);
  --warn: var(--amber);
  --crit: var(--red);
  --info: var(--blue);

  /* Typography */
  --f-sans: 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Arial, sans-serif;
  --f-mono: 'Cascadia Code', 'Fira Code', 'Courier New', Consolas, monospace;

  /* Spacing */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:20px; --s6:24px;

  /* Radii */
  --r1:3px; --r2:6px; --r3:10px; --r4:16px;

  /* Shadows */
  --sh-card:  0 2px 16px rgba(0,0,0,0.55), 0 1px 4px rgba(0,0,0,0.4);
  --sh-panel: 0 4px 32px rgba(0,0,0,0.7);
  --sh-green: 0 0 16px rgba(0,230,118,0.2);
  --sh-red:   0 0 16px rgba(255,68,68,0.25);

  /* Transitions */
  --tx: 140ms ease;
  --tm: 220ms ease;
}

/* ── Base ─────────────────────────────────────────────────────── */
html, body {
  height: 100%; width: 100%;
  overflow: hidden;
  font-family: var(--f-sans);
  font-size: 13px;
  background: var(--void);
  color: var(--t0);
  -webkit-font-smoothing: antialiased;
}
body { display: flex; flex-direction: column; }

/* ── Scrollbars ───────────────────────────────────────────────── */
::-webkit-scrollbar { width: 4px; height: 4px; }
::-webkit-scrollbar-track { background: var(--bg-0); }
::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.09); border-radius: 2px; }
::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,0.16); }

/* ── Focus ────────────────────────────────────────────────────── */
:focus-visible { outline: 2px solid var(--green); outline-offset: 2px; }

/* ================================================================
   SECURITY GATE
   ================================================================ */
#pit-security-gate {
  position: fixed; inset: 0;
  background: var(--void);
  display: flex; align-items: center; justify-content: center;
  z-index: 99999;
}

.pit-security-card {
  background: var(--bg-2);
  border: 1px solid var(--b2);
  border-radius: var(--r3);
  padding: 40px 48px;
  width: 100%;
  max-width: 400px;
  box-shadow: var(--sh-panel);
  text-align: center;
}

.pit-security-badge {
  display: inline-block;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--green);
  background: var(--green-d);
  border: 1px solid rgba(0,230,118,0.25);
  border-radius: 20px;
  padding: 3px 12px;
  margin-bottom: 16px;
}

.pit-security-card h1 {
  font-size: 28px;
  font-weight: 800;
  letter-spacing: 0.08em;
  color: var(--t0);
  margin-bottom: 6px;
}

.pit-security-sub {
  font-size: 11px;
  color: var(--t2);
  margin-bottom: 28px;
  line-height: 1.5;
}

#pit-security-form label {
  display: block;
  text-align: left;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--t1);
  margin-bottom: 5px;
  margin-top: 16px;
}

#pit-security-form input[type=password] {
  width: 100%;
  margin-bottom: 4px;
  font-size: 14px;
  letter-spacing: 0.1em;
}

#pit-security-form button[type=submit] {
  width: 100%;
  margin-top: 20px;
  padding: 12px;
  background: var(--green);
  color: #000;
  border: 0;
  border-radius: var(--r2);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background var(--tx);
}
#pit-security-form button[type=submit]:hover { background: #33ff8a; }

#pit-security-message {
  font-size: 11px;
  color: var(--red);
  margin-top: 10px;
  min-height: 18px;
}

.pit-security-small {
  font-size: 10px;
  color: var(--t3);
  margin-top: 20px;
  line-height: 1.5;
}

/* ================================================================
   HEALTH BAR
   ================================================================ */
#pit-health-bar {
  display: flex;
  align-items: center;
  height: 28px;
  background: var(--bg-0);
  border-bottom: 1px solid var(--b1);
  flex-shrink: 0;
  z-index: 1000;
  font-family: var(--f-mono);
  font-size: 10px;
  color: var(--t1);
  padding: 0;
  letter-spacing: 0.04em;
  overflow: hidden;
}

/* System name brand on far left */
.hb-brand {
  display: flex;
  align-items: center;
  height: 100%;
  padding: 0 14px;
  background: var(--bg-1);
  border-right: 1px solid var(--b1);
  color: var(--green);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  white-space: nowrap;
  flex-shrink: 0;
}

.hb-indicator {
  display: flex;
  align-items: center;
  gap: 5px;
  white-space: nowrap;
  padding: 0 12px;
  height: 100%;
  border-right: 1px solid var(--b0);
  font-size: 10px;
  transition: color var(--tx);
}

.hb-dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  flex-shrink: 0;
}
.hb-dot-green { background: var(--green); box-shadow: 0 0 5px var(--green-glow); }
.hb-dot-amber { background: var(--amber); box-shadow: 0 0 5px var(--amber-glow); }
.hb-dot-red   { background: var(--red);   box-shadow: 0 0 5px var(--red-glow); animation: pulse 1s infinite; }

@keyframes pulse { 50% { opacity: 0.3; } }

.hb-spacer { flex: 1; }

.hb-clock {
  padding: 0 16px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.14em;
  color: var(--t1);
  border-left: 1px solid var(--b1);
  height: 100%;
  display: flex;
  align-items: center;
}

#hb-offline-queue { color: var(--amber); }
#hb-errors { color: var(--red); }
#hb-security-mode { color: var(--green); }

/* ================================================================
   APP SHELL
   ================================================================ */
#pit-app-container {
  flex: 1;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  min-height: 0;
}

/* ================================================================
   TAB BAR
   ================================================================ */
#pit-tabs {
  display: flex;
  background: var(--bg-1);
  border-bottom: 1px solid var(--b1);
  flex-shrink: 0;
  overflow-x: auto;
  scrollbar-width: none;
  padding: 0 var(--s2);
}
#pit-tabs::-webkit-scrollbar { display: none; }

.pit-tab {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 0 16px;
  height: 40px;
  background: transparent;
  border: 0;
  border-bottom: 2px solid transparent;
  color: var(--t2);
  cursor: pointer;
  font-family: var(--f-sans);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  white-space: nowrap;
  transition: color var(--tx), border-color var(--tx), background var(--tx);
  margin-bottom: -1px;
  border-radius: var(--r1) var(--r1) 0 0;
}
.pit-tab:hover { color: var(--t0); background: rgba(255,255,255,0.03); }
.pit-tab.active { color: var(--green); border-bottom-color: var(--green); background: var(--green-d); }
.pit-tab .tab-icon { font-size: 13px; }

/* ================================================================
   PANEL SHELL
   ================================================================ */
.pit-tab-content {
  flex: 1;
  overflow: auto;
  min-height: 0;
  background: var(--bg-1);
}

.pit-panel {
  display: none;
  padding: var(--s4);
  height: 100%;
  overflow: auto;
  flex-direction: column;
  gap: var(--s3);
}
.pit-panel.active { display: flex; }

/* ── Panel header ─────────────────────────────────────────────── */
.panel-toolbar {
  display: flex;
  align-items: flex-start;
  gap: var(--s3);
  flex-wrap: wrap;
  flex-shrink: 0;
  padding-bottom: var(--s3);
  border-bottom: 1px solid var(--b1);
}

.panel-title {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--t1);
  padding-top: 2px;
  white-space: nowrap;
}

.toolbar-group {
  display: flex;
  align-items: center;
  gap: var(--s1);
  flex-wrap: wrap;
}

/* ================================================================
   SHARED COMPONENTS
   ================================================================ */

/* ── Cards ────────────────────────────────────────────────────── */
.forge-card {
  background: var(--bg-2);
  border: 1px solid var(--b1);
  border-radius: var(--r2);
  box-shadow: var(--sh-card);
  padding: var(--s4);
}

.forge-card-head {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--t2);
  margin-bottom: var(--s3);
  padding-bottom: var(--s2);
  border-bottom: 1px solid var(--b0);
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* ── KPI Grid ─────────────────────────────────────────────────── */
.kpi-row {
  display: flex;
  gap: var(--s2);
  flex-wrap: wrap;
  flex-shrink: 0;
}

.kpi-tile {
  flex: 1;
  min-width: 110px;
  background: var(--bg-2);
  border: 1px solid var(--b1);
  border-radius: var(--r2);
  padding: 12px var(--s3);
  display: flex;
  flex-direction: column;
  gap: 3px;
  position: relative;
  overflow: hidden;
}

.kpi-tile::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: var(--b2);
}
.kpi-tile.ok::before  { background: var(--green); }
.kpi-tile.warn::before { background: var(--amber); }
.kpi-tile.crit::before { background: var(--red); }
.kpi-tile.info::before { background: var(--blue); }

.kpi-label {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--t2);
}

.kpi-value {
  font-size: 22px;
  font-weight: 800;
  color: var(--t0);
  font-family: var(--f-mono);
  letter-spacing: -0.02em;
  line-height: 1;
}

.kpi-tile.ok   .kpi-value { color: var(--green); }
.kpi-tile.warn .kpi-value { color: var(--amber); }
.kpi-tile.crit .kpi-value { color: var(--red); }

.kpi-sub {
  font-size: 10px;
  color: var(--t2);
  line-height: 1.3;
}

/* ── Buttons ──────────────────────────────────────────────────── */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 0 14px;
  height: 30px;
  border: 1px solid var(--b2);
  border-radius: var(--r1);
  background: var(--bg-3);
  color: var(--t0);
  font-family: var(--f-sans);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  cursor: pointer;
  white-space: nowrap;
  transition: all var(--tx);
  touch-action: manipulation;
  min-height: 30px;
}
.btn:hover { background: var(--bg-4); border-color: var(--b3); color: var(--t0); }
.btn:active { transform: scale(0.97); }

.btn-primary { background: var(--green); color: #000; border-color: var(--green); font-weight: 800; }
.btn-primary:hover { background: #33ff8a; border-color: #33ff8a; }

.btn-danger  { background: var(--red); color: #fff; border-color: var(--red); }
.btn-danger:hover { background: #ff6666; }

.btn-sm { height: 26px; padding: 0 10px; font-size: 9px; }
.btn-lg { height: 36px; padding: 0 20px; font-size: 11px; }

/* ── Forms ────────────────────────────────────────────────────── */
input, select, textarea {
  background: var(--bg-3);
  border: 1px solid var(--b2);
  color: var(--t0);
  font-family: var(--f-sans);
  font-size: 12px;
  border-radius: var(--r1);
  padding: 0 10px;
  height: 30px;
  transition: border-color var(--tx);
}
input:focus, select:focus { outline: none; border-color: var(--green); box-shadow: 0 0 0 2px var(--green-d); }
input[type=date] { min-width: 136px; }
input[type=number] { width: 60px; text-align: center; font-family: var(--f-mono); }

.field-label {
  display: flex;
  align-items: center;
  gap: var(--s2);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--t1);
  white-space: nowrap;
}

/* ── Badges ───────────────────────────────────────────────────── */
.badge {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 20px;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  white-space: nowrap;
  border: 1px solid transparent;
}

.badge-green  { background: var(--green-d); color: var(--green);  border-color: rgba(0,230,118,0.25); }
.badge-red    { background: var(--red-d);   color: var(--red);    border-color: rgba(255,68,68,0.25); }
.badge-amber  { background: var(--amber-d); color: var(--amber);  border-color: rgba(255,171,64,0.25); }
.badge-blue   { background: var(--blue-d);  color: var(--blue);   border-color: rgba(64,196,255,0.25); }
.badge-ghost  { background: var(--bg-3);    color: var(--t1);     border-color: var(--b2); }

/* Carrier badges */
.badge-dpd           { background: rgba(64,196,255,0.15); color: var(--blue); }
.badge-parcel-force  { background: rgba(255,171,64,0.15); color: var(--amber); }
.badge-royal-mail    { background: rgba(255,68,68,0.15);  color: var(--red); }
.badge-dhl           { background: rgba(255,215,64,0.15); color: var(--yellow); }

/* Priority badges */
.badge-urgent  { background: var(--red);   color: #fff; }
.badge-high    { background: var(--amber); color: #000; font-weight: 900; }
.badge-normal  { background: var(--bg-3);  color: var(--t1);  border-color: var(--b2); }
.badge-low     { color: var(--t2); border-color: var(--b1); background: transparent; }

/* ── Alert strips ─────────────────────────────────────────────── */
.alert-strip {
  padding: var(--s2) var(--s3);
  border-radius: 0 var(--r1) var(--r1) 0;
  border-left: 3px solid;
  font-size: 11px;
  font-weight: 600;
  margin: 2px 0;
  line-height: 1.4;
}
.alert-critical { border-left-color: var(--red);   background: var(--red-d);   color: var(--red); }
.alert-panic    { border-left-color: var(--red);   background: rgba(255,68,68,0.08); color: var(--red); animation: pulse 2s infinite; }
.alert-warn     { border-left-color: var(--amber); background: var(--amber-d); color: var(--amber); }
.alert-ok       { border-left-color: var(--green); background: var(--green-d); color: var(--green); }

/* ── Section headings ─────────────────────────────────────────── */
.section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: var(--s2);
}
.section-head h3 {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--t2);
}
.section-head span {
  font-size: 10px;
  color: var(--t2);
}

/* ── Empty state ──────────────────────────────────────────────── */
.empty-state {
  padding: var(--s4);
  text-align: center;
  color: var(--t2);
  font-size: 11px;
}

/* ================================================================
   DISPATCH BOARD
   ================================================================ */
.dispatch-view-btns {
  display: flex;
  gap: var(--s1);
  flex-wrap: wrap;
}

/* Risk summary bar */
#dispatch-risk-summary {
  flex-shrink: 0;
}

.ops-risk-topline {
  display: flex;
  gap: var(--s2);
  flex-wrap: wrap;
  margin-bottom: var(--s2);
}

/* Carrier tiles */
.carrier-grid {
  display: flex;
  gap: var(--s2);
  flex-wrap: wrap;
}

.carrier-tile {
  flex: 1;
  min-width: 140px;
  background: var(--bg-2);
  border: 1px solid var(--b1);
  border-left: 3px solid var(--b2);
  border-radius: 0 var(--r2) var(--r2) 0;
  padding: var(--s2) var(--s3);
  font-size: 11px;
  line-height: 1.6;
}
.carrier-tile strong { font-size: 12px; display: block; margin-bottom: 2px; }
.carrier-tile small { font-size: 10px; color: var(--t2); }
.carrier-safe     { border-left-color: var(--green); }
.carrier-warning  { border-left-color: var(--amber); }
.carrier-critical { border-left-color: var(--red); background: var(--red-d); }

/* Recommendations */
#dispatch-recommendations {
  flex-shrink: 0;
}
.rec-head {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--amber);
  margin-bottom: var(--s2);
}
.rec-item {
  padding: var(--s2) var(--s3);
  border-left: 3px solid var(--b2);
  border-radius: 0 var(--r1) var(--r1) 0;
  margin: 3px 0;
  font-size: 11px;
  line-height: 1.5;
  background: var(--bg-2);
}
.rec-critical { border-left-color: var(--red); background: var(--red-d); }
.rec-urgent   { border-left-color: var(--amber); background: var(--amber-d); }
.rec-action   { font-size: 10px; color: var(--cyan); display: block; margin-top: 2px; }
.no-recs { color: var(--green); font-size: 11px; font-weight: 600; padding: var(--s1) 0; }

/* ── Dispatch Table ───────────────────────────────────────────── */
.table-shell {
  flex: 1;
  overflow: auto;
  border: 1px solid var(--b1);
  border-radius: var(--r2);
  min-height: 200px;
  box-shadow: var(--sh-card);
}

.forge-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}

.forge-table thead { position: sticky; top: 0; z-index: 2; }

.forge-table th {
  background: var(--bg-0);
  padding: 9px 8px;
  text-align: left;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--t2);
  border-bottom: 1px solid var(--b2);
  white-space: nowrap;
}

.forge-table th:first-child { padding-left: 14px; }

.forge-table td {
  padding: 7px 8px;
  border-bottom: 1px solid var(--b0);
  vertical-align: middle;
  color: var(--t0);
}

.forge-table td:first-child { padding-left: 14px; }

.forge-table tbody tr { transition: background var(--tx); }
.forge-table tbody tr:hover { background: var(--bg-3); }

/* Row states */
.row-will-miss { background: rgba(255,68,68,0.07);  border-left: 3px solid var(--red); }
.row-at-risk   { background: rgba(255,171,64,0.06); border-left: 3px solid var(--amber); }
.row-green     { background: rgba(0,230,118,0.05);  border-left: 3px solid var(--green); }

/* Numeric columns */
.forge-table td.num, .forge-table th.num {
  text-align: right;
  padding-right: 14px;
  font-family: var(--f-mono);
  font-size: 11px;
  font-variant-numeric: tabular-nums;
}

.job-id {
  font-family: var(--f-mono);
  font-size: 11px;
  color: var(--t0);
  font-weight: 600;
}

.spoilage-flag { color: var(--amber); font-weight: 700; font-size: 11px; }

/* ================================================================
   COMMAND CENTRE (Dispatch header KPIs)
   ================================================================ */
#pit-command-centre {
  flex-shrink: 0;
}

.hero-banner {
  background: var(--bg-2);
  border: 1px solid var(--b1);
  border-radius: var(--r2);
  padding: var(--s3) var(--s4);
  margin-bottom: var(--s3);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--s4);
  flex-wrap: wrap;
}

.hero-title {
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.06em;
  color: var(--t0);
}

.hero-sub {
  font-size: 10px;
  color: var(--t2);
  margin-top: 2px;
}

.hero-badges {
  display: flex;
  gap: var(--s1);
  flex-wrap: wrap;
}

/* ================================================================
   PRODUCTION TAB
   ================================================================ */
.dept-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: var(--s2);
}

.dept-card {
  background: var(--bg-2);
  border: 1px solid var(--b1);
  border-radius: var(--r2);
  padding: var(--s3);
}

.dept-card-title {
  font-size: 11px;
  font-weight: 700;
  color: var(--t0);
  margin-bottom: var(--s1);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.dept-card-metrics {
  display: flex;
  gap: var(--s2);
  font-size: 10px;
  color: var(--t1);
  flex-wrap: wrap;
  margin-bottom: var(--s2);
}

.dept-progress {
  height: 4px;
  background: var(--bg-4);
  border-radius: 2px;
  overflow: hidden;
  margin-bottom: var(--s2);
}
.dept-progress span {
  display: block;
  height: 100%;
  background: var(--green);
  border-radius: 2px;
  max-width: 100%;
}

.dept-card-footer {
  display: flex;
  justify-content: space-between;
  font-size: 10px;
  color: var(--t2);
}

/* Machine load table */
.mini-table { display: flex; flex-direction: column; gap: 1px; }
.mini-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 5px var(--s2);
  background: var(--bg-2);
  border-radius: var(--r1);
  font-size: 11px;
  gap: var(--s2);
}
.mini-row strong { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.mini-row span { color: var(--t1); font-family: var(--f-mono); font-size: 10px; white-space: nowrap; }

/* ================================================================
   TRIAGE TAB
   ================================================================ */
.job-list { display: flex; flex-direction: column; gap: var(--s2); }

.job-card {
  background: var(--bg-2);
  border: 1px solid var(--b1);
  border-radius: var(--r2);
  padding: var(--s3);
  display: flex;
  flex-direction: column;
  gap: var(--s1);
}

.job-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--s2);
}

.job-card-id { font-family: var(--f-mono); font-size: 12px; font-weight: 700; color: var(--t0); }
.job-card-customer { font-size: 11px; color: var(--t1); }
.job-card-detail { font-size: 11px; color: var(--t1); }

.job-actions {
  display: flex;
  gap: var(--s1);
  margin-top: var(--s1);
}

/* ================================================================
   WALLBOARD
   ================================================================ */
#tab-wallboard {
  background: var(--void);
  padding: 28px !important;
}

.wallboard-layout {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 20px;
  height: 100%;
  align-items: start;
}

.wallboard-stats-row {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}

.wb-stat {
  flex: 1;
  min-width: 160px;
  background: var(--bg-1);
  border: 1px solid var(--b1);
  border-radius: var(--r3);
  padding: 20px 24px;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.wb-stat::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 2px;
  background: var(--b1);
}
.wb-stat.ok::after   { background: var(--green); }
.wb-stat.warn::after { background: var(--amber); }
.wb-stat.crit::after { background: var(--red); }

.wb-stat-value {
  font-size: 52px;
  font-weight: 900;
  line-height: 1;
  font-family: var(--f-mono);
  letter-spacing: -0.03em;
  color: var(--t0);
}
.wb-stat.ok   .wb-stat-value { color: var(--green); }
.wb-stat.warn .wb-stat-value { color: var(--amber); }
.wb-stat.crit .wb-stat-value { color: var(--red); }

.wb-stat-label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--t2);
  margin-top: var(--s2);
}

.wb-alerts {
  padding: 16px 20px;
  background: var(--bg-1);
  border: 1px solid rgba(255,68,68,0.2);
  border-radius: var(--r3);
  min-height: 60px;
}

.wb-all-clear {
  color: var(--green);
  font-size: 18px;
  font-weight: 700;
  text-align: center;
  padding: var(--s4);
}

.wb-carriers {
  padding: 16px 20px;
  background: var(--bg-1);
  border: 1px solid var(--b1);
  border-radius: var(--r3);
}

.wb-carrier-grid {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: var(--s3);
}

.wb-carrier-tile {
  flex: 1;
  min-width: 120px;
  background: var(--bg-2);
  border: 1px solid var(--b1);
  border-radius: var(--r2);
  padding: var(--s3) var(--s3);
  text-align: center;
}
.wb-carrier-tile strong { display: block; font-size: 12px; margin-bottom: 4px; }
.wb-carrier-tile span { display: block; font-size: 11px; color: var(--t1); font-family: var(--f-mono); }

/* ================================================================
   CAPACITY TAB
   ================================================================ */
.capacity-layout {
  display: flex;
  gap: var(--s3);
  flex-wrap: wrap;
  flex: 1;
  min-height: 0;
}

.cap-left { flex: 2; min-width: 280px; display: flex; flex-direction: column; gap: var(--s3); }
.cap-right { flex: 1; min-width: 240px; display: flex; flex-direction: column; gap: var(--s3); }

.load-bars { display: flex; flex-direction: column; gap: 3px; max-height: 340px; overflow-y: auto; }

.load-row {
  display: flex;
  align-items: center;
  gap: var(--s2);
  padding: 4px 0;
  border-bottom: 1px solid var(--b0);
  font-size: 11px;
}
.load-row:last-child { border-bottom: none; }
.load-dept { width: 130px; min-width: 130px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.load-staff { width: 40px; text-align: center; font-family: var(--f-mono); font-size: 10px; color: var(--t2); }
.load-bar-bg { flex: 1; height: 7px; background: var(--bg-4); border-radius: 3px; overflow: hidden; }
.load-bar-fill { height: 100%; border-radius: 3px; transition: width var(--tm); }
.load-pct { width: 38px; text-align: right; font-family: var(--f-mono); font-size: 10px; color: var(--t1); }
.load-jobs { width: 48px; text-align: right; font-size: 10px; color: var(--t2); }

/* Staff editor */
.staff-rows { display: flex; flex-direction: column; gap: 2px; }
.staff-row {
  display: flex;
  align-items: center;
  gap: var(--s2);
  padding: 3px 0;
  border-bottom: 1px solid var(--b0);
  font-size: 11px;
}
.staff-row:last-child { border-bottom: none; }
.staff-dept { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.staff-need { font-size: 10px; color: var(--t2); width: 60px; text-align: right; }
.staff-input { width: 48px; text-align: center; font-family: var(--f-mono); }

/* Machine toggles */
.machine-rows { display: flex; flex-direction: column; gap: 3px; }
.machine-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 4px 0;
  border-bottom: 1px solid var(--b0);
  font-size: 11px;
  gap: var(--s2);
}
.machine-row:last-child { border-bottom: none; }
.machine-toggle {
  padding: 4px 14px;
  border: 0;
  border-radius: var(--r1);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  cursor: pointer;
  min-width: 72px;
  min-height: 28px;
  transition: all var(--tx);
  touch-action: manipulation;
}
.machine-toggle.available { background: var(--green); color: #000; }
.machine-toggle.unavailable { background: var(--red); color: #fff; }

/* Planner output */
#daily-planner-output { margin-top: var(--s3); font-size: 12px; }

/* ================================================================
   SPOILAGE TAB
   ================================================================ */
.spoilage-layout { display: flex; flex-direction: column; gap: var(--s3); }

/* ================================================================
   IMPORT TAB
   ================================================================ */
.import-zone {
  border: 2px dashed var(--b2);
  border-radius: var(--r3);
  background: var(--bg-2);
  padding: 48px 32px;
  text-align: center;
  cursor: pointer;
  transition: all var(--tm);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--s2);
  min-height: 160px;
  touch-action: manipulation;
}
.import-zone:hover, .import-zone.drag-over {
  border-color: var(--green);
  background: rgba(0,230,118,0.04);
  box-shadow: var(--sh-green);
}
.import-zone-icon { font-size: 28px; }
.import-zone-text { font-size: 14px; font-weight: 700; color: var(--t0); }
.import-zone-hint { font-size: 11px; color: var(--t2); }

.import-summary {
  display: flex;
  gap: var(--s2);
  flex-wrap: wrap;
  padding: var(--s3) var(--s4);
  background: var(--bg-2);
  border: 1px solid var(--b1);
  border-radius: var(--r2);
  font-size: 11px;
  align-items: center;
}
.import-summary strong { color: var(--t0); margin-right: var(--s2); }
.import-summary span { color: var(--t1); padding: 2px 8px; background: var(--bg-3); border-radius: var(--r1); font-family: var(--f-mono); font-size: 10px; }

.security-panel {
  padding: var(--s4);
  background: var(--bg-2);
  border: 1px solid var(--b1);
  border-radius: var(--r2);
}
.security-panel h3 {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--t2);
  margin-bottom: var(--s3);
  padding-bottom: var(--s2);
  border-bottom: 1px solid var(--b1);
}
.security-panel p, .security-panel li { font-size: 11px; color: var(--t1); line-height: 1.6; }
.security-panel ul { padding-left: 16px; margin: var(--s2) 0; }
.security-panel li { margin: 2px 0; }
.security-panel .btn-row { display: flex; gap: var(--s2); flex-wrap: wrap; margin-top: var(--s3); }
.gdpr-note {
  font-size: 10px;
  color: var(--t2);
  letter-spacing: 0.03em;
  padding: var(--s2) 0;
  display: flex;
  align-items: center;
  gap: var(--s1);
}

/* ================================================================
   CSV PROGRESS OVERLAY
   ================================================================ */
#pit-csv-progress {
  position: fixed;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  background: rgba(6,8,16,0.97);
  border: 1px solid var(--b2);
  border-radius: var(--r3);
  padding: 28px 36px;
  z-index: 10001;
  text-align: center;
  min-width: 320px;
  box-shadow: var(--sh-panel);
  backdrop-filter: blur(16px);
}
#pit-csv-progress-title {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--green);
  margin-bottom: var(--s4);
}
.progress-bar-bg {
  width: 100%; height: 5px;
  background: var(--bg-3);
  border-radius: 3px;
  overflow: hidden;
  margin: var(--s3) 0;
}
.progress-bar-fill {
  width: 0; height: 100%;
  background: linear-gradient(90deg, var(--green), var(--cyan));
  border-radius: 3px;
  transition: width 0.3s ease;
}
#pit-csv-progress-stats { font-size: 10px; color: var(--t1); font-family: var(--f-mono); }
#pit-csv-progress-phase { font-size: 10px; color: var(--t2); margin-top: 4px; }

/* ================================================================
   PERF PANEL
   ================================================================ */
#pit-perf-panel {
  position: fixed;
  bottom: 0; right: 0;
  width: 280px;
  max-height: 180px;
  background: rgba(3,4,10,0.97);
  border-top: 1px solid rgba(0,230,118,0.2);
  border-left: 1px solid rgba(0,230,118,0.2);
  color: var(--green);
  font-family: var(--f-mono);
  font-size: 10px;
  padding: var(--s2) var(--s3);
  z-index: 9999;
  overflow-y: auto;
}
.perf-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: var(--s2); font-size: 9px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--t2); }
.perf-row { display: flex; justify-content: space-between; padding: 2px 0; border-bottom: 1px solid var(--b0); }
.perf-close { background: none; border: 0; color: var(--red); cursor: pointer; font-size: 12px; padding: 0; }
.perf-good { color: var(--green); }
.perf-warn { color: var(--amber); }
.perf-bad  { color: var(--red); }

/* ================================================================
   RESPONSIVE
   ================================================================ */
@media (max-width: 1024px) {
  #pit-health-bar { height: 32px; }
  .hb-indicator { padding: 0 10px; }
  .pit-tab { height: 44px; padding: 0 14px; }
  .forge-table { font-size: 11px; }
  .kpi-value { font-size: 18px; }
}

@media (max-width: 768px) {
  .hb-brand { padding: 0 10px; font-size: 9px; letter-spacing: 0.1em; }
  .pit-panel { padding: var(--s2); }
  .dispatch-view-btns .btn { min-height: 36px; }
  input, select { min-height: 36px; }
  .machine-toggle { min-height: 34px; }
  .wb-stat-value { font-size: 36px; }
  .wb-stat { min-width: 120px; padding: var(--s4); }
  .carrier-tile { min-width: 100%; }
  .kpi-tile { min-width: 90px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

@media print {
  #pit-health-bar, #pit-tabs, #pit-perf-panel, #pit-security-gate { display: none !important; }
  body { background: #fff !important; color: #000 !important; overflow: visible !important; }
  html, body { height: auto !important; }
  .pit-panel { display: block !important; height: auto !important; overflow: visible !important; }
  .forge-table th { background: #eee !important; color: #000 !important; }
  .forge-table td { color: #000 !important; border-color: #ccc !important; }
}

/* ================================================================
   PRODUCTION SECURITY BOUNDARY
   All resources are self-contained.
   No @import. No external url(). No CDN. No tracking.
   PIT v36 — Production Facility Internal Only.
   ================================================================ */

/* ================================================================
   PIT v36.3 — UI/UX Premium Polish
   Cleaner hierarchy, stronger command centre, better tablet use.
   ================================================================ */
body {
  background:
    radial-gradient(circle at 15% -10%, rgba(64,196,255,0.16), transparent 32%),
    radial-gradient(circle at 85% 0%, rgba(0,230,118,0.10), transparent 28%),
    linear-gradient(180deg, #040610 0%, #070914 46%, #03040a 100%);
}

#pit-health-bar {
  height: 34px;
  padding-right: 10px;
  background: linear-gradient(90deg, rgba(0,230,118,0.10), rgba(6,8,16,0.96) 25%, rgba(6,8,16,0.96));
  border-bottom: 1px solid rgba(0,230,118,0.16);
  box-shadow: 0 1px 0 rgba(255,255,255,0.04), 0 12px 36px rgba(0,0,0,0.28);
}

.hb-brand {
  min-width: 176px;
  background: linear-gradient(90deg, rgba(0,230,118,0.16), rgba(64,196,255,0.05));
  border-right: 1px solid rgba(255,255,255,0.08);
  color: var(--green);
  font-weight: 900;
  letter-spacing: 0.12em;
}

.hb-indicator {
  padding: 3px 7px;
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 999px;
  background: rgba(255,255,255,0.025);
}

#pit-app-container {
  background: transparent;
}

#pit-tabs {
  display: flex;
  gap: 8px;
  padding: 10px 12px;
  background: rgba(6,8,16,0.72);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid rgba(255,255,255,0.08);
}

.pit-tab {
  min-height: 42px;
  padding: 0 16px;
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 12px;
  background: rgba(255,255,255,0.025);
  color: var(--t1);
  font-weight: 750;
  letter-spacing: 0.015em;
  transition: transform 120ms ease, border-color 120ms ease, background 120ms ease, color 120ms ease;
}

.pit-tab:hover {
  transform: translateY(-1px);
  border-color: rgba(64,196,255,0.24);
  color: var(--t0);
  background: rgba(64,196,255,0.055);
}

.pit-tab.active {
  color: #03100a;
  background: linear-gradient(135deg, var(--green), #40c4ff);
  border-color: rgba(255,255,255,0.2);
  box-shadow: 0 8px 28px rgba(0,230,118,0.17);
}

.pit-panel {
  padding: 14px;
  gap: 12px;
}

.panel-toolbar {
  position: sticky;
  top: 0;
  z-index: 30;
  min-height: 58px;
  padding: 10px 12px;
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 16px;
  background: rgba(11,13,24,0.88);
  backdrop-filter: blur(18px);
  box-shadow: 0 12px 40px rgba(0,0,0,0.22);
}

.panel-title {
  font-size: 15px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.forge-card,
.table-shell,
.hero-banner,
.kpi-tile,
.brief-card,
.dept-card,
.job-card,
.import-zone,
.security-panel {
  border: 1px solid rgba(255,255,255,0.09) !important;
  background: linear-gradient(180deg, rgba(255,255,255,0.055), rgba(255,255,255,0.018)) !important;
  box-shadow: 0 18px 50px rgba(0,0,0,0.26), inset 0 1px 0 rgba(255,255,255,0.055);
}

.hero-premium {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding: 18px;
  overflow: hidden;
  position: relative;
}
.hero-premium::after {
  content: '';
  position: absolute;
  inset: -60% -20% auto auto;
  width: 360px;
  height: 220px;
  background: radial-gradient(circle, rgba(0,230,118,0.18), transparent 64%);
  pointer-events: none;
}
.hero-kicker {
  color: var(--green);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  margin-bottom: 4px;
}
.hero-title {
  font-size: 22px;
  line-height: 1.1;
  letter-spacing: -0.02em;
}
.hero-sub {
  margin-top: 6px;
  color: var(--t1);
}
.hero-badges {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  z-index: 1;
}

.command-kpis {
  grid-template-columns: repeat(6, minmax(130px, 1fr));
}
.kpi-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
  gap: 10px;
}
.kpi-tile {
  min-height: 104px;
  border-radius: 16px !important;
  padding: 14px;
  position: relative;
  overflow: hidden;
}
.kpi-tile::before {
  content: '';
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  background: var(--blue);
  opacity: 0.95;
}
.kpi-tile.ok::before { background: var(--green); }
.kpi-tile.warn::before { background: var(--amber); }
.kpi-tile.crit::before { background: var(--red); }
.kpi-value {
  font-size: 27px;
  font-weight: 950;
  margin-top: 8px;
  letter-spacing: -0.035em;
}
.kpi-label {
  color: var(--t1);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}
.kpi-sub {
  color: var(--t2);
  margin-top: 6px;
}

.ops-briefing {
  display: grid;
  grid-template-columns: 1.25fr 1fr 1fr;
  gap: 10px;
  margin: 12px 0;
}
.brief-card {
  border-radius: 16px !important;
  padding: 14px;
  min-height: 108px;
}
.brief-card.brief-ok { border-color: rgba(0,230,118,0.24) !important; }
.brief-card.brief-warn { border-color: rgba(255,171,64,0.36) !important; background: linear-gradient(180deg, rgba(255,171,64,0.09), rgba(255,255,255,0.018)) !important; }
.brief-card.brief-crit { border-color: rgba(255,68,68,0.42) !important; background: linear-gradient(180deg, rgba(255,68,68,0.12), rgba(255,255,255,0.018)) !important; }
.brief-label {
  color: var(--t2);
  font-size: 10px;
  font-weight: 850;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}
.brief-title {
  margin-top: 8px;
  color: var(--t0);
  font-size: 15px;
  font-weight: 900;
  line-height: 1.25;
}
.brief-text {
  margin-top: 7px;
  color: var(--t1);
  font-size: 12px;
  line-height: 1.45;
}

.forge-table {
  border-collapse: separate !important;
  border-spacing: 0;
}
.forge-table thead th {
  position: sticky;
  top: 0;
  z-index: 5;
  background: rgba(13,16,28,0.96);
  backdrop-filter: blur(12px);
  color: var(--t1);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border-bottom: 1px solid rgba(0,230,118,0.16);
}
.forge-table tbody tr {
  transition: background 110ms ease, transform 110ms ease;
}
.forge-table tbody tr:hover {
  background: rgba(64,196,255,0.065) !important;
}
.forge-table td {
  border-bottom: 1px solid rgba(255,255,255,0.045);
}
.row-green td:first-child,
.row-at-risk td:first-child,
.row-will-miss td:first-child { position: relative; }
.row-green td:first-child::before,
.row-at-risk td:first-child::before,
.row-will-miss td:first-child::before {
  content: '';
  position: absolute;
  left: 0; top: 7px; bottom: 7px;
  width: 3px;
  border-radius: 99px;
}
.row-green td:first-child::before { background: var(--green); }
.row-at-risk td:first-child::before { background: var(--amber); }
.row-will-miss td:first-child::before { background: var(--red); }

.dept-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 10px;
}
.dept-card {
  border-radius: 16px !important;
  padding: 13px;
}
.dept-card-title {
  font-size: 14px;
  font-weight: 900;
}
.dept-card-metrics {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  color: var(--t1);
  font-size: 11px;
  margin-top: 8px;
}
.dept-progress {
  margin-top: 12px;
  height: 8px;
  background: rgba(255,255,255,0.055);
  border-radius: 99px;
  overflow: hidden;
}
.dept-progress span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--green), var(--blue));
}
.dept-card-footer {
  display: flex;
  justify-content: space-between;
  margin-top: 10px;
  color: var(--t1);
  font-size: 11px;
}

.import-zone {
  min-height: 220px;
  border-style: dashed !important;
  border-width: 2px !important;
  border-color: rgba(0,230,118,0.26) !important;
  border-radius: 20px !important;
  background: radial-gradient(circle at 50% 0%, rgba(0,230,118,0.12), rgba(255,255,255,0.02) 58%) !important;
}
.import-zone:hover {
  border-color: rgba(0,230,118,0.62) !important;
  transform: translateY(-1px);
}
.import-zone-icon { font-size: 42px; }
.import-zone-text { font-size: 18px; font-weight: 900; }
.import-zone-hint { color: var(--t1); }

.security-panel ul {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 6px 14px;
  margin-top: 10px;
}
.security-panel li {
  color: var(--t1);
}

@media (max-width: 1100px) {
  .command-kpis { grid-template-columns: repeat(3, minmax(140px, 1fr)); }
  .ops-briefing { grid-template-columns: 1fr; }
  .hero-premium { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 720px) {
  #pit-health-bar { height: auto; min-height: 34px; flex-wrap: wrap; padding-bottom: 4px; }
  .hb-brand { width: 100%; min-width: 0; justify-content: center; }
  #pit-tabs { gap: 6px; padding: 8px; }
  .pit-tab { min-height: 38px; padding: 0 11px; }
  .pit-panel { padding: 9px; }
  .panel-toolbar { position: relative; }
  .command-kpis, .kpi-row { grid-template-columns: repeat(2, minmax(120px, 1fr)); }
  .hero-title { font-size: 18px; }
  .forge-table { font-size: 11px; }
}

/* ==========================================================
   PIT v36 — UI Layer
   Purpose: restore the full module feel and make the interface
   look like a premium production command system without adding
   external fonts, CDNs, tracking, or frameworks.
   ========================================================== */
:root {
  --glass: rgba(14, 20, 34, 0.72);
  --glass-2: rgba(20, 29, 49, 0.86);
  --stroke: rgba(148, 163, 184, 0.16);
  --stroke-strong: rgba(148, 163, 184, 0.28);
  --glow-blue: 0 18px 60px rgba(56, 189, 248, 0.12);
  --glow-green: 0 18px 60px rgba(34, 197, 94, 0.11);
  --shadow-soft: 0 18px 55px rgba(0,0,0,0.34);
}

body {
  background:
    radial-gradient(circle at 18% -8%, rgba(56,189,248,0.22), transparent 34%),
    radial-gradient(circle at 86% 12%, rgba(16,185,129,0.16), transparent 30%),
    linear-gradient(180deg, #050814 0%, #080b16 46%, #050710 100%) !important;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(255,255,255,0.028) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.022) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: linear-gradient(180deg, rgba(0,0,0,0.9), rgba(0,0,0,0.15));
  z-index: 0;
}
#pit-health-bar,
#pit-app-container,
#pit-csv-progress,
#pit-perf-panel { position: relative; z-index: 1; }

#pit-health-bar {
  background: rgba(3, 7, 18, 0.9) !important;
  backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--stroke) !important;
  box-shadow: 0 6px 26px rgba(0,0,0,0.35);
}
.hb-brand {
  background: linear-gradient(90deg, rgba(56,189,248,0.18), rgba(34,197,94,0.13));
  border: 1px solid var(--stroke);
  padding: 3px 8px;
  border-radius: 999px;
}
.hb-indicator {
  background: rgba(255,255,255,0.035);
  border: 1px solid rgba(255,255,255,0.055);
  border-radius: 999px;
  padding: 3px 8px;
}

#pit-tabs {
  background: rgba(7, 11, 22, 0.72) !important;
  backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--stroke) !important;
  padding: 10px 12px;
  gap: 8px;
}
.pit-tab {
  border: 1px solid rgba(148,163,184,0.12) !important;
  border-radius: 14px !important;
  background: rgba(15,23,42,0.54) !important;
  min-height: 44px;
  padding: 0 15px !important;
  color: #aeb9c9 !important;
  font-weight: 800;
  letter-spacing: 0.01em;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04);
}
.pit-tab:hover {
  transform: translateY(-1px);
  border-color: rgba(56,189,248,0.34) !important;
  color: #e8eef8 !important;
}
.pit-tab.active {
  color: #ffffff !important;
  background: linear-gradient(135deg, rgba(14,165,233,0.26), rgba(16,185,129,0.17)) !important;
  border-color: rgba(56,189,248,0.48) !important;
  box-shadow: 0 12px 34px rgba(14,165,233,0.11), inset 0 1px 0 rgba(255,255,255,0.08);
}
.tab-icon { opacity: 0.95; }

.pit-panel { padding: 16px !important; }
.panel-toolbar {
  background: linear-gradient(135deg, rgba(15,23,42,0.78), rgba(2,6,23,0.72)) !important;
  border: 1px solid var(--stroke) !important;
  border-radius: 20px !important;
  padding: 12px !important;
  box-shadow: var(--shadow-soft);
}
.panel-title {
  font-size: 17px !important;
  font-weight: 950 !important;
  letter-spacing: -0.02em;
}

.forge-card,
.dispatch-summary,
.dispatch-recommendations,
.staff-editor,
.machine-status-panel,
.capacity-recommendations {
  background: linear-gradient(180deg, var(--glass-2), rgba(8,13,24,0.78)) !important;
  border: 1px solid var(--stroke) !important;
  border-radius: 22px !important;
  box-shadow: var(--shadow-soft), inset 0 1px 0 rgba(255,255,255,0.045) !important;
  overflow: hidden;
}
.forge-card-head {
  background: linear-gradient(90deg, rgba(255,255,255,0.055), rgba(255,255,255,0.015));
  border-bottom: 1px solid rgba(148,163,184,0.1);
  margin: -1px -1px 12px -1px;
  padding: 12px 14px;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #e8eef8;
}

.hero-premium {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 15% 0%, rgba(56,189,248,0.26), transparent 36%),
    radial-gradient(circle at 90% 15%, rgba(34,197,94,0.18), transparent 34%),
    linear-gradient(135deg, rgba(15,23,42,0.96), rgba(2,6,23,0.82)) !important;
  border: 1px solid rgba(125,211,252,0.22) !important;
  border-radius: 26px !important;
  box-shadow: 0 24px 80px rgba(0,0,0,0.45), var(--glow-blue) !important;
  padding: 22px !important;
}
.hero-premium::after {
  content: "";
  position: absolute;
  inset: auto -8% -45% 55%;
  height: 160px;
  background: radial-gradient(circle, rgba(34,197,94,0.28), transparent 62%);
  transform: rotate(-8deg);
}
.hero-kicker {
  color: #7dd3fc !important;
  letter-spacing: 0.16em !important;
  font-weight: 950 !important;
}
.hero-title {
  font-size: clamp(24px, 3vw, 40px) !important;
  line-height: 1.03;
  letter-spacing: -0.045em;
  background: linear-gradient(90deg, #ffffff, #b7e8ff 52%, #bbf7d0);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
}
.hero-sub { max-width: 780px; color: #9fb0c7 !important; }

.command-kpis,
.kpi-row {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)) !important;
  gap: 12px !important;
}
.kpi-tile {
  position: relative;
  border-radius: 20px !important;
  border: 1px solid rgba(148,163,184,0.14) !important;
  background: linear-gradient(180deg, rgba(15,23,42,0.84), rgba(2,6,23,0.74)) !important;
  padding: 15px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04);
}
.kpi-tile::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  background: #38bdf8;
  opacity: 0.75;
}
.kpi-tile.ok::before { background: #22c55e; }
.kpi-tile.warn::before { background: #f59e0b; }
.kpi-tile.crit::before { background: #ef4444; }
.kpi-label { color: #95a3b8 !important; font-size: 10px !important; letter-spacing: 0.11em !important; }
.kpi-value { font-size: clamp(22px, 2.2vw, 34px) !important; letter-spacing: -0.04em; }
.kpi-sub { color: #8ca0bb !important; }

.ops-briefing {
  display: grid !important;
  grid-template-columns: 1.35fr 1fr 1fr !important;
  gap: 12px !important;
}
.brief-card {
  border-radius: 20px !important;
  border: 1px solid var(--stroke) !important;
  background: rgba(15,23,42,0.62) !important;
  padding: 15px !important;
}
.brief-card.brief-crit { border-color: rgba(239,68,68,0.36) !important; box-shadow: 0 0 0 1px rgba(239,68,68,0.12); }
.brief-card.brief-warn { border-color: rgba(245,158,11,0.34) !important; }
.brief-label { color: #7dd3fc !important; font-size: 10px !important; letter-spacing: 0.12em !important; }
.brief-title { font-size: 15px !important; font-weight: 950 !important; }
.brief-text { color: #98a9c0 !important; }
.feature-strip {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  padding: 10px 12px;
  border-radius: 18px;
  background: rgba(2,6,23,0.55);
  border: 1px solid rgba(148,163,184,0.12);
  color: #93a4ba;
  font-size: 11px;
}
.feature-strip b {
  color: #dbeafe;
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(56,189,248,0.09);
  border: 1px solid rgba(56,189,248,0.12);
}

.table-shell {
  border-radius: 22px !important;
  border: 1px solid var(--stroke) !important;
  background: rgba(2,6,23,0.74) !important;
  box-shadow: var(--shadow-soft);
}
.forge-table th {
  position: sticky;
  top: 0;
  background: rgba(10,16,30,0.96) !important;
  color: #93a4ba !important;
  text-transform: uppercase;
  font-size: 10px !important;
  letter-spacing: 0.08em;
}
.forge-table td {
  border-bottom: 1px solid rgba(148,163,184,0.075) !important;
}
.forge-table tbody tr:hover {
  background: rgba(56,189,248,0.065) !important;
}
.status-pill,
.carrier-badge,
.priority-badge,
.badge {
  border-radius: 999px !important;
  border: 1px solid rgba(255,255,255,0.12);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.08);
}

.dept-grid {
  grid-template-columns: repeat(auto-fill, minmax(245px, 1fr)) !important;
  gap: 12px !important;
}
.dept-card,
.job-card,
.wb-carrier-tile,
.wb-stat {
  background: linear-gradient(180deg, rgba(15,23,42,0.78), rgba(2,6,23,0.62)) !important;
  border: 1px solid rgba(148,163,184,0.14) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.045), 0 10px 34px rgba(0,0,0,0.22);
}
.dept-card:hover,
.job-card:hover,
.wb-carrier-tile:hover {
  transform: translateY(-1px);
  border-color: rgba(56,189,248,0.28) !important;
}

.module-health-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(185px, 1fr));
  gap: 10px;
  margin: 12px 0;
}
.module-tile {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 2px 9px;
  align-items: center;
  padding: 12px;
  border-radius: 18px;
  background: rgba(15,23,42,0.68);
  border: 1px solid rgba(148,163,184,0.12);
}
.module-tile strong { color: #e5eefc; font-size: 12px; }
.module-tile small { grid-column: 2; color: #8ea1bb; }
.module-dot {
  width: 9px;
  height: 9px;
  border-radius: 99px;
  background: #22c55e;
  box-shadow: 0 0 14px rgba(34,197,94,0.7);
}
.module-tile.offline .module-dot { background: #f59e0b; box-shadow: 0 0 14px rgba(245,158,11,0.6); }
.security-title {
  display: flex;
  gap: 12px;
  align-items: flex-start;
}
.security-title > span {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 15px;
  background: rgba(34,197,94,0.13);
  border: 1px solid rgba(34,197,94,0.24);
}
.security-title h3 { margin: 0; }
.security-title p { margin: 4px 0 0; color: #93a4ba; }
.security-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
  margin: 14px 0;
}
.security-grid > div {
  padding: 12px;
  border-radius: 16px;
  background: rgba(2,6,23,0.5);
  border: 1px solid rgba(148,163,184,0.11);
}
.security-grid strong { display: block; color: #e5eefc; margin-bottom: 4px; }
.security-grid span { color: #91a4bd; font-size: 12px; }
.import-empty-hero {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-bottom: 10px;
  padding: 16px;
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(56,189,248,0.1), rgba(34,197,94,0.08));
  border: 1px solid rgba(56,189,248,0.18);
}
.import-empty-hero strong { font-size: 16px; color: #f8fafc; }
.import-empty-hero span { color: #9fb0c7; }

.btn {
  border-radius: 12px !important;
  border: 1px solid rgba(148,163,184,0.16) !important;
  background: rgba(15,23,42,0.76) !important;
  color: #e8eef8 !important;
  font-weight: 850 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05);
}
.btn:hover { transform: translateY(-1px); border-color: rgba(56,189,248,0.38) !important; }
.btn-primary { background: linear-gradient(135deg, rgba(14,165,233,0.72), rgba(16,185,129,0.52)) !important; }
.btn-danger { background: linear-gradient(135deg, rgba(239,68,68,0.78), rgba(180,35,35,0.56)) !important; }
input,
select {
  border-radius: 12px !important;
  border: 1px solid rgba(148,163,184,0.16) !important;
  background: rgba(2,6,23,0.62) !important;
  color: #e5eefc !important;
}
input:focus,
select:focus {
  outline: none !important;
  border-color: rgba(56,189,248,0.58) !important;
  box-shadow: 0 0 0 3px rgba(56,189,248,0.12) !important;
}

@media (max-width: 1100px) {
  .ops-briefing { grid-template-columns: 1fr !important; }
}
@media (max-width: 760px) {
  .pit-tab { flex: 1 1 auto; justify-content: center; }
  .command-kpis, .kpi-row { grid-template-columns: 1fr 1fr !important; }
  .module-health-grid, .security-grid { grid-template-columns: 1fr !important; }
  .hero-premium { padding: 16px !important; }
}

/* ============================================================
   PIT v36 — UI Polish
   Modern command dashboard layer. Additive only.
   ============================================================ */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 20% 0%, rgba(56,189,248,.12), transparent 28%),
    radial-gradient(circle at 88% 18%, rgba(34,197,94,.09), transparent 24%),
    linear-gradient(180deg, rgba(255,255,255,.025), transparent 34%);
  z-index: -1;
}

#pit-tabs {
  backdrop-filter: blur(18px);
  background: linear-gradient(180deg, rgba(15,23,42,.92), rgba(2,6,23,.86));
  border-bottom: 1px solid rgba(148,163,184,.20);
  box-shadow: 0 14px 40px rgba(0,0,0,.32);
}

.pit-tab {
  position: relative;
  border-radius: 14px 14px 0 0;
  margin: 4px 2px 0;
}

.pit-tab.active::after {
  content: "";
  position: absolute;
  left: 16px;
  right: 16px;
  bottom: -1px;
  height: 3px;
  border-radius: 3px;
  background: linear-gradient(90deg, var(--accent), var(--green));
  box-shadow: 0 0 20px rgba(56,189,248,.55);
}

.pit-panel {
  animation: forge-panel-in .16s ease-out;
}

@keyframes forge-panel-in {
  from { opacity: .72; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}

.panel-toolbar,
.forge-card,
.kpi-tile,
.dept-card,
.job-card,
.carrier-tile,
.module-tile {
  box-shadow: 0 18px 50px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.045);
}

.panel-toolbar {
  border: 1px solid rgba(148,163,184,.16);
  background: linear-gradient(135deg, rgba(15,23,42,.88), rgba(8,13,28,.78));
  border-radius: 20px;
  padding: 10px 12px;
}

.panel-title {
  letter-spacing: .02em;
}

.btn {
  border-radius: 12px;
  transition: transform .12s ease, background .12s ease, border-color .12s ease, box-shadow .12s ease;
}
.btn:hover { transform: translateY(-1px); box-shadow: 0 10px 26px rgba(0,0,0,.24); }
.btn:active { transform: translateY(0); }

.forge-card {
  border: 1px solid rgba(148,163,184,.16);
  background: linear-gradient(180deg, rgba(15,23,42,.84), rgba(8,13,28,.80));
  border-radius: 22px;
}

.forge-card-head {
  border-bottom: 1px solid rgba(148,163,184,.12);
  padding-bottom: 8px;
}

.dashboard-hero { margin-bottom: 12px; }
.dashboard-kpis { margin-bottom: 12px; }
.dashboard-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(260px, 1fr));
  gap: 12px;
}
.dashboard-command {
  min-height: 136px;
  align-items: center;
  border: 1px solid rgba(56,189,248,.22);
  background:
    linear-gradient(135deg, rgba(14,165,233,.15), rgba(34,197,94,.08)),
    linear-gradient(180deg, rgba(15,23,42,.96), rgba(2,6,23,.88));
}
.dashboard-kpi-row .kpi-tile,
.compact-kpis .kpi-tile {
  min-width: 150px;
}
.compact-kpis {
  margin: 6px 0 10px;
}

.rank-row {
  display: grid;
  grid-template-columns: 32px 1fr;
  gap: 10px;
  align-items: center;
  padding: 8px 0;
  border-bottom: 1px solid rgba(148,163,184,.08);
}
.rank-row:last-child { border-bottom: 0; }
.rank-num {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: rgba(56,189,248,.13);
  border: 1px solid rgba(56,189,248,.25);
  color: var(--accent);
  font-weight: 800;
  font-family: var(--f-mono);
}
.rank-row strong { display: block; color: var(--t0); }
.rank-row small { display: block; color: var(--t2); font-size: 11px; margin: 2px 0 6px; }
.dept-progress.slim { height: 5px; }

.job-list.compact { max-height: 430px; overflow: auto; padding-right: 4px; }
.compact-card { padding: 9px 10px; }
.dashboard-modules {
  grid-template-columns: repeat(2, minmax(120px, 1fr));
  gap: 8px;
}
.security-microcopy {
  margin-top: 10px;
  padding: 10px;
  border-radius: 14px;
  background: rgba(15,23,42,.72);
  color: var(--t2);
  font-size: 12px;
  line-height: 1.45;
}

.forge-table {
  border-collapse: separate;
  border-spacing: 0;
}
.forge-table thead th {
  backdrop-filter: blur(10px);
  background: rgba(15,23,42,.94);
  position: sticky;
  top: 0;
  z-index: 2;
}
.forge-table tbody tr {
  transition: background .12s ease, transform .12s ease;
}
.forge-table tbody tr:hover {
  background: rgba(56,189,248,.075);
}
.row-green td:first-child { box-shadow: inset 4px 0 0 var(--green); }
.row-at-risk td:first-child { box-shadow: inset 4px 0 0 var(--amber); }
.row-will-miss td:first-child { box-shadow: inset 4px 0 0 var(--red); }

.table-shell {
  border-radius: 22px;
  overflow: auto;
  border: 1px solid rgba(148,163,184,.16);
  background: rgba(2,6,23,.72);
}

.carrier-grid, .wb-carrier-grid {
  gap: 10px;
}
.carrier-tile, .wb-carrier-tile {
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(15,23,42,.84), rgba(2,6,23,.70));
  border: 1px solid rgba(148,163,184,.14);
}
.carrier-critical, .carrier-missed { border-color: rgba(248,113,113,.50); }
.carrier-warning, .carrier-attention { border-color: rgba(251,191,36,.42); }
.carrier-safe { border-color: rgba(34,197,94,.32); }

.module-tile.online {
  background: rgba(34,197,94,.07);
  border-color: rgba(34,197,94,.20);
}
.module-tile.offline {
  background: rgba(248,113,113,.07);
  border-color: rgba(248,113,113,.20);
}

.import-zone {
  background: linear-gradient(135deg, rgba(56,189,248,.08), rgba(34,197,94,.06)), rgba(15,23,42,.72);
  border-radius: 28px;
  border-color: rgba(56,189,248,.28);
}
.import-zone:hover, .import-zone.drag-over {
  border-color: rgba(34,197,94,.65);
  box-shadow: 0 0 0 6px rgba(34,197,94,.08), 0 24px 70px rgba(0,0,0,.32);
}

@media (max-width: 980px) {
  .dashboard-grid { grid-template-columns: 1fr; }
  .dashboard-kpi-row .kpi-tile { min-width: 46%; }
  .panel-toolbar { align-items: stretch; }
}

@media (max-width: 620px) {
  #pit-tabs { gap: 2px; }
  .pit-tab { padding: 10px 10px; font-size: 11px; }
  .dashboard-kpi-row .kpi-tile, .compact-kpis .kpi-tile { min-width: 100%; }
}


/* v36.5.1 shop-floor UX polish */
body {
  background:
    radial-gradient(circle at 12% 8%, rgba(0, 230, 118, .10), transparent 28%),
    radial-gradient(circle at 88% 0%, rgba(80, 140, 255, .12), transparent 32%),
    linear-gradient(180deg, #05070d 0%, #090d17 52%, #05070d 100%);
}
#pit-tabs {
  gap: 8px;
  padding: 12px;
  position: sticky;
  top: 31px;
  z-index: 20;
  backdrop-filter: blur(14px);
}
.pit-tab {
  border-radius: 14px;
  min-height: 42px;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.04);
}
.pit-tab.active {
  transform: translateY(-1px);
  box-shadow: 0 10px 28px rgba(0,230,118,.12), inset 0 0 0 1px rgba(0,230,118,.35);
}
.panel-toolbar {
  border-radius: 18px;
  margin-bottom: 14px;
  background: linear-gradient(135deg, rgba(18, 25, 42, .96), rgba(9, 13, 23, .94));
  border: 1px solid rgba(255,255,255,.08);
}
.forge-card, .table-shell, .import-zone {
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 14px 42px rgba(0,0,0,.24);
}
.import-zone {
  min-height: 180px;
  background: linear-gradient(135deg, rgba(0,230,118,.10), rgba(59,130,246,.08)), rgba(10,15,28,.92);
  border: 1px dashed rgba(0,230,118,.45);
}
.import-zone:hover, .import-zone.drag-over {
  border-color: rgba(0,230,118,.95);
  transform: translateY(-1px);
}
.import-zone-text { font-size: 22px; font-weight: 800; }
.import-zone-hint { max-width: 720px; text-align:center; }
.date-rule-note, .planner-note {
  margin-top: 10px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(0,230,118,.08);
  border: 1px solid rgba(0,230,118,.18);
  color: var(--t1);
  font-size: 12px;
}
.import-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.import-summary span {
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.08);
}
#dispatch-table th:nth-child(9), #dispatch-table th:nth-child(10),
#dispatch-table td:nth-child(9), #dispatch-table td:nth-child(10) {
  white-space: nowrap;
}
@media (max-width: 760px) {
  #pit-tabs { overflow-x: auto; justify-content: flex-start; }
  .panel-toolbar { align-items: stretch; }
  .toolbar-group { width: 100%; overflow-x: auto; }
  .dispatch-view-btns { display: grid; grid-template-columns: repeat(2, minmax(140px, 1fr)); }
  .dispatch-view-btns .btn { width: 100%; }
}

/* ================================================================
   PIT v36.6 CONTROL ROOM UI REFIT
   Full UI/UX rebuild layer. Logic stays modular; interface becomes
   shop-floor first: upload, date, dispatch, action.
   ================================================================ */
:root {
  --cr-bg:#070a12;
  --cr-panel:#0f1421;
  --cr-panel-2:#151c2c;
  --cr-border:rgba(255,255,255,.11);
  --cr-text:#f4f7fb;
  --cr-muted:#9aa7ba;
  --cr-blue:#56b6ff;
  --cr-green:#38f094;
  --cr-amber:#ffc857;
  --cr-red:#ff5c6c;
}
html,body{background:radial-gradient(circle at 18% -10%,rgba(86,182,255,.18),transparent 32%),radial-gradient(circle at 95% 10%,rgba(56,240,148,.10),transparent 28%),var(--cr-bg);font-size:14px;}
body:before{content:"";position:fixed;inset:0;pointer-events:none;background:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:32px 32px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.65),transparent 65%);}
#pit-health-bar{height:34px;background:rgba(4,7,13,.88);backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.10);padding:0 10px;gap:8px;}
.hb-brand{background:linear-gradient(135deg,rgba(86,182,255,.25),rgba(56,240,148,.14));border:1px solid rgba(255,255,255,.10);border-radius:999px;height:24px;margin-right:4px;color:#fff;}
.hb-indicator{height:24px;border:1px solid rgba(255,255,255,.09);border-radius:999px;background:rgba(255,255,255,.04);padding:0 9px;display:inline-flex;align-items:center;gap:5px;}
#pit-app-container{display:grid;grid-template-columns:230px minmax(0,1fr);grid-template-rows:auto 1fr;height:calc(100vh - 34px);gap:14px;padding:14px;overflow:hidden;}
.pit-control-room-header{grid-column:1 / -1;display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:104px;padding:18px 22px;border:1px solid rgba(255,255,255,.11);border-radius:24px;background:linear-gradient(135deg,rgba(15,20,33,.94),rgba(11,15,26,.82));box-shadow:0 24px 80px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.08);position:relative;overflow:hidden;}
.pit-control-room-header:after{content:"";position:absolute;right:-60px;top:-90px;width:260px;height:260px;background:radial-gradient(circle,rgba(86,182,255,.22),transparent 70%);}
.pit-header-main{position:relative;z-index:1}.pit-header-kicker{display:inline-flex;align-items:center;gap:6px;font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.18em;color:var(--cr-green);}.pit-header-kicker:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--cr-green);box-shadow:0 0 16px var(--cr-green)}
.pit-header-main h1{font-size:34px;line-height:1;margin:6px 0 7px;letter-spacing:-.04em}.pit-header-main p{color:var(--cr-muted);max-width:680px;font-size:14px}.pit-header-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end;position:relative;z-index:1}.pit-date-status{width:100%;text-align:right;font-family:var(--f-mono);font-size:11px;color:var(--cr-muted)}
#pit-tabs{grid-row:2;grid-column:1;display:flex;flex-direction:column;gap:8px;height:100%;padding:12px;border:1px solid var(--cr-border);border-radius:22px;background:rgba(11,15,26,.74);box-shadow:0 18px 60px rgba(0,0,0,.32);overflow:auto;}
.pit-tab{width:100%;height:50px;justify-content:flex-start;gap:10px;border-radius:15px;border:1px solid rgba(255,255,255,.07);background:rgba(255,255,255,.035);color:var(--cr-muted);font-weight:800;letter-spacing:.01em;transition:transform .12s ease,background .12s ease,border .12s ease,color .12s ease;}
.pit-tab:hover{transform:translateX(3px);background:rgba(255,255,255,.07);color:#fff}.pit-tab.active{background:linear-gradient(135deg,rgba(86,182,255,.24),rgba(56,240,148,.15));border-color:rgba(86,182,255,.40);color:#fff;box-shadow:0 10px 30px rgba(86,182,255,.12)}.tab-icon{width:24px;text-align:center;font-size:17px}
#pit-tab-content{grid-row:2;grid-column:2;height:100%;overflow:hidden;border:1px solid var(--cr-border);border-radius:24px;background:rgba(8,12,21,.62);box-shadow:0 18px 60px rgba(0,0,0,.35);}
.pit-panel{height:100%;overflow:auto;padding:18px}.pit-panel.active{display:block}.panel-toolbar{position:sticky;top:0;z-index:50;margin:-18px -18px 16px;padding:14px 18px;background:linear-gradient(180deg,rgba(10,14,24,.97),rgba(10,14,24,.88));backdrop-filter:blur(16px);border-bottom:1px solid rgba(255,255,255,.09);gap:12px}.panel-title{font-size:18px;font-weight:900;letter-spacing:-.02em}.toolbar-group{gap:8px;flex-wrap:wrap}.btn{border-radius:13px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.06);color:#edf3ff;min-height:36px;padding:8px 12px;font-weight:800}.btn:hover{background:rgba(255,255,255,.11);transform:translateY(-1px)}.btn-primary,.dispatch-view-btns .btn.active{background:linear-gradient(135deg,var(--cr-blue),#6fffd2)!important;color:#061018!important;border-color:transparent!important;box-shadow:0 12px 30px rgba(86,182,255,.20)}.btn-danger{background:rgba(255,92,108,.14)!important;color:#ffdce1!important;border-color:rgba(255,92,108,.35)!important}
input,select{border-radius:12px!important;background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.14)!important;color:#fff!important;min-height:36px}.field-label{font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:var(--cr-muted);font-weight:900}.field-label input,.field-label select{display:block;margin-top:4px}.dashboard-hero,.dashboard-kpis,.dashboard-grid,.forge-card{margin-bottom:14px}.forge-card,.kpi-tile,.dept-card,.job-card,.carrier-tile,.brief-card,.module-tile{border-radius:18px!important;border:1px solid rgba(255,255,255,.10)!important;background:linear-gradient(180deg,rgba(21,28,44,.88),rgba(12,16,27,.88))!important;box-shadow:0 14px 45px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.06)!important}.forge-card{padding:15px}.forge-card-head{display:flex;align-items:center;justify-content:space-between;font-size:13px;text-transform:uppercase;letter-spacing:.12em;color:#fff;margin-bottom:12px}.forge-card-head span{font-size:11px;color:var(--cr-muted);text-transform:none;letter-spacing:0}.hero-banner{border-radius:24px!important;border:1px solid rgba(255,255,255,.12)!important;background:linear-gradient(135deg,rgba(86,182,255,.18),rgba(56,240,148,.10),rgba(18,24,38,.92))!important;padding:22px!important}.hero-title{font-size:28px!important;letter-spacing:-.04em!important}.hero-sub{font-size:14px!important;color:var(--cr-muted)!important}.kpi-row{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px!important}.kpi-tile{padding:11px 13px!important;min-height:76px}.kpi-label{font-size:10px!important;text-transform:uppercase;letter-spacing:.12em;color:var(--cr-muted)!important}.kpi-value{font-size:24px!important;font-weight:950!important;line-height:1.05;margin:3px 0 2px}.kpi-sub{font-size:11px!important;color:var(--cr-muted)!important;line-height:1.2}.kpi-tile.ok{box-shadow:0 14px 45px rgba(0,0,0,.28),inset 3px 0 0 var(--cr-green)!important}.kpi-tile.warn{box-shadow:0 14px 45px rgba(0,0,0,.28),inset 3px 0 0 var(--cr-amber)!important}.kpi-tile.crit{box-shadow:0 14px 45px rgba(0,0,0,.28),inset 3px 0 0 var(--cr-red)!important}.kpi-tile.info{box-shadow:0 14px 45px rgba(0,0,0,.28),inset 3px 0 0 var(--cr-blue)!important}
.dashboard-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.capacity-layout{display:grid;grid-template-columns:1fr 1fr;gap:14px}.table-shell{border-radius:18px;border:1px solid rgba(255,255,255,.10);background:rgba(4,7,13,.58);overflow:auto}.forge-table{width:100%;border-collapse:separate;border-spacing:0}.forge-table thead th{position:sticky;top:0;z-index:4;background:#121827!important;color:#aebbd0!important;font-size:10px;text-transform:uppercase;letter-spacing:.10em;border-bottom:1px solid rgba(255,255,255,.12)!important}.forge-table td,.forge-table th{padding:10px 12px!important;border-bottom:1px solid rgba(255,255,255,.065)!important}.forge-table tbody tr:hover{background:rgba(86,182,255,.08)!important}.job-id{font-weight:950;color:#fff}.badge{border-radius:999px!important;padding:4px 8px!important;font-weight:900!important}.badge-green{background:rgba(56,240,148,.15)!important;color:#79ffc0!important;border:1px solid rgba(56,240,148,.28)!important}.badge-red{background:rgba(255,92,108,.16)!important;color:#ffcbd2!important;border:1px solid rgba(255,92,108,.30)!important}.badge-amber{background:rgba(255,200,87,.16)!important;color:#ffe0a1!important;border:1px solid rgba(255,200,87,.30)!important}.badge-ghost{background:rgba(255,255,255,.07)!important;color:#cbd6e8!important;border:1px solid rgba(255,255,255,.11)!important}
.import-zone{min-height:220px;border:2px dashed rgba(86,182,255,.38)!important;border-radius:26px!important;background:linear-gradient(135deg,rgba(86,182,255,.13),rgba(56,240,148,.07),rgba(255,255,255,.03))!important;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:10px;cursor:pointer}.import-zone:hover,.import-zone.drag-over{border-color:var(--cr-green)!important;box-shadow:0 0 0 6px rgba(56,240,148,.08),0 24px 70px rgba(0,0,0,.32)}.import-zone-icon{font-size:46px}.import-zone-text{font-size:24px;font-weight:950;letter-spacing:-.03em}.import-zone-hint{max-width:760px;color:var(--cr-muted);line-height:1.5}.upload-flow-panel{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:14px 0}.upload-flow-panel>div{padding:14px;border-radius:16px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.045)}.upload-flow-panel strong{display:block;font-size:13px;margin-bottom:4px}.upload-flow-panel span{color:var(--cr-muted)}.gdpr-note{border-radius:16px;background:rgba(56,240,148,.08);border:1px solid rgba(56,240,148,.18);padding:12px 14px;color:#c8ffe4;margin-bottom:14px}.import-empty-hero{border-radius:18px!important;background:rgba(255,255,255,.045)!important;border:1px solid rgba(255,255,255,.09)!important;padding:18px!important}.pit-date-rail{display:flex;gap:8px;overflow:auto;padding:0 2px 14px;margin-top:-4px}.pit-date-chip{flex:0 0 auto;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.055);color:#dce7f7;border-radius:14px;padding:9px 12px;cursor:pointer;min-width:118px;text-align:left}.pit-date-chip strong{display:block;font-size:13px}.pit-date-chip small{display:block;color:var(--cr-muted);font-size:10px;margin-top:2px}.pit-date-chip.active{background:linear-gradient(135deg,rgba(86,182,255,.30),rgba(56,240,148,.16));border-color:rgba(86,182,255,.45);color:#fff}.pit-date-chip.friday{border-color:rgba(255,200,87,.32)}.pit-date-helper{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:12px;padding:12px;border-radius:16px;background:rgba(86,182,255,.08);border:1px solid rgba(86,182,255,.15);color:#dcecff}.pit-date-helper strong{color:#fff}.pit-upload-toast{position:fixed;right:20px;bottom:20px;z-index:10000;padding:14px 16px;border-radius:16px;background:#111827;border:1px solid rgba(255,255,255,.14);box-shadow:0 18px 60px rgba(0,0,0,.45);color:#fff;max-width:380px}.pit-upload-toast small{display:block;color:var(--cr-muted);margin-top:4px}.staff-row,.machine-row{border-radius:12px!important;background:rgba(255,255,255,.045)!important;border:1px solid rgba(255,255,255,.08)!important;padding:8px!important}.planner-note{border-radius:14px!important;background:rgba(86,182,255,.08)!important;border:1px solid rgba(86,182,255,.18)!important;padding:10px 12px!important;color:#dcecff!important;margin-bottom:10px!important}
@media (max-width: 980px){#pit-app-container{grid-template-columns:1fr;grid-template-rows:auto auto 1fr;padding:10px;gap:10px;height:calc(100vh - 34px)}.pit-control-room-header{min-height:auto;align-items:flex-start;flex-direction:column;border-radius:20px}.pit-header-main h1{font-size:28px}#pit-tabs{grid-row:2;grid-column:1;flex-direction:row;height:auto;overflow-x:auto;border-radius:18px}.pit-tab{min-width:128px;height:46px}#pit-tab-content{grid-row:3;grid-column:1;border-radius:18px}.dashboard-grid,.capacity-layout,.upload-flow-panel{grid-template-columns:1fr}.panel-toolbar{align-items:flex-start;flex-direction:column}.dispatch-view-btns{width:100%;overflow-x:auto;flex-wrap:nowrap}.dispatch-view-btns .btn{flex:0 0 auto}.pit-date-status{text-align:left}}


/* ─────────────────────────────────────────────────────────────
   PIT v36.7 comb-through UI polish
   ───────────────────────────────────────────────────────────── */
body.pit-v36-7{background:radial-gradient(circle at 10% 0%,rgba(86,182,255,.18),transparent 30%),radial-gradient(circle at 90% 5%,rgba(56,240,148,.13),transparent 28%),#050813!important;}
body.pit-v36-7 .pit-control-room-header{border-radius:28px!important;background:linear-gradient(135deg,rgba(13,18,34,.96),rgba(10,32,52,.9))!important;border:1px solid rgba(116,202,255,.18)!important;box-shadow:0 28px 80px rgba(0,0,0,.36),inset 0 1px 0 rgba(255,255,255,.08)!important;}
body.pit-v36-7 #pit-tabs{background:rgba(6,10,22,.78)!important;backdrop-filter:blur(12px);border-color:rgba(255,255,255,.10)!important;}
body.pit-v36-7 .pit-tab{border-radius:16px!important;margin:4px!important;}
body.pit-v36-7 .pit-tab.active{background:linear-gradient(135deg,rgba(86,182,255,.28),rgba(56,240,148,.15))!important;box-shadow:inset 3px 0 0 rgba(56,240,148,.75),0 12px 30px rgba(0,0,0,.22)!important;}
body.pit-v36-7 #pit-tab-content{border-radius:28px!important;background:linear-gradient(180deg,rgba(8,13,29,.94),rgba(5,8,18,.94))!important;border:1px solid rgba(255,255,255,.11)!important;}
body.pit-v36-7 .panel-toolbar{position:sticky;top:0;z-index:50;background:linear-gradient(180deg,rgba(8,13,29,.98),rgba(8,13,29,.90))!important;backdrop-filter:blur(10px);border-radius:0 0 18px 18px;padding:12px!important;margin:-16px -16px 16px!important;border-bottom:1px solid rgba(255,255,255,.08)!important;}
body.pit-v36-7 .btn{border-radius:14px!important;font-weight:800!important;}
body.pit-v36-7 .btn-primary{background:linear-gradient(135deg,#56b6ff,#38f094)!important;color:#04101b!important;box-shadow:0 10px 30px rgba(86,182,255,.20)!important;}
body.pit-v36-7 .import-zone{min-height:260px!important;border-radius:32px!important;border-width:2px!important;background:linear-gradient(135deg,rgba(86,182,255,.17),rgba(56,240,148,.10),rgba(255,255,255,.035))!important;}
body.pit-v36-7 .import-zone:before{content:'CSV';font-family:var(--f-mono);font-size:11px;letter-spacing:.18em;color:rgba(255,255,255,.5);border:1px solid rgba(255,255,255,.14);border-radius:999px;padding:5px 9px;margin-bottom:6px;}
.v367-upload-meter{display:flex;justify-content:space-between;gap:12px;align-items:center;margin:12px 0 4px;padding:14px 16px;border-radius:20px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.10)}
.v367-upload-meter strong{display:block;font-size:14px}.v367-upload-meter span{color:var(--cr-muted)}.meter-pills{display:flex;gap:8px;flex-wrap:wrap}.meter-pills span{padding:7px 10px;border-radius:999px;background:rgba(56,240,148,.10);border:1px solid rgba(56,240,148,.20);color:#d7ffe9;font-size:11px;font-weight:800}
.pit-import-diagnostics{margin-top:14px;border-radius:22px;border:1px solid rgba(86,182,255,.18);background:linear-gradient(135deg,rgba(86,182,255,.10),rgba(255,255,255,.04));padding:14px}.diagnostic-head{display:flex;justify-content:space-between;gap:10px;margin-bottom:12px}.diagnostic-head strong{font-size:16px}.diagnostic-head span{color:var(--cr-muted);font-family:var(--f-mono)}.diagnostic-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.diagnostic-grid>div{border-radius:16px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.08);padding:11px}.diagnostic-grid b{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--cr-muted);margin-bottom:5px}.diagnostic-grid span{font-weight:900;color:#fff}.diagnostic-warnings{margin-top:10px;padding:10px;border-radius:14px;background:rgba(255,200,87,.10);border:1px solid rgba(255,200,87,.20);color:#ffe6ad}
body.pit-v36-7 .pit-date-helper.v367{display:flex;justify-content:space-between;align-items:center;gap:10px;background:linear-gradient(135deg,rgba(86,182,255,.12),rgba(56,240,148,.07))!important}.pit-date-helper.v367 div span{display:block;color:var(--cr-muted);margin-top:3px}.pit-date-rail.v367{padding-bottom:16px}.pit-date-rail.v367 .pit-date-chip{min-width:142px;border-radius:18px!important;padding:12px!important}.pit-date-rail.v367 .pit-date-chip.active{transform:translateY(-1px);box-shadow:0 16px 35px rgba(0,0,0,.25)!important}.pit-date-rail.v367 .pit-date-chip.friday{box-shadow:inset 0 0 0 1px rgba(255,200,87,.20)}
body.pit-v36-7 .forge-card,body.pit-v36-7 .kpi-tile{border-radius:22px!important;border-color:rgba(255,255,255,.10)!important;background:rgba(255,255,255,.052)!important;box-shadow:0 12px 40px rgba(0,0,0,.18)!important}body.pit-v36-7 .forge-table thead th{position:sticky;top:0;z-index:4;background:#0b1223!important}body.pit-v36-7 .table-shell{border-radius:22px!important;overflow:auto!important;}
body.pit-v36-7 .staff-row,body.pit-v36-7 .machine-row{background:rgba(255,255,255,.06)!important}.staff-dept:before{content:'Dept · ';color:var(--cr-muted);font-weight:500}.staff-input{border-radius:10px!important}
@media(max-width:900px){.diagnostic-grid{grid-template-columns:1fr}.v367-upload-meter{align-items:flex-start;flex-direction:column}.pit-date-helper.v367{align-items:flex-start;flex-direction:column}.pit-date-rail.v367 .pit-date-chip{min-width:132px}}


/* PIT v36.8 — live countdown and CSV-to-CSV dispatch rate lanes */
.dispatch-live-kpis .kpi-tile { min-height: 96px; }
.dispatch-lane-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 14px;
  margin: 14px 0;
}
.dispatch-lane-card {
  position: relative;
  overflow: hidden;
  border-radius: 24px;
  border: 1px solid rgba(148, 163, 184, .20);
  background: radial-gradient(circle at 18% 0%, rgba(56, 189, 248, .14), transparent 28%), linear-gradient(180deg, rgba(15, 23, 42, .94), rgba(3, 7, 18, .96));
  box-shadow: 0 18px 50px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.06);
  padding: 22px;
}
.dispatch-lane-card::before {
  content: '';
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  background: linear-gradient(180deg, #38bdf8, #22c55e);
  opacity: .95;
}
.dispatch-lane-card.carrier-warning::before,
.dispatch-lane-card.carrier-attention::before { background: linear-gradient(180deg, #f59e0b, #f97316); }
.dispatch-lane-card.carrier-critical::before { background: linear-gradient(180deg, #fb7185, #ef4444); }
.lane-title-row { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; }
.lane-title-row strong { color:#93c5fd; text-transform:uppercase; letter-spacing:.18em; font-size:12px; }
.lane-rate { font-family:var(--f-mono); color:#e5e7eb; border:1px solid rgba(148,163,184,.22); border-radius:999px; padding:5px 9px; background:rgba(15,23,42,.8); }
.lane-countdown { font-family:var(--f-mono); font-size: clamp(38px, 7vw, 64px); line-height:1; letter-spacing:.03em; color:#f8fafc; font-weight:950; text-align:center; margin:8px 0 8px; }
.lane-cutoff { text-align:center; color:#94a3b8; font-family:var(--f-mono); font-size:15px; margin-bottom:12px; }
.lane-progress { height:11px; border-radius:999px; background:rgba(15,23,42,.96); border:1px solid rgba(148,163,184,.14); overflow:hidden; }
.lane-progress span { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#22c55e,#f59e0b,#ef4444); }
.lane-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:16px; }
.lane-stats span { border:1px solid rgba(148,163,184,.14); border-radius:16px; padding:10px; color:#94a3b8; background:rgba(15,23,42,.54); font-size:12px; }
.lane-stats b { display:block; color:#f8fafc; font-size:22px; line-height:1.1; }
.lane-cleared { margin-top:12px; color:#9ca3af; font-size:12px; font-family:var(--f-mono); }
.dispatch-rate-panel { margin-top:16px; border-radius:24px; border:1px solid rgba(148,163,184,.16); background:rgba(15,23,42,.55); padding:18px; }
.rate-summary-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:10px; }
.rate-summary-grid div { border:1px solid rgba(148,163,184,.14); border-radius:18px; padding:12px; background:rgba(2,6,23,.42); }
.rate-summary-grid small { display:block; color:#94a3b8; text-transform:uppercase; letter-spacing:.13em; font-size:10px; }
.rate-summary-grid strong { display:block; color:#f8fafc; font-size:24px; margin-top:5px; font-family:var(--f-mono); }
.rate-note { color:#94a3b8; font-size:12px; margin-top:12px; }
@media (max-width: 640px) {
  .dispatch-lane-grid { grid-template-columns: 1fr; }
  .dispatch-lane-card { padding:18px; }
  .lane-stats { grid-template-columns: 1fr; }
}


/* ================================================================
   PIT v36.14.1 RESPONSIVE OPERATIONS HARDENING
   Desktop + mobile usability pass. Additive only: no logic changes.
   ================================================================ */
:root {
  --mobile-safe-bottom: env(safe-area-inset-bottom, 0px);
  --mobile-safe-top: env(safe-area-inset-top, 0px);
}
html, body {
  min-width: 0;
  overscroll-behavior: none;
}
body {
  min-height: 100dvh;
}
#pit-health-bar {
  min-width: 0;
}
.hb-indicator,
.hb-clock,
.hb-brand {
  min-width: 0;
}
.pit-control-room-header,
.panel-toolbar,
.toolbar-group,
.pit-header-actions,
.kpi-row,
.dashboard-grid,
.capacity-layout {
  min-width: 0;
}
.pit-header-main,
.pit-header-actions,
.pit-panel,
.forge-card,
.table-shell {
  min-width: 0;
}
.pit-header-main h1,
.pit-header-main p,
.panel-title,
.forge-card-head,
.kpi-label,
.kpi-sub {
  overflow-wrap: anywhere;
}
.table-shell {
  max-width: 100%;
  -webkit-overflow-scrolling: touch;
}
.forge-table {
  min-width: 980px;
}
#dispatch-table {
  min-width: 1280px;
}
#pit-tab-content,
.pit-panel {
  min-height: 0;
}
.pit-panel {
  padding-bottom: calc(18px + var(--mobile-safe-bottom));
}
.btn, input, select, textarea, .pit-tab {
  -webkit-tap-highlight-color: transparent;
}

/* Large desktop: make Control Room denser and more useful. */
@media (min-width: 1280px) {
  #pit-app-container {
    grid-template-columns: 240px minmax(0, 1fr);
    gap: 16px;
    padding: 16px;
  }
  .pit-control-room-header {
    min-height: 92px;
    padding: 16px 20px;
  }
  .pit-header-main h1 {
    font-size: clamp(28px, 2.1vw, 36px);
  }
  .pit-panel {
    padding: 18px;
  }
  .dashboard-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .kpi-row, .command-kpis {
    grid-template-columns: repeat(auto-fit, minmax(155px, 1fr)) !important;
  }
}

/* Laptop/tablet: reduce the side nav so content has room. */
@media (max-width: 1180px) {
  #pit-app-container {
    grid-template-columns: 188px minmax(0, 1fr);
    gap: 12px;
    padding: 12px;
  }
  .pit-control-room-header {
    min-height: 88px;
    padding: 14px 16px;
    border-radius: 20px;
  }
  .pit-header-main h1 { font-size: 28px; }
  .pit-header-main p { font-size: 12px; }
  .pit-tab {
    height: 46px;
    padding: 0 10px;
    font-size: 10px;
  }
  .tab-icon { width: 20px; font-size: 15px; }
  .dashboard-grid,
  .capacity-layout {
    grid-template-columns: 1fr;
  }
  .panel-toolbar {
    align-items: flex-start;
  }
}

/* Tablet and phone: switch from side-nav to horizontal tabs. */
@media (max-width: 900px) {
  html, body {
    overflow: hidden;
  }
  #pit-health-bar {
    height: 32px;
    overflow-x: auto;
    scrollbar-width: none;
  }
  #pit-health-bar::-webkit-scrollbar { display: none; }
  .hb-brand { flex: 0 0 auto; }
  .hb-indicator:nth-of-type(n+4) { display: none; }
  .hb-clock { position: sticky; right: 0; background: rgba(4,7,13,.94); }

  #pit-app-container {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto auto minmax(0, 1fr);
    height: calc(100dvh - 32px);
    gap: 10px;
    padding: 10px;
    overflow: hidden;
  }
  .pit-control-room-header {
    grid-column: 1;
    grid-row: 1;
    min-height: 0;
    padding: 12px;
    border-radius: 18px;
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .pit-control-room-header::after { display: none; }
  .pit-header-main h1 {
    font-size: 24px;
    margin: 4px 0;
  }
  .pit-header-main p {
    display: none;
  }
  .pit-header-kicker {
    font-size: 9px;
  }
  .pit-header-actions {
    justify-content: stretch;
    gap: 8px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .pit-header-actions .btn {
    width: 100%;
    justify-content: center;
    min-height: 40px;
  }
  .pit-date-status {
    grid-column: 1 / -1;
    text-align: left;
    font-size: 10px;
    padding: 7px 9px;
    border-radius: 12px;
    background: rgba(255,255,255,.045);
    border: 1px solid rgba(255,255,255,.08);
  }
  #pit-tabs {
    grid-row: 2;
    grid-column: 1;
    flex-direction: row;
    height: auto;
    min-height: 54px;
    padding: 8px;
    gap: 8px;
    border-radius: 18px;
    overflow-x: auto;
    scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch;
  }
  .pit-tab {
    flex: 0 0 auto !important;
    min-width: 126px;
    width: auto;
    height: 38px;
    justify-content: center;
    border-radius: 13px;
    margin: 0;
    scroll-snap-align: start;
  }
  .pit-tab:hover { transform: none; }
  .pit-tab.active::after { display: none; }
  #pit-tab-content {
    grid-row: 3;
    grid-column: 1;
    height: auto;
    min-height: 0;
    border-radius: 18px;
  }
  .pit-panel {
    padding: 12px;
  }
  .panel-toolbar {
    position: sticky;
    top: -12px;
    margin: -12px -12px 12px;
    padding: 10px 12px;
    border-radius: 0 0 16px 16px;
    display: grid;
    grid-template-columns: 1fr;
  }
  .panel-title { font-size: 16px; }
  .toolbar-group {
    width: 100%;
    overflow-x: auto;
    flex-wrap: nowrap;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 2px;
  }
  .toolbar-group .btn,
  .toolbar-group .field-label {
    flex: 0 0 auto;
  }
  .dispatch-view-btns {
    display: flex !important;
    grid-template-columns: none !important;
  }
  .dispatch-view-btns .btn {
    min-width: 156px;
  }
  .field-label {
    display: grid;
    gap: 4px;
  }
  .field-label input,
  .field-label select {
    min-width: 150px;
  }
  .kpi-row,
  .command-kpis,
  .dashboard-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }
  .kpi-tile {
    min-width: 0;
    min-height: 92px;
    padding: 12px !important;
  }
  .kpi-value {
    font-size: clamp(22px, 8vw, 30px) !important;
  }
  .dashboard-grid,
  .capacity-layout,
  .upload-flow-panel,
  .ops-briefing,
  .diagnostic-grid,
  .module-health-grid,
  .security-grid {
    grid-template-columns: 1fr !important;
  }
  .import-zone {
    min-height: 150px;
    padding: 24px 16px;
  }
  .import-zone-text { font-size: 18px; }
  .forge-card { padding: 12px; border-radius: 16px !important; }
  .table-shell { border-radius: 16px !important; }
}

/* Small phones: make everything one-column and touch-first. */
@media (max-width: 560px) {
  body { font-size: 13px; }
  #pit-app-container {
    padding: 8px;
    gap: 8px;
  }
  .pit-control-room-header {
    padding: 10px;
    border-radius: 16px;
  }
  .pit-header-main h1 { font-size: 21px; }
  .pit-header-actions {
    grid-template-columns: 1fr;
  }
  .pit-header-actions .btn {
    min-height: 42px;
  }
  #pit-tabs {
    min-height: 50px;
    padding: 7px;
    gap: 7px;
  }
  .pit-tab {
    min-width: 112px;
    height: 36px;
    font-size: 9px;
    padding: 0 9px;
  }
  .tab-icon { display: none; }
  .pit-panel { padding: 10px; }
  .panel-toolbar {
    top: -10px;
    margin: -10px -10px 10px;
    padding: 10px;
  }
  .kpi-row,
  .command-kpis,
  .dashboard-kpis {
    grid-template-columns: 1fr !important;
  }
  .kpi-tile {
    min-height: 78px;
  }
  .kpi-value { font-size: 28px !important; }
  .btn {
    min-height: 40px;
    padding: 8px 11px;
  }
  input, select, textarea {
    width: 100%;
    min-height: 40px;
  }
  #pit-csv-progress {
    width: calc(100vw - 28px);
    min-width: 0;
    padding: 22px 18px;
  }
  #pit-perf-panel {
    width: calc(100vw - 16px);
    right: 8px;
    bottom: 8px;
    border-radius: 16px;
    max-height: 45dvh;
  }
}

/* Phone landscape: reclaim vertical space. */
@media (max-height: 520px) and (max-width: 960px) {
  .pit-control-room-header {
    grid-template-columns: 1fr auto;
    align-items: center;
  }
  .pit-header-actions {
    grid-template-columns: repeat(3, auto);
  }
  .pit-date-status,
  .pit-header-kicker,
  .pit-header-main p {
    display: none;
  }
  #pit-tabs { min-height: 46px; }
  .pit-tab { height: 34px; }
}


/* ================================================================
   PIT v36.21 MOBILE UI FIX
   Purpose: make the control room and wallboards practical on phones
   without changing production calculations.
   ================================================================ */
@media (max-width: 900px) {
  html, body {
    overflow-x: hidden !important;
    overflow-y: auto !important;
    height: auto !important;
    min-height: 100dvh !important;
    touch-action: manipulation;
  }
  #pit-health-bar {
    position: sticky;
    top: 0;
    z-index: 60;
  }
  #pit-app-container {
    height: auto !important;
    min-height: calc(100dvh - 32px) !important;
    overflow: visible !important;
    display: flex !important;
    flex-direction: column !important;
  }
  .pit-control-room-header {
    position: relative !important;
    flex: 0 0 auto !important;
  }
  #pit-tabs {
    position: sticky !important;
    top: 32px !important;
    z-index: 55 !important;
    flex: 0 0 auto !important;
    background: rgba(5, 8, 16, .96) !important;
    backdrop-filter: blur(10px);
  }
  #pit-tab-content {
    flex: 1 1 auto !important;
    overflow: visible !important;
    height: auto !important;
    min-height: 60dvh !important;
  }
  .pit-panel {
    overflow: visible !important;
    height: auto !important;
    max-height: none !important;
  }
  .panel-toolbar {
    position: sticky !important;
    top: 88px !important;
    z-index: 45 !important;
    background: rgba(8, 12, 22, .98) !important;
    backdrop-filter: blur(10px);
  }
  .table-shell,
  .jobs-table-wrap,
  .dispatch-table-wrap,
  .verification-table-wrap {
    overflow-x: auto !important;
    overflow-y: visible !important;
    -webkit-overflow-scrolling: touch !important;
    max-width: 100% !important;
  }
  .forge-table,
  table {
    white-space: nowrap;
  }
  .btn,
  .pit-tab,
  summary,
  button {
    min-height: 44px;
  }
  input,
  select,
  textarea {
    font-size: 16px !important;
  }
}

@media (max-width: 560px) {
  #pit-health-bar {
    gap: 8px;
    padding-inline: 8px;
  }
  .hb-brand {
    max-width: 42vw;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  #pit-tabs {
    top: 32px !important;
  }
  .pit-control-room-header {
    gap: 8px !important;
  }
  .pit-header-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
  }
  .pit-header-actions .btn:nth-child(n+3) {
    grid-column: span 2;
  }
  .pit-date-status {
    line-height: 1.35;
  }
  .panel-toolbar {
    top: 82px !important;
  }
  .toolbar-group {
    width: 100%;
    display: flex !important;
    gap: 8px;
    overflow-x: auto !important;
  }
  .toolbar-group .btn,
  .dispatch-view-btns .btn {
    min-width: 148px;
    white-space: nowrap;
  }
  .import-zone {
    min-height: 132px !important;
  }
  .import-zone-text {
    font-size: 16px !important;
  }
  .kpi-tile,
  .forge-card,
  .pit-panel,
  .table-shell {
    border-radius: 14px !important;
  }
  .kpi-value {
    letter-spacing: -0.04em;
  }
  .forge-table {
    min-width: 760px !important;
  }
  #dispatch-table {
    min-width: 940px !important;
  }
}


/* ================================================================
   PIT v36.22 MOBILE IMPORT / DUPLICATE CONTROL DEBUG FIX
   Purpose: one reliable mobile import path, no stacked duplicate
   upload controls on phones, and no decorative layer blocking taps.
   ================================================================ */
#csv-file-input {
  position: fixed !important;
  left: -9999px !important;
  top: auto !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.pit-control-room-header::before,
.pit-control-room-header::after,
.forge-card::before,
.forge-card::after,
.kpi-tile::before,
.kpi-tile::after,
.import-zone::before,
.import-zone::after {
  pointer-events: none !important;
}
#pit-header-import-btn,
#pit-header-dispatch-btn,
#csv-dropzone,
#csv-file-input,
.pit-tab,
.btn {
  position: relative;
  z-index: 5;
}
@media (max-width: 900px) {
  .pit-header-actions {
    grid-template-columns: 1fr 1fr !important;
  }
  .pit-header-actions a[href*="diagnostics"] {
    display: none !important;
  }
  .pit-date-status {
    grid-column: 1 / -1 !important;
  }
  #tab-dashboard .panel-toolbar .toolbar-group {
    display: none !important;
  }
  #tab-dashboard .panel-toolbar {
    position: relative !important;
    top: auto !important;
  }
  #pit-tabs {
    scrollbar-width: thin;
  }
  .pit-tab {
    min-width: max-content !important;
    padding-inline: 14px !important;
  }
  .tab-icon {
    display: inline-block !important;
  }
}
@media (max-width: 560px) {
  .pit-header-actions {
    grid-template-columns: 1fr 1fr !important;
  }
  .pit-header-actions .btn,
  .pit-header-actions a.btn {
    min-width: 0 !important;
    padding-inline: 10px !important;
    font-size: 11px !important;
  }
  .pit-header-actions .btn:nth-child(n+3) {
    grid-column: auto !important;
  }
  .pit-tab {
    min-width: 104px !important;
    font-size: 10px !important;
  }
  .tab-icon {
    display: none !important;
  }
}


/* ================================================================
   PIT v36.23 HARD MOBILE INTERACTION FIX
   Native mobile action dock avoids programmatic file-click failures
   in Android content:// viewers and removes tap-blocking risk.
   ================================================================ */
html, body, #pit-app-container, #pit-tabs, .pit-panel, .btn, .pit-tab, .import-zone { touch-action: manipulation; }
#pit-mobile-action-dock {
  display: none;
}
#csv-file-input-mobile {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  opacity: 0.001 !important;
  cursor: pointer !important;
  z-index: 3 !important;
}
@media (max-width: 900px) {
  body {
    padding-bottom: calc(120px + env(safe-area-inset-bottom, 0px)) !important;
  }
  #pit-mobile-action-dock {
    position: fixed !important;
    left: 10px !important;
    right: 10px !important;
    bottom: calc(10px + env(safe-area-inset-bottom, 0px)) !important;
    display: grid !important;
    grid-template-columns: 1.4fr 1fr !important;
    gap: 8px !important;
    z-index: 2147483647 !important;
    padding: 8px !important;
    border-radius: 20px !important;
    background: rgba(4, 8, 18, .96) !important;
    border: 1px solid rgba(86,182,255,.32) !important;
    box-shadow: 0 16px 60px rgba(0,0,0,.62) !important;
    backdrop-filter: blur(14px) !important;
  }
  .pit-mobile-dock-btn {
    position: relative !important;
    min-height: 50px !important;
    border-radius: 15px !important;
    border: 1px solid rgba(255,255,255,.14) !important;
    background: rgba(255,255,255,.08) !important;
    color: #edf3ff !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    font-weight: 950 !important;
    font-size: 13px !important;
    letter-spacing: .01em !important;
    overflow: hidden !important;
    user-select: none !important;
    -webkit-tap-highlight-color: transparent !important;
  }
  .pit-mobile-dock-import {
    background: linear-gradient(135deg, #56b6ff, #6fffd2) !important;
    color: #061018 !important;
    border-color: transparent !important;
  }
  .pit-header-actions { display: none !important; }
  #tab-dashboard .panel-toolbar .toolbar-group { display: none !important; }
  .pit-control-room-header { padding-bottom: 18px !important; }
}


/* ================================================================
   PIT v36.24 UI / UX POLISH PASS
   Purpose: cleaner control-room layout, stronger phone usability,
   calmer TV-style cards, and reduced duplicate visual noise.
   No production, dispatch, route, security or calculation logic changed.
   ================================================================ */
:root {
  --pit-accent-a: #55c7ff;
  --pit-accent-b: #62ffd4;
  --pit-panel-bg: rgba(7, 11, 22, .88);
  --pit-panel-bg-strong: rgba(9, 14, 28, .96);
  --pit-line: rgba(139, 214, 255, .18);
  --pit-soft-line: rgba(255,255,255,.085);
  --pit-radius-xl: 24px;
  --pit-radius-lg: 18px;
}

body {
  background:
    radial-gradient(circle at 18% 4%, rgba(64,196,255,.16), transparent 34%),
    radial-gradient(circle at 88% 2%, rgba(0,230,118,.10), transparent 32%),
    linear-gradient(180deg, #03050b 0%, #07111a 52%, #03050b 100%) !important;
}

#pit-app-container {
  gap: 14px;
}

#pit-health-bar {
  background: rgba(3, 5, 12, .94) !important;
  border-bottom: 1px solid rgba(85,199,255,.20) !important;
  backdrop-filter: blur(12px);
}

.pit-control-room-header,
.forge-card,
.table-shell,
.pit-panel,
.import-zone,
.kpi-tile {
  box-shadow: 0 20px 70px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.045) !important;
}

.pit-control-room-header {
  border-radius: var(--pit-radius-xl) !important;
  border: 1px solid rgba(97, 255, 212, .22) !important;
  background:
    linear-gradient(135deg, rgba(16, 24, 44, .98), rgba(8, 18, 28, .96)),
    radial-gradient(circle at 0% 0%, rgba(85,199,255,.20), transparent 44%) !important;
}

.pit-header-kicker,
.panel-title,
.kpi-label,
.card-kicker,
.module-kicker {
  letter-spacing: .18em !important;
}

.pit-header-main h1 {
  letter-spacing: -.04em;
}

.pit-header-main p {
  max-width: 720px;
  color: rgba(218,229,255,.68) !important;
}

.btn,
.pit-tab,
.pit-mobile-dock-btn {
  border-radius: 16px !important;
  transition: transform .14s ease, border-color .14s ease, background .14s ease, box-shadow .14s ease !important;
}

.btn:active,
.pit-tab:active,
.pit-mobile-dock-btn:active {
  transform: translateY(1px) scale(.985);
}

.btn-primary,
.pit-mobile-dock-import {
  background: linear-gradient(135deg, var(--pit-accent-a), var(--pit-accent-b)) !important;
  color: #041018 !important;
  box-shadow: 0 12px 36px rgba(85,199,255,.20) !important;
}

#pit-tabs {
  border-radius: 24px !important;
  background: rgba(4, 8, 18, .86) !important;
  border: 1px solid rgba(85,199,255,.18) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 14px 44px rgba(0,0,0,.22) !important;
}

.pit-tab {
  color: rgba(232,240,255,.72) !important;
  background: rgba(255,255,255,.045) !important;
  border: 1px solid rgba(255,255,255,.075) !important;
}

.pit-tab.active {
  color: #f5fbff !important;
  background: linear-gradient(135deg, rgba(64,196,255,.26), rgba(0,230,118,.14)) !important;
  border-color: rgba(85,199,255,.45) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.04), 0 12px 36px rgba(64,196,255,.16) !important;
}

.pit-panel {
  border-color: rgba(85,199,255,.14) !important;
  background: var(--pit-panel-bg) !important;
}

.panel-toolbar {
  border-bottom: 1px solid rgba(255,255,255,.06) !important;
}

.dashboard-grid,
.capacity-layout,
.diagnostic-grid,
.module-health-grid,
.security-grid {
  gap: 14px !important;
}

.kpi-tile {
  border: 1px solid rgba(85,199,255,.14) !important;
  background: linear-gradient(180deg, rgba(14, 22, 40, .96), rgba(8, 12, 24, .96)) !important;
}

.kpi-value {
  letter-spacing: -.055em !important;
  line-height: .95 !important;
}

.import-zone {
  border-style: solid !important;
  border-color: rgba(85,199,255,.28) !important;
  background: linear-gradient(180deg, rgba(85,199,255,.06), rgba(98,255,212,.035)) !important;
}

.import-zone:hover,
.import-zone:focus-visible {
  border-color: rgba(98,255,212,.62) !important;
  background: linear-gradient(180deg, rgba(85,199,255,.11), rgba(98,255,212,.07)) !important;
}

.table-shell {
  border: 1px solid rgba(85,199,255,.13) !important;
  background: rgba(4, 8, 18, .86) !important;
}

.forge-table th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: rgba(8, 12, 24, .98) !important;
}

.badge,
.status-pill,
.route-badge {
  border-radius: 999px !important;
}

/* Desktop and tablet: remove visual duplication without removing useful controls. */
#tab-dashboard .panel-toolbar .toolbar-group .btn-primary {
  white-space: nowrap;
}

/* Mobile first-use experience: one obvious upload path, cleaner command view. */
@media (max-width: 900px) {
  html, body {
    background: #03050b !important;
  }

  #pit-health-bar {
    height: 32px !important;
    padding: 0 10px !important;
  }

  #pit-health-bar .hb-indicator:not(#hb-errors):not(#hb-offline-queue),
  #pit-health-bar .hb-spacer,
  #pit-health-bar .hb-clock {
    display: none !important;
  }

  .hb-brand {
    max-width: none !important;
    width: 100% !important;
    justify-content: center !important;
    padding: 0 !important;
    font-size: 10px !important;
  }

  #pit-app-container {
    padding: 10px 10px 98px !important;
    gap: 10px !important;
  }

  .pit-control-room-header {
    padding: 16px !important;
    border-radius: 22px !important;
  }

  .pit-header-kicker {
    font-size: 10px !important;
    color: #67ffd8 !important;
  }

  .pit-header-main h1 {
    font-size: clamp(28px, 9vw, 38px) !important;
    line-height: .98 !important;
    margin-top: 6px !important;
  }

  .pit-header-main p {
    display: none !important;
  }

  /* No duplicate upload buttons on mobile. The bottom dock owns upload. */
  .pit-header-actions,
  #tab-dashboard .panel-toolbar .toolbar-group {
    display: none !important;
  }

  #pit-tabs {
    position: sticky !important;
    top: 32px !important;
    z-index: 80 !important;
    display: grid !important;
    grid-auto-flow: column !important;
    grid-auto-columns: minmax(112px, 1fr) !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    gap: 8px !important;
    padding: 8px !important;
    min-height: 58px !important;
    scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch;
  }

  .pit-tab {
    scroll-snap-align: start;
    min-width: 112px !important;
    height: 42px !important;
    padding-inline: 12px !important;
    font-size: 10px !important;
  }

  .pit-tab .tab-icon {
    display: none !important;
  }

  .pit-panel {
    padding: 12px !important;
    border-radius: 20px !important;
  }

  .panel-toolbar {
    position: relative !important;
    top: auto !important;
    margin: -12px -12px 12px !important;
    padding: 13px 14px !important;
    border-radius: 20px 20px 0 0 !important;
    background: rgba(8,12,24,.74) !important;
  }

  .panel-title {
    font-size: 18px !important;
    letter-spacing: -.02em !important;
    text-transform: none !important;
  }

  .dashboard-hero,
  .forge-card {
    border-radius: 20px !important;
  }

  .dashboard-hero h2,
  .dashboard-hero .hero-title,
  #dashboard-hero h2,
  #dashboard-hero .hero-title {
    font-size: clamp(28px, 10vw, 42px) !important;
    line-height: 1 !important;
  }

  .dashboard-kpis,
  .command-kpis,
  .kpi-row {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  .kpi-tile {
    min-height: 96px !important;
    padding: 14px !important;
  }

  .kpi-label {
    font-size: 9px !important;
  }

  .kpi-value {
    font-size: clamp(28px, 10vw, 44px) !important;
  }

  .toolbar-group,
  .dispatch-view-btns {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    padding-bottom: 2px !important;
  }

  .toolbar-group .btn,
  .dispatch-view-btns .btn {
    flex: 0 0 auto !important;
  }

  input, select, textarea, button, .btn, .pit-tab, summary {
    -webkit-tap-highlight-color: transparent !important;
  }

  #pit-mobile-action-dock {
    grid-template-columns: 1.28fr 1fr 1fr !important;
    gap: 9px !important;
    padding: 9px !important;
    border-radius: 24px !important;
    background: rgba(5, 10, 22, .97) !important;
    border: 1px solid rgba(85,199,255,.38) !important;
    box-shadow: 0 18px 70px rgba(0,0,0,.70), inset 0 1px 0 rgba(255,255,255,.08) !important;
  }

  .pit-mobile-dock-btn {
    min-height: 56px !important;
    font-size: 12px !important;
    text-transform: uppercase !important;
    letter-spacing: .08em !important;
  }
}

@media (max-width: 560px) {
  #pit-app-container {
    padding-inline: 8px !important;
  }

  .pit-control-room-header {
    margin-top: 2px !important;
  }

  #pit-tabs {
    grid-auto-columns: minmax(100px, 1fr) !important;
  }

  .pit-tab {
    min-width: 100px !important;
  }

  .dashboard-kpis,
  .command-kpis,
  .kpi-row {
    grid-template-columns: 1fr 1fr !important;
  }

  .kpi-tile {
    min-height: 86px !important;
  }

  .dashboard-grid,
  .capacity-layout,
  .upload-flow-panel,
  .ops-briefing,
  .diagnostic-grid,
  .module-health-grid,
  .security-grid {
    gap: 10px !important;
  }

  .forge-card {
    padding: 14px !important;
  }

  .import-zone {
    min-height: 145px !important;
  }

  .import-zone-text {
    font-size: 18px !important;
    line-height: 1.2 !important;
  }

  .table-shell::after {
    content: 'Swipe table sideways';
    display: block;
    position: sticky;
    left: 0;
    bottom: 0;
    padding: 7px 10px;
    color: rgba(232,240,255,.55);
    background: rgba(4,8,18,.88);
    font-size: 10px;
    letter-spacing: .08em;
    text-transform: uppercase;
  }
}

@media (max-width: 380px) {
  .pit-header-main h1 {
    font-size: 26px !important;
  }

  .dashboard-kpis,
  .command-kpis,
  .kpi-row {
    grid-template-columns: 1fr !important;
  }

  #pit-mobile-action-dock {
    left: 6px !important;
    right: 6px !important;
    bottom: calc(6px + env(safe-area-inset-bottom, 0px)) !important;
  }

  .pit-mobile-dock-btn {
    min-height: 52px !important;
    font-size: 10px !important;
  }
}

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


/* ================================================================
   PIT v36.30 — Physics Observation Tab
   Read-only Phase 1-3 telemetry. No recommendations.
   ================================================================ */
.physics-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin-bottom:14px}.physics-tile{border:1px solid rgba(86,182,255,.18);border-radius:20px;background:linear-gradient(135deg,rgba(86,182,255,.10),rgba(255,255,255,.045));padding:14px;box-shadow:0 14px 38px rgba(0,0,0,.18)}.physics-tile small{display:block;color:var(--t1,#94a3b8);text-transform:uppercase;letter-spacing:.1em;font-size:10px;margin-bottom:7px}.physics-tile strong{display:block;color:#fff;font-size:24px;font-family:var(--f-mono,monospace);line-height:1.05}.physics-tile span{display:block;color:var(--t1,#94a3b8);font-size:12px;margin-top:6px}.physics-status{border-radius:22px;border:1px solid rgba(56,240,148,.18);background:radial-gradient(circle at 10% 0%,rgba(56,240,148,.13),transparent 34%),rgba(9,13,23,.88);padding:16px;margin-bottom:14px}.physics-status h3{margin:0 0 8px;color:#fff}.physics-status p{margin:0;color:var(--t1,#94a3b8);line-height:1.45}.physics-status .locked-note{margin-top:10px;color:#fbbf24;font-family:var(--f-mono,monospace);font-size:12px}.physics-columns{display:grid;grid-template-columns:1.15fr .85fr;gap:14px}.physics-list{display:flex;flex-direction:column;gap:7px}.physics-row{display:grid;grid-template-columns:minmax(110px,1fr) 90px 90px;gap:8px;align-items:center;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:rgba(255,255,255,.045);padding:9px 10px}.physics-row b{color:#fff}.physics-row span{color:var(--t1,#94a3b8);font-family:var(--f-mono,monospace);text-align:right}.physics-code{display:inline-flex;margin:3px 4px 3px 0;padding:5px 8px;border-radius:999px;border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.055);font-size:11px;color:#dbeafe;font-family:var(--f-mono,monospace)}.physics-pre{white-space:pre-wrap;word-break:break-word;max-height:300px;overflow:auto;border-radius:16px;border:1px solid rgba(255,255,255,.08);background:rgba(0,0,0,.22);padding:12px;color:#cbd5e1;font-size:11px;font-family:var(--f-mono,monospace)}@media(max-width:900px){.physics-columns{grid-template-columns:1fr}.physics-row{grid-template-columns:1fr 75px 75px}}

/* ================================================================
   PIT v36.31 audit fixes
   ================================================================ */
#tab-physics .physics-grid,
.physics-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;margin:12px 0;}
.physics-tile{background:rgba(15,23,42,.72);border:1px solid rgba(148,163,184,.16);border-radius:14px;padding:12px;display:flex;flex-direction:column;gap:5px;}
.physics-tile small{color:var(--t2);font-size:10px;text-transform:uppercase;letter-spacing:.09em;font-weight:800;}
.physics-tile strong{font-family:var(--f-mono);font-size:24px;color:var(--t0);}
.physics-tile span{color:var(--t1);font-size:11px;}
.physics-status{border:1px solid rgba(64,196,255,.2);background:rgba(64,196,255,.06);border-radius:16px;padding:14px;margin-bottom:12px;}
.physics-status h3{font-size:18px;margin-bottom:6px;}
.locked-note{margin-top:8px;color:var(--green);font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;}
.physics-columns{display:grid;grid-template-columns:1.2fr .8fr;gap:12px;}
.physics-row{display:grid;grid-template-columns:1fr auto auto;gap:10px;padding:7px 0;border-bottom:1px solid rgba(255,255,255,.06);font-size:12px;}
.physics-row span{font-family:var(--f-mono);color:var(--t1);}
.physics-code{display:inline-flex;margin:3px;padding:4px 7px;border-radius:999px;border:1px solid rgba(64,196,255,.18);background:rgba(64,196,255,.08);font-size:10px;color:var(--blue);font-weight:800;}
.physics-pre{white-space:pre-wrap;background:rgba(0,0,0,.18);border:1px solid rgba(255,255,255,.08);border-radius:10px;padding:10px;color:var(--t1);font-size:12px;line-height:1.45;}
.jobtracker-row span{min-width:70px;text-align:right;}
.pit-filter-check{border-color:rgba(64,196,255,.16)!important;}
@media(max-width:900px){.physics-columns{grid-template-columns:1fr;}}
/* v36.31 import reliability: keep real file input clickable inside the drop zone */
.import-zone{position:relative!important;}
.import-zone #csv-file-input{position:absolute!important;left:0!important;top:0!important;right:0!important;bottom:0!important;width:100%!important;height:100%!important;opacity:.001!important;pointer-events:auto!important;cursor:pointer!important;z-index:20!important;}
.import-zone .import-zone-icon,.import-zone .import-zone-text,.import-zone .import-zone-hint{pointer-events:none!important;}

/* ─────────────────────────────────────────────────────────────
   v36.37 Supervisor Floor-Status Strip (5-second read)
   ───────────────────────────────────────────────────────────── */
.floor-status-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:14px}
.floor-status-strip .fss-cell{padding:12px 14px;border-radius:16px;border:1px solid rgba(255,255,255,.10);background:linear-gradient(180deg,rgba(21,28,44,.9),rgba(12,16,27,.9));box-shadow:0 10px 30px rgba(0,0,0,.22)}
.floor-status-strip .fss-cell small{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:var(--cr-muted);font-weight:900}
.floor-status-strip .fss-cell strong{display:block;font-size:19px;font-weight:950;line-height:1.15;margin:5px 0 3px;color:#fff}
.floor-status-strip .fss-cell span{display:block;font-size:11px;color:var(--cr-muted);line-height:1.25}
.floor-status-strip .fss-ok{box-shadow:0 10px 30px rgba(0,0,0,.22),inset 3px 0 0 var(--cr-green)}
.floor-status-strip .fss-warn{box-shadow:0 10px 30px rgba(0,0,0,.22),inset 3px 0 0 var(--cr-amber)}
.floor-status-strip .fss-crit{box-shadow:0 10px 30px rgba(0,0,0,.22),inset 3px 0 0 var(--cr-red)}
.floor-status-strip .fss-info{box-shadow:0 10px 30px rgba(0,0,0,.22),inset 3px 0 0 var(--cr-blue)}
.floor-status-strip.floor-status-empty{grid-template-columns:1fr}
@media (max-width:760px){.floor-status-strip{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Observation Mode banner */
.obs-mode-banner{display:flex;align-items:center;gap:8px;font-size:11px;color:#bfe6ff;background:rgba(86,182,255,.10);border:1px solid rgba(86,182,255,.22);border-radius:12px;padding:6px 12px;margin-bottom:10px}
.obs-mode-banner .obs-dot{width:8px;height:8px;border-radius:50%;background:var(--cr-blue);box-shadow:0 0 8px var(--cr-blue)}

/* ─────────────────────────────────────────────────────────────
   v36.37b Physics Calibration Mode (transparency, not decision-grade)
   ───────────────────────────────────────────────────────────── */
.physics-calib-banner{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:800;color:#ffe0a1;background:linear-gradient(135deg,rgba(255,200,87,.16),rgba(255,140,80,.10));border:1px solid rgba(255,200,87,.35);border-radius:14px;padding:12px 14px;margin-bottom:14px;line-height:1.4}
.physics-calib-card{border:1px solid rgba(255,200,87,.22)!important}
.physics-calib-list{margin:6px 0 0;padding-left:18px}
.physics-calib-list li{font-size:12px;color:var(--cr-muted);line-height:1.5;margin-bottom:4px}
.physics-tile.tile-bad strong{color:#ff8a96}
.physics-tile.tile-bad{box-shadow:inset 3px 0 0 var(--cr-red)}
.physics-calib-foot{margin-top:12px;font-size:11px;color:var(--cr-muted);background:rgba(86,182,255,.07);border:1px solid rgba(86,182,255,.16);border-radius:12px;padding:10px 12px;line-height:1.5}

/* v36.40 WhatsApp planner preview */
.whatsapp-preview{white-space:pre-wrap;font-family:var(--f-mono,monospace);font-size:12px;line-height:1.55;color:#dce7f7;background:rgba(4,8,18,.55);border:1px solid rgba(255,255,255,.10);border-radius:14px;padding:14px;margin-top:8px;max-height:420px;overflow:auto}

/* v36.40 — Dispatch wallboard restored and Friday-window card removed */
.pit-dispatch-wallboard-restored .wallboard-restore-card{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
  padding:14px;
  border-radius:18px;
  border:1px solid rgba(56,189,248,.22);
  background:linear-gradient(135deg,rgba(14,165,233,.12),rgba(16,185,129,.06));
}
.pit-dispatch-wallboard-restored .wallboard-restore-card p{
  margin:0;
  color:var(--t1);
  line-height:1.5;
  max-width:760px;
}

/* v36.46 Physics Calibration scaffold */
#physics-calibration-panel{margin-top:14px;}
.calib-actions{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0;}
.calib-row{display:grid;grid-template-columns:minmax(140px,1fr) minmax(90px,.7fr) minmax(90px,.7fr) minmax(90px,.55fr);gap:10px;align-items:center;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.08);font-size:12px;}
.calib-row:last-child{border-bottom:0;}
.calib-badge{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:3px 8px;font-size:10px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;background:rgba(255,255,255,.08);color:#e8f2ff;border:1px solid rgba(255,255,255,.12);}
.calib-badge.high,.calib-good{background:rgba(62,207,142,.14)!important;border-color:rgba(62,207,142,.4)!important;color:#bff5d6!important;}
.calib-badge.medium,.calib-warn{background:rgba(255,193,7,.14)!important;border-color:rgba(255,193,7,.42)!important;color:#ffe29a!important;}
.calib-badge.low,.calib-badge.collecting,.calib-low{background:rgba(255,119,119,.12)!important;border-color:rgba(255,119,119,.36)!important;color:#ffc0c0!important;}
@media (max-width:720px){.calib-row{grid-template-columns:1fr 1fr}.calib-row span:last-child{justify-self:start}.calib-actions .btn{flex:1 1 100%;}}


/* v36.47 Import Hotfix: global CSV picker sits outside hidden panels but remains invisible. */
.pit-global-file-input{position:fixed!important;left:0!important;top:0!important;width:1px!important;height:1px!important;opacity:0.001!important;z-index:-1!important;pointer-events:none!important;}

/* ── v36.59 cosmetic polish (renders above the control-room skin) ───────────
   Subtle, consistent refinements only — no layout or colour-scheme changes.
   Adds tactile feedback and breathing room the base skin lacked.            */
.kpi-tile{
  transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease!important;
}
.kpi-tile:hover{
  transform:translateY(-2px)!important;
  border-color:rgba(255,255,255,.18)!important;
}
.kpi-sub{
  overflow-wrap:anywhere;            /* longer denominator text wraps cleanly */
}
/* Department / job / carrier cards: gentle hover so the board feels alive */
.dept-card,.job-card,.carrier-tile{
  transition:transform .16s ease,border-color .16s ease!important;
}
.dept-card:hover,.job-card:hover,.carrier-tile:hover{
  transform:translateY(-2px)!important;
  border-color:rgba(86,182,255,.30)!important;
}
/* Tab active indicator: a touch more presence without changing the palette */
.pit-tab.active{
  box-shadow:0 10px 30px rgba(86,182,255,.18),inset 2px 0 0 var(--cr-green)!important;
}
/* Tables: subtle zebra for long job lists (legibility on the floor) */
.forge-table tbody tr:nth-child(even){
  background:rgba(255,255,255,.018);
}