:root {
  color-scheme: dark;
  --mv-bg: #0b0d10;
  --mv-bg-deep: #070a0e;
  --mv-panel: #151b24;
  --mv-panel-raised: #1d2530;
  --mv-line: #303b49;
  --mv-text: #edf0f5;
  --mv-warm: #f5f2ea;
  --mv-on-warm: #111318;
  --mv-muted: #a7b0bc;
  --mv-blue: #5c7cff;
  --mv-teal: #47d7ac;
  --mv-sand: #d6b36a;
  --mv-red: #d94848;
  --mv-audit-bg: #123b30;
  --mv-risk-bg: #4a171b;
  --mv-radius-sm: 0.625rem;
  --mv-radius-md: 1.125rem;
  --mv-radius-lg: 1.75rem;
  --mv-content: 76rem;
  --mv-copy: 68ch;
  --mv-gutter: clamp(1.25rem, 4vw, 4rem);
  --mv-section-space: clamp(4rem, 9vw, 8rem);
  --mv-shadow: 0 1.5rem 4.375rem rgb(0 0 0 / 28%);
  --mv-motion-fast: 160ms;
  --mv-motion-base: 240ms;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 20rem;
  background: var(--mv-bg);
  color: var(--mv-text);
  font-family: Inter, "Segoe UI", Arial, sans-serif;
  line-height: 1.55;
}
button, input, textarea, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; }
p { max-width: var(--mv-copy); }
h1, h2, h3 { margin: 0; font-family: Manrope, "Segoe UI", Arial, sans-serif; line-height: 1.08; }
h1 { font-size: clamp(2.7rem, 7vw, 6.2rem); letter-spacing: -0.055em; }
h2 { font-size: clamp(2rem, 4.3vw, 3.7rem); letter-spacing: -0.04em; }
h3 { font-size: clamp(1.25rem, 2vw, 1.55rem); }

.shell { width: min(100%, var(--mv-content)); margin-inline: auto; padding-inline: var(--mv-gutter); }
.narrow { max-width: 55rem; }
.is-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: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}
.skip-link:focus {
  position: fixed;
  z-index: 1000;
  left: 1rem;
  top: 1rem;
  width: auto;
  height: auto;
  padding: 0.75rem 1rem;
  margin: 0;
  overflow: visible;
  clip: auto;
  background: var(--mv-warm);
  color: var(--mv-on-warm);
  border-radius: var(--mv-radius-sm);
}

:focus-visible { outline: 3px solid var(--mv-sand); outline-offset: 4px; }

.prototype-notice { background: var(--mv-sand); color: var(--mv-on-warm); }
.notice-inner { display: flex; gap: 0.75rem 1.25rem; justify-content: center; align-items: center; min-height: 2.75rem; font-size: 0.9rem; }
.notice-inner strong { text-transform: uppercase; letter-spacing: 0.08em; font-size: 0.75rem; }

