:root{--bg:#f4f6fb;--panel:#fff;--nav:#101a2d;--ink:#1d2940;--muted:#6a7890;--line:#e3e8f1;--primary:#4f46e5;--primary-soft:#efedff;--green:#16866f;--green-soft:#e8f6ef;--amber:#b9750e;--amber-soft:#fff5dc;--red:#bd4055;--radius:16px;--mono:'Cascadia Code',Consolas,'Microsoft YaHei',monospace;--shadow:0 4px 24px rgba(29,41,64,.035)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font:14px/1.7 -apple-system,BlinkMacSystemFont,'Segoe UI','Microsoft YaHei',sans-serif;background:var(--bg);color:var(--ink)}a{color:var(--primary);text-decoration:none}a:hover{text-decoration:underline}button,input,select,textarea{font:inherit}button,a,input,select,textarea{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:default;opacity:.45}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #928bff;outline-offset:3px}button svg{vertical-align:middle}button{color:inherit}input,textarea,select{min-width:0;border:1px solid var(--line);border-radius:9px;background:white;padding:9px 11px;color:var(--ink)}textarea{resize:vertical;line-height:1.7}h1,h2,h3,h4,p{margin-top:0}h1,h2,h3,h4{line-height:1.4;letter-spacing:-.035em}h1{font-size:29px;margin-bottom:12px}h2{font-size:20px;margin-bottom:15px}h3{font-size:16px;margin-bottom:10px}h4{font-size:14px;margin-bottom:7px}p{margin-bottom:12px}small{font-size:12px}.muted{color:var(--muted)}.mono,code,pre{font-family:var(--mono)}code{font-size:.94em}p code,li code{background:#edf0f7;padding:2px 5px;border-radius:4px}.tiny{font-size:11px}.eyebrow{font-size:11px;letter-spacing:.13em;text-transform:uppercase;font-weight:700;color:var(--primary);margin-bottom:12px}.skip-link{position:fixed;left:20px;top:-60px;background:white;padding:10px;z-index:300}.skip-link:focus{top:10px}[hidden]{display:none!important}
#sidebar{position:fixed;inset:0 auto 0 0;width:246px;background:var(--nav);color:#b7c4d8;display:flex;flex-direction:column;padding:29px 15px 14px;z-index:40}.brand{display:flex;align-items:center;gap:11px;padding:0 8px;color:#f7f9ff;margin-bottom:29px}.brand:hover{text-decoration:none}.brand-mark{font-family:var(--mono);display:grid;grid-template-columns:9px 17px 9px;align-items:center;width:44px;height:44px;border:1px solid #53628a;border-radius:12px;background:#243153;font-size:18px;justify-content:center;color:#bcb8ff}.brand-mark b{font-size:24px;color:#fff}.brand strong{font-size:15px;letter-spacing:.02em;display:block}.brand small{display:block;color:#7f90ad;margin-top:1px;font-size:11px;letter-spacing:.04em}.nav-search{display:flex;align-items:center;gap:8px;background:#1d2940;border:1px solid #2d3a51;border-radius:9px;margin:0 5px 25px;padding:0 10px}.nav-search input{background:none;border:0;min-width:0;padding:9px 0;color:white;outline:none;font-size:12px;width:100%}.nav-search input::placeholder{color:#8091ac}.nav-search>span{font-size:22px}.nav-search kbd{font-size:10px;background:#28364e;color:#899bb7;padding:0 4px;border-radius:3px}#navigation{overflow-y:auto;flex:1;padding:0 4px;scrollbar-width:thin;scrollbar-color:#3b4b68 transparent}.nav-section{font-size:10px;letter-spacing:.12em;color:#687d9d;margin:23px 11px 7px}.nav-link{display:flex;align-items:center;gap:11px;padding:9px 12px;color:#aebed5;border-radius:8px;margin:3px 0;font-size:13px}.nav-link:hover{background:#1c2a42;color:white;text-decoration:none}.nav-link.active{background:#4f46e5;color:white}.nav-icon{font-size:15px;width:19px;text-align:center;opacity:.88}.nav-count{margin-left:auto;font:11px var(--mono);padding:1px 5px;border-radius:5px;background:rgba(255,255,255,.07);color:#9babca}.nav-link.active .nav-count{color:#d8d5ff}.sidebar-footer{font-size:10px;color:#8b9db7;padding:15px 10px 0;border-top:1px solid #26334a;margin-top:14px}.online-dot{width:6px;height:6px;background:#7ab8a5;display:inline-block;border-radius:50%;margin-right:6px}.sidebar-footer a{display:block;margin-top:7px;color:#b2c2d9}.sidebar-footer a span{float:right}#main{margin-left:246px;padding:0 34px;max-width:1900px;min-height:100vh}.topbar{height:78px;display:flex;align-items:center;justify-content:space-between;gap:15px;border-bottom:1px solid var(--line);margin-bottom:30px;color:var(--muted);font-size:12px}.topbar-actions{display:flex;align-items:center;gap:10px}.local-badge{font-size:10px;border:1px solid #dbe7e3;color:#648478;background:#f3f9f6;border-radius:6px;padding:2px 8px}.button{display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:9px 16px;border-radius:8px;background:white;border:1px solid #dce1eb;color:var(--ink);font-size:12px;font-weight:500;line-height:1.5;text-decoration:none;white-space:nowrap}.button:hover{background:#f8f9fd;border-color:#c9d0e2;text-decoration:none}.button.primary{background:var(--primary);border-color:var(--primary);color:white;box-shadow:0 3px 9px #4f46e519}.button.primary:hover{background:#4038cc}.button.small{padding:6px 10px;font-size:11px}.button.quiet{border-color:transparent;background:transparent;color:var(--muted)}.button.danger{color:var(--red);border-color:#eccbd2}.button.icon{width:30px;height:30px;padding:0;border-radius:50%}.button.green{background:var(--green-soft);color:var(--green);border-color:#d3e9df}.button.active{background:var(--primary-soft);color:var(--primary);border-color:#d5d0ff}.button-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.main-footer{margin-top:50px;padding:20px 0;border-top:1px solid var(--line);display:flex;justify-content:space-between;color:#96a2b5;font-size:10px}.mobile-toggle,#scrim{display:none}.loading-state{padding:80px;color:var(--muted);text-align:center}.panel{background:white;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:23px}.tag{display:inline-flex;align-items:center;padding:2px 8px;border-radius:5px;background:#f0f2f7;color:#67758d;font-size:10px;line-height:1.7}.tag.purple{color:var(--primary);background:var(--primary-soft)}.tag.green{color:var(--green);background:var(--green-soft)}.tag.amber{color:var(--amber);background:var(--amber-soft)}.tag.red{color:var(--red);background:#fff0f2}.tags{display:flex;gap:6px;flex-wrap:wrap}.section-head{display:flex;justify-content:space-between;align-items:center;gap:15px;margin:30px 0 14px}.section-head h2{margin:0}.section-head small{color:var(--muted)}.subtle-rule{height:1px;background:var(--line);margin:20px 0}.empty-state{padding:50px 25px;text-align:center;color:var(--muted)}.empty-state .big{font-size:28px;color:#bab5e8;margin-bottom:10px}
.home-hero{display:grid;grid-template-columns:1.16fr 1fr;background:linear-gradient(115deg,#fff 0%,#fbfaff 60%,#f0efff 100%);border:1px solid #e0dff0;border-radius:20px;padding:32px 34px;gap:25px;min-height:300px;position:relative;overflow:hidden}.home-hero h1{font-size:34px;font-weight:700;line-height:1.5;letter-spacing:-.04em;max-width:550px;margin-bottom:13px}.home-hero h1 em{font-style:normal;color:var(--primary)}.hero-copy{font-size:12px;line-height:1.9;color:var(--muted);max-width:440px;margin-bottom:22px}.hero-art{display:flex;flex-direction:column;justify-content:center;min-width:0}.example-label{font-size:10px;letter-spacing:.04em;color:#877ea6;margin-bottom:16px;display:flex;justify-content:space-between}.hero-code-line{font:12px/1.9 var(--mono);color:#6a638e;margin-top:14px;border-top:1px dashed #d7d2ec;padding-top:11px}.hero-tiles{display:flex;gap:8px;justify-content:space-between;align-items:stretch}.hero-tile{min-width:45px;flex:1;text-align:center;background:white;border:1px solid #d8d4eb;border-radius:10px;padding:13px 6px;box-shadow:0 5px 8px #4a3a7c05;font:21px var(--mono);position:relative}.hero-tile small{font:9px var(--mono);display:block;color:#9d92b6;margin-top:8px}.hero-tile.highlight{background:#6055e4;color:white;border-color:#6055e4;transform:translateY(-5px);box-shadow:0 6px 15px #4f46e526}.hero-tile.highlight small{color:#d1caff}.hero-result{display:flex;justify-content:space-between;margin-top:15px;font-size:10px;color:#81759e}.hero-result b{font:12px var(--mono);color:var(--primary)}.stat-strip{display:grid;grid-template-columns:repeat(4,1fr);padding:20px 0;border-bottom:1px solid var(--line);gap:10px}.stat-item{padding:4px 23px;border-right:1px solid var(--line);display:flex;align-items:baseline;gap:11px}.stat-item:first-child{padding-left:0}.stat-item:last-child{border-right:0}.stat-item b{font:26px/1.2 var(--mono);letter-spacing:-.06em}.stat-item span{font-size:11px;color:var(--muted)}.home-columns{display:grid;grid-template-columns:1.35fr 1fr;gap:22px;margin-top:24px}.plan-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:13px}.plan-head h3{margin:0}.budget-switch{display:flex;gap:3px;padding:3px;background:#f2f4f9;border-radius:7px}.budget-switch button{border:0;background:transparent;color:var(--muted);font-size:10px;padding:4px 8px;border-radius:5px}.budget-switch button.active{background:white;box-shadow:0 1px 4px #10233a12;color:var(--primary)}.task-row{display:flex;align-items:center;gap:13px;padding:11px 0;border-bottom:1px solid #eef0f6}.task-row:last-child{border:0}.task-index{height:28px;width:28px;border-radius:8px;background:var(--primary-soft);display:grid;place-items:center;font:11px var(--mono);color:var(--primary);flex:none}.task-body{min-width:0;flex:1}.task-body strong{font-size:12px;display:block}.task-body small{font-size:10px;color:var(--muted)}.task-arrow{color:#9b98c2}.why-card{background:#f9fafc;border:1px solid var(--line);padding:23px;border-radius:var(--radius)}.why-card p{font-size:12px;color:var(--muted);line-height:1.9}.why-card h3{font-size:15px}.learning-path{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin:22px 0}.path-step{font-size:10px;color:#766e9b;background:white;border:1px solid #e4e0ef;padding:5px 8px;border-radius:6px}.path-arrow{color:#c2bad3;font-size:11px}.card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.lesson-card{position:relative;display:flex;flex-direction:column;gap:12px;padding:20px 22px;background:white;border:1px solid var(--line);border-radius:12px;color:var(--ink);transition:transform .15s,box-shadow .15s}.lesson-card:hover{text-decoration:none;transform:translateY(-2px);box-shadow:0 7px 20px #2533500a;border-color:#cbc5ee}.lesson-card h3{font-size:15px;margin:0}.lesson-card p{font-size:11px;color:var(--muted);line-height:1.8;margin-bottom:0;flex:1}.card-meta{display:flex;justify-content:space-between;align-items:center;font-size:10px;color:#8b96a9}.card-year{font:11px var(--mono);color:#8277af}.card-category{width:31px;height:31px;background:#f2f0fb;color:#8c7cc6;display:grid;place-items:center;border-radius:9px;font:16px var(--mono)}.card-top{display:flex;justify-content:space-between;align-items:center}.filter-bar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:22px 0}.filter-bar select{font-size:12px;padding:7px 10px}.filter-bar .count{margin-left:auto;font-size:11px;color:var(--muted)}.page-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}.page-heading p{font-size:12px;color:var(--muted);max-width:720px;line-height:1.9}.page-heading .button-row{flex:none;padding-top:5px}
.lesson-tabs{display:flex;align-items:center;gap:3px;border-bottom:1px solid #dce1ec;margin:24px 0}.lesson-tabs button{padding:11px 19px;color:var(--muted);background:none;border:0;border-bottom:2px solid transparent;font-size:12px}.lesson-tabs button.active{border-color:var(--primary);color:var(--primary);font-weight:600}.lesson-tabs .tab-end{margin-left:auto;font-size:10px;color:#929bb0}.problem-card{background:#fff;border:1px solid var(--line);border-left:3px solid #8276e8;border-radius:9px;padding:17px 20px;margin-bottom:19px}.problem-card .label{font-size:10px;color:#978eb9;font-weight:600;margin-bottom:7px}.problem-card p{font-size:12px;margin:0;line-height:1.9;white-space:pre-wrap}.problem-card details{margin-top:10px;font-size:11px;color:var(--muted)}summary{cursor:pointer}.constraints{display:flex;flex-wrap:wrap;gap:7px;margin-top:12px}.constraints span{font-size:10px;padding:2px 8px;background:#f7f6fc;border-radius:4px;color:#817799}.lecture-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(290px,.72fr);gap:18px;align-items:start}.demo-panel{padding:0;overflow:hidden;min-width:0}.demo-heading{display:flex;justify-content:space-between;align-items:center;padding:15px 18px;border-bottom:1px solid var(--line);gap:10px}.demo-heading h3{margin:0;font-size:13px}.demo-heading .mode-toggle{font-size:10px;display:flex;align-items:center;gap:6px;color:var(--muted)}.demo-heading input{accent-color:var(--primary)}.config-form{display:flex;align-items:flex-end;gap:9px;flex-wrap:wrap;padding:14px 18px;background:#fcfcff;border-bottom:1px solid var(--line)}.config-form label{display:flex;flex-direction:column;gap:3px;flex:1;min-width:100px;font-size:10px;color:var(--muted)}.config-form input{padding:5px 8px;font:11px/1.6 var(--mono);width:100%;border-radius:6px}.config-presets{display:flex;gap:6px;flex-wrap:wrap;padding:0 18px 11px;background:#fcfcff}.preset-button{font-size:9px;border:1px solid #e7e4f3;background:white;padding:3px 8px;border-radius:4px;color:#8b7cad}.config-error{padding:9px 18px;background:#fff0f2;color:var(--red);font-size:11px}.scene{min-height:245px;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:28px 21px;background:radial-gradient(#e8e7ef .6px,transparent .6px);background-size:15px 15px;overflow:auto;max-height:450px}.scene-caption{font-size:10px;color:#a099b0;margin-bottom:23px;align-self:flex-start;letter-spacing:.05em}.array-board{display:flex;align-items:flex-end;justify-content:center;gap:7px;flex-wrap:wrap;width:100%;padding:12px 0}.array-unit{display:flex;flex-direction:column;align-items:center;position:relative;min-width:42px}.array-pointer{font:10px/1.4 var(--mono);color:var(--primary);min-height:19px;margin-bottom:4px}.array-cell{display:grid;place-items:center;min-width:43px;min-height:44px;padding:5px 9px;border-radius:8px;border:1px solid #ccc9df;background:white;font:17px var(--mono);color:#4c5069;box-shadow:0 3px 5px #20153705;transition:background .18s,transform .18s}.array-cell.active{background:var(--primary);color:white;border-color:var(--primary);transform:translateY(-3px)}.array-cell.done{background:#e8f5ee;border-color:#bddecc;color:var(--green)}.array-index{font:9px var(--mono);color:#a6a0b6;margin-top:6px}.array-label{font-size:10px;color:var(--muted);align-self:flex-start;width:100%;margin-bottom:6px}.output-row{border-top:1px dashed #d9d3e4;margin-top:16px;padding-top:16px;width:100%}.output-row .array-cell{border-style:dashed;background:#f7f5ff;color:var(--primary);font-size:14px;min-height:36px}.frame-explain{padding:17px 19px;border-top:1px solid var(--line);background:#fff}.frame-explain h4{font-size:13px;color:#49406e}.frame-explain p{font-size:11px;color:var(--muted);margin-bottom:9px;line-height:1.85}.invariant{font-size:10px;color:#84759d;border-left:2px solid #d1c5ed;padding:2px 0 2px 9px}.variables{display:flex;flex-wrap:wrap;gap:6px;padding:0 19px 15px}.variable{background:#f3f4fa;border:1px solid #e8e9f1;border-radius:5px;padding:3px 8px;font:10px var(--mono);color:#657089}.variable b{color:#4d477c;margin-left:6px}.player{border-top:1px solid var(--line);padding:13px 18px;background:#fafbff}.player-top{display:flex;gap:7px;align-items:center;flex-wrap:wrap}.player-top .step-indicator{font:10px var(--mono);color:var(--muted);margin-left:auto}.player input[type=range]{width:100%;padding:0;accent-color:var(--primary);margin:11px 0 0;height:14px;border:0;background:none}.player select{padding:4px 6px;font-size:10px}.prediction-box{margin:0 18px 15px;border:1px solid #e4d8b1;background:#fffbf0;border-radius:8px;padding:13px}.prediction-box p{font-size:11px;font-weight:600;margin:0 0 8px}.prediction-options{display:grid;gap:5px}.prediction-options button{text-align:left;background:white;border:1px solid #eadfca;border-radius:5px;font-size:10px;padding:6px 9px}.prediction-options button.correct{background:var(--green-soft);border-color:#99cbb7}.prediction-options button.wrong{background:#fff0f2;border-color:#e8a9b5}.prediction-feedback{font-size:10px;margin-top:8px;color:#8d7738}.code-panel{padding:0;overflow:hidden}.code-header{display:flex;align-items:center;justify-content:space-between;padding:14px 17px;border-bottom:1px solid var(--line)}.code-header h3{font-size:12px;margin:0}.code-body{background:#182238;color:#c7d3e8;max-height:420px;overflow:auto;padding:12px 0;font:11px/1.9 var(--mono);tab-size:4;counter-reset:line}.code-line{display:block;white-space:pre;min-height:21px;padding-right:15px;counter-increment:line}.code-line:before{content:counter(line);display:inline-block;width:34px;text-align:right;margin-right:16px;color:#536780;font-size:9px;user-select:none}.code-line.noted{background:#bca9f00d}.code-line button{padding:0;background:transparent;border:0;color:inherit;font:inherit;text-align:left}.code-comment{color:#7d9ea6}.line-note{background:#f5f2fc;padding:10px 15px;font-size:10px;color:#7c6799;border-bottom:1px solid #e5ddf2}.code-summary{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line)}.code-summary>div{padding:12px 16px;min-width:0}.code-summary>div:first-child{border-right:1px solid var(--line)}.code-summary small{display:block;font-size:9px;color:var(--muted)}.code-summary b{font:12px/1.7 var(--mono);display:block;overflow-wrap:anywhere;margin-top:3px}.learning-notes{margin-top:20px}.notes-columns{display:grid;grid-template-columns:1fr 1fr;gap:18px}.note-block{padding:20px 23px}.note-block p,.note-block li{font-size:12px;line-height:1.9}.note-block ul,.note-block ol{padding-left:19px;margin-bottom:0}.note-block .baseline{color:var(--muted);font-size:11px}.pitfall{border-top:1px solid var(--line);padding-top:13px;margin-top:13px}.pitfall strong{font-size:12px;color:#9c5568}.pitfall p{font-size:11px;margin:5px 0}.counterexample{font:11px/1.7 var(--mono);background:#f7f5fb;padding:7px 10px;border-radius:5px;overflow-wrap:anywhere}.source-foot{font-size:10px;color:#8c98ab;margin:18px 0;line-height:1.9}.source-foot a{margin-right:13px}.personal-note{margin-top:18px}.personal-note textarea{width:100%;min-height:95px;font-size:12px}.personal-note .save-state{font-size:10px;color:var(--muted)}
.tree-svg{width:100%;min-height:170px;max-height:300px}.tree-svg text{font-family:var(--mono);font-size:12px;fill:#4c4669}.tree-svg .node-fill{fill:white;stroke:#ccc5df;stroke-width:1.4}.tree-svg .active .node-fill{fill:var(--primary);stroke:var(--primary)}.tree-svg .active text{fill:white}.tree-svg line{stroke:#c7bfd9;stroke-width:1.4}.matrix{border-collapse:separate;border-spacing:4px;font:11px var(--mono);margin:auto}.matrix td{border:1px solid #e3dfee;background:#fff;border-radius:4px;min-width:30px;height:30px;text-align:center;padding:4px 8px}.matrix td.edge{background:#e9e4fb;color:var(--primary);border-color:#d3c9ef}.matrix td.active{background:#7061e0;color:white}.matrix th{font-weight:500;color:#9d8eaf;min-width:25px;font-size:10px}.graph-layout{display:flex;gap:22px;align-items:center;justify-content:center;flex-wrap:wrap;width:100%}.graph-layout .tree-svg{max-width:280px;min-height:190px;flex:1}.degree-list{display:flex;gap:6px;flex-wrap:wrap;width:100%;justify-content:center;margin-top:16px}.degree-item{font:10px var(--mono);background:white;border:1px solid var(--line);padding:4px 8px;border-radius:5px}.list-board{display:flex;align-items:center;justify-content:center;gap:0;flex-wrap:wrap;padding:16px 0;width:100%}.list-node{display:flex;flex-direction:column;align-items:center;padding:5px 0}.list-node .array-cell{font-size:15px;min-width:40px}.list-node small{font:8px var(--mono);color:#9e92b0;margin-top:5px}.list-arrow{margin:0 6px;color:#b8aecd;align-self:center}.heads{font:10px var(--mono);color:#8775ab;margin-bottom:10px;display:flex;gap:15px;flex-wrap:wrap}.state-table{border-collapse:collapse;width:100%;font-size:11px;text-align:left;background:white}.state-table td,.state-table th{border:1px solid #e6e3ee;padding:7px 10px;max-width:230px;overflow-wrap:anywhere}.state-table th{background:#f1eef8;color:#827498;font-weight:500}.state-json{white-space:pre-wrap;overflow-wrap:anywhere;font:10px/1.7 var(--mono);margin:0;width:100%}
.answer-layout{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(245px,.7fr);gap:19px;align-items:start}.answer-form{padding:23px}.answer-label{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:8px}.answer-label label{font-size:13px;font-weight:600}.answer-label small{font-size:10px;color:var(--muted)}.answer-form textarea{width:100%;font-size:12px;margin-bottom:19px}.answer-form textarea.code-editor{min-height:270px;font:12px/1.85 var(--mono);background:#f9faff;tab-size:4}.answer-form textarea.idea-editor{min-height:115px}.answer-form textarea.complexity-editor{min-height:85px}.answer-side{position:sticky;top:20px}.answer-side h3{font-size:13px}.checklist{padding:0;margin:0;list-style:none}.checklist li{font-size:11px;line-height:1.8;display:flex;gap:8px;padding:6px 0;color:var(--muted)}.checklist input{margin-top:4px;accent-color:var(--primary)}.timer{font:30px/1.2 var(--mono);letter-spacing:-.04em;color:#7a6ba1;margin:16px 0}.timer.running{color:var(--primary)}.timer-label{font-size:10px;color:var(--muted)}.answer-reference{margin-top:18px;padding:20px;border:1px solid #d7d0ef;background:#fbfaff;border-radius:12px}.answer-reference p{font-size:12px;line-height:1.9;white-space:pre-wrap}.answer-reference pre{max-height:500px;overflow:auto;background:#1b263c;color:#d3daee;padding:17px;border-radius:8px;font-size:11px;line-height:1.8}.answer-save{font-size:10px;color:#7a8d87}.paper-check{font-size:11px;color:var(--muted);display:flex;gap:8px;align-items:center;margin-bottom:15px}.paper-check input{accent-color:var(--primary)}.hint-level{margin-bottom:17px;padding:12px 14px;border-radius:8px;background:#f4f1fd;font-size:11px;color:#8069a6}.error-tags{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0}.error-tags label{font-size:10px;background:#f5f1f8;border:1px solid #e6ddeb;border-radius:5px;padding:4px 7px;color:#8f738f;display:flex;align-items:center;gap:5px}.error-tags input{accent-color:var(--red);width:12px;height:12px;padding:0}.variant-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}.variant-pill{font-size:11px;border:1px solid #ded8ef;border-radius:7px;background:white;padding:7px 12px;color:#8b78a8}.variant-pill.active{background:var(--primary);color:white;border-color:var(--primary)}.practice-card{max-width:1000px;margin:0 auto;padding:27px}.practice-number{font-size:10px;color:var(--primary);letter-spacing:.06em;font-weight:600;margin-bottom:15px}.practice-card .question{font-size:14px;line-height:1.95;white-space:pre-wrap;margin-bottom:22px}.choice-list{display:grid;gap:9px;margin:18px 0}.choice-option{display:flex;align-items:flex-start;gap:12px;border:1px solid #e0dfea;border-radius:9px;padding:13px 16px;font-size:12px;cursor:pointer}.choice-option:has(input:checked){border-color:#9c8def;background:#f6f3ff}.choice-option input{margin-top:5px;accent-color:var(--primary);flex:none}.choice-option .letter{font:11px var(--mono);color:#8e7eaf;margin-top:2px}.variant-answer{width:100%;min-height:110px;margin-bottom:13px;font:12px/1.8 var(--mono)}.fill-answer{min-height:45px}.feedback{padding:17px 20px;border-radius:9px;background:#f2f9f5;border:1px solid #cde5d6;margin-top:20px}.feedback.wrong{background:#fff4f5;border-color:#f0d4db}.feedback.self{background:#f7f5fc;border-color:#ddd5ef}.feedback h4{font-size:13px;margin:0 0 8px;color:#4c8668}.feedback.wrong h4{color:var(--red)}.feedback.self h4{color:#8a70b0}.feedback p{font-size:12px;white-space:pre-wrap;line-height:1.9}.feedback pre{white-space:pre-wrap;overflow-wrap:anywhere;font:11px/1.8 var(--mono)}.hint-text{font-size:11px;background:#fff9e9;color:#9c813c;padding:12px;border-radius:7px;margin-bottom:13px}.order-row{display:flex;align-items:center;gap:10px;background:#f8f7fc;border:1px solid #e8e4f0;border-radius:7px;padding:10px 13px;margin:7px 0;font-size:12px}.order-row>span{flex:1;min-width:0}.order-row b{font:10px var(--mono);color:#9580b3}.versions{margin-top:15px;font-size:11px}.versions button{margin:4px}.template-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.template-card{display:flex;flex-direction:column;padding:23px;gap:8px}.template-card .template-id{font:11px var(--mono);color:#9c89b8}.template-card h3{font-size:16px}.template-card p{font-size:12px;color:var(--muted)}.template-card ol{font-size:11px;color:var(--muted);padding-left:17px}.template-card .button-row{margin-top:auto}.source-card{margin-bottom:13px}.source-card h3{font-size:14px}.source-card p{font-size:11px;color:var(--muted)}.record-stats{display:flex;gap:20px;flex-wrap:wrap;padding:18px 0}.record-stats b{font:23px var(--mono);margin-right:7px}.record-stats span{font-size:11px;color:var(--muted)}.history-row{padding:14px 0;border-bottom:1px solid var(--line);display:flex;gap:15px;align-items:center}.history-row>div{flex:1;min-width:0}.history-row strong{font-size:12px}.history-row p{font-size:10px;color:var(--muted);margin:3px 0 0}.record-preview{font:10px/1.7 var(--mono);white-space:pre-wrap;background:#f6f7fb;padding:10px;border-radius:5px;max-height:150px;overflow:auto}.import-text{width:100%;min-height:130px;font:11px/1.7 var(--mono)}.notice{padding:14px 18px;border:1px solid #e9dfc7;border-radius:9px;background:#fffaf0;color:#9a824d;font-size:11px;line-height:1.9;margin:17px 0}.notice.info{background:#f3f1fc;color:#8973a4;border-color:#ded7ef}.flex-spacer{flex:1}.session-banner{display:flex;justify-content:space-between;align-items:center;gap:15px;background:#eae6fb;border:1px solid #d4caef;color:#7960a6;padding:12px 18px;border-radius:9px;margin-bottom:18px;font-size:12px}.all-steps{counter-reset:step}.lesson-step{padding:12px 0 12px 35px;position:relative;border-bottom:1px solid var(--line)}.lesson-step:before{counter-increment:step;content:counter(step);position:absolute;left:0;top:14px;width:23px;height:23px;display:grid;place-items:center;background:#efebf9;color:#8e73b1;border-radius:6px;font:10px var(--mono)}.lesson-step h4{font-size:12px}.lesson-step p{font-size:11px;color:var(--muted);white-space:pre-wrap;margin:0}.template-detail{max-width:1050px}.two-column{display:grid;grid-template-columns:1fr 1fr;gap:20px}.search-results strong{color:var(--primary)}
#toast{position:fixed;bottom:25px;left:calc(50% + 90px);transform:translateX(-50%) translateY(20px);background:#263550;color:white;padding:11px 20px;border-radius:9px;box-shadow:0 6px 20px #1d2b3f25;font-size:12px;z-index:200;opacity:0;pointer-events:none;transition:.2s;max-width:90vw}#toast.show{opacity:1;transform:translateX(-50%) translateY(0)}dialog{border:1px solid var(--line);border-radius:16px;box-shadow:0 20px 80px #19233f40;max-width:650px;width:calc(100% - 35px);padding:27px}dialog::backdrop{background:#17223b66;backdrop-filter:blur(2px)}.dialog-actions{display:flex;justify-content:flex-end;margin-top:25px}#dialog-content h2{font-size:19px}#dialog-content p,#dialog-content li{font-size:12px;line-height:1.9}.print-sheet{max-width:950px;margin:auto;background:white;padding:35px;border:1px solid var(--line);border-radius:12px}.print-sheet pre{white-space:pre-wrap;overflow-wrap:anywhere;font:11px/1.7 var(--mono);background:#f6f6fa;padding:15px}.print-sheet p,.print-sheet li{font-size:12px;white-space:pre-wrap}.print-sheet h2{margin-top:30px}.print-sheet article{padding:20px 0;border-bottom:1px solid var(--line)}.print-sheet .source-foot a{display:block}
@media(min-width:1600px){#main{padding:0 45px}.home-hero{padding:38px 42px;min-height:320px}.home-hero h1{font-size:39px}.scene{min-height:300px}.lecture-grid{grid-template-columns:minmax(0,1.15fr) minmax(350px,.8fr)}}
@media(max-width:1199px){#sidebar{width:216px;padding:24px 11px 14px}.brand{gap:8px;padding:0 4px}.brand strong{font-size:13px}.brand-mark{width:39px;height:39px}#main{margin-left:216px;padding:0 23px}.home-hero{padding:27px;grid-template-columns:1.2fr 1fr;gap:25px}.home-hero h1{font-size:29px}.hero-tile{min-width:36px;padding:10px 3px;font-size:18px}.stat-item{padding:4px 12px;gap:8px}.stat-item b{font-size:23px}.stat-item span{font-size:10px}.lecture-grid{grid-template-columns:minmax(0,1fr) minmax(270px,.8fr)}.card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.notes-columns{grid-template-columns:1fr}.answer-layout{grid-template-columns:minmax(0,1fr) 240px}.home-columns{gap:15px}.page-heading h1{font-size:25px}}
@media(max-width:960px){.lecture-grid{grid-template-columns:1fr}.code-body{max-height:300px}.home-hero{grid-template-columns:1fr}.hero-art{display:none}.home-hero h1{max-width:none}.hero-copy{max-width:none}.home-columns{grid-template-columns:1fr}.answer-layout{grid-template-columns:1fr}.answer-side{position:static}.answer-side .checklist{display:grid;grid-template-columns:1fr 1fr;gap:5px 15px}.template-grid{grid-template-columns:1fr}.stat-item{display:block}.stat-item span{display:block;margin-top:7px}.page-heading{flex-wrap:wrap}.two-column{grid-template-columns:1fr}}
@media(max-width:767px){#sidebar{transform:translateX(-100%);transition:transform .2s;width:256px;z-index:100}body.menu-open #sidebar{transform:translateX(0)}#scrim{position:fixed;inset:0;background:#101a2d80;z-index:90;display:block}#main{margin-left:0;padding:0 17px}.mobile-toggle{display:flex;align-items:center;justify-content:center;position:absolute;top:21px;left:17px;border:1px solid #dddfea;background:white;border-radius:7px;width:31px;height:31px;font-size:17px;z-index:45;color:#716986}.topbar{height:73px;margin-bottom:23px;padding-left:42px;font-size:10px}.topbar-actions{gap:3px}.local-badge{display:none}.topbar-actions .button.small{font-size:10px;padding:5px}.topbar-actions .button.icon{width:26px;height:26px;font-size:10px}.home-hero{padding:25px 22px;border-radius:15px;min-height:0}.home-hero h1{font-size:28px;line-height:1.5}.eyebrow{font-size:9px;margin-bottom:10px}.hero-copy{font-size:11px;margin-bottom:18px}.stat-strip{gap:0;padding:18px 0}.stat-item{padding:2px 11px;text-align:center}.stat-item:first-child{padding-left:0}.stat-item b{font-size:23px}.stat-item span{font-size:9px;line-height:1.6}.panel{padding:18px}.plan-head{gap:8px}.plan-head h3{font-size:13px}.budget-switch button{font-size:9px;padding:4px 6px}.home-columns{margin-top:18px}.section-head{margin-top:24px}.section-head h2{font-size:17px}.card-grid{grid-template-columns:1fr;gap:11px}.lesson-card{padding:18px}.lesson-card p{font-size:11px}.main-footer{margin-top:32px;gap:15px;font-size:9px}.main-footer span:last-child{text-align:right;max-width:160px}.page-heading h1{font-size:24px}.page-heading p{font-size:11px}.page-heading{gap:10px}.page-heading .button-row{padding-top:0}.lesson-tabs{gap:0;margin:19px 0}.lesson-tabs button{padding:10px 12px;font-size:11px}.lesson-tabs .tab-end{display:none}.problem-card{padding:14px 15px;margin-bottom:15px}.problem-card p{font-size:11px}.constraints span{font-size:9px}.lecture-grid{gap:15px}.demo-panel,.code-panel{padding:0}.demo-heading{padding:13px 14px}.config-form{padding:11px 14px}.config-presets{padding:0 14px 10px}.config-form label{min-width:100px}.scene{min-height:220px;padding:20px 14px;max-height:420px}.array-board{gap:6px}.array-cell{min-width:38px;min-height:40px;font-size:15px}.array-unit{min-width:36px}.frame-explain{padding:14px}.variables{padding:0 14px 12px}.player{padding:12px 13px}.player-top .button{padding:6px 9px;font-size:10px}.player-top .step-indicator{font-size:9px}.prediction-box{margin:0 14px 13px}.code-body{font-size:10px}.notes-columns{gap:13px}.note-block{padding:18px}.note-block p,.note-block li{font-size:11px}.answer-form{padding:17px}.answer-form textarea{font-size:11px}.answer-form textarea.code-editor{font-size:11px}.answer-label{gap:10px}.answer-label small{font-size:9px}.answer-side .checklist{display:block}.practice-card{padding:19px}.practice-card .question{font-size:12px}.choice-option{font-size:11px;padding:11px 12px;gap:8px}.filter-bar{gap:7px}.filter-bar select{font-size:10px;max-width:150px}.filter-bar .count{width:100%;margin-top:3px}.template-card{padding:19px}.template-card h3{font-size:15px}.matrix{border-spacing:3px;font-size:10px}.matrix td{padding:3px 6px;min-width:24px;height:26px}.state-table{font-size:10px}.state-table td,.state-table th{padding:6px}.history-row{gap:8px;flex-wrap:wrap}.history-row>div{min-width:170px}.record-stats{gap:13px}.record-stats b{font-size:19px}.record-stats span{font-size:10px}.print-sheet{padding:18px}.session-banner{font-size:10px;padding:11px;gap:8px}#toast{left:50%;font-size:11px;padding:10px 15px}.button{font-size:11px;padding:8px 13px}.tree-svg{max-height:260px}.source-card{overflow-wrap:anywhere}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
@media print{#sidebar,.topbar,.main-footer,.mobile-toggle,#scrim,#toast,.no-print,.button,.lesson-tabs,.player,.config-form,.config-presets{display:none!important}#main{margin:0;padding:0}body{background:white;color:black;font-size:10pt}#view{padding:0}.panel,.print-sheet,.problem-card{box-shadow:none;border:0;padding:0}.print-sheet{max-width:none}.print-sheet article{break-before:page}.print-sheet article:first-of-type{break-before:auto}pre,.code-body{white-space:pre-wrap!important;overflow-wrap:anywhere;max-height:none!important;background:white!important;color:black!important;overflow:visible!important}.code-line{white-space:pre-wrap}.lecture-grid,.notes-columns,.two-column{display:block}.code-panel,.note-block{margin-top:15px}.scene{max-height:none}.print-sheet h2,.print-sheet h3{break-after:avoid}a{color:black;text-decoration:none}@page{size:A4;margin:17mm}}
.code-line.current-line{background:#7b65dc44;border-left:3px solid #c1a7ff}.code-line.current-line:before{color:#e0cfff}.code-body{position:relative}
.lecture-grid>*,.notes-columns>*,.answer-layout>*,.two-column>*,.home-columns>*{min-width:0}
@media(max-width:960px){.lecture-grid,.notes-columns,.answer-layout,.two-column,.home-columns,.template-grid{grid-template-columns:minmax(0,1fr)}}
:root{--read-scale:1}.font-control{display:flex;align-items:center;gap:5px;white-space:nowrap;font-size:11px}.font-control select{padding:5px;min-height:32px}html[data-reading-size=large]{--read-scale:1.15}html[data-reading-size=larger]{--read-scale:1.3}
#view p,#view li,#view .question,#view .original-conditions,#view .field-help{font-size:calc(12px * var(--read-scale))}#view textarea,#view .code-body,#view pre{font-size:calc(12px * var(--read-scale))}#view h3{font-size:calc(16px * var(--read-scale))}#view h4{font-size:calc(14px * var(--read-scale))}.button,.variant-pill,.budget-switch button{min-height:34px}.button.icon{min-height:32px;min-width:32px}.button.small{min-height:32px}select{min-height:36px}input[type=checkbox],input[type=radio]{min-width:18px;min-height:18px}.paper-check{min-height:36px}.field-help{color:var(--muted);margin:0 0 8px}.answer-form textarea{width:100%}.answer-form .code-editor{min-height:310px}.scaffold{margin-bottom:12px;font-size:11px}.original-conditions{margin-top:16px;line-height:1.9}.original-conditions ul{padding-left:20px;margin-bottom:0}.given-code,.debug-code{white-space:pre-wrap;overflow-wrap:anywhere;background:#18263d;color:#dbe4f5;border-radius:9px;padding:18px;max-height:500px;overflow:auto}.ability-panel{margin-bottom:20px}.ability-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.ability-card{padding:13px;background:white;border:1px solid var(--line);border-radius:9px;min-width:0}.ability-card>strong{display:block;font-size:13px;color:var(--primary)}.ability-card>span{display:block;font-size:11px;margin:5px 0 9px}.ability-panel>p{margin:8px 0 0}.rubric-list{margin-bottom:20px}.rubric-row{padding:13px 0;border-bottom:1px solid #dfd9ed}.rubric-row>label{display:flex;gap:8px;align-items:center;min-height:34px;font-size:12px}.rubric-row>small{display:block;color:var(--muted);margin:0 0 8px 26px}.review-mark{display:flex;gap:8px}.review-mark input{flex:1;min-width:0}.review-mark select{max-width:140px}.reference-views details{margin-bottom:12px}.reference-views summary{cursor:pointer;padding:10px 0;font-size:12px}.reference-views pre{white-space:pre;overflow:auto;max-height:500px}.open-answer-form textarea{width:100%;min-height:90px;margin-bottom:16px}.open-answer-form textarea.code-editor{min-height:270px}.interval-settings{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:18px 0 28px}.interval-settings label,.arch-fields label{font-size:12px;display:grid;gap:6px}.interval-settings input{width:100%}.system-lab{margin-bottom:22px}.system-lab details{margin:12px 0;font-size:12px}.semaphore-grid,.process-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:18px 0}.semaphore-grid>div{background:#f3f1fc;padding:12px;border-radius:9px}.semaphore-grid small{display:block;font-size:11px}.process-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.process-grid>section{border:1px solid var(--line);border-radius:10px;padding:15px}.process-grid ol{padding-left:24px;font-family:var(--mono)}.process-grid li{padding:6px}.current-operation{background:#eeeaff;color:var(--primary);font-weight:700;border-radius:5px}.arch-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:18px}.system-lab pre{white-space:pre-wrap;overflow-wrap:anywhere}.comparison-frame{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.comparison-frame section{min-width:0;padding:13px;background:#f5f6fb;border:1px solid var(--line);border-radius:8px}.comparison-frame pre{white-space:pre-wrap;overflow-wrap:anywhere}.comparison-frame.first-difference section{border-color:#e3a05a;background:#fff9ef}.comparison-counts{overflow-x:auto}.comparison-counts td,.comparison-counts th{padding:7px 10px;text-align:left;font-size:11px}.paper-toolbar{margin-bottom:20px}.writing-lines{height:125px;background:repeating-linear-gradient(transparent,transparent 29px,#c9cfd9 30px);margin-bottom:25px}.writing-lines.long{height:300px}.blank-sheet{margin-top:35px;break-before:page}.paper-exercise{margin-top:30px}.short-blank{margin:25px 0}
@media(max-width:960px){.ability-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:767px){.topbar{gap:4px}.topbar-actions{gap:3px}.font-control{font-size:0}.font-control select{font-size:11px;max-width:62px}.topbar #export-top{font-size:10px}.ability-grid{gap:7px}.ability-card{padding:10px}.ability-card .button{white-space:normal;text-align:left;min-height:32px;padding:4px}.review-mark{flex-direction:column}.review-mark select{max-width:none}.interval-settings{grid-template-columns:repeat(2,minmax(0,1fr))}.comparison-frame,.arch-fields{grid-template-columns:minmax(0,1fr)}.process-grid{grid-template-columns:minmax(0,1fr)}.semaphore-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.semaphore-grid>div{padding:9px;font-size:11px;overflow-wrap:anywhere}.button,.variant-pill,.budget-switch button,.lesson-tabs button,.prediction-options button{min-height:44px}.button.icon{min-height:32px}.button.small{min-height:36px}.rubric-row>label,.choice-option{min-height:44px}.process-grid ol{margin-bottom:12px}.system-lab select{width:100%}}
@media print{.ability-panel{display:none}.writing-lines{print-color-adjust:exact;-webkit-print-color-adjust:exact}.blank-sheet{break-before:page}.paper-exercise{break-inside:avoid}}

/* Code reading: preserve the complete source at a readable mobile size. */
.code-header{gap:10px;flex-wrap:wrap}.code-tools{gap:6px}.code-tools .button{white-space:nowrap}
.code-tools [aria-pressed="true"]{background:var(--primary-soft);border-color:#c9c3ff;color:var(--primary)}
.code-line{position:relative}.code-line button{white-space:inherit;overflow-wrap:inherit}
.code-panel[data-wrap="true"] .code-line{white-space:pre-wrap;overflow-wrap:anywhere;padding-left:44px;padding-right:12px}
.code-panel[data-wrap="true"] .code-line:before{position:absolute;left:0;top:0;width:28px;margin-right:0}
.code-panel[data-wrap="true"] .code-line button{max-width:100%}
.code-panel[data-wrap="false"] .code-line{white-space:pre;overflow-wrap:normal}
.code-body{overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
#code-reader{inset:0;margin:0;padding:0;border:0;border-radius:0;width:100%;max-width:none;height:100vh;height:100dvh;max-height:none;overflow:hidden}
#code-reader[open]{display:flex}#code-reader .code-expanded{display:flex;flex-direction:column;width:100%;height:100%;min-width:0;border:0;border-radius:0;margin:0;box-shadow:none;background:var(--paper,#fff)}
#code-reader .code-header{flex-shrink:0;padding-top:calc(12px + env(safe-area-inset-top));padding-left:calc(14px + env(safe-area-inset-left));padding-right:calc(14px + env(safe-area-inset-right))}
#code-reader .code-body{flex:1;min-height:0;max-height:none;font-size:calc(14px * var(--read-scale));line-height:1.85;padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}
#code-reader .code-summary{flex-shrink:0;padding-bottom:env(safe-area-inset-bottom)}
#code-reader .line-note{flex-shrink:0;max-height:25vh;overflow:auto}
@media(max-width:767px){
 #view .code-panel .code-body{max-height:65vh;max-height:65dvh;font-size:calc(14px * var(--read-scale));line-height:1.85}
 .code-header{padding:12px}.code-header h3{width:100%;font-size:13px}.code-tools{width:100%;justify-content:flex-end;gap:5px}
 .code-tools .button.small{min-height:44px;padding:7px 10px;font-size:12px}
 #view .answer-form textarea.code-editor,#view .open-answer-form textarea.code-editor{min-height:55vh;min-height:55dvh;font-size:16px}
 #view .answer-reference pre,#view .answer-code{white-space:pre-wrap;overflow-wrap:anywhere;font-size:14px;line-height:1.85}
}
@media print{.code-tools{display:none}#code-reader[open]{position:static;display:block;height:auto;overflow:visible}#code-reader .code-body{max-height:none;overflow:visible}}