/* ==========================================================================
   Alpha-Bias marketing page - editorial / research-publication theme.
   Scoped to #view-landing and the editorial sub-pages (.view.edv: pricing, auth, support); the terminal is untouched.
   Light is the default; html[data-theme="dark"] switches every token (sun/moon toggle in the nav).
   ========================================================================== */

/* ---- 1. Tokens (the only place colours, type and spacing are defined) ---- */
#view-landing, .view.edv {
  --white: #FFFFFF;              /* page background */
  --black: #0A0A0A;              /* text */
  --navy: #0B1F4B;               /* buttons, accents, the inverted section */
  --on-navy: #FFFFFF;            /* text on navy, in both themes */
  --link: var(--navy);           /* links and small accents on the page background */
  --series: var(--navy);         /* chart series */
  --navy-dark: #071434;          /* hover state of navy buttons (darkened navy, not a new colour) */
  --muted: #555555;
  --line: #E5E5E5;
  --surface: #F7F7F8;
  /* semantic colours: data visualisations and data tables ONLY */
  --bull: #1B6B3A;
  --bear: #9B2226;
  --neutral: #8A6D1D;

  --serif: "Source Serif 4", Georgia, "Times New Roman", serif;
  --sans: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, "Consolas", monospace;

  --radius: 2px;
  --container: 1180px;
  --gutter: 24px;
  --s1: 8px; --s2: 16px; --s3: 24px; --s4: 32px; --s5: 48px; --s6: 80px; --s7: 120px;
  --section: 112px;

  color-scheme: light;
}
/* dark theme: same layout, inverted neutrals; navy lifted so it keeps contrast on a dark page */
html[data-theme="dark"] #view-landing, html[data-theme="dark"] .view.edv {
  --white: #0F1115; --black: #ECEEF2; --muted: #A3A9B3; --line: #262B33; --surface: #171B22;
  --navy: #2B4A8E; --navy-dark: #223D77; --link: #A9BCE8; --series: #7E9BDB;
  --bull: #5DBB7E; --bear: #E36A70; --neutral: #D4AE52;
  color-scheme: dark;
}
@media (max-width: 720px) { #view-landing, .view.edv { --section: 64px; } }

/* ---- 2. Base / reset ---- */
#view-landing { background: var(--white) !important; color: var(--black); font-family: var(--sans);
  font-size: 17px; line-height: 1.6; -webkit-font-smoothing: antialiased; min-height: 100vh; overflow-x: clip; }
#view-landing::before { content: none !important; }                 /* no grid layer on the marketing page */
#view-landing *, #view-landing *::before, #view-landing *::after { box-sizing: border-box; margin: 0; padding: 0; }
#view-landing a { color: var(--link); text-decoration: none; }
#view-landing a:hover { text-decoration: underline; text-underline-offset: 3px; }
#view-landing button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
#view-landing :focus-visible { outline: 2px solid var(--link); outline-offset: 2px; }
#view-landing ul, #view-landing ol { list-style: none; }
#view-landing img, #view-landing svg { display: block; max-width: 100%; }
#view-landing .mono, #view-landing .num { font-family: var(--mono); font-variant-numeric: tabular-nums; }
#view-landing .sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
#view-landing .skip { position: absolute; left: -9999px; top: 8px; background: var(--navy); color: var(--on-navy); padding: 8px 16px; border-radius: var(--radius); z-index: 100; }
#view-landing .skip:focus { left: 16px; }

/* ---- 3. Layout ---- */
#view-landing .container { max-width: var(--container); margin: 0 auto; padding: 0 var(--gutter); }
#view-landing .grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--gutter); }
#view-landing .grid > *, #view-landing .exhibit { min-width: 0; }      /* wide exhibits scroll inside their frame, never widen the page */
#view-landing section { padding: var(--section) 0; }
#view-landing section + section { border-top: 1px solid var(--line); }
#view-landing .measure { max-width: 70ch; }

