/* Hallmark custom: candlestick study as a reading practice; restrained dark palette, system sans typography, and verified course content. */
/* Critique: chart-shaped decoration could imply a real market chart; correction: use typography and a simple rule instead. */
:root{--color-paper:oklch(17% 0.012 260);--color-paper-2:oklch(21% 0.014 260);--color-paper-3:oklch(25% 0.014 260);--color-ink:oklch(94% 0.01 85);--color-muted:oklch(78% 0.012 260);--color-rule:oklch(42% 0.015 260);--color-accent:oklch(78% 0.13 78);--color-accent-ink:oklch(19% 0.025 78);--color-focus:oklch(82% 0.16 78);--font-body:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--space-xs:0.5rem;--space-sm:0.75rem;--space-md:1rem;--space-lg:1.5rem;--space-xl:2.5rem;--space-2xl:4rem;--space-3xl:6rem;--space-4xl:9rem;--measure:75rem;--text-display:clamp(3.5rem,7.5vw,6rem);--text-section:clamp(2.2rem,4vw,3.75rem)}
*,*::before,*::after{box-sizing:border-box}
html,body{overflow-x:clip}
html{font-family:var(--font-body);font-synthesis:none;background:var(--color-paper);color:var(--color-ink)}
body{margin:0;font-size:1rem;line-height:1.6}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:0.2em}
a:hover{color:var(--color-accent)}
a:focus-visible{outline:3px solid var(--color-focus);outline-offset:4px}
h1,h2,h3,p{margin:0}
h1,h2,h3{text-wrap:balance;overflow-wrap:break-word;min-width:0;line-height:1.08;letter-spacing:-0.025em}
p{max-width:65ch;text-wrap:pretty}
.wrap{width:min(calc(100% - 3rem),var(--measure));margin-inline:auto}
.site-header{border-bottom:1px solid var(--color-rule)}
.header-inner{min-height:5rem;display:flex;align-items:center;justify-content:space-between;gap:var(--space-lg)}
.brand{font-size:1.25rem;font-weight:700;text-decoration:none;white-space:nowrap}
nav{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-md) var(--space-lg)}
nav a{font-size:0.9rem;text-decoration:none}
.hero{padding-block:var(--space-3xl) var(--space-4xl)}
.hero h1{font-size:var(--text-display);max-width:14ch;font-weight:700}
.hero p{margin-top:var(--space-lg);font-size:clamp(1.125rem,1.6vw,1.35rem);max-width:45ch;color:var(--color-muted)}
.action{display:inline-flex;align-items:center;justify-content:center;min-height:3.25rem;padding:var(--space-sm) var(--space-lg);margin-top:var(--space-xl);background:var(--color-accent);color:var(--color-accent-ink);font-weight:700;text-decoration:none}
.action:hover{background:var(--color-ink);color:var(--color-paper)}
.section{padding-block:var(--space-3xl)}
.section h2{font-size:var(--text-section);max-width:20ch}
.section p{margin-top:var(--space-lg);color:var(--color-muted)}
.course{background:var(--color-paper-2);color:var(--color-ink)}
.course-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--space-2xl)}
.topics{list-style:none;padding:0;margin:0;border-top:1px solid var(--color-rule)}
.topics li{padding-block:var(--space-md);border-bottom:1px solid var(--color-rule);font-size:1.125rem}
.practice-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,0.7fr);gap:var(--space-2xl);align-items:start}
.practice-detail{border-top:1px solid var(--color-rule);padding-top:var(--space-lg)}
.practice-detail h3{font-size:1.5rem}
.practice-detail p{margin-top:var(--space-md)}
.practice-detail+.practice-detail{margin-top:var(--space-xl)}
.note{background:var(--color-paper-3);color:var(--color-ink);padding-block:var(--space-2xl)}
.note p{font-size:clamp(1.25rem,2vw,1.75rem);max-width:45ch;line-height:1.4}
.document{padding-block:var(--space-3xl);max-width:52rem;margin-inline:auto}
.document h1{font-size:clamp(3rem,6vw,5rem);max-width:18ch}
.document h2{font-size:1.75rem;margin-top:var(--space-2xl)}
.document p{margin-top:var(--space-md);color:var(--color-muted)}
.document a{color:var(--color-ink)}
.document a:hover{color:var(--color-accent)}
.site-footer{border-top:1px solid var(--color-rule);padding-block:var(--space-xl)}
.footer-inner{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--space-xl)}
.footer-inner p{color:var(--color-muted);margin-top:var(--space-xs)}
.footer-inner a{overflow-wrap:anywhere}
@media(max-width:700px){.header-inner{align-items:flex-start;flex-direction:column;padding-block:var(--space-lg);gap:var(--space-md)}.hero{padding-block:var(--space-2xl) var(--space-3xl)}.section{padding-block:var(--space-2xl)}.course-layout,.practice-layout{grid-template-columns:minmax(0,1fr);gap:var(--space-xl)}.footer-inner{flex-direction:column}.document{padding-block:var(--space-2xl)}}