
/* ====================================================================
   Terra Vita FieldTrace — Family Alignment Layer v2026.05.13
   Uses the Terra Vita Global / Hub institutional family system while
   preserving FieldTrace routes, consoles and backend behaviours.
   ==================================================================== */

:root {
  --ink: #0a2a43;
  --ink-deep: #051a2c;
  --ink-700: #0f3b5c;
  --ink-soft: rgba(10, 42, 67, 0.68);
  --ink-faint: rgba(10, 42, 67, 0.18);
  --paper: #f9f5e9;
  --paper-pure: #fefcf3;
  --paper-warm: #f1ead7;
  --cream: #fffdf6;
  --accent: #2d4a3e;
  --accent-warm: #8b6b3f;
  --rule: #0a2a43;
  --rule-soft: rgba(10, 42, 67, 0.15);
  --boundary: #b3261e;
  --success: #1e7f4f;
  --warning: #8b6b3f;
  --track: 0.18em;
  --mono: "JetBrains Mono", "SFMono-Regular", Consolas, "Liberation Mono", Menlo, ui-monospace, monospace;
  --sans: "DM Sans", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --serif: "Fraunces", ui-serif, Georgia, "Times New Roman", serif;
}

html { scroll-padding-top: 82px; }
body { background-color: var(--paper) !important; color: var(--ink) !important; }
body::before { opacity: 0.23 !important; }
::selection { background: var(--ink); color: var(--cream); }
:focus-visible { outline: 2px solid var(--accent) !important; outline-offset: 3px; }

/* ---------------------------- Homepage ---------------------------- */
.ft-home .tvg-logo-name { white-space: nowrap; }
.ft-home .tvg-hero h1 { max-width: 13.5ch; }
.ft-home .tvg-hero-aside strong { color: var(--ink); }
.ft-home .tvg-section-lead a { color: var(--ink); }
.ft-home .tvg-route-step.protected { background: var(--ink); color: var(--cream); }
.ft-home .tvg-route-step.protected h3,
.ft-home .tvg-route-step.protected p,
.ft-home .tvg-route-step.protected .tvg-route-num { color: var(--cream); }
.ft-home .tvg-route-step.protected .tvg-route-num { opacity: .82; }

