body[data-lesson="01"]{background:#edf1fc;color:#233b59}body[data-lesson="01"] main{max-width:1540px;padding:14px 24px}body[data-lesson="01"] header{background:#fffdfb;border-color:#d4dcee}body[data-lesson="01"] header h1{letter-spacing:1px}body[data-lesson="01"] header .small{display:none}.p01-tabs{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:14px}.p01-tabs button{background:transparent;border-color:transparent;font-weight:700;color:#637493}.p01-tabs button.active{color:#17466e;background:#d4e5fc;border:1px solid #abc7e6}.p01-lead{margin:0 0 13px;font-size:15px;color:#516687;line-height:1.6}.p01-tools{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:12px}.p01-tools button{min-height:42px}.p01-tools button.active{background:#276f9d;border-color:#276f9d}.p01-tools .pink.active{background:#b13970;border-color:#b13970}.p01-tools .spacer{flex:1}.p01-tools .divider{height:25px;width:1px;background:#bdcde3;margin:0 3px}.p01-board-wrap{position:relative;overflow:hidden;border:1px solid #aebfdc;border-radius:14px;background:#e0e8fb;box-shadow:0 4px 14px #5f769316}.p01-board-wrap svg{width:100%;height:min(62vh,650px);min-height:380px;display:block;touch-action:none;user-select:none}.p01-board-wrap .zoom-tools{position:absolute;right:10px;bottom:10px;display:flex;gap:5px;background:#f7faffdd;padding:4px;border-radius:10px}.zoom-tools button{padding:3px 10px;min-height:36px;font-size:13px}.p01-board-wrap .paper-key{position:absolute;left:14px;bottom:12px;pointer-events:none;font-size:13px;color:#506383;display:flex;gap:16px;background:#e0e8fbdc;padding:5px;border-radius:5px}.paper-key i{display:inline-block;width:14px;height:14px;background:#25b4dc;vertical-align:-2px;border-radius:2px;margin-right:5px}.paper-key i.pink-line{height:5px;background:#ed5891;vertical-align:3px}.p01-foot{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:12px;background:#ffffffac;border:1px solid #cad5e9;border-radius:12px;padding:11px 13px}.p01-foot output{flex:1;min-width:200px;line-height:1.7;font-size:16px}.p01-foot button{min-height:44px}.p01-status{color:#345a77;text-align:left;min-height:44px;margin:0;padding:11px 3px;font-size:15px;line-height:1.6}.p01-options{display:flex;gap:12px;align-items:center;flex-wrap:wrap;font-size:13px;color:#536a84;margin:4px 0 10px}.p01-options label{display:flex;align-items:center;gap:5px}.p01-options details{margin-left:auto}.p01-options summary{cursor:pointer}.p01-options details[open]{flex-basis:100%}.p01-examples{display:flex;gap:7px;margin-top:7px;flex-wrap:wrap}.p01-examples button{padding:6px 12px}.p01-selection{display:flex;align-items:center;gap:6px;flex-wrap:wrap;border-top:1px solid #ccd6e7;padding-top:9px;margin:0 0 12px;color:#536780;font-size:14px}.p01-selection button{min-width:42px;min-height:38px;padding:4px 10px}.p01-selection span{margin-right:8px}.p01-records{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}.shape-record{background:#fffdfc;border:1px solid #ccd6e7;border-radius:12px;padding:12px;margin:0;max-width:420px}.shape-record figcaption{font-size:15px;font-weight:bold;display:flex;justify-content:space-between;align-items:center}.shape-record svg{display:block;width:100%;height:165px;background:#f3f5fc;border-radius:8px;margin:7px 0}.shape-record p{font-size:14px;color:#49607b;margin:6px 0;line-height:1.6}.shape-record button{padding:4px 10px;min-height:32px;font-size:13px}.shape-record .record-actions{display:flex;gap:7px}.p01-empty{color:#6981a0;font-size:14px;margin:5px 0}.p01-board-wrap svg text{font-family:'Microsoft YaHei',sans-serif}.p01-board-wrap svg [data-edge]{cursor:grab}.p01-board-wrap svg [data-edge]:hover .edge-ink{stroke:#c93673;stroke-width:.13}.p01-board-wrap svg [data-cell]{cursor:grab}.p01-board-wrap svg .selected-halo{pointer-events:none}.p01-board-wrap svg:focus-visible{outline:3px solid #397dd1;outline-offset:-3px}.p01-board-wrap svg .grid-square:hover{fill:#fafcff55}.p01-board-wrap svg .translation-arrow{pointer-events:none}.p01-board-wrap svg [data-edge]:active{cursor:grabbing}@media(max-width:760px){body[data-lesson="01"] main{padding:10px}body[data-lesson="01"] header h1{font-size:17px}.p01-tabs{gap:4px;margin-bottom:8px}.p01-tabs button{flex:1;padding:8px 5px;font-size:14px}.p01-lead{font-size:13px;margin-bottom:8px}.p01-tools{gap:6px}.p01-tools button{padding:7px 10px;font-size:14px}.p01-tools .spacer{display:none}.p01-tools .divider{display:none}.p01-board-wrap svg{height:calc((100vw - 22px)*1.04);min-height:0;max-height:560px}.p01-board-wrap .paper-key{left:7px;bottom:9px;font-size:11px;gap:9px}.p01-board-wrap .zoom-tools{right:5px;bottom:5px}.zoom-tools button{padding:4px 8px;min-height:36px}.p01-foot{padding:9px;gap:6px}.p01-foot output{flex-basis:100%;min-width:0;font-size:14px}.p01-foot button{padding:6px 10px;font-size:14px}.p01-options{gap:7px;font-size:12px;margin-bottom:8px}.p01-options details{margin-left:0}.p01-records{grid-template-columns:1fr 1fr;gap:8px}.shape-record{padding:8px}.shape-record svg{height:130px}.shape-record figcaption,.shape-record p{font-size:12px}.shape-record .record-actions{flex-wrap:wrap}.p01-selection{font-size:12px;gap:4px}.p01-selection button{min-height:40px;min-width:40px}.p01-status{font-size:14px}}
body[data-lesson="01"] { overflow-anchor: none; }
@media(max-width:760px){.p01-selection>span{flex-basis:100%;min-height:20px}.p01-foot output{min-height:48px}.p01-status{min-height:68px}}