/* Medical Weight Loss Canada. The Open Record.
   Implementation of 10-design-system: canonical tokens, Newsreader display, Figtree body,
   warm paper, deep mulberry, quiet surfaces. Fonts and icons are served from this site.
   Semantic state colours are independent of the brand colour and always carry a written label.
   No corner-shape rule, no accent bars, no shadow-only focus. */

/* ---------------------------------------------------------------- tokens */
/* Canonical values: 10-design-system/tokens/design-tokens.json */
:root {
  color-scheme: light dark;
  --canvas:#FAF8F5;--paper:#FFFFFF;--ink:#292429;--muted:#665D62;
  --brand:#54273E;--brand-hover:#402030;--on-brand:#FFFFFF;--tint:#F1E9ED;--line:#DDD5D5;--control-border:#8A7A83;--focus:#54273E;
  --documented:#285B46;--documented-surface:#EAF1EC;--unknown:#7B561D;--unknown-surface:#F7EEDB;
  --conflict:#963E35;--conflict-surface:#FAECE8;--neutral:#59545A;--neutral-surface:#EFECED;
  --font-display:'Newsreader',Georgia,serif;
  --font-body:'Figtree',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-6:24px;--space-8:32px;
  --space-10:40px;--space-12:48px;--space-16:64px;--space-20:80px;--space-24:96px;
  --radius-control:6px;--radius-panel:12px;--radius-status:4px;--max:1248px;--measure:66ch;
  --ease:cubic-bezier(.2,.8,.2,1);--duration:160ms;--z-sticky:10;--z-menu:20;--z-skip:30;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme=light]) {
    --canvas:#191619;--paper:#231F23;--ink:#F3EDF0;--muted:#BDB1B9;
    --brand:#E7B8CC;--brand-hover:#F3CCDD;--on-brand:#291722;--tint:#32252E;--line:#51474E;--control-border:#95858F;--focus:#E7B8CC;
    --documented:#A5D5B9;--documented-surface:#20372C;--unknown:#E8CB92;--unknown-surface:#3A301F;
    --conflict:#F0B2A9;--conflict-surface:#402925;--neutral:#C7BEC4;--neutral-surface:#343035;
  }
}
:root[data-theme=dark] {
  --canvas:#191619;--paper:#231F23;--ink:#F3EDF0;--muted:#BDB1B9;
  --brand:#E7B8CC;--brand-hover:#F3CCDD;--on-brand:#291722;--tint:#32252E;--line:#51474E;--control-border:#95858F;--focus:#E7B8CC;
  --documented:#A5D5B9;--documented-surface:#20372C;--unknown:#E8CB92;--unknown-surface:#3A301F;
  --conflict:#F0B2A9;--conflict-surface:#402925;--neutral:#C7BEC4;--neutral-surface:#343035;
}
:root[data-theme=light]{color-scheme:light}
:root[data-theme=dark]{color-scheme:dark}

/* ---------------------------------------------------------------- fonts */
/* Served from this site. No third-party request is made for presentation assets. */
@font-face{font-family:Newsreader;src:url('/assets/fonts/newsreader-roman-latin-en-fr.woff2') format('woff2');font-weight:200 800;font-style:normal;font-display:swap}
@font-face{font-family:Figtree;src:url('/assets/fonts/figtree-roman-variable.woff2') format('woff2');font-weight:300 900;font-style:normal;font-display:swap}

/* ---------------------------------------------------------------- base */
*{box-sizing:border-box}
html{scroll-padding-top:24px}
body{margin:0;background:var(--canvas);color:var(--ink);font:18px/1.6 var(--font-body);-webkit-font-smoothing:antialiased;font-variant-numeric:normal}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
a{color:var(--brand);text-underline-offset:.18em;text-decoration-thickness:1px}
a:hover{text-decoration-thickness:2px}
a,button,summary,select,input{outline-offset:4px;-webkit-tap-highlight-color:transparent}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
img,svg{max-width:100%}
hr{border:0;border-top:1px solid var(--line);margin:var(--space-8) 0}

h1,h2,h3,h4,.h3{font-family:var(--font-display);font-weight:400;text-wrap:balance;margin:0}
h1{font-size:clamp(36px,4.6vw,60px);line-height:1.08;letter-spacing:-.025em;font-variation-settings:"opsz" 72}
h2{font-size:clamp(28px,3.1vw,40px);line-height:1.16;letter-spacing:-.018em;font-variation-settings:"opsz" 24}
h3,.h3{font-size:27px;line-height:1.2;font-variation-settings:"opsz" 24}
h4{font-size:21px;line-height:1.25}
p{margin:0 0 var(--space-4);max-width:var(--measure)}
ul,ol{margin:0 0 var(--space-4);padding-left:24px;max-width:var(--measure)}
li+li{margin-top:var(--space-2)}
strong{font-weight:700}

main h2{margin:var(--space-12) 0 var(--space-4)}
main h3,.h3{margin:var(--space-8) 0 var(--space-3)}
main h2:first-child,main h3:first-child{margin-top:0}

.lede{font-size:21px;line-height:1.55;color:var(--muted);max-width:62ch}
.small,.meta,.dates,.muted{font-size:14px;line-height:1.5;color:var(--muted)}
.muted{font-size:inherit}
.mono{font-family:var(--font-mono);font-size:14px}
.kicker,.eyebrow{font:600 13px/1.4 var(--font-body);letter-spacing:.12em;text-transform:uppercase;color:var(--brand);margin:0 0 var(--space-4)}
.tabular{font-variant-numeric:tabular-nums}