.ft-family-banner {
  border-top: 1px solid var(--ink);
  border-bottom: 1px solid var(--ink);
  background: rgba(255, 253, 246, .38);
  margin-top: 36px;
}
.ft-family-banner-inner {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 20px;
  align-items: center;
  padding: 18px 0;
}
.ft-family-banner p { margin: 0; color: var(--ink-soft); max-width: 76ch; }
.ft-family-banner strong { color: var(--ink); }
.ft-operator-band {
  border: 1px solid var(--ink);
  background:
    linear-gradient(135deg, rgba(10,42,67,.04), rgba(45,74,62,.05)),
    rgba(255,253,246,.44);
  padding: clamp(22px, 4vw, 34px);
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, .46fr);
  gap: clamp(20px, 4vw, 36px);
  align-items: start;
}
.ft-operator-band h3,
.ft-form-card h3,
.ft-side-card h3,
.ft-map-card h3,
.ft-table-card h3 { margin-top: 0; }
.ft-operator-actions,
.ft-action-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  margin-top: 20px;
}
.ft-operator-note {
  border-left: 2px solid var(--accent);
  padding-left: 14px;
  color: var(--ink-soft);
  font: 500 12px/1.55 var(--mono);
  text-transform: uppercase;
  letter-spacing: .08em;
}
.ft-flow-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  border: 1px solid var(--ink);
  background: var(--ink);
}
.ft-flow-card {
  background: var(--paper);
  padding: 22px;
  min-height: 190px;
}
.ft-flow-card h3 { font-size: 25px; margin: 14px 0 12px; }
.ft-flow-card p { color: var(--ink-soft); margin: 0; }
.ft-flow-card.dark { background: var(--ink); color: var(--cream); }
.ft-flow-card.dark h3,
.ft-flow-card.dark p,
.ft-flow-card.dark .tvg-eyebrow { color: var(--cream); }
.ft-map-card,
.ft-form-card,
.ft-side-card,
.ft-table-card {
  border: 1px solid var(--ink);
  background: rgba(255,253,246,.42);
  padding: clamp(20px, 4vw, 30px);
}
.ft-map-card figure { margin: 0; }
.ft-map-card img { border: 1px solid var(--rule-soft); background: var(--cream); width: 100%; }
.ft-map-card figcaption {
  margin-top: 12px;
  color: var(--ink-soft);
  font: 500 11px/1.55 var(--mono);
  text-transform: uppercase;
  letter-spacing: .08em;
}
.ft-access-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(290px, .55fr);
  gap: 22px;
  align-items: start;
}
.ft-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.ft-form-row.full { grid-column: 1 / -1; }
.ft-form-card label {
  display: block;
  margin: 0 0 7px;
  color: var(--ink-soft);
  font: 500 11px/1 var(--mono);
  letter-spacing: .12em;
  text-transform: uppercase;
}
.ft-form-card input,
.ft-form-card select,
.ft-form-card textarea {
  width: 100%;
  border: 1px solid var(--rule-soft);
  background: rgba(255,253,246,.72);
  color: var(--ink);
  padding: 12px 13px;
  font: 400 15px/1.45 var(--sans);
  border-radius: 0;
}
.ft-form-card textarea { min-height: 118px; resize: vertical; }
.ft-form-card input:focus,
.ft-form-card select:focus,
.ft-form-card textarea:focus { border-color: var(--ink); outline: 2px solid rgba(45,74,62,.18); }
.ft-form-actions { margin-top: 18px; display: flex; justify-content: space-between; gap: 16px; align-items: center; flex-wrap: wrap; }
.ft-form-note { color: var(--ink-soft); font: 500 11px/1.4 var(--mono); text-transform: uppercase; letter-spacing: .08em; }
.ft-form-success,
.ft-form-error {
  margin-top: 18px;
  padding: 14px 16px;
  border-left: 3px solid var(--success);
  background: rgba(30,127,79,.08);
  color: var(--ink);
}
.ft-form-error { border-left-color: var(--boundary); background: rgba(179,38,30,.08); }
.ft-form-success[hidden],
.ft-form-error[hidden],
.hp-field { display: none !important; }
.ft-side-list { margin-top: 14px; border-top: 1px solid var(--rule-soft); }
.ft-side-row {
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 12px;
  border-bottom: 1px solid var(--rule-soft);
  padding: 10px 0;
}
.ft-side-row strong,
.ft-table th {
  color: var(--ink-soft);
  font: 500 10.5px/1.4 var(--mono);
  text-transform: uppercase;
  letter-spacing: .08em;
}
.ft-side-row span { color: var(--ink); word-break: break-word; }
.ft-table-wrap { overflow-x: auto; border: 1px solid var(--rule-soft); background: rgba(255,253,246,.42); }
.ft-table { width: 100%; border-collapse: collapse; min-width: 760px; }
.ft-table th,
.ft-table td { text-align: left; vertical-align: top; border-bottom: 1px solid var(--rule-soft); padding: 13px 14px; }
.ft-table tbody tr:last-child td { border-bottom: 0; }
.ft-table td { color: var(--ink); font-size: 14px; }
.ft-code,
.ft-table .code { font-family: var(--mono); font-size: 12px; color: var(--ink-700); word-break: break-word; }
.ft-strong { font-weight: 600; }
.req { color: var(--boundary); }

