/* Hinged pop-up book. Page and paper figures share one CSS 3D coordinate space. */
.paper-story{padding:50px 0 56px;background:linear-gradient(160deg,#f7f3f8,#f3eee8 54%,#eee7f2);border-block:1px solid #e7dfeb;isolation:isolate;overflow:hidden;scroll-margin-top:24px;color:#49394f}
.paper-heading{text-align:center}.paper-heading .eyebrow{color:#927c9c;font:9px/1.8 var(--sans);letter-spacing:.22em;display:block;margin-bottom:13px}.paper-heading h2{font:600 clamp(29px,4vw,42px)/1.6 var(--serif);letter-spacing:-.05em;color:#584162}.paper-heading>p{font:12px/1.9 var(--body);color:#8a7b8d;margin-top:10px}.paper-mobile-break{display:none}
.paper-theatre{max-width:890px;margin:0 auto;--book-ease:cubic-bezier(.4,0,.2,1)}
.paper-stage{height:400px;position:relative;perspective:2600px;perspective-origin:50% 42%;margin-top:8px;isolation:isolate}
.paper-halo{position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 48% 57%,#cbb8d65c,transparent 65%)}
/* Do not add filter, opacity, overflow clipping or containment to these two 3D parents. */
.paper-book{position:absolute;width:86%;height:120%;left:7%;bottom:7%;transform-style:preserve-3d;transform-origin:50% 100%;transform:rotateX(72deg);filter:none}
.paper-leaf{position:absolute;width:50%;height:100%;top:0;transform-style:preserve-3d}
.paper-left{left:0;transform-origin:100% 50%;transform:rotateY(0deg)}.paper-right{left:50%;transform-origin:0 50%}
.paper-front{position:absolute;inset:0;background:linear-gradient(100deg,#ede3d5,#fbf7ee 82%,#d6c6b5);border:1px solid #d1c0ad;border-radius:5px 0 0 5px;backface-visibility:hidden;box-shadow:0 3px 0 #d7c7b3,0 6px 0 #f2e8d9,0 9px 0 #b9a68d,0 12px 0 #755d7f,0 25px 30px #58406430}
.paper-right .paper-front{border-radius:0 5px 5px 0;background:linear-gradient(95deg,#caba9f,#f9f4e9 16%,#ebe0cf)}
.paper-front>span{position:absolute;bottom:23%;left:10%;right:10%;font:12px/1.8 var(--serif);color:#96816f;text-align:center}
.paper-front>i{position:absolute;left:17%;right:17%;bottom:17%;height:1px;background:#b5a08d30}.paper-front>i:nth-of-type(2){bottom:12%;left:22%;right:22%}.paper-front>i:nth-of-type(3){bottom:7%;left:27%;right:27%}
.paper-spine{position:absolute;left:49.65%;top:0;width:.7%;height:100%;background:linear-gradient(90deg,#b5a18b80,#f6eddf80,#b5a18b80);transform:translateZ(1px);pointer-events:none}
.paper-page-no{position:absolute;bottom:4%;right:6%;font:9px Georgia,serif;letter-spacing:.15em;color:#a08d7e;transform:translateZ(1px);pointer-events:none}
/* The cover is the reverse face of the left page, so it stays attached to the spine. */
.paper-cover{display:none;backface-visibility:hidden}
.paper-ready .paper-cover{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:3px 7px 7px 3px;border:1px solid #8c729a;border-left:8px solid #5f4776;background:linear-gradient(125deg,#59416f,#8c749e 55%,#715a89);color:#f7edf2;box-shadow:inset 0 0 0 10px #bba2c320,3px 5px 0 #d7c6d7,6px 9px 20px #48355030;transform:rotateY(180deg) translateZ(2px);pointer-events:none}
.paper-cover-kicker{font:10px/1.8 var(--sans);letter-spacing:.14em;opacity:.7}.paper-cover-title{font:600 clamp(24px,3.7vw,38px)/1.6 var(--serif);letter-spacing:-.07em;margin-top:24px}.paper-cover-hanja{font:11px/2 Georgia,serif;opacity:.6;margin-top:7px}.paper-cover-line{height:1px;width:25%;background:#d6c1dc70;margin:30px auto}.paper-cover-foot{font:9px/1.9 var(--sans);opacity:.75}
/* Each illustrated cut-out hinges around its bottom edge, where it meets the page. */
.paper-scenery{position:absolute;left:23%;width:54%;height:60%;bottom:42%;border:5px solid #f6f0e7;border-radius:44% 44% 2px 2px;overflow:hidden;transform-origin:50% 100%;transform:translateZ(2px) rotateX(-90deg);backface-visibility:hidden;box-shadow:0 9px 15px #46324a21}
.paper-scenery img{width:100%;height:100%;object-fit:cover;object-position:50% 50%}.paper-scenery:after{content:'';position:absolute;inset:0;box-shadow:inset 0 0 30px #533a541c;background:linear-gradient(transparent 55%,#65504b35);pointer-events:none}
.paper-sign{position:absolute;left:50%;top:5%;transform:translateX(-50%);text-align:center;white-space:nowrap;padding:8px 18px;background:#f6f0e6;border:1px solid #bca88f;box-shadow:3px 4px 0 #59455040;color:#665060;z-index:1}.paper-sign small{font:8px/1.8 var(--sans);letter-spacing:.1em;display:block}.paper-sign>span{font:600 21px/1.7 var(--serif);letter-spacing:-.06em}
.paper-figure{position:absolute;padding:0;border:0;background:transparent;bottom:18%;width:48%;height:60%;transform-origin:50% 100%;transform-style:preserve-3d;backface-visibility:hidden;color:#584162;cursor:pointer}
.paper-figure-left{left:23%;transform:translateZ(3px) rotateX(-90deg)}.paper-figure-right{left:29%;transform:translateZ(3px) rotateX(-90deg)}
.paper-figure:after{content:'';position:absolute;bottom:0;left:20%;width:60%;height:18px;background:linear-gradient(#c9bcb0,#e5d9c8);border:1px dashed #b6a28e;transform-origin:50% 100%;transform:rotateX(90deg);pointer-events:none}
.paper-portrait{display:block;position:absolute;inset:0 0 31px;border:5px solid #f8f3e9;border-radius:46% 46% 3px 3px;overflow:hidden;box-shadow:4px 8px 15px #2f1c362a;background:#d8cbc0}.paper-portrait img{width:100%;height:100%;object-fit:cover;object-position:50% 30%}
.paper-name{position:absolute;bottom:0;left:4%;right:4%;display:flex;align-items:center;justify-content:center;gap:14px;border:1px solid #c9b8ce;background:#fffaf4;box-shadow:2px 3px 0 #7b5c8426;border-radius:3px;padding:6px 8px;font:600 14px/1.6 var(--sans)}.paper-name>span{color:#9b7ca6;font-size:15px}
.paper-figure[aria-pressed=true] .paper-name{background:#715681;color:#fff;border-color:#715681}.paper-figure[aria-pressed=true] .paper-name>span{color:#e7d2ef}.paper-figure:focus-visible{outline:3px solid #715681;outline-offset:8px;border-radius:45% 45% 4px 4px}
.paper-crease{position:absolute;bottom:18%;width:34%;left:30%;height:1px;background:#9a83734a;transform:translateZ(2px);pointer-events:none}.paper-right .paper-crease{left:36%}
.paper-thread{position:absolute;height:40px;width:58%;left:20%;bottom:9%;border-bottom:1.5px dashed #a66b7e;border-radius:0 0 50% 55%;transform:translateZ(2px) rotate(-4deg);pointer-events:none}
/* Closed: both page halves lie on the right, under the reverse-side front cover. */
.paper-ready:not([data-open=true]) .paper-book{transform:translateX(-25%) rotateX(72deg)}
.paper-ready:not([data-open=true]) .paper-left{transform:rotateY(180deg)}
.paper-ready:not([data-open=true]) .paper-scenery{transform:translateZ(2px) rotateX(0deg);visibility:hidden}
.paper-ready:not([data-open=true]) .paper-figure-left,.paper-ready:not([data-open=true]) .paper-figure-right{transform:translateZ(3px) rotateX(0deg) rotateZ(0deg);visibility:hidden}
/* On opening, the cover opens first, then the paper landscape and characters rise. */
.paper-ready[data-open=true] .paper-book{transition:transform 2.6s var(--book-ease)}
.paper-ready[data-open=true] .paper-left{transition:transform 2.6s var(--book-ease)}
.paper-ready[data-open=true] .paper-scenery{visibility:visible;transition:transform 1.95s .65s var(--book-ease),visibility 0s .65s}
.paper-ready[data-open=true] .paper-figure-left{visibility:visible;transition:transform 1.95s .65s var(--book-ease),visibility 0s .65s}
.paper-ready[data-open=true] .paper-figure-right{visibility:visible;transition:transform 1.95s .65s var(--book-ease),visibility 0s .65s}
/* On closing, the cut-outs fold flat before the cover returns over them. */
.paper-ready:not([data-open=true]) .paper-scenery,.paper-ready:not([data-open=true]) .paper-figure{transition:transform 1.55s var(--book-ease),visibility 0s 1.55s}
.paper-ready:not([data-open=true]) .paper-left{transition:transform 1.9s .15s var(--book-ease)}
.paper-ready:not([data-open=true]) .paper-book{transition:transform 2.1s var(--book-ease)}
.paper-ready[data-turn=fold] .paper-scenery,.paper-ready[data-turn=fold] .paper-figure{transform:translateZ(3px) rotateX(0deg);transition:transform .48s var(--book-ease)}
.paper-ready[data-turn=rise] .paper-scenery{transition:transform 1s var(--book-ease)}
.paper-ready[data-turn=rise] .paper-figure-left{transition:transform 1s .1s var(--book-ease)}
.paper-ready[data-turn=rise] .paper-figure-right{transition:transform 1s .2s var(--book-ease)}
.paper-opening{text-align:center;display:none;margin-top:22px}.paper-ready .paper-opening{display:block}.paper-open{border:1px solid #7c608d;border-radius:30px;background:#715681;color:#fff;padding:12px 26px;font:600 12px/1.8 var(--sans);min-height:46px;box-shadow:0 5px 15px #7156811a}.paper-open span{margin-left:15px}.paper-open:hover{background:#5e446f}.paper-open:disabled{cursor:wait}.paper-skip{display:inline-block;margin-left:18px;font:11px/1.8 var(--sans);color:#84728c;text-decoration:underline;text-underline-offset:5px}
.paper-ready[data-open=true] .paper-skip{display:none}.paper-ready[data-open=true] .paper-open{background:transparent;box-shadow:none;color:#8b7596;border-color:#d2c4d9;font-weight:400;padding:7px 18px;min-height:44px;font-size:10px}
.paper-controls{display:flex;align-items:center;justify-content:center;gap:18px;margin:25px auto 0}.paper-arrow{border:1px solid #d4c6da;background:#ffffff85;width:44px;height:44px;border-radius:50%;color:#715681;font-size:18px;flex:none}.paper-arrow:disabled{opacity:.3;cursor:default}.paper-tabs{display:flex;gap:5px;justify-content:center}.paper-tabs button{border:0;border-bottom:1px solid transparent;background:transparent;color:#9a899e;min-height:44px;padding:7px 13px;font:10px/1.8 var(--sans);letter-spacing:.07em}.paper-tabs button span{display:block;letter-spacing:0;font-size:11px}.paper-tabs button[aria-pressed=true]{color:#644774;border-color:#9474a1}.paper-tabs button:disabled{cursor:wait}
.paper-detail{text-align:center;max-width:650px;min-height:195px;margin:26px auto 0;padding:25px 20px 10px;border-top:1px solid #d7cadf}.paper-detail-kicker{font:9px/1.8 var(--sans);letter-spacing:.12em;color:#9b80a7}.paper-detail-title{font:600 21px/1.7 var(--serif);letter-spacing:-.035em;color:#584162;margin:8px 0}.paper-detail-copy{font:12px/1.95 var(--body);color:#7a6b7d;white-space:pre-line}.paper-detail-source{font:9px/1.8 var(--sans);color:#a391a8;margin-top:12px}.paper-caption{text-align:center;font:9px/1.8 var(--sans);color:#a18fa6;margin-top:12px}.paper-entry{color:#715681!important;border-bottom:1px solid #bba6c5;padding:4px 0;font:10px/1.8 var(--sans)}
.paper-ready .paper-explore[hidden],.paper-theatre:not(.paper-ready) .paper-controls,.paper-theatre:not(.paper-ready) .paper-caption{display:none}
@media(max-width:640px){
 .paper-story{padding:42px 0 36px}.paper-story>.wrap{padding:0 18px}.paper-heading h2{font-size:29px}.paper-heading>p{font-size:10px}.paper-stage{height:370px;margin:22px -8px 0;perspective:1800px}
 .paper-book{width:88%;left:6%;height:105%;bottom:8%}.paper-front>span{font-size:8px;bottom:21%;left:6%;right:6%}.paper-page-no{font-size:7px}.paper-ready .paper-cover{border-left-width:5px;box-shadow:inset 0 0 0 7px #bba2c320,2px 3px 0 #d7c6d7,4px 6px 15px #48355030}.paper-cover-title{font-size:clamp(20px,6.3vw,25px);margin-top:17px}.paper-cover-kicker{font-size:7px}.paper-cover-foot{font-size:6px}.paper-cover-hanja{font-size:9px}.paper-cover-line{margin:20px auto}
 .paper-scenery{left:17%;width:66%;height:60%;bottom:42%;border-width:3px}.paper-sign{top:5%;padding:6px 11px}.paper-sign>span{font-size:14px}.paper-sign small{font-size:5px}.paper-figure{height:58%;width:62%;bottom:18%}.paper-figure-left{left:9%}.paper-figure-right{left:29%}.paper-portrait{border-width:3px;bottom:27px}.paper-name{font-size:11px;gap:8px;min-height:32px;left:0;right:0;padding:5px 3px}.paper-name>span{font-size:12px}.paper-figure:after{height:12px}.paper-thread{height:25px}
 .paper-open{font-size:11px;padding:10px 21px}.paper-skip{display:block;margin:15px 0 0;font-size:11px}.paper-controls{gap:4px;margin-top:20px}.paper-tabs{gap:0}.paper-tabs button{padding:5px 8px;font-size:9px}.paper-tabs button span{font-size:10px}.paper-detail{min-height:205px;margin-top:20px;padding:22px 10px 8px}.paper-detail-title{font-size:19px}.paper-detail-copy{font-size:12px}.paper-caption{font-size:9px;padding:0 8px}
}
@media(prefers-reduced-motion:reduce){.paper-story *{animation:none!important;transition:none!important}}
/* Compact the reading flow now that characters and sewing scenes live in the book. */
#paper-story{position:relative;padding-bottom:38px}#paper-story>#characters{position:absolute;top:0;scroll-margin-top:30px}
#story.section{padding-top:42px;padding-bottom:42px}.comic-feature{margin-top:32px;padding-top:30px;padding-bottom:28px}
.comic-feature .comic-figure{max-width:880px;padding:0;margin:26px auto 0}
.comic-mat{padding:16px;background:#eee8da;border:3px solid #373d33;box-shadow:0 0 0 1px #9b947d,0 12px 25px #10180d38;min-width:0}
.comic-print{overflow:hidden;background:#fff;line-height:0;border:1px solid #c9c2b5}
.comic-print>img{display:block;width:102.678715%;max-width:none;height:auto;margin-left:-1.606426%;border:0!important;border-radius:0!important;box-shadow:none!important;aspect-ratio:auto;object-fit:contain}
.comic-feature .comic-figure figcaption{margin:15px 4px 0;line-height:1.9}
.comic-dialog-scroll .comic-mat{width:max(100%,790px)}.comic-dialog-scroll .comic-print>img{width:102.678715%;max-width:none}
.paper-theatre[data-scene="2"] .paper-figure-right .paper-portrait img{object-position:76% 50%}
.jaha-ending{padding-top:64px;padding-bottom:56px}
@media(max-width:640px){#paper-story{padding-bottom:30px}#story.section{padding-top:30px;padding-bottom:30px}.comic-feature{margin-top:27px;padding-top:27px;padding-bottom:24px}.comic-feature .comic-figure{margin-top:23px;padding:0}.comic-mat{padding:9px;border-width:2px;box-shadow:0 0 0 1px #9b947d,0 7px 16px #10180d30}.comic-feature .comic-figure figcaption{margin-top:13px}.jaha-ending{padding-top:46px;padding-bottom:42px}}
.paper-theatre[data-scene="2"] .paper-figure-right .paper-portrait img{object-fit:cover;object-position:100% 50%}

.paper-ready[data-initializing] .paper-book,.paper-ready[data-initializing] .paper-leaf,.paper-ready[data-initializing] .paper-scenery,.paper-ready[data-initializing] .paper-figure{transition:none!important}

.paper-load-status{font:11px/1.8 var(--sans);color:#927c9c;margin:10px 0 0}.paper-load-status:empty{display:none}