/* Gift details page + full-screen builder ("studio") + "Make it yours" checkout popup.
   Loaded only on gift pages that have a builder (views/layouts/gifts.php). */

:root{--g-ink:#2E2729;--g-muted:#76696C;--g-line:#EADFD4;--g-cream:#FFFDF8;--g-paper:#F8F2E9;--g-rose:#C98287;--g-rose-d:#B26A70;--g-blush:#F4DCDA;
  --g-serif:"Cormorant Garamond",Georgia,serif;--g-sans:"DM Sans",system-ui,sans-serif}

/* the old compact hero is replaced by the details hero */
.gift-body--studio .gift-hero{display:none}

/* ---------------- details page ---------------- */
.gd{position:relative;z-index:1;color:var(--g-ink);font-family:var(--g-sans)}
.gd-wrap{max-width:1180px;margin:0 auto;padding:22px clamp(16px,4vw,40px) 40px}
.gd-hero{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(22px,4vw,56px);align-items:center;padding:clamp(8px,2vw,24px) 0 clamp(26px,4vw,48px)}
.gd-hero > *{min-width:0}
.gd-media{position:relative}
.gd-card{margin:0;border-radius:28px;overflow:hidden;background:var(--g-paper);box-shadow:0 2px 6px rgba(46,39,41,.05),0 26px 60px rgba(46,39,41,.13);aspect-ratio:16/9}
.gd-card img{display:block;width:100%;height:100%;object-fit:cover}
.gd-demo{position:absolute;left:18px;bottom:-18px;display:inline-flex;align-items:center;gap:10px;padding:8px 16px 8px 8px;border-radius:999px;background:#fff;color:var(--g-ink);
  text-decoration:none;box-shadow:0 12px 28px rgba(46,39,41,.16);border:1px solid var(--g-line);transition:transform .2s}
