/* Crown Intelligence — Signal shell
   Fonts: Fraunces (serif, display/numerals) + Inter (sans, body/UI).
   Palette: CSS variables, dark default, light via html[data-theme="light"].
   See assets/SHELL.md for how to build a page on this shell. */

:root{
  --ink:#f2efe9; --ink-dim:#b9b4ab; --ink-faint:#87847d;
  --bg-0:#0a0b0d; --bg-1:#101215; --bg-2:#15181c; --line:#2a2d31;
  --cyan:#5fd7d1; --amber:#d9a441; --focus:#7fe3ff;
  --good:#5fd7a1; --bad:#e88a8a; --mid:#d9a441;
  --serif:'Fraunces', Georgia, serif;
  --sans:'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --mono:'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  /* hero always sits on a dark full-bleed band with the video: pinned colours, both modes */
  --hero-ink:#f2efe9; --hero-ink-dim:#b9b4ab; --hero-ink-faint:#87847d;
  --beat-ink:#f6e8cc; --beat-ink-dim:#e3d4b4; --beat-ink-faint:#b8ab8f;
  --hero-cyan:#5fd7d1; --hero-amber:#d9a441;
  color-scheme: dark;
}
html[data-theme="light"]{
  --ink:#1c1b18; --ink-dim:#4a473f; --ink-faint:#726d61;
  --beat-ink:var(--ink); --beat-ink-dim:var(--ink-dim); --beat-ink-faint:var(--ink-faint);
  --bg-0:#faf9f6; --bg-1:#f1efe8; --bg-2:#e8e4d9; --line:#ddd7c9;
  --cyan:#0d7d76; --amber:#8a5a12; --focus:#0077b6;
  --good:#1c7a3e; --bad:#a3372e; --mid:#8a5a12;
  color-scheme: light;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto;} }
