/* Build learning experience v2. Presentation only; lesson data and access gates stay in the existing runtimes. */
:root{--bx-gold:#c89042;--bx-nav:#12100e;--bx-nav-copy:#f4eee5;--bx-nav-muted:#a99f94;--bx-ease:cubic-bezier(.22,.61,.36,1)}
body.build-study-page[data-build-theme="light"]{--bx-bg:#f2ece2;--bx-panel:#fbf7ef;--bx-soft:#e9dfd1;--bx-heading:#1c1713;--bx-copy:#51483f;--bx-muted:#796e63;--bx-line:rgba(66,48,32,.18);--bx-line-strong:rgba(66,48,32,.3);--bx-code:#211b16;--bx-code-copy:#f3eadf;--bg:#f2ece2;--bg-raised:#fbf7ef;--panel:#f7f0e6;--ink:#1c1713;--ink-soft:#51483f;--ink-faint:#796e63;--line:rgba(66,48,32,.18);--accent-line:rgba(200,144,66,.35);--accent-soft:rgba(200,144,66,.1);--good:#2d7654;--good-line:rgba(45,118,84,.35);--good-soft:rgba(45,118,84,.1)}
body.build-study-page[data-build-theme="dark"]{--bx-bg:#15120f;--bx-panel:#1c1814;--bx-soft:#241e19;--bx-heading:#f5eee4;--bx-copy:#d4c9bd;--bx-muted:#a3978a;--bx-line:rgba(242,237,229,.14);--bx-line-strong:rgba(242,237,229,.24);--bx-code:#0f0d0b;--bx-code-copy:#eee4d8;--bg:#15120f;--bg-raised:#14120e;--panel:#12100c;--ink:#f5eee4;--ink-soft:#d4c9bd;--ink-faint:#a3978a;--line:rgba(242,237,229,.14);--accent-line:rgba(232,163,61,.28);--accent-soft:rgba(232,163,61,.08);--good:#7fb89a;--good-line:rgba(127,184,154,.35);--good-soft:rgba(127,184,154,.12)}
html,body.build-study-page{max-width:100%;overflow-x:clip;background:var(--bx-bg)!important}
body.build-study-page{padding-top:0!important;color:var(--bx-copy)!important;font-family:"Instrument Sans",system-ui,sans-serif!important;font-size:16px;line-height:1.68;-webkit-font-smoothing:antialiased}
body.build-study-page::before{position:fixed;z-index:0;inset:0;content:"";pointer-events:none;opacity:.5;background-image:linear-gradient(90deg,color-mix(in srgb,var(--bx-heading) 2%,transparent) 1px,transparent 1px),linear-gradient(color-mix(in srgb,var(--bx-heading) 2%,transparent) 1px,transparent 1px);background-size:24px 24px}
body.build-study-page>nav{position:sticky!important;z-index:100!important;top:0!important;border:0!important;border-bottom:1px solid rgba(255,255,255,.13)!important;background:color-mix(in srgb,var(--bx-nav) 94%,transparent)!important;backdrop-filter:blur(16px)!important}
body.build-study-page>nav .nav-in{display:grid!important;grid-template-columns:1fr auto 1fr!important;align-items:center!important;width:100%!important;max-width:none!important;min-height:68px!important;margin:0!important;padding:0 clamp(20px,4vw,64px)!important}
body.build-study-page .nav-left{display:contents!important}
body.build-study-page .build-nav-actions{grid-column:1;display:flex;align-items:center;gap:20px;justify-self:start}
body.build-study-page .logo{grid-column:2;display:block!important;width:140px!important;height:42px!important;overflow:hidden!important}
body.build-study-page .build-universal-logo{display:block;width:100%;height:100%;object-fit:contain}
body.build-study-page .nav-meta{grid-column:3;display:flex!important;align-items:center!important;justify-self:end;gap:7px!important}
body.build-study-page .menu-btn,body.build-study-page .build-reader-back,body.build-study-page .build-theme-toggle,body.build-study-page .lang-btn,body.build-study-page #logoutBtn{display:inline-flex!important;min-height:40px!important;align-items:center!important;justify-content:center!important;gap:7px!important;margin:0!important;padding:0 10px!important;border:1px solid transparent!important;border-radius:0!important;background:transparent!important;color:var(--bx-nav-muted)!important;font:500 .72rem/1 "Instrument Sans",system-ui,sans-serif!important;box-shadow:none!important;cursor:pointer}
body.build-study-page .menu-btn::before{display:none!important}
body.build-study-page .build-reader-back span{color:var(--bx-gold);font-size:.95rem}
body.build-study-page .build-theme-toggle span{color:var(--bx-gold)}
body.build-study-page .menu-btn:hover,body.build-study-page .build-reader-back:hover,body.build-study-page .build-theme-toggle:hover,body.build-study-page .lang-btn:hover,body.build-study-page #logoutBtn:hover{border-color:rgba(255,255,255,.2)!important;color:var(--bx-nav-copy)!important;transform:none!important}
body.build-study-page.build-project-hub-mode .build-nav-actions{visibility:hidden;pointer-events:none}

/* Light theme must also recolor paywalls and legacy cards, not only the page canvas. */
body.build-study-page[data-build-theme="light"] .locked,
body.build-study-page[data-build-theme="light"] .bk-locked,
body.build-study-page[data-build-theme="light"] .build-access.locked,
body.build-study-page[data-build-theme="light"] .bgate-status.locked {
  border-color:var(--bx-line-strong)!important;
  background:linear-gradient(135deg,#f8f1e6 0%,#e9dfd1 100%)!important;
  color:var(--bx-copy)!important;
}
body.build-study-page[data-build-theme="light"] .locked::before,
body.build-study-page[data-build-theme="light"] .bk-locked::before { opacity:.035!important; }
body.build-study-page[data-build-theme="light"] .locked h2,
body.build-study-page[data-build-theme="light"] .locked h3,
body.build-study-page[data-build-theme="light"] .bk-locked h2,
body.build-study-page[data-build-theme="light"] .bk-locked h3 { color:var(--bx-heading)!important; }
body.build-study-page[data-build-theme="light"] .locked p,
body.build-study-page[data-build-theme="light"] .locked li,
body.build-study-page[data-build-theme="light"] .bk-locked p,
body.build-study-page[data-build-theme="light"] .bk-locked li { color:var(--bx-copy)!important; }
body.build-study-page[data-build-theme="light"] .locked .lock-badge,
body.build-study-page[data-build-theme="light"] .bk-locked .lock-badge { background:#ead2aa!important;color:#684718!important; }

@media (max-width:640px){
  body.build-study-page>nav .nav-in{grid-template-columns:minmax(76px,1fr) 104px minmax(116px,1fr)!important;min-height:58px!important;padding:0 10px!important;gap:6px!important}
  body.build-study-page .build-nav-actions{gap:2px;min-width:0}
  body.build-study-page .build-reader-back,body.build-study-page .menu-btn{width:34px!important;min-height:34px!important;padding:0!important}
  body.build-study-page .build-reader-back b,body.build-study-page .menu-btn{font-size:0!important}
  body.build-study-page .menu-btn::after{content:"☰";font-size:.82rem;color:var(--bx-gold)}
  body.build-study-page .logo{width:104px!important;height:34px!important}
  body.build-study-page .nav-meta{gap:1px!important;min-width:0}
  body.build-study-page .build-theme-toggle,body.build-study-page .lang-btn,body.build-study-page #logoutBtn{min-height:34px!important;padding:0 5px!important;font-size:.56rem!important;white-space:nowrap}
  body.build-study-page .build-theme-toggle b{display:none}
  body.build-study-page #logoutBtn{max-width:42px;overflow:hidden}
}

body.build-study-page .layout,body.build-study-page .bk-shell{position:relative;z-index:1;min-height:calc(100vh - 68px)!important;background:var(--bx-bg)!important}
body.build-study-page.build-project-hub-mode .side,body.build-study-page.build-project-hub-mode .bk-side,body.build-study-page.build-project-hub-mode .main,body.build-study-page.build-project-hub-mode .bk-main,body.build-study-page.build-project-hub-mode .side-backdrop{display:none!important}
body.build-study-page .build-project-hub{display:none}
body.build-study-page.build-project-hub-mode .build-project-hub{display:block;grid-column:1/-1;width:100%;min-width:0;min-height:calc(100vh - 68px);background:var(--bx-bg);color:var(--bx-copy)}
.build-hub-inner{width:min(1280px,100%);margin:0 auto;padding:42px clamp(24px,5vw,72px) 90px}
.build-hub-back{display:inline-flex;min-height:44px;align-items:center;margin-bottom:34px;color:var(--bx-muted)!important;font-size:.78rem;text-decoration:none}
.build-hub-back:hover{color:var(--bx-gold)!important}
.build-hub-hero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(250px,.52fr);gap:clamp(38px,7vw,90px);align-items:end;padding:30px 0 42px;border-bottom:1px solid var(--bx-line)}
.build-hub-kicker,.build-hub-section-head span,.build-hub-rail-card>span,.build-hub-files-head>span{margin:0;color:var(--bx-gold);font:600 .63rem/1.5 "JetBrains Mono",monospace;letter-spacing:.12em;text-transform:uppercase}
.build-hub-title h1{max-width:13ch;margin:13px 0 14px;color:var(--bx-heading);font:550 clamp(3.4rem,6vw,6.4rem)/.88 "Cormorant Garamond",Georgia,serif;letter-spacing:-.06em}
.build-hub-title>p:last-child{max-width:62ch;margin:0;color:var(--bx-copy);font-size:1rem;line-height:1.7}
.build-hub-status{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:center;padding:18px 0;border-top:1px solid var(--bx-line-strong);border-bottom:1px solid var(--bx-line-strong)}
.build-hub-status>span{width:10px;height:10px;border-radius:50%;background:var(--bx-gold);box-shadow:0 0 0 5px color-mix(in srgb,var(--bx-gold) 16%,transparent)}
.build-hub-status div{display:grid;gap:4px}.build-hub-status b{color:var(--bx-heading);font-size:.8rem}.build-hub-status small{color:var(--bx-muted);font:500 .61rem/1.3 "JetBrains Mono",monospace;text-transform:uppercase}
.build-hub-actions{display:flex;flex-wrap:wrap;gap:12px;padding:24px 0 34px}
.build-hub-primary,.build-hub-secondary{display:inline-flex;min-height:48px;align-items:center;justify-content:center;gap:28px;padding:0 18px;border:1px solid var(--bx-heading);border-radius:0;font:650 .78rem/1 "Instrument Sans",sans-serif;text-decoration:none;cursor:pointer}
.build-hub-primary{background:var(--bx-heading);color:var(--bx-bg)}.build-hub-primary:hover{border-color:var(--bx-gold);background:var(--bx-gold);color:#1c1713}.build-hub-secondary{background:transparent;color:var(--bx-heading)!important}
.build-hub-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,320px);gap:clamp(34px,5vw,68px);align-items:start;padding-top:36px;border-top:1px solid var(--bx-line)}
.build-hub-section-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(210px,.55fr);gap:28px;align-items:end;margin-bottom:22px}
.build-hub-section-head h2{max-width:14ch;margin:8px 0 0;color:var(--bx-heading);font:550 clamp(2.3rem,3.5vw,3.65rem)/.94 "Cormorant Garamond",Georgia,serif;letter-spacing:-.045em}
.build-hub-section-head p{margin:0;color:var(--bx-muted);font-size:.82rem;line-height:1.65}
.build-hub-phase{border-top:1px solid var(--bx-line-strong)}.build-hub-phase:last-child{border-bottom:1px solid var(--bx-line-strong)}
.build-hub-phase>summary{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:18px;align-items:center;min-height:58px;padding:10px 2px;color:var(--bx-heading);cursor:pointer;list-style:none}.build-hub-phase>summary::-webkit-details-marker{display:none}.build-hub-phase>summary span{font:600 1.2rem/1.15 "Cormorant Garamond",Georgia,serif}.build-hub-phase>summary small{color:var(--bx-muted);font:500 .57rem/1.3 "JetBrains Mono",monospace;text-transform:uppercase}.build-hub-phase>summary::after{content:"+";color:var(--bx-gold);font-size:1.15rem}.build-hub-phase[open]>summary::after{content:"−"}
.build-hub-phase-list{padding:0 0 14px}.build-hub-module{display:grid;width:100%;grid-template-columns:34px minmax(0,1fr) auto;gap:14px;align-items:center;min-height:64px;padding:10px 12px;border:0;border-top:1px solid var(--bx-line);background:color-mix(in srgb,var(--bx-panel) 45%,transparent);color:var(--bx-heading);text-align:left;cursor:pointer}.build-hub-module:hover{background:var(--bx-panel)}.build-hub-module-num{color:var(--bx-gold);font:600 .58rem/1 "JetBrains Mono",monospace}.build-hub-module-copy{display:grid;gap:3px}.build-hub-module-copy strong{font-size:.82rem;font-weight:650}.build-hub-module-copy small{color:var(--bx-muted);font-size:.69rem;line-height:1.4}.build-hub-module-state{display:inline-flex;align-items:center;gap:8px;color:var(--bx-gold);font:600 .54rem/1 "JetBrains Mono",monospace;text-transform:uppercase}.build-hub-module-state i{font-style:normal;font-size:.8rem}
.build-hub-rail{position:sticky;top:96px;display:grid;gap:16px}.build-hub-rail-card,.build-hub-rail #buildHubFiles{padding:23px;border:1px solid var(--bx-line-strong);background:var(--bx-panel);color:var(--bx-copy)}.build-hub-rail h3{margin:9px 0 10px;color:var(--bx-heading);font:600 1.65rem/1 "Cormorant Garamond",Georgia,serif}.build-hub-rail p{margin:0;color:var(--bx-muted);font-size:.77rem;line-height:1.65}.build-hub-files-head{margin-bottom:13px}

/* Focused Build reader, matched to the Bundle study-room proportions. */
body.build-study-page.build-project-reader-mode .layout,body.build-study-page.build-project-reader-mode .bk-shell{display:block!important}
body.build-study-page.build-project-reader-mode .side,body.build-study-page.build-project-reader-mode .bk-side{position:fixed!important;z-index:95!important;top:68px!important;left:0!important;width:min(390px,92vw)!important;height:calc(100vh - 68px)!important;padding:32px!important;overflow-y:auto!important;border:0!important;border-right:1px solid var(--bx-line)!important;background:var(--bx-panel)!important;color:var(--bx-copy)!important;transform:translateX(-103%)!important;transition:transform .22s var(--bx-ease)!important;box-shadow:18px 0 52px rgba(0,0,0,.28)!important}
body.build-study-page.build-project-reader-mode .side.open,body.build-study-page.build-project-reader-mode .bk-side.open{transform:translateX(0)!important}
body.build-study-page.build-project-reader-mode .side-backdrop{position:fixed!important;z-index:90!important;inset:68px 0 0!important;background:rgba(0,0,0,.45)!important}
body.build-study-page.build-project-reader-mode .main,body.build-study-page.build-project-reader-mode .bk-main{width:100%!important;max-width:none!important;margin:0!important;padding:58px clamp(24px,8vw,128px) 110px!important;background:var(--bx-bg)!important;color:var(--bx-copy)!important}
body.build-study-page.build-project-reader-mode .article,body.build-study-page.build-project-reader-mode .bk-reader,body.build-study-page.build-project-reader-mode .bk-article{width:100%!important;max-width:900px!important;margin:0 auto!important;padding:0!important;color:var(--bx-copy)!important}
body.build-study-page.build-project-reader-mode .article{padding:clamp(22px,3vw,34px)!important;border:1px solid var(--bx-line)!important;border-radius:14px!important;background:var(--bx-panel)!important;box-shadow:0 18px 45px rgba(0,0,0,.08)!important}
body.build-study-page .article h1,body.build-study-page .bk-reader h1,body.build-study-page .bk-article h1{max-width:18ch!important;margin:14px 0 22px!important;color:var(--bx-heading)!important;font:550 clamp(2.8rem,5vw,4.8rem)/.94 "Cormorant Garamond",Georgia,serif!important;letter-spacing:-.05em!important}
body.build-study-page .article h2,body.build-study-page .bk-reader h2,body.build-study-page .bk-article h2{max-width:26ch!important;margin:0 0 18px!important;padding:0!important;border:0!important;color:var(--bx-heading)!important;font:600 clamp(1.85rem,3vw,2.75rem)/1 "Cormorant Garamond",Georgia,serif!important;letter-spacing:-.04em!important}
body.build-study-page .article h3,body.build-study-page .bk-reader h3,body.build-study-page .bk-article h3{margin:0 0 12px!important;color:var(--bx-heading)!important;font:600 clamp(1.28rem,2vw,1.7rem)/1.15 "Cormorant Garamond",Georgia,serif!important}
body.build-study-page .article p,body.build-study-page .article li,body.build-study-page .article td,body.build-study-page .article th,body.build-study-page .bk-reader p,body.build-study-page .bk-reader li,body.build-study-page .bk-article p,body.build-study-page .bk-article li{color:var(--bx-copy)!important;font-size:.96rem!important;line-height:1.74!important}
body.build-study-page .article .section,body.build-study-page .article .sec,body.build-study-page .bk-sec{margin:0!important;padding:42px 0!important;border:0!important;border-bottom:1px solid var(--bx-line)!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;color:var(--bx-copy)!important}
body.build-study-page .bk-article-head,body.build-study-page .phase-hero{margin:0 0 14px!important;padding:0 0 38px!important;border:0!important;border-bottom:1px solid var(--bx-line)!important;background:transparent!important}
body.build-study-page .toc-mini{margin:0 0 28px!important;border:1px solid var(--bx-line)!important;border-radius:12px!important;background:var(--bx-bg)!important;color:var(--bx-copy)!important}
body.build-study-page .toc-mini .toc-head{border-color:var(--bx-line)!important;background:var(--bx-soft)!important}
body.build-study-page .toc-mini h3,body.build-study-page .toc-mini .toc-title{color:var(--bx-heading)!important}
body.build-study-page .toc-mini p,body.build-study-page .toc-mini .toc-h2{color:var(--bx-copy)!important}
body.build-study-page .toc-mini .toc-num{border-color:var(--bx-line-strong)!important;background:var(--bx-panel)!important;color:var(--bx-gold)!important}
body.build-study-page .eyebrow,body.build-study-page .kicker,body.build-study-page .bk-track-banner{color:var(--bx-gold)!important;font-family:"JetBrains Mono",monospace!important;font-size:.61rem!important;font-weight:600!important;letter-spacing:.1em!important;text-transform:uppercase!important}
body.build-study-page pre,body.build-study-page code{max-width:100%!important;overflow-x:auto!important;border-color:var(--bx-line-strong)!important;background:var(--bx-code)!important;color:var(--bx-code-copy)!important}
body.build-study-page blockquote,body.build-study-page .callout,body.build-study-page .bk-ai,body.build-study-page .note-card,body.build-study-page .prompt-card{border:1px solid var(--bx-line-strong)!important;border-left:2px solid var(--bx-gold)!important;border-radius:10px!important;background:var(--bx-panel)!important;color:var(--bx-copy)!important}
body.build-study-page table{width:100%!important;border-collapse:collapse!important;background:transparent!important;color:var(--bx-copy)!important}body.build-study-page th{background:var(--bx-soft)!important;color:var(--bx-heading)!important}body.build-study-page td,body.build-study-page th{padding:11px 12px!important;border:1px solid var(--bx-line)!important}
body.build-study-page a{color:var(--bx-gold)!important}
body.build-study-page button:focus-visible,body.build-study-page a:focus-visible{outline:2px solid var(--bx-gold)!important;outline-offset:3px!important}

@media(max-width:820px){.build-hub-hero,.build-hub-grid,.build-hub-section-head{grid-template-columns:1fr}.build-hub-rail{position:static;grid-row:1}.build-hub-status{max-width:420px}body.build-study-page .build-theme-toggle b{display:none}}
@media(max-width:620px){body.build-study-page>nav .nav-in{min-height:62px!important;padding:0 14px!important}body.build-study-page .logo{width:108px!important;height:35px!important}body.build-study-page .nav-meta{gap:0!important}body.build-study-page .build-nav-actions{gap:4px}body.build-study-page .build-reader-back b,body.build-study-page #logoutBtn{display:none!important}body.build-study-page .menu-btn,body.build-study-page .build-reader-back,body.build-study-page .build-theme-toggle,body.build-study-page .lang-btn{min-width:38px!important;padding:0 7px!important;font-size:.66rem!important}.build-hub-inner{padding:28px 18px 70px}.build-hub-back{margin-bottom:18px}.build-hub-hero{gap:26px;padding:18px 0 32px}.build-hub-title h1{font-size:clamp(3.1rem,16vw,4.7rem)}.build-hub-actions{align-items:stretch;flex-direction:column}.build-hub-primary,.build-hub-secondary{width:100%}.build-hub-grid{gap:30px}.build-hub-module{grid-template-columns:28px minmax(0,1fr)}.build-hub-module-state{grid-column:2}.build-hub-phase>summary{grid-template-columns:minmax(0,1fr) auto}.build-hub-phase>summary small{display:none}.build-hub-phase>summary::after{grid-column:2}body.build-study-page.build-project-reader-mode .side,body.build-study-page.build-project-reader-mode .bk-side{top:62px!important;height:calc(100vh - 62px)!important}body.build-study-page.build-project-reader-mode .side-backdrop{inset:62px 0 0!important}body.build-study-page.build-project-reader-mode .main,body.build-study-page.build-project-reader-mode .bk-main{padding:42px 20px 72px!important}body.build-study-page .article h1,body.build-study-page .bk-reader h1,body.build-study-page .bk-article h1{font-size:clamp(2.65rem,13vw,4rem)!important}body.build-study-page .article .section,body.build-study-page .article .sec,body.build-study-page .bk-sec{padding:34px 0!important}}
@media(prefers-reduced-motion:reduce){body.build-study-page *{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}

/* Canonical mobile reader header: back, brand, controls occupy independent slots.
   Keep this override last so older max-width rules cannot re-enable the long menu label. */
@media (max-width: 640px){
  body.build-study-page>nav .nav-in{
    grid-template-columns:minmax(74px,1fr) minmax(82px,1fr) minmax(96px,auto)!important;
    min-height:58px!important;
    padding:0 10px!important;
    gap:6px!important;
  }
  body.build-study-page .build-nav-actions{
    grid-column:1!important;
    display:flex!important;
    align-items:center!important;
    justify-self:start!important;
    gap:4px!important;
    min-width:0!important;
    width:100%!important;
  }
  body.build-study-page .build-reader-back,
  body.build-study-page .menu-btn{
    flex:0 0 38px!important;
    width:38px!important;
    min-width:38px!important;
    min-height:38px!important;
    height:38px!important;
    padding:0!important;
    white-space:nowrap!important;
    overflow:hidden!important;
  }
  body.build-study-page .build-reader-back b,
  body.build-study-page .menu-btn{
    font-size:0!important;
  }
  body.build-study-page .build-reader-back span,
  body.build-study-page .build-reader-back::before{
    font-size:.9rem!important;
    margin:0!important;
  }
  body.build-study-page .menu-btn::after{
    content:"☰"!important;
    display:block!important;
    font-size:.82rem!important;
    line-height:1!important;
    color:var(--bx-gold)!important;
  }
  body.build-study-page .logo{
    grid-column:2!important;
    justify-self:center!important;
    width:96px!important;
    height:32px!important;
    max-width:100%!important;
  }
  body.build-study-page .nav-meta{
    grid-column:3!important;
    justify-self:end!important;
    display:flex!important;
    align-items:center!important;
    gap:6px!important;
    min-width:0!important;
  }
  body.build-study-page .build-theme-toggle,
  body.build-study-page .lang-btn{
    min-height:38px!important;
    height:38px!important;
    padding:0!important;
    font-size:.62rem!important;
    white-space:nowrap!important;
    overflow:visible!important;
  }
  body.build-study-page .build-theme-toggle{
    flex:0 0 38px!important;
    width:38px!important;
    min-width:38px!important;
  }
  body.build-study-page .lang-btn{
    flex:0 0 52px!important;
    width:52px!important;
    min-width:52px!important;
    letter-spacing:.01em!important;
  }
  body.build-study-page .build-theme-toggle b{display:none!important}
  body.build-study-page #logoutBtn{display:none!important}
}

/* Light-mode content surfaces: legacy lesson rules were authored for the ink theme
   (black panels + cream copy). Re-map every instructional surface to the paper
   palette so text and background always have a deliberate contrast pair. Code
   blocks remain ink surfaces and keep their light monospace copy below. */
body.build-study-page[data-build-theme="light"] :where(
  .bk-anat:not(.bk-anat--meta),.bk-sub,.bk-check>li,.bk-quote,.bk-map-outcomes,
  .bk-map-table-wrap,.toc-mini,.access,.zip-box,.next-bar,
  .phase-hero,.callout,.locked,.bk-locked,.bk-lock
){
  background:var(--bx-panel)!important;
  color:var(--bx-copy)!important;
  border-color:var(--bx-line-strong)!important;
}
/* Reader sections and data tables stay on the paper surface in light mode.
   The dark-theme shadows are removed so ink text never sits on a grey wash. */
body.build-study-page[data-build-theme="light"] .bk-sec{
  background:var(--bx-panel)!important;
  border-color:var(--bx-line-strong)!important;
  box-shadow:none!important;
}
body.build-study-page[data-build-theme="light"] :where(.bk-sub,.bk-table-wrap,.bk-check>li,.bk-sec-body .bk-list>li,.bk-sec-body ul:not(.bk-check)>li,.bk-sec-body ol>li){
  background:transparent!important;
  border-color:var(--bx-line)!important;
  color:var(--bx-copy)!important;
}
body.build-study-page[data-build-theme="light"] .bk-sec-body :where(th){
  background:var(--bx-soft)!important;
  color:var(--bx-heading)!important;
}
body.build-study-page[data-build-theme="light"] .bk-sec-body :where(td){
  background:transparent!important;
  color:var(--bx-copy)!important;
}

/* Give every instructional outline a calm reading gutter. This applies to
   both themes and keeps nested tables/cards from touching their parent edge. */
body.build-study-page .bk-reader{max-width:min(100%,60rem)!important}
body.build-study-page .bk-sec{padding-left:clamp(32px,4vw,48px);padding-right:clamp(32px,4vw,48px)}
body.build-study-page :where(.bk-anat,.bk-sub,.bk-ai,.bk-practice-note){padding-left:clamp(20px,2.4vw,28px);padding-right:clamp(20px,2.4vw,28px)}
body.build-study-page .bk-anat--meta{padding-left:0;padding-right:0}
body.build-study-page :where(.bk-table-wrap,.bk-map-table-wrap){margin-left:4px;margin-right:4px}
@media(max-width:640px){
  body.build-study-page .bk-sec{padding-left:22px;padding-right:22px}
  body.build-study-page :where(.bk-anat,.bk-sub,.bk-ai,.bk-practice-note){padding-left:18px;padding-right:18px}
  body.build-study-page :where(.bk-table-wrap,.bk-map-table-wrap){margin-left:2px;margin-right:2px}
}
body.build-study-page[data-build-theme="light"] :where(
  .bk-anat:not(.bk-anat--meta),.bk-sub,.bk-check>li,.bk-quote,.bk-map-outcomes,
  .toc-mini,.access,.zip-box,.next-bar,.phase-hero,.callout,
  .locked,.bk-locked,.bk-lock
) :where(h2,h3,h4,h5,b,strong,label,.co-label,.ph-code){color:var(--bx-heading)!important}
body.build-study-page[data-build-theme="light"] :where(
  .bk-anat:not(.bk-anat--meta),.bk-sub,.bk-check>li,.bk-quote,.bk-map-outcomes,
  .toc-mini,.access,.zip-box,.next-bar,.phase-hero,.callout,
  .locked,.bk-locked,.bk-lock
) :where(p,li,span,div,td,th){color:var(--bx-copy)!important}
body.build-study-page[data-build-theme="light"] :where(.bk-map-table-wrap,.toc-mini) :where(th,.toc-head){background:var(--bx-soft)!important;color:var(--bx-heading)!important}
body.build-study-page[data-build-theme="light"] .bk-anat--meta :where(.bk-anat-chip){
  background:var(--bx-soft)!important;color:var(--bx-heading)!important;border-color:var(--bx-line-strong)!important
}
body.build-study-page[data-build-theme="light"] :where(.bk-ai,.bk-practice-note){
  background:var(--bx-soft)!important;color:var(--bx-copy)!important;border-color:rgba(45,118,84,.42)!important
}
body.build-study-page[data-build-theme="light"] :where(.bk-ai,.bk-practice-note) :where(h2,h3,h4,h5,b,strong,.bk-h-ai,.bk-h-practice-note){color:var(--bx-heading)!important}
body.build-study-page[data-build-theme="light"] :where(.bk-ai,.bk-practice-note) :where(p,li,span,div){color:var(--bx-copy)!important}
body.build-study-page[data-build-theme="light"] :where(.bk-ai,.bk-practice-note) :where(pre,.bk-code-wrap pre),
body.build-study-page[data-build-theme="light"] :where(pre){background:var(--bx-code)!important;color:var(--bx-code-copy)!important;border-color:var(--bx-line-strong)!important}
body.build-study-page[data-build-theme="light"] :where(pre) :where(code,span){color:var(--bx-code-copy)!important;background:transparent!important}
body.build-study-page[data-build-theme="light"] :where(code:not(pre code)){background:var(--bx-soft)!important;color:var(--bx-heading)!important;border-color:var(--bx-line-strong)!important}

/* Shared support blocks — every lesson ends with one clear next action. */
body.build-study-page .tw-practice-support{margin:34px 0 12px!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;color:var(--bx-copy)!important}
body.build-study-page .tw-practice-title{margin:0!important;padding:0 0 12px!important;border-bottom:1px solid var(--bx-line-strong)!important;color:var(--bx-heading)!important;font:600 clamp(1.45rem,2.5vw,2.05rem)/1.1 "Cormorant Garamond",Georgia,serif!important}
body.build-study-page .tw-practice-note{margin:16px 0!important;padding:12px 14px!important;border:1px solid rgba(45,118,84,.42)!important;border-radius:10px!important;background:color-mix(in srgb,var(--bx-soft) 74%,transparent)!important;color:var(--bx-copy)!important}
body.build-study-page .tw-practice-note-label,body.build-study-page .tw-practice-eyebrow{color:var(--bx-gold)!important;font:600 .62rem/1.4 "JetBrains Mono",monospace!important;letter-spacing:.1em;text-transform:uppercase}
body.build-study-page .tw-practice-note p{margin:5px 0 0!important;color:var(--bx-copy)!important;font-size:.9rem!important;line-height:1.55!important}
body.build-study-page .tw-practice-card{margin:0!important;padding:20px 22px!important;border:1px solid rgba(45,118,84,.55)!important;border-radius:12px!important;background:color-mix(in srgb,var(--bx-panel) 88%,#07110c)!important;color:var(--bx-copy)!important}
body.build-study-page .tw-practice-card p{margin:0 0 14px!important;color:var(--bx-copy)!important;font-size:.92rem!important;line-height:1.65!important}
body.build-study-page .tw-practice-step-label{display:block;margin:0 0 6px;color:var(--bx-muted)!important;font-size:.78rem!important}
body.build-study-page .tw-practice-step{display:block;width:100%;min-height:44px;margin:0 0 16px;padding:9px 11px;border:1px solid var(--bx-line-strong);border-radius:8px;background:var(--bx-bg);color:var(--bx-copy);font:inherit;font-size:.86rem}
body.build-study-page .tw-practice-step:focus-visible{outline:2px solid var(--bx-gold);outline-offset:2px}
body.build-study-page .tw-practice-list{margin:0 0 14px!important;padding-left:1.4rem!important;color:var(--bx-copy)!important}
body.build-study-page .tw-practice-list li{margin:0 0 8px!important;padding-left:3px!important;color:var(--bx-copy)!important;font-size:.9rem!important;line-height:1.6!important}
body.build-study-page .tw-practice-prompt-wrap{margin:18px 0 0;padding:14px 16px;border:1px solid var(--bx-line-strong);border-radius:10px;background:color-mix(in srgb,var(--bx-bg) 86%,#000)}
body.build-study-page .tw-practice-prompt{margin:8px 0 10px!important;padding:13px 14px!important;min-height:160px;white-space:pre-wrap;word-break:break-word;overflow:auto;border:1px solid var(--bx-line-strong)!important;border-radius:9px!important;background:var(--bx-code)!important;color:var(--bx-code-copy)!important;font:500 .78rem/1.6 "JetBrains Mono",monospace!important}
body.build-study-page .tw-practice-check{display:flex;gap:8px;align-items:flex-start;margin:0 0 12px;padding:9px 11px;border:1px solid rgba(45,118,84,.42);border-radius:8px;background:rgba(45,118,84,.1);color:var(--bx-copy);font-size:.8rem;line-height:1.5}
body.build-study-page .tw-practice-check>span:first-child{flex:none;color:#2d7654;font-weight:700}
body.build-study-page .tw-practice-actions{display:flex;align-items:center;gap:10px;justify-content:flex-end}
body.build-study-page .tw-practice-copy{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 16px;border:0;border-radius:8px;background:var(--bx-gold);color:#1c1713;font:650 .82rem/1 "Instrument Sans",sans-serif;cursor:pointer}
body.build-study-page .tw-practice-copy:hover{filter:brightness(1.07)}
body.build-study-page .tw-practice-copy:focus-visible{outline:2px solid var(--bx-heading);outline-offset:2px}
body.build-study-page .tw-practice-copied{color:#2d7654;font-size:.78rem;font-weight:600}
body.build-study-page .tw-practice-after,body.build-study-page .tw-practice-next{margin:14px 0 0!important;color:var(--bx-copy)!important;font-size:.86rem!important;line-height:1.6!important}
body.build-study-page .tw-practice-next{margin-top:8px!important;color:var(--bx-muted)!important}
body.build-study-page .tw-practice-after sup{color:var(--bx-gold);font-weight:700}
body.build-study-page[data-build-theme="dark"] .tw-practice-card{background:#08110d!important}
body.build-study-page[data-build-theme="dark"] .tw-practice-prompt-wrap{background:#0d0d0b!important}
body.build-study-page[data-build-theme="light"] .tw-practice-card{background:#f8f3ea!important;border-color:rgba(45,118,84,.5)!important}
body.build-study-page[data-build-theme="light"] .tw-practice-note{background:#edf5ef!important}
body.build-study-page[data-build-theme="light"] .tw-practice-prompt-wrap{background:#f4eee4!important}
body.build-study-page[data-build-theme="light"] .tw-practice-step{background:#fffaf2!important;color:var(--bx-heading)!important}
@media(max-width:640px){body.build-study-page .tw-practice-card{padding:16px 15px!important}body.build-study-page .tw-practice-actions{justify-content:stretch}body.build-study-page .tw-practice-copy{width:100%}}

/* Practice callouts also used the dark ink surface. In light mode make them
   paper cards with dark copy; only their code blocks remain ink-colored. */
body.build-study-page[data-build-theme="light"] .bk-practice{
  background:var(--bx-panel)!important;
  color:var(--bx-copy)!important;
  border-color:var(--bx-line-strong)!important;
  box-shadow:none!important;
}
body.build-study-page[data-build-theme="light"] .bk-practice :where(h2,h3,h4,h5,b,strong){color:var(--bx-heading)!important}
body.build-study-page[data-build-theme="light"] .bk-practice :where(p,li,span,div){color:var(--bx-copy)!important}
body.build-study-page[data-build-theme="light"] .bk-practice :where(.bk-list>li,ul:not(.bk-check)>li,ol>li){background:transparent!important;border-color:var(--bx-line)!important}
body.build-study-page[data-build-theme="light"] .bk-practice :where(pre,.bk-code-wrap pre){background:var(--bx-code)!important;color:var(--bx-code-copy)!important}
/* Widgets (knowledge checks, chapter quizzes, and flow cards) have their own
   dark fallback background. Remap their instructional surfaces in light mode
   so every question and answer stays white with dark ink. */
body.build-study-page[data-build-theme="light"] .tw{
  background:var(--bx-panel)!important;
  color:var(--bx-copy)!important;
  border-color:var(--bx-line-strong)!important;
}
body.build-study-page[data-build-theme="light"] :where(.tw-kc-stem,.tw-kc-choice,.tw-cq-choice,.tw-kc-feedback,.tw-cq-explain,.tw-cq-review,.tw-cq-review-choice,.tw-pp-stage,.tw-rv-a,.tw-fc-card,.tw-pc-row>div){
  background:transparent!important;
  color:var(--bx-copy)!important;
  border-color:var(--bx-line)!important;
}
body.build-study-page[data-build-theme="light"] :where(.tw-kc-stem,.tw-kc-choice,.tw-cq-choice,.tw-kc-feedback,.tw-cq-explain,.tw-cq-review) :where(h2,h3,h4,h5,b,strong){color:var(--bx-heading)!important}
body.build-study-page[data-build-theme="light"] :where(.tw-kc-stem,.tw-kc-choice,.tw-cq-choice,.tw-kc-feedback,.tw-cq-explain,.tw-cq-review) :where(p,span,em,div){color:var(--bx-copy)!important}
body.build-study-page[data-build-theme="light"] :where(.tw-kc-choice:hover:not(:disabled),.tw-cq-choice:hover:not(:disabled)){background:var(--bx-soft)!important}
body.build-study-page[data-build-theme="light"] :where(.tw-kc-progress span,.tw-cq-progress span){background:var(--bx-line)!important}
body.build-study-page[data-build-theme="light"] :where(.tw-ba-stage,.tw-pp-stage pre,.tw-code-wrap pre,.tw pre){background:var(--bx-code)!important;color:var(--bx-code-copy)!important}

/* Phase 0 explanatory illustrations. Keep the bitmap quiet and let the
   localized legend do the teaching; theme-specific assets avoid unreadable
   dark ink on the light reader surface. */
body.build-study-page .bk-material-visual{
  margin:clamp(20px,3vw,32px) 0 clamp(26px,4vw,40px);
  padding:clamp(16px,2.4vw,26px);
  border:1px solid var(--bx-line-strong);
  border-radius:14px;
  background:var(--bx-panel);
  color:var(--bx-copy);
}
body.build-study-page .bk-material-visual-head{display:flex;align-items:baseline;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:12px}
body.build-study-page .bk-material-visual-kicker{font-family:var(--font-mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}
body.build-study-page .bk-material-visual-head strong{font-family:var(--font-serif);font-size:1.18rem;font-weight:500;color:var(--bx-heading)}
body.build-study-page .bk-material-visual-media{display:block;overflow:hidden;border:1px solid var(--bx-line);border-radius:10px;background:var(--bx-bg)}
body.build-study-page .bk-material-visual-img{display:block;width:100%;height:auto;aspect-ratio:4 / 3;object-fit:cover}
body.build-study-page .bk-material-visual-img--dark{display:none}
body.build-study-page[data-build-theme="dark"] .bk-material-visual-img--light{display:none}
body.build-study-page[data-build-theme="dark"] .bk-material-visual-img--dark{display:block}
body.build-study-page .bk-material-visual-legend{display:flex;flex-wrap:wrap;gap:8px 14px;margin:12px 0 8px;font-family:var(--font-mono);font-size:.67rem;letter-spacing:.04em;color:var(--bx-muted)}
body.build-study-page .bk-material-visual-key{display:inline-flex;align-items:center;gap:6px}
body.build-study-page .bk-material-visual-dot{display:inline-grid;place-items:center;width:18px;height:18px;border:1px solid var(--accent-line);border-radius:50%;color:var(--accent);font-size:.58rem;line-height:1}
body.build-study-page .bk-material-visual figcaption{margin:0;color:var(--bx-copy);font-size:.82rem;line-height:1.58;max-width:72ch}
@media(max-width:640px){
  body.build-study-page .bk-material-visual{padding:14px 12px;margin:20px 0 26px}
  body.build-study-page .bk-material-visual-head{display:block;margin-bottom:10px}
  body.build-study-page .bk-material-visual-head strong{display:block;margin-top:4px;font-size:1.08rem}
  body.build-study-page .bk-material-visual-legend{gap:7px 11px;font-size:.62rem}
  body.build-study-page .bk-material-visual figcaption{font-size:.78rem}
}

/* Website Making keeps a fixed 66px chrome on mobile; keep the hub back link
   in the first reachable viewport instead of underneath that chrome. */
@media (max-width:620px){
  body.build-study-page[data-build-project="website"].build-project-hub-mode .build-hub-inner{padding-top:86px}
}

/* Website hub: show the three simple learning shelves before the phase rows. */
body.build-study-page[data-build-project="website"] .build-hub-category{margin-top:28px}
body.build-study-page[data-build-project="website"] .build-hub-category:first-child{margin-top:0}
body.build-study-page[data-build-project="website"] .build-hub-category-head{
  display:flex;align-items:baseline;justify-content:space-between;gap:16px;
  padding:0 2px 10px;border-bottom:1px solid var(--bx-line-strong)
}
body.build-study-page[data-build-project="website"] .build-hub-category-head span{
  color:var(--bx-gold);font:600 .68rem/1.4 "JetBrains Mono",monospace;
  letter-spacing:.12em;text-transform:uppercase
}
body.build-study-page[data-build-project="website"] .build-hub-category-head small{
  color:var(--bx-muted);font:500 .58rem/1.3 "JetBrains Mono",monospace;text-transform:uppercase
}
body.build-study-page[data-build-project="website"] .build-hub-category--additional .build-hub-category-head,
body.build-study-page[data-build-project="website"] .build-hub-category--maintenance .build-hub-category-head{padding-top:4px}
@media(max-width:620px){
  body.build-study-page[data-build-project="website"] .build-hub-category{margin-top:24px}
  body.build-study-page[data-build-project="website"] .build-hub-category-head{padding-bottom:9px}
  body.build-study-page[data-build-project="website"] .build-hub-category-head span{font-size:.62rem}
}
