/* Announcements share the shop's calm palette, with owner-selected text styling. */
.shop-announcement{display:flex;align-items:center;gap:16px;min-width:0;margin-top:24px;padding:12px 16px;border:1px solid #dce3d4;border-left:4px solid #728d70;background:#eef1e7;border-radius:8px}
.announcement-label{font-size:12px;font-weight:700;letter-spacing:1px;flex-shrink:0}
.announcement-window{overflow:hidden;flex:1;min-width:0}
.announcement-track{display:flex;width:max-content;animation:announcement-scroll 18s linear infinite;line-height:1.7}
.announcement-track>span{white-space:pre;flex-shrink:0}
.shop-announcement[data-paused=true] .announcement-track{animation-play-state:paused}
.announcement-actions{display:flex;gap:6px;flex-shrink:0}
.announcement-actions button{font-size:12px;padding:5px 8px;min-height:34px;background:transparent;border-color:#bdc9b7}
.announcement-full{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.9}
@keyframes announcement-scroll{from{transform:translateX(var(--announcement-start,100%))}to{transform:translateX(-100%)}}
.announcement-editor{border:1px solid var(--line);border-radius:10px;margin:2px 0;padding:18px;min-width:0}
.announcement-editor legend{font-weight:700;color:var(--ink);padding:0 8px;font-size:16px}
.announcement-editor .check{font-size:14px;color:var(--ink)}
.announcement-editor textarea{font-size:16px;line-height:1.7}
.announcement-toolbar{display:flex;gap:18px;align-items:center;flex-wrap:wrap;margin:14px 0}
.announcement-toolbar select{min-width:110px}
.announcement-toolbar input[type=color]{width:70px;height:44px;padding:4px;cursor:pointer}
.announcement-emojis{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:10px 0}
.announcement-emojis>span{font-size:12px;color:var(--muted);margin-right:4px}
.announcement-emojis button{padding:5px 8px;font-size:20px;min-width:40px;min-height:40px}
.announcement-preview-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:22px 0 12px;font-size:14px}
.announcement-preview-toolbar button{padding:7px 12px;font-size:13px}
.announcement-preview-toolbar button[aria-pressed=true]{background:#263e35;color:white;border-color:#263e35}
.announcement-preview{position:relative;overflow:hidden;background:#e9ece5;border:1px solid #dce3d4;border-radius:10px;min-height:70px}
.announcement-scene{transform-origin:top left;background:#f7f5ee;padding:18px;box-sizing:border-box}
.announcement-scene-heading{font-weight:700;color:#263e35;font-size:20px;padding-bottom:16px;border-bottom:1px solid #dedfd5}
.announcement-count{display:block;text-align:right;color:var(--muted);font-size:12px}
.shared-shipping-notice{padding:14px 16px;background:#fcf0e4;border:1px solid #e9ccb1;border-radius:9px;margin:16px 0;color:#774b30}
.shared-shipping-notice>strong{font-size:14px;display:block;margin-bottom:6px}
.shared-shipping-notice p{font-size:13px;line-height:1.8;margin:0}
#modal:has(.checkout-confirmation){width:min(700px,calc(100% - 28px));background:#fffdf8}
#modal:has(.checkout-confirmation) .modal-toolbar{background:#fffdf8}
#modal:has(.checkout-confirmation) #modal-back{visibility:hidden}
#modal:has(.checkout-confirmation) #modal-content{padding-bottom:0}
.checkout-confirmation h2{font-size:26px;line-height:1.4;margin-bottom:10px;outline:none}
.checkout-confirmation .small-label{margin:0 0 8px}
.confirm-intro{font-size:13px;color:var(--muted);margin-bottom:20px}
.checkout-confirmation .order-products{margin:0}
.checkout-confirmation .order-products>h3{font-size:13px;color:var(--muted);font-weight:500;margin-bottom:8px}
.checkout-confirmation .order-product{border-radius:9px;padding:12px;background:#fff}
.checkout-confirmation .order-product-image{width:78px;height:78px;flex-shrink:0}
.checkout-confirmation .order-product h4{font-size:16px}
.confirm-recipient{margin:20px 0;padding:0 0 16px;border-bottom:1px solid var(--line);overflow-wrap:anywhere}
.confirm-recipient h3{font-size:13px;font-weight:500;color:var(--muted);margin-bottom:8px}
.confirm-recipient p{margin-bottom:6px;font-size:14px}
.confirm-recipient p>span{margin-left:14px;color:var(--muted)}
.confirm-recipient .confirm-note{font-size:12px;color:var(--muted);white-space:pre-wrap}
.confirm-deposit{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:18px}
.confirm-deposit>span{font-size:14px}
.confirm-deposit small{display:block;color:var(--muted);font-size:11px;margin-top:3px}
.confirm-deposit>strong{font-size:29px;color:#a75532;white-space:nowrap}
.confirm-payment-hint{font-size:12px;color:var(--muted);margin:10px 0 16px}
.confirm-actions{display:grid;grid-template-columns:1fr 1.35fr;gap:12px;position:sticky;bottom:0;padding:16px 0;background:#fffdf8;border-top:1px solid var(--line)}
.confirm-actions button{min-height:48px;font-size:15px}
.confirm-actions .primary{box-shadow:0 4px 12px #263e3518}
.checkout-confirmation .order-product-image.zoomed{width:100%;height:auto;max-height:65vh}
@media(max-width:600px){.shop-announcement{gap:9px;margin-top:16px;padding:9px 10px}.announcement-label{writing-mode:vertical-rl;letter-spacing:2px;font-size:11px}.announcement-actions{gap:4px}.announcement-actions button{padding:5px 7px;min-height:38px}.announcement-editor{padding:14px}.announcement-toolbar{gap:12px}.checkout-confirmation h2{font-size:22px}.checkout-confirmation .order-product-image{width:64px;height:68px}.checkout-confirmation .order-product{gap:10px;padding:10px}.confirm-deposit{align-items:flex-start;flex-wrap:wrap}.confirm-deposit>strong{font-size:27px}.confirm-actions{gap:8px}.shared-shipping-notice{padding:12px}.confirm-recipient p>span{display:block;margin:3px 0 0}}
/* The preview's selected device controls its layout, independently of the editor's screen. */
.announcement-simulation[data-view=mobile]{gap:9px;margin-top:16px;padding:9px 10px}
.announcement-simulation[data-view=mobile] .announcement-label{writing-mode:vertical-rl;letter-spacing:2px;font-size:11px}
.announcement-simulation[data-view=mobile] .announcement-actions{gap:4px}
.announcement-simulation[data-view=mobile] .announcement-actions button{padding:5px 7px;min-height:38px}
.announcement-simulation[data-view=desktop]{gap:16px;margin-top:24px;padding:12px 16px}
.announcement-simulation[data-view=desktop] .announcement-label{writing-mode:horizontal-tb;letter-spacing:1px;font-size:12px}
.announcement-simulation[data-view=desktop] .announcement-actions{gap:6px}
.announcement-simulation[data-view=desktop] .announcement-actions button{padding:5px 8px;min-height:34px}
.order-progress{background:#eef1e7;border:1px solid #dce3d4;border-radius:10px;padding:18px}
.order-progress-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.order-progress p{font-size:13px;line-height:1.8;margin:12px 0 0}
.order-progress .actions{margin-top:14px;flex-wrap:wrap}
.order-more{border-top:1px solid var(--line);padding-top:16px}
.order-more summary{cursor:pointer;color:#636e64}
.order-more .form-grid{margin-top:16px}
.order-action-confirm{background:#fcf0e4;border:1px solid #e9ccb1;border-radius:8px;padding:16px}
.order-action-confirm p{font-size:14px;line-height:1.8}
.order-action-confirm .actions{margin-top:12px}
@media(prefers-reduced-motion:reduce){.announcement-track{animation:none;width:auto;display:block}.announcement-track>span{white-space:pre-wrap;overflow-wrap:anywhere}[data-announcement-pause]{display:none}}