:root{color-scheme:light;--paper:#f3f1eb;--ink:#182f37;--muted:#53686c;--line:#cbd4cf;--accent:#056d60;--lime:#bceccf;--stage:#102c33;--stageInk:#f0f8f5;--gold:#ffd28d}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:18px/1.55 "Microsoft YaHei","PingFang SC",system-ui,sans-serif}button{font:inherit;cursor:pointer;border:1px solid var(--line);border-radius:10px;padding:9px 15px;background:#fff;color:var(--ink);min-height:46px;transition:background .15s,box-shadow .15s}button:hover{background:#e4f3ec}button:focus-visible,a:focus-visible{outline:3px solid #e99b25;outline-offset:3px}button:disabled{cursor:default;opacity:.42}button[aria-pressed=true]{background:var(--accent);color:white;border-color:var(--accent)}h1,h2,p{margin:0}#app{max-width:1920px;margin:auto;padding:18px 26px 12px}header{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:15px}.brand{display:flex;gap:14px;align-items:center}.brandmark{display:grid;place-items:center;background:var(--ink);color:var(--lime);width:48px;height:48px;border-radius:50%;font-weight:700;letter-spacing:1px}h1{font-size:27px;letter-spacing:.05em}.brand p{font-size:15px;color:var(--muted)}.header-actions{display:flex;gap:8px}.header-actions button{font-size:16px}#path{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin:0 0 16px}#path button{display:flex;gap:12px;align-items:center;justify-content:center;border-radius:12px;background:transparent;position:relative}#path button.active{background:var(--accent);color:#fff;border-color:var(--accent)}#path .name{font-size:20px;font-weight:700}#path .example{font-size:15px;opacity:.83}#path .num{font-size:13px;opacity:.65}main{display:grid;grid-template-columns:minmax(0,1fr) 315px;gap:23px}.stage{background:radial-gradient(ellipse at 47% 40%,#1f4650,var(--stage) 73%);border-radius:22px;color:var(--stageInk);position:relative;height:calc(100dvh - 240px);min-height:440px;display:flex;flex-direction:column;isolation:isolate;box-shadow:0 6px 22px #17343413}.stage-top,.stage-bottom{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:15px 22px;z-index:2}.stage-top{font-size:18px;flex:none}.stage-style{font-size:14px;color:#b9d8d4}.stage-bottom{font-size:14px;padding:8px 18px 12px;min-height:48px;flex:none}.stage-bottom button{font-size:14px;min-height:36px;padding:4px 10px;background:#173c44;color:#e3f0ed;border-color:#5e8588}.stage-bottom span{max-width:70%}#drawing,#threeStage{flex:1;min-height:0;position:relative}#drawing svg{width:100%;height:100%;display:block;max-height:100%}#drawing svg text{font-family:"Microsoft YaHei",sans-serif;fill:#eaf5f0;font-size:22px}#drawing svg .small{font-size:18px;fill:#b9d6d2}#drawing svg .dark{fill:#17313b}#drawing svg .target{cursor:pointer;outline:none}#drawing svg .target:hover,#drawing svg .target:focus{filter:drop-shadow(0 0 6px #fff)}#drawing svg .selected{filter:drop-shadow(0 0 5px #ffffffa0)}#canvasHost{position:absolute;inset:0 110px 0 0}canvas{display:block;width:100%;height:100%;touch-action:none}.tools{position:absolute;right:16px;top:50%;transform:translateY(-50%);display:grid;gap:8px;width:86px}.tools button{background:#22464d;border-color:#608087;color:white;padding:8px;font-size:16px}.tools button:first-child,.tools button:nth-child(2){font-size:26px;line-height:1}.tools button[aria-pressed=true]{background:#bcf0d2;color:#153b34}#loading{position:absolute;top:45%;left:15%;right:20%;text-align:center;padding:16px;border-radius:12px;background:#0d2c33;pointer-events:none}.hotspot{position:absolute;background:#ffe0a0;color:#253c39;border:2px solid #fff;box-shadow:0 0 0 6px #f9d89725;font-weight:700;padding:5px 13px;min-height:44px;transform:translate(-50%,-50%);font-size:20px}.hotspot span{font-weight:400;font-size:14px}aside{padding:10px 0 0;display:flex;flex-direction:column;gap:14px}.eyebrow{font-size:16px;color:var(--accent);font-weight:700;letter-spacing:.06em}h2{font-size:27px;line-height:1.4;letter-spacing:.015em}.prompt{font-size:18px;color:var(--muted)}#choices{display:grid;grid-template-columns:1fr 1fr;gap:8px}#choices:empty{display:none}#choices button{font-size:18px;text-align:left;padding:9px 10px;border-left:5px solid var(--tissue-color,var(--line))}.discovery{border-top:1px solid var(--line);padding-top:13px}.mini-label{font-size:14px;color:var(--accent);font-weight:700}.discovery p{font-size:19px;margin-top:6px}#actions{display:grid;gap:8px;margin-top:auto;padding-top:4px}#actions button{width:100%}.primary{background:var(--accent);border-color:var(--accent);color:white;font-weight:700}.primary:hover{background:#09564e}#back{background:transparent}.activity{border:0;background:transparent;text-decoration:underline;text-underline-offset:4px;font-size:16px;min-height:38px;padding:0}footer{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-top:10px;font-size:18px}footer>span{font-weight:700}footer button{font-size:16px;min-height:40px;background:transparent;padding:5px 12px}dialog{width:min(790px,calc(100vw - 28px));max-height:88dvh;border:0;border-radius:18px;padding:25px;color:var(--ink);background:var(--paper)}dialog::backdrop{background:#061e28a8}.dialog-top{display:flex;align-items:start;justify-content:space-between;gap:20px;margin-bottom:20px}.dialog-top h2{font-size:25px}#dialogContent p{margin-bottom:15px}#dialogContent a{color:#046555}#dialogContent h3{margin:15px 0 6px}.quiz-options{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}.answer-slots{border:1px dashed #68867d;padding:14px;min-height:62px;border-radius:12px;font-size:22px;margin:14px 0}.feedback{padding:12px;border-radius:10px;background:#deeee3}.feedback.error{color:#8c1f1f;background:#ffe5e0}.feedback.success{color:#155c35;background:#d9f0df}.source-meta{font-size:15px;line-height:1.7;background:#e4e9e1;padding:12px;border-radius:10px}.compare-row{padding:14px;border-radius:12px;background:#e3ebe1;margin:12px 0;font-weight:700}.high{--paper:#fff;--ink:#071c24;--muted:#294249;--line:#6f817f;--accent:#005a47;--stage:#030e13;--stageInk:#fff}.high .stage{background:#06131b}.high .stage-style,.high .stage-bottom{color:#fff}.high #drawing svg .small{fill:#fff}.high .discovery{border-top:2px solid #385954}[hidden]{display:none!important}.scene-enter{animation:arrive .38s ease-out}@keyframes arrive{from{opacity:.2;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}@media(min-width:1600px){body{font-size:21px}main{grid-template-columns:minmax(0,1fr) 360px}h2{font-size:32px}.prompt{font-size:21px}.discovery p{font-size:23px}#choices button{font-size:20px}#actions button{font-size:22px}h1{font-size:30px}}@media(max-width:1100px){#app{padding:14px}main{grid-template-columns:minmax(0,1fr) 285px;gap:15px}#path .example{display:none}.header-actions button{padding:8px 10px}h1{font-size:23px}h2{font-size:24px}.stage{min-height:450px}.prompt{font-size:17px}.discovery p{font-size:18px}}@media(max-width:900px){#app{padding:12px}header{flex-wrap:wrap;margin-bottom:12px}.brand p{font-size:14px}.header-actions{width:100%;justify-content:flex-end}.header-actions button{flex:1;font-size:15px}.brandmark{width:42px;height:42px}h1{font-size:24px}#path{gap:4px;margin-bottom:12px}#path button{padding:8px 2px;min-height:48px}#path .num{display:none}#path .name{font-size:18px}main{display:flex;flex-direction:column;gap:15px}.stage{height:420px;min-height:420px;border-radius:17px}.stage-top{padding:12px 14px;font-size:16px}.stage-style{font-size:12px}.stage-bottom{padding:6px 10px;font-size:12px;gap:8px}.stage-bottom button{font-size:12px;max-width:130px}.stage-bottom span{max-width:60%}#canvasHost{right:78px}.tools{right:9px;width:65px;gap:6px}.tools button{font-size:13px;padding:6px}.hotspot{font-size:17px;padding:5px 7px}.hotspot span{display:none}aside{padding:0;gap:10px}h2{font-size:25px}.prompt{font-size:18px}.discovery p{font-size:19px}#actions{grid-template-columns:1fr 1.35fr;margin-top:5px}#actions button{font-size:17px;padding:10px 6px}footer{align-items:start;font-size:16px}footer button{min-width:112px}.activity{margin-bottom:4px}dialog{padding:18px}.stage-bottom button{min-height:40px}}@media(max-width:440px){.stage{height:370px;min-height:370px}#drawing svg text{font-size:25px}#drawing svg .small{font-size:20px}}@media(max-height:700px) and (min-width:761px){.stage{height:470px}aside{gap:9px}}

#app:fullscreen{overflow:auto;background:var(--paper);max-width:none;width:100%}.hotspot:before{content:"";position:absolute;right:100%;top:50%;width:62px;height:2px;background:#ffe0a0}.hotspot:after{content:"";position:absolute;right:calc(100% + 59px);top:calc(50% - 4px);width:9px;height:9px;border:2px solid #ffe0a0;border-radius:50%}@media(max-width:900px){.hotspot:before{width:31px}.hotspot:after{right:calc(100% + 28px)}#drawing svg text{font-size:29px}#drawing svg .small{font-size:23px}}



