@import url("vendor/gift-box.css");
/* v27 occasion objects and model-specific reading share the same editable nodes. */
.piece-page[data-reader][data-theme-scene]{display:block;max-width:1440px;width:100%;margin:0 auto;padding:40px 24px;background:var(--portal-bg);color:var(--portal-ink);text-align:left;overflow:visible}
.piece-page[data-reader] .occasion-scene{--theme-line:color-mix(in srgb,var(--portal-ink) 24%,var(--portal-bg));--theme-paper:var(--portal-bg);position:relative;isolation:isolate;color:var(--portal-ink);background:var(--theme-paper);margin:0 auto 56px;width:100%;max-width:680px;text-align:center;perspective:1400px}
.piece-page[data-reader] .wedding-invitation{position:relative;min-height:650px;padding:50px 48px 38px;border:1px solid var(--theme-line);outline:1px solid var(--theme-line);outline-offset:-10px;box-shadow:inset 0 0 0 3px color-mix(in srgb,var(--portal-ink) 3%,var(--portal-bg)),inset 0 1px 1px color-mix(in srgb,var(--portal-bg) 92%,white),0 12px 28px -24px color-mix(in srgb,var(--portal-ink) 50%,transparent);background:repeating-linear-gradient(0deg,transparent 0 3px,color-mix(in srgb,var(--portal-ink) 1.5%,transparent) 3px 4px);display:flex;flex-direction:column;align-items:center;gap:20px}
.piece-page[data-reader] .wedding-arch{position:absolute;inset:24px 28px;border:1px solid var(--theme-line);border-radius:46% 46% 0 0/27% 27% 0 0;pointer-events:none;z-index:-1}
.piece-page[data-reader] .occasion-scene .portal-wordmark{position:static;display:block;width:auto;max-width:100%;margin:0;padding:0;border:0;background:none;color:var(--portal-ink);font:500 22px/1.3 var(--serif);text-align:center;grid-area:auto}
.piece-page[data-reader] .occasion-scene .brand-initials{display:none}
.piece-page[data-reader] .occasion-scene .brand-name{position:static;display:block;width:auto;max-width:none;font:inherit;color:inherit;background:none}
.piece-page[data-reader] .occasion-scene .piece-title{display:block;grid-area:auto;width:100%;max-width:18ch;margin:0;padding:0;text-align:center;color:var(--portal-ink);background:none;font:500 52px/1.03 var(--serif);letter-spacing:-.03em}
.piece-page[data-reader] .occasion-scene .piece-occasion-title{font:inherit;color:inherit;line-height:inherit;letter-spacing:inherit;margin:0}
.piece-page[data-reader] .occasion-scene .piece-object-name{display:block;font:400 15px/1.5 var(--sans);letter-spacing:0;margin:14px 0 0;color:var(--portal-sub)}
.piece-page[data-reader] .occasion-scene .piece-recipient{font:400 18px/1.4 var(--serif);margin-top:12px}
.piece-page[data-reader] .occasion-scene .piece-occasion-date{font:400 20px/1.4 var(--serif);margin:0;padding:0;border:0;border-radius:0;color:var(--portal-ink);background:none}
.piece-page[data-reader] .theme-portrait{width:220px;height:250px;max-width:100%;position:relative;border-radius:50% 50% 48% 48%;border:1px solid var(--theme-line);padding:7px;box-shadow:inset 0 0 0 3px var(--portal-soft),0 1px 1px color-mix(in srgb,var(--portal-ink) 12%,transparent)}
/* Scene dimensions belong to the occasion; model photo ratios stay in model reading. */
.piece-page[data-reader]:is([data-theme-scene],[data-theme-book]) .occasion-scene .theme-portrait>.piece-media{display:block;position:relative;grid-area:auto;align-self:auto;justify-self:auto;inset:auto;margin:0;width:100%;min-width:0;max-width:100%;height:100%;min-height:0;max-height:100%;aspect-ratio:auto;border-radius:inherit;overflow:clip;background:var(--piece-photo-bg);padding:0}
.piece-page[data-reader]:is([data-theme-scene],[data-theme-book]) .occasion-scene .theme-portrait .piece-photo-rail{display:flex;flex-direction:row;position:relative;grid-area:auto;inset:auto;width:100%;min-width:0;max-width:100%;height:100%;min-height:0;max-height:100%;aspect-ratio:auto;margin:0;padding:0;overflow-x:auto;overflow-y:hidden;overscroll-behavior:auto;align-items:stretch}
.piece-page[data-reader]:is([data-theme-scene],[data-theme-book]) .occasion-scene .theme-portrait .piece-photo-slide{height:100%;min-height:0;max-height:100%;width:100%;min-width:100%;max-width:100%;flex:0 0 100%;position:relative;grid-area:auto;inset:auto;aspect-ratio:auto;margin:0;padding:0}
.piece-page[data-reader]:is([data-theme-scene],[data-theme-book]) .occasion-scene .theme-portrait .piece-photo-slide img{position:absolute;inset:0;width:100%;height:100%;min-width:0;min-height:0;max-width:100%;max-height:100%;margin:0;padding:0;object-fit:contain;transform:scale(var(--detail-scale,1));filter:none}
.piece-page[data-reader] .occasion-scene .piece-photo-rail[hidden]{display:flex}
.piece-page[data-reader] .occasion-scene :is(.piece-collage,.piece-photo-thumbnails,.piece-photo-controls,.piece-open-photo){display:none}
.piece-page[data-reader] .theme-action{min-height:46px;border:1px solid var(--portal-accent);border-radius:0;background:var(--portal-bg);color:var(--portal-accent);padding:12px 24px;font:500 15px/1.4 var(--sans);cursor:pointer;position:relative;z-index:2}
.piece-page[data-reader] .theme-action:hover{background:var(--portal-soft)}
.piece-page[data-reader] .theme-action:focus-visible{outline:3px solid var(--portal-accent);outline-offset:4px}
.piece-page[data-reader] .wedding-letter{position:relative;margin:0 auto;padding:30px 40px;max-width:600px;background:var(--portal-soft);box-shadow:0 9px 18px -14px color-mix(in srgb,var(--portal-ink) 40%,transparent);border:1px solid var(--theme-line);border-top:0;transform-origin:top}
.piece-page[data-reader] .wedding-letter[hidden]{display:none}
.piece-page[data-reader] .wedding-letter .piece-section-dedication{padding:0;margin:0;border:0;width:100%;max-width:none;background:none;color:var(--portal-ink);text-align:center}
.piece-page[data-reader] .wedding-letter .piece-section-title{position:absolute;width:1px;height:1px;overflow:clip;clip-path:inset(50%);white-space:nowrap}
.piece-page[data-reader] .wedding-letter .piece-section-dedication p{font:400 26px/1.5 var(--serif);white-space:pre-wrap;margin:0 0 20px;color:var(--portal-ink)}
.piece-page[data-reader] .wedding-letter .piece-gift-from{font:500 15px/1.5 var(--sans);margin:0}
.wedding-doors{position:absolute;inset:0 0 auto;height:100%;pointer-events:none;z-index:3;perspective:1400px;overflow:visible}
.wedding-door{position:absolute;top:0;bottom:0;width:50%;background:linear-gradient(100deg,var(--portal-soft),var(--portal-bg) 75%);border:1px solid var(--theme-line);backface-visibility:hidden;box-shadow:inset 0 0 0 9px var(--portal-bg),inset 0 0 0 10px var(--theme-line),0 3px 6px color-mix(in srgb,var(--portal-ink) 8%,transparent)}
.wedding-door:after{content:'';position:absolute;inset:28px 18px;border:1px solid var(--theme-line);border-radius:48% 48% 0 0/30% 30% 0 0;box-shadow:inset 1px 0 1px color-mix(in srgb,var(--portal-bg) 75%,white)}
.wedding-door-left{left:0;transform-origin:left center}.wedding-door-right{right:0;transform-origin:right center}
.occasion-scene[data-entry-state=open] .wedding-doors{display:none}
.piece-page[data-reader]>.theme-model-content{margin:0 auto;padding:32px 0 0;width:100%;max-width:1100px;border-top:1px solid var(--piece-border);background:var(--portal-bg);color:var(--portal-ink)}
.piece-page[data-reader] .theme-model-content .theme-reading-hero{display:block;max-width:760px;margin:auto;padding:0}
.piece-page[data-reader] .theme-model-content .theme-reading-hero>.piece-identity{display:block;grid-area:auto;min-width:0;width:100%;padding:0}
.piece-page[data-reader] .theme-model-content .theme-reading-frame{display:block;max-width:760px;margin:auto}
.piece-page[data-reader] .theme-model-content .theme-reading-frame>.piece-identity{display:block;width:100%;padding:28px}
.piece-page[data-reader]>.theme-model-content[data-style=journal]{padding-inline:20%;text-align:left}
.piece-page[data-reader]>.theme-model-content[data-style=specimen]{display:block;padding-inline:4%}
.piece-page[data-reader]>.theme-model-content[data-style=catalog]{display:block;padding-inline:4%}
.piece-page[data-reader]>.theme-model-content[data-style=frame]{display:block;background:var(--portal-bg)}
.piece-page[data-reader]>.theme-model-content>.piece-index{max-width:760px;margin:0 auto 28px;grid-area:auto}
.piece-page[data-reader]>.theme-model-content>.piece-section-story{grid-area:auto;max-width:760px;margin:0 auto 28px}
.piece-page[data-reader][data-theme-book] .book-cover .piece-hero{display:block;height:100%;padding:0;overflow:clip}
.piece-page[data-reader][data-theme-book] .book-cover .occasion-scene{max-width:none;margin:0;height:100%}
.piece-page[data-reader][data-theme-book] .book-cover .wedding-invitation{height:100%;min-height:0;padding:20px 22px;gap:12px}
.piece-page[data-reader][data-theme-book] .book-cover .wedding-arch{inset:16px}
.piece-page[data-reader][data-theme-book] .book-cover .piece-title{font-size:30px}
.piece-page[data-reader][data-theme-book] .book-cover .theme-portrait{height:150px;width:132px;flex:1 1 0;min-height:100px}
.piece-page[data-reader][data-theme-book] .book-cover .piece-occasion-date{font-size:16px}
@container piece-frame (max-width:620px){
 .piece-page[data-reader][data-theme-scene]{padding:24px 16px}
 .piece-page[data-reader] .wedding-invitation{min-height:0;padding:38px 24px 28px;gap:18px}
 .piece-page[data-reader] .wedding-arch{inset:20px}
 .piece-page[data-reader] .occasion-scene .piece-title{font-size:32px;max-width:18ch}
 .piece-page[data-reader] .theme-portrait{width:190px;height:210px}
 .piece-page[data-reader] .occasion-scene .piece-occasion-date{font-size:16px}
 .piece-page[data-reader] .wedding-letter{padding:24px}
 .piece-page[data-reader] .wedding-letter .piece-section-dedication p{font-size:23px}
 .piece-page[data-reader]>.theme-model-content{padding-top:24px}
 .piece-page[data-reader]>.theme-model-content[data-style=journal]{padding-inline:0}
}
@media(prefers-reduced-motion:reduce){.wedding-doors{display:none}.occasion-scene *{scroll-behavior:auto}}

