@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@400;500;600&family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,500;0,600;0,700;1,500;1,600&display=swap');
@import url('book-engine.css');
@import url('album-pages.css?v=20261014-date-wheel');
@import url('scrollbar.css');
@import url('album-luck-weather.css');

:root{--reader-wine:#651429;--reader-paper:#f4ecdc;--reader-ink:#35262a;--reader-gold:#bc9a5b;--reader-serif:'Playfair Display',Georgia,serif;--reader-sans:'DM Sans',Arial,sans-serif;--reader-hand:'Caveat',cursive}
.album-recipient-body{margin:0;background:#eee5da;color:var(--reader-ink);font-family:var(--reader-sans);min-height:100dvh;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 300 300' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.065' filter='url(%23n)'/%3E%3C/svg%3E")}
.recipient-topbar{max-width:1120px;margin:0 auto;padding:19px 28px;display:flex;align-items:center;justify-content:space-between;gap:16px}.recipient-brand{display:flex;align-items:center;gap:8px;color:#4b2430;text-decoration:none;font:600 20px var(--reader-serif)}.recipient-brand img{width:34px;height:30px}.recipient-topbar>a:last-child{font:500 12px var(--reader-sans);color:#6e3c49;text-underline-offset:4px}.album-local-note{margin:8px auto 24px;max-width:700px;padding:0 20px;text-align:center;font-size:11px;line-height:1.7;color:#765d54}.album-local-note a{color:inherit;text-underline-offset:3px}
.album-reader{--reader-page-height:min(640px,calc(100dvh - 230px));box-sizing:border-box;max-width:1120px;margin:0 auto;color:var(--reader-ink);font-family:var(--reader-sans);position:relative;isolation:isolate}
.album-reader *,.album-reader *:before,.album-reader *:after{box-sizing:border-box}.album-reader [hidden]{display:none!important}.album-reader button,.album-reader select{font:inherit;cursor:pointer}.album-reader button:focus-visible,.album-reader select:focus-visible,.album-reader input:focus-visible,.album-reader canvas:focus-visible{outline:3px solid #e6bd71;outline-offset:3px}.album-reader button:disabled{cursor:default;opacity:.35}.album-reader button{touch-action:manipulation}.reader-sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.album-reader-heading{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:12px 35px 18px}.album-reader-kicker{font-size:9px;letter-spacing:2.2px;color:#8b675d;display:block}.album-reader-heading h2{margin:5px 0 0;font:italic 500 25px var(--reader-serif);letter-spacing:-.5px}.album-reader-heading h2 span{display:block;margin-top:6px;font:400 11px var(--reader-sans);letter-spacing:0;color:#8a6d61}.album-reader-tools{display:flex;align-items:center;gap:8px}.album-chapter-picker select{width:180px;padding:10px 30px 10px 12px;border:1px solid #cdb8a7;border-radius:5px;background:#f7f1e8;color:#664238;font-size:11px}.reader-tool{width:38px;height:38px;border:1px solid #cdb8a7;border-radius:5px;background:#f7f1e8;color:#664238;font-size:23px!important;display:grid;place-items:center}
.album-desk{height:calc(var(--reader-page-height) + 40px);min-height:350px;padding:20px 34px;position:relative;display:grid;place-items:center;overflow:hidden;border-radius:12px;background:#ad8060;background-image:linear-gradient(110deg,#e7ccae55,#9c6c4450 48%,#68412255),repeating-linear-gradient(2deg,#51301908 0 1px,transparent 1px 6px, #efe0ca09 7px 8px,transparent 8px 14px),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 900 700'%3E%3Cfilter id='grain'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.006 .16' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='900' height='700' filter='url(%23grain)' opacity='.25'/%3E%3C/svg%3E");box-shadow:inset 0 0 90px #42291135,0 14px 35px #38281912}
.album-book-mount{width:100%;height:var(--reader-page-height);min-height:310px;position:relative;z-index:2;filter:drop-shadow(5px 15px 14px #27150f50)}
.desk-polaroid{position:absolute;width:140px;height:177px;padding:9px 9px 31px;background:#f6efdf;box-shadow:2px 7px 14px #20130a50;top:24%;pointer-events:none}.desk-polaroid img{width:100%;height:100%;object-fit:cover;display:block;filter:sepia(.15)}.desk-polaroid-left{left:6px;transform:rotate(-14deg)}.desk-polaroid-right{right:5px;top:48%;transform:rotate(13deg)}.desk-sprig{position:absolute;left:16px;bottom:1px;font-size:120px;color:#573e21;transform:rotate(-26deg);text-shadow:0 2px 2px #0003;pointer-events:none}
.reader-navigation{display:flex;align-items:center;justify-content:center;gap:30px;margin:15px 0 0}.reader-navigation button{border:0;background:transparent;color:#5f263a;font-size:22px;display:flex;align-items:center;gap:10px;min-width:105px;min-height:42px;justify-content:center}.reader-navigation button span{font-size:11px}.reader-navigation p{font-size:11px;color:#80685b;min-width:135px;text-align:center;margin:0}.reader-hint{margin:0 18px 12px;text-align:center;font-size:10px;line-height:1.5;color:#8b7263}
.album-reader:fullscreen{max-width:none;width:100%;padding:15px 3vw;background:#ece3d6;--reader-page-height:min(760px,calc(100dvh - 175px))}.album-reader:fullscreen .album-desk{max-width:1320px;margin:auto}
#wizard-preview.book-preview{max-width:1140px;width:calc(100vw - 28px);max-height:96dvh;padding:18px;background:#ede3d6;border:1px solid #cdb8a7;border-radius:12px;overflow:auto}#wizard-preview.book-preview .viewer-label{margin:0 36px 5px;text-align:left;font-size:9px;letter-spacing:1.3px;color:#795b51}#wizard-preview.book-preview .close{z-index:20;background:#f7efe5;color:#63313e;right:12px;top:10px}#wizard-preview.book-preview #preview-content{margin:0;background:transparent}#wizard-preview.book-preview .album-reader{--reader-page-height:min(640px,calc(100dvh - 250px))}#wizard-preview.book-preview .album-reader-heading{padding:9px 14px 15px}#wizard-preview.book-preview .album-desk{border-radius:7px}#wizard-preview.book-preview .preview-nav{margin:10px auto 0;max-width:330px;color:#703749}#wizard-preview.book-preview .preview-nav button{background:transparent;border:0;color:#703749;width:48px;height:42px;box-shadow:none}#wizard-preview.book-preview .preview-note{font-size:10px;margin:4px 0;color:#856a5c}#wizard-preview.book-preview #preview-count{font-size:11px}
@media(min-width:900px){.album-recipient-body .album-reader{padding:0 28px}.album-reader-heading{padding-left:16px;padding-right:16px}}
@media(max-width:700px){.recipient-topbar{padding:13px 20px}.recipient-brand{font-size:18px}.recipient-topbar>a:last-child{font-size:10px}.album-reader{--reader-page-height:min(660px,calc(100dvh - 245px));padding:0 12px}.album-reader-heading{padding:10px 5px 15px;gap:8px}.album-reader-kicker{font-size:7px;letter-spacing:1.5px}.album-reader-heading h2{font-size:23px}.album-reader-heading h2 span{font-size:10px}.album-reader-tools{gap:5px}.album-chapter-picker select{width:120px;font-size:10px;padding-left:9px}.reader-tool{width:32px;height:35px}.album-desk{padding:20px 8px;border-radius:7px}.desk-polaroid{width:100px;height:127px;opacity:.8}.desk-sprig{font-size:90px;left:-18px}.reader-navigation{gap:10px;margin-top:8px}.reader-navigation button{min-width:70px}.reader-navigation p{min-width:115px;font-size:10px}.reader-navigation button span{display:none}.reader-hint{font-size:9px}.album-local-note{font-size:10px;margin-top:6px}#wizard-preview.book-preview{width:calc(100vw - 12px);padding:12px 5px;border-radius:7px}#wizard-preview.book-preview .album-reader{padding:0 4px;--reader-page-height:min(660px,calc(100dvh - 245px))}#wizard-preview.book-preview .album-reader-heading{padding:10px 4px 14px}#wizard-preview.book-preview .album-desk{padding:18px 4px}#wizard-preview.book-preview .viewer-label{font-size:7px;margin:0 35px 5px 10px}.album-reader:fullscreen{padding:6px 10px;--reader-page-height:min(740px,calc(100dvh - 145px))}}
@media(prefers-reduced-motion:reduce){.album-reader *, .album-reader *:before,.album-reader *:after{animation-duration:.001ms!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}
/* Keep personal names inside the heading alongside the chapter controls. */
.album-reader-heading>div:first-child{min-width:0;flex:1}
.album-reader-heading h2{overflow-wrap:anywhere}
.album-reader-tools{flex-shrink:0}
.album-chapter-picker select:hover,.reader-tool:hover{border-color:var(--reader-wine)}
.reader-tool:active,.reader-navigation button:active{transform:translateY(1px)}
.reader-navigation p,#wizard-preview.book-preview #preview-count{max-width:38ch;overflow-wrap:anywhere}
.reader-navigation button:hover:enabled{color:var(--reader-wine);background:#f7f1e8;border-radius:5px}
.album-recipient-body a:focus-visible{outline:3px solid var(--reader-wine);outline-offset:4px}
.recipient-brand img.brand-logo-img{width:auto;height:34px;object-fit:contain}

/* The song control lives at the top of the album, like the retrospective. Turning pages never stops it. */
.recipient-topbar .album-sound{position:static;margin:0 auto;box-shadow:0 4px 14px #4a222c14;min-height:42px;max-width:min(320px,46vw);padding:4px 16px 4px 4px}
.recipient-topbar .album-sound span{width:32px;height:32px;font-size:13px}
.recipient-topbar .album-sound small:before{content:'Our song · ';font-weight:500;color:#9a7a72}
.recipient-topbar .album-sound.is-playing small:before{content:'Playing · '}
@media(max-width:700px){.recipient-topbar{flex-wrap:wrap;row-gap:10px}.recipient-topbar .album-sound{order:3;flex:1 1 100%;max-width:none;margin:0}.recipient-topbar .album-sound small{font-size:12px}}
/* Shown only when the browser held the song back (iOS needs a direct tap): one small line under the bar. */
.album-sound-hint{order:4;flex:1 1 100%;margin:0;text-align:center;font-size:12px;line-height:1.4;color:#8a5a5e}
.recipient-topbar:has(.album-sound-hint:not([hidden])){flex-wrap:wrap;row-gap:6px}
.album-sound-hint[hidden]{display:none}