/* ---- 4. Typography ---- */
#view-landing h1, #view-landing h2, #view-landing h3, #view-landing h4 { font-family: var(--serif); font-weight: 700; letter-spacing: -0.01em; color: var(--black); line-height: 1.12; }
#view-landing h1 { font-size: clamp(40px, 6vw, 68px); line-height: 1.04; }
#view-landing h2 { font-size: clamp(28px, 3.5vw, 40px); }
#view-landing h3 { font-size: 26px; }
#view-landing p { max-width: 70ch; }
#view-landing .lead { font-size: 19px; color: var(--muted); }
#view-landing .small { font-size: 14px; color: var(--muted); }
#view-landing .marker { font-family: var(--serif); font-style: italic; font-size: 17px; color: var(--muted); margin-bottom: var(--s2); }
#view-landing .note { font-family: var(--serif); font-style: italic; color: var(--muted); }
#view-landing .section-head { margin-bottom: var(--s5); }
#view-landing .section-head h2 { margin-bottom: var(--s2); }
#view-landing .section-head.center { text-align: center; }
#view-landing .section-head.center p { margin: 0 auto; }

/* ---- 5. Buttons ---- */
#view-landing .btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; font-family: var(--sans);
  font-weight: 600; font-size: 15px; line-height: 1; padding: 14px 22px; border-radius: var(--radius); border: 1px solid var(--navy);
  background: var(--navy); color: var(--on-navy); transition: background-color .15s; text-decoration: none; }
#view-landing .btn:hover { background: var(--navy-dark); text-decoration: none; }
#view-landing .btn-sm { padding: 10px 16px; font-size: 14px; }
#view-landing .btn-block { width: 100%; }
#view-landing .btn-inverse { background: var(--on-navy); color: var(--navy); border-color: var(--on-navy); }
#view-landing .btn-inverse:hover { background: var(--on-navy); opacity: .9; }
#view-landing .link { color: var(--link); font-weight: 500; text-decoration: underline; text-underline-offset: 3px; }
#view-landing .link:hover { text-decoration-thickness: 2px; }

/* ---- 6. Nav ---- */
#view-landing .site-header { position: sticky; top: 0; z-index: 50; background: var(--white); border-bottom: 1px solid var(--line); }
#view-landing .nav { display: flex; align-items: center; justify-content: space-between; height: 64px; gap: var(--s3); }
#view-landing .wordmark { font-family: var(--serif); font-weight: 700; font-size: 20px; letter-spacing: 0.04em; color: var(--black); }
#view-landing .wordmark:hover { text-decoration: none; }
#view-landing .nav-links { display: flex; gap: var(--s4); }
#view-landing .nav-links a { color: var(--black); font-size: 15px; }
#view-landing .nav-actions { display: flex; align-items: center; gap: var(--s3); }
#view-landing .nav-login { font-size: 15px; color: var(--black); }
#view-landing .nav-login:hover { text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 960px) { #view-landing .nav-links { display: none; } }