.piece-page[data-reader] .wedding-arch{border:0;border-radius:0;inset:18px;z-index:-1}
.wedding-arch-line{position:absolute;inset:calc(var(--arch-step)*7px);border:1px solid color-mix(in srgb,var(--portal-ink) 13%,var(--portal-bg));border-radius:48% 48% 0 0/32% 32% 0 0;box-shadow:inset 1px 1px 1px color-mix(in srgb,var(--portal-bg) 94%,white),1px 1px 1px color-mix(in srgb,var(--portal-ink) 9%,transparent)}
.piece-page[data-reader] .wedding-invitation{padding-top:62px;padding-bottom:44px;isolation:isolate}
@container piece-frame (max-width:620px){.piece-page[data-reader] .wedding-invitation{padding:52px 24px 32px}.wedding-arch-line{inset:calc(var(--arch-step)*5px)}}

.piece-page[data-reader] .theme-photo-actions{display:flex;flex-direction:column;align-items:center;gap:12px;width:100%;max-width:320px}
.piece-page[data-reader] .theme-photo-actions :is(.piece-photo-controls,.piece-photo-thumbnails){display:flex;position:static;transform:none;inset:auto;margin:0;width:100%;justify-content:center;gap:10px;background:var(--portal-bg);color:var(--portal-ink)}
.piece-page[data-reader] .theme-photo-actions .piece-photo-controls button{width:44px;height:44px;min-height:44px;border:1px solid var(--piece-border);background:var(--portal-bg);color:var(--portal-accent)}
.piece-page[data-reader] .theme-photo-actions .piece-photo-controls span{position:static;display:flex;align-items:center;background:var(--portal-bg);color:var(--portal-ink);font:14px/1.3 var(--sans)}
.piece-page[data-reader] .theme-photo-actions .piece-photo-thumb{width:52px;height:56px;border:1px solid var(--piece-border);padding:3px;background:var(--piece-photo-bg)}
.piece-page[data-reader] .theme-photo-actions img{width:100%;height:100%;object-fit:contain;position:static}
.piece-page[data-reader] .theme-photo-actions .piece-photo-thumb[aria-current=true]{outline:2px solid var(--portal-accent);outline-offset:2px}
.piece-page[data-reader] .theme-photo-actions .piece-open-photo{display:block;position:static;min-height:44px;border:1px solid var(--piece-border);background:var(--portal-bg);color:var(--portal-accent);padding:10px 20px;font:15px/1.4 var(--sans)}
.piece-page[data-reader] .theme-photo-actions .theme-photo-choices{display:flex;gap:10px;position:static;height:auto;min-height:0;padding:0;background:none;transform:none}
.piece-page[data-reader] .theme-photo-actions .theme-photo-choices button{display:flex;flex-direction:column;position:static;width:64px;height:auto;min-height:72px;transform:none;border:1px solid var(--piece-border);padding:4px;background:var(--piece-photo-bg)}
.piece-page[data-reader] .theme-photo-actions .theme-photo-choices img{height:48px;transform:none}
.piece-page[data-reader] .theme-photo-actions .theme-photo-choices span{position:static;background:var(--portal-bg);color:var(--portal-ink);font:11px/1.3 var(--sans);padding:3px 0;transform:none}

