.card-sharing{display:flex;flex-direction:column;align-items:center;gap:12px;width:100%;text-align:center}
.card-sharing-label{margin:0;font-size:12px;font-weight:600;line-height:1.2;color:#ded0eb}
.card-sharing-icons{display:flex;justify-content:center;gap:10px}
.card-sharing .card-action-circle{width:44px;height:44px;border:1px solid #fff7e833;background:#fff7e8;color:#402379;box-shadow:0 3px 10px #17052422}
.card-sharing .card-action-circle:hover{background:#f1d48c}
.card-sharing .card-action-circle:disabled{opacity:.4;cursor:default;transform:none}
.card-sharing .card-action-circle[aria-busy="true"]{opacity:.6;cursor:wait}
.card-social-icon{width:20px;height:20px;display:block;background:currentColor;mask:var(--social-icon) center/contain no-repeat;-webkit-mask:var(--social-icon) center/contain no-repeat}
.card-social-whatsapp{--social-icon:url('assets/social/whatsapp.svg')}
.card-social-x{--social-icon:url('assets/social/x.svg')}
.card-social-facebook{--social-icon:url('assets/social/facebook.svg')}
.card-social-threads{--social-icon:url('assets/social/threads.svg')}
.card-share-image{display:inline-flex;justify-content:center;align-items:center;gap:10px;min-height:44px;padding:11px 24px;border:1px solid #eed18b;border-radius:24px;background:linear-gradient(115deg,#f7e5ae,#e5bc65);color:#331353;font:inherit;font-size:14px;font-weight:600;box-shadow:0 4px 16px #16052422;transition:background .16s,transform .16s}
.card-share-image svg{width:18px;height:18px}
.card-share-image:hover{background:#f6dda0;transform:translateY(-1px)}
.card-share-image:disabled{opacity:.6;cursor:wait;transform:none}
.card-sharing-notice{max-width:360px;font-size:12px;line-height:1.4;color:#e4d8ec}
.card-sharing-notice:empty{display:none}
.card-meta-guidance p{margin:0;font-size:12px;line-height:1.4;color:#e4d8ec}
.card-copy-link{min-height:36px;padding:6px 12px;border:0;background:transparent;color:#f1d48c;font:inherit;font-size:12px;text-decoration:underline;text-underline-offset:3px}
.card-meta-guidance label{display:block;font-size:12px;line-height:1.4;margin-top:6px}
.card-meta-guidance input{display:block;width:100%;margin-top:6px;padding:8px;border:1px solid #ab8bbb;border-radius:5px;background:#241039;color:#fff7e8;font:inherit;font-size:12px}
.confirmation-navigation{display:flex;justify-content:center;align-items:center;gap:12px}
.card-restart{display:grid;place-items:center;width:44px;height:44px;color:#eed18b;border:1px solid #eed18b66;border-radius:50%;transition:background .16s}
.card-restart:hover{background:#fff7e815}
.card-restart svg{width:20px;height:20px}
.confirmation-actions{gap:16px}

/* Keep the whole card and its sharing controls inside a single calm panel. */
#modal.card-detail-dialog[open]{width:min(620px,calc(100% - 32px));height:auto;max-height:calc(100dvh - 32px);padding:44px 26px 26px;overflow-y:auto;border:1px solid #c4a77199;border-radius:24px;background:linear-gradient(150deg,#422065,#2b1047);box-shadow:0 24px 90px #0b021ba6}
#modal.card-detail-dialog #modal-body{min-height:0}
#modal.card-detail-dialog .modal-close{top:7px;right:8px;color:#e0d1ed;border-radius:50%}
#modal.card-detail-dialog .modal-close:hover{background:#fff7e815}
.card-detail-content{min-height:0;display:grid;grid-template-rows:auto auto;gap:24px}
.card-detail-preview{container-type:inline-size;min-height:0;display:grid;place-items:center}
.card-detail-paper{container-type:inline-size;width:min(490px,100cqw,max(80px,calc((100dvh - 310px)*1.45)))}
.postcard-detail.builder-card{width:100%;min-height:0;aspect-ratio:1.45;margin:0;rotate:0deg;filter:drop-shadow(0 10px 14px #17062433)}
.card-detail-content .card-delete-action{font-size:11px;line-height:1.2}
.card-detail-content .card-delete-action .subtle{font-size:11px;color:#c9b4d9}
@media(max-width:720px){
 #modal.card-detail-dialog[open]{width:calc(100% - 24px);max-height:calc(100dvh - 24px);padding:44px 18px 22px;border-radius:20px}
 .card-detail-content{gap:18px}
 .confirmation-actions{gap:14px}
}
@media(max-height:600px){.card-sharing{gap:9px}.card-detail-content{gap:14px}.confirmation-actions{gap:10px}}
@media(prefers-reduced-motion:reduce){.card-share-image,.card-restart{transition:none}.card-share-image:hover{transform:none}}
