/* Readability and visual-depth pass: intentionally loaded last. */
:root{--reading:15px}body{font-size:var(--reading);line-height:1.65}.sidebar{width:270px;padding:30px 22px 22px}.main-shell{margin-left:270px}main{padding:0 54px;max-width:1680px}.topbar{padding:0 54px;height:72px}.brand>span:last-child{font-size:20px}.brand small{font-size:8px}.sidebar-caption{font-size:25px;line-height:1.55;margin:42px 12px 30px}.nav-group-label{font-size:11px;margin-top:22px}.nav-item{font-size:13px;padding:12px}.progress-label,.sidebar-bottom p,.text-button{font-size:11px}.hero{min-height:260px}.hero h1{font-size:44px}.hero-copy>p{font-size:14px;max-width:620px}.hero-tags{font-size:11px}.filter-button{font-size:12px;padding:9px 15px}.experiment{padding-top:38px}.experiment-heading h2{font-size:31px;margin-top:12px}.experiment-heading p{font-size:14px;max-width:830px}.lab-kicker{font-size:11px}.interactive-badge{font-size:10px}.learning-path{display:grid;grid-template-columns:1fr 28px 1fr 28px 1fr;align-items:center;background:#eef1e8;border:1px solid #dde4d7;border-radius:12px;padding:16px 20px;margin-bottom:18px}.learning-path>div{display:flex;flex-direction:column;gap:5px}.learning-path span{font:10px var(--mono);color:#87957e;letter-spacing:.5px}.learning-path strong{font-size:13px;font-weight:600;color:#405a4a}.learning-path>i{height:1px;background:#bdc9ba;position:relative}.learning-path>i:after{content:'›';position:absolute;right:-1px;top:-11px;color:#83967f;font-style:normal;font-size:17px}.workspace-grid{grid-template-columns:minmax(0,1fr) 350px;gap:22px}.canvas-topline{height:54px;padding:0 22px;font-size:12px}.canvas-version{font-size:10px}.canvas-tools{display:flex;align-items:center;gap:14px}.canvas-tools button{border:0;background:#eef1e8;border-radius:5px;padding:7px 10px;color:#526b5a;font-size:10px}.canvas-tools button:hover{background:#dfe8db}.parameter-bar{padding:18px 22px 10px;min-height:70px;gap:10px}.parameter-label{font-size:11px}.scenario-button{font-size:11px;padding:8px 11px}.param-input,.param-select{font-size:12px;padding:7px 9px}.visual-stage{min-height:410px}.visual-stage>svg{min-height:390px;max-height:500px;filter:drop-shadow(0 12px 20px rgba(48,74,58,.035))}.visual-stage svg [font-size="6"],.visual-stage svg [font-size="6.5"],.visual-stage svg [font-size="7"],.visual-stage svg [font-size="7.2"],.visual-stage svg [font-size="7.5"],.visual-stage svg [font-size="8"]{font-size:9.5px}.visual-stage svg [font-size="9"]{font-size:10.5px}.visual-stage svg [font-size="10"]{font-size:11.5px}.visual-stage svg [font-size="11"]{font-size:12.5px}.visual-stage svg [font-size="12"]{font-size:13.5px}.visual-stage[data-lab="sorting"] svg rect,.visual-stage[data-lab="cache"] svg rect{filter:drop-shadow(0 5px 4px rgba(57,76,64,.08))}.visual-stage[data-lab="avl"] svg circle,.visual-stage[data-lab="dijkstra"] svg circle{filter:drop-shadow(0 7px 5px rgba(46,74,57,.12))}.visual-stage[data-lab="memory"] svg>g,.visual-stage[data-lab="interrupt"] svg>g{filter:drop-shadow(0 6px 5px rgba(46,74,57,.07))}.visual-stage[data-lab="congestion"]{background-image:linear-gradient(180deg,rgba(240,244,235,.55),rgba(255,254,250,.2)),radial-gradient(#d8dfd2 .7px,transparent .7px)}.stage-legend{font-size:10px;padding-bottom:16px}.transport{padding:16px 20px 13px}.play-button{height:38px;font-size:12px;min-width:120px}.step-button{width:35px;height:35px}.frame-counter{font-size:11px}.insight-panel{padding:24px}.insight-top{font-size:12px}.step-pill{font-size:9px}.step-title{font-size:21px;line-height:1.45;margin:24px 0 12px}.step-copy{font-size:14px;line-height:1.9;min-height:96px}.step-formula{font-size:13px;line-height:1.8;padding:14px;margin:17px 0 20px}.section-mini-title{font-size:10px}.principle-box p,.observation-note p{font-size:13px;line-height:1.85}.under-lab{padding:24px 4px}.takeaway{max-width:900px}.takeaway p{font-size:13px}.concept-deep-dive{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;padding:0 0 34px;border-bottom:1px solid var(--line)}.concept-deep-dive article{display:flex;gap:15px;padding:20px;border-radius:10px;border:1px solid #dfe4d8;min-height:150px}.analogy-card{background:#f2f4ec}.mistake-card{background:#fff3eb}.transfer-card{background:#eaf2ed}.deep-number{flex:0 0 30px;width:30px;height:30px;display:grid;place-items:center;border-radius:8px;background:#fffefa;font:600 13px var(--mono);color:#657b6c;box-shadow:0 3px 10px #263d2c0b}.concept-deep-dive h3{font-size:14px;margin:3px 0 10px;font-weight:600}.concept-deep-dive p{font-size:12px;line-height:1.9;color:#68796d;margin:0}.lab-cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.lab-card{min-height:170px;padding:20px}.lab-card h4{font-size:17px}.lab-card p{font-size:11px;line-height:1.8}.section-heading h3{font-size:23px}.more-section{padding-top:36px}.zoom-stage{position:fixed!important;z-index:120;inset:28px!important;min-height:calc(100vh - 56px)!important;background:#fffefa!important;border:1px solid #d8e1d5;border-radius:16px;box-shadow:0 30px 100px #1f34294d;padding:34px;overflow:auto!important}.zoom-stage>svg{height:calc(100vh - 120px)!important;max-height:none!important;min-width:950px}.zoom-backdrop{position:fixed;inset:0;z-index:110;background:#20342b73;backdrop-filter:blur(8px)}body.visual-zoom{overflow:hidden}.zoom-close{display:none;position:fixed;z-index:140;right:45px;top:43px;border:0;border-radius:7px;background:#243632;color:#fffefa;padding:10px 14px;font-size:12px;box-shadow:0 6px 24px #1f342933}body.visual-zoom .zoom-close{display:block}
@media(max-width:1250px){.sidebar{width:235px}.main-shell{margin-left:235px}main,.topbar{padding-left:30px;padding-right:30px}.workspace-grid{grid-template-columns:minmax(0,1fr) 310px}.hero h1{font-size:36px}.step-copy{font-size:13px}.concept-deep-dive p{font-size:11px}}
@media(max-width:1050px){.workspace-grid{grid-template-columns:1fr}.insight-panel{display:block}.principle-box{border-top:1px solid #dae2cd;padding-top:17px}.visual-stage{min-height:390px}.concept-deep-dive{grid-template-columns:1fr 1fr}.transfer-card{grid-column:1/-1}.hero h1{font-size:34px}}
@media(max-width:760px){.sidebar{width:270px}.main-shell{margin-left:0}main,.topbar{padding-left:18px;padding-right:18px}.hero h1{font-size:34px}.hero-copy>p{font-size:13px;max-width:100%}.experiment-heading h2{font-size:26px}.experiment-heading p{font-size:13px}.learning-path{grid-template-columns:1fr;padding:15px;gap:11px}.learning-path>i{display:none}.learning-path>div{padding-bottom:10px;border-bottom:1px solid #d7dfd3}.learning-path>div:last-child{padding-bottom:0;border-bottom:0}.learning-path strong{font-size:12px}.canvas-topline{height:50px;font-size:11px}.canvas-version{display:none}.canvas-tools button{font-size:9px;padding:6px 8px}.visual-stage{min-height:360px;display:block;overflow-x:auto;overscroll-behavior-inline:contain}.visual-stage>svg{width:680px;max-width:none;min-height:350px}.visual-stage:after{content:'左右滑动查看完整图解';position:sticky;left:12px;bottom:8px;display:inline-block;background:#243632e8;color:#fffefa;border-radius:4px;padding:5px 8px;font-size:9px;pointer-events:none}.insight-panel{padding:20px}.step-title{font-size:20px}.step-copy{font-size:14px;min-height:0}.principle-box p,.observation-note p{font-size:13px}.concept-deep-dive{grid-template-columns:1fr}.transfer-card{grid-column:auto}.concept-deep-dive article{min-height:0}.takeaway p{font-size:12px}.lab-cards{grid-template-columns:1fr 1fr}.lab-card{min-height:160px}.lab-card h4{font-size:15px}.lab-card p{font-size:10px}.zoom-stage{inset:10px!important;padding:18px;min-height:calc(100vh - 20px)!important}.zoom-stage>svg{height:calc(100vh - 60px)!important;min-width:850px}.filter-list{justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap}.filter-button{font-size:11px}.topbar{height:64px}}
@media(max-width:430px){.hero h1{font-size:31px}.lab-cards{grid-template-columns:1fr}.lab-card{min-height:150px}.experiment-heading h2{font-size:24px}.visual-stage{min-height:340px}.step-title{font-size:19px}.step-copy{font-size:14px}.concept-deep-dive p{font-size:13px}.parameter-bar{padding:15px}.scenario-button{font-size:10px}.canvas-tools button{font-size:10px}}
