@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Outfit:wght@400;600;800&display=swap";:root{--bg-color:#080c14;--card-bg:#111827b8;--card-border:#ffffff14;--card-hover-border:#6366f166;--text-primary:#f3f4f6;--text-muted:#9ca3af;--text-heading:#fff;--accent-cyan:#00f2fe;--accent-purple:#9d4edd;--accent-blue:#3b82f6;--accent-orange:#ff8f1f;--font-display:"Outfit", "Inter", system-ui, -apple-system, sans-serif;--font-sans:"Inter", system-ui, -apple-system, sans-serif;--shadow:0 24px 60px #0006;--shadow-soft:0 8px 24px #00000040;--border:#ffffff14;font-family:var(--font-sans);color:var(--text-primary);background-color:var(--bg-color);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-weight:400;line-height:1.55}html{scroll-behavior:smooth}body{background:linear-gradient(135deg,#020617 0%,#0d1117 50%,#030712 100%);min-width:320px;margin:0;position:relative;overflow-x:hidden}body:before{content:"";z-index:0;pointer-events:none;background-image:linear-gradient(#ffffff04 1px,#0000 1px),linear-gradient(90deg,#ffffff04 1px,#0000 1px);background-size:30px 30px;position:fixed;inset:0}.blur-bg{filter:blur(55px);z-index:0;pointer-events:none;border-radius:50%;width:500px;height:500px;position:fixed}.blob-1{background:radial-gradient(circle,#00f2fe1f 0%,#0000 70%);top:-120px;left:-120px}.blob-2{background:radial-gradient(circle,#9d4edd26 0%,#0000 70%);bottom:-150px;right:-120px}*{box-sizing:border-box}#root{z-index:1;width:min(1240px,100%);min-height:100svh;margin:0 auto;position:relative}h1,h2{color:var(--text-heading);font-family:var(--font-display);margin:0;line-height:1.08}h1{letter-spacing:-.03em;font-size:clamp(2.4rem,6vw,4.8rem);font-weight:800}h2{letter-spacing:-.02em;font-size:clamp(1.5rem,3vw,2.2rem);font-weight:600}p{margin:0}a,button,input{font:inherit}.app-shell{flex-direction:column;gap:4rem;padding:0 0 4rem;display:flex}.hero-section,.overview-section,.simulation-stack,.teaching-section,.site-footer{padding-inline:clamp(1rem,3vw,2rem)}.hero-section{padding-top:1rem}.top-nav{z-index:10;-webkit-backdrop-filter:blur(20px);border-bottom:1px solid #ffffff0a;flex-wrap:wrap;justify-content:center;align-items:center;gap:.75rem;padding:1rem 0;display:flex;position:sticky;top:0}.back-link{color:var(--text-muted);align-items:center;gap:8px;margin-right:auto;font-size:.9rem;font-weight:500;text-decoration:none;transition:color .2s,transform .2s;display:inline-flex}.back-link:hover{color:var(--text-primary);transform:translate(-4px)}.back-link svg{stroke:currentColor;fill:none;width:18px;height:18px}.top-nav a:not(.back-link),.hero-actions a,.lesson-controls button,.chapter-card{transition:transform .2s,box-shadow .2s,border-color .2s,background .2s}.top-nav a:not(.back-link){border:1px solid var(--card-border);color:var(--text-muted);background:#ffffff0d;border-radius:999px;padding:.6rem 1rem;font-size:.88rem;font-weight:500;text-decoration:none}.top-nav a:not(.back-link):hover,.hero-actions a:hover,.lesson-controls button:hover,.chapter-card:hover{color:var(--text-primary);border-color:#00f2fe4d;transform:translateY(-2px)}.hero-grid,.lesson-layout,.overview-header,.teaching-grid{gap:1.5rem;display:grid}.hero-grid{grid-template-columns:1.25fr .95fr;align-items:center;min-height:min(46rem,86vh)}.eyebrow{letter-spacing:.16em;text-transform:uppercase;color:var(--accent-cyan);align-items:center;gap:.4rem;margin-bottom:.6rem;font-size:.76rem;font-weight:700;display:inline-flex}.eyebrow:before{content:"";background:currentColor;border-radius:999px;width:.9rem;height:.1rem}.hero-copy{text-align:left;gap:1.25rem;display:grid}.hero-copy p,.overview-header p,.section-heading p,.site-footer p,.teaching-grid p,.chapter-card p{color:var(--text-muted);line-height:1.65}.hero-actions{flex-wrap:wrap;gap:.85rem;display:flex}.hero-actions a,.lesson-controls button{cursor:pointer;color:var(--text-primary);background:#ffffff0f;border:1px solid #ffffff1a;border-radius:999px;padding:.85rem 1.3rem;font-size:.9rem;font-weight:600;text-decoration:none;transition:transform .2s,border-color .2s,background .2s}.hero-actions a:first-child{background:linear-gradient(90deg, var(--accent-cyan), var(--accent-blue));color:#031220;border-color:#0000;font-weight:700}.hero-actions .secondary-link,.lesson-controls button:nth-child(2),.lesson-controls button:nth-child(3){border-color:var(--card-border);background:0 0}.hero-actions a:first-child:hover{filter:brightness(1.08);transform:translateY(-2px);box-shadow:0 8px 24px #00f2fe40}.hero-visual{border:1px solid var(--card-border);min-height:26rem;box-shadow:var(--shadow);background:radial-gradient(circle at 30% 20%,#00f2fe33,#0000 35%),radial-gradient(circle at 78% 20%,#9d4edd2e,#0000 32%),linear-gradient(135deg,#0d1117,#1a1f2e 48%,#0a0e18);border-radius:2rem;position:relative;overflow:hidden}.hero-core,.orbit,.runner,.crate,.skater,.drop-object{position:absolute}.hero-core{width:11rem;height:11rem;color:var(--text-primary);font-family:var(--font-display);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:radial-gradient(circle at 40% 35%,#00f2fe26,#0000 60%),#111827d9;border:1px solid #00f2fe33;border-radius:50%;place-items:center;margin:auto;font-size:2rem;font-weight:700;display:grid;inset:0}.hero-core span:first-child{color:var(--accent-cyan);transform:translate(-2.1rem,-1.2rem)}.hero-core span:nth-child(2){color:var(--accent-purple);transform:translate(.2rem,1.5rem)}.hero-core span:nth-child(3){color:var(--accent-orange);transform:translate(2rem,-.6rem)}.orbit{border:1.5px dashed #00f2fe2e;border-radius:50%;margin:auto;animation:18s linear infinite spin;inset:0}.orbit-one{width:18rem;height:18rem}.orbit-two{border-color:#9d4edd24;width:24rem;height:24rem;animation-duration:24s;animation-direction:reverse}.overview-section,.teaching-section{gap:1.5rem;display:grid}.overview-header{text-align:left;grid-template-columns:1.2fr .8fr;align-items:end}.overview-metrics,.metric-row,.chapter-grid,.slider-grid,.teaching-grid{gap:1rem;display:grid}.overview-metrics{grid-template-columns:repeat(4,minmax(0,1fr))}.metric-card,.chapter-card,.lesson-card,.teaching-grid article{border:1px solid var(--card-border);background:var(--card-bg);-webkit-backdrop-filter:blur(16px);box-shadow:var(--shadow-soft);border-radius:1.25rem}.metric-card{text-align:left;padding:1.1rem 1rem;transition:border-color .3s,transform .3s}.metric-card:hover{border-color:#00f2fe33;transform:translateY(-2px)}.metric-card span{color:var(--text-muted);letter-spacing:.04em;text-transform:uppercase;margin-bottom:.4rem;font-size:.82rem;display:block}.metric-card strong{color:var(--text-primary);font-size:1rem;font-weight:600}.chapter-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.chapter-card{color:inherit;text-align:left;gap:.75rem;padding:1.15rem;text-decoration:none;transition:border-color .3s,transform .3s,box-shadow .3s;display:grid}.chapter-card:hover{border-color:#6366f14d;box-shadow:0 0 24px #6366f11a}.chapter-card strong,.teaching-grid strong{color:var(--text-primary);font-family:var(--font-display);font-weight:600}.chapter-card span:last-child{color:var(--accent-cyan);font-family:JetBrains Mono,Fira Code,monospace;font-size:.82rem;font-weight:700}.chapter-dot{border-radius:50%;width:.8rem;height:.8rem;box-shadow:0 0 8px}.simulation-stack{gap:2rem;display:grid}.lesson-section{gap:.9rem;display:grid}.section-heading{text-align:left;justify-content:space-between;align-items:center;gap:1rem;display:flex}.formula-chip{color:var(--text-primary);letter-spacing:.02em;background:#ffffff0a;border:1px solid;border-radius:999px;flex-shrink:0;padding:.55rem .9rem;font-family:JetBrains Mono,Fira Code,monospace;font-size:.88rem;font-weight:700}.lesson-card{text-align:left;border-color:color-mix(in srgb, var(--accent-color) 22%, var(--card-border));padding:1rem;transition:border-color .3s}.lesson-controls{flex-wrap:wrap;gap:.75rem;margin-bottom:1rem;display:flex}.lesson-controls button:hover{color:var(--text-primary);background:#ffffff1a;border-color:#00f2fe4d}.lesson-controls button:first-child:hover{border-color:var(--accent-cyan);box-shadow:0 0 12px #00f2fe26}.lesson-layout{grid-template-columns:1.2fr 1fr;align-items:stretch}.scene-card,.detail-column{border:1px solid var(--card-border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0a0f1cb3;border-radius:1.25rem}.scene-card{min-height:20rem;position:relative;overflow:hidden}.detail-column{background:#11182799;gap:1rem;padding:1rem;display:grid}.slider-control{gap:.55rem;display:grid}.slider-control span{color:var(--text-muted);justify-content:space-between;gap:.75rem;font-size:.9rem;display:flex}.slider-control span strong{color:var(--accent-cyan);font-weight:700}.slider-control input{width:100%;accent-color:var(--accent-cyan);cursor:pointer}.slider-grid{grid-template-columns:1fr}.metric-row{grid-template-columns:repeat(auto-fit,minmax(160px,1fr))}.track-scene,.push-scene,.reaction-scene,.surface-scene,.fall-scene,.projectile-scene,.lane-track{width:100%;height:100%;position:relative}.track-scene,.push-scene,.surface-scene,.fall-scene,.projectile-scene,.reaction-scene,.lane-track{background:linear-gradient(#00f2fe05,#0000 60%),linear-gradient(#0a0f1c1a,#0a0f1c99)}.track-scene.warm{background:radial-gradient(circle at 0 0,#ff8f1f1f,#0000 40%),linear-gradient(#0a0f1c1a,#ff8f1f0f)}.track-scene.amber{background:radial-gradient(circle at 100% 0,#ffb3471f,#0000 42%),linear-gradient(#0a0f1c1a,#ffb3470f)}.track-line,.lane-track:before{content:"";background:linear-gradient(90deg,#00f2fe4d,#9d4edd66);border-radius:999px;height:.35rem;position:absolute;bottom:3rem;left:7%;right:7%;box-shadow:0 0 10px #00f2fe26}.track-markers{color:var(--text-muted);justify-content:space-between;font-size:.78rem;display:flex;position:absolute;bottom:1.2rem;left:7%;right:7%}.runner,.crate,.drop-object,.skater{z-index:1}.runner{color:#fff;background:linear-gradient(135deg,#ff8f1f,#f04d98);border-radius:50%;place-items:center;width:3.4rem;height:3.4rem;margin-left:-1.7rem;font-size:.68rem;font-weight:700;display:grid;bottom:2.2rem;box-shadow:0 0 20px #ff8f1f59,0 12px 24px #0006}.runner.square{background:linear-gradient(135deg,#ff8f1f,#ffb347);border-radius:1rem;box-shadow:0 0 20px #ff8f1f59,0 12px 24px #0006}.runner.disk,.runner.disk.soft{width:2.7rem;height:2.7rem;bottom:2rem}.runner.disk{background:linear-gradient(135deg,#00f2fe,#3b82f6);box-shadow:0 0 20px #00f2fe59,0 10px 20px #0006}.runner.disk.soft{background:linear-gradient(135deg,#9d4edd,#7b61ff);box-shadow:0 0 20px #9d4edd59,0 10px 20px #0006}.trail-points span{background:#00f2fe33;border-radius:50%;width:.45rem;height:.45rem;margin-left:-.22rem;position:absolute;bottom:3.75rem}.vector-arrow,.push-arrow{color:#fff;letter-spacing:.01em;border-radius:999px;justify-content:center;align-items:center;height:2.5rem;font-size:.8rem;font-weight:700;display:flex;position:absolute;top:2rem;left:9%}.vector-arrow{background:linear-gradient(90deg,#ff8f1f,#f26b4b);box-shadow:0 0 16px #ff8f1f4d}.push-arrow{background:linear-gradient(90deg,#3b82f6,#00f2fe);box-shadow:0 0 16px #3b82f64d}.push-arrow.magenta{background:linear-gradient(90deg,#f04d98,#9d4edd);box-shadow:0 0 16px #f04d984d}.dual-scene{grid-template-columns:repeat(2,1fr);gap:1rem;padding:1rem;display:grid}.compare-lane{gap:.75rem;display:grid}.compare-lane header{gap:.25rem;display:grid}.compare-lane header strong{color:var(--text-primary);font-family:var(--font-display)}.compare-lane header span{color:var(--text-muted);font-size:.83rem}.lane-track{border:1px solid var(--card-border);border-radius:1rem;min-height:14rem}.push-scene,.surface-scene{min-height:20rem}.crate{color:#fff;background:linear-gradient(145deg,#3b82f6,#00f2fe);border-radius:1.1rem;place-items:center;width:5rem;height:5rem;margin-left:-2.5rem;font-weight:800;display:grid;bottom:2rem;box-shadow:0 0 20px #3b82f659,0 12px 24px #0006}.crate.compact{background:linear-gradient(145deg,#f04d98,#9d4edd);width:4.5rem;height:4.5rem;box-shadow:0 0 20px #f04d9859,0 12px 24px #0006}.reaction-scene{min-height:20rem}.reaction-center{background:#00f2fe99;border-radius:50%;width:.9rem;height:.9rem;position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);box-shadow:0 0 12px #00f2fe80}.skater{color:#fff;width:4.8rem;height:4.8rem;font-weight:800;font-family:var(--font-display);border-radius:1.2rem;place-items:center;margin-top:-2.4rem;display:grid;top:50%}.skater.left{background:linear-gradient(145deg,#7b61ff,#9d4edd);left:calc(50% - 2.4rem);box-shadow:0 0 20px #7b61ff59,0 12px 24px #0006}.skater.right{background:linear-gradient(145deg,#00f2fe,#3b82f6);left:calc(50% - 2.4rem);box-shadow:0 0 20px #00f2fe59,0 12px 24px #0006}.surface-scene{overflow:hidden}.surface-pattern{background-image:repeating-linear-gradient(-45deg,#ffffff08,#ffffff08 .5rem,#0000 .5rem 1rem);border-top:1px solid #ffffff0f;height:5rem;position:absolute;inset:auto 0 0}.fall-scene{min-height:20rem}.drop-line{background:linear-gradient(#00f2fe0d,#00f2fe80);border-radius:999px;width:2px;margin-left:-1px;position:absolute;top:1.5rem;bottom:3.6rem;left:50%}.drop-object{background:linear-gradient(145deg,#00f2fe,#3b82f6);border-radius:50%;width:3rem;height:3rem;margin-top:-1.5rem;margin-left:-1.5rem;left:50%;box-shadow:0 0 20px #00f2fe66,0 12px 24px #0006}.ground-bar{background:linear-gradient(90deg,#3b82f699,#9d4edd99);border-radius:999px;height:.6rem;position:absolute;bottom:2rem;left:10%;right:10%;box-shadow:0 0 12px #3b82f633}.projectile-scene{min-height:20rem}.projectile-scene svg{width:100%;height:100%}.projectile-scene polyline{fill:none;stroke:#ff8f1f;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 4px #ff8f1f80)}.projectile-scene circle{fill:#00f2fe;filter:drop-shadow(0 0 4px #00f2fe99)}.teaching-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.teaching-grid article{text-align:left;padding:1.2rem;transition:border-color .3s,transform .3s}.teaching-grid article:hover{border-color:#6366f14d;transform:translateY(-2px)}.site-footer{text-align:center;border-top:1px solid #ffffff0a;padding-top:2rem}.site-footer p{color:#4b5563;font-size:.85rem}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (width<=980px){.hero-grid,.overview-header,.lesson-layout,.chapter-grid,.overview-metrics,.teaching-grid,.dual-scene{grid-template-columns:1fr}.section-heading{flex-direction:column;align-items:flex-start}.top-nav{justify-content:flex-start}}@media (width<=720px){.app-shell{gap:3rem}.top-nav{flex-wrap:wrap}.hero-grid{min-height:auto}.hero-visual{min-height:20rem}.lesson-controls,.hero-actions{flex-direction:column}.formula-chip,.hero-actions a,.lesson-controls button,.top-nav a:not(.back-link){box-sizing:border-box;text-align:center;justify-content:center;width:100%}.back-link{width:auto}}
