:root {
  --bg: #e8edf2;
  --surface: #ffffff;
  --surface-soft: #e9eef3;
  --ink: #0b1f3b;
  --muted: #566579;
  --line: #c4ccd6;
  --green: #2f8a61;
  --green-soft: #effaf4;
  --gray: #6e7379;
  --gray-soft: #f1f2f3;
  --red: #c8463a;
  --red-soft: #fff2f0;
  --black: #111315;
  --black-soft: #e8e8e4;
  --blue: #0b1f3b;
  --amber: #9a7308;
  --gold: #d4af37;
  --shadow: 0 20px 60px rgba(11, 31, 59, 0.1);
  --radius: 8px;
  --max: 1240px;
  color-scheme: light;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}

* {
  box-sizing: border-box;
}

html,
body {
  min-height: 100%;
}

body {
  margin: 0;
  color: var(--ink);
  background: var(--bg);
  transition: background-color 500ms ease, color 500ms ease;
  letter-spacing: 0;
}

button,
input {
  font: inherit;
}

button {
  cursor: pointer;
  touch-action: manipulation;
}

.stage-white {
  --posture: #d9d9d3;
  --posture-soft: #fbfbfa;
}

.stage-green {
  --posture: var(--green);
  --posture-soft: var(--green-soft);
  background: #f7fbf8;
}

.stage-gray {
  --posture: var(--gray);
  --posture-soft: var(--gray-soft);
  background: #f6f6f5;
}

.stage-red {
  --posture: var(--red);
  --posture-soft: var(--red-soft);
  background: #fff8f7;
}

.stage-black {
  --posture: var(--black);
  --posture-soft: var(--black-soft);
  background: #ededeb;
}

.app {
  min-height: 100vh;
}

.demo-shell-bar {
  position: sticky;
  top: 0;
  z-index: 40;
  min-height: 58px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 10px 24px;
  border-bottom: 1px solid rgba(217, 214, 205, 0.8);
  background: rgba(248, 247, 244, 0.94);
  backdrop-filter: blur(18px);
}

.demo-wordmark {
  color: var(--ink);
  font-weight: 800;
  font-size: 20px;
  letter-spacing: 0.16em;
  text-decoration: none;
}

.demo-wordmark span { color: var(--gold); }
.demo-wordmark small { font-size: 12px; letter-spacing: 0.04em; }

.demo-shell-actions,
.entry-actions,
.guided-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}

.synthetic-label { color: var(--muted); font-size: 12px; }

.shell-button,
.shell-link,
.shell-link-button,
.text-link { color: var(--ink); font-size: 13px; font-weight: 700; }

.shell-button {
  min-height: 36px;
  padding: 0 14px;
  border: 1px solid var(--gold);
  border-radius: 999px;
  background: var(--gold);
}

.shell-link,
.shell-link-button,
.text-link { text-decoration: none; }
.shell-link-button { min-height: 36px; padding: 0 4px; border: 0; background: transparent; }
.shell-link:hover,
.shell-link-button:hover,
.text-link:hover { text-decoration: underline; text-underline-offset: 4px; }

.demo-notice {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 80;
  max-width: min(360px, calc(100vw - 36px));
  padding: 12px 16px;
  border: 1px solid #9c7907;
  border-radius: 6px;
  background: var(--ink);
  color: #fff;
  box-shadow: 0 14px 40px rgba(11,31,59,.24);
  font-size: 14px;
  line-height: 1.4;
}

.screen {
  min-height: 100vh;
}

.hidden {
  display: none !important;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.skip-link {
  position: fixed;
  top: 8px;
  left: 8px;
  z-index: 100;
  padding: 10px 14px;
  border-radius: 4px;
  background: var(--ink);
  color: white;
  transform: translateY(-140%);
  transition: transform 160ms ease;
}

.skip-link:focus { transform: translateY(0); }

.role-screen {
  max-width: var(--max);
  margin: 0 auto;
  padding: 40px 24px 60px;
}

.role-hero {
  min-height: 34vh;
  display: grid;
  gap: 48px;
  align-content: end;
  padding: 24px 0 48px;
}

.brand-lockup {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.brand-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 42px;
  min-width: 86px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
  color: var(--ink);
  font-weight: 700;
  letter-spacing: 0;
}

.brand-mark.small {
  height: 32px;
  min-width: 68px;
  font-size: 13px;
}

.brand-subtitle,
.header-persona,
.profile-title,
.ask-intro p,
.hero-copy p,
.tile-meta,
.muted {
  color: var(--muted);
}

.hero-copy {
  max-width: 780px;
}

.eyebrow {
  margin: 0 0 10px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

h1,
h2,
h3,
p {
  margin-top: 0;
}

h1 {
  max-width: 860px;
  margin-bottom: 18px;
  font-size: clamp(34px, 4vw, 46px);
  line-height: 1.06;
  font-weight: 700;
  letter-spacing: 0;
}

h2 {
  margin-bottom: 14px;
  font-size: 28px;
  line-height: 1.12;
  font-weight: 700;
  letter-spacing: 0;
}

h3 {
  margin-bottom: 8px;
  font-size: 22px;
  line-height: 1.16;
}

.hero-copy p {
  max-width: 700px;
  font-size: 19px;
  line-height: 1.55;
}

.role-main {
  display: grid;
  gap: 22px;
}

.link-reset {
  padding: 0;
  border: 0;
  background: transparent;
}

.role-library {
  scroll-margin-top: 84px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
  overflow: hidden;
}

.role-library > summary,
.ask-panel > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 20px 22px;
  cursor: pointer;
  list-style: none;
}

.role-library > summary::-webkit-details-marker,
.ask-panel > summary::-webkit-details-marker { display: none; }

.role-library > summary span,
.ask-panel > summary span { display: grid; gap: 5px; }
.role-library > summary strong,
.ask-panel > summary strong { font-size: 16px; }
.role-library > summary small,
.ask-panel > summary small { color: var(--muted); font-size: 14px; line-height: 1.45; }
.role-library > summary i,
.ask-panel > summary i { font-size: 24px; font-style: normal; font-weight: 300; transition: transform 180ms ease; }
.role-library[open] > summary i,
.ask-panel[open] > summary i { transform: rotate(45deg); }

.role-library-content {
  display: grid;
  gap: 24px;
  padding: 8px 22px 24px;
  border-top: 1px solid var(--line);
}

.role-note { margin: 0; color: var(--muted); font-size: 13px; }

.view-filter {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  padding: 6px;
  width: fit-content;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
}

.filter-pill,
.ghost-button,
.text-button,
.link-button,
.icon-button,
.primary-button,
.ask-form button,
.action-button {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
  color: var(--ink);
}

.filter-pill {
  min-height: 34px;
  padding: 0 14px;
  color: var(--muted);
}

.filter-pill.active {
  color: var(--ink);
  border-color: #cfcfc8;
  background: var(--surface-soft);
}

.persona-groups {
  display: grid;
  gap: 28px;
}

.persona-group {
  display: grid;
  gap: 12px;
}

.persona-group h2 {
  margin: 0;
  font-size: 18px;
}

.persona-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.persona-tile {
  min-height: 138px;
  display: grid;
  align-content: space-between;
  gap: 18px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
  text-align: left;
  box-shadow: none;
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.persona-tile:hover,
.persona-tile:focus-visible {
  transform: translateY(-2px);
  border-color: #bdbdb5;
  box-shadow: var(--shadow);
  outline: none;
}

.tile-initials {
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: var(--surface-soft);
  font-weight: 700;
}

.tile-title {
  margin: 0 0 6px;
  font-weight: 700;
  line-height: 1.22;
}

.tile-meta {
  margin: 0;
  font-size: 13px;
  line-height: 1.4;
}

.view-chip,
.tag,
.auth-badge,
.status-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 26px;
  padding: 4px 9px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--surface-soft);
  color: var(--muted);
  font-size: 12px;
  font-weight: 650;
  white-space: nowrap;
}

.profile-screen {
  display: grid;
  place-items: center;
  padding: 24px;
}

.profile-card {
  width: min(820px, 100%);
  padding: 34px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--shadow);
}

.text-button {
  min-height: 34px;
  padding: 0 12px;
  margin-bottom: 28px;
  background: transparent;
}

.profile-header {
  margin-bottom: 24px;
}

.profile-header h2 {
  margin-bottom: 8px;
}

.profile-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-bottom: 22px;
}

.profile-summary-grid { grid-template-columns: repeat(2, 1fr); }

.access-details {
  margin-bottom: 22px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-soft);
}

.access-details > summary {
  padding: 14px;
  cursor: pointer;
  font-weight: 700;
}

.access-details .profile-grid,
.access-details .profile-list-wrap { margin: 0; padding: 0 14px 14px; }
.access-status-grid { grid-template-columns: repeat(2, 1fr); }
.access-details .profile-grid div { background: var(--surface); }

.profile-grid div,
.identity-stat {
  min-height: 88px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-soft);
}

