:root{font-family:Inter,"Microsoft YaHei",system-ui,sans-serif;color:#203941;background:#f3f4ef;font-synthesis:none}*{box-sizing:border-box}body{margin:0}a{color:#17625b;text-decoration:none}button,input,select{font:inherit}button{cursor:pointer;border:1px solid #bbc9c6;border-radius:8px;padding:9px 14px;background:#fff;color:#284b4c}button:hover{background:#e5efea}button[aria-pressed=true]{color:white;background:#17665e;border-color:#17665e}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #d49c32;outline-offset:3px}.top{display:flex;justify-content:space-between;gap:18px;padding:16px 3.5%;border-bottom:1px solid #d7dfd6;font-size:13px;align-items:center}.top span{color:#677974}main{max-width:1580px;margin:auto;padding:25px 3.5% 44px}.eyebrow{letter-spacing:.14em;color:#5a7972;font-size:12px;font-weight:700;margin:0 0 9px}h1{font-size:clamp(25px,2.3vw,37px);margin:0 0 10px;font-weight:650}.heading>p:last-child{color:#63766f;margin:0;max-width:980px;line-height:1.6}nav{display:flex;gap:8px;margin:23px 0 18px;flex-wrap:wrap}nav button{font-size:14px}.layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:20px}.visual{min-width:0}#viewport{height:520px;position:relative;border-radius:14px;overflow:hidden;border:1px solid #d1ddd8;background:#e8eee9}#viewport>canvas{display:block;width:100%;height:100%}#scene-badge{position:absolute;z-index:2;top:16px;left:16px;background:#fffffff0;color:#415d5b;border:1px solid #d0dcd5;border-radius:6px;padding:7px 11px;font-size:12px;max-width:calc(100% - 32px)}#legend{position:absolute;z-index:2;bottom:17px;left:17px;border-radius:7px;background:#ffffffeb;padding:8px 11px;font-size:12px}#legend span{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:3px}.blue{background:#407ca2}.red{background:#ca694c}.gold{background:#c39a40}.view-tools{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-top:11px}.view-tools button{font-size:12px;padding:7px 10px}.view-tools label{font-size:12px;display:flex;align-items:center;gap:3px}.scene-note{font-size:11px;line-height:1.6;color:#74867e;margin:10px 2px}aside{border-radius:14px;border:1px solid #d4dfd6;background:#ffffffb0;padding:18px;height:max-content}.prompt{border-left:3px solid #c19a54;padding-left:13px;margin-bottom:18px}.prompt>span{font-size:11px;letter-spacing:.1em;color:#986f2e}.prompt p{font-size:14px;line-height:1.6;margin:7px 0}.prompt button{padding:5px 9px;font-size:11px}.prompt #explanation{font-size:12px;color:#477365}.control{margin:15px 0}.control label{display:flex;justify-content:space-between;gap:10px;font-size:12px;align-items:center}.control output{font-weight:650;color:#175e58}.control input[type=range]{width:100%;accent-color:#287167;height:18px;margin:8px 0 2px}.control small,.help{font-size:10px;line-height:1.5;color:#7c8881}select{width:100%;margin-top:8px;padding:8px 9px;border:1px solid #cbd8ce;border-radius:6px;background:white;color:#2c5048;font-size:12px}.metrics{display:grid;grid-template-columns:1fr 1fr;gap:9px}.metric{background:#edf3ed;border-radius:7px;padding:10px}.metric span{display:block;font-size:10px;color:#687e72;margin-bottom:5px}.metric strong{font-size:17px;font-weight:600}.status{font-size:11px;line-height:1.65;color:#7c694b;margin-top:13px}.toggle{font-size:12px;color:#375d51}.toggle input{accent-color:#17665e}.learning{display:grid;grid-template-columns:1.2fr 1fr;gap:36px;margin-top:28px;border-top:1px solid #d5dfd3;padding-top:23px}.learning h2,#materials h2{font-size:19px;margin:0 0 11px}.learning p,#materials p{font-size:13px;line-height:1.85;color:#546d61}.formula{padding:12px 15px;border-radius:8px;background:#e5ede3;font-family:Cambria,"Microsoft YaHei",serif;color:#345348!important}details{border:1px solid #d2decf;border-radius:9px;padding:14px 17px;height:max-content}summary{cursor:pointer;font-size:13px;font-weight:600;color:#4a6c56}#materials{padding:24px 0 0}#material-chart{width:100%;max-width:1000px;height:auto;border:1px solid #d3ded1;border-radius:12px;background:#fafbf6}#model-error{position:absolute;inset:80px 20px;color:#994b36;z-index:8} [hidden]{display:none!important}@media(min-width:1450px){#viewport{height:580px}}@media(max-width:1000px){.layout{grid-template-columns:minmax(0,1fr) 290px}.top{font-size:11px}#viewport{height:510px}}@media(max-width:740px){main{padding:19px 16px}.top{padding:12px 16px}.top span{display:none}.layout{grid-template-columns:1fr}#viewport{height:360px}aside{padding:16px}.learning{grid-template-columns:1fr;gap:15px}nav{gap:6px;margin:17px 0 13px}nav button{font-size:11px;padding:8px 9px}.metrics{grid-template-columns:1fr 1fr}.heading>p:last-child{font-size:13px}.prompt{margin-bottom:13px}}