.shell{width:calc(100% - 96px);max-width:var(--max);margin-inline:auto}
main{display:block;padding-bottom:var(--space-20)}
.skip{position:fixed;top:8px;left:16px;padding:12px 20px;background:var(--brand);color:var(--on-brand);z-index:var(--z-skip);transform:translateY(-200%);text-decoration:none}
.skip:focus{transform:none}

/* ---------------------------------------------------------------- icons */
.icon{width:24px;height:24px;flex:none;fill:currentColor;vertical-align:middle}
.icon-sm{width:18px;height:18px}
.icon-xs{width:16px;height:16px}
.sprite{position:absolute;width:0;height:0;overflow:hidden}

/* ---------------------------------------------------------------- shell */
.preview-bar{background:var(--tint);color:var(--muted);font-size:13px;line-height:1.5;padding:8px 0}
.preview-bar .shell{display:flex;justify-content:space-between;gap:16px;align-items:baseline}
.preview-bar a{color:inherit}

.masthead{border-bottom:1px solid var(--line);background:var(--canvas)}
.masthead-inner{display:flex;align-items:center;gap:36px;min-height:96px}
.brand-link{display:flex;width:276px;flex-shrink:0;align-items:center;color:var(--brand);text-decoration:none}
.brand-link img{width:100%;height:auto;display:block}
.brand-link .logo-dark{display:none}
@media (prefers-color-scheme: dark){
  :root:not([data-theme=light]) .brand-link .logo-light{display:none}
  :root:not([data-theme=light]) .brand-link .logo-dark{display:block}
}
:root[data-theme=dark] .brand-link .logo-light{display:none}
:root[data-theme=dark] .brand-link .logo-dark{display:block}
:root[data-theme=light] .brand-link .logo-light{display:block}
:root[data-theme=light] .brand-link .logo-dark{display:none}

.mainnav{display:flex;gap:24px;align-items:center;margin-left:auto;font-size:15px;font-weight:500}
.mainnav a{text-decoration:none;color:var(--ink);padding:12px 0;border-bottom:2px solid transparent}
.mainnav a:hover{color:var(--brand)}
.mainnav a[aria-current=page],.mainnav a.active-section{border-color:var(--brand);color:var(--brand)}
.nav-more{position:relative;font-size:15px}
.nav-more summary{cursor:pointer;display:flex;align-items:center;gap:4px;padding:12px 0;list-style:none;font-weight:500}
.nav-more summary::-webkit-details-marker{display:none}
.nav-more[open] summary .icon{transform:rotate(180deg)}
.nav-popover{position:absolute;right:0;top:100%;width:236px;padding:12px;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-panel);box-shadow:0 16px 32px rgba(41,23,34,.12);z-index:var(--z-menu)}
.nav-popover a{display:block;padding:10px 12px;text-decoration:none;color:var(--ink);border-radius:var(--radius-control)}
.nav-popover a:hover{background:var(--tint);color:var(--brand)}
.nav-popover a[aria-current=page],.nav-popover a.active-section{color:var(--brand);font-weight:600}
.theme-switch{width:44px;height:44px;display:grid;place-items:center;background:none;border:1px solid var(--line);border-radius:50%;color:var(--brand);flex:none}
.theme-switch:hover{background:var(--tint)}
.mobile-nav{display:none}
.compact-theme{display:none}

.site-footer{padding:40px 0;background:var(--tint);font-size:14px;line-height:1.5}
.footer-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px}
.footer-grid p{margin-top:12px;max-width:52ch}
.footer-grid strong{font-size:15px}
.footer-links{display:flex;gap:12px 24px;flex-wrap:wrap;margin-top:18px}

/* ---------------------------------------------------------------- page head */
.crumbs{display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:14px;padding-top:32px;color:var(--muted)}
.crumbs a{color:inherit}
.crumbs .sep{color:var(--line)}
.page-head{padding:40px 0 48px;max-width:900px}
.page-head h1{max-width:880px}
.page-head .lede{margin-top:24px}
.page-head .meta-line{margin-top:16px}

/* ---------------------------------------------------------------- actions */
.button{display:inline-flex;gap:12px;align-items:center;justify-content:center;min-height:48px;padding:10px 20px;
  background:var(--brand);color:var(--on-brand);border:1px solid var(--brand);border-radius:var(--radius-control);
  font-weight:600;font-size:16px;text-decoration:none}
.button:hover{background:var(--brand-hover);border-color:var(--brand-hover);color:var(--on-brand)}
.button.secondary{background:transparent;color:var(--brand);border-color:var(--control-border)}
.button.secondary:hover{background:var(--tint);color:var(--brand)}
.quiet-link{display:inline-flex;align-items:center;gap:8px;font-size:15px;font-weight:600;text-decoration:none;padding:10px 0}
.quiet-link:hover{text-decoration:underline;text-underline-offset:5px}
.actions{display:flex;flex-wrap:wrap;gap:12px;margin:var(--space-6) 0}

/* ---------------------------------------------------------------- status */
.pill,.badge,.depthtag{display:inline-flex;gap:6px;align-items:center;border-radius:var(--radius-status);
  padding:4px 8px;font-size:14px;font-weight:600;line-height:1.4}