/* ---- 7. Hero ---- */
#view-landing .lp-hero { padding-top: var(--s6); }
#view-landing .hero-text { grid-column: span 6; align-self: center; }
#view-landing .hero-exhibit { grid-column: span 6; }
#view-landing .lp-hero h1 { margin-bottom: var(--s3); }
#view-landing .lp-hero .lead { margin-bottom: var(--s4); }
#view-landing .cta-row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s3); margin-bottom: var(--s3); }
#view-landing .lp-hero .note { margin-bottom: var(--s4); }
#view-landing .sources { font-size: 14px; color: var(--muted); border-top: 1px solid var(--line); padding-top: var(--s2); }
#view-landing .sources b { font-weight: 600; color: var(--black); }
@media (max-width: 960px) { #view-landing .hero-text, #view-landing .hero-exhibit { grid-column: 1 / -1; } }

/* ---- 8. Exhibit (figure + caption) ---- */
#view-landing .exhibit { border: 1px solid var(--line); border-radius: var(--radius); background: var(--white); }
#view-landing .exhibit-head { padding: var(--s2) var(--s2) 0; }
#view-landing .exhibit-title { font-family: var(--serif); font-weight: 700; font-size: 17px; letter-spacing: -0.01em; color: var(--black); }
#view-landing .exhibit-sub { font-size: 13px; color: var(--muted); }
#view-landing .exhibit-body { padding: var(--s2); overflow-x: auto; }
#view-landing .exhibit-body svg { width: 100%; height: auto; }
#view-landing figcaption { font-family: var(--serif); font-style: italic; font-size: 14px; color: var(--muted); padding: var(--s1) var(--s2) var(--s2); border-top: 1px solid var(--line); }
#view-landing figcaption b { font-style: normal; font-weight: 700; color: var(--black); }

/* SVG chart vocabulary (classes so colours stay in the token set) */
#view-landing .c-grid { stroke: var(--line); stroke-width: 1; }
#view-landing .c-axis { stroke: var(--black); stroke-width: 1; }
#view-landing .c-dash { stroke: var(--muted); stroke-width: 1; stroke-dasharray: 4 3; fill: none; }
#view-landing .c-navy { fill: var(--series); }
#view-landing .c-navy-line { stroke: var(--series); stroke-width: 2; fill: none; }
#view-landing .c-track { fill: var(--surface); }
#view-landing .c-bull { fill: var(--bull); } #view-landing .c-bear { fill: var(--bear); } #view-landing .c-neutral { fill: var(--neutral); }
#view-landing .s-bull { stroke: var(--bull); } #view-landing .s-bear { stroke: var(--bear); } #view-landing .s-neutral { stroke: var(--neutral); }
#view-landing .t-label { font-family: var(--sans); font-size: 14px; fill: var(--black); }
#view-landing .t-muted { font-family: var(--sans); font-size: 13px; fill: var(--muted); }
#view-landing .t-num { font-family: var(--mono); font-size: 14px; fill: var(--black); font-variant-numeric: tabular-nums; }
#view-landing .t-num-muted { font-family: var(--mono); font-size: 13px; fill: var(--muted); font-variant-numeric: tabular-nums; }
#view-landing .t-big { font-family: var(--serif); font-weight: 700; fill: var(--black); }
#view-landing .t-note { font-family: var(--serif); font-style: italic; font-size: 14px; fill: var(--muted); }
#view-landing .t-bull { fill: var(--bull); } #view-landing .t-bear { fill: var(--bear); } #view-landing .t-neutralc { fill: var(--neutral); }
#view-landing .marker-dot { fill: var(--navy); }
#view-landing .marker-num { font-family: var(--sans); font-weight: 600; font-size: 12px; fill: var(--on-navy); }

/* ---- 9. Data strip ---- */
#view-landing .data-strip { padding: 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
#view-landing .data-strip ul { display: grid; grid-template-columns: repeat(4, 1fr); }
#view-landing .data-strip li { padding: var(--s4) var(--s3); border-left: 1px solid var(--line); }
#view-landing .data-strip li:first-child { border-left: 0; padding-left: 0; }
#view-landing .figure { display: block; font-family: var(--serif); font-weight: 700; font-size: 36px; line-height: 1.1; font-variant-numeric: tabular-nums lining-nums; }
#view-landing .figure-label { font-size: 14px; color: var(--muted); }
@media (max-width: 720px) {
  #view-landing .data-strip ul { grid-template-columns: 1fr 1fr; }
  #view-landing .data-strip li:nth-child(3) { border-left: 0; padding-left: 0; }
  #view-landing .data-strip li:nth-child(n+3) { border-top: 1px solid var(--line); }
}

/* ---- 10. Feature rows ---- */
#view-landing .feature { align-items: center; }
#view-landing .feature + .feature { margin-top: var(--s6); }
#view-landing .feature-text { grid-column: span 5; }
#view-landing .feature-exhibit { grid-column: 7 / span 6; }
#view-landing .feature.rev .feature-text { grid-column: 8 / span 5; grid-row: 1; }
#view-landing .feature.rev .feature-exhibit { grid-column: 1 / span 6; grid-row: 1; }
#view-landing .feature h3 { margin-bottom: var(--s2); }
#view-landing .feature p { color: var(--muted); margin-bottom: var(--s3); }
#view-landing .dash-list li { position: relative; padding-left: 22px; margin-bottom: var(--s1); }
#view-landing .dash-list li::before { content: "\2013"; position: absolute; left: 0; color: var(--black); }
@media (max-width: 960px) {
  #view-landing .feature-text, #view-landing .feature-exhibit,
  #view-landing .feature.rev .feature-text, #view-landing .feature.rev .feature-exhibit { grid-column: 1 / -1; grid-row: auto; }
}

/* ---- 11. Full picture ---- */
#view-landing .legend { display: grid; grid-template-columns: repeat(5, 1fr); gap: var(--s2); padding: var(--s2); border-top: 1px solid var(--line); font-size: 14px; }
#view-landing .legend li { display: flex; gap: var(--s1); align-items: baseline; }
#view-landing .legend .k { font-family: var(--mono); font-weight: 500; color: var(--link); }
#view-landing .notes3 { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: var(--s5); }
#view-landing .notes3 li { padding: 0 var(--s3); border-left: 1px solid var(--line); }
#view-landing .notes3 li:first-child { border-left: 0; padding-left: 0; }
#view-landing .notes3 h4 { font-size: 20px; margin-bottom: var(--s1); }
#view-landing .notes3 p { color: var(--muted); font-size: 16px; }
@media (max-width: 860px) {
  #view-landing .legend { grid-template-columns: 1fr 1fr; }
  #view-landing .notes3 { grid-template-columns: 1fr; gap: var(--s3); }
  #view-landing .notes3 li { border-left: 0; padding: 0; }
}

/* ---- 12. Research table (methodology) ---- */
#view-landing .table-wrap { overflow-x: auto; border-top: 2px solid var(--black); border-bottom: 1px solid var(--black); }
#view-landing table { width: 100%; border-collapse: collapse; min-width: 640px; font-size: 15px; }
#view-landing caption { text-align: left; font-family: var(--serif); font-weight: 700; font-size: 17px; padding: var(--s2) 0 var(--s1); caption-side: top; }
#view-landing th { font-family: var(--serif); font-weight: 700; text-align: left; padding: 12px 16px 12px 0; border-bottom: 1px solid var(--black); font-size: 15px; }
#view-landing td { padding: 12px 16px 12px 0; border-bottom: 1px solid var(--line); vertical-align: top; }
#view-landing tr:last-child td { border-bottom: 0; }
#view-landing td.num, #view-landing th.num { text-align: right; }
#view-landing td.num { font-family: var(--mono); font-variant-numeric: tabular-nums; }
#view-landing .table-note { font-family: var(--serif); font-style: italic; font-size: 14px; color: var(--muted); margin-top: var(--s2); }
#view-landing .meth-grid { margin-top: var(--s5); }
#view-landing .meth-grid > div { grid-column: span 4; }
#view-landing .meth-grid h3 { font-size: 20px; margin-bottom: var(--s1); }
#view-landing .meth-grid p { color: var(--muted); font-size: 16px; }
#view-landing .meth-link { margin-top: var(--s4); }
@media (max-width: 860px) { #view-landing .meth-grid > div { grid-column: 1 / -1; } }

/* ---- 13. How it works ---- */
#view-landing .steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--gutter); position: relative; counter-reset: none; }
#view-landing .steps::before { content: ""; position: absolute; left: 0; right: 0; top: 22px; border-top: 1px solid var(--black); }
#view-landing .step { position: relative; padding-right: var(--s3); }
#view-landing .step-no { display: inline-block; background: var(--white); padding-right: var(--s2); font-family: var(--serif); font-weight: 700; font-size: 34px; line-height: 44px; font-variant-numeric: lining-nums; }
#view-landing .step h3 { font-size: 22px; margin: var(--s2) 0 var(--s1); }
#view-landing .step p { color: var(--muted); font-size: 16px; }
@media (max-width: 860px) { #view-landing .steps { grid-template-columns: 1fr; } #view-landing .steps::before { display: none; } }

/* ---- 14. Pricing ---- */
#view-landing .price-card { max-width: 520px; margin: 0 auto; border: 1px solid var(--black); border-radius: var(--radius); padding: var(--s5); background: var(--white); }
#view-landing .price-amount { font-family: var(--serif); font-weight: 700; font-size: 56px; line-height: 1; font-variant-numeric: lining-nums; }
#view-landing .price-per { font-family: var(--serif); font-size: 22px; color: var(--muted); }
#view-landing .price-desc { color: var(--muted); margin: var(--s2) 0 var(--s4); }
#view-landing .check-list { margin-bottom: var(--s4); }
#view-landing .check-list li { position: relative; padding: 8px 0 8px 30px; border-top: 1px solid var(--line); font-size: 16px; }
#view-landing .check-list li:last-child { border-bottom: 1px solid var(--line); }
#view-landing .check-list svg { position: absolute; left: 0; top: 13px; width: 16px; height: 16px; }
#view-landing .check-list path { stroke: var(--link); stroke-width: 2; fill: none; }
#view-landing .fine { text-align: center; font-size: 14px; color: var(--muted); margin-top: var(--s2); }

/* ---- 15. FAQ accordion ---- */
#view-landing .faq { max-width: 820px; margin: 0 auto; border-top: 1px solid var(--line); }
#view-landing .faq-item { border-bottom: 1px solid var(--line); }
#view-landing .faq-q { width: 100%; display: flex; justify-content: space-between; align-items: center; gap: var(--s3); text-align: left;
  padding: var(--s3) 0; font-family: var(--serif); font-weight: 700; font-size: 20px; color: var(--black); }
#view-landing .faq-sign { font-family: var(--mono); font-weight: 500; font-size: 22px; color: var(--link); flex: none; width: 20px; text-align: center; }
#view-landing .faq-a { padding: 0 0 var(--s3); color: var(--muted); }
#view-landing .faq-a[hidden] { display: none; }

/* ---- 16. Final CTA (the only inverted section) ---- */
#view-landing .final { background: var(--navy); color: var(--on-navy); border-top: 0; }
#view-landing .final h2 { color: var(--on-navy); margin-bottom: var(--s2); }
#view-landing .final p { color: var(--on-navy); opacity: .85; margin-bottom: var(--s4); }
#view-landing .final .link { color: var(--on-navy); }
#view-landing .final :focus-visible { outline-color: var(--on-navy); }
#view-landing section.final + footer { border-top: 0; }

/* ---- 17. Footer ---- */
#view-landing .site-footer { padding: var(--s6) 0 var(--s5); border-top: 1px solid var(--line); font-size: 15px; }
#view-landing .foot-top { display: flex; justify-content: space-between; gap: var(--s4); flex-wrap: wrap; padding-bottom: var(--s4); border-bottom: 1px solid var(--line); }
#view-landing .foot-links { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s2) var(--s4); }
#view-landing .foot-links a, #view-landing .foot-links button { color: var(--black); font-size: 15px; line-height: 1.6; padding: 0; }
#view-landing .foot-links button:hover { text-decoration: underline; text-underline-offset: 3px; }
#view-landing .disclaimer { max-width: 90ch; font-size: 14px; color: var(--muted); padding-top: var(--s3); }
#view-landing .copyright { font-size: 13px; color: var(--muted); margin-top: var(--s2); }

/* ---- 18. Motion: one 150 ms fade, only with JS, never with reduced motion ---- */
#view-landing.js-fade .fade { opacity: 0; transition: opacity .15s linear; }
#view-landing.js-fade .fade.in { opacity: 1; }
@media (prefers-reduced-motion: reduce) { #view-landing.js-fade .fade { opacity: 1; transition: none; } }

/* ---- 19. Small screens ---- */
@media (max-width: 480px) {
  #view-landing { --gutter: 16px; }
  #view-landing .price-card { padding: var(--s3); }
  #view-landing .btn { width: 100%; }
  #view-landing .nav .btn { width: auto; }
  #view-landing .cta-row { flex-direction: column; align-items: stretch; }
  #view-landing .cta-row .link { text-align: center; }
  #view-landing .wordmark { font-size: 17px; letter-spacing: 0.02em; }
  #view-landing .nav-actions { gap: var(--s2); }
  #view-landing .nav .btn-sm { padding: 9px 12px; }
}
/* exhibits keep their drawn size on small screens and scroll inside their own frame (text never below 12px) */
#view-landing .w560 { min-width: 520px; }
#view-landing .w1100 { min-width: 960px; }


/* ---- 20. Theme toggle (sun / moon) ---- */
#view-landing .theme-toggle, .view.edv .theme-toggle { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; flex: none;
  border: 1px solid var(--line); border-radius: var(--radius); background: transparent; color: var(--black); cursor: pointer; }
#view-landing .theme-toggle:hover, .view.edv .theme-toggle:hover { border-color: var(--black); }
#view-landing .theme-toggle:focus-visible, .view.edv .theme-toggle:focus-visible { outline: 2px solid var(--link); outline-offset: 2px; }
#view-landing .theme-toggle svg, .view.edv .theme-toggle svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
#view-landing .theme-toggle .i-sun, .view.edv .theme-toggle .i-sun { display: none; }
html[data-theme="dark"] #view-landing .theme-toggle .i-sun, html[data-theme="dark"] .view.edv .theme-toggle .i-sun { display: block; }
html[data-theme="dark"] #view-landing .theme-toggle .i-moon, html[data-theme="dark"] .view.edv .theme-toggle .i-moon { display: none; }

/* ---- 21. Editorial sub-pages: pricing, auth, support (.view.edv) ---- */
.view.edv { background: var(--white) !important; color: var(--black); font-family: var(--sans); font-size: 17px; line-height: 1.6;
  -webkit-font-smoothing: antialiased; min-height: 100vh; }
.view.edv::before { content: none !important; }
:where(.view.edv) *, :where(.view.edv) *::before, :where(.view.edv) *::after { box-sizing: border-box; margin: 0; padding: 0; }   /* zero specificity: component rules always win */
:where(.view.edv) a { color: var(--link); text-decoration: none; }
:where(.view.edv) a:hover { text-decoration: underline; text-underline-offset: 3px; }
:where(.view.edv) button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; letter-spacing: normal; text-transform: none; }
.view.edv :focus-visible { outline: 2px solid var(--link); outline-offset: 2px; }
:where(.view.edv) ul { list-style: none; }
:where(.view.edv) h1, :where(.view.edv) h2 { font-family: var(--serif); font-weight: 700; letter-spacing: -0.01em; color: var(--black); line-height: 1.12; }
:where(.view.edv) h1 { font-size: clamp(34px, 5vw, 52px); margin-bottom: var(--s2); }
:where(.view.edv) h2 { font-size: 20px; margin-bottom: var(--s1); }
.ed-container { max-width: var(--container); margin: 0 auto; padding: 0 var(--gutter); }
.ed-header { position: sticky; top: 0; z-index: 50; background: var(--white); border-bottom: 1px solid var(--line); }
.ed-nav { display: flex; align-items: center; justify-content: space-between; height: 64px; gap: var(--s3); }
.view.edv .ed-wordmark { font-family: var(--serif); font-weight: 700; font-size: 20px; letter-spacing: 0.04em; color: var(--black); }
.ed-nav-actions { display: flex; align-items: center; gap: var(--s3); }
.view.edv .ed-navlink { font-size: 15px; color: var(--black); }
.view.edv .ed-navlink:hover { text-decoration: underline; text-underline-offset: 3px; }
.ed-page { padding-top: var(--s6); padding-bottom: var(--s7); }
.ed-page-head { margin-bottom: var(--s5); max-width: 70ch; }
.ed-page-head.ed-center { text-align: center; margin-left: auto; margin-right: auto; }
.ed-marker { font-family: var(--serif); font-style: italic; color: var(--muted); margin-bottom: var(--s2); }
.ed-lead { font-size: 19px; color: var(--muted); }
.ed-muted { color: var(--muted); font-size: 15px; }
.view.edv .ed-back { color: var(--link); font-size: 15px; margin-bottom: var(--s4); }
.view.edv .ed-back:hover { text-decoration: underline; text-underline-offset: 3px; }
.ed-card { border: 1px solid var(--line); border-radius: var(--radius); background: var(--white); padding: var(--s4); }
.ed-split { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--s5); align-items: start; }
.ed-aside h2 { margin-top: var(--s3); }
.ed-aside h2:first-child { margin-top: 0; }
.ed-aside p { color: var(--black); margin-bottom: var(--s2); }
@media (max-width: 860px) { .ed-split { grid-template-columns: 1fr; } }
.ed-field { margin-bottom: var(--s3); }
.ed-field label { display: block; font-size: 14px; font-weight: 600; margin-bottom: 6px; color: var(--black); letter-spacing: normal; text-transform: none; }
.view.edv input, .view.edv textarea { width: 100%; font: inherit; font-size: 16px; color: var(--black); background: var(--white);
  border: 1px solid var(--line); border-radius: var(--radius); padding: 11px 12px; outline: none; box-shadow: none; letter-spacing: normal; }
