/* Generated from reference/preview.html by scripts/extract-prototype.mjs, then extended in public/css/extra.css */
:root{
  --paper:#FFFFFF; --mist:#F2F4FB; --mist-2:#E8ECF8; --line:#DCE1F0;
  --ink:#15193B; --ink-2:#4A5070; --ink-3:#737A99;
  --blue:#3245E8; --blue-ink:#2333C4; --blue-soft:#E6E9FD;
  --marigold:#FFC233; --marigold-soft:#FFF1C9;
  --flag:#C93A2B; --flag-soft:#FDEBE8; --good:#12805A; --good-soft:#E3F4EC;
  --sheet:#FFFFFF; --shadow:0 1px 2px rgba(21,25,59,.06),0 12px 32px -12px rgba(21,25,59,.22);
  --display:"Bricolage Grotesque", "Avenir Next", "Segoe UI", system-ui, sans-serif;
  --body:"Figtree", "Avenir Next", "Segoe UI", system-ui, sans-serif;
  --serif:"Source Serif 4", Georgia, "Times New Roman", serif;
  --r-sm:10px; --r-md:16px; --r-lg:28px;
  --wrap:1180px;
  color-scheme: light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#0F1230; --mist:#161A3D; --mist-2:#1D2250; --line:#2A3063;
    --ink:#EEF0FF; --ink-2:#C2C7E6; --ink-3:#9198BF;
    --blue:#8392FF; --blue-ink:#A6B1FF; --blue-soft:#232A66;
    --marigold:#FFC233; --marigold-soft:#3D3416;
    --flag:#FF8A7A; --flag-soft:#3A1E26; --good:#5BD3A0; --good-soft:#163A33;
    --sheet:#F7F3E8; --shadow:0 1px 2px rgba(0,0,0,.3),0 16px 40px -16px rgba(0,0,0,.7);
    color-scheme: dark;
  }
}
:root[data-theme="dark"]{
  --paper:#0F1230; --mist:#161A3D; --mist-2:#1D2250; --line:#2A3063;
  --ink:#EEF0FF; --ink-2:#C2C7E6; --ink-3:#9198BF;
  --blue:#8392FF; --blue-ink:#A6B1FF; --blue-soft:#232A66;
  --marigold:#FFC233; --marigold-soft:#3D3416;
  --flag:#FF8A7A; --flag-soft:#3A1E26; --good:#5BD3A0; --good-soft:#163A33;
  --sheet:#F7F3E8; --shadow:0 1px 2px rgba(0,0,0,.3),0 16px 40px -16px rgba(0,0,0,.7);
  color-scheme: dark;
}
:root{ box-sizing:border-box; padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px); }
html{ scroll-padding-top:calc(env(safe-area-inset-top,0px) + 80px); -webkit-text-size-adjust:100%; }
*,*::before,*::after{ box-sizing:border-box; }
body{ margin:0; background:var(--paper); color:var(--ink); font-family:var(--body); font-size:17px; line-height:1.55; -webkit-font-smoothing:antialiased; }
img,svg{ max-width:100%; }
a{ color:var(--blue-ink); text-underline-offset:3px; }
button{ font:inherit; color:inherit; }
:focus-visible{ outline:3px solid var(--blue); outline-offset:3px; border-radius:6px; }
.wrap{ max-width:var(--wrap); margin:0 auto; padding-inline:24px; }
.sr{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

/* Header */
.top{ position:sticky; top:env(safe-area-inset-top,0px); z-index:30; background:color-mix(in srgb, var(--paper) 88%, transparent); backdrop-filter:saturate(1.4) blur(12px); -webkit-backdrop-filter:saturate(1.4) blur(12px); border-bottom:1px solid transparent; transition:border-color .2s; }
.top.scrolled{ border-bottom-color:var(--line); }
.top .wrap{ display:flex; align-items:center; gap:24px; height:68px; }
.brand{ display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--ink); font-family:var(--display); font-weight:800; font-size:21px; letter-spacing:-.02em; }
.brand svg{ width:30px; height:30px; flex:none; }
.nav{ margin-left:auto; display:flex; gap:4px; align-items:center; }
.nav a{ color:var(--ink-2); text-decoration:none; font-weight:600; font-size:15px; padding:8px 12px; border-radius:999px; }
.nav a:hover{ background:var(--mist); color:var(--ink); }
.nav a[aria-current="page"]{ color:var(--ink); background:var(--mist); }
.top-search{ display:none; flex:1; max-width:360px; }
.has-topsearch .top-search{ display:block; }