body{
  margin:0; background:var(--bg-0); color:var(--ink); font-family:var(--sans);
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
::selection{ background:var(--cyan); color:#06171a; }
a{ color:inherit; }
img{ max-width:100%; }
:focus-visible{ outline:3px solid var(--focus); outline-offset:3px; border-radius:2px; }
[data-ov],[data-ov-date],[data-bar]{ font-variant-numeric:tabular-nums; }
.visually-hidden{ 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; left:12px; top:-50px; background:var(--ink); color:var(--bg-0); padding:10px 16px; border-radius:3px; z-index:200; transition:top .2s ease; }
.skip-link:focus{ top:12px; }

/* ---------- LAYOUT HELPERS ---------- */
.wrap{ max-width:1120px; margin:0 auto; padding:0 24px; }
.wrap-narrow{ max-width:820px; margin:0 auto; padding:0 24px; }
section{ position:relative; }
section:not(.hero), main > div, .site-footer{ position:relative; z-index:2; }
.section-pad{ padding:88px 0; border-bottom:1px solid var(--line); }
@media (max-width:640px){ .section-pad{ padding:56px 0; } }
.sec-head{ text-align:center; margin:0 0 40px; }
.sec-head h2{ font-family:var(--serif); font-weight:500; font-size:clamp(1.5rem,3.4vw,2.3rem); margin:0 0 10px; }
.sec-head p{ color:var(--ink-dim); font-size:.98rem; max-width:56ch; margin:0 auto; }
.kicker{ font-size:.72rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--cyan); margin:0 0 10px; }

/* ---------- VIDEO BACKGROUND ---------- */
/* Markup: the <video class="site-video"> + <div class="site-video-scrim"> live as the first
   children INSIDE <section class="hero">. Dark mode: fixed, so it covers the full viewport
   behind the whole site regardless of where in the DOM it sits. Light mode: absolute, so it
   is clipped to .hero (position:relative) and never shows outside the hero band. */
.site-video{
  position:fixed; inset:0; width:100%; height:100%; object-fit:cover; z-index:0;
  opacity:.6; pointer-events:none;
}
.site-video-scrim{
  position:fixed; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(180deg, rgba(6,7,8,.35) 0%, rgba(6,7,8,.5) 50%, rgba(6,7,8,.62) 100%);
}
html[data-theme="light"] .site-video,
html[data-theme="light"] .site-video-scrim{ position:absolute; }
html[data-theme="light"] .site-video{ opacity:.4; }
html[data-theme="light"] .site-video-scrim{ background:linear-gradient(180deg, rgba(6,7,8,.35) 0%, rgba(6,7,8,.55) 55%, #060708 100%); }
@media (prefers-reduced-motion: reduce){ .site-video{ display:none; } }

/* ---------- HEADER ---------- */
.site-header{
  position:sticky; top:0; z-index:100;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:16px 24px; border-bottom:1px solid var(--line);
  background:color-mix(in srgb, var(--bg-0) 82%, transparent);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
}
.brand{ font-family:var(--serif); font-weight:560; font-size:1.15rem; text-decoration:none; color:var(--ink); white-space:nowrap; }
.site-nav{ display:flex; align-items:center; gap:22px; }
.site-nav a{ font-size:.86rem; text-decoration:none; color:var(--ink-dim); white-space:nowrap; }
.site-nav a:hover, .site-nav a[aria-current="page"]{ color:var(--ink); }
.header-actions{ display:flex; align-items:center; gap:10px; }
.icon-btn{
  display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px;
  border-radius:100px; border:1px solid var(--line); background:transparent; color:var(--ink);
  cursor:pointer;
}
.icon-btn:hover{ border-color:var(--ink-faint); }
.icon-btn svg{ width:18px; height:18px; }
.menu-toggle{ display:none; }

.btn{
  font-family:var(--sans); font-size:.9rem; font-weight:600; padding:12px 22px;
  border-radius:3px; text-decoration:none; border:1px solid transparent; cursor:pointer;
  display:inline-block; line-height:1.1;
}
.btn-primary{ background:var(--ink); color:var(--bg-0); }
.btn-primary:hover{ background:var(--cyan); color:#06171a; }
.btn-ghost{ background:transparent; color:var(--ink); border-color:var(--ink-faint); }
.btn-ghost:hover{ border-color:var(--ink); }
.hero .btn-ghost{ color:var(--hero-ink); border-color:rgba(242,239,233,.45); }
.hero .btn-ghost:hover{ border-color:var(--hero-ink); }
.btn-sm{ padding:9px 16px; font-size:.82rem; }

/* mobile full-screen menu */
@media (max-width:900px){
  .site-nav{ display:none; }
  .header-actions .talk-to-sales{ display:none; }
  .menu-toggle{
    display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px;
    border:1px solid var(--line); background:transparent; color:var(--ink); border-radius:3px; cursor:pointer;
  }
}
.mobile-menu{
  position:fixed; inset:0; z-index:200; background:var(--bg-0);
  display:none; flex-direction:column; padding:20px 24px 40px; overflow-y:auto;
}
.mobile-menu.is-open{ display:flex; }
.mobile-menu-head{ display:flex; justify-content:space-between; align-items:center; margin-bottom:32px; }
.mobile-menu nav{ display:flex; flex-direction:column; gap:4px; }
.mobile-menu nav a{
  font-family:var(--serif); font-size:1.5rem; color:var(--ink); text-decoration:none;
  padding:14px 0; border-bottom:1px solid var(--line);
}
.mobile-menu .cta-row{ margin-top:28px; display:flex; flex-direction:column; gap:12px; }

/* ---------- FOOTER ---------- */
.site-footer{ padding:64px 24px 40px; background:var(--bg-0); border-top:1px solid var(--line); position:relative; z-index:1; }
.footer-grid{ display:grid; grid-template-columns:1.4fr repeat(4,1fr); gap:32px; max-width:1120px; margin:0 auto; }
.footer-brand .fname{ font-family:var(--serif); font-size:1.2rem; margin:0 0 10px; }
.footer-brand p{ font-size:.85rem; color:var(--ink-faint); line-height:1.6; max-width:32ch; }
.footer-col h3{ font-size:.7rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-faint); margin:0 0 14px; }
.footer-col ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:9px; }
.footer-col a{ font-size:.86rem; text-decoration:none; color:var(--ink-dim); }
.footer-col a:hover{ color:var(--ink); }
.footer-bottom{
  max-width:1120px; margin:48px auto 0; padding-top:24px; border-top:1px solid var(--line);
  display:flex; flex-wrap:wrap; gap:8px 24px; justify-content:space-between; align-items:center;
  font-size:.78rem; color:var(--ink-faint);
}
.footer-legal{ display:flex; gap:16px; flex-wrap:wrap; }
.footer-legal a{ color:var(--ink-faint); text-decoration:underline; text-underline-offset:2px; }
@media (max-width:900px){ .footer-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .footer-grid{ grid-template-columns:1fr; } }

/* ---------- HERO (shared across pages that need a dark video hero band) ---------- */
.hero{
  position:relative; min-height:100svh; width:100%; overflow:hidden;
  display:flex; flex-direction:column; justify-content:center; align-items:center;
  border-bottom:1px solid var(--line); background:#060708;
}
.hero.hero-compact{ min-height:56svh; padding:100px 24px 60px; }
.hero-copy{ position:relative; z-index:2; text-align:center; padding:0 24px; pointer-events:none; }
.hero-copy > *{ pointer-events:auto; }
.hero-kicker{ font-size:.8rem; font-weight:500; letter-spacing:.04em; color:var(--hero-cyan); margin:0 0 18px; }
.hero h1{
  font-family:var(--serif); font-weight:560; font-optical-sizing:auto;
  font-size:clamp(2rem, 4.6vw, 3.4rem); line-height:1.03; letter-spacing:-.01em;
  margin:0 auto; max-width:18ch; color:var(--hero-ink); text-shadow:0 4px 40px rgba(0,0,0,.6);
}
.hero h1 em{ font-style:italic; color:var(--hero-amber); }
.hero-sub{ font-size:clamp(.94rem,1.2vw,1.1rem); color:var(--hero-ink-dim); max-width:42ch; margin:14px auto 0; line-height:1.5; }
.hero-bottom{
  position:relative; z-index:3; width:100%;
  display:flex; flex-direction:column; align-items:center; gap:22px; padding:28px 24px 0;
}
.hero-bottom .cta-row{ order:-1; }
.cta-row{ display:flex; gap:14px; flex-wrap:wrap; justify-content:center; }
.scroll-hint{ font-size:.72rem; letter-spacing:.06em; color:var(--hero-ink-faint); }

/* 8-figure hero scoreboard (index only, but styles live in the shell) */
.hero-figures{ width:100%; max-width:780px; }
.hf-groups{ display:grid; grid-template-columns:1fr 1fr; gap:0 22px; }
.hf-group + .hf-group{ border-left:1px solid rgba(242,239,233,.16); padding-left:22px; }
.hf-group-label{ font-size:.62rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase; margin:0 0 8px; text-align:center; }
.hf-group-label.screening{ color:var(--hero-cyan); }
.hf-group-label.registries{ color:var(--hero-amber); }
.hf-row{ display:grid; grid-template-columns:repeat(2,1fr); gap:8px 10px; }
.hf-item{ text-align:center; }
.hf-item .n{ display:block; font-family:var(--serif); font-weight:500; font-variant-numeric:tabular-nums; font-size:clamp(1.2rem,2.05vw,1.8rem); color:var(--hero-ink); line-height:1.1; }
.hf-item .n.lead{ color:var(--hero-cyan); font-size:clamp(1.45rem,2.5vw,2.3rem); }
.hf-item .l{ display:block; margin-top:3px; font-size:.74rem; color:var(--hero-ink-faint); line-height:1.2; }
.hero-asof{ font-size:.78rem; color:var(--hero-ink-faint); text-align:center; margin:10px 0 0; }
.hero-mobile{ display:none; }
@media (max-width:599px){
  .hero:not(.hero-compact){ min-height:100svh; padding:0; justify-content:flex-start; }
  .hero:not(.hero-compact) .hero-copy, .hero:not(.hero-compact) .hero-bottom{ display:none; }
  .hero-mobile{
    display:grid; grid-template-columns:1fr 1fr; gap:14px; position:relative; z-index:2; width:100%;
    padding:22px 16px 84px; align-items:start;
  }
  .hero-mobile .hm-left{ text-align:left; }
  .hero-mobile h1{ font-family:var(--serif); font-weight:560; font-size:clamp(22px,7.7vw,29px); line-height:1.08; margin:0 0 8px; color:var(--hero-ink); }
  .hero-mobile .hero-sub{ font-size:12.5px; margin:0 0 12px; max-width:none; line-height:1.4; }
  .hero-mobile .cta-row{ flex-direction:column; align-items:stretch; gap:8px; }
  .hero-mobile .btn{ font-size:11px; padding:10px 12px; text-align:center; }
  .hero-mobile .hf-groups{ display:block; }
  .hero-mobile .hf-group + .hf-group{ border-left:none; padding-left:0; margin-top:10px; padding-top:10px; border-top:1px solid rgba(242,239,233,.16); }
  .hero-mobile .hf-group-label{ text-align:left; }
  .hero-mobile .hf-row{ grid-template-columns:1fr; gap:7px; }
  .hero-mobile .hf-item{ text-align:left; }
  .hero-mobile .hf-item .n{ font-size:18px; }
  .hero-mobile .hf-item .n.lead{ font-size:22px; }
  .hero-mobile .hf-item .l{ font-size:10.5px; }
  .hero-mobile .hero-asof{ text-align:left; font-size:9.5px; margin-top:8px; }
}

/* ---------- SCROLL "BEAT" SECTIONS (one figure per screen) ---------- */
.beat{
  min-height:100svh; width:100%; display:flex; flex-direction:column; justify-content:center;
  align-items:center; text-align:center; padding:96px 24px; border-bottom:1px solid var(--line);
}
.beat.group-screening{ background:rgba(10,11,13,.22); }
.beat.group-registries{ background:rgba(21,24,28,.28); }
html[data-theme="light"] .beat.group-screening{ background:var(--bg-1); }
html[data-theme="light"] .beat.group-registries{ background:var(--bg-2); }
.group-label{
  font-size:1rem; font-weight:600; letter-spacing:.03em; color:var(--ink-faint); margin:0 0 10px;
  padding:8px 18px; border:1px solid var(--line); border-radius:100px;
}
.group-label.screening{ color:var(--cyan); border-color:rgba(95,215,209,.35); }
.group-label.registries{ color:var(--amber); border-color:rgba(217,164,65,.35); }
.beat-figure{
  font-family:var(--serif); font-weight:420; font-optical-sizing:auto;
  font-size:clamp(4rem, 16vw, 11rem); line-height:.9; letter-spacing:-.02em; margin:18px 0 22px;
  font-variant-numeric:tabular-nums; color:var(--beat-ink);
}
.beat-figure .unit{ font-size:.28em; font-weight:500; color:var(--ink-faint); margin-left:.15em; vertical-align:.4em; }
.beat-sentence{ font-size:clamp(1.15rem, 2.2vw, 1.5rem); color:var(--beat-ink-dim); max-width:42ch; line-height:1.6; margin:0; }
.beat-sentence strong{ color:var(--beat-ink); font-weight:600; }
.beat-date{ margin-top:28px; font-size:.95rem; color:var(--beat-ink-faint); }

.reveal{ opacity:0; transform:translateY(28px); transition:opacity .7s ease, transform .7s ease; }
.reveal.is-visible{ opacity:1; transform:translateY(0); }
@media (prefers-reduced-motion: reduce){ .reveal{ opacity:1; transform:none; transition:none; } }

/* ---------- CARDS / GRIDS ---------- */
.card-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:20px; }
.card{ background:var(--bg-1); border:1px solid var(--line); padding:26px 24px; border-radius:4px; }
.card h3{ font-family:var(--serif); font-weight:500; font-size:1.2rem; margin:0 0 10px; }
.card p{ color:var(--ink-dim); font-size:.92rem; line-height:1.6; margin:0; }
.card .stat{ font-family:var(--serif); font-size:2rem; color:var(--cyan); display:block; margin-bottom:6px; }

/* ---------- TABLES ---------- */
table.data-table{ width:100%; border-collapse:collapse; font-size:.88rem; }
table.data-table thead th{ text-align:left; font-weight:600; color:var(--ink-faint); font-size:.72rem; letter-spacing:.04em; text-transform:uppercase; padding:0 12px 12px; border-bottom:1px solid var(--line); }
table.data-table tbody td{ padding:14px 12px; border-bottom:1px solid var(--line); color:var(--ink-dim); font-variant-numeric:tabular-nums; }
table.data-table tbody tr td:first-child{ color:var(--ink); font-weight:500; }
table.data-table td.num, table.data-table th.num{ text-align:right; }
.table-scroll{ overflow-x:auto; border:1px solid var(--line); border-radius:4px; }

/* ---------- CODE TABS ---------- */
.code-tabs{ border:1px solid var(--line); border-radius:6px; overflow:hidden; background:var(--bg-1); }
.code-tabs-bar{ display:flex; border-bottom:1px solid var(--line); }
.code-tab{ font-family:var(--mono); font-size:.8rem; padding:10px 18px; background:transparent; border:0; color:var(--ink-faint); cursor:pointer; border-right:1px solid var(--line); }
.code-tab[aria-selected="true"]{ color:var(--ink); background:var(--bg-2); }
.code-panel{ display:none; margin:0; padding:20px; font-family:var(--mono); font-size:.82rem; line-height:1.6; overflow-x:auto; color:var(--ink-dim); }
.code-panel.is-active{ display:block; }
.code-panel .tok{ color:var(--cyan); }

/* ---------- FAQ ---------- */
.faq-item{ border-bottom:1px solid var(--line); padding:18px 0; }
.faq-item summary{ cursor:pointer; font-family:var(--serif); font-size:1.05rem; list-style:none; display:flex; justify-content:space-between; gap:16px; }
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary::after{ content:'+'; font-family:var(--sans); color:var(--ink-faint); }
.faq-item[open] summary::after{ content:'–'; }
.faq-item p{ color:var(--ink-dim); margin:12px 0 0; line-height:1.6; font-size:.94rem; }

/* ---------- FORMS ---------- */
.field{ display:flex; flex-direction:column; gap:6px; margin-bottom:18px; }
.field label{ font-size:.82rem; font-weight:600; color:var(--ink-dim); }
.field input, .field textarea, .field select{
  font-family:var(--sans); font-size:.94rem; padding:12px 14px; border:1px solid var(--line);
  border-radius:3px; background:var(--bg-1); color:var(--ink);
}
.field input:focus, .field textarea:focus, .field select:focus{ border-color:var(--cyan); }

/* ---------- PROPOSITION / QUOTE BAND ---------- */
.proposition{ min-height:60svh; display:flex; align-items:center; justify-content:center; text-align:center; padding:100px 24px; background:var(--bg-1); border-bottom:1px solid var(--line); }
.proposition p{ font-family:var(--serif); font-weight:420; font-style:italic; font-size:clamp(1.4rem, 3.6vw, 2.4rem); max-width:22ch; line-height:1.35; margin:0; color:var(--ink); }

/* ---------- STATUS PILLS ---------- */
.pill{ display:inline-flex; align-items:center; gap:6px; font-size:.76rem; font-weight:600; padding:4px 12px; border-radius:100px; border:1px solid var(--line); color:var(--ink-dim); }
.pill.cleared{ color:var(--good); border-color:color-mix(in srgb, var(--good) 40%, transparent); }
.pill.internal{ color:var(--amber); border-color:color-mix(in srgb, var(--amber) 40%, transparent); }

/* ---------- MISC ---------- */
.page-hero{ padding:150px 24px 70px; text-align:center; border-bottom:1px solid var(--line); background:var(--bg-1); }
.page-hero h1{ font-family:var(--serif); font-weight:560; font-size:clamp(1.9rem,4vw,3rem); margin:0 0 14px; }
.page-hero p{ color:var(--ink-dim); max-width:60ch; margin:0 auto; font-size:1rem; line-height:1.6; }
.toc{ background:var(--bg-1); border:1px solid var(--line); border-radius:4px; padding:20px 24px; margin:0 0 40px; }
.toc h2{ font-size:.85rem; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-faint); margin:0 0 12px; }
.toc ol{ margin:0; padding-left:20px; columns:2; gap:24px; }
.toc a{ text-decoration:none; color:var(--ink-dim); font-size:.9rem; }
.toc a:hover{ color:var(--cyan); }
@media (max-width:640px){ .toc ol{ columns:1; } }
.prose h2{ font-family:var(--serif); font-weight:500; font-size:1.4rem; margin:44px 0 12px; }
.prose h3{ font-size:1.05rem; margin:24px 0 8px; }
.prose p, .prose li{ color:var(--ink-dim); line-height:1.7; font-size:.96rem; }
.prose{ padding:60px 0 100px; }