.view.edv input::placeholder, .view.edv textarea::placeholder { color: var(--muted); opacity: .8; }
.view.edv input:focus, .view.edv textarea:focus { border-color: var(--link); outline: 1px solid var(--link); outline-offset: 0; }
.view.edv textarea { resize: vertical; min-height: 140px; }
.view.edv .ed-btn { display: inline-flex; align-items: center; justify-content: center; font-family: var(--sans); font-weight: 600; font-size: 15px;
  line-height: 1; padding: 14px 22px; border-radius: var(--radius); border: 1px solid var(--navy); background: var(--navy);
  color: var(--on-navy); transition: background-color .15s; }
.view.edv .ed-btn:hover { background: var(--navy-dark); }
.view.edv .ed-btn:disabled { opacity: .6; cursor: default; }
.view.edv .ed-btn-block { width: 100%; }
.view.edv .ed-btn-outline { background: transparent; color: var(--link); border-color: var(--line); flex: none; }
.view.edv .ed-btn-outline:hover { background: transparent; border-color: var(--black); }
.ed-link { color: var(--link); text-decoration: underline; text-underline-offset: 3px; }
.view.edv .ed-inline-link { color: var(--link); text-decoration: underline; text-underline-offset: 3px; font-size: inherit; }
.ed-fine { text-align: center; font-size: 14px; color: var(--muted); margin-top: var(--s2); }
.view.edv .ed-status, .view.edv .auth-msg, .view.edv .promo-msg { font-size: 14px; min-height: 22px; margin-top: var(--s1); color: var(--muted);
  text-align: left; letter-spacing: normal; font-family: var(--sans); }