.profile-grid span,
.identity-stat span,
.section-label {
  display: block;
  margin-bottom: 8px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.profile-grid strong,
.identity-stat strong {
  font-size: 15px;
  line-height: 1.3;
}

.profile-list-wrap {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  margin-bottom: 28px;
}

.tag-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.primary-button {
  width: 100%;
  min-height: 48px;
  border-color: var(--gold);
  background: var(--gold);
  color: var(--ink);
  font-weight: 700;
}

.secondary-button {
  min-height: 48px;
  padding: 0 18px;
  border: 1px solid var(--ink);
  border-radius: var(--radius);
  background: transparent;
  color: var(--ink);
  font-weight: 700;
}

.secondary-button.compact,
.primary-button.compact { width: auto; }

.main-screen {
  display: flex;
  flex-direction: column;
}

.app-header {
  position: sticky;
  top: 58px;
  z-index: 30;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 18px;
  padding: 18px 24px;
  border-bottom: 1px solid rgba(222, 222, 216, 0.82);
  backdrop-filter: blur(22px);
  background: rgba(248, 247, 244, 0.9);
}

.header-left,
.header-right,
.brand-row {
  display: flex;
  align-items: center;
  gap: 12px;
}

.header-left {
  min-width: 0;
}

.brand-row {
  font-weight: 700;
}

.header-persona {
  margin: 2px 0 0;
  font-size: 13px;
}

.ghost-button {
  min-height: 38px;
  padding: 0 13px;
  background: var(--surface);
}

.posture-badge,
.pace-badge,
.incident-severity-badge,
.demo-data-badge {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 0 13px;
  border: 1px solid color-mix(in srgb, var(--posture) 42%, var(--line));
  border-radius: var(--radius);
  background: var(--posture-soft);
  color: var(--ink);
  font-weight: 700;
  white-space: nowrap;
}

.mobile-header-ask { display: none; }

.operating-mode-control {
  display: inline-grid;
  grid-template-columns: 1fr 1fr;
  padding: 3px;
  border: 1px solid #9baabd;
  border-radius: 7px;
  background: #fff;
}

.operating-mode-control button {
  min-height: 38px;
  padding: 0 13px;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}

.operating-mode-control button.active { background: var(--ink); color: #fff; }
.operating-mode-control button:focus-visible { outline: 3px solid rgba(212, 175, 55, .45); outline-offset: 2px; }

.attention-indicator,
.header-ask-prxm {
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 0 14px;
  border-radius: 6px;
  font-size: 12px;
}

.attention-indicator { border: 1px solid #d7bd6a; background: #fff9e6; color: var(--ink); }
.attention-indicator span { min-width: 25px; min-height: 25px; display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; background: var(--gold); font-weight: 850; }
.header-ask-prxm { border: 1px solid #9c7907; background: var(--gold); color: var(--ink); }
.header-ask-prxm > span { font-weight: 850; text-transform: uppercase; letter-spacing: .04em; }
.header-ask-prxm > strong { font-weight: 650; }
.header-ask-prxm > i { font-size: 18px; font-style: normal; }

button.posture-badge,
button.incident-severity-badge { min-height: 44px; text-align: left; }
button.posture-badge:hover,
button.posture-badge:focus-visible,
button.incident-severity-badge:hover,
button.incident-severity-badge:focus-visible { outline: 2px solid rgba(212, 175, 55, .38); outline-offset: 2px; }
.posture-badge.status-green { --posture: var(--green); --posture-soft: var(--green-soft); }
.posture-badge.status-yellow { --posture: var(--gold); --posture-soft: #fff8df; }
.posture-badge.status-red { --posture: var(--red); --posture-soft: var(--red-soft); }

.pace-badge {
  color: var(--black);
  background: var(--black-soft);
  border-color: #c9c9c2;
}

.demo-data-badge {
  color: var(--muted);
  background: var(--surface);
  border-color: var(--line);
  font-size: 13px;
}

.incident-severity-badge,
.severity-pill {
  color: var(--red);
  background: var(--red-soft);
  border-color: color-mix(in srgb, var(--red) 40%, var(--line));
}

.posture-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--posture);
  box-shadow: 0 0 0 0 color-mix(in srgb, var(--posture) 24%, transparent);
  animation: posturePulse 2.4s infinite;
}

@keyframes posturePulse {
  0% {
    box-shadow: 0 0 0 0 color-mix(in srgb, var(--posture) 26%, transparent);
  }
  70% {
    box-shadow: 0 0 0 12px color-mix(in srgb, var(--posture) 0%, transparent);
  }
  100% {
    box-shadow: 0 0 0 0 color-mix(in srgb, var(--posture) 0%, transparent);
  }
}

.workspace {
  width: min(var(--max), calc(100% - 48px));
  margin: 0 auto;
  padding: 24px 0 64px;
  min-width: 0;
}

.ask-panel {
  margin: 0 0 16px;
  max-width: 100%;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
  overflow: hidden;
}

.incident-active .ask-panel {
  max-width: 100%;
  padding: 0;
}

.ask-panel > summary { padding: 14px 18px; }
.ask-content { display: grid; gap: 14px; padding: 0 18px 18px; border-top: 1px solid var(--line); }
.ask-form { margin-top: 16px; }

.ask-intro {
  text-align: center;
}

.incident-active .ask-intro {
  display: none;
}

.ask-form {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--shadow);
}

.ask-form input {
  min-height: 50px;
  border: 0;
  outline: none;
  padding: 0 14px;
  color: var(--ink);
  background: transparent;
}

.ask-form button {
  min-width: 96px;
  min-height: 50px;
  border-color: var(--ink);
  background: var(--ink);
  color: var(--surface);
  font-weight: 700;
}

.starter-prompts {
  display: flex;
  justify-content: center;
  gap: 8px;
  flex-wrap: wrap;
}

.prompt-chip {
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
  color: var(--muted);
}

.answer-panel,
.view-panel,
.rail-section,
.district-context,
.drawer-panel,
.decision-card,
.impact-card,
.context-lens-card,
.timeline-item,
.map-panel,
.messaging-panel {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
}

.answer-panel {
  display: grid;
  gap: 14px;
  padding: 18px;
  box-shadow: var(--shadow);
}

.answer-main {
  display: grid;
  gap: 10px;
}

.answer-main h3 {
  margin: 0;
}

.answer-main p {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

.trust-strip {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.trust-strip.compact {
  display: grid;
  gap: 8px;
}

.trust-item {
  display: inline-flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 18px;
  min-height: 32px;
  padding: 7px 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-soft);
  color: var(--muted);
  font-size: 13px;
}

.trust-item strong {
  color: var(--ink);
}

.quick-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.action-button {
  min-height: 36px;
  padding: 0 12px;
}

.incident-workspace {
  display: grid;
  gap: 16px;
  animation: unfold 320ms ease both;
}

.crisis-stack {
  display: grid;
  gap: 14px;
  padding: 20px;
  border: 1px solid color-mix(in srgb, var(--posture) 28%, var(--line));
  border-radius: var(--radius);
  background: color-mix(in srgb, var(--posture-soft) 54%, var(--surface));
}

.crisis-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.crisis-head h2 {
  margin: 0;
  font-size: 30px;
  line-height: 1.1;
}

.focus-brief-head {
  align-items: center;
}

.focus-brief-head > div:first-child {
  max-width: 820px;
}

.brief-summary {
  max-width: 760px;
  margin: 10px 0 0;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.52;
}

.scope-badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.severity-pill {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 4px 9px;
  border: 1px solid;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

.posture-scope-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.scope-card,
.posture-note {
  display: grid;
  gap: 8px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(255, 255, 255, 0.74);
}

.scope-card.severity {
  border-color: color-mix(in srgb, var(--red) 34%, var(--line));
  background: color-mix(in srgb, var(--red-soft) 58%, var(--surface));
}

.scope-card span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.scope-card strong,
.posture-note strong {
  line-height: 1.25;
}

.scope-card p,
.posture-note p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.crisis-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.signal-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.signal-grid article {
  min-height: 92px;
  display: grid;
  gap: 7px;
  align-content: start;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(255, 255, 255, 0.78);
}

.signal-grid span,
.priority-pill span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.signal-grid strong,
.priority-pill strong {
  line-height: 1.22;
}

.signal-grid strong { font-size: 17px; }

.signal-grid p,
.priority-pill p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.42;
}

.crisis-card {
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(255, 255, 255, 0.72);
}

.crisis-card span {
  display: block;
  margin-bottom: 8px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.crisis-card strong {
  display: block;
  margin-bottom: 8px;
  line-height: 1.25;
}

.crisis-card p,
.what-changed span {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.what-changed {
  display: flex;
  gap: 10px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
}

.brief-actions,
.drilldown-row {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.district-context {
  display: grid;
  gap: 12px;
  padding: 14px;
  background: var(--surface);
}

.context-head {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: flex-start;
}

.context-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.context-head h3 {
  margin: 0;
  font-size: 20px;
}

.context-stat-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.context-stat {
  min-height: 76px;
  display: grid;
  gap: 7px;
  align-content: start;
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-soft);
}

.context-stat span,
.context-lens-body span,
.context-mini-row span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.context-stat strong {
  line-height: 1.22;
  font-size: 14px;
}

.context-stat p,
.context-current span,
.context-drawer-intro p,
.context-lens-body p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.context-lens-row,
.context-source-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.context-chip {
  min-height: 32px;
  padding: 0 11px;
  border: 1px solid color-mix(in srgb, var(--posture) 24%, var(--line));
  border-radius: var(--radius);
  background: var(--posture-soft);
  color: var(--ink);
  font-size: 13px;
  font-weight: 700;
}

.context-current {
  display: flex;
  gap: 10px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fbfbf8;
}

.mission-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.mission-chip {
  display: grid;
  gap: 6px;
  min-height: 110px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
}

.mission-chip span,
.doctrine-badge small,
.term-card span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 750;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.mission-chip strong,
.doctrine-badge strong,
.term-card strong {
  line-height: 1.22;
}

.mission-chip p,
.term-card p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.42;
}

@keyframes unfold {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.level-tabs {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  width: min(520px, 100%);
  padding: 5px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
}

.level-tab {
  min-height: 42px;
  border: 1px solid transparent;
  border-radius: var(--radius);
  background: transparent;
  color: var(--muted);
  font-weight: 700;
}

.level-tab.active {
  color: var(--ink);
  border-color: color-mix(in srgb, var(--posture) 36%, var(--line));
  background: var(--posture-soft);
}

.workspace-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 16px;
  align-items: start;
  min-width: 0;
}

.view-panel {
  min-height: 0;
  padding: 22px;
  min-width: 0;
}

.view-panel h2 {
  font-size: 30px;
  line-height: 1.08;
}

.view-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 18px;
}

.view-head p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

.view-title-wrap {
  max-width: 720px;
}

.section-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.decision-layout {
  display: grid;
  grid-template-columns: minmax(260px, 0.82fr) minmax(0, 1.18fr);
  gap: 14px;
  align-items: start;
  margin-top: 14px;
}

.priority-pills {
  display: grid;
  gap: 10px;
}

.priority-pill {
  min-height: 98px;
  display: grid;
  gap: 7px;
  align-content: start;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-soft);
}

.section-grid.three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.priority-list,
.agency-list,
.source-list,
.impact-chain,
.message-list {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.priority-item,
.agency-item,
.source-item,
.chain-step,
.message-item {
  display: grid;
  gap: 6px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-soft);
}

.priority-item strong,
.agency-item strong,
.source-item strong,
.chain-step strong,
.message-item strong {
  font-size: 14px;
}

.priority-item p,
.agency-item p,
.source-item p,
.chain-step p,
.message-item p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.side-rail {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.explore-grid { display: grid; gap: 8px; }

.explore-grid button {
  min-height: 42px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-soft);
  color: var(--ink);
  text-align: left;
  font-weight: 650;
}

.explore-grid button:hover,
.explore-grid button:focus-visible { border-color: var(--gold); background: #fffaf0; outline: none; }

.rail-section {
  padding: 14px;
  min-width: 0;
}

.rail-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
  font-weight: 700;
}

.link-button {
  min-height: 30px;
  padding: 0 9px;
  color: var(--blue);
  background: var(--surface);
}

.mini-card-list {
  display: grid;
  gap: 10px;
}

.mini-card {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-soft);
  text-align: left;
}

.mini-card strong {
  font-size: 13px;
  line-height: 1.3;
}

.mini-card p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.pace-panel {
  display: grid;
  gap: 8px;
}

.pace-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  color: var(--muted);
  font-size: 13px;
}