@media (max-width:640px){
  .beat{ padding:70px 20px; }
  table.data-table{ font-size:.8rem; }
}

/* guard: nothing may widen the page on phones; wide code and tables scroll inside their own box */
html,body{overflow-x:clip;max-width:100%}
pre,code{max-width:100%}
pre{overflow-x:auto}
table{max-width:100%}

/* ---------- consistency pass (2026-10-01) ---------- */
/* one page width: narrow sections share the wide edge; their running text keeps a readable line length */
.wrap-narrow{ max-width:1120px; }
.wrap-narrow > p, .wrap-narrow > .sec-head p, .wrap-narrow .prose p{ max-width:72ch; }
/* tables: headings stay on one line, numbers line up, wide tables scroll inside their frame */
table.data-table thead th{ white-space:nowrap; vertical-align:bottom; }
table.data-table td.num{ white-space:nowrap; }
table.data-table tbody td{ vertical-align:top; }
.table-scroll{ max-width:100%; -webkit-overflow-scrolling:touch; }
.table-scroll table.data-table thead th:first-child, .table-scroll table.data-table tbody td:first-child{ padding-left:16px; }
@media (max-width:640px){
  table.data-table thead th{ font-size:.66rem; padding:0 10px 10px; }
  table.data-table tbody td{ padding:12px 10px; }
  table.data-table tbody td:first-child{ min-width:150px; }
}
/* cards in a row are the same height, with any closing link pinned to the bottom */
.card-grid > .card{ display:flex; flex-direction:column; }
.card-grid > .card > p:last-child:has(> a:only-child){ margin-top:auto; padding-top:14px; }
/* nothing in a grid or flex row may force the page wider than the screen */
.card, .code-tabs, .table-scroll{ min-width:0; }

