/* SHOCAL v2 - the product sheet (the LIVE beta_product_modal markup + script, laid out anew),
   the reviews sheet, size chart, photo viewer, basket bar and toast. Shared by the shop and ticket
   pages (body.v2st). Every rule is scoped under body.v2st so it outranks the live modal's own <style>,
   which prints later in the page. */
/* the live modal's styles read these tokens (beta_head), mapped onto v2's */
body.v2st{--pale:#EFE6F5;--ok:#1B7A45;--disp:var(--serif);--peach:#FFD9A8;--mist:#F8F3FB}
@keyframes bshim{from{background-position:-200% 0}to{background-position:200% 0}}
body.v2st .ph{background:linear-gradient(90deg,#F3ECF8 25%,#FCF9FF 50%,#F3ECF8 75%);background-size:200% 100%;animation:bshim 1.3s linear infinite}
body.v2st .sk-line{height:13px;border-radius:7px;margin-bottom:9px}
body.v2st .bdg{font-style:normal;font-size:11px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;padding:5px 9px;border-radius:999px;line-height:1}
body.v2st .bdg.ve{background:#DDF3E4;color:#1B6B3E} body.v2st .bdg.vg{background:#FFF0C8;color:#7A4B00}
body.v2st .bdg.gf{background:#E3ECFB;color:#1E4FA0} body.v2st .bdg.pop{background:var(--gold);color:var(--ink)}
/* ---------- the product sheet: the LIVE markup + script, laid out anew ----------
   Desktop: photo left, details right with its own scroll, the add bar pinned at the bottom.
   Phones: a bottom sheet. Choices are tiles (radio for pick-one groups, ticks for pick-many). */
body.v2st{--bmh:min(780px,calc(100vh - 48px))}
body.v2st .bmodal{background:rgba(44,10,78,.58);padding:24px}
body.v2st .bm-card{display:flex;width:min(980px,100%);max-width:none;min-height:min(560px,var(--bmh));max-height:var(--bmh);overflow:hidden;border-radius:32px;background:#fff;box-shadow:0 40px 90px rgba(20,4,40,.45);opacity:0;transform:translateY(26px) scale(.965);transition:transform .42s cubic-bezier(.2,.9,.25,1),opacity .25s ease}
body.v2st .bmodal.show .bm-card{opacity:1;transform:none}
body.v2st .bm-card.noimg{width:min(640px,100%);min-height:0}
body.v2st #bmreal,.v2st #bmskel{flex:1;min-width:0;display:grid;grid-template-columns:minmax(0,46%) minmax(0,1fr);animation:v2in .3s ease}
body.v2st .bm-card.noimg #bmreal,.v2st .bm-card.noimg #bmskel{grid-template-columns:minmax(0,1fr)}
body.v2st #bmskel>.ph{height:auto!important;min-height:100%}
body.v2st .bm-card.noimg #bmskel>.ph{display:none}
body.v2st .bm-skel .sk-line{margin-left:0}

body.v2st .bm-imgw{position:relative;height:auto;min-height:100%;overflow:hidden}
body.v2st .bm-imgw .bm-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:transparent;cursor:zoom-in;opacity:0;transition:opacity .4s ease,transform .6s ease}
body.v2st .bm-imgw .bm-img.ld{opacity:1}
body.v2st .bm-imgw:hover .bm-img.ld{transform:scale(1.03)}
body.v2st .bm-imgw::after{content:"";position:absolute;top:0;bottom:0;right:-1px;width:30px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 1440' preserveAspectRatio='none'%3E%3Cpath fill='%23fff' d='M40,0 C0,240 64,480 36,720 C8,960 56,1200 28,1440 L80,1440 L80,0 Z'/%3E%3C/svg%3E") center/100% 100% no-repeat;pointer-events:none}

body.v2st .bm-body{display:flex;flex-direction:column;min-width:0;min-height:0;max-height:var(--bmh);overflow-y:auto;overscroll-behavior:contain;padding:40px 38px 0 30px;scrollbar-width:thin;scrollbar-color:var(--lav) transparent}
body.v2st .bm-card.noimg .bm-body{padding-left:38px}
body.v2st .bm-body::-webkit-scrollbar{width:8px}
body.v2st .bm-body::-webkit-scrollbar-thumb{background:var(--lav);border-radius:8px}
body.v2st .bm-x{top:20px;right:20px;width:42px;height:42px;border-radius:50%;background:var(--lilac);color:var(--purple);font-size:24px;font-weight:700;line-height:1;box-shadow:none;transition:background .15s,color .15s,transform .2s}
body.v2st .bm-x:hover{background:var(--purple);color:#fff;transform:rotate(90deg)}
body.v2st .bm-eyebrow{font-weight:800;font-size:12px;letter-spacing:.09em;text-transform:uppercase;color:var(--purple);margin:0 56px 10px 0}
body.v2st #bmbadges:empty{display:none}
body.v2st #bmbadges .bdg{margin-right:4px}
body.v2st .bm-name{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:clamp(30px,3.4vw,42px);line-height:.98;color:var(--ink);margin:0 50px 16px 0}
body.v2st .bm-price{align-self:flex-start;display:inline-block;font-family:var(--display);font-weight:400;font-size:22px;line-height:1;color:var(--ink);background:var(--gold);padding:10px 18px;border-radius:999px;transform:rotate(-2deg);margin:0 0 20px}
body.v2st .bm-desc{font-size:16px;line-height:1.6;color:var(--grey);white-space:pre-line;margin:0 0 6px}
body.v2st .bm-allergy{border:0;border-radius:16px;background:#FFF0C8;color:#7A4B00;font-size:14px;padding:12px 14px;margin:14px 0 0}
body.v2st .bm-chartlink{align-self:flex-start;margin:14px 0 0;padding:8px 14px;border-radius:999px;background:var(--lilac);color:var(--purple);font-weight:800;font-size:14px;text-decoration:none}

/* choices */
body.v2st #bmopts:empty{display:none}
body.v2st .bm-group{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;border:0;border-radius:0;background:transparent;overflow:visible;margin:30px 0 0}
body.v2st .bm-card.noimg .bm-group{grid-template-columns:repeat(2,minmax(0,1fr))}
body.v2st .bm-ghead{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 0 4px;background:none;border:0}
body.v2st .bm-gname{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:20px;line-height:1.05;color:var(--ink)}
body.v2st .bm-gtag{display:inline-flex;align-items:center;gap:6px;flex:none;font-weight:800;font-size:12px;letter-spacing:.02em;padding:6px 11px;border-radius:999px;background:var(--mist);color:var(--grey)}
body.v2st .bm-gtag.req{background:var(--gold);color:var(--ink)}
body.v2st .bm-group.done .bm-gtag.req{background:#DDF3E4;color:#1B6B3E}
body.v2st .bm-group.done .bm-gtag.req::before{content:"";width:12px;height:12px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231B6B3E' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.5l5 5L20 6.5'/%3E%3C/svg%3E") center/contain no-repeat}
body.v2st .bm-row{display:flex;align-items:center;gap:12px;margin:0;padding:13px 14px;border-radius:16px;background:#fff;box-shadow:inset 0 0 0 2px var(--lilac);cursor:pointer;transition:box-shadow .15s,background .15s,transform .1s}
body.v2st .bm-row:last-child{margin:0}
body.v2st .bm-row:hover{background:#fff;box-shadow:inset 0 0 0 2px var(--lav)}
body.v2st .bm-row:active{transform:scale(.98)}
body.v2st .bm-row.on{background:var(--mist);box-shadow:inset 0 0 0 2.5px var(--purple)}
body.v2st .bm-row:focus-visible{outline:3px solid var(--gold-d);outline-offset:2px}
body.v2st .bm-tick{width:24px;height:24px;flex:none;border:2.5px solid var(--lav);border-radius:8px;background:#fff;color:transparent;font-size:13px;font-weight:800;display:flex;align-items:center;justify-content:center;transition:background .15s,border-color .15s}
body.v2st .bm-group.radio .bm-tick{border-radius:50%}
body.v2st .bm-row.on .bm-tick{background:var(--purple);border-color:var(--purple);color:#fff;animation:v2pop .3s cubic-bezier(.2,.9,.3,1.5)}
body.v2st .bm-group.radio .bm-row.on .bm-tick{color:transparent;background:#fff;border:7px solid var(--purple)}
@keyframes v2pop{from{transform:scale(.55)}}
body.v2st .bm-row .oname{flex:1;min-width:0;margin:0;font-weight:700;font-size:15px;line-height:1.3;color:var(--char)}
body.v2st .bm-row .oprice{flex:none;font-weight:800;font-size:14px;color:var(--purple);white-space:nowrap}
body.v2st .bm-nlab{font-family:var(--display);font-weight:400!important;text-transform:uppercase;font-size:20px!important;color:var(--ink);margin:30px 0 10px!important}
body.v2st .bm-notes{border:0;border-radius:16px;background:var(--mist);box-shadow:inset 0 0 0 2px transparent;font-size:15px;min-height:70px;margin:0;transition:box-shadow .15s,background .15s}
body.v2st .bm-notes:focus{outline:0;background:#fff;box-shadow:inset 0 0 0 2px var(--purple)}

/* the add bar */
body.v2st .bm-foot{position:sticky;bottom:0;z-index:4;display:flex;align-items:center;gap:12px;margin:auto -38px 0 -30px;padding:22px 38px 26px 30px;background:#fff;box-shadow:0 -14px 22px -18px rgba(44,10,78,.35);border:0}
body.v2st .bm-card.noimg .bm-foot{margin-left:-38px;padding-left:38px}
body.v2st .bm-qty{border-radius:999px;background:var(--lilac);padding:5px;gap:8px}
body.v2st .bm-qty button{width:40px;height:40px;border-radius:50%;background:#fff;color:var(--purple);font-size:20px;transition:background .15s,color .15s}
body.v2st .bm-qty button:hover{background:var(--purple);color:#fff}
body.v2st .bm-qty span{font-family:var(--display);font-size:20px;color:var(--ink)}
body.v2st .bm-add{flex:1;min-width:0;background:var(--purple);color:#FFF6E8;font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:18px;letter-spacing:.02em;padding:17px 20px;border-radius:999px;white-space:nowrap;transition:transform .18s,box-shadow .18s,background .18s}
body.v2st .bm-add:not(:disabled):hover{transform:translateY(-2px) rotate(-1deg);box-shadow:0 10px 20px rgba(44,10,78,.28)}
body.v2st .bm-add:disabled{background:#CDBFDA;cursor:not-allowed}
body.v2st .bm-add.ok{background:var(--ok)}
body.v2st #bmnoorder{margin:auto 0 0!important;padding:22px 0 28px}

@media (max-width:860px){
  body.v2st .bmodal{padding:0;align-items:flex-end}
  body.v2st .bm-card,.v2st .bm-card.noimg{display:block;width:100%;max-width:680px;min-height:0;max-height:calc(100vh - 16px);max-height:calc(100dvh - 16px);overflow-y:auto;overscroll-behavior:contain;border-radius:28px 28px 0 0;opacity:1;transform:translateY(105%);transition:transform .45s cubic-bezier(.2,.9,.25,1)}
  body.v2st .bmodal.show .bm-card{transform:none}
  body.v2st #bmreal,.v2st #bmskel{display:block}
  body.v2st .bm-imgw{min-height:0;height:min(320px,42vh)}
  body.v2st #bmskel>.ph{min-height:0;height:min(320px,42vh)!important}
  body.v2st .bm-imgw::after{top:auto;left:0;right:0;bottom:-1px;width:auto;height:26px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath fill='%23fff' d='M0,40 C240,0 480,64 720,36 C960,8 1200,56 1440,28 L1440,80 L0,80 Z'/%3E%3C/svg%3E")}
  body.v2st .bm-body,.v2st .bm-card.noimg .bm-body{max-height:none;overflow:visible;padding:14px 22px 0}
  body.v2st .bm-card.noimg .bm-body{padding-top:30px}
  body.v2st .bm-group,.v2st .bm-card.noimg .bm-group{grid-template-columns:minmax(0,1fr)}
  body.v2st .bm-foot,.v2st .bm-card.noimg .bm-foot{margin:24px -22px 0;padding:12px 22px calc(14px + env(safe-area-inset-bottom))}
  /* the close button stays in reach while the sheet scrolls */
  body.v2st .bm-x{position:sticky;top:12px;right:auto;display:block;margin:12px 12px -54px auto;z-index:7;background:#fff;color:var(--ink);box-shadow:0 6px 16px rgba(20,4,40,.25)}
  body.v2st .bm-card.noimg .bm-x{background:var(--lilac);color:var(--purple);box-shadow:none}
  body.v2st .bm-card::before{content:"";position:absolute;z-index:6;top:9px;left:50%;width:44px;height:5px;margin-left:-22px;border-radius:5px;background:rgba(255,255,255,.92);box-shadow:0 1px 4px rgba(20,4,40,.3)}
  body.v2st .bm-card.noimg::before{background:var(--lav);box-shadow:none}
}
@media (max-width:420px){
  body.v2st .bm-qty button{width:34px;height:34px}
  body.v2st .bm-add{font-size:15px;letter-spacing:0;padding:15px 12px}
}

/* the photo, full size */
body.v2st .blight{background:rgba(20,4,40,.94)}
body.v2st .blight img{border-radius:20px}
/* size chart */
body.v2st .bchart{background:rgba(44,10,78,.55)}
body.v2st .bchart-card{border-radius:28px;padding:26px}
body.v2st .bchart-card h3{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:24px;color:var(--ink)}
body.v2st .bchart-card th{background:var(--mist)}

/* reviews sheet */
body.v2st .brev{background:rgba(44,10,78,.55)}
body.v2st .brev-sheet{border-radius:30px;background:var(--cream)}
body.v2st .brev-head{background:var(--purple);border-bottom:0;padding:18px 22px}
body.v2st .brev-head h2{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:26px;color:var(--gold)}
body.v2st .brev-head button{color:#fff}
body.v2st .brev-body{padding:18px}
body.v2st .brev-card,.v2st .brev-row{border-radius:20px}
body.v2st .brev-score{font-family:var(--display);font-weight:400;color:var(--purple)}
body.v2st .brev-cloud button.on{background:var(--purple)}
body.v2st .brev-filter{background:var(--lilac);border-radius:16px}
body.v2st .brev-reply{background:var(--lilac);border-radius:14px}
body.v2st .brev-more{border-radius:999px;font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:16px}
body.v2st .brev-body>*{animation:v2in .3s ease both}
body.v2st .brev .brev-sheet{transition:transform .4s cubic-bezier(.2,.9,.25,1)}
@media (max-width:600px){
  body.v2st .brev-sheet{border-radius:0}
  body.v2st .brev .brev-sheet{left:0;top:0;transform:translateY(100%);transition:transform .45s cubic-bezier(.2,.9,.25,1)}
  body.v2st .brev.show .brev-sheet{transform:none}
}
body.v2st #betabar{background:var(--ink);font-family:var(--body);font-weight:800;padding:13px 24px}
body.v2st #betabar a{color:var(--gold);font-family:var(--display);font-weight:400;text-transform:uppercase}
body.v2st #btoast{background:var(--ink);border-radius:999px;font-weight:800}
body.v2st .pcard:active,.v2st .popcard:active{transform:scale(.97);transition:transform .1s}