/* ---------------------------- Legacy route family skin ---------------------------- */
.ft-legacy {
  --paper: #f9f5e9;
  --paper2: #f1ead7;
  --paper-deep: #f1ead7;
  --edge: rgba(10,42,67,.16);
  --ink: #0a2a43;
  --soft: rgba(10,42,67,.68);
  --faint: rgba(10,42,67,.48);
  --clay: #2d4a3e;
  --clay2: #0f3b5c;
  --moss: #2d4a3e;
  --ok: #1e7f4f;
  --good: #1e7f4f;
  --warn: #8b6b3f;
  --bad: #b3261e;
  --mono: "JetBrains Mono", "SFMono-Regular", Consolas, "Liberation Mono", Menlo, ui-monospace, monospace;
  --sans: "DM Sans", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --serif: "Fraunces", ui-serif, Georgia, "Times New Roman", serif;
  background: var(--paper) !important;
  color: var(--ink) !important;
  font-family: var(--sans) !important;
}
.ft-legacy body,
body.ft-legacy { font-family: var(--sans) !important; }
.ft-legacy p { margin: 0 0 .72rem; }
.ft-legacy a { color: inherit; }
.ft-legacy .top,
.ft-legacy .masthead {
  position: sticky;
  top: 0;
  z-index: 40;
  background: rgba(249,245,233,.92) !important;
  backdrop-filter: saturate(150%) blur(10px);
  -webkit-backdrop-filter: saturate(150%) blur(10px);
  border-bottom: 1px solid var(--ink) !important;
  box-shadow: 0 8px 24px -16px rgba(10,42,67,.18);
}
.ft-legacy .top { padding: 15px clamp(18px,4vw,34px) !important; }
.ft-legacy .masthead { padding: 13px clamp(18px,4vw,34px) !important; }
.ft-legacy .brand,
.ft-legacy .masthead .crest,
.ft-legacy h1,
.ft-legacy .page-title,
.ft-legacy .notfound-num,
.ft-legacy .receipt h1 {
  font-family: var(--serif) !important;
  color: var(--ink) !important;
  letter-spacing: -0.018em;
}
.ft-legacy .brand span,
.ft-legacy .eyebrow,
.ft-legacy .small,
.ft-legacy label,
.ft-legacy .page-num,
.ft-legacy .page-meta,
.ft-legacy .notfound-label,
.ft-legacy .receipt-stamp,
.ft-legacy .section-num,
.ft-legacy .k,
.ft-legacy .ck {
  font-family: var(--mono) !important;
  color: var(--accent) !important;
  letter-spacing: .12em !important;
}
.ft-legacy .nav { gap: 9px !important; }
.ft-legacy .nav a {
  border: 1px solid var(--rule-soft) !important;
  background: rgba(255,253,246,.48) !important;
  color: var(--ink) !important;
  padding: 8px 10px !important;
  text-decoration: none !important;
  transition: all 180ms ease;
}
.ft-legacy .nav a:hover,
.ft-legacy .nav a.active { background: var(--ink) !important; border-color: var(--ink) !important; color: var(--cream) !important; }
.ft-legacy .wrap,
.ft-legacy .doc { max-width: 1260px !important; }
.ft-legacy .doc { padding-top: 54px !important; }
.ft-legacy .hero {
  border-bottom: 1px solid var(--ink) !important;
  padding-top: 34px !important;
}
.ft-legacy h1 em,
.ft-legacy h2 em,
.ft-legacy h3 em,
.ft-legacy .page-title em,
.ft-legacy .notfound-num em { color: var(--accent) !important; }
.ft-legacy .lead { color: var(--ink-soft) !important; }
.ft-legacy .panel,
.ft-legacy .status-panel,
.ft-legacy .metric,
.ft-legacy .item,
.ft-legacy .card,
.ft-legacy .node,
.ft-legacy .receipt,
.ft-legacy .callout,
.ft-legacy .kv,
.ft-legacy .ref,
.ft-legacy .notfound {
  border-color: var(--rule-soft) !important;
  background: rgba(255,253,246,.44) !important;
  box-shadow: 0 20px 46px -38px rgba(10,42,67,.35);
}
.ft-legacy .panel { border-color: var(--ink) !important; }
.ft-legacy .panel.soft { border-color: var(--rule-soft) !important; }
.ft-legacy .metric strong { font-family: var(--serif) !important; color: var(--ink) !important; }
.ft-legacy .metric span { color: var(--ink-soft) !important; }
.ft-legacy button,
.ft-legacy .button,
.ft-legacy .form-submit,
.ft-legacy .topnav .cta,
.ft-legacy .back-link {
  border: 1px solid var(--ink) !important;
  background: var(--ink) !important;
  color: var(--cream) !important;
  font-family: var(--mono) !important;
  text-transform: uppercase;
  letter-spacing: .10em;
  transition: all 180ms ease;
}
.ft-legacy button:hover,
.ft-legacy .button:hover,
.ft-legacy .form-submit:hover,
.ft-legacy .back-link:hover { background: var(--ink-deep) !important; transform: translateY(-1px); }
.ft-legacy button.secondary,
.ft-legacy .secondary {
  background: transparent !important;
  color: var(--ink) !important;
  border-color: var(--rule-soft) !important;
}
.ft-legacy button.secondary:hover,
.ft-legacy .secondary:hover { background: var(--ink) !important; color: var(--cream) !important; border-color: var(--ink) !important; }
.ft-legacy input,
.ft-legacy select,
.ft-legacy textarea {
  border: 1px solid var(--rule-soft) !important;
  background: rgba(255,253,246,.70) !important;
  color: var(--ink) !important;
  font-family: var(--sans) !important;
}
.ft-legacy input:focus,
.ft-legacy select:focus,
.ft-legacy textarea:focus { border-color: var(--ink) !important; outline: 2px solid rgba(45,74,62,.18) !important; }
.ft-legacy .tag {
  border-color: var(--rule-soft) !important;
  background: rgba(255,253,246,.35);
  color: var(--ink-soft) !important;
  font-family: var(--mono) !important;
}
.ft-legacy .tag.ok { border-color: rgba(30,127,79,.45) !important; color: var(--success) !important; }
.ft-legacy .tag.warn { border-color: rgba(139,107,63,.50) !important; color: var(--warning) !important; }
.ft-legacy .tag.bad { border-color: rgba(179,38,30,.48) !important; color: var(--boundary) !important; }
.ft-legacy .notice { border-left-color: var(--accent) !important; background: rgba(45,74,62,.08) !important; color: var(--ink) !important; }
.ft-legacy .notice.warn { border-left-color: var(--warning) !important; background: rgba(139,107,63,.10) !important; }
.ft-legacy .notice.bad,
.ft-legacy .danger { border-left-color: var(--boundary) !important; background: rgba(179,38,30,.08) !important; }
.ft-legacy .notice.good,
.ft-legacy .notice.ok,
.ft-legacy .success { border-left-color: var(--success) !important; background: rgba(30,127,79,.08) !important; }
.ft-legacy .json,
.ft-legacy .log,
.ft-legacy pre,
.ft-legacy .mono,
.ft-legacy code { font-family: var(--mono) !important; }
.ft-legacy .json,
.ft-legacy .log,
.ft-legacy pre { border-color: var(--rule-soft) !important; background: rgba(5,26,44,.045) !important; color: var(--ink) !important; }
.ft-legacy .row,
.ft-legacy .rows,
.ft-legacy .table th,
.ft-legacy .table td,
.ft-legacy table th,
.ft-legacy table td { border-color: var(--rule-soft) !important; }
.ft-legacy table { border-color: var(--rule-soft) !important; }
.ft-legacy .footer,
.ft-legacy footer {
  border-top-color: var(--ink) !important;
  color: var(--ink-soft) !important;
}
.ft-legacy .masthead .crest .dot { background: var(--accent) !important; }
.ft-legacy .prose h2 { border-bottom-color: var(--rule-soft) !important; }
.ft-legacy .prose h2::before { color: var(--accent) !important; }
.ft-legacy .prose p,
.ft-legacy .prose li { color: var(--ink) !important; }
.ft-legacy .prose a,
.ft-legacy footer a { color: var(--ink) !important; }
.ft-legacy .chain { gap: 10px !important; }
.ft-legacy .arrow { color: var(--accent) !important; }

/* Consolidated table styling for app consoles */
.ft-legacy .review-table,
.ft-legacy .table,
.ft-legacy table { border-collapse: collapse; }
.ft-legacy th,
.ft-legacy td { text-align: left; }
.ft-legacy th { color: var(--ink-soft) !important; font-family: var(--mono) !important; text-transform: uppercase; letter-spacing: .08em; }

@media (max-width: 960px) {
  .ft-family-banner-inner,
  .ft-operator-band,
  .ft-access-grid { grid-template-columns: 1fr; }
  .ft-flow-grid { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .ft-form-grid { grid-template-columns: 1fr; }
  .ft-side-row { grid-template-columns: 1fr; }
  .ft-home .tvg-hero h1 { max-width: none; }
}

/* Legal/prose list restoration after shared reset */
.ft-legacy .prose ul,
.ft-legacy .prose ol {
  grid-column: 2;
  list-style: disc;
  padding-left: 1.25rem;
  margin: 0 0 18px;
}
.ft-legacy .prose ol { list-style: decimal; }
.ft-legacy .prose li { margin: 0 0 8px; }
.ft-legacy address { font-style: normal; }
