@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--paper:#f8f7f2;--ink:#283b36;--muted:#737d76;--line:#dce0d6;--rust:#c95639;--green:#357b61;--mono:'IBM Plex Mono',monospace;--sans:'DM Sans',sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans)}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit;text-decoration:none}button{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--rust);outline-offset:4px}.topbar{height:85px;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 34px;gap:28px;background:var(--paper)}.brand{font-family:'Manrope',sans-serif;font-size:25px;font-weight:800;letter-spacing:-1.2px;display:flex;align-items:center;gap:9px;white-space:nowrap}.brand>span{color:var(--rust);margin-left:-8px}.brand svg{width:34px;height:37px;fill:none;stroke:var(--ink);stroke-width:1.7}.brand svg path+path{stroke:var(--rust);stroke-width:2}.header-middle{font:10px var(--mono);letter-spacing:1.3px;flex:1;margin-left:35px}.header-middle span{margin:0 15px;color:#b2b8ad}.topbar button{background:none;border:0;font-size:12px}.topbar button span{margin-left:12px}.source{font-size:12px;padding:11px 16px;border:1px solid #b4bdb0;border-radius:4px}.shell{display:grid;grid-template-columns:267px 1fr;max-width:1800px;margin:auto}aside{border-right:1px solid var(--line);height:calc(100vh - 85px);position:sticky;top:0;display:flex;flex-direction:column;padding:29px 17px 0 24px}.aside-heading{font:10px var(--mono);letter-spacing:1px;display:flex;justify-content:space-between;align-items:center;margin-right:7px}.aside-heading span{font-size:8px;color:var(--muted);letter-spacing:0}.search{display:flex;gap:10px;border:1px solid var(--line);border-radius:4px;margin:20px 7px 23px 0;padding:8px 11px;align-items:center}.search span{font-size:21px;line-height:18px;color:var(--muted)}.search input{width:100%;background:none;border:0;outline:none;font-size:12px;color:var(--ink)}nav{overflow:auto;flex:1;scrollbar-width:thin;padding-right:7px}.nav-group{font:9px var(--mono);letter-spacing:1.4px;color:var(--muted);margin:19px 0 12px 7px}.nav-group:first-child{margin-top:0}.chapter{width:100%;text-align:left;display:flex;gap:11px;align-items:center;border:0;background:none;font-size:11.5px;padding:11px 8px;line-height:1.4;border-radius:4px;margin-bottom:2px}.chapter .num{font:10px var(--mono);color:#8a9287;min-width:17px}.chapter.active{background:#e9ede3;color:var(--ink);font-weight:600}.chapter.active .num{color:var(--rust)}.chapter.active:after{content:'↗';margin-left:auto;color:var(--rust)}.chapter:hover{background:#edf0e8}.aside-footer{border-top:1px solid var(--line);font-size:10px;line-height:2;margin-top:20px;padding:18px 0}.aside-footer small{font-size:8px;color:var(--muted)}.dot,.live-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--green);margin-right:7px}main{padding:39px 46px 20px;max-width:1260px;width:100%;margin:auto}.intro-meta{display:flex;justify-content:space-between;font:10px var(--mono);letter-spacing:1.1px}.intro-meta>span:first-child{color:var(--rust)}.edition{color:#91988c;font-size:8px}.title-row{display:flex;justify-content:space-between;align-items:center;margin-top:18px;gap:15px}h1{font-family:'Manrope',sans-serif;font-size:clamp(26px,3.1vw,48px);font-weight:500;line-height:1.18;letter-spacing:-1.8px;margin:6px 0}.chapter-number{font:48px var(--mono);color:#d6dbd0;font-weight:400}.description{font-size:14px;line-height:1.8;color:#68776e;max-width:725px;margin:11px 0 30px;min-height:48px}.scene-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:13px;gap:12px}.scene-label{font:9px var(--mono);letter-spacing:1.2px;display:flex;align-items:center}.scene-label a{color:var(--muted);letter-spacing:0;margin-left:15px}.mode{display:flex;padding:3px;border:1px solid var(--line);border-radius:5px;gap:2px}.mode button{background:none;border:0;border-radius:3px;padding:7px 11px;font-size:10px;color:var(--muted)}.mode button.selected{background:var(--ink);color:#fff}.mode button:disabled{opacity:.35;cursor:default}.paper{background-color:#fcfcf8;background-image:radial-gradient(#d7ddd1 .7px,transparent .7px);background-size:18px 18px;border:1px solid #cfd6c7;border-radius:7px;overflow:hidden;box-shadow:0 4px 0 #eceee6}.paper-header{display:flex;justify-content:space-between;padding:21px 25px 0;font:8px var(--mono);letter-spacing:1.5px;color:#788574}.paper-header>span:last-child{font-size:7px;letter-spacing:1px}#drawing{display:block;width:100%;height:auto;max-height:380px;min-height:235px}.step-caption{display:flex;gap:15px;align-items:flex-start;min-height:91px;margin:0 26px 8px;padding-top:8px}.step-caption>span{font:12px var(--mono);color:var(--rust);border:1px solid #d6dccc;padding:8px;border-radius:50%;min-width:33px;text-align:center}.step-caption strong{font-size:14px;font-weight:600}.step-caption p{font-size:12px;color:#6c786d;line-height:1.7;margin:5px 0 0;max-width:760px}.transport{border-top:1px solid #e0e4d9;display:flex;align-items:center;padding:12px 23px;gap:13px;background:#f7f8f1}.play{border:0;background:var(--ink);color:#fff;width:32px;height:32px;border-radius:50%;font-size:11px}.icon-button{border:0;background:none;font-size:20px;padding:4px;min-width:26px}.step-track{display:flex;gap:5px;flex:1;align-items:center}.step-track button{height:24px;flex:1;border:0;background:none;padding:10px 0}.step-track button span{display:block;height:3px;background:#dce1d5;border-radius:3px}.step-track button.done span{background:var(--green)}.step-track button.current span{background:var(--rust)}#time{font:9px var(--mono);color:var(--muted);white-space:nowrap}select{background:none;color:var(--muted);border:0;font:9px var(--mono);max-width:92px}.legend{display:flex;gap:19px;font-size:9px;color:#7b8579;margin:19px 0 29px;flex-wrap:wrap}.legend span{display:flex;align-items:center;gap:6px}.legend i{display:inline-block;border:1px solid currentColor;width:7px;height:7px;border-radius:50%}.ink{color:var(--ink)}.rust{color:var(--rust)}.green{color:var(--green)}.legend .hint{margin-left:auto;font-size:8px}.notes-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:33px}.small-label{font:9px var(--mono);letter-spacing:1.5px;color:#76816f}h2{font-family:'Manrope',sans-serif;font-size:19px;letter-spacing:-.6px;font-weight:600;margin:12px 0}.rule-note ul{padding-left:17px;margin-bottom:7px}.rule-note li{font-size:12px;line-height:1.75;margin:7px 0;color:#627166}.rule-note li::marker{color:var(--green)}.field-note{border-left:1px solid var(--line);padding-left:28px}.field-note p{font-size:13px;line-height:1.85;color:#657164}.field-note a{font:9px var(--mono);color:var(--rust)}.chapter-footer{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);margin-top:28px;padding-top:19px}.chapter-footer button{background:none;border:0;font-size:11px;padding:8px 0}.chapter-footer button:disabled{opacity:.3;cursor:default}#chapterProgress{font:9px var(--mono);color:var(--muted)}.disclaimer{font-size:9px;line-height:1.8;color:#8b9387;margin-top:22px}svg text{font-family:var(--sans);fill:var(--ink)}svg .node-label{font-size:14px;font-weight:500}svg .node-sub{font:10px var(--mono);fill:#83907e}svg .wire{fill:none;stroke:#cbd3c4;stroke-width:1.4;stroke-dasharray:5 6}svg .active-wire{fill:none;stroke:var(--green);stroke-width:1.8;stroke-dasharray:800;animation:draw 1.4s ease both}svg .active-wire.danger{stroke:var(--rust)}svg .icon{fill:none;stroke:var(--ink);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}svg .node-active .icon{stroke:var(--green)}svg .node-danger .icon{stroke:var(--rust)}svg .node-halo{fill:#eff3e8;stroke:#cdd9c4;stroke-width:1}svg .node-danger .node-halo{fill:#fbefe6;stroke:#e5bdac}svg .packet{fill:#fcfcf8;stroke:var(--green);stroke-width:1.5}svg .danger .packet{stroke:var(--rust)}svg .edge-label{font:11px var(--mono);fill:var(--green)}svg .edge-label.danger{fill:var(--rust)}@keyframes draw{from{stroke-dashoffset:800}to{stroke-dashoffset:0}}dialog{border:1px solid var(--line);border-radius:8px;background:var(--paper);color:var(--ink);max-width:750px;width:calc(100% - 30px);padding:30px;max-height:85vh}dialog::backdrop{background:#203a3270;backdrop-filter:blur(3px)}.dialog-header{display:flex;justify-content:space-between;align-items:flex-start}.dialog-header button{background:none;border:0;font-size:20px}dialog p{font-size:13px;line-height:1.7;color:#687765}#coverageList{display:grid;grid-template-columns:1fr 1fr;gap:2px 20px;margin-top:20px}#coverageList button{text-align:left;background:none;border:0;border-bottom:1px solid var(--line);padding:10px 0;display:flex;justify-content:space-between;gap:12px;font-size:12px}#coverageList span{font:10px var(--mono);color:var(--rust)}dialog>a{font-size:12px;color:var(--rust)}.coverage-foot{font-size:11px!important}.empty{font-size:12px;color:var(--muted);padding:10px}@media(min-width:1600px){main{padding-top:48px}#drawing{max-height:440px}.description{margin-bottom:35px}.paper-header{padding-top:24px}}@media(max-width:1050px){.shell{grid-template-columns:220px 1fr}.header-middle{margin-left:0;font-size:8px}.edition{display:none}main{padding:30px 26px}.topbar{padding:0 24px;gap:20px}aside{padding-left:16px}.aside-heading{font-size:8px}.aside-heading span{font-size:7px}.notes-grid{gap:20px}.hint{display:none!important}.chapter{font-size:10.5px}}@media(max-width:760px){.topbar{height:70px;padding:0 18px;gap:12px}.brand{font-size:21px}.brand svg{width:27px}.header-middle{display:none}.topbar button{margin-left:auto;font-size:10px;padding:10px 0}.source{display:none}.shell{display:block}aside{height:auto;position:relative;border-right:0;border-bottom:1px solid var(--line);padding:16px 18px}.aside-heading{display:none}.search{margin:0 0 12px}nav{display:block;overflow:visible;max-height:none;padding:0}.nav-group{display:block;margin:22px 10px 10px}.chapter{width:100%;min-width:0;max-width:none;padding:13px 11px;border:0;font-size:13px;margin:3px 0;min-height:46px;align-items:flex-start}.chapter .num{line-height:1.8}.chapter>span:last-child{white-space:normal;overflow-wrap:anywhere}.chapter.active:after{display:none}.aside-footer{display:none}main{padding:25px 18px}.intro-meta{font-size:9px}.title-row{margin-top:15px}h1{font-size:31px;letter-spacing:-1.2px}.chapter-number{font-size:34px}.description{font-size:12px;margin:9px 0 23px;min-height:0}.scene-top{align-items:flex-start;gap:10px;flex-direction:column}.mode{align-self:flex-end}.scene-label{font-size:8px}.paper-header{padding:17px 15px 0;font-size:6px;letter-spacing:.8px}.paper-header>span:last-child{font-size:6px}#drawing{min-height:0}.step-caption{margin:10px 15px 15px;min-height:114px;gap:10px}.step-caption strong{font-size:13px}.step-caption p{font-size:11px}.transport{padding:10px 12px;gap:9px}.legend{font-size:8px;gap:13px;margin:18px 0 25px}.notes-grid{grid-template-columns:1fr;gap:22px}.field-note{border-left:2px solid #d7decb;padding-left:17px}.rule-note li{font-size:12px}.field-note p{font-size:12px;margin-bottom:10px}.chapter-footer{margin-top:23px}#coverageList{grid-template-columns:1fr}.dialog-header h2{font-size:20px}dialog{padding:22px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;scroll-behavior:auto!important}}
@media(max-width:760px){svg .node-label{font-size:18px}svg .node-sub{font-size:12px}svg .edge-label{font-size:13px}}