.pill .icon,.badge .icon{width:16px;height:16px}
.pill.documented,.badge.b-offered,.badge.b-documented,.badge.b-rs-reviewed{color:var(--documented);background:var(--documented-surface)}
/* Evidence depth is a separate axis. It describes how much research was done, never quality of
   care or coverage, so it never borrows the documented colour. */
.depthtag{color:var(--neutral);background:var(--neutral-surface)}
.pill.unknown,.badge.b-not_found,.badge.b-not-found-in-sources-checked,.badge.b-unknown,.badge.b-rs-draft,
.badge.b-open,.badge.b-partially-resolved{color:var(--unknown);background:var(--unknown-surface)}
.pill.conflict,.badge.b-conflicting,.badge.b-rs-held,.badge.b-not_offered,.badge.b-explicitly-not-offered{color:var(--conflict);background:var(--conflict-surface)}
.pill.neutral,.badge.b-not_applicable,.badge.b-not_researched,.badge.b-not-researched,.badge.b-not-applicable,
.badge.b-resolved,.badge.b-closed{color:var(--neutral);background:var(--neutral-surface)}
.badge{background:var(--neutral-surface);color:var(--neutral)}
.pill-row{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;margin:var(--space-4) 0}

.page-answers{margin:var(--space-5) 0 0;padding:16px 20px;border-left:3px solid var(--brand);background:var(--panel,transparent);max-width:70ch}
.page-answers p.small{margin:0 0 6px;text-transform:uppercase;letter-spacing:.04em}
.page-answers ul{margin:0;padding-left:20px}
.page-answers li{margin:4px 0;font-size:17px;line-height:1.5}
.research-depth{display:flex;gap:10px 12px;margin:var(--space-6) 0;align-items:center;flex-wrap:wrap}
.depth{display:flex;gap:10px 12px;align-items:baseline;flex-wrap:wrap;margin:var(--space-4) 0 var(--space-6)}
.depth .depthnote{font-size:15px;color:var(--muted);max-width:66ch}

/* ---------------------------------------------------------------- surfaces */
.panel,.callout,.record-example,.no-result,.answer-panel,.result-card,.tool,.total,.reviewstate,.conflict,.product,.faq .qa{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-panel);padding:24px 28px;margin:var(--space-6) 0}
.callout{background:var(--tint);border-color:var(--line)}
.panel>:last-child,.callout>:last-child,.record-example>:last-child,.answer-panel>:last-child,
.result-card>:last-child,.reviewstate>:last-child,.conflict>:last-child,.faq .qa>:last-child{margin-bottom:0}
.notice{display:flex;gap:12px;align-items:flex-start;padding:16px 20px;background:var(--tint);border-radius:8px;font-size:15px;margin:var(--space-5,20px) 0}
.notice>.icon{width:20px;height:20px;margin-top:2px;color:var(--brand);flex:none}
.notice p{margin:0}
.sponsor{max-width:var(--max);margin:0 auto var(--space-6);padding:12px 24px;border:1px dashed var(--control-border);
  border-radius:var(--radius-control);font-size:14px;color:var(--muted)}

/* cards: a bounded object that is a destination */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px;margin:var(--space-6) 0}
.card{display:block;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-panel);
  padding:24px 28px;color:var(--ink);text-decoration:none}
.card h3{margin:0 0 8px;color:var(--brand);font-size:24px}
.card p{margin:4px 0 0;font-size:16px;color:var(--muted)}
.card:hover{border-color:var(--control-border)}
.card:hover h3{text-decoration:underline;text-underline-offset:5px}
.card.static{color:var(--ink)}
.card.static h3{color:var(--ink)}
.card.static:hover{border-color:var(--line)}
.card.static:hover h3{text-decoration:none}

/* editorial rows: collections of studies and articles */
.evidence-list{margin:var(--space-6) 0;border-top:1px solid var(--line)}
.evidence-row{display:block;padding:24px 0;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink)}
.evidence-row h3{margin:0 0 6px;font-size:27px}
.evidence-row p{margin:0;font-size:16px;color:var(--muted)}
.evidence-row .row-meta{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;margin-top:10px;font-size:14px;color:var(--muted)}
.evidence-row:hover h3{color:var(--brand);text-decoration:underline;text-underline-offset:5px}

.pills{display:flex;flex-wrap:wrap;gap:8px;margin:var(--space-4) 0 var(--space-6)}
.pill-link{display:inline-block;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-control);
  padding:9px 15px;font-size:15px;color:var(--ink);text-decoration:none}
.pill-link:hover{border-color:var(--brand);color:var(--brand)}

/* ---------------------------------------------------------------- tables */
/* A grid or flex child defaults to min-width:auto, which lets a wide table stretch the whole
   page instead of scrolling inside its own region. Every layout child opts out of that. */