.pace-row strong {
  color: var(--ink);
}

.context-mini {
  display: grid;
  gap: 8px;
}

.doctrine-mini {
  display: grid;
  gap: 8px;
}

.context-mini-row {
  display: grid;
  gap: 4px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-soft);
}

.context-mini-row strong {
  font-size: 13px;
  line-height: 1.25;
}

.decision-card {
  display: grid;
  gap: 16px;
  padding: 18px;
  margin-bottom: 14px;
  min-width: 0;
}

.featured-card {
  margin-bottom: 0;
  border-color: color-mix(in srgb, var(--posture) 30%, var(--line));
  box-shadow: 0 16px 40px rgba(23, 23, 23, 0.06);
}

.recommendation-label {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.featured-card .featured-recommendation {
  color: var(--ink);
  font-size: 19px;
  line-height: 1.45;
}

.featured-card h4 {
  font-size: 22px;
}

.featured-card p {
  font-size: 14px;
}

.primary-action {
  border-color: var(--ink);
  background: var(--ink);
  color: var(--surface);
  font-weight: 800;
}

.decision-card header {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: flex-start;
}

.decision-card-detail { padding: 0; }
.decision-card-detail > summary {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: flex-start;
  padding: 16px;
  cursor: pointer;
  list-style: none;
}

.decision-card-detail > summary::-webkit-details-marker { display: none; }
.decision-card-detail[open] > summary { border-bottom: 1px solid var(--line); }
.decision-card-body { display: grid; gap: 16px; padding: 16px; }

.technical-detail {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-soft);
}

.technical-detail > summary {
  padding: 12px;
  cursor: pointer;
  color: var(--ink);
  font-size: 13px;
  font-weight: 700;
}

.technical-detail .doctrine-row { padding: 0 12px 12px; }

.decision-card h4 {
  margin: 0 0 8px;
  font-size: 18px;
}

.decision-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.48;
}

.doctrine-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.doctrine-badge {
  display: grid;
  gap: 4px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-soft);
}

.doctrine-badge strong {
  font-size: 12px;
}

.card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.card-meta-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}

.redacted {
  padding: 12px;
  border: 1px dashed #bebeb8;
  border-radius: var(--radius);
  background: #f8f8f6;
  color: var(--muted);
  font-size: 13px;
}

.impact-layout {
  display: grid;
  gap: 14px;
}

.impact-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.impact-card {
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: #fff;
  color: var(--ink);
  text-align: left;
}
.impact-card:hover, .impact-card:focus-visible { border-color: var(--gold); background: #fffcf2; outline: 2px solid rgba(212,175,55,.2); }

.impact-card h4 {
  margin: 0 0 8px;
}

.impact-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}
.impact-card small { display: block; margin-top: 12px; color: var(--amber); font-weight: 800; }

.timeline-map-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

.map-panel {
  position: relative;
  min-height: 320px;
  overflow: hidden;
  background:
    linear-gradient(#e9e9e4 1px, transparent 1px),
    linear-gradient(90deg, #e9e9e4 1px, transparent 1px),
    #f8f8f5;
  background-size: 44px 44px;
}

.map-zone {
  position: absolute;
  border: 1px solid rgba(45, 95, 135, 0.32);
  border-radius: var(--radius);
  background: rgba(45, 95, 135, 0.06);
}

.map-point {
  position: absolute;
  display: grid;
  gap: 3px;
  transform: translate(-50%, -50%);
  font-size: 11px;
  font-weight: 700;
  color: var(--ink);
}

.map-point::before {
  content: "";
  width: 12px;
  height: 12px;
  justify-self: center;
  border: 2px solid var(--surface);
  border-radius: 50%;
  background: var(--posture);
  box-shadow: 0 0 0 1px rgba(23, 23, 23, 0.2);
}

.messaging-panel {
  display: grid;
  gap: 12px;
  padding: 16px;
}

.drawer {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: grid;
  grid-template-columns: 1fr minmax(360px, 560px);
}

.drawer-backdrop {
  background: rgba(23, 23, 23, 0.2);
}

.drawer-panel {
  height: 100%;
  padding: 22px;
  overflow: auto;
  border-radius: 0;
  border-top: 0;
  border-right: 0;
  border-bottom: 0;
  box-shadow: -18px 0 48px rgba(23, 23, 23, 0.1);
}

.drawer-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  padding-bottom: 18px;
  margin-bottom: 18px;
  border-bottom: 1px solid var(--line);
}

.icon-button {
  width: 38px;
  height: 38px;
  font-weight: 700;
}

.drawer-body {
  display: grid;
  gap: 16px;
}

.context-drawer-intro {
  display: grid;
  gap: 8px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-soft);
}

.muted-box {
  background: #fbfbf8;
}

.context-drawer-grid {
  display: grid;
  gap: 12px;
}

.doctrine-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.term-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.term-card {
  display: grid;
  gap: 5px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
}

.context-lens-card {
  display: grid;
  gap: 14px;
  padding: 16px;
}

.context-lens-card header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}

.context-lens-card h4 {
  margin: 0;
  font-size: 18px;
}

.context-lens-body {
  display: grid;
  gap: 10px;
}

.context-lens-body div {
  display: grid;
  gap: 5px;
}

.ownership-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.ownership-grid span {
  display: grid;
  gap: 6px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-soft);
}

.ownership-grid small,
.role-comparison small { color: var(--muted); line-height: 1.45; }

.conflict-chip {
  display: inline-flex;
  margin-left: 8px;
  padding: 5px 9px;
  border: 1px solid #d4a64b;
  border-radius: 999px;
  color: #74520e;
  background: #fff7e6;
  font-size: 12px;
  font-weight: 700;
}

.comparison-intro {
  padding: 14px 16px;
  border-left: 3px solid var(--gold);
  background: var(--surface-soft);
}

.comparison-intro p { margin: 0; }
.role-comparison { display: grid; gap: 12px; }

.role-comparison article {
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
}

.role-comparison article > div { display: flex; justify-content: space-between; gap: 12px; }
.role-comparison article > div span { font-weight: 750; }
.role-comparison article > div strong { color: var(--red); }
.role-comparison article:last-child > div strong { color: var(--muted); }
.role-comparison article p { margin: 10px 0 5px; }

.guided-panel {
  position: fixed;
  left: 24px;
  bottom: 100px;
  z-index: 60;
  width: min(560px, calc(100vw - 48px));
  padding: 20px;
  border: 1px solid rgba(212, 175, 55, 0.55);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.97);
  box-shadow: 0 22px 70px rgba(11, 31, 59, 0.22);
  backdrop-filter: blur(16px);
}

