:root {
  color-scheme: light;
  --bg: #f3f6f5; --surface: #ffffff; --surface-2: #e5eeeb; --surface-3: #d6e2de;
  --ink: #233c3d; --ink-2: #41595a; --muted: #5c7070;
  --line: #cad6d3; --line-2: #9fb3af; --grid: #dfe7e4;
  --accent: #075f5b; --accent-ink: #075f5b; --accent-soft: #e5eeeb; --accent-on: #ffffff;
  --signal: #d9412a; --signal-ink: #c2381f; --signal-ring: #ffffff;
  --good: #1f7a4d; --good-soft: #d9f2e3;
  --warn: #8a5a00; --warn-soft: #f6ecc9;
  --bad: #b3261e; --bad-soft: #f6dcd8;
  --band-bg: #233c3d; --band-ink: #f3f6f5; --band-muted: #b9cbc8; --band-line: #3c5658;
  --code-bg: #ffffff; --code-ink: #233c3d; --code-dim: #5c7070; --code-key: #075f5b; --code-str: #233c3d; --code-num: #5c7070;
  --demo-bg: #ffffff; --demo-ink: #233c3d; --demo-dim: #5c7070; --demo-key: #075f5b; --demo-str: #233c3d; --demo-num: #5c7070; --demo-line: #cad6d3;
  --map-dot: 7 95 91; --map-ground: #f3f6f5;
  --shadow: 0 1px 2px rgba(35, 60, 61, 0.08), 0 8px 24px -12px rgba(35, 60, 61, 0.22);
  --display: "Barlow Condensed", "Barlow Condensed Fallback", "Arial Narrow", "Helvetica Neue", Arial, sans-serif;
  --body: "IBM Plex Sans", "Segoe UI", system-ui, -apple-system, sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --r-panel: 2px; --r-control: 2px; --r-pill: 2px;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --bg: #17292c; --surface: #1e3336; --surface-2: #233d40; --surface-3: #2c4a4d;
    --ink: #e5eeeb; --ink-2: #c3d2cf; --muted: #acbfbd;
    --line: #40575a; --line-2: #5d7679; --grid: #293e41;
    --accent: #89c5ba; --accent-ink: #a6d8cf; --accent-soft: #233d40; --accent-on: #17292c;
    --signal: #ff6a4d; --signal-ink: #ff6a4d; --signal-ring: #17292c;
    --good: #5fd39a; --good-soft: #1d3d30;
    --warn: #f2c25c; --warn-soft: #3d3218;
    --bad: #ff8a80; --bad-soft: #4a2622;
    --band-bg: #1e3336; --band-ink: #e5eeeb; --band-muted: #acbfbd; --band-line: #40575a;
    --code-bg: #1e3336; --code-ink: #e5eeeb; --code-dim: #acbfbd; --code-key: #89c5ba; --code-str: #e5eeeb; --code-num: #acbfbd;
    --demo-bg: #1e3336; --demo-ink: #e5eeeb; --demo-dim: #acbfbd; --demo-key: #89c5ba; --demo-str: #e5eeeb; --demo-num: #acbfbd; --demo-line: #40575a;
    --map-dot: 137 197 186; --map-ground: #17292c;
    --shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 8px 24px -12px rgba(0, 0, 0, 0.6);
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #17292c; --surface: #1e3336; --surface-2: #233d40; --surface-3: #2c4a4d;
  --ink: #e5eeeb; --ink-2: #c3d2cf; --muted: #acbfbd;
  --line: #40575a; --line-2: #5d7679; --grid: #293e41;
  --accent: #89c5ba; --accent-ink: #a6d8cf; --accent-soft: #233d40; --accent-on: #17292c;
  --signal: #ff6a4d; --signal-ink: #ff6a4d; --signal-ring: #17292c;
  --good: #5fd39a; --good-soft: #1d3d30;
  --warn: #f2c25c; --warn-soft: #3d3218;
  --bad: #ff8a80; --bad-soft: #4a2622;
  --band-bg: #1e3336; --band-ink: #e5eeeb; --band-muted: #acbfbd; --band-line: #40575a;
  --code-bg: #1e3336; --code-ink: #e5eeeb; --code-dim: #acbfbd; --code-key: #89c5ba; --code-str: #e5eeeb; --code-num: #acbfbd;
  --demo-bg: #1e3336; --demo-ink: #e5eeeb; --demo-dim: #acbfbd; --demo-key: #89c5ba; --demo-str: #e5eeeb; --demo-num: #acbfbd; --demo-line: #40575a;
  --map-dot: 137 197 186; --map-ground: #17292c;
  --shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 8px 24px -12px rgba(0, 0, 0, 0.6);
}

/* Yepthere preset tokens. */
:root[data-brand="yepthere"] {
  color-scheme: light;
  --bg: #eef3f0; --surface: #ffffff; --surface-2: #e6eee8; --surface-3: #dbe6de;
  --ink: #173d2d; --ink-2: #365545; --muted: #526b5c;
  --line: #c6d4cb; --line-2: #718579; --grid: #dce6df;
  --accent: #456b57; --accent-ink: #456b57; --accent-soft: #e6eee8; --accent-on: #ffffff;
  --primary: #b94335; --primary-on: #ffffff; --pin: #c14b3e;
  --band-primary: #ef9788; --band-primary-on: #10221b;
  --signal: #b94335; --signal-ink: #b94335; --signal-ring: #ffffff;
  --good: #356448; --good-soft: #e6eee8;
  --warn: #b94335; --warn-soft: #fbe9e5;
  --bad: #b94335; --bad-soft: #fbe9e5;
  --band-bg: #173d2d; --band-ink: #eef3f0; --band-muted: #b8cdbf; --band-line: #80998a;
  --code-bg: #ffffff; --code-ink: #173d2d; --code-dim: #526b5c; --code-key: #456b57; --code-str: #173d2d; --code-num: #526b5c;
  --demo-bg: #ffffff; --demo-ink: #173d2d; --demo-dim: #526b5c; --demo-key: #456b57; --demo-str: #173d2d; --demo-num: #526b5c; --demo-line: #c6d4cb;
  --map-dot: 69 107 87; --map-ground: #eef3f0;
  --shadow: none;
  --display: "Plus Jakarta Sans", "Segoe UI", system-ui, sans-serif;
}
@media (prefers-color-scheme: dark) {
  :root[data-brand="yepthere"]:not([data-theme="light"]) {
  color-scheme: dark;
  --bg: #10221b; --surface: #162c22; --surface-2: #213b2e; --surface-3: #30493b;
  --ink: #e5efe8; --ink-2: #c3d6c9; --muted: #adc4b5;
  --line: #405b4a; --line-2: #819d8b; --grid: #294235;
  --accent: #a3c3ae; --accent-ink: #a3c3ae; --accent-soft: #213b2e; --accent-on: #10221b;
  --primary: #ef9788; --primary-on: #10221b;
  --signal: #ef9788; --signal-ink: #ef9788; --signal-ring: #10221b;
  --good: #a3c3ae; --good-soft: #213b2e;
  --warn: #ef9788; --warn-soft: #402923;
  --bad: #ef9788; --bad-soft: #402923;
  --band-bg: #162c22; --band-ink: #e5efe8; --band-muted: #adc4b5; --band-line: #819d8b;
  --code-bg: #162c22; --code-ink: #e5efe8; --code-dim: #adc4b5; --code-key: #a3c3ae; --code-str: #e5efe8; --code-num: #adc4b5;
  --demo-bg: #162c22; --demo-ink: #e5efe8; --demo-dim: #adc4b5; --demo-key: #a3c3ae; --demo-str: #e5efe8; --demo-num: #adc4b5; --demo-line: #405b4a;
  --map-dot: 163 195 174; --map-ground: #10221b;
  }
}
:root[data-brand="yepthere"][data-theme="dark"] {
  color-scheme: dark;
  --bg: #10221b; --surface: #162c22; --surface-2: #213b2e; --surface-3: #30493b;
  --ink: #e5efe8; --ink-2: #c3d6c9; --muted: #adc4b5;
  --line: #405b4a; --line-2: #819d8b; --grid: #294235;
  --accent: #a3c3ae; --accent-ink: #a3c3ae; --accent-soft: #213b2e; --accent-on: #10221b;
  --primary: #ef9788; --primary-on: #10221b;
  --signal: #ef9788; --signal-ink: #ef9788; --signal-ring: #10221b;
  --good: #a3c3ae; --good-soft: #213b2e;
  --warn: #ef9788; --warn-soft: #402923;
  --bad: #ef9788; --bad-soft: #402923;
  --band-bg: #162c22; --band-ink: #e5efe8; --band-muted: #adc4b5; --band-line: #819d8b;
  --code-bg: #162c22; --code-ink: #e5efe8; --code-dim: #adc4b5; --code-key: #a3c3ae; --code-str: #e5efe8; --code-num: #adc4b5;
  --demo-bg: #162c22; --demo-ink: #e5efe8; --demo-dim: #adc4b5; --demo-key: #a3c3ae; --demo-str: #e5efe8; --demo-num: #adc4b5; --demo-line: #405b4a;
  --map-dot: 163 195 174; --map-ground: #10221b;
}
/* End Yepthere preset tokens. */

/* A metric-adjusted stand-in for Barlow Condensed while the web font loads. */
@font-face { font-family: "Barlow Condensed Fallback"; src: local("Arial Narrow"), local("Liberation Sans Narrow"), local("Arial"), local("Helvetica"), local("Liberation Sans"), local("DejaVu Sans"); size-adjust: 74%; ascent-override: 96%; descent-override: 22%; }

/* Base */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--ink); font: 16px/1.6 var(--body); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 4px; }
a:hover { color: var(--accent); }
h1, h2, h3, h4 { margin: 0; text-wrap: balance; }
h1, h2 { font-family: var(--display); font-weight: 500; }
h2 { font-size: clamp(2.1rem, 3.4vw, 2.875rem); letter-spacing: -0.015em; line-height: 1.08; }
h3 { font-size: 18px; font-weight: 500; line-height: 1.4; }
p, ul, ol, dl, dd, figure { margin: 0; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
code, pre, kbd, .mono { font-family: var(--mono); font-variant-numeric: tabular-nums; }
code { font-size: 0.85em; overflow-wrap: anywhere; }
p code, li code, td code, dd code, .prose code { background: var(--surface-2); padding: 1px 5px; border-radius: 2px; color: var(--ink); }
pre { margin: 0; overflow: auto; max-width: 100%; line-height: 1.8; tab-size: 2; }
img, svg, canvas { max-width: 100%; }
svg { display: block; }
:focus-visible { outline: 3px solid var(--accent); outline-offset: 4px; }
.wrap { width: calc(100% - 112px); max-width: 1328px; margin-left: auto; margin-right: auto; }
.rule { border: 0; border-top: 1px solid var(--line); margin: 0; }
.eyebrow, .small-label { font: 11px/1.5 var(--mono); letter-spacing: 0.035em; color: var(--muted); }
.eyebrow { color: var(--accent); }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Buttons and controls */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 10px 19px; border: 1px solid var(--accent); background: var(--accent); color: var(--accent-on); font: 500 14px var(--body); line-height: 1; text-decoration: none; cursor: pointer; border-radius: var(--r-control); white-space: nowrap; }
.btn:hover { color: var(--accent-on); background: var(--accent); filter: brightness(1.12); }
.btn.ghost { background: transparent; color: var(--accent); }
.btn.ghost:hover { background: var(--accent-soft); color: var(--accent); filter: none; }
.btn.small { min-height: 34px; padding: 6px 12px; font-size: 12px; }
.btn:disabled { opacity: 0.6; cursor: wait; }
.field { display: flex; align-items: center; gap: 8px; }
.field input { flex: 1; min-width: 0; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-control); color: var(--ink); padding: 10px 13px; font: 400 14px var(--body); min-height: 44px; }
.field input::placeholder { color: var(--muted); }
.field input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.field .btn { flex: none; }

