/* Version-one garden postcards: a quiet backdrop with separately saved decorations. */
.postcard{margin:0;padding:14px;background:#fffaf0;border:1px solid #e7daca;border-radius:18px;box-shadow:0 5px 14px #68516c12;min-width:0;max-width:100%}
.postcard-scene{position:relative;isolation:isolate;overflow:hidden;contain:paint;aspect-ratio:1.2;background:#ffdfcb;border-radius:9px}
.postcard-decorations{position:absolute;inset:0;z-index:2}.postcard-decoration{position:absolute;width:15%;height:16%;object-fit:contain}
.postcard-scene>.postcard-monster[data-emotion]{overflow:visible}
.postcard-scene>.postcard-monster{position:absolute;width:66%;height:96%;left:17%;bottom:1%;z-index:3;filter:none}
.postcard-caption{text-align:center;font:24px/1.4 Caveat,cursive;color:#594368;padding:9px 0 0}
.home-layout.postcard-home{display:flex;flex-direction:column;gap:0;max-width:570px;min-height:0;margin:0 auto;text-align:center}
.postcard-home h1{font-size:clamp(24px,3.2vw,32px);letter-spacing:-.6px;max-width:500px;margin:0 auto 6px}
.postcard-home .lead{font-size:14px;line-height:1.45;max-width:100%;margin:0 0 14px}
.home-postcard{width:100%;min-height:220px}.home-postcard>.postcard{width:100%}
.home-postcard .postcard-scene{aspect-ratio:1.12}
.postcard-home .home-actions{width:100%;display:grid;gap:10px;margin:20px 0 10px}
.postcard-home .home-actions button{border-radius:28px;font:24px/1.3 Georgia,serif;padding:12px 20px}
.postcard-home .human-note{display:block;font-size:13px;margin:0;max-width:100%}
.home-postcard-status{padding:45px 16px;border:1px solid #e7daca;border-radius:18px;background:#fffaf0;color:var(--muted)}
.postcard-preview{margin:20px auto;max-width:470px}.postcard-preview .postcard-caption{font-size:22px}
.delivery-postcard{max-width:480px;margin:0 auto 18px;position:relative}.delivery-postcard .skill-visual{z-index:4;pointer-events:none}
.postcard-mail-copy{max-width:360px;margin:16px 0}
.feature-home{margin:12px 0}.feature-home[aria-pressed=true]{background:#e8dbef;border-color:#a585bd}
.feature-status{font-size:13px;color:var(--muted);min-height:1.5em}
@media(max-width:760px){.postcard-home .postcard{padding:11px}.postcard-home h1{font-size:26px}.postcard-home .lead{font-size:13px;margin-bottom:12px}.postcard-home .home-actions button{font-size:22px}.postcard-home .human-note{font-size:12px}.postcard-caption{font-size:22px}}
@media(prefers-reduced-motion:reduce){.delivery-active .delivery-postcard .postcard-monster{animation:none}}
:root[data-message-effects=off] .delivery-active .delivery-postcard .postcard-monster{animation:none}

.postcard-keepsake{max-width:460px;margin:0 0 20px}.postcard-keepsake>summary{min-height:44px;padding:10px 0;color:var(--muted);cursor:pointer}

/* Live postcard idle motion (home screen). Saved and preview cards stay static. */
.postcard-clouds{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.postcard-cloud{position:absolute;display:block;animation:cloud-drift var(--dur) linear infinite;animation-delay:var(--start)}
.cloud{fill:#fffdf6;stroke:#1d1a1f}.cloud-shade{fill:#e3ebf2}
[data-time=dawn] .cloud-shade{fill:#f6d6d6}[data-time=dusk] .cloud{fill:#ffe9d6}[data-time=dusk] .cloud-shade{fill:#f3bfa0}
[data-time=night] .postcard-clouds{opacity:.35}
.postcard-live .sun-glow{transform-box:fill-box;transform-origin:center;animation:sun-pulse 4.5s ease-in-out infinite}
.postcard-live .sky-star{transform-box:fill-box;transform-origin:center;animation:star-twinkle 3.2s ease-in-out infinite}
.postcard-live .sky-star:nth-child(2n){animation-delay:-1.1s}.postcard-live .sky-star:nth-child(3n){animation-delay:-2.3s}
.postcard-live .postcard-decoration{transform-origin:50% 95%;animation:decor-sway 4.2s ease-in-out infinite}
.postcard-live .postcard-decoration:nth-child(2n){animation-duration:5s;animation-delay:-1.6s}
.postcard-live .postcard-decoration:nth-child(3n){animation-duration:3.7s;animation-delay:-2.4s}
.postcard-live .postcard-monster:not([data-emotion]) .monster-body{transform-box:fill-box;transform-origin:50% 100%;animation:postcard-breathe 3.6s ease-in-out infinite}
@keyframes cloud-drift{from{left:102%}to{left:-26%}}
@keyframes sun-pulse{0%,100%{transform:scale(1);opacity:.8}50%{transform:scale(1.12);opacity:1}}
@keyframes star-twinkle{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(.6);opacity:.55}}
@keyframes decor-sway{0%,100%{transform:rotate(-2.5deg)}50%{transform:rotate(2.5deg)}}
@keyframes postcard-breathe{0%,100%{transform:scale(1,1)}45%{transform:scale(.99,1.025)}}
@media(prefers-reduced-motion:reduce){.postcard-live :is(.postcard-cloud,.sun-glow,.sky-star,.postcard-decoration,.monster-body){animation:none!important}}
:root[data-message-effects=off] .postcard-live :is(.postcard-cloud,.sun-glow,.sky-star,.postcard-decoration,.monster-body){animation:none!important}