/* print: content only */
@media print{
  .site-header, .mobile-menu, .site-footer, .skip-link, .site-video, .site-video-scrim, .cp-toc, .docs-nav, .dm-panel{ display:none !important; }
  body{ background:#fff; color:#000; }
  a{ color:#000; text-decoration:underline; }
}

/* ── Crown Intelligence logo, unified control height (2026-10 update) ── */
:root{ --ctl-h:48px; }
.brand{ display:inline-flex; align-items:center; gap:10px; }
.brand-mark{ width:42px; height:30px; flex:none; display:block; }
.brand-name{ white-space:nowrap; }
.fname-logo{ display:flex; flex-direction:column; align-items:flex-start; gap:2px; line-height:1; }
.fname-logo img{ width:84px; height:60px; margin-bottom:6px; }
.fname-logo .fl-1{ font-family:var(--sans); font-weight:800; font-size:1.6rem; letter-spacing:.04em; color:var(--ink); }
.fname-logo .fl-2{ font-family:var(--sans); font-weight:700; font-size:.82rem; letter-spacing:.18em; color:#3f86c6; }
/* one height for every button, field and select, aligned on one baseline */
.btn, .field input, .field select, input[type="search"], input[type="text"], input[type="email"], input[type="date"], select{
  min-height:var(--ctl-h); box-sizing:border-box; }
.btn{ display:inline-flex; align-items:center; justify-content:center; }
.btn-sm{ min-height:40px; }
.field textarea{ min-height:calc(var(--ctl-h) * 2); }
form .cta-row, .field-row, .search-row{ align-items:flex-end; }
@media (max-width:900px){ .brand-mark{ width:36px; height:26px; } }

/* ===== Live figures: two states (appended block; see assets/data.js, tools/bake-figures.mjs) =====
   [data-state="saved"] is the value baked into the page; [data-state="live"] is confirmed by the data service.
   Both look the same: no grey, no spinner. Tabular figures keep the count-up from jittering the layout.
   Put <span class="fig-asof">Figures as of <span data-ov-date></span></span> anywhere an "as of" line is wanted. */
[data-ov]{font-variant-numeric:tabular-nums}
[data-ov][data-state="saved"],[data-ov][data-state="live"],[data-ov-date][data-state]{opacity:1}
@keyframes ci-fig-settle{from{opacity:.82}to{opacity:1}}
@media (prefers-reduced-motion:no-preference){
  [data-ov][data-state="live"]{animation:ci-fig-settle .5s ease-out 1}
}
.fig-asof{font-size:.82em;opacity:.8}
