@font-face{font-family:AlbumSerif;src:url('album-font.ttf') format('truetype');font-display:swap}
.edition-bori{--accent:#485748;--tint:#e9eee3}
.edition-nabi{--accent:#595266;--tint:#ece8ef}
.edition-tori{--accent:#866447;--tint:#f2e8da}
*{box-sizing:border-box}body{margin:0;background:#e8e4da;color:#3c4036;font-family:'Malgun Gothic',system-ui,sans-serif}button,select,input{font:inherit}button{cursor:pointer}button:disabled{opacity:.3;cursor:default}button:focus-visible,select:focus-visible,input:focus-visible,.book-scene:focus-visible{outline:3px solid #ac7d3e;outline-offset:3px}button{background:transparent;border:1px solid #c8c7b9;border-radius:3px;color:#444d3d;padding:9px 15px;font-size:14px;min-height:40px}.reader{max-width:1350px;margin:auto;padding:22px 30px 18px}.reader-top{display:flex;justify-content:space-between;align-items:center;gap:15px}.reader-brand{font:12px Georgia,serif;letter-spacing:2px;display:block;color:#685b42}.reader-edition{font-size:12px;display:block;margin-top:6px;color:#6c7061}.reader-top button{font-size:12px}.music-bar{display:flex;align-items:center;gap:12px;justify-content:center;margin:8px auto 0;min-height:44px}.music-bar>span{font-size:12px;color:#656955}.music-bar button{font-size:13px;background:#f8f6ed;border-color:#c8c8b9}.music-bar button[aria-pressed=true]{background:var(--accent);color:#fff}.volume-label{display:flex;align-items:center;gap:7px;font-size:12px;color:#676d5c}.volume-label input{width:70px;accent-color:var(--accent)}.audio-status{font-size:12px;text-align:center;min-height:16px;margin:3px 0;color:#856143}
.book-area{position:relative;max-width:1130px;margin:8px auto 0;padding:0 37px}.book-scene{position:relative;width:100%;max-width:1000px;margin:auto;perspective:2300px;touch-action:pan-y;isolation:isolate}.book-spread{position:relative;display:flex;width:100%;aspect-ratio:1.54;min-height:620px;filter:drop-shadow(0 22px 21px #4e493831)}.book-spread.solo{justify-content:center;filter:drop-shadow(9px 19px 15px #423b3540)}.book-spread.solo .album-page{width:50%;border-radius:2px 5px 5px 2px;border-right:6px solid #cbc5b4;box-shadow:inset 7px 0 10px #1d1d181c}.book-spread:not(.solo):after{content:'';position:absolute;pointer-events:none;left:calc(50% - 18px);top:0;width:36px;height:100%;background:linear-gradient(90deg,transparent,#2f302617 45%,#24251d33 50%,#fff9 54%,transparent);z-index:3}.album-page{position:relative;width:50%;height:100%;overflow:hidden;background:#fcfaf2;padding:7% 5% 6%;font-family:AlbumSerif,Georgia,serif;border:1px solid #e0dbcd;flex-shrink:0;container-type:inline-size;display:flex;flex-direction:column}.page-label{display:block;font-family:'Malgun Gothic',sans-serif;font-size:11px;letter-spacing:1.9px;color:#857c65;line-height:1.6;margin-bottom:7%;position:relative;z-index:2}.album-page h1,.album-page h2,.album-page p{white-space:pre-line;word-break:keep-all;overflow-wrap:break-word}.album-page h1,.album-page h2{font-weight:400;line-height:1.5;margin:0 0 6%;font-size:clamp(24px,3vw,36px);letter-spacing:-.5px;color:var(--accent)}.album-page .page-body{font-size:clamp(14px,1.5vw,17px);line-height:1.95;margin:4% 0 0;color:#626151}.page-footer{position:absolute;bottom:4%;left:10%;right:10%;display:flex;justify-content:space-between;font:10px/1.4 'Malgun Gothic',sans-serif;letter-spacing:1px;color:#918770}.layout-cover{background:var(--accent);color:#faf4df;text-align:center;align-items:center;padding:5% 4% 5%}.layout-cover:before{content:'';position:absolute;inset:12px;border:1px solid #d7c89b66;pointer-events:none}.layout-cover .page-label{font:10px/1.5 Georgia,serif;color:#e3d5af;letter-spacing:2px;margin-bottom:7%}.cover-name{font-size:14px;color:#e6dfc9;margin:1% 0 4%}.layout-cover h1{color:#fff6dd;font-size:clamp(30px,4.4vw,51px);line-height:1.3;margin-bottom:6%}.cover-photo{width:78%;height:37%;object-fit:cover;border:5px solid #ede6cf;box-shadow:0 3px 9px #0003}.cover-subtitle{font-size:14px;line-height:1.6;margin:6% 0 0}.cover-imprint{font:9px Georgia,serif;letter-spacing:3px;position:absolute;bottom:7%}.layout-cover .page-footer,.layout-back .page-footer{display:none}.layout-dedication{justify-content:center;background:#f7f3e8}.layout-dedication h2{font-size:20px;margin-bottom:12%}.layout-dedication .page-body{font-size:clamp(18px,2.2vw,24px);line-height:2.2;color:var(--accent)}.layout-dedication .page-label{position:absolute;top:10%}.layout-full{padding:0}.full-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.layout-full:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#0003,transparent 25%,transparent 44%,#14180bbf)}.layout-full .page-label{position:absolute;top:6%;left:9%;color:#fff4d7;font-size:11px}.full-caption{position:absolute;bottom:10%;left:9%;right:9%;z-index:1}.full-caption h2{color:#fff9e8;font-size:clamp(25px,3.5vw,38px);text-shadow:0 1px 8px #0003}.full-caption .page-body{color:#fff9e8;font-size:15px}.layout-full .page-footer{color:#fff8e7;z-index:2}.story-photo{width:100%;height:44%;object-fit:cover;display:block;margin:1% 0 3%}.layout-photo .story-photo{height:55%}.layout-photo h2{font-size:27px}.layout-story h2{font-size:clamp(22px,2.8vw,30px)}.layout-story .page-body{font-size:15px}.layout-chapter{background:var(--tint);justify-content:center}.layout-chapter:before{content:'II';position:absolute;right:7%;top:14%;font:200px/1 Georgia,serif;color:var(--accent);opacity:.055}.layout-chapter .page-label{margin-bottom:12%}.layout-chapter h2{font-size:clamp(28px,3.7vw,42px);position:relative}.layout-chapter .page-body{margin-top:10%}.layout-quote{justify-content:center;text-align:center;background:var(--accent)}.layout-quote:before{content:'“';font:110px/1 Georgia,serif;color:#daccab;position:absolute;top:14%;left:15%}.layout-quote .page-label{color:#daccab;margin-top:10%}.layout-quote h2{color:#fff9e7;line-height:1.9}.layout-quote .page-body{color:#dedbc9;font-size:14px}.layout-quote .page-footer{color:#d4cbb5}.photo-pair{display:flex;flex-direction:column;gap:13px;flex:1;min-height:0}.photo-pair figure{margin:0;min-height:0;flex:1;display:flex;flex-direction:column}.photo-pair img{width:100%;flex:1;min-height:0;object-fit:cover}.photo-pair figcaption{font:11px/1.6 'Malgun Gothic',sans-serif;padding-top:5px;color:#7d7969}.layout-duo h2{font-size:25px;margin-bottom:5%}.layout-duo .page-body{font-size:13px;margin:5% 0 7%}.kept-list{list-style:none;margin:12% 0 0;padding:0}.kept-list li{border-top:1px solid #dcd8c7;padding:7% 0;display:flex;align-items:center;gap:15px}.kept-list li span{font:22px Georgia,serif;color:#a69870}.kept-list li p{font-size:18px;line-height:1.7;margin:0}.list-footnote{font-size:14px;color:#88816b;margin-top:10%}.layout-wishes{background:var(--tint)}.milestones{list-style:none;margin:9% 0 0;padding:0 0 0 23px;border-left:1px solid #b4b99e}.milestones li{position:relative;margin:0 0 14%}.milestones li:before{content:'';position:absolute;left:-28px;top:10px;width:8px;height:8px;border-radius:50%;background:var(--accent)}.milestones h3{font-weight:400;font-size:20px;margin:0 0 9px}.milestones p{font-size:16px;color:#777460;line-height:1.9;margin:0}.layout-letter{background:#f8f4ea}.layout-letter h2{font-size:27px;margin-bottom:5%}.layout-letter .page-body{font-size:clamp(14px,1.5vw,16px);line-height:1.85;margin:1% 0}.letter-sign{text-align:right;font-size:13px;color:#837858;margin-top:7%}.layout-closing h2{font-size:36px;line-height:1.6}.layout-closing .story-photo{height:42%;border-radius:50% 50% 0 0}.layout-closing .page-body{text-align:right;font-size:14px}.layout-back{background:var(--accent);color:#fff5dd;justify-content:center;text-align:center}.layout-back .page-label{color:#e0cfa9;position:absolute;top:9%;left:0;width:100%}.back-monogram{border:1px solid #cabd8c;border-radius:50%;width:75px;height:75px;align-self:center;display:grid;place-items:center;margin-bottom:12%;font-size:22px}.layout-back h2{color:#fff3d2;font-size:27px}.layout-back .page-body{color:#e6ddc6;font-size:16px}.back-imprint{font:11px/2 'Malgun Gothic',sans-serif;color:#d9c9ab;letter-spacing:1px;position:absolute;bottom:9%;left:0;width:100%}
.turn-sheet{position:absolute;top:0;left:50%;width:50%;height:100%;transform-origin:left center;transform-style:preserve-3d;z-index:8;transition:transform .85s cubic-bezier(.33,.02,.22,1)}.turn-sheet.reverse{left:0;transform-origin:right center}.turn-sheet .turn-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden;box-shadow:3px 4px 20px #24221b33}.turn-face .album-page{width:100%;padding:14% 10% 12%}.turn-face .layout-cover{padding:10% 8%}.turn-face .layout-full{padding:0}.turn-face.back{transform:rotateY(180deg)}.turn-sheet.turning{transform:rotateY(-180deg)}.turn-sheet.reverse.turning{transform:rotateY(180deg)}.turn-face:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#15150c22,transparent 24%,#fff2 64%,#15150c18)}.edge{position:absolute;top:44%;border:0;font:40px Georgia,serif;padding:0;width:33px;height:65px}.edge.prev{left:0}.edge.next{right:0}.reader-nav{max-width:460px;margin:27px auto 0;display:flex;justify-content:space-between;align-items:center;gap:18px}.reader-nav>div{text-align:center;min-width:130px}.reader-nav p{font:15px Georgia,'Malgun Gothic',serif;margin:0}.reader-nav span{font-size:11px;color:#767860;display:block;margin-top:5px}.reader-nav button{border:0;padding:7px 10px}.reader-tools{display:flex;align-items:center;justify-content:center;gap:12px;margin:15px 0 0}.reader-tools>label{font-size:12px;color:#696d5b;display:flex;align-items:center;gap:7px}.reader-tools select{max-width:210px;font-size:12px;padding:9px 6px;border:1px solid #c8c7b9;background:#f5f3e9;color:#4e5745;border-radius:3px;height:40px}.reader-tools button{font-size:12px;padding:7px 11px}.reader-tools button[aria-pressed=true]{background:var(--accent);color:white}.reader-hint,.sample-label{text-align:center;font-size:11px;color:#767968;line-height:1.7;margin:12px 0 0}.sample-label{font-size:10px;margin:4px 0 0}.print-pages{display:none}.reader:fullscreen{background:#e8e4da;max-width:none;overflow:auto}.reader:fullscreen .book-area{max-width:min(1150px,135vh)}
@media(min-width:1500px){.reader{max-width:1100px}}
@media(max-width:1000px){.reader{padding:16px 10px}.reader-top{padding:0 5px}.reader-brand{font-size:10px}.reader-top button{font-size:11px;padding:7px 9px}.music-bar{gap:9px;flex-wrap:wrap;margin-top:13px}.music-bar>span{font-size:11px}.volume-label{font-size:11px}.volume-label input{width:52px}.book-area{padding:0 10px;margin-top:8px}.book-scene{max-width:450px}.book-spread{aspect-ratio:.77;min-height:650px}.book-spread .album-page,.book-spread.solo .album-page{width:100%;padding:12% 9% 10%}.book-spread .layout-cover{padding:10% 8%}.book-spread .layout-full{padding:0}.book-spread:after{display:none}.album-page h2{font-size:29px}.album-page h1{font-size:43px}.album-page .page-body{font-size:15px;line-height:1.9}.layout-letter .page-body{font-size:14px;line-height:1.8}.layout-letter h2{font-size:26px}.layout-dedication .page-body{font-size:20px;line-height:2.2}.layout-cover .page-label{font-size:10px}.layout-cover .cover-subtitle{font-size:12px}.layout-story h2{font-size:25px}.layout-story .page-body{font-size:14px}.layout-duo h2{font-size:25px}.layout-duo .page-body{font-size:12px}.layout-quote h2{font-size:27px}.layout-quote .page-body{font-size:14px}.kept-list li p{font-size:17px}.full-caption h2{font-size:30px}.full-caption .page-body{font-size:14px}.page-footer{font-size:9px}.page-label{font-size:10px}.photo-pair figcaption{font-size:10px}.turn-sheet,.turn-sheet.reverse{left:0;width:100%}.turn-face .album-page{padding:12% 9% 10%}.turn-face .layout-cover{padding:10% 8%}.turn-face .layout-full{padding:0}.edge{display:none}.reader-nav{margin-top:20px;gap:8px}.reader-tools{gap:6px;flex-wrap:wrap}.reader-tools select{max-width:165px}.reader-tools>label{font-size:11px}.reader-hint{font-size:10px}.sample-label{font-size:10px}.reader:fullscreen .book-area{max-width:470px}}
@media(max-width:360px){.book-spread{min-height:740px}.album-page h2{font-size:25px}.album-page h1{font-size:36px}}
@media(prefers-reduced-motion:reduce){.turn-sheet{transition:none}*{scroll-behavior:auto}}
@media print{@page{size:180mm 234mm;margin:0}body{background:white}.reader{display:none}.print-pages{display:block}.print-pages .album-page{width:180mm;height:234mm;padding:22mm 18mm;break-after:page;page-break-after:always;print-color-adjust:exact;-webkit-print-color-adjust:exact}.print-pages .album-page:last-child{break-after:auto}.print-pages .layout-full{padding:0}.print-pages .album-page h1{font-size:40pt}.print-pages .album-page h2{font-size:25pt}.print-pages .page-body{font-size:12pt}.print-pages .layout-letter .page-body{font-size:11pt}.print-pages .layout-dedication .page-body{font-size:18pt}}