/* Header */
.site-header { border-bottom: 1px solid var(--line); background: var(--bg); }
.nav { position: relative; min-height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { display: inline-flex; align-items: center; gap: 11px; font-weight: 500; text-decoration: none; font-size: 17px; white-space: nowrap; color: var(--ink); }
.brand:hover { color: var(--ink); }
.brand svg { width: 24px; height: 26px; }
.brand .sep { display: none; }
.brand .product { color: var(--muted); font-weight: 400; padding-left: 12px; border-left: 1px solid var(--line); }
.nav-links { display: flex; align-items: center; gap: 28px; }
.nav-links a { text-decoration: none; font-size: 14px; color: var(--ink); }
.nav-links a:hover { color: var(--accent); }
.nav-links a[aria-current="page"] { color: var(--accent); text-decoration: underline; text-underline-offset: 6px; }
.nav-links .btn { color: var(--accent-on); }
.nav-links .btn:hover { color: var(--accent-on); }
.nav-toggle { display: none; }

/* The sheet: hero, map and its foot */
.home-skip { position: absolute; top: -100px; left: 16px; z-index: 10; padding: 8px 16px; background: var(--surface); }
.home-skip:focus { top: 8px; }
.home-pricing-terms { margin-top: 14px; font-size: 14px; color: var(--ink-2); }
#attribution pre { white-space: pre-wrap; overflow-wrap: anywhere; }
.sheet { position: relative; border-bottom: 1px solid var(--line); }
.sheet-meta { padding: 19px 0; display: flex; justify-content: space-between; gap: 16px; border-bottom: 1px solid var(--line); }
.sheet-meta span:first-child { color: var(--accent); }
.sheet-meta span { min-width: 0; overflow-wrap: anywhere; }
.hero { display: grid; grid-template-columns: minmax(0, 1fr); gap: 40px; padding: 40px 0; }
.hero-copy, .hero-demo { min-width: 0; }
.hero .home-display { font-size: clamp(4.75rem, 7.5vw, 7rem); letter-spacing: -0.02em; line-height: 0.94; }
.hero .intro { font-size: 18px; line-height: 1.65; max-width: 365px; margin-top: 25px; }
.hero .home-display { margin: 0; font-family: var(--display); font-weight: 500; text-wrap: balance; }
.hero .home-title { font-family: var(--body); font-weight: 400; letter-spacing: normal; }
.hero .intro strong { font-weight: 500; }
.hero .intro.quiet { font-size: 14px; margin-top: 14px; color: var(--muted); }
.query { margin-top: 29px; width: 410px; max-width: 100%; pointer-events: auto; }
.query label { display: block; font-size: 13px; margin-bottom: 9px; }
.query-field { display: flex; gap: 12px; align-items: center; border-bottom: 2px solid var(--accent); padding: 7px 0 7px 12px; background: var(--surface); }
.query-field svg { width: 18px; height: 18px; flex-shrink: 0; color: var(--accent); }
.query-field input { width: 100%; min-width: 0; border: 0; padding: 7px 0; color: var(--ink); background: transparent; font-size: 14px; -webkit-appearance: none; appearance: none; }
.query-field input::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; }
.query-field input:focus { outline: none; }
.query-field:focus-within { border-bottom-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); outline: 2px solid var(--accent); outline-offset: 2px; }
.query-field input::placeholder { color: var(--muted); }
.query-field .latency { flex: none; border-left: 1px solid var(--line); padding: 9px 12px; color: var(--accent); font: 500 12px var(--mono); min-width: 5.5em; text-align: center; }
.query-result { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--line); font-size: 13px; min-height: 42px; }
.query-result > span { min-width: 0; overflow-wrap: anywhere; }
.query-result a { flex: none; }
.query-result span span { color: var(--muted); }
.query-result a { font-size: 12px; }
.query-note { font-size: 12px; color: var(--muted); margin-top: 8px; min-height: 34px; }
.atlas { position: absolute; top: 11px; right: -12px; width: 64%; max-width: 790px; aspect-ratio: 1.19; }
.atlas canvas { display: block; width: 100%; height: 100%; }
.map-result { position: absolute; left: 0; top: 0; display: none; padding: 9px 0 0 12px; border-left: 1px solid var(--signal); background: var(--bg); font: 12px/1.6 var(--mono); pointer-events: none; transform: translate(16px, -12px); max-width: 60%; }
.map-result.on { display: block; }
.map-result.left { transform: translate(-16px, -12px); border-left: 0; border-right: 1px solid var(--signal); padding: 9px 12px 0 0; text-align: right; }
.map-result b { display: block; font: 500 14px var(--body); overflow-wrap: anywhere; }
.map-result span { color: var(--muted); display: block; overflow-wrap: anywhere; }

