:root{font-family:"Microsoft YaHei","PingFang SC",sans-serif;color:#183d4e;background:#eef3f6;font-size:15px;line-height:1.65;--ink:#183d4e;--accent:#19667e;--line:#ccdbe2}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0}button,input,select{font:inherit}button{cursor:pointer;color:var(--ink);background:#fff;border:1px solid #b9cdd6;border-radius:4px;padding:6px 10px;line-height:1.45}button:hover{background:#e1eef3}button:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #edaa41;outline-offset:2px}button.active,button[aria-pressed=true],button.primary{background:var(--accent);color:#fff;border-color:var(--accent)}button:disabled{opacity:.45;cursor:default}a{color:#136584}header{padding:15px 26px 10px;display:flex;align-items:center;justify-content:space-between;background:white}h1{margin:0;font-size:25px;font-weight:700}h1 span{font-size:20px;font-weight:400;margin-left:12px}header p{margin:3px 0 0;color:#526e7d;font-size:13px}#modes{display:flex;gap:3px;padding:7px 26px 10px;background:#fff;border-bottom:1px solid var(--line)}#modes button{min-width:130px;border:0;border-radius:0;padding:9px 14px;border-bottom:3px solid transparent}#modes button.active{background:#e5f0f4;color:#16465b;border-bottom-color:#19667e}main{display:grid;grid-template-columns:225px minmax(400px,1fr) 310px;max-width:1920px;margin:auto;align-items:start;gap:0}.catalog,.detail{background:#fff;padding:17px 18px;max-height:calc(100vh - 148px);overflow:auto;scrollbar-width:thin}.catalog{border-right:1px solid var(--line)}.detail{border-left:1px solid var(--line)}h2{font-size:18px;margin:0 0 10px}h3{font-size:15px;margin:16px 0 4px;color:#265268}p{margin:6px 0 13px}.catalog h2{font-size:15px}#lessons{display:flex;flex-direction:column;gap:5px;margin-bottom:18px}#lessons button{text-align:left;font-size:13px;padding:7px 9px;border-color:transparent;background:#f2f6f8}#lessons button.active{background:#19667e;color:#fff}summary{cursor:pointer;font-weight:600}input[type=search]{width:100%;padding:8px;border:1px solid var(--line);border-radius:4px;margin:10px 0}.part-group h3{font-size:12px;font-weight:400;color:#6b808b;margin-top:15px}.part-group button{display:block;width:100%;text-align:left;border:0;background:none;font-size:13px;padding:4px 8px;margin:1px 0}.part-group button[aria-pressed=true]{background:#dbeaf0;color:#16465b}.scene-panel{min-width:0}.toolbar{display:flex;align-items:center;gap:6px;padding:10px;flex-wrap:wrap;min-height:56px}.toolbar label{font-size:12px}.toolbar button{font-size:12px;padding:5px 9px}#reset{margin-left:auto}#viewport{position:relative;height:max(400px,calc(100vh - 400px));min-height:400px;overflow:hidden;background:#edf3f6}#viewport canvas{display:block;touch-action:none}#loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;z-index:10;background:#edf3f6}#view-label{position:absolute;left:14px;top:12px;pointer-events:none;font-size:12px;padding:3px 7px;background:#ffffffd9}#scene-caption{position:absolute;top:42px;left:14px;right:14px;font-size:16px;font-weight:600;pointer-events:none}#legend{position:absolute;left:14px;bottom:10px;font-size:12px;pointer-events:none;background:#fffdf9e6;padding:3px 8px}#legend span{display:inline-block;width:9px;height:9px;margin-right:5px;border-radius:50%}.view-actions{padding:8px 12px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#f8fbfc}.view-actions button{font-size:12px}#scene-note{font-size:11px;color:#557080;margin-left:auto}.playback{padding:12px 18px 18px;background:white}.play-row{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.play-row button{font-size:13px}.play-row label{margin-left:auto;font-size:12px}.play-row select{font-size:12px;padding:4px}#progress{width:100%;accent-color:#19667e;margin:12px 0 8px}#step-list{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:10px}#step-list button{font-size:11px;padding:3px 7px}#step-title{font-size:17px;margin-bottom:6px}#step-text{font-size:14px;line-height:1.8;min-height:48px}#live-state{font-size:12px;color:#175670;border-left:3px solid #65a8c4;padding:5px 10px;background:#eef6f9;margin-bottom:0}.selection-status{font-size:12px;color:#6b808b}#part-title{font-size:22px;margin:4px 0 9px}#part-description{font-size:13px}#selected-tools{display:flex;gap:5px;flex-wrap:wrap;padding-bottom:12px;border-bottom:1px solid var(--line)}#selected-tools p{width:100%;font-size:11px;color:#6b808b;margin:0}#selected-tools button{font-size:11px}#related{display:flex;gap:4px;flex-wrap:wrap;margin:10px 0}#related button{font-size:11px}#lesson-title{font-size:17px;margin-top:16px}.detail section p,.detail details p{font-size:13px;line-height:1.85}.condition{font-size:12px;background:#f3f7f9;padding:9px;color:#4b6572}.detail details{margin:18px 0;font-size:12px}#sources a{display:block;margin:7px 0}footer{font-size:11px;padding:14px 26px;color:#5d7682;border-top:1px solid var(--line)}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}@media(min-width:1600px){main{grid-template-columns:250px minmax(600px,1fr) 355px}#viewport{height:calc(100vh - 370px);min-height:500px}}@media(max-width:1050px){main{grid-template-columns:180px minmax(370px,1fr)}.detail{grid-column:1/-1;max-height:none;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:0 22px}.detail>.selection-status,.detail>#part-title,.detail>#part-description,.detail>#selected-tools,.detail>#related,.detail>#lesson-title{grid-column:1/-1}.catalog{padding:12px;max-height:800px}}@media(max-width:650px){header{padding:12px 15px}h1{font-size:21px}h1 span{display:block;margin:0;font-size:15px}header a{font-size:12px}#modes{padding:5px;gap:0}#modes button{min-width:0;flex:1;font-size:12px;padding:9px 4px}main{display:flex;flex-direction:column}.scene-panel{order:0;width:100%}.catalog{order:1;width:100%;max-height:none;border-top:1px solid var(--line)}.detail{order:2;display:block;width:100%;padding:18px}#viewport{height:420px;min-height:350px}.catalog #lessons{display:grid;grid-template-columns:1fr 1fr}#parts{columns:2}.part-group{break-inside:avoid}.toolbar{padding:7px}.toolbar button{padding:5px 7px}.playback{padding:12px}#scene-note{width:100%;margin:0}footer{padding:12px 15px}.play-row label{margin-left:0}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}

#related{max-height:118px;overflow:auto}#live-state{font-size:14px}#step-list button{min-height:30px}
