/* Email-offer UI only. Scoped separately from cart, consent and newsletter. */
.tss-tab, .tss-dialog { --tss-teal:#0a6e68; --tss-promo:#f5a33b; --tss-promo-ink:#063e3a; --tss-ink:#183c37; --tss-muted:#5c6964; font-family:"Hanken Grotesk",system-ui,-apple-system,sans-serif; color:var(--tss-ink); box-sizing:border-box; }
.tss-tab *, .tss-dialog * { box-sizing:border-box; }
.tss-sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.tss-tab[hidden], .tss-dialog [hidden] { display:none!important; }
.tss-tab { position:fixed; left:max(6px,env(safe-area-inset-left)); top:50%; transform:translateY(-50%); z-index:800; width:44px; display:flex; flex-direction:column; align-items:center; background:var(--tss-promo); border:1px solid rgba(255,255,255,.25); border-radius:24px; box-shadow:0 6px 22px rgba(6,48,45,.17); overflow:hidden; }
.tss-tab button { appearance:none; border:0; margin:0; color:var(--tss-promo-ink); background:transparent; cursor:pointer; font-family:inherit; }
.tss-dismiss { width:44px; height:44px; flex:0 0 44px; display:grid; place-items:center; }
.tss-dismiss svg { width:16px; height:16px; }
.tss-launch { display:flex; justify-content:center; align-items:center; min-height:176px; width:44px; padding:10px 0 20px; }
.tss-launch span { writing-mode:vertical-rl; transform:rotate(180deg); white-space:nowrap; font-size:15px; font-weight:750; line-height:1; letter-spacing:.01em; }
.tss-tab button:hover { background:rgba(6,62,58,.08); }
.tss-tab button:focus-visible { outline:2px solid #ffe0a0; outline-offset:-5px; border-radius:24px; }
.tss-dialog { position:fixed; inset:0; width:min(440px,calc(100% - 32px)); max-width:none; max-height:calc(100dvh - 32px); margin:auto; padding:0; border:1px solid rgba(24,60,55,.1); border-radius:28px; background:#fbf8f1; box-shadow:0 28px 100px rgba(17,36,31,.25); overflow:auto; overscroll-behavior:contain; }
.tss-dialog:not([open]) { display:none; }
.tss-dialog::backdrop { background:rgba(14,32,28,.4); backdrop-filter:blur(4px); }
html.tss-modal-open { overflow:hidden; }
.tss-close { position:absolute; right:12px; top:12px; z-index:3; width:44px; height:44px; border:0; border-radius:50%; background:rgba(255,255,255,.7); color:var(--tss-ink); display:grid; place-items:center; cursor:pointer; touch-action:manipulation; }
.tss-close svg { width:20px; height:20px; }
.tss-close svg, .tss-close svg *, .tss-dismiss svg, .tss-dismiss svg * { pointer-events:none; }
.tss-offer { isolation:isolate; }
.tss-offer { position:relative; overflow:hidden; text-align:center; padding:28px 32px 26px; border-bottom:1px solid #e8dfcd; background:radial-gradient(ellipse at 50% 95%,#f6dba4 0%,#f7e8c9 38%,#fbf8f1 80%); }
.tss-offer::before, .tss-offer::after { content:""; position:absolute; pointer-events:none; border:1px solid rgba(148,110,51,.13); border-radius:50%; width:310px; height:310px; top:30px; left:50%; transform:translateX(-50%); }
.tss-offer::after { width:380px; height:380px; top:-5px; }
.tss-offer > * { position:relative; z-index:1; }
.tss-brand { font-family:Georgia,"Times New Roman",serif; font-size:30px; line-height:1; font-weight:700; letter-spacing:-1.5px; margin:0 0 24px; }
.tss-eyebrow { margin:0 0 7px; color:#52625b; font-size:10px; line-height:1.4; letter-spacing:.18em; font-weight:750; text-transform:uppercase; }
.tss-discount { margin:0; font:400 84px/.95 Georgia,"Times New Roman",serif; letter-spacing:-5px; }
.tss-discount span { font-size:35px; letter-spacing:-1.5px; }
.tss-content { padding:25px 32px 22px; text-align:center; }
.tss-title { margin:0 0 9px; font-family:"Hanken Grotesk",system-ui,-apple-system,sans-serif; font-size:25px; font-weight:750; line-height:1.15; letter-spacing:-.7px; }
.tss-title:focus { outline:none; }
.tss-copy { max-width:320px; margin:0 auto 21px; color:var(--tss-muted); font-size:14px; line-height:1.5; }
.tss-form { margin:0; text-align:left; }
.tss-label { display:block; font-size:13px; font-weight:650; line-height:1.3; margin:0 0 7px; }
.tss-input { appearance:none; display:block; width:100%; min-height:52px; margin:0; padding:12px 15px; border:1px solid #bdccc5; border-radius:12px; background:#fff; color:#183c37; font:400 16px/1.4 "Hanken Grotesk",system-ui,sans-serif; box-shadow:none; }
.tss-input::placeholder { color:#78817c; opacity:1; }
.tss-input[aria-invalid="true"] { border-color:#a43627; }
.tss-error { color:#a43627; font-size:13px; line-height:1.4; margin:7px 0 0; }
.tss-submit, .tss-done { width:100%; display:flex; justify-content:center; align-items:center; gap:10px; min-height:52px; margin:12px 0 0; padding:13px 18px; border:0; border-radius:999px; background:var(--tss-teal); color:#fff; font:700 15px/1.3 "Hanken Grotesk",system-ui,sans-serif; cursor:pointer; }
.tss-submit svg { width:18px; height:18px; flex:0 0 auto; }
.tss-submit:hover, .tss-done:hover { background:#085a55; }
.tss-submit:disabled { opacity:.7; cursor:wait; }
.tss-dialog button:focus-visible, .tss-dialog a:focus-visible, .tss-input:focus-visible { outline:3px solid #0a6e68; outline-offset:3px; }
.tss-privacy { color:var(--tss-muted); font-size:11px; line-height:1.5; text-align:center; margin:12px 0 0; }
.tss-privacy a { color:inherit; text-underline-offset:2px; text-decoration:underline; }
.tss-status { margin:12px 0 0; border-radius:10px; padding:10px 12px; background:#edf3ef; color:#264b40; font-size:13px; line-height:1.4; }
.tss-preview { color:#66736c; font-size:10px; line-height:1.4; margin:14px 0 0; text-align:center; }
.tss-success { text-align:center; }
.tss-check { display:grid; place-items:center; width:48px; height:48px; margin:0 auto 15px; border-radius:50%; background:#e1eee6; color:#0a6e68; }
.tss-check svg { width:24px; height:24px; }
@media(min-width:769px) { .tss-tab { left:12px; width:46px; } .tss-launch { width:46px; min-height:188px; } }
@media(max-width:520px) { .tss-dialog { width:calc(100% - 20px); max-height:calc(100dvh - 20px); margin:auto auto max(10px,env(safe-area-inset-bottom)); border-radius:24px; } .tss-offer { padding:23px 24px 22px; } .tss-brand { margin-bottom:21px; } .tss-discount { font-size:76px; } .tss-content { padding:22px 24px 20px; } .tss-title { font-size:23px; } }
@media(max-height:600px) { .tss-tab { top:44%; } .tss-launch { min-height:148px; } .tss-launch span { font-size:13px; } .tss-offer { padding:16px 24px; } .tss-brand { margin-bottom:12px; font-size:24px; } .tss-discount { font-size:60px; } .tss-content { padding:18px 24px; } }
@media(prefers-reduced-motion:no-preference) { .tss-dialog[open] { animation:tss-enter .2s ease-out; } @keyframes tss-enter { from { opacity:0; translate:0 12px; } to { opacity:1; translate:0 0; } } }