.guided-progress { display: grid; gap: 8px; color: var(--muted); font-size: 12px; }
.guided-progress::after { content: ""; height: 3px; grid-row: 2; grid-column: 1; border-radius: 999px; background: var(--surface-soft); }
.guided-progress i { z-index: 1; height: 3px; grid-row: 2; grid-column: 1; border-radius: 999px; background: var(--gold); transition: width 260ms ease; }
.guided-copy { padding: 18px 0; }
.guided-copy h3 { margin-bottom: 8px; font-size: 24px; line-height: 1.15; }
.guided-copy p { margin: 0; color: var(--muted); line-height: 1.55; }
.guided-actions { justify-content: flex-end; }
.guided-actions .text-button { margin: 0 auto 0 0; }
.guided-actions .primary-button { width: auto; min-width: 90px; min-height: 38px; }
.guided-actions .action-button { min-height: 38px; }
.guided-actions button:disabled { opacity: 0.4; cursor: default; }

/* Reorganized command workspace */
.command-workspace {
  width: min(1480px, 100%);
  margin: 0 auto;
  padding: 18px 24px 28px;
}

.command-workspace .incident-workspace { gap: 0; }

.workspace-tabs {
  position: sticky;
  top: var(--workspace-tabs-top, 177px);
  z-index: 20;
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  border: 1px solid var(--line);
  border-color: #193452;
  border-radius: 7px 7px 0 0;
  background: var(--ink);
  overflow: hidden;
}

