:root{--bg:#fafafa;--bg-secondary:#f0f0f0;--text:#1a1a1a;--text-secondary:#666;--accent:#e8630c;--border:#e5e5e5;--code-bg:#f5f5f5;--max-width:720px}@media(prefers-color-scheme:dark){:root{--bg:#0a0a0a;--bg-secondary:#141414;--text:#e5e5e5;--text-secondary:#999;--accent:#e8630c;--border:#2a2a2a;--code-bg:#1a1a1a}}*{box-sizing:border-box;margin:0;padding:0}::-webkit-scrollbar{display:none}html{-ms-overflow-style:none;font-size:18px;scroll-behavior:smooth;scrollbar-width:none}body{background:var(--bg);color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.7;-webkit-font-smoothing:antialiased}.container{margin:0 auto;max-width:var(--max-width);padding:2rem 1.5rem}h1,h2,h3,h4{font-weight:600;line-height:1.3;margin-bottom:1rem;margin-top:2.5rem}h1{font-size:2rem;letter-spacing:-.02em;margin-top:0}h2{border-bottom:1px solid var(--border);font-size:1.5rem;padding-bottom:.5rem}h3{color:var(--text-secondary);font-size:1.2rem}p{margin-bottom:1.25rem}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}.logo{color:var(--text);font-size:.9rem;font-weight:600}.nav-links{display:flex;gap:.25rem;list-style:none;margin:0;padding:0}.nav-links a{border-radius:4px;color:var(--text-secondary);font-size:.72rem;letter-spacing:.01em;padding:.35rem .7rem;transition:all .15s ease}.nav-links a:hover{text-decoration:none}.nav-links a.active,.nav-links a:hover{background:var(--bg-secondary);color:var(--text)}.nav-settings{align-items:center;display:flex;height:28px;justify-content:center;margin-left:.25rem;opacity:.5;transition:opacity .15s;width:28px}.nav-settings:hover{opacity:1;text-decoration:none}.math-block{background:var(--bg-secondary);border-radius:8px;margin:1.5rem 0;overflow-x:auto;padding:1.5rem;text-align:center}.math-inline{padding:0 .2rem}blockquote{border-left:3px solid var(--accent);color:var(--text-secondary);font-style:italic;margin:1.5rem 0;padding-left:1.25rem}blockquote strong{color:var(--text);font-style:normal}ol,ul{margin-bottom:1.25rem;padding-left:1.5rem}li{margin-bottom:.5rem}code{border-radius:4px;font-family:JetBrains Mono,Fira Code,monospace;font-size:.85em;padding:.2em .4em}code,pre{background:var(--code-bg)}pre{border-radius:8px;margin:1.5rem 0;overflow-x:auto;padding:1rem}pre code{background:none;padding:0}.lesson-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:8px;display:block;margin-bottom:1rem;padding:1.25rem;transition:border-color .2s}.lesson-card:hover{border-color:var(--accent);text-decoration:none}.lesson-card h3{color:var(--text);font-size:1.1rem;margin:0 0 .5rem}.lesson-card p{color:var(--text-secondary);font-size:.9rem;margin:0}.lesson-number{color:var(--accent);font-size:.75rem;letter-spacing:.05em;margin-bottom:.25rem;text-transform:uppercase}.derivation{background:var(--bg-secondary);border-radius:8px;margin:1.5rem 0;padding:1.5rem}.derivation-step{border-left:2px solid var(--border);margin-bottom:1rem;padding-left:1rem}.derivation-step:last-child{margin-bottom:0}.step-number{color:var(--accent);font-size:.85rem;font-weight:600}.key-concept{background:linear-gradient(135deg,var(--bg-secondary) 0,var(--bg) 100%);border:1px solid var(--border);border-radius:8px;margin:1.5rem 0;padding:1.25rem}.key-concept h4{color:var(--accent);font-size:.85rem;letter-spacing:.05em;margin-top:0;text-transform:uppercase}.question{background:var(--bg-secondary);border-left:3px solid #e8630c;border-radius:0 8px 8px 0;margin:1.5rem 0;padding:1rem 1.25rem}.question h4{color:#e8630c;font-size:.9rem;margin-top:0}.connection{background:var(--bg-secondary);border-left:3px solid #10b981;border-radius:0 8px 8px 0;margin:1.5rem 0;padding:1rem 1.25rem}.connection h4{color:#10b981;font-size:.9rem;margin-top:0}footer{color:var(--text-secondary);font-size:.85rem;margin-top:4rem}.lesson-nav,footer{border-top:1px solid var(--border);padding-top:2rem}.lesson-nav{display:flex;justify-content:space-between;margin-top:3rem}.lesson-nav a{align-items:center;color:var(--text-secondary);display:flex;font-size:.9rem;gap:.5rem}.lesson-nav a:hover{color:var(--accent);text-decoration:none}.progress-bar{background:var(--border);height:2px;left:0;position:fixed;right:0;top:0;z-index:100}.progress-bar-fill{background:var(--accent);height:100%;transition:width .1s;width:0}@media(max-width:600px){html{font-size:16px}.container{padding:1.5rem 1rem}h1{font-size:1.75rem}.nav-links{gap:1rem}}.tree{margin:2rem 0}.tree-node{margin:0}.tree-label{align-items:center;border-radius:4px;cursor:pointer;display:flex;gap:.35rem;padding:.4rem .25rem;-webkit-user-select:none;-moz-user-select:none;user-select:none}.tree-label:hover{background:var(--bg-secondary)}.tree-toggle{color:var(--text-secondary);flex-shrink:0;font-size:.5rem;width:.75rem}.tree-phase-icon{align-items:center;display:flex;flex-shrink:0}.tree-title{color:var(--text);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tree-desc{color:var(--text-secondary);font-size:.85rem;margin-left:.5rem}.tree-number{color:var(--accent);flex-shrink:0;font-size:.75rem;font-weight:500;width:1.6rem}.tree-children{border-left:1px solid var(--border);display:none;margin-left:.85rem;padding-left:.75rem}.tree-children.open{display:block}.tree-leaf{align-items:center;border-radius:4px;color:var(--text);display:flex;font-size:.9rem;gap:.3rem;padding:.2rem .25rem}.tree-leaf-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tree-leaf:hover{background:var(--bg-secondary);text-decoration:none}.tree-leaf.active{background:var(--bg-secondary);color:var(--accent)}.tree-leaf.completed:after{color:#10b981;content:"✓";flex-shrink:0;font-size:.6rem;margin-left:auto;padding-right:.25rem}.completion-status{background:var(--bg-secondary);border:1px solid var(--border);border-radius:8px;color:var(--text-secondary);cursor:pointer;display:block;font-size:.9rem;margin-top:2rem;padding:1rem;text-align:center;transition:all .2s;width:100%}.completion-status:hover{border-color:var(--text-secondary)}.completion-status.completed{background:#10b98122;border-color:#10b981;color:#10b981}.completion-status.completed:hover{background:var(--bg-secondary);border-color:var(--border);color:var(--text-secondary)}.progress-indicator{align-items:center;background:var(--bg-secondary);border-radius:8px;display:flex;gap:.75rem;margin:1.5rem 0;padding:1rem}.progress-bar-bg{background:var(--border);border-radius:3px;flex:1;height:6px;overflow:hidden}.progress-bar-fg{background:var(--accent);border-radius:3px;height:100%;transition:width .3s}.progress-text{color:var(--text-secondary);font-size:.85rem;white-space:nowrap}.with-sidebar{display:flex;justify-content:center;margin-left:280px;padding:1.5rem 2rem}.sidebar{background:var(--bg);border-right:1px solid var(--border);height:calc(100vh - 3rem);left:0;overflow-y:auto;padding:1rem .5rem 2rem .75rem;position:fixed;top:3rem;width:260px}.sidebar .tree{margin:0}.sidebar .tree-label{font-size:.78rem;gap:.3rem;padding:.25rem .2rem}.sidebar .tree-leaf{font-size:.72rem;gap:.25rem;padding:.15rem .2rem}.sidebar .tree-number{font-size:.68rem;width:1.2rem}.sidebar .tree-children{margin-left:.5rem;padding-left:.4rem}.sidebar .tree-desc{display:none}.lesson-content{max-width:var(--max-width);width:100%}@media(max-width:900px){.with-sidebar{margin-left:0;padding:1.5rem 1rem}.sidebar{display:none}.mobile-menu-btn{align-items:center;background:none;border:none;color:var(--text);cursor:pointer;display:flex;height:36px;justify-content:center;width:36px}.mobile-menu-btn svg{height:20px;width:20px}.nav-links{display:none}nav .container{justify-content:flex-end}.mobile-menu{background:var(--bg);border-left:1px solid var(--border);height:100vh;max-width:320px;overflow-y:auto;padding:1rem;position:fixed;right:-100%;top:0;transition:right .3s ease;width:85%;z-index:1000}.mobile-menu.open{right:0}.mobile-menu-backdrop{background:#00000080;height:100%;left:0;opacity:0;position:fixed;top:0;transition:opacity .3s ease;visibility:hidden;width:100%;z-index:999}.mobile-menu-backdrop.open{opacity:1;visibility:visible}.mobile-menu-header{align-items:center;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;margin-bottom:1.5rem;padding-bottom:1rem}.mobile-menu-close{background:none;border:none;color:var(--text);cursor:pointer;padding:.5rem}.mobile-nav-links{border-bottom:1px solid var(--border);list-style:none;margin-bottom:1.5rem;padding-bottom:1rem}.mobile-nav-links a{color:var(--text);display:block;font-size:.9rem;padding:.6rem 0}.mobile-nav-links a.active{color:var(--accent)}.mobile-menu .tree{margin:0}}@media(min-width:901px){.mobile-menu,.mobile-menu-backdrop,.mobile-menu-btn{display:none!important}}.lang-selector{display:flex;gap:.2rem;margin-left:.75rem}.lang-btn{background:none;border:1px solid var(--border);border-radius:4px;color:var(--text-secondary);cursor:pointer;font-family:inherit;font-size:.7rem;font-weight:500;line-height:1.4;padding:.15rem .45rem;transition:all .15s ease}.lang-btn.active,.lang-btn:hover{border-color:var(--text-secondary);color:var(--text)}.interactive-sim,.lang-btn.active{background:var(--bg-secondary)}.interactive-sim{border:1px solid var(--border);border-radius:8px;margin:2rem 0;padding:1.25rem}.interactive-sim h3{color:var(--accent);font-size:.85rem;letter-spacing:.04em;margin:0 0 1rem;text-transform:uppercase}.sim-canvas-wrap{margin-bottom:1rem;text-align:center}.sim-canvas-wrap canvas{background:var(--bg);border-radius:6px;cursor:crosshair;max-width:100%;touch-action:none}.sim-controls{margin-top:.75rem}.sim-slider-row{align-items:center;display:flex;gap:.75rem;margin-bottom:.4rem}.sim-label{color:var(--text-secondary);flex-shrink:0;font-size:.78rem;min-width:140px}.sim-range{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--border);border-radius:2px;flex:1;height:4px;outline:none}.sim-range::-webkit-slider-thumb{-webkit-appearance:none;background:var(--accent);border-radius:50%;cursor:pointer;height:14px;width:14px}.sim-value{color:var(--text);font-size:.78rem;font-variant-numeric:tabular-nums;min-width:45px;text-align:right}.sim-reset{background:none;border:1px solid var(--border);border-radius:4px;color:var(--text-secondary);cursor:pointer;font-family:inherit;font-size:.75rem;margin-top:.5rem;padding:.25rem .75rem}.sim-reset:hover{border-color:var(--text-secondary);color:var(--text)}.sim-hint{color:var(--text-secondary);font-size:.75rem;font-style:italic;margin-top:.5rem}@media(max-width:600px){.sim-label{font-size:.72rem;min-width:100px}.sim-slider-row{gap:.4rem}.sim-canvas-wrap canvas{max-width:100%}}.illustration{margin:2rem 0;text-align:center}.illustration svg{background:var(--bg-secondary);border-radius:8px;height:auto;max-width:100%}.illustration figcaption{color:var(--text-secondary);font-size:.85rem;margin-top:.75rem}.alt-path{fill:none;stroke:var(--text-secondary);stroke-dasharray:4 4;stroke-opacity:.3;stroke-width:1}.classical-path{fill:none;stroke:var(--accent);stroke-width:2.5}.endpoint,.point-label{fill:var(--text)}.point-label{font-size:14px;font-weight:600}.particle{fill:var(--accent)}.action-label{fill:var(--text-secondary);font-size:11px;text-anchor:middle}.classical-label{fill:var(--accent)}.original-path{fill:none;stroke:var(--accent);stroke-width:2.5}.varied-path{fill:none;opacity:.6;stroke:var(--text-secondary);stroke-dasharray:5 3;stroke-width:1.5}.axis-label{fill:var(--text-secondary);font-size:12px}.point-label-small{fill:var(--text-secondary);font-size:11px}.path-label{fill:var(--accent);font-size:12px;font-style:italic}.varied-label{fill:var(--text-secondary)}.quantum-path{animation:fadePath 2s ease-in-out infinite;fill:none;opacity:0;stroke:var(--text-secondary);stroke-width:1}@keyframes fadePath{0%,to{opacity:.1}50%{opacity:.4}}.emergent-classical{fill:none;filter:drop-shadow(0 0 4px var(--accent));stroke:var(--accent);stroke-width:3}.quantum-label{fill:var(--text-secondary);font-size:11px;text-anchor:middle}.symmetry-diagram{background:var(--bg-secondary);border-radius:8px;height:auto;max-width:100%}.sym-box{fill:none;stroke:var(--text-secondary);stroke-width:1.5}.cons-box{fill:none;stroke:var(--accent);stroke-width:1.5}.cons-text,.sym-text{fill:var(--text);font-size:12px;text-anchor:middle}.kepler-diagram{background:var(--bg-secondary);border-radius:8px;display:block;margin:0 auto;max-width:300px}.kepler-label{fill:var(--text-secondary);font-size:11px}.phase-space-diagram{background:var(--bg-secondary);border-radius:8px;height:auto;max-width:100%}.phase-label{fill:var(--text-secondary);font-size:11px;text-anchor:middle}.liouville-diagram{background:var(--bg-secondary);border-radius:8px;height:auto;max-width:100%}.liouville-label{fill:var(--text-secondary);font-size:11px;text-anchor:middle}.dirac-diagram{background:var(--bg-secondary);border-radius:8px;height:auto;max-width:100%}.dirac-symbol{fill:var(--accent);font-size:24px}.dirac-label{fill:var(--text-secondary);font-size:11px}.toolkit-diagram{background:var(--bg-secondary);border-radius:8px;height:auto;max-width:100%}.toolkit-box{fill:none;stroke:var(--border);stroke-width:1.5}.toolkit-label{fill:var(--text);font-size:10px;text-anchor:middle}.toolkit-center{fill:var(--accent);font-size:14px;font-weight:600;text-anchor:middle}.wavefunction-diagram{background:var(--bg-secondary);border-radius:8px;height:auto;max-width:100%}.diagram-label{font-size:11px;text-anchor:middle}.diagram-label,.diagram-label.secondary{fill:var(--text-secondary)}.uncertainty-diagram{background:var(--bg-secondary);border-radius:8px;height:auto;max-width:100%}.tradeoff-label{fill:var(--text-secondary);font-size:24px;text-anchor:middle}.superposition-diagram{background:var(--bg-secondary);border-radius:8px;height:auto;max-width:100%}.state-label{fill:var(--text);font-size:12px;text-anchor:middle}.operator-label{fill:var(--text-secondary);font-size:20px;text-anchor:middle}.double-pendulum-diagram,.pendulum-diagram{background:var(--bg-secondary);border-radius:8px;display:block;margin:0 auto;max-width:300px}.comparison-table,.groups-table,.operators-table{border-collapse:collapse;font-size:.9rem;margin:1.5rem 0;width:100%}.comparison-table td,.comparison-table th,.groups-table td,.groups-table th,.operators-table td,.operators-table th{border:1px solid var(--border);padding:.75rem;text-align:left}.comparison-table th,.groups-table th,.operators-table th{background:var(--bg-secondary);font-weight:600}.fade-enter-active{animation:fadeUp .4s cubic-bezier(.16,1,.3,1) forwards}.fade-leave-active{animation:fadeOut .15s ease forwards}@keyframes fadeUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}@media print{.lesson-nav,.progress-bar,.sidebar,nav{display:none}.container,.with-sidebar{display:block;max-width:100%}}