.gd-demo:hover{transform:translateY(-2px)}
.gd-demo-ic{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--g-ink);color:#fff;font-size:18px}
.gd-demo b{display:block;font-size:14px;line-height:1.2}
.gd-demo small{display:block;font-size:12px;color:var(--g-muted)}
.gd-eyebrow{margin:0 0 10px;font-size:13px;color:var(--g-muted)}
.gd-eyebrow span{display:inline-block;padding:4px 10px;border-radius:999px;background:var(--g-blush);color:#8E4D55;font-weight:700;font-size:11px;letter-spacing:.1em;text-transform:uppercase}
.gd-title{margin:0;font-family:var(--g-serif);font-weight:600;font-size:clamp(2.2rem,4.6vw,3.6rem);line-height:1.02;letter-spacing:-.01em;color:var(--g-ink);text-wrap:balance}
.gd-line{margin:14px 0 0;font-size:clamp(1rem,1.5vw,1.12rem);line-height:1.6;color:#5C5053;max-width:32em}
.gd-rating{display:inline-flex;align-items:center;gap:6px;margin-top:14px;font-size:14px;color:var(--g-muted);text-decoration:none}
.gd-rating b{color:var(--g-ink)}
.gd-stars{position:relative;display:inline-block;font-size:15px;letter-spacing:2px;color:#E6DDD2;line-height:1}
.gd-stars::before{content:"★★★★★";position:absolute;left:0;top:0;width:calc(var(--r,5) / 5 * 100%);overflow:hidden;color:#E4A93A;white-space:nowrap}
.gd-price{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 10px;margin-top:20px}
.gd-now{font-family:var(--g-serif);font-weight:700;font-size:2.4rem;line-height:1;color:var(--g-ink)}
.gd-was{color:var(--g-muted);font-size:1.05rem}
.gd-off{padding:3px 9px;border-radius:999px;background:#E9F3E6;color:#3F7A47;font-size:12px;font-weight:700}
.gd-price small{flex-basis:100%;color:var(--g-muted);font-size:13px}
.gd-ctas{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.gd-btn{appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:999px;padding:15px 26px;font:700 16px/1 var(--g-sans);
  cursor:pointer;text-decoration:none;transition:transform .18s,box-shadow .2s,background .2s;touch-action:manipulation;white-space:nowrap}
.gd-btn--main{background:var(--g-ink);color:#FFF8F1;box-shadow:0 12px 26px rgba(46,39,41,.22)}
.gd-btn--main:hover{transform:translateY(-1px);box-shadow:0 16px 32px rgba(46,39,41,.28)}
.gd-btn--ghost{background:#fff;color:var(--g-ink);box-shadow:inset 0 0 0 1.5px var(--g-line)}
.gd-btn--ghost:hover{box-shadow:inset 0 0 0 1.5px var(--g-rose)}
.gd-facts{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:8px 16px;margin:22px 0 0;padding:0;font-size:13.5px;color:#5C5053}
.gd-facts li{display:flex;align-items:center;gap:8px}
.gd-facts .bi{color:var(--g-rose-d);font-size:15px}

.gd-block{padding:clamp(22px,3vw,36px) 0}
.gd-head{margin-bottom:18px}
.gd-kicker{display:block;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--g-rose-d)}
.gd-head h2{margin:6px 0 0;font-family:var(--g-serif);font-weight:600;font-size:clamp(1.7rem,3vw,2.3rem);line-height:1.1;color:var(--g-ink)}
.gd-journey{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;counter-reset:none}
.gd-step{position:relative;display:flex;flex-direction:column;gap:6px;padding:18px 16px 18px;border-radius:20px;background:var(--g-cream);border:1px solid var(--g-line)}
.gd-step-n{position:absolute;top:14px;right:16px;font-family:var(--g-serif);font-size:1.6rem;font-weight:700;color:#E9DCCD;line-height:1}
.gd-step-ic{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:var(--g-blush);color:#8E4D55;font-size:19px;margin-bottom:4px}
.gd-step b{font-size:15px}
.gd-step > span:last-child{font-size:13.5px;color:var(--g-muted);line-height:1.45}
.gd-split{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:clamp(10px,2vw,20px) 0}
.gd-split > *{min-width:0}
.gd-block--card{padding:24px;border-radius:24px;background:#fff;border:1px solid var(--g-line)}
.gd-make{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.gd-make li{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:999px;background:var(--g-paper);font-size:14px;font-weight:500}
.gd-make .bi{color:var(--g-rose-d)}
.gd-note{margin:16px 0 0;font-size:13.5px;color:var(--g-muted)}
.gd-extras{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.gd-extras li{display:flex;align-items:center;gap:12px}
.gd-x-ic{flex:0 0 38px;width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:var(--g-paper);color:var(--g-ink);font-size:17px}
.gd-x-t{flex:1;min-width:0}
.gd-x-t b{display:block;font-size:14.5px}
.gd-x-t small{display:block;font-size:12.5px;color:var(--g-muted);line-height:1.35}
.gd-x-p{flex:0 0 auto;font-size:12.5px;font-weight:700;color:var(--g-rose-d);padding:4px 10px;border-radius:999px;background:#FBF0EF}
.gd-how{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.gd-how li{display:flex;flex-direction:column;gap:6px;padding:20px;border-radius:20px;background:var(--g-paper)}
.gd-how-n{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--g-ink);color:#fff;font-weight:700;font-size:14px}
.gd-how b{font-size:16px;margin-top:4px}
.gd-how span:last-child{font-size:13.5px;color:var(--g-muted);line-height:1.5}
.gd-reviews{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
.gd-review{margin:0;padding:20px;border-radius:20px;background:#fff;border:1px solid var(--g-line)}
.gd-review blockquote{margin:10px 0;font-size:14.5px;line-height:1.55}
.gd-review figcaption{font-size:13px;color:var(--g-muted);font-weight:600}
.gd-final{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:clamp(14px,2vw,24px);padding:22px 24px;border-radius:24px;background:var(--g-ink);color:#FFF8F1}
.gd-final b{display:block;font-family:var(--g-serif);font-size:1.6rem}
.gd-final span{font-size:14px;opacity:.8}
.gd-final .gd-btn--main{background:#FFF8F1;color:var(--g-ink)}

.gd-sticky{display:none}

@media (max-width: 900px){
  .gd-wrap{padding-top:10px}
  .gd-hero{grid-template-columns:minmax(0,1fr);gap:30px}
  .gd-info{order:2}.gd-media{order:1}
  .gd-card{border-radius:20px}
  .gd-ctas .gd-btn{flex:1}
  .gd-split,.gd-how{grid-template-columns:minmax(0,1fr)}
  .gd-journey{grid-template-columns:minmax(0,1fr);gap:0;position:relative}
  .gd-step{flex-direction:row;flex-wrap:wrap;align-items:center;border:0;border-radius:0;background:none;padding:10px 0 10px 56px;min-height:58px}
  .gd-step::before{content:"";position:absolute;left:21px;top:0;bottom:0;width:2px;background:var(--g-line)}
  .gd-step:first-child::before{top:50%}.gd-step:last-child::before{bottom:50%}
  .gd-step-ic{position:absolute;left:0;top:50%;transform:translateY(-50%);margin:0;z-index:1;box-shadow:0 0 0 4px #FFFDF8}
  .gd-step-n{display:none}
  .gd-step b{flex-basis:100%}
  .gd-final{flex-direction:column;align-items:stretch;text-align:center}
  html.gd-show-sticky .gd-sticky{display:flex}
  .gd-sticky{position:fixed;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));z-index:90;align-items:center;justify-content:space-between;gap:10px;
    padding:8px 8px 8px 18px;border-radius:999px;background:rgba(255,253,248,.96);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
    box-shadow:0 12px 34px rgba(46,39,41,.2);border:1px solid var(--g-line);font-family:var(--g-sans)}
  .gd-sticky-p b{font-size:18px;color:var(--g-ink)}
  .gd-sticky-p del{font-size:13px;color:var(--g-muted)}
  .gd-sticky .gd-btn{padding:13px 20px;font-size:15px}
}

/* ---------------- studio (full-screen builder) ---------------- */
html.gs-ready #giftBuilder{display:none}
html.gs-ready .gift-paybar{display:none !important}
html.gs-ready #stepBuy{display:none !important}
.gs-pv-fab,.gs-pv-x,.gs-sample{display:none}
html.gs-on,html.gs-on body{overflow:hidden}
html.gs-on .gift-main{z-index:auto}
html.gs-on .gift-header,html.gs-on #dscNav,html.gs-on .nav__sheet,html.gs-on .gd,html.gs-on .gd-sticky{visibility:hidden}
/* Anvi helps inside the editor (2026-11-03) — but not over checkout, the save sheet or the full-screen phone preview */
html.gs-on #dsb{z-index:1300}
html.gs-co-on #dsb,html.gs-pv-open #dsb{visibility:hidden}
html.gs-on #giftBuilder .gift-draft-banner{display:none !important}

html.gs-on #giftBuilder{display:flex;flex-direction:column;position:fixed;inset:0;z-index:1200;margin:0;max-width:none;width:100%;padding:0;
  background:#FBF7F1;overflow:hidden}
html.gs-on #giftBuilder > *{margin:0;max-width:none;width:100%}
html.gs-on #giftBuilder > .gift-panel:not([hidden]){flex:1;min-height:0}
html.gs-on #giftBuilder .gift-panel{display:flex;flex-direction:column;border:0;border-radius:0;box-shadow:none;background:none;padding:0;overflow:hidden}
html.gs-on #giftBuilder .gift-panel-head{display:none}
html.gs-on #giftBuilder .gift-panel-body{flex:1;min-height:0;display:flex;flex-direction:column;padding:0;overflow:hidden}
html.gs-on #giftBuilder [hidden]{display:none !important}
html.gs-merged.gs-on #stepPreview{display:flex !important}

/* the bar */
.gs-bar{display:none}
html.gs-on .gs-bar{display:flex;flex:0 0 auto;align-items:center;gap:12px;height:64px;padding:0 clamp(12px,2.4vw,28px);background:#fff;border-bottom:1px solid var(--g-line);
  font-family:var(--g-sans);color:var(--g-ink);z-index:50}
.gs-back{appearance:none;display:inline-flex;align-items:center;gap:6px;border:0;background:var(--g-paper);border-radius:999px;padding:9px 14px 9px 11px;font:600 14px var(--g-sans);color:var(--g-ink);cursor:pointer}
.gs-back:hover{background:var(--g-blush)}
.gs-title{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.2}
.gs-title b{font-family:var(--g-serif);font-size:19px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gs-title small{font-size:12px;color:var(--g-muted)}
.gs-title small .bi{color:#3F7A47}
.gs-go{appearance:none;display:inline-flex;align-items:center;gap:9px;border:0;border-radius:999px;padding:9px 10px 9px 20px;background:var(--g-ink);color:#FFF8F1;font:700 15px var(--g-sans);
  cursor:pointer;white-space:nowrap;box-shadow:0 10px 22px rgba(46,39,41,.22);transition:transform .15s,background .2s}
.gs-go:hover{background:#41383A;transform:translateY(-1px)}
.gs-go .bi{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.14)}
.gs-go-p{padding:4px 9px;border-radius:999px;background:var(--g-rose);font-size:12.5px}

/* split: editor column + full-height preview */
html.gs-on.gs-split .gift-preview-layout{flex:1;min-height:0;display:grid !important;grid-template-columns:minmax(380px,560px) minmax(0,1fr);gap:0 !important;margin:0 !important;padding:0 !important;max-width:none !important}
html.gs-on.gs-split .gift-live-controls{height:100%;max-height:none !important;overflow-y:auto !important;overflow-x:hidden;padding:26px clamp(18px,2.4vw,34px) 120px !important;margin:0 !important;
  background:#fff;border-right:1px solid var(--g-line);border-radius:0 !important;box-shadow:none !important;overscroll-behavior:contain}
html.gs-on.gs-split .gift-preview-wrap{position:relative !important;top:auto !important;height:100%;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;margin:0 !important;padding:20px !important;
  background:radial-gradient(circle at 50% 38%,rgba(244,220,218,.75),transparent 58%),radial-gradient(circle at 80% 90%,rgba(245,232,189,.5),transparent 50%),#F6F0E7}
html.gs-on.gs-split .gift-preview-wrap .gift-preview-hint{margin:6px 0 0;font-size:13px;color:var(--g-muted);text-align:center}
html.gs-on.gs-split .gift-phone,html.gs-on.gs-split .mjmb-phone{--phone-w:min(360px,calc((100vh - 64px - 120px) * 9 / 19.5))}
.gs-sample{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);z-index:5;align-items:center;gap:6px;padding:7px 14px;border-radius:999px;background:var(--g-ink);color:#fff;font:600 12.5px var(--g-sans);white-space:nowrap;box-shadow:0 8px 20px rgba(0,0,0,.18)}
html.gs-sampling .gs-sample{display:inline-flex}

/* the names section that used to be step 1 */
.gs-names{margin:0 0 22px;padding:18px;border-radius:20px;background:linear-gradient(160deg,#FFF5F3,#FFFBF6);border:1px solid #F1DCD7}
.gs-names-h{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.gs-names-h b{display:block;font-family:var(--g-serif);font-size:20px;line-height:1.1;color:var(--g-ink)}
.gs-names-h small{display:block;font-size:12.5px;color:var(--g-muted)}
.gs-names-ic{flex:0 0 40px;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--g-ink);color:#fff;font-size:18px}
.gs-names .gift-form-grid{margin-top:0}

/* flow: builders that are one long editor (Make Your Own, YWS) */
html.gs-on.gs-flow #giftBuilder > .gift-panel:not([hidden]){overflow-y:auto}
html.gs-on.gs-flow #giftBuilder .gift-panel-body{overflow:visible;flex:none;display:block;padding:20px clamp(12px,3vw,40px) 60px}
html.gs-on.gs-flow #giftBuilder .myo-steps{display:none}
html.gs-on.gs-flow #giftBuilder .myoe{border-radius:18px}

/* the phone: a modern frame */
html.gs-on .gift-phone,html.gs-on .mjmb-phone{height:calc(var(--phone-w,300px) * 2.09)}
html.gs-on .gift-phone,html.gs-on .myoe-phone{background:#0E0C0D;border:0;border-radius:calc(var(--phone-w,300px) * .16);padding:calc(var(--phone-w,300px) * .032);
  box-shadow:0 0 0 1.5px #403A3B,0 0 0 4px #1A1617,0 2px 0 5px #2A2425,0 40px 80px rgba(46,39,41,.28),0 12px 24px rgba(46,39,41,.16)}
html.gs-on .gift-phone::before,html.gs-on .gift-phone::after{content:"";position:absolute;width:4px;border-radius:3px;background:#2A2425}
html.gs-on .gift-phone::before{left:-7px;top:22%;height:11%}
html.gs-on .gift-phone::after{right:-7px;top:26%;height:16%}
html.gs-on .gift-phone-notch{display:none !important}
html.gs-on .gift-phone-screen,html.gs-on .mjmb-phone-screen{border-radius:calc(var(--phone-w,300px) * .13) !important}

/* phone widths: preview on top (like the gift itself), steps under it, price + button in a bottom dock */
.gs-dock{display:none}
@media (max-width: 899px){
  html.gs-on .gs-bar{height:56px;gap:8px}
  .gs-back span{display:none}
  .gs-back{padding:9px 11px}
  .gs-title b{font-size:17px}
  html.gs-on .gs-go{display:none}
  .gs-saved span{display:none}
  html.gs-on.gs-split .gift-preview-layout{display:flex !important;flex-direction:column;height:auto;overflow:visible}
  html.gs-on.gs-split .gift-preview-wrap{order:-1;display:flex !important;height:auto;padding:18px 16px 14px !important;border-bottom:1px solid var(--g-line)}
  html.gs-on.gs-split .gift-preview-wrap .gift-preview-hint{display:none}
  html.gs-on.gs-split .gift-phone,html.gs-on.gs-split .mjmb-phone{--phone-w:min(56vw,230px,calc((100vh - 56px - 74px) * .42))}
  html.gs-on.gs-split .gift-live-controls{height:auto;overflow:visible !important;border:0;padding:16px 14px 30px !important}
  .gs-sample{bottom:10px;font-size:11.5px;padding:5px 11px}
  html.gs-on.gs-flow #giftBuilder .gift-panel-body{padding:12px 8px 40px}
  html.gs-on .gs-dock{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px calc(10px + env(safe-area-inset-bottom));
    background:rgba(255,255,255,.97);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:1px solid var(--g-line);font-family:var(--g-sans);z-index:60}
  .gs-dock-l{display:flex;flex-direction:column;line-height:1.2;min-width:0}
  .gs-dock-s{font-size:12px;color:#3F7A47;font-weight:600;white-space:nowrap}
  html.gs-saving .gs-dock-s{color:var(--g-muted)}
  .gs-dock-p{font-size:13px;color:var(--g-muted)}
  .gs-dock-p b{font-family:var(--g-serif);font-size:22px;color:var(--g-ink)}
  .gs-dock-go{appearance:none;flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;border:0;border-radius:16px;padding:14px 20px;background:var(--g-ink);color:#FFF8F1;font:700 15.5px var(--g-sans);
    box-shadow:0 10px 24px rgba(46,39,41,.25);cursor:pointer}
}

/* ---------------- "Make it yours" popup ---------------- */
.gs-co{position:fixed;inset:0;z-index:1400;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(36,29,31,.58);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);
  opacity:0;pointer-events:none;transition:opacity .25s}
.gs-co.is-on{opacity:1;pointer-events:auto}
.gs-co-b{position:relative;display:grid;grid-template-columns:minmax(0,380px) minmax(0,1fr);grid-template-rows:minmax(0,1fr);width:min(100%,980px);height:min(820px,calc(100vh - 40px));height:min(820px,calc(100dvh - 40px));overflow:hidden;border-radius:30px;background:#fff;
  box-shadow:0 40px 100px rgba(0,0,0,.35);transform:translateY(18px) scale(.98);transition:transform .32s cubic-bezier(.22,.8,.28,1);font-family:var(--g-sans);color:var(--g-ink)}
.gs-co.is-on .gs-co-b{transform:none}
.gs-co-b > *{min-width:0}

/* left: what you are getting */
.gs-co-sum{min-height:0;overflow-y:auto;padding:22px;background:linear-gradient(170deg,#FCEDEA 0%,#FBF5EC 55%,#F6EEE2 100%);border-right:1px solid #F1E3D6}
.gs-co-art{border-radius:20px;overflow:hidden;aspect-ratio:16/9;box-shadow:0 14px 30px rgba(46,39,41,.15);background:#fff}
.gs-co-art img{display:block;width:100%;height:100%;object-fit:cover}
.gs-co-gift{margin-top:16px}
.gs-co-gift small,.gs-co-inc small{display:block;font-size:11px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--g-rose-d)}
.gs-co-gift b{display:block;margin-top:4px;font-family:var(--g-serif);font-size:26px;line-height:1.1;font-weight:600}
.gs-co-price{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px;margin-top:8px}
.gs-co-now{font-family:var(--g-serif);font-size:30px;font-weight:700;line-height:1}
.gs-co-price del{color:var(--g-muted);font-size:15px}
.gs-co-price em{font-style:normal;padding:3px 9px;border-radius:999px;background:#E3F1E1;color:#3F7A47;font-size:12px;font-weight:700}
.gs-co-inc{margin-top:18px;padding:16px;border-radius:18px;background:rgba(255,255,255,.75);border:1px solid #F0E3D7}
.gs-co-inc ul{list-style:none;margin:10px 0 0;padding:0;display:grid;grid-template-columns:1fr;gap:9px}
.gs-co-inc li{display:flex;align-items:center;gap:10px;font-size:13.5px}
.gs-co-inc .bi{flex:0 0 26px;width:26px;height:26px;border-radius:8px;display:grid;place-items:center;background:var(--g-blush);color:#8E4D55;font-size:13px}
.gs-co-flow .gift-payflow{margin:16px 0 0;background:transparent;border:0;padding:0}

/* right: extras, coupon, details, total, pay */
.gs-co-main{display:flex;flex-direction:column;min-height:0;height:100%;overflow:hidden}
.gs-co-h{flex:0 0 auto;display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:22px 24px 12px}
.gs-co-h b{display:block;font-family:var(--g-serif);font-size:30px;line-height:1;font-weight:600}
.gs-co-h small{display:flex;align-items:center;gap:6px;margin-top:8px;font-size:13.5px;color:#3F7A47;font-weight:600}
.gs-co-h small .bi{color:var(--g-rose)}
.gs-co-x{appearance:none;flex:0 0 40px;width:40px;height:40px;border-radius:50%;border:0;background:var(--g-paper);cursor:pointer;font-size:15px;color:var(--g-ink)}
.gs-co-x:hover{background:var(--g-blush)}
.gs-co-body{flex:1;min-height:0;overflow-y:auto;padding:4px 24px 24px;overscroll-behavior:contain}
.gs-co-body .gift-buy-box{margin:0;border:0;box-shadow:none;background:transparent;padding:0;max-width:none;display:flex;flex-direction:column;gap:12px}
.gs-co-body #buyPriceTitle,.gs-co-body #buyPriceNote{display:none}
.gs-co-body .gift-buy-box .gs-co-l{margin:6px 0 -2px;display:flex;align-items:baseline;justify-content:space-between;font-family:var(--g-serif);font-size:19px;font-weight:600;color:var(--g-ink)}
.gs-co-body .gift-buy-box .gs-co-l span{font-family:var(--g-sans);font-size:12px;font-weight:500;color:var(--g-muted)}
.gs-co-body .gift-reveal{margin:0;border-radius:18px;box-shadow:none}
.gs-co-body .gift-coupon{margin:0}
.gs-co-body .gift-form-grid{margin:0;gap:10px}
.gs-co-body .gift-field input{font-size:16px}
.gs-co-total{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-top:6px;padding:14px 0 2px;border-top:1px dashed var(--g-line)}
.gs-co-total span{font-weight:700;font-size:15px}
.gs-co-total b{font-family:var(--g-serif);font-size:32px;line-height:1;font-weight:700;color:var(--g-ink)}
.gs-co-total b *{font-size:inherit;font-family:inherit;font-weight:inherit;color:inherit}
.gs-co-total b del,.gs-co-total b .gift-price-was{font-family:var(--g-sans);font-size:15px;font-weight:500;color:var(--g-muted);margin-right:6px}
.gs-co-body #buyBtn{margin:0;border-radius:18px;padding:17px 20px;font-size:17px;background:var(--g-ink) !important;color:#FFF8F1 !important;border:0;box-shadow:0 14px 30px rgba(46,39,41,.25)}
.gs-co-body #buyBtn:hover{background:#41383A !important}
.gs-co-body #buyBtn .bi{color:#F2A7AE}
.gs-co-body .gift-paymethods{justify-content:center;margin:0}
.gs-co-body .gift-muted{margin:0;text-align:center}

@media (max-width: 760px){
  .gs-co{align-items:flex-end;padding:0}
  /* as tall as what is in it (the iOS app has no buyer fields), never taller than the screen */
  .gs-co-b{display:flex;flex-direction:column;width:100%;height:auto;max-height:92vh;max-height:92dvh;border-radius:26px 26px 0 0;transform:translateY(40px)}
  .gs-co-main{flex:0 1 auto;min-height:0;height:auto}
  .gs-co-body{flex:0 1 auto}
  .gs-co-sum{flex:0 0 auto;display:grid;grid-template-columns:72px minmax(0,1fr);gap:12px;align-items:center;padding:14px 60px 14px 18px;border-right:0;border-bottom:1px solid #F1E3D6;overflow:visible}
  .gs-co-art{border-radius:14px;aspect-ratio:1/1}
  .gs-co-gift{margin:0}
  .gs-co-gift b{font-size:20px}
  .gs-co-now{font-size:22px}
  .gs-co-inc,.gs-co-flow{display:none}
  .gs-co-h{padding:16px 18px 6px}
  .gs-co-h b{font-size:24px}
  .gs-co-body{padding:4px 18px calc(18px + env(safe-area-inset-bottom))}
}
.gs-toast{position:fixed;left:50%;bottom:90px;z-index:1500;transform:translate(-50%,20px);max-width:min(92vw,460px);padding:12px 18px;border-radius:16px;background:#2E2729;color:#fff;font:500 14px/1.4 "DM Sans",sans-serif;
  box-shadow:0 14px 34px rgba(0,0,0,.3);opacity:0;transition:opacity .25s,transform .25s;pointer-events:none}
.gs-toast.is-on{opacity:1;transform:translate(-50%,0)}
html.gs-co-on{overflow:hidden}
@media (prefers-reduced-motion: reduce){.gs-co,.gs-co-b{transition:none}}

/* the "save a draft to your account" strip: its button lives in the bar now */
html.gs-on #giftCloudBar{display:none !important}
.gs-saved{appearance:none;display:inline-flex;align-items:center;gap:6px;border:0;background:none;padding:8px 10px;border-radius:999px;font:600 13px var(--g-sans);color:#3F7A47;cursor:pointer;white-space:nowrap}
.gs-saved:hover{background:#EEF6EC}
.gs-saved .bi{font-size:16px}
html.gs-saving .gs-saved{color:var(--g-muted)}

/* step-by-step sections */
html.gs-on .gs-step{margin:0 0 10px}
html.gs-on .gs-step > summary{gap:10px}
.gs-num{flex:0 0 24px;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:var(--g-ink);color:#fff;font:700 12px var(--g-sans)}
.gs-num:empty{display:none}
.gs-step[open] .gs-num{background:var(--g-rose)}
.gs-step .gift-acc-body > .gift-field{margin-top:0}
.gs-lab-dup{display:none !important}
.gs-dupe{display:none !important}
.gs-step .gs-names{margin:0;padding:0;border:0;background:none}

/* total + pay pinned to the bottom of the popup's scroll */
.gs-co-foot{position:sticky;bottom:-24px;z-index:4;margin:4px -24px -24px;padding:12px 24px 18px;background:linear-gradient(180deg,rgba(255,255,255,.9),#fff 22%);border-top:1px solid var(--g-line);display:flex;flex-direction:column;gap:10px}
.gs-co-foot .gs-co-total{margin:0;padding:0;border:0}
.gs-co-foot .gift-error{margin:0}
@media (max-width: 760px){.gs-co-foot{bottom:calc(-18px - env(safe-area-inset-bottom));margin:4px -18px calc(-18px - env(safe-area-inset-bottom));padding:10px 18px calc(14px + env(safe-area-inset-bottom))}}
@media (max-width: 760px){
  .gs-co-sum{grid-template-columns:52px minmax(0,1fr);padding:10px 56px 10px 16px}
  .gs-co-gift small{display:none}
  .gs-co-gift b{font-size:17px}
  .gs-co-now{font-size:18px}
  .gs-co-h{padding:10px 16px 2px}
  .gs-co-h b{font-size:21px}
  .gs-co-h small{margin-top:4px;font-size:12px}
  .gs-co-x{position:absolute;top:12px;right:12px}
}
/* phone: nothing in the editor column may shrink — it scrolls instead */
@media (max-width: 899px){
  html.gs-on.gs-split #giftBuilder > .gift-panel:not([hidden]){display:block !important;overflow-y:auto !important;overflow-x:hidden !important;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
  html.gs-on.gs-split .gift-panel-body{display:block !important;overflow:visible !important}
  html.gs-on.gs-split .gift-preview-layout{flex:none !important;min-height:auto !important}
  html.gs-on.gs-split .gift-preview-wrap,html.gs-on.gs-split .gift-live-controls{flex:none !important;min-height:auto !important;max-height:none !important}
  html.gs-on.gs-split .gift-preview-wrap{overflow:visible}
}

.gs-dock-pv{appearance:none;flex:0 0 auto;display:inline-flex;flex-direction:column;align-items:center;gap:1px;border:0;background:none;padding:4px 6px;margin-left:auto;font:600 11px var(--g-sans);color:var(--g-ink);cursor:pointer}
.gs-dock-pv .bi{font-size:19px}
/* the old pay panel never shows in the studio (its box lives in the popup) */
html.gs-on #giftBuilder > #stepBuy{display:none !important}

/* ---------------- Phone | Desktop preview switch (desktop screens only) ---------------- */
.gs-device{display:none}
@media (min-width: 900px){
  html.gs-on.gs-split .gift-preview-wrap{padding-top:64px !important}
  html.gs-on .gs-device{display:inline-flex;position:absolute;top:16px;left:50%;transform:translateX(-50%);z-index:6;gap:2px;padding:4px;border-radius:999px;background:#fff;
    box-shadow:0 6px 18px rgba(46,39,41,.1);border:1px solid var(--g-line);font-family:var(--g-sans)}
  .gs-device button{appearance:none;display:inline-flex;align-items:center;gap:6px;border:0;background:none;border-radius:999px;padding:7px 14px;font:600 13px var(--g-sans);color:var(--g-muted);cursor:pointer}
  .gs-device button.is-on{background:var(--g-ink);color:#fff}
  /* the phone becomes a laptop browser window, the gift renders at 1280px */
  html.gs-on.gs-desk .gift-preview-wrap .gift-phone,html.gs-on.gs-desk .gift-preview-wrap .mjmb-phone{
    --phone-w:var(--gs-dw,900px);width:var(--gs-dw,900px) !important;height:var(--gs-dh,600px) !important;padding:34px 0 0 !important;border-radius:14px !important;background:#F3EEE8 !important;
    box-shadow:0 0 0 1px #DCD3CA,0 30px 70px rgba(46,39,41,.22) !important}
  html.gs-on.gs-desk .gift-preview-wrap .gift-phone::before{left:16px;top:12px;width:52px;height:10px;border-radius:0;background:radial-gradient(circle at 5px 5px,#F26D5F 4px,transparent 4.5px),radial-gradient(circle at 23px 5px,#F5BE4F 4px,transparent 4.5px),radial-gradient(circle at 41px 5px,#5FC454 4px,transparent 4.5px)}
  html.gs-on.gs-desk .gift-preview-wrap .gift-phone::after,html.gs-on.gs-desk .gift-preview-wrap .gift-phone-notch{display:none !important}
  html.gs-on.gs-desk .gift-preview-wrap .gift-phone-screen,html.gs-on.gs-desk .gift-preview-wrap .mjmb-phone-screen{border-radius:0 0 13px 13px !important;background:#fff}
  html.gs-on.gs-desk .gift-preview-wrap .gift-phone-scaler{width:1280px !important;height:var(--gs-sh,800px) !important;transform:scale(var(--gs-ds,.6)) !important;-webkit-transform:scale(var(--gs-ds,.6)) !important;transform-origin:top left !important}
  html.gs-on.gs-desk .gift-preview-wrap iframe:not(.gift-phone-scaler iframe){width:1280px !important;height:var(--gs-sh,800px) !important;transform:scale(var(--gs-ds,.6)) !important;transform-origin:top left !important;zoom:1 !important}
}

.gd-expired{display:flex;align-items:center;gap:10px;margin:6px 0 0;padding:12px 16px;border-radius:16px;background:#FFF4E5;border:1px solid #F3D9B1;color:#7A4E14;font-size:14px}

/* ---------------- "save it to your account?" (guests leaving the editor; cute pass 2026-11-04) ---------------- */
.gs-save{position:fixed;inset:0;z-index:1450;display:flex;align-items:center;justify-content:center;padding:18px;background:rgba(36,29,31,.5);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  opacity:0;pointer-events:none;transition:opacity .22s;font-family:var(--g-sans);color:var(--g-ink)}
.gs-save.is-on{opacity:1;pointer-events:auto}
.gs-save-b{position:relative;width:min(100%,430px);padding:26px 24px 16px;border-radius:30px;overflow:hidden;text-align:center;
  background:radial-gradient(420px 220px at 50% -40px,#FFDCE5,transparent 70%),radial-gradient(300px 200px at 100% 100%,#FFF1CF,transparent 70%),#FFFDF8;
  box-shadow:0 30px 80px rgba(0,0,0,.3);transform:translateY(18px) scale(.96);transition:transform .38s cubic-bezier(.2,1.3,.4,1)}
.gs-save.is-on .gs-save-b{transform:none}
.gs-save-art{position:relative;display:block;width:150px;height:96px;margin:2px auto 10px}
.gs-save-env{position:absolute;left:33px;top:20px;width:84px;height:60px;border-radius:12px;background:linear-gradient(160deg,#fff,#FCE7EC);
  box-shadow:0 14px 26px -10px rgba(180,35,107,.45),inset 0 0 0 1.5px #F4C3CF;animation:gsBob 3.4s ease-in-out infinite}
.gs-save-flap{position:absolute;left:0;right:0;top:0;height:34px;background:linear-gradient(160deg,#F9D3DC,#F4B6C5);clip-path:polygon(0 0,100% 0,50% 100%);border-radius:12px 12px 0 0}
.gs-save-heart{position:absolute;left:50%;top:16px;translate:-50% 0;font-style:normal;font-size:24px;animation:gsBeat 1.8s ease-in-out infinite}
.gs-save-f{position:absolute;font-style:normal;font-size:18px;animation:gsFloat 3s ease-in-out infinite}
.gs-save-f1{left:6px;top:8px}
.gs-save-f2{right:4px;top:0;font-size:20px;animation-delay:-1s}
.gs-save-f3{right:14px;bottom:0;font-size:16px;animation-delay:-2s}
@keyframes gsBob{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-6px) rotate(3deg)}}
@keyframes gsBeat{0%,100%{transform:scale(1)}15%{transform:scale(1.2)}30%{transform:scale(1)}45%{transform:scale(1.1)}}
@keyframes gsFloat{0%,100%{transform:translateY(0) scale(.9);opacity:.75}50%{transform:translateY(-8px) scale(1.08);opacity:1}}
.gs-save-t{display:block;font-family:var(--g-serif);font-size:28px;line-height:1.08;font-weight:600}
.gs-save-p{margin:8px auto 0;max-width:340px;font-size:14.5px;line-height:1.55;color:#5C5053}
.gs-save-l{list-style:none;margin:16px 0 18px;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.gs-save-l li{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 6px;border-radius:16px;background:rgba(255,255,255,.85);
  border:1px solid #F3E3DC;font-size:12px;font-weight:600;line-height:1.3;color:#5C5053}
.gs-save-l li i{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#FBE9ED;color:#B4236B;font-size:17px}
.gs-save-l li:nth-child(2) i{background:#FBF0D6;color:#9A6A12}
.gs-save-l li:nth-child(3) i{background:#E6EEDF;color:#4B7A43}
.gs-save-go{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:16px 18px;border-radius:18px;background:var(--g-ink);color:#FFF8F1 !important;font:700 16px var(--g-sans);text-decoration:none;
  box-shadow:0 14px 28px -8px rgba(46,39,41,.45);transition:transform .15s,background .2s}
.gs-save-go .bi{color:#F59AB0}
.gs-save-go:hover{background:#41383A;transform:translateY(-1px)}
.gs-save-go:active{transform:scale(.98)}
.gs-save-stay{appearance:none;display:block;width:100%;margin-top:8px;padding:13px;border-radius:16px;border:1.5px solid #EADBD3;background:#fff;color:var(--g-ink);font:700 14.5px var(--g-sans);cursor:pointer}
.gs-save-stay:hover{border-color:#E8A9B9}
.gs-save-leave{appearance:none;margin-top:8px;border:0;background:none;color:var(--g-muted);font:600 13px var(--g-sans);text-decoration:underline;text-underline-offset:3px;cursor:pointer;padding:8px}
.gs-save-x{appearance:none;position:absolute;z-index:2;top:12px;right:12px;width:36px;height:36px;border-radius:50%;border:0;background:rgba(255,255,255,.85);cursor:pointer;color:var(--g-ink)}
@media (max-width: 600px){.gs-save{align-items:flex-end;padding:0}.gs-save-b{width:100%;border-radius:28px 28px 0 0;padding-bottom:calc(14px + env(safe-area-inset-bottom));transform:translateY(100%)}
  .gs-save-b::before{content:"";display:block;width:42px;height:5px;margin:-12px auto 12px;border-radius:9px;background:#E6D7D0}}
@media (prefers-reduced-motion: reduce){.gs-save-env,.gs-save-heart,.gs-save-f{animation:none}}

/* ---------------- popup: compact add-ons, one-line coupon, secured line in the footer ---------------- */
.gs-co-body .gift-buy-box{gap:10px}
.gs-co-body .gift-buy-box .gs-co-l{font-size:16px;margin:2px 0 -4px}
.gs-co-body .gift-reveal{margin:0;padding:12px 14px;border:1px solid var(--g-line) !important;border-radius:16px;background:#fff !important;box-shadow:none !important}
.gs-co-body .gift-reveal::before,.gs-co-body .gift-reveal::after{display:none !important}
.gs-co-body .gift-reveal + .gift-reveal{margin-top:-11px;border-top-left-radius:0;border-top-right-radius:0}
.gs-co-body .gift-reveal:has(+ .gift-reveal){border-bottom-left-radius:0;border-bottom-right-radius:0}
.gs-co-body .gift-reveal__head{display:grid;grid-template-columns:34px minmax(0,1fr) auto auto;align-items:center;gap:10px;cursor:pointer}
.gs-co-body .gift-reveal__ico{width:34px;height:34px;border-radius:10px;display:grid;place-items:center}
.gs-co-body .gift-reveal__ico svg{width:17px;height:17px}
.gs-co-body .gift-reveal__copy strong{display:flex;align-items:center;gap:6px;font-size:14.5px;line-height:1.25}
.gs-co-body .gift-reveal__copy em{font-size:9.5px;padding:2px 6px;letter-spacing:.04em}
.gs-co-body .gift-reveal__copy small{display:block;margin-top:2px;font-size:12.5px;line-height:1.35;color:var(--g-muted)}
.gs-co-body .gift-reveal__price{grid-column:auto !important;grid-row:auto !important;font-size:14px;color:var(--g-rose-d)}
.gs-co-body .gift-reveal__switch{grid-column:auto !important;grid-row:auto !important}
.gs-co-body .gift-reveal__body{margin-top:10px;padding-top:10px}
.gs-co-body .gift-reveal__row input,.gs-co-body .gift-notify__fields input{font-size:16px}
.gs-co-body .gift-coupon{margin:0}
.gs-co-body .gift-coupon-card{display:flex;align-items:center;gap:10px;padding:8px 8px 8px 12px;border-radius:14px;border:1px dashed #E3CFC7;background:#FFFAF6;box-shadow:none}
.gs-co-body .gift-coupon-head{flex:0 0 auto;display:flex;align-items:center;gap:8px;margin:0}
.gs-co-body .gift-coupon-icon{width:30px;height:30px;font-size:15px}
.gs-co-body .gift-coupon-title{margin:0;font-size:13.5px;font-weight:700;white-space:nowrap}
.gs-co-body .gift-coupon-hint{display:none}
.gs-co-body .gift-coupon-entry{flex:1;min-width:0;margin:0}
.gs-co-body .gift-coupon-row{display:flex;gap:6px;margin:0}
.gs-co-body .gift-coupon-row input{flex:1;min-width:0;height:40px;padding:0 12px;font-size:16px;border-radius:10px}
.gs-co-body .gift-coupon-apply{height:40px;padding:0 14px;border-radius:10px;font-size:14px;flex:0 0 auto}
.gs-co-body .gift-coupon-msg{margin:6px 0 0;font-size:12.5px}
.gs-co-body .gift-coupon-success{padding:2px 0}
.gs-co-foot .gift-paymethods{justify-content:center;gap:4px;margin:0;font-size:11px}
.gs-co-foot .gift-paymethods .gift-paymethod{padding:2px 7px;font-size:10.5px}
.gs-co-foot .gs-co-secure{margin:0 !important;text-align:center;font-size:12px;color:var(--g-muted)}
.gs-co-foot .gs-co-secure .bi{color:#3F7A47}
@media (max-width: 760px){
  .gs-co-body .gift-reveal{padding:10px 12px}
  .gs-co-body .gift-reveal__head{grid-template-columns:30px minmax(0,1fr) auto auto;gap:8px}
  .gs-co-body .gift-reveal__ico{width:30px;height:30px}
  .gs-co-body .gift-reveal__copy small{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
  .gs-co-body .gift-reveal:has(.gift-reveal__switch:checked) .gift-reveal__copy small{-webkit-line-clamp:unset;display:block}
  .gs-co-body .gift-coupon-title{display:none}
  .gs-co-body .gift-coupon-card{padding:6px 6px 6px 10px}
  .gs-co-foot .gift-paymethods{display:none}
  .gs-co-foot{gap:8px}
}
.gs-co-body .gift-coupon-row{flex-direction:row !important;flex-wrap:nowrap !important;align-items:center}
.gs-co-body .gift-coupon-row input{width:auto !important;margin:0 !important}
.gs-co-body .gift-coupon-apply{width:auto !important;margin:0 !important;min-width:0}

/* add-on price on a step title (+₹49 own audio) */
.gs-price-tag{display:inline-flex;align-items:center;margin-left:8px;padding:2px 8px;border-radius:999px;background:#FCE7EA;color:#A8475A;font:700 11px/1.5 'DM Sans',system-ui,sans-serif;vertical-align:2px;white-space:nowrap}

/* the apps: the builder is the page (their own bar has the back button) */
html.gs-app .gs-back{display:none}
.gs-co-l[hidden]{display:none !important}
.gs-co-body #buyBtn del{display:none}
.gs-dock-pv.is-ping .bi{animation:gsPing 1.2s ease 2}
@keyframes gsPing{0%,100%{transform:none;color:inherit}40%{transform:scale(1.25) rotate(-8deg);color:#C98287}}
@media (prefers-reduced-motion: reduce){.gs-dock-pv.is-ping .bi{animation:none}}

/* Phone ↔ Desktop: the frame travels to its new size and the page fades back in (assets/js/device-morph.js) */
.dsc-dev-morph{transition:width .6s cubic-bezier(.65,0,.25,1),height .6s cubic-bezier(.65,0,.25,1),border-radius .6s ease,padding .6s ease !important;overflow:hidden}
.dsc-dev-morph .gift-phone-screen,.dsc-dev-morph .mjmb-phone-screen,.dsc-dev-morph > iframe,.dsc-dev-morph .myoe-screen{animation:dscDevFade .7s ease both}
@keyframes dscDevFade{0%,35%{opacity:0}100%{opacity:1}}
@media (prefers-reduced-motion: reduce){.dsc-dev-morph,.dsc-dev-morph *{transition:none !important;animation:none !important}}
.gs-photo-note{display:flex;gap:7px;align-items:flex-start;margin:8px 0 2px;padding:9px 12px;border-radius:12px;background:#FBF3EA;color:#74696B;font:500 12.5px/1.45 'DM Sans',sans-serif}
.gs-photo-note[hidden]{display:none}
.gs-photo-note .bi{color:#C98287;margin-top:1px}

/* ---------------- "wait, 10% off" (anyone leaving the editor with work in it; 2026-11-05) ---------------- */
.gs-save-heart.bi{font-size:22px;color:#E0517A}
.gs-save-f.bi{color:#D98A9B}
.gs-save-f3.bi{color:#C9A15A}
.gs-save-code{display:inline-flex;align-items:center;gap:7px;margin:12px auto 0;padding:7px 13px;border-radius:999px;background:#E8F3E6;color:#2F6B3A;font-size:12.5px;font-weight:700}
.gs-save-code[hidden]{display:none}
.gs-save-leave .bi{font-size:12px;margin-right:2px}

.gs-stay{position:fixed;inset:0;z-index:1460;display:flex;align-items:center;justify-content:center;padding:18px;background:rgba(36,29,31,.52);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  opacity:0;pointer-events:none;transition:opacity .22s;font-family:var(--g-sans);color:var(--g-ink)}
.gs-stay.is-on{opacity:1;pointer-events:auto}
.gs-stay-b{position:relative;width:min(100%,420px);padding:24px 22px 16px;border-radius:30px;text-align:center;overflow:hidden;
  background:radial-gradient(380px 200px at 50% -30px,#FFE3D2,transparent 70%),radial-gradient(260px 200px at 0 100%,#FDE3EA,transparent 70%),#FFFDF8;
  box-shadow:0 30px 80px rgba(0,0,0,.3);transform:translateY(18px) scale(.96);transition:transform .4s cubic-bezier(.2,1.3,.4,1)}
.gs-stay.is-on .gs-stay-b{transform:none}
.gs-stay-x{appearance:none;position:absolute;z-index:2;top:12px;right:12px;width:36px;height:36px;border-radius:50%;border:0;background:rgba(255,255,255,.85);cursor:pointer;color:var(--g-ink)}

/* the ticket */
.gs-stay-tk{position:relative;width:min(100%,290px);margin:10px auto 16px;animation:gsTkIn .7s cubic-bezier(.2,1.4,.4,1) both .08s}
.gs-stay-tk-in{position:relative;display:grid;grid-template-columns:104px 1fr;align-items:stretch;min-height:96px;border-radius:18px;color:#fff;
  background:linear-gradient(135deg,#E86A8A 0%,#D9577B 45%,#C2416A 100%);box-shadow:0 16px 34px rgba(194,65,106,.35),inset 0 1px 0 rgba(255,255,255,.35);
  -webkit-mask:radial-gradient(circle 11px at 104px 0,#0000 98%,#000) top/100% 51% no-repeat,radial-gradient(circle 11px at 104px 100%,#0000 98%,#000) bottom/100% 51% no-repeat;
          mask:radial-gradient(circle 11px at 104px 0,#0000 98%,#000) top/100% 51% no-repeat,radial-gradient(circle 11px at 104px 100%,#0000 98%,#000) bottom/100% 51% no-repeat}
.gs-stay-tk-in::after{content:"";position:absolute;left:104px;top:14px;bottom:14px;border-left:2px dashed rgba(255,255,255,.55)}
.gs-stay-tk-in::before{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.35) 45%,transparent 60%);background-size:250% 100%;animation:gsTkShine 3.2s ease-in-out infinite 1s}
.gs-stay-tk-l{display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1}
.gs-stay-tk-l b{font-family:var(--g-serif);font-size:46px;font-weight:700;letter-spacing:-.02em}
.gs-stay-tk-l small{margin-top:2px;font-size:12px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;opacity:.9}
.gs-stay-tk-r{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:6px;padding:12px 16px 12px 20px;text-align:left;min-width:0}
.gs-stay-tk-r small{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;opacity:.85}
.gs-stay-tk-code{font-style:normal;font-family:var(--g-serif);font-size:22px;font-weight:600;line-height:1.1;overflow-wrap:anywhere}
.gs-stay.is-won .gs-stay-tk-code{white-space:nowrap;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:clamp(12px,3.6vw,15px);font-weight:700;letter-spacing:.06em;padding:5px 9px;border-radius:9px;background:rgba(255,255,255,.2);border:1.5px dashed rgba(255,255,255,.7)}
.gs-stay.is-won .gs-stay-tk{animation:gsTkWin .6s cubic-bezier(.2,1.5,.4,1)}
.gs-stay-sp{position:absolute;z-index:1;font-style:normal;animation:gsFloat 3s ease-in-out infinite}
.gs-stay-sp1{left:-14px;top:-8px;font-size:20px;color:#E7A93C}
.gs-stay-sp2{right:24%;top:-9px;font-size:15px;color:#E0517A;animation-delay:-1s}
.gs-stay-sp3{right:22px;bottom:-12px;font-size:12px;color:#E7A93C;animation-delay:-2s}

.gs-stay-t{display:block;font-family:var(--g-serif);font-size:30px;line-height:1.05;font-weight:600}
.gs-stay-p{margin:8px auto 0;max-width:330px;font-size:14.5px;line-height:1.55;color:#5C5053}
.gs-stay-price{display:flex;align-items:baseline;justify-content:center;gap:8px;margin:12px 0 0;font-size:13px;color:var(--g-muted)}
.gs-stay-price del{font-size:15px}
.gs-stay-price b{font-family:var(--g-serif);font-size:26px;line-height:1;color:var(--g-ink)}
.gs-stay-price[hidden]{display:none}
.gs-stay-go{appearance:none;display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:16px;padding:16px 18px;border:0;border-radius:18px;cursor:pointer;
  background:var(--g-ink);color:#FFF8F1;font:700 16px var(--g-sans);box-shadow:0 14px 30px rgba(46,39,41,.25);transition:transform .15s,background .15s}
.gs-stay-go .bi{color:#F59AB0}
.gs-stay-go:hover{background:#41383A;transform:translateY(-1px)}
.gs-stay-go:active{transform:scale(.98)}
.gs-stay-go:disabled{opacity:.7;cursor:wait}
.gs-stay.is-won .gs-stay-go,.gs-stay.is-won .gs-stay-no,.gs-stay.is-won .gs-stay-price{display:none}
.gs-stay-no{appearance:none;display:block;width:100%;margin-top:8px;padding:12px;border-radius:16px;border:0;background:none;color:var(--g-muted);font:600 13.5px var(--g-sans);cursor:pointer}
.gs-stay-no:hover{color:var(--g-ink)}
.gs-stay-fine{display:flex;align-items:center;justify-content:center;gap:6px;margin:6px 0 0;font-size:11.5px;color:var(--g-muted)}
.gs-stay-fine .bi{color:#4B7A43}
@keyframes gsTkIn{from{opacity:0;transform:translateY(14px) rotate(-6deg) scale(.85)}to{opacity:1;transform:none}}
@keyframes gsTkWin{0%{transform:scale(1)}40%{transform:scale(1.07) rotate(-2deg)}100%{transform:none}}
@keyframes gsTkShine{0%{background-position:150% 0}60%,100%{background-position:-60% 0}}
@media (max-width: 600px){.gs-stay{align-items:flex-end;padding:0}.gs-stay-b{width:100%;border-radius:28px 28px 0 0;padding-bottom:calc(14px + env(safe-area-inset-bottom));transform:translateY(100%)}
  .gs-stay-b::before{content:"";display:block;width:42px;height:5px;margin:-12px auto 12px;border-radius:9px;background:#E6D7D0}}
@media (prefers-reduced-motion: reduce){.gs-stay-tk,.gs-stay-sp,.gs-stay-tk-in::before{animation:none}}

/* dark phones: the two leave sheets follow the system theme */
@media (prefers-color-scheme: dark){
  .gs-save,.gs-stay{background:rgba(8,6,8,.66)}
  .gs-save-b,.gs-stay-b{color:#F6ECE6;box-shadow:0 30px 80px rgba(0,0,0,.6),inset 0 0 0 1px rgba(255,255,255,.06)}
  .gs-save-b{background:radial-gradient(420px 220px at 50% -40px,rgba(224,81,122,.28),transparent 70%),radial-gradient(300px 200px at 100% 100%,rgba(231,169,60,.14),transparent 70%),#221B1E}
  .gs-stay-b{background:radial-gradient(380px 200px at 50% -30px,rgba(232,106,138,.3),transparent 70%),radial-gradient(260px 200px at 0 100%,rgba(231,169,60,.12),transparent 70%),#221B1E}
  .gs-save-b::before,.gs-stay-b::before{background:#4A3E42}
  .gs-save-p,.gs-stay-p{color:#CDBFC2}
  .gs-stay-price,.gs-stay-fine,.gs-stay-no,.gs-save-leave{color:#A99A9E}
  .gs-stay-price b{color:#FFF4EE}
  .gs-stay-no:hover{color:#fff}
  .gs-save-x,.gs-stay-x{background:rgba(255,255,255,.1);color:#F6ECE6}
  .gs-save-go,.gs-stay-go{background:#FFF4EE;color:#2E2729 !important;box-shadow:0 14px 30px rgba(0,0,0,.4)}
  .gs-save-go .bi,.gs-stay-go .bi{color:#D9577B}
  .gs-save-go:hover,.gs-stay-go:hover{background:#fff}
  .gs-save-stay{background:transparent;border-color:#4A3E42;color:#F6ECE6}
  .gs-save-l li{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.08);color:#E9DDD8}
  .gs-save-env{background:linear-gradient(160deg,#3A2F33,#4A3238)}
  .gs-save-code{background:rgba(75,122,67,.25);color:#A9D8A0}
  .gs-stay-fine .bi{color:#8CC383}
}