body{font-family:Inter,sans-serif;background-color:#f9fafb;color:#334155;line-height:1.7}h1,h2,h3,h4,.math-serif{font-family:Lora,serif}h1{color:#1e293b}h2{color:#1e293b;margin-top:3rem;margin-bottom:1.5rem;padding-bottom:.5rem;border-bottom:1px solid #e2e8f0}h3{color:#1e293b;margin-top:2.5rem;margin-bottom:2rem;font-weight:700}h4{color:#1e293b;margin-top:1.5rem;margin-bottom:1rem}.interactive-figure,.interactive-demo{background-color:#fff;border:1px solid #e2e8f0;border-radius:.75rem;padding:1.5rem;margin:2rem 0;box-shadow:0 4px 6px -1px #0000000d}.interactive-demo h4{color:#4338ca;margin-top:0}.interactive-demo canvas{display:block;width:100%!important;margin:1rem auto;border-radius:8px;background:#fff;border:1px solid #e2e8f0}.interactive-demo .controls{display:flex;align-items:center;gap:1rem;margin-top:1rem;flex-wrap:wrap}.interactive-demo label{color:#334155;font-weight:500}.interactive-demo input[type=range]{flex:1;min-width:200px}.interactive-demo .value-display{background:#f1f5f9;padding:.5rem 1rem;border-radius:6px;font-family:Courier New,monospace;color:#4338ca}.figure-caption{font-size:.875rem;color:#64748b;text-align:center;margin-top:1rem;font-style:italic}mjx-container{font-size:110%!important}section{margin:3rem 0}.key-point{background:linear-gradient(135deg,#6366f10d,#4f46e514);border-left:4px solid #4f46e5;padding:1.5rem;margin:1.5rem 0;border-radius:0 .5rem .5rem 0}.key-point strong{color:#4338ca;font-size:1.05rem}.example{background:#fff;padding:2rem;margin:2rem 0;border-radius:.75rem;border:2px solid #e2e8f0}.example h4{color:#4338ca;margin-top:0}.solution{margin-top:1rem;padding:1rem;background:#f8fafc;border-radius:.5rem}.step{margin:.75rem 0;padding-left:1.5rem;position:relative}.step:before{content:"→";position:absolute;left:0;color:#4f46e5;font-weight:700}.equation-block{background:#f8fafc;padding:1.5rem;margin:1.5rem 0;border-radius:.5rem;border-left:4px solid #4f46e5;overflow-x:auto}.practice{background:#fef3c7;padding:1.5rem;margin:1.5rem 0;border-radius:.5rem;border:2px dashed #f59e0b}.practice h4{color:#b45309;margin-top:0}.comparison-table{width:100%;margin:2rem 0;border-collapse:collapse;background:#fff;border-radius:.5rem;overflow:hidden;border:1px solid #e2e8f0}.comparison-table th{background:#4f46e5;color:#fff;padding:1rem;text-align:left;font-weight:600}.comparison-table td{padding:1rem;border-bottom:1px solid #e2e8f0}.comparison-table tr:hover{background:#f8fafc}.warning{background:#fef2f2;border-left:4px solid #ef4444;padding:1.5rem;margin:1.5rem 0;border-radius:0 .5rem .5rem 0}.warning:before{content:"⚠ Common Mistake: ";font-weight:600;color:#dc2626}.historical{background:linear-gradient(135deg,#fbbf2414,#f59e0b0d);padding:0;margin:2rem 0;border-radius:.75rem;border:1px solid #fcd34d}.historical summary{padding:1rem 1.5rem;cursor:pointer;font-weight:600;color:#b45309;font-size:1.1rem;list-style:none;display:flex;align-items:center;gap:.5rem}.historical summary:before{content:"▶";font-size:.75rem;transition:transform .3s ease}.historical[open] summary:before{transform:rotate(90deg)}.historical summary::-webkit-details-marker{display:none}.historical .historical-content{padding:0 1.5rem 1.5rem;font-style:italic;color:#78716c}.canvas-sketch{background:#fff;padding:1.5rem;border-radius:.5rem;margin:1.5rem 0;border:1px solid #e2e8f0}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:2rem;margin:2rem 0}@media(max-width:768px){.grid-2{grid-template-columns:1fr}}.level-badge{display:inline-block;padding:.5rem 1rem;border-radius:9999px;font-weight:600;font-size:.75rem;margin-bottom:1rem;text-transform:uppercase;letter-spacing:.05em}.level-foundation{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.level-intermediate{background:linear-gradient(135deg,#f093fb,#f5576c);color:#fff}.level-advanced{background:linear-gradient(135deg,#fa709a,#fee140);color:#1e293b}nav.toc{background:#fff;padding:1.5rem;border-radius:.75rem;margin:2rem 0;border:1px solid #e2e8f0;box-shadow:0 4px 6px -1px #0000000d}nav.toc h2{font-size:1.5rem;color:#4338ca;margin-top:0;margin-bottom:1rem;border-bottom:none;padding-bottom:0}nav.toc ul{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:.5rem}nav.toc a{color:#334155;text-decoration:none;padding:.5rem 1rem;display:block;border-left:3px solid #e2e8f0;background:#f8fafc;border-radius:0 .375rem .375rem 0;transition:all .2s ease;font-size:.9rem}nav.toc a:hover{background:#eef2ff;border-left-color:#4f46e5;color:#4338ca}.quick-reference{background:#fff;padding:0;border-radius:.75rem;margin:2rem 0;border:1px solid #e2e8f0;box-shadow:0 4px 6px -1px #0000000d}.quick-reference>summary{padding:1rem 1.5rem;cursor:pointer;font-weight:600;color:#4338ca;font-size:1.1rem;background:#f8fafc;border-radius:.75rem;list-style:none}.quick-reference[open]>summary{border-radius:.75rem .75rem 0 0;border-bottom:1px solid #e2e8f0}.quick-reference>summary::-webkit-details-marker{display:none}.quick-reference .formula-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1rem;padding:1.5rem}.quick-reference .formula-item{background:#f8fafc;padding:1rem;border-radius:.5rem;border:1px solid #e2e8f0}.quick-reference .formula-item strong{color:#4338ca;display:block;margin-bottom:.5rem}details{margin:1rem 0}details>summary{cursor:pointer;color:#4338ca;font-weight:600;margin:1rem 0;padding:.75rem 1rem;background:#f8fafc;border-radius:.5rem;border:1px solid #e2e8f0}details>summary:hover{background:#eef2ff}code{font-family:Courier New,monospace;background:#f1f5f9;padding:.2rem .5rem;border-radius:.25rem;color:#4338ca;font-size:.9em}ul,ol{margin:1rem 0;padding-left:2rem}li{margin:.5rem 0}.back-to-top{position:fixed;bottom:2rem;right:2rem;background:#4f46e5;color:#fff;border:none;border-radius:50%;width:50px;height:50px;font-size:1.5rem;cursor:pointer;transition:all .3s ease;z-index:1000;box-shadow:0 4px 12px #4f46e566;opacity:0;visibility:hidden}.back-to-top.visible{opacity:1;visibility:visible}.ax-pad-center{padding:1.5rem;text-align:center}.ax-demo-gap{margin:2rem 0}.ax-chart-320{position:relative;height:320px;width:100%}.ax-chart-300{position:relative;height:300px;width:100%}.ax-eq-accent{text-align:center;background:#eef2ff;border-left-color:#4338ca}.ax-quote{margin:1rem 0;padding:1rem 1.5rem;border-left:4px solid #cbd5e1;color:#475569;font-style:italic}
