.governance-workspace {
  --gov-acid: #d9ff43;
  --gov-blue: #2435ff;
  --gov-red: #c9472a;
  border: 1px solid var(--ink);
  background:
    linear-gradient(90deg, transparent 49.8%, rgba(20, 20, 20, .035) 50%, transparent 50.2%),
    color-mix(in srgb, var(--paper) 92%, white);
}

.governance-workspace > header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 28px;
  align-items: end;
  min-height: 150px;
  padding: 25px 27px;
  border-bottom: 1px solid var(--ink);
  background:
    linear-gradient(115deg, transparent 0 71%, rgba(217, 255, 67, .55) 71% 72%, transparent 72%),
    white;
}

.governance-workspace > header span,
.governance-workspace label > span,
.governance-card > span,
.cockpit-card > span,
.decision-strip > span {
  display: block;
  margin-bottom: 7px;
  color: var(--muted);
  font: 9px DM Mono;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.governance-workspace h2 {
  margin: 0;
  max-width: 720px;
  font: italic 38px/.98 Newsreader, serif;
}

.governance-workspace header p {
  max-width: 640px;
  margin: 10px 0 0;
  color: var(--muted);
  font-size: 12px;
}

.governance-index {
  align-self: stretch;
  display: grid;
  place-items: center;
  min-width: 94px;
  border: 1px solid var(--ink);
  background: var(--gov-acid);
  font: 42px/1 Newsreader;
}

.cockpit-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-bottom: 1px solid var(--ink);
}

.cockpit-card {
  min-height: 135px;
  padding: 20px;
  border-right: 1px solid var(--ink);
}

.cockpit-card:nth-child(4n) {
  border-right: 0;
}

.cockpit-card strong {
  display: block;
  overflow-wrap: anywhere;
  font: 38px/.95 Newsreader, serif;
}

.cockpit-card small {
  display: block;
  margin-top: 13px;
  color: var(--muted);
  font: 9px/1.5 DM Mono;
  text-transform: uppercase;
}

.cockpit-card.critical {
  background: #fff0e8;
}

.cockpit-card.acid {
  background: var(--gov-acid);
}

.governance-editor {
  padding: 22px 26px;
  border-bottom: 1px solid var(--ink);
  background: rgba(255, 255, 255, .62);
}

.governance-form {
  display: grid;
  grid-template-columns: repeat(4, minmax(135px, 1fr));
  gap: 9px;
  align-items: end;
}

.governance-form.wide {
  grid-template-columns: repeat(3, minmax(160px, 1fr));
}

.governance-field input,
.governance-field select,
.governance-field textarea {
  width: 100%;
  min-height: 40px;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 0;
  background: var(--paper);
  color: var(--ink);
  font: 11px/1.4 DM Mono;
}

.governance-field textarea {
  min-height: 82px;
  resize: vertical;
}

.governance-field input:focus,
.governance-field select:focus,
.governance-field textarea:focus {
  outline: 2px solid var(--gov-acid);
  border-color: var(--ink);
}

.governance-action {
  min-height: 40px;
  padding: 10px 14px;
  border: 1px solid var(--ink);
  border-radius: 0;
  background: var(--ink);
  color: var(--paper);
  cursor: pointer;
  font: 9px DM Mono;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.governance-action.secondary {
  background: var(--gov-acid);
  color: var(--ink);
}

.governance-action.quiet {
  background: transparent;
  color: var(--ink);
}

.governance-action.danger {
  border-color: var(--gov-red);
  background: transparent;
  color: var(--gov-red);
}

.governance-action.table {
  min-height: 27px;
  margin: 2px 5px 2px 0;
  padding: 6px 8px;
  font-size: 8px;
}

.governance-list {
  min-height: 90px;
}

.governance-list .table-wrap {
  border: 0;
}

.governance-list td {
  vertical-align: top;
}

.governance-stack {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.governance-stack > section {
  min-width: 0;
  border-right: 1px solid var(--ink);
}

.governance-stack > section:last-child {
  border-right: 0;
}

.governance-stack h3 {
  margin: 0;
  padding: 18px 22px;
  border-bottom: 1px solid var(--ink);
  font: italic 24px Newsreader, serif;
}

.decision-strip {
  display: grid;
  grid-template-columns: 90px 1fr auto;
  gap: 16px;
  align-items: center;
  padding: 16px 22px;
  border-bottom: 1px solid var(--line);
}

.decision-strip > b {
  font: 24px Newsreader;
}

.decision-strip strong {
  display: block;
  font-size: 13px;
}

.decision-strip small {
  color: var(--muted);
  font: 9px DM Mono;
  text-transform: uppercase;
}

.risk-map {
  display: grid;
  grid-template-columns: repeat(5, minmax(70px, 1fr));
  gap: 5px;
  padding: 24px;
  background: #ecebe4;
}

.risk-cell {
  position: relative;
  min-height: 105px;
  padding: 10px;
  border: 1px solid rgba(20, 20, 20, .45);
  background: color-mix(in srgb, var(--gov-acid) calc(var(--risk) * 3%), white);
}

.risk-cell[data-level="high"] {
  background: #ffd3bd;
}

.risk-cell[data-level="critical"] {
  background: var(--gov-red);
  color: white;
}

.risk-cell > b {
  position: absolute;
  right: 9px;
  bottom: 7px;
  font: 26px Newsreader;
}

.risk-cell span {
  font: 8px/1.4 DM Mono;
  text-transform: uppercase;
}

.governance-empty {
  padding: 32px 26px;
  color: var(--muted);
  font: 11px DM Mono;
}

.workflow-note {
  padding: 12px 24px;
  border-bottom: 1px solid var(--line);
  background: #f6f3d8;
  color: #5e592b;
  font: 9px/1.55 DM Mono;
  text-transform: uppercase;
}

@media (max-width: 1100px) {
  .cockpit-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cockpit-card:nth-child(2n) {
    border-right: 0;
  }

  .governance-form,
  .governance-form.wide {
    grid-template-columns: repeat(2, minmax(140px, 1fr));
  }
}

@media (max-width: 700px) {
  .governance-workspace > header {
    grid-template-columns: 1fr;
    min-height: 0;
  }

  .governance-index {
    width: 72px;
    min-width: 0;
    min-height: 54px;
    font-size: 28px;
  }

  .cockpit-grid,
  .governance-form,
  .governance-form.wide,
  .governance-stack {
    grid-template-columns: 1fr;
  }

  .cockpit-card,
  .governance-stack > section {
    border-right: 0;
  }

  .decision-strip {
    grid-template-columns: 1fr;
  }

  .risk-map {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 12px;
  }
}