#postcard-dialog{width:min(840px,calc(100vw - 24px));max-height:min(90dvh,880px);padding:20px clamp(16px,3vw,32px) 24px;border:1px solid #cad5ba;border-radius:26px;background:#f5f1e3;color:#244634;box-shadow:0 20px 70px #102d27a8;overflow:auto}
#postcard-dialog::backdrop{background:#102d27bc;backdrop-filter:blur(7px)}
.postcard-head{display:flex;justify-content:space-between;align-items:start;gap:16px}.postcard-head small{font-size:11px;color:#687d69}.postcard-head h2{font:500 clamp(23px,4vw,32px) Georgia,"Noto Serif SC",serif;margin:6px 0 12px}.postcard-head button{min-width:44px;min-height:44px;font-size:24px;padding:0}.postcard-privacy{font-size:12px;line-height:1.7;padding:11px 14px;margin:0 0 15px;border:1px solid #c7d4bd;background:#e9efdf;border-radius:14px}
#postcard-editor{display:grid;gap:12px}#postcard-editor label{display:grid;gap:5px;font-size:13px;font-weight:600}#postcard-editor input,#postcard-editor textarea{width:100%;font:15px/1.6 system-ui,sans-serif;color:#254534;background:#fffdf6;border:1px solid #bdcbb4;border-radius:12px;padding:10px 12px;resize:vertical}#postcard-editor input:focus,#postcard-editor textarea:focus{outline:2px solid #52765e;outline-offset:1px}.postcard-orientation,.postcard-actions{display:flex;flex-wrap:wrap;gap:8px}.postcard-orientation button{background:#e7eadc;color:#254534}.postcard-orientation button.active{background:#315f44;color:#fff7df}#postcard-preview{justify-self:start}#postcard-status{min-height:1.4em;font-size:12px;color:#6c5136;margin:0}
.postcard-pages{display:flex;gap:12px;overflow:auto;align-items:start;padding:5px 0 12px}.postcard-page{flex:0 0 auto;width:min(200px,47vw)}.postcard-page img{display:block;width:100%;height:auto;max-height:260px;object-fit:contain;background:#e5e2d5;border-radius:9px;box-shadow:0 3px 12px #223c3340}.postcard-page span{display:block;margin:6px 0;font-size:12px}.postcard-page button{font-size:11px;padding:7px 11px}
#postcard-finish{text-align:center;padding:22px 4px 30px}#postcard-finish h3{font:500 clamp(20px,4vw,29px) Georgia,"Noto Serif SC",serif}#postcard-finish p{font-size:13px;line-height:1.8}.postcard-stars{height:145px;position:relative;overflow:hidden;background:radial-gradient(ellipse at 50% 110%,#b7c991,#234b49 60%,#142e42);border-radius:18px}.postcard-stars:before{content:'✦  ·  ✧     ✦  ·   ✦      ✧    ·  ✦';position:absolute;inset:12px;color:#fcf2cd99;letter-spacing:12px}.postcard-stars span{position:absolute;left:50%;bottom:7px;font-size:40px;color:#fff3b0;text-shadow:0 0 20px #ffe18b;animation:postcard-rise 3s ease-out forwards}@keyframes postcard-rise{from{transform:translate(-50%,0) scale(.7);opacity:1}to{transform:translate(-50%,-125px) scale(.2);opacity:0}}@media(prefers-reduced-motion:reduce){.postcard-stars span{animation:none;bottom:70px;transform:translateX(-50%)}}
#postcard-outbox{padding:4px 0 18px}#postcard-outbox h3{font-size:18px;margin:10px 0 5px}#postcard-outbox>p{font-size:12px;line-height:1.6}#postcard-outbox-list{display:grid;gap:10px}.postcard-record{display:grid;grid-template-columns:70px 1fr;gap:10px;padding:10px;background:#fffaf0;border:1px solid #ced5c2;border-radius:14px}.postcard-record img{width:70px;height:86px;object-fit:cover;border-radius:6px}.postcard-record strong,.postcard-record small{display:block}.postcard-record small{color:#69786a;margin:4px 0 8px}.postcard-record button{font-size:11px;padding:6px 9px;margin:0 5px 5px 0}#postcard-outbox-toggle{margin-top:13px;background:transparent;color:#315740;border-color:#9aaf9d}
@media(max-width:700px){#postcard-dialog{max-height:92dvh;padding:16px 14px 20px;border-radius:20px}.postcard-actions button{flex:1 1 145px}.postcard-page{width:min(170px,45vw)}}

#postcard-finish{padding:4px 0 18px}
#postcard-dialog.ritual-open{width:min(980px,calc(100vw - 24px));max-height:96dvh}
#postcard-dialog.ritual-open #postcard-outbox-toggle{display:none}
#postcard-finish{display:grid;grid-template-columns:minmax(0,430px) minmax(0,1fr);grid-template-rows:auto auto auto 1fr;gap:12px 28px;text-align:left;align-items:start}
#postcard-finish h3{grid-column:2;grid-row:1;margin:32px 0 0}
#postcard-ritual-message{grid-column:2;grid-row:2;min-height:3em;margin:0;max-width:32em}
.postcard-ritual-stage{position:relative;grid-column:1;grid-row:1/5;height:clamp(450px,69dvh,600px);overflow:hidden;border-radius:18px;background:#122f3d url('assets/postcard-ritual-v1.webp') center 45%/cover;box-shadow:inset 0 0 55px #071e2e77}
.postcard-ritual-glow{position:absolute;inset:0;background:radial-gradient(circle at 50% 68%,#f5dfa944,transparent 42%);pointer-events:none}
#postcard-floating-card{position:absolute;left:50%;bottom:25%;width:min(42%,260px);max-height:56%;object-fit:contain;transform:translateX(-50%);filter:drop-shadow(0 8px 18px #061b29aa);z-index:2;user-select:none;-webkit-user-drag:none}
.postcard-hands{position:absolute;left:50%;bottom:-7%;width:min(94%,540px);height:64%;object-fit:contain;transform:translateX(-50%);z-index:3;pointer-events:none;filter:drop-shadow(0 4px 20px #192c35bb)}
.postcard-sparks{position:absolute;inset:0;pointer-events:none;z-index:4}
.postcard-sparks i{position:absolute;left:50%;top:30%;font:normal 25px Georgia,serif;color:#fff5c2;opacity:0;text-shadow:0 0 14px #fff2ad,0 0 28px #c5f2ee}
.postcard-sparks i:nth-child(1){--dx:-83px;--dy:-74px;animation-delay:.1s}.postcard-sparks i:nth-child(2){--dx:71px;--dy:-97px;animation-delay:.3s}.postcard-sparks i:nth-child(3){--dx:-36px;--dy:-167px;animation-delay:.55s}.postcard-sparks i:nth-child(4){--dx:105px;--dy:-160px;animation-delay:.2s}.postcard-sparks i:nth-child(5){--dx:8px;--dy:-228px;animation-delay:.65s}.postcard-sparks i:nth-child(6){--dx:-115px;--dy:-217px;animation-delay:.4s}.postcard-sparks i:nth-child(7){--dx:89px;--dy:-270px;animation-delay:.7s}
#postcard-finish.released #postcard-floating-card{animation:postcard-ascend 9.4s cubic-bezier(.35,.06,.54,1) forwards}
#postcard-finish.released .postcard-hands{animation:postcard-hands-release 2.5s ease-out forwards}
#postcard-finish.released .postcard-sparks i{animation:postcard-sparkle 3.7s ease-out 6s forwards}
@keyframes postcard-ascend{0%,10%{transform:translate(-50%,0) rotate(0) scale(1);opacity:1}30%{transform:translate(-50%,-55px) rotate(-3deg) scale(.95);opacity:1}60%{transform:translate(-49%,-190px) rotate(4deg) scale(.72);opacity:1}78%{transform:translate(-47%,-285px) rotate(8deg) scale(.44);opacity:.96;filter:drop-shadow(0 8px 18px #061b29aa)}90%{transform:translate(-46%,-350px) rotate(11deg) scale(.21);opacity:.8;filter:drop-shadow(0 0 24px #fff7c9)}100%{transform:translate(-45%,-400px) rotate(13deg) scale(.02);opacity:0;filter:drop-shadow(0 0 36px #fff7c9)}}
@keyframes postcard-hands-release{0%,18%{transform:translate(-50%,0);opacity:1}54%{transform:translate(-50%,-20px);opacity:1}100%{transform:translate(-50%,16px);opacity:.72}}
@keyframes postcard-sparkle{0%{transform:translate(0,0) scale(.1);opacity:0}24%{opacity:1}70%{transform:translate(var(--dx),var(--dy)) scale(1);opacity:.9}100%{transform:translate(calc(var(--dx)*1.2),calc(var(--dy)*1.2)) scale(.15);opacity:0}}
.postcard-ritual-actions{grid-column:2;grid-row:3;display:flex;flex-wrap:wrap;justify-content:flex-start;gap:8px}.postcard-ritual-actions button{min-height:42px}.postcard-ritual-actions #postcard-ritual-back{background:#e2eadc;color:#2b4b38;border-color:#b0c4ab}#postcard-finish.complete #postcard-release{display:none}.postcard-ritual-privacy{grid-column:2;grid-row:4;font-size:11px!important;color:#5b705f;margin:14px 0 0;max-width:48em}
@media(max-width:700px){#postcard-dialog.ritual-open{max-height:94dvh}#postcard-finish{display:block;text-align:center}.postcard-ritual-stage{height:min(52dvh,460px);min-height:330px}#postcard-finish h3{margin:18px 0 6px}#postcard-ritual-message{margin:0 auto 14px}#postcard-floating-card{width:min(52%,190px);bottom:27%}.postcard-hands{bottom:-8%;height:58%}.postcard-ritual-actions{justify-content:center}.postcard-ritual-actions button{font-size:12px;padding:9px 11px}.postcard-ritual-privacy{margin:14px auto 0}}
@media(prefers-reduced-motion:reduce){#postcard-finish.released #postcard-floating-card{animation:none;opacity:0}#postcard-finish.released .postcard-hands{animation:none}#postcard-finish.released .postcard-sparks i{animation:none;opacity:1;transform:translate(var(--dx),var(--dy)) scale(.75)}}

#postcard-finish.complete #postcard-ritual-title{white-space:pre-line;line-height:1.55}
