/* Wearable Health AI palette: navy ground, cream type, one amber accent, slate for secondary. Green and red stay reserved and are not used here. */
:root{
  box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);
  --navy:#0F1A2B; --amber:#B45309; --cream:#F4EFE6; --slate:#96A6BA; --warm-white:#FFF7F0; --amber-shade:#784A1E;
  --bg:#F4EFE6; --surface:#FFF7F0; --ink:#0F1A2B; --muted:#46546A; --line:#DCD2C0;
  --hero-bg:#0F1A2B; --on-navy:#F4EFE6;
  --accent:#B45309; --accent-soft:#F3DFC8; --tint:#EAE2D3;
  --strong:#0F1A2B; --quiet:#5B6B80; --quiet-soft:#E3E5E6;
  --display:"IBM Plex Sans","Segoe UI",system-ui,sans-serif;
  --body:"IBM Plex Sans","Segoe UI",system-ui,sans-serif;
  --cond:"IBM Plex Sans Condensed","Arial Narrow","IBM Plex Sans",sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  --serif:"IBM Plex Serif",Georgia,serif;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#0F1A2B; --surface:#17253A; --ink:#F4EFE6; --muted:#96A6BA; --line:#2A3A52;
  --hero-bg:#0A121E; --accent:#E4863A; --accent-soft:#3A2A1C; --tint:#1B2A40;
  --strong:#F4EFE6; --quiet:#96A6BA; --quiet-soft:#1B2A40; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#0F1A2B; --surface:#17253A; --ink:#F4EFE6; --muted:#96A6BA; --line:#2A3A52;
  --hero-bg:#0A121E; --accent:#E4863A; --accent-soft:#3A2A1C; --tint:#1B2A40;
  --strong:#F4EFE6; --quiet:#96A6BA; --quiet-soft:#1B2A40; color-scheme:dark}

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:env(safe-area-inset-top,0px)}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body);font-size:18px;line-height:1.6}
img,svg{max-width:100%}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:4px}
[hidden]{display:none!important}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* site bar */
.sitebar{background:#0F1A2B;color:var(--on-navy)}
.sitebar .in{max-width:1240px;margin:0 auto;padding:18px 28px;display:flex;gap:10px 30px;align-items:center;flex-wrap:wrap}
.brand{font-family:var(--cond);font-weight:700;font-size:1.3rem;letter-spacing:.01em;color:var(--on-navy);text-decoration:none;white-space:nowrap}
.brand span{color:var(--slate);font-weight:500}
.sitenav{display:flex;gap:4px 26px;flex-wrap:wrap;margin-left:auto;align-items:center}
.sitenav a{color:var(--on-navy);text-decoration:none;font-size:.98rem;font-weight:500;padding:4px 0;opacity:.82}
.sitenav a:hover{opacity:1}
.sitenav a.sub{opacity:1;border:1px solid var(--slate);border-radius:999px;padding:7px 18px}
.sitenav a.sub:hover{border-color:var(--on-navy)}
@media (max-width:700px){.sitenav{margin-left:0;gap:2px 18px}.sitenav a{font-size:.92rem}}

.wide{max-width:1240px;margin:0 auto;padding-inline:28px}
.h-xl,.h-l,.h-m{font-family:var(--cond);font-weight:600;line-height:1;letter-spacing:-.012em;margin:0;text-wrap:balance}
.h-xl{font-size:clamp(2.9rem,6.6vw,5.6rem)}
.h-l{font-size:clamp(2.3rem,4.8vw,3.9rem)}
.h-m{font-size:clamp(1.6rem,2.6vw,2.1rem);line-height:1.08}
.dek{font-size:1.2rem;line-height:1.55;max-width:52ch;margin:0}
.btn-a,.btn-b{display:inline-block;font-weight:600;text-decoration:none;padding:15px 26px;border-radius:999px;font-size:1.02rem}
.btn-a{background:var(--amber);color:var(--warm-white)}
.btn-a:hover{background:#9A4707}
.btn-b{color:var(--on-navy);border:1px solid var(--slate);padding:14px 26px}
.btn-b:hover{border-color:var(--on-navy)}
.acts{display:flex;gap:12px;flex-wrap:wrap}

/* hero: the cutout stands in front of the rhythm line */
.hero-x{background:#0F1A2B;color:var(--on-navy);position:relative;overflow:hidden}
.hero-x .wide{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:20px;align-items:end;position:relative;min-height:min(78vh,720px)}
.hero-copy{padding:70px 0 180px;display:grid;gap:28px;align-self:center;position:relative;z-index:3}
.hero-copy h1 span{color:var(--slate);white-space:nowrap}
.hero-fig{position:relative;z-index:2;align-self:end;justify-self:end;width:100%;max-width:450px;height:auto;display:block;margin:48px 0 -4px}
.hero-line{position:absolute;left:0;right:0;bottom:22px;width:100%;height:110px;z-index:1}
.creds{background:#0F1A2B;color:var(--on-navy);border-top:1px solid #24344D;position:relative;z-index:4}
.creds .wide{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}
.creds div{padding:22px 24px 24px 0;display:grid;gap:2px}
.creds div+div{padding-left:24px;border-left:1px solid #24344D}
.creds b{font-family:var(--cond);font-weight:600;font-size:1.35rem;letter-spacing:.005em}
.creds span{color:var(--slate);font-size:.92rem;line-height:1.4}
@media (max-width:900px){
  .hero-x .wide{grid-template-columns:1fr;min-height:0}
  .hero-copy{padding:44px 0 8px}
  .hero-fig{max-width:300px;justify-self:center;margin-top:28px}
  .hero-line{bottom:40px;height:90px}
  .creds .wide{grid-template-columns:repeat(2,minmax(0,1fr))}
  .creds div{padding:16px 16px 16px 0;border-top:1px solid #24344D}
  .creds div:nth-child(-n+2){border-top:0}
  .creds div+div{padding-left:16px}
  .creds div:nth-child(3){padding-left:0;border-left:0}
}

.sec{padding-top:104px}
.sec-head{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,5fr);gap:16px 56px;align-items:end;margin-bottom:40px}
.sec-head .dek{color:var(--muted);font-size:1.1rem}
@media (max-width:820px){.sec{padding-top:72px}.sec-head{grid-template-columns:1fr}}

/* topic tiles */
.tiles{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);grid-template-rows:1fr 1fr;gap:18px}
.tile{position:relative;display:grid;align-content:end;gap:10px;padding:32px;border-radius:14px;text-decoration:none;color:var(--ink);background:var(--surface);border:1px solid var(--line);overflow:hidden;min-height:250px}
.tile.big{grid-row:1 / span 2;background:#0F1A2B;color:#F4EFE6;border-color:#0F1A2B;min-height:520px;padding:40px}
.tile h3{font-family:var(--cond);font-weight:600;font-size:clamp(1.9rem,3vw,2.6rem);line-height:1;margin:0;letter-spacing:-.01em}
.tile.big h3{font-size:clamp(2.6rem,5vw,4.4rem)}
.tile p{margin:0;max-width:40ch;color:var(--muted)}
.tile.big p{color:#C3CCD8;font-size:1.1rem}
.tile .go{font-weight:600;margin-top:6px;text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1.5px}
.tile:hover .go{text-decoration-thickness:3px}
.tile svg.art{position:absolute;pointer-events:none}
.tile.big svg.art{top:36px;right:36px;width:min(36%,220px);height:auto}
.tile.sm svg.art{top:22px;right:24px;width:110px;height:auto}
.tile .kind{font-family:var(--mono);font-size:.82rem;color:var(--muted);position:absolute;top:30px;left:32px}
.tile.big .kind{color:var(--slate);top:40px;left:40px}
@media (max-width:820px){.tiles{grid-template-columns:1fr;grid-template-rows:none}.tile.big{grid-row:auto;min-height:420px;padding:28px}.tile.big .kind{top:28px;left:28px}.tile.sm svg.art{width:64px}.tile.big svg.art{width:110px;top:26px;right:26px}}

/* point of view */
.pov{margin-top:104px;background:var(--tint)}
.pov .wide{padding-block:96px;display:grid;grid-template-columns:minmax(0,1fr);gap:26px}
.pov blockquote{margin:0;font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(1.7rem,3.7vw,3.1rem);line-height:1.22;max-width:24em;text-wrap:balance}
.pov cite{font-style:normal;color:var(--muted);font-size:1rem}

/* newsletter */
.nl{background:#0F1A2B;color:#F4EFE6}
.nl .wide{padding-block:96px;display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:40px 72px;align-items:center}
.nl .label{font-family:var(--mono);font-size:.9rem;color:var(--slate);margin:0 0 14px}
.nl .dek{color:#C3CCD8;margin-top:22px}
.nl .acts{margin-top:30px}
.nl ul{list-style:none;margin:0;padding:0}
.nl li{padding:20px 0;border-top:1px solid #2A3A52;font-family:var(--cond);font-weight:500;font-size:1.5rem;line-height:1.15}
.nl li:last-child{border-bottom:1px solid #2A3A52}
@media (max-width:820px){.nl .wide{grid-template-columns:1fr;padding-block:72px}.pov .wide{padding-block:72px}.pov{margin-top:72px}}

/* care */
.treat{margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 56px;border-bottom:1px solid var(--line)}
@media (max-width:760px){.treat{grid-template-columns:1fr}}
.treat div{padding:20px 0;border-top:1px solid var(--line)}
.treat dt{font-family:var(--cond);font-weight:600;font-size:1.5rem;line-height:1.1}
.treat dd{margin:6px 0 0;color:var(--muted)}
.treat a{color:var(--accent);font-weight:600}
.af{margin-top:72px;display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:24px 56px}
.af .dek{color:var(--muted);font-size:1.05rem;margin-top:14px}
@media (max-width:820px){.af{grid-template-columns:1fr}}
.steps{list-style:none;margin:0;padding:0;counter-reset:s}
.steps li{counter-increment:s;display:grid;grid-template-columns:3.4rem minmax(0,1fr);padding:18px 0;border-top:1px solid var(--line)}
.steps li::before{content:counter(s);font-family:var(--mono);font-weight:600;font-size:1.5rem;line-height:1.2;color:var(--accent)}
.steps h3{margin:0;font-family:var(--cond);font-weight:600;font-size:1.4rem;line-height:1.1}
.steps p{margin:6px 0 0;color:var(--muted);max-width:64ch}

/* about */
.about{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:36px 64px;align-items:start}
@media (max-width:820px){.about{grid-template-columns:1fr}}
.about img{display:block;width:100%;height:auto;border-radius:14px;max-width:420px}
.about p{margin:0 0 16px;max-width:60ch;font-size:1.1rem}
.time{list-style:none;margin:28px 0 0;padding:0}
.time li{display:grid;grid-template-columns:4.4rem minmax(0,1fr);gap:0 10px;padding:13px 0;border-top:1px solid var(--line)}
.time b{font-family:var(--mono);font-weight:600;font-variant-numeric:tabular-nums}
.time span{color:var(--muted)}
.time strong{color:var(--ink);display:block}
.pubs{margin-top:28px;display:grid;gap:10px}
.pubs details{background:var(--surface);border:1px solid var(--line);border-radius:10px}
.pubs summary{cursor:pointer;padding:16px 20px;font-weight:600;display:flex;justify-content:space-between;gap:12px;list-style:none}
.pubs summary::-webkit-details-marker{display:none}
.pubs summary::after{content:"+";font-family:var(--mono);color:var(--accent)}
.pubs details[open] summary::after{content:"\2212"}
.pubs summary small{font-family:var(--mono);font-weight:500;color:var(--muted);margin-left:auto}
.pubs ol{margin:0;padding:0 20px 20px 2.8em;display:grid;gap:10px;font-size:.96rem}

/* contact */
.call{margin-top:104px;background:var(--tint)}
.call .wide{padding-block:88px;display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:40px 72px}
@media (max-width:820px){.call .wide{grid-template-columns:1fr;padding-block:64px}.call{margin-top:72px}}
.phone{display:block;font-family:var(--cond);font-weight:600;font-size:clamp(3.2rem,8vw,6.2rem);line-height:1;color:var(--ink);text-decoration:none;letter-spacing:-.01em;margin-top:18px;white-space:nowrap}
.phone:hover{color:var(--accent)}
.call p{margin:10px 0 0}
.call a{color:var(--accent)}
.call a.phone{color:var(--ink)}
.faq{display:grid;gap:0;align-content:start}
.faq div{padding:18px 0;border-top:1px solid var(--line)}
.faq h3{margin:0;font-size:1.1rem}
.faq p{margin:4px 0 0;color:var(--muted)}
.urgent{margin-top:26px;border-left:4px solid var(--accent);padding:4px 0 4px 16px;max-width:44ch}

.sitefoot{background:#0F1A2B;color:var(--slate);font-size:.95rem}
.sitefoot .wide{padding-block:64px 40px;display:grid;grid-template-columns:minmax(0,5fr) repeat(3,minmax(0,2fr));gap:36px 40px}
@media (max-width:820px){.sitefoot .wide{grid-template-columns:repeat(2,minmax(0,1fr))}.sitefoot .who{grid-column:1 / -1}}
.sitefoot .who b{font-family:var(--cond);font-weight:700;font-size:1.7rem;color:#F4EFE6;display:block;line-height:1.1}
.sitefoot p{margin:10px 0 0;max-width:44ch}
.sitefoot h4{margin:0 0 10px;font-size:.95rem;color:#F4EFE6;font-weight:600}
.sitefoot ul{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.sitefoot a{color:var(--slate);text-decoration:none}
.sitefoot a:hover{color:#F4EFE6}
.sitefoot .fine{grid-column:1 / -1;border-top:1px solid #24344D;padding-top:20px;font-size:.86rem;max-width:none}


/* direction A: the whole home page sits on navy */
#home{--bg:#0F1A2B;--surface:#17253A;--ink:#F4EFE6;--muted:#C3CCD8;--line:#2A3A52;--tint:#17253A;--accent:#E4863A;--accent-soft:#3A2A1C;background:#0F1A2B;color:#F4EFE6}
#home .hero-copy{padding-bottom:210px}
.topics{background:#17253A}
.topics .wide{padding-block:56px 64px;display:grid;gap:28px;justify-items:center;text-align:center}
.pills{display:flex;flex-wrap:wrap;gap:14px;justify-content:center}
.pills a{color:#F4EFE6;text-decoration:none;font-weight:600;font-size:1.15rem;border:1px solid var(--slate);border-radius:999px;padding:16px 40px}
.pills a:hover{border-color:#F4EFE6}
#guides .h-l{margin-bottom:36px}
.cards{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px}
@media (max-width:1180px){.cards{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:900px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:700px){.cards{grid-template-columns:1fr}}
.card{min-height:440px;display:flex;flex-direction:column;justify-content:flex-end;gap:12px;padding:32px;border-radius:16px;background:#17253A;border:1px solid #2A3A52;color:#F4EFE6;text-decoration:none}
.card.lite{background:#F4EFE6;color:#0F1A2B;border-color:#F4EFE6}
.card .kind{font-family:var(--mono);font-size:.85rem;color:var(--slate);margin-bottom:auto}
.card.lite .kind{color:#46546A}
.card h3{margin:0;font-family:var(--cond);font-weight:600;font-size:clamp(1.9rem,2.4vw,2.4rem);line-height:.98;letter-spacing:-.01em}
.card p{margin:0;color:#C3CCD8}
.card.lite p{color:#46546A}
.card .go{font-weight:600;text-decoration:underline;text-underline-offset:5px}
.card:hover .go{text-decoration-thickness:3px}
@media (max-width:900px){.card{min-height:300px}}
#home .nl{background:#0F1A2B}
#home .call{background:#0F1A2B;border-top:1px solid #2A3A52}
#home .phone{font-size:2.2rem;margin-top:10px}
#home .about img{border:1px solid #2A3A52}

/* patient guides: shared frame */
.edu{max-width:820px;margin:0 auto;padding-inline:20px;padding-block:0 64px}
.back{display:inline-block;margin-top:18px;color:var(--muted);font-size:.95rem;text-decoration:none}
.back:hover{color:var(--accent)}
.edu-foot{margin-top:48px;padding-top:24px;border-top:1px solid var(--line);font-size:.9rem;color:var(--muted);display:grid;gap:10px}
.edu-foot p{margin:0}
.edu-foot a{color:var(--accent)}
.others{margin-top:40px;display:grid;gap:10px}
.others h2{font-size:1.2rem;margin:0}
.others a{color:var(--accent);font-weight:600;display:block}

/* Eating for your heart */
#eat{--leaf:var(--strong);--leaf-soft:var(--tint);--beet:var(--quiet);--beet-soft:var(--quiet-soft);--grain:var(--accent);--grain-soft:var(--accent-soft)}
#eat h1,#eat h2,#eat h3{font-family:var(--display);line-height:1.15;text-wrap:balance;margin:0}
#eat h1{font-size:clamp(2.2rem,6vw,3.4rem);font-weight:800;letter-spacing:-.02em}
#eat h2{font-size:clamp(1.6rem,4vw,2.1rem);font-weight:700;letter-spacing:-.01em}
#eat h3{font-size:1.2rem;font-weight:700}
#eat p{margin:0;max-width:65ch}
#eat a{color:var(--leaf)}
#eat header.top{padding-block:40px 28px;display:grid;gap:22px}
#eat .eyebrow{font-family:var(--display);font-size:.85rem;letter-spacing:.08em;text-transform:uppercase;color:var(--leaf);font-weight:700}
#eat .lede{font-size:1.2rem;color:var(--muted)}
#eat .from{font-size:.95rem;color:var(--muted)}
#eat .hero{display:grid;grid-template-columns:1fr 240px;gap:28px;align-items:center}
#eat .hero>*{min-width:0}
@media (max-width:680px){#eat .hero{grid-template-columns:1fr}
#eat .plate{max-width:220px;margin:0 auto}}
#eat nav.toc{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--bg);border-bottom:1px solid var(--line);margin-inline:-20px;padding-inline:20px;padding-block:10px;overflow-x:auto;white-space:nowrap}
#eat nav.toc a{display:inline-block;margin-right:6px;padding:6px 12px;border-radius:999px;text-decoration:none;color:var(--ink);font-size:.92rem;border:1px solid var(--line);background:var(--surface)}
#eat nav.toc a:hover{border-color:var(--leaf);color:var(--leaf)}
#eat section{padding-block:44px 8px;display:grid;gap:18px;scroll-margin-top:64px}
#eat .kicker{color:var(--muted)}
#eat .big-idea{background:var(--leaf);color:var(--bg);border-radius:18px;padding:26px 24px;display:grid;gap:10px}
#eat .big-idea p{font-size:1.15rem}
#eat .big-idea strong{font-family:var(--display);font-size:1.35rem;display:block}
#eat .cols{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media (max-width:760px){#eat .cols{grid-template-columns:1fr}}
#eat .col{border-radius:14px;padding:18px;display:grid;gap:10px;align-content:start;min-width:0}
#eat .col h3{display:flex;align-items:center;gap:10px}
#eat .col ul{margin:0;padding-left:1.1em;display:grid;gap:4px}
#eat .more{background:var(--leaf-soft)}
#eat .more h3{color:var(--leaf)}
#eat .swap{background:var(--grain-soft)}
#eat .swap h3{color:var(--grain)}
#eat .less{background:var(--beet-soft)}
#eat .less h3{color:var(--beet)}
#eat .dot{width:14px;height:14px;border-radius:50%;flex:none}
#eat .more .dot{background:var(--leaf)}
#eat .swap .dot{background:var(--grain)}
#eat .less .dot{background:var(--beet)}
#eat .numbers{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}
#eat .num{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px;display:grid;gap:4px;align-content:start}
#eat .num b{font-family:var(--display);font-size:1.7rem;font-weight:800;color:var(--leaf);font-variant-numeric:tabular-nums;line-height:1.1}
#eat .num span{font-size:.95rem;color:var(--muted)}
#eat table.swaps{width:100%;border-collapse:collapse;background:var(--surface);border-radius:14px;overflow:hidden}
#eat .tablewrap{overflow-x:auto;border:1px solid var(--line);border-radius:14px}
#eat table.swaps th,#eat table.swaps td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--line);vertical-align:top}
#eat table.swaps th{font-family:var(--display);font-size:.85rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
#eat table.swaps tr:last-child td{border-bottom:none}
#eat td.from-col{color:var(--beet)}
#eat td.to-col{color:var(--leaf);font-weight:700}
#eat details{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:0}
#eat details summary{cursor:pointer;padding:14px 16px;font-weight:700;list-style:none;display:flex;justify-content:space-between;gap:12px}
#eat details summary::-webkit-details-marker{display:none}
#eat details summary::after{content:"+";font-family:var(--display);font-size:1.3rem;line-height:1;color:var(--leaf)}
#eat details[open] summary::after{content:"–"}
#eat details .inner{padding:0 16px 16px;display:grid;gap:10px;color:var(--ink)}
#eat .why-label{font-size:.8rem;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);font-family:var(--display);font-weight:700}
#eat .callout{border-left:5px solid var(--beet);background:var(--beet-soft);padding:14px 16px;border-radius:0 12px 12px 0}
#eat .callout.green{border-color:var(--leaf);background:var(--leaf-soft)}
#eat .patterns{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media (max-width:760px){#eat .patterns{grid-template-columns:1fr}}
#eat .pattern{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:18px;display:grid;gap:8px;align-content:start}
#eat .pattern .tag{font-size:.82rem;color:var(--muted)}
#eat .situ{display:grid;gap:10px}
#eat .check{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:20px;display:grid;gap:6px}
#eat .check label{display:flex;gap:12px;align-items:flex-start;padding:8px 4px;border-bottom:1px dashed var(--line);cursor:pointer}
#eat .check label:last-of-type{border-bottom:none}
#eat .check input{width:22px;height:22px;margin-top:3px;accent-color:var(--leaf);flex:none}
#eat .check input:checked+span{color:var(--muted);text-decoration:line-through}
#eat .progress{display:flex;align-items:center;gap:12px;font-size:.95rem;color:var(--muted)}
#eat .bar{flex:1;height:10px;border-radius:999px;background:var(--leaf-soft);overflow:hidden}
#eat .bar i{display:block;height:100%;width:0;background:var(--leaf);transition:width .3s}
#eat .btn{font:inherit;font-size:.9rem;background:none;border:1px solid var(--line);color:var(--muted);border-radius:999px;padding:6px 14px;cursor:pointer;justify-self:start}
#eat .btn:hover{border-color:var(--leaf);color:var(--leaf)}

/* Sleeping well */
#sleep{--night:var(--hero-bg);--night-ink:var(--on-navy);--moon:var(--amber);--moon-soft:var(--tint);--lav:var(--strong);--lav-soft:var(--tint);--sage:var(--quiet);--sage-soft:var(--quiet-soft);--warn:var(--accent);--warn-soft:var(--accent-soft)}
#sleep h1,#sleep h2,#sleep h3{font-family:var(--display);line-height:1.15;text-wrap:balance;margin:0}
#sleep h1{font-size:clamp(2.2rem,6vw,3.4rem);font-weight:800;letter-spacing:-.02em}
#sleep h2{font-size:clamp(1.6rem,4vw,2.1rem);font-weight:700;letter-spacing:-.01em}
#sleep h3{font-size:1.2rem;font-weight:700}
#sleep p{margin:0;max-width:65ch}
#sleep a{color:var(--lav)}
#sleep .hero{margin-top:20px;background:var(--night);color:var(--night-ink);border-radius:22px;padding:34px 26px;display:grid;grid-template-columns:1fr 150px;gap:24px;align-items:center;position:relative;overflow:hidden}
#sleep .hero>*{min-width:0;position:relative}
#sleep .hero .eyebrow{color:var(--moon)}
#sleep .hero .lede{color:var(--night-ink);opacity:.85}
#sleep .hero .from{color:var(--night-ink);opacity:.7}
#sleep .stars{position:absolute;inset:0;pointer-events:none}
@media (max-width:640px){#sleep .hero{grid-template-columns:1fr}
#sleep .moon{width:90px;justify-self:start;order:-1}}
#sleep .eyebrow{font-family:var(--display);font-size:.85rem;letter-spacing:.08em;text-transform:uppercase;font-weight:700;color:var(--lav)}
#sleep .lede{font-size:1.2rem}
#sleep .from{font-size:.95rem}
#sleep nav.toc{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--bg);border-bottom:1px solid var(--line);margin-inline:-20px;padding-inline:20px;padding-block:10px;margin-top:22px;overflow-x:auto;white-space:nowrap}
#sleep nav.toc a{display:inline-block;margin-right:6px;padding:6px 12px;border-radius:999px;text-decoration:none;color:var(--ink);font-size:.92rem;border:1px solid var(--line);background:var(--surface)}
#sleep nav.toc a:hover{border-color:var(--lav);color:var(--lav)}
#sleep section{padding-block:44px 8px;display:grid;gap:18px;scroll-margin-top:64px}
#sleep .kicker{color:var(--muted)}
#sleep .big-idea{background:var(--lav-soft);border-radius:18px;padding:24px;display:grid;gap:10px}
#sleep .big-idea strong{font-family:var(--display);font-size:1.35rem;display:block;color:var(--lav)}
#sleep .rules{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
@media (max-width:640px){#sleep .rules{grid-template-columns:1fr}}
#sleep .rule{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px 18px;display:grid;gap:6px;align-content:start}
#sleep .rule h3{font-size:1.08rem}
#sleep .rule p{color:var(--muted);font-size:.98rem}
#sleep details{background:var(--surface);border:1px solid var(--line);border-radius:12px}
#sleep details summary{cursor:pointer;padding:14px 16px;font-weight:700;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px}
#sleep details summary::-webkit-details-marker{display:none}
#sleep details summary::after{content:"+";font-family:var(--display);font-size:1.3rem;line-height:1;color:var(--lav);flex:none}
#sleep details[open] summary::after{content:"–"}
#sleep details .inner{padding:0 16px 16px;display:grid;gap:10px}
#sleep details .inner ul{margin:0;padding-left:1.1em;display:grid;gap:4px}
#sleep .stack{display:grid;gap:10px}
#sleep .progress{display:flex;align-items:center;gap:12px;font-size:.95rem;color:var(--muted)}
#sleep .bar{flex:1;height:10px;border-radius:999px;background:var(--lav-soft);overflow:hidden}
#sleep .bar i{display:block;height:100%;width:0;background:var(--lav);transition:width .3s}
#sleep .phase{font-family:var(--display);font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:700;margin-top:10px}
#sleep .week summary{gap:14px;justify-content:flex-start}
#sleep .week summary::after{margin-left:auto}
#sleep .wk{font-family:var(--display);font-weight:800;font-size:.95rem;color:var(--lav);background:var(--lav-soft);border-radius:8px;padding:2px 9px;flex:none;font-variant-numeric:tabular-nums}
#sleep .week.done .wk{background:var(--sage);color:var(--surface)}
#sleep .week.done summary .wtitle{color:var(--muted)}
#sleep .wtitle{min-width:0}
#sleep .donebox{display:flex;gap:10px;align-items:center;font-size:.95rem;color:var(--muted);padding-top:6px;border-top:1px dashed var(--line);cursor:pointer}
#sleep .donebox input{width:22px;height:22px;accent-color:var(--sage)}
#sleep .start-label{font-size:.82rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-family:var(--display);font-weight:700}
#sleep .btn{font:inherit;font-size:.9rem;background:none;border:1px solid var(--line);color:var(--muted);border-radius:999px;padding:6px 14px;cursor:pointer;justify-self:start}
#sleep .btn:hover{border-color:var(--lav);color:var(--lav)}
#sleep .teas{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
@media (max-width:680px){#sleep .teas{grid-template-columns:1fr}}
#sleep .tea{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:18px;display:grid;gap:10px;align-content:start;min-width:0}
#sleep .tea-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap}
#sleep .ev{font-size:.8rem;font-weight:700;border-radius:999px;padding:2px 10px;background:var(--moon-soft);color:var(--ink);white-space:nowrap}
#sleep .tea dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:4px 12px;font-size:.96rem}
#sleep .tea dt{font-weight:700;color:var(--muted)}
#sleep .tea dd{margin:0}
#sleep .tea .caution{font-size:.94rem;background:var(--warn-soft);border-radius:10px;padding:10px 12px}
#sleep .brew{background:var(--moon-soft);border-radius:16px;padding:20px;display:grid;gap:8px}
#sleep .brew ol{margin:0;padding-left:1.3em;display:grid;gap:4px}
#sleep .callout{border-left:5px solid var(--warn);background:var(--warn-soft);padding:14px 16px;border-radius:0 12px 12px 0;display:grid;gap:6px}
#sleep .callout.calm{border-color:var(--sage);background:var(--sage-soft)}
#sleep .callout ul{margin:0;padding-left:1.1em}

/* Living with POTS */
#pots{--deep:var(--hero-bg);--deep-ink:var(--on-navy);--pulse:var(--accent);--pulse-soft:var(--accent-soft);--sea:var(--strong);--sea-soft:var(--tint);--sand:var(--tint);--leaf:var(--quiet);--leaf-soft:var(--quiet-soft);--warn:var(--accent);--warn-soft:var(--accent-soft)}
#pots h1,#pots h2,#pots h3{font-family:var(--display);line-height:1.15;text-wrap:balance;margin:0}
#pots h1{font-size:clamp(2.2rem,6vw,3.4rem);font-weight:800;letter-spacing:-.02em}
#pots h2{font-size:clamp(1.6rem,4vw,2.1rem);font-weight:700;letter-spacing:-.01em}
#pots h3{font-size:1.2rem;font-weight:700}
#pots p{margin:0;max-width:65ch}
#pots a{color:var(--sea)}
#pots .hero{margin-top:20px;background:var(--deep);color:var(--deep-ink);border-radius:22px;padding:34px 26px 0;display:grid;gap:22px;overflow:hidden}
#pots .hero .eyebrow{color:var(--pulse)}
#pots .hero .lede{opacity:.88}
#pots .hero .from{opacity:.7}
#pots .trace{display:block;width:calc(100% + 52px);margin-inline:-26px;height:auto}
#pots .trace text{font-family:var(--display);font-size:13px;fill:var(--deep-ink);opacity:.75}
#pots .eyebrow{font-family:var(--display);font-size:.95rem;font-weight:700;color:var(--sea)}
#pots .lede{font-size:1.2rem}
#pots .from{font-size:.95rem}
#pots nav.toc{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--bg);border-bottom:1px solid var(--line);margin-inline:-20px;padding-inline:20px;padding-block:10px;margin-top:22px;overflow-x:auto;white-space:nowrap}
#pots nav.toc a{display:inline-block;margin-right:6px;padding:6px 12px;border-radius:999px;text-decoration:none;color:var(--ink);font-size:.92rem;border:1px solid var(--line);background:var(--surface)}
#pots nav.toc a:hover{border-color:var(--sea);color:var(--sea)}
#pots section{padding-block:44px 8px;display:grid;gap:18px;scroll-margin-top:64px}
#pots .kicker{color:var(--muted)}
#pots .big-idea{background:var(--sea-soft);border-radius:18px;padding:24px;display:grid;gap:10px}
#pots .big-idea strong{font-family:var(--display);font-size:1.35rem;display:block;color:var(--sea)}
#pots .facts{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
@media (max-width:680px){#pots .facts{grid-template-columns:1fr}}
#pots .fact{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px 18px;display:grid;gap:6px;align-content:start}
#pots .fact p{color:var(--muted);font-size:.98rem}
#pots details{background:var(--surface);border:1px solid var(--line);border-radius:12px}
#pots details summary{cursor:pointer;padding:14px 16px;font-weight:700;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px}
#pots details summary::-webkit-details-marker{display:none}
#pots details summary::after{content:"+";font-family:var(--display);font-size:1.3rem;line-height:1;color:var(--sea);flex:none}
#pots details[open] summary::after{content:"\2212"}
#pots details .inner{padding:0 16px 16px;display:grid;gap:10px}
#pots ul,#pots ol{margin:0;padding-left:1.15em;display:grid;gap:4px}
#pots .stack{display:grid;gap:10px}
#pots .pillars{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
@media (max-width:680px){#pots .pillars{grid-template-columns:1fr}}
#pots .pillar{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:18px;display:grid;gap:10px;align-content:start;min-width:0}
#pots .goal{font-family:var(--display);font-weight:800;font-size:1.5rem;color:var(--sea);line-height:1.1}
#pots .pillar details{border:0;border-top:1px dashed var(--line);border-radius:0;background:none}
#pots .pillar details summary{padding:10px 0 0;font-size:.95rem;color:var(--muted)}
#pots .pillar details .inner{padding:8px 0 0;font-size:.96rem}
#pots .tablewrap{overflow-x:auto;background:var(--surface);border:1px solid var(--line);border-radius:14px}
#pots table{border-collapse:collapse;width:100%;font-size:.96rem;min-width:420px}
#pots th,#pots td{text-align:left;padding:10px 14px;border-bottom:1px solid var(--line)}
#pots tr:last-child td{border-bottom:0}
#pots th{font-family:var(--display);font-size:.9rem;color:var(--muted)}
#pots td.num{font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:700}
#pots .rules{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
@media (max-width:640px){#pots .rules{grid-template-columns:1fr}}
#pots .rule{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px 18px;display:grid;gap:6px;align-content:start}
#pots .rule h3{font-size:1.08rem}
#pots .rule p{color:var(--muted);font-size:.98rem}
#pots .test{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:20px;display:grid;gap:16px}
#pots .fields{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
@media (max-width:640px){#pots .fields{grid-template-columns:repeat(2,1fr)}}
#pots .field{display:grid;gap:4px;font-size:.92rem;color:var(--muted);min-width:0}
#pots .field input{font:inherit;font-size:1.25rem;font-weight:700;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:8px 10px;width:100%}
#pots .check{display:flex;gap:10px;align-items:center;font-size:.96rem;cursor:pointer}
#pots .check input{width:22px;height:22px;accent-color:var(--sea)}
#pots .result{border-radius:14px;padding:16px 18px;background:var(--sea-soft);display:grid;gap:8px}
#pots .result.high{background:var(--pulse-soft)}
#pots .result .rise{font-family:var(--display);font-weight:800;font-size:2rem;line-height:1;font-variant-numeric:tabular-nums}
#pots .bars{display:flex;align-items:flex-end;gap:14px;height:120px;padding-top:6px}
#pots .barcol{flex:1;display:grid;gap:4px;justify-items:center;align-content:end;height:100%;font-size:.82rem;color:var(--muted);min-width:0}
#pots .barcol i{display:block;width:100%;max-width:64px;border-radius:8px 8px 0 0;background:var(--sea);transition:height .3s}
#pots .barcol.up i{background:var(--pulse)}
#pots .barcol b{color:var(--ink);font-variant-numeric:tabular-nums}
#pots .phase{font-family:var(--display);font-weight:800;font-size:.95rem;color:var(--sea);background:var(--sea-soft);border-radius:8px;padding:2px 9px;flex:none}
#pots .week summary{gap:14px;justify-content:flex-start}
#pots .week summary::after{margin-left:auto}
#pots .callout{border-left:5px solid var(--warn);background:var(--warn-soft);padding:14px 16px;border-radius:0 12px 12px 0;display:grid;gap:6px}
#pots .callout.calm{border-color:var(--leaf);background:var(--leaf-soft)}
#pots .note{background:var(--sand);border-radius:16px;padding:20px;display:grid;gap:8px}

/* Lowering your AFib risk */
#afrisk{--deep:var(--hero-bg);--deep-ink:var(--on-navy);--pulse:var(--accent);--pulse-soft:var(--accent-soft);--sea:var(--strong);--sea-soft:var(--tint);--sand:var(--tint);--leaf:var(--quiet);--leaf-soft:var(--quiet-soft);--warn:var(--accent);--warn-soft:var(--accent-soft)}
#afrisk h1,#afrisk h2,#afrisk h3{font-family:var(--display);line-height:1.15;text-wrap:balance;margin:0}
#afrisk h1{font-size:clamp(2.2rem,6vw,3.4rem);font-weight:800;letter-spacing:-.02em}
#afrisk h2{font-size:clamp(1.6rem,4vw,2.1rem);font-weight:700;letter-spacing:-.01em}
#afrisk h3{font-size:1.2rem;font-weight:700}
#afrisk p{margin:0;max-width:65ch}
#afrisk a{color:var(--sea)}
#afrisk .hero{margin-top:20px;background:var(--deep);color:var(--deep-ink);border-radius:22px;padding:34px 26px 0;display:grid;gap:22px;overflow:hidden}
#afrisk .hero .eyebrow{color:var(--pulse)}
#afrisk .hero .lede{opacity:.88}
#afrisk .hero .from{opacity:.7}
#afrisk .trace{display:block;width:calc(100% + 52px);margin-inline:-26px;height:auto}
#afrisk .trace text{font-family:var(--display);font-size:13px;fill:var(--deep-ink);opacity:.75}
#afrisk .eyebrow{font-family:var(--display);font-size:.95rem;font-weight:700;color:var(--sea)}
#afrisk .lede{font-size:1.2rem}
#afrisk .from{font-size:.95rem}
#afrisk nav.toc{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--bg);border-bottom:1px solid var(--line);margin-inline:-20px;padding-inline:20px;padding-block:10px;margin-top:22px;overflow-x:auto;white-space:nowrap}
#afrisk nav.toc a{display:inline-block;margin-right:6px;padding:6px 12px;border-radius:999px;text-decoration:none;color:var(--ink);font-size:.92rem;border:1px solid var(--line);background:var(--surface)}
#afrisk nav.toc a:hover{border-color:var(--sea);color:var(--sea)}
#afrisk section{padding-block:44px 8px;display:grid;gap:18px;scroll-margin-top:64px}
#afrisk .kicker{color:var(--muted)}
#afrisk .big-idea{background:var(--sea-soft);border-radius:18px;padding:24px;display:grid;gap:10px}
#afrisk .big-idea strong{font-family:var(--display);font-size:1.35rem;display:block;color:var(--sea)}
#afrisk .facts{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
@media (max-width:680px){#afrisk .facts{grid-template-columns:1fr}}
#afrisk .fact{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px 18px;display:grid;gap:6px;align-content:start}
#afrisk .fact p{color:var(--muted);font-size:.98rem}
#afrisk details{background:var(--surface);border:1px solid var(--line);border-radius:12px}
#afrisk details summary{cursor:pointer;padding:14px 16px;font-weight:700;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px}
#afrisk details summary::-webkit-details-marker{display:none}
#afrisk details summary::after{content:"+";font-family:var(--display);font-size:1.3rem;line-height:1;color:var(--sea);flex:none}
#afrisk details[open] summary::after{content:"\2212"}
#afrisk details .inner{padding:0 16px 16px;display:grid;gap:10px}
#afrisk ul,#afrisk ol{margin:0;padding-left:1.15em;display:grid;gap:4px}
#afrisk .stack{display:grid;gap:10px}
#afrisk .pillars{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
@media (max-width:680px){#afrisk .pillars{grid-template-columns:1fr}}
#afrisk .pillar{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:18px;display:grid;gap:10px;align-content:start;min-width:0}
#afrisk .goal{font-family:var(--display);font-weight:800;font-size:1.5rem;color:var(--sea);line-height:1.1}
#afrisk .pillar details{border:0;border-top:1px dashed var(--line);border-radius:0;background:none}
#afrisk .pillar details summary{padding:10px 0 0;font-size:.95rem;color:var(--muted)}
#afrisk .pillar details .inner{padding:8px 0 0;font-size:.96rem}
#afrisk .tablewrap{overflow-x:auto;background:var(--surface);border:1px solid var(--line);border-radius:14px}
#afrisk table{border-collapse:collapse;width:100%;font-size:.96rem;min-width:420px}
#afrisk th,#afrisk td{text-align:left;padding:10px 14px;border-bottom:1px solid var(--line)}
#afrisk tr:last-child td{border-bottom:0}
#afrisk th{font-family:var(--display);font-size:.9rem;color:var(--muted)}
#afrisk td.num{font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:700}
#afrisk .rules{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
@media (max-width:640px){#afrisk .rules{grid-template-columns:1fr}}
#afrisk .rule{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px 18px;display:grid;gap:6px;align-content:start}
#afrisk .rule h3{font-size:1.08rem}
#afrisk .rule p{color:var(--muted);font-size:.98rem}
#afrisk .test{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:20px;display:grid;gap:16px}
#afrisk .fields{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
@media (max-width:640px){#afrisk .fields{grid-template-columns:repeat(2,1fr)}}
#afrisk .field{display:grid;gap:4px;font-size:.92rem;color:var(--muted);min-width:0}
#afrisk .field input{font:inherit;font-size:1.25rem;font-weight:700;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:8px 10px;width:100%}
#afrisk .check{display:flex;gap:10px;align-items:center;font-size:.96rem;cursor:pointer}
#afrisk .check input{width:22px;height:22px;accent-color:var(--sea)}
#afrisk .result{border-radius:14px;padding:16px 18px;background:var(--sea-soft);display:grid;gap:8px}
#afrisk .result.high{background:var(--pulse-soft)}
#afrisk .result .rise{font-family:var(--display);font-weight:800;font-size:2rem;line-height:1;font-variant-numeric:tabular-nums}
#afrisk .bars{display:flex;align-items:flex-end;gap:14px;height:120px;padding-top:6px}
#afrisk .barcol{flex:1;display:grid;gap:4px;justify-items:center;align-content:end;height:100%;font-size:.82rem;color:var(--muted);min-width:0}
#afrisk .barcol i{display:block;width:100%;max-width:64px;border-radius:8px 8px 0 0;background:var(--sea);transition:height .3s}
#afrisk .barcol.up i{background:var(--pulse)}
#afrisk .barcol b{color:var(--ink);font-variant-numeric:tabular-nums}
#afrisk .phase{font-family:var(--display);font-weight:800;font-size:.95rem;color:var(--sea);background:var(--sea-soft);border-radius:8px;padding:2px 9px;flex:none}
#afrisk .week summary{gap:14px;justify-content:flex-start}
#afrisk .week summary::after{margin-left:auto}
#afrisk .callout{border-left:5px solid var(--warn);background:var(--warn-soft);padding:14px 16px;border-radius:0 12px 12px 0;display:grid;gap:6px}
#afrisk .callout.calm{border-color:var(--leaf);background:var(--leaf-soft)}
#afrisk .note{background:var(--sand);border-radius:16px;padding:20px;display:grid;gap:8px}
#afrisk .checks{display:grid;gap:8px}
#afrisk .checks label{display:flex;gap:12px;align-items:flex-start;padding:10px 12px;border:1px solid var(--line);border-radius:10px;cursor:pointer}
#afrisk .checks input{width:20px;height:20px;margin-top:3px;flex:none;accent-color:var(--accent)}
#afrisk .result{border-radius:12px;padding:14px 16px;background:var(--tint)}
#afrisk .result b{font-family:var(--mono);font-size:1.4rem}

/* My watch says I have AFib */
#watch{--deep:var(--hero-bg);--deep-ink:var(--on-navy);--pulse:var(--accent);--pulse-soft:var(--accent-soft);--sea:var(--strong);--sea-soft:var(--tint);--sand:var(--tint);--leaf:var(--quiet);--leaf-soft:var(--quiet-soft);--warn:var(--accent);--warn-soft:var(--accent-soft)}
#watch h1,#watch h2,#watch h3{font-family:var(--display);line-height:1.15;text-wrap:balance;margin:0}
#watch h1{font-size:clamp(2.2rem,6vw,3.4rem);font-weight:800;letter-spacing:-.02em}
#watch h2{font-size:clamp(1.6rem,4vw,2.1rem);font-weight:700;letter-spacing:-.01em}
#watch h3{font-size:1.2rem;font-weight:700}
#watch p{margin:0;max-width:65ch}
#watch a{color:var(--sea)}
#watch .hero{margin-top:20px;background:var(--deep);color:var(--deep-ink);border-radius:22px;padding:34px 26px 0;display:grid;gap:22px;overflow:hidden}
#watch .hero .eyebrow{color:var(--pulse)}
#watch .hero .lede{opacity:.88}
#watch .hero .from{opacity:.7}
#watch .trace{display:block;width:calc(100% + 52px);margin-inline:-26px;height:auto}
#watch .trace text{font-family:var(--display);font-size:13px;fill:var(--deep-ink);opacity:.75}
#watch .eyebrow{font-family:var(--display);font-size:.95rem;font-weight:700;color:var(--sea)}
#watch .lede{font-size:1.2rem}
#watch .from{font-size:.95rem}
#watch nav.toc{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--bg);border-bottom:1px solid var(--line);margin-inline:-20px;padding-inline:20px;padding-block:10px;margin-top:22px;overflow-x:auto;white-space:nowrap}
#watch nav.toc a{display:inline-block;margin-right:6px;padding:6px 12px;border-radius:999px;text-decoration:none;color:var(--ink);font-size:.92rem;border:1px solid var(--line);background:var(--surface)}
#watch nav.toc a:hover{border-color:var(--sea);color:var(--sea)}
#watch section{padding-block:44px 8px;display:grid;gap:18px;scroll-margin-top:64px}
#watch .kicker{color:var(--muted)}
#watch .big-idea{background:var(--sea-soft);border-radius:18px;padding:24px;display:grid;gap:10px}
#watch .big-idea strong{font-family:var(--display);font-size:1.35rem;display:block;color:var(--sea)}
#watch .facts{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
@media (max-width:680px){#watch .facts{grid-template-columns:1fr}}
#watch .fact{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px 18px;display:grid;gap:6px;align-content:start}
#watch .fact p{color:var(--muted);font-size:.98rem}
#watch details{background:var(--surface);border:1px solid var(--line);border-radius:12px}
#watch details summary{cursor:pointer;padding:14px 16px;font-weight:700;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px}
#watch details summary::-webkit-details-marker{display:none}
#watch details summary::after{content:"+";font-family:var(--display);font-size:1.3rem;line-height:1;color:var(--sea);flex:none}
#watch details[open] summary::after{content:"\2212"}
#watch details .inner{padding:0 16px 16px;display:grid;gap:10px}
#watch ul,#watch ol{margin:0;padding-left:1.15em;display:grid;gap:4px}
#watch .stack{display:grid;gap:10px}
#watch .pillars{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
@media (max-width:680px){#watch .pillars{grid-template-columns:1fr}}
#watch .pillar{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:18px;display:grid;gap:10px;align-content:start;min-width:0}
#watch .goal{font-family:var(--display);font-weight:800;font-size:1.5rem;color:var(--sea);line-height:1.1}
#watch .pillar details{border:0;border-top:1px dashed var(--line);border-radius:0;background:none}
#watch .pillar details summary{padding:10px 0 0;font-size:.95rem;color:var(--muted)}
#watch .pillar details .inner{padding:8px 0 0;font-size:.96rem}
#watch .tablewrap{overflow-x:auto;background:var(--surface);border:1px solid var(--line);border-radius:14px}
#watch table{border-collapse:collapse;width:100%;font-size:.96rem;min-width:420px}
#watch th,#watch td{text-align:left;padding:10px 14px;border-bottom:1px solid var(--line)}
#watch tr:last-child td{border-bottom:0}
#watch th{font-family:var(--display);font-size:.9rem;color:var(--muted)}
#watch td.num{font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:700}
#watch .rules{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
@media (max-width:640px){#watch .rules{grid-template-columns:1fr}}
#watch .rule{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px 18px;display:grid;gap:6px;align-content:start}
#watch .rule h3{font-size:1.08rem}
#watch .rule p{color:var(--muted);font-size:.98rem}
#watch .test{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:20px;display:grid;gap:16px}
#watch .fields{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
@media (max-width:640px){#watch .fields{grid-template-columns:repeat(2,1fr)}}
#watch .field{display:grid;gap:4px;font-size:.92rem;color:var(--muted);min-width:0}
#watch .field input{font:inherit;font-size:1.25rem;font-weight:700;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:8px 10px;width:100%}
#watch .check{display:flex;gap:10px;align-items:center;font-size:.96rem;cursor:pointer}
#watch .check input{width:22px;height:22px;accent-color:var(--sea)}
#watch .result{border-radius:14px;padding:16px 18px;background:var(--sea-soft);display:grid;gap:8px}
#watch .result.high{background:var(--pulse-soft)}
#watch .result .rise{font-family:var(--display);font-weight:800;font-size:2rem;line-height:1;font-variant-numeric:tabular-nums}
#watch .bars{display:flex;align-items:flex-end;gap:14px;height:120px;padding-top:6px}
#watch .barcol{flex:1;display:grid;gap:4px;justify-items:center;align-content:end;height:100%;font-size:.82rem;color:var(--muted);min-width:0}
#watch .barcol i{display:block;width:100%;max-width:64px;border-radius:8px 8px 0 0;background:var(--sea);transition:height .3s}
#watch .barcol.up i{background:var(--pulse)}
#watch .barcol b{color:var(--ink);font-variant-numeric:tabular-nums}
#watch .phase{font-family:var(--display);font-weight:800;font-size:.95rem;color:var(--sea);background:var(--sea-soft);border-radius:8px;padding:2px 9px;flex:none}
#watch .week summary{gap:14px;justify-content:flex-start}
#watch .week summary::after{margin-left:auto}
#watch .callout{border-left:5px solid var(--warn);background:var(--warn-soft);padding:14px 16px;border-radius:0 12px 12px 0;display:grid;gap:6px}
#watch .callout.calm{border-color:var(--leaf);background:var(--leaf-soft)}
#watch .note{background:var(--sand);border-radius:16px;padding:20px;display:grid;gap:8px}
#watch .checks{display:grid;gap:8px}
#watch .checks label{display:flex;gap:12px;align-items:flex-start;padding:10px 12px;border:1px solid var(--line);border-radius:10px;cursor:pointer}
#watch .checks input{width:20px;height:20px;margin-top:3px;flex:none;accent-color:var(--accent)}
#watch .callout ul+strong{margin-top:8px}

/* Getting ready for your ablation */
#ablation{--deep:var(--hero-bg);--deep-ink:var(--on-navy);--pulse:var(--accent);--pulse-soft:var(--accent-soft);--sea:var(--strong);--sea-soft:var(--tint);--sand:var(--tint);--leaf:var(--quiet);--leaf-soft:var(--quiet-soft);--warn:var(--accent);--warn-soft:var(--accent-soft)}
#ablation h1,#ablation h2,#ablation h3{font-family:var(--display);line-height:1.15;text-wrap:balance;margin:0}
#ablation h1{font-size:clamp(2.2rem,6vw,3.4rem);font-weight:800;letter-spacing:-.02em}
#ablation h2{font-size:clamp(1.6rem,4vw,2.1rem);font-weight:700;letter-spacing:-.01em}
#ablation h3{font-size:1.2rem;font-weight:700}
#ablation p{margin:0;max-width:65ch}
#ablation a{color:var(--sea)}
#ablation .hero{margin-top:20px;background:var(--deep);color:var(--deep-ink);border-radius:22px;padding:34px 26px 0;display:grid;gap:22px;overflow:hidden}
#ablation .hero .eyebrow{color:var(--pulse)}
#ablation .hero .lede{opacity:.88}
#ablation .hero .from{opacity:.7}
#ablation .trace{display:block;width:calc(100% + 52px);margin-inline:-26px;height:auto}
#ablation .trace text{font-family:var(--display);font-size:13px;fill:var(--deep-ink);opacity:.75}
#ablation .eyebrow{font-family:var(--display);font-size:.95rem;font-weight:700;color:var(--sea)}
#ablation .lede{font-size:1.2rem}
#ablation .from{font-size:.95rem}
#ablation nav.toc{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--bg);border-bottom:1px solid var(--line);margin-inline:-20px;padding-inline:20px;padding-block:10px;margin-top:22px;overflow-x:auto;white-space:nowrap}
#ablation nav.toc a{display:inline-block;margin-right:6px;padding:6px 12px;border-radius:999px;text-decoration:none;color:var(--ink);font-size:.92rem;border:1px solid var(--line);background:var(--surface)}
#ablation nav.toc a:hover{border-color:var(--sea);color:var(--sea)}
#ablation section{padding-block:44px 8px;display:grid;gap:18px;scroll-margin-top:64px}
#ablation .kicker{color:var(--muted)}
#ablation .big-idea{background:var(--sea-soft);border-radius:18px;padding:24px;display:grid;gap:10px}
#ablation .big-idea strong{font-family:var(--display);font-size:1.35rem;display:block;color:var(--sea)}
#ablation .facts{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
@media (max-width:680px){#ablation .facts{grid-template-columns:1fr}}
#ablation .fact{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px 18px;display:grid;gap:6px;align-content:start}
#ablation .fact p{color:var(--muted);font-size:.98rem}
#ablation details{background:var(--surface);border:1px solid var(--line);border-radius:12px}
#ablation details summary{cursor:pointer;padding:14px 16px;font-weight:700;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px}
#ablation details summary::-webkit-details-marker{display:none}
#ablation details summary::after{content:"+";font-family:var(--display);font-size:1.3rem;line-height:1;color:var(--sea);flex:none}
#ablation details[open] summary::after{content:"\2212"}
#ablation details .inner{padding:0 16px 16px;display:grid;gap:10px}
#ablation ul,#ablation ol{margin:0;padding-left:1.15em;display:grid;gap:4px}
#ablation .stack{display:grid;gap:10px}
#ablation .pillars{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
@media (max-width:680px){#ablation .pillars{grid-template-columns:1fr}}
#ablation .pillar{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:18px;display:grid;gap:10px;align-content:start;min-width:0}
#ablation .goal{font-family:var(--display);font-weight:800;font-size:1.5rem;color:var(--sea);line-height:1.1}
#ablation .pillar details{border:0;border-top:1px dashed var(--line);border-radius:0;background:none}
#ablation .pillar details summary{padding:10px 0 0;font-size:.95rem;color:var(--muted)}
#ablation .pillar details .inner{padding:8px 0 0;font-size:.96rem}
#ablation .tablewrap{overflow-x:auto;background:var(--surface);border:1px solid var(--line);border-radius:14px}
#ablation table{border-collapse:collapse;width:100%;font-size:.96rem;min-width:420px}
#ablation th,#ablation td{text-align:left;padding:10px 14px;border-bottom:1px solid var(--line)}
#ablation tr:last-child td{border-bottom:0}
#ablation th{font-family:var(--display);font-size:.9rem;color:var(--muted)}
#ablation td.num{font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:700}
#ablation .rules{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
@media (max-width:640px){#ablation .rules{grid-template-columns:1fr}}
#ablation .rule{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px 18px;display:grid;gap:6px;align-content:start}
#ablation .rule h3{font-size:1.08rem}
#ablation .rule p{color:var(--muted);font-size:.98rem}
#ablation .test{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:20px;display:grid;gap:16px}
#ablation .fields{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
@media (max-width:640px){#ablation .fields{grid-template-columns:repeat(2,1fr)}}
#ablation .field{display:grid;gap:4px;font-size:.92rem;color:var(--muted);min-width:0}
#ablation .field input{font:inherit;font-size:1.25rem;font-weight:700;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:8px 10px;width:100%}
#ablation .check{display:flex;gap:10px;align-items:center;font-size:.96rem;cursor:pointer}
#ablation .check input{width:22px;height:22px;accent-color:var(--sea)}
#ablation .result{border-radius:14px;padding:16px 18px;background:var(--sea-soft);display:grid;gap:8px}
#ablation .result.high{background:var(--pulse-soft)}
#ablation .result .rise{font-family:var(--display);font-weight:800;font-size:2rem;line-height:1;font-variant-numeric:tabular-nums}
#ablation .bars{display:flex;align-items:flex-end;gap:14px;height:120px;padding-top:6px}
#ablation .barcol{flex:1;display:grid;gap:4px;justify-items:center;align-content:end;height:100%;font-size:.82rem;color:var(--muted);min-width:0}
#ablation .barcol i{display:block;width:100%;max-width:64px;border-radius:8px 8px 0 0;background:var(--sea);transition:height .3s}
#ablation .barcol.up i{background:var(--pulse)}
#ablation .barcol b{color:var(--ink);font-variant-numeric:tabular-nums}
#ablation .phase{font-family:var(--display);font-weight:800;font-size:.95rem;color:var(--sea);background:var(--sea-soft);border-radius:8px;padding:2px 9px;flex:none}
#ablation .week summary{gap:14px;justify-content:flex-start}
#ablation .week summary::after{margin-left:auto}
#ablation .callout{border-left:5px solid var(--warn);background:var(--warn-soft);padding:14px 16px;border-radius:0 12px 12px 0;display:grid;gap:6px}
#ablation .callout.calm{border-color:var(--leaf);background:var(--leaf-soft)}
#ablation .note{background:var(--sand);border-radius:16px;padding:20px;display:grid;gap:8px}
#ablation .checks{display:grid;gap:8px}
#ablation .checks label{display:flex;gap:12px;align-items:flex-start;padding:10px 12px;border:1px solid var(--line);border-radius:10px;cursor:pointer}
#ablation .checks input{width:20px;height:20px;margin-top:3px;flex:none;accent-color:var(--accent)}

#ablation .btn{font:inherit;font-size:.9rem;background:none;border:1px solid var(--line);color:var(--muted);border-radius:999px;padding:6px 14px;cursor:pointer;justify-self:start}
#ablation .btn:hover{border-color:var(--accent);color:var(--accent)}
#ablation .note p{color:var(--muted)}
#ablation .group{display:grid;gap:10px}
#ablation .group h3{font-size:1.05rem;color:var(--accent)}
#ablation .meter{height:10px;background:var(--tint);border-radius:999px;overflow:hidden}
#ablation .meter i{display:block;height:100%;width:0;background:var(--accent);transition:width .3s}
#ablation .count{font-family:var(--mono);font-size:.95rem;color:var(--muted)}

/* Living with a pacemaker or ICD */
#device{--deep:var(--hero-bg);--deep-ink:var(--on-navy);--pulse:var(--accent);--pulse-soft:var(--accent-soft);--sea:var(--strong);--sea-soft:var(--tint);--sand:var(--tint);--leaf:var(--quiet);--leaf-soft:var(--quiet-soft);--warn:var(--accent);--warn-soft:var(--accent-soft)}
#device h1,#device h2,#device h3{font-family:var(--display);line-height:1.15;text-wrap:balance;margin:0}
#device h1{font-size:clamp(2.2rem,6vw,3.4rem);font-weight:800;letter-spacing:-.02em}
#device h2{font-size:clamp(1.6rem,4vw,2.1rem);font-weight:700;letter-spacing:-.01em}
#device h3{font-size:1.2rem;font-weight:700}
#device p{margin:0;max-width:65ch}
#device a{color:var(--sea)}
#device .hero{margin-top:20px;background:var(--deep);color:var(--deep-ink);border-radius:22px;padding:34px 26px 0;display:grid;gap:22px;overflow:hidden}
#device .hero .eyebrow{color:var(--pulse)}
#device .hero .lede{opacity:.88}
#device .hero .from{opacity:.7}
#device .trace{display:block;width:calc(100% + 52px);margin-inline:-26px;height:auto}
#device .trace text{font-family:var(--display);font-size:13px;fill:var(--deep-ink);opacity:.75}
#device .eyebrow{font-family:var(--display);font-size:.95rem;font-weight:700;color:var(--sea)}
#device .lede{font-size:1.2rem}
#device .from{font-size:.95rem}
#device nav.toc{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--bg);border-bottom:1px solid var(--line);margin-inline:-20px;padding-inline:20px;padding-block:10px;margin-top:22px;overflow-x:auto;white-space:nowrap}
#device nav.toc a{display:inline-block;margin-right:6px;padding:6px 12px;border-radius:999px;text-decoration:none;color:var(--ink);font-size:.92rem;border:1px solid var(--line);background:var(--surface)}
#device nav.toc a:hover{border-color:var(--sea);color:var(--sea)}
#device section{padding-block:44px 8px;display:grid;gap:18px;scroll-margin-top:64px}
#device .kicker{color:var(--muted)}
#device .big-idea{background:var(--sea-soft);border-radius:18px;padding:24px;display:grid;gap:10px}
#device .big-idea strong{font-family:var(--display);font-size:1.35rem;display:block;color:var(--sea)}
#device .facts{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
@media (max-width:680px){#device .facts{grid-template-columns:1fr}}
#device .fact{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px 18px;display:grid;gap:6px;align-content:start}
#device .fact p{color:var(--muted);font-size:.98rem}
#device details{background:var(--surface);border:1px solid var(--line);border-radius:12px}
#device details summary{cursor:pointer;padding:14px 16px;font-weight:700;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px}
#device details summary::-webkit-details-marker{display:none}
#device details summary::after{content:"+";font-family:var(--display);font-size:1.3rem;line-height:1;color:var(--sea);flex:none}
#device details[open] summary::after{content:"\2212"}
#device details .inner{padding:0 16px 16px;display:grid;gap:10px}
#device ul,#device ol{margin:0;padding-left:1.15em;display:grid;gap:4px}
#device .stack{display:grid;gap:10px}
#device .pillars{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
@media (max-width:680px){#device .pillars{grid-template-columns:1fr}}
#device .pillar{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:18px;display:grid;gap:10px;align-content:start;min-width:0}
#device .goal{font-family:var(--display);font-weight:800;font-size:1.5rem;color:var(--sea);line-height:1.1}
#device .pillar details{border:0;border-top:1px dashed var(--line);border-radius:0;background:none}
#device .pillar details summary{padding:10px 0 0;font-size:.95rem;color:var(--muted)}
#device .pillar details .inner{padding:8px 0 0;font-size:.96rem}
#device .tablewrap{overflow-x:auto;background:var(--surface);border:1px solid var(--line);border-radius:14px}
#device table{border-collapse:collapse;width:100%;font-size:.96rem;min-width:420px}
#device th,#device td{text-align:left;padding:10px 14px;border-bottom:1px solid var(--line)}
#device tr:last-child td{border-bottom:0}
#device th{font-family:var(--display);font-size:.9rem;color:var(--muted)}
#device td.num{font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:700}
#device .rules{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
@media (max-width:640px){#device .rules{grid-template-columns:1fr}}
#device .rule{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px 18px;display:grid;gap:6px;align-content:start}
#device .rule h3{font-size:1.08rem}
#device .rule p{color:var(--muted);font-size:.98rem}
#device .test{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:20px;display:grid;gap:16px}
#device .fields{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
@media (max-width:640px){#device .fields{grid-template-columns:repeat(2,1fr)}}
#device .field{display:grid;gap:4px;font-size:.92rem;color:var(--muted);min-width:0}
#device .field input{font:inherit;font-size:1.25rem;font-weight:700;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:8px 10px;width:100%}
#device .check{display:flex;gap:10px;align-items:center;font-size:.96rem;cursor:pointer}
#device .check input{width:22px;height:22px;accent-color:var(--sea)}
#device .result{border-radius:14px;padding:16px 18px;background:var(--sea-soft);display:grid;gap:8px}
#device .result.high{background:var(--pulse-soft)}
#device .result .rise{font-family:var(--display);font-weight:800;font-size:2rem;line-height:1;font-variant-numeric:tabular-nums}
#device .bars{display:flex;align-items:flex-end;gap:14px;height:120px;padding-top:6px}
#device .barcol{flex:1;display:grid;gap:4px;justify-items:center;align-content:end;height:100%;font-size:.82rem;color:var(--muted);min-width:0}
#device .barcol i{display:block;width:100%;max-width:64px;border-radius:8px 8px 0 0;background:var(--sea);transition:height .3s}
#device .barcol.up i{background:var(--pulse)}
#device .barcol b{color:var(--ink);font-variant-numeric:tabular-nums}
#device .phase{font-family:var(--display);font-weight:800;font-size:.95rem;color:var(--sea);background:var(--sea-soft);border-radius:8px;padding:2px 9px;flex:none}
#device .week summary{gap:14px;justify-content:flex-start}
#device .week summary::after{margin-left:auto}
#device .callout{border-left:5px solid var(--warn);background:var(--warn-soft);padding:14px 16px;border-radius:0 12px 12px 0;display:grid;gap:6px}
#device .callout.calm{border-color:var(--leaf);background:var(--leaf-soft)}
#device .note{background:var(--sand);border-radius:16px;padding:20px;display:grid;gap:8px}
#device .checks{display:grid;gap:8px}
#device .checks label{display:flex;gap:12px;align-items:flex-start;padding:10px 12px;border:1px solid var(--line);border-radius:10px;cursor:pointer}
#device .checks input{width:20px;height:20px;margin-top:3px;flex:none;accent-color:var(--accent)}

#device .btn{font:inherit;font-size:.9rem;background:none;border:1px solid var(--line);color:var(--muted);border-radius:999px;padding:6px 14px;cursor:pointer;justify-self:start}
#device .btn:hover{border-color:var(--accent);color:var(--accent)}
#device .note p{color:var(--muted)}
#device .find{display:grid;gap:6px;font-size:.92rem;color:var(--muted)}
#device .find input{font:inherit;font-size:1.05rem;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:10px 12px;width:100%}
#device .chips{display:flex;flex-wrap:wrap;gap:8px}
#device .chip{font:inherit;font-size:.9rem;background:var(--bg);color:var(--ink);border:1px solid var(--line);border-radius:999px;padding:6px 14px;cursor:pointer}
#device .chip[aria-pressed="true"]{border-color:var(--accent);background:var(--accent-soft)}
#device .items{list-style:none;margin:0;padding:0;display:grid;gap:8px}
#device .items li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;align-items:start;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--bg)}
#device .items b{font-weight:700}
#device .items small{grid-column:1/-1;color:var(--muted);font-size:.94rem}
#device .tag{font-family:var(--mono);font-size:.78rem;border-radius:6px;padding:2px 8px;white-space:nowrap;background:var(--tint);color:var(--muted)}
#device .tag.gap{background:var(--accent-soft);color:var(--ink)}
#device .tag.ask{background:var(--strong);color:var(--bg)}
#device .empty{color:var(--muted)}

/* Lowering your blood pressure */
#bp{--deep:var(--hero-bg);--deep-ink:var(--on-navy);--pulse:var(--accent);--pulse-soft:var(--accent-soft);--sea:var(--strong);--sea-soft:var(--tint);--sand:var(--tint);--leaf:var(--quiet);--leaf-soft:var(--quiet-soft);--warn:var(--accent);--warn-soft:var(--accent-soft)}
#bp h1,#bp h2,#bp h3{font-family:var(--display);line-height:1.15;text-wrap:balance;margin:0}
#bp h1{font-size:clamp(2.2rem,6vw,3.4rem);font-weight:800;letter-spacing:-.02em}
#bp h2{font-size:clamp(1.6rem,4vw,2.1rem);font-weight:700;letter-spacing:-.01em}
#bp h3{font-size:1.2rem;font-weight:700}
#bp p{margin:0;max-width:65ch}
#bp a{color:var(--sea)}
#bp .hero{margin-top:20px;background:var(--deep);color:var(--deep-ink);border-radius:22px;padding:34px 26px 0;display:grid;gap:22px;overflow:hidden}
#bp .hero .eyebrow{color:var(--pulse)}
#bp .hero .lede{opacity:.88}
#bp .hero .from{opacity:.7}
#bp .trace{display:block;width:calc(100% + 52px);margin-inline:-26px;height:auto}
#bp .trace text{font-family:var(--display);font-size:13px;fill:var(--deep-ink);opacity:.75}
#bp .eyebrow{font-family:var(--display);font-size:.95rem;font-weight:700;color:var(--sea)}
#bp .lede{font-size:1.2rem}
#bp .from{font-size:.95rem}
#bp nav.toc{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--bg);border-bottom:1px solid var(--line);margin-inline:-20px;padding-inline:20px;padding-block:10px;margin-top:22px;overflow-x:auto;white-space:nowrap}
#bp nav.toc a{display:inline-block;margin-right:6px;padding:6px 12px;border-radius:999px;text-decoration:none;color:var(--ink);font-size:.92rem;border:1px solid var(--line);background:var(--surface)}
#bp nav.toc a:hover{border-color:var(--sea);color:var(--sea)}
#bp section{padding-block:44px 8px;display:grid;gap:18px;scroll-margin-top:64px}
#bp .kicker{color:var(--muted)}
#bp .big-idea{background:var(--sea-soft);border-radius:18px;padding:24px;display:grid;gap:10px}
#bp .big-idea strong{font-family:var(--display);font-size:1.35rem;display:block;color:var(--sea)}
#bp .facts{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
@media (max-width:680px){#bp .facts{grid-template-columns:1fr}}
#bp .fact{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px 18px;display:grid;gap:6px;align-content:start}
#bp .fact p{color:var(--muted);font-size:.98rem}
#bp details{background:var(--surface);border:1px solid var(--line);border-radius:12px}
#bp details summary{cursor:pointer;padding:14px 16px;font-weight:700;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px}
#bp details summary::-webkit-details-marker{display:none}
#bp details summary::after{content:"+";font-family:var(--display);font-size:1.3rem;line-height:1;color:var(--sea);flex:none}
#bp details[open] summary::after{content:"\2212"}
#bp details .inner{padding:0 16px 16px;display:grid;gap:10px}
#bp ul,#bp ol{margin:0;padding-left:1.15em;display:grid;gap:4px}
#bp .stack{display:grid;gap:10px}
#bp .pillars{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
@media (max-width:680px){#bp .pillars{grid-template-columns:1fr}}
#bp .pillar{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:18px;display:grid;gap:10px;align-content:start;min-width:0}
#bp .goal{font-family:var(--display);font-weight:800;font-size:1.5rem;color:var(--sea);line-height:1.1}
#bp .pillar details{border:0;border-top:1px dashed var(--line);border-radius:0;background:none}
#bp .pillar details summary{padding:10px 0 0;font-size:.95rem;color:var(--muted)}
#bp .pillar details .inner{padding:8px 0 0;font-size:.96rem}
#bp .tablewrap{overflow-x:auto;background:var(--surface);border:1px solid var(--line);border-radius:14px}
#bp table{border-collapse:collapse;width:100%;font-size:.96rem;min-width:420px}
#bp th,#bp td{text-align:left;padding:10px 14px;border-bottom:1px solid var(--line)}
#bp tr:last-child td{border-bottom:0}
#bp th{font-family:var(--display);font-size:.9rem;color:var(--muted)}
#bp td.num{font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:700}
#bp .rules{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
@media (max-width:640px){#bp .rules{grid-template-columns:1fr}}
#bp .rule{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px 18px;display:grid;gap:6px;align-content:start}
#bp .rule h3{font-size:1.08rem}
#bp .rule p{color:var(--muted);font-size:.98rem}
#bp .test{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:20px;display:grid;gap:16px}
#bp .fields{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
@media (max-width:640px){#bp .fields{grid-template-columns:repeat(2,1fr)}}
#bp .field{display:grid;gap:4px;font-size:.92rem;color:var(--muted);min-width:0}
#bp .field input{font:inherit;font-size:1.25rem;font-weight:700;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:8px 10px;width:100%}
#bp .check{display:flex;gap:10px;align-items:center;font-size:.96rem;cursor:pointer}
#bp .check input{width:22px;height:22px;accent-color:var(--sea)}
#bp .result{border-radius:14px;padding:16px 18px;background:var(--sea-soft);display:grid;gap:8px}
#bp .result.high{background:var(--pulse-soft)}
#bp .result .rise{font-family:var(--display);font-weight:800;font-size:2rem;line-height:1;font-variant-numeric:tabular-nums}
#bp .bars{display:flex;align-items:flex-end;gap:14px;height:120px;padding-top:6px}
#bp .barcol{flex:1;display:grid;gap:4px;justify-items:center;align-content:end;height:100%;font-size:.82rem;color:var(--muted);min-width:0}
#bp .barcol i{display:block;width:100%;max-width:64px;border-radius:8px 8px 0 0;background:var(--sea);transition:height .3s}
#bp .barcol.up i{background:var(--pulse)}
#bp .barcol b{color:var(--ink);font-variant-numeric:tabular-nums}
#bp .phase{font-family:var(--display);font-weight:800;font-size:.95rem;color:var(--sea);background:var(--sea-soft);border-radius:8px;padding:2px 9px;flex:none}
#bp .week summary{gap:14px;justify-content:flex-start}
#bp .week summary::after{margin-left:auto}
#bp .callout{border-left:5px solid var(--warn);background:var(--warn-soft);padding:14px 16px;border-radius:0 12px 12px 0;display:grid;gap:6px}
#bp .callout.calm{border-color:var(--leaf);background:var(--leaf-soft)}
#bp .note{background:var(--sand);border-radius:16px;padding:20px;display:grid;gap:8px}

#bp .field select{font:inherit;font-size:1.1rem;font-weight:600;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:9px 10px;width:100%}
#bp .levers{display:grid;gap:8px}
#bp .lever{display:grid;grid-template-columns:minmax(0,13rem) minmax(0,1fr) 5.6rem;gap:14px;align-items:center;width:100%;text-align:left;font:inherit;font-size:.98rem;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:12px 14px;cursor:pointer}
#bp .lever:hover{border-color:var(--sea)}
#bp .lever[aria-pressed="true"]{border-color:var(--pulse);box-shadow:inset 4px 0 0 var(--pulse)}
#bp .lever .nm{font-weight:600;display:flex;gap:10px;align-items:center}
#bp .lever .box{width:20px;height:20px;border-radius:5px;border:2px solid var(--line);flex:none;display:grid;place-items:center;font-size:.8rem;line-height:1;color:var(--surface)}
#bp .lever[aria-pressed="true"] .box{background:var(--pulse);border-color:var(--pulse)}
#bp .lever .trk{position:relative;height:14px;border-radius:999px;background:var(--sea-soft)}
#bp .lever .rng{position:absolute;top:0;bottom:0;border-radius:999px;background:var(--sea);min-width:14px}
#bp .lever[aria-pressed="true"] .rng{background:var(--pulse)}
#bp .lever .pts{font-family:var(--mono);font-weight:600;font-size:.92rem;text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
#bp .axis{display:grid;grid-template-columns:minmax(0,13rem) minmax(0,1fr) 5.6rem;gap:14px;padding:0 14px;font-family:var(--mono);font-size:.8rem;color:var(--muted)}
#bp .axis>span:nth-child(2){display:flex;justify-content:space-between}
#bp .lever-note{color:var(--muted);font-size:.98rem}
@media (max-width:620px){#bp .lever,#bp .axis{grid-template-columns:minmax(0,1fr) 4.8rem;gap:8px 12px}#bp .lever .trk{grid-column:1 / -1;grid-row:2}#bp .axis>span:first-child,#bp .axis>span:last-child{display:none}#bp .axis{grid-template-columns:1fr}}
#bp .logrow{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1.3fr) auto;gap:12px;align-items:end}
@media (max-width:560px){#bp .logrow{grid-template-columns:1fr 1fr}#bp .logrow .add{grid-column:1 / -1;justify-self:stretch}}
#bp .btn.add{background:var(--amber);border-color:var(--amber);color:var(--warm-white);font-weight:600;padding:11px 20px}
#bp .btn.add:hover{background:#9A4707;color:var(--warm-white)}
#bp .logerr{color:var(--accent);font-size:.95rem;margin:0}
#bp .reads{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
#bp .reads li{display:flex;gap:8px;align-items:center;background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:5px 6px 5px 12px;font-size:.92rem}
#bp .reads b{font-family:var(--mono);font-weight:600;font-variant-numeric:tabular-nums}
#bp .reads small{color:var(--muted)}
#bp .reads button{font:inherit;font-size:.85rem;border:0;background:none;color:var(--muted);cursor:pointer;padding:2px 6px;border-radius:999px}
#bp .reads button:hover{color:var(--accent)}
#bp .reads li.hi{border-color:var(--accent)}
#bp .meter{height:10px;border-radius:999px;background:var(--surface);overflow:hidden}
#bp .meter i{display:block;height:100%;background:var(--sea);transition:width .3s}
#bp .callout p{margin:0}
#bp .note ol{margin:0}
#bp .checklist{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:20px;display:grid;gap:6px}
#bp .checklist label{display:flex;gap:12px;align-items:flex-start;padding:8px 4px;border-bottom:1px dashed var(--line);cursor:pointer}
#bp .checklist label:last-of-type{border-bottom:none}
#bp .checklist input{width:22px;height:22px;margin-top:3px;accent-color:var(--sea);flex:none}
#bp .checklist input:checked+span{color:var(--muted);text-decoration:line-through}
#bp .progress{display:flex;align-items:center;gap:12px;font-size:.95rem;color:var(--muted)}
#bp .bar{flex:1;height:10px;border-radius:999px;background:var(--sea-soft);overflow:hidden}
#bp .bar i{display:block;height:100%;width:0;background:var(--sea);transition:width .3s}
#bp .btn{font:inherit;font-size:.9rem;background:none;border:1px solid var(--line);color:var(--muted);border-radius:999px;padding:6px 14px;cursor:pointer;justify-self:start}
#bp .btn:hover{border-color:var(--sea);color:var(--sea)}
/* palette corrections on top of the guide styles */
:is(#eat,#sleep,#pots,#bp) .hero .eyebrow{color:var(--slate)}
:is(#eat,#sleep,#pots,#bp) nav.toc{top:env(safe-area-inset-top,0px)}
:is(#eat,#sleep,#pots,#bp) details summary::after{color:var(--accent)}
#eat .callout{border-color:var(--accent);background:var(--accent-soft)}
#eat .callout.green{border-color:var(--quiet);background:var(--tint)}
#eat .num b,#pots .result .rise,#bp .result .rise,#sleep .wk,:is(#eat,#sleep,#pots,#bp) td.num{font-family:var(--mono);font-weight:600;letter-spacing:-.02em}
:is(#eat,#sleep,#pots,#bp) .hero,:is(#eat,#sleep,#pots,#bp) .big-idea,:is(#eat,#sleep,#pots,#bp) .pillar,:is(#eat,#sleep,#pots,#bp) .tea,:is(#eat,#sleep,#pots,#bp) .test,:is(#eat,#sleep,#pots,#bp) .note,:is(#eat,#sleep,#pots,#bp) .brew,:is(#eat,#sleep,#pots,#bp) .check{border-radius:10px}
:is(#eat,#sleep,#pots,#bp) .others a{color:var(--accent)}
#sleep .tea .caution{background:var(--tint)}
