:root{color-scheme:dark;--background:#06122b;--surface:#101e38;--raised:#152640;--text:#f3f7ff;--muted:#b8c3e3;--cyan:#26e6ff;--lavender:#b9a7ff;--line:#50617d;--button-ink:#06122b;--shadow:0 24px 70px #0003;--scale:100%;font-size:var(--scale)}
@media(prefers-color-scheme:light){:root:not([data-theme="dark"]){color-scheme:light;--background:#f4f7ff;--surface:#fff;--raised:#e9effa;--text:#10213a;--muted:#465571;--cyan:#006779;--lavender:#6242ae;--line:#8391aa;--button-ink:#fff;--shadow:0 24px 70px #1231}}
:root[data-theme="light"]{color-scheme:light;--background:#f4f7ff;--surface:#fff;--raised:#e9effa;--text:#10213a;--muted:#465571;--cyan:#006779;--lavender:#6242ae;--line:#8391aa;--button-ink:#fff;--shadow:0 24px 70px #1231}
:root[data-contrast="true"]{--background:#000;--surface:#000;--raised:#101010;--text:#fff;--muted:#fff;--cyan:#6ff3ff;--lavender:#dacfff;--line:#fff;--button-ink:#000}
:root[data-theme="light"][data-contrast="true"]{--background:#fff;--surface:#fff;--raised:#fff;--text:#000;--muted:#000;--cyan:#004457;--lavender:#412078;--line:#000;--button-ink:#fff}
*{box-sizing:border-box}
body{margin:0;background:var(--background);color:var(--text);font-family:system-ui,-apple-system,"Segoe UI",Roboto,Inter,Arial,sans-serif;font-size:1rem;line-height:1.7}
a{color:var(--cyan);text-underline-offset:.25em;text-decoration-thickness:.08em}
a:hover{text-decoration-thickness:.15em}
button{font:inherit;cursor:pointer}
button,a{touch-action:manipulation}
button,.button,.chip{min-height:44px}
button{color:var(--text);background:var(--raised);border:1px solid var(--line);border-radius:.6rem;padding:.55rem .85rem}
button[aria-pressed="true"]{background:var(--cyan);color:var(--button-ink);border-color:var(--cyan)}
button:disabled{cursor:default;border-style:dashed}
:focus-visible{outline:3px solid var(--cyan);outline-offset:5px}
[tabindex="-1"]:focus{outline:3px solid var(--cyan);outline-offset:7px}
h1,h2,h3,p{margin-top:0}
h1,h2,h3{line-height:1.16;letter-spacing:-.035em;text-wrap:balance}
h1{font-size:clamp(2.2rem,5.4vw,4.7rem);font-weight:700;margin-bottom:1.8rem}
h2{font-size:clamp(1.6rem,3vw,2.6rem);font-weight:650}
h3{font-size:1.25rem;letter-spacing:-.015em}
p{max-width:72ch;margin-bottom:1rem}
small{font-size:.875rem}
.container{width:min(100% - 3rem,76rem);margin-inline:auto}
.skip{position:absolute;left:1rem;top:1rem;transform:translateY(-180%);z-index:10;padding:.75rem 1rem;background:var(--surface)}
.skip:focus{transform:none}
header{border-bottom:1px solid var(--line)}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-block:1.4rem;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:.8rem;color:var(--text);text-decoration:none;min-height:44px}
.brand-symbol{width:2.5rem;height:2.5rem;border:1px solid var(--cyan);border-radius:50%;display:grid;place-items:center;color:var(--cyan);font-size:1.5rem}
.brand-name{font-size:1.4rem;font-weight:700;letter-spacing:-.05em}
.brand small{display:block;line-height:1.3;font-size:.65rem;letter-spacing:.14em;color:var(--muted)}
nav{display:flex;gap:1.4rem;flex-wrap:wrap}
nav a{display:inline-flex;align-items:center;min-height:44px;font-size:.9rem;color:var(--text)}
.eyebrow{font-size:.75rem;letter-spacing:.16em;text-transform:uppercase;font-weight:650;color:var(--cyan);margin-bottom:1.6rem}
.eyebrow::before{content:"";display:inline-block;width:.45rem;height:.45rem;background:currentColor;border-radius:50%;margin-right:.65rem}
.hero{position:relative;padding-block:5.5rem 3.5rem}
.hero-grid{display:grid;grid-template-columns:1.2fr 1fr;align-items:center;gap:2.5rem}
.hero h1 span{color:var(--lavender)}
.lead{font-size:1.15rem;color:var(--muted);max-width:49ch}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:1rem;margin-top:2rem}
.button{display:inline-flex;justify-content:center;align-items:center;gap:1rem;padding:.8rem 1.2rem;border:1px solid var(--line);border-radius:.6rem;text-decoration:none;font-weight:600}
.button.primary{background:var(--cyan);border-color:var(--cyan);color:var(--button-ink)}
.button.secondary{color:var(--text)}
.art{position:relative;isolation:isolate;aspect-ratio:1;display:grid;place-items:center}
.art::before{content:"";position:absolute;inset:4%;z-index:-1;background:radial-gradient(ellipse at 25% 65%,#26e6ff26,transparent 60%),radial-gradient(ellipse at 75% 30%,#b9a7ff35,transparent 65%);filter:blur(25px);border-radius:50%}
.art svg{width:100%;height:auto;color:var(--cyan)}
.art-caption{text-align:center;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.section-rule{border-top:1px solid var(--line)}
.preferences{padding:1.7rem;border:1px solid var(--line);border-radius:1rem;background:var(--surface);margin-block:1rem 4rem}
.preferences h2{font-size:1.25rem;margin-bottom:.5rem}
.muted{color:var(--muted)}
.preferences p{font-size:.9rem}
.preference-grid{display:flex;flex-wrap:wrap;gap:1.3rem 2rem}
fieldset{margin:0;padding:0;border:0;min-width:0}
legend{font-weight:600;font-size:.85rem;margin-bottom:.6rem}
.control-row{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}
#font-value{min-width:3.5rem;text-align:center}
.status{margin:1rem 0 0;min-height:1.7em;font-size:.85rem;color:var(--muted)}
.intro-band{display:grid;grid-template-columns:1fr 1.25fr;gap:3rem;padding-block:3rem 4rem}
.intro-band p{color:var(--muted);font-size:1.1rem}
.values{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-block:1.5rem}
.value{border-top:2px solid var(--lavender);padding:1.3rem 0}
.value h3{font-size:1.1rem}
.value p{font-size:.95rem;color:var(--muted)}
.note{padding:1rem 1.3rem;border-left:3px solid var(--lavender);background:var(--surface);color:var(--muted);max-width:none}
.section-heading{display:flex;justify-content:space-between;gap:2rem;align-items:end;margin-bottom:2rem}
.section-heading p{max-width:43ch;color:var(--muted)}
.topics{padding-block:4rem 2rem}
.chips{display:flex;gap:.6rem;flex-wrap:wrap;margin:1.5rem 0 3rem}
.chip{display:inline-flex;align-items:center;gap:.7rem;border:1px solid var(--line);padding:.6rem .9rem;border-radius:2rem;text-decoration:none;color:var(--text);font-size:.9rem;background:var(--surface)}
.chip span{color:var(--cyan);font-size:.75rem}
.curriculum{list-style:none;margin:0;padding:0;display:grid;gap:1.4rem}
.topic{display:grid;grid-template-columns:4.5rem 1.1fr 1fr;gap:1.8rem;padding:2rem;border:1px solid var(--line);border-radius:1rem;background:linear-gradient(135deg,#ffffff08,transparent);box-shadow:var(--shadow);scroll-margin-top:1.5rem}
.number{font-size:2.5rem;font-weight:300;line-height:1.2;color:var(--lavender);letter-spacing:-.06em}
.topic h3{font-size:1.5rem}
.topic-copy,.tool-card{background:var(--surface);border-radius:.65rem;padding:1.3rem}
.topic-copy p{color:var(--muted);margin-bottom:0}
.tool-card{border:1px solid var(--line)}
.tool-card h4{font-size:.75rem;text-transform:uppercase;letter-spacing:.12em;color:var(--cyan);margin:0 0 1rem}
.tool-card ul{padding-left:1.2rem;margin:0}
.tool-card li+li{margin-top:.6rem}
.tool-card p{margin:1rem 0 0;font-size:.9rem;color:var(--muted)}
.start{padding-block:5rem}
.steps{list-style:none;padding:0;margin:2rem 0;display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;counter-reset:step}
.steps li{padding:1.7rem;background:var(--surface);border:1px solid var(--line);border-radius:.8rem;counter-increment:step}
.steps li::before{content:"0" counter(step);display:block;color:var(--cyan);margin-bottom:1.5rem;font-size:.85rem}
.steps p{color:var(--muted)}
.closing{position:relative;padding:3rem;border:1px solid var(--line);border-radius:1.2rem;background:var(--surface);margin-bottom:4rem}
.closing h2{max-width:22ch}
.closing p{color:var(--muted)}
.accessibility{padding-block:2rem;border-top:1px solid var(--line)}
.accessibility h2{font-size:1.15rem}
.accessibility p{font-size:.9rem;color:var(--muted)}
footer{border-top:1px solid var(--line);padding-block:2rem}
.footer-inner{display:flex;justify-content:space-between;gap:2rem;flex-wrap:wrap}
footer p{font-size:.85rem;color:var(--muted);max-width:58ch;margin:.8rem 0}
footer nav a{color:var(--cyan)}
[data-spacing="true"] body{line-height:1.95;letter-spacing:.025em;word-spacing:.08em}
[data-spacing="true"] p{margin-bottom:1.6rem}
[data-spacing="true"] h1,[data-spacing="true"] h2,[data-spacing="true"] h3{line-height:1.35;letter-spacing:.015em}
@media(max-width:950px){.hero-grid{grid-template-columns:1fr}.hero{padding-top:3rem}.art{max-width:26rem;margin:auto;width:100%}.intro-band{grid-template-columns:1fr;gap:1rem}.topic{grid-template-columns:3rem 1fr;gap:1rem}.tool-card{grid-column:2}.values{grid-template-columns:repeat(2,1fr)}.steps{grid-template-columns:1fr}.section-heading{display:block}}
@media(max-width:550px){.container{width:calc(100% - 2rem)}nav{gap:.9rem}.header-inner{padding-block:1rem}.hero{padding-bottom:2rem}.preferences{padding:1rem}.topic{display:block;padding:1rem}.number{margin-bottom:1rem}.topic-copy{padding:1rem;margin-bottom:1rem}.tool-card{padding:1rem}.values{grid-template-columns:1fr}.closing{padding:1.5rem}.actions{align-items:stretch;flex-direction:column}.art{max-width:22rem}.start{padding-block:3rem}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
[data-motion="true"] *,[data-motion="true"] *::before,[data-motion="true"] *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
@media(forced-colors:active){.art::before{display:none}.topic,.preferences,.closing,.steps li,.tool-card,.chip,.button,button{border:1px solid CanvasText}.number,.eyebrow,.tool-card h4{color:CanvasText}button[aria-pressed="true"]{outline:2px solid Highlight}.art svg{color:CanvasText}:focus-visible{outline-color:Highlight}}
@media print{:root{--background:#fff;--surface:#fff;--raised:#fff;--text:#000;--muted:#222;--cyan:#000;--lavender:#222;--line:#888;font-size:100%!important}body{font-size:11pt}.container{width:100%}.skip,header nav,.preferences,.art,.art-caption,.actions,.chips,footer nav{display:none!important}.hero,.start,.topics,.intro-band{padding-block:1rem}.hero-grid,.intro-band,.topic,.steps,.values{display:block}.topic,.steps li,.value{break-inside:avoid;box-shadow:none;margin-bottom:1rem}.topic{padding:1rem}.number{font-size:1.3rem}.topic-copy,.tool-card{padding:.6rem}.closing{padding:1rem;margin-bottom:1rem}a{color:#000;text-decoration:underline}h1{font-size:30pt}h2{font-size:22pt}.section-heading{display:block}}

/* ---- Topic pages ---- */
.page-hero{padding-block:3.5rem 2rem}
.breadcrumb{font-size:.85rem;color:var(--muted);margin-bottom:1.5rem}
.breadcrumb a{color:var(--text)}
.page-hero h1{font-size:clamp(2rem,4.6vw,3.6rem);margin-bottom:1.2rem}
.page-hero .number{display:block;font-size:1.1rem;margin-bottom:.4rem}
details.preferences{padding:0}
details.preferences>summary{cursor:pointer;padding:1.1rem 1.7rem;font-weight:600;min-height:44px;list-style-position:inside}
details.preferences[open]>summary{border-bottom:1px solid var(--line)}
details.preferences .preferences-body{padding:1.3rem 1.7rem}
.page-section{padding-block:2.5rem;border-top:1px solid var(--line)}
.page-section>h2{margin-bottom:1rem}
.page-section>p{color:var(--muted)}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:1rem;margin-top:1.5rem}
.cards .value p{margin-bottom:0}
.tool-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1.5rem}
.tool-grid .tool-card ul{margin-bottom:0}
.checklist{padding-left:1.2rem;max-width:72ch}
.checklist li{margin-bottom:.6rem}
.checklist li::marker{color:var(--cyan)}
.helpers{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:1rem;margin-top:1.5rem}
.helper{padding:1.2rem;background:var(--surface);border:1px solid var(--line);border-radius:.8rem}
.helper h3{font-size:1.05rem;margin-bottom:.4rem}
.helper p{color:var(--muted);font-size:.95rem;margin:0}
.pager{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding-block:2.5rem;border-top:1px solid var(--line)}
.pager a{display:flex;flex-direction:column;min-height:44px;padding:1rem 1.2rem;border:1px solid var(--line);border-radius:.8rem;background:var(--surface);text-decoration:none;color:var(--text);flex:1 1 16rem}
.pager a.next{text-align:right}
.pager small{color:var(--muted);letter-spacing:.1em;text-transform:uppercase;font-size:.7rem}
.read-more{display:inline-block;margin-top:1rem;font-weight:600}
@media(max-width:950px){.tool-grid{grid-template-columns:1fr}}
@media(max-width:550px){details.preferences>summary,details.preferences .preferences-body{padding-inline:1rem}.page-hero{padding-top:2rem}}
@media(forced-colors:active){.helper,.pager a{border:1px solid CanvasText}}
@media print{details.preferences,.pager,.breadcrumb{display:none!important}.tool-grid,.cards,.helpers{display:block}.helper,.tool-card{margin-bottom:.8rem;break-inside:avoid}}

/* ---- Logo images ---- */
.brand-icon{width:3rem;height:3rem;border-radius:.7rem;flex:none}
.print-logo{display:none}
.footer-brand{display:flex;gap:1.2rem;align-items:flex-start}
.footer-badge{width:5.5rem;height:auto;flex:none}
@media(max-width:550px){.footer-badge{width:4.5rem}}
@media print{.brand-icon,.brand>span{display:none!important}.print-logo{display:block;width:16rem;height:auto}.footer-badge{display:none}}

/* ---- Footer notes ---- */
.footer-notes{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,26rem),1fr));gap:1rem;margin-top:2rem;padding-top:2rem;border-top:1px solid var(--line)}
.footer-note{padding:1rem 1.1rem;background:var(--surface);border:1px solid var(--line);border-radius:.7rem}
.footer-note h2{font-size:.9rem;letter-spacing:0;margin-bottom:.4rem}
footer .footer-note p{font-size:.8rem;max-width:none;margin:0;line-height:1.6}
.footer-note-medical,.footer-note-urgent{border-left:4px solid var(--lavender)}
.footer-note-medical,.footer-note-urgent{grid-column:1/-1}
.footer-note-medical p{font-size:.875rem!important}
footer .footer-legal{margin-top:1.5rem;font-size:.8rem;max-width:none}
@media(forced-colors:active){.footer-note{border:1px solid CanvasText}}
@media print{.footer-notes{display:block}.footer-note{margin-bottom:.6rem;break-inside:avoid}}
