:root{font-family:"Noto Sans TC","Noto Sans CJK TC","PingFang TC","Microsoft JhengHei",sans-serif;color:#4b3a2e;background:#fff7ea;font-synthesis:none;--ink:#4b3a2e;--green:#26594d;--mint:#bfe3d6;--wood:#e2c08f;--gold:#f3d781;--coral:#ff8a7a}*{box-sizing:border-box}body{margin:0;background-image:radial-gradient(#b39a6b20 .7px,transparent .7px);background-size:13px 13px}h1,h2,h3,p{margin:0}p{line-height:1.7}button,input,textarea,select{font:inherit;color:inherit}button,a,summary,input,select{min-height:44px}button{padding:10px 14px;border:1.5px solid #a8bca9;border-radius:12px 14px 11px 13px;background:#fffef8;cursor:pointer;line-height:1.45}button:hover:not(:disabled){background:#e7f3e9}button:disabled{opacity:.5;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:3px solid #d47a43;outline-offset:4px}.primary{background:#bfe3d6;border:2px solid #456f60;font-weight:800}.primary:hover:not(:disabled){background:#a7d6c3}[hidden]{display:none!important}.site-header{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:1180px;margin:auto;padding:19px 24px 13px;border-bottom:1px solid #ddd5bb}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-size:14px;font-weight:800;color:var(--green)}.brand svg{flex-shrink:0}.private-tag{font-size:11px;border:1px dashed #aeaa88;padding:6px 12px;border-radius:20px;line-height:1.5}main{max-width:1120px;margin:auto;padding:0 24px}.intro{padding:34px 3px 27px;display:flex;justify-content:space-between;align-items:center}.eyebrow{font-size:10px;letter-spacing:1.5px;font-weight:800;color:#6b8068;margin-bottom:8px}h1{font-size:40px;line-height:1.35;letter-spacing:.5px;font-family:"Zen Maru Gothic","Noto Sans TC","Noto Sans CJK TC",sans-serif}.subtitle{margin-top:10px;color:#6c7461;font-size:15px}.intro-note{transform:rotate(-6deg);font-size:17px;line-height:1.8;color:#92703e}.intro-note span{margin-left:35px}.intro-note svg{width:90px;display:block;margin-left:35px}.teacher-card{display:flex;gap:18px;align-items:center;background:#e5f0df;border:1.5px solid #9eb99e;border-radius:19px 24px 17px 22px;padding:17px 20px 0 10px;margin-bottom:24px}.teacher-crop{width:103px;height:135px;overflow:hidden;flex-shrink:0;align-self:flex-end}.teacher-crop img{width:103px;height:auto;display:block}.teacher-copy{flex:1;min-width:0;padding-bottom:16px}.teacher-copy h2{font-size:20px;line-height:1.5;margin-bottom:5px}.teacher-copy p:last-child{font-size:14px}.steps{list-style:none;display:flex;gap:9px;margin:0 0 17px;padding:0;flex-shrink:0}.steps li{display:flex;align-items:center;flex-direction:column;gap:5px;font-size:11px;border:1px dashed #b5c4a7;border-radius:11px;background:#f7f8e9;padding:8px 11px}.steps span{font-size:20px;font-weight:800}.steps li.active{background:#bfe3d6;border:2px solid #688971}.steps li.done span:after{content:'✓';font-size:11px;margin-left:2px}.workspace{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:24px;align-items:start}.lab-card,.notebook,.compare-card{border:1.5px solid #d0ccb4;border-radius:20px 23px 19px 22px;background:#fffdf5;padding:23px;min-width:0}.lab-heading{display:flex;align-items:center;justify-content:space-between;gap:8px}.lab-heading h2{font-size:19px;line-height:1.5}.pill{font-size:11px;background:#f6e7b9;border-radius:30px;padding:7px 10px;text-align:center;max-width:150px}.setup{margin-top:16px;padding:12px;background:#f4f3e4;border:1px dashed #c5c3a8;border-radius:12px}.setup p{font-size:13px}.setup-buttons{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}.setup-buttons button{flex:1;font-size:13px}.bench{position:relative;height:530px;min-width:0;margin-top:10px;background:#fff9e8;border:1px solid #e6dfc6;border-radius:15px;overflow:hidden}#diagram{display:block;width:100%;height:530px}.rope-handle{position:absolute;width:48px;height:48px;min-width:48px;padding:0;border:2px solid var(--ink);border-radius:11px;background:#ffd966;display:flex;align-items:center;justify-content:center;gap:1px;transform:translate(-50%,-50%);touch-action:none;user-select:none;z-index:3;font-size:12px;font-weight:800}.rope-handle span:first-child{font-size:24px;line-height:1}.rope-handle:disabled{opacity:.7}.rope-handle.is-dragging{background:#ffb49d;border-width:3px}.bench-footer{position:absolute;bottom:12px;left:0;right:0;text-align:center;font-size:11px;color:#877657;pointer-events:none}.direction-note{background:#f7ecd5;border-radius:8px;padding:10px 12px;font-size:12px;margin-top:12px}.readouts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-top:17px}.reading{border:1px dashed #afc4aa;border-radius:12px;padding:12px 5px;text-align:center;background:#edf5e9;min-width:0}.reading.height{background:#fff1d3;border-color:#d5ba81}.reading.rope{background:#edf4f1}.reading>span{font-size:12px;font-weight:700}.reading strong{display:block;font-size:27px;margin:6px 0}.reading small{font-size:12px;font-weight:500}.reading p{font-size:10px;color:#66735f;line-height:1.5}.clamp-status{font-size:11px;text-align:center;color:#526e5b;margin-top:10px}.move-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}.move-actions button{flex:1;font-size:13px}.save-row{margin-top:14px}.save-row button{width:100%;min-height:50px;font-size:15px}.save-row p{font-size:11px;text-align:center;margin-top:7px;color:#727762}.round-actions{display:flex;gap:8px;margin-top:13px;flex-wrap:wrap}.round-actions button{flex:1;font-size:12px}details{border-top:1px solid #ddd8c2;margin-top:18px;padding-top:6px}summary{cursor:pointer;padding:12px 0;font-size:13px;font-weight:800}details p{font-size:12px;margin:7px 0}.notebook{background:repeating-linear-gradient(#fffdf6,#fffdf6 31px,#ebecd9 32px);position:relative}.notebook:before{content:'';display:block;width:62px;height:15px;border:1px dashed #c3aa79;background:#f2dfad;transform:rotate(-4deg);position:absolute;top:-7px;left:calc(50% - 31px)}.notebook-heading h2{font-size:23px}.notebook-heading>span{font-size:12px;display:block;margin-top:7px;color:#7e806b}.note-help{font-size:12px;color:#6e7762;margin:11px 0}.records{display:flex;flex-direction:column;gap:12px;max-height:550px;overflow:auto;padding:2px}.empty-note{font-size:14px;line-height:1.8;padding:22px 14px;color:#78806a;text-align:center}.record{border:1px solid #c8cfb9;border-radius:12px;background:#fffdf7;padding:14px}.record header{display:flex;justify-content:space-between;align-items:center;gap:8px}.record h3{font-size:15px}.record .number{font-size:11px;color:#77836b}.record dl{display:grid;grid-template-columns:1fr auto;gap:6px;margin:12px 0;font-size:13px}.record dd{margin:0;font-weight:800}.record dt{margin:0}.record .record-label{font-size:10px;color:#7f8069}.record .save-status{font-size:11px;color:#48705d;border-top:1px dashed #d9dcc9;padding-top:8px}.wide-button{width:100%;margin-top:16px;background:#f4dfa0;font-weight:800}.small-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.small-actions button{font-size:12px}.compare-card{margin-top:25px;padding:25px 28px}.compare-card h2{font-size:25px;line-height:1.5}.pair-selectors{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin:22px 0 15px}label{display:block;font-size:13px;font-weight:700;line-height:1.6}select,input,textarea{border:1.5px solid #b8c5b1;border-radius:9px;background:#fffef8;padding:9px;width:100%;min-width:0}select{margin-top:6px}.evidence-pair{display:grid;grid-template-columns:1fr 1fr;gap:15px}.evidence-summary{border:1px dashed #a9bd9c;border-radius:13px;background:#eaf3e4;padding:16px}.evidence-summary:last-child{background:#fff0cd;border-color:#d6bf8b}.evidence-summary h3{font-size:18px}.evidence-summary p{font-size:13px;margin-top:9px}.evidence-summary strong{font-size:19px}#work-form{margin-top:24px;padding-top:21px;border-top:1px solid #d6d9bf}#work-form h3,#explanation h3{font-size:20px;margin-bottom:9px}#work-form>p,#explanation>p{font-size:13px}.work-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}fieldset{border:1px solid #c9d2bd;border-radius:12px;min-width:0;margin:0;padding:14px}legend{font-size:15px;font-weight:800;padding:0 5px}fieldset label+label{margin-top:12px}input{margin-top:5px}.feedback{font-size:13px;margin-top:12px;min-height:1.6em}.feedback.error{color:#9a432f}.feedback.good{color:#2e6c50}.formula{border:1px dashed #c8b07c;border-radius:10px;padding:14px;background:#fbf0d8;margin-top:12px;font-size:13px;line-height:1.8}#explanation{margin-top:25px;border-top:1px solid #ddd8c2;padding-top:22px}#explanation>label{margin-top:13px}textarea{margin:8px 0 12px;resize:vertical;line-height:1.7}.revision{padding:13px;border-left:3px solid #adc8a5;background:#f5f5e8;margin:10px 0;border-radius:0 9px 9px 0}.revision strong{font-size:12px}.revision p{font-size:13px;white-space:pre-wrap;overflow-wrap:anywhere}.completion{background:#dcefdc;border:1px solid #9ab394;border-radius:13px;padding:20px;margin-top:22px}.completion p{font-size:13px;margin-top:6px}.alert{padding:18px;border:2px solid #ce925a;border-radius:14px;background:#fff0dc;margin:20px 0}.alert p{font-size:13px;margin-top:6px}.alert .small-actions button{background:#fff9ec}footer{text-align:center;padding:35px 5px;color:#718068}footer strong{font-size:15px}footer p{font-size:11px;margin-top:8px}.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:900px){.workspace{grid-template-columns:1fr}.records{max-height:none}.steps{gap:5px}.steps li{padding:7px}.teacher-card{gap:12px}}
@media(max-width:600px){.site-header{padding:12px 14px;align-items:flex-start;flex-wrap:wrap}.brand{font-size:12px}.private-tag{font-size:10px}.intro{padding:25px 2px 22px}main{padding:0 13px}h1{font-size:29px}.subtitle{font-size:13px}.intro-note{display:none}.teacher-card{padding:12px 12px 0 2px;gap:8px;flex-wrap:wrap}.teacher-crop{width:75px;height:105px}.teacher-crop img{width:81px}.teacher-copy{min-width:180px;padding-bottom:9px}.teacher-copy h2{font-size:17px}.teacher-copy p:last-child{font-size:12px}.steps{width:100%;margin:0 0 12px 10px;gap:8px}.steps li{flex:1;flex-direction:row;justify-content:center;font-size:11px;padding:7px 5px}.steps span{font-size:16px}.lab-card,.notebook,.compare-card{padding:17px 12px}.lab-heading{align-items:flex-start}.lab-heading h2{font-size:16px}.pill{font-size:10px;max-width:90px}.eyebrow{font-size:9px;letter-spacing:1px}.bench{margin-left:-4px;margin-right:-4px}.readouts{gap:5px}.reading strong{font-size:23px}.reading>span{font-size:11px}.reading p{font-size:9px}.direction-note{font-size:11px}.move-actions button{font-size:12px;padding:10px 5px}.round-actions button{padding:9px 6px}.compare-card h2{font-size:21px}.pair-selectors,.evidence-pair,.work-grid{gap:9px}.evidence-summary{padding:12px 9px}.evidence-summary h3{font-size:15px}.evidence-summary p{font-size:12px}.evidence-summary strong{font-size:17px}fieldset{padding:10px 8px}label{font-size:12px}select{font-size:12px}.empty-note{padding:20px 5px}.small-actions button{flex:1}.setup-buttons{gap:7px}.setup-buttons button{padding:10px 7px}.notebook-heading h2{font-size:21px}}
@media(max-width:400px){.pair-selectors,.work-grid{grid-template-columns:1fr}.evidence-pair{grid-template-columns:1fr}.teacher-copy{min-width:150px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
dialog{max-width:min(520px,94vw);border:2px solid #a6b89e;border-radius:17px;padding:22px;background:#fff7ea;color:#4b3a2e}dialog::backdrop{background:#4b3a2e66}dialog h2{font-size:21px;margin-bottom:12px}dialog p{font-size:14px}.confirm-label{display:flex;gap:10px;align-items:center;margin-top:18px}.confirm-label input{width:24px;min-width:24px;min-height:24px;height:24px;margin:0}.confirm-label{font-size:13px}
/* One concrete next action, in the natural page flow: no blocking overlay. */
.guide-card{background:#fff0c7;border:2px solid #d4b976;border-radius:16px;padding:16px;margin:0 0 16px;color:#4b3a2e}.guide-card h3{font-size:1.15rem;margin:4px 0 8px}.guide-card p{margin:7px 0;line-height:1.6}.guide-location,.guide-goal{font-size:.88rem}.guide-progress{font-weight:700;color:#244f50}.guide-card button{width:100%;margin-top:7px;min-height:48px}.guide-target{outline:3px solid #b66d38!important;outline-offset:4px}.rope-handle.guide-target{outline-offset:5px}.guide-target:focus-visible{outline:4px solid #244f50!important}.guide-card .eyebrow{color:#715622}@media(max-width:600px){.guide-card{padding:12px}.guide-card h3{font-size:1.05rem}.guide-card p{overflow-wrap:anywhere}}@media print{.guide-card{display:none}.guide-target{outline:none!important}}
@media(max-width:600px){.steps{width:100%;margin:0 0 12px;gap:5px;flex-wrap:wrap}.steps li{min-width:0;overflow-wrap:anywhere}.teacher-copy{min-width:0}}
