:root{--blue:#0087DC;--ink:#233d50;--muted:#637484;--line:#dbe6ed;--pale:#edf7fd;--header:64px;--toolbar:58px;color-scheme:light}*{box-sizing:border-box}html{scroll-padding-top:144px}body{margin:0;background:#f8fafc;color:var(--ink);font-family:"Segoe UI","Microsoft JhengHei",sans-serif;line-height:1.65}a{color:var(--blue);text-underline-offset:3px}button,input,select{font:inherit}button,a,input,select{outline-offset:4px}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--blue)}button{cursor:pointer}button:disabled{cursor:default;opacity:.38}header{position:fixed;z-index:15;inset:0 0 auto;min-height:64px;background:#fff;display:flex;align-items:center;justify-content:space-between;padding:14px 26px;border-bottom:1px solid var(--line);gap:16px}header nav{display:flex;align-items:center;gap:20px;font-size:14px}header nav a{text-decoration:none}.brand{display:flex;align-items:center;gap:8px;text-decoration:none;white-space:nowrap;font-size:17px}.brand img{width:24px;height:24px;object-fit:contain}.brand b{color:#000}.brand span{border-left:1px solid #c4d4df;padding-left:9px;color:var(--blue)}header button{border:1px solid var(--line);border-radius:5px;background:#fff;padding:4px 9px;font-size:12px}aside{position:fixed;inset:64px auto 0 0;width:286px;padding:25px 18px;background:#fff;border-right:1px solid var(--line);overflow:auto;z-index:12;font-size:14px}aside label{font-size:12px;font-weight:700;display:block;margin-bottom:7px;color:var(--muted)}aside input{width:100%;border:1px solid #cbd8e0;border-radius:6px;padding:8px 10px;margin-bottom:18px}aside a{display:block;padding:7px 10px;color:var(--ink);text-decoration:none;border-radius:4px}aside a:hover{background:#f0f6fa}aside a[aria-current]{background:var(--pale);color:var(--blue);border-left:3px solid var(--blue);font-weight:600}aside details{margin-top:10px}aside summary{cursor:pointer;font-weight:650;padding:7px 0}aside .unit-nav{margin:0 0 0 12px}aside .unit-nav summary{font-size:13px;font-weight:500;padding:0;display:flex}aside .unit-nav summary a{flex:1}aside .step-link{font-size:12px;margin-left:12px;color:var(--muted)}#search-results:not(:empty){padding:8px 0;border-bottom:1px solid var(--line);margin-bottom:16px}main{margin:64px 0 0 286px;padding:0 42px 40px;max-width:1800px}.toolbar{position:sticky;top:64px;z-index:10;display:flex;align-items:center;gap:10px;min-height:58px;background:#f8fafcf2;padding:10px 0;border-bottom:1px solid var(--line);backdrop-filter:blur(8px)}.toolbar button,.pager button{padding:5px 12px;background:#fff;border:1px solid #cbd8e0;border-radius:4px;font-size:13px}.edition{font-size:12px;color:var(--muted);margin-left:auto}#menu{display:none}.page{padding:30px 0 20px;scroll-margin-top:128px;min-width:0}.page[hidden]{display:none}.page h1{font-size:clamp(25px,2.3vw,34px);line-height:1.35;margin:0 0 24px;font-weight:650}.title-link{color:var(--ink);text-decoration:none}.page h2{font-size:20px;line-height:1.45;margin:0 0 12px}.page p{margin:8px 0 15px}.lead{font-size:18px;max-width:960px}.eyebrow{font-size:12px;color:var(--blue);letter-spacing:.12em;font-weight:700}.route-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:30px 0}.route{background:#fff;border-top:4px solid var(--blue);padding:20px;min-width:0}.route a{text-decoration:none}.route h2{font-size:18px;min-height:52px}.route p{font-size:13px;color:var(--muted);margin-bottom:0}.diagram{display:flex;flex-direction:column;align-items:stretch;gap:3px;padding:14px;background:#f2f8fc;border-radius:5px;max-width:100%;font-size:13px;line-height:1.35}.diagram span{padding:9px 6px;background:#fff;border:1px solid #bddcf0;text-align:center;overflow-wrap:anywhere}.diagram b{color:var(--blue);text-align:center;font-size:18px;font-weight:500}.diagram::after{content:'Concept';font-size:10px;text-align:right;color:var(--muted);margin-top:4px}.teaching-row{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,1fr);align-items:start;gap:30px;padding:28px 0;border-bottom:1px solid var(--line);scroll-margin-top:146px}.teaching-row:first-of-type{padding-top:6px}.teaching-row>div{min-width:0}.step p{max-width:1000px}.step-number{font-size:11px;font-weight:700;letter-spacing:.13em;color:var(--blue);margin:0 0 5px!important}.meta{font-size:13px;color:var(--muted)}figure{margin:0;min-width:0}.image-open{border:1px solid #d4e2eb;padding:0;background:white;width:100%;display:block;cursor:zoom-in}.image-open img{width:100%;height:auto;display:block}.image-open:hover{box-shadow:0 3px 15px #0087dc25}figcaption{font-size:12px;color:var(--muted);line-height:1.5;padding:8px 0}figcaption span{font-size:10px;display:block;margin-top:4px;overflow-wrap:anywhere}.action{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border:1px solid var(--blue);background:#fff;border-radius:5px;color:var(--blue);text-decoration:none;font-size:14px;font-weight:600}.action.primary{background:var(--blue);color:white}.timestamp{border:0;padding:4px 0;background:transparent;color:var(--blue);font-size:13px;font-weight:600}.note,.check{background:var(--pale);border-left:3px solid var(--blue);padding:16px 20px;margin:22px 0}.note p:last-child,.check p:last-child{margin-bottom:0}.check{font-size:14px;margin-bottom:0}.related{font-size:13px;margin:30px 0}.related h2{font-size:16px}.pager{display:flex;justify-content:space-between;align-items:center;padding:22px 0;border-top:1px solid var(--line);font-size:14px}.pager[hidden]{display:none}footer{margin-top:25px;font-size:11px;color:var(--muted);line-height:1.8}.skip{position:fixed;z-index:99;top:-80px;background:white;padding:10px}.skip:focus{top:0}dialog{border:0;border-radius:8px;padding:0;box-shadow:0 20px 80px #0005;color:var(--ink)}dialog::backdrop{background:#142938c9}#lightbox{width:calc(100vw - 50px);max-width:1800px;height:calc(100vh - 50px);max-height:none;background:#f5f8fa}#lightbox .light-stage{height:calc(100% - 106px);overflow:auto;display:flex;align-items:center;justify-content:center;padding:10px}#lightbox img{max-width:100%;max-height:100%;object-fit:contain}#lightbox .light-stage.zoom{display:block}#lightbox .zoom img{max-width:none;max-height:none;width:1920px;height:auto}#lightbox .light-caption{margin:10px 20px;font-size:13px}.dialog-top{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:12px 18px;background:white;border-bottom:1px solid var(--line)}.dialog-top button{border:1px solid #cbd8e0;background:white;border-radius:4px;padding:4px 12px;white-space:nowrap}.dialog-top h2{font-size:17px;margin:0}.dialog-top button:last-child{margin-left:auto}#video-dialog{width:min(1280px,calc(100vw - 40px));max-width:none;max-height:94vh;overflow:auto}#video-dialog video{width:100%;max-height:64vh;aspect-ratio:16/9;display:block;background:#10161a}#video-dialog .video-bottom{display:flex;align-items:center;justify-content:space-between;padding:8px 18px;gap:20px;font-size:13px}#video-status{margin:0}#speed{border:1px solid #cbd8e0;border-radius:4px;padding:3px 5px}#video-chapters{display:flex;gap:8px;flex-wrap:wrap;padding:6px 18px 20px}#video-chapters button{border:1px solid #cbd8e0;border-radius:4px;background:#f7fafc;padding:5px 9px;font-size:12px}body.full .page{border-top:3px solid var(--blue);margin-top:32px}body.modal-open{overflow:hidden}#page-qr-dialog{padding:24px}
@media(min-width:1700px){main{padding-left:56px;padding-right:56px}.teaching-row{gap:38px}.page{max-width:1360px}}
@media(max-width:1050px){header{padding:12px 16px;gap:12px}header nav{gap:12px;font-size:12px}aside{width:246px}main{margin-left:246px;padding-left:25px;padding-right:25px}.route-grid{gap:10px}.route{padding:13px}.route h2{font-size:16px}.teaching-row{gap:20px}.edition{display:none}}
@media(max-width:760px){:root{--header:100px}header{min-height:100px;align-content:center;justify-content:center;flex-wrap:wrap;gap:6px}header nav{width:100%;justify-content:center;font-size:12px;gap:14px}.brand{font-size:16px}.brand img{width:23px;height:23px}aside{inset:100px auto 0 0;width:min(320px,90vw);transform:translateX(-105%);transition:transform .15s;box-shadow:10px 10px 30px #173b5320}aside.open{transform:none}main{margin:100px 0 0;padding:0 20px 30px}.toolbar{top:100px;gap:7px;min-height:56px}.toolbar button{font-size:12px;padding:5px 9px}#menu{display:block}.page{padding-top:24px;scroll-margin-top:165px}.page h1{font-size:26px}.teaching-row{grid-template-columns:1fr;gap:15px;padding:26px 0;scroll-margin-top:175px}.teaching-row figure{max-width:500px;width:100%}.teaching-row .diagram{max-width:330px}.route-grid{grid-template-columns:1fr}.route{padding:18px}.route h2{min-height:0}.route .diagram{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:center}.route .diagram b{transform:rotate(-90deg)}.route .diagram::after{grid-column:1/-1}.lead{font-size:16px}#lightbox{width:calc(100vw - 12px);height:calc(100dvh - 12px)}#video-dialog{width:calc(100vw - 12px);max-height:96dvh}.dialog-top{padding:10px;gap:10px}.dialog-top h2{font-size:14px}.dialog-top button{font-size:12px}.video-bottom{flex-wrap:wrap;gap:6px!important}#video-dialog video{max-height:55vh}figcaption{font-size:12px}.note,.check{padding:14px}.step h2{font-size:20px}}