.province-grid>*,.article-layout>*,.split>*,.hero>*,.catalogue>*,.footer-grid>*,.journeys>*,
.result-card,.card,.panel,.callout,.record-example,.province-main,.province-summary{min-width:0}
.tablewrap{overflow-x:auto;max-width:100%;border:1px solid var(--line);border-radius:8px;margin:var(--space-6) 0;background:var(--paper)}
.conflict-grid>div,.fact-grid>div,.record-dl>div,.evidence-list>*,.pills>*{min-width:0}
/* A source URL is one long unbreakable token. It may wrap anywhere rather than widen a column. */
a{overflow-wrap:anywhere}
.tablewrap:focus-visible{outline:3px solid var(--focus)}
table{width:100%;border-collapse:collapse;font-size:16px;line-height:1.5;text-align:left}
caption{text-align:left;padding:16px;font-weight:600;font-size:15px;color:var(--ink)}
th,td{padding:14px 16px;vertical-align:top;border-bottom:1px solid var(--line)}
th{font-weight:600;background:var(--tint)}
thead th{position:relative}
tbody tr:last-child th,tbody tr:last-child td{border-bottom:none}
table.record th{width:34%;background:var(--tint);font-size:15px}
table.wide{min-width:820px}
table.compare{min-width:1180px}
table.sourcetable{min-width:820px}
table.sourcetable td{overflow-wrap:anywhere}
table td .dates{display:block;margin-top:4px}
.num{text-align:right;font-variant-numeric:tabular-nums}
.scrollnote{font-size:14px;color:var(--muted);margin:0 0 8px}

/* citations */
.cites{white-space:normal}
.cite{font-family:var(--font-mono);font-size:14px;padding:3px 4px;border-radius:var(--radius-status);text-decoration:none;
  background:var(--tint);color:var(--brand);display:inline-block;margin:1px 1px}
.cite:hover{text-decoration:underline}
.sources{margin-top:var(--space-16)}
.sources p{font-size:15px;color:var(--muted);max-width:66ch}
:target{scroll-margin-top:32px}
tr:target>td,tr:target>th{background:var(--tint)}

/* ---------------------------------------------------------------- disclosures */
.source-details{border-top:1px solid var(--line);padding-top:14px;margin-top:18px}
.source-details summary{min-height:44px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;
  font-size:15px;color:var(--brand);font-weight:600;list-style:none;gap:16px}
.source-details summary::-webkit-details-marker{display:none}
.source-details[open] summary .icon{transform:rotate(180deg)}
.source-details .details-body{padding:16px 0 4px;font-size:15px}
.source-details a{overflow-wrap:anywhere}

/* ---------------------------------------------------------------- home */
.hero{display:grid;grid-template-columns:1.4fr 1fr;gap:clamp(32px,5vw,80px);align-items:center;padding-block:88px 80px}
.hero h1{font-size:clamp(42px,5.4vw,76px);line-height:1.04;max-width:650px;letter-spacing:-.03em}
.hero .lede{margin-top:28px;max-width:41ch}
.hero .quiet-link{margin-top:18px}
.journeys{padding:28px 32px;background:var(--tint);border-radius:var(--radius-panel)}
.journeys>.small{font-weight:600;margin-bottom:10px;color:var(--brand)}
.journey{display:grid;grid-template-columns:24px 1fr 22px;gap:16px;align-items:start;padding:24px 0;color:var(--ink);text-decoration:none}
.journey+.journey{border-top:1px solid var(--line)}
.journey>.icon{color:var(--brand);margin-top:4px}
.journey h2{font-size:28px;line-height:1.2;margin:0}
.journey p{font-size:15px;color:var(--muted);line-height:1.5;margin:7px 0 0}
.journey:hover h2{text-decoration:underline;text-underline-offset:5px}
.journey .arrow{transition:transform var(--duration) var(--ease)}
.journey:hover .arrow{transform:translateX(3px)}
.section{padding-block:72px;border-top:1px solid var(--line)}
.section>h2:first-child{margin-top:0}
.section-head{max-width:690px;margin-bottom:32px}
.section-head h2{margin-top:0}
.section-head p{margin-top:16px}
.split{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start}
.split .lede{margin-top:18px}
.catalogue{display:grid;grid-template-columns:1fr 1fr;gap:0 64px}
.catalogue-link{display:flex;gap:20px;align-items:flex-start;padding:28px 0;text-decoration:none;color:var(--ink);border-bottom:1px solid var(--line)}
.catalogue-link .icon{margin-top:5px;color:var(--brand)}
.catalogue-link h3{margin:0 0 8px}
.catalogue-link p{font-size:16px;color:var(--muted);margin:0}
.catalogue-link:hover h3{color:var(--brand);text-decoration:underline;text-underline-offset:5px}
.signature{display:flex;align-items:center;gap:24px}
.signature .seal{width:72px;height:72px;background:var(--tint);border-radius:50%;display:grid;place-items:center;color:var(--brand);flex:none}
.signature .seal img{width:40px;height:40px}
.signature h2{margin:0}
.signature p{margin-top:16px}

/* ---------------------------------------------------------------- tools */
.tool{padding:0;border:0;background:none;margin:var(--space-6) 0}
.filter-panel{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) auto;gap:20px 24px;align-items:end;
  padding:28px;background:var(--tint);border-radius:var(--radius-panel);margin-bottom:24px}
.filter-panel.one-up{grid-template-columns:1fr auto}
.field label,.field>span{display:block;font-size:15px;font-weight:600;margin-bottom:8px}
select,input[type=number],input[type=text],input[type=email],textarea{width:100%;min-height:48px;border:1px solid var(--control-border);
  border-radius:var(--radius-control);background:var(--paper);color:var(--ink);padding:10px 14px;font-size:17px}
