/* Compoundly learning and financial depth — progressive enhancement. */
[hidden]{display:none!important}.welcome{padding:72px 0 48px;position:relative;overflow:hidden}.welcome-grid{display:grid;grid-template-columns:1.12fr 1fr;gap:48px;align-items:center}.welcome h1{font-size:clamp(2.4rem,4.7vw,4.25rem);line-height:1.08;letter-spacing:-.04em;margin:22px 0}.welcome h1 span{color:var(--gain)}.welcome p{font-size:1.12rem;line-height:1.7;max-width:580px;color:var(--text-muted)}.welcome .small-note{font-size:.9rem}.learn-actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin:24px 0}.learn-actions .btn{white-space:normal}.text-link{color:var(--gain);font-weight:600}.journey-preview{display:block;padding:32px;border:1px solid var(--border);border-radius:24px;background:linear-gradient(145deg,var(--surface),var(--bg));color:var(--text);text-decoration:none;box-shadow:0 30px 70px -30px #0009;position:relative;transform:perspective(900px) rotateY(-5deg)}.journey-preview h2{margin:16px 0;font-size:2rem}.journey-preview ol{padding-left:22px;line-height:2.1;color:var(--text-muted)}.presets{margin-bottom:22px}.simulation-notice{background:var(--brand-soft);padding:16px;border-left:3px solid var(--brand);font-size:.9rem;line-height:1.65;color:var(--text-muted);margin:20px 0}.js body:not(.show-expert) .expert-section,.js body:not(.show-expert) .expert-only{display:none}.hero{padding-top:36px}.hero h2{font-size:clamp(1.8rem,3vw,2.8rem)}.learning-page h1{font-size:clamp(2.6rem,6vw,4.5rem);letter-spacing:-.04em}.progress-panel{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;padding:24px;background:var(--surface);border:1px solid var(--border);border-radius:16px;margin:28px 0}.progress-panel p{font-size:.9rem;color:var(--text-muted);margin:6px 0}progress{width:100%;height:10px;accent-color:var(--brand)}.course-layout{display:grid;grid-template-columns:250px minmax(0,1fr);gap:32px;align-items:start}.course-sidebar{position:sticky;top:90px}.course-sidebar nav{display:grid;gap:8px;margin-bottom:20px}.course-sidebar nav a{display:flex;gap:12px;align-items:center;padding:12px;border-radius:10px;text-decoration:none;color:var(--text-muted);border:1px solid transparent;font-size:.95rem}.course-sidebar nav a:hover,.course-sidebar nav a.completed{border-color:var(--brand);background:var(--brand-soft);color:var(--text)}.course-sidebar nav span{font-family:var(--font-mono);color:var(--gain)}.course-sidebar nav a.completed span::after{content:' ✓'}.lesson-stack{display:grid;gap:32px}.lesson{scroll-margin-top:92px;padding:clamp(22px,4vw,42px)}.lesson h2{font-size:clamp(1.7rem,3vw,2.3rem);margin:12px 0}.lesson h3{font-size:1.15rem;margin:28px 0 12px}.lesson p{line-height:1.8;font-size:1rem;color:var(--text-muted);margin:14px 0}.lesson .lesson-question{font-size:1.22rem;color:var(--gain)}.example,.lab{background:var(--surface-2);padding:24px;border:1px solid var(--border);border-radius:14px;margin:26px 0}.lab h3{margin-top:0}.lab input[type=range]{width:100%;margin:20px 0}.takeaway{border-left:3px solid var(--brand);padding:8px 20px}.quiz{border-top:1px solid var(--border);margin-top:30px}.quiz fieldset{border:0;padding:16px 0;margin:0}.quiz legend{font-weight:600;line-height:1.6}.quiz-option{display:flex;gap:12px;align-items:center;padding:13px 16px;margin:10px 0;border:1px solid var(--border);border-radius:10px;cursor:pointer}.quiz-option:has(input:checked){border-color:var(--brand);background:var(--brand-soft)}.quiz-option input{accent-color:var(--brand);width:18px;height:18px;flex-shrink:0}.quiz-feedback:not(:empty){color:var(--warn)}.quiz-feedback.correct{color:var(--gain)}.lesson .source-note{font-size:.875rem;border-top:1px solid var(--border);padding-top:18px}.source-note a,.glossary-word{color:var(--gain);text-decoration:underline;text-underline-offset:3px}.glossary-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:24px}.glossary-item{border:1px solid var(--border);border-radius:12px;background:var(--surface);padding:18px}.glossary-item summary{cursor:pointer;font-weight:600}.glossary-item p{padding-top:12px;line-height:1.7;color:var(--text-muted)}.risk-bars{height:125px;display:flex;align-items:flex-end;gap:16px;margin:20px 0}.risk-bars i{flex:1;height:var(--level);background:var(--brand);border-radius:8px 8px 0 0;transform-origin:bottom}.risk-bars i:nth-child(2){background:var(--warn)}.risk-bars.play i{animation:bar-rise 1s ease both}.risk-bars.play i:nth-child(2){animation-delay:.3s}.risk-bars.play i:nth-child(3){animation-delay:.6s}
/* A small CSS 3D financial mobile: floating coins and a dimensional chart. */
.finance-visual{position:relative;min-width:0}.finance-scene{height:330px;perspective:900px;position:relative;isolation:isolate;--tilt-x:0deg;--tilt-y:0deg}.finance-scene::before{content:'';position:absolute;inset:15%;background:radial-gradient(ellipse,#10b98133,transparent 70%);filter:blur(25px)}.scene-stage{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateX(var(--tilt-x)) rotateY(var(--tilt-y));transition:transform .3s ease}.chart-plinth{position:absolute;left:14%;right:8%;bottom:48px;height:125px;background:linear-gradient(145deg,#1d5149,#153035);border:1px solid #48c5a866;border-radius:18px;transform:rotateX(62deg) rotateZ(-25deg);box-shadow:0 18px 0 #0b2227,0 40px 50px #0006;background-image:linear-gradient(#45b49822 1px,transparent 1px),linear-gradient(90deg,#45b49822 1px,transparent 1px);background-size:24px 24px}.bars-3d{position:absolute;left:29%;bottom:100px;display:flex;gap:20px;align-items:flex-end;transform-style:preserve-3d;transform:rotateY(-22deg);animation:float-chart 8s ease-in-out infinite}.bar-3d{width:43px;height:var(--h);background:linear-gradient(90deg,#158768,#50d4a1);position:relative;box-shadow:8px 14px 20px #0003}.bar-3d::before{content:'';position:absolute;left:0;top:-12px;width:100%;height:12px;background:#95f3c7;transform:skewX(-40deg);transform-origin:bottom}.bar-3d::after{content:'';position:absolute;right:-10px;top:-6px;width:10px;height:100%;background:#116e5c;transform:skewY(-50deg)}.coin{position:absolute;width:72px;height:72px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#fff0b4,#f3b841 65%,#ba7422);border:5px solid #e4b156;color:#694716;font-size:32px;font-weight:700;box-shadow:5px 5px 0 #a06c2d,10px 18px 24px #0004;animation:coin-drift 7s ease-in-out infinite;transform-style:preserve-3d}.coin.one{left:12%;top:56px}.coin.two{right:6%;top:26px;width:56px;height:56px;font-size:23px;animation-delay:-3s}.coin.three{right:10%;bottom:50px;width:48px;height:48px;font-size:21px;animation-delay:-5s}.market-orbit{position:absolute;inset:25px 0 50px;border:1px solid #72c7b544;border-radius:50%;transform:rotateX(65deg) rotateZ(-25deg)}.market-line{position:absolute;left:18%;top:16px;width:70%;height:190px;filter:drop-shadow(0 5px 9px #24ce9b44)}.scene-caption{text-align:center;color:var(--text-subtle);font-size:.875rem}.motion-button{display:block;margin:10px auto 0;background:none;color:var(--text-muted);border:0;text-decoration:underline;cursor:pointer;font-size:.875rem;padding:10px}.welcome .journey-preview{padding:18px 24px;transform:none;margin-top:6px}.journey-preview h2{font-size:1.4rem;margin:8px 0}.journey-preview ol{display:none}.motion-paused *{animation-play-state:paused!important}.card{box-shadow:0 18px 40px -32px #0009}button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible{outline:3px solid var(--gain);outline-offset:4px}.learn-actions,.quiz,.lesson{overflow-wrap:anywhere}
@keyframes coin-drift{0%,100%{transform:translateY(0) rotateY(-22deg) rotateZ(-12deg)}50%{transform:translateY(-16px) rotateY(25deg) rotateZ(8deg)}}@keyframes float-chart{0%,100%{transform:translateY(0) rotateY(-22deg)}50%{transform:translateY(-9px) rotateY(-16deg)}}@keyframes bar-rise{from{transform:scaleY(.1)}to{transform:scaleY(1)}}
@media(max-width:900px){.welcome-grid{grid-template-columns:1fr;gap:22px}.welcome{padding-top:40px}.finance-scene{height:270px;max-width:450px;margin:auto}.course-layout{grid-template-columns:1fr}.course-sidebar{position:static}.course-sidebar nav{grid-template-columns:repeat(2,minmax(0,1fr))}.finance-visual .journey-preview{max-width:540px;margin:auto}.hero{padding-top:30px}}
@media(max-width:520px){.glossary-grid,.course-sidebar nav{grid-template-columns:1fr}.lesson{padding:20px}.progress-panel{padding:18px}.finance-scene{height:250px}.bar-3d{width:32px}.bars-3d{gap:16px}.welcome h1{font-size:2.6rem}.field input[type=number]{max-width:100%}.learning-page .section{padding-top:40px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.scene-stage{transform:none!important}}