@font-face{font-family:Literata;src:url('/assets/fonts/literata-variable.woff2') format('woff2');font-style:normal;font-weight:200 900;font-display:swap}
@font-face{font-family:Caveat;src:url('/assets/fonts/caveat-variable.woff2') format('woff2');font-style:normal;font-weight:400 700;font-display:swap}
*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none}
body{font-family:Literata,Georgia,serif;color:#354754;background:#ecefe9}
button{font:inherit;-webkit-tap-highlight-color:transparent}
.table{height:100%;height:100dvh;display:grid;place-items:center;overflow:hidden;background:radial-gradient(ellipse at 48% 38%,#fafbf7 0%,#f0f2ed 45%,#e3e8e0 100%);padding:36px}
.scene{--page-w:max(1px,min(calc((var(--fit-width) - 24px)/2.05),calc((var(--fit-height) - 14px)/1.505),calc((var(--fit-height) - 60px)/1.42)));width:calc(var(--page-w)*2);height:calc(var(--page-w)*1.42);position:relative;perspective:max(2400px,calc(var(--page-w)*19));perspective-origin:50% 48%}
.book{width:100%;height:100%;position:relative;transform-style:preserve-3d;touch-action:none;outline:none;transform:translateX(-25%);--paper:#fcfaf5;--cloth:#315473;--board-depth:6px;--left-stack:0px;--right-stack:5px}
.book:focus-visible .corner:not(:disabled)::after{opacity:1;border-color:#a28fb2;border-width:2px}
.binding{position:absolute;top:-7px;height:calc(100% + 14px);width:calc(50% + 8px);background:linear-gradient(90deg,#243e58,#416382 5%,#315473 55%,#233e57);border:1px solid #263e53;border-radius:4px;box-shadow:0 3px 3px #152d4440,0 17px 26px -12px #1d303d60,0 34px 65px -22px #32443845;transform:translateZ(calc(-1*var(--board-depth)));pointer-events:none}
.binding-left{left:-8px;opacity:0}.binding-right{left:50%}
.stack{position:absolute;top:0;height:100%;width:50%;pointer-events:none;transform:translateZ(-2px)}
.stack-left{left:0;opacity:0}.stack-right{right:0}
.sheet-edge{position:absolute;top:calc(var(--sheet-depth)*.35px);bottom:calc(var(--sheet-depth)*-1.25px);width:calc(100% + var(--sheet-depth)*1.15px);background:#f2efe5;border-bottom:1px solid #b7b2a0;box-shadow:0 1px 1px #293d3820}
.stack-right .sheet-edge{left:0;border-right:1px solid #b9b4a3;border-radius:0 3px 3px 0}
.stack-left .sheet-edge{right:0;border-left:1px solid #b9b4a3;border-radius:3px 0 0 3px}
.resting-face{position:absolute;top:0;width:50%;height:100%;transform:translateZ(0);overflow:hidden;border-radius:1px;isolation:isolate}
.resting-left{left:0}.resting-right{right:0}
.resting-face.board-face{overflow:visible}
.resting-face.board-face>.face{position:absolute;top:-7px;width:calc(100% + 8px);height:calc(100% + 14px)}
.resting-left.board-face>.face{left:-8px}
.resting-right.board-face>.face{left:0}
.face{position:relative;width:100%;height:100%;overflow:hidden;container-type:inline-size;user-select:none;-webkit-user-select:none}
.paper{background-color:var(--paper);background-image:var(--paper-grain,none);background-size:256px 256px;color:#354754}
.resting-left .paper{box-shadow:inset -22px 0 22px -24px #2b2a2180,inset -2px 0 2px #aaa48c26}
.resting-right .paper{box-shadow:inset 22px 0 22px -24px #2b2a2180,inset 2px 0 2px #aaa48c26}
.printed{position:absolute;inset:7% 12% 10%;display:flex;flex-direction:column;align-items:center}
.running-head{font-size:clamp(9px,2.5cqw,12px);font-weight:400;letter-spacing:.12em;margin:0 0 9%;color:#839096}
h2{font-weight:450;font-size:clamp(17px,5.6cqw,25px);line-height:1.5;text-align:center;margin:0}
.illustration{width:88%;height:44%;margin:5% 0 6%;flex-shrink:0;color:#668090}
.prose{font-size:clamp(14px,3.7cqw,17px);line-height:1.65;width:100%;text-align:left}
.prose p{margin:0 0 .65em}.folio{position:absolute;bottom:3.8%;left:0;right:0;text-align:center;font-size:clamp(11px,2.8cqw,13px);color:#879394}
.cover{color:#e7eee8;background-color:var(--cloth);background-image:linear-gradient(90deg,#142d4660,transparent 8%,#90aac010 45%,#162e4618 100%),repeating-linear-gradient(0deg,#b4c9d807 0 1px,#14273b07 1px 2px),repeating-linear-gradient(90deg,#bed3e408 0 1px,transparent 1px 3px);border:1px solid #213b54;border-radius:3px;box-shadow:inset 0 0 0 2px #80a1ba18,inset 7px 0 10px -8px #142b48,inset -2px 0 3px #152c4b50}
.cover-border{position:absolute;inset:5% 7%;border:1px solid #afc8d25c;border-radius:2px;box-shadow:inset 0 0 0 4px #315473,inset 0 0 0 5px #8fadb42b}
.cover-copy{position:absolute;top:15%;left:12%;width:76%;text-align:center}
.cover-kicker{margin:0 0 9%;font-size:clamp(9px,2.65cqw,12px);letter-spacing:.12em;color:#b9cdd5}
.cover h1{font-size:clamp(23px,8cqw,36px);line-height:1.45;white-space:nowrap;font-weight:500;margin:0;letter-spacing:-.045em;text-shadow:0 1px 1px #0c273b}
.cover h1 span{font-size:.75em;font-style:italic;font-weight:400;padding:0 .1em}
.cover-subtitle{font-size:clamp(14px,4.2cqw,19px);font-weight:350;letter-spacing:.01em;margin:.8em 0 0;color:#d3dee1}
.cover-emblem{position:absolute;left:20%;top:40%;width:60%;height:34%;color:#bdd0d8}
.cover-emblem path[fill="#d3d0ec"]{fill:#bdc6df;opacity:.85}
.cover-emblem path[fill="#dad0e8"]{fill:#bacacb;opacity:.8}
.cover-trail{position:absolute;top:79%;width:100%;text-align:center;color:#aac2cc;font-size:19px}
.cover-language{position:absolute;bottom:8%;left:0;right:0;margin:0;text-align:center;font-size:clamp(10px,2.8cqw,13px);color:#bbced2;letter-spacing:.08em}
.back-cover .cover-emblem{top:18%;height:31%}.back-copy{position:absolute;top:55%;width:100%;padding:0 15%;text-align:center;font-size:clamp(15px,4.3cqw,20px);line-height:1.7;font-weight:350}
.endpaper{background:#dce5dd;border:7px solid var(--cloth);border-radius:3px;box-shadow:inset 0 0 0 1px #b6c2b8,inset 0 0 0 8px #cbd7cf,inset 0 0 0 9px #b9c8bf55}
.endpaper-pattern{position:absolute;inset:3%;opacity:.32;background-image:radial-gradient(ellipse at center,#91a99b 0 1px,transparent 1.5px);background-size:21px 29px}
.bookplate{position:absolute;left:18%;top:31%;width:64%;padding:11% 6%;text-align:center;background:#fcfaf5;border:1px solid #9daea34f;box-shadow:1px 2px 2px #748e7720;color:#6b8077;transform:rotate(-2deg)}
.bookplate p{font-size:clamp(11px,3cqw,14px);margin:0}.bookplate p.owner{font-size:clamp(27px,8cqw,38px);font-style:italic;color:#456252;margin:.45em 0}.bookplate span{color:#a9b8ac}
.end-mark{position:absolute;top:47%;width:100%;text-align:center;font-size:28px;color:#8fa696}
.poem-card{left:10%;top:16%;width:80%;padding:5% 4% 6%}
.bookplate .poem-credit{font-size:clamp(10px,2.6cqw,12px)}
.bookplate .poem-author{font-size:clamp(17px,5cqw,23px);font-style:italic;color:#456252;margin:.2em 0 .9em}
.poem-lines p{font-size:clamp(14px,4.4cqw,19px);line-height:1.6;color:#456252;white-space:nowrap}
.poem-doodles{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.opening-page .printed{inset:6% 10% 8%}
.opening-page .running-head{margin-bottom:3%}
.opening-page .illustration{width:100%;height:28%;margin:2% 0 4%}
.opening-page .prose{font-size:clamp(14px,3.8cqw,52px);line-height:1.5}
.opening-page .prose p{margin-bottom:.55em}
.gutter{position:absolute;left:calc(50% - 14px);top:0;width:28px;height:100%;pointer-events:none;background:linear-gradient(90deg,transparent,#45493d10 36%,#40483b22 49%,#26332230 50%,#61634b14 54%,transparent);opacity:0;transform:translateZ(1px)}
.strip-content{position:absolute;top:0;height:100%;pointer-events:none}
.paper-canvas{position:absolute;pointer-events:none;visibility:hidden;z-index:5}
.rest-paper-canvas{position:absolute;pointer-events:none;visibility:hidden;z-index:1;transform:translateZ(.05px)}
.paper-live-text>.face{opacity:0}
.texture-measure{position:fixed;left:-10000px;top:0;opacity:0;pointer-events:none;--paper:#fcfaf5;--cloth:#315473;font-family:Literata,Georgia,serif}
.cast-shadow{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;opacity:0;fill:#22382d;transform:translateZ(1px);z-index:2}
.corner{position:absolute;bottom:0;width:max(48px,12%);height:19%;padding:0;border:0;background:none;cursor:grab;z-index:6;touch-action:none;color:#6b7e79}
.corner-left{left:0}.corner-right{right:0}.corner:disabled{pointer-events:none;visibility:hidden}.corner::after{content:'';position:absolute;bottom:8px;width:20px;height:20px;border-bottom:1px solid currentColor;opacity:.4;transition:opacity .15s}
.corner-right::after{right:9px;border-right:1px solid currentColor;border-radius:0 0 3px 0}.corner-left::after{left:9px;border-left:1px solid currentColor;border-radius:0 0 0 3px}
.corner:hover::after,.corner:focus-visible::after{opacity:.85}.corner:focus-visible{outline:2px solid #a28fb2;outline-offset:-6px;border-radius:4px}
.book[data-position="front"] .corner-right,.book[data-position="back"] .corner-left{color:#cfdfdf}
.book[data-turning="true"] .corner::after{visibility:hidden}
.sr-only{position:absolute;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){.table{padding:24px}.printed{inset:7% 10% 10%}.prose{line-height:1.5}.running-head{margin-bottom:7%}.illustration{height:42%;margin:5% 0}}
@media(max-width:600px){.table{padding:16px}.running-head{display:none}h2{font-size:14px}.prose{font-size:10px;line-height:1.45}.cover h1{font-size:5.9cqw}.cover-kicker{font-size:7px}.cover-subtitle{font-size:10px}.illustration{height:38%}.cover-language{font-size:8px}.bookplate p{font-size:8px}.bookplate p.owner{font-size:20px}.back-copy{font-size:12px}}
@media(prefers-reduced-motion:reduce){.corner::after{transition:none}}
@media(max-width:600px){.poem-lines p{font-size:4.2cqw}.bookplate .poem-author{font-size:5cqw}.bookplate .poem-credit{font-size:2.6cqw}.opening-page .prose{font-size:3.8cqw}.opening-page h2{font-size:5.2cqw}}

/* Identical print rectangles and type across all three editions. Natural
   paragraph wrapping only; artwork never floats into or around the prose. */
.story-heading{position:absolute;left:10%;top:5%;width:80%;height:10%}
.table{overflow:clip}
.story-heading .running-head{margin:0 0 2%;text-align:center;font-size:2.7cqw;letter-spacing:.07em}
.story-heading h2{font-size:5.2cqw;line-height:1.45;font-weight:450}
.story-prose{position:absolute;left:10%;top:15%;width:80%;height:38%;font-size:clamp(14px,3.8cqw,52px);line-height:1.5;overflow:visible}
.story-prose p{margin:0 0 .4em}
.story-prose p:last-child{margin:0}
.story-art{position:absolute;left:2%;top:54%;width:96%;height:42%}
.story-art img{width:100%;height:100%;display:block;object-fit:contain}
.story-ink{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:hidden}
.story-watcher{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:hidden}
/* Captures and held leaves keep a centred gaze. Only resting paper scans. */
.watcher-pupil{transform:translate(0,0)}
.book[data-turning="false"] .paper-live-text>.story-page:has(.story-watcher){opacity:1}
.book[data-turning="false"] .resting-face:has(.story-watcher){z-index:3;transform:translateZ(2px)}
.book[data-turning="false"] .resting-face .watcher-pupil{animation:watcher-scan 8s ease-in-out infinite}
@keyframes watcher-scan{0%,12%,100%{transform:translate(0,0)}25%,38%{transform:translate(calc(-1 * var(--watcher-x)),calc(-1 * var(--watcher-y)))}54%,68%{transform:translate(var(--watcher-x),0)}82%,89%{transform:translate(0,var(--watcher-y))}}
@media(prefers-reduced-motion:reduce){.book[data-turning="false"] .resting-face .watcher-pupil{animation:none;transform:translate(0,0)}}
/* These three passages use the full measured print area in the smallest
   portrait edition. Give their prose room without shrinking reading type. */
.story-page:is([data-face="8"],[data-face="10"],[data-face="20"]) .story-prose{height:41%}
.story-page:is([data-face="8"],[data-face="10"],[data-face="20"]) .story-art{top:57%;height:39%}
.certificate-paper{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.certificate{position:absolute;left:12%;top:12%;width:76%;height:70%;text-align:center;font-size:clamp(14px,3.6cqw,17px);line-height:1.5}
.certificate-heading{font-size:clamp(14px,4cqw,18px);color:#68736d;letter-spacing:.035em;margin:0 0 5%;font-style:italic}
.certificate h2{font-size:5.2cqw;line-height:1.45;margin:0 0 6%;font-weight:450}
.certificate>p:not(.certificate-heading){margin:0 0 4%}
.certificate-felix{font-style:italic;color:#606b64}
.signatures{display:grid;grid-template-columns:repeat(4,minmax(max-content,1fr));gap:2%;margin-top:7%;margin-left:-4%;width:108%}
.signature p{margin:0 0 6%;font-style:italic;font-size:clamp(14px,3.2cqw,15px);color:#59615c;white-space:nowrap}
.animal-mark{width:14cqw;height:14cqw;color:#77766f;display:block;margin:0 auto}
@media(max-width:900px){.certificate{top:10%;height:73%;width:80%;left:10%}.certificate-heading{margin-bottom:3%}.certificate h2{margin-bottom:5%}.certificate>p:not(.certificate-heading){margin-bottom:3%}.signatures{grid-template-columns:repeat(2,minmax(0,1fr));gap:3% 10%;margin:5% 0 0;width:100%}.signature p{margin-bottom:2%}.animal-mark{width:13cqw;height:13cqw}}
.language-toggle{position:absolute;left:calc(75% - 72px);bottom:6.5%;width:144px;height:44px;border:0;background:transparent;padding:0;color:#bbced2;letter-spacing:.08em;font-size:clamp(10px,2.8cqw,13px);z-index:6;cursor:pointer;touch-action:manipulation}
.language-toggle[hidden]{display:none}
.language-toggle:hover{color:#edf2ee}
.language-toggle:focus-visible{outline:2px solid #c1b6d4;outline-offset:-4px;border-radius:4px}
.cover h1{white-space:normal;font-size:7.4cqw;line-height:1.45}
.cover-subtitle{line-height:1.5}
@media(max-width:600px){.story-heading .running-head{display:block}.language-toggle{font-size:8px}}

.poem-page{background-color:#fcfaf5;background-image:var(--paper-grain,none);background-size:256px 256px;border:0;border-radius:1px;box-shadow:none}
.poem-page .endpaper-pattern{display:none}
.poem-card{left:15%;top:18%;width:70%;height:68%;padding:8% 4% 4%;background:transparent;border:0;box-shadow:none;transform:rotate(-3deg)}
.poem-lines p{font-size:4.15cqw;line-height:1.65;color:#354754}
.poem-card .poem-credit{margin:1.8em 0 .25em;padding:0;border:0;font-size:3.25cqw;line-height:1.5;font-style:italic;color:#60635d}
.poem-card .poem-author{margin:0;font-size:4cqw;line-height:1.5;font-weight:400;color:#4c514d}
.story-page[data-face="1"] .story-prose{height:38%}
.story-page[data-face="1"] .story-art{left:2%;top:54%;width:96%;height:42%}

/* Story objects remain live paper at rest; their identical captured ink travels
   on the physical leaf. An opaque paper face hides its underlying texture. */
.book[data-turning="false"] .paper-live-text>.challenge-page{opacity:1;transform:translateZ(2px)}
.book[data-turning="false"] .resting-face.live-challenge{z-index:3;transform:translateZ(2px)}
.book[data-turning="true"] .challenge-page{visibility:hidden;pointer-events:none}
.challenge{position:absolute;inset:5.5% 7% 8%;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:7px;font-size:14px;line-height:1.35;touch-action:none}
.challenge h2{font-size:clamp(16px,4.6cqw,22px);line-height:1.4;margin:0 0 5px;font-weight:450}
.challenge p{font-size:14px;line-height:1.35;margin:0}
.challenge-prompt{text-align:center}
.challenge-object{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:0;position:relative}
.challenge-object>.object-drawing{width:100%;height:100%;min-height:0;flex:1}
.challenge:is([data-challenge="mirror"],[data-challenge="escape"]){grid-template-columns:minmax(0,1fr)}
.challenge:is([data-challenge="mirror"],[data-challenge="escape"]) .challenge-object{min-width:0}
.readable-blotter{position:relative;width:100%;padding:9px 4px;flex:0 0 auto}
.blotter-paper{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.readable-labels{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}
.reflected-label{padding:2px!important;min-width:0!important;position:relative}
.label-notebook{width:100%;height:auto;max-height:108px}.reflected-address{display:block;font-size:14px;line-height:1.35;margin:4px 2px 0}.reflected-label.chosen .reflected-address{color:#3f7f6d}
.reflected-label.chosen .label-notebook{stroke:#548b79;stroke-width:1.7}
.challenge[data-challenge="escape"] .challenge-object{container-type:size}
.inside-latch{position:relative;width:min(100%,100cqh,340px);height:auto;aspect-ratio:1;flex:0 0 auto;min-height:0;touch-action:none;container-type:size}
.latch-wood{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.challenge .latch-piece{position:absolute;min-width:44px;min-height:44px;padding:0;border-radius:0;z-index:1}
.latch-piece-art{position:absolute;left:0;top:0;width:calc(var(--latch-width)*100cqw);height:calc(var(--latch-height)*100cqh);pointer-events:none}
.latch-piece.chosen:not(.latch-rat) .latch-piece-art{stroke:#4e887b;stroke-width:2}
.mouse-selection{opacity:0}.latch-rat.chosen .mouse-selection{opacity:1}
.latch-piece.puzzle-dragging{z-index:5;opacity:.8}
.object-drawing{display:block;overflow:visible}
.symbol-drawing{width:34px;height:34px;display:inline-block;flex-shrink:0;vertical-align:middle}
.challenge button{font-family:Literata,Georgia,serif;font-size:14px;line-height:1.25;color:#526e73;min-height:44px;min-width:44px;padding:4px;border:0;background:transparent;border-radius:5px;cursor:pointer;touch-action:none;-webkit-tap-highlight-color:transparent}
.challenge button:disabled{cursor:default;color:#87938a;opacity:.7}
.challenge button:focus,.challenge [role="button"]:focus{outline:none}
.challenge button:focus-visible,.folded-welcome button:focus-visible{outline:2px solid #547f8a;outline-offset:2px}
.challenge [role="button"]:focus-visible{outline:none}
.ring-focus{stroke:#547f8a;stroke-width:2;opacity:0;pointer-events:none}
.ring-piece:focus-visible .ring-focus{opacity:1}
.ring-piece:hover .ring-turn-cue{opacity:1;stroke:#547f8a}
.challenge [data-point]:focus-visible>circle:first-child{stroke:#547f8a;stroke-width:2}
.challenge [data-point]:hover>circle:nth-child(2){stroke:#547f8a;stroke-width:2}
.book[data-puzzle-input="pointer"] .challenge button:focus-visible{outline:none}
.book[data-puzzle-input="pointer"] .ring-piece:focus-visible .ring-focus{opacity:0}
.book[data-puzzle-input="pointer"] .challenge [data-point]:focus-visible>circle:first-child{stroke:none}
.challenge [role="button"]{cursor:pointer;touch-action:none;-webkit-tap-highlight-color:transparent}
.sketch-button{box-shadow:none;background:transparent!important}
.challenge-footer{display:grid;grid-template-columns:44px minmax(0,1fr);gap:8px;align-items:center;min-height:44px}
.challenge-result{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:4px 7px;text-align:center;min-width:0}
.challenge-note{font-size:14px;line-height:1.35;color:#526e73}
.solved-mark{width:26px;height:26px;stroke:#437765;stroke-width:2.5;flex-shrink:0}
.solved-label{font-size:14px;color:#437765}
.challenge[data-complete="true"] .challenge-note{color:#437765;flex-basis:100%}
.puzzle-reset{width:44px;height:44px;padding:2px!important;align-self:center;box-shadow:none}
.reset-drawing{width:32px;height:32px;margin:auto;stroke:#628891;stroke-width:1.6}
.puzzle-reset:hover .reset-drawing{stroke:#365f69}
.challenge[data-complete="true"] .stairs-grid,.challenge[data-complete="true"] .tile-grid{filter:drop-shadow(0 0 3px #b7dacc55)}
.challenge-glimmer .object-drawing,.challenge-glimmer .route-map{animation:pencil-glimmer 1.25s ease-out}
@keyframes pencil-glimmer{from{filter:drop-shadow(0 0 4px #acd1cf)}to{filter:none}}
.puzzle-celebration{position:absolute;inset:20% 13% 16%;pointer-events:none;z-index:5;display:grid;place-items:center;animation:reward-fade 1.2s ease-out forwards}
.puzzle-celebration svg{width:100%;height:100%;max-height:320px;filter:drop-shadow(0 0 4px #fffdf8)}
.reward-loop,.reward-check{stroke-dasharray:1;stroke-dashoffset:1;animation:reward-ink .5s ease-out forwards}
.reward-check{animation-delay:.1s}
.reward-spark{transform-box:fill-box;transform-origin:center;animation:reward-spark .8s ease-out var(--spark-delay) both}
@keyframes reward-ink{to{stroke-dashoffset:0}}
@keyframes reward-spark{0%{opacity:0;transform:scale(.3)}35%{opacity:1;transform:scale(1.1)}100%{opacity:0;transform:scale(.8)}}
@keyframes reward-fade{0%{opacity:0}15%,65%{opacity:1}100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.challenge-glimmer .object-drawing,.challenge-glimmer .route-map{animation:none}.puzzle-celebration{display:none}}
.route-clue{color:#69756b;text-align:center}
.route-map{width:100%;height:100%;min-height:0;flex:1;overflow:visible}
.route-map text{pointer-events:none}
.route-journey{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:4px 8px;width:100%;min-height:24px;flex-shrink:0}
.route-journey .return-drawing{display:block;width:36px;height:36px}
.challenge [data-corridor]:focus-visible .corridor-focus{stroke:#547f8a;stroke-width:2}
.book[data-puzzle-input="pointer"] .challenge [data-corridor]:focus-visible .corridor-focus{stroke:none}
.route-duration{margin-left:auto;color:#508679;white-space:nowrap}
.challenge [data-junction]:focus-visible .junction-focus{opacity:1}
.book[data-puzzle-input="pointer"] .challenge [data-junction]:focus-visible .junction-focus{opacity:0}
.challenge [data-junction]:hover>circle:nth-child(3){stroke:#548d84;stroke-width:2}
.balance-clues{position:relative;width:100%;display:grid;grid-template-columns:1fr 1fr;gap:6px;min-height:72px;height:72px}
.balance-study{width:100%;display:grid;gap:3px}
.balance-evidence{height:clamp(58px,15cqw,74px);position:relative}
.study-scale{width:100%;height:100%}
.weight-labels{width:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.weight-label{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:58px!important}
.weight-label .symbol-drawing{width:30px;height:30px}
.weight-tickets{width:100%;display:flex;align-items:center;justify-content:center;gap:4px}
.weight-ticket{position:relative;width:48px;flex:0 0 48px;padding:3px!important}
.weight-ticket.chosen{color:#3e8679;text-decoration:underline;text-underline-offset:5px}
.derived-weights{display:flex;justify-content:center;gap:14px;width:100%}
.derived-weights>span{display:flex;align-items:center;gap:2px}
.derived-weights .symbol-drawing{width:27px;height:27px}
.balance-clues>div{position:relative;min-width:0}
.reference-scale{width:100%;height:100%}
.reference-weight{position:absolute;left:79.5%;top:44%;transform:translateX(-50%);font-size:14px}
.balance-clues.demonstrated{min-height:35px}
.balance-clues .symbol-drawing{width:30px;height:30px}
.balance-clues .sharing-counters{position:absolute;right:0;top:0;width:54px;height:60px}
.brew-tray{width:100%;min-height:64px;display:flex;align-items:center;justify-content:center;gap:4px;padding:1px}
.packet{width:48px;height:64px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1px!important;flex-shrink:0}
.packet-drawing{width:42px;height:49px;flex-shrink:0}
.packet span{font-size:14px;line-height:1}
.chosen{background:transparent!important;box-shadow:none}
.chosen .packet-drawing,.chosen .tile-drawing{transform:translateY(-3px);filter:drop-shadow(0 2px 2px #82b3a755)}
.puzzle-dragging{position:relative;z-index:8;pointer-events:none!important;filter:drop-shadow(1px 3px 3px #648b8940)}
.drop-ready{background:transparent!important;box-shadow:none}
.drop-ready>.pan-drawing,.drop-ready .pan-drawing,.drop-ready>.tile-drawing,.drop-ready .notebook-drawing{filter:drop-shadow(0 0 3px #82b3a777)}
.brew-pan.drop-ready .pan-drawing{filter:drop-shadow(0 0 3px #82b3a777)}
.brew-pan{width:100%;max-width:300px;min-height:130px;height:130px;position:relative}
.pan-target{width:100%;height:130px;position:absolute;inset:0;padding:0!important}
.pan-drawing{width:100%;height:100%}
.pan-weight{position:absolute;left:79.5%;transform:translateX(-50%);font-size:14px}
.pan-packets{position:absolute;left:-2%;display:flex;flex-wrap:wrap;justify-content:center;gap:0;width:132px;pointer-events:none}
.pan-packets .packet{width:44px;height:44px;min-width:44px;pointer-events:auto}
.pan-packets .packet-drawing{width:32px;height:40px}
.polish-tin{width:74px;height:30px;flex-shrink:0}
.bowl-drawing{width:44px;height:30px;display:inline-block;vertical-align:middle;margin-right:5px}
.stairs-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:0;width:min(100% - 48px,328px);aspect-ratio:3/2;min-height:140px;position:relative}
.stairs-backplate{position:absolute;inset:-4px;width:calc(100% + 8px);height:calc(100% + 8px);pointer-events:none}
.stairs-bridges{position:absolute;top:0;left:-7.333333%;width:114.666667%;height:100%;pointer-events:none}
.stair-section{position:relative;display:block;padding:1px!important;min-height:65px!important}
.stair-section .object-drawing{width:100%;height:100%;max-height:120px}
.stair-section span{display:none}
.stairs-entrance{align-self:flex-start}.stairs-exit{align-self:flex-end}
.handle-drawing{width:74px;height:38px;vertical-align:middle;display:inline-block;margin-right:6px}
.stair-handle{align-self:flex-start}
.challenge-footer.with-pencil{grid-template-columns:44px 44px minmax(0,1fr)}
.with-pencil .puzzle-reset{grid-column:1;grid-row:1}
.with-pencil .puzzle-pencil{grid-column:2;grid-row:1}
.with-pencil .challenge-result{grid-column:3;grid-row:1}
.challenge[data-complete="true"] .with-pencil .challenge-result{flex-wrap:nowrap}
.challenge[data-complete="true"] .with-pencil .challenge-note{flex-basis:auto}
.puzzle-pencil{width:44px;height:44px;padding:0!important}
.pencil-drawing{width:40px;height:40px}
.lock-rules{width:100%;text-align:center;display:grid;gap:4px}
.tile-grid{width:min(100%,240px);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(3,minmax(44px,1fr));gap:1px;max-height:225px;min-height:143px;flex:1;position:relative;padding:3px}
.lock-backplate{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.tile-slot,.fixed-tile{position:relative;min-height:44px;min-width:44px;padding:0!important}
.tile-drawing{width:100%;height:100%;display:block;max-height:73px}
.tile-slot>span,.fixed-tile>span{display:none}
.tile-tray{display:flex;align-items:center;justify-content:center;gap:4px;width:100%;min-height:47px}
.tile-candidate{width:48px;height:48px;padding:0!important}
.tile-return{flex:0 0 44px;width:44px;height:44px;padding:0!important;min-width:44px!important}
.tile-return .return-drawing{display:block;width:44px;height:44px}
.folded-welcome{position:absolute;left:12%;top:22%;width:76%;height:56%;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:12px}
.folded-welcome .object-drawing{width:100%;height:100%;min-height:0}
.folded-welcome button{font:inherit;font-size:14px;line-height:1.3;min-height:44px;border:0;background:transparent;color:#58685f;cursor:pointer;padding:5px 14px;box-shadow:inset 0 -1px #a3afa566}

/* Parent-selected midnight cloth; reading paper keeps its light pencil tone. */
.book,.texture-measure{--cloth:#18273d;--cover-language-y:96.484375%}
.binding{background:linear-gradient(90deg,#142237,#24374f 5%,#18273d 55%,#142237);border-color:#101e32;box-shadow:0 3px 3px #14223740,0 17px 26px -12px #14223760,0 34px 65px -22px #24374f45}
.cover{color:#dfe8ec;background:var(--cloth);background-image:linear-gradient(90deg,#0f1b3026,transparent 7%,#0f1b3008);border-color:#182a40;box-shadow:inset 5px 0 10px -8px #0b1528,inset -2px 0 3px #0b152840}
.cover-art{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none}
.cover-copy{top:14%;left:10%;width:80%}
.cover h1{font-weight:500;font-size:7.4cqw;line-height:1.45;letter-spacing:-.045em;text-shadow:none;color:#e2e8e7}
.cover-subtitle{font-size:clamp(14px,4cqw,18px);line-height:1.5;margin:.5em 0 0;color:#b8c9cf}
.back-copy{top:19%;left:13%;width:74%;padding:0;color:#c4d2d6;font-size:clamp(14px,4.1cqw,19px);line-height:1.65}
.cover-language{bottom:15%;font-size:clamp(14px,3.6cqw,16px);color:#b8c9cf;letter-spacing:0}
/* The word is printed on the board, so it travels with all other cover ink.
   Only the transparent hit area/focus outline lives above the resting canvas.
   Match the board's 8px horizontal / 7px vertical overhang at the footer. */
.cover-language-word{position:absolute;top:var(--cover-language-y);left:50%;width:92px;height:44px;margin:0;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;font-size:12px;line-height:20px;font-style:italic;color:#b8c9cf;z-index:2}
.language-toggle{left:calc(75% + 4px);top:calc(var(--cover-language-y) + 5.58px);bottom:auto;width:92px;height:44px;color:transparent;background:transparent;border:0;border-radius:0;transform:translate(-50%,-50%) translateZ(3px);letter-spacing:0;font-size:12px;font-style:italic;box-shadow:none;display:flex;align-items:center;justify-content:center}
.language-toggle:hover{color:transparent;background:transparent}
.language-toggle:focus-visible{outline:2px solid #b8c9cf;outline-offset:-3px}
.corner{transform:translateZ(3px)}
.book[data-position="front"] .corner-right,.book[data-position="back"] .corner-left{color:#b8c9cf}
.cover-copy,.back-copy,.cover-language{z-index:2}
.cover-art{z-index:0}
/* Fitted safe rectangle includes browser/installed-app insets. */
.table{--fit-width:calc(100vw - max(16px,calc(env(safe-area-inset-left) + 6px)) - max(16px,calc(env(safe-area-inset-right) + 6px)));--fit-height:calc(100dvh - max(16px,calc(env(safe-area-inset-top) + 6px)) - max(16px,calc(env(safe-area-inset-bottom) + 6px)));padding:max(16px,calc(env(safe-area-inset-top) + 6px)) max(16px,calc(env(safe-area-inset-right) + 6px)) max(16px,calc(env(safe-area-inset-bottom) + 6px)) max(16px,calc(env(safe-area-inset-left) + 6px))}
.cover-fullscreen-ink{position:absolute;left:85%;top:18%;width:16px;height:16px;transform:translate(-50%,-50%);fill:none;stroke:#b8c9cf;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round;pointer-events:none;z-index:2}
.fullscreen-toggle{position:absolute;left:calc(92.5% + 6.8px);top:calc(18% - 4.48px);width:44px;height:44px;transform:translate(-50%,-50%) translateZ(3px);padding:0;border:0;background:transparent;color:transparent;z-index:6;cursor:pointer;touch-action:manipulation}
.fullscreen-toggle svg{visibility:hidden}
.fullscreen-toggle[hidden]{display:none}
.fullscreen-toggle:focus-visible{outline:2px solid #b8c9cf;outline-offset:-3px}

/* Personal sheets on matching map endpapers. Narrative type stays Literata. */
.letter-endpaper{background:#e2e8e9;border:7px solid var(--cloth);border-radius:2px;box-shadow:inset 0 0 0 1px #aab9be;background-image:none}
.endpaper-map{position:absolute;inset:0;width:100%;height:100%;color:#8d9fa7;pointer-events:none}
.letter-endpaper .poem-doodles,.letter-endpaper .certificate-paper{z-index:1}
.letter-endpaper .poem-card,.letter-endpaper .certificate{z-index:2;font-family:Caveat, cursive;font-weight:500;font-style:normal}
.letter-endpaper .poem-card{top:18%;padding-top:5%}
.letter-endpaper .poem-lines p{font-size:5.95cqw;line-height:1.14;color:#405663}
.letter-endpaper .poem-divider{display:block;width:65%;height:3px;margin:4px auto 2px;opacity:.7}
.letter-endpaper .poem-credit{font-size:4.8cqw;line-height:1.2;margin:0 0 1px;font-style:normal;color:#647982}
.letter-endpaper .poem-author{font-size:6cqw;line-height:1.2;margin:0;color:#405663}
.letter-endpaper .poem-date{font-size:clamp(14px,4.1cqw,18px);line-height:1.2;margin:2px 0 0;color:#647982}
/* A quiet map-paper slip tucked into the head of the front endpaper.
   The small visible paper and the tablet-sized transparent target are separate. */
.book-bookmark{position:absolute;left:41%;top:-30px;width:48px;height:48px;margin-left:-24px;padding:0;border:0;background:transparent;z-index:7;cursor:pointer;touch-action:none;transform:translateZ(3px);-webkit-tap-highlight-color:transparent}
.bookmark-paper{position:absolute;left:17.5px;top:8px;width:13px;height:34px;background:linear-gradient(90deg,#b96954,#cc8068 35%,#bd6c56);clip-path:polygon(2% 1%,95% 0,100% 96%,56% 100%,0 97%);box-shadow:1px 1px 2px #20344a26;transform:rotate(-3deg);transform-origin:50% 19px;pointer-events:none}
.bookmark-paper svg{width:100%;height:100%;fill:none;stroke:#f0d4b9;stroke-width:.65;stroke-dasharray:1.3 2.6;opacity:.7}
.book-bookmark[data-exposed="tip"] .bookmark-paper{clip-path:polygon(2% 1%,95% 0,100% 44%,0 44%)}
.book-bookmark:focus-visible{outline:1px solid #b96954;outline-offset:-6px;border-radius:2px}
.book-bookmark:disabled{cursor:default}
.book-bookmark[hidden]{display:none}
.certificate-endpaper .certificate-paper{inset:2% 1%;width:98%;height:96%}
.certificate-endpaper .certificate{left:12%;top:13%;width:76%;height:75%;font-size:5.55cqw;line-height:1.18;color:#405663}
.certificate-endpaper .certificate-heading{font-size:6.2cqw;line-height:1.2;font-style:normal;font-weight:500;color:#647982;letter-spacing:0;margin:0 0 14px}
.certificate-endpaper .certificate h2{font-family:Caveat,cursive;font-size:7.2cqw;line-height:1.15;font-weight:600;margin:0 0 15px}
.certificate-endpaper .certificate>p:not(.certificate-heading){margin:0 0 9px}
.certificate-endpaper .certificate-felix{font-style:normal;color:#647982}
.certificate-endpaper .signatures{grid-template-columns:repeat(4,minmax(0,1fr));gap:2%;margin:22px -3% 0;width:106%}
.certificate-endpaper .signature p{font-size:5.1cqw;line-height:1.2;font-style:normal;font-weight:600;white-space:nowrap;margin:0 0 8px;color:#647982}
.certificate-endpaper[lang="uz"] .signature p{font-size:clamp(14px,4cqw,23px)}
.certificate-endpaper .animal-mark{width:12cqw;height:12cqw;color:#7e8580}
.certificate-endpaper .certificate .certificate-motto{font-size:7.1cqw;line-height:1.2;font-weight:600;margin:26px 0 0;color:#526c7c}
.certificate-endpaper .folded-welcome{z-index:2}
.certificate-endpaper .folded-welcome button{font-family:Caveat,cursive;font-size:6cqw;line-height:1.2;box-shadow:none}
.certificate-fold{position:absolute;z-index:2;left:12%;width:76%;bottom:1%;text-align:center}
.certificate-fold button{min-height:44px;padding:4px 14px;border:0;background:transparent;color:#586f79;font-family:Caveat,cursive;font-size:5.5cqw;line-height:1.2;cursor:pointer}
.certificate-fold button:focus-visible{outline:2px solid #547f8a;outline-offset:2px}
.story-page[data-face="20"] .story-heading{top:8%}
.story-page[data-face="20"] .story-prose{top:17%;height:18%}
.story-page[data-face="20"] .story-art{top:37%;height:53%}

/* The longer sequence uses intrinsic prose height at the original reading
   size. Both resting DOM and moving ink measure this same layout. */
.story-page.story-sequence-page .story-layout{position:absolute;inset:5% 0 5%;display:grid;grid-template-rows:auto minmax(0,1fr);row-gap:3.333333%}
.story-page.story-sequence-page .story-prose{position:static;left:auto;top:auto;width:80%;height:auto;margin:0 auto;font-size:clamp(14px,3.8cqw,52px);line-height:1.5}
.story-page.story-sequence-page .story-art{position:relative;left:auto;top:auto;width:96%;height:100%;min-height:0;margin:0 auto}

/* The escape payoff keeps its whole scene readable under longer translations. */
.story-page.story-sequence-page[data-face="30"] .story-prose{width:86%}

/* Solved ink stays vivid; only reset remains interactive. */
.challenge[data-complete="true"] .challenge-object [data-action]{pointer-events:none;cursor:default}
.challenge[data-complete="true"] .challenge-object button:disabled{opacity:1;color:inherit}