/* Public home and pricing canvas. */
.home-caption { margin-bottom: 24px; font-size: 12px; color: var(--muted); }
.home-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.home-trust { margin-top: 20px; font-size: 12px; }
.home-trust a { display: inline-flex; align-items: center; min-height: 44px; padding: 12px 4px; }
.hero .query { margin-top: 0; width: 100%; }
.hero .atlas { position: relative; inset: auto; width: 100%; max-width: none; aspect-ratio: 1.19; margin: 16px 0 0; }
.hero .map-result { padding: 3px 8px; border: 0; background: var(--bg); }
.hero .map-result b { font: 12px/1.5 var(--mono); }
.hero .map-result [hidden] { display: none; }
.hero .query-result { display: block; padding: 12px 14px; margin-top: 12px; font-size: 14px; border: 1px solid var(--line); border-radius: var(--r-panel); background: var(--surface); }
.query-result > p + p { margin-top: 8px; }
.query-result > details { margin-top: 12px; }
.query-result summary { cursor: pointer; color: var(--accent-ink); }
.query-result .code pre { max-height: 320px; }
.query-result .code-title { overflow-wrap: anywhere; }
.hero-demo:has(#pin:not(.on)) .result-coordinates { display: none; }
.query-result:not(:has(#hit > span)) > p:not(#hit) { display: none; }
.home-routes, .source-columns { display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px; margin-top: 24px; }
.home-routes > article { min-width: 0; border-top: 2px solid var(--line-2); padding-top: 20px; }
.home-routes h3, .source-columns h3 { margin-bottom: 14px; }
.home-routes .code { margin: 16px 0; }
.home-routes .code pre { white-space: pre-wrap; overflow-wrap: anywhere; padding: 18px 16px 44px; }
.home-record { margin-top: 24px; }
.record-fields > div { padding: 16px 0; border-top: 1px solid var(--line); }
.record-fields dd { margin: 8px 0 0; color: var(--ink-2); max-width: 52ch; }
.record-note { margin-top: 10px; font-size: 12px; color: var(--muted); }
.home-sources #attribution { margin-top: 28px; }
.home-data-status { margin-top: 20px; font-size: 12px; color: var(--muted); }
.source-columns > div { min-width: 0; }
.signup.band { padding: 32px; gap: 32px; border: 0; }
.signup.band :is(p, .form-message) { color: var(--band-muted); }
.signup.band a { color: var(--band-ink); }
.signup.band :focus-visible { outline-color: var(--band-ink); }
.signup.band .form-note { max-width: none; font-size: 12px; }
.plan-note { display: block; margin-top: 6px; max-width: 25ch; white-space: normal; font: 12px/1.5 var(--body); color: var(--muted); }
.pricing .plan-action, .pricing-comparison .plan-action, .pricing-plan-summary .plan-action { display: inline-block; min-height: 44px; padding: 12px; border: 1px solid var(--accent); border-radius: var(--r-control); font: 500 13px/1.5 var(--body); white-space: nowrap; }
.pricing-caption { text-align: left; font: 12px/1.5 var(--mono); color: var(--muted); padding: 16px 0; }
.pricing-page .page-heading { padding-left: 0; padding-right: 0; }
.pricing-page .lede { max-width: 65ch; }
.pricing-plan-summaries { display: none; }
@media (max-width: 599px) {
  .pricing-desktop { display: none; }
  .pricing-plan-summaries { display: grid; gap: 24px; }
  .pricing-plan-summary { width: 100%; table-layout: fixed; }
  .pricing-plan-summary caption { text-align: left; font: 500 22px/1.4 var(--body); padding: 16px 0; border-top: 2px solid var(--line-2); }
  .pricing-plan-summary td { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; white-space: normal; overflow-wrap: anywhere; }
  .pricing-plan-summary td::before { content: attr(data-label); font-weight: 500; }
  .pricing-plan-summary .plan-action { white-space: normal; text-align: center; }
}
.pricing-comparison { min-width: 680px; }
.pricing-comparison :is(th, td) { white-space: normal; vertical-align: top; min-width: 130px; }
.pricing-comparison th[scope="row"] { font-family: var(--body); }
.pricing-comparison td { font-size: 14px; }
.billing-sections { display: grid; grid-template-columns: minmax(0, 1fr); gap: 32px; }
.billing-copy p { max-width: 75ch; margin-top: 16px; }
@media (min-width: 900px) {
  .hero { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 48px; }
  .home-routes, .source-columns { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .billing-sections { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Sign-up strip */
.signup { padding-top: 37px; padding-bottom: 37px; display: grid; grid-template-columns: 1fr 1fr; gap: 70px; border-bottom: 1px solid var(--line); align-items: center; }
.signup h2 { font-size: 34px; }
.signup > div > p { font-size: 14px; color: var(--muted); margin-top: 8px; }
.signup label { display: block; font-size: 12px; margin-bottom: 7px; }
.form-message { font-size: 12px; margin-top: 7px; min-height: 1.6em; color: var(--ink-2); }
.form-note { font-size: 12px; margin-top: 4px; color: var(--muted); }
.cf-turnstile { margin-top: 10px; }

/* Sections */
section.block { padding-top: 76px; padding-bottom: 76px; border-bottom: 1px solid var(--line); }
.sec-head { display: flex; justify-content: space-between; align-items: end; gap: 30px; margin-bottom: 32px; }
.sec-head p { max-width: 430px; font-size: 14px; color: var(--muted); }
.sec-head p a { color: inherit; }

/* Endpoint catalogue */
.catalogue { display: grid; grid-template-columns: 1fr 1fr; column-gap: 48px; }
.endpoint { padding: 19px 0; border-top: 1px solid var(--line); min-width: 0; }
.endpoint-title { display: flex; align-items: baseline; gap: 12px; }
.method { flex-shrink: 0; width: 34px; font: 500 10px var(--mono); color: var(--accent); }
.endpoint code { font-size: 12px; }
.endpoint code .q { color: var(--muted); }
.endpoint p { font-size: 13px; color: var(--muted); margin: 7px 0 0 46px; }
.endpoint p code { font-size: 11.5px; }
.catalogue-note { margin-top: 22px; font-size: 13px; color: var(--muted); }

/* Code blocks */
.code { border: 1px solid var(--line); background: var(--code-bg); min-width: 0; position: relative; }
.code pre { padding: 18px 20px; color: var(--code-ink); font-size: 11.5px; line-height: 1.85; }
.code .k { color: var(--code-key); font-weight: 500; } .code .s { color: var(--code-str); } .code .n { color: var(--code-num); } .code .d { color: var(--code-dim); }
.code .copy { position: absolute; top: 8px; right: 8px; }
.code:has(> .copy) pre { padding-right: 84px; }
.copy { padding: 4px 8px; border: 1px solid var(--line); border-radius: var(--r-control); color: var(--ink); background: var(--bg); font: 400 11px var(--body); }
.copy:hover { color: var(--accent); border-color: var(--accent); }
.code-title { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 12px 17px; border: 1px solid var(--line); border-bottom: 0; background: var(--surface-2); font: 11.5px/1.5 var(--mono); color: var(--ink-2); overflow: hidden; }
.code-title b { color: var(--ink); font-weight: 500; }
.code-title span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.code-title .method { width: auto; }
.code-title + .code .copy { display: none; }
.code-foot { margin-top: 9px; }

/* Record */
.record { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: start; }
.record > div { min-width: 0; }
.home .record .code pre, #record .code pre { max-height: none; overflow: auto; }
.record-explain h3 { font-family: var(--display); font-size: 28px; margin-bottom: 10px; overflow-wrap: anywhere; }
.record-explain > p { font-size: 14px; color: var(--muted); margin-bottom: 24px; }
.layer-list { margin-top: 8px; }
.layer-list > div { display: grid; grid-template-columns: 125px 1fr; gap: 17px; padding: 10px 0; border-top: 1px solid var(--line); font-size: 13px; }
.layer-list dt { color: var(--muted); }
.layer-list dd { text-align: right; overflow-wrap: anywhere; }
.layer-list .pending { color: var(--muted); }
.record-foot { margin: 16px 0 0; font-size: 11px; }

/* Limits */
.limits { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; }
.limits > div, .faq > *, .sources > div, .signup > * { min-width: 0; }
.limits h2 { margin-bottom: 18px; }
.limits p { font-size: 14px; color: var(--muted); }
.auth { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); margin-top: 25px; padding: 16px 0; }
.auth pre { font-size: 11.5px; }
.limit-values { display: grid; grid-template-columns: 1fr 1fr; border-bottom: 1px solid var(--line); padding-bottom: 20px; margin-bottom: 22px; }
.limit-values strong { display: block; font: 500 56px/1.15 var(--display); }
.limit-values span { font-size: 12px; color: var(--muted); }
.limit-detail { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.limit-detail h3 { font-size: 14px; margin-bottom: 8px; }
.limit-detail p { font-size: 12px; }

/* Sources */
.sources { display: grid; grid-template-columns: 1.25fr 1fr 1fr 1fr; gap: 32px; }
.sources h2 { font-size: 34px; }
.sources h3 { font-size: 14px; margin-bottom: 10px; }
.sources p { font-size: 12px; color: var(--muted); overflow-wrap: anywhere; }
.sources .source-link { display: inline-block; font-size: 11px; margin-top: 14px; }

/* Numbers page */
.stat-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 22px 0; margin-bottom: 28px; }
.stat-grid.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.stat-grid > div { min-width: 0; }
.stat-grid strong { display: block; font: 500 clamp(2.4rem, 4vw, 3.5rem)/1.1 var(--display); letter-spacing: 0.01em; overflow-wrap: anywhere; }
.stat-grid strong.text { font-size: clamp(1.6rem, 2.6vw, 2.2rem); }
.stat-grid span { font-size: 12px; color: var(--muted); }
.chart-title { font-size: 13px; margin-bottom: 4px; }
th.num, td.num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
td .ss-meter { display: inline-block; vertical-align: middle; width: 120px; margin-right: 8px; }

/* Pricing */
table.pricing th[scope="row"] { font: 500 15px var(--body); color: var(--ink); border-top: 0; white-space: nowrap; }
table.pricing td, table.pricing th { padding: 13px 10px; }
table.pricing tbody tr:first-child th, table.pricing tbody tr:first-child td { background: var(--surface-2); }
table.pricing thead th.num { white-space: normal; min-width: 5.5em; }
table.pricing td:last-child:not(.num) { min-width: 0; overflow-wrap: normal; }
table.pricing .plan-action { white-space: nowrap; }
@media (max-width: 760px) {
  table.pricing caption { display: block; }
  table.pricing thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  table.pricing, table.pricing tbody, table.pricing tr, table.pricing th, table.pricing td { display: block; }
  table.pricing tr { padding: 16px 0 12px; border-top: 1px solid var(--line); }
  table.pricing tbody tr:first-child { padding: 16px 12px 12px; margin: 0 -12px; background: var(--surface-2); }
  table.pricing tbody tr:first-child th, table.pricing tbody tr:first-child td { background: transparent; }
  table.pricing th[scope="row"] { font-size: 19px; padding: 0 0 10px; border: 0; white-space: normal; }
  table.pricing td { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 4px 0; border: 0; font-size: 14px; white-space: normal; text-align: right; }
  table.pricing td::before { content: attr(data-label); flex: 0 1 50%; font: 500 10.5px/1.5 var(--mono); letter-spacing: 0.035em; color: var(--muted); text-align: left; }
  table.pricing td:empty { display: none; }
  table.pricing td:last-child:not(.num) { padding-top: 8px; }
}

/* Place hub */
.place-states { list-style: none; margin: 0; padding: 0; }
.place-states li { padding: 18px 0; border-top: 1px solid var(--line); }
.place-states h2 { font-size: 28px; }
.place-states h2 a { text-decoration: none; }
.place-states p { font-size: 14px; color: var(--muted); margin-top: 6px; }

/* FAQ */
.faq { display: grid; grid-template-columns: 1fr 1.4fr; gap: 48px; }
.faq details { border-top: 1px solid var(--line); }
.faq details:last-child { border-bottom: 1px solid var(--line); }
.faq summary { cursor: pointer; padding: 14px 0; font-size: 15px; font-weight: 500; list-style: none; display: flex; justify-content: space-between; gap: 16px; align-items: center; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; flex: none; font: 400 18px var(--mono); color: var(--accent); }
.faq details[open] summary::after { content: "\2013"; }
.faq .a { padding: 0 0 16px; color: var(--muted); font-size: 14px; max-width: 60ch; }

/* Closing band */
.band { background: var(--band-bg); color: var(--band-ink); }
.band .inner { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 40px; padding-top: 56px; padding-bottom: 56px; align-items: center; }
.band h2 { font-size: clamp(2.2rem, 3.4vw, 3rem); }
.band p { margin-top: 12px; color: var(--band-muted); max-width: 30rem; font-size: 14px; }
.band .actions { display: flex; gap: 12px; flex-wrap: wrap; justify-content: flex-end; }
.band .btn { background: var(--band-ink); border-color: var(--band-ink); color: var(--band-bg); }
.band .btn:hover { filter: none; background: var(--accent); border-color: var(--accent); color: var(--accent-on); }
.band .btn.ghost { background: transparent; color: var(--band-ink); border-color: var(--band-line); }
.band .btn.ghost:hover { background: var(--band-line); color: var(--band-ink); }

/* Footer */
.site-footer { padding-top: 29px; padding-bottom: 32px; }
.footer-top { display: flex; justify-content: space-between; align-items: center; gap: 25px; margin-bottom: 26px; }
.footer-links { display: flex; flex-wrap: wrap; gap: 22px; font-size: 12px; }
.footer-links a { text-decoration: none; }
.theme-control { display: flex; align-items: center; gap: 9px; font-size: 11px; color: var(--muted); }
.theme-control select { color: var(--ink); border: 1px solid var(--line); padding: 6px 10px; background: var(--bg); border-radius: var(--r-control); font-size: 11px; }
.footer-bottom { display: grid; grid-template-columns: 2fr 1fr; gap: 70px; }
.footer-bottom p { font-size: 11px; color: var(--muted); max-width: none; }
.footer-bottom p + p { margin-top: 10px; }
.footer-bottom .entity { font-size: 11px; color: var(--ink-2); }

/* Secondary pages */
.page-heading { padding-top: 48px; padding-bottom: 8px; }
.page-heading h1 { font-size: clamp(3rem, 6vw, 5rem); line-height: 0.96; letter-spacing: -0.02em; margin-top: 10px; }
.page-heading .lede { margin-top: 16px; font-size: 15px; color: var(--muted); max-width: 60ch; }
.prose { max-width: 66ch; }
.prose p + p, .prose h2, .prose h3, .prose table, .prose .code, .prose ul { margin-top: 18px; }
.prose h2 { font-size: 30px; margin-top: 44px; margin-bottom: 8px; }
.prose h3 { font-size: 16px; margin-top: 26px; margin-bottom: 6px; }
.prose li + li { margin-top: 6px; }
.prose p, .prose li { color: var(--ink-2); font-size: 15px; }
.prose strong { color: var(--ink); font-weight: 500; }
table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
th, td { text-align: left; vertical-align: top; padding: 11px 10px; border-bottom: 1px solid var(--line); overflow-wrap: normal; }
th { font: 500 10.5px/1.5 var(--mono); letter-spacing: 0.035em; color: var(--muted); border-top: 1px solid var(--line); }
th:first-child, td:first-child { padding-left: 0; }
th:last-child, td:last-child { padding-right: 0; }
.table-scroll { overflow-x: auto; }
.status-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-bottom: 24px; }
.status-item { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 20px; border: 1px solid var(--line); background: var(--surface); }
.status-item .state { font-weight: 500; }
.dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 8px; vertical-align: 1px; background: var(--good); }
.dot.off { background: var(--bad); }
.docs-nav { display: flex; flex-wrap: wrap; gap: 6px 22px; margin: 22px 0 0; padding: 0; list-style: none; }
.docs-nav a { font-size: 13px; text-decoration: none; color: var(--ink-2); border-bottom: 1px solid transparent; }
.docs-nav a:hover { color: var(--accent); border-bottom-color: var(--accent); }
/* Documentation hub: a compact rail and a continuous reference. */
.docs-layout { display: grid; gap: 28px; }
.docs-content { min-width: 0; }
.docs-content > .wrap { width: 100%; padding-inline: 0; }
.docs-content :where(.page-heading) { padding-top: 24px; }
.docs-rail { min-width: 0; }
.docs-rail :where(.docs-nav) { flex-wrap: nowrap; overflow-x: auto; align-items: baseline; gap: 20px; padding-block: 16px; margin: 0; }
.docs-rail :where(li) { flex-shrink: 0; }
.docs-rail :where(a) { display: block; padding-block: 6px; }
.docs-rail :where(a[aria-current="location"]) { color: var(--ink); font-weight: 600; border-bottom: 2px solid var(--ink); }
.docs-rail :where(a:focus-visible) { outline: 2px solid var(--accent); outline-offset: 3px; }
.docs-nav-label { font: 12px var(--mono); color: var(--muted); }
.docs-directory { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-top: 24px; }
.docs-directory > div { border-top: 1px solid var(--line-2); padding-top: 16px; }
.docs-directory :where(h3) { margin: 0 0 8px; font-size: 17px; }
.docs-directory :where(p) { color: var(--ink-2); font-size: 14px; margin: 0; }
.docs-content :where(#endpoints) { border-top: 2px solid var(--ink); }
.docs-base { font: 12px/1.7 var(--mono); margin: 0 0 24px; overflow-wrap: anywhere; }
@media (min-width: 900px) {
  .docs-layout { grid-template-columns: 190px minmax(0, 1fr); gap: 44px; }
  .docs-rail { position: sticky; top: 88px; align-self: start; max-height: calc(100vh - 100px); overflow-y: auto; }
  .docs-rail :where(.docs-nav) { display: block; overflow-x: visible; padding-block: 24px; }
  .docs-rail :where(a) { width: fit-content; }
  .docs-nav-label { margin-top: 22px; margin-bottom: 8px; }
}
@media (max-width: 599px) {
  .docs-directory { grid-template-columns: 1fr; }
}
/* Service status: observed days, release facts and incident copy. */
.status-page :where(.page-heading) { padding-bottom: 24px; }
.status-time, .status-links, .status-dates { font-family: var(--mono); font-size: 13px; }
.status-failure { color: var(--signal-ink); }
.status-days { display: grid; grid-template-columns: repeat(45, minmax(0, 1fr)); gap: 5px; margin-top: 24px; }
.status-day { aspect-ratio: 1; background: var(--surface-3); }
.status-day.unknown { border: 1px solid var(--line); }
.status-day.passed { background: var(--ink); }
.status-day.failed { background: var(--signal); }
.status-dates { display: flex; justify-content: space-between; margin-top: 12px; }
.status-legend { color: var(--ink-2); font-size: 13px; }
.status-loaded { display: grid; grid-template-columns: 180px minmax(0, 1fr); margin-top: 24px; }
.status-loaded :where(dt, dd) { border-top: 1px solid var(--line); padding-block: 20px; margin: 0; }
.status-loaded :where(dt) { font-weight: 600; }
.status-loaded :where(dd) { max-width: 75ch; }
.status-loaded :where(ul) { padding-left: 20px; margin-bottom: 0; }
.status-loaded :where(li) { margin-block: 8px; }
@media (max-width: 599px) {
  .status-days { grid-template-columns: repeat(18, minmax(0, 1fr)); }
  .status-loaded { grid-template-columns: 1fr; }
  .status-loaded :where(dt) { padding-bottom: 4px; }
  .status-loaded :where(dd) { border-top: 0; padding-top: 4px; }
}
/* Docs request samples and reference tables. Keep selectors flat. */
.docs-steps { display: grid; gap: 24px; margin: 24px 0; padding-left: 24px; }
.docs-steps > li { min-width: 0; }
.docs-steps :where(.code, pre) { max-width: 100%; overflow-x: auto; }
.docs-steps :where(p) { max-width: 72ch; margin: 8px 0; }
.docs-tabs:where(:not([hidden])) { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; }
.docs-tab { padding: 8px 16px; border: 1px solid var(--line); border-radius: 2px; background: var(--bg); color: var(--ink-2); font: 400 13px var(--body); cursor: pointer; }
.docs-tab:where([aria-selected="true"]) { color: var(--accent); border-color: var(--accent); background: var(--surface); }
.docs-tab:where(:focus-visible), .docs-sample:where(:focus-visible) { outline: 2px solid var(--accent); outline-offset: 2px; }
.docs-sample:where([hidden]) { display: none; }
.docs-plans :where(caption) { text-align: left; margin: 16px 0 8px; }
.docs-plans :where(th:nth-child(n+3)) { text-align: right; }
.docs-number { text-align: right; font-family: var(--mono); font-variant-numeric: tabular-nums; }
.docs-errors :where(td:first-child, td:nth-child(2)) { font-family: var(--mono); font-variant-numeric: tabular-nums; }
.docs-errors :where(td) { vertical-align: top; overflow-wrap: anywhere; }
.docs-errors :where(td:nth-child(3)) { min-width: 24ch; }
.docs-errors :where(td:nth-child(4)) { min-width: 24ch; }
.endpoints { border-top: 1px solid var(--line); }
.ep { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.3fr); gap: 28px; padding: 24px 0; border-bottom: 1px solid var(--line); }
.ep > div, .record > div, .shape > div { min-width: 0; }
.ep .sig { display: flex; align-items: baseline; gap: 12px; font: 500 13px var(--mono); overflow-wrap: anywhere; }
.ep .sig .m { flex-shrink: 0; width: 34px; font: 500 10px var(--mono); color: var(--accent); }
.ep .sig .q { color: var(--muted); }
.ep .what { font-size: 13.5px; color: var(--muted); margin: 7px 0 0 46px; max-width: 48ch; }
.ep .what code { font-size: 11.5px; }
.ep details { margin-top: 10px; }
.ep summary { cursor: pointer; font-size: 12px; color: var(--ink-2); padding: 4px 0; }
.ep details .code { margin-top: 8px; }
.shape { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 48px; align-items: start; }
.shape .code pre { max-height: 560px; }
.fields { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 10px 20px; align-content: start; font-size: 13.5px; }
.fields dt { font: 500 12px var(--mono); color: var(--accent); padding-top: 2px; }
.fields dd { color: var(--muted); }
.fields dd b { color: var(--ink); font-weight: 500; }
.cols3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
.cols3 h3 { font-size: 15px; margin-bottom: 8px; }
.cols3 p { font-size: 13.5px; color: var(--muted); }

@media (max-width: 1100px) {
  .wrap { width: calc(100% - 64px); }
  .nav-links { gap: 18px; }
  .atlas { width: 66%; top: 60px; }
  .sources { grid-template-columns: 1fr 1fr; }
  .cols3 { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .wrap { width: calc(100% - 40px); }
  .nav { min-height: 70px; flex-wrap: wrap; gap: 0; padding: 16px 0; }
  .brand { font-size: 14px; gap: 8px; }
  .brand .product { padding-left: 8px; }
  .brand svg { width: 20px; height: 22px; }
  .js .nav-toggle { display: inline-flex; margin-left: auto; }
  .nav-links { display: flex; width: 100%; flex-wrap: wrap; padding-top: 20px; gap: 14px 22px; }
  .js .nav-links { display: none; }
  .js .nav.open .nav-links { display: flex; }
  .nav-links .btn { width: 100%; }
  .sheet-meta { padding: 13px 0; font-size: 10px; }
  .sheet-meta span:last-child { text-align: right; max-width: 145px; }
  .hero .home-display { font-size: 4.75rem; overflow-wrap: anywhere; }
  .hero .intro { font-size: 16px; margin-top: 20px; max-width: 340px; }
  .query { width: 100%; margin-top: 25px; }
  .atlas { position: relative; top: auto; right: auto; width: 100%; max-width: none; aspect-ratio: 1.08; margin-top: 6px; margin-bottom: 18px; }
  .map-result { font-size: 11px; padding-top: 6px; }
  .map-result b { font-size: 12px; }
  .signup { grid-template-columns: 1fr; gap: 23px; padding-top: 30px; padding-bottom: 30px; }
  .signup h2 { font-size: 33px; }
  .field { flex-direction: column; align-items: stretch; }
  .field input { min-height: 46px; }
  section.block { padding-top: 45px; padding-bottom: 45px; }
  h2 { font-size: 2.375rem; }
  .sec-head { align-items: start; flex-direction: column; gap: 17px; margin-bottom: 25px; }
  .catalogue, .record, .limits, .faq, .shape, .ep, .band .inner { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .faq, .shape { gap: 24px; }
  .ep { gap: 12px; }
  .endpoint { padding: 16px 0; }
  .endpoint code { font-size: 11px; }
  .endpoint-title { gap: 9px; }
  .endpoint p { margin-left: 43px; font-size: 12px; }
  .record-explain { margin-top: 29px; }
  .record .code pre { font-size: 11px; padding: 15px; }
  .layer-list > div { grid-template-columns: 107px 1fr; font-size: 12px; gap: 10px; }
  .limits-right { margin-top: 29px; }
  .limit-values strong { font-size: 49px; }
  .sources { grid-template-columns: 1fr; gap: 27px; }
  .sources h3 { margin-bottom: 6px; }
  .sources p { font-size: 13px; }
  .sources .source-link { margin-top: 8px; }
  .band .actions { justify-content: flex-start; margin-top: 20px; }
  .footer-top { flex-direction: column; align-items: start; gap: 20px; }
  .footer-links { gap: 13px 21px; }
  .footer-bottom { grid-template-columns: 1fr; gap: 20px; }
  .status-list { grid-template-columns: 1fr; }
  .stat-grid, .stat-grid.three { grid-template-columns: 1fr 1fr; gap: 18px; }
}
@media (prefers-reduced-motion: no-preference) {
  .btn { transition: filter 150ms ease; }
  .copy, .nav-links a, .field input { transition: color 120ms ease, border-color 120ms ease, box-shadow 120ms ease; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
@media print {
  .site-header .btn, .nav-toggle, .copy, .theme-control, .query-field .latency { display: none; }
  .record, .shape, .limits { grid-template-columns: 1fr; }
  .record .code pre, .shape .code pre, .code pre, .demo pre { max-height: none; overflow: visible; white-space: pre-wrap; overflow-wrap: anywhere; }
  .atlas { position: relative; width: 100%; max-width: none; }
  .hero-copy { width: 100%; }
  a { color: inherit; }
}

/* Account and administration, in the shared identity. */
.ss-page { max-width: 1160px; margin: 0 auto; padding: 40px 24px 64px; font-variant-numeric: tabular-nums; }
.ss-page > * + * { margin-top: 24px; }
.ss-page h2 { font: 500 28px var(--display); letter-spacing: -.01em; }
.ss-header { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; padding-bottom: 24px; border-bottom: 1px solid var(--line); }
.ss-header > div { min-width: 0; }
.ss-kicker { font: 11px/1.5 var(--mono); letter-spacing: .035em; color: var(--accent); margin-bottom: 8px; }
.ss-h1 { font: 500 clamp(2.4rem, 5vw, 4rem)/1 var(--display); letter-spacing: -.02em; overflow-wrap: anywhere; }
.ss-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.ss-tile { min-width: 0; padding: 18px 18px 16px; border: 1px solid var(--line); border-radius: var(--r-panel); background: var(--surface); }
.ss-tile .lab { font: 500 13px var(--body); color: var(--muted); }
.ss-tile .val { font: 500 34px var(--display); letter-spacing: 0; margin-top: 6px; overflow-wrap: anywhere; }
.ss-tile .val small { font: 400 13px var(--body); color: var(--muted); }
.ss-tile .meter, .ss-meter { display: block; height: 6px; background: var(--surface-3); margin-top: 10px; overflow: hidden; border-radius: var(--r-pill); }
.ss-meter { min-width: 64px; }
.ss-tile .meter i, .ss-meter i { display: block; height: 100%; background: var(--accent); }
.ss-tile .meter i.warn, .ss-meter i.warn { background: var(--warn); }
.ss-charts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border: 1px solid var(--line); border-radius: var(--r-panel); background: var(--surface); overflow: hidden; }
.ss-charts > section { min-width: 0; padding: 20px; }
.ss-charts > section + section { border-left: 1px solid var(--line); }
.ss-chart { height: 160px; margin: 16px 0; }
.ss-chart svg { display: block; width: 100%; height: 100%; overflow: hidden; }
.ss-chart .ss-baseline { stroke: var(--line); stroke-width: 1; }
.ss-chart .ss-bar { fill: var(--accent); }
.ss-chart .ss-bar.weekend { fill: var(--accent-soft); stroke: var(--accent); stroke-width: .5; }
.ss-chart .ss-bar.current { fill: var(--warn); stroke: none; }
.ss-chart .ss-line, .ss-sparkline .ss-line { fill: none; stroke: var(--accent); stroke-width: 2; }
.ss-sparkline { display: block; width: 80px; height: 20px; }
.ss-sparkline .ss-baseline { stroke: var(--line); }
.ss-table { overflow-x: auto; font-variant-numeric: tabular-nums; }
.ss-table table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.ss-table caption { text-align: left; font: 500 26px var(--display); letter-spacing: -.01em; padding: 16px 0; }
.ss-table th { font: 500 12.5px var(--body); color: var(--muted); }
.ss-table th, .ss-table td { padding: 12px 10px; border-bottom: 1px solid var(--line); vertical-align: top; }
.ss-table thead { border-top: 1px solid var(--line); }
.ss-table th:first-child, .ss-table td:first-child { padding-left: 0; }
.ss-table th:last-child, .ss-table td:last-child { padding-right: 0; }
.ss-table .ss-num { text-align: right; white-space: nowrap; }
.ss-mono { font-family: var(--mono); font-variant-numeric: tabular-nums; }
.ss-date { white-space: nowrap; }
.ss-table pre { margin: 0; max-width: 32rem; white-space: pre-wrap; overflow-wrap: anywhere; }
.ss-small { display: block; font-size: 12px; color: var(--muted); margin-top: 6px; }
.ss-pill { display: inline-block; padding: 2px 8px; margin: 0 4px 4px 0; font: 500 11.5px var(--body); border-radius: var(--r-pill); background: var(--accent-soft); color: var(--accent-ink); }
.ss-pill.verified, .ss-pill.resolved { background: var(--good-soft); color: var(--good); }
.ss-pill.pending, .ss-pill.open, .ss-pill.throttle { background: var(--warn-soft); color: var(--warn); }
.ss-pill.suspended, .ss-pill.revoked, .ss-pill.suspend { background: var(--bad-soft); color: var(--bad); }
.ss-pill.watch { background: var(--accent-soft); color: var(--accent-ink); }
.ss-form { display: flex; align-items: end; flex-wrap: wrap; gap: 12px; }
.ss-form label { display: flex; flex-direction: column; gap: 6px; font-size: 13.5px; min-width: 0; color: var(--ink-2); }
.ss-input { width: 100%; min-width: 0; padding: 10px 12px; border: 1px solid var(--line-2); border-radius: var(--r-control); background: var(--surface); color: var(--ink); font: 400 14.5px var(--body); }
.ss-input::placeholder { color: var(--muted); opacity: 1; }
.ss-input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.ss-form .ss-confirm { flex-direction: row; align-items: start; color: var(--ink-2); }
.ss-confirm input { accent-color: var(--accent); }
.ss-btn { display: inline-flex; justify-content: center; align-items: center; gap: 8px; min-height: 40px; padding: 0 16px; border: 1px solid var(--accent); background: var(--accent); color: var(--accent-on); font: 500 14px var(--body); text-decoration: none; cursor: pointer; border-radius: var(--r-control); }
.ss-btn:hover { background: var(--accent); border-color: var(--accent); color: var(--accent-on); filter: brightness(1.12); }
.ss-btn.ghost { background: transparent; color: var(--accent); border-color: var(--line); filter: none; }
.ss-btn.ghost:hover { color: var(--accent); background: var(--accent-soft); border-color: var(--line); filter: none; }
.ss-btn.danger { color: var(--bad); background: var(--bad-soft); border-color: var(--bad-soft); }
.ss-btn.danger:hover { border-color: var(--bad); background: var(--bad-soft); color: var(--bad); }
.ss-btn:disabled { opacity: .6; cursor: wait; }
.ss-callout { padding: 24px; border: 1px solid var(--accent); border-radius: var(--r-panel); background: var(--accent-soft); color: var(--ink); }
.ss-callout pre { margin: 16px 0; white-space: pre-wrap; overflow-wrap: anywhere; font: 500 16px var(--mono); user-select: all; }
.ss-callout .copy { position: static; margin: 0; }
.ss-actions { display: flex; align-items: start; flex-wrap: wrap; gap: 10px; }
.ss-table .ss-actions { min-width: 180px; }
.ss-table .ss-btn { min-height: 30px; padding: 0 10px; font-size: 12.5px; }
.ss-empty { padding: 24px 0; color: var(--muted); font-size: 14px; }
.ss-details { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 16px 0; }
.ss-details > summary { cursor: pointer; font-size: 13.5px; color: var(--ink-2); }
.ss-details[open] > summary { margin-bottom: 16px; }
.ss-actions > .ss-details { border: 0; padding: 0; }
.ss-actions .ss-form { flex-direction: column; align-items: stretch; max-width: 24rem; padding: 12px 0; }
.ss-paging { display: flex; align-items: center; flex-wrap: wrap; gap: 16px; font-size: 13.5px; }
.ss-section { border-top: 1px solid var(--line); padding-top: 24px; }
.ss-attention { padding-left: 20px; display: grid; gap: 10px; font-size: 14px; }
.ss-tile .val a { color: var(--ink); text-decoration-color: var(--line-2); text-underline-offset: 5px; }
.ss-tile .val a:hover { color: var(--accent); }
.ss-facts { display: grid; grid-template-columns: minmax(9rem, 1fr) minmax(0, 3fr); gap: 0 20px; }
.ss-facts dt, .ss-facts dd { margin: 0; padding: 12px 0; border-bottom: 1px solid var(--line); overflow-wrap: anywhere; font-size: 14px; }
.ss-facts dt { color: var(--muted); }
.ss-log { white-space: pre-wrap; overflow-wrap: anywhere; font: 13px/1.6 var(--mono); padding: 16px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-panel); }
@media (max-width: 860px) {
  .ss-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ss-charts { grid-template-columns: 1fr; }
  .ss-charts > section + section { border-left: 0; border-top: 1px solid var(--line); }
}
@media (max-width: 560px) {
  .ss-page { padding: 28px 16px 40px; }
  .ss-tiles { grid-template-columns: 1fr; }
  .ss-form > label { width: 100%; }
}

/* Founder console. Scoped so public and customer pages retain their styles. */
.ss-console { display: grid; grid-template-columns: 176px minmax(0, 1fr); max-width: 1600px; margin: auto; font: 15px/1.5 var(--body); }
.ss-console :where(.ss-page) { max-width: none; min-width: 0; width: 100%; padding: 24px 32px 64px; }
.ss-console-bare { grid-template-columns: minmax(0, 1fr); max-width: 720px; }
:where(.ss-console) .ss-page h2 { font: 600 24px/1.25 var(--display); letter-spacing: 0; }
.ss-console :where(h3) { font: 500 18px/1.5 var(--body); }
.ss-console :where(p) { max-width: 72ch; }
.ss-console :where(.ss-h1) { font: 600 40px/1.1 var(--display); letter-spacing: 0; }
.ss-console :where(.ss-kicker) { font: 13px/1.5 var(--body); letter-spacing: 0; color: var(--ink-2); }
.ss-console :where(.ss-header) { align-items: end; gap: 16px; padding-bottom: 16px; }
.ss-console :where(.ss-small, figcaption, .ss-axis-caption) { font: 13px/1.5 var(--body); color: var(--ink-2); }
.ss-console :where(a, button, input, textarea, select, summary, [tabindex]):focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; box-shadow: none; }
.ss-skip { position: absolute; left: 16px; top: -100px; padding: 8px 16px; background: var(--surface); z-index: 10; }
.ss-skip:focus { top: 8px; }
.ss-visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.ss-rail { position: sticky; top: 0; height: calc(100dvh - 80px); align-self: start; display: flex; flex-direction: column; border-right: 1px solid var(--line); padding: 24px 8px; min-width: 0; }
.ss-rail-nav { overflow-y: auto; min-height: 0; }
.ss-rail-group { margin-bottom: 16px; }
.ss-rail-label { padding: 0 16px; font-size: 13px; color: var(--ink-2); }
.ss-rail-link { display: block; padding: 8px 16px; border-left: 3px solid transparent; color: var(--ink); text-decoration: none; }
.ss-rail-link[aria-current="page"] { border-left-color: var(--accent); color: var(--accent); background: var(--accent-soft); }
.ss-signout { margin-top: auto; padding: 32px 8px 0; }
.ss-search { margin-left: auto; flex-wrap: nowrap; }
.ss-search :where(label) { flex: 1; min-width: min(280px, 50vw); }
.ss-console .ss-status { min-height: 0; margin: 0; color: var(--ink); }
.ss-console .ss-status:empty { padding: 0; border: 0; }
.ss-console .ss-status:not(:empty) { padding: 8px 0; border-bottom: 1px solid var(--line); }
.ss-service { display: grid; grid-template-columns: minmax(0, 3fr) minmax(336px, 1fr); gap: 24px; border-bottom: 1px solid var(--line); padding-bottom: 16px; }
.ss-contour { margin: 8px 0 0; min-width: 0; }
.ss-contour :where(svg) { display: block; width: 100%; height: auto; }
.ss-volume { fill: var(--ink); fill-opacity: .15; stroke: var(--ink); stroke-width: 1; }
.ss-error-line { fill: none; stroke: var(--signal); stroke-width: 2; stroke-dasharray: 4 3; vector-effect: non-scaling-stroke; }
.ss-latency-line { fill: none; stroke: var(--accent); stroke-width: 2; vector-effect: non-scaling-stroke; }
.ss-axis { stroke: var(--line); stroke-width: 1; }
.ss-axis-label { fill: var(--ink-2); font: 13px var(--mono); }
.ss-counts { display: flex; gap: 24px; flex-wrap: wrap; margin: 16px 0; }
.ss-counts :where(div) { min-width: 112px; }
.ss-counts :where(dt) { font-size: 13px; color: var(--ink-2); }
.ss-counts :where(dd) { margin: 0; font: 600 40px/1.25 var(--display); font-variant-numeric: tabular-nums; }
.ss-counts :where(a) { color: var(--ink); text-decoration-thickness: 1px; text-underline-offset: 4px; }
.ss-service :where(.ss-counts) { display: grid; grid-template-columns: 1fr 1fr; align-content: center; gap: 16px; }
.ss-today-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
.ss-today-columns :where(section), .ss-investigation :where(section) { min-width: 0; }
.ss-console :where(.ss-attention) { padding: 0; list-style: none; margin-top: 16px; }
.ss-attention :where(li) { border-left: 2px solid var(--signal); padding-left: 12px; }
.ss-saved-views { display: flex; flex-wrap: wrap; gap: 8px 24px; align-items: baseline; }
.ss-filter-row { gap: 8px; padding: 16px 0; border-block: 1px solid var(--line); }
.ss-console :where(.ss-input) { padding: 8px; font-size: 15px; }
.ss-console :where(textarea) { resize: vertical; }
.ss-investigation { display: grid; grid-template-columns: minmax(220px, 1fr) minmax(0, 2fr); gap: 32px; align-items: start; }
.ss-timeline { list-style: none; padding: 0 0 0 16px; margin: 16px 0; border-left: 1px solid var(--line); }
.ss-timeline :where(li) { padding-bottom: 24px; overflow-wrap: anywhere; }
.ss-timeline :where(p) { margin-top: 8px; }
.ss-action-bar { display: flex; flex-wrap: wrap; gap: 8px; align-items: start; padding-block: 16px; border-block: 1px solid var(--line); }
.ss-action-bar > .ss-details { border: 0; padding: 0; }
.ss-action-bar .ss-form { display: flex; flex-direction: column; align-items: stretch; max-width: 32rem; padding: 16px 0; }
.ss-key-actions { padding-block: 16px; }
.ss-console meter.ss-meter { -webkit-appearance: none; appearance: none; display: block; width: 100%; height: 8px; border: 0; border-radius: var(--r-pill); background: var(--surface-3); }
.ss-console meter.ss-meter::-webkit-meter-bar { background: var(--surface-3); border: 0; border-radius: var(--r-pill); }
.ss-console meter.ss-meter::-webkit-meter-optimum-value,
.ss-console meter.ss-meter::-webkit-meter-suboptimum-value,
.ss-console meter.ss-meter::-webkit-meter-even-less-good-value { background: var(--ink); }
.ss-console meter.ss-meter::-moz-meter-bar { background: var(--ink); }
.ss-console :where(.ss-table) { position: relative; max-height: min(70vh, 640px); }
:where(.ss-console) .ss-table table { font-size: 13px; }
:where(.ss-console) .ss-table caption { font: 600 24px/1.25 var(--display); letter-spacing: 0; }
:where(.ss-console) .ss-table th, :where(.ss-console) .ss-table td { padding: 8px; height: 36px; }
:where(.ss-console) .ss-table thead th { position: sticky; top: 0; background: var(--bg); z-index: 1; }
:where(.ss-console) .ss-table tr:hover { background: color-mix(in srgb, var(--ink) 4%, transparent); }
:where(.ss-console) .ss-num, :where(.ss-console) .ss-table code { font-family: var(--mono); text-align: right; font-variant-numeric: tabular-nums; }
.ss-console :where(.ss-pill) { background: transparent; color: var(--ink-2); border: 1px solid var(--line); }
:where(.ss-console) .ss-pill:is(.open, .pending, .suspended, .revoked, .suspend, .throttle) { color: var(--signal-ink); background: transparent; }
:where(.ss-console) .ss-pill:is(.verified, .resolved, .watch) { color: var(--ink-2); background: transparent; }
.ss-service-charts { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 24px; }
.ss-service-chart { min-width: 0; margin: 16px 0 0; }
:where(.ss-console) .ss-chart .ss-bar { fill: var(--ink); stroke: none; }
:where(.ss-console) .ss-errors-chart .ss-bar { fill: var(--signal); }
:where(.ss-console) .ss-latency-chart .ss-bar { fill: var(--accent); }
:where(.ss-console) .ss-sparkline .ss-line { stroke: var(--ink); }
:where(.ss-console) .ss-sparkline .ss-line[stroke-dasharray] { stroke: var(--signal); }
.ss-row-disclosure { white-space: normal; min-width: 0; }
.ss-row-disclosure :where(summary) { cursor: pointer; color: var(--accent); margin-top: 8px; }
.ss-row-disclosure :where(dt) { color: var(--ink-2); margin-top: 8px; }
.ss-row-disclosure :where(dd) { margin: 0; overflow-wrap: anywhere; }
@media (max-width: 1099px) {
  .ss-console { grid-template-columns: minmax(0, 1fr); }
  .ss-rail { position: static; height: auto; flex-direction: row; align-items: center; gap: 16px; padding: 8px 16px; border-right: 0; border-bottom: 1px solid var(--line); }
  .ss-rail-nav { display: flex; position: static; overflow-x: auto; overflow-y: hidden; gap: 16px; min-width: 0; padding-right: 24px; padding-bottom: 8px; scrollbar-width: thin; }
  .ss-rail-group { display: flex; align-items: center; margin: 0; gap: 4px; flex-shrink: 0; }
  .ss-rail-label { padding: 0 4px; }
  .ss-rail-link { white-space: nowrap; border-left: 0; border-bottom: 3px solid transparent; padding: 8px; }
  .ss-rail-link[aria-current="page"] { border-bottom-color: var(--accent); }
  .ss-signout { padding: 0; margin: 0 0 0 auto; flex-shrink: 0; }
}
@media (max-width: 760px) {
  .ss-console :where(.ss-page) { padding: 24px 16px 40px; }
  .ss-service, .ss-today-columns, .ss-investigation { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .ss-service :where(.ss-counts) { grid-template-columns: repeat(2, 1fr); margin: 0; }
  .ss-search { margin: 0; width: 100%; }
  .ss-filter-row :where(label) { flex: 1 1 120px; }
  .ss-table-mobile :where(table) { table-layout: fixed; }
  .ss-table-mobile :where(td, th) { overflow-wrap: normal; }
  .ss-table-mobile :where(.ss-date) { white-space: normal; }
}

/* Today: a status sentence, one volume band and an actionable inbox. */
.ss-console .ss-service-sentence { font: 600 clamp(24px, 3vw, 40px)/1.25 var(--display); max-width: 48ch; margin: 16px 0 24px; }
.ss-console .ss-today-figures { display: flex; flex-wrap: wrap; gap: 16px 40px; margin: 0 0 24px; }
.ss-console .ss-today-figures dt { font-size: 13px; color: var(--ink-2); }
.ss-console .ss-today-figures dd { margin: 4px 0 0; font: 24px/1.5 var(--mono); font-variant-numeric: tabular-nums; }
.ss-console .ss-lookup-band { margin: 0; width: 100%; }
.ss-console .ss-band-canvas { display: grid; grid-template-columns: minmax(0, 1fr) 64px; }
.ss-console .ss-band-plot { display: block; width: 100%; height: 176px; }
.ss-console .ss-band-labels { display: block; width: 64px; height: 176px; }
.ss-console .ss-band-dates { display: flex; justify-content: space-between; margin: 8px 64px 4px 0; font-size: 13px; color: var(--ink-2); }
.ss-console .ss-band-area { fill: var(--ink); fill-opacity: .15; }
.ss-console .ss-band-line { fill: none; stroke: var(--ink); stroke-width: 1; }
.ss-console .ss-inbox, .ss-console .ss-week-rows, .ss-console .ss-upcoming, .ss-console .ss-funnel-bars { list-style: none; padding: 0; margin: 16px 0; }
.ss-console .ss-inbox-row { display: grid; gap: 12px; padding: 16px 0; border-bottom: 1px solid var(--line); overflow-wrap: anywhere; }
.ss-console .ss-inbox-row p { margin: 0; }
.ss-console .ss-inbox-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.ss-console .ss-inbox-actions form { margin: 0; }
.ss-console .ss-inbox-actions .ss-btn { min-height: 44px; border: 1px solid var(--line); border-radius: var(--r-control); box-shadow: none; }
.ss-console .ss-week-rows li, .ss-console .ss-upcoming li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--line); overflow-wrap: anywhere; }
.ss-console .ss-week-rows small { display: block; color: var(--ink-2); font-size: 13px; }
.ss-console .ss-upcoming li { grid-template-columns: 160px minmax(0, 1fr); }
.ss-console .ss-funnel-bars li { display: grid; grid-template-columns: 136px minmax(0, 1fr) 6ch; align-items: center; gap: 16px; padding: 4px 0; }
.ss-console .ss-funnel-bars li > :last-child { text-align: right; }
.ss-console .ss-funnel-bars meter { appearance: none; width: 100%; height: 8px; border: 0; border-radius: 2px; background: var(--line); }
.ss-console .ss-funnel-bars meter::-webkit-meter-bar { background: var(--line); border: 0; border-radius: 2px; }
.ss-console .ss-funnel-bars meter::-webkit-meter-optimum-value { background: var(--ink); border-radius: 2px; }
.ss-console .ss-funnel-bars meter::-moz-meter-bar { background: var(--ink); border-radius: 2px; }
.ss-console .ss-today-columns h3 { font: 600 18px/1.5 var(--display); }
.ss-console .ss-today-footer { border-top: 1px solid var(--line); margin-top: 32px; padding-top: 16px; font: 13px/1.5 var(--mono); color: var(--ink-2); }
.ss-console .ss-today-money dd { font-family: var(--mono); }
.ss-console .ss-mono { font-family: var(--mono); font-variant-numeric: tabular-nums; }
@media (max-width: 1099px) {
  .ss-console .ss-today-columns { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
  .ss-console .ss-inbox-actions { display: grid; grid-template-columns: minmax(0, 1fr); }
  .ss-console .ss-inbox-actions .ss-btn { width: 100%; justify-content: center; }
  .ss-console .ss-inbox-actions > :last-child { order: -1; }
  .ss-console .ss-upcoming li { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  .ss-console .ss-today-figures { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 24px; }
  .ss-console:has(.ss-today-service) .ss-search { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; }
  .ss-console:has(.ss-today-service) .ss-search label { min-width: 0; }
  .ss-console:has(.ss-today-service) .ss-search :is(.ss-input, .ss-btn) { height: 44px; min-height: 44px; }
}

/* Public postcode and locality reference pages. */
.place-breadcrumbs { padding-top: 32px; font: 12px/1.8 var(--mono); color: var(--muted); overflow-wrap: anywhere; }
.place-heading { padding-top: 28px; max-width: 850px; }
.place-heading h1 { font-size: clamp(2.4rem, 5vw, 4rem); overflow-wrap: anywhere; margin: 12px 0 20px; }
.place-heading .intro { max-width: 720px; font-size: 18px; line-height: 1.65; color: var(--ink-2); }
.place-index { display: grid; grid-template-columns: 5rem minmax(0, 1fr); font-size: 14px; }
.place-index dt, .place-index dd { padding: 10px 0; border-bottom: 1px solid var(--line); margin: 0; overflow-wrap: anywhere; }
.place-index dt { font-family: var(--mono); }
.place-suburbs { columns: 3; column-gap: 32px; list-style: none; padding: 0; margin-top: 20px; }
.place-suburbs li { break-inside: avoid; padding: 6px 0; overflow-wrap: anywhere; font-size: 14px; }
.place-suburbs .mono { font-size: 12px; color: var(--muted); margin-left: 8px; }
.place-letter { border-top: 2px solid var(--line-2); padding: 24px 0 40px; content-visibility: auto; contain-intrinsic-size: auto max(600px, calc(var(--place-rows, 0) * 40px / var(--place-columns, 3))); scroll-margin-top: 24px; }
.place-letter h2 { display: flex; align-items: baseline; gap: 16px; }
.place-letter h2 .mono { font-size: 12px; font-weight: 400; color: var(--muted); }
.place-letters { display: flex; flex-wrap: wrap; gap: 8px; margin: 32px 0; }
.place-letters a { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 1px solid var(--line); font: 13px var(--mono); text-decoration: none; }
#suburb-index .place-letters a[aria-current="location"] { background: var(--accent); color: var(--accent-on); border-color: var(--accent); }
.place-filter { max-width: 480px; margin-bottom: 32px; }
.place-filter label { display: block; margin-bottom: 8px; font-size: 14px; }
.place-filter input { width: 100%; min-height: 44px; padding: 10px 12px; background: var(--surface); border: 1px solid var(--line-2); color: var(--ink); font: 16px var(--body); border-radius: var(--r-control); }
.place-filter p { min-height: 1.5em; margin-top: 8px; font-size: 12px; color: var(--muted); }
#suburb-index [hidden] { display: none; }
.place-facts { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 24px; border-top: 1px solid var(--line); margin-top: 24px; padding-top: 20px; }
.place-facts dt { font-size: 12px; color: var(--muted); }
.place-facts dd { margin: 8px 0 0; font-size: 16px; overflow-wrap: anywhere; }
.place-state-details { margin-top: 24px; font-size: 14px; }
.place-state-details p + p { margin-top: 8px; }
.place-coordinates { margin: 24px 0 32px; font-size: 12px; color: var(--muted); }
.place-glance .place-map { max-width: 900px; margin: 0 auto; }
.place-map-labelled { aspect-ratio: auto; }
.place-map-surface { position: relative; aspect-ratio: 1.19; }
.place-map-label { display: block; padding-bottom: 16px; font: 12px var(--mono); color: var(--ink-2); }
.place-geography { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 48px; }
.place-geography h3 { font-size: 18px; }
.place-geography .place-shares li { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; font: 12px/1.7 var(--mono); }
.place-geography .place-shares li > :first-child { overflow-wrap: anywhere; }
.place-geography .place-shares li > :last-child { flex-shrink: 0; }
.place-overview { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; gap: 40px; }
.place-overview h2 { margin-bottom: 16px; }
.place-overview .endpoint p { margin-left: 0; }
.place-map { position: relative; top: auto; right: auto; width: 100%; max-width: none; min-width: 0; margin: 0; }
.place-shares { list-style: none; padding: 0; margin-top: 16px; font-size: 14px; }
.place-shares li { padding: 6px 0; border-bottom: 1px solid var(--line); }
.place-neighbours { display: flex; flex-wrap: wrap; gap: 24px; padding: 28px 0; }
.place-neighbours .small-label { flex-basis: 100%; }
.place-heading ~ .docs-nav { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 28px; }
.place-overview + .code, .block > .code + .code { margin-top: 16px; }
@media (max-width: 760px) {
  .place-map-surface { aspect-ratio: 1.08; }
  .place-overview { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .place-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .place-geography { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 599px) {
  .place-suburbs { columns: 1; }
  .place-letter { --place-columns: 1; }
  .place-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Integration guides */
.integration-snippet { margin: 32px 0; padding-top: 16px; border-top: 1px solid var(--line); }
.integration-snippet h3 { margin: 0 0 8px;
  overflow-wrap: anywhere;
}
.integration-snippet { max-width: 100%; }
.integration-snippet .code, .integration-snippet pre { max-width: 100%; overflow-x: auto; }
.integration-checks { margin: 12px 0 0; }
.muted { color: var(--ink-2, color-mix(in srgb, var(--ink) 62%, var(--bg))); }

/* Account pages and My account menu. Keep changes within this section. */
.ss-account { padding: 48px 0 64px; font: 400 15px/1.5 var(--body); }
.ss-account :where(h1, h2, h3, p, pre, form, nav, dl) { margin: 0; }
.ss-account .sec-head { margin-bottom: 32px; }
.ss-account-section > :where(* + *) { margin-top: 16px; }
.ss-account-section { min-width: 0; }
.ss-account > :where(* + *) { margin-top: 24px; }
.ss-key-tabs { display: flex; flex-wrap: wrap; gap: 24px; padding-bottom: 8px; border-bottom: 1px solid var(--line); }
.ss-key-tabs [aria-current="page"] { color: var(--accent); text-decoration-thickness: 2px; }
.ss-account :where(summary, label) { overflow-wrap: anywhere; }
.ss-account .block { padding-top: 48px; padding-bottom: 48px; }
.ss-account .ss-integrations { border-bottom: 1px solid var(--line); }
.ss-account-cards { display: grid; gap: 0 32px; }
.ss-account-totals { display: grid; gap: 24px; }
.ss-account-totals dd { margin: 8px 0 0; font-size: 18px; }
.ss-account-menu { position: relative; }
.ss-account-menu > summary { cursor: pointer; padding: 8px 0; font-size: 14px; }
.ss-account-menu-items { display: grid; gap: 8px; padding: 16px; min-width: 200px; border: 1px solid var(--line); background: var(--surface); border-radius: 2px; }
.ss-account-menu-items a { padding: 8px; }
.ss-account-menu-items button { border: 0; background: transparent; color: var(--ink); padding: 8px; font: inherit; cursor: pointer; }
.ss-account-menu :focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.ss-account h2 { font: 600 24px/1.2 var(--display); letter-spacing: 0; }
.ss-account :where(h3) { font: 500 18px/1.5 var(--body); letter-spacing: 0; }
.ss-account :where(p) { max-width: 72ch; }
.ss-account :where(code, pre, time, .ss-mono, .ss-number) { font-family: var(--mono); font-variant-numeric: tabular-nums; }
.ss-account :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; box-shadow: none; }
.ss-account :where(button, input, select, textarea) { border-radius: 2px; }
.ss-account :where(.ss-input) { font-size: 15px; }
.ss-account :where(.ss-h1) { font: 600 40px/1.1 var(--display); letter-spacing: 0; }
.ss-account :where(.ss-kicker) { font: 400 15px/1.5 var(--body); letter-spacing: 0; color: var(--ink-2); margin-bottom: 8px; }
.ss-account :where(.ss-header) { padding-bottom: 16px; }
.ss-account :where(.ss-btn) { min-height: 36px; font-size: 15px; padding: 8px 16px; }
.ss-account :where(.ss-btn:disabled) { opacity: .55; cursor: default; }
.ss-account :where(.ss-empty) { color: var(--ink-2); font-size: 15px; padding: 8px 0; }
:where(.ss-account) .ss-status { min-height: 24px; margin-top: 8px; }
:where(.ss-account) .ss-status:empty { display: block; }
:where(.ss-account) .ss-status[data-error="true"] { color: var(--signal); }
:where(.ss-account) .ss-attention-line { padding: 16px; border: 1px solid var(--signal); border-radius: 2px; color: var(--signal); }
:where(.ss-account) .ss-secondary { color: var(--ink-2); font-size: 13px; }
:where(.ss-account) .ss-code { padding: 16px; border: 1px solid var(--line); border-radius: 2px; background: var(--surface); font: 400 13px/1.5 var(--mono); white-space: pre-wrap; overflow-wrap: anywhere; max-height: 400px; overflow: auto; }
:where(.ss-account) .ss-issued { padding: 16px 0; }
:where(.ss-account) .ss-issued > :where(* + *) { margin-top: 8px; }
:where(.ss-account) .ss-result { min-height: 96px; }
:where(.ss-account) .ss-lookup-controls { display: flex; gap: 8px; margin-top: 8px; max-width: 720px; }
:where(.ss-account) .ss-lookup-controls > :where(input) { flex: 1; }
:where(.ss-account) .ss-lookup-controls > :where(button) { flex-shrink: 0; }
:where(.ss-account) .ss-lookup-form > :where(p) { margin-top: 8px; }
:where(.ss-account) .ss-snippet-tabs { display: flex; gap: 24px; flex-wrap: wrap; border-bottom: 1px solid var(--line); padding-bottom: 8px; }
:where(.ss-account) .ss-snippet-tabs :where([aria-selected="true"]) { color: var(--ink); text-decoration-thickness: 2px; text-underline-offset: 8px; }
:where(.ss-account) .ss-snippet > :where(* + *) { margin-top: 8px; }
:where(.ss-account) .ss-snippet[hidden] { display: none; }
:where(.ss-account) .ss-usage-columns { display: grid; grid-template-columns: minmax(0, 1fr); gap: 32px; align-items: start; }
:where(.ss-account) .ss-key-usage { padding: 16px 0; border-bottom: 1px solid var(--line); }
:where(.ss-account) .ss-resource { display: grid; grid-template-columns: 1fr auto; gap: 8px 16px; padding-top: 8px; }
:where(.ss-account) .ss-resource > :where(.ss-secondary) { grid-column: 1 / -1; }
:where(.ss-account) .ss-usage-meter { -webkit-appearance: none; appearance: none; grid-column: 1 / -1; width: 100%; height: 8px; border: 0; border-radius: 2px; background: var(--line); accent-color: var(--ink); }
:where(.ss-account) .ss-usage-meter::-webkit-meter-bar { background: var(--line); border: 0; border-radius: 2px; }
:where(.ss-account) .ss-usage-meter::-webkit-meter-optimum-value,
:where(.ss-account) .ss-usage-meter::-webkit-meter-suboptimum-value,
:where(.ss-account) .ss-usage-meter::-webkit-meter-even-less-good-value { background: var(--ink); }
:where(.ss-account) .ss-usage-meter::-moz-meter-bar { background: var(--ink); }
:where(.ss-account) .ss-daily-chart { display: block; width: 100%; height: auto; margin: 16px 0; }
:where(.ss-account) .ss-daily-bar { fill: var(--ink); }
:where(.ss-account) .ss-chart-axis { stroke: var(--line); }
:where(.ss-account) .ss-chart-label { fill: var(--ink-2); font: 13px var(--mono); }
:where(.ss-account) .ss-daily-values { margin: 16px 0; }
:where(.ss-account) .ss-console-table { overflow: auto; max-height: 640px; }
:where(.ss-account) .ss-console-table :where(table) { width: 100%; border-collapse: collapse; text-align: left; font-size: 13px; }
:where(.ss-account) .ss-console-table :where(caption) { text-align: left; font: 500 18px/1.5 var(--body); padding: 0 0 8px; }
:where(.ss-account) .ss-console-table :where(th, td) { height: 36px; padding: 8px; border-bottom: 1px solid var(--line); vertical-align: top; }
:where(.ss-account) .ss-console-table :where(thead th) { position: sticky; top: 0; z-index: 1; background: var(--surface); font-weight: 500; color: var(--ink-2); }
:where(.ss-account) .ss-console-table :where(tbody tr:hover) { background: color-mix(in srgb, var(--ink) 4%, transparent); }
:where(.ss-account) .ss-number { text-align: right; white-space: nowrap; }
:where(.ss-account) .ss-kind { display: inline-block; border: 1px solid var(--line); border-radius: 2px; padding: 0 8px; font-size: 13px; }
:where(.ss-account) .ss-key-prefix { overflow-wrap: anywhere; }
:where(.ss-account) .ss-key-mobile { display: table-row; }
:where(.ss-account) .ss-key-extra { display: none; }
:where(.ss-account) .ss-key-details { margin-top: 8px; }
:where(.ss-account) .ss-key-facts { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 8px 16px; margin-top: 16px; }
:where(.ss-account) .ss-key-facts :where(dd) { margin: 0; overflow-wrap: anywhere; }
:where(.ss-account) .ss-key-facts :where(dt) { color: var(--ink-2); }
:where(.ss-account) .ss-key-actions { display: flex; flex-wrap: wrap; gap: 8px 16px; }
:where(.ss-account) .ss-key-extra > .ss-key-actions { min-width: 224px; }
:where(.ss-account) .ss-key-action { flex: 0 0 auto; }
:where(.ss-account) .ss-key-action[open] { flex-basis: 100%; }
:where(.ss-account) .ss-key-action :where(summary), :where(.ss-account) .ss-key-details :where(summary), :where(.ss-account) .ss-daily-values :where(summary) { cursor: pointer; }
:where(.ss-account) .ss-inline-form { display: grid; gap: 16px; padding: 16px 0; }
:where(.ss-account) .ss-inline-form :where(.ss-confirm) { display: block; }
:where(.ss-account) .ss-inline-form :where(.ss-btn) { justify-self: start; }
:where(.ss-account) :is(.ss-key-create, .ss-key-action) :where(fieldset) { display: grid; gap: 16px; border: 1px solid var(--line); border-radius: 2px; padding: 16px; min-width: 0; }
:where(.ss-account) :is(.ss-key-create, .ss-key-action) :where(legend) { padding: 0 8px; font-size: 18px; }
:where(.ss-account) .ss-key-create :where(label) { display: grid; gap: 8px; }
:where(.ss-account) .ss-browser-websites { flex-basis: 100%; }
:where(.ss-account) .ss-plan-current { display: flex; align-items: baseline; flex-wrap: wrap; gap: 16px; }
:where(.ss-account) .ss-plan-limits { font-size: 13px; }
:where(.ss-account) .ss-plan-upgrade { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; border-top: 1px solid var(--line); padding: 16px 0; }
:where(.ss-account) .ss-plan-upgrade[data-selected] { border: 2px solid var(--accent); padding: 16px; }
:where(.ss-account) .ss-plan-upgrade > :where(p) { flex: 1 1 480px; max-width: none; }
:where(.ss-account) .ss-integrations :where(a) { display: inline-block; margin-right: 16px; }
:where(.ss-account) .ss-keys-table { table-layout: fixed; }
:where(.ss-account) .ss-keys-table :where(th, td) { overflow-wrap: normal; }
@media (min-width: 761px) {
  .ss-account .block { padding-top: 64px; padding-bottom: 64px; }
  .ss-account-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ss-account-totals { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ss-account-menu-items { position: absolute; right: 0; top: 100%; z-index: 20; box-shadow: var(--shadow); }
  :where(.ss-account) .ss-usage-columns { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); }
  :where(.ss-account) .ss-key-extra { display: table-cell; }
  :where(.ss-account) .ss-key-mobile { display: none; }
  :where(.ss-account) .ss-keys-table { table-layout: auto; }
}
@media (max-width: 400px) {
  :where(.ss-account) .ss-lookup-controls { flex-wrap: wrap; }
  :where(.ss-account) .ss-lookup-controls > :where(input) { flex-basis: 100%; }
}

.ss-account :where([hidden]) { display: none; }

@media (prefers-reduced-motion: reduce) {
  .ss-account *, .ss-account-menu * { scroll-behavior: auto; transition: none; animation: none; }
}

/* Console sweep: preserve words and contain identifiers and controls. */
td.ss-identifier, td.ss-mono, td :where(code, .ss-mono), .ss-key-prefix { overflow-wrap: anywhere; }
th.ss-actions-cell { white-space: nowrap; }
td.ss-actions-cell { white-space: normal; }
td.ss-actions-cell :where(button, .btn, a) { white-space: nowrap; }
td.ss-identifier { min-width: 16ch; }
.ss-pill, .ss-account .ss-kind { white-space: nowrap; }
.ss-service .ss-counts { grid-template-columns: repeat(2, minmax(150px, 1fr)); }
.ss-service .ss-counts dd { font-size: clamp(22px, 2.2vw, 32px); }
.ss-service .ss-counts dd { white-space: nowrap; font-variant-numeric: tabular-nums; font-size: clamp(24px, 3vw, 40px); }
.ss-key-chart-desktop { display: none; }
@media (min-width: 1100px) {
  .ss-key-chart-desktop { display: block; margin-top: 8px; }
  .ss-key-chart-phone { display: none; }
  .ss-service { grid-template-columns: minmax(0, 3fr) minmax(288px, 1fr); }
}
@media (max-width: 1099px) {
  .ss-rail { flex-wrap: wrap; }
  .ss-rail-nav { flex: 1 1 100%; }
}
.ss-account .ss-key-create label.ss-confirm { display: block; }
.ss-account .ss-confirm input[type="checkbox"] { display: inline-block; width: auto; margin: 0 8px 0 0; vertical-align: middle; }
.ss-account .ss-keys-table td:has(> .ss-usage-meter),
.ss-account .ss-keys-table:has(.ss-usage-meter) th:nth-child(6) { width: 152px; min-width: 152px; max-width: 152px; white-space: normal; }
.ss-account .ss-keys-table td > .ss-usage-meter { display: block; width: 136px; max-width: 100%; margin-top: 8px; }
.ss-account .ss-keys-table:has(.ss-usage-meter) td:nth-child(7) { overflow-wrap: anywhere; }
.ss-account .ss-keys-table td:last-child:has(.ss-key-actions) { white-space: nowrap; }

.ss-console .ss-table td.ss-identifier { min-width: 128px; }
.ss-console .ss-table th[data-label="Name and prefix"], .ss-console .ss-table td[data-label="Name and prefix"] { min-width: 160px; }

/* Customer overview bands, approved 27 October 2026. */
.ss-account:has(.ss-overview-header) { overflow-wrap: anywhere; }
.ss-account .ss-overview-header { display: block; }
.ss-account .ss-account-toolbar, .ss-account .ss-jump-row { display: flex; align-items: center; flex-wrap: wrap; gap: 16px; }
.ss-account .ss-account-toolbar { border-bottom: 1px solid var(--line); padding-bottom: 24px; margin-bottom: 32px; }
.ss-account .ss-jump-row { flex: 1 1 auto; }
.ss-account .ss-jump-row a { padding: 8px 0; }
.ss-account .ss-account-toolbar > p { font: 400 13px/1.5 var(--mono); margin: 0; }
.ss-account .ss-overview-header > h1 + p { margin-top: 16px; }
.ss-account .ss-try-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 32px; }
.ss-account .ss-try-grid > * { min-width: 0; }
.ss-account .ss-try-request > * + *, .ss-account .ss-try-response > * + * { margin-top: 24px; }
.ss-account .ss-try-grid .ss-code { white-space: pre-wrap; overflow-wrap: anywhere; max-width: 100%; }
.ss-account .ss-try-grid .ss-result { min-height: 240px; max-height: 560px; overflow-y: auto; }
.ss-account .ss-response-notes { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 16px; font-size: 13px; }
.ss-account .ss-response-notes dd { margin: 0; }
.ss-account .ss-snippet-tabs { gap: 8px 24px; }
.ss-account .ss-band-heading { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 16px; }
.ss-account .ss-band-heading p { font-size: 13px; }
.ss-account .ss-overview-resource { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px 16px; padding: 16px 0; border-bottom: 1px solid var(--line); }
.ss-account .ss-overview-resource small { display: block; color: var(--ink-2); font-size: 13px; }
.ss-account .ss-overview-resource .ss-usage-meter { grid-column: 1 / -1; grid-row: 2; }
.ss-account .ss-overview-resource > .ss-secondary { grid-column: 1 / -1; }
:root[data-brand] .ss-account .ss-overview-resource .ss-usage-meter { accent-color: var(--ink); }
:root[data-brand] .ss-account .ss-overview-resource .ss-usage-meter::-webkit-meter-optimum-value,
:root[data-brand] .ss-account .ss-overview-resource .ss-usage-meter::-webkit-meter-suboptimum-value,
:root[data-brand] .ss-account .ss-overview-resource .ss-usage-meter::-webkit-meter-even-less-good-value { background: var(--ink); }
:root[data-brand] .ss-account .ss-overview-resource .ss-usage-meter::-moz-meter-bar { background: var(--ink); }
.ss-account .ss-endpoint-list { list-style: none; padding: 0; margin: 16px 0 0; }
.ss-account .ss-endpoint-list li { display: flex; justify-content: space-between; gap: 16px; padding: 8px 0; border-bottom: 1px solid var(--line); }
.ss-account .ss-visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.ss-account .ss-create-panel { border: 1px solid var(--line); border-radius: 2px; padding: 24px; }
.ss-account .ss-create-panel > * + * { margin-top: 16px; }
.ss-account .ss-create-panel .ss-key-create > fieldset { padding: 0; border: 0; }
.ss-account .ss-create-panel .ss-key-create > fieldset > legend { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.ss-account .ss-create-controls > * + * { margin-top: 16px; }
.ss-account .ss-plan-actions, .ss-account .ss-plan-offer { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
.ss-account .ss-plan-offer { padding: 16px 0; }
.ss-account .ss-plan-offer p { flex: 1 1 480px; }
.ss-account .ss-plan-prose hr { border: 0; border-top: 1px solid var(--line); margin: 32px 0; }
.ss-account .ss-overview-keys { max-width: 100%; }
.ss-account .ss-overview-keys th, .ss-account .ss-overview-keys td { white-space: nowrap; }
.ss-account .ss-overview-keys .ss-key-actions { flex-wrap: wrap; }
.ss-account .ss-overview-keys .ss-key-action { white-space: normal; max-width: 320px; }
.ss-account .ss-overview-keys .ss-key-action form > * + * { margin-top: 16px; }
.ss-account .ss-overview-keys .ss-key-summary { display: none; }
@media (min-width: 760px) {
  .ss-account .ss-create-panel .ss-key-create > fieldset { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) auto; align-items: end; }
  .ss-account .ss-create-panel .ss-key-create > fieldset > button { grid-column: 3; grid-row: 1; }
  .ss-account .ss-create-panel :is(.ss-create-controls, .ss-browser-websites) { grid-column: 1 / -1; }
  .ss-account .ss-try-grid, .ss-account:has(.ss-overview-header) .ss-usage-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ss-account .ss-overview-resource { grid-template-columns: minmax(120px, 1fr) minmax(100px, 2fr) auto minmax(120px, 1fr); }
  .ss-account .ss-overview-resource .ss-usage-meter { grid-column: auto; grid-row: auto; }
  .ss-account .ss-overview-resource > .ss-secondary { grid-column: auto; }
}
@media (max-width: 759px) {
  .ss-account:has(.ss-overview-header) .ss-btn { min-height: 44px; }
  .ss-account .ss-jump-row a, .ss-account .ss-snippet-tabs a, .ss-account .ss-account-toolbar > a, .ss-account .ss-overview-actions summary { display: inline-flex; min-height: 44px; align-items: center; }
  .ss-account .ss-lookup-controls { flex-wrap: wrap; }
  .ss-account .ss-lookup-controls input { flex-basis: 100%; min-width: 0; }
  .ss-account .ss-create-panel { padding: 16px; }
  .ss-account .ss-overview-keys { overflow: visible; max-height: none; }
  .ss-account .ss-overview-keys table, .ss-account .ss-overview-keys tbody { display: block; }
  .ss-account .ss-overview-keys thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .ss-account .ss-overview-keys tr { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 8px 16px; border-bottom: 1px solid var(--line); padding: 16px 0; }
  .ss-account .ss-overview-keys td { display: block; border: 0; padding: 0; height: auto; white-space: normal; overflow-wrap: anywhere; }
  .ss-account .ss-overview-keys .ss-key-prefix { grid-column: 2; grid-row: 1; text-align: right; }
  .ss-account .ss-overview-keys .ss-key-name { display: contents; }
  .ss-account .ss-overview-keys .ss-key-summary { display: block; grid-column: 1 / -1; font-size: 11px; }
  .ss-account .ss-overview-keys :is(.ss-key-kind, .ss-key-created, .ss-key-used, .ss-key-limit) { display: none; }
  .ss-account .ss-overview-keys .ss-overview-actions { grid-column: 1 / -1; }
  .ss-account .ss-overview-actions .ss-key-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ss-account .ss-overview-actions .ss-key-action[open] { grid-column: 1 / -1; max-width: none; }
  .ss-account .ss-overview-actions button { width: 100%; }
}

/* Widget demo form */
#widget-demo fieldset { margin: 16px 0 0; padding: 12px 16px 4px; border: 1px solid var(--line); border-radius: var(--r-panel); }
#widget-demo legend { padding: 0 6px; font: 500 15px var(--body); color: var(--ink); }
#widget-demo > p, #widget-demo fieldset > p { margin: 0 0 12px; }
#widget-demo { --sa-color-scheme: light; --sa-background: var(--surface); --sa-text: var(--ink); --sa-border: var(--line-2); --sa-focus: var(--accent); --sa-active: var(--surface-2); --sa-muted: var(--muted); }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) #widget-demo { --sa-color-scheme: dark; }
}
:root[data-theme="dark"] #widget-demo { --sa-color-scheme: dark; }
#widget-demo label { display: block; margin-bottom: 4px; font-size: 14px; color: var(--ink-2); }
#widget-demo input[readonly] { background: var(--surface-2); }

/* Yepthere preset: component styles. */
:root[data-brand="yepthere"] .home-actions .btn:not(.ghost) { background: var(--primary, var(--accent)); border-color: var(--primary, var(--accent)); color: var(--primary-on, var(--accent-on)); }
:root[data-brand="yepthere"] .ss-account .ss-plan-actions .ss-btn:not(.ghost), :root[data-brand="yepthere"] .ss-account .ss-lookup-form .ss-btn { background: var(--primary, var(--accent)); border-color: var(--primary, var(--accent)); color: var(--primary-on, var(--accent-on)); }
/* Existing structure, with colour roles kept separate from primary actions. */
:root[data-brand="yepthere"] .brand { font: 600 24px/1.2 var(--display); gap: 8px; }
:root[data-brand="yepthere"] .brand img { width: 32px; height: 40px; flex: none; }
:root[data-brand="yepthere"] .hero .home-display { font-size: clamp(2.5rem, 6vw, 4.75rem); line-height: 1.02; overflow-wrap: anywhere; }
:root[data-brand="yepthere"] :is(.eyebrow, .small-label, .ss-kicker, th) { letter-spacing: 0; text-transform: none; }
:root[data-brand="yepthere"] a:not(.btn, .ss-btn, .brand, .nav-links a) { color: var(--accent-ink); }
:root[data-brand="yepthere"] .signup.band a { color: var(--band-ink); }
:root[data-brand="yepthere"] .band { --accent-ink: var(--band-ink); --primary: var(--band-primary); --primary-on: var(--band-primary-on); }
/* One primary action per view; other submits retain the sage secondary style.
   Prefer the selected plan, otherwise the first offer; only the first actionable
   release gets emphasis when several candidates are awaiting a decision. */
:root[data-brand="yepthere"] :is(
  form[action="/account/signin"], form[action="/account/register"], form[action="/admin/signin"],
  .ss-key-create,
  .ss-plan-upgrade[data-selected], .ss-plan:not(:has([data-selected])) > .ss-plan-upgrade:first-of-type:not([action="/account/plan/portal"]),
  form[action="/account/plan/change"]:not(.ss-plan-upgrade),
  tr:nth-child(1 of :has(form[action$="/approve"], form[action$="/run"])) form[action^="/admin/api/data-releases/"]:is([action$="/approve"], [action$="/run"])
) :is(.btn, .ss-btn):not(.ghost, .danger) { background: var(--primary); border-color: var(--primary); color: var(--primary-on); }
:root[data-brand="yepthere"] :is(.btn, .ss-btn):hover { filter: none; text-decoration: underline; }
:root[data-brand="yepthere"] .ss-btn.danger { border-color: var(--bad); }
:root[data-brand="yepthere"] :is(.btn, .ss-btn).ghost { color: var(--accent); border-color: var(--accent); }
:root[data-brand="yepthere"] .band .btn.ghost { color: var(--band-ink); border-color: var(--band-line); }
:root[data-brand="yepthere"] :is(input:not([type="checkbox"], [type="radio"]), select, textarea, .copy) { border-color: var(--line-2); }
:root[data-brand="yepthere"] .query-field { border-bottom-width: 1px; }
:root[data-brand="yepthere"] .ss-attention :where(li) { border-left-width: 1px; }
:root[data-brand="yepthere"] .ss-plan-upgrade[data-selected] { border-width: 1px; }
:root[data-brand="yepthere"] .map-result { --signal: var(--accent); }
:root[data-brand="yepthere"] .ss-chart .ss-bar { fill: var(--ink); }
:root[data-brand="yepthere"] .ss-chart .ss-bar.weekend { fill: var(--ink); stroke: none; }
:root[data-brand="yepthere"] .ss-errors-chart :is(.ss-bar, .ss-bar.weekend) { fill: var(--signal); }
:root[data-brand="yepthere"] .ss-latency-chart :is(.ss-bar, .ss-bar.weekend) { fill: var(--accent); }
:root[data-brand="yepthere"] :is(.ss-meter, .ss-usage-meter) { accent-color: var(--accent); }
:root[data-brand="yepthere"] :is(.ss-meter, .ss-usage-meter)::-webkit-meter-optimum-value { background: var(--accent); }
:root[data-brand="yepthere"] :is(.ss-meter, .ss-usage-meter)::-webkit-meter-suboptimum-value { background: var(--accent); }
:root[data-brand="yepthere"] :is(.ss-meter, .ss-usage-meter)::-webkit-meter-even-less-good-value { background: var(--accent); }
:root[data-brand="yepthere"] :is(.ss-meter, .ss-usage-meter)::-moz-meter-bar { background: var(--accent); }
:root[data-brand="yepthere"] .ss-usage-meter { background: var(--surface-3); }
:root[data-brand="yepthere"] .ss-usage-meter::-webkit-meter-bar { background: var(--surface-3); }
:root[data-brand="yepthere"] .band .btn.ghost:hover { background: transparent; }
:root[data-brand="yepthere"] :is(.ss-chart, .ss-sparkline) .ss-line { stroke: var(--ink); }
:root[data-brand="yepthere"] .ss-sparkline .ss-line[stroke-dasharray],
:root[data-brand="yepthere"] .ss-errors-chart .ss-line { stroke: var(--signal); }
:root[data-brand="yepthere"] .ss-latency-chart .ss-line { stroke: var(--accent); }