:root{--navy:#17374e;--ink:#253d4d;--muted:#647782;--line:#d8e2e8;--cyan:#008f9b;--red:#ba563c;--paper:#fff;--blue:#527e9b;--soft:#f4f7f9}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.7 "Microsoft YaHei",system-ui,sans-serif}main{max-width:1600px;margin:auto;padding:30px 36px 20px}header{margin-bottom:22px}.chapter{font-size:12px;color:var(--cyan);letter-spacing:.12em;margin:0 0 5px}h1{font:600 29px/1.35 "Noto Serif SC","SimSun",serif;color:var(--navy);margin:0 0 8px}header p:last-child{margin:0;color:var(--muted);max-width:1050px}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 278px;gap:28px;border-top:1px solid var(--navy);padding-top:18px}.drawing{min-width:0}#stage{height:450px;position:relative;background:#f3f7fa;overflow:hidden;border:1px solid #e0e8ed}canvas{display:block;width:100%;height:100%;touch-action:none}#labels{position:absolute;inset:0;pointer-events:none;overflow:hidden}.world-label{position:absolute;white-space:nowrap;transform:translate(-50%,-50%);background:#ffffffeb;color:var(--navy);padding:2px 6px;font-size:12px;line-height:1.45;border-radius:2px;border-left:2px solid #c5d3dc;pointer-events:none}.world-label.force{border-color:var(--red);color:#9c422c}.world-label.selected{border-color:var(--cyan);color:#007a85}.world-label.note{font-size:11px;color:var(--muted)}#status{position:absolute;left:18px;top:16px;font-size:12px;color:var(--muted);max-width:65%;pointer-events:none}#status.ready{color:var(--cyan)}.view-tools{position:absolute;right:12px;top:12px;display:flex;background:#fffffff0;border:1px solid var(--line);padding:2px;gap:2px}button{font:inherit;cursor:pointer;background:#fff;border:1px solid var(--line);color:var(--navy);padding:6px 10px;border-radius:3px}button:hover{background:#edf5f6}button:focus-visible,input:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}button[aria-pressed=true]{background:var(--navy);color:#fff;border-color:var(--navy)}.view-tools button{border:0;padding:4px 8px;font-size:11px}#stage-foot{position:absolute;bottom:10px;left:14px;right:14px;font-size:11px;color:#617986;pointer-events:none}#sequence{display:flex;gap:6px;margin-top:12px}#sequence button{flex:1;text-align:left;font-size:12px;padding:10px}#sequence button span{font-size:10px;display:block;opacity:.8}.legend{display:flex;flex-wrap:wrap;gap:8px 18px;margin:11px 0;font-size:12px;color:var(--muted)}.legend span{display:flex;align-items:center;gap:6px}.legend i{display:inline-block;width:18px;height:3px;background:var(--navy)}.action{font-size:13px;margin:6px 0;color:var(--navy)}aside{padding-left:22px;border-left:1px solid var(--line)}.control{display:block;margin:0 0 18px}.control-head{display:flex;justify-content:space-between;gap:12px;font-size:13px}.control strong{font-family:Consolas,monospace;font-size:14px;color:var(--navy)}input[type=range]{width:100%;accent-color:var(--cyan);margin:9px 0 0}.readout-row{display:flex;justify-content:space-between;align-items:baseline;border-bottom:1px solid var(--line);padding:6px 0;font-size:12px}.readout-row b{font:600 18px/1.5 Consolas,monospace;color:var(--navy)}.readout-row b small{font:11px "Microsoft YaHei",sans-serif;margin-left:3px;color:var(--muted)}#readout{margin-top:12px}.formula{margin:17px 0 5px;font:15px/1.9 Cambria,"Times New Roman",serif;color:var(--navy)}.formula small{display:block;font:11px/1.7 "Microsoft YaHei",sans-serif;color:var(--muted)}.switch{display:flex;gap:7px;font-size:12px;margin:8px 0}.switch input{accent-color:var(--cyan)}#below{margin-top:22px;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:25px}.diagram{margin:0;border-top:1px solid var(--line);padding-top:10px}.diagram h2,.explanation h2{font-size:14px;font-weight:600;margin:0 0 9px}.diagram svg{display:block;width:100%;height:200px}.explanation{border-top:1px solid var(--line);padding-top:10px;font-size:13px}.explanation p{margin:7px 0}.explanation ol{padding-left:20px;margin:7px 0}.explanation strong{color:var(--navy)}footer{font-size:11px;color:var(--muted);margin-top:20px;border-top:1px solid var(--line);padding-top:10px}footer p{margin:3px 0}footer a{color:var(--cyan)}.warning{color:#9d432b;background:#fff2ec;border-left:3px solid var(--red);padding:7px 9px;font-size:12px}.embedded main{padding:19px 20px 12px}.embedded .chapter{display:none}.embedded h1{font-size:24px}.embedded header{margin-bottom:16px}.embedded #stage{height:440px}.embedded #below{margin-top:18px}.embedded footer .operating{display:none}svg text{font-family:"Microsoft YaHei",sans-serif}svg .numeric{font-family:Consolas,monospace}@media(max-width:900px){main,.embedded main{padding:16px}.workspace{grid-template-columns:minmax(0,1fr) 230px;gap:14px}aside{padding-left:14px}#stage,.embedded #stage{height:410px}.view-tools{right:6px}.view-tools button{padding:4px 5px}}@media(max-width:700px){.workspace{grid-template-columns:1fr}aside{border-left:0;border-top:1px solid var(--line);padding:15px 0 0}#controls{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}#readout{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}#below{grid-template-columns:1fr}#stage,.embedded #stage{height:380px}.view-tools{top:auto;bottom:35px}.control{margin-bottom:10px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
@media(min-width:701px) and (max-width:1100px){.workspace{grid-template-columns:1fr;gap:17px}aside{display:grid;grid-template-columns:1fr 1fr 1.15fr;gap:22px;padding:16px 0 0;border-left:0;border-top:1px solid var(--line)}#readout{margin-top:0}#formula .formula{margin-top:0}#stage,.embedded #stage{height:460px}.control{margin-bottom:14px}}