:root{color-scheme:dark;--ivory:#f2e5c9;--muted:#c6b796;--red:#943e2d;--gold:#d4b17b;--ink:#44331e}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;background:#191912;color:var(--ivory);font-family:"Songti SC","STSong","Noto Serif CJK SC",serif;min-height:100svh}button,a,input{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;border:1px solid #c8b99560;background:#211e17d9;padding:11px 20px;cursor:pointer;transition:background .2s,transform .2s,box-shadow .2s}button:hover{background:#6b5233}button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:3px solid #ffd088;outline-offset:5px}button:disabled{opacity:.45;cursor:default}button:active:not(:disabled){transform:translateY(2px)}a{color:#f1c68f}.world,.shade{position:fixed;inset:0;pointer-events:none}.world{background:url('assets/workshop.jpg') center/cover;transform:scale(1.035);transition:transform 1.4s ease,filter 1.4s}.shade{background:linear-gradient(90deg,#11170fe8,#11170f80 47%,#14130d08),linear-gradient(0deg,#11110ddd,transparent 35%,#11110d60)}body:not([data-scene=intro]) .world{filter:brightness(.48) saturate(.8);transform:scale(1.1)}body[data-scene=shelf] .world,body[data-scene=done] .world{transform:scale(1.015);filter:brightness(.5)}body:not([data-scene=intro]) .shade{background:linear-gradient(0deg,#10110de8,transparent 45%,#10110d88)}.topbar,.footer{position:relative;z-index:3;display:flex;align-items:center;justify-content:space-between;margin:0 4vw}.topbar{height:76px;border-bottom:1px solid #dfc99530}.brand{font-size:21px;letter-spacing:4px;display:flex;align-items:center;gap:14px}.seal{font-size:25px;padding:3px 6px;border:1px solid #d39c78;color:#edb091;letter-spacing:0}.brand small{display:block;font:10px/1.8 sans-serif;letter-spacing:2px;color:var(--muted)}.toolbar{display:flex;gap:6px}.toolbar button{font:13px sans-serif;border:0;background:transparent;padding:12px}.toolbar button:hover{background:#d3b68520}main{position:relative;z-index:2;min-height:calc(100svh - 112px)}.intro{padding:7vh 8vw 3vh}.eyebrow{font:12px/1.5 sans-serif;letter-spacing:3px;color:var(--gold)}h1{font-weight:400;font-size:clamp(48px,5.6vw,86px);line-height:1.28;letter-spacing:5px;margin:25px 0}p{line-height:1.8;font-size:17px;color:#ded1b8}.intro p{letter-spacing:2px;margin:20px 0 28px}.primary{background:var(--red);border-color:#c0704c;font-size:17px;padding:13px 25px}.primary:hover{background:#b2503d}.primary span{margin-left:36px}.intro .intro-note{font:12px/1.9 sans-serif;color:#b6aa90;margin-top:24px;letter-spacing:1px}.footer{height:36px;border-top:1px solid #dfc99530;font:11px sans-serif;letter-spacing:1px;color:#bcb094}.mission{padding:21px 6vw 0;display:flex;justify-content:space-between;gap:20px;height:115px}h2{font-size:clamp(28px,2.4vw,40px);font-weight:400;letter-spacing:2px;margin:8px 0}.mission p{font:15px/1.7 sans-serif;color:#ded1b8;margin:0}.mission-meta{padding-top:5px;text-align:right;display:flex;flex-direction:column;gap:8px}.mission-meta>span{font:25px Georgia;color:#d5b884}.mission-meta small{font:12px sans-serif;color:#f4bc88;border:1px solid #bf9466;padding:4px 8px}.stage{width:min(1120px,88vw);height:clamp(395px,calc(100svh - 286px),680px);margin:0 auto;position:relative;perspective:1300px}.scene{height:100%;position:relative;animation:arrive .55s ease both}.object-caption{text-align:center;font:13px/1.8 sans-serif;letter-spacing:2px;color:#d7c8aa;margin:15px 0}.inspect-object{height:calc(100% - 48px);display:flex;align-items:center;justify-content:center;position:relative;filter:drop-shadow(15px 25px 18px #0009)}.closed-scroll{display:block;width:65%;height:110px;position:relative;border-radius:50% 12px 12px 50% / 10px 10px 10px 10px;border-top:2px solid #ead5a0;border-bottom:2px solid #6e4a21;background:repeating-linear-gradient(0deg,#a7763314 0 1px,transparent 1px 4px),linear-gradient(0deg,#8c6738,#e2c88f 25%,#f0daa6 50%,#c4a46b 80%,#745329);box-shadow:inset 0 8px 12px #fff2b850,inset 0 -8px 12px #3a230a88,0 9px 0 -4px #2c1a0e}.closed-scroll:before,.closed-scroll:after{content:"";position:absolute;top:35%;height:30%;width:30px;background:linear-gradient(#27190e,#a08453 35%,#725232 60%,#27190e);border:1px solid #27190e;border-radius:5px;z-index:-1}.closed-scroll:before{left:-28px}.closed-scroll:after{right:-28px}.closed-scroll i{position:absolute;inset:0 15px 0 auto;width:7px;background:#78502350;border-radius:50%}.ribbon{position:absolute;left:calc(50% - 13px);height:128px;width:26px;padding:0;border:1px solid #b96140;background:linear-gradient(90deg,#5a241b,#b66243 45%,#722c22);box-shadow:5px 0 8px #321b1699;transform:rotate(-4deg)}.ribbon:before,.ribbon:after{content:"";position:absolute;top:43%;width:48px;height:24px;border:8px solid #9f4d35;border-radius:70%;box-shadow:0 3px 3px #1e110a80}.ribbon:before{right:9px;transform:rotate(30deg)}.ribbon:after{left:9px;transform:rotate(-30deg)}.ribbon span,.wrapper span{position:absolute;white-space:nowrap;top:calc(100% + 40px);left:50%;transform:translateX(-50%);border-bottom:1px solid #d7b27f;padding:8px 14px;background:#171910de;font-size:20px;color:#f1d8af}.ribbon:hover{background:#a45338;box-shadow:0 0 24px #d6a56490}.wrapper{position:absolute;width:62%;height:112px;border:1px solid #d5ba7a;background:repeating-linear-gradient(35deg,#a7985930 0 1px,transparent 1px 8px),linear-gradient(0deg,#555a3a,#b0a978 50%,#5c6141);border-radius:9px;box-shadow:inset 0 6px 8px #e9dca855,inset 0 -8px 10px #28271c90}.wrapper:hover{background-color:#99906a}.open-control{position:absolute;top:calc(50% + 95px)}.scroll-object{height:clamp(230px,calc(100svh - 465px),440px);position:relative;transform:rotateX(5deg);display:flex;filter:drop-shadow(4px 16px 13px #000a);padding-top:12px}.paper{position:relative;flex:1;min-width:0;overflow:hidden;background:#dac69b;touch-action:none;cursor:grab;color:var(--ink);border-top:1px solid #ffebbb;border-bottom:2px solid #947747;user-select:none;box-shadow:inset 0 0 20px #8c632c44}.paper:active{cursor:grabbing}.strip{height:100%;display:flex;flex-direction:row-reverse;width:max-content;will-change:transform;position:relative}.leaf{flex:0 0 285px;width:285px;position:relative;height:100%;padding:23px 20px 25px 74px;border-right:1px solid #82663e35;background:repeating-linear-gradient(0deg,#9e713509 0 1px,transparent 1px 4px),linear-gradient(90deg,#9d73351a,#fff2c02a 45%,#8a643212)}.verse{writing-mode:vertical-rl;font-size:24px;line-height:1.8;letter-spacing:3px;height:100%;margin:0 0 0 auto;color:#423824}.leaf small,.leaf .number{position:absolute;bottom:8px;left:15px;font:11px sans-serif;color:#806d4b}.clue{position:absolute;left:14px;top:27px;width:44px;min-height:90px;padding:8px 6px;border:2px solid #93412c;color:#93412c;background:#dcc496;font-size:21px;writing-mode:vertical-rl;letter-spacing:4px;box-shadow:inset 0 0 0 2px #e9d3a6}.clue:hover{background:#f0d6a1}.clue.selected,.clue[aria-pressed=true]{background:#93412c;color:#fbe4b9}.roller{width:33px;position:relative;z-index:2;margin:-12px -1px;background:linear-gradient(90deg,#302314,#927043 20%,#cab07b 42%,#73522f 71%,#302113);border:1px solid #291d12;border-radius:7px;box-shadow:5px 3px 10px #0006}.roller:before,.roller:after{content:"";position:absolute;left:3px;right:3px;height:17px;background:linear-gradient(90deg,#281c12,#926e42,#352317);border:1px solid #b9956066;border-radius:3px}.roller:before{top:-9px}.roller:after{bottom:-9px}.read-tools{display:flex;align-items:center;justify-content:center;gap:22px;height:58px;font:13px sans-serif}.read-tools button{padding:8px 15px;font-size:13px}.clue-notes{display:flex;align-items:center;gap:18px;border-top:1px solid #c9a66a55;padding:12px 0;min-height:72px}.clue-notes>div:first-child{flex-shrink:0;display:flex;flex-direction:column;gap:7px}.clue-notes .primary{margin-left:auto;white-space:nowrap}.clue-list{display:flex;gap:10px;align-items:center;min-width:0}.note{background:#dcc9a0;color:#4b3923;padding:9px 13px;font-size:15px;box-shadow:2px 4px 4px #0005;transform:rotate(-2deg)}.note:nth-child(2){transform:rotate(1deg)}.label-workspace{height:100%;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px}.label-options{display:flex;gap:42px;align-items:center;justify-content:center}.paper-label{color:#513e25;background:repeating-linear-gradient(0deg,#9e713509 0 1px,transparent 1px 4px),#decba1;border:1px solid #aa8853;box-shadow:4px 8px 8px #0005;padding:18px 26px;font-size:25px;letter-spacing:5px;transform:rotate(-2deg);touch-action:none}.paper-label:nth-child(2){transform:rotate(2deg)}.paper-label:hover{background:#f0dfb2;color:#6d2920}.paper-label.selected,.paper-label[aria-pressed=true]{outline:3px solid #ca9660;outline-offset:5px}.label-feedback{font:15px/1.6 sans-serif;margin:0;min-height:24px;color:#f2cd99}.label-target{border:0;background:transparent;display:flex;align-items:center;justify-content:center;width:75%;height:150px;position:relative;padding:0;margin:6px 0 20px}.label-target:hover{background:#cfae7620}.label-target .closed-scroll{height:90px;width:95%}.target-caption{position:absolute;bottom:-18px;font:14px sans-serif;letter-spacing:2px;color:#ead3ab}.label-target.attached:after{content:"行旅见闻";position:absolute;color:#594122;background:#e8d6ae;padding:12px 30px;font-size:24px;letter-spacing:8px;box-shadow:0 2px 5px #59412255}.shelf-workspace{height:calc(100% - 36px);display:flex;align-items:center;gap:8%;padding:10px 0}.shelve-scroll{position:relative;flex:0 0 27%;height:180px;border:0;background:transparent;touch-action:none}.shelve-scroll .closed-scroll{width:90%;height:75px;margin:auto;transform:rotate(-8deg)}.shelve-scroll>span:last-child{display:block;font-size:24px;letter-spacing:4px;margin-top:35px}.shelve-scroll:hover,.shelve-scroll.selected,.shelve-scroll[aria-pressed=true]{background:#d4ae7120;outline:2px dashed #c0a475;outline-offset:8px}.shelves{flex:1;display:grid;grid-template-columns:repeat(3,1fr);gap:0;padding:15px 12px 22px;background:linear-gradient(90deg,#332415,#785435 8%,#49301d 93%,#2a1c12);border-top:10px solid #67472a;border-bottom:14px solid #624228;box-shadow:0 25px 20px #0009,inset 0 -3px #ba855050}.shelf-slot{min-height:230px;background:linear-gradient(#171511e8,#30241680);border:0;border-right:9px solid #634429;box-shadow:inset 6px 0 10px #080806;display:flex;flex-direction:column;align-items:center;justify-content:end;padding:15px 8px;gap:15px}.shelf-slot:last-child{border-right:0}.shelf-slot>span{background:#b99a68;color:#302517;font-size:21px;letter-spacing:2px;padding:9px 12px;box-shadow:0 3px 4px #0007}.shelf-slot small{font:12px sans-serif;color:#cdb895;white-space:nowrap}.shelf-slot:hover{background:linear-gradient(#2f2b1c,#745335)}.done-content{height:100%;padding:10px 3%;position:relative}.done-content h2{font-size:clamp(32px,3vw,49px);line-height:1.4;margin:12px 0 18px}.lessons{padding-left:24px;font-size:19px;line-height:2;margin:10px 0 20px}.done-content>button{margin-right:12px}.done-content>p{font:15px sans-serif;margin:12px 0}.archived-scroll{position:absolute;right:7%;top:70px;width:26%;height:160px;background:linear-gradient(90deg,#3f2b19,#9c7246 5%,#211b12 6%,#312316 94%,#78512f 95%);border-top:12px solid #715036;border-bottom:17px solid #715036;box-shadow:0 18px 20px #0009;display:flex;align-items:center;justify-content:center}.archived-scroll:before{content:"";position:absolute;width:75%;height:60px;border-radius:8px;background:linear-gradient(#796039,#e7d29d 40%,#c7a96c 60%,#715632);transform:rotate(-4deg);box-shadow:3px 9px 5px #0007}.archived-scroll span{position:relative;z-index:1;background:#ebd9b2;padding:7px 10px;color:#44331f;letter-spacing:4px;font-size:19px}.feedback{min-height:34px;text-align:center;font:15px/1.7 sans-serif;margin:12px 6vw 0;color:#f1d1a1}.feedback:empty{visibility:hidden}dialog{max-width:680px;width:90%;max-height:85svh;overflow:auto;border:1px solid #a98b5b80;background:#25251c;color:var(--ivory);padding:35px;box-shadow:0 30px 120px #000a}dialog::backdrop{background:#080c09cc;backdrop-filter:blur(7px)}dialog p,dialog li{font:15px/1.9 sans-serif}dialog h3{color:#dec298;font-size:21px}.dialog-close{position:absolute;top:8px;right:8px;border:0;background:transparent;font-size:26px;padding:4px 12px}.teacher-options{display:grid;grid-template-columns:1fr 1fr;gap:10px}.teacher-options button{font-size:16px}body.paused .stage{filter:blur(3px);pointer-events:none}body[data-paused=true] .stage{filter:blur(3px)}.dragging{opacity:.7;cursor:grabbing!important;outline:2px dashed #efc584;outline-offset:5px}@keyframes arrive{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@media(min-width:1600px){.mission{height:140px;padding-top:30px}.mission p{font-size:18px}.stage{width:min(1400px,86vw);height:calc(100svh - 316px)}.scroll-object{height:calc(100svh - 490px)}.leaf{width:320px;flex-basis:320px;padding-top:40px}.verse{font-size:28px;line-height:2;letter-spacing:6px}.read-tools{height:70px}.read-tools button{font-size:16px}.clue-notes{padding-top:20px}.inspect-object .closed-scroll{height:150px}.ribbon{height:170px}.wrapper{height:154px}.shelf-slot{min-height:340px}.shelf-slot>span{font-size:26px}.shelf-slot small{font-size:15px}.done-content{padding-top:45px}.lessons{font-size:24px}.archived-scroll{top:100px;height:230px}.done-content>p{font-size:18px}}@media(max-width:800px){.topbar{height:80px;margin:0 3vw}.brand{font-size:16px;gap:8px;letter-spacing:2px}.brand small{font-size:8px}.toolbar{gap:0}.toolbar button{font-size:11px;padding:9px 6px}.intro{padding:8vh 7vw}.intro h1{font-size:42px}.mission{height:auto;min-height:135px;padding:20px 6vw 10px}.mission p{font-size:13px}.mission-meta{min-width:45px}.mission h2{font-size:28px}.stage{height:auto;min-height:410px;width:88vw}.scene{min-height:410px}.inspect-object{height:350px}.scroll-object{height:250px}.leaf{width:260px;flex-basis:260px;padding-left:65px}.verse{font-size:24px}.clue-notes{flex-wrap:wrap}.clue-notes .primary{font-size:14px}.label-options{gap:12px}.paper-label{font-size:20px;padding:14px;letter-spacing:2px}.label-workspace{min-height:400px}.label-target{width:90%}.shelf-workspace{flex-direction:column;gap:12px}.shelve-scroll{height:130px;flex:auto;width:65%}.shelve-scroll>span:last-child{font-size:20px;margin-top:16px}.shelves{width:100%}.shelf-slot{min-height:170px}.shelf-slot>span{font-size:17px;padding:8px 5px;letter-spacing:0}.shelf-slot small{font-size:9px}.archived-scroll{display:none}.lessons{font-size:16px}.done-content h2{font-size:32px}.done-content>button{margin:8px 4px 0 0;font-size:14px}.footer{font-size:9px;height:45px}.footer span:last-child{max-width:45%;text-align:right}.feedback{font-size:13px;margin-bottom:12px}.read-tools{gap:10px}.read-tools button{font-size:12px;padding:8px}.teacher-options{grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}body.reduce-motion *,body.reduce-motion *::before,body.reduce-motion *::after,body.reduced-motion *,body.reduced-motion *::before,body.reduced-motion *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
/* Task-generated manuscript and draggable props. */
.scroll-object{min-height:240px}.leaf h3{position:absolute;top:12px;left:15px;margin:0;font-size:13px;letter-spacing:2px;font-weight:400;color:#8b6240}.clue-button{position:absolute;left:14px;top:47px;width:44px;min-height:90px;padding:8px 6px;border:2px solid #93412c;color:#93412c;background:#dcc496;font-size:21px;writing-mode:vertical-rl;letter-spacing:4px;box-shadow:inset 0 0 0 2px #e9d3a6}.clue-button:hover{background:#f0d6a1}.clue-button.selected,.clue-button[aria-pressed=true]{background:#93412c;color:#fbe4b9}.label-option{color:#513e25;background:repeating-linear-gradient(0deg,#9e713509 0 1px,transparent 1px 4px),#decba1;border:1px solid #aa8853;box-shadow:4px 8px 8px #0005;padding:18px 26px;font-size:25px;letter-spacing:5px;transform:rotate(-2deg)}.label-option:nth-child(2){transform:rotate(2deg)}.label-option:hover{background:#f0dfb2;color:#6d2920}.clue-note{background:#dcc9a0;color:#4b3923;padding:9px 13px;font-size:15px;box-shadow:2px 4px 4px #0005;transform:rotate(-2deg)}.clue-note:nth-child(2){transform:rotate(1deg)}.dragging{pointer-events:none!important;position:relative;z-index:12;transform:translate(var(--drag-x,0px),var(--drag-y,0px)) rotate(-3deg)!important}body[data-paused=true] .stage{pointer-events:none}body[data-inspect-step=ready] .inspect-object .closed-scroll{transform:rotate(-3deg);transition:transform .5s}
@media(max-width:800px){.label-option{font-size:20px;padding:14px;letter-spacing:2px}.clue-note{font-size:13px}}
/* Explicit manuscript lanes keep every interactive seal inside the paper. */
.leaf{padding:0;overflow:hidden}.leaf .verse{position:absolute;top:22px;right:20px;bottom:28px;left:74px;width:auto;height:auto;margin:0;font-size:24px;line-height:1.8;letter-spacing:3px;writing-mode:vertical-rl;overflow:visible}.leaf h3{top:12px;left:14px}.leaf .clue-button{top:42px;bottom:31px;left:14px;height:auto;min-height:0;width:44px;font-size:19px;letter-spacing:2px;line-height:1.2;white-space:nowrap}.leaf .number{bottom:8px;left:14px}.clue-list{flex-wrap:wrap}.clue-note{font-size:13px;max-width:195px}
@media(min-width:1600px){.leaf .verse{top:40px;bottom:35px;font-size:28px;line-height:2;letter-spacing:6px}.leaf .clue-button{bottom:auto;height:190px;font-size:21px}.clue-note{font-size:16px;max-width:260px}}
/* Dragging the exposed roller continuously draws a paper length from the roll. */
body[data-inspect-step=ready] .inspect-object .closed-scroll{--unroll:var(--open-progress,0);height:calc(110px + 100px * var(--unroll));width:calc(65% + 12% * var(--unroll));transform:rotate(calc(-3deg + 3deg * var(--unroll))) rotateX(calc(8deg * var(--unroll)));border-radius:calc(12px - 10px * var(--unroll));background:repeating-linear-gradient(0deg,#a7763314 0 1px,transparent 1px 4px),linear-gradient(0deg,#8c6738,#e2c88f 12%,#f0daa6 40%,#dac08b 80%,#745329);transition:none;box-shadow:inset 0 8px 12px #fff2b850,inset 0 -8px 12px #3a230a88,0 calc(9px + 12px * var(--unroll)) 16px #21150c88}
body[data-inspect-step=ready] .inspect-object .closed-scroll i{width:calc(7px + 22px * var(--open-progress,0));right:calc(15px - 9px * var(--open-progress,0));background:linear-gradient(90deg,#594124,#cfad71 50%,#806039);box-shadow:-8px 0 12px #8e652b50}
@media(min-width:1600px){body[data-inspect-step=ready] .inspect-object .closed-scroll{height:calc(150px + 100px * var(--open-progress,0))}}
/* V3: a classroom sequence, one question per scene. */
.toolbar{gap:0}.toolbar button{padding:10px;font-size:12px}.mission{height:108px;padding-top:17px}.stage{height:calc(100svh - 310px);min-height:365px}.feedback{margin-top:5px;min-height:30px;font-size:14px}.course-navigation{display:flex;align-items:center;justify-content:space-between;height:48px;margin:0 6vw;border-top:1px solid #bda47740}.course-navigation button{font-size:14px;padding:7px 16px;background:#1e2118c9}.course-navigation span{font:13px sans-serif;color:#d5c2a0;letter-spacing:1px}.lesson-scene{padding:14px 16px}.lesson-split{height:100%;display:grid;grid-template-columns:1.2fr 1fr;align-items:center;gap:6%}.big-question{font-size:clamp(34px,3.8vw,60px);line-height:1.35;font-weight:400;letter-spacing:3px;margin:14px 0}.lesson-lead{font-size:20px;line-height:1.8}.reveal-note{border-left:2px solid #c6a569;padding-left:17px;font-size:18px;line-height:1.7;color:#f0d7ab;margin:14px 0}.mystery-object{position:relative;display:flex;align-items:center;justify-content:center;height:240px;transform:rotate(-14deg);filter:drop-shadow(12px 20px 16px #0009)}.mystery-object .closed-scroll{width:95%;height:100px}.hanging-tag{position:absolute;top:140px;left:35%;writing-mode:vertical-rl;background:#d9c196;color:#513f27;font-size:24px;padding:18px 12px;letter-spacing:5px;box-shadow:3px 5px 8px #0008}.material-layout{display:grid;grid-template-columns:190px 1fr;gap:6%;align-items:center;height:calc(100% - 30px)}.material-choices{display:flex;flex-direction:column;gap:14px}.material-choices button{font-size:26px;text-align:left;border:0;border-left:2px solid #a18d67;background:#202018cc}.material-choices span{display:block;font:13px/2 sans-serif;color:#c0b292}.material-choices button[aria-pressed=true]{border-color:#e2ac6c;background:#5f402abd}.material-display{text-align:center}.material-display>p{font-size:19px;min-height:32px;margin:14px 0}.material-display .reveal-note{font-size:17px;text-align:left}.material-display>button{font-size:15px}.lesson-footnote{font:12px/1.7 sans-serif;color:#c0b293;margin:12px 0}.material-display #material-object{height:150px;width:min(550px,90%);margin:auto;display:flex;gap:7px;align-items:stretch;transform:rotate(-3deg);filter:drop-shadow(6px 10px 9px #0008)}#material-object i{display:block;flex:1;background:linear-gradient(90deg,#937542,#dcc588 45%,#b29b64);border-radius:5px;position:relative}#material-object[data-material=bamboo] i:before,#material-object[data-material=bamboo] i:after{content:'';position:absolute;left:-7px;right:-7px;height:4px;background:#503a21;top:25%}#material-object[data-material=bamboo] i:after{top:75%}#material-object[data-material=silk]{gap:0;background:repeating-linear-gradient(45deg,#dac49890 0 1px,#e7d7b5 1px 5px);border-radius:8% 3%;transform:skewY(-3deg) rotate(2deg)}#material-object[data-material=silk] i{background:linear-gradient(90deg,#5f49351c,transparent,#f9efd347);border-radius:0}#material-object[data-material=paper]{gap:0;transform:rotate(-2deg);background:#e9d7ae}#material-object[data-material=paper] i{background:linear-gradient(90deg,#d4bd8c,#eddfb8 12%,#e0cca0);border-right:1px solid #90764444;border-radius:0}.compare-layout{display:flex;flex-direction:column;align-items:center;justify-content:space-between;height:calc(100% - 25px);gap:12px}.form-controls{display:flex;gap:18px}.form-controls button{font-size:20px}.form-controls button[aria-pressed=true]{background:#814530;border-color:#d6a26c}#compare-object{display:flex;justify-content:center;align-items:center;perspective:900px;max-width:100%;min-height:130px}#compare-object span{background:linear-gradient(90deg,#bd9f6d,#ead8aa 12%,#d9c392);color:#4b3822;border-right:1px solid #937950;padding:24px 22px;font-size:24px;line-height:1.8;box-shadow:2px 10px 10px #0005;transition:transform .55s,padding .55s;margin:0}#compare-object[data-form=fold] span:nth-child(odd){transform:rotateY(-35deg)}#compare-object[data-form=fold] span:nth-child(even){transform:rotateY(35deg);background:#c7ad7f}#compare-object[data-form=book]{gap:4px}#compare-object[data-form=book] span{transform:rotate(-5deg);padding:24px 14px;border-left:7px solid #755539}#compare-object[data-form=book] span:nth-child(even){transform:rotate(4deg)}#compare-object .is-found,#compare-object.is-found .target-panel{outline:3px solid #ac422e;outline-offset:-6px;background:#f1dcaa}.compare-task{text-align:center}.compare-task p{font-size:18px;margin:8px 0}.compare-task button{font-size:15px}.craft-layout{height:100%;display:grid;grid-template-columns:1fr 1.05fr;gap:7%;align-items:center}.craft-timing{display:flex;align-items:center;gap:20px}.craft-timing strong{font:44px Georgia;color:#e5bc7d;font-variant-numeric:tabular-nums}.craft-timing button{font-size:14px}.craft-guide{border-left:1px solid #c5a66b55;padding-left:32px}.craft-steps{display:grid;grid-template-columns:1fr 1fr;gap:12px}.craft-steps button{font-size:18px}.craft-steps button[aria-pressed=true]{background:#835339}#craft-instruction{font-size:21px;line-height:1.8;min-height:100px;color:#f0dfba}.done-content{padding-top:0}.done-content h2{font-size:34px;margin:8px 0}.lessons{font-size:18px;line-height:1.85;margin:8px 0 10px}.done-content>button{font-size:14px;padding:10px 15px}.done-content>p{margin:8px 0;font-size:14px}#outline-list button{text-align:left;line-height:1.6}#notes-body h3{font-size:18px;margin-bottom:5px}#notes-body p{margin-top:0}.scroll-object{height:calc(100svh - 500px);min-height:240px}.clue-notes{padding:8px 0;min-height:65px}.clue-notes .primary{font-size:15px;padding:11px 16px}.read-tools{height:48px}
@media(min-width:1600px){.mission{height:130px}.stage{height:calc(100svh - 337px)}.scroll-object{height:calc(100svh - 505px)}.lesson-split{gap:10%}.lesson-lead{font-size:26px}.material-display #material-object{height:240px}.material-display>p{font-size:25px}.material-display .reveal-note{font-size:22px}#compare-object span{padding:50px 44px;font-size:32px}#compare-object[data-form=book] span{padding:50px 35px}.compare-task p{font-size:24px}.craft-guide{padding-left:50px}#craft-instruction{font-size:28px}.craft-timing strong{font-size:65px}.done-content{padding-top:30px}.done-content h2{font-size:46px}.lessons{font-size:25px}.done-content>p{font-size:20px}}
@media(max-width:800px){.toolbar{flex-wrap:wrap;justify-content:flex-end;max-width:65%}.toolbar button{font-size:10px;padding:6px}.stage{height:auto;min-height:430px}.lesson-split,.craft-layout{grid-template-columns:1fr}.mystery-object{display:none}.material-layout{grid-template-columns:1fr;gap:12px}.material-choices{flex-direction:row}.material-choices button{font-size:20px;flex:1;padding:10px}.material-choices span{font-size:10px}.lesson-scene{min-height:460px}.lesson-lead{font-size:18px}.form-controls{gap:6px}.form-controls button{font-size:14px;padding:10px}#compare-object span{font-size:17px;padding:16px 9px}#compare-object[data-form=book] span{padding:18px 6px}.craft-guide{border:0;padding:0}.craft-steps button{font-size:15px}#craft-instruction{font-size:18px;min-height:75px}.course-navigation{margin:10px 4vw;height:55px}.course-navigation span{font-size:11px}.course-navigation button{font-size:12px;padding:8px}.mission{height:auto;min-height:125px}}
/* V4: geometric models occupy the existing teaching object area. */
.model-canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab;border-radius:14px;outline-offset:-5px}.model-canvas:active{cursor:grabbing}.model-canvas:focus-visible{outline:2px solid #e0bd7d}.has-model .inspect-object>.closed-scroll{display:none}.has-model .inspect-object{filter:none;height:calc(100% - 42px)}.has-model .inspect-object .model-canvas{position:absolute;inset:0;height:calc(100% - 50px)}.has-model .ribbon,.has-model .wrapper,.has-model .open-control{position:absolute;top:auto;bottom:0;left:50%;transform:translateX(-50%);width:auto;height:auto;min-width:180px;padding:12px 22px;border:1px solid #cda66b;border-radius:2px;background:#683b28;box-shadow:0 5px 15px #0005}.has-model .ribbon:before,.has-model .ribbon:after{display:none}.has-model .ribbon span,.has-model .wrapper span{position:static;transform:none;background:none;padding:0;border:0;font-size:20px}.model-tools{height:36px;display:flex;align-items:center;justify-content:center;gap:18px;font:13px sans-serif;color:#d3bea0}.model-tools button,.compare-model-wrap>button{font-size:13px;padding:7px 12px}.compare-model-wrap{display:none;position:relative;width:100%;height:165px;flex:1;min-height:120px}.has-model .compare-model-wrap{display:block}.compare-model-wrap>button{position:absolute;right:0;bottom:0}.has-model #compare-object{min-height:0;flex-shrink:0}.has-model #compare-object span,.has-model #compare-object[data-form=book] span{font-size:20px;line-height:1.4;padding:5px 20px;transform:none;border-left:0;box-shadow:none}.has-model .compare-layout{gap:7px}.has-model .compare-task p{font-size:17px}.guide-panel{position:fixed;right:25px;top:85px;z-index:40;width:340px;padding:16px 22px;background:#25241bf5;border:1px solid #b49b6d;box-shadow:0 18px 60px #0009;border-radius:4px}.guide-panel img{display:block;width:150px;height:150px;object-fit:contain;margin:0 auto 6px}.guide-panel p{font-size:20px;line-height:1.7;margin:10px 0}.guide-panel small{font:11px sans-serif;color:#c6b89d}.guide-panel>button{position:absolute;right:8px;top:8px;padding:4px 10px}.guide-panel[hidden],.model-canvas[hidden]{display:none!important}body[data-opening=true] #open-scroll{pointer-events:none;opacity:.65}@media(min-width:1600px){.compare-model-wrap{height:300px;min-height:240px}.has-model #compare-object span,.has-model #compare-object[data-form=book] span{font-size:26px;padding:8px 30px}.has-model .compare-task p{font-size:23px}.model-tools{font-size:16px}.guide-panel{width:380px}.guide-panel img{width:190px;height:190px}}@media(max-width:800px){.has-model .inspect-object{height:340px}.guide-panel{width:min(340px,90vw);right:5vw;top:100px}.model-tools{font-size:11px;gap:8px}}
/* Comparison keeps geometry large enough to inspect beside readable excerpts. */
.has-model .compare-layout{display:grid;grid-template-columns:1.15fr 1fr;grid-template-rows:auto auto 1fr;gap:12px 24px;align-items:center}.has-model .form-controls{grid-column:1/-1;justify-content:center}.has-model .compare-model-wrap{grid-column:1;grid-row:2/4;height:100%;min-height:240px}.has-model #compare-object{grid-column:2;grid-row:2;display:grid;grid-template-columns:1fr 1fr;gap:6px;width:100%}.has-model #compare-object span,.has-model #compare-object[data-form=book] span{font-size:24px;padding:7px 12px;transform:none!important}.has-model .compare-task{grid-column:2;grid-row:3;text-align:left}.has-model .compare-task p{font-size:17px;line-height:1.5}.has-model .compare-task .reveal-note{font-size:15px;margin:7px 0}.has-model .inspect-object:before{content:'';position:absolute;width:320px;height:45px;left:calc(50% - 160px);top:65%;background:radial-gradient(ellipse,#09070380,transparent 70%);filter:blur(8px);pointer-events:none}@media(min-width:1600px){.has-model .compare-model-wrap{min-height:400px}.has-model #compare-object span,.has-model #compare-object[data-form=book] span{font-size:30px;padding:15px 24px}.has-model .compare-task p{font-size:24px}.has-model .compare-task .reveal-note{font-size:22px}}@media(max-width:800px){.has-model .compare-layout{display:flex}.has-model .compare-model-wrap{min-height:220px}.has-model #compare-object{display:flex}.has-model #compare-object span{font-size:17px}}
.has-model .compare-layout{grid-template-rows:44px 126px minmax(0,1fr)}.has-model .form-controls button{padding:9px 20px}.has-model #compare-object{height:126px;align-self:start}.has-model #compare-object span,.has-model #compare-object[data-form=book] span{line-height:1.15;padding:3px 12px}.has-model .compare-task{align-self:start}.has-model .compare-task p{font-size:16px;line-height:1.4;margin:5px 0}.has-model .compare-task button{padding:9px 14px}.has-model .compare-task .reveal-note{font-size:15px;line-height:1.4;margin:5px 0}@media(min-width:1600px){.has-model .compare-layout{grid-template-rows:56px 200px minmax(0,1fr)}.has-model #compare-object{height:200px}.has-model #compare-object span,.has-model #compare-object[data-form=book] span{line-height:1.5;padding:8px 24px}.has-model .compare-task p{font-size:23px;line-height:1.6}.has-model .compare-task .reveal-note{font-size:21px;line-height:1.6}}
/* V5 preserves the workshop photograph; only scene objects and teaching layers change. */
.has-model .inspect-object:before{display:none}.lesson-switch{display:flex;justify-content:flex-end;gap:0}.lesson-switch button{font-size:13px;padding:5px 14px;background:#202016ba;border-color:#b1976c66}.lesson-switch button[aria-pressed=true]{background:#8b4934;border-color:#d3ae75}.lesson-panel{height:100%;display:grid;grid-template-columns:.9fr 1.2fr;gap:5%;align-items:center;padding:14px 22px;background:linear-gradient(90deg,#161a1266,#151b13e8 43%,#171c14ea);border-top:1px solid #b49a6750}.lesson-panel[hidden]{display:none!important}.lesson-copy h3{font-size:30px;line-height:1.35;margin:8px 0 12px;color:#f3dfb9;font-weight:500}.lesson-copy p{font-size:19px;line-height:1.65;margin:10px 0;color:#e5d7bd}.lesson-copy #lesson-takeaway{border-left:2px solid #b98152;padding-left:13px;font-size:18px;color:#e8ba7f}.lesson-copy a{font:12px/1.5 sans-serif;color:#cab084;display:block;margin:7px 0}.lesson-copy button{font-size:15px;padding:9px 20px}.lesson-figure{text-align:center;min-width:0}.lesson-figure svg{width:100%;max-height:240px;filter:drop-shadow(0 12px 12px #0005)}.figure-heading{font-size:25px;letter-spacing:4px;color:#e7c795;margin-bottom:22px}.figure-word{font-size:60px;letter-spacing:15px;color:#ebd4aa;line-height:1.4}.figure-caption{font:12px/1.8 sans-serif!important;color:#c1b090!important;margin:12px 0!important}.figure-arrow{font-size:20px;line-height:1.5;color:#dbc499;margin:20px 0}.paper-seams{display:flex;transform:rotate(-5deg);padding:22px 4px;filter:drop-shadow(4px 14px 12px #0005)}.paper-seams i{font:23px/130px serif;background:linear-gradient(90deg,#c2a570,#e6d3a6 15%,#ddc99a);color:#514026;flex:1;border-right:1px dashed #947346}.component-legend{display:grid;grid-template-columns:1fr 1fr;gap:12px;font-size:20px;color:#e2c89b;text-align:left;padding-left:20px}.artifact-date{font:80px Georgia;color:#ebce96}.artifact-date span{font:17px serif;margin-left:10px}.lesson-figure h4{font-size:30px;font-weight:400;margin:16px 0}.artifact-meta{font:20px/1.8 serif;color:#e2cba5}.fold-diagram{display:flex;justify-content:center;perspective:700px;height:145px;margin:35px 15px}.fold-diagram i{width:50px;background:#dcc595;transform:rotateY(-32deg);border-right:1px solid #90774d}.fold-diagram i:nth-child(even){transform:rotateY(32deg);background:#ae9061}.label-illustration{height:230px;position:relative;display:flex;align-items:center;justify-content:center}.label-illustration span{background:#e0c99b;color:#4c3821;padding:22px 20px;font:28px/1.2 serif;writing-mode:vertical-rl;letter-spacing:6px;transform:rotate(-7deg);box-shadow:10px 12px 15px #0006}.label-illustration i{position:absolute;top:12px;left:50%;height:26px;width:2px;background:#a9613f}.shelf-diagram{display:flex;flex-direction:column;gap:8px}.shelf-diagram span{border-bottom:10px solid #6c5037;background:#30291e;padding:20px;font-size:23px;color:#e3c99f}@media(min-width:1600px){.lesson-panel{padding:32px 45px;gap:7%}.lesson-copy h3{font-size:42px;margin:15px 0 25px}.lesson-copy p{font-size:25px;line-height:1.8;margin:18px 0}.lesson-copy #lesson-takeaway{font-size:25px}.lesson-copy a{font-size:15px}.lesson-copy button{font-size:19px;padding:12px 25px}.lesson-figure svg{max-height:350px}.figure-word{font-size:92px}.artifact-date{font-size:125px}.figure-caption{font-size:15px!important}.component-legend{font-size:26px;gap:20px}.figure-heading{font-size:32px}.figure-arrow{font-size:25px}}@media(max-width:800px){.lesson-panel{grid-template-columns:1fr;height:auto;padding:20px}.lesson-figure{display:none}.lesson-copy h3{font-size:27px}.lesson-copy p{font-size:18px}}
.mission h2{line-height:1.25;margin:6px 0}.mission p{font-size:14px;line-height:1.4}@media(min-width:1600px){.mission p{font-size:18px}}

/* V6: 每幕的知识、人物与作品翻阅页；保持背景和游戏不变。 */
.lesson-panel{position:relative}.lesson-panel.has-stories{padding-top:58px}
#lesson-pages{position:absolute;top:10px;left:22px;right:22px;display:flex;gap:9px;border-bottom:1px solid #c3a77744;padding-bottom:8px}#lesson-pages[hidden]{display:none}
#lesson-pages button{font-size:14px;padding:6px 13px;background:transparent;border:0;border-bottom:2px solid transparent;color:#c5b394}#lesson-pages button[aria-pressed=true]{color:#f9dfac;border-bottom-color:#e8b878;background:#b47d3620}
.has-stories .lesson-copy h3{font-size:28px;margin:4px 0 8px}.has-stories .lesson-copy p{font-size:18px;line-height:1.55;margin:8px 0}.has-stories .lesson-copy #lesson-takeaway{font-size:16px;line-height:1.5}.has-stories .lesson-copy a{margin:4px 0}.lesson-copy a[hidden]{display:none}
.story-large{font:38px/1.5 serif;color:#ecd6af;white-space:pre-line}.story-small{font-size:20px;color:#dac5a5;line-height:1.8}.story-letter .story-large,.story-poem .story-large{background:linear-gradient(130deg,#b16b65,#77493d);color:#ffe9c8;border:1px solid #daa493;padding:35px 25px;margin:10px 25px;box-shadow:10px 15px 25px #0005;transform:rotate(-3deg)}.story-poem .story-large{font-size:48px;letter-spacing:10px;line-height:1.6}
.story-steps{list-style:none;padding:0;display:flex;gap:7px;justify-content:center;counter-reset:story;margin:25px 0}.story-steps li{counter-increment:story;flex:1;background:#d9c299;color:#473520;padding:18px 7px;font-size:19px;box-shadow:3px 6px 12px #0004}.story-steps li:before{content:'0' counter(story);display:block;font:12px Georgia;margin-bottom:12px;color:#7c593c}.story-sequence .story-steps{flex-direction:row-reverse}.story-sequence li{writing-mode:vertical-rl;min-height:130px;flex:none;font-size:24px}.story-layers .story-steps{flex-direction:column;transform:skewY(-5deg);gap:12px;margin:30px}.story-layers li:nth-child(1){background:#ac7959}.story-layers li:nth-child(2){background:#ddcaa3}.story-layers li:nth-child(3){background:#8a7557;color:#fff0d3}.story-layers li:before{display:inline;margin-right:20px}
@media(min-width:1600px){.lesson-panel.has-stories{padding-top:90px}#lesson-pages{top:20px;left:45px;right:45px}#lesson-pages button{font-size:20px;padding:10px 20px}.has-stories .lesson-copy h3{font-size:40px;margin-bottom:20px}.has-stories .lesson-copy p{font-size:25px;line-height:1.7;margin:14px 0}.has-stories .lesson-copy #lesson-takeaway{font-size:23px}.story-large{font-size:48px}.story-poem .story-large{font-size:64px}.story-steps li{font-size:25px;padding:25px 12px}}
@media(max-width:800px){#lesson-pages{position:static;flex-wrap:wrap;margin-bottom:15px}.lesson-panel.has-stories{padding:20px}.has-stories .lesson-copy h3{font-size:28px}}
@media(min-width:801px){.mission-meta{position:relative}.mission-meta small{position:absolute;right:calc(100% + 12px);top:52px;white-space:nowrap}.lesson-panel.has-stories{padding-bottom:5px}.has-stories .lesson-copy p{margin:6px 0}.has-stories .lesson-copy h3{line-height:1.25}}
@media(min-width:801px){.lesson-panel.has-stories{grid-template-columns:.8fr 1.3fr;gap:4%}}
