@import url('https://fonts.googleapis.com/css2?family=Atkinson+Hyperlegible:wght@400;700&family=Bitter:wght@500;600;700&display=swap');

/* Shared learning layout; old public anchors and the site chrome remain intact. */
:root{--bg:#f7f9fb;--fg:#223442;--accent:#234f6d;--muted:#526778;--border:#d6e0e8;--code-bg:#f0f4f7;--th-bg:#e9f0f5;--row:#f7fafc;--surface:#fff;--surface-hover:#edf3f7;--border-strong:#92a9ba;--text-primary:#223442;--text-secondary:#526778;--text-muted:#647789;--primary:#234f6d;--bg-alt:#edf3f7;--bp-ink:#223442;--bp-surface:#fff;--bp-accent-soft:#e9f0f5;--bp-brand-soft:#edf3f7}
body.guide-student{background:radial-gradient(ellipse at 12% 0,#e8eff5,transparent 48%),var(--bg);color:var(--fg);font-family:'Atkinson Hyperlegible',Verdana,sans-serif;line-height:1.75;font-size:17px}
body.guide-student h1,body.guide-student h2,body.guide-student h3{font-family:'Bitter',Georgia,serif;color:var(--fg)}
body.guide-student .wrap{max-width:1040px;padding-top:40px}
body.guide-student .wrap h1{font-size:clamp(1.9rem,4vw,2.7rem);line-height:1.2;max-width:900px}
body.guide-student .wrap h2{scroll-margin-top:95px;line-height:1.4;border-bottom-color:var(--border)}
body.guide-student .wrap h3,[id^="guide-concept-"]{scroll-margin-top:95px}
body.guide-student .wrap>p{max-width:900px}
body.guide-student .lead{font-style:normal;line-height:1.65;color:var(--muted)}
body.guide-student .wrap a{color:var(--accent)}
body.guide-student :is(a,button,input,select,summary):focus-visible{outline:3px solid #b67a24;outline-offset:4px}
body.guide-student pre{white-space:pre;overflow-x:auto;line-height:1.6;border-radius:10px;background:var(--code-bg);border-color:var(--border)}
body.guide-student pre code{white-space:pre;font-size:.88rem;color:var(--fg);background:none}
body.guide-student table{border-collapse:collapse;width:100%;font-size:.95rem;overflow:visible}
body.guide-student th{background:var(--th-bg)}
body.guide-student :is(td,th){border-color:var(--border)}
body.guide-student .toc{background:var(--surface)!important;padding:18px 24px}
body.guide-student .toc li{break-inside:avoid}
.guide-orientation{border:1px solid var(--border);border-top:4px solid var(--accent);border-radius:12px;background:var(--surface);padding:22px 26px;margin:24px 0;animation:guide-enter .45s ease-out both}
.guide-eyebrow{font:700 .75rem/1.4 'Atkinson Hyperlegible',sans-serif;color:var(--accent);letter-spacing:.08em;text-transform:uppercase;margin:0 0 10px}
.guide-orientation p{margin:12px 0}.guide-scope{font-size:.88rem;color:var(--muted);border-top:1px solid var(--border);padding-top:12px}
.guide-concepts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:24px 0}
.guide-concept{border:1px solid var(--border);border-radius:12px;padding:18px 20px;background:var(--surface)}
.guide-concept h3{margin:0 0 10px!important;font-size:1.03rem!important}
.guide-concept p{font-size:.94rem;line-height:1.7}.guide-example{border-left:3px solid #c89955;padding-left:12px}.guide-limit{color:var(--muted)}
.guide-concept-link{text-decoration:underline dotted;text-underline-offset:4px}
.guide-case{border:1px solid var(--border);border-radius:12px;padding:22px;background:var(--surface);margin:24px 0}
.guide-trace svg{display:block;width:100%;max-width:800px;height:auto;margin:auto;font-family:'Atkinson Hyperlegible',sans-serif}
.guide-check{border:1px solid #d9bf96;background:#fff8ed;border-radius:10px;padding:14px 18px;margin:18px 0}
.guide-check summary{cursor:pointer;font-weight:700;line-height:1.5}
.guide-maintained{font-size:.8rem;color:var(--muted);text-align:center;margin-top:30px;padding-top:18px;border-top:1px solid var(--border)}
.guide-search-label{display:block;font-weight:700;margin-bottom:8px}
#guide-catalog-search{font:inherit;width:100%;max-width:650px;padding:12px 16px;border:1px solid var(--border-strong);border-radius:9px;background:var(--surface);color:var(--fg)}
.guide-catalog{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:22px 0}
.guide-catalog-card{display:block;padding:20px;border:1px solid var(--border);border-radius:12px;text-decoration:none!important;background:var(--surface)}
.guide-catalog-card:hover{border-color:var(--accent)}.guide-catalog-card h3{font-size:1.08rem;margin:0 0 9px}.guide-catalog-card p{font-size:.92rem;line-height:1.6;color:var(--fg)}.guide-catalog-card small{display:block;color:var(--muted);font-size:.77rem}
body.guide-student .btnlist{grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr))}
.guide-card-description{flex-basis:100%;font-weight:400;font-size:.87rem;line-height:1.6;color:var(--muted)}
.guide-student .viz-menu{top:74px;right:16px}.guide-student .fb-toggle{top:74px;right:62px}.guide-student .fb-toggle.fb-no-px{display:none}
.guide-student .bar{top:60px;z-index:800}
.guide-student .viz-menu{top:auto;bottom:130px;right:18px}
.guide-student .viz-menu-panel{top:auto;bottom:calc(100% + 6px)}
.guide-student .triple{white-space:pre-wrap;overflow-wrap:anywhere}
.guide-student .sd-start,.guide-student .sd-concept{background:var(--surface);border-color:var(--border)}
.guide-student .sd-concept h3,.guide-student .sd-start .sd-eyebrow{color:var(--accent)}
[hidden]{display:none!important}
@keyframes guide-enter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
body.guide-student.dark-mode{--bg:#101c26;--fg:#e4edf5;--muted:#afc0cd;--accent:#8bbbd9;--border:#364a5a;--code-bg:#172834;--surface:#192b38;--surface-hover:#243c4d;--th-bg:#233b4b;--row:#172834;--text-primary:#e4edf5;--text-secondary:#afc0cd;--text-muted:#afc0cd;--primary:#7caed0;--bg-alt:#243c4d;--bp-ink:#e4edf5;--bp-surface:#192b38;--bp-brand-soft:#243c4d;--bp-accent-soft:#243c4d;background:radial-gradient(ellipse at 10% 0,#203c50,transparent 48%),var(--bg)}
body.guide-student.dark-mode .bp-bar{background:rgba(16,28,38,.94)}
body.guide-student.dark-mode :is(.note,.guide-check,.sd-self-check,.sd-box,.gist,.d-meta,.field,.codebox,.qa,.triple){background:#20313f!important;color:var(--fg)!important;border-color:var(--border)!important}
body.guide-student.dark-mode :is(.wrap td,.wrap th,.qa-body,.detail,.codebox .lbl,.bp-search-foot){background-color:var(--surface);color:var(--fg)}
body.guide-student.dark-mode :is(.wrap code,.wrap pre code,.wrap h2.section,.wrap .lbl,.bp-nav-link){color:var(--fg)!important}
body.guide-student.dark-mode .wrap :is(svg,figure img){background:#fff;border-radius:10px}
body.guide-student.dark-mode .wrap :is(div,section,article,aside,nav,details){background:var(--surface)!important;color:var(--fg)!important}
body.guide-student.dark-mode .wrap :is(p,li,summary,label,dt,dd){color:var(--fg)}
body.guide-student.dark-mode .wrap :is(.chip,.lbl,.tag,.badge,.fillin,.best-h,.h,.idxrow,.node,.bar){background:var(--bg-alt)!important;color:var(--fg)!important}
body.guide-student.dark-mode .wrap svg{color:#223442}
body.guide-student .guide-trace{break-inside:avoid}
@media(max-width:760px){body.guide-student .wrap{padding:28px 18px 70px}.guide-concepts,.guide-catalog{grid-template-columns:1fr}.guide-orientation,.guide-case{padding:18px}.guide-student .toc ol{columns:1}.guide-student .wrap table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}.guide-student .viz-menu{top:auto;bottom:130px}.guide-student .fb-toggle{top:auto;bottom:130px}.guide-student .viz-menu-panel{top:auto;bottom:calc(100% + 6px)}}
@media(prefers-reduced-motion:reduce){.guide-orientation{animation:none}html{scroll-behavior:auto}}
@media print{body.guide-student .wrap{max-width:none;padding:0}body.guide-student .wrap>section{break-inside:auto!important}.guide-concepts,.guide-catalog{display:block}.guide-concept,.guide-catalog-card{margin-bottom:12px;break-inside:avoid}.guide-student .bp-bar,.guide-student .bp-float,.guide-student .floatnav{display:none!important}.guide-student .wrap pre{white-space:pre-wrap}.guide-student .wrap pre code{white-space:pre-wrap}.guide-check,.guide-orientation{background:white}}