:root{--ink:#18213a;--muted:#707787;--purple:#5645d4;--line:#e2e4ec;--paper:#fafaf9;--lavender:#eee9fc;--mint:#e7f5ed;--navy:#0a1530}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.75 Inter,"Noto Sans KR",system-ui,sans-serif}a{color:var(--purple)}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:default;opacity:.5}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #baa9f6;outline-offset:3px}button,.button{min-height:44px;border:1px solid var(--line);background:#fff;color:var(--ink);padding:10px 17px;border-radius:9px;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:7px;line-height:1.4}.primary{background:var(--purple);border-color:var(--purple);color:white}.site-bar{height:72px;border-bottom:1px solid var(--line);background:#fafaf9ed;backdrop-filter:blur(16px);display:flex;align-items:center;justify-content:space-between;padding:0 max(24px,calc((100vw - 1200px)/2));position:sticky;top:0;z-index:20}.brand{font-size:14px;letter-spacing:.15em;color:var(--ink);text-decoration:none}.brand b{color:var(--purple)}.back{font-size:13px;text-decoration:none;color:var(--muted)}.lesson-hero{max-width:1200px;padding:70px 32px 48px;margin:auto}.eyebrow{color:var(--purple);font-size:12px;font-weight:700;letter-spacing:.12em;margin:0 0 18px}.lesson-hero h1{font-size:clamp(32px,4.5vw,58px);line-height:1.22;letter-spacing:-.05em;max-width:900px;margin:0 0 24px;word-break:keep-all}.lead{color:var(--muted);max-width:760px;margin:0}.lesson-nav{display:flex;flex-wrap:wrap;gap:8px;margin-top:28px}.lesson-nav a{color:#594a8c;background:var(--lavender);border-radius:100px;text-decoration:none;padding:8px 16px;font-size:13px}.lesson-main{max-width:1200px;margin:auto;padding:0 32px 100px;min-width:0}.lesson-section{padding-top:52px;margin-top:8px;border-top:1px solid var(--line)}.section-heading{display:flex;align-items:flex-start;gap:18px;margin-bottom:28px}.section-number{border:1px solid #d9d2ed;background:var(--lavender);border-radius:12px;width:44px;height:44px;display:grid;place-items:center;color:var(--purple);font-size:15px;flex-shrink:0}.section-heading h2{font-size:29px;letter-spacing:-.04em;margin:0;line-height:1.45}.section-heading p{margin:6px 0 0;color:var(--muted);font-size:14px}.card{background:white;border:1px solid var(--line);border-radius:16px;padding:26px;min-width:0}.card h3{font-size:20px;margin:0 0 12px;letter-spacing:-.025em}.grid-two{display:grid;grid-template-columns:1fr 1fr;gap:20px}.source-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:20px}.file-head{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:18px;flex-wrap:wrap}.file-name{font:13px ui-monospace,monospace;color:var(--muted)}.file-actions{display:flex;gap:8px}.file-actions a,.file-actions button{font-size:12px;min-height:36px;padding:8px 12px}pre{margin:0;overflow:auto;font:13px/1.9 ui-monospace,SFMono-Regular,Consolas,monospace;tab-size:4}.source-code{background:#101a30;color:#e0e8fa;padding:24px;border-radius:12px}.source-code .comment{color:#91c6a8}.source-code .keyword{color:#c3a6ff}.source-code .number{color:#ffc892}.table-scroll{overflow:auto;max-width:100%}table{border-collapse:collapse;width:100%;font-size:14px;font-variant-numeric:tabular-nums}th,td{padding:11px 14px;border-bottom:1px solid var(--line);text-align:right;white-space:nowrap}th{color:#5e6271;background:#f7f6fb;font-weight:600}th:first-child,td:first-child{text-align:left}tbody tr:last-child td{border-bottom:0}.note{color:var(--muted);font-size:13px;margin:16px 0 0}.callout{padding:18px 22px;background:var(--lavender);border-radius:12px;margin:20px 0;color:#4a3c74;font-size:14px}.callout p{margin:0}.formula{font:16px/1.9 ui-monospace,monospace;background:#f4f2fc;border-radius:10px;padding:16px 20px;overflow:auto;color:#4b3b82}.sim-controls{display:flex;gap:20px;align-items:flex-end;flex-wrap:wrap;margin-bottom:24px}.control{display:grid;gap:7px;flex:1;min-width:170px}.control label{font-size:13px;color:var(--muted)}.control input[type=number]{border:1px solid var(--line);border-radius:8px;padding:8px 12px;width:100%;min-height:44px}.control input[type=range]{width:100%;accent-color:var(--purple);height:28px}.buttons{display:flex;flex-wrap:wrap;gap:8px}.chart-card{padding:20px}.chart-head{display:flex;justify-content:space-between;gap:16px;margin-bottom:8px}.chart-head h3{font-size:16px;margin:0}.chart-head span{font-size:12px;color:var(--muted)}.chart{width:100%;height:auto;display:block;aspect-ratio:540/350}.chart text{font:11px system-ui,sans-serif;fill:#737c90}.chart .axis{stroke:#ccd2df;stroke-width:1}.chart .gridline{stroke:#edf0f7;stroke-width:1}.chart .curve{fill:none;stroke:#5645d4;stroke-width:3}.chart .model{stroke:#5645d4;stroke-width:3}.chart .tangent{stroke:#ec9654;stroke-width:2;stroke-dasharray:6 4}.chart .point{fill:#5645d4;stroke:#fff;stroke-width:2}.chart .data-dot{fill:#8b83bd;opacity:.8}.chart .residual{stroke:#51a789;stroke-width:1;opacity:.5}.chart .new-point{fill:#40a883;stroke:#fff;stroke-width:2}.legend{display:flex;gap:16px;flex-wrap:wrap;font-size:12px;color:var(--muted);margin-top:8px}.legend i{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;background:var(--purple)}.legend .orange{background:#ec9654}.legend .green{background:#40a883}.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:22px 0}.metric{padding:18px;background:#f7f6fb;border:1px solid var(--line);border-radius:10px;min-width:0}.metric span{display:block;font-size:12px;color:var(--muted)}.metric strong{display:block;font:600 23px/1.5 ui-monospace,monospace;overflow-wrap:anywhere}.history{max-height:280px;overflow:auto}.status{font-size:14px;min-height:24px;color:#6d587f;margin:16px 0}.theory-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.theory-card{padding:30px}.theory-card h3{font-size:22px;line-height:1.4}.theory-card p{font-size:15px;color:#535d70;margin:16px 0}.theory-card .key{color:#4c3c7c;background:#f2edff;padding:14px 16px;border-radius:9px}.notebook-toolbar{display:flex;justify-content:space-between;gap:16px;align-items:center;flex-wrap:wrap;margin:30px 0}.notebook-section{font-size:26px;letter-spacing:-.04em;margin:44px 0 20px}.notebook-cell{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:white;margin:14px 0}.cell-head{display:flex;gap:14px;align-items:center;background:#f4f2fb;padding:14px 20px;border-bottom:1px solid #e8e5f0}.run-cell{border:0;border-radius:50%;background:white;color:var(--purple);min-height:38px;width:38px;padding:0;flex-shrink:0;font-size:14px;box-shadow:0 1px 4px #2a24441a}.cell-title{flex:1;font-size:14px;font-weight:600}.cell-count{font:11px ui-monospace,monospace;color:#8b839e}.cell-comments{padding:18px 22px 0;background:white}.cell-comments p{margin:0 0 7px;color:#536447;font-size:14px;line-height:1.8;border-left:3px solid #d7e5cb;padding-left:13px}.cell-code{background:#fbfbfe;padding:18px 22px;border-top:1px solid #f1eff6}.cell-code .comment{color:#687b5d}.cell-code .keyword{color:#6c43b3}.cell-code .number{color:#b26025}.cell-output{padding:20px 22px;border-top:1px solid var(--line);background:#fff;overflow:auto}.cell-output[hidden]{display:none}.output-label{font:11px ui-monospace,monospace;color:#91899f;margin:0 0 12px}.cell-output pre{font-size:12px;white-space:pre}.cell-output table{font-size:12px}.cell-output th,.cell-output td{padding:8px 11px}.cell-output .no-output{font-size:13px;color:#7d8491;margin:0}.notebook-info{border-left:4px solid #deab54;background:#fff4df;padding:20px 24px;border-radius:8px;font-size:14px}.notebook-info p{margin:8px 0}.gate-palette{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0}.gate-block{background:#eee9fc;border:1px solid #d8cff3;color:#584094;font-weight:700;cursor:grab;min-width:90px}.gate-block[aria-pressed=true]{outline:3px solid #b7a4ef;outline-offset:2px}.circuit{position:relative;margin:22px 0;background:#faf9fd;border:1px solid var(--line);border-radius:12px;padding:26px;overflow:auto}.circuit-grid{position:relative;display:grid;grid-template-columns:90px 1fr 1fr;gap:52px;min-width:560px;align-items:center}.circuit-wires{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}.circuit-wires line{stroke:#bfb5db;stroke-width:2}.layer{display:grid;gap:22px;position:relative;z-index:1}.layer-label{font-size:11px;text-transform:uppercase;color:#8b839e;letter-spacing:.05em;text-align:center}.signal{background:#fff;border:1px solid #d7d2e3;border-radius:9px;padding:14px;text-align:center;font-weight:600}.gate-slot{background:#fff;border:2px dashed #d3c9e7;border-radius:12px;padding:16px;display:grid;gap:8px;min-height:130px;align-content:center;transition:border-color .2s,background .2s}.gate-slot.drop-hover{background:#eee8ff;border-color:var(--purple)}.gate-slot.has-gate{border-style:solid;border-color:#cabde6;background:#f2edff}.gate-slot button{width:100%;background:#fff}.gate-slot .slot-name{color:#776990;font-size:12px}.gate-slot select{width:100%;max-width:100%;background:white;border:1px solid #d8d0e4;border-radius:7px;padding:7px;font-size:12px;min-height:36px}.gate-slot .slot-gate{font-size:19px;min-height:44px;font-weight:700;color:#56408c}.gate-slot .slot-empty{font-size:13px;color:#9389a4}.truth-target td:last-child{color:var(--purple);font-weight:700}.correct-row td{background:#edf8f1}.wrong-row td{background:#fff2f1}.game-result{padding:18px 20px;background:#f2edff;border-radius:12px;font-size:14px;margin:18px 0}.game-result.success{background:#e5f4e9;color:#1f6a3a}.gate-help{color:var(--muted);font-size:14px}.footer{border-top:1px solid var(--line);padding:24px;text-align:center;color:var(--muted);font-size:12px;margin-bottom:60px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:800px){.source-grid,.grid-two,.theory-grid{grid-template-columns:1fr}.metric-grid{grid-template-columns:1fr 1fr}.lesson-hero{padding:44px 22px 36px}.lesson-main{padding:0 20px 80px}.lesson-section{padding-top:36px}.section-heading h2{font-size:24px}.site-bar{height:64px;padding:0 22px}.card{padding:20px}.source-code{font-size:12px;padding:18px}.circuit{padding:18px}.cell-comments,.cell-code,.cell-output{padding-left:16px;padding-right:16px}.notebook-section{font-size:23px}.sim-controls{gap:14px}.control{min-width:140px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.gate-slot{transition:none}}

.mse-steps{padding-left:24px}.mse-steps li{padding-left:6px;margin:22px 0}.formula math{font-size:1.1em}.circuit-grid .layer{align-content:center}.circuit-grid #output-y{justify-self:center;min-width:72px}
@media(max-width:600px){.circuit{padding:14px 10px}.circuit-grid{min-width:0;grid-template-columns:36px minmax(0,1fr) minmax(0,1fr);gap:12px}.circuit-grid .layer-label{font-size:10px;letter-spacing:0;word-break:keep-all}.circuit-grid .gate-slot{padding:9px 6px;min-height:120px}.circuit-grid .signal{padding:10px 5px}.circuit-grid .slot-gate{font-size:15px;padding:7px 3px}.circuit-grid .slot-empty{font-size:11px}.circuit-grid #output-y{min-width:48px}}