input[aria-invalid=true]{border-color:var(--conflict);border-width:2px}
.field-error{display:block;margin-top:6px;font-size:14px;font-weight:600;color:var(--conflict)}
.results-heading{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin:48px 0 24px}
.results-heading h2{margin:0}
.result-card{padding:28px 32px;margin-bottom:16px}
.result-head{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;margin-bottom:18px}
.result-head h3{font-size:30px;margin:4px 0 6px}
.result-head a{text-decoration:none}
.result-head a:hover{text-decoration:underline}
.result-head .small{max-width:47ch;margin:0}
.fact-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px 32px;margin:22px 0}
.fact-grid div{min-width:0}
.fact-grid dt,.record-dl dt{font-size:14px;color:var(--muted);font-weight:600;margin-bottom:4px}
.fact-grid dd,.record-dl dd{margin:0;font-size:16px;line-height:1.5}
.record-dl{display:grid;grid-template-columns:1fr 1fr;gap:18px 32px;margin:0}
.result-meta{display:flex;gap:8px 24px;flex-wrap:wrap;font-size:14px;color:var(--muted);margin-bottom:12px}
.no-result h3{margin:0 0 12px}
.worksheet input[type=number]{min-width:110px}
.worksheet select{min-width:150px}
.total{background:var(--tint);border-color:var(--line)}
.total h3{margin:0 0 12px;font-size:24px;font-family:var(--font-body);font-weight:600}
.tool-status{font-size:15px;margin:12px 0}

/* ---------------------------------------------------------------- ask */
/* ---- Editorial imagery (11-website-imagery) ---- */
.editorial-image{margin:0;min-width:0}
.editorial-image picture{display:block}
.editorial-image img{display:block;width:100%;max-width:100%;height:auto;aspect-ratio:3/2;object-fit:contain;object-position:50% 50%;border-radius:12px;background:var(--tint)}
.editorial-image figcaption{margin-top:10px;color:var(--muted);font-size:14px;line-height:1.5}
.editorial-support{width:100%;max-width:760px;margin:var(--space-6) 0}
/* Home hero: copy, then the three journeys, then the picture; on wide screens the picture joins the first row. */
.hero-with-picture{grid-template-columns:1fr;grid-template-areas:"copy" "journeys" "picture";gap:32px;align-items:start}
.hero-with-picture>.hero-copy{grid-area:copy;min-width:0}
.hero-with-picture>.journeys{grid-area:journeys;min-width:0}
.hero-with-picture>.editorial-hero{grid-area:picture;width:100%;max-width:760px}
.journey-row{display:grid;grid-template-columns:1fr}
.journey-row .journey+.journey{border-top:1px solid var(--line)}
@media (min-width:1100px){
  .hero-with-picture{grid-template-columns:52fr 44fr;grid-template-areas:"copy picture" "journeys journeys";column-gap:clamp(32px,4vw,56px);row-gap:40px;align-items:center}
  .hero-with-picture>.editorial-hero{max-width:600px;justify-self:end}
  .hero-with-picture .journey-row{grid-template-columns:repeat(3,1fr);column-gap:32px}
  .hero-with-picture .journey-row .journey{grid-template-columns:24px 1fr 22px;padding:8px 0 4px;border-top:0}
  .hero-with-picture .journey-row .journey+.journey{border-top:0;border-left:1px solid var(--line);padding-left:32px}
}
/* Page header with a picture beside the desktop introduction; the picture is omitted below 1100px. */
.page-head-with-picture{display:grid;grid-template-columns:1fr;max-width:none}
.page-head-with-picture>.page-head-text{max-width:900px;min-width:0}
.editorial-aside,.editorial-beside{display:none}
.beside-row{display:flow-root}
@media (min-width:1100px){
  .page-head-with-picture{grid-template-columns:minmax(0,1fr) 440px;column-gap:48px;align-items:center}
  .editorial-aside{display:block;width:440px}
  /* Beside the introduction in the body: the text keeps its own height and flows past the picture. */
  .editorial-beside{display:block;float:right;width:440px;margin:0 0 24px 48px}
  .beside-row>.panel{overflow:hidden}
}
.glance th[scope=row]{white-space:nowrap}
.glance td,.billing td{font-size:15px;line-height:1.5;vertical-align:top}
.provider-glance{margin:0 0 var(--space-6)}
.provider-glance .record-dl{margin-top:8px}
.freshness{margin:0 0 var(--space-6);color:var(--muted)}
.withheld-ref{color:var(--muted)}
.withheld-ref.evidence-row:hover h3{color:inherit;text-decoration:none}
.withheld-note{display:inline-block;margin-left:8px;font-size:14px;color:var(--muted)}
.withheld-ref.evidence-row .withheld-note{display:block;margin:8px 0 0}
.ask{margin:var(--space-6) 0}

/* ---------------------------------------------------------------- ask bar */
/* One pill-shaped field, the way a search engine does it. At rest it is a quiet paper pill
   with a hairline border. On focus a two-pixel gradient ring appears with a soft halo behind
   it, and while the reader is typing, or the engine is working, the ring sweeps. The ring is
   a real border drawn by a pseudo-element, not a shadow alone, so it also serves as the
   visible focus state; keyboard focus keeps the usual outline on the input as well.
   Colours are the brand family, with dark values below. Motion stops under
   prefers-reduced-motion through the global rule. */