.site-header { position: sticky; top: 0; z-index: 50; background: rgb(7 10 14 / 92%); border-bottom: 1px solid var(--mv-line); backdrop-filter: blur(18px); }
.header-inner { min-height: 4.75rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.signature { display: inline-flex; align-items: center; gap: 0.7rem; text-decoration: none; font-size: 0.74rem; letter-spacing: 0.11em; font-weight: 800; }
.signature-mark { display: grid; place-items: center; width: 2.4rem; height: 2.4rem; border: 1px solid var(--mv-blue); border-radius: 50%; color: var(--mv-blue); }
.primary-nav { display: flex; gap: 1.5rem; }
.primary-nav a { color: var(--mv-muted); text-decoration: none; font-size: 0.9rem; }
.primary-nav a:hover { color: var(--mv-text); }

.button, .card-action, .text-button, .back-button {
  min-height: 2.75rem;
  border: 0;
  cursor: pointer;
  transition: background-color var(--mv-motion-fast), color var(--mv-motion-fast), transform var(--mv-motion-fast);
}
.button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-height: 3.25rem;
  padding: 0.8rem 1.2rem;
  background: var(--mv-blue);
  color: #fff;
  border-radius: var(--mv-radius-sm);
  font-weight: 800;
}
.button:hover { background: #6f8bff; transform: translateY(-1px); }
.button:disabled { opacity: 0.55; cursor: wait; transform: none; }
.button-small { min-height: 2.75rem; padding: 0.6rem 0.9rem; font-size: 0.88rem; }
.button-secondary { background: var(--mv-panel-raised); color: var(--mv-text); border: 1px solid var(--mv-line); }
.button-secondary:hover { background: var(--mv-panel); }
.text-button, .back-button { padding: 0.55rem 0; background: transparent; color: var(--mv-blue); text-decoration: underline; text-underline-offset: 0.25em; }
.text-button-light { color: var(--mv-text); }
.back-button { display: inline-flex; margin-bottom: 2rem; color: var(--mv-muted); }

.hero { padding-block: clamp(4.5rem, 11vw, 9rem); background: radial-gradient(circle at 80% 25%, rgb(92 124 255 / 18%), transparent 28rem), var(--mv-bg-deep); }
.hero-grid { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(17rem, 0.55fr); gap: clamp(2rem, 6vw, 6rem); align-items: end; }
.hero-lead { margin: 1.75rem 0 0; color: var(--mv-muted); font-size: clamp(1.08rem, 2vw, 1.35rem); }
.hero-actions, .form-actions, .final-actions, .download-row { display: flex; flex-wrap: wrap; gap: 0.8rem 1rem; align-items: center; margin-top: 2rem; }
.hero-note { padding: 1.5rem; border: 1px solid var(--mv-line); border-radius: var(--mv-radius-md); background: var(--mv-panel); box-shadow: var(--mv-shadow); }
.hero-note p { margin: 1rem 0 0; }

.eyebrow { margin: 0 0 0.9rem; color: var(--mv-muted); font: 700 0.76rem/1.2 "IBM Plex Mono", Consolas, monospace; letter-spacing: 0.11em; text-transform: uppercase; }
.section { padding-block: var(--mv-section-space); }
.view h1[tabindex="-1"], .view h2[tabindex="-1"] { scroll-margin-top: 7rem; }
.section-deep { background: var(--mv-bg-deep); border-block: 1px solid var(--mv-line); }
.section-warm { background: var(--mv-warm); color: var(--mv-on-warm); }
.section-warm .eyebrow { color: #5d5a53; }
.section-final { padding-top: 0; }
.section-heading { margin-bottom: clamp(2rem, 5vw, 3.75rem); }
.section-heading h2 { max-width: 18ch; }

.situation-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.situation-card { display: flex; flex-direction: column; min-height: 19rem; padding: clamp(1.4rem, 3vw, 2.2rem); border: 1px solid var(--mv-line); border-radius: var(--mv-radius-md); background: var(--mv-panel); }
.situation-card-accent { border-color: rgb(92 124 255 / 70%); background: linear-gradient(145deg, rgb(92 124 255 / 12%), var(--mv-panel)); }
.situation-card p { color: var(--mv-muted); }
.card-number { margin-bottom: auto; color: var(--mv-blue); font: 700 0.78rem/1 "IBM Plex Mono", Consolas, monospace; }
.card-action { display: flex; justify-content: space-between; align-items: center; width: 100%; margin-top: auto; padding: 0.8rem 0; background: transparent; color: var(--mv-text); border-top: 1px solid var(--mv-line); text-align: left; font-weight: 750; }
.card-action:hover { color: var(--mv-blue); }

.proof-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.proof-panel { border: 1px solid var(--mv-line); border-radius: var(--mv-radius-md); background: var(--mv-panel); overflow: hidden; }
.proof-panel summary { min-height: 7rem; padding: 1.35rem; display: flex; justify-content: space-between; gap: 1rem; align-items: center; cursor: pointer; list-style: none; }
.proof-panel summary::-webkit-details-marker { display: none; }
.proof-panel summary small { display: block; margin-bottom: 0.35rem; color: var(--mv-muted); }
.proof-glance { display: flex; flex-wrap: wrap; gap: 0.35rem; margin-top: 0.75rem; }
.proof-glance .status { margin-right: 0; }
.proof-summary-line { display: block; margin-top: 0.45rem; color: var(--mv-muted); font-size: 0.82rem; line-height: 1.35; }
.summary-action { color: var(--mv-blue); font-size: 0.9rem; }
.proof-body { padding: 0 1.35rem 1.35rem; border-top: 1px solid var(--mv-line); }
.proof-state { margin-top: 1.25rem; }
.boundary { padding: 1rem; background: var(--mv-panel-raised); border-radius: var(--mv-radius-sm); color: var(--mv-muted); }
.status { display: inline-flex; align-items: center; min-height: 1.65rem; padding: 0.25rem 0.55rem; margin-right: 0.35rem; border-radius: 999px; font: 800 0.68rem/1 "IBM Plex Mono", Consolas, monospace; text-transform: uppercase; letter-spacing: 0.06em; }
.status-teal { color: var(--mv-teal); background: var(--mv-audit-bg); }
.status-muted { color: var(--mv-muted); background: var(--mv-panel-raised); }
.status-sand { color: var(--mv-on-warm); background: var(--mv-sand); }

.decision-layout, .trust-grid, .split-panel { display: grid; grid-template-columns: minmax(0, 1fr) minmax(18rem, 0.75fr); gap: clamp(2rem, 7vw, 7rem); align-items: start; }
.large-copy { margin: 0; color: var(--mv-muted); font-size: clamp(1.1rem, 2vw, 1.35rem); }
.trust-points { display: grid; gap: 1rem; }
.trust-points p { margin: 0; padding-bottom: 1rem; border-bottom: 1px solid rgb(17 19 24 / 18%); }
.split-panel > div:last-child p:first-child { margin-top: 0; }
.final-panel { padding: clamp(2rem, 6vw, 4rem); border-radius: var(--mv-radius-lg); background: var(--mv-blue); color: #fff; display: flex; justify-content: space-between; gap: 2rem; align-items: end; }
.final-panel .eyebrow { color: rgb(255 255 255 / 72%); }
.final-panel h2 { max-width: 16ch; }
.final-panel p { color: rgb(255 255 255 / 82%); }

.route-hero { padding-bottom: 2rem; border-bottom: 1px solid var(--mv-line); }
.route-hero h1 { font-size: clamp(2.4rem, 6vw, 4.8rem); }
.route-answer { margin-top: 1.5rem; color: var(--mv-muted); font-size: 1.2rem; }
.route-sections { display: grid; gap: 1rem; margin-top: 2rem; }
.route-block { padding: 1.4rem; border: 1px solid var(--mv-line); border-radius: var(--mv-radius-md); background: var(--mv-panel); }
.route-block h2 { font-size: 1.35rem; letter-spacing: -0.015em; }
.route-block p, .route-block li { color: var(--mv-muted); }
.route-block ul { padding-left: 1.2rem; }
.route-proof { border-left: 4px solid var(--mv-teal); }
.route-boundary { border-left: 4px solid var(--mv-sand); }
.route-actions { margin-top: 2rem; display: flex; flex-wrap: wrap; gap: 0.8rem; }

.form-shell { max-width: 48rem; }
.form-shell h1 { font-size: clamp(2.25rem, 6vw, 4.6rem); }
.form-context { color: var(--mv-muted); font-size: 1.08rem; }
.progress { margin: 2rem 0; }
.progress > span { display: block; margin-bottom: 0.55rem; color: var(--mv-muted); font-size: 0.85rem; }
.progress-track { height: 0.35rem; background: var(--mv-line); border-radius: 999px; overflow: hidden; }
.progress-track span { display: block; width: 25%; height: 100%; background: var(--mv-blue); transition: width var(--mv-motion-base); }
label { display: block; margin: 1.25rem 0 0.55rem; font-weight: 800; }
textarea, input, select {
  width: 100%;
  min-height: 3rem;
  padding: 0.85rem 0.95rem;
  border: 1px solid var(--mv-line);
  border-radius: var(--mv-radius-sm);
  background: var(--mv-panel);
  color: var(--mv-text);
}
textarea { resize: vertical; }
textarea:focus, input:focus, select:focus { border-color: var(--mv-blue); }
.field-help { margin: -0.25rem 0 0.75rem; color: var(--mv-muted); font-size: 0.9rem; }
.error-summary { margin-bottom: 1rem; padding: 1rem; border: 1px solid var(--mv-red); border-radius: var(--mv-radius-sm); background: var(--mv-risk-bg); color: #ffd8db; }
.summary-fields { margin-top: 2rem; }
.download-row { padding: 1.5rem 0; border-bottom: 1px solid var(--mv-line); }
.inline-status { color: var(--mv-teal); font-size: 0.9rem; }
.handoff-boundary { margin-top: 2rem; padding: clamp(1.35rem, 4vw, 2rem); border: 1px solid var(--mv-line); border-radius: var(--mv-radius-md); background: var(--mv-panel); }
.handoff-boundary h2 { font-size: 1.55rem; }
.field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.check-row { display: grid; grid-template-columns: 1.4rem 1fr; gap: 0.75rem; align-items: start; margin: 1.5rem 0; font-weight: 500; }
.check-row input { width: 1.3rem; min-height: 1.3rem; margin: 0.15rem 0 0; }

.result-panel { padding: clamp(1.5rem, 5vw, 3rem); border: 1px solid var(--mv-line); border-radius: var(--mv-radius-lg); background: var(--mv-panel); }
.result-panel h1 { font-size: clamp(2.2rem, 5vw, 4rem); }
.result-panel.success { border-color: var(--mv-teal); background: linear-gradient(145deg, var(--mv-audit-bg), var(--mv-panel)); }
.result-panel.error { border-color: var(--mv-red); background: linear-gradient(145deg, var(--mv-risk-bg), var(--mv-panel)); }
.result-panel.neutral { border-color: var(--mv-sand); }
.result-actions { display: flex; flex-wrap: wrap; gap: 0.8rem; margin-top: 2rem; }

.site-footer { border-top: 1px solid var(--mv-line); background: var(--mv-bg-deep); }
.footer-inner { min-height: 6rem; display: flex; justify-content: space-between; gap: 1rem; align-items: center; color: var(--mv-muted); font-size: 0.82rem; }

@media (max-width: 860px) {
  .primary-nav { display: none; }
  .hero-grid, .decision-layout, .trust-grid, .split-panel { grid-template-columns: 1fr; }
  .proof-grid { grid-template-columns: 1fr; }
  .hero-note { max-width: 34rem; }
  .final-panel { align-items: start; flex-direction: column; }
}

@media (max-width: 620px) {
  .notice-inner { align-items: flex-start; flex-direction: column; padding-block: 0.65rem; }
  .header-inner > .button { display: none; }
  .signature { font-size: 0.66rem; }
  .situation-grid, .field-grid { grid-template-columns: 1fr; }
  .situation-card { min-height: 16rem; }
  .hero-actions, .form-actions, .final-actions, .download-row, .result-actions { align-items: stretch; flex-direction: column; }
  .hero-actions .button, .form-actions .button, .final-actions .button, .download-row .button, .result-actions .button { width: 100%; }
  .text-button { align-self: flex-start; }
  .footer-inner { align-items: flex-start; flex-direction: column; justify-content: center; }
}

@media (prefers-reduced-motion: reduce) {
  :root { --mv-motion-fast: 0ms; --mv-motion-base: 0ms; }
  html { scroll-behavior: auto; }
}