/* Search */
.search{ position:relative; }
.search-box{ display:flex; align-items:center; gap:10px; background:var(--paper); border:2px solid var(--ink); border-radius:999px; padding:6px 6px 6px 22px; box-shadow:6px 6px 0 var(--blue); transition:box-shadow .15s, transform .15s; }
.search-box:focus-within{ box-shadow:3px 3px 0 var(--blue); transform:translate(3px,3px); }
.search-box svg{ width:22px; height:22px; flex:none; color:var(--ink-2); }
.search-box input{ flex:1; min-width:0; border:0; outline:0; background:transparent; font:500 19px/1.3 var(--body); color:var(--ink); padding:12px 0; }
.search-box input::placeholder{ color:var(--ink-3); }
.search-box button{ border:0; background:var(--blue); color:#fff; font-weight:700; font-size:16px; padding:14px 24px; border-radius:999px; cursor:pointer; white-space:nowrap; }
.search-box .bt-short{ display:none; }
.search-box button:hover{ background:var(--blue-ink); }
:root[data-theme="dark"] .search-box button{ color:#0F1230; }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .search-box button{ color:#0F1230; } }
.search.compact .search-box{ box-shadow:none; border-width:1.5px; padding:2px 2px 2px 14px; }
.search.compact .search-box:focus-within{ transform:none; border-color:var(--blue); }
.search.compact input{ font-size:15px; padding:8px 0; }
.search.compact button{ display:none; }
.search.compact svg{ width:18px; height:18px; }
.suggest{ position:absolute; left:0; right:0; top:calc(100% + 10px); background:var(--paper); border:1.5px solid var(--line); border-radius:var(--r-md); box-shadow:var(--shadow); padding:6px; list-style:none; margin:0; z-index:40; max-height:360px; overflow:auto; }
.suggest[hidden]{ display:none; }
.suggest li{ display:flex; align-items:center; gap:12px; padding:10px 12px; border-radius:10px; cursor:pointer; }
.suggest li[aria-selected="true"], .suggest li:hover{ background:var(--mist); }
.suggest .s-name{ font-weight:600; }
.suggest .s-meta{ color:var(--ink-3); font-size:14px; }
.suggest .s-all{ color:var(--blue-ink); font-weight:600; }
.chips{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-top:22px; }
.chips span{ color:var(--ink-3); font-size:15px; margin-right:4px; }
.chip{ border:1.5px solid var(--line); background:var(--paper); border-radius:999px; padding:7px 14px; font-size:15px; font-weight:600; color:var(--ink); cursor:pointer; text-decoration:none; }
.chip:hover{ border-color:var(--ink); }

/* Hero */
.hero{ padding:56px 0 88px; overflow:hidden; }
.hero .wrap{ display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:56px; align-items:center; }
.hero h1{ font-family:var(--display); font-weight:800; font-size:clamp(40px,5.6vw,70px); line-height:.98; letter-spacing:-.035em; margin:0 0 22px; text-wrap:balance; }
.hero .lede{ font-size:clamp(18px,1.6vw,21px); color:var(--ink-2); max-width:34em; margin:0 0 34px; }
.sheet-stack{ position:relative; padding:18px 0 18px 18px; }
.sheet-stack::before{ content:""; position:absolute; inset:0 18px 36px 0; background:var(--blue); border-radius:var(--r-md); transform:rotate(-2.2deg); }
.sheet{ position:relative; background:var(--sheet); color:#232741; border-radius:var(--r-md); box-shadow:var(--shadow); padding:26px 28px 22px; font-family:var(--serif); font-size:16px; line-height:1.7; }
.sheet .sh-head{ font-family:var(--body); font-size:13px; color:#6B708C; display:flex; justify-content:space-between; gap:12px; border-bottom:1px dashed #D6D9E6; padding-bottom:10px; margin-bottom:14px; }
.sheet p{ margin:0 0 12px; }
.sheet .dim{ color:#8A8FA8; }
.mark{ background-image:linear-gradient(transparent 12%, var(--marigold) 12%, var(--marigold) 88%, transparent 88%); background-repeat:no-repeat; background-size:0% 100%; padding:0 2px; margin:0 -2px; border-radius:3px; }
.marked .mark{ background-size:100% 100%; transition:background-size .7s cubic-bezier(.6,.1,.2,1); }
.marked .mark:nth-of-type(2){ transition-delay:.55s; }
.sheet .note-pin{ font-family:var(--body); font-size:14px; line-height:1.45; background:var(--ink); color:#fff; border-radius:12px; padding:12px 14px; margin-top:16px; display:flex; gap:10px; align-items:flex-start; opacity:0; transform:translateY(6px); transition:opacity .4s 1.4s, transform .4s 1.4s; }
:root[data-theme="dark"] .sheet .note-pin{ background:#15193B; }
.marked .note-pin{ opacity:1; transform:none; }
.note-pin b{ color:var(--marigold); }
.sheet-cap{ font-size:14px; color:var(--ink-3); margin:14px 0 0 2px; }
.sheet-cap a{ font-weight:600; }

/* Sections */
section.band{ padding:88px 0; }
section.band.tint{ background:var(--mist); }
h2.sec{ font-family:var(--display); font-weight:800; font-size:clamp(32px,4vw,48px); line-height:1.04; letter-spacing:-.03em; margin:0 0 16px; text-wrap:balance; max-width:18em; }
.sec-lede{ color:var(--ink-2); font-size:19px; max-width:36em; margin:0 0 44px; }

.doors{ display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.door{ position:relative; border-radius:var(--r-lg); padding:36px 36px 32px; display:flex; flex-direction:column; gap:14px; min-height:300px; }
.door.a{ background:var(--blue); color:#fff; }
.door.b{ background:var(--marigold); color:#15193B; }
:root[data-theme="dark"] .door.a{ color:#0F1230; }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .door.a{ color:#0F1230; } }
.door h3{ font-family:var(--display); font-size:30px; line-height:1.08; letter-spacing:-.02em; margin:0; font-weight:800; }
.door p{ margin:0; font-size:17px; opacity:.92; max-width:30em; }
.door ul{ margin:4px 0 0; padding:0; list-style:none; display:grid; gap:8px; }
.door li{ display:flex; gap:10px; align-items:flex-start; font-weight:500; }
.door li svg{ flex:none; width:20px; height:20px; margin-top:3px; }
.door .go{ margin-top:auto; align-self:flex-start; border:2px solid currentColor; background:transparent; color:inherit; padding:11px 20px; border-radius:999px; font-weight:700; cursor:pointer; text-decoration:none; }
.door .go:hover{ background:rgba(255,255,255,.16); }
.door.b .go:hover{ background:rgba(21,25,59,.08); }

/* Preview */
.preview{ display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:48px; align-items:start; }
.preview-copy dl{ margin:0; display:grid; gap:26px; }
.preview-copy dt{ font-family:var(--display); font-weight:700; font-size:22px; letter-spacing:-.01em; margin-bottom:4px; display:flex; gap:12px; align-items:center; }
.preview-copy dt .dot{ width:12px; height:12px; border-radius:4px; flex:none; }
.preview-copy dd{ margin:0 0 0 24px; color:var(--ink-2); }
.mini{ background:var(--paper); border:1.5px solid var(--line); border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--shadow); }
.mini-head{ padding:24px 28px; border-bottom:1.5px solid var(--line); display:flex; justify-content:space-between; gap:16px; align-items:flex-start; }
.mini-head h3{ font-family:var(--display); font-size:24px; margin:0; letter-spacing:-.02em; line-height:1.1; }
.mini-head p{ margin:4px 0 0; color:var(--ink-3); font-size:15px; }
.mini-row{ display:grid; grid-template-columns:150px 1fr; gap:16px; padding:18px 28px; border-bottom:1px solid var(--line); align-items:baseline; }
.mini-row:last-of-type{ border-bottom:0; }
.mini-row .k{ font-size:14px; color:var(--ink-3); font-weight:600; }
.mini-row .v{ font-weight:500; }
.big-num{ font-family:var(--display); font-weight:800; font-size:30px; letter-spacing:-.02em; }
.mini-foot{ padding:18px 28px; background:var(--mist); display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; }
.btn{ display:inline-flex; align-items:center; gap:8px; background:var(--ink); color:var(--paper); border:0; border-radius:999px; padding:12px 20px; font-weight:700; text-decoration:none; cursor:pointer; font-size:16px; }
.btn:hover{ background:var(--blue-ink); }
.btn.ghost{ background:transparent; color:var(--ink); border:1.5px solid var(--line); }
.btn.ghost:hover{ border-color:var(--ink); background:transparent; }

.tag{ display:inline-flex; align-items:center; gap:6px; font-size:13px; font-weight:700; border-radius:999px; padding:4px 10px; white-space:nowrap; line-height:1.3; }
.tag.flag{ background:var(--flag-soft); color:var(--flag); }
.tag.good{ background:var(--good-soft); color:var(--good); }
.tag.blue{ background:var(--blue-soft); color:var(--blue-ink); }
.tag.gold{ background:var(--marigold-soft); color:var(--ink); }
.tag.plain{ background:var(--mist-2); color:var(--ink-2); }

/* Source */
.source{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:56px; align-items:start; }
.promise{ display:grid; gap:0; border-top:2px solid var(--ink); }
.promise > div{ padding:20px 0; border-bottom:1px solid var(--line); display:grid; grid-template-columns:44px 1fr; gap:14px; }
.promise svg{ width:28px; height:28px; color:var(--blue); }
.promise b{ display:block; font-size:18px; margin-bottom:2px; }
.promise span{ color:var(--ink-2); }

/* Browse list */
.filters{ display:flex; gap:8px; flex-wrap:wrap; margin:0 0 20px; }
.filters button{ border:1.5px solid var(--line); background:var(--paper); border-radius:999px; padding:8px 16px; font-weight:600; font-size:15px; cursor:pointer; }
.filters button[aria-pressed="true"]{ background:var(--ink); color:var(--paper); border-color:var(--ink); }
.list{ border-top:2px solid var(--ink); }
.row{ display:grid; grid-template-columns:minmax(0,2.2fr) minmax(0,1.3fr) minmax(0,1.2fr) auto; gap:20px; align-items:center; padding:18px 8px; border-bottom:1px solid var(--line); text-decoration:none; color:inherit; border-radius:4px; }
.row:hover{ background:var(--mist); }
.row .r-name{ font-weight:700; font-size:18px; letter-spacing:-.01em; }
.row .r-loc{ color:var(--ink-3); font-size:14px; }
.row .r-fee{ font-weight:500; }
.row .r-fee small{ display:block; color:var(--ink-3); font-size:13px; font-weight:500; }
.row .chev{ width:20px; height:20px; color:var(--ink-3); }
.empty{ padding:40px 0; }
.empty h3{ font-family:var(--display); font-size:26px; margin:0 0 8px; letter-spacing:-.02em; }

/* Profile */
.crumbs{ padding:28px 0 0; font-size:15px; }
.crumbs a{ font-weight:600; text-decoration:none; }
.crumbs a:hover{ text-decoration:underline; }
.p-head{ padding:20px 0 36px; border-bottom:1px solid var(--line); }
.p-head h1{ font-family:var(--display); font-weight:800; font-size:clamp(36px,5vw,60px); line-height:1; letter-spacing:-.035em; margin:0 0 12px; max-width:16em; }
.p-sub{ color:var(--ink-2); font-size:17px; margin:0 0 20px; }
.p-tags{ display:flex; gap:8px; flex-wrap:wrap; }
.p-grid{ display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:56px; padding:40px 0 96px; align-items:start; }
.p-main{ display:grid; gap:64px; min-width:0; }
.short{ font-family:var(--serif); font-size:clamp(20px,2vw,24px); line-height:1.5; margin:0; max-width:32em; }
.short-label{ font-size:14px; color:var(--ink-3); font-weight:600; margin:0 0 10px; }
.callout{ border-radius:var(--r-md); padding:18px 20px; display:flex; gap:14px; align-items:flex-start; margin-top:22px; }
.callout svg{ flex:none; width:22px; height:22px; margin-top:2px; }
.callout.warn{ background:var(--flag-soft); color:var(--ink); }
.callout.warn svg{ color:var(--flag); }
.callout.info{ background:var(--blue-soft); }
.callout.info svg{ color:var(--blue-ink); }
.p-sec h2{ font-family:var(--display); font-weight:800; font-size:clamp(28px,3vw,36px); letter-spacing:-.025em; line-height:1.08; margin:0 0 8px; }
.p-sec > p.lead{ color:var(--ink-2); margin:0 0 26px; max-width:38em; }

.calc{ border:2px solid var(--ink); border-radius:var(--r-lg); overflow:hidden; }
.calc-top{ padding:26px 28px; display:grid; gap:18px; }
.calc label{ font-weight:600; display:block; margin-bottom:10px; }
.amount-row{ display:flex; gap:12px; align-items:center; flex-wrap:wrap; }
.amount-input{ display:flex; align-items:center; border:1.5px solid var(--line); border-radius:12px; padding:0 14px; background:var(--paper); }
.amount-input span{ color:var(--ink-3); font-weight:600; }
.amount-input input{ border:0; outline:0; background:transparent; font:700 22px var(--display); width:9ch; padding:10px 6px; color:var(--ink); }
.amount-input:focus-within{ border-color:var(--blue); }
.presets{ display:flex; gap:6px; flex-wrap:wrap; }
.presets button{ border:1.5px solid var(--line); background:var(--paper); border-radius:999px; padding:6px 12px; font-weight:600; font-size:14px; cursor:pointer; }
.presets button[aria-pressed="true"]{ border-color:var(--blue); background:var(--blue-soft); color:var(--blue-ink); }
input[type=range]{ width:100%; accent-color:var(--blue); }
.calc-out{ background:var(--marigold); color:#15193B; padding:24px 28px; display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.calc-out .o-k{ font-size:14px; font-weight:600; opacity:.8; }
.calc-out .o-v{ font-family:var(--display); font-weight:800; font-size:clamp(28px,3.4vw,40px); letter-spacing:-.025em; line-height:1.05; }
.calc-out .o-s{ font-size:14px; font-weight:500; margin-top:4px; }
.calc-note{ padding:16px 28px; font-size:14px; color:var(--ink-2); border-top:1px solid var(--line); background:var(--paper); }
.calc-na{ padding:26px 28px; }
.sched{ width:100%; border-collapse:collapse; margin-top:22px; font-size:16px; }
.sched th{ text-align:left; font-size:13px; color:var(--ink-3); font-weight:600; padding:0 0 8px; border-bottom:1.5px solid var(--ink); }
.sched td{ padding:10px 0; border-bottom:1px solid var(--line); }
.sched td:last-child, .sched th:last-child{ text-align:right; font-weight:700; }
.sched tr.on td{ background:var(--marigold-soft); }
.sched tr.on td:first-child{ box-shadow:inset 4px 0 0 var(--marigold); padding-left:10px; }
.facts2{ display:grid; grid-template-columns:1fr 1fr; gap:28px; margin-top:28px; }
.facts2 h3{ font-size:16px; margin:0 0 8px; }
.facts2 ul{ margin:0; padding-left:18px; color:var(--ink-2); }
.facts2 li{ margin-bottom:4px; }

.conf{ display:grid; gap:0; border-top:1.5px solid var(--ink); }
.conf-item{ display:grid; grid-template-columns:28px 1fr; gap:14px; padding:18px 0; border-bottom:1px solid var(--line); }
.conf-item .ico{ width:28px; height:28px; border-radius:8px; display:grid; place-items:center; background:var(--marigold); color:#15193B; font-weight:800; font-family:var(--display); font-size:15px; }
.conf-item b{ display:block; font-size:17px; margin-bottom:2px; }
.conf-item span{ color:var(--ink-2); }
details.routine{ margin-top:18px; border:1.5px solid var(--line); border-radius:var(--r-md); padding:0 18px; }
details.routine summary{ cursor:pointer; padding:16px 0; font-weight:600; list-style:none; display:flex; justify-content:space-between; gap:12px; }
details.routine summary::-webkit-details-marker{ display:none; }
details.routine summary::after{ content:"+"; font-family:var(--display); font-size:22px; line-height:1; color:var(--ink-3); }
details.routine[open] summary::after{ content:"–"; }
details.routine .conf{ border-top:1px solid var(--line); margin-bottom:8px; }
details.routine .conf-item .ico{ background:var(--mist-2); color:var(--ink-2); }

.timeline{ list-style:none; margin:0; padding:0; position:relative; --tlc:72px; }
.timeline::before{ content:""; position:absolute; left:var(--tlc); top:8px; bottom:8px; width:2px; background:var(--line); }
.tl{ display:grid; grid-template-columns:72px 1fr; gap:22px; padding:0 0 26px; position:relative; }
.tl .yr{ font-family:var(--display); font-weight:800; font-size:20px; text-align:right; padding-right:30px; position:relative; letter-spacing:-.01em; }
.tl .yr::after{ content:""; position:absolute; right:-8px; top:7px; width:14px; height:14px; border-radius:50%; background:var(--paper); border:3px solid var(--flag); }
.tl.soft .yr::after{ border-color:var(--ink-3); }
.tl .body b{ font-size:17px; display:block; }
.tl .body .by{ color:var(--ink-3); font-size:14px; font-weight:600; margin-bottom:4px; }
.tl .body p{ margin:4px 0 8px; color:var(--ink-2); }
.clean{ display:flex; gap:16px; align-items:flex-start; background:var(--good-soft); border-radius:var(--r-md); padding:22px; }
.clean svg{ width:28px; height:28px; color:var(--good); flex:none; }
.clean b{ display:block; font-size:18px; }
.clean span{ color:var(--ink-2); }

.qs{ counter-reset:q; list-style:none; margin:0; padding:0; display:grid; gap:12px; }
.qs li{ counter-increment:q; display:grid; grid-template-columns:36px 1fr auto; gap:14px; align-items:center; background:var(--mist); border-radius:var(--r-md); padding:14px 16px; font-weight:500; }
.qs li::before{ content:counter(q); font-family:var(--display); font-weight:800; font-size:18px; width:36px; height:36px; border-radius:50%; background:var(--paper); display:grid; place-items:center; }
.copy-btn{ border:0; background:transparent; color:var(--blue-ink); font-weight:700; font-size:14px; cursor:pointer; padding:6px 8px; border-radius:8px; }
.copy-btn:hover{ background:var(--paper); }

.side{ position:sticky; top:96px; display:grid; gap:18px; }
.side-card{ border:1.5px solid var(--line); border-radius:var(--r-lg); padding:22px 24px; }
.side-card h3{ font-size:15px; margin:0 0 14px; color:var(--ink-3); font-weight:600; }
.kv{ display:grid; gap:14px; margin:0; }
.kv div{ display:flex; justify-content:space-between; gap:12px; border-bottom:1px solid var(--line); padding-bottom:12px; }
.kv div:last-child{ border-bottom:0; padding-bottom:0; }
.kv dt{ color:var(--ink-2); }
.kv dd{ margin:0; font-weight:700; text-align:right; }
.jump{ display:grid; gap:2px; }
.jump a{ text-decoration:none; color:var(--ink); font-weight:600; padding:8px 10px; border-radius:10px; display:flex; justify-content:space-between; }
.jump a:hover{ background:var(--mist); }
.jump a span{ color:var(--ink-3); font-weight:500; }
.official{ background:var(--ink); color:var(--paper); border-color:var(--ink); }
.official h3{ color:var(--paper); opacity:.7; }
.official p{ margin:0 0 14px; font-size:15px; }
.official a{ color:var(--marigold); font-weight:700; }

/* Footer */
footer{ background:var(--ink); color:#C9CDE6; padding:64px 0 48px; font-size:15px; }
:root[data-theme="dark"] footer{ background:#0A0C22; }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) footer{ background:#0A0C22; } }
footer .wrap{ display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:40px; }
footer .brand{ color:#fff; margin-bottom:12px; }
footer h4{ color:#fff; font-size:15px; margin:0 0 10px; }
footer a{ color:#fff; }
footer p{ margin:0 0 10px; max-width:34em; }
.fine{ grid-column:1/-1; border-top:1px solid rgba(255,255,255,.14); padding-top:24px; font-size:13px; color:#9AA0C4; }

/* Responsive */
@media (max-width: 960px){
  .hero .wrap, .preview, .source, .p-grid{ grid-template-columns:1fr; }
  .hero{ padding-top:32px; }
  .side{ position:static; }
  .doors{ grid-template-columns:1fr; }
  footer .wrap{ grid-template-columns:1fr; }
}
@media (max-width: 680px){
  .wrap{ padding-inline:18px; }
  .nav a.hide-sm{ display:none; }
  .brand{ font-size:19px; white-space:nowrap; }
  .top .wrap{ gap:12px; }
  .nav a{ padding:8px 10px; white-space:nowrap; }
  .has-topsearch .top-search{ display:none; }
  .search-box{ padding-left:16px; }
  .search-box input{ font-size:17px; }
  .search-box button{ padding:12px 16px; }
  .search-box button .bt-long{ display:none; }
  .search-box button .bt-short{ display:inline; }
  section.band{ padding:64px 0; }
  .door{ padding:28px 24px; min-height:0; }
  .row{ grid-template-columns:1fr auto; }
  .row .r-fee, .row .r-rec{ grid-column:1; }
  .row .chev{ grid-row:1; grid-column:2; }
  .mini-row{ grid-template-columns:1fr; gap:4px; padding:16px 22px; }
  .mini-head, .mini-foot{ padding-left:22px; padding-right:22px; }
  .calc-out{ grid-template-columns:1fr; }
  .facts2{ grid-template-columns:1fr; }
  .qs li{ grid-template-columns:36px 1fr; }
  .qs .copy-btn{ grid-column:2; justify-self:start; padding-left:0; }
  .timeline{ --tlc:58px; }
  .tl{ grid-template-columns:58px 1fr; gap:16px; }
  .tl .yr{ font-size:15px; padding-right:14px; letter-spacing:-.02em; }
}

/* ===== Scroll motion ===== */
.top .wrap{ transition:height .35s cubic-bezier(.2,.7,.2,1); }
.top.scrolled .wrap{ height:58px; }
.anim [data-reveal]{ opacity:0; transition:opacity .9s cubic-bezier(.2,.7,.2,1), transform .9s cubic-bezier(.2,.7,.2,1); transition-delay:calc(var(--i,0) * 80ms); }
.anim [data-reveal="rise"]{ transform:translateY(16px); }
.anim [data-reveal="left"]{ transform:translateX(-28px) rotate(-.6deg); }
.anim [data-reveal="right"]{ transform:translateX(28px) rotate(.6deg); }
.anim [data-reveal="scale"]{ transform:translateY(20px) scale(.97); }
.anim [data-reveal].in{ opacity:1; transform:none; }
/* staggered children */
.anim [data-stagger] > *{ opacity:0; transform:translateY(12px); transition:opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1); }
.anim [data-stagger].in > *{ opacity:1; transform:none; }
.anim [data-stagger].in > *:nth-child(1){ transition-delay:.05s } .anim [data-stagger].in > *:nth-child(2){ transition-delay:.13s }
.anim [data-stagger].in > *:nth-child(3){ transition-delay:.21s } .anim [data-stagger].in > *:nth-child(4){ transition-delay:.29s }
.anim [data-stagger].in > *:nth-child(5){ transition-delay:.37s } .anim [data-stagger].in > *:nth-child(6){ transition-delay:.45s }
.anim [data-stagger].in > *:nth-child(7){ transition-delay:.53s } .anim [data-stagger].in > *:nth-child(8){ transition-delay:.61s }
.anim [data-stagger].in > *:nth-child(n+9){ transition-delay:.66s }
/* check marks draw themselves */
.anim .door li svg path{ stroke-dasharray:24; stroke-dashoffset:24; transition:stroke-dashoffset .6s cubic-bezier(.6,.1,.2,1); }
.anim .door.in li svg path{ stroke-dashoffset:0; }
.anim .door.in li:nth-child(1) svg path{ transition-delay:.45s } .anim .door.in li:nth-child(2) svg path{ transition-delay:.6s } .anim .door.in li:nth-child(3) svg path{ transition-delay:.75s }
/* highlighter underline on headings */
.hl{ -webkit-box-decoration-break:clone; box-decoration-break:clone; background-image:linear-gradient(var(--marigold),var(--marigold)); background-repeat:no-repeat; background-position:0 92%; background-size:100% .22em; padding-bottom:.04em; }
.anim .hl{ background-size:0% .22em; transition:background-size 1s cubic-bezier(.6,.1,.2,1) .25s; }
.anim .in .hl, .anim .hl.in{ background-size:100% .22em; }
/* drawn rules */
.promise{ border-top:0; position:relative; }
.promise::before, .list::before, .conf::before{ content:""; position:absolute; left:0; right:0; top:0; height:2px; background:var(--ink); transform-origin:left; }
.list, .conf{ position:relative; border-top:0 !important; }
.conf::before{ height:1.5px; }
details.routine .conf::before{ height:1px; background:var(--line); }
.anim .promise::before, .anim .list::before, .anim .conf::before{ transform:scaleX(0); transition:transform 1.1s cubic-bezier(.6,.1,.2,1); }
.anim .promise.in::before, .anim .list.in::before, .anim .conf.in::before{ transform:scaleX(1); }
/* section dots pulse in */
.anim .preview-copy dt .dot{ transform:scale(0); transition:transform .5s cubic-bezier(.3,1.6,.5,1); }
.anim .preview-copy dl.in dt .dot{ transform:scale(1); }
.anim .preview-copy dl.in > div:nth-child(2) .dot{ transition-delay:.15s } .anim .preview-copy dl.in > div:nth-child(3) .dot{ transition-delay:.3s }
/* timeline progress */
.timeline::after{ content:""; position:absolute; left:var(--tlc); top:8px; width:2px; height:calc((100% - 16px) * var(--p,1)); background:var(--flag); transition:height .15s linear; }
.timeline.soft-line::after{ background:var(--blue); }
.anim .tl .yr::after{ transform:scale(.4); opacity:0; transition:transform .45s cubic-bezier(.3,1.6,.5,1), opacity .3s; }
.anim .tl.in .yr::after{ transform:scale(1); opacity:1; }
.anim .tl .body, .anim .tl .yr{ opacity:0; transform:translateX(10px); transition:opacity .6s ease, transform .6s cubic-bezier(.2,.7,.2,1); }
.anim .tl .yr{ transform:translateX(-10px); }
.anim .tl.in .body, .anim .tl.in .yr{ opacity:1; transform:none; }
/* hero sheet parallax */
.sheet-stack{ --py:0px; --rot:-2.2deg; }
.sheet{ transform:translateY(var(--py)); will-change:transform; }
.sheet-stack::before{ transform:rotate(var(--rot)); transition:transform .1s linear; }
/* calc output glow when updated */
.calc-out .o-v{ transition:transform .3s cubic-bezier(.3,1.6,.5,1); }
.calc-out .o-v.bump{ transform:scale(1.03); }


@media (prefers-reduced-motion: reduce){
  *{ transition:none !important; animation:none !important; }
  .timeline::after{ height:calc(100% - 16px) !important; }
  .mark{ background-size:100% 100% !important; }
  .sheet .note-pin{ opacity:1; transform:none; }
}
.toast{ position:fixed; left:50%; bottom:calc(24px + env(safe-area-inset-bottom,0px)); transform:translate(-50%,20px); background:var(--ink); color:var(--paper); padding:12px 18px; border-radius:999px; font-weight:600; opacity:0; transition:.25s; z-index:60; pointer-events:none; }
.toast.show{ opacity:1; transform:translate(-50%,0); }

/* ===== BrokerCompare additions ===== */
.brand .ai{ font-size:.62em; font-weight:800; background:var(--marigold); color:#15193B; border-radius:6px; padding:1px 5px 2px; margin-left:3px; position:relative; top:-.35em; letter-spacing:0; }
.brand svg{ width:32px; height:32px; }
.nav .cmp-count{ background:var(--blue); color:#fff; border-radius:999px; font-size:12px; padding:1px 7px; margin-left:4px; }
.hero-art{ position:relative; }
.hero-art svg{ width:100%; height:auto; display:block; overflow:visible; }
.float-a{ animation:floatA 7s ease-in-out infinite; transform-box:fill-box; }
.float-b{ animation:floatB 8s ease-in-out infinite; transform-box:fill-box; }
.float-c{ animation:floatA 9s ease-in-out infinite reverse; transform-box:fill-box; }
.twinkle{ animation:tw 3.6s ease-in-out infinite; transform-box:fill-box; transform-origin:center; }
.twinkle.d2{ animation-delay:1.2s } .twinkle.d3{ animation-delay:2.1s }
@keyframes floatA{ 0%,100%{ transform:translateY(0) } 50%{ transform:translateY(-8px) } }
@keyframes floatB{ 0%,100%{ transform:translateY(0) } 50%{ transform:translateY(7px) } }
@keyframes tw{ 0%,100%{ opacity:.35; transform:scale(.8) } 50%{ opacity:1; transform:scale(1.1) } }
.sweep{ transform-box:fill-box; transform-origin:left; animation:sweep 1.1s cubic-bezier(.6,.1,.2,1) .5s both; }
.sweep.s2{ animation-delay:.9s } .sweep.s3{ animation-delay:1.3s }
@keyframes sweep{ from{ transform:scaleX(0) } to{ transform:scaleX(1) } }
.bar-grow{ transform-box:fill-box; transform-origin:left; animation:sweep 1.2s cubic-bezier(.2,.7,.2,1) both; }
.hero .stats{ display:flex; gap:28px; flex-wrap:wrap; margin-top:28px; color:var(--ink-2); font-size:15px; }
.hero .stats b{ display:block; font-family:var(--display); font-size:26px; color:var(--ink); letter-spacing:-.02em; }

.suggest .s-group{ font-size:12px; color:var(--ink-3); font-weight:700; padding:8px 12px 4px; cursor:default; }
.suggest .s-group:hover{ background:none; }
.avatar{ width:38px; height:38px; border-radius:12px; background:var(--blue-soft); color:var(--blue-ink); display:grid; place-items:center; font-weight:800; font-family:var(--display); flex:none; font-size:15px; }
.avatar.lg{ width:72px; height:72px; border-radius:22px; font-size:28px; }

.unclear{ border:1.5px dashed var(--ink-3); border-radius:var(--r-md); padding:16px 18px; margin-top:18px; background:var(--paper); }
.unclear .u-top{ display:flex; gap:10px; align-items:center; font-weight:700; margin-bottom:6px; }
.unclear .u-top .tag{ font-size:12px; }
.unclear p{ margin:0 0 10px; color:var(--ink-2); }
.unclear blockquote{ margin:0; font-family:var(--serif); font-size:15px; line-height:1.6; background:var(--marigold-soft); border-left:4px solid var(--marigold); padding:10px 14px; border-radius:0 10px 10px 0; color:var(--ink); }
.unclear cite{ display:block; font-style:normal; font-size:13px; color:var(--ink-3); margin-top:8px; }

.term{ border:0; background:none; padding:0; font:inherit; color:inherit; text-decoration:underline dotted var(--ink-3); text-underline-offset:3px; cursor:help; }
.tip{ position:absolute; z-index:70; max-width:300px; background:var(--ink); color:var(--paper); padding:12px 14px; border-radius:12px; font-size:14px; line-height:1.45; box-shadow:var(--shadow); }
.tip b{ display:block; margin-bottom:2px; color:var(--marigold); }
.tip[hidden]{ display:none; }

.actions{ display:flex; gap:8px; flex-wrap:wrap; margin-top:18px; }
.btn.sm{ padding:9px 14px; font-size:14px; }
.btn.blue{ background:var(--blue); color:#fff; }
:root[data-theme="dark"] .btn.blue{ color:#0F1230; }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .btn.blue{ color:#0F1230; } }
.btn[aria-pressed="true"]{ background:var(--good); color:#fff; }

.stat-strip{ display:grid; grid-template-columns:repeat(4,1fr); gap:0; border:1.5px solid var(--line); border-radius:var(--r-md); overflow:hidden; }
.stat-strip div{ padding:16px 18px; border-right:1px solid var(--line); }
.stat-strip div:last-child{ border-right:0; }
.stat-strip b{ display:block; font-family:var(--display); font-size:24px; letter-spacing:-.02em; }
.stat-strip span{ font-size:13px; color:var(--ink-3); font-weight:600; }

.ctx{ margin-top:16px; padding:14px 16px; background:var(--mist); border-radius:var(--r-md); font-size:15px; }
.ctx .ctx-bar{ position:relative; height:10px; background:var(--mist-2); border-radius:6px; margin:10px 0 6px; }
.ctx .ctx-bar i{ position:absolute; top:-3px; width:16px; height:16px; border-radius:50%; background:var(--marigold); border:3px solid var(--ink); transform:translateX(-50%); }
.ctx .ctx-bar s{ position:absolute; top:2px; width:6px; height:6px; border-radius:50%; background:var(--ink-3); transform:translateX(-50%); }
.ctx .ctx-legend{ display:flex; justify-content:space-between; font-size:12px; color:var(--ink-3); }

.people-tools{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin-bottom:14px; }
.people-tools input, .people-tools select{ border:1.5px solid var(--line); border-radius:999px; padding:9px 14px; font:inherit; font-size:15px; background:var(--paper); color:var(--ink); }
.people-tools input{ flex:1; min-width:180px; }
.plist{ position:relative; }
.prow{ display:grid; grid-template-columns:38px minmax(0,1.8fr) minmax(0,1fr) minmax(0,1.4fr) auto; gap:14px; align-items:center; padding:12px 6px; border-bottom:1px solid var(--line); text-decoration:none; color:inherit; border-radius:4px; }
.prow:hover{ background:var(--mist); }
.prow .pn{ font-weight:700; }
.prow .pm{ font-size:13px; color:var(--ink-3); }
.prow .pt{ display:flex; gap:6px; flex-wrap:wrap; }
.more{ margin-top:14px; }

.own{ display:grid; gap:0; }
.own-item{ display:grid; grid-template-columns:auto 1fr auto; gap:14px; padding:14px 0; border-bottom:1px solid var(--line); align-items:center; }
.own-item .oi{ width:40px; height:40px; border-radius:12px; display:grid; place-items:center; background:var(--mist); color:var(--ink-2); }
.own-item .oi svg{ width:22px; height:22px; }
.own-item b{ display:block; }
.own-item small{ color:var(--ink-3); font-size:14px; }
.own-item .since{ text-align:right; font-weight:700; font-size:14px; white-space:nowrap; }
.own-item .since span{ display:block; font-weight:500; color:var(--ink-3); font-size:12px; }
.chain{ margin:10px 0 0; padding:14px 16px; background:var(--mist); border-radius:var(--r-md); font-size:15px; }
.chain ol{ margin:6px 0 0; padding-left:20px; }

.changes{ margin:0; padding:0; list-style:none; display:grid; gap:10px; }
.changes li{ display:grid; grid-template-columns:22px 1fr; gap:10px; }
.changes li::before{ content:""; width:10px; height:10px; border-radius:3px; background:var(--marigold); margin-top:8px; }

.p-tags .tag{ font-size:13px; }
.career{ list-style:none; margin:0; padding:0; position:relative; }
.career li{ display:grid; grid-template-columns:160px 1fr; gap:18px; padding:10px 0; border-bottom:1px solid var(--line); }
.career .when{ font-size:14px; color:var(--ink-3); font-weight:600; }
.career .now{ color:var(--good); }
.career b{ display:block; }
.career small{ color:var(--ink-3); }

.peer{ display:grid; gap:18px; }
.peer-row{ display:grid; grid-template-columns:200px 1fr; gap:16px; align-items:center; }
.peer-row .pl{ font-weight:600; font-size:15px; }
.peer-row .pl small{ display:block; color:var(--ink-3); font-weight:500; font-size:13px; }
.meter{ position:relative; height:12px; background:var(--mist-2); border-radius:8px; }
.meter .fill{ position:absolute; left:0; top:0; bottom:0; border-radius:8px; background:var(--blue); }
.meter .mark2{ position:absolute; top:-4px; width:4px; height:20px; border-radius:2px; background:var(--ink); }
.peer-note{ font-size:14px; color:var(--ink-2); margin-top:4px; }

.disc{ border:1.5px solid var(--line); border-radius:var(--r-md); padding:16px 18px; margin-bottom:12px; }
.disc .d-top{ display:flex; justify-content:space-between; gap:12px; align-items:flex-start; }
.disc .d-head{ font-weight:700; font-size:17px; }
.disc .d-when{ color:var(--ink-3); font-size:14px; font-weight:600; white-space:nowrap; }
.disc .d-alleg{ font-family:var(--serif); font-size:16px; line-height:1.6; margin:8px 0; color:var(--ink); }
.disc .d-meta{ display:flex; gap:6px; flex-wrap:wrap; margin-top:6px; }
.disc details{ margin-top:10px; }
.disc details summary{ cursor:pointer; color:var(--blue-ink); font-weight:600; font-size:14px; }
.disc .side-q{ font-size:15px; color:var(--ink-2); margin:8px 0 0; padding-left:12px; border-left:3px solid var(--line); }

.cmp-grid{ display:grid; gap:0; border:2px solid var(--ink); border-radius:var(--r-lg); overflow:hidden; }
.cmp-row{ display:grid; grid-template-columns:200px repeat(var(--n),minmax(0,1fr)); border-bottom:1px solid var(--line); }
.cmp-row:last-child{ border-bottom:0; }
.cmp-row > div{ padding:14px 16px; border-right:1px solid var(--line); }
.cmp-row > div:last-child{ border-right:0; }
.cmp-row .rk{ font-weight:600; color:var(--ink-2); font-size:14px; background:var(--mist); }
.cmp-row.head > div{ background:var(--ink); color:var(--paper); font-weight:700; }
.cmp-row.head a{ color:var(--paper); }
.cmp-best{ background:var(--marigold-soft); }
.tray{ position:fixed; left:50%; bottom:calc(16px + env(safe-area-inset-bottom,0px)); transform:translateX(-50%); z-index:50; background:var(--ink); color:var(--paper); border-radius:999px; padding:8px 8px 8px 18px; display:flex; gap:12px; align-items:center; box-shadow:var(--shadow); font-size:15px; font-weight:600; }
.tray[hidden]{ display:none; }
.tray .btn{ background:var(--marigold); color:#15193B; padding:9px 16px; }
.tray button.x{ background:transparent; border:0; color:var(--paper); opacity:.7; cursor:pointer; font-size:14px; }

.states{ display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:10px; }
.states a{ display:flex; justify-content:space-between; padding:12px 14px; border:1.5px solid var(--line); border-radius:12px; text-decoration:none; color:var(--ink); font-weight:600; }
.states a:hover{ border-color:var(--ink); }
.states a span{ color:var(--ink-3); font-weight:500; }

.policy{ display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:28px; }
.policy div{ background:var(--mist); border-radius:var(--r-md); padding:18px 20px; }
.policy b{ display:block; margin-bottom:4px; font-size:17px; }
.policy span{ color:var(--ink-2); }

@media (max-width: 960px){
  .stat-strip{ grid-template-columns:1fr 1fr; }
  .stat-strip div:nth-child(2){ border-right:0; } .stat-strip div:nth-child(-n+2){ border-bottom:1px solid var(--line); }
  .policy{ grid-template-columns:1fr; }
}
@media (max-width: 680px){
  .brand{ font-size:17px; gap:8px; } .brand svg{ width:28px; height:28px; } .brand .ai{ font-size:.6em; padding:1px 4px; }
  .nav{ gap:0; } .nav a{ padding:6px 8px; font-size:14px; }
  .prow{ grid-template-columns:38px 1fr auto; } .prow .pm2, .prow .pt{ grid-column:2; }
  .peer-row{ grid-template-columns:1fr; gap:6px; }
  .career li{ grid-template-columns:1fr; gap:2px; }
  .cmp-row{ grid-template-columns:120px repeat(var(--n),minmax(140px,1fr)); }
  .cmp-wrap{ overflow-x:auto; }
  .own-item{ grid-template-columns:auto 1fr; } .own-item .since{ grid-column:2; text-align:left; }
}
@media (prefers-reduced-motion: reduce){ .float-a,.float-b,.float-c,.twinkle,.sweep,.bar-grow{ animation:none !important; } }

/* Print: meeting sheet */
@media print{
  .top, footer, .tray, .side, .crumbs, .actions, details.routine, #people, #own, #hist, #changed, .calc-top, .presets, .copy-btn, [data-copy-all], .toast, .callout.info, .unclear{ display:none !important; }
  body{ font-size:12pt; background:#fff; color:#000; }
  .p-grid{ display:block; padding:0; }
  .p-main{ gap:18pt; }
  .anim [data-reveal], .anim [data-stagger] > *, .anim .tl .body, .anim .tl .yr{ opacity:1 !important; transform:none !important; }
  .calc{ border:1px solid #000; } .calc-out{ background:#fff; }
  .p-sec h2{ font-size:16pt; }
  .qs li{ background:#fff; border:1px solid #999; }
  a{ color:#000; }
}

@media (max-width: 370px){ .nav a[data-nav="firms"]{ display:none; } }

/* ===== Timeline dots: solid, above the bar, bounce when reached ===== */
.timeline::before, .timeline::after{ z-index:0; }
.tl .yr::after{ z-index:2; background:var(--flag); border-color:var(--flag); box-shadow:0 0 0 4px var(--paper); }
.tl.soft .yr::after, .timeline.soft-line .tl .yr::after{ background:var(--blue); border-color:var(--blue); }
.anim .tl .yr::after{ background:var(--mist-2); border-color:var(--line); transition:transform .45s cubic-bezier(.3,1.6,.5,1), opacity .3s, background-color .25s, border-color .25s; }
.anim .tl.hit .yr::after{ background:var(--flag); border-color:var(--flag); animation:dotBounce .6s cubic-bezier(.3,1.7,.5,1); }
.anim .timeline.soft-line .tl.hit .yr::after{ background:var(--blue); border-color:var(--blue); }
@keyframes dotBounce{ 0%{ transform:scale(1) } 35%{ transform:scale(1.6) } 65%{ transform:scale(.88) } 100%{ transform:scale(1) } }
@media print{ .tl .yr::after{ background:#C93A2B !important; border-color:#C93A2B !important; } }
.anim .timeline::after{ transition:none; }

/* ===== ChooseAFinancialAdvisor brand ===== */
.brand{ gap:10px; }
.brand .wm{ font-family:var(--display); font-weight:800; letter-spacing:-.02em; font-size:19px; white-space:nowrap; }
.brand .w1{ color:var(--blue-ink); } .brand .w2{ color:var(--ink); }
.brand .tld{ font-size:.62em; font-weight:800; background:var(--marigold); color:#15193B; border-radius:6px; padding:1px 5px 2px; margin-left:3px; position:relative; top:-.3em; }
footer .brand .w1{ color:#A6B1FF; } footer .brand .w2{ color:#fff; }
.nav a.nav-cta{ background:var(--blue); color:#fff; }
.nav a.nav-cta:hover, .nav a.nav-cta[aria-current="page"]{ background:var(--blue-ink); color:#fff; }
:root[data-theme="dark"] .nav a.nav-cta{ color:#0F1230; }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .nav a.nav-cta{ color:#0F1230; } }
.menu-btn{ display:none; margin-left:auto; border:1.5px solid var(--line); background:var(--paper); border-radius:999px; padding:7px 14px; font-weight:700; cursor:pointer; }
.top-search{ max-width:260px; }
@media (max-width: 1100px){ .has-topsearch .top-search{ display:none; } }
@media (max-width: 860px){
  .menu-btn{ display:block; }
  .nav{ display:none; position:absolute; top:100%; left:0; right:0; background:var(--paper); border-bottom:1px solid var(--line); flex-direction:column; align-items:stretch; padding:10px 18px 16px; gap:4px; box-shadow:var(--shadow); }
  .menu-open .nav{ display:flex; }
  .nav a{ padding:12px 14px; font-size:16px; }
  .nav a.hide-sm{ display:block; }
}
@media (max-width: 480px){ .brand .wm{ font-size:15px; } .brand svg{ width:28px; height:28px; } }
@media (max-width: 370px){ .brand .wm{ font-size:13.5px; } }
.finder{ display:grid; grid-template-columns:320px 1fr; gap:36px; align-items:start; }
.find-form{ position:sticky; top:96px; display:grid; gap:18px; border:1.5px solid var(--line); border-radius:var(--r-lg); padding:22px; }
.find-form fieldset{ border:0; margin:0; padding:0; display:grid; gap:6px; }
.find-form legend{ font-weight:700; margin-bottom:6px; }
.find-form select{ border:1.5px solid var(--line); border-radius:12px; padding:10px 12px; font:inherit; background:var(--paper); color:var(--ink); }
.pick{ display:flex; gap:10px; align-items:center; padding:8px 10px; border-radius:10px; cursor:pointer; }
.pick:hover{ background:var(--mist); }
.pick input{ accent-color:var(--blue); width:18px; height:18px; }
.find-head{ display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:10px; font-size:18px; }
.find-head select{ border:1.5px solid var(--line); border-radius:999px; padding:8px 12px; font:inherit; font-size:15px; background:var(--paper); color:var(--ink); }
.guide-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:16px; }
.guide-card{ display:flex; flex-direction:column; gap:8px; padding:24px; border-radius:var(--r-lg); text-decoration:none; min-height:170px; transition:transform .2s; }
.guide-card:hover{ transform:translateY(-3px); }
.guide-card b{ font-family:var(--display); font-size:22px; line-height:1.15; letter-spacing:-.02em; }
.guide-card span{ opacity:.85; }
.guide-card.g0{ background:var(--blue); color:#fff; } .guide-card.g1{ background:var(--marigold); color:#15193B; }
.guide-card.g2{ background:var(--ink); color:var(--paper); } .guide-card.g3{ background:var(--mist-2); color:var(--ink); }
:root[data-theme="dark"] .guide-card.g0{ color:#0F1230; }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .guide-card.g0{ color:#0F1230; } }
@media (max-width: 960px){ .finder{ grid-template-columns:1fr; } .find-form{ position:static; } }
.hero .wrap > div{ min-width:0; }
@media (max-width: 680px){ .search-box{ box-shadow:4px 4px 0 var(--blue); margin-right:4px; } .search-box input{ min-width:0; } }

/* ===== Guide-site additions ===== */
.sec-row{ display:flex; justify-content:space-between; align-items:flex-end; gap:20px; flex-wrap:wrap; }
.steps{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(5,1fr); gap:14px; counter-reset:s; }
.steps a{ display:flex; flex-direction:column; gap:8px; height:100%; padding:20px; border-radius:var(--r-lg); background:var(--paper); border:1.5px solid var(--line); text-decoration:none; color:var(--ink); transition:transform .2s, border-color .2s; }
.steps a:hover{ transform:translateY(-3px); border-color:var(--ink); }
.steps .sn{ width:38px; height:38px; border-radius:12px; background:var(--marigold); color:#15193B; display:grid; place-items:center; font-family:var(--display); font-weight:800; font-size:18px; }

.steps b{ font-family:var(--display); font-size:19px; letter-spacing:-.01em; line-height:1.15; }
.steps .sl{ font-size:14px; color:var(--ink-3); }
.art-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:20px; }
.art-card{ display:flex; flex-direction:column; border-radius:var(--r-lg); overflow:hidden; border:1.5px solid var(--line); text-decoration:none; color:var(--ink); background:var(--paper); transition:transform .2s, box-shadow .2s; }
.art-card:hover{ transform:translateY(-3px); box-shadow:var(--shadow); }
.art-img{ line-height:0; }
.art-svg{ width:100%; height:auto; display:block; }
.art-body{ padding:18px 20px 20px; display:flex; flex-direction:column; gap:8px; }
.art-cat{ font-size:13px; font-weight:700; color:var(--blue-ink); }
.art-card b{ font-family:var(--display); font-size:20px; line-height:1.18; letter-spacing:-.015em; }
.art-dek{ color:var(--ink-2); font-size:15px; }
.art-meta{ color:var(--ink-3); font-size:13px; margin-top:auto; }
.art-lead{ display:grid; grid-template-columns:1.2fr 1fr; border-radius:var(--r-lg); overflow:hidden; text-decoration:none; color:var(--ink); background:var(--mist); margin-bottom:36px; }
.art-lead .art-img svg{ height:100%; min-height:240px; object-fit:cover; }
.art-lead .art-body{ padding:32px; justify-content:center; }
.art-lead b{ font-family:var(--display); font-size:clamp(26px,3vw,36px); line-height:1.08; letter-spacing:-.025em; }
.art-feature{ display:grid; grid-template-columns:1.25fr 1fr; gap:22px; }
.art-feature .art-lead{ grid-template-columns:1fr; margin:0; }
.art-side{ display:grid; gap:14px; }
.art-card.row{ flex-direction:row; }
.art-card.row .art-img{ width:38%; flex:none; } .art-card.row .art-img svg{ height:100%; }
.art-card.row b{ font-size:18px; } .art-card.row .art-dek{ display:none; }
.cat-h{ font-family:var(--display); font-weight:800; font-size:24px; letter-spacing:-.02em; margin:36px 0 16px; }
.art-wrap{ max-width:760px; }
.art-title{ font-family:var(--display); font-weight:800; font-size:clamp(34px,5vw,56px); line-height:1.02; letter-spacing:-.035em; margin:8px 0 14px; text-wrap:balance; }
.art-dek.big{ font-size:21px; color:var(--ink-2); margin:0 0 14px; font-family:var(--serif); }
.art-by{ font-size:14px; color:var(--ink-3); margin:0 0 22px; }
.art-hero{ border-radius:var(--r-lg); overflow:hidden; line-height:0; margin-bottom:28px; }
.art-text{ font-size:18px; line-height:1.7; }
.art-text h2{ font-family:var(--display); font-weight:800; font-size:26px; letter-spacing:-.02em; margin:34px 0 10px; line-height:1.15; }
.art-text p{ margin:0 0 16px; }
.art-text .qs{ margin:8px 0 18px; }
.art-list{ padding-left:0; list-style:none; display:grid; gap:10px; margin:6px 0 18px; }
.art-list li{ display:grid; grid-template-columns:22px 1fr; gap:10px; }
.art-list li::before{ content:""; width:10px; height:10px; border-radius:3px; background:var(--marigold); margin-top:10px; }
.art-cta{ display:flex; justify-content:space-between; align-items:center; gap:18px; flex-wrap:wrap; background:var(--blue); color:#fff; border-radius:var(--r-lg); padding:26px 28px; margin:36px 0 8px; }
.art-cta b{ display:block; font-family:var(--display); font-size:24px; }
.art-cta .btn{ background:var(--marigold); color:#15193B; }
:root[data-theme="dark"] .art-cta{ color:#0F1230; }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .art-cta{ color:#0F1230; } }
.facts-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:0; border:1.5px solid var(--line); border-radius:var(--r-md); overflow:hidden; }
.facts-grid > div{ padding:16px 18px; border-bottom:1px solid var(--line); border-right:1px solid var(--line); display:flex; flex-direction:column; gap:4px; }
.facts-grid > div:nth-child(2n){ border-right:0; }
.facts-grid > div:nth-last-child(-n+2){ border-bottom:0; }
.facts-grid span{ font-size:13px; color:var(--ink-3); font-weight:600; }
.facts-grid b{ font-size:16px; }
.svc{ display:flex; flex-wrap:wrap; gap:10px; }
.svc span{ display:inline-flex; gap:8px; align-items:center; background:var(--mist); border-radius:999px; padding:9px 16px; font-weight:600; font-size:15px; }
.svc svg{ color:var(--good); }
.lic{ display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:12px; }
.lic-item{ border:1.5px solid var(--line); border-radius:var(--r-md); padding:14px 16px; display:flex; flex-direction:column; gap:4px; }
.lic-item b{ font-family:var(--display); font-size:20px; }
.lic-item span{ font-size:14px; color:var(--ink-2); }
.lic-item small{ color:var(--ink-3); }
.contact{ border-color:var(--blue); border-width:2px; }
.ct-line{ display:flex; gap:12px; align-items:flex-start; padding:10px 0; border-bottom:1px solid var(--line); text-decoration:none; color:var(--ink); }
.ct-line:last-of-type{ border-bottom:0; }
.ct-line svg{ width:20px; height:20px; color:var(--blue); flex:none; margin-top:2px; }
.ct-line b{ display:block; }
.ct-line span{ color:var(--ink-3); font-size:14px; } .ct-line span b{ color:var(--ink); font-size:16px; }
.faq-item{ border-bottom:1px solid var(--line); }
.faq-item summary{ cursor:pointer; list-style:none; padding:18px 0; font-weight:700; font-size:17px; display:flex; justify-content:space-between; gap:12px; }
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary::after{ content:"+"; font-family:var(--display); font-size:24px; line-height:1; color:var(--blue-ink); }
.faq-item[open] summary::after{ content:"–"; }
.faq-item p{ margin:0 0 18px; color:var(--ink-2); }
.adv-head{ display:flex; gap:18px; align-items:center; flex-wrap:wrap; }
.fld{ border:1.5px solid var(--line); border-radius:12px; padding:11px 12px; font:inherit; background:var(--paper); color:var(--ink); }
@media (max-width: 1060px){ .steps{ grid-template-columns:repeat(3,1fr); } }
@media (max-width: 860px){ .art-feature, .art-lead{ grid-template-columns:1fr; } }
@media (max-width: 680px){ .steps{ grid-template-columns:1fr; } .facts-grid{ grid-template-columns:1fr; } .facts-grid > div{ border-right:0; } .facts-grid > div:nth-last-child(2){ border-bottom:1px solid var(--line); } .art-text{ font-size:17px; } .art-card.row .art-img{ width:34%; } }
@media print{ .art-cta, .art-grid, .cat-h, .crumbs{ display:none !important; } }

.nav a{ white-space:nowrap; }
.top-search{ max-width:220px; }
@media (max-width: 1480px){ .has-topsearch .top-search{ display:none; } }
.art-hero .art-svg{ height:280px; } @media (max-width:680px){ .art-hero .art-svg{ height:180px; } }

/* ===== App-style search and cards ===== */
.find-band{ background:linear-gradient(180deg,var(--mist) 0, var(--mist) 260px, var(--paper) 260px); }
.fbar{ display:grid; grid-template-columns:1.3fr .8fr 1fr auto; gap:10px; background:var(--paper); border:2px solid var(--ink); border-radius:22px; padding:10px; box-shadow:6px 6px 0 var(--blue); align-items:end; }
.fcol{ display:flex; flex-direction:column; gap:4px; padding:4px 8px; border-right:1px solid var(--line); }
.fcol:nth-child(3){ border-right:0; }
.fcol > span{ font-size:12px; font-weight:700; color:var(--ink-3); }
.fin{ display:flex; align-items:center; gap:8px; } .fin > svg{ width:18px; height:18px; color:var(--ink-3); flex:none; }
.fin input, .fin select{ border:0; outline:0; background:transparent; font:600 16px var(--body); color:var(--ink); width:100%; min-width:0; padding:6px 0; }
.locbtn{ border:0; background:var(--blue-soft); color:var(--blue-ink); width:34px; height:34px; border-radius:10px; display:grid; place-items:center; cursor:pointer; flex:none; }
.locbtn svg{ width:18px; height:18px; } .locbtn:hover{ background:var(--blue); color:#fff; }
.fgo{ height:52px; padding:0 26px; border-radius:16px; }
.qchips{ display:flex; gap:8px; flex-wrap:wrap; margin:16px 0 4px; }
.qchip{ display:inline-flex; align-items:center; gap:6px; border:1.5px solid var(--line); background:var(--paper); border-radius:999px; padding:8px 14px; font-weight:600; font-size:14px; cursor:pointer; transition:transform .12s, background .15s, border-color .15s; color:var(--ink); }
.qchip:hover{ border-color:var(--ink); transform:translateY(-1px); }
.qchip[aria-pressed="true"]{ background:var(--ink); color:var(--paper); border-color:var(--ink); }
.qchip.qnear{ border-color:var(--blue); color:var(--blue-ink); } .qchip.qnear[aria-pressed="true"]{ background:var(--blue); color:#fff; }
.hero-q{ margin-top:18px; }
.more-btn{ border:0; background:none; color:var(--blue-ink); font-weight:700; cursor:pointer; padding:8px 0; font-size:15px; }
.more-btn::after{ content:" +"; } .more-btn[aria-expanded="true"]::after{ content:" –"; }
.more-panel{ display:grid; grid-template-columns:repeat(3,1fr) 1.4fr auto; gap:14px; align-items:end; border:1.5px solid var(--line); border-radius:var(--r-md); padding:16px; background:var(--paper); margin-bottom:8px; }
.more-panel[hidden]{ display:none; }
.more-panel label > span, .more-panel legend{ display:block; font-size:12px; font-weight:700; color:var(--ink-3); margin-bottom:4px; }
.more-panel select{ width:100%; border:1.5px solid var(--line); border-radius:10px; padding:9px 10px; font:inherit; background:var(--paper); color:var(--ink); }
.more-panel fieldset{ border:0; padding:0; margin:0; display:flex; flex-wrap:wrap; gap:2px 8px; }
.rhead{ display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; margin:22px 0 14px; font-size:18px; }
.fsum{ color:var(--ink-3); font-size:14px; }
.seg{ display:inline-flex; background:var(--mist); border-radius:999px; padding:4px; }
.seg button{ border:0; background:transparent; padding:7px 14px; border-radius:999px; font-weight:600; font-size:14px; cursor:pointer; color:var(--ink-2); }
.seg button[aria-pressed="true"]{ background:var(--paper); color:var(--ink); box-shadow:0 1px 3px rgba(21,25,59,.15); }
.cards{ display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:16px; }
.acard{ position:relative; background:var(--paper); border:1.5px solid var(--line); border-radius:22px; overflow:hidden; display:flex; flex-direction:column; transition:transform .18s, box-shadow .18s, border-color .18s; }
.acard:hover{ transform:translateY(-3px); box-shadow:var(--shadow); border-color:var(--hc); }
.ac-top{ display:flex; justify-content:space-between; align-items:center; gap:8px; padding:10px 14px; background:var(--hs); }
:root[data-theme="dark"] .ac-top{ background:color-mix(in srgb, var(--hc) 22%, var(--paper)); }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .ac-top{ background:color-mix(in srgb, var(--hc) 22%, var(--paper)); } }
.ac-firm{ font-weight:700; font-size:13px; color:var(--hc); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
:root[data-theme="dark"] .ac-firm{ color:var(--ink); } @media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .ac-firm{ color:var(--ink); } }
.ac-dist{ display:inline-flex; align-items:center; gap:4px; background:var(--paper); color:var(--ink); border-radius:999px; padding:3px 10px; font-weight:700; font-size:13px; flex:none; }
.ac-main{ display:flex; gap:14px; padding:16px 16px 8px; align-items:center; }
.ac-ring{ position:relative; width:64px; height:64px; flex:none; color:var(--ink); }
.ac-ring .ring{ width:100%; height:100%; }
.ac-ring > span{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; line-height:1; }
.ac-ring b{ font-family:var(--display); font-size:20px; color:var(--ink); } .ac-ring small{ font-size:10px; color:var(--ink-3); font-weight:700; margin-top:2px; }
.ac-ring.lg{ width:84px; height:84px; } .ac-ring.lg b{ font-size:26px; }
.ac-id{ min-width:0; }
.ac-name{ font-family:var(--display); font-weight:800; font-size:19px; letter-spacing:-.015em; color:var(--ink); text-decoration:none; line-height:1.15; display:block; }
.ac-name::after{ content:""; position:absolute; inset:0; z-index:0; }
.ac-role{ font-size:13px; color:var(--ink-3); font-weight:600; margin-top:2px; }
.ac-addr{ font-size:14px; color:var(--ink-2); margin-top:6px; line-height:1.4; }
.ac-tags{ display:flex; flex-wrap:wrap; gap:6px; padding:4px 16px 12px; }
.ac-svc{ display:inline-flex; align-items:center; gap:5px; font-size:12px; font-weight:700; color:var(--ink-2); background:var(--mist); border-radius:999px; padding:4px 10px; }
.ac-svc svg{ width:14px; height:14px; color:var(--hc); }
.ac-actions{ display:flex; gap:6px; padding:10px 12px; border-top:1px solid var(--line); margin-top:auto; position:relative; z-index:1; }
.ac-btn{ flex:1; display:inline-flex; align-items:center; justify-content:center; gap:6px; border:0; background:var(--mist); color:var(--ink); border-radius:12px; padding:9px 6px; font:700 13px var(--body); cursor:pointer; text-decoration:none; }
.ac-btn:hover{ background:var(--hs); color:var(--hc); }
.ac-btn[aria-pressed="true"]{ background:var(--ink); color:var(--paper); }
.ac-heart{ width:40px; flex:none; border:0; background:var(--mist); border-radius:12px; cursor:pointer; display:grid; place-items:center; }
.ac-heart svg{ width:18px; height:18px; fill:none; stroke:var(--ink-3); stroke-width:2; transition:transform .2s; }
.ac-heart[aria-pressed="true"] svg{ fill:#E0583F; stroke:#E0583F; animation:heartPop .35s cubic-bezier(.3,1.8,.5,1); }
@keyframes heartPop{ 50%{ transform:scale(1.35); } }
.nav-saved{ display:inline-flex !important; align-items:center; gap:5px; } .nav-saved svg{ color:#E0583F; }
.btn[data-save][aria-pressed="true"]{ background:#FDE6E1; color:#B8412B; border-color:#E0583F; }
@media (max-width: 900px){ .fbar{ grid-template-columns:1fr 1fr; } .fcol{ border-right:0; border-bottom:1px solid var(--line); padding-bottom:8px; } .fcol:nth-child(3){ grid-column:1/-1; } .fgo{ grid-column:1/-1; } .more-panel{ grid-template-columns:1fr 1fr; } .more-panel fieldset{ grid-column:1/-1; } }
@media (max-width: 560px){ .fbar{ grid-template-columns:1fr; box-shadow:4px 4px 0 var(--blue); } .fcol:nth-child(3){ grid-column:auto; } .more-panel{ grid-template-columns:1fr; } .cards{ grid-template-columns:1fr; } .qchips{ flex-wrap:nowrap; overflow-x:auto; padding-bottom:6px; scrollbar-width:none; } .qchip{ flex:none; } }
@media (prefers-reduced-motion: reduce){ .ac-heart[aria-pressed="true"] svg{ animation:none; } }

/* ===== Maps ===== */
.usmap > svg, .stmap > svg, .rmap > svg{ width:100%; height:auto; display:block; }
.usmap .st path{ stroke:var(--paper); stroke-width:1.2; transition:fill .2s, transform .2s; }
.usmap .st:hover path, .usmap .st:focus path{ fill:var(--marigold) !important; }
.usmap .st:focus{ outline:none; }
.maplegend{ display:flex; align-items:center; gap:4px; justify-content:flex-end; font-size:12px; color:var(--ink-3); margin-top:8px; }
.maplegend i{ width:22px; height:10px; border-radius:3px; display:inline-block; }
.maplegend span{ margin:0 6px; }
.maptip{ position:fixed; z-index:80; background:var(--ink); color:var(--paper); padding:8px 12px; border-radius:10px; font-size:13px; pointer-events:none; box-shadow:var(--shadow); }
.maptip b{ display:block; font-size:14px; }
.stmap{ background:var(--mist); border-radius:var(--r-lg); padding:14px; }
.st-shape{ fill:var(--paper); stroke:var(--blue); stroke-width:1.5; vector-effect:non-scaling-stroke; }
.cdot circle{ fill:var(--blue); fill-opacity:.78; stroke:var(--paper); stroke-width:1.5; vector-effect:non-scaling-stroke; transition:fill .15s; }
.cdot:hover circle, .cdot:focus circle{ fill:var(--marigold); fill-opacity:1; }
.state-top{ display:grid; grid-template-columns:1.3fr 1fr; gap:28px; align-items:start; margin-bottom:28px; }
.map-band{ display:grid; grid-template-columns:.8fr 1.4fr; gap:36px; align-items:center; }
.rmap{ display:grid; grid-template-columns:1.5fr 1fr; gap:18px; align-items:start; }
.rmap > svg{ background:var(--mist); border-radius:var(--r-lg); }
.rm-st{ fill:var(--paper); stroke:var(--line); stroke-width:1; vector-effect:non-scaling-stroke; }
.rdot circle{ fill:var(--blue); stroke:var(--paper); stroke-width:2; vector-effect:non-scaling-stroke; cursor:pointer; transition:fill .15s; }
.rdot text{ fill:#fff; text-anchor:middle; font-weight:800; font-family:var(--body); pointer-events:none; }
.rdot.feat circle{ fill:var(--marigold); } .rdot.feat text{ fill:#15193B; }
.rdot:hover circle, .rdot.sel circle, .rdot:focus circle{ fill:var(--ink); } .rdot:focus{ outline:none; }
.me-halo{ fill:var(--blue); fill-opacity:.15; } .me-dot{ fill:#E0583F; stroke:#fff; stroke-width:2; vector-effect:non-scaling-stroke; }
.rmap-panel{ max-height:640px; overflow:auto; }
.rmap-panel .cards{ grid-template-columns:1fr; }
/* ===== Featured ===== */
.feat-badge{ display:inline-flex; align-items:center; gap:4px; background:var(--marigold); color:#15193B; font-weight:800; font-size:12px; border-radius:999px; padding:3px 10px; }
.acard.is-feat{ border-color:var(--marigold); box-shadow:0 0 0 2px var(--marigold) inset; }
.fstrip{ background:linear-gradient(135deg,#FFF6DA,#FFF); border:1.5px solid var(--marigold); border-radius:var(--r-lg); padding:16px; margin:18px 0 6px; }
:root[data-theme="dark"] .fstrip{ background:var(--mist); } @media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .fstrip{ background:var(--mist); } }
.fs-head{ display:flex; align-items:center; gap:8px; margin-bottom:12px; } .fs-head b{ font-family:var(--display); font-size:18px; }
.fs-info{ border:0; background:none; color:var(--ink-3); cursor:pointer; width:22px; height:22px; padding:0; } .fs-info svg{ width:18px; height:18px; }
.fs-row{ display:grid; grid-auto-flow:column; grid-auto-columns:minmax(290px,320px); gap:14px; overflow-x:auto; padding-bottom:6px; scroll-snap-type:x mandatory; }
.fs-row .acard{ scroll-snap-align:start; }
.rtools{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.match-note{ margin:14px 0 0; }
/* ===== Photos on cards ===== */
.ac-photo{ position:relative; width:64px; height:64px; flex:none; }
.ac-photo img{ width:64px; height:64px; border-radius:18px; object-fit:cover; display:block; }
.ac-yrs{ position:absolute; right:-8px; bottom:-8px; background:var(--hc); color:#fff; font-weight:800; font-size:12px; border-radius:999px; padding:2px 7px; border:2px solid var(--paper); }
.ac-yrs small{ font-size:9px; margin-left:1px; }
/* ===== Accounts ===== */
.nav-auth{ border:1.5px solid var(--line); }
.nav-auth.authed{ background:var(--mist); }
.auth-wrap{ display:grid; place-items:start center; }
.auth-card{ width:min(520px,100%); background:var(--paper); border:1.5px solid var(--line); border-radius:var(--r-lg); padding:28px; box-shadow:var(--shadow); }
.auth-form{ display:grid; gap:14px; } .auth-form label{ display:grid; gap:6px; font-weight:600; font-size:14px; }
.role-seg{ display:grid; grid-template-columns:1fr 1fr; border-radius:14px; }
.role-seg label{ display:block; } .role-seg input{ position:absolute; opacity:0; }
.role-seg span{ display:block; text-align:center; padding:10px; border-radius:12px; font-weight:700; cursor:pointer; font-size:14px; }
.role-seg input:checked + span{ background:var(--paper); box-shadow:0 1px 3px rgba(21,25,59,.15); }
.role-seg input:focus-visible + span{ outline:3px solid var(--blue); }
.demo-note{ display:flex; gap:8px; align-items:flex-start; font-size:13px; color:var(--ink-3); margin-top:14px; } .demo-note svg{ width:16px; height:16px; flex:none; margin-top:2px; }
.acct-tabs{ display:flex; gap:6px; flex-wrap:wrap; margin:6px 0 24px; border-bottom:1px solid var(--line); }
.acct-tabs a{ padding:10px 14px; text-decoration:none; color:var(--ink-2); font-weight:700; border-bottom:3px solid transparent; margin-bottom:-1px; }
.acct-tabs a[aria-current="page"]{ color:var(--ink); border-color:var(--blue); }
.acct-grid{ display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:16px; }
.acct-card{ border:1.5px solid var(--line); border-radius:var(--r-md); padding:18px; background:var(--paper); }
.acct-card h3{ font-family:var(--display); font-size:18px; margin:0 0 12px; }
.checklist{ list-style:none; padding:0; margin:0; display:grid; gap:10px; }
.checklist li{ display:flex; gap:10px; align-items:center; } .checklist .ck{ width:22px; height:22px; border-radius:7px; border:2px solid var(--line); display:grid; place-items:center; flex:none; }
.checklist li.done .ck{ background:var(--good); border-color:var(--good); color:#fff; } .checklist .ck svg{ width:14px; height:14px; }
.checklist li.done a{ text-decoration:line-through; color:var(--ink-3); }
.stat-tiles{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.stat-tiles > div{ background:var(--mist); border-radius:14px; padding:14px; } .stat-tiles b{ display:block; font-family:var(--display); font-size:28px; } .stat-tiles span{ font-size:13px; color:var(--ink-3); }
.dash-stats{ grid-template-columns:repeat(4,1fr); margin:18px 0 6px; }
.inline-form{ display:flex; gap:10px; margin-bottom:18px; } .inline-form .fld{ flex:1; }
.list-card{ margin-bottom:16px; } .lc-head{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-bottom:12px; } .lc-head h3{ margin:0; margin-right:auto; }
.kanban{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.kcol{ background:var(--mist); border-radius:var(--r-md); padding:12px; min-height:160px; }
.kcol h3{ font-size:15px; margin:0 0 10px; display:flex; justify-content:space-between; } .kcol h3 span{ color:var(--ink-3); }
.kcard{ background:var(--paper); border-radius:12px; padding:10px; margin-bottom:8px; display:grid; gap:3px; box-shadow:0 1px 2px rgba(21,25,59,.08); }
.kcard a{ font-weight:700; } .kcard small{ color:var(--ink-3); } .kcard select{ margin-top:6px; border:1px solid var(--line); border-radius:8px; padding:4px; background:var(--paper); color:var(--ink); }
.tools-grid{ display:grid; grid-template-columns:1fr 1.2fr 1fr; gap:14px; }
.trk{ display:grid; gap:4px; font-size:13px; font-weight:700; color:var(--ink-3); margin-bottom:10px; } .trk select{ border:1.5px solid var(--line); border-radius:10px; padding:8px; background:var(--paper); color:var(--ink); }
.score-row{ display:flex; justify-content:space-between; align-items:center; gap:8px; padding:4px 0; font-size:14px; }
.stars button{ border:0; background:none; font-size:20px; color:var(--line); cursor:pointer; padding:0 1px; line-height:1; }
.stars button.on{ color:var(--marigold); }
textarea.fld{ width:100%; resize:vertical; font:inherit; }
/* ===== Claimed profile ===== */
.claimed{ background:var(--mist); border-radius:var(--r-lg); padding:22px; }
.cl-head{ display:flex; gap:16px; align-items:center; margin-bottom:10px; } .cl-photo{ width:88px; height:88px; border-radius:22px; object-fit:cover; }
.cl-h{ font-family:var(--display); font-size:24px; margin:8px 0 0; } .cl-bio{ font-size:17px; line-height:1.65; }
.cl-grid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; } .cl-grid h3{ font-size:14px; color:var(--ink-3); margin:0 0 6px; }
/* ===== Portal ===== */
.eyebrow{ display:inline-block; font-weight:800; color:var(--blue-ink); font-size:14px; margin-bottom:10px; letter-spacing:.02em; }
.pro-art{ display:grid; place-items:center; } .pa-card{ width:300px; background:var(--paper); border-radius:24px; padding:22px; box-shadow:var(--shadow); display:grid; gap:8px; border:2px solid var(--marigold); transform:rotate(-2deg); }
.pa-card b{ font-family:var(--display); font-size:22px; } .pa-card small{ color:var(--ink-3); }
.pa-bar{ height:10px; background:var(--mist); border-radius:99px; overflow:hidden; } .pa-bar i{ display:block; height:100%; background:var(--blue); border-radius:99px; }
.tiers{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.tier{ border:1.5px solid var(--line); border-radius:var(--r-lg); padding:24px; background:var(--paper); display:flex; flex-direction:column; gap:6px; }
.tier.hot{ border:2px solid var(--marigold); } .tier h3{ font-family:var(--display); font-size:26px; margin:6px 0 0; } .tier .price{ font-weight:800; color:var(--blue-ink); margin:0 0 6px; }
.tier .btn{ margin-top:auto; align-self:flex-start; }
.claim-steps{ display:flex; gap:8px; list-style:none; padding:0; margin:0 0 20px; counter-reset:c; flex-wrap:wrap; }
.claim-steps li{ counter-increment:c; padding:8px 14px; border-radius:999px; background:var(--mist); font-weight:700; font-size:14px; color:var(--ink-3); }
.claim-steps li::before{ content:counter(c)". "; } .claim-steps li.on{ background:var(--blue); color:#fff; } .claim-steps li.done{ background:var(--good-soft,#E3F4EC); color:var(--good); }
.dash-head{ display:flex; justify-content:space-between; gap:18px; flex-wrap:wrap; align-items:flex-start; }
.feat-toggle{ display:flex; gap:14px; align-items:center; border:1.5px solid var(--line); border-radius:var(--r-md); padding:12px 14px; }
.feat-toggle.on{ border-color:var(--marigold); background:#FFF6DA; } .feat-toggle small{ display:block; color:var(--ink-3); }
:root[data-theme="dark"] .feat-toggle.on{ background:var(--mist); }
.pform{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:22px; border:1.5px solid var(--line); border-radius:var(--r-lg); padding:22px; }
.pform label{ display:grid; gap:6px; font-weight:600; font-size:14px; } .pform .span2{ grid-column:1/-1; }
.pf-photo{ grid-column:1/-1; display:flex; gap:14px; align-items:center; }
.pf-img{ width:84px; height:84px; border-radius:22px; background:var(--mist); display:grid; place-items:center; overflow:hidden; font-family:var(--display); font-size:26px; font-weight:800; color:var(--blue-ink); }
.pf-img img{ width:100%; height:100%; object-fit:cover; }
.chipset{ display:flex; flex-wrap:wrap; gap:8px; margin-top:6px; } .chipset .qchip input{ position:absolute; opacity:0; }
.chipset .qchip:has(input:checked){ background:var(--ink); color:var(--paper); border-color:var(--ink); }
.lbl{ font-weight:600; font-size:14px; } .tog{ display:flex !important; grid-template-columns:none !important; align-items:center; gap:10px; } .tog input{ width:20px; height:20px; accent-color:var(--blue); }
/* ===== Match ===== */
.match-band{ padding-top:56px; min-height:70vh; }
.m-progress{ height:8px; background:var(--mist); border-radius:99px; overflow:hidden; margin-bottom:24px; } .m-progress i{ display:block; height:100%; background:var(--blue); border-radius:99px; transition:width .3s; }
.m-opts{ display:grid; gap:12px; margin:22px 0; }
.m-opt{ text-align:left; padding:18px 20px; border-radius:18px; border:2px solid var(--line); background:var(--paper); font:700 18px var(--body); color:var(--ink); cursor:pointer; transition:transform .15s, border-color .15s; }
.m-opt:hover, .m-opt:focus-visible{ border-color:var(--blue); transform:translateX(4px); }
@media (max-width: 960px){ .map-band, .state-top, .rmap, .acct-grid, .tools-grid, .tiers{ grid-template-columns:1fr; } .kanban{ grid-template-columns:1fr 1fr; } .dash-stats{ grid-template-columns:1fr 1fr; } }
@media (max-width: 560px){ .kanban, .pform, .cl-grid{ grid-template-columns:1fr; } .rmap > svg{ min-height:260px; } }
@media (max-width: 1200px){ .nav .hide-md{ display:none; } } .nav .hide-lg{ display:none; }
@media (max-width: 860px){ .nav .hide-md, .nav .hide-lg{ display:inline; } }
.btn.dark{ background:var(--ink); color:var(--paper); }
.sub-box{ border-top:1px solid var(--line); padding-top:18px; margin-top:6px; display:grid; gap:10px; }
.sub-box h3{ font-family:var(--display); font-size:22px; margin:0; }
.sub-status{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; font-size:15px; }
.sub-links{ margin-left:auto; font-weight:700; }
.tier .price b{ font-family:var(--display); font-size:34px; color:var(--ink); }
.checkout{ display:grid; grid-template-columns:1fr 1fr; gap:36px; max-width:980px; }
.co-price b{ font-family:var(--display); font-size:40px; } .co-price{ color:var(--ink-3); margin:6px 0 14px; }
.co-lines{ border-top:1px solid var(--line); margin:18px 0 10px; } .co-lines > div{ display:flex; justify-content:space-between; padding:10px 0; border-bottom:1px solid var(--line); font-size:15px; }
.co-lines .tot{ font-weight:800; font-size:17px; }
.co-pay{ background:var(--paper); border:1.5px solid var(--line); border-radius:var(--r-lg); padding:24px; display:grid; gap:14px; box-shadow:var(--shadow); align-self:start; }
.co-pay label{ display:grid; gap:6px; font-weight:600; font-size:14px; }
.co-card span{ font-weight:600; font-size:14px; } .co-fake{ margin-top:6px; border:1.5px dashed var(--line); border-radius:12px; padding:14px; color:var(--ink-3); font-size:14px; }
.demo-banner{ display:flex; gap:10px; background:#FFF6DA; border-radius:12px; padding:12px; font-size:14px; } .demo-banner svg{ width:18px; height:18px; flex:none; margin-top:2px; }
:root[data-theme="dark"] .demo-banner{ background:var(--mist); }
.ok-badge{ width:72px; height:72px; border-radius:24px; background:var(--good); color:#fff; display:grid; place-items:center; margin:0 auto 18px; } .ok-badge svg{ width:38px; height:38px; }
table.inv{ width:100%; border-collapse:collapse; } table.inv th, table.inv td{ text-align:left; padding:12px; border-bottom:1px solid var(--line); } table.inv th{ font-size:13px; color:var(--ink-3); }
@media (max-width: 860px){ .checkout{ grid-template-columns:1fr; } }
.co-sum > a:first-child{ display:block; } .co-price b{ color:var(--ink); }
/* ===== Phone fit ===== */
html, body{ overflow-x:clip; }
.state-top > *, .map-band > *, .rmap > *, .finder > *, .p-grid > *, .checkout > *, .acct-grid > *, .tools-grid > *{ min-width:0; }
.top .wrap{ gap:10px; }
.brand{ min-width:0; overflow:hidden; }
@media (max-width: 420px){
  .brand .wm{ font-size:14px; } .brand svg{ width:26px; height:26px; flex:none; }
  .menu-btn{ padding:6px 11px; font-size:14px; flex:none; }
  .wrap{ padding-left:16px; padding-right:16px; }
}
@media (max-width: 360px){ .brand .tld{ display:none; } }
/* ===== Experience, strengths, extras ===== */
.ac-exp{ margin:0 16px 8px; font-size:13px; font-weight:700; color:var(--hc); }
:root[data-theme="dark"] .ac-exp{ color:var(--ink-2); }
.ac-ring.is-new b{ font-size:15px; color:var(--good); }
.ac-ring.lg.is-new b{ font-size:20px; }
.tag.gold{ background:#FFF1C7; color:#7A5300; }
:root[data-theme="dark"] .tag.gold{ background:#3B3110; color:#FFD873; }
.more-panel{ grid-template-columns:repeat(5,1fr) !important; }
.more-panel fieldset{ grid-column:1/-1; }
@media (max-width: 900px){ .more-panel{ grid-template-columns:1fr 1fr !important; } }
@media (max-width: 560px){ .more-panel{ grid-template-columns:1fr !important; } }
.linkish{ border:0; background:none; padding:0; color:var(--blue-ink); text-decoration:underline; cursor:pointer; font:inherit; }
.updated{ margin-top:22px; }
.dlg{ border:0; border-radius:var(--r-lg); padding:0; width:min(480px,92vw); box-shadow:0 30px 80px rgba(21,25,59,.35); background:var(--paper); color:var(--ink); }
.dlg::backdrop{ background:rgba(21,25,59,.45); }
.dlg-body{ display:grid; gap:12px; padding:24px; } .dlg-body h3{ font-family:var(--display); font-size:22px; margin:0; } .dlg-body label{ display:grid; gap:6px; font-weight:600; font-size:14px; }
.facts-strip{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin:0 0 14px; }
.facts-strip > div{ background:var(--mist); border-radius:16px; padding:14px; } .facts-strip b{ display:block; font-family:var(--display); font-size:28px; } .facts-strip span{ font-size:13px; color:var(--ink-3); }
.chips-row{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:22px; } .chip.on{ background:var(--ink); color:var(--paper); }
.calcx{ display:grid; grid-template-columns:1fr 1.2fr; gap:24px; }
.calc-in{ display:grid; gap:14px; align-content:start; border:1.5px solid var(--line); border-radius:var(--r-lg); padding:20px; } .calc-in label{ display:grid; gap:6px; font-weight:600; font-size:14px; } .calc-in #cOpts{ display:grid; gap:14px; }
.calc-out{ border:1.5px solid var(--line); border-radius:var(--r-lg); padding:20px; background:var(--paper); }
.co-big span{ display:block; color:var(--ink-3); font-weight:700; font-size:14px; } .co-big b{ font-family:var(--display); font-size:46px; display:block; line-height:1.1; } .co-big small{ color:var(--ink-3); }
.bars{ display:grid; gap:8px; } .bar-row{ display:grid; grid-template-columns:62px 1fr 96px; gap:10px; align-items:center; font-size:14px; } .bar{ height:14px; background:var(--mist); border-radius:99px; overflow:hidden; } .bar i{ display:block; height:100%; background:var(--blue); border-radius:99px; } .bar-row b{ text-align:right; }
.pk{ border-top:2px solid var(--ink); padding:18px 0; page-break-inside:avoid; } .pk h2{ font-family:var(--display); margin:0 0 6px; } .pk h3{ font-size:16px; margin:14px 0 6px; }
.pk-score{ width:100%; border-collapse:collapse; } .pk-score td{ padding:6px 0; border-bottom:1px solid var(--line); } .pk-lines{ height:120px; background:repeating-linear-gradient(transparent 0 27px, var(--line) 27px 28px); }
@media print{ .no-print{ display:none !important; } .packet .pk{ break-inside:avoid; } }
.dash-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:14px; margin-top:14px; }
.meter{ height:12px; background:var(--mist); border-radius:99px; overflow:hidden; margin-bottom:10px; } .meter i{ display:block; height:100%; background:linear-gradient(90deg,var(--blue),#6A79F0); border-radius:99px; }
.checklist.small li{ font-size:14px; } .checklist.small .ck{ width:18px; height:18px; border-radius:6px; }
.count-pill{ font-size:12px; background:var(--blue); color:#fff; border-radius:99px; padding:2px 8px; margin-left:6px; vertical-align:middle; }
.inbox{ display:grid; gap:10px; max-height:360px; overflow:auto; } .msg{ border:1px solid var(--line); border-radius:12px; padding:12px; } .msg.unread{ border-color:var(--blue); box-shadow:0 0 0 1px var(--blue) inset; }
.msg-h{ display:flex; justify-content:space-between; gap:8px; } .msg-h small{ color:var(--ink-3); } .msg p{ margin:6px 0; }
.badge-prev{ padding:16px; background:var(--mist); border-radius:12px; margin-bottom:10px; }
.email-prev{ border:1px dashed var(--line); border-radius:12px; padding:12px; margin-top:10px; font-size:14px; } .email-prev small{ color:var(--ink-3); display:block; } .email-prev p{ margin:6px 0 0; }
.seat-list{ display:grid; gap:6px; max-height:420px; overflow:auto; margin:12px 0; } .seat{ display:flex; gap:10px; align-items:center; padding:8px; border-radius:10px; } .seat:hover{ background:var(--mist); } .seat input{ width:18px; height:18px; accent-color:var(--blue); } .seat small{ display:block; color:var(--ink-3); }
.seat-total{ display:flex; justify-content:space-between; align-items:center; gap:12px; border-top:1px solid var(--line); padding-top:12px; font-weight:700; }
.admin-stats{ grid-template-columns:repeat(4,1fr); }
.content-row{ display:grid; grid-template-columns:1fr 1.6fr auto; gap:10px; align-items:end; margin-bottom:10px; } .content-row label{ display:grid; gap:4px; font-size:13px; font-weight:700; }
.plan-seg{ margin:6px 0 4px; }
.tier .price small{ display:block; font-weight:600; color:var(--ink-3); font-size:13px; }
.es-hero .lede{ max-width:620px; }
@media (max-width: 860px){ .facts-strip{ grid-template-columns:1fr 1fr; } .calcx{ grid-template-columns:1fr; } .admin-stats{ grid-template-columns:1fr 1fr; } .content-row{ grid-template-columns:1fr; } }
/* ===== Help boxes ===== */
.helpbox{ position:fixed; z-index:90; background:var(--ink); color:var(--paper); border-radius:16px; padding:14px 16px 13px; box-shadow:0 18px 50px rgba(21,25,59,.32); font-size:14px; line-height:1.5; opacity:0; transform:translateY(4px); transition:opacity .16s ease, transform .16s ease; pointer-events:auto; }
.helpbox.show{ opacity:1; transform:none; }
.hb-t{ font-family:var(--display); font-weight:800; font-size:15px; margin-bottom:4px; color:var(--marigold); }
.hb-b{ opacity:.92; } .hb-l{ display:inline-block; margin-top:8px; color:#A6B1FF; font-weight:700; font-size:13px; }
.hb-arrow{ position:absolute; bottom:-6px; width:12px; height:12px; background:var(--ink); transform:translateX(-50%) rotate(45deg); border-radius:2px; }
.helpbox.below .hb-arrow{ bottom:auto; top:-6px; }
:root[data-theme="dark"] .helpbox, :root[data-theme="dark"] .hb-arrow{ background:#2A2F5A; }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .helpbox, :root:not([data-theme="light"]) .hb-arrow{ background:#2A2F5A; } }
.hq{ display:inline-grid; place-items:center; width:17px; height:17px; border-radius:50%; background:var(--mist-2); color:var(--ink-2); font-size:11px; font-weight:800; margin-left:4px; cursor:help; flex:none; line-height:1; vertical-align:middle; }
.qchip[aria-pressed="true"] .hq{ background:rgba(255,255,255,.22); color:inherit; }
.qchip .qi{ width:15px; height:15px; flex:none; opacity:.85; }
[data-help]:not(.qchip):not(.hq):not(.feat-badge){ cursor:help; }
.tag[data-help], .ac-exp[data-help], .ac-svc[data-help], .svc span[data-help]{ text-decoration:underline dotted color-mix(in srgb, currentColor 45%, transparent); text-underline-offset:3px; }
.dotted{ text-decoration:underline dotted; text-underline-offset:3px; cursor:help; }
.facts-grid span .hq, .more-panel .hq, .rk .hq{ vertical-align:-3px; }
@media (hover:hover) and (pointer:fine){ .qchip .hq{ display:none; } }
.ac-tags, .ac-exp{ position:relative; z-index:1; }
.quotes{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.quote-col{ border:1.5px solid var(--line); border-radius:var(--r-lg); padding:16px; display:grid; gap:10px; align-content:start; } .quote-col h3{ font-family:var(--display); margin:0; } .quote-col label{ display:grid; gap:4px; font-weight:600; font-size:14px; }
table.inv tr.best td{ background:#EAF7F0; } :root[data-theme="dark"] table.inv tr.best td{ background:#173528; }
.need fieldset{ margin:0 0 14px; } .need legend{ font-weight:800; font-size:17px; padding:0 4px; }
.m-opts.compact{ grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); margin:10px 0 0; } .m-opts.compact .m-opt{ font-size:15px; padding:12px 14px; display:flex; gap:10px; align-items:center; }
.m-opt input{ accent-color:var(--blue); width:18px; height:18px; }
.gloss{ display:grid; gap:0; } .gloss > div{ padding:14px 0; border-bottom:1px solid var(--line); scroll-margin-top:90px; } .gloss dt{ font-family:var(--display); font-weight:800; font-size:18px; } .gloss dd{ margin:4px 0 0; color:var(--ink-2); }
@media (max-width: 860px){ .quotes{ grid-template-columns:1fr; } }
.art-ex{ background:var(--mist); border-left:4px solid var(--blue); border-radius:0 16px 16px 0; padding:16px 20px; margin:22px 0; }
.art-ex span{ display:block; font-weight:800; font-size:13px; letter-spacing:.04em; text-transform:uppercase; color:var(--blue-ink); margin-bottom:6px; }
.art-ex p{ margin:0; font-size:17px; }
.art-pull{ margin:28px 0; padding:0 0 0 22px; border-left:4px solid var(--marigold); font-family:var(--serif); font-size:24px; line-height:1.4; color:var(--ink); }
.art-mistakes{ border:1.5px solid #F2C9C0; background:#FFF6F3; border-radius:16px; padding:16px 20px; margin:24px 0; }
.art-mistakes b{ display:block; margin-bottom:8px; } .art-mistakes ul{ margin:0; padding-left:20px; } .art-mistakes li{ margin:4px 0; }
:root[data-theme="dark"] .art-mistakes{ background:#2A1D1A; border-color:#5A3A33; }
.art-table{ margin:18px 0; } .art-table td, .art-table th{ font-size:15px; }
@media (max-width:680px){ .art-pull{ font-size:20px; } }
.trk select, .trk .fld{ width:100%; box-sizing:border-box; }
.tools-grid{ grid-template-columns:repeat(auto-fit,minmax(250px,1fr)) !important; }
#mine h2{ overflow-wrap:anywhere; }
.score-row{ display:grid; grid-template-columns:1fr auto; gap:8px; }
.stars{ white-space:nowrap; } .stars button{ font-size:18px; padding:0; }
/* ===== Zoom maps ===== */
.zmap{ position:relative; }
.zmap svg{ width:100%; height:auto; display:block; touch-action:pan-y; user-select:none; }
.zmap svg.dragging{ cursor:grabbing; }
.stmap .zmap svg{ max-height:620px; }
.zb{ cursor:pointer; } .zb circle{ fill:var(--blue); fill-opacity:.82; stroke:#fff; stroke-width:2; vector-effect:non-scaling-stroke; transition:fill .15s; }
.zb.cl circle{ fill:var(--blue); fill-opacity:.95; stroke-width:3; }
.zb.one circle{ fill-opacity:.85; }
.zb text{ fill:#fff; text-anchor:middle; font-weight:800; font-family:var(--body); pointer-events:none; }
.zb.feat circle{ fill:var(--marigold); } .zb.feat text{ fill:#15193B; }
.zb:hover circle, .zb:focus circle{ fill:var(--ink); } .zb:focus{ outline:none; }
.zctl{ position:absolute; right:10px; top:10px; display:grid; gap:6px; }
.zctl button{ width:36px; height:36px; border-radius:12px; border:1.5px solid var(--line); background:var(--paper); color:var(--ink); font-size:20px; font-weight:700; cursor:pointer; box-shadow:0 2px 6px rgba(21,25,59,.12); line-height:1; }
.zctl button:hover{ border-color:var(--ink); }
.zhint{ position:absolute; left:12px; bottom:10px; font-size:12px; font-weight:700; background:var(--paper); color:var(--ink-2); border-radius:999px; padding:5px 10px; box-shadow:0 2px 6px rgba(21,25,59,.1); transition:opacity .3s; pointer-events:none; }
.zhint.gone{ opacity:0; }
.rmap .zmap svg{ background:var(--mist); border-radius:var(--r-lg); min-height:300px; }
@media print{
  .top, footer, #tray, .tray, .menu-btn, .zctl, .zhint, .art-cta, .art-grid, .cat-h, .crumbs, .actions, .copy-btn, .helpbox, .toast, #toast, .side, .acct-tabs, .art-hero{ display:none !important; }
  body{ background:#fff !important; color:#000 !important; } .band{ padding:0 !important; } .wrap{ max-width:none !important; padding:0 !important; }
  .qs li{ break-inside:avoid; } a{ color:#000 !important; text-decoration:none !important; }
  .p-grid{ display:block !important; }
}
.made-with{ text-align:center; margin:18px 0 0; font-family:var(--display); font-weight:700; font-size:15px; letter-spacing:.01em; color:#C9CEF5; }
.mw-heart{ display:inline-block; animation:mwBeat 2.4s ease-in-out infinite; transform-origin:center; }
.mw-mtn{ margin-right:4px; }
@keyframes mwBeat{ 0%,60%,100%{ transform:scale(1); } 10%{ transform:scale(1.22); } 20%{ transform:scale(.96); } 30%{ transform:scale(1.14); } }
@media (prefers-reduced-motion: reduce){ .mw-heart{ animation:none; } }
@media print{ .made-with{ color:#555 !important; } }
footer .made-with{ grid-column:1/-1; width:100%; padding-top:18px; border-top:1px solid rgba(255,255,255,.08); }
@media (max-width: 1340px) and (min-width: 861px){ .nav a{ padding:8px 9px; font-size:15px; } .nav{ gap:2px; } .brand .wm{ font-size:17px; } }
footer .made-with{ max-width:none !important; text-align:center; }
@media (max-width: 1460px) and (min-width: 861px){ .nav a{ padding:8px 9px; font-size:15px; } .nav{ gap:2px; } .brand .wm{ font-size:17px; } .top .brand{ flex:none; } }
.lang-btn{ border:1.5px solid var(--line); background:var(--paper); color:var(--ink); border-radius:999px; padding:6px 11px; font:800 13px var(--body); cursor:pointer; letter-spacing:.04em; }
.lang-btn:hover{ border-color:var(--ink); }
.foot-lang{ text-align:center; margin:14px 0 0; grid-column:1/-1; } .foot-lang a{ color:#C9CEF5; font-weight:700; }

html[lang="es"] .nav a{ padding:8px 9px; font-size:15px; }
@media (max-width: 1500px) and (min-width: 861px){ html[lang="es"] .nav .hide-md{ display:none; } html[lang="es"] .nav a{ padding:8px 7px; font-size:14.5px; } html[lang="es"] .brand .wm{ font-size:16px; } }
@media (max-width: 1180px) and (min-width: 861px){ .nav a{ padding:7px 6px !important; font-size:14px !important; } .brand .wm{ font-size:15px !important; } .brand .tld{ display:none; } }
@media (max-width: 1100px){
  .menu-btn{ display:block; }
  .nav{ display:none; position:absolute; top:100%; left:0; right:0; background:var(--paper); border-bottom:1px solid var(--line); flex-direction:column; align-items:stretch; padding:10px 18px 16px; gap:4px; box-shadow:var(--shadow); }
  .menu-open .nav{ display:flex; }
  .nav a{ padding:12px 14px !important; font-size:16px !important; }
  .nav .hide-md, .nav .hide-lg, html[lang="es"] .nav .hide-md{ display:inline !important; }
  .nav .lang-btn{ align-self:flex-start; margin:6px 14px; }
  .brand .tld{ display:inline-block !important; } .brand .wm{ font-size:17px !important; }
  .top-search{ display:none !important; }
}
@media (max-width: 480px){ .brand .wm{ font-size:14px !important; } }
@media (max-width: 360px){ .brand .tld{ display:none !important; } }
/* bullet lists: keep mixed bold/plain text on one flowing line */
.art-list li{ display:block !important; position:relative; padding-left:28px; }
.art-list li::before{ position:absolute; left:4px; top:0.55em; margin:0 !important; }
.tier{ scroll-margin-top:96px; }
.flash{ animation:flashRing 1.4s ease; }
@keyframes flashRing{ 0%{ box-shadow:0 0 0 0 rgba(255,194,51,.9); } 60%{ box-shadow:0 0 0 10px rgba(255,194,51,0); } 100%{ box-shadow:none; } }
.tier .feat-badge{ align-self:flex-start; }
.consent{ position:fixed; left:16px; right:16px; bottom:16px; z-index:95; max-width:640px; margin:0 auto; background:var(--paper); color:var(--ink); border:1.5px solid var(--line); border-radius:20px; padding:16px 18px; box-shadow:0 20px 60px rgba(21,25,59,.25); display:flex; gap:14px; align-items:center; flex-wrap:wrap; }
.consent p{ margin:0; flex:1 1 300px; font-size:14px; } .consent .actions{ margin:0; }
@media print{ .consent{ display:none !important; } }
/* stable header: no size change on scroll (prevents flicker), reserve scrollbar space */
.top.scrolled .wrap{ height:68px !important; } .top .wrap{ transition:none !important; }
.top.scrolled{ box-shadow:0 1px 0 var(--line); }
html{ scrollbar-gutter:stable; }
.back-link{ display:inline-flex; align-items:center; gap:6px; font-weight:700; font-size:15px; color:var(--blue-ink); text-decoration:none; padding:6px 10px 6px 4px; margin:0 0 14px -4px; border-radius:10px; background:none; border:0; cursor:pointer; font-family:var(--body); }
.back-link:hover{ background:var(--mist); }
.role-switch{ margin-top:10px; font-size:14px; color:var(--ink-3); }
.dash-tools{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.match-nav{ display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; margin-top:10px; } .match-nav .back-link{ margin:0; }
.skip-link{ font-size:14px; }
.foot-reset{ text-align:center; margin:10px 0 0; grid-column:1/-1; } .foot-reset a{ color:#8E95C9; font-size:13px; }