@property --askbar-angle{syntax:'<angle>';inherits:false;initial-value:0deg}
.askbar{--glow-a:#54273E;--glow-b:#B5567C;--glow-c:#D8A25A;margin:0 0 16px}
:root[data-theme=dark] .askbar{--glow-a:#E7B8CC;--glow-b:#F0A3C0;--glow-c:#F2CC8F}
@media (prefers-color-scheme: dark){:root:not([data-theme=light]) .askbar{--glow-a:#E7B8CC;--glow-b:#F0A3C0;--glow-c:#F2CC8F}}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.askbar-shell{position:relative;border-radius:999px;isolation:isolate}
.askbar-shell::before,.askbar-shell::after{content:"";position:absolute;inset:-2px;border-radius:inherit;pointer-events:none;
  background:conic-gradient(from var(--askbar-angle),var(--glow-a),var(--glow-b),var(--glow-c),var(--glow-b),var(--glow-a));
  opacity:0;transition:opacity 240ms var(--ease)}
/* the ring: the gradient masked down to its outer two pixels */
.askbar-shell::before{z-index:1;padding:2px;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude}
/* the halo: the same gradient, blurred, sitting behind the field */
.askbar-shell::after{z-index:0;inset:-6px;filter:blur(18px)}
.askbar-shell:focus-within::before{opacity:1}
.askbar-shell:focus-within::after{opacity:.38}
.askbar.is-typing .askbar-shell::before,.askbar.is-busy .askbar-shell::before,
.askbar.is-typing .askbar-shell::after,.askbar.is-busy .askbar-shell::after{animation:askbar-sweep 2.4s linear infinite}
.askbar.is-busy .askbar-shell::before{opacity:1}
.askbar.is-busy .askbar-shell::after{opacity:.5}
@keyframes askbar-sweep{to{--askbar-angle:360deg}}
.askbar-field{position:relative;z-index:2;display:flex;align-items:center;gap:6px;min-height:64px;padding:8px 8px 8px 22px;
  background:var(--paper);border:1px solid var(--line);border-radius:999px;
  box-shadow:0 1px 2px rgba(41,36,41,.06),0 8px 24px -18px rgba(41,36,41,.35);transition:box-shadow 240ms var(--ease),border-color 240ms var(--ease)}
.askbar-shell:focus-within .askbar-field{border-color:transparent;box-shadow:0 2px 6px rgba(41,36,41,.08),0 18px 40px -22px rgba(84,39,62,.45)}
:root[data-theme=dark] .askbar-field{box-shadow:0 1px 2px rgba(0,0,0,.4)}
@media (prefers-color-scheme: dark){:root:not([data-theme=light]) .askbar-field{box-shadow:0 1px 2px rgba(0,0,0,.4)}}
.askbar-icon{flex:none;width:22px;height:22px;color:var(--muted);transition:color 240ms var(--ease)}
.askbar-shell:focus-within .askbar-icon{color:var(--brand)}
.askbar input[type=text]{flex:1 1 auto;min-width:0;min-height:44px;border:0;background:transparent;padding:6px 8px;font-size:19px;border-radius:999px;outline-offset:-2px}
.askbar input[type=text]::placeholder{color:var(--muted);opacity:.85}
/* the gradient ring is the focus indicator for the whole bar: a drawn 2px border, not a shadow */
.askbar input[type=text]:focus,.askbar input[type=text]:focus-visible{outline:none}
.askbar-clear{flex:none;display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border:0;border-radius:50%;
  background:transparent;color:var(--muted)}
.askbar-clear:hover{background:var(--tint);color:var(--ink)}
.askbar-clear[hidden]{display:none}
.askbar-go{position:relative;flex:none;display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:0 18px 0 22px;border:1px solid var(--brand);
  border-radius:999px;background:var(--brand);color:var(--on-brand);font-weight:600;transition:background 160ms var(--ease),transform 160ms var(--ease)}
.askbar-go:hover{background:var(--brand-hover);border-color:var(--brand-hover)}
.askbar-go:active{transform:scale(.98)}
.askbar-go:disabled{opacity:.7;cursor:progress}
.askbar-go .icon{transition:transform 160ms var(--ease)}
.askbar-go:hover .icon{transform:translateX(2px)}
@media (max-width:560px){
  .askbar-field{padding-left:16px;min-height:58px}
  .askbar input[type=text]{font-size:17px}
  .askbar-go{width:44px;height:44px;min-height:44px;padding:0;justify-content:center}
  .askbar-go span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
}
#ask-examples{align-items:center;gap:8px 10px}
#ask-examples .small{margin:0}
#ask-examples .pill-link{cursor:pointer;font-family:inherit;border:1px solid var(--line);background:var(--paper)}
#ask-examples .pill-link:hover{border-color:var(--brand);color:var(--brand)}
.ask-turn{margin-top:var(--space-8);padding-top:var(--space-6);border-top:1px solid var(--line)}
.ask-turn:first-child{border-top:0;padding-top:0}
.ask-question{font-size:16px;color:var(--muted);margin-bottom:var(--space-4)}
.ask-question .small{display:block;margin-bottom:2px}
.ask-sources-heading{font-family:var(--font-body);font-size:16px;font-weight:600;color:var(--muted);
  margin:var(--space-6) 0 var(--space-3)}
.ask-source{padding:20px 24px}
.ask-source h3{font-size:22px}
.ask .answer-panel .lede{color:var(--ink)}

/* ---------------------------------------------------------------- records */
.conflict{padding:24px 28px}
.conflict h3{margin:0 0 12px}
.conflict-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:16px 0}
.conflict-grid p{margin:4px 0}
.conflict-grid .label{font-size:14px;font-weight:600;color:var(--muted);display:block;margin-bottom:4px}
.legend{display:grid;gap:12px;margin:var(--space-6) 0}
.legend div{display:flex;gap:12px;align-items:flex-start;font-size:16px;flex-wrap:wrap}
.legend .badge{flex:none}
.seven{counter-reset:item;padding-left:24px}
.seven li{margin-top:12px}
.product{padding:24px 28px}
.product h3{margin:0 0 4px}
.product h3 small{font-family:var(--font-body);font-size:15px;color:var(--muted);font-weight:400}

/* review state */
.reviewstate{padding:20px 24px}
.reviewstate p{margin:6px 0}
.reviewstate p:first-child{margin-top:0}
.article-review{margin:20px 0 0;display:flex;gap:12px;align-items:center;flex-wrap:wrap}

/* ---------------------------------------------------------------- article */
.article-layout{display:grid;grid-template-columns:220px minmax(0,704px);gap:64px;justify-content:center;align-items:start;padding-bottom:80px}
.article-sidebar{position:sticky;top:24px;font-size:14px}
.article-sidebar strong{display:block;margin-bottom:12px}
.article-sidebar a{display:block;padding:8px 0;color:var(--muted);text-decoration:none}
.article-sidebar a:hover{color:var(--brand);text-decoration:underline}
.article-sidebar .small{margin-top:28px;padding-top:20px;border-top:1px solid var(--line)}
.article-body{min-width:0}
.article-body h2{font-size:34px;margin:48px 0 18px}
.article-body h3{margin:28px 0 12px;font-size:24px}
.article-body p{margin-bottom:18px}
.article-body .lede{color:var(--ink);font-size:23px;line-height:1.55}
.article-body a{overflow-wrap:anywhere}
.article-body .tablewrap,.article-body .sources{max-width:none}
.answer-panel{padding:28px 32px;margin-bottom:28px}
.answer-panel .small{margin-bottom:12px}
.answer-panel p:last-child{margin:0}
.article-meta{padding:20px 0;margin-bottom:24px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:14px;color:var(--muted)}
.article-meta.source-details{border-radius:0;margin-top:0}
.mobile-toc{display:none}
.faq{margin-top:var(--space-12)}
.faq .qa{padding:20px 24px;margin:12px 0}
.faq .qa h3{margin:0 0 6px;font-size:21px;font-family:var(--font-body);font-weight:600}
.faq .qa p{margin:0}

/* ---------------------------------------------------------------- jurisdiction */
.province-grid{display:grid;grid-template-columns:1.65fr 1fr;gap:48px;padding-bottom:72px;align-items:start}
.province-summary{background:var(--tint);padding:28px 32px;border-radius:var(--radius-panel);position:sticky;top:24px}
.province-summary h2{font-size:30px;margin:0 0 20px}
.province-summary p{font-size:16px}
.province-summary .record-dl+p{margin-top:24px}
.province-main>h2:first-child{margin-top:0}

/* ---------------------------------------------------------------- responsive */
@media (min-width:1440px){.hero{padding-top:104px;padding-bottom:96px}}
@media (max-width:1190px){
  .masthead-inner{gap:24px}
  .brand-link{width:244px}
  .mainnav{gap:16px}
  .mainnav a,.nav-more{font-size:14px}
}
@media (max-width:1100px){
  .mainnav{display:none}
  .masthead-inner{min-height:88px;gap:16px}
  .theme-switch{margin-left:auto}
  .mobile-nav{display:block;position:relative}
  .mobile-nav summary{list-style:none;display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;font-size:15px;cursor:pointer;font-weight:500}
  .mobile-nav summary::-webkit-details-marker{display:none}
  .mobile-nav .nav-popover{right:0;width:264px;max-height:70vh;overflow-y:auto}
  .nav-popover a{font-size:16px}
  .hero{grid-template-columns:1.1fr 1fr;gap:32px}
  .journeys{padding:24px}
  .split{gap:40px}
  .article-layout{grid-template-columns:180px minmax(0,1fr);gap:40px}
  .province-grid{grid-template-columns:1fr;gap:32px}
  .province-summary{position:static}
  .filter-panel{grid-template-columns:1fr 1fr;gap:16px 20px}
}
@media (max-width:760px){
  .shell{width:calc(100% - 40px)}
  .preview-bar .shell{font-size:12px;gap:8px}
  .preview-bar .detail{display:none}
  .masthead-inner{min-height:80px;gap:12px}
  .brand-link{width:218px}
  .theme-switch{width:44px;height:44px;border:0}
  .theme-switch .icon{width:20px;height:20px}
  .mobile-nav summary{width:44px}
  .mobile-nav summary span{display:none}
  .hero{grid-template-columns:1fr;padding-block:48px;gap:32px}
  .hero h1{font-size:clamp(42px,8.5vw,62px);max-width:600px;line-height:1.05}
  .hero .lede{font-size:19px;margin-top:22px}
  .kicker,.eyebrow{font-size:12px;margin-bottom:16px}
  .journeys{padding:20px 24px}
  .journey{padding:20px 0;gap:14px}
  .journey h2{font-size:27px}
  .section{padding-block:48px}
  .split,.catalogue,.footer-grid{grid-template-columns:1fr;gap:32px}
  .catalogue{gap:0}
  .catalogue-link{padding:24px 0}
  .page-head{padding:28px 0 32px}
  .page-head h1{font-size:40px}
  .page-head .lede{font-size:19px;margin-top:20px}
  .crumbs{padding-top:24px}
  .filter-panel{grid-template-columns:1fr;padding:24px;gap:16px}
  .filter-panel .button{width:100%}
  .result-card,.panel,.callout,.record-example,.answer-panel,.tool,.total,.reviewstate,.conflict,.product,.no-result,.card{padding:20px 24px}
  .result-head{flex-direction:column;gap:12px}
  .result-head h3{font-size:29px}
  .result-head .pill{order:-1}
  .fact-grid,.record-dl,.conflict-grid{grid-template-columns:1fr;gap:20px}
  .results-heading{align-items:flex-start;flex-direction:column;gap:8px;margin-top:36px}
  .results-heading h2{font-size:30px}
  .article-layout{grid-template-columns:1fr;gap:24px}
  .article-sidebar{display:none}
  .mobile-toc{display:block;margin-block:24px}
  .mobile-toc nav a{display:block;padding:10px 0;font-size:15px}
  .article-body .lede{font-size:21px}
  .article-body h2{font-size:30px}
  .signature{align-items:flex-start;gap:20px;flex-direction:column}
  .signature .seal{width:56px;height:56px}
  .signature h2{font-size:28px}
  .site-footer{padding-block:32px}
  .province-summary{padding:24px}
  .tablewrap{border-radius:6px}
  th,td{padding:12px}
  main h2{margin-top:var(--space-10)}
  .worksheet input[type=number],.worksheet select{min-width:0}
}
@media (max-width:380px){
  .brand-link{width:196px}
  .masthead-inner{gap:8px}
  .masthead-inner>.theme-switch{display:none}
  .mobile-nav{margin-left:auto}
  .compact-theme{display:flex;margin:8px 0;width:100%}
  .hero h1{font-size:40px}
  .page-head h1{font-size:34px}
}

/* ---------------------------------------------------------------- motion */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition:none !important;animation:none !important}
  .journey:hover .arrow{transform:none}
}

/* ---------------------------------------------------------------- print */
@media print{
  .preview-bar,.masthead,.theme-switch,.mobile-nav,.article-sidebar,.mobile-toc,.sponsor,.skip,.tool button,.crumbs{display:none}
  .shell{width:100%;max-width:none}
  body{font-size:11pt;background:#fff;color:#000}
  a{color:#000;text-decoration:underline}
  .article-layout{display:block}
  .article-body{max-width:none}
  .page-head{padding-top:0}
  .tablewrap{overflow:visible;border:1px solid #999}
  table.wide,table.compare,table.sourcetable{min-width:0}
  details{display:block}
  details>summary{list-style:none}
  details .details-body{display:block !important}
  h2,h3{break-after:avoid}
  .result-card,.conflict,.product{break-inside:avoid;border:1px solid #999}
  .panel,.callout,.card,.answer-panel,.reviewstate,.total{border:1px solid #999;background:none}
  .pill,.badge,.depthtag{border:1px solid #666;background:none !important;color:#000 !important}
  .site-footer{background:none;border-top:1px solid #999}
  .section{padding:20px 0;border-top:1px solid #999}
}

[hidden]{display:none !important}

/* Contact forms: a stacked single-column form, not the filter bar's inline grid. */
.contact-form{display:grid;grid-template-columns:1fr 1fr;gap:18px 20px;align-items:start}
.contact-form .field.full{grid-column:1/-1}
.contact-form textarea{min-height:150px;resize:vertical;line-height:1.5}
.contact-form .form-foot{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between}
.contact-form .form-foot .button{width:auto;min-width:160px}
@media (max-width:760px){.contact-form{grid-template-columns:1fr}.contact-form .form-foot .button{width:100%}}

/* ---- private admin page (/admin, behind Cloudflare Access) ---- */
.admin-wrap{max-width:var(--max);margin:0 auto;padding:24px 16px 64px}
.admin-top{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:end;justify-content:space-between;margin-bottom:8px}
.admin-top h1{margin:0}
.admin-controls{display:flex;gap:12px;align-items:end;flex-wrap:wrap}
.admin-controls select{min-height:48px}
.admin-stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px;margin:24px 0}
.admin-stat{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-panel);padding:16px}
.admin-stat-value{font-family:var(--font-display);font-size:34px;line-height:1.1;color:var(--brand)}
.admin-stat-label{font-weight:600;margin-top:4px}
.admin-stat-note{font-size:14px;color:var(--muted)}
.admin-section{margin:40px 0 0}
.admin-section h3{margin-top:24px}
.admin-chart{margin:12px 0 0;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-panel);padding:12px}
.admin-chart svg{width:100%;height:auto;display:block}
.admin-chart .bar-view{fill:var(--brand)}
.admin-chart .bar-crawl{fill:var(--line)}
.admin-chart .key{display:inline-block;width:12px;height:12px;border-radius:3px;margin:0 4px 0 12px;vertical-align:middle}
.admin-chart .key-view{background:var(--brand)}
.admin-chart .key-crawl{background:var(--line)}
.admin-two{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.admin-q{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-control);padding:10px 14px;margin:8px 0}
.admin-q summary{cursor:pointer}
.admin-q p{margin:8px 0 0}
.admin-builder input[readonly]{background:var(--tint)}