.steady-state-hero { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 28px; align-items: center; padding: 28px; border: 1px solid #193452; border-left: 5px solid var(--gold); background: var(--ink); color: #fff; }
.steady-state-hero h2 { margin: 0 0 8px; font-size: 28px; }
.steady-state-hero p { max-width: 720px; margin: 0; color: #c8d3df; line-height: 1.55; }
.steady-state-hero .eyebrow { color: #e5c75e; }
.readiness-score { min-width: 190px; display: grid; gap: 4px; padding: 18px; border: 1px solid rgba(255,255,255,.22); background: rgba(255,255,255,.06); }
.readiness-score span, .readiness-score small { color: #c8d3df; }
.readiness-score strong { color: #f0cc4c; font-size: 25px; }
.preparedness-panel { margin-top: 14px; }
.preparedness-phases { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
.preparedness-phases button { min-height: 48px; padding: 8px; border: 1px solid var(--line); border-radius: 5px; background: #fff; color: var(--ink); font-size: 12px; font-weight: 750; }
.preparedness-phases button.active { border-color: var(--gold); background: var(--ink); color: #fff; box-shadow: inset 0 -3px var(--gold); }
.cross-cutting-functions { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-top: 12px; }
.cross-cutting-functions span { padding: 12px; border: 1px solid #d7bd6a; border-radius: 5px; background: #fff9e6; color: var(--ink); font-size: 12px; font-weight: 700; text-align: center; }
.steady-action-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 14px 0; }
.steady-action-grid button { min-height: 180px; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 20px; border: 1px solid var(--line); border-radius: 6px; background: #fff; color: var(--ink); text-align: left; }
.steady-action-grid button:hover, .steady-action-grid button:focus-visible { border-color: var(--gold); box-shadow: 0 8px 24px rgba(11,31,59,.1); outline: none; transform: translateY(-2px); }
.steady-action-grid button > span { color: var(--gold); font-size: 12px; font-weight: 850; }
.steady-action-grid button > strong { font-size: 20px; }
.steady-action-grid button > p { margin: 0; color: var(--muted); line-height: 1.45; }
.steady-action-grid button > small { margin-top: auto; font-weight: 800; }
.readiness-rail-status { display: grid; grid-template-columns: auto 1fr; gap: 4px 8px; align-items: center; padding: 10px; background: #fff9e6; }
.readiness-rail-status span { grid-column: 2; color: var(--muted); font-size: 12px; }
.compact-list { margin: 8px 0 0; padding-left: 18px; font-size: 12px; }
.cir-detail-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }

.workspace-tab {
  min-height: 58px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 0 16px;
  border: 0;
  border-right: 1px solid rgba(255,255,255,.15);
  border-bottom: 4px solid transparent;
  background: var(--ink);
  color: #d8e1eb;
  font-weight: 750;
}

.workspace-tab:last-child { border-right: 0; }
.workspace-tab span { color: #8fa2b8; font-size: 12px; }
.workspace-tab:hover,
.workspace-tab:focus-visible { background: #132b49; color: #fff; outline: none; }
.workspace-tab.active { color: var(--ink); border-bottom-color: var(--gold); background: #fff; }
.workspace-tab.active span { color: var(--gold); }

.ask-prxm-command {
  width: 100%;
  min-height: 62px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 18px;
  padding: 12px 20px;
  border: 1px solid #193452;
  border-top: 0;
  background: #fff;
  color: var(--ink);
  text-align: left;
}

.ask-prxm-command > span {
  padding: 7px 10px;
  border-radius: 4px;
  background: var(--gold);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.ask-prxm-command > strong { font-size: 15px; font-weight: 650; }
.ask-prxm-command > i { color: var(--gold); font-size: 22px; font-style: normal; }
.ask-prxm-command:hover,
.ask-prxm-command:focus-visible { background: #fff9e6; outline: 3px solid rgba(212, 175, 55, .28); outline-offset: -3px; }

.mobile-subview,
.mobile-primary-nav,
.mobile-ask-prxm { display: none; }
.mobile-subview-label { display: none; }

/* Every card that invites exploration is a real control. */
.interactive-story-arc button {
  min-height: 164px;
  padding: 16px;
  border: 0;
  background: #edf2f6;
  color: var(--ink);
  text-align: left;
}
.interactive-story-arc button.active { background: var(--ink); color: #fff; }
.interactive-story-arc button.active span { color: #e5c861; }
.interactive-story-arc button.active p { color: #cbd2dd; }
.interactive-story-arc button small,
.interactive-card-grid button small,
.interactive-card-grid button i { display: block; margin-top: 12px; color: var(--amber); font-size: 11px; font-style: normal; font-weight: 800; }
.interactive-story-arc button:hover,
.interactive-story-arc button:focus-visible,
.interactive-card-grid button:hover,
.interactive-card-grid button:focus-visible { position: relative; z-index: 1; outline: 3px solid var(--gold); outline-offset: -3px; background: #fffaf0; }
.interactive-story-arc button.active:hover,
.interactive-story-arc button.active:focus-visible { background: #132b49; }

.interactive-card-grid > button {
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: #edf2f6;
  color: var(--ink);
  text-align: left;
}
.outlook-grid.interactive-card-grid > button > span,
.c6-grid.interactive-card-grid > button > span { color: var(--gold); font-size: 12px; font-weight: 800; }
.resource-overview.interactive-card-grid > button { padding: 22px; background: #fff; }
.resource-overview.interactive-card-grid p:last-of-type { color: var(--muted); }
.c6-grid.interactive-card-grid > button { display: grid; grid-template-columns: 34px 1fr; gap: 12px; }

.interactive-timeline li { display: block; padding-bottom: 10px; }
.interactive-timeline li::after { display: none; }
.interactive-timeline li > button { width: 100%; display: grid; grid-template-columns: 64px 28px 1fr; gap: 14px; padding: 12px; border: 1px solid transparent; border-radius: 5px; background: transparent; color: var(--ink); text-align: left; }
.interactive-timeline li > button:hover,
.interactive-timeline li > button:focus-visible { border-color: var(--gold); background: #fffcf2; outline: none; }
.interactive-timeline button > span { padding-top: 5px; color: var(--muted); font-size: 13px; font-weight: 750; }
.interactive-timeline button > i { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: var(--ink); color: #fff; font-size: 12px; font-style: normal; }
.interactive-timeline button small { display: block; margin-top: 8px; color: var(--amber); font-weight: 800; }

.tool-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.tool-grid > button { min-height: 190px; padding: 20px; border: 1px solid var(--line); border-top: 3px solid var(--gold); border-radius: 5px; background: #f4f7fa; color: var(--ink); text-align: left; }
.tool-grid > button:hover, .tool-grid > button:focus-visible { border-color: var(--gold); background: #fffaf0; outline: 2px solid rgba(212,175,55,.2); }
.tool-grid span { color: var(--amber); font-size: 10px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.tool-grid h3 { margin: 12px 0 8px; }
.tool-grid p { margin: 0; color: var(--muted); line-height: 1.5; }
.tool-grid small { display: block; margin-top: 18px; color: var(--amber); font-weight: 800; }
.tool-assurance { margin-top: 16px; padding: 16px 18px; border-left: 4px solid var(--ink); background: #edf2f6; }
.tool-assurance p { margin: 5px 0 0; color: var(--muted); }
.tool-builder, .generated-product { display: grid; gap: 16px; }
.tool-builder-summary, .generated-product-head { padding: 18px; border-left: 4px solid var(--gold); background: var(--ink); color: #fff; }
.tool-builder-summary span, .generated-product-head span { color: #e1c55c; font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.tool-builder-summary h4, .generated-product-head h4 { margin: 8px 0; color: #fff; font-size: 23px; }
.tool-builder-summary p, .generated-product-head p { margin: 0; color: #c9d3df; }
.tool-builder dl { display: grid; gap: 1px; margin: 0; background: var(--line); border: 1px solid var(--line); }
.tool-builder dl div { display: grid; grid-template-columns: 150px 1fr; gap: 14px; padding: 13px 15px; background: #fff; }
.tool-builder dt { color: var(--muted); font-size: 12px; font-weight: 750; }
.tool-builder dd { margin: 0; }
.tool-options { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.tool-options label { display: grid; gap: 6px; color: var(--muted); font-size: 12px; font-weight: 750; }
.tool-options select { min-height: 46px; padding: 0 12px; border: 1px solid var(--line); border-radius: 4px; background: #fff; color: var(--ink); font: inherit; }
.generated-product section { padding: 16px; border: 1px solid var(--line); background: #fff; }
.generated-product h5 { margin: 0 0 8px; font-size: 16px; }
.generated-product section p, .generated-product section ul { margin: 0; color: var(--muted); line-height: 1.55; }

.dashboard-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 24px;
  align-items: center;
  padding: 22px 24px;
  border: 1px solid #193452;
  border-left: 4px solid var(--gold);
  border-radius: 6px;
  background: var(--ink);
  color: white;
}

.dashboard-summary h2 { max-width: 760px; margin: 5px 0 8px; color: white; font-size: 23px; line-height: 1.22; }
.dashboard-summary p:last-child { max-width: 780px; margin: 0; color: #c9d3df; line-height: 1.5; }
.dashboard-summary .eyebrow { color: #e1c55c; }
.dashboard-status { display: grid; grid-template-columns: repeat(3, minmax(92px, 1fr)); border: 1px solid rgba(255,255,255,.16); }
.dashboard-status button { display: grid; gap: 5px; padding: 12px 14px; border: 0; border-left: 1px solid rgba(255,255,255,.16); background: transparent; text-align: left; }
.dashboard-status button:first-child { border-left: 0; }
.dashboard-status button:hover, .dashboard-status button:focus-visible { background: rgba(212,175,55,.12); outline: 2px solid var(--gold); outline-offset: -2px; }
.dashboard-status small { color: #9fb0c2; font-size: 11px; }
.dashboard-status strong { color: white; font-size: 17px; }
.dashboard-status button:first-child strong { color: #ff9b8d; }
.dashboard-status i { color: #e1c55c; font-size: 9px; font-style: normal; font-weight: 800; }

.cir-panel { border-top: 3px solid var(--gold); }
.cir-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.cir-card {
  min-height: 220px;
  display: grid;
  grid-template-rows: auto auto auto auto 1fr auto;
  align-content: start;
  gap: 7px;
  padding: 18px;
  border: 1px solid #b7c3d0;
  border-top: 4px solid #6f8093;
  border-radius: 5px;
  background: #fff;
  color: var(--ink);
  text-align: left;
  box-shadow: 0 4px 10px rgba(11,31,59,.045);
}

.cir-card.warning { border-top-color: var(--gold); }
.cir-card.critical { border-top-color: var(--red); }
.cir-card:hover,
.cir-card:focus-visible { border-color: var(--gold); background: #fffbef; outline: 3px solid rgba(212,175,55,.22); outline-offset: 1px; transform: translateY(-2px); }
.cir-group { color: var(--muted); font-size: 11px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.cir-value { margin-top: 4px; color: var(--ink); font-size: 34px; font-weight: 680; line-height: 1; }
.cir-card > strong { font-size: 16px; }
.cir-status { display: inline-flex; align-items: center; gap: 7px; color: var(--muted); font-size: 12px; font-weight: 700; }
.cir-status i { width: 8px; height: 8px; border-radius: 50%; background: #6f8093; }
.cir-card.warning .cir-status i { background: var(--gold); }
.cir-card.critical .cir-status i { background: var(--red); }
.cir-card > small { color: var(--muted); font-size: 12px; line-height: 1.4; }
.cir-open { align-self: end; display: flex; justify-content: space-between; padding-top: 11px; border-top: 1px solid var(--line); color: var(--ink); font-size: 12px; font-weight: 800; }
.cir-open i { color: var(--gold); font-size: 16px; font-style: normal; }

.dashboard-lower-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 16px; }
.attention-panel { border-left: 4px solid var(--gold); }
.attention-panel .primary-button { margin-top: 18px; }
.attention-meta { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 8px; }
.attention-meta span { display: grid; gap: 4px; padding: 10px; background: var(--surface-soft); color: var(--muted); font-size: 11px; }
.attention-meta strong { color: var(--ink); font-size: 13px; }
.change-panel .secondary-button { margin-top: 4px; }

.cir-detail-summary { padding: 18px; border-left: 4px solid #6f8093; background: var(--surface-soft); }
.cir-detail-summary.warning { border-left-color: var(--gold); }
.cir-detail-summary.critical { border-left-color: var(--red); }
.cir-detail-summary > span { color: var(--muted); font-size: 11px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.cir-detail-summary > strong { display: block; margin: 10px 0 4px; font-size: 38px; }
.cir-detail-summary h4 { margin: 0; font-size: 20px; }
.cir-detail-summary p { margin: 7px 0 0; color: var(--muted); }
.cir-detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.cir-detail-grid section { padding: 15px; border: 1px solid var(--line); border-radius: 5px; background: #fff; }
.cir-detail-grid span { display: block; margin-bottom: 7px; color: var(--amber); font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.cir-detail-grid p { margin: 0; color: var(--muted); line-height: 1.5; }
.cir-detail-grid strong { display: block; margin-top: 8px; }
.permission-note { padding: 14px 16px; border-left: 3px solid var(--ink); background: #edf2f6; }
.permission-note p { margin: 5px 0 0; color: var(--muted); line-height: 1.5; }
.mobile-more-menu { display: grid; gap: 10px; }
.mobile-more-menu button { min-height: 72px; display: grid; gap: 5px; padding: 14px 16px; border: 1px solid var(--line); border-left: 4px solid var(--gold); border-radius: 5px; background: #fff; color: var(--ink); text-align: left; }
.mobile-more-menu button:hover,
.mobile-more-menu button:focus-visible { background: #fffbef; outline: 2px solid rgba(212,175,55,.28); }
.mobile-more-menu span { color: var(--muted); font-size: 13px; }

.resource-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin: 24px 0;
}
.resource-metrics > button { min-height: 154px; padding: 18px; border: 1px solid var(--line); border-radius: 5px; background: #f4f7fa; color: var(--ink); text-align: left; }
.resource-metrics > button:hover,
.resource-metrics > button:focus-visible { border-color: var(--gold); background: #fff; outline: 2px solid rgba(212,175,55,.2); }
.resource-metrics span, .resource-metrics small { display: block; color: var(--muted); }
.resource-metrics strong { display: block; margin: 5px 0; color: var(--ink); font-size: 30px; }
.resource-metrics i { display: block; margin-top: 13px; color: var(--amber); font-size: 11px; font-style: normal; font-weight: 800; }
.resource-metrics .metric-accent { border-top: 3px solid var(--gold); }
.resource-overview { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.resource-overview article { padding: 22px; border: 1px solid var(--line); border-radius: 5px; background: #fff; }
.resource-overview h3 { margin: 7px 0; }
.resource-overview p:last-child { margin-bottom: 0; color: var(--muted); }
.resource-list { display: grid; gap: 10px; margin-top: 22px; }
.resource-list article { display: grid; grid-template-columns: minmax(0, 1fr) 220px; gap: 24px; align-items: center; padding: 17px 18px; border: 1px solid var(--line); border-radius: 5px; background: #fff; }
.resource-list p { margin: 5px 0 0; color: var(--muted); }
.resource-list article > div:last-child { text-align: right; }
.resource-list small { display: block; margin-top: 6px; color: var(--muted); }
.resource-status { display: inline-block; padding: 5px 9px; border-radius: 999px; color: #1e6446; background: #edf8f2; font-size: 12px; font-weight: 800; }
.resource-status.warning { color: #76520a; background: #fff5d9; }
.resource-card-grid, .command-structure { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 22px; }
.resource-card-grid article, .command-structure article { padding: 20px; border: 1px solid var(--line); border-radius: 5px; background: #f4f7fa; }
.resource-card-grid span, .command-structure span { color: var(--amber); font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.resource-card-grid h3, .command-structure strong { display: block; margin: 7px 0; color: var(--ink); font-size: 18px; }
.resource-card-grid p, .command-structure p { margin: 0; color: var(--muted); }
.record-list button { display: grid; grid-template-columns: minmax(0, 1fr) 220px; gap: 24px; align-items: center; min-height: 88px; padding: 17px 18px; border: 1px solid var(--line); border-radius: 5px; background: #fff; color: var(--ink); text-align: left; }
.record-list button:hover, .record-list button:focus-visible,
.record-card-grid button:hover, .record-card-grid button:focus-visible,
.asset-record-row:hover, .asset-record-row:focus-visible { border-color: var(--gold); background: #fffcf2; outline: none; }
.record-list button > div:last-child { text-align: right; }
.record-list p { margin: 5px 0 0; color: var(--muted); }
.record-list small { display: block; margin-top: 6px; color: var(--muted); }
.record-open { display: block; margin-top: 7px; color: var(--amber); font-size: 11px; font-weight: 800; }
.record-card-grid button { min-height: 150px; padding: 20px; border: 1px solid var(--line); border-radius: 5px; background: #f4f7fa; color: var(--ink); text-align: left; }
.record-card-grid button > span { color: var(--amber); font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.record-card-grid button h3 { margin: 7px 0; }
.record-card-grid button p { margin: 0; color: var(--muted); }
.record-card-grid button small { display: block; margin-top: 14px; color: var(--amber); font-weight: 800; }
.asset-table { margin-top: 22px; border: 1px solid var(--line); border-radius: 5px; overflow: hidden; }
.asset-row { display: grid; grid-template-columns: minmax(170px, 1.7fr) repeat(4, minmax(76px, .65fr)); align-items: center; border-top: 1px solid var(--line); }
.asset-row:first-child { border-top: 0; }
.asset-row > * { padding: 14px 16px; text-align: center; }
.asset-row > *:first-child { text-align: left; }
.asset-head { color: var(--muted); background: var(--surface-soft); font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.available-count { color: #1e6446; font-weight: 850; }
.asset-record-row { width: 100%; border-right: 0; border-bottom: 0; border-left: 0; background: #fff; color: var(--ink); }

.drilldown-intro { display: grid; grid-template-columns: 74px 1fr; gap: 16px; align-items: center; padding: 18px; border-left: 4px solid var(--gold); background: var(--surface-soft); }
.drilldown-number { color: var(--ink); font-size: 38px; font-weight: 750; }
.drilldown-intro p { margin: 5px 0 0; color: var(--muted); line-height: 1.5; }
.drilldown-list, .report-list { display: grid; gap: 10px; }
.drilldown-list button, .report-list button { min-height: 108px; padding: 16px; border: 1px solid var(--line); border-radius: 6px; background: #fff; color: var(--ink); text-align: left; }
.drilldown-list button:hover, .drilldown-list button:focus-visible,
.report-list button:hover, .report-list button:focus-visible { border-color: var(--gold); background: #fffcf2; outline: none; }
.drilldown-list button > span, .report-list button > span { color: var(--amber); font-size: 10px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.drilldown-list strong, .report-list strong { display: block; margin: 7px 0 5px; }
.drilldown-list p, .report-list p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.45; }
.drilldown-list small, .report-list small { display: block; margin-top: 8px; color: var(--muted); }
.report-list i { display: block; margin-top: 10px; color: var(--amber); font-size: 11px; font-style: normal; font-weight: 800; }
.report-link { min-height: 44px; padding: 0; border: 0; background: transparent; color: var(--amber); text-align: left; font-weight: 800; }
.report-link:hover, .report-link:focus-visible { text-decoration: underline; text-underline-offset: 4px; outline: none; }
.record-status { display: flex; align-items: center; padding: 13px 15px; border: 1px solid var(--line); background: var(--surface-soft); }
.record-detail dl, .full-report dl { display: grid; gap: 1px; margin: 0; background: var(--line); border: 1px solid var(--line); }
.record-detail dl div, .full-report dl div { display: grid; grid-template-columns: 150px 1fr; gap: 14px; padding: 13px 15px; background: #fff; }
.record-detail dt, .full-report dt { color: var(--muted); font-size: 12px; font-weight: 750; }
.record-detail dd, .full-report dd { margin: 0; line-height: 1.45; }
.synthetic-note, .reports-intro, .report-notice { padding: 14px 16px; border-left: 3px solid var(--gold); background: #fffbef; color: var(--muted); line-height: 1.5; }
.reports-intro p, .report-notice p { margin: 0; }
.status-assessment-detail { display: grid; gap: 14px; }
.status-assessment-detail section { padding: 15px; border: 1px solid var(--line); background: #fff; }
.status-assessment-detail h4 { margin: 0 0 7px; }
.status-assessment-detail p, .status-assessment-detail ul { margin: 0; color: var(--muted); line-height: 1.5; }
.status-assessment-hero { padding: 18px; border: 1px solid var(--line); border-left: 5px solid var(--gray); background: var(--surface-soft); }
.status-assessment-hero.red { border-left-color: var(--red); }
.status-assessment-hero.yellow { border-left-color: var(--gold); }
.status-assessment-hero.green { border-left-color: var(--green); }
.status-assessment-hero > span { color: var(--muted); font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.status-assessment-hero > strong { display: block; margin: 8px 0; font-size: 24px; }
.assessment-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.difference-note { border-left: 4px solid var(--gold) !important; background: #fffbef !important; }
.full-report header { padding: 18px; background: var(--ink); color: #fff; }
.full-report header span { color: var(--gold); font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; }
.full-report header h4 { margin: 8px 0; font-size: 21px; }
.full-report header p { margin: 0; color: #c7d0dc; }
.full-report { display: grid; gap: 14px; }
.c6-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 22px; }
.c6-grid article { display: grid; grid-template-columns: 34px 1fr; gap: 12px; padding: 18px; border: 1px solid var(--line); border-radius: 5px; background: #f4f7fa; }
.c6-grid article > span { color: var(--gold); font-size: 12px; font-weight: 800; }
.c6-grid p { margin: 0; color: #1e6446; font-size: 11px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.c6-grid h3 { margin: 5px 0; color: var(--ink); }
.c6-grid small { color: var(--muted); line-height: 1.45; }
.comms-board { display: grid; gap: 10px; margin-top: 22px; }
.comms-board article { display: grid; grid-template-columns: 12px minmax(0, 1fr) auto; gap: 14px; align-items: center; padding: 16px 18px; border: 1px solid var(--line); border-radius: 5px; background: #fff; }
.comms-board i { width: 9px; height: 9px; border-radius: 50%; background: #2f8a61; }
.comms-board .warning i { background: var(--gold); }
.comms-board .pending i { background: #7890ae; }
.comms-board p { margin: 4px 0 0; color: var(--muted); }
.comms-board > article > span { color: var(--muted); font-size: 12px; font-weight: 800; }

.conflict-assessment { margin: 0 0 22px; padding: 20px; border: 1px solid #d8b85b; border-left: 4px solid var(--gold); border-radius: 6px; background: #fffbef; }
.conflict-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.conflict-heading h4 { margin: 0; font-size: 18px; }
.conflict-reports { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 18px 0; }
.conflict-reports article { padding: 15px; border: 1px solid var(--line); border-radius: 5px; background: #fff; }
.conflict-reports span { display: block; color: var(--amber); font-size: 11px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.conflict-reports strong { display: block; margin: 8px 0 5px; line-height: 1.35; }
.conflict-reports p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.5; }
.confidence-effect { display: grid; grid-template-columns: auto 22px auto 1fr; gap: 14px; align-items: center; padding-top: 16px; border-top: 1px solid rgba(154,115,8,.25); }
.confidence-effect > span { color: var(--muted); font-size: 11px; }
.confidence-effect strong { display: block; margin-top: 2px; color: var(--ink); font-size: 20px; }
.confidence-effect i { color: var(--gold); font-style: normal; font-weight: 800; }
.confidence-effect p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.45; }
.action-confirmation { padding: 24px; border: 1px solid var(--line); border-top: 4px solid var(--gold); border-radius: 6px; background: #fff; }
.action-confirmation > span { display: block; margin-bottom: 10px; color: #1e6446; font-size: 11px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.action-confirmation > strong { display: block; font-size: 19px; line-height: 1.4; }
.action-confirmation p { margin: 10px 0 18px; color: var(--muted); line-height: 1.55; }
.briefing-result > p { max-width: 760px; color: var(--muted); font-size: 17px; line-height: 1.6; }
.briefing-result-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 22px 0; }
.briefing-result-grid article { display: grid; grid-template-columns: 34px 1fr; gap: 3px 12px; padding: 17px; border: 1px solid var(--line); border-radius: 5px; background: #f4f7fa; }
.briefing-result-grid span { grid-row: 1 / 3; color: var(--gold); font-size: 12px; font-weight: 800; }
.briefing-result-grid strong { color: var(--ink); }
.briefing-result-grid p { margin: 3px 0 0; color: var(--muted); font-size: 13px; line-height: 1.45; }
.briefing-result-actions { display: flex; gap: 10px; align-items: center; }
.briefing-result-actions a { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }
.briefing-result-actions .primary-button { width: auto; }

.command-grid {
  min-height: 670px;
  display: grid;
  grid-template-columns: 178px minmax(0, 1fr) 250px;
  border-right: 1px solid var(--line);
  border-left: 1px solid var(--line);
  background: #eef2f6;
}

.left-navigation {
  padding: 26px 14px;
  border-right: 1px solid var(--line);
  background: #e2e8ef;
}

.rail-label {
  margin: 0 0 12px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.sub-navigation { display: grid; gap: 6px; }

.subnav-button {
  min-height: 44px;
  padding: 9px 12px;
  border: 0;
  border-left: 3px solid transparent;
  border-radius: 0 6px 6px 0;
  background: transparent;
  color: var(--muted);
  text-align: left;
  line-height: 1.3;
}

.subnav-button:hover,
.subnav-button:focus-visible { color: var(--ink); background: rgba(255, 255, 255, 0.78); outline: none; }
.subnav-button.active { color: #fff; border-left-color: var(--gold); background: var(--ink); font-weight: 750; }

.center-workspace {
  min-width: 0;
  padding: 28px;
  background: #f2f5f8;
}

.workspace-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 22px;
}

.workspace-heading h1 {
  max-width: 760px;
  margin: 0;
  font-size: clamp(22px, 1.9vw, 27px);
  line-height: 1.18;
  font-weight: 700;
  letter-spacing: -0.015em;
}

.media-button,
.inline-link,
.rail-action {
  border: 0;
  background: transparent;
  color: var(--ink);
  font-weight: 750;
  text-decoration: underline;
  text-decoration-color: var(--gold);
  text-decoration-thickness: 2px;
  text-underline-offset: 5px;
}

.media-button { flex: 0 0 auto; padding: 10px 0; }
.workspace-panels { display: grid; gap: 16px; }

.orientation-panel,
.content-panel,
.context-card {
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface);
  box-shadow: 0 5px 16px rgba(11, 31, 59, 0.055);
}

.orientation-panel { padding: 24px; }
.orientation-copy { max-width: 920px; }
.orientation-copy h2,
.panel-heading h2,
.lead-panel h2 { margin-bottom: 12px; font-size: clamp(20px, 1.6vw, 25px); line-height: 1.2; font-weight: 700; }
.orientation-copy > p:last-child,
.panel-heading > p:last-child,
.content-panel > p { color: var(--muted); font-size: 16px; line-height: 1.6; }

.story-arc {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  margin-top: 24px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--line);
  overflow: hidden;
}

.story-arc article { min-height: 164px; padding: 16px; background: #edf2f6; }
.story-arc article.active { background: var(--ink); color: white; }
.story-arc span { display: block; margin-bottom: 16px; color: var(--muted); font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.06em; }
.story-arc article.active span { color: #e5c861; }
.story-arc strong { display: block; margin-bottom: 8px; line-height: 1.25; }
.story-arc p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.45; }
.story-arc article.active p { color: #cbd2dd; }

.panel-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.content-panel { padding: 22px; }
.wide-panel { width: 100%; }
.accent-panel { border-top: 3px solid var(--gold); }
.content-panel h3 { font-size: 19px; line-height: 1.24; }
.content-panel .inline-link { margin-top: 12px; padding: 6px 0; }
.panel-heading { max-width: 900px; margin-bottom: 20px; }
.split-heading { max-width: none; display: flex; justify-content: space-between; align-items: flex-start; gap: 24px; }

.story-timeline { margin: 6px 0 0; padding: 0; list-style: none; }
.story-timeline li { display: grid; grid-template-columns: 64px 28px 1fr; gap: 14px; padding: 0 0 22px; position: relative; }
.story-timeline li:not(:last-child)::after { content: ""; position: absolute; top: 28px; bottom: 0; left: 77px; width: 1px; background: var(--line); }
.story-timeline li > span { padding-top: 5px; color: var(--muted); font-size: 13px; font-weight: 750; }
.story-timeline li > i { z-index: 1; width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: var(--ink); color: white; font-size: 12px; font-style: normal; }
.story-timeline li:last-child > i { background: var(--gold); color: var(--ink); }
.story-timeline strong { display: block; margin: 3px 0 5px; }
.story-timeline p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.5; }

.current-status { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 20px; }
.current-status button { display: grid; gap: 6px; padding: 12px; border: 1px solid var(--line); border-radius: 6px; background: #fff; color: var(--muted); text-align: left; font-size: 12px; }
.current-status button:hover, .current-status button:focus-visible { border-color: var(--gold); background: #fffcf2; outline: none; }
.current-status strong { color: var(--ink); font-size: 15px; }
.current-status i { color: var(--amber); font-size: 10px; font-style: normal; font-weight: 800; }
.plain-list { display: grid; gap: 9px; margin: 14px 0; padding-left: 20px; color: var(--muted); line-height: 1.45; }

.outlook-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.outlook-grid article { padding: 16px; border: 1px solid var(--line); border-radius: 5px; background: #edf2f6; }
.outlook-grid article > span { color: var(--gold); font-size: 12px; font-weight: 800; }
.outlook-grid h3 { margin: 10px 0 7px; }
.outlook-grid p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.48; }

.decision-focus .featured-card { margin-top: 8px; box-shadow: none; border-left: 4px solid var(--gold); }
.review-flow { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.review-flow article { padding: 18px; border: 1px solid var(--line); border-radius: 5px; background: #edf2f6; }
.review-flow article > span { width: 30px; height: 30px; display: grid; place-items: center; margin-bottom: 18px; border-radius: 50%; background: var(--ink); color: white; font-weight: 800; }
.review-flow strong { display: block; margin-bottom: 7px; }
.review-flow p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.48; }

.consequence-path { display: grid; gap: 1px; margin: 0; padding: 0; border: 1px solid var(--line); border-radius: 8px; background: var(--line); list-style: none; overflow: hidden; }
.consequence-path li { display: grid; grid-template-columns: 140px 1fr; gap: 20px; padding: 17px; background: var(--surface); }
.consequence-path span { color: var(--muted); font-size: 13px; font-weight: 750; }

.priority-board { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.priority-board article { display: grid; grid-template-columns: 34px 1fr; gap: 12px; padding: 17px; border: 1px solid var(--line); border-radius: 5px; background: #edf2f6; }
.priority-board article > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: var(--ink); color: white; font-size: 12px; font-weight: 800; }
.priority-board strong { display: block; margin: 2px 0 6px; }
.priority-board p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.45; }

.context-rail { padding: 18px 14px; border-left: 1px solid var(--line); background: #e2e8ef; }
.context-card { padding: 14px; margin-bottom: 10px; }
.context-card:first-child { border-top: 3px solid var(--gold); }
.role-identity { display: flex; align-items: center; gap: 10px; }
.role-identity > span { width: 36px; height: 36px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 50%; background: var(--ink); color: white; font-size: 12px; font-weight: 800; }
.role-identity div { display: grid; gap: 3px; }
.role-identity strong { font-size: 13px; line-height: 1.3; }
.role-identity small { color: var(--muted); font-size: 11px; line-height: 1.35; }
.rail-action { margin-top: 12px; padding: 4px 0; font-size: 13px; }
.status-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.status-pair > button,
.trust-stack span { display: grid; gap: 4px; padding: 9px; border-radius: 4px; background: var(--surface-soft); color: var(--muted); font-size: 11px; }
.status-pair > button { min-width: 0; border: 1px solid transparent; text-align: left; }
.status-pair > button:hover,
.status-pair > button:focus-visible { border-color: var(--gold); background: #fff; outline: none; }
.status-pair > button > span { color: var(--muted); overflow-wrap: anywhere; }
.status-pair > button small { color: var(--amber); font-size: 9px; font-weight: 750; }
.status-pair strong,
.trust-stack strong { color: var(--ink); font-size: 13px; }
.status-pair > button:first-child strong { color: var(--red); }
.status-icon { width: 9px; height: 9px; display: inline-block; margin-right: 6px; border-radius: 50%; background: var(--gray); }
.status-icon.green { background: var(--green); }
.status-icon.yellow { background: var(--gold); }
.status-icon.red { background: var(--red); }
.rail-note { margin: 10px 0 0; color: var(--muted); font-size: 12px; line-height: 1.4; }
.trust-stack { display: grid; gap: 6px; }
.trust-stack span { display: flex; justify-content: space-between; align-items: center; }

.stage-steps { display: grid; gap: 4px; }
.stage-steps button { display: grid; grid-template-columns: 12px 1fr; align-items: center; gap: 8px; min-height: 30px; padding: 0; border: 0; background: transparent; color: var(--muted); text-align: left; font-size: 12px; }
.stage-steps i { width: 8px; height: 8px; border: 1px solid #9aa1aa; border-radius: 50%; }
.stage-steps button.active { color: var(--ink); font-weight: 800; }
.stage-steps button.active i { border-color: var(--gold); background: var(--gold); box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.17); }

.utility-dock {
  position: sticky;
  bottom: 12px;
  z-index: 8;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  border-radius: 0 0 10px 10px;
  background: var(--ink);
  box-shadow: 0 16px 40px rgba(11, 31, 59, 0.18);
  overflow: hidden;
}

.utility-dock button { min-height: 62px; display: grid; gap: 4px; align-content: center; padding: 10px 14px; border: 0; border-right: 1px solid rgba(255,255,255,.12); background: transparent; color: white; text-align: left; }
.utility-dock button:last-child { border-right: 0; }
.utility-dock button:hover,
.utility-dock button:focus-visible { background: rgba(212, 175, 55, 0.13); outline: none; }
.utility-dock span { color: #d4af37; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.08em; }
.utility-dock strong { font-size: 13px; }

.drawer-ask { display: grid; gap: 14px; }
.drawer-ask > p { color: var(--muted); line-height: 1.55; }
.media-tabs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; padding: 5px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface-soft); }
.media-tabs button { min-height: 40px; border: 0; border-radius: 5px; background: transparent; color: var(--muted); font-weight: 700; }
.media-tabs button.active { background: var(--surface); color: var(--ink); box-shadow: 0 2px 8px rgba(11,31,59,.08); }
.media-display { display: grid; gap: 16px; margin-top: 16px; }
.media-heading p { color: var(--muted); line-height: 1.5; }
.footage-placeholder { min-height: 300px; display: grid; place-items: center; align-content: center; gap: 9px; padding: 28px; border: 1px solid #38506c; border-radius: 8px; background: linear-gradient(145deg, #071629, #102b4b); color: white; text-align: center; }
.footage-placeholder span { color: var(--gold); font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.footage-placeholder p { margin: 0; color: #b8c3d1; font-size: 13px; }
.connection-graphic { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr auto 1.25fr; align-items: stretch; gap: 8px; }
.connection-graphic article { display: grid; gap: 7px; align-content: center; min-height: 112px; padding: 12px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface-soft); }
.connection-graphic article.active { border-color: var(--gold); background: #fff9e8; }
.connection-graphic article span { color: var(--muted); font-size: 11px; }
.connection-graphic > i,
.connection-graphic > b { align-self: center; color: var(--gold); font-size: 20px; font-style: normal; }

@media (max-width: 1040px) {
  .command-grid { grid-template-columns: 150px minmax(0, 1fr); }
  .context-rail { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; border-top: 1px solid var(--line); border-left: 0; }
  .context-card { margin: 0; }
  .persona-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .workspace-grid {
    grid-template-columns: 1fr;
  }

  .side-rail {
    grid-template-columns: repeat(2, 1fr);
  }

  .context-stat-grid,
  .mission-strip,
  .signal-grid,
  .decision-layout {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cir-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dashboard-summary { grid-template-columns: 1fr; }
  .dashboard-status { width: 100%; }
  .header-right { flex-wrap: wrap; justify-content: flex-end; }
  .header-ask-prxm > strong { display: none; }
}

@media (max-width: 760px) {
  h1 {
    font-size: 32px;
  }

  h2 {
    font-size: 24px;
  }

  .role-screen,
  .workspace {
    width: 100%;
    padding-left: 16px;
    padding-right: 16px;
  }

  .role-screen {
    padding-top: 22px;
  }

  .command-workspace { padding: 0 0 118px; }
  .workspace-tabs {
    display: flex;
    overflow-x: auto;
    overflow-y: hidden;
    border-right: 0;
    border-left: 0;
    border-radius: 0;
    scrollbar-width: none;
    overscroll-behavior-x: contain;
    scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch;
  }
  .workspace-tabs::-webkit-scrollbar { display: none; }
  .workspace-tab {
    min-width: 106px;
    min-height: 52px;
    flex: 0 0 auto;
    gap: 6px;
    padding: 0 12px;
    scroll-snap-align: start;
    font-size: 12px;
  }
  .ask-prxm-command { display: none; }
  .command-grid { grid-template-columns: 1fr; border: 0; }
  .left-navigation { padding: 12px 16px; border-right: 0; border-bottom: 1px solid var(--line); overflow: visible; }
  .left-navigation .rail-label,
  .sub-navigation { display: none; }
  .mobile-subview { width: 100%; min-height: 48px; display: block; padding: 0 42px 0 14px; border: 1px solid #9baabd; border-radius: 5px; background: #fff; color: var(--ink); font-size: 16px; font-weight: 650; }
  .mobile-subview-label { display: block; margin-bottom: 6px; color: var(--muted); font-size: 11px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
  .center-workspace { padding: 20px 16px; }
  .workspace-heading,
  .split-heading { align-items: flex-start; flex-direction: column; }
  .story-arc,
  .panel-grid,
  .outlook-grid,
  .review-flow,
  .priority-board,
  .current-status,
  .resource-metrics,
  .resource-overview,
  .resource-card-grid,
  .command-structure,
  .c6-grid,
  .conflict-reports,
  .briefing-result-grid { grid-template-columns: 1fr; }
  .tool-grid, .tool-options { grid-template-columns: 1fr; }
  .cir-grid,
  .dashboard-lower-grid,
  .cir-detail-grid,
  .attention-meta,
  .dashboard-status { grid-template-columns: 1fr; }
  .confidence-effect { grid-template-columns: 1fr 20px 1fr; }
  .confidence-effect p { grid-column: 1 / -1; }
  .conflict-heading { flex-direction: column; }
  .resource-list article { grid-template-columns: 1fr; gap: 10px; }
  .resource-list article > div:last-child { text-align: left; }
  .record-list button { grid-template-columns: 1fr; gap: 10px; }
  .record-list button > div:last-child { text-align: left; }
  .assessment-grid { grid-template-columns: 1fr; }
  .record-detail dl div, .full-report dl div { grid-template-columns: 1fr; gap: 5px; }
  .asset-table { overflow-x: auto; }
  .asset-row { min-width: 620px; }
  .story-arc article { min-height: 0; }
  .context-rail { grid-column: auto; grid-template-columns: 1fr; padding: 14px 16px; }
  .utility-dock { display: none; }
  .consequence-path li { grid-template-columns: 1fr; gap: 6px; }
  .connection-graphic { grid-template-columns: 1fr; }
  .connection-graphic > i,
  .connection-graphic > b { justify-self: center; }

  .role-hero { gap: 28px; padding-bottom: 32px; }
  .role-library > summary,
  .ask-panel > summary { padding: 16px; }
  .role-library-content { padding: 8px 16px 20px; }

  .brand-lockup,
  .app-header,
  .header-left,
  .header-right,
  .view-head,
  .scope-badges,
  .context-head,
  .context-current,
  .what-changed {
    align-items: flex-start;
    flex-direction: column;
  }

  .persona-grid,
  .profile-grid,
  .profile-list-wrap,
  .crisis-grid,
  .posture-scope-grid,
  .context-stat-grid,
  .mission-strip,
  .signal-grid,
  .decision-layout,
  .section-grid,
  .section-grid.three,
  .card-meta-grid,
  .doctrine-row,
  .doctrine-grid,
  .term-grid,
  .impact-cards,
  .timeline-map-grid,
  .side-rail {
    grid-template-columns: 1fr;
  }

  .ask-form {
    grid-template-columns: 1fr;
  }

  .level-tabs {
    grid-template-columns: repeat(3, 1fr);
  }

  .drawer {
    grid-template-columns: 1fr;
  }

  .drawer-backdrop {
    display: none;
  }

  .demo-shell-bar { min-height: 54px; padding: 9px 16px; }
  .demo-shell-actions { justify-content: flex-end; }
  .synthetic-label,
  .shell-guide-button { display: none !important; }
  .shell-link-button { min-height: 44px; font-size: 12px; }
  #headerResetButton { display: none !important; }
  .shell-link { min-height: 44px; display: inline-flex; align-items: center; }
  .app-header { top: 54px; padding: 12px 16px; }
  .app-header .ghost-button { min-height: 44px; }
  .header-left { width: 100%; flex-direction: row; align-items: center; }
  .header-right { width: 100%; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .header-right > * { min-width: 0; min-height: 44px; white-space: normal; font-size: 12px; }
  .brand-row { display: grid; gap: 2px; font-size: 12px; }
  .header-persona { font-size: 12px; line-height: 1.35; }
  .guided-panel { left: 8px; bottom: 76px; width: calc(100vw - 16px); max-height: 40vh; padding: 14px; overflow: auto; }
  .guided-copy { padding: 12px 0; }
  .guided-copy h3 { font-size: 19px; }
  .guided-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .guided-actions .text-button { margin: 0; }
  .guided-actions .primary-button,
  .guided-actions .action-button,
  .guided-actions .text-button { min-height: 44px; }
  .guided-panel.minimized { width: auto; max-width: calc(100vw - 16px); left: auto; right: 8px; padding: 8px; }
  .guided-panel.minimized .guided-progress,
  .guided-panel.minimized .guided-copy,
  .guided-panel.minimized #guidedBack,
  .guided-panel.minimized #guidedNext { display: none; }
  .guided-panel.minimized .guided-actions { display: flex; }
  .mobile-primary-nav {
    position: fixed;
    inset: auto 0 0;
    z-index: 35;
    min-height: 64px;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    padding-bottom: env(safe-area-inset-bottom);
    border-top: 1px solid #193452;
    background: var(--ink);
    box-shadow: 0 -8px 24px rgba(11,31,59,.16);
  }
  .mobile-primary-nav button { min-height: 64px; padding: 8px 4px; border: 0; border-top: 3px solid transparent; background: transparent; color: #c9d3df; font-size: 12px; font-weight: 700; }
  .mobile-primary-nav button.active { border-top-color: var(--gold); background: #fff; color: var(--ink); }
  .interactive-story-arc button { min-height: 0; }
  .interactive-timeline li > button { grid-template-columns: 56px 28px 1fr; padding: 10px 6px; }
  .tool-grid > button { min-height: 0; }
  .mobile-ask-prxm {
    position: fixed;
    right: 14px;
    bottom: calc(76px + env(safe-area-inset-bottom));
    z-index: 34;
    min-height: 48px;
    display: block;
    padding: 0 20px;
    border: 1px solid #9c7907;
    border-radius: 999px;
    background: var(--gold);
    color: var(--ink);
    font-weight: 800;
    box-shadow: 0 8px 22px rgba(11,31,59,.22);
  }
  .dashboard-summary { margin: -20px -16px 0; padding: 20px 16px; border-right: 0; border-left-width: 4px; border-radius: 0; }
  .dashboard-summary h2 { font-size: 21px; }
  .dashboard-status { gap: 1px; background: rgba(255,255,255,.16); }
  .dashboard-status button { min-height: 72px; border: 0; background: var(--ink); }
  .mobile-header-ask {
    grid-column: 2;
    min-height: 52px;
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 10px;
    padding: 9px 12px;
    border: 1px solid #9c7907;
    border-radius: 5px;
    background: var(--gold);
    color: var(--ink);
    text-align: left;
  }
  .mobile-header-ask > span { font-size: 12px; font-weight: 850; text-transform: uppercase; letter-spacing: .05em; }
  .mobile-header-ask > strong { display: none; }
  .mobile-header-ask > i { font-size: 18px; font-style: normal; }
  .header-ask-prxm { display: none; }
  .operating-mode-control { grid-column: 1 / -1; width: 100%; }
  .operating-mode-control button { min-height: 44px; }
  .attention-indicator { grid-column: 1; justify-content: center; }
  .steady-state-hero { grid-template-columns: 1fr; padding: 20px 16px; }
  .readiness-score { min-width: 0; }
  .preparedness-phases { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cross-cutting-functions, .steady-action-grid { grid-template-columns: 1fr; }
  .cir-card { min-height: 200px; }
  .entry-actions { width: 100%; display: grid; grid-template-columns: 1fr; }
  .entry-actions .primary-button,
  .entry-actions .secondary-button { width: 100%; min-height: 52px; }
  .drawer { grid-template-columns: 1fr; }
  .drawer-panel { width: 100%; padding: 18px 16px 100px; border-left: 0; }
  .drawer-header { position: sticky; top: -18px; z-index: 2; padding-top: 18px; background: #fff; }
  .demo-notice { right: 10px; bottom: calc(76px + env(safe-area-inset-bottom)); }
  .ownership-grid { grid-template-columns: 1fr; }
}

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