.sb-stage{perspective:2400px;perspective-origin:50% 20%;padding-block:12px 28px}.sb-book{aspect-ratio:3/2;width:min(100%,1100px,max(300px,150svh - 495px));transform-style:preserve-3d;margin-inline:auto;transition:translate 1s cubic-bezier(.45,.05,.2,1);position:relative;transform:rotateX(8deg)}.sb-book[data-closed]{translate:-25%}.sb-book[data-closed] .sb-page-left,.sb-book[data-closed] .sb-gutter{opacity:0}.sb-book[data-closed][data-turning] .sb-page-left{opacity:1}.sb-board{background:linear-gradient(#0000,#0000) padding-box padding-box,#0f6f86 linear-gradient(135deg,#f7d77c,#c8952c 45%,#f7d77c) border-box;border:3px solid #0000;border-radius:14px;transition:inset 1s cubic-bezier(.45,.05,.2,1);position:absolute;inset:-2.2% -1.6%;transform:translateZ(-4px);box-shadow:0 30px 50px -18px #0a325a8c,0 8px #0a4f61}.sb-book[data-closed]:not([data-turning]) .sb-board{inset:-2.2% -1.6% -2.2% 48.6%}.sb-page{background:#fbf5e6;width:50%;position:absolute;top:0;bottom:0;overflow:hidden}.sb-page-left{border-radius:8px 2px 2px 8px;transition:opacity .4s ease-out;left:0;box-shadow:-3px 0 #f1e7cf,-6px 1px #e3d5b4,-9px 2px #d6c59c}.sb-page-right{border-radius:2px 8px 8px 2px;right:0;box-shadow:3px 0 #f1e7cf,6px 1px #e3d5b4,9px 2px #d6c59c}.sb-half{position:absolute;inset:0;overflow:hidden}.sb-half-img{width:200%;position:absolute;top:0;bottom:0}.sb-half[data-side=left] .sb-half-img{left:0}.sb-half[data-side=right] .sb-half-img{left:-100%}.sb-gutter{pointer-events:none;background:linear-gradient(90deg,#0000 0%,#28190538 45%,#28190552 50%,#28190538 55%,#0000 100%);transition:opacity .4s ease-out;position:absolute;inset:0 45%}.sb-endpaper{background-color:#0f7c93;background-image:radial-gradient(circle,#0000 38%,#f7d77c8c 39% 42%,#0000 43%),linear-gradient(45deg,#0000 47%,#f7d77c59 48% 52%,#0000 53%),linear-gradient(-45deg,#0000 47%,#f7d77c59 48% 52%,#0000 53%);background-size:56px 56px;position:absolute;inset:0;box-shadow:inset 0 0 0 10px #0c6a7e,inset 0 0 0 12px #e9bf55}.sb-cover{position:absolute;inset:0}.sb-cover:after{content:"";border-radius:inherit;pointer-events:none;position:absolute;inset:0;box-shadow:inset 0 0 0 6px #e9bf55,inset 0 0 0 9px #fff6d8,inset 18px 0 22px -12px #00000073}.sb-cover-title{text-align:center;color:var(--color-island-ink);font-family:var(--font-display);background:#fffdf6e6;border-radius:18px;padding:.6em .8em;line-height:1.25;position:absolute;top:7%;left:8%;right:8%;box-shadow:0 6px #e3b64c,0 12px 24px #0f466e4d}.sb-cover-th{font-size:clamp(14px,2.6vw,30px);font-weight:800;display:block}.sb-cover-en{color:var(--color-island-ink-soft);font-size:clamp(10px,1.4vw,17px);font-weight:600;display:block}.sb-leaf{width:50%;transform-style:preserve-3d;z-index:3;animation-timing-function:cubic-bezier(.45,.05,.2,1);animation-fill-mode:forwards;position:absolute;top:0;bottom:0}.sb-leaf[data-dir=fwd]{transform-origin:0%;animation-name:sb-flip-fwd;left:50%}.sb-leaf[data-dir=back]{transform-origin:100%;animation-name:sb-flip-back;left:0}@keyframes sb-flip-fwd{0%{transform:rotateY(0)}50%{transform:rotateY(-90deg)translateZ(6px)}to{transform:rotateY(-180deg)}}@keyframes sb-flip-back{0%{transform:rotateY(0)}50%{transform:rotateY(90deg)translateZ(6px)}to{transform:rotateY(180deg)}}.sb-face{backface-visibility:hidden;background:#fbf5e6;position:absolute;inset:0;overflow:hidden}.sb-face-back{transform:rotateY(180deg)}.sb-shade{pointer-events:none;opacity:0;animation:1s ease-in-out sb-shade;position:absolute;inset:0}.sb-leaf[data-dir=fwd] .sb-face-front .sb-shade,.sb-leaf[data-dir=back] .sb-face-back .sb-shade{background:linear-gradient(90deg,#00000059,#0000000d 60%,#ffffff26)}.sb-leaf[data-dir=fwd] .sb-face-back .sb-shade,.sb-leaf[data-dir=back] .sb-face-front .sb-shade{background:linear-gradient(270deg,#00000059,#0000000d 60%,#ffffff26)}@keyframes sb-shade{0%{opacity:0}50%{opacity:1}to{opacity:0}}@media (prefers-reduced-motion:reduce){.sb-book,.sb-board{transition:none}}.sb-preload{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute;overflow:hidden}.ui-pill.sb-btn-main{white-space:nowrap;min-width:11.5rem;min-height:76px;padding-inline:12px 1.8rem;font-size:1.25rem}@media (max-width:639px){.ui-pill.sb-btn-main{min-width:10rem;padding-inline:10px 1.2rem;font-size:1.1rem}.sb-stage{perspective:1400px;padding-block:6px 18px}.sb-book{transform:rotateX(5deg)}.sb-cover-title{border-radius:10px;box-shadow:0 3px #e3b64c}}
.sb-root[data-deluxe] .sb-stage{perspective:2000px;perspective-origin:50% 0;padding-block:0 clamp(18px,3vw,36px)}.sb-root[data-deluxe] .sb-book{width:min(100%,1100px,max(300px,150svh - 510px));transform:rotateX(14deg);container-type:inline-size}@media (max-width:639px){.sb-root[data-deluxe] .sb-book{transform:rotateX(9deg)}}.sb-root[data-deluxe] .sb-board{background-color:#0c5563;background-image:radial-gradient(circle at 30% 20%,#ffffff14,#0000 45%),radial-gradient(circle at 80% 90%,#00000040,#0000 50%);border-radius:10px;inset:-2.6% -1.9%;box-shadow:0 2.4cqw 3.6cqw -1cqw #190a00bf,0 .9cqw #083a45,0 1.3cqw #190a0059}.sb-root[data-deluxe] .sb-book[data-closed]:not([data-turning]) .sb-board{inset:-2.6% -1.9% -2.6% 48.6%}.sb-root[data-deluxe] .sb-page-left{box-shadow:-2px 0 #f4ead2,-4px 1px #e8dcbd,-6px 1px #ddcca5,-8px 2px #d3c094,-10px 3px #c6b083}.sb-root[data-deluxe] .sb-page-right{box-shadow:2px 0 #f4ead2,4px 1px #e8dcbd,6px 1px #ddcca5,8px 2px #d3c094,10px 3px #c6b083}.sb-root[data-deluxe] .sb-half:after{content:"";pointer-events:none;position:absolute;inset:0;box-shadow:inset 0 0 2.4cqw #6e501e47}.sbx-cover{border-radius:inherit;background-color:#0c5563;background-image:radial-gradient(at 35% 25%,#ffffff1a,#0000 55%),radial-gradient(at 70% 85%,#0000004d,#0000 60%),repeating-radial-gradient(circle at 40% 40%,#ffffff06 0 1px,#0000 1px 3px);position:absolute;inset:0;overflow:hidden}.sbx-cover:after{content:"";pointer-events:none;border-radius:inherit;position:absolute;inset:0;box-shadow:inset 0 0 0 1.6cqw #0c5563,inset 0 0 0 1.9cqw #e2b955,inset 0 0 0 2.4cqw #0c5563,inset 0 0 0 2.55cqw #f3d589,inset 2.2cqw 0 2.4cqw -1.4cqw #0000008c}.sbx-cover[data-art]:after{box-shadow:inset 2.2cqw 0 2.4cqw -1.4cqw #00000080}.sbx-window{border:.45cqw solid #e2b955;border-radius:50% 50% 1.2cqw 1.2cqw/26% 26% 1.2cqw 1.2cqw;position:absolute;inset:33% 15% 9%;overflow:hidden;box-shadow:0 0 0 .35cqw #0a4651,0 0 0 .6cqw #f3d589,inset 0 .6cqw 1.6cqw #00000073}.sbx-corner{color:#eac766;filter:drop-shadow(0 .15cqw #00000059);width:6.5cqw;height:6.5cqw;position:absolute}.sbx-tl{top:3.6cqw;left:3.6cqw}.sbx-tr{top:3.6cqw;right:3.6cqw}.sbx-bl{bottom:3.6cqw;left:3.6cqw}.sbx-br{bottom:3.6cqw;right:3.6cqw}.sbx-title{text-align:center;font-family:var(--font-display);color:#ffe7a3;text-shadow:0 .2cqw #073a44,0 -.1cqw #ffffff59,0 .6cqw 1.2cqw #00000073;line-height:1.2;position:absolute;top:16.5%;left:15%;right:15%}.sbx-title-th{font-size:3.9cqw;font-weight:800;display:block}.sbx-title-en{letter-spacing:.08em;color:#f6dc95;margin-top:.6cqw;font-size:2.2cqw;font-weight:600;display:block}.sbx-title:after{content:"";background:linear-gradient(90deg,#0000,#e2b955,#0000);border-radius:1cqw;width:40%;height:.3cqw;margin:1.2cqw auto 0;display:block}.sb-curl{z-index:4;width:50%;transform-style:preserve-3d;pointer-events:none;position:absolute;top:0;bottom:0}.sb-curl[data-dir=fwd]{left:50%}.sb-curl[data-dir=back]{left:0}.sb-strip{width:100%;height:100%;transform-style:preserve-3d;position:absolute;top:0}.sb-curl[data-dir=fwd] .sb-strip{transform-origin:0;left:100%}.sb-curl[data-dir=back] .sb-strip{transform-origin:100%;right:100%}.sb-curl[data-dir=fwd] .sb-strip[data-first]{width:calc(100% / var(--strips));left:0}.sb-curl[data-dir=back] .sb-strip[data-first]{width:calc(100% / var(--strips));right:0}.sb-strip-face{backface-visibility:hidden;position:absolute;inset:0 -1px;overflow:hidden}.sb-strip-back{transform:rotateY(180deg)}.sb-strip-content{width:calc(var(--strips) * (100% - 2px));margin-left:1px;position:absolute;top:0;bottom:0}.sb-strip-shade{pointer-events:none;position:absolute;inset:0}.sb-cast{z-index:3;opacity:0;pointer-events:none;width:50%;position:absolute;top:0;bottom:0}.sb-cast[data-dir=fwd]{background:linear-gradient(90deg,#1e0f008c,#0000 75%);left:50%}.sb-cast[data-dir=back]{background:linear-gradient(270deg,#1e0f008c,#0000 75%);left:0}.sbx-burst{z-index:5;pointer-events:none;position:absolute;inset:0;overflow:visible}.sbx-bloom{opacity:0;background:radial-gradient(circle,#ffe48c8c,#ffd26e2e 40%,#0000 70%);border-radius:50%;width:60cqw;height:60cqw;position:absolute;top:50%;left:50%;translate:-50% -50%}.sbx-spark{opacity:0;background:radial-gradient(circle,#fff8dc 0 25%,#f2c94c 45%,#0000 70%);border-radius:50%;width:1.3cqw;height:1.3cqw;margin:-.65cqw;position:absolute;top:50%;left:50%}.sb-fx{z-index:2;pointer-events:none;--bubble-bottom:-4%;--rise:-74cqw;border-radius:8px;display:none;position:absolute;inset:0;overflow:hidden}.sb-fx[data-fx=whirl]{--bubble-bottom:36%;--rise:-26cqw}.sb-fx[data-fx=deep]{--bubble-bottom:36%;--rise:-44cqw}.fx-cloud{background:radial-gradient(#ffffff6b,#ffffff1f 45%,#0000 70%);border-radius:50%;width:26%;height:10%;position:absolute}.sb-fx[data-fx=dust] .fx-cloud{background:radial-gradient(#e8b46e59,#0000 70%);width:40%;height:26%}.sb-fx[data-fx=dust] .fx-mote{background:radial-gradient(circle,#fad796e6,#e6b46e4d 50%,#0000 70%)}.sb-fx[data-fx=clouds] .fx-cloud{background:radial-gradient(#ebeef566,#0000 70%)}.fx-glints{mix-blend-mode:screen;opacity:.4;background-image:radial-gradient(.9cqw .22cqw at 20% 30%,#fffff5e6,#0000),radial-gradient(.6cqw .16cqw at 70% 15%,#fffff5cc,#0000),radial-gradient(1.1cqw .25cqw at 45% 70%,#fffae6d9,#0000),radial-gradient(.5cqw .14cqw at 85% 80%,#fffff5cc,#0000);background-size:9cqw 3.4cqw;position:absolute;-webkit-mask-image:radial-gradient(#000 40%,#0000 75%);mask-image:radial-gradient(#000 40%,#0000 75%)}.sb-fx[data-fx=night] .fx-glints{filter:sepia(.6)saturate(1.4)}.fx-drop{background:linear-gradient(#0000,#e4f0fff2);border-radius:1cqw;width:max(1px,.12cqw);position:absolute;top:-8%;transform:rotate(14deg)}.fx-drop[data-far]{filter:blur(.3px);width:max(1px,.07cqw)}.fx-spray{background:linear-gradient(#141e3047,#0000 45%),radial-gradient(at 50% 120%,#ffffff1f,#0000 60%);position:absolute;inset:0}.fx-whirl{background:repeating-conic-gradient(#0000 0deg 14deg,#ffffff4d 20deg,#0000 28deg 40deg);border-radius:50%;width:34cqw;height:34cqw;position:absolute;top:55%;left:25%;transform:translate(-50%,-50%)scaleY(.32);-webkit-mask-image:radial-gradient(circle,#0000 8%,#000 22% 48%,#0000 70%);mask-image:radial-gradient(circle,#0000 8%,#000 22% 48%,#0000 70%)}.fx-bubble{bottom:var(--bubble-bottom);opacity:0;background:radial-gradient(circle at 32% 30%,#ffffff8c,#ffffff0f 60%);border:1.5px solid #fff9;border-radius:50%;position:absolute}.fx-glow{mix-blend-mode:screen;opacity:.7;background:radial-gradient(circle,#ffde8299,#ffc85a2e 40%,#0000 70%);border-radius:50%;width:20cqw;height:20cqw;position:absolute;top:63%;left:29%;translate:-50% -50%}.fx-rays{transform-origin:50% 0;mix-blend-mode:screen;background:repeating-linear-gradient(100deg,#0000 0 5cqw,#fff0b929 6cqw 8cqw,#0000 9cqw 14cqw);height:120%;position:absolute;top:-12%;left:-10%;right:-10%;-webkit-mask-image:linear-gradient(#000,#0000 85%);mask-image:linear-gradient(#000,#0000 85%)}.fx-mote{opacity:0;background:radial-gradient(circle,#fff4c8f2,#ffe6964d 50%,#0000 70%);border-radius:50%;width:.7cqw;height:.7cqw;position:absolute}.fx-dapple{mix-blend-mode:soft-light;background-image:radial-gradient(3cqw 1.4cqw at 20% 30%,#fffad7b3,#0000),radial-gradient(2.2cqw 1cqw at 60% 20%,#fffad799,#0000),radial-gradient(4cqw 1.6cqw at 75% 65%,#fffad799,#0000),radial-gradient(2.6cqw 1.2cqw at 35% 75%,#fffad78c,#0000);background-size:22cqw 12cqw;position:absolute;inset:50% 0 0 42%}.fx-moon,.fx-lamp{mix-blend-mode:screen;border-radius:50%;position:absolute;translate:-50% -50%}.fx-moon{background:radial-gradient(circle,#fff4cd66,#fff0be1a 45%,#0000 70%);width:16cqw;height:16cqw;top:18%;left:89%}.fx-lamp{background:radial-gradient(circle,#ffcd7873,#ffbe5a1f 45%,#0000 70%);width:22cqw;height:22cqw;top:60%;left:23%}.sb-fx-still{z-index:2;pointer-events:none;border-radius:8px;position:absolute;inset:0;overflow:hidden}.sb-root[data-real] .sb-fx-still{border-radius:0;inset:4.5% 2.25%}.fx-fish{position:absolute}.fx-fish svg{width:100%;height:auto;display:block;overflow:visible}.fx-fish path{fill:#04283c}.fx-fish:not([data-deep]){mix-blend-mode:multiply;opacity:.72;filter:blur(.25cqw)}.fx-fish[data-deep] path{fill:#010712}.fx-fish[data-deep]{opacity:.85;filter:drop-shadow(0 -.25cqw .5cqw #6ea5eb59)blur(.12cqw)}@media (prefers-reduced-motion:no-preference){.sb-root[data-deluxe] .sb-stage{animation:2.4s cubic-bezier(.2,.7,.2,1) both sbx-dolly}.sb-fx{animation:.9s ease-out both sbx-fade-in;display:block}.fx-cloud{animation:40s ease-in-out infinite alternate fx-drift}.fx-glints{animation:3.6s ease-in-out infinite alternate fx-shimmer,22s linear infinite fx-glint-drift}.fx-drop{animation:.7s linear infinite fx-fall}.fx-fish{animation:16s ease-in-out infinite alternate fx-swim}.fx-whirl{animation:9s linear infinite fx-whirl}.fx-bubble{animation:9s linear infinite fx-rise}.fx-glow,.fx-moon,.fx-lamp{animation:6s ease-in-out infinite alternate fx-breathe}.fx-rays{animation:11s ease-in-out infinite alternate fx-sway}.fx-mote{animation:12s ease-in-out infinite fx-float}.fx-dapple{animation:9s ease-in-out infinite alternate fx-dapple}.sbx-bloom{animation:1.4s ease-out both sbx-bloom}.sbx-spark{animation:1.5s cubic-bezier(.15,.6,.3,1) both sbx-spark}}@keyframes sbx-dolly{0%{opacity:.4;transform:scale(.94)translateY(2%)}to{opacity:1;transform:none}}@keyframes sbx-fade-in{0%{opacity:0}}@keyframes fx-drift{to{transform:translate(10cqw)}}@keyframes fx-shimmer{0%{opacity:.18}to{opacity:.55}}@keyframes fx-glint-drift{to{background-position:9cqw 0}}@keyframes fx-fall{0%{transform:translate(0)rotate(14deg)}to{transform:translate(-19cqw,76cqw)rotate(14deg)}}@keyframes fx-swim{0%{translate:0}to{translate:3cqw -.8cqw}}@keyframes fx-whirl{to{transform:translate(-50%,-50%)scaleY(.32)rotate(-360deg)}}@keyframes fx-rise{0%{opacity:0;transform:translate(0)}12%{opacity:.85}50%{transform:translate(1.2cqw, calc(var(--rise) / 2))}85%{opacity:.6}to{transform:translate(-.6cqw, var(--rise));opacity:0}}@keyframes fx-breathe{0%{opacity:.5}to{opacity:.9}}@keyframes fx-sway{0%{transform:rotate(-3deg)}to{transform:rotate(3deg)}}@keyframes fx-float{0%,to{opacity:0;transform:translate(0)}20%{opacity:.9}50%{opacity:.7;transform:translate(2.5cqw,-3cqw)}80%{opacity:.85}}@keyframes fx-dapple{to{background-position:2cqw .8cqw}}@keyframes sbx-bloom{0%{opacity:0;transform:scale(.4)}35%{opacity:1}to{opacity:0;transform:scale(1.15)}}@keyframes sbx-spark{0%{opacity:0;transform:translate(0)scale(.4)}15%{opacity:1}to{opacity:0;transform:translate(var(--dx), var(--dy)) scale(1)}}.sbx-shell{pointer-events:none;position:absolute}.sb-root[data-real] .sb-book[data-closed]{translate:none}.sb-root[data-real] .sb-book .sb-board{display:none}.sb-root[data-real] .sb-book[data-closed] .sb-page-left{opacity:1}.sb-root[data-real] .sb-gutter{display:none}.sb-root[data-real] .sb-page{box-shadow:none;background:0 0}.sb-root[data-real] .sb-page .sb-half img{mix-blend-mode:multiply}.sb-root[data-real] .sb-half:after{display:none}.sb-root[data-real] .sb-strip-content{isolation:isolate;background:var(--sb-paper,#fbf5e6) 0 0 / 40cqw auto}.sb-root[data-real] .sb-strip-content .sb-half img{mix-blend-mode:multiply}.sb-root[data-real] .sb-half-img{width:191%;top:4.5%;bottom:4.5%}.sb-root[data-real] .sb-half[data-side=left] .sb-half-img{left:4.5%}.sb-root[data-real] .sb-half[data-side=right] .sb-half-img{left:-95.5%}.sb-root[data-real] .sb-fx{border-radius:0;inset:4.5% 2.25%}.sb-root[data-real] .sb-gutter{background:linear-gradient(90deg,#0000,#3c280f24 40%,#28190552 50%,#3c280f24 60%,#0000);display:block;inset:0 46%}.sb-root[data-real] .sb-book[data-closed] .sb-gutter{opacity:0}.sb-root[data-real] .sb-stage{perspective-origin:50%;padding-top:clamp(14px,4.5vw,44px)}.sb-root[data-real] .sb-book{width:min(87.7193%,1100px,max(280px,150svh - 510px));transform:rotateX(6deg)}@media (max-width:639px){.sb-root[data-real] .sb-book{transform:rotateX(5deg)}}.sb-board-leaf{transform-style:preserve-3d;position:absolute;inset:0}.sb-curl[data-dir=fwd] .sb-board-leaf{transform-origin:0}.sb-curl[data-dir=back] .sb-board-leaf{transform-origin:100%}.sb-board-face{backface-visibility:hidden;border-radius:2px 8px 8px 2px;position:absolute;inset:0;overflow:hidden}.sb-board-face.sb-strip-back,.sb-curl[data-dir=back] .sb-board-face{border-radius:8px 2px 2px 8px}.sb-curl[data-dir=back] .sb-board-face.sb-strip-back{border-radius:2px 8px 8px 2px}.sb-board-edge{background:linear-gradient(90deg,#0a4651,#0c5563 40%,#083a45);width:.9cqw;position:absolute;top:.4%;bottom:.4%}.sb-curl[data-dir=fwd] .sb-board-edge{transform-origin:0;left:100%;transform:rotateY(90deg)}.sb-curl[data-dir=back] .sb-board-edge{transform-origin:100%;right:100%;transform:rotateY(-90deg)}.sbx-inside{background:var(--sb-paper,#fbf5e6) 0 0 / 40cqw auto;position:absolute;inset:0;box-shadow:inset 0 0 2cqw #6e501e2e}.sbx-titlepage{text-align:center;font-family:var(--font-display);color:var(--color-island-ink,#12355b);flex-direction:column;justify-content:center;align-items:center;gap:1cqw;padding:6cqw;line-height:1.25;display:flex;position:absolute;inset:0}.sbx-tp-th{font-size:3.6cqw;font-weight:800}.sbx-tp-en{letter-spacing:.08em;color:#0c5563;font-size:2cqw;font-weight:600}.sbx-titlepage:before,.sbx-titlepage:after{content:"";background:linear-gradient(90deg,#0000,#c8952c,#0000);border-radius:1cqw;width:30%;height:.25cqw}
