/* Command-center presentation layer: preserves the application structure and interactions. */
:root {
  --guv-ink: #101b2d;
  --guv-navy: #12233b;
  --guv-paper: #f7f4ed;
  --guv-cream: #fffdf8;
  --guv-line: #d8d5ca;
  --guv-green: #087a58;
  --guv-red: #c7483f;
  --guv-amber: #b56a11;
  font-family: "Avenir Next", "Apple SD Gothic Neo", "Helvetica Neue", sans-serif;
}

body {
  background:
    radial-gradient(circle at 76% 8%, rgba(13, 122, 88, 0.12), transparent 31rem),
    linear-gradient(135deg, #e8e6df 0%, #f7f4ed 44%, #e8edf0 100%);
}

.app-shell {
  grid-template-columns: 224px minmax(0, 1fr);
  min-height: 100vh;
  background: transparent;
}

.nav-rail {
  position: sticky;
  top: 0;
  height: 100vh;
  gap: 14px;
  overflow-y: auto;
  padding: 20px 11px 16px;
  background:
    radial-gradient(circle at 6% 2%, rgba(38, 152, 112, 0.35), transparent 28%),
    linear-gradient(165deg, #182a42 0%, #101a2b 46%, #0b111b 100%);
  border-right: 1px solid rgba(255, 255, 255, 0.14);
  box-shadow: 18px 0 50px rgba(12, 22, 38, 0.13);
}

.brand-block {
  min-height: 54px;
  padding: 0 6px 14px;
  border-bottom: 1px solid rgba(224, 234, 245, 0.14);
}

.brand-mark {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: linear-gradient(145deg, #4ca982, #156a58 58%, #0f3141);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.28);
}

.brand-title {
  font-size: 19px;
  letter-spacing: -0.04em;
}

.brand-subtitle {
  color: #b9cbdc;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.nav-list {
  gap: 3px;
}

.nav-item {
  min-height: 46px;
  padding: 7px 9px;
  border-radius: 10px;
  color: #bfccda;
}

.nav-item strong {
  font-size: 11px;
  letter-spacing: 0.015em;
}

.nav-item small {
  color: #8094aa;
  font-size: 10px;
}

.nav-item:hover,
.nav-item.active {
  background: linear-gradient(105deg, #178365, #0f6c77);
  border-color: rgba(196, 255, 231, 0.22);
  box-shadow: 0 9px 22px rgba(3, 48, 53, 0.42);
}

.operator-card {
  padding: 11px;
  background: rgba(255, 255, 255, 0.075);
  border-color: rgba(255, 255, 255, 0.13);
  border-radius: 12px;
}

.workspace {
  max-width: 1680px;
  padding: 0 clamp(16px, 2.3vw, 36px) 32px;
  background: transparent;
}

.ops-topbar {
  position: sticky;
  top: 0;
  z-index: 5;
  min-height: 68px;
  margin: 0 calc(clamp(16px, 2.3vw, 36px) * -1) 16px;
  padding: 0 clamp(16px, 2.3vw, 36px);
  background: rgba(255, 253, 248, 0.88);
  border-bottom: 1px solid rgba(176, 166, 145, 0.46);
  box-shadow: 0 10px 28px rgba(27, 37, 49, 0.055);
  backdrop-filter: blur(16px);
}

.focus-rail {
  position: relative;
  margin: 18px 0 14px;
  padding: 15px 17px;
  overflow: hidden;
  color: #edf7f2;
  border: 1px solid rgba(129, 218, 179, 0.4);
  border-left: 0;
  border-radius: 16px;
  background:
    radial-gradient(circle at 90% 12%, rgba(88, 212, 158, 0.25), transparent 19rem),
    linear-gradient(110deg, #11283a 0%, #123840 56%, #0a5143 100%);
  box-shadow: 0 18px 40px rgba(10, 41, 53, 0.19);
}

.focus-rail::before {
  position: absolute;
  inset: 0 auto 0 0;
  width: 6px;
  content: "";
  background: #58d49e;
}

.focus-kicker {
  color: #9aebc4;
  border-color: rgba(154, 235, 196, 0.42);
  background: rgba(82, 208, 153, 0.1);
}

.focus-copy strong,
.focus-copy small,
.focus-queue-count {
  color: inherit;
}

.focus-copy strong {
  font-size: 16px;
  letter-spacing: -0.025em;
}

.focus-copy small,
.focus-queue-count {
  color: #c8dfd8;
}

.focus-go {
  min-height: 40px;
  padding: 10px 17px;
  color: #09372c;
  background: #9cf0c7;
  border-radius: 10px;
  box-shadow: 0 8px 18px rgba(1, 22, 19, 0.22);
}

.mission-summary-row {
  position: relative;
  grid-template-columns: minmax(340px, 0.9fr) minmax(580px, 1.6fr);
  gap: 22px;
  margin-bottom: 16px;
  padding: 22px;
  overflow: hidden;
  color: #f5f1e8;
  border: 1px solid #253d57;
  border-radius: 18px;
  background:
    radial-gradient(circle at 4% 112%, rgba(54, 159, 117, 0.3), transparent 22rem),
    linear-gradient(120deg, #132238 0%, #172c44 56%, #182f48 100%);
  box-shadow: 0 20px 45px rgba(18, 29, 45, 0.18);
}

.mission-summary-row::after {
  position: absolute;
  inset: 0 0 0 auto;
  width: 38%;
  content: "";
  opacity: 0.16;
  background: repeating-linear-gradient(135deg, transparent 0 16px, #c6d7e3 17px 18px);
  pointer-events: none;
}

.target-summary-block,
.summary-metrics-grid {
  position: relative;
  z-index: 1;
}

.target-summary-head span,
.target-summary-block h1 {
  color: #fffaf0;
}

.target-summary-head span {
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.target-summary-block h1 {
  max-width: 30rem;
  font-size: clamp(24px, 2.2vw, 34px);
  line-height: 1.12;
  letter-spacing: -0.055em;
}

.target-summary-head button {
  color: #d4ffe7;
  background: rgba(80, 205, 149, 0.1);
  border-color: rgba(162, 244, 202, 0.26);
  border-radius: 8px;
}

.case-tag-row span {
  color: #d8e6ef;
  background: rgba(227, 240, 247, 0.08);
  border-color: rgba(227, 240, 247, 0.16);
  border-radius: 999px;
}

.case-tag-row .blue,
.case-tag-row .green,
.case-tag-row .red {
  color: #f5fff9;
  background: rgba(72, 191, 140, 0.16);
  border-color: rgba(152, 243, 198, 0.28);
}

.summary-metrics-grid {
  align-self: stretch;
  border-color: rgba(224, 237, 241, 0.18);
  border-radius: 13px;
  background: rgba(4, 15, 29, 0.22);
  backdrop-filter: blur(7px);
}

.summary-metrics-grid article {
  min-height: 104px;
  padding: 15px 17px;
  border-color: rgba(224, 237, 241, 0.15);
}

.summary-metrics-grid span,
.summary-metrics-grid small,
.summary-metrics-grid strong,
.summary-metrics-grid strong em {
  color: #f6f0e5;
}

.summary-metrics-grid span {
  color: #b9cddd;
  letter-spacing: 0.055em;
  text-transform: uppercase;
}

.summary-metrics-grid strong {
  font-size: clamp(26px, 2vw, 35px);
  letter-spacing: -0.055em;
}

.mission-cockpit-dashboard {
  gap: 14px;
}

.executive-section-title {
  min-height: 32px;
  padding: 0 3px;
}

.executive-section-title strong {
  font-size: 13px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.executive-section-title span {
  color: #657487;
}

.decision-cards-grid {
  grid-template-columns: minmax(0, 1.35fr) minmax(230px, 0.82fr) minmax(230px, 0.82fr);
  gap: 14px;
}

.decision-card,
.readiness-engine-panel,
.cockpit-mini-panel,
.investigator-copilot-rail,
.release-gate-rail,
.cockpit-insight-panel {
  border-radius: 15px;
  box-shadow: 0 13px 30px rgba(30, 39, 54, 0.085);
}

.decision-card {
  min-height: 210px;
  padding: 15px;
  border-color: #d8d8ce;
  background: var(--guv-cream);
  transition: transform 160ms ease, box-shadow 160ms ease;
}

.decision-card:hover,
.cockpit-mini-panel:hover,
.cockpit-insight-panel:hover {
  transform: translateY(-2px);
  box-shadow: 0 20px 38px rgba(30, 39, 54, 0.13);
}

.best-judgment {
  border-color: #1c574d;
  background:
    radial-gradient(circle at 93% 5%, rgba(108, 236, 181, 0.21), transparent 15rem),
    linear-gradient(135deg, #103a42 0%, #0c4a40 100%);
}

.best-judgment .decision-card-top strong,
.best-judgment .decision-card-top small,
.best-judgment .judgment-box h3,
.best-judgment .judgment-box p,
.best-judgment .rationale-list b,
.best-judgment .rationale-list span,
.best-judgment .decision-metric strong {
  color: #effbf4;
}

.best-judgment .decision-card-top small,
.best-judgment .decision-metric span {
  color: #a6d8c2;
}

.best-judgment .judgment-box,
.best-judgment .judgment-metric-row {
  border-color: rgba(186, 240, 212, 0.2);
  background: rgba(3, 29, 29, 0.21);
}

.best-judgment .decision-metric {
  border-color: rgba(186, 240, 212, 0.16);
}

.best-judgment .text-action {
  color: #a7f0c8;
}

.evidence-gaps-card {
  border-color: #efb1a9;
  background: linear-gradient(160deg, #fffdf8 0%, #fff0ec 100%);
}

.action-card {
  border-color: #e8c78d;
  background: linear-gradient(160deg, #fffdf8 0%, #fff7e3 100%);
}

.decision-card-top {
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(41, 60, 78, 0.11);
}

.best-judgment .decision-card-top {
  border-color: rgba(194, 242, 216, 0.2);
}

.decision-number {
  border-radius: 9px;
}

.judgment-box {
  padding: 12px;
  border-radius: 11px;
}

.readiness-engine-panel,
.cockpit-insight-panel {
  padding: 16px;
  border-color: #d8d9d0;
  background: rgba(255, 253, 248, 0.9);
}

.engine-title-row strong,
.mini-panel-title strong,
.insight-head h3 {
  letter-spacing: -0.02em;
}

.cockpit-bottom-grid {
  gap: 14px;
}

.cockpit-mini-panel {
  min-height: 174px;
  padding: 15px;
  border-color: #d8d9d0;
  background: rgba(255, 253, 248, 0.9);
}

.fund-node {
  border-radius: 10px;
  background: #f2f4ee;
  border-color: #dce0d4;
}

.fund-node.final {
  background: #153d55;
  border-color: #153d55;
}

.primary-button {
  background: #116e58;
  border-color: #116e58;
  box-shadow: 0 8px 16px rgba(17, 110, 88, 0.2);
}

.secondary-button {
  color: #173a50;
  background: #f8f5ec;
  border-color: #d7d0c0;
}

@media (max-width: 1160px) {
  .app-shell {
    grid-template-columns: 204px minmax(0, 1fr);
  }

  .mission-summary-row {
    grid-template-columns: 1fr;
  }

  .decision-cards-grid {
    grid-template-columns: minmax(0, 1.2fr) repeat(2, minmax(190px, 0.9fr));
  }

  .summary-metrics-grid article {
    min-height: 82px;
  }
}

@media (max-width: 880px) {
  .app-shell {
    grid-template-columns: 1fr;
  }

  .nav-rail {
    position: static;
    height: auto;
    max-height: none;
  }

  .nav-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .operator-card,
  .nav-footer {
    margin-top: 0;
  }

  .decision-cards-grid,
  .cockpit-bottom-grid {
    grid-template-columns: 1fr;
  }

  .decision-card {
    min-height: 0;
  }
}

@media (max-width: 620px) {
  .workspace {
    padding: 0 12px 22px;
  }

  .ops-topbar {
    margin-inline: -12px;
    padding-inline: 12px;
  }

  .nav-list,
  .summary-metrics-grid {
    grid-template-columns: 1fr;
  }

  .summary-metrics-grid article,
  .summary-metrics-grid article:first-child {
    min-height: 70px;
    border-top: 1px solid rgba(224, 237, 241, 0.15);
    border-left: 0;
  }

  .summary-metrics-grid article:first-child {
    border-top: 0;
  }

  .mission-summary-row {
    padding: 17px;
  }

  .focus-rail {
    padding: 14px;
  }
}

/* Refinement pass: fewer competing accents and a predictable type hierarchy. */
:root {
  --guv-text: #172536;
  --guv-secondary: #5f6d7b;
  --guv-quiet: #88939e;
}

.nav-rail {
  gap: 11px;
}

.brand-title {
  font-size: 18px;
  font-weight: 760;
}

.brand-subtitle {
  color: #9eb2c3;
  font-size: 9.5px;
  font-weight: 650;
  letter-spacing: 0.075em;
}

.nav-item {
  min-height: 43px;
  padding: 7px 9px;
}

.nav-item strong {
  font-size: 11px;
  font-weight: 740;
}

.nav-item small {
  color: #8a9caf;
  font-size: 9.5px;
  font-weight: 580;
}

.nav-item:hover,
.nav-item.active {
  background: rgba(77, 180, 144, 0.2);
  border-color: rgba(189, 245, 222, 0.24);
  box-shadow: none;
}

.operator-card {
  padding: 10px;
  border-radius: 10px;
}

.ops-topbar {
  min-height: 64px;
  box-shadow: 0 7px 20px rgba(27, 37, 49, 0.045);
}

.focus-rail {
  margin-block: 16px 13px;
  padding: 14px 16px;
  border-radius: 14px;
  box-shadow: 0 13px 32px rgba(10, 41, 53, 0.13);
}

.focus-kicker {
  font-size: 10px;
  font-weight: 760;
}

.focus-copy strong {
  font-size: 15px;
  font-weight: 760;
}

.focus-copy small,
.focus-queue-count {
  font-size: 11px;
  font-weight: 560;
}

.focus-go {
  min-height: 38px;
  padding: 9px 15px;
  font-size: 12px;
  font-weight: 730;
}

.mission-summary-row {
  gap: 20px;
  padding: 20px;
  border-radius: 15px;
  box-shadow: 0 16px 34px rgba(18, 29, 45, 0.13);
}

.target-summary-head span,
.summary-metrics-grid span {
  font-size: 10px;
  font-weight: 750;
}

.target-summary-block h1 {
  font-size: clamp(25px, 2vw, 31px);
  font-weight: 730;
  letter-spacing: -0.045em;
}

.case-tag-row {
  gap: 6px;
}

.case-tag-row span {
  min-height: 22px;
  padding-inline: 9px;
  font-size: 10px;
  font-weight: 680;
}

.summary-metrics-grid {
  border-radius: 11px;
}

.summary-metrics-grid article {
  min-height: 96px;
  padding: 14px 16px;
}

.summary-metrics-grid strong {
  font-size: clamp(25px, 1.85vw, 31px);
  font-weight: 740;
}

.summary-metrics-grid small {
  color: #c3d1dd;
  font-size: 10px;
  font-weight: 590;
}

.executive-section-title {
  min-height: 28px;
}

.executive-section-title strong {
  color: #29394a;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.085em;
}

.executive-section-title span {
  color: var(--guv-quiet);
  font-size: 10px;
  font-weight: 580;
}

.decision-cards-grid,
.cockpit-bottom-grid {
  gap: 12px;
}

.decision-card {
  min-height: 198px;
  padding: 14px;
  border-color: #e1dfd7;
  border-radius: 12px;
  background: #fffdfa;
  box-shadow: 0 8px 18px rgba(30, 39, 54, 0.055);
}

.decision-card:hover,
.cockpit-mini-panel:hover,
.cockpit-insight-panel:hover {
  transform: translateY(-1px);
  box-shadow: 0 14px 25px rgba(30, 39, 54, 0.09);
}

.best-judgment {
  border-color: #245c54;
  background:
    radial-gradient(circle at 94% 8%, rgba(139, 225, 187, 0.16), transparent 14rem),
    linear-gradient(135deg, #183d43 0%, #155044 100%);
}

.evidence-gaps-card,
.action-card {
  background: #fffdfa;
}

.evidence-gaps-card {
  border-top: 3px solid #d9675d;
}

.action-card {
  border-top: 3px solid #d29a3e;
}

.decision-card-top {
  gap: 7px;
  padding-bottom: 7px;
}

.decision-card-top strong {
  color: var(--guv-text);
  font-size: 12px;
  font-weight: 790;
}

.decision-card-top small {
  color: var(--guv-secondary);
  font-size: 10px;
  font-weight: 570;
}

.decision-card-top > em {
  padding: 3px 7px;
  font-size: 9px;
  font-weight: 720;
}

.decision-number {
  width: 29px;
  height: 29px;
  font-size: 14px;
  font-weight: 760;
}

.judgment-box {
  gap: 8px;
  padding: 11px;
  border-radius: 9px;
}

.judgment-box h3 {
  font-size: 12px;
  font-weight: 740;
}

.judgment-box p {
  color: var(--guv-secondary);
  font-size: 10.5px;
  font-weight: 520;
  line-height: 1.45;
}

.decision-metric {
  padding: 7px;
}

.decision-metric span {
  color: var(--guv-secondary);
  font-size: 9px;
  font-weight: 690;
}

.decision-metric strong {
  color: var(--guv-text);
  font-size: 16px;
  font-weight: 740;
}

.rationale-list b {
  color: var(--guv-text);
  font-size: 10px;
  font-weight: 730;
}

.rationale-list span {
  color: var(--guv-secondary);
  font-size: 9.5px;
  font-weight: 520;
  line-height: 1.38;
}

.text-action {
  font-size: 10px;
  font-weight: 730;
}

.cockpit-insight-panel,
.readiness-engine-panel,
.cockpit-mini-panel {
  border-color: #e1dfd7;
  border-radius: 12px;
  background: rgba(255, 253, 248, 0.96);
  box-shadow: 0 8px 18px rgba(30, 39, 54, 0.05);
}

.cockpit-insight-panel,
.readiness-engine-panel {
  padding: 15px;
}

.cockpit-mini-panel {
  min-height: 166px;
  padding: 14px;
}

.engine-title-row strong,
.mini-panel-title strong,
.insight-head h3 {
  color: var(--guv-text);
  font-weight: 760;
}

.engine-title-row strong,
.mini-panel-title strong {
  font-size: 11px;
}

.insight-head h3 {
  font-size: 14px;
}

.insight-head p,
.engine-title-row span,
.mini-panel-title span {
  color: var(--guv-secondary);
  font-size: 10.5px;
  font-weight: 530;
}

.primary-button {
  font-size: 12px;
  font-weight: 730;
  box-shadow: 0 6px 13px rgba(17, 110, 88, 0.16);
}

.secondary-button {
  font-size: 12px;
  font-weight: 690;
}