.chapter-toggle{display:none}.chapter-panel{display:flex;flex-direction:column;flex:1;min-height:0}
@media(max-width:760px){.chapter-toggle{width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:13px 15px;background:#fcfcf8;border:1px solid #cfd6c7;border-radius:5px;text-align:left;min-height:66px}.chapter-toggle>span{min-width:0}.chapter-toggle small{display:block;font:9px var(--mono);letter-spacing:1px;color:var(--muted);margin-bottom:6px}.chapter-toggle strong{display:block;font-size:13px;line-height:1.5;font-weight:500;overflow-wrap:anywhere}.chapter-toggle svg{width:20px;height:20px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.5;transition:transform .15s}.chapter-toggle[aria-expanded="true"] svg{transform:rotate(180deg)}.chapter-panel{display:none;margin-top:15px}.chapter-panel.is-open{display:block}.chapter-panel .search{margin-bottom:18px;padding:11px 12px}.chapter-panel .search input{font-size:16px}.chapter.active:after{display:block;content:"✓"}.chapter.active{border:1px solid #cfd9c4}.chapter .num{min-width:22px}.chapter-panel nav{overflow-x:visible;overflow-y:visible}}
/* Multi-document reader */
[hidden]{display:none!important}.document-select-label{display:block;font:9px var(--mono);letter-spacing:1.2px;color:var(--muted);margin-bottom:10px}.document-select{display:block;width:100%;max-width:none;white-space:normal;border:1px solid #cbd6c5;background:#fcfcf8;border-radius:5px;padding:11px 8px;font-size:10px;color:var(--ink);margin:0 0 25px}.header-middle a:hover{color:var(--rust)}.publication-history{margin:0 0 25px;border:1px solid var(--line);border-radius:5px;background:#fcfcf8;padding:14px 17px}.publication-history summary{display:flex;justify-content:space-between;gap:15px;cursor:pointer;list-style:none;font-size:11px;line-height:1.5}.publication-history summary:before{content:'+';font:16px var(--mono);color:var(--green)}.publication-history[open] summary:before{content:'−'}.publication-history summary span:first-child{flex:1}.publication-history summary span:last-child{font:9px var(--mono);color:var(--muted);padding-top:3px}.publication-history>p{font-size:12px;line-height:1.8;color:var(--muted)}#historyList{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:15px}#historyList a{display:flex;flex-direction:column;gap:7px;border:1px solid var(--line);border-radius:4px;padding:13px}#historyList a:hover{border-color:#8ca78e}#historyList .relation-kind{font:8px var(--mono);text-transform:uppercase;letter-spacing:1px;color:var(--rust)}#historyList strong{font-size:12px;font-weight:500}#historyList a>span:last-child{font-size:11px;color:var(--muted);line-height:1.7}.publication-history .history-explainer{font-size:10px;margin-bottom:0}.change-note{border-left:3px solid #ca6d46;padding:18px 21px;margin:0 0 29px;background:#f3efe5}.change-note .small-label{color:#aa5738}.change-pair{display:flex;gap:18px;align-items:center;margin-top:12px;font:11px var(--mono);line-height:1.7}.change-pair>span:first-child{color:#697768}.change-pair>span:last-child{color:#304e3b}.change-note p{font-size:12px;line-height:1.8;color:#697465;max-width:800px;margin:12px 0}.change-note>a{font:10px var(--mono);color:#a95534}.brand{font-size:23px}.brand svg{width:31px}select.document-select:focus-visible{outline-offset:2px}@media(max-width:760px){.document-select-label{font-size:8px;margin-bottom:7px}.document-select{font:12px var(--sans);min-height:43px;padding:10px;margin-bottom:12px}.publication-history{padding:12px;margin-bottom:23px}.publication-history summary{font-size:11px;gap:8px}.publication-history summary span:last-child{font-size:8px;max-width:85px;text-align:right}#historyList{grid-template-columns:1fr}.change-note{padding:16px;margin-bottom:24px}.change-pair{display:grid;grid-template-columns:1fr;gap:3px;font-size:10px}.change-pair>span:nth-child(2){font-size:16px}.change-note p{font-size:12px}.change-note>a{font-size:9px}.brand{font-size:21px}.brand svg{width:27px}}

/* Mechanism drawings retain one coordinate system on every viewport. */
#drawing{width:100%;height:auto;max-height:570px;min-height:0;display:block} .mechanism-active{stroke-dasharray:7 3;animation:mechanism-flow 2s linear infinite}@keyframes mechanism-flow{to{stroke-dashoffset:-20}}@media(prefers-reduced-motion:reduce){.mechanism-active{animation:none}}

#drawing[data-playing="false"] .mechanism-active{animation-play-state:paused}
/* Illustrated notebook: quiet paper, expressive ink, and a clear reading hierarchy. */
.paper{position:relative;background-color:#fffdf6;background-image:radial-gradient(#a2ad8c22 .65px,transparent .65px);background-size:16px 16px;border-color:#b8c3ad;border-radius:12px 8px 13px 6px;box-shadow:3px 5px 0 #e7e9dc}
.paper-header{font-size:9px;letter-spacing:1px;padding:22px 26px 2px;align-items:center}.paper-header>span:first-child{background:#f4e7bc;border-radius:3px 8px 4px 6px;padding:6px 10px;transform:rotate(-1deg);color:#79602c}.paper-header>span:last-child{font-size:8px}
.ink-scene text{font-family:var(--sans);font-style:normal;font-weight:400;letter-spacing:0}.ink-scene path,.ink-scene line{stroke-linecap:round;stroke-linejoin:round}.ink-scene>text:first-child{font-weight:700}
#drawing{max-height:530px;margin:8px 0 0}.step-caption{border-top:1px dashed #c9d0bd;margin:0 26px 8px;padding-top:18px;min-height:103px}.step-caption>span{border-radius:47% 53% 45% 55%;border:1px solid #c7ac75;background:#f7e8bd;color:#765d2f;transform:rotate(-5deg);font-family:var(--mono);font-style:normal;font-size:14px}.step-caption strong{font-size:15px}.step-caption p{font-size:13px;max-width:670px;line-height:1.7}.transport{background:#f5f5eb;border-top:1px solid #d7deca}.transport .play{box-shadow:2px 2px 0 #b5c6b3;border-radius:45% 55% 50% 50%}
.title-row h1{text-decoration:underline;text-decoration-color:#debd7166;text-decoration-thickness:7px;text-underline-offset:4px;text-decoration-skip-ink:none}.chapter.active{background:#e4eadb;border-radius:3px 8px 5px 7px}.change-note{background:#f4ead1;border-radius:2px 10px 8px 3px}.field-note{background:#f0f2e8;border-left:0;padding:18px 22px;border-radius:4px 13px 6px 5px;align-self:start}
@media(max-width:760px){.paper-header{padding:16px 14px 0;font-size:8px}.paper-header>span:last-child{font-size:7px}#drawing{margin-top:10px;max-height:none}.step-caption{margin:0 15px 12px;min-height:110px;padding-top:15px}.step-caption strong{font-size:14px}.step-caption p{font-size:12px}.field-note{padding:16px}.title-row h1{text-decoration-thickness:5px}}

.publication-notice{border-left:3px solid #c1a266;background:#f5edda;padding:12px 16px;font-size:12px;line-height:1.7;margin:0 0 20px;color:#665a3d}.publication-notice a{color:#355d4b;text-decoration:underline;text-underline-offset:3px}

/* Playback stays visible within the drawing; captions use only their content height. */
.paper{overflow:clip}
.paper-header{padding:14px 20px 12px}
.transport{position:sticky;top:0;z-index:5;padding:8px 18px;min-height:52px;border-top:1px solid #d7deca;border-bottom:1px solid #d7deca;box-shadow:0 2px 4px #283b3608}
.transport button{flex-shrink:0;min-width:36px;min-height:36px}
.transport .step-track button{min-width:0;min-height:36px}
.transport select{min-height:36px}
#drawing{max-height:min(440px,52svh);margin:0;scroll-margin-top:58px}
.step-caption{min-height:0;margin:0 20px 16px;padding-top:12px;gap:12px}
.step-caption p{line-height:1.55;margin-top:4px}
@media(min-width:761px){main{padding-top:26px}.description{min-height:0;margin-bottom:16px}.publication-history{margin-bottom:16px;padding:10px 14px}.title-row{margin-top:12px}}
@media(max-width:760px){.paper-header{padding:12px 14px 10px}.transport{padding:6px 10px;gap:8px}#drawing{max-height:none}.step-caption{min-height:0;margin:0 14px 14px;padding-top:11px}.step-caption p{font-size:12px}.description{margin-bottom:16px}.publication-history{margin-bottom:16px}}
@media(max-width:500px){.transport{display:grid;grid-template-columns:40px 36px 1fr auto 36px;column-gap:8px;row-gap:0}.transport .play{grid-column:1;grid-row:1}.transport #restart{grid-column:2;grid-row:1}.transport #time{grid-column:3;grid-row:1;text-align:center}.transport #speed{grid-column:4;grid-row:1;font-size:10px}.transport #nextStep{grid-column:5;grid-row:1}.transport .step-track{grid-column:1/-1;grid-row:2}.transport .step-track button{min-height:24px;height:24px;padding:10px 0}}