/* calculate-retention · Permit & Filing Desk / Form Stack Ledger */
:root {
  --canvas: #F8FAFC;
  --paper: #FFFFFF;
  --mast: #1E3A5F;
  --mast-ink: #F8FAFC;
  --ink: #0F172A;
  --muted: #475569;
  --primary: #1E40AF;
  --primary-ink: #FFFFFF;
  --accent: #B45309;
  --hair: #CBD5E1;
  --ok: #166534;
  --ok-bg: #DCFCE7;
  --warn-ink: #78350F;
  --warn-bg: #FEF3C7;
  --crit: #B91C1C;
  --crit-bg: #FEE2E2;
  --soft: #F1F5F9;
  --radius: 2px;
  --stack-shadow: 1px 1px 0 #CBD5E1, 2px 2px 0 #E2E8F0;
  --font-head: "Libre Franklin", "Helvetica Neue", Arial, sans-serif;
  --font-body: "Source Sans 3", "Segoe UI", Arial, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, Menlo, monospace;
  --horizon-h: 28px;
  --hud-h: 56px;
}

*,
*::before,
*::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--canvas);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.5;
}

h1, h2, h3, h4 { font-family: var(--font-head); line-height: 1.2; margin: 0; color: var(--ink); }
h2 { font-size: 20px; }
h3 { font-size: 15px; letter-spacing: 0.02em; }
h4 { font-size: 13px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--muted); }
p { margin: 0; }
a { color: var(--primary); }
.mono { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
.icon { flex: 0 0 auto; display: inline-block; vertical-align: middle; }

:focus-visible { outline: 3px solid #1D4ED8; outline-offset: 2px; }

/* ---------- Buttons ---------- */
button { font: inherit; cursor: pointer; }
button:disabled { cursor: not-allowed; }
.btn-primary,
.btn-secondary,
.preset-chip,
.btn-dock-jump {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 8px 14px;
  border-radius: var(--radius);
  font-weight: 600;
  font-size: 15px;
  line-height: 1.2;
  text-align: center;
}
.btn-primary { background: var(--primary); color: var(--primary-ink); border: 1px solid var(--primary); }
.btn-primary:hover { background: #1E3A8A; }
.btn-secondary { background: var(--paper); color: var(--ink); border: 1px solid var(--hair); box-shadow: 1px 1px 0 var(--hair); }
.btn-secondary:hover { border-color: var(--muted); }
.btn-primary:active,
.btn-secondary:active,
.preset-chip:active,
.btn-dock-jump:active { transform: translateY(1px); box-shadow: none; }

/* ---------- Masthead ---------- */
.app-header-stack { flex: 0 0 auto; }

header {
  background-color: #1E3A5F;
  color: #F8FAFC;
}

.masthead {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 24px;
  padding: 10px 20px;
}
.masthead-title { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 16px; min-width: 0; }
.wordmark {
  color: #F8FAFC;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.01em;
  white-space: nowrap;
  max-height: 52px;
}
.subtitle { color: #E2E8F0; font-size: 15px; line-height: 1.35; min-width: 0; }
.masthead-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.filing-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border: 1px dashed #94A3B8;
  border-radius: var(--radius);
  font-size: 13px;
  color: #F8FAFC;
}
.filing-tag-label { font-variant: small-caps; letter-spacing: 0.06em; font-weight: 600; }
.filing-tag .mono { min-width: 9ch; }
.completeness-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 12px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 700;
  background: #E2E8F0;
  color: #0F172A;
  border: 1px solid transparent;
}
.completeness-pill[data-state="calculated"] { background: var(--ok-bg); color: #14532D; }
.completeness-pill[data-state="incomplete"] { background: var(--warn-bg); color: var(--warn-ink); }
.completeness-pill[data-state="review"] { background: var(--crit-bg); color: #7F1D1D; }

/* ---------- Preset strip ---------- */
.preset-strip {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 8px 10px;
  padding: 8px 20px;
  background: var(--paper);
  border-bottom: 1px solid var(--hair);
}
.preset-caption {
  font-size: 13px;
  font-weight: 700;
  color: var(--muted);
  font-variant: small-caps;
  letter-spacing: 0.05em;
}
.preset-group { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.preset-chips { display: flex; flex-wrap: wrap; gap: 6px; min-width: 0; }
.preset-chip {
  background: var(--canvas);
  color: var(--ink);
  border: 1px solid var(--hair);
  border-bottom: 2px solid var(--hair);
  font-size: 14px;
  padding: 7px 12px;
}
.preset-chip:hover { border-color: var(--primary); }
.preset-chip[aria-pressed="true"] { background: var(--primary); border-color: var(--primary); color: var(--primary-ink); }
.provenance-badge {
  align-self: flex-end;
  margin-bottom: 11px;
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  width: 190px;
  justify-content: center;
  background: var(--soft);
  color: #334155;
}
.provenance-badge[data-kind="sample"] { background: var(--warn-bg); color: var(--warn-ink); }
.provenance-badge[data-kind="edited"] { background: #FFEDD5; color: #7C2D12; }
.provenance-badge[data-kind="own"] { background: #DBEAFE; color: #1E3A8A; }
.undo-slot {
  flex: 0 0 240px;
  margin-left: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  gap: 4px 8px;
  min-height: 44px;
  min-width: 0;
  font-size: 14px;
  color: var(--muted);
}
.undo-btn { padding: 6px 12px; }
.undo-btn[hidden] { display: none; }

/* ---------- Free reassurance ---------- */
.trust-reassurance-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 12px;
  padding: 6px 20px;
  background: var(--soft);
  border-bottom: 1px solid var(--hair);
  font-size: 14px;
  color: #334155;
}
.trust-badge {
  padding: 2px 10px;
  border-radius: 999px;
  background: #E0F2FE;
  color: #0C4A6E;
  font-weight: 700;
  font-size: 12px;
}

/* ---------- Workspace ---------- */
.workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
  align-items: start;
  gap: 16px;
  padding: 12px 16px;
}

.inspector-pane {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  background: var(--canvas);
}
.inspector-head {
  flex: 0 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 12px;
  padding: 4px 4px 10px;
  border-bottom: 1px solid var(--hair);
}
.pane-heading { font-size: 16px; }
.live-note { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--muted); margin-left: auto; }

.role-badge,
.role-badge-in,
.role-badge-out {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  line-height: 1.3;
  border: 1px solid;
  white-space: nowrap;
}
.role-badge-in { background: #1E3A5F; color: #F8FAFC; border-color: #1E3A5F; }
.role-badge-out { background: #FEF3C7; color: #78350F; border-color: #B45309; }

.inspector-scroll-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  padding: 12px 6px 56px 2px;
}
.dock-jump-shelf {
  flex: 0 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  padding: 8px 6px;
  border-top: 1px solid var(--hair);
  background: var(--canvas);
}
.shelf-text { flex: 1 1 200px; font-size: 14px; color: var(--muted); min-width: 0; }
.shelf-btn[data-hidden="true"] { visibility: hidden; }

/* ---------- Form sheets ---------- */
.form-sheet {
  margin: 0 0 16px;
  padding: 12px 16px 6px;
  background: var(--paper);
  border: 1px solid var(--hair);
  border-radius: var(--radius);
  box-shadow: var(--stack-shadow);
  min-width: 0;
}
.form-sheet > legend {
  float: left;
  width: 100%;
  padding: 0 0 8px;
  margin-bottom: 8px;
  border-bottom: 1px dashed var(--hair);
  font-family: var(--font-head);
  font-weight: 700;
  font-size: 15px;
  line-height: 1.3;
}
.form-sheet > legend + * { clear: both; }
.sheet-no {
  font-family: var(--font-mono);
  color: var(--accent);
  font-weight: 600;
}
.field-pair {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 0 16px;
}
.field { display: flex; flex-direction: column; gap: 4px; min-width: 0; margin-bottom: 6px; }
.field label,
.choice-legend {
  font-size: 15px;
  font-weight: 600;
  font-variant: small-caps;
  letter-spacing: 0.03em;
  color: var(--ink);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}
.req-tag,
.opt-tag {
  font-variant: normal;
  text-transform: uppercase;
  font-size: 11px;
  letter-spacing: 0.06em;
  font-weight: 700;
  padding: 1px 8px;
  border-radius: 999px;
}
.req-tag { color: #92400E; background: var(--warn-bg); }
.opt-tag { color: #334155; background: var(--soft); }
.field input,
.field textarea {
  width: 100%;
  min-height: 44px;
  padding: 8px 10px;
  font: inherit;
  font-variant-numeric: tabular-nums;
  color: var(--ink);
  background: var(--paper);
  border: 1px solid #94A3B8;
  border-bottom-width: 2px;
  border-radius: var(--radius);
}
.field input:focus,
.field textarea:focus { border-color: var(--primary); outline: 2px solid #93C5FD; outline-offset: 0; }
.field input:disabled { background: var(--soft); color: var(--muted); border-style: dashed; cursor: not-allowed; }
.field textarea { resize: vertical; min-height: 80px; }
.field-hint { font-size: 13px; color: var(--muted); }
.field-error { min-height: 18px; font-size: 13px; line-height: 18px; color: var(--crit); font-weight: 600; }
.validation-cue,
[aria-invalid="true"] { border-color: var(--crit) !important; box-shadow: 0 0 0 1px var(--crit); }

.choice-group { border: 0; padding: 0; margin: 0 0 6px; min-width: 0; }
.choice-legend { padding: 0; margin-bottom: 6px; }
.choice-row { display: flex; flex-wrap: wrap; gap: 6px; }
.choice {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 8px 12px;
  border: 1px solid var(--hair);
  border-radius: var(--radius);
  background: var(--paper);
  cursor: pointer;
  font-size: 15px;
  line-height: 1.25;
}
.choice input { width: 18px; height: 18px; margin: 0; accent-color: var(--primary); cursor: pointer; }
.choice:hover { border-color: var(--primary); }
.choice:has(input:checked) { background: #EFF6FF; border-color: var(--primary); box-shadow: inset 0 -2px 0 var(--primary); }
.choice:has(input:disabled) { cursor: not-allowed; border-style: dashed; color: var(--muted); background: var(--canvas); }
.choice:has(input:disabled) input { cursor: not-allowed; }
.choice-group[data-invalid="true"] .choice { border-color: var(--crit); }

.prop-collapsible {
  margin: 4px 0 10px;
  border-top: 1px solid var(--hair);
  padding-top: 6px;
}
.prop-collapsible > summary {
  display: flex;
  align-items: center;
  min-height: 44px;
  padding: 6px 0;
  cursor: pointer;
  font-weight: 600;
  color: var(--primary);
}
.prop-collapsible > p { font-size: 14px; color: var(--muted); padding-bottom: 6px; }
details:not([open]) > :not(summary) {
  display: none;
}

.mobile-verdict-strip { display: none; }

/* ---------- Deliverable rail ---------- */
.deliverable-zone {
  min-width: 0;
  min-height: 0;
  background: var(--paper);
  border: 1px solid var(--hair);
  border-radius: var(--radius);
  box-shadow: var(--stack-shadow);
  padding-bottom: 56px;
}
.deliverable-dock {
  position: sticky;
  top: 0;
  z-index: 30;
  background: var(--paper);
  border-bottom: 1px solid var(--hair);
  border-left: 4px solid var(--muted);
  padding: 10px 16px 6px;
}
.deliverable-dock[data-state="calculated"] { border-left-color: var(--ok); }
.deliverable-dock[data-state="incomplete"] { border-left-color: var(--accent); }
.deliverable-dock[data-state="review"] { border-left-color: var(--crit); }
.dock-top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 12px; }
.dock-state { font-size: 13px; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: 0.06em; }
.dock-verdict {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 8px 0;
  min-height: 2.6em;
  font-family: var(--font-head);
  font-weight: 700;
  font-size: 18px;
  line-height: 1.3;
}
.verdict-icon { display: inline-flex; padding-top: 2px; color: var(--muted); }
.deliverable-dock[data-state="calculated"] .verdict-icon { color: var(--ok); }
.deliverable-dock[data-state="incomplete"] .verdict-icon { color: var(--accent); }
.deliverable-dock[data-state="review"] .verdict-icon { color: var(--crit); }
.dock-metrics { display: flex; flex-wrap: wrap; gap: 8px; }
.metric {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  min-height: 44px;
  padding: 6px 10px;
  border: 1px solid var(--hair);
  border-radius: var(--radius);
  background: var(--canvas);
  text-align: left;
  color: var(--ink);
}
.metric:hover { border-color: var(--primary); }
.metric:active { transform: translateY(1px); }
.metric-label { font-size: 12px; color: var(--muted); font-variant: small-caps; letter-spacing: 0.05em; font-weight: 600; }
.metric-value { font-family: var(--font-mono); font-variant-numeric: tabular-nums; font-size: 14px; font-weight: 600; line-height: 1.3; }
.dock-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.dock-status { min-height: 22px; height: 22px; font-size: 13px; line-height: 22px; color: var(--ok); font-weight: 600; margin-top: 4px; overflow: hidden; }

.deliverable-sheet { padding: 20px 20px 24px; position: static; }
.sheet-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-content: flex-start;
  gap: 12px 24px;
  padding-bottom: 14px;
  border-bottom: 2px solid var(--ink);
}
.sheet-kicker { font-size: 12px; font-weight: 700; color: var(--accent); text-transform: uppercase; letter-spacing: 0.08em; }
.sheet-head h2 { margin-top: 4px; font-size: 21px; line-height: 1.2; }
.sheet-meta { display: grid; grid-template-columns: repeat(2, minmax(0, auto)); gap: 4px 20px; margin: 0; font-size: 14px; }
.sheet-meta dt { font-size: 11px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--muted); font-weight: 700; }
.sheet-meta dd { margin: 0; overflow-wrap: anywhere; }

.verdict-stamp {
  margin-top: 18px;
  padding: 14px 16px;
  border: 1px solid var(--hair);
  border-left: 4px solid var(--muted);
  background: var(--canvas);
  cursor: pointer;
}
.verdict-stamp[data-state="calculated"] { border-left-color: var(--ok); }
.verdict-stamp[data-state="incomplete"] { border-left-color: var(--accent); }
.verdict-stamp[data-state="review"] { border-left-color: var(--crit); }
.stamp-marker {
  display: inline-block;
  padding: 2px 8px;
  border: 2px solid currentColor;
  border-radius: var(--radius);
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.06em;
  color: #475569;
}
.verdict-stamp[data-state="calculated"] .stamp-marker { color: var(--ok); }
.verdict-stamp[data-state="incomplete"] .stamp-marker { color: #92400E; }
.verdict-stamp[data-state="review"] .stamp-marker { color: var(--crit); }
.stamp-headline { margin-top: 8px; font-family: var(--font-head); font-weight: 700; font-size: 17px; line-height: 1.3; }
.stamp-blocker { margin-top: 4px; min-height: 1.5em; font-size: 14px; color: var(--muted); }

.signature-checkpoint {
  margin-top: 14px;
  padding: 12px 16px 14px;
  border: 1px dashed var(--hair);
  border-radius: var(--radius);
}
.sig-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 12px; }
.sig-status { padding: 2px 10px; border-radius: 999px; font-size: 12px; font-weight: 700; background: var(--soft); color: #334155; }
.signature-checkpoint[data-status="open"] .sig-status { background: var(--ok-bg); color: #14532D; }
.signature-checkpoint[data-status="pending"] .sig-status { background: var(--warn-bg); color: var(--warn-ink); }
.sig-note { margin-top: 6px; font-size: 14px; color: var(--muted); }
.sig-lines { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 20px; margin-top: 20px; }
.sig-line { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.sig-rule { display: block; height: 28px; border-bottom: 1px solid var(--ink); }
.sig-label { font-size: 12px; color: var(--muted); text-transform: uppercase; letter-spacing: 0.06em; font-weight: 700; }
.sig-name { font-size: 13px; color: var(--ink); min-height: 1.4em; }

.checks-block { margin-top: 18px; }
.checks-block h3 { margin-bottom: 8px; }
.checks-clear { font-size: 14px; color: var(--muted); display: flex; align-items: center; gap: 6px; }
.conflict-banner {
  display: flex;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--crit);
  border-left-width: 4px;
  background: var(--crit-bg);
  color: #7F1D1D;
  font-size: 14px;
}
.conflict-banner[hidden],
.checks-clear[hidden] { display: none; }
.conflict-banner ul { margin: 4px 0 0; padding-left: 18px; }
.conflict-banner strong { font-weight: 700; }
.conflict-banner .sev { font-family: var(--font-mono); font-size: 11px; font-weight: 600; letter-spacing: 0.05em; }

.results-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
  gap: 20px 24px;
  margin-top: 20px;
}
.result-table-wrap { min-width: 0; }
.result-table-wrap h3,
.record-block h3,
.rule-block h3,
.assumption-block h3 { margin-bottom: 6px; padding-bottom: 6px; border-bottom: 1px solid var(--hair); }
.result-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.result-table thead th {
  text-align: left;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
  padding: 4px 6px;
  font-weight: 700;
}
.result-table tbody th,
.result-table tbody td {
  text-align: left;
  vertical-align: top;
  padding: 8px 6px;
  border-top: 1px solid var(--hair);
  overflow-wrap: anywhere;
}
.result-table tbody th { font-weight: 600; width: 46%; color: #334155; }
.result-table tbody td { font-variant-numeric: tabular-nums; font-weight: 600; }
.result-table tbody tr[data-edit-target] { cursor: pointer; }
.result-table tbody tr[data-edit-target]:hover { background: #F8FAFC; }
.result-table tbody tr[data-flag="critical"] td,
.result-table tbody tr[data-flag="conflict"] td { color: var(--crit); }
.result-table tbody tr[data-flag="review"] td { color: #92400E; }
.edit-hint { margin-top: 8px; font-size: 13px; color: var(--muted); }

.detail-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
  gap: 20px 24px;
  margin-top: 24px;
}
.rule-list { margin: 0 0 10px; font-size: 14px; }
.rule-list > div { display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: 8px; padding: 6px 0; border-top: 1px solid var(--hair); cursor: pointer; }
.rule-list dt { color: var(--muted); font-weight: 600; }
.rule-list dd { margin: 0; overflow-wrap: anywhere; }
.plain-list { margin: 6px 0 0; padding-left: 18px; font-size: 14px; color: #334155; }
.plain-list li + li { margin-top: 4px; }
.record-block { margin-top: 24px; }
.record-table td small { display: block; font-weight: 400; color: var(--muted); }

.disclaimer { margin-top: 24px; padding-top: 12px; border-top: 1px solid var(--hair); font-size: 13px; color: var(--muted); }
.free-watermark { margin-top: 8px; font-size: 12px; color: var(--muted); font-family: var(--font-mono); }
.trust-footer {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: 0 20px;
  padding: 16px 0 0;
  border-top: 1px solid var(--hair);
  font-size: 13px;
  color: var(--muted);
}

[data-edit-target] { cursor: pointer; }
.flash-recalc { animation: flash-recalc 900ms ease-out; }
@keyframes flash-recalc {
  0% { background-color: #FDE68A; box-shadow: 0 0 0 3px #FDE68A; }
  100% { background-color: transparent; box-shadow: 0 0 0 0 transparent; }
}

/* ---------- Horizon, HUD, dialog ---------- */
.cockpit-horizon-bar {
  flex: 0 0 var(--horizon-h);
  height: var(--horizon-h);
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 0 16px;
  background: var(--paper);
  border-top: 1px solid var(--hair);
  font-size: 12px;
  color: #334155;
  white-space: nowrap;
}
.horizon-item { display: inline-flex; align-items: center; gap: 6px; }
.mobile-hud { display: none; }

.preset-dialog {
  max-width: min(460px, calc(100vw - 32px));
  padding: 20px;
  border: 1px solid var(--hair);
  border-radius: var(--radius);
  box-shadow: 2px 2px 0 var(--hair);
  color: var(--ink);
}
.preset-dialog::backdrop { background: rgba(15, 23, 42, 0.45); }
.preset-dialog h2 { font-size: 18px; line-height: 1.25; }
.preset-dialog p { margin-top: 8px; color: #334155; }
.dialog-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; margin-top: 16px; }

/* ---------- Scroll fade ---------- */
.inspector-scroll-body.has-more,
.deliverable-zone.has-more {
  -webkit-mask-image: linear-gradient(to bottom, #000 calc(100% - 36px), transparent 100%);
  mask-image: linear-gradient(to bottom, #000 calc(100% - 36px), transparent 100%);
}

/* ---------- Desktop cockpit ---------- */
@media (min-width: 901px) {
  html,
  body {
    height: 100vh;
    height: 100dvh;
    overflow: hidden;
  }
  body { display: flex; flex-direction: column; }
  .app-header-stack { flex-shrink: 0; }
  .workspace {
    flex: 1 1 auto;
    min-height: 0;
    grid-template-rows: minmax(0, 1fr);
  }
  .inspector-pane,
  .deliverable-zone { height: 100%; }
  .deliverable-zone {
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
  }
  .field input,
  .field textarea { min-width: 180px; }
  .lower-section { padding-top: 72px; }
}

/* ---------- Mobile / tablet ---------- */
@media (max-width: 900px) {
  html,
  body { height: auto; overflow: visible; }
  body { padding-bottom: calc(var(--hud-h) + 16px); }
  .masthead { padding: 10px 12px; }
  .wordmark { font-size: 20px; }
  .subtitle { font-size: 14px; }
  .preset-strip { padding: 8px 12px; }
  .undo-slot { flex: 1 1 120px; flex-wrap: nowrap; justify-content: flex-start; margin-left: 0; }
  .provenance-badge { margin-bottom: 0; align-self: center; }
  .trust-reassurance-bar { padding: 6px 12px; }
  .workspace { display: block; padding: 12px; }
  .inspector-scroll-body { overflow: visible; padding: 12px 0 8px; }
  .inspector-scroll-body.has-more,
  .deliverable-zone.has-more { -webkit-mask-image: none; mask-image: none; }
  .deliverable-zone { margin-top: 12px; padding-bottom: 24px; }
  .deliverable-dock { position: relative; padding: 12px; }
  .deliverable-sheet { padding: 16px 12px 20px; }
  .trust-footer { margin: 0 12px; }
  .cockpit-horizon-bar { display: none; }
  .mobile-verdict-strip {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 10px;
    margin: 0 0 16px;
    padding: 8px 12px;
    border: 1px solid var(--hair);
    border-left: 4px solid var(--muted);
    background: var(--paper);
    font-size: 14px;
  }
  .mobile-verdict-strip[data-state="calculated"] { border-left-color: var(--ok); }
  .mobile-verdict-strip[data-state="incomplete"] { border-left-color: var(--accent); }
  .mobile-verdict-strip[data-state="review"] { border-left-color: var(--crit); }
  .mv-state { font-weight: 700; }
  .mv-detail { color: #334155; font-variant-numeric: tabular-nums; }
  .mobile-hud {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 40;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    height: var(--hud-h);
    padding: 6px 12px;
    background: var(--paper);
    border-top: 1px solid var(--hair);
    box-shadow: 0 -1px 0 var(--hair);
    white-space: nowrap;
  }
  .hud-state { font-weight: 700; font-size: 14px; min-width: 0; }
  .btn-dock-jump { background: var(--primary); color: var(--primary-ink); border: 1px solid var(--primary); padding: 6px 14px; }
}

@media (max-width: 680px) {
  fieldset [class*="grid"],
  form [class*="grid"],
  .field-pair,
  .prop-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .form-sheet { padding: 12px 12px 6px; }
  .sig-lines { grid-template-columns: minmax(0, 1fr); }
  .sheet-meta { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .rule-list > div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
}

@media (max-width: 640px) {
  .dock-metrics .metric { flex: 1 1 calc(50% - 8px); max-width: 48%; }
  .dock-actions > button { flex: 1 1 calc(50% - 8px); }
  .dock-verdict { font-size: 17px; }
  .live-note { margin-left: 0; }
  .preset-chip { font-size: 14px; }
}

@media (prefers-reduced-motion: reduce) {
  .flash-recalc { animation-duration: 1ms; }
  * { scroll-behavior: auto !important; }
}

/* ---------- Print ---------- */
@media print {
  @page { margin: 14mm; }
  html,
  body { height: auto !important; overflow: visible !important; background: #FFFFFF; color: #111827; }
  body { display: block; padding: 0; }
  .app-header-stack,
  .inspector-pane,
  .deliverable-dock,
  .cockpit-horizon-bar,
  .mobile-hud,
  .preset-dialog,
  .trust-footer,
  .edit-hint,
  button { display: none !important; }
  .workspace { display: block; padding: 0; }
  .deliverable-zone { border: 0; box-shadow: none; padding: 0; overflow: visible !important; height: auto !important; -webkit-mask-image: none !important; mask-image: none !important; }
  #executive-deliverable { display: block; padding: 0; color: #111827; background: #FFFFFF; }
  #executive-deliverable * { color: #111827 !important; background: #FFFFFF !important; box-shadow: none !important; }
  .verdict-stamp,
  .signature-checkpoint,
  .conflict-banner,
  .result-table,
  .rule-block,
  .record-block { break-inside: avoid; }
  #executive-deliverable,
  #executive-deliverable .sheet-head,
  #verdict-stamp,
  #signature-checkpoint,
  #checks-block,
  #schedule-block,
  .detail-grid,
  .record-block { min-height: 0 !important; }
  .verdict-stamp,
  .conflict-banner { border: 2px solid #111827 !important; }
  .free-watermark { display: block; }
}