/* form feedback is the one UI place where the muted semantic colours appear */
.view.edv .ed-status.err, .view.edv .auth-msg.err, .view.edv .promo-msg.err { color: var(--bear); }
.view.edv .ed-status.ok, .view.edv .auth-msg.ok, .view.edv .promo-msg.ok { color: var(--bull); }
/* pricing */
.ed-price-card { max-width: 520px; margin: 0 auto; border-color: var(--black); padding: var(--s5); }
.ed-plan { font-family: var(--serif); font-style: italic; color: var(--muted); }
.ed-price { font-family: var(--serif); font-weight: 700; font-size: 56px; line-height: 1.05; font-variant-numeric: lining-nums tabular-nums; }
.ed-cur { font-size: 34px; vertical-align: 14px; margin-right: 2px; }
.ed-per { font-size: 22px; font-weight: 400; color: var(--muted); }
.ed-orig { font-size: 14px; color: var(--muted); min-height: 20px; }
.ed-checks { margin: var(--s3) 0; }
.ed-checks li { position: relative; padding: 8px 0 8px 30px; border-top: 1px solid var(--line); font-size: 16px; }
.ed-checks li:last-child { border-bottom: 1px solid var(--line); }
.ed-checks svg { position: absolute; left: 0; top: 13px; width: 16px; height: 16px; }
.ed-checks path { stroke: var(--link); stroke-width: 2; fill: none; }
.ed-promo-row { display: flex; gap: var(--s1); }
.ed-promo-row input { text-transform: uppercase; }
@media (max-width: 480px) { .ed-price-card { padding: var(--s3); } .ed-card { padding: var(--s3); } .ed-price { font-size: 46px; } }
/* auth */
.ed-auth-card { max-width: 440px; margin: 0 auto; }
.view.edv .ed-auth-title { font-size: 32px; margin-bottom: var(--s3); }
.ed-tabs { display: flex; border-bottom: 1px solid var(--line); margin-bottom: var(--s4); }
.view.edv .ed-tab { padding: 10px 0; margin-right: var(--s4); font-size: 15px; color: var(--muted); border-bottom: 2px solid transparent; margin-bottom: -1px; }
.view.edv .ed-tab.active { color: var(--black); border-bottom-color: var(--black); font-weight: 600; }