.piece-page[data-reader] .occasion-scene .theme-portrait figcaption{display:none}
.piece-page[data-reader] .theme-photo-actions :is(.piece-photo-thumbnails,.piece-photo-controls){height:auto;min-height:0;max-height:none;flex-direction:row;align-items:center;padding:0;flex:0 0 auto}
.piece-page[data-reader] .theme-photo-actions .piece-photo-thumbnails{height:64px}
.piece-page[data-reader] .theme-portrait .piece-photo-slide[data-detail=crop] img{transform:scale(var(--detail-scale,1.8))}

.piece-page[data-reader]>.theme-model-content{border-top:0;padding-top:0}

.piece-page[data-reader] .occasion-scene :is(.portal-wordmark,.piece-title,.brand-name,.piece-section-dedication){--portal-bg:var(--piece-base-bg);--portal-ink:var(--piece-base-text);--portal-sub:var(--piece-base-text);background:transparent;color:var(--piece-base-text)}
/* Birthday: date poster and a single orbit around the real piece. */
.piece-page[data-reader] .occasion-birthday{max-width:1040px;padding:40px 0;text-align:left;border-block:1px solid var(--piece-border)}
.birthday-poster{display:grid;grid-template-columns:1fr 1.05fr;gap:40px;align-items:center}
.piece-page[data-reader] .birthday-words{display:flex;align-items:flex-start;flex-direction:column;gap:28px}
.piece-page[data-reader] .birthday-words .piece-title{text-align:left;font-size:56px;max-width:12ch}
.piece-page[data-reader] .birthday-words .portal-wordmark{text-align:left}
.piece-page[data-reader] .birthday-words .piece-occasion-date{display:flex;flex-direction:column;font-family:var(--sans);padding-left:18px;border-left:2px solid var(--portal-accent)}
.birthday-day{font-size:96px;line-height:.95;font-weight:500;letter-spacing:-.07em}.birthday-month{font-size:17px;line-height:1.6;margin-top:10px}
.birthday-plinth{position:relative;aspect-ratio:1;display:grid;place-items:center;border-radius:50%;background:radial-gradient(ellipse at 50% 56%,var(--portal-soft) 50%,transparent 50.4%);isolation:isolate}
.piece-page[data-reader] .birthday-plinth .theme-portrait{width:80%;height:86%;max-width:none;border:0;border-radius:0;padding:0;box-shadow:none}
.piece-page[data-reader] .birthday-plinth .piece-media{background:transparent;overflow:clip}
.birthday-orbit{position:absolute;inset:0;width:100%;height:100%;color:var(--portal-accent);transform:rotate(-12deg);z-index:-1}
.birthday-message{max-width:820px;margin:40px auto 0;border-top:1px solid var(--piece-border);padding:24px 0 0}
.piece-page[data-reader] .birthday-message .piece-section-dedication{border:0;padding:0;margin:0;max-width:none;text-align:left}
.piece-page[data-reader] .birthday-message .piece-section-title{font:500 15px/1.5 var(--sans);margin:0 0 10px}
.piece-page[data-reader] .birthday-message p{font:26px/1.5 var(--serif);margin:0 0 12px;white-space:pre-wrap}
/* Gift: paper lid and crossed ribbon open to the original photograph. */
.piece-page[data-reader] .occasion-gift{max-width:900px;padding:24px 0 32px}
.gift-heading{display:flex;flex-direction:column;align-items:center;gap:20px;margin-bottom:36px}
.gift-box{height:340px;width:80%;max-width:680px;margin:0 auto;position:relative;background:var(--portal-soft);border:1px solid var(--piece-border);box-shadow:0 18px 26px -24px var(--portal-ink),inset 0 0 0 8px color-mix(in srgb,var(--portal-ink) 4%,var(--portal-bg));perspective:1200px}
.piece-page[data-reader] .gift-box .theme-portrait{height:100%;width:100%;border-radius:0;border:0;padding:18px;box-shadow:none}
.piece-page[data-reader] .gift-box .piece-media{background:transparent}
.gift-lid{position:absolute;inset:-3px;background:repeating-linear-gradient(90deg,var(--portal-bg) 0 3px,var(--portal-soft) 3px 4px);border:1px solid var(--piece-border);box-shadow:inset 0 0 0 12px var(--portal-bg),inset 0 0 0 13px var(--piece-border),0 4px 6px color-mix(in srgb,var(--portal-ink) 14%,transparent);transform-origin:top center;pointer-events:none;z-index:2}
.gift-ribbon{position:absolute;inset:0;pointer-events:none;z-index:3;background:linear-gradient(90deg,transparent 43%,var(--portal-accent) 43% 47%,color-mix(in srgb,var(--portal-accent) 75%,var(--portal-bg)) 47% 53%,var(--portal-accent) 53% 57%,transparent 57%),linear-gradient(0deg,transparent 44%,var(--portal-accent) 44% 56%,transparent 56%)}
.gift-ribbon:before,.gift-ribbon:after{content:'';position:absolute;left:calc(50% - 52px);top:calc(50% - 30px);width:52px;height:34px;border:9px solid var(--portal-accent);border-radius:70% 20% 70% 30%;transform:rotate(20deg);box-shadow:1px 1px 2px color-mix(in srgb,var(--portal-ink) 15%,transparent)}
.gift-ribbon:after{left:50%;transform:rotate(160deg)}
.occasion-gift[data-gift-state=open] :is(.gift-lid,.gift-ribbon){opacity:0;pointer-events:none}
.gift-tag{display:inline-flex;flex-direction:column;text-align:left;padding:14px 28px;margin:24px;border-left:2px solid var(--portal-accent);background:var(--portal-soft);transform:rotate(-2deg)}
.gift-tag p{font:17px/1.5 var(--serif);margin:0}.gift-tag .gift-from{font:14px/1.5 var(--sans)}
.piece-page[data-reader] .occasion-gift>.theme-action{display:block;margin:0 auto 24px}
/* Promise: a horizontal envelope, margin date and a letter sliding from the flap. */
.piece-page[data-reader] .occasion-promise{display:grid;grid-template-columns:130px minmax(0,1fr);max-width:1000px;gap:20px 36px;text-align:left;padding:50px 0 0}
.promise-date{padding:20px 16px 0 0;border-right:1px solid var(--piece-border)}
.piece-page[data-reader] .promise-date .piece-occasion-date{font:20px/1.6 var(--serif);text-align:left;max-width:7ch}
.promise-envelope{position:relative;min-width:0;max-width:100%;box-sizing:border-box;margin:54px 0 20px;padding:22px;background:var(--portal-soft);box-shadow:0 12px 22px -20px var(--portal-ink);isolation:isolate;border:1px solid var(--piece-border);perspective:1000px;overflow:clip}
.promise-envelope:before,.promise-envelope:after{content:'';position:absolute;bottom:0;width:50%;height:45%;background:var(--portal-soft);border-top:1px solid var(--piece-border);z-index:2;pointer-events:none}
.promise-envelope:before{left:0;clip-path:polygon(0 0,100% 100%,0 100%)}.promise-envelope:after{right:0;clip-path:polygon(100% 0,100% 100%,0 100%)}
.promise-flap{position:absolute;inset:0 0 auto;height:160px;background:var(--portal-soft);clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:top;filter:drop-shadow(0 1px 1px var(--piece-border));z-index:3;pointer-events:none}
.promise-paper{position:relative;min-width:0;max-width:100%;box-sizing:border-box;padding:38px 34px;background:var(--portal-bg);min-height:240px;border:1px solid var(--piece-border);overflow-wrap:break-word}
.promise-heading{display:flex;flex-direction:column;align-items:flex-start;gap:22px;margin-bottom:30px}
.piece-page[data-reader] .promise-heading .piece-title{text-align:left;font-size:42px;max-width:none}
.piece-page[data-reader] .promise-heading .portal-wordmark{text-align:left;font-size:19px}
.piece-page[data-reader] .occasion-promise .wedding-letter{margin:0;padding:0;max-width:none;background:none;box-shadow:none;border:0}
.piece-page[data-reader] .occasion-promise .wedding-letter .piece-section-dedication{text-align:left;border-left:0}
.piece-page[data-reader] .occasion-promise .wedding-letter p{font-size:28px;line-height:1.55;text-align:left}
.piece-page[data-reader] .occasion-promise .theme-portrait{width:116px;height:116px;border-radius:50%;margin:-25px 20px 0 auto;position:relative;z-index:4;padding:4px;background:var(--portal-bg)}
.occasion-promise[data-promise-state=sealed] .promise-paper{max-height:none;overflow:visible}
.occasion-promise[data-promise-state=open] .promise-flap{transform:rotateX(-175deg);z-index:-1}
.piece-page[data-reader] .occasion-promise>.theme-action{grid-column:2;justify-self:start;margin-left:22px}
.piece-page[data-reader] .occasion-promise>.theme-photo-actions{grid-column:2;margin:auto}
/* Anniversary: dated album sheet and photographic memories, not invented milestones. */
.piece-page[data-reader] .occasion-anniversary{max-width:920px;padding:24px 28px 40px;border-block:1px solid var(--piece-border)}
.anniversary-heading{display:flex;flex-direction:column;align-items:center;gap:18px;margin-bottom:34px}
.piece-page[data-reader] .anniversary-heading .piece-occasion-date{order:-1;font:16px/1.4 var(--sans);border-bottom:1px solid var(--piece-border);padding:0 0 12px;min-width:180px}
.anniversary-album{position:relative;max-width:600px;margin:auto;padding:15px 32px 26px;isolation:isolate}
.anniversary-album:before,.anniversary-album:after{content:'';position:absolute;inset:20px 34px 10px;background:var(--portal-soft);border:1px solid var(--piece-border);transform:rotate(4deg);z-index:-1}
.anniversary-album:after{transform:rotate(-3deg);inset:22px 28px 12px}
.anniversary-memory{position:relative;padding:22px 22px 45px;border:1px solid var(--piece-border);background:var(--portal-bg);box-shadow:0 8px 16px -12px var(--portal-ink);transform:rotate(-1.8deg)}
.piece-page[data-reader] .anniversary-memory .theme-portrait{width:100%;height:310px;border:0;border-radius:0;box-shadow:none;padding:0}
.piece-page[data-reader] .anniversary-memory .piece-media{background:var(--piece-photo-bg)}
.piece-page[data-reader] .anniversary-memory .anniversary-leaving{position:absolute;inset:22px 22px 45px;width:auto;height:auto;z-index:3}
.piece-page[data-reader] .occasion-anniversary>.theme-action{margin:24px auto;display:block}
.piece-page[data-reader] .occasion-anniversary .wedding-letter{padding:24px 10px;background:none;box-shadow:none;border:0}
.piece-page[data-reader] .occasion-anniversary .wedding-letter .piece-section-dedication{border:0}
.piece-page[data-reader] .occasion-anniversary .wedding-letter p{font-size:26px}
.piece-page[data-reader] .occasion-scene:not(.occasion-wedding)>.theme-photo-actions{margin:20px auto}
@container piece-frame (max-width:620px){
 .piece-page[data-reader] .occasion-birthday{padding:20px 0}
 .birthday-poster{grid-template-columns:1fr;gap:20px}
 .piece-page[data-reader] .birthday-words{gap:20px}
 .piece-page[data-reader] .birthday-words .piece-title{font-size:40px;max-width:12ch}
 .piece-page[data-reader] .birthday-words .piece-occasion-date{flex-direction:row;align-items:center;gap:16px}
 .birthday-day{font-size:64px}.birthday-month{margin:0;font-size:16px}
 .birthday-plinth{width:100%;max-width:340px;margin:auto}
 .birthday-message{margin-top:24px}.piece-page[data-reader] .birthday-message p{font-size:23px}
 .gift-heading{margin-bottom:26px}.gift-box{width:100%;height:260px}
 .piece-page[data-reader] .occasion-promise{grid-template-columns:1fr;gap:12px;padding-top:20px}
 .promise-date{border-right:0;border-bottom:1px solid var(--piece-border);padding:0 0 12px}
 .piece-page[data-reader] .promise-date .piece-occasion-date{max-width:none;font-size:16px}
 .promise-envelope{margin-top:24px;padding:12px}
 .promise-paper{padding:24px 20px}.promise-flap{height:115px}
 .piece-page[data-reader] .promise-heading .piece-title{font-size:32px}
 .piece-page[data-reader] .occasion-promise .wedding-letter p{font-size:24px}
 .piece-page[data-reader] .occasion-promise>.theme-action,.piece-page[data-reader] .occasion-promise>.theme-photo-actions{grid-column:1;margin-left:0}
 .piece-page[data-reader] .occasion-anniversary{padding:20px 0}
 .anniversary-album{padding:10px 14px 20px}.anniversary-memory{padding:12px 12px 30px}
 .piece-page[data-reader] .anniversary-memory .theme-portrait{height:240px}
 .piece-page[data-reader] .anniversary-memory .anniversary-leaving{inset:12px 12px 30px}
}
/* A selected Book retains its engine and finite cover; thematic material is confined to its actual cover. */
.piece-page[data-reader][data-theme-book] .book-cover .occasion-scene:not(.occasion-wedding){padding:8px 0;margin:0;width:100%;border:0;display:flex;flex-direction:column;gap:8px;overflow:clip}
.piece-page[data-reader][data-theme-book] .book-cover :is(.birthday-poster,.birthday-words,.gift-heading,.promise-heading,.anniversary-heading){display:flex;flex-direction:column;align-items:center;gap:10px;margin:0}
.piece-page[data-reader][data-theme-book] .book-cover .occasion-scene .piece-title{font-size:28px;text-align:center}
.piece-page[data-reader][data-theme-book] .book-cover .birthday-plinth{width:190px;height:190px;aspect-ratio:1}
.piece-page[data-reader][data-theme-book] .book-cover :is(.birthday-day,.birthday-month){font-size:18px}
.piece-page[data-reader][data-theme-book] .book-cover .birthday-words .piece-occasion-date{display:block;padding:0;border:0}
.piece-page[data-reader][data-theme-book] .book-cover .gift-box{width:95%;height:210px;flex:1 1 0}
.piece-page[data-reader][data-theme-book] .book-cover .gift-tag{display:none}
.piece-page[data-reader][data-theme-book] .book-cover .promise-envelope{margin:12px 0 0;padding:10px}
.piece-page[data-reader][data-theme-book] .book-cover .promise-paper{min-height:0;padding:16px}
.piece-page[data-reader][data-theme-book] .book-cover .promise-date{display:none}
.piece-page[data-reader][data-theme-book] .book-cover .anniversary-album{padding:8px 14px 16px;width:100%;flex:1 1 0;min-height:120px}
.piece-page[data-reader][data-theme-book] .book-cover .anniversary-memory{padding:10px 10px 20px;height:100%}
.piece-page[data-reader][data-theme-book] .book-cover .anniversary-memory .theme-portrait{height:100%;width:100%;min-height:120px}
.piece-page[data-reader][data-theme-book] .book-cover .anniversary-heading .piece-occasion-date{font-size:14px;order:0;padding:0}

