:root{
  --bg:#f7f5ee;--surface:#ffffff;--tint:#e8f1ea;--ink:#16201b;--muted:#516158;
  --green:#0b3d2e;--green2:#14694d;--gold:#c8921a;--line:#d8dfd6;--bad:#a63a2b;--ok:#17724f;
  --shadow:0 1px 2px rgba(0,0,0,.06),0 6px 18px rgba(11,61,46,.07);
}
:root[data-theme="dark"]{
  --bg:#0d1511;--surface:#16211b;--tint:#1b2c23;--ink:#eef3ee;--muted:#a3b3a9;
  --green:#e6f2ea;--green2:#6fd0a2;--gold:#e5b44c;--line:#2a3a31;--bad:#ff9a8a;--ok:#6fd0a2;
  --shadow:none;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.65 system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;-webkit-text-size-adjust:100%}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}
.narrow{max-width:760px}
.skip{position:absolute;left:-999px;top:0;background:var(--gold);color:#000;padding:8px 14px;z-index:99}
.skip:focus{left:8px;top:8px}
a{color:var(--green2)}
h1,h2,h3{line-height:1.2;color:var(--green);margin:1.2em 0 .45em}
h1{font-size:clamp(2rem,5vw,3rem);margin-top:.5em}
h2{font-size:1.55rem}
h3{font-size:1.2rem}
p,ul,ol{margin:.6em 0}
li{margin:.3em 0}
.lead{font-size:1.15rem;color:var(--muted);max-width:60ch}
.small{font-size:.9rem;color:var(--muted)}
.eyebrow{font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:var(--gold);font-weight:700;margin:1.2em 0 0}
.kicker{color:var(--gold);font-weight:700;margin:0}

.top{position:sticky;top:0;z-index:20;background:var(--surface);border-bottom:1px solid var(--line)}
.bar{display:flex;align-items:center;gap:12px;min-height:60px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:8px;color:var(--green);font-weight:800;text-decoration:none;font-size:1.1rem}
nav{display:flex;gap:2px;flex-wrap:wrap;margin-left:auto}
nav a{padding:8px 10px;border-radius:8px;text-decoration:none;color:var(--ink);font-size:.95rem}
nav a:hover{background:var(--tint)}
nav a[aria-current="page"]{background:var(--green);color:var(--bg)}
.ghost{background:none;border:1px solid var(--line);color:var(--ink);border-radius:8px;padding:7px 12px;font:inherit;font-size:.9rem;cursor:pointer}
#menuBtn{display:none}
@media (max-width:1000px){
  #menuBtn{display:inline-block;margin-left:auto}
  nav{display:none;width:100%;flex-direction:column;margin:0 0 10px}
  nav.open{display:flex}
}

.hero{background:linear-gradient(135deg,var(--green) 0%,#14694d 100%);color:#fff;padding:56px 0 48px}
:root[data-theme="dark"] .hero{background:linear-gradient(135deg,#123a2b,#0f5a41)}
.hero h1{color:#fff;margin:.2em 0}
.hero .lead{color:#e3efe7}
.hero .small{color:#cfe3d6}
.hero .kicker{color:#f2cb6b}
.cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
.btn{display:inline-block;background:var(--gold);color:#1b1500;font-weight:700;padding:12px 22px;border-radius:10px;text-decoration:none;border:0;cursor:pointer;font:inherit;font-weight:700}
.btn.alt{background:transparent;color:#fff;border:2px solid #ffffff88}
.btn:hover{filter:brightness(1.07)}
.btn.sm{padding:8px 14px;font-size:.95rem}

.split{display:grid;grid-template-columns:1.2fr 1fr;gap:28px;align-items:start;margin:30px 0}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px}
.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px;margin:22px 0}
@media (max-width:760px){.split{grid-template-columns:1fr}}
.card{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:20px;box-shadow:var(--shadow)}
.card.tint{background:var(--tint)}
.card h3{margin-top:.2em}
a.tile{display:block;color:inherit;text-decoration:none;transition:transform .15s}
a.tile:hover{transform:translateY(-2px)}
a.tile .eyebrow{margin-top:0}
.plain{padding-left:1.2em}
.more{font-weight:700}
.notice{background:var(--tint);border-left:4px solid var(--gold);padding:14px 16px;border-radius:8px;margin:26px 0}
.chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0}
.chips li{background:var(--tint);border:1px solid var(--line);border-radius:99px;padding:6px 14px;font-size:.92rem;margin:0}

.progress .meter{height:10px;background:var(--line);border-radius:99px;overflow:hidden;margin:8px 0}
.progress .meter span{display:block;height:100%;width:0;background:var(--green2);transition:width .3s}
.field{display:block;font-weight:600;font-size:.95rem;margin:14px 0}
.field input{display:block;width:100%;margin-top:6px;padding:11px 12px;font:inherit;border:1px solid var(--line);border-radius:9px;background:var(--bg);color:var(--ink)}
.field input:focus,.ghost:focus,.btn:focus,a:focus,button:focus{outline:3px solid var(--gold);outline-offset:2px}

.track{margin:30px 0 8px}
.track p{margin:.2em 0 .8em;color:var(--muted)}
.lessons{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:14px}
.lesson-tile{display:flex;gap:14px;align-items:flex-start;text-decoration:none;color:inherit;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:16px}
.lesson-tile:hover{border-color:var(--green2)}
.num{flex:none;width:36px;height:36px;border-radius:50%;background:var(--green);color:var(--bg);display:grid;place-items:center;font-weight:800;font-size:.95rem}
.lesson-tile.done .num{background:var(--ok)}
.lesson-tile h4{margin:0 0 2px;font-size:1.05rem;color:var(--ink)}
.lesson-tile p{margin:0;font-size:.9rem;color:var(--muted)}
.meta{font-size:.8rem;color:var(--muted);margin-top:6px}
.crumb{font-size:.9rem;color:var(--muted)}
.keep{background:var(--tint);border-left:4px solid var(--gold);padding:12px 16px;border-radius:8px;margin:18px 0}
.quiz{border:1px solid var(--line);border-radius:12px;padding:18px;margin:26px 0;background:var(--surface)}
.opts{display:grid;gap:8px;margin-top:10px}
.opt{text-align:left;background:var(--bg);color:var(--ink);border:1px solid var(--line);border-radius:10px;padding:11px 14px;font:inherit;cursor:pointer}
.opt:hover{border-color:var(--green2)}
.opt.good{border-color:var(--ok);background:var(--tint)}
.opt.bad{border-color:var(--bad)}
.why{margin-top:12px;font-weight:600}
.pager{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:28px 0 10px}
.out{margin-top:14px;padding:12px 14px;background:var(--tint);border-radius:10px;min-height:48px}
.out b{color:var(--green)}
.out table{width:100%;border-collapse:collapse}
.out td{padding:4px 0}
.out td:last-child{text-align:right;font-weight:700}
dl{margin:0}
dt{font-weight:800;color:var(--green);margin-top:1.1em}
dd{margin:.15em 0 0}
.foot{margin-top:56px;padding:26px 0;border-top:1px solid var(--line);background:var(--surface)}
.foot p{margin:.3em 0}
.src h3{font-size:1.05rem}
.src p{margin:.3em 0;font-size:.95rem}
@media print{.top,.foot,.cta{display:none}}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0 6px;position:sticky;top:60px;z-index:5;padding:8px 0;background:var(--bg)}
.chip{background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:99px;padding:8px 16px;font:inherit;font-size:.95rem;cursor:pointer}
.chip.on{background:var(--green);color:var(--bg);border-color:var(--green)}
.nblock{margin:10px 0 34px}
.nblock[hidden]{display:none}
.nblock>h2{border-bottom:3px solid var(--gold);padding-bottom:6px;display:inline-block}
.reviewed{font-size:.9rem;color:var(--muted);margin:.2em 0 1em}
.nsec{margin:26px 0 6px}
.nsec h3{margin:0 0 4px}
.nsec .count{font-size:.85rem;color:var(--muted);margin:0 0 10px}
.story{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:16px 18px;margin:0 0 12px}
.story h4{margin:0 0 6px;font-size:1.08rem;line-height:1.3}
.story h4 a{color:var(--green);text-decoration:none}
.story h4 a:hover{text-decoration:underline}
.story p{margin:.3em 0;font-size:.98rem}
.story .by{font-size:.85rem;color:var(--muted);margin-top:8px}
.story .by b{color:var(--ink)}
.matters{font-size:.92rem;background:var(--tint);border-radius:8px;padding:8px 12px;margin-top:8px}
.snap{overflow-x:auto;margin:10px 0}
.snap table{width:100%;border-collapse:collapse;min-width:420px}
.snap th,.snap td{padding:9px 10px;border-bottom:1px solid var(--line);text-align:right;font-size:.95rem}
.snap th:first-child,.snap td:first-child{text-align:left}
.snap th{color:var(--muted);font-size:.8rem;text-transform:uppercase;letter-spacing:.05em}
.up{color:var(--ok);font-weight:700}
.down{color:var(--bad);font-weight:700}
.rm{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
.rm a{display:block;text-decoration:none;color:inherit;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px 16px}
.rm a:hover{border-color:var(--green2)}
.rm strong{color:var(--green);display:block}
.rm span{font-size:.9rem;color:var(--muted)}
.credits{columns:2;column-gap:28px;font-size:.92rem;padding-left:1.1em}
@media (max-width:640px){.credits{columns:1}.filters{top:56px}}
.cal-bar{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}
.cal-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:14px 0 8px}
.cal-top h3{margin:0;font-size:1.3rem}
.cal-nav{display:flex;gap:6px}
.cal-nav button:disabled{opacity:.4;cursor:default}
.cal-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
.cal-dow{font-size:.72rem;color:var(--muted);text-align:center;text-transform:uppercase;letter-spacing:.04em;padding:2px 0}
.cal-day{min-height:84px;background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:4px;text-align:left;font:inherit;color:var(--ink);cursor:pointer;display:flex;flex-direction:column;gap:3px;overflow:hidden;min-width:0}
.cal-day.empty{background:transparent;border:0;cursor:default}
.cal-day.today{border:2px solid var(--gold)}
.cal-day.sel{outline:3px solid var(--green2);outline-offset:1px}
.cal-day .n{font-size:.85rem;font-weight:700}
.pill{font-size:.68rem;line-height:1.25;border-radius:4px;padding:1px 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-left:3px solid;display:block}
.more-n{font-size:.68rem;color:var(--muted)}
.dots{display:none}
.dot{width:7px;height:7px;border-radius:50%;display:inline-block}
.us{--c:#2f6fb5}.global{--c:#7a4fb0}.car{--c:#12857a}.tt{--c:#c8921a}
.pill{border-color:var(--c);background:color-mix(in srgb,var(--c) 16%,transparent)}
.dot{background:var(--c)}
.tag{font-size:.72rem;font-weight:700;padding:2px 9px;border-radius:99px;border:1px solid var(--c);color:var(--ink);background:color-mix(in srgb,var(--c) 14%,transparent);display:inline-block;margin-right:6px}
.agenda{margin-top:18px}
.agenda h4{margin:0 0 8px}
.ag{display:flex;gap:14px;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin:0 0 10px}
.ag.past{opacity:.62}
.agd{flex:none;width:58px;text-align:center;line-height:1.15}
.agd b{display:block;font-size:1.5rem;color:var(--green)}
.agd span{font-size:.75rem;color:var(--muted);text-transform:uppercase}
.ag h5{margin:0 0 3px;font-size:1.02rem}
.ag p{margin:.2em 0;font-size:.93rem}
.ag .src{font-size:.82rem;color:var(--muted)}
.cal-note{font-size:.88rem;color:var(--muted)}
@media (max-width:640px){
  .cal-day{min-height:50px;align-items:center;padding:4px 2px}
  .pill,.more-n{display:none}
  .dots{display:flex;gap:3px;flex-wrap:wrap;justify-content:center}
  .ag{gap:10px;padding:10px}
  .agd{width:48px}
}
.footnav a{color:var(--muted)}
.footnav a:hover{color:var(--green2)}
.glossary .g,#gList .g{margin:0}
#gList dt{scroll-margin-top:80px}
article h2{margin-top:1.4em}
.lesson-tile[hidden],#gList .g[hidden]{display:none}

.level{margin-top:2.2em;padding-top:.8em;border-top:3px solid var(--gold)}
.lvl{margin:.2em 0 .3em}
.plaintable{width:100%;border-collapse:collapse;margin:1em 0;font-size:.95rem}
.plaintable th,.plaintable td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:top}
.plaintable th{color:var(--green);background:var(--tint)}
.qscore{font-weight:700;color:var(--green)}
.quiz+.quiz{margin-top:1em}

/* mobile+dropdown v2 */
html,body{max-width:100%;overflow-x:clip}
img,svg,video,iframe{max-width:100%}
a,li,p,dd,td{overflow-wrap:anywhere}
.lessons{grid-template-columns:repeat(auto-fill,minmax(min(290px,100%),1fr))}
.grid2{grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr))}
.grid3{grid-template-columns:repeat(auto-fit,minmax(min(250px,100%),1fr))}
.rm{grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr))}
.field select{display:block;width:100%;margin-top:6px;padding:11px 12px;font:inherit;border:1px solid var(--line);border-radius:9px;background:var(--bg);color:var(--ink)}
.dd{position:relative;display:flex;align-items:center}
.ddb{background:none;border:0;color:var(--ink);padding:8px;cursor:pointer;font-size:.8rem;border-radius:8px;min-height:36px}
.ddb:hover{background:var(--tint)}
.ddm{display:none;position:absolute;top:100%;left:0;width:min(92vw,380px);max-height:70vh;overflow:auto;background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 32px rgba(0,0,0,.2);padding:8px 10px 12px;z-index:30}
.dd.open .ddm{display:block}
.ddm h4{margin:12px 8px 4px;font-size:.72rem;letter-spacing:.07em;text-transform:uppercase;color:var(--gold)}
.ddm a{display:block;padding:8px 10px;border-radius:8px;font-size:.93rem;line-height:1.3;text-decoration:none;color:var(--ink)}
.ddm a:hover{background:var(--tint)}
@media (hover:hover) and (min-width:1001px){.dd:hover .ddm{display:block}}
.dmbanner{background:var(--gold);color:#1b1500;padding:10px 16px;font-size:.95rem;display:flex;gap:12px;align-items:center;justify-content:space-between}
.dmbanner button{background:#1b1500;color:#fff;border:0;border-radius:8px;padding:8px 12px;font:inherit;cursor:pointer;flex:none}
@media (max-width:1000px){
  .bar{gap:8px}
  nav{margin-top:4px}
  nav a{display:flex;align-items:center;min-height:44px}
  .dd{flex-wrap:wrap}
  .dd>a{flex:1}
  .ddb{min-width:48px;min-height:44px;font-size:1rem}
  .ddm{position:static;width:100%;max-height:55vh;box-shadow:none;margin:2px 0 8px;border-radius:10px}
}
@media (max-width:640px){
  body{font-size:16px}
  .wrap{padding:0 16px}
  .brand{font-size:1rem}
  .hero{padding:34px 0 30px}
  .cta .btn{flex:1 1 100%;text-align:center}
  .pager a{flex:1 1 100%}
  h2{font-size:1.35rem}
  .btn,.ghost,.opt,.chip{min-height:44px}
  .plaintable{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .card,.quiz{padding:14px}
  .lesson-tile{padding:14px}
  .footnav a{display:inline-block;padding:6px 2px}
  .foot{padding-bottom:calc(26px + env(safe-area-inset-bottom))}
}


/* ---- option 5 design (conversion first) ---- */
:root{--paper:#F3F5F8;--deep:#0B3B2C;--acc:#4CD08A;--tint:#D4F3E2;--acc-ink:#161B26;--bg:#F3F5F8;--surface:#FFFFFF;--ink:#161B26;--muted:#465063;--line:#D5DBE3;--green:#0B3B2C;--green2:#14694D;--gold:#4CD08A;--ok:#17724f;--bad:#a63a2b;--radius-m:18px;--shadow:0 1px 2px rgba(0,0,0,.05),0 10px 26px rgba(11,59,44,.08);--display:"Bricolage Grotesque","Segoe UI",system-ui,sans-serif;--body:"Atkinson Hyperlegible","Segoe UI",system-ui,sans-serif}
:root[data-theme="dark"]{--bg:#0d1511;--surface:#16211b;--ink:#EEF3EE;--muted:#A3B3A9;--line:#2A3A31;--green:#E6F2EA;--green2:#6FD0A2;--gold:#4CD08A;--tint:#1B2C23;--shadow:none}
body{font-family:var(--body);font-size:1.0625rem;line-height:1.6}
h1,h2,h3,.brand,.btn{font-family:var(--display)}
h1,h2,h3{font-weight:800;letter-spacing:-.02em}
.top{background:var(--deep);border-bottom:0;color:#fff}
.brand{color:#fff}
.brand-txt{display:flex;flex-direction:column;line-height:1.1}
.tagline{font-family:var(--display);font-weight:800;font-size:1.02rem;letter-spacing:-.01em;color:#fff}
nav a{color:#fff}
nav a:hover{background:rgba(255,255,255,.12)}
nav a[aria-current="page"]{background:var(--acc);color:var(--acc-ink)}
.ddb{color:#fff}
.ddb:hover{background:rgba(255,255,255,.12)}
.ghost{color:#fff;border-color:rgba(255,255,255,.45)}
.hero{background:var(--deep);color:#fff;padding:64px 0 72px;position:relative;overflow:hidden}
.hero::after{content:"";position:absolute;right:-120px;top:-140px;width:420px;height:420px;border-radius:50%;border:56px solid var(--acc);opacity:.13;pointer-events:none}
:root[data-theme="dark"] .hero{background:var(--deep)}
.hero .wrap{position:relative;z-index:1}
.hero h1{font-size:clamp(2.5rem,1.4rem + 5.2vw,4.8rem);line-height:.98;letter-spacing:-.035em;max-width:13ch}
.hero .lead{font-size:clamp(1.1rem,1rem + .5vw,1.3rem);max-width:40ch}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:56px;padding:12px 26px;border-radius:999px;background:var(--acc);color:var(--acc-ink);border:2px solid var(--ink);box-shadow:0 5px 0 var(--ink);font-weight:800;font-size:1.1rem;letter-spacing:-.01em;transition:transform .15s ease,box-shadow .15s ease}
.btn:hover{filter:none;transform:translateY(-2px);box-shadow:0 7px 0 var(--ink)}
.btn:active{transform:translateY(3px);box-shadow:0 2px 0 var(--ink)}
.btn.alt{background:transparent;color:#fff;border:2px solid rgba(255,255,255,.6);box-shadow:none}
.btn.alt:hover{box-shadow:none;background:rgba(255,255,255,.08)}
.hero .btn:not(.alt){border-color:transparent;box-shadow:0 5px 0 rgba(0,0,0,.35)}
.hero .btn:not(.alt):hover{box-shadow:0 7px 0 rgba(0,0,0,.35)}
.hero .small{color:#cfe3d6}
.hero .lead{color:#e3efe7}
.kicker{color:var(--ink)}
.card{border-radius:var(--radius-m);padding:22px;box-shadow:var(--shadow);border-color:var(--line)}
.card.tint{background:var(--tint)}
.grid3 .card h3{font-size:1.25rem}
.notice{background:var(--surface);border:2px solid var(--ink);border-left:2px solid var(--ink);border-radius:var(--radius-m)}
.split{margin:44px 0}
.sec-head h2,.wrap>h2,.split h2{font-size:clamp(1.75rem,1.2rem + 2.2vw,2.6rem);line-height:1.05}
.eyebrow{color:var(--deep)}
.sticky-cta{position:fixed;left:0;right:0;bottom:0;z-index:40;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:color-mix(in srgb,var(--deep) 94%,transparent);transform:translateY(110%);visibility:hidden;transition:transform .25s ease,visibility 0s linear .25s}
.sticky-cta.show{transform:none;visibility:visible;transition:transform .25s ease,visibility 0s}
.sticky-cta .btn{width:100%;box-shadow:none;border-color:transparent;min-height:56px}
@media (min-width:760px){.sticky-cta{display:none}}
@media (max-width:640px){.hero{padding:40px 0 48px}.hero .btn{width:100%}.btn{min-height:52px}body{padding-bottom:84px}}

/* ---- layout + one-line titles ---- */
.brand-txt{display:flex;flex-direction:column;line-height:1.15;gap:2px}
.brand-name{font-family:var(--display);font-weight:800;font-size:1.05rem;white-space:nowrap;color:#fff}
.tagline{font-family:var(--body);font-weight:700;font-size:.8rem;white-space:nowrap;color:var(--acc)}
.hero h1{white-space:nowrap;font-size:clamp(1.9rem,8.2vw,4.8rem);max-width:none}
h2{white-space:nowrap;font-size:clamp(1.2rem,5.4vw,2.4rem);line-height:1.1}
.grid4{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(230px,100%),1fr));gap:18px;margin:26px 0 8px}
.grid4 .card h3{margin-top:.1em}
.grid4 .card h3 a{color:var(--green);text-decoration:none}
.grid4 .card h3 a:hover{text-decoration:underline}

/* ---- Crypto-style dropdown panels ---- */
.ddm.ddp{width:min(92vw,460px);padding:6px 8px 12px}
.ddp-title{margin:10px 10px 6px;font-family:var(--display);font-weight:800;font-size:1rem;color:var(--green)}
.ddpills{display:flex;flex-wrap:wrap;gap:8px;padding:6px 4px 8px}
.ddpills a{display:inline-block;padding:7px 14px;border:1px solid var(--line);border-radius:99px;background:var(--bg);font-weight:700;font-size:.9rem;line-height:1.3}
.ddpills a:hover{background:var(--tint)}
@media (max-width:1000px){.ddm.ddp{width:100%}}

/* ---- full-width header, no logo mark ---- */
.top .wrap.bar{max-width:none;width:100%;margin:0;padding-left:clamp(16px,4vw,48px);padding-right:clamp(16px,4vw,48px)}
.brand{gap:0}

/* ---- dark footer, to match the Link Up house style (31 Oct 2026) ---- */
.foot{background:#161B26;color:#C9D0DC;border-top:0;padding:28px 0 32px;
  padding-bottom:calc(32px + env(safe-area-inset-bottom,0px));font-size:.95rem}
.foot .wrap{text-align:left}
.foot p{color:#C9D0DC;text-align:left;margin:.3em 0}
.foot strong,.foot b{color:#fff}
.foot a{color:#fff;text-decoration:underline}
.foot .footnav a{color:rgba(255,255,255,.82)}
.foot .footnav a:hover{color:var(--acc,#4CD08A)}
.foot .small{color:rgba(255,255,255,.72)}

/* ---- dark footer, higher specificity than linkup-header.css (31 Oct 2026) ----
   linkup-header.css sets html footer.lu-foot{...!important}, so these use
   .foot.lu-foot (two classes) to win. */
html footer.foot.lu-foot{background:#161B26!important;color:#C9D0DC!important;
  border-top:0!important;padding:28px 0 32px!important;
  padding-bottom:calc(32px + env(safe-area-inset-bottom,0px))!important;font-size:.95rem}
html footer.foot.lu-foot .wrap{box-sizing:border-box;max-width:1080px!important;
  margin:0 auto!important;padding-left:20px!important;padding-right:20px!important;
  text-align:left!important;display:block!important}
html footer.foot.lu-foot p{color:#C9D0DC!important;text-align:left!important;
  margin:.3em 0!important;max-width:none!important}
html footer.foot.lu-foot strong,html footer.foot.lu-foot b{color:#fff!important}
html footer.foot.lu-foot a{color:#fff!important;text-decoration:underline}
html footer.foot.lu-foot a:hover{color:var(--acc,#4CD08A)!important}
html footer.foot.lu-foot .small{color:rgba(255,255,255,.72)!important}
html footer.foot.lu-foot .footnav a{color:rgba(255,255,255,.86)!important}

/* ---- header brand onto the group measure (31 Oct 2026) ----
   The band stays full width; the row inside it is capped at the 1080
   measure so the brand lines up with the body text and the footer.
   linkup-header.css sets .lu-bar{max-width:none!important}, so these
   selectors carry more classes in order to win. */
/* Capping the bar at 1080 left this site's long nav no room and the script
   collapsed it to a Menu button on desktop. So the bar stays full width and
   only its LEFT padding is pushed in to the measure: the brand lines up with
   the body text, and the nav keeps the full width to its right. */
html header.top .wrap.bar.lu-bar,html header.top .wrap.bar,
html header.top .lu-bar{box-sizing:border-box!important;
  max-width:none!important;width:100%!important;
  margin-left:0!important;margin-right:0!important;
  padding-left:max(20px,calc(50% - 540px + 20px))!important;
  padding-right:clamp(16px,4vw,48px)!important}

/* ---- stack the brand name over the tagline (31 Oct 2026) ----
   linkup-header.js rewrites the brand into .lu-name + .lu-tagline and
   linkup-header.css lays them out side by side. The group standard stacks
   them, so override that here. */
html header.top .lu-brand{display:flex!important;flex-direction:column!important;
  align-items:flex-start!important;gap:2px!important;flex:none!important;
  line-height:1.15!important;color:#fff!important;text-decoration:none!important}
html header.top .lu-name{margin:0!important;white-space:nowrap;font-weight:800;
  font-size:1.05rem;color:#fff!important}
html header.top .lu-tagline{margin:0!important;white-space:nowrap;font-weight:700;
  font-size:.8rem;color:var(--acc,#4CD08A)!important}

/* ---- one gutter at every width (31 Oct 2026) ----
   A phone media query narrowed .wrap to 16px while the header and footer
   sat at 20px, leaving the brand 4px off the body text. 20px everywhere,
   matching the rest of the group. The header and footer rules above carry
   more classes, so they still win where they differ. */
html .wrap{padding-left:20px!important;padding-right:20px!important}

/* v2 refinements */
.lead{max-width:none}
.wrap.narrow .lead,.wrap .lead{max-width:none}
.ddm h4{color:var(--ink)}
.ddlvl{display:flex;width:100%;justify-content:space-between;align-items:center;gap:10px;background:none;border:0;text-align:left;cursor:pointer;padding:11px 10px;margin:2px 0;border-radius:8px;font:inherit;font-weight:700;font-size:.82rem;letter-spacing:.05em;text-transform:uppercase;color:var(--ink)}
.ddlvl:hover,.ddlvl:focus-visible{background:var(--tint)}
.ddlvl .cnt{font-weight:600;letter-spacing:0;text-transform:none;color:var(--muted);font-size:.78rem}
.ddlvl .arw{transition:transform .15s ease;color:var(--muted);font-size:1rem;line-height:1}
.ddlvl[aria-expanded="true"] .arw{transform:rotate(90deg)}
.ddgrp{margin:0 0 8px 12px;padding-left:8px;border-left:2px solid var(--line)}
.ddgrp[hidden]{display:none}
.ddall{display:block;padding:10px;border-radius:8px;text-decoration:none;color:var(--ink);font-weight:700}
.ddall:hover{background:var(--tint)}
.numwrap{display:flex;flex-direction:column;align-items:center;gap:9px;flex:0 0 auto}
.ico{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--tint);color:var(--green2)}
.ico svg{width:20px;height:20px;display:block}
.lesson-tile:hover .ico{background:var(--green);color:#fff}
.morelink{margin:28px 0 0;padding-top:18px;border-top:1px solid var(--line)}
.morelink a{font-weight:700}
td .srclink{white-space:nowrap}

/* dropdown contrast over shared header */
.lu-hdr .lu-nav .ddm a,
.lu-hdr .lu-nav .ddm .ddlvl,
.lu-hdr .lu-nav .ddm .ddall,
.lu-hdr .lu-nav .ddm .ddp-title,
.lu-hdr .lu-nav .ddm h4{color:var(--ink)!important}
.lu-hdr .lu-nav .ddm .ddlvl .cnt,
.lu-hdr .lu-nav .ddm .ddlvl .arw{color:var(--muted)!important}
.lu-hdr .lu-nav .ddm a:hover{background:var(--tint);color:var(--ink)!important}

/* dropdown group layout */
.ddgrp{display:block}
.lu-hdr .lu-nav .ddm .ddgrp a,
.lu-hdr .lu-nav .ddm .ddall{display:block!important;width:auto!important}

/* heading hierarchy fixes */
.track h3{font-size:1.5rem;letter-spacing:-.01em;margin:0 0 .2em}
.calc h2.calch{font-size:1.15rem;margin:0 0 .35em;letter-spacing:0}

/* dropdown mobile tap targets */
@media (max-width:1000px){
  .ddlvl{min-height:48px;font-size:.88rem}
  .lu-hdr .lu-nav .ddm .ddgrp a{display:flex!important;align-items:center;min-height:44px}
  .ddgrp{margin-left:8px}
}

/* related lessons */
.related{margin:34px 0 10px;padding-top:20px;border-top:1px solid var(--line)}
.related h2{font-size:1.15rem;margin:0 0 12px}
.rel-grid{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr))}
.rel-card{display:flex;gap:10px;align-items:flex-start;text-decoration:none;color:inherit;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:12px}
.rel-card:hover{border-color:var(--green2)}
.rel-num{flex:none;width:26px;height:26px;border-radius:50%;background:var(--tint);color:var(--green2);display:grid;place-items:center;font-weight:800;font-size:.8rem}
.rel-card strong{display:block;font-size:.95rem;line-height:1.25;color:var(--ink)}
.rel-blurb{display:block;margin-top:3px;font-size:.82rem;color:var(--muted);line-height:1.35}

/* glossary links */
a.gl{text-decoration:none;border-bottom:1px dotted var(--green2);color:inherit}
a.gl:hover{color:var(--green2);border-bottom-style:solid}

/* related card clamp */
.rel-card strong{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rel-blurb{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.rel-card{align-items:flex-start}

/* worksheets */
.sheet{margin-top:34px;padding-top:22px;border-top:1px solid var(--line)}
.ws{width:100%;margin:12px 0 18px}
.ws td,.ws th{padding:9px 10px;border:1px solid var(--line);font-size:.95rem}
.ws td.fill{min-width:90px;height:34px;background:var(--tint)}
@media print{
  header,.top,footer,.foot,.dmbanner,#printBtn,.notice,nav,.lu-hdr{display:none!important}
  .sheet{page-break-before:always;border:0}
  .ws td.fill{background:#fff;border:1px solid #999}
  body{background:#fff;color:#000}
  .ws td,.ws th{border:1px solid #999}
  a{text-decoration:none;color:#000}
}

/* assessment links */
.assess{margin:18px 0 26px;padding:14px 16px;border:1px solid var(--green2);border-radius:10px;background:var(--tint)}
.assess a{text-decoration:none;color:var(--ink)}
.assess a:hover strong{text-decoration:underline}

/* toc and key terms */
.toc{margin:22px 0;padding:16px 18px;background:var(--surface);border:1px solid var(--line);border-radius:10px}
.toc-t{margin:0 0 8px;font-size:.78rem;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);font-weight:700}
.toc ol{margin:0;padding-left:20px}
.toc li{margin:4px 0;font-size:.95rem}
.toc a{color:var(--ink);text-decoration:none}
.toc a:hover{color:var(--green2);text-decoration:underline}
.keyterms{margin:0 0 22px;padding:12px 16px;border-left:3px solid var(--green2);background:var(--tint);border-radius:0 8px 8px 0;font-size:.93rem}
.keyterms a{color:var(--green2)}
article.wrap.narrow h2{scroll-margin-top:90px}

/* in-article nav blocks are not the site nav */
nav.toc,nav.related{display:block!important;flex-wrap:initial;gap:initial;align-items:initial}
nav.toc a,nav.related a{display:initial;min-height:0}
nav.related .rel-grid{display:grid}
nav.related .rel-card{display:flex}
nav.toc ol{margin:0;padding-left:22px}

/* ---- home banner art: right-side graph line + notebook ---- */
.hero-home{position:relative;overflow:hidden}
.hero-home::after{content:none;display:none}
.hero-art{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.hero-art svg{position:absolute;inset:0;height:100%;width:100%;display:block}
.hero-home .wrap{position:relative;z-index:1}
@media (max-width:640px){.hero-art{opacity:.55}}

/* ---- keep home banner text off the graph ---- */
@media (min-width:720px){
  .hero.hero-home .lead,.hero.hero-home .small,.hero.hero-home .cta{max-width:min(48%,560px)}
}