.piece-page[data-reader] .occasion-gift .wedding-letter .piece-gift-from{display:none}
/* Birthday's calendar and display plinth retain material depth in the resting state. */
.piece-page[data-reader] .occasion-birthday{padding:40px;background:var(--portal-soft);border:1px solid var(--piece-border);box-shadow:0 18px 32px -30px var(--portal-ink)}
.birthday-poster{gap:36px}
.piece-page[data-reader] .birthday-words .piece-occasion-date{position:relative;display:flex;flex-direction:column;align-items:flex-start;min-width:180px;padding:22px 28px 24px;border:1px solid var(--piece-border);background:var(--portal-bg);box-shadow:0 9px 15px -13px var(--portal-ink);transform:rotate(-2deg)}
.birthday-words .piece-occasion-date:after{content:'';position:absolute;top:-1px;right:-1px;width:24px;height:24px;background:linear-gradient(225deg,var(--portal-soft) 49%,var(--piece-border) 50%,var(--portal-bg) 55%);box-shadow:-2px 2px 2px color-mix(in srgb,var(--portal-ink) 8%,transparent)}
.birthday-plinth{background:radial-gradient(ellipse at 50% 48%,var(--portal-bg) 48%,color-mix(in srgb,var(--portal-accent) 10%,var(--portal-bg)) 49% 54%,var(--piece-border) 54.3% 54.6%,var(--portal-bg) 55% 58%,transparent 58.4%);border-radius:50%;box-shadow:inset 0 -18px 22px -24px var(--portal-ink)}
.birthday-plinth:after{content:'';position:absolute;left:15%;bottom:6%;width:70%;height:8%;border-radius:50%;background:color-mix(in srgb,var(--portal-ink) 7%,transparent);filter:blur(9px);z-index:-1}
.piece-page[data-reader] .occasion-birthday .birthday-message{width:100%;max-width:100%;box-sizing:border-box;margin:36px 0 0;padding:24px 28px;background:var(--portal-bg);border:1px solid var(--piece-border)}
.piece-page[data-reader] .birthday-message .piece-section-dedication{border:0;background:none}
.piece-page[data-reader] .birthday-message .piece-section-title{display:none}
/* Envelope gussets occupy their own lower space, never the written letter. */
.promise-envelope{padding-bottom:118px}
.promise-envelope:before,.promise-envelope:after{height:106px;background:linear-gradient(160deg,var(--portal-soft),color-mix(in srgb,var(--portal-ink) 7%,var(--portal-bg)))}
.piece-page[data-reader] .occasion-promise .promise-envelope>.theme-portrait{position:absolute;bottom:16px;right:22px;margin:0}
@container piece-frame (max-width:620px){
 .piece-page[data-reader] .occasion-birthday{padding:24px 20px}
 .piece-page[data-reader] .birthday-words .piece-occasion-date{flex-direction:row;align-items:center;min-width:0;padding:16px 22px;gap:16px}
 .piece-page[data-reader] .occasion-birthday .birthday-message{margin:24px 0 0;padding:18px 16px}
 .promise-envelope{padding-bottom:110px}
}
.piece-page[data-reader][data-theme-book] .book-cover .occasion-birthday{padding:10px;background:none;box-shadow:none}
.piece-page[data-reader][data-theme-book] .book-cover .birthday-words .piece-occasion-date{padding:6px 14px;min-width:0}
.piece-page[data-reader][data-theme-book] .book-cover .birthday-words .piece-occasion-date:after{display:none}
.piece-page[data-reader][data-theme-book] .book-cover .promise-envelope{padding-bottom:104px}
.piece-page[data-reader] .theme-photo-actions:empty{display:none}
.promise-date{position:relative;z-index:5;background:var(--portal-bg)}
.piece-page[data-reader][data-theme-book] .book-cover .promise-date{display:block;margin:0;padding:0;border:0;z-index:5}
.piece-page[data-reader][data-theme-book] .book-cover .promise-date .piece-occasion-date{font:14px/1.4 var(--sans);max-width:none}
/* Real photo selection needs a scrollable horizontal rail; vertical wheel remains unclaimed. */
.piece-page[data-reader] .occasion-scene .piece-photo-rail{overflow-x:auto;overflow-y:hidden;overscroll-behavior:auto;scrollbar-width:none}
.piece-page[data-reader] .occasion-scene .piece-photo-rail::-webkit-scrollbar{display:none}
/* The promise's identity remains readable in front of the sealed flap. */
.promise-heading{position:relative;z-index:4}
/* On the finite Book cover the promise seal has its own space below the identity. */
.piece-page[data-reader][data-theme-book] .book-cover .promise-envelope{display:flex;flex-direction:column;align-items:center;padding-bottom:12px}
.piece-page[data-reader][data-theme-book] .book-cover .promise-envelope>.theme-portrait{position:relative;inset:auto;width:84px;height:84px;min-height:0;max-height:84px;margin:12px auto 0;flex:0 0 84px}
.piece-page[data-reader][data-theme-book] .book-cover .promise-heading .piece-title{font-size:26px}
.piece-page[data-reader][data-theme-scene]{border:0;border-radius:0;box-shadow:none}
/* v28: the thematic object and its reading no longer inherit a product's empty photo grid. */
.piece-page[data-reader][data-theme-scene]>.theme-model-content{display:block;grid-template-columns:none;width:min(100%,760px);min-width:0;max-width:760px;margin:0 auto;padding:0;border:0;background:var(--portal-bg);color:var(--portal-ink);text-align:left}
.piece-page[data-reader][data-theme-scene]>.theme-model-content>.piece-section{display:block;grid-area:auto;width:100%;min-width:0;max-width:none;margin:0;padding:28px 0;border:0;border-top:1px solid var(--piece-border);background:none}
.piece-page[data-reader][data-theme-scene]>.theme-model-content>.piece-section>.piece-section-title{display:block;position:static;clip-path:none;width:auto;height:auto;margin:0 0 16px;font:500 23px/1.3 var(--sans);color:var(--portal-ink)}
.piece-page[data-reader][data-theme-scene]>.theme-model-content>.piece-section p{grid-column:auto;margin:0 0 12px;font:18px/1.65 var(--sans);max-width:75ch;color:var(--portal-ink);white-space:pre-wrap}
.piece-page[data-reader][data-theme-scene]>.theme-model-content>.example-caption{display:block;grid-area:auto;margin:20px 0 0;max-width:none;font:13px/1.5 var(--sans);color:var(--portal-sub);text-align:left}
.piece-page[data-reader][data-theme-scene]>.theme-model-content[data-style=journal]{max-width:620px;width:min(100%,620px);padding:0}
.piece-page[data-reader][data-theme-scene]>.theme-model-content[data-style=cover]{max-width:680px;width:min(100%,680px)}
.piece-page[data-reader][data-theme-scene]>.theme-model-content:is([data-style=journal],[data-style=cover])>.piece-section-story p{font:28px/1.5 var(--serif)}
.piece-page[data-reader][data-theme-scene]>.theme-model-content:is([data-style=nocturne],[data-style=diptych],[data-style=catalog]){max-width:900px;width:min(100%,900px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 32px}
.piece-page[data-reader][data-theme-scene]>.theme-model-content:is([data-style=nocturne],[data-style=diptych],[data-style=catalog])>.piece-section:not(.piece-section-material):not(.piece-section-care){grid-column:1/-1}
.piece-page[data-reader][data-theme-scene]>.theme-model-content:is([data-style=nocturne],[data-style=diptych],[data-style=catalog])>.example-caption{grid-column:1/-1}
.piece-page[data-reader][data-theme-scene]>.theme-model-content[data-style=nocturne]>.piece-section{padding:24px;background:var(--portal-soft);margin-bottom:16px;border:1px solid var(--piece-border)}
.piece-page[data-reader][data-theme-scene]>.theme-model-content[data-style=frame]{padding:28px;background:var(--piece-base-text);--portal-bg:var(--piece-base-text);--portal-ink:var(--piece-base-bg);--portal-sub:var(--piece-base-bg);--portal-accent:var(--piece-base-bg)}
.piece-page[data-reader][data-theme-scene]>.theme-model-content[data-style=specimen]{max-width:960px;width:min(100%,960px);padding:0}
.piece-page[data-reader][data-theme-scene]>.theme-model-content[data-style=specimen]>.piece-section-title{font-size:32px}
@container piece-frame (max-width:620px){
 .piece-page[data-reader][data-theme-scene]>.theme-model-content:is([data-style=nocturne],[data-style=diptych],[data-style=catalog]){display:block;width:100%;max-width:none}
 .piece-page[data-reader][data-theme-scene]>.theme-model-content>.piece-section{padding:24px 0}
 .piece-page[data-reader][data-theme-scene]>.theme-model-content>.piece-section p{font-size:17px}
 .piece-page[data-reader][data-theme-scene]>.theme-model-content:is([data-style=journal],[data-style=cover])>.piece-section-story p{font-size:24px}
 .piece-page[data-reader][data-theme-scene]>.theme-model-content[data-style=frame]{padding:20px}
}
/* Johnny Fekete's MIT 3D object, with fixed orientation and an actionable lid assembly. */
.piece-page[data-reader] .occasion-gift{max-width:650px}
.gift-object-stage{position:relative;display:grid;place-items:center;width:100%;height:350px;margin:24px auto 0;isolation:isolate}
.gift-object-stage .jf-gift-box-container{grid-area:1/1;position:relative;width:200px;height:200px;perspective:600px;transform:scale(1.2)}
.gift-object-stage .jf-gift-box{--gift-box-color:var(--portal-soft);--gift-box-edge-color:var(--piece-border);--wrap-color:var(--portal-accent);--wrap-ribbon-color:var(--portal-accent);--wrap-top-color:color-mix(in srgb,var(--portal-accent) 82%,var(--portal-bg));transform:rotateX(-14deg) rotateY(-28deg);transform-style:preserve-3d;animation:none;transition:none}
.gift-object-stage .jf-gift-box :is(.jf-gift-box__side,.jf-gift-box__end,.jf-gift-box-lid__side,.jf-gift-box-lid__end){border-width:1px}
.jf-lid-assembly{position:absolute;inset:0;width:200px;height:200px;transform-style:preserve-3d;transform-origin:100px 0}
.jf-gift-box__side--right,.jf-gift-box-lid__side--right{filter:brightness(.9)}
.jf-gift-box__side--left,.jf-gift-box-lid__side--left{filter:brightness(.96)}
.piece-page[data-reader] .gift-object-stage>.theme-portrait{grid-area:1/1;width:300px;height:300px;max-width:100%;border-radius:0;padding:0;border:0;box-shadow:none;z-index:2}
.piece-page[data-reader] .gift-object-stage>.theme-portrait[hidden]{display:none}
.piece-page[data-reader] .gift-object-stage .piece-media{background:var(--piece-photo-bg);border-radius:0}
.occasion-gift[data-gift-state=open] .jf-gift-box-container{visibility:hidden}
.occasion-gift[data-gift-state=wrapped]>.theme-photo-actions{display:none}
@container piece-frame (max-width:620px){.gift-object-stage{height:285px}.gift-object-stage .jf-gift-box-container{transform:scale(.9)}.piece-page[data-reader] .gift-object-stage>.theme-portrait{height:255px;width:255px}}
.piece-page[data-reader][data-theme-book] .book-cover .gift-object-stage{height:200px;min-height:130px;flex:1 1 0;margin:0}
.piece-page[data-reader][data-theme-book] .book-cover .gift-object-stage>.theme-portrait{height:100%;width:100%;min-height:130px}
/* Reserve real room for the source's elevated bow, outside the action row. */
.gift-object-stage{margin-top:40px}
.gift-object-stage .jf-gift-box-container{transform:scale(.8)}
@container piece-frame (max-width:620px){.gift-object-stage{height:260px}.gift-object-stage .jf-gift-box-container{transform:scale(.6)}}
/* Givingli-inspired peripheral balloons; the original piece and calendar stay unobscured. */
.birthday-celebration{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:visible}
.birthday-poster,.birthday-message{position:relative;z-index:1}
.birthday-balloon{position:absolute;width:100px;height:185px;overflow:visible;color:var(--portal-accent);transform-origin:center bottom}
.birthday-balloon-0{left:-80px;top:18px;width:110px}.birthday-balloon-1{right:-76px;top:95px;width:105px}.birthday-balloon-2{left:-68px;top:265px;width:85px;color:color-mix(in srgb,var(--portal-accent) 65%,var(--portal-bg))}.birthday-balloon-3{right:-82px;top:360px;width:120px;color:color-mix(in srgb,var(--portal-accent) 75%,var(--portal-bg))}.birthday-balloon-4{left:-70px;bottom:22px;width:95px;color:color-mix(in srgb,var(--portal-accent) 85%,var(--portal-bg))}
.balloon-body,.balloon-knot{fill:currentColor;stroke:var(--piece-border);stroke-width:.8}
.balloon-string{fill:none;stroke:var(--portal-accent);stroke-opacity:.5;stroke-width:1.3}
/* A material album cover opens once on entry, leaving the real photograph and controls. */
.anniversary-opening-cover{position:absolute;inset:14px 30px 24px;background:repeating-linear-gradient(45deg,var(--portal-soft) 0 3px,color-mix(in srgb,var(--portal-ink) 6%,var(--portal-bg)) 3px 4px);border:1px solid var(--piece-border);box-shadow:inset 0 0 0 8px var(--portal-bg),inset 0 0 0 9px var(--piece-border),0 5px 12px -8px var(--portal-ink);display:grid;place-items:center;transform-origin:left center;backface-visibility:hidden;z-index:4;pointer-events:none}
.anniversary-opening-cover>.piece-occasion-motif{width:100px;height:75px;color:var(--portal-accent);margin:0}
.occasion-anniversary[data-album-state=open] .anniversary-opening-cover{display:none}
@container piece-frame (max-width:620px){
 .birthday-balloon{height:120px}
 .birthday-balloon-0{display:none;left:16px;top:0;width:47px}.birthday-balloon-1{right:16px;top:175px;width:48px}.birthday-balloon-2{left:16px;top:340px;width:45px}.birthday-balloon-3{right:16px;top:530px;width:50px}.birthday-balloon-4{left:16px;bottom:5px;width:48px}
 .anniversary-opening-cover{inset:10px 14px 20px}
}
.piece-page[data-reader][data-theme-book] .book-cover .birthday-celebration{display:none}


/* v29: an image plane prepared before opening; the opaque 3D object never fades. */
.gift-object-stage{height:390px}
.gift-object-stage .jf-gift-box-container{z-index:3}
.piece-page[data-reader] .gift-object-stage>.theme-portrait{width:420px;height:315px;padding:14px 14px 24px;border:1px solid var(--piece-border);background:var(--portal-bg);box-shadow:inset 0 0 0 5px var(--portal-bg),inset 0 0 0 6px var(--piece-border),0 14px 18px -16px var(--portal-ink);transform:rotate(-1.2deg);visibility:visible}
.piece-page[data-reader] .occasion-gift[data-gift-state=wrapped] .gift-object-stage>.theme-portrait{visibility:hidden;pointer-events:none}
.occasion-gift[data-gift-state=opening] .jf-lid-assembly,.occasion-gift[data-gift-state=opening] .theme-portrait{will-change:transform}
.occasion-gift[data-gift-state=closed] .theme-portrait{visibility:hidden}
.occasion-anniversary[data-album-state=closed] .anniversary-opening-cover{display:grid;transform:none;opacity:1}
@container piece-frame (max-width:620px){.gift-object-stage{height:300px}.piece-page[data-reader] .gift-object-stage>.theme-portrait{width:min(100%,340px);height:255px;padding:10px 10px 20px}}
/* v31: compact public sampler only; published pieces and editor keep their scale. */
#landing .reader-result #landingReader{width:100%;max-width:860px;margin-inline:auto}
#landing .reader-result .public-occasion-presentation{max-width:860px;padding:0;gap:16px;flex-wrap:wrap;margin:20px auto 24px}
#landing .reader-result .public-occasion-choices{flex:1 1 580px}
#landing .reader-result .public-occasion-design{flex:0 1 180px}
#landingReader>.piece-page[data-reader][data-theme-scene]{padding:28px 24px}
#landingReader>.piece-page[data-theme-scene] .occasion-wedding{max-width:520px;margin-bottom:32px}
#landingReader>.piece-page[data-theme-scene] .occasion-wedding .wedding-invitation{min-height:0;padding:36px 32px 28px;gap:16px}
#landingReader>.piece-page[data-theme-scene] .occasion-wedding .piece-title{font-size:40px}
#landingReader>.piece-page[data-theme-scene] .occasion-wedding .portal-wordmark{font-size:20px}
#landingReader>.piece-page[data-theme-scene] .occasion-wedding .piece-object-name{font-size:14px;margin-top:10px}
#landingReader>.piece-page[data-theme-scene] .occasion-wedding .theme-portrait{width:180px;height:200px}
#landingReader>.piece-page[data-theme-scene] .occasion-wedding .piece-occasion-date{font-size:18px}
#landingReader>.piece-page[data-theme-scene] .occasion-wedding .wedding-letter{padding:24px 28px}
#landingReader>.piece-page[data-theme-scene] .occasion-wedding .wedding-letter .piece-section-dedication p{font-size:23px}
#landingReader>.piece-page[data-theme-scene] .occasion-birthday{padding:24px 0}
#landingReader>.piece-page[data-theme-scene] .birthday-poster{gap:24px}
#landingReader>.piece-page[data-theme-scene] .birthday-words{gap:20px}
#landingReader>.piece-page[data-theme-scene] .birthday-words .piece-title{font-size:40px}
#landingReader>.piece-page[data-theme-scene] .birthday-day{font-size:72px}
#landingReader>.piece-page[data-theme-scene] .birthday-plinth{width:100%;max-width:280px;margin-inline:auto}
@container piece-frame (max-width:620px){
 #landingReader>.piece-page[data-reader][data-theme-scene]{padding:20px 16px}
 #landingReader>.piece-page[data-theme-scene] .occasion-wedding .wedding-invitation{padding:32px 20px 24px;gap:14px}
 #landingReader>.piece-page[data-theme-scene] .occasion-wedding .piece-title{font-size:30px}
 #landingReader>.piece-page[data-theme-scene] .occasion-wedding .theme-portrait{width:160px;height:180px}
 #landingReader>.piece-page[data-theme-scene] .occasion-wedding .piece-occasion-date{font-size:16px}
 #landingReader>.piece-page[data-theme-scene] .occasion-wedding .wedding-letter{padding:20px}
 #landingReader>.piece-page[data-theme-scene] .occasion-wedding .wedding-letter .piece-section-dedication p{font-size:21px}
 #landingReader>.piece-page[data-theme-scene] .birthday-words .piece-title{font-size:32px}
 #landingReader>.piece-page[data-theme-scene] .birthday-plinth{max-width:220px}
 #landingReader>.piece-page[data-theme-scene] .birthday-day{font-size:56px}
}
@media(max-width:760px){#landing .reader-result .public-occasion-presentation{display:block}#landing .reader-result .public-occasion-design{width:100%}}
@media(min-width:761px){
 #landing .reader-result .public-occasion-choices{flex:1 1 560px}
 #landing .reader-result .public-occasion-choices button{font-size:14px;min-height:44px;padding:8px 10px;gap:6px}
 #landing .reader-result .public-occasion-choices .piece-occasion-motif{width:24px;height:20px}
 #landing .reader-result .public-occasion-design{flex:0 0 165px;min-width:165px;font-size:13px}
 #landing .reader-result .public-occasion-design select{min-height:44px;font-size:14px;padding:8px 28px 8px 12px}
}
/* v33: compact public thematic studies with persistent, complete controls. */
#landing .reader-result #landingReader{max-width:760px}
#landing .reader-result .public-occasion-presentation{position:sticky;top:var(--public-header-height,70px);z-index:25;max-width:760px;background:var(--ui-canvas,#F6F6F3);padding:10px 0;margin:12px auto 18px;border-bottom:1px solid #D9DCD5;gap:12px;align-items:end}
#landing .reader-result .public-occasion-choices{flex:1 1 530px;gap:6px}
#landing .reader-result .public-occasion-choices button{min-height:44px;font-size:13px;padding:8px;gap:5px}
#landing .reader-result .public-occasion-choices .piece-occasion-motif{width:22px;height:18px}
#landing .reader-result .public-occasion-design{flex:0 0 155px;min-width:155px;font-size:12px}
#landing .reader-result .public-occasion-design select{min-height:44px;font-size:14px}
#landingReader>.piece-page[data-theme-scene]{padding:20px}
#landingReader>.piece-page[data-theme-scene] .occasion-scene{margin-bottom:28px}
#landingReader>.piece-page[data-theme-scene] .occasion-scene .piece-title{font-size:34px}
#landingReader>.piece-page[data-theme-scene] .occasion-scene .portal-wordmark{font-size:18px}
#landingReader>.piece-page[data-theme-scene] .occasion-scene .piece-object-name{font-size:14px;margin-top:8px}
#landingReader>.piece-page[data-theme-scene] .occasion-wedding{max-width:440px}
#landingReader>.piece-page[data-theme-scene] .wedding-invitation{min-height:0;padding:30px 26px 24px;gap:12px}
#landingReader>.piece-page[data-theme-scene] .occasion-wedding .theme-portrait{width:150px;height:165px}
#landingReader>.piece-page[data-theme-scene] .occasion-wedding .piece-occasion-date{font-size:16px}
#landingReader>.piece-page[data-theme-scene] .wedding-letter{padding:20px 24px}
#landingReader>.piece-page[data-theme-scene] .wedding-letter .piece-section-dedication p{font-size:21px}
#landingReader>.piece-page[data-theme-scene] .occasion-birthday{padding:20px 0}
#landingReader>.piece-page[data-theme-scene] .birthday-poster{gap:20px}
#landingReader>.piece-page[data-theme-scene] .birthday-words{gap:16px}
#landingReader>.piece-page[data-theme-scene] .birthday-plinth{max-width:220px}
#landingReader>.piece-page[data-theme-scene] .birthday-day{font-size:56px}
#landingReader>.piece-page[data-theme-scene] .birthday-message{margin-top:20px;padding:20px 24px}
#landingReader>.piece-page[data-theme-scene] .birthday-message p{font-size:21px}
#landingReader>.piece-page[data-theme-scene] .gift-heading{gap:12px;margin-bottom:20px}
#landingReader>.piece-page[data-theme-scene] .gift-object-stage{height:280px;margin-top:24px}
#landingReader>.piece-page[data-theme-scene] .gift-object-stage .jf-gift-box-container{transform:scale(.65)}
#landingReader>.piece-page[data-theme-scene] .gift-object-stage>.theme-portrait{width:340px;height:255px}
#landingReader>.piece-page[data-theme-scene] .gift-tag{padding:10px 20px;margin:16px}
#landingReader>.piece-page[data-theme-scene] .occasion-promise{grid-template-columns:80px minmax(0,1fr);gap:16px;max-width:600px}
#landingReader>.piece-page[data-theme-scene] .promise-paper{padding:28px 24px}
#landingReader>.piece-page[data-theme-scene] .occasion-promise .wedding-letter p{font-size:21px}
#landingReader>.piece-page[data-theme-scene] .anniversary-heading{gap:12px;margin-bottom:20px}
#landingReader>.piece-page[data-theme-scene] .anniversary-album{max-width:440px}
#landingReader>.piece-page[data-theme-scene] .anniversary-memory .theme-portrait{height:230px}
#landingReader>.piece-book{max-width:560px}
@media(max-width:760px){
 #landing .reader-result .public-occasion-presentation{display:flex;flex-direction:column;align-items:stretch;gap:8px;padding:8px 0;margin:8px auto 16px;top:var(--public-header-height,60px)}
 #landing .reader-result .public-occasion-design{order:-1;display:grid;grid-template-columns:110px minmax(0,1fr);align-items:center;flex:auto;width:100%;min-width:0;gap:10px}
 #landing .reader-result .public-occasion-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));flex:auto;margin:0;gap:6px}
 #landing .reader-result .public-occasion-choices button{font-size:12px;min-width:0;padding:6px;gap:4px}
 #landing .reader-result .public-occasion-choices .piece-occasion-motif{width:18px;height:16px;flex-shrink:0}
}
@container piece-frame (max-width:620px){
 #landingReader>.piece-page[data-theme-scene]{padding:16px}
 #landingReader>.piece-page[data-theme-scene] .occasion-scene .piece-title{font-size:28px}
 #landingReader>.piece-page[data-theme-scene] .wedding-invitation{padding:26px 20px 22px;gap:10px}
 #landingReader>.piece-page[data-theme-scene] .occasion-wedding .theme-portrait{width:135px;height:150px}
 #landingReader>.piece-page[data-theme-scene] .birthday-plinth{max-width:180px}
 #landingReader>.piece-page[data-theme-scene] .birthday-message{padding:18px 16px}
 #landingReader>.piece-page[data-theme-scene] .birthday-message p{font-size:20px}
 #landingReader>.piece-page[data-theme-scene] .gift-object-stage{height:240px}
 #landingReader>.piece-page[data-theme-scene] .gift-object-stage .jf-gift-box-container{transform:scale(.55)}
 #landingReader>.piece-page[data-theme-scene] .gift-object-stage>.theme-portrait{width:min(100%,280px);height:210px}
 #landingReader>.piece-page[data-theme-scene] .occasion-promise{grid-template-columns:1fr;gap:10px}
 #landingReader>.piece-page[data-theme-scene] .promise-paper{padding:24px 18px}
 #landingReader>.piece-page[data-theme-scene] .anniversary-memory .theme-portrait{height:200px}
}
@media(max-width:360px){#landing .reader-result .public-occasion-choices{grid-template-columns:repeat(2,minmax(0,1fr))}}

.birthday-confetti-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:3;pointer-events:none}

/* Empty birthday has a readable text composition, rather than a false photographic medallion. */
.piece-page[data-reader] .occasion-birthday[data-image-state=empty] .birthday-poster{grid-template-columns:minmax(0,1fr);gap:20px}
.piece-page[data-reader] .occasion-birthday .occasion-empty-media{font:400 16px/1.6 var(--sans);color:var(--portal-ink);width:100%;max-width:60ch;margin:0;padding:16px 0;border-top:1px solid var(--piece-border);overflow:visible;word-break:normal;overflow-wrap:break-word}
.piece-page[data-reader][data-theme-book] .book-cover .birthday-words .piece-occasion-date{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;gap:6px;line-height:1.5}
.piece-page[data-reader][data-theme-book] .book-cover .birthday-words :is(.birthday-day,.birthday-month){line-height:1.5;margin:0}
.piece-page[data-reader][data-theme-book] .book-cover .occasion-birthday[data-image-state=empty] .birthday-poster{display:block;width:100%}
.piece-page[data-reader][data-theme-book] .book-cover .occasion-birthday .occasion-empty-media{text-align:center;max-width:none;padding:12px 0}

/* An absent source is explained outside photographic seals and frames. */
.piece-page[data-reader] .occasion-scene>.occasion-empty-media{display:block;position:static;grid-column:1/-1;grid-row:auto;width:100%;max-width:60ch;height:auto;min-height:0;margin:16px auto 0;padding:16px 0;border-top:1px solid var(--piece-border);background:transparent;color:var(--portal-ink);font:400 16px/1.6 var(--sans);word-break:normal;overflow-wrap:break-word;text-align:left;overflow:visible}
.piece-page[data-reader] .occasion-promise[data-image-state=empty] .promise-envelope{padding-right:0}

/* A scene centers its wordmark; keep an uploaded logo on that same axis. */
.piece-page[data-reader] .occasion-scene .portal-wordmark.has-logo .brand-logo{margin-inline:auto;object-position:center}
.piece-page[data-reader]:not([data-theme-book]) .occasion-scene :is(.birthday-words,.promise-heading) .portal-wordmark.has-logo .brand-logo{margin-inline:0;object-position:left center}
.piece-page[data-reader][data-theme-book] .book-cover .occasion-scene .portal-wordmark.has-logo{text-align:center}