/* LP "pick any vial free" 2 for 1 — buy card + picker/wizard.
   Lane B. Lifted from the approved mockup
   (LP Pick Any 2 for 1 Mockup 2026-09-21/index.html, #pa-mockup-css) with the
   drawer and the mockup's own review bar removed: the drawer rows are lane C's
   and live in lp-cart. Inter is already loaded site-wide.
   Navy #1f6ba6, free green #00b46c family. */
:root{
  --pa-navy:#1f6ba6;
  --pa-accent:#2d88ca;
  --pa-ink:#141617;
  --pa-ink2:#57646d;
  --pa-line:#e3e9ed;
  --pa-line2:#e5e7eb;
  --pa-b1:#eff5fa;
  --pa-b2:#e4f0f8;
  --pa-blue-soft:#e5f3ff;
  --pa-green:#0f6b52;
  --pa-green-soft:#e7f5ef;
  --pa-price:#2563eb;
  --pa-shadow:0 18px 50px rgba(18,52,78,.16);
}
.pa-block, .pa-modal{
  font-family:Inter,Arial,Helvetica,sans-serif;
  -webkit-font-smoothing:antialiased;
}
.pa-block *, .pa-modal *{box-sizing:border-box}

/* ---------- buy card: Your free vial ---------- */
.pa-block{margin:18px 0 6px}
.pa-block[hidden]{display:none}
.pa-block-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:8px}
.pa-block-t{font-size:14px;font-weight:600;color:#080f1c;letter-spacing:-.1px}
.pa-block-b{font-size:12px;font-weight:600;color:var(--pa-green);background:var(--pa-green-soft);border-radius:100px;padding:3px 10px;white-space:nowrap}
.pa-card{
  border:1px solid var(--pa-line);border-radius:10px;background:#fff;
  padding:12px;display:grid;grid-template-columns:56px 1fr auto;gap:12px;align-items:center;
}
.pa-card.is-flipped{border-color:#cfe2f2;background:linear-gradient(180deg,#fbfdff,#fff)}
.pa-card-img{width:56px;height:56px;border-radius:8px;border:1px solid var(--pa-line);background:#fff;object-fit:contain;padding:4px;grid-row:1}
.pa-card-mid{min-width:0}
.pa-card-name{font-size:15px;font-weight:700;color:var(--pa-ink);line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pa-card-sub{font-size:12.5px;color:var(--pa-ink2);margin-top:3px;line-height:1.35}
.pa-card-right{text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.pa-tag{display:inline-block;font-size:11.5px;font-weight:700;letter-spacing:.3px;text-transform:uppercase;border-radius:100px;padding:3px 9px}
.pa-tag-free{color:#fff;background:var(--pa-green)}
.pa-card-val{font-size:12px;color:var(--pa-ink2);white-space:nowrap}
.pa-change{
  grid-column:1/-1;margin-top:2px;width:100%;height:42px;border-radius:8px;
  border:1.5px solid var(--pa-accent);background:#fff;color:var(--pa-navy);
  font-size:14px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;
  transition:background .14s ease,border-color .14s ease;
}
.pa-change:hover{background:var(--pa-blue-soft)}
.pa-change svg{width:15px;height:15px;stroke:var(--pa-navy);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pa-flipnote{
  margin-top:8px;font-size:12.5px;line-height:1.45;color:#0d4a74;
  background:var(--pa-b1);border:1px solid #d7e7f3;border-radius:8px;padding:8px 10px;
}
.pa-flipnote b{font-weight:700}

/* ---------- picker ---------- */
.pa-modal{position:fixed;inset:0;z-index:2147483000;display:none}
/* ⛔ Intercom's launcher sits at z-index 2147483000 and, on a 390 phone,
   lands exactly on the sheet's "Add both to cart" button. Outrank it and hide
   it outright while the sheet is open — it is restored the moment it closes. */
html.lp-pa-open .intercom-lightweight-app,
html.lp-pa-open .intercom-launcher-frame,
html.lp-pa-open #intercom-container,
html.lp-pa-open iframe[name="intercom-launcher-frame"],
html.lp-pa-open iframe[name="intercom-notifications-frame"]{display:none !important}
.pa-modal.is-open{display:block}
.pa-scrim{position:absolute;inset:0;background:rgba(13,34,51,.45);backdrop-filter:saturate(120%) blur(2px)}
.pa-sheet{
  position:absolute;overflow:hidden;left:50%;top:50%;transform:translate(-50%,-50%);
  width:min(900px,calc(100vw - 48px));height:min(880px,calc(100vh - 40px));
  background:#fff;border-radius:16px;box-shadow:var(--pa-shadow);
  display:flex;flex-direction:column;overflow:hidden;
}
.pa-sheet-head{padding:18px 22px 14px;border-bottom:1px solid var(--pa-line);position:relative;flex:none}
.pa-grab{display:none}
.pa-sheet-head h2{font-size:21px;font-weight:700;color:var(--pa-ink);margin:0;letter-spacing:-.4px;line-height:1.2}
.pa-sheet-sub{margin:5px 0 0;font-size:13px;line-height:1.45;color:var(--pa-ink2);max-width:60ch}
.pa-sheet-sub b{color:var(--pa-ink);font-weight:600}
.pa-x{
  position:absolute;top:16px;right:16px;width:34px;height:34px;border-radius:50%;
  border:none;background:var(--pa-b1);color:var(--pa-navy);font-size:20px;line-height:1;cursor:pointer;
}
.pa-x:hover{background:var(--pa-b2)}
.pa-controls{padding:12px 22px 9px;flex:none;border-bottom:1px solid var(--pa-line);background:#fff}
.pa-search{position:relative}
.pa-search svg{position:absolute;left:13px;top:50%;transform:translateY(-50%);width:16px;height:16px;stroke:#8fa3b0;fill:none;stroke-width:2;stroke-linecap:round}
.pa-search input{
  width:100%;height:42px;border-radius:9px;border:1px solid var(--pa-line);background:#fff;
  padding:0 38px 0 38px;font-size:14.5px;color:var(--pa-ink);font-family:inherit;outline:none;
}
.pa-search input::-webkit-search-cancel-button,.pa-search input::-webkit-search-decoration{-webkit-appearance:none;display:none}
.pa-search input:focus{border-color:var(--pa-accent);box-shadow:0 0 0 3px rgba(45,136,202,.14)}
.pa-clear{position:absolute;right:10px;top:50%;transform:translateY(-50%);width:22px;height:22px;border:none;border-radius:50%;background:var(--pa-b2);color:var(--pa-navy);cursor:pointer;font-size:13px;line-height:1;display:none}
.pa-search.has-q .pa-clear{display:block}
.pa-chiprow{display:flex;gap:7px;margin-top:10px;overflow-x:auto;padding-bottom:2px;scrollbar-width:none}
.pa-chiprow::-webkit-scrollbar{display:none}
.pa-chip{
  flex:none;height:34px;padding:0 14px;border-radius:100px;border:1px solid var(--pa-line);
  background:#fff;color:#3c4b55;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap;font-family:inherit;
  transition:.14s ease;
}
.pa-chip:hover{border-color:#c7d7e2}
.pa-chip.is-on{background:var(--pa-navy);border-color:var(--pa-navy);color:#fff}
.pa-sortrow{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:9px}
.pa-count{font-size:12.5px;color:var(--pa-ink2)}
.pa-sort{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--pa-ink2)}
.pa-sort select{
  height:32px;border-radius:7px;border:1px solid var(--pa-line);background:#fff;padding:0 8px;
  font-size:13px;font-weight:600;color:var(--pa-ink);font-family:inherit;cursor:pointer;
}
.pa-list{flex:1;overflow-y:auto;padding:8px 22px 18px;background:#fff}
.pa-hint{font-size:12px;line-height:1.45;color:var(--pa-ink2);padding:9px 2px 5px;display:flex;align-items:flex-start;gap:7px}
.pa-hint .pa-dot{margin-top:5px}
.pa-dot{width:8px;height:8px;border-radius:50%;background:var(--pa-green);flex:none}

.pa-row{display:grid;grid-template-columns:44px minmax(150px,206px) 1fr;gap:12px;padding:9px 2px;border-bottom:1px solid #f0f4f7;align-items:center}
.pa-row:last-child{border-bottom:none}
.pa-row-img{width:44px;height:44px;border-radius:8px;border:1px solid var(--pa-line);object-fit:contain;padding:3px;background:#fff}
.pa-row-name{font-size:14.5px;font-weight:700;color:var(--pa-ink);line-height:1.3;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.pa-row-cat{font-size:10.5px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;color:#6a7d8a;background:#f2f6f9;border-radius:4px;padding:2px 6px}
.pa-pills{display:flex;flex-wrap:wrap;gap:6px}
.pa-opt{
  border:1px solid var(--pa-line);background:#fff;border-radius:9px;padding:6px 9px 5px;cursor:pointer;
  text-align:left;font-family:inherit;min-width:80px;transition:.12s ease;
}
.pa-opt:hover{border-color:var(--pa-accent);background:#fafdff}
@media (hover:none){.pa-opt:hover{border-color:var(--pa-line);background:#fff}.pa-opt.is-sel:hover{border-color:var(--pa-accent);background:var(--pa-blue-soft)}}
.pa-opt-mg{display:block;font-size:13px;font-weight:700;color:var(--pa-ink);line-height:1.15}
.pa-opt-price{display:block;font-size:11.5px;color:var(--pa-ink2);margin-top:2px}
.pa-opt-tag{display:block;font-size:10px;font-weight:700;letter-spacing:.25px;margin-top:4px;color:var(--pa-green)}
.pa-opt.is-flip .pa-opt-tag{color:#8a5a00}
.pa-opt.is-sel{border-color:var(--pa-accent);border-width:2px;background:var(--pa-blue-soft);padding:5px 8px 4px}
.pa-opt.is-sel .pa-opt-price{color:#2a5a7d}
.pa-rowflip{
  grid-column:2/-1;margin-top:8px;font-size:12.5px;line-height:1.45;color:#7a5200;background:#fff8e8;border:1px solid #f2e2bd;
  border-radius:8px;padding:8px 10px;
}
.pa-pinned{
  margin:10px 0 2px;border:1px solid var(--pa-line);background:#fff;border-radius:11px;
  padding:10px 12px;display:grid;grid-template-columns:44px 1fr auto;gap:12px;align-items:center;cursor:pointer;width:100%;text-align:left;font-family:inherit;
}
.pa-pinned img{width:44px;height:44px;border-radius:8px;border:1px solid var(--pa-line);background:#fff;object-fit:contain;padding:3px}
.pa-pinned-t{display:block;font-size:14px;font-weight:700;color:var(--pa-ink);line-height:1.25}
.pa-pinned-s{display:block;font-size:12px;color:var(--pa-ink2);margin-top:3px;line-height:1.35}
.pa-pinned-r{font-size:12px;line-height:1.5;white-space:nowrap;font-weight:700;color:var(--pa-green);text-align:right}
.pa-pinned:hover{border-color:#c7d7e2}
.pa-pinned.is-sel{border:1.5px solid var(--pa-accent);background:var(--pa-b1);box-shadow:0 0 0 3px rgba(45,136,202,.12)}
.pa-empty{padding:54px 10px;text-align:center}
.pa-empty-ic{width:46px;height:46px;border-radius:50%;background:var(--pa-b1);margin:0 auto 12px;display:flex;align-items:center;justify-content:center}
.pa-empty-ic svg{width:20px;height:20px;stroke:var(--pa-navy);fill:none;stroke-width:2;stroke-linecap:round}
.pa-empty-t{font-size:15px;font-weight:700;color:var(--pa-ink)}
.pa-empty-s{font-size:13px;color:var(--pa-ink2);margin-top:5px}
.pa-empty button{margin-top:14px;height:38px;padding:0 16px;border-radius:8px;border:1.5px solid var(--pa-accent);background:#fff;color:var(--pa-navy);font-weight:600;font-size:13.5px;cursor:pointer;font-family:inherit}

.pa-foot{
  background:#fff;padding:14px 22px;
  display:flex;align-items:center;justify-content:space-between;gap:16px;
}
.pa-foot-txt{min-width:0}
.pa-foot-line{font-size:15px;font-weight:700;color:var(--pa-ink);line-height:1.3}
.pa-foot-line em{font-style:normal;color:var(--pa-green)}
.pa-foot-sub{display:block;font-size:12.5px;color:var(--pa-ink2);margin-top:3px}
.pa-cta{
  flex:none;height:52px;min-width:220px;border-radius:10px;border:none;background:var(--pa-navy);color:#fff;
  font-size:16px;font-weight:600;cursor:pointer;font-family:inherit;transition:background .14s ease;
}
.pa-cta:hover{background:#1a5c90}


/* ---------- buy card: multi-pick summary tile ---------- */
.pa-slots{border:1px solid var(--pa-line);border-radius:10px;background:#fff;padding:12px}
.pa-tiles{display:flex;gap:10px;flex-wrap:wrap}
.pa-tile{
  flex:1 1 0;min-width:96px;border:1px solid var(--pa-line);border-radius:10px;background:#fff;
  padding:10px 8px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:2px
}
.pa-tile img{width:46px;height:46px;object-fit:contain;margin-bottom:4px}
.pa-tile-name{font-size:12.5px;font-weight:700;color:var(--pa-ink);line-height:1.25}
.pa-tile-sub{font-size:10.5px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;color:#7c8c97}
.pa-tile.is-empty{border-style:dashed;border-color:#cfdae2;background:#fbfdfe}
.pa-tile.is-empty .pa-tile-name{color:var(--pa-ink2);font-weight:600}
.pa-tile-plus{
  width:46px;height:46px;border-radius:50%;background:var(--pa-b1);color:var(--pa-navy);
  display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:400;margin-bottom:4px
}
.pa-pickbtn{
  margin-top:12px;width:100%;height:50px;border-radius:10px;border:none;background:var(--pa-navy);color:#fff;
  font-family:inherit;font-size:15.5px;font-weight:600;cursor:pointer;transition:background .14s ease
}
.pa-pickbtn:hover{background:#1a5c90}

.pa-block-rule{font-size:12.5px;line-height:1.45;color:var(--pa-ink2);margin:-2px 0 9px}
.pa-short{display:none}
.pa-pcard-tag{
  display:block;font-style:normal;font-size:11px;font-weight:700;letter-spacing:.2px;color:#8a5a00;
  background:#fff8e8;border:1px solid #f2e2bd;border-radius:6px;padding:2px 7px;margin-top:5px;width:fit-content
}
.pa-pair-qty{text-align:right;line-height:1.35}

/* ---------- picker: wizard header ---------- */
.pa-headrow{display:flex;align-items:baseline;justify-content:space-between;gap:14px;padding-right:44px}
.pa-back{
  flex:none;background:none;border:none;padding:0;cursor:pointer;white-space:nowrap;
  font-family:inherit;font-size:13px;font-weight:600;color:var(--pa-navy)
}
.pa-back:hover{text-decoration:underline}
.pa-steptitle{transition:transform .22s ease, opacity .22s ease}
.pa-prog{display:flex;gap:6px;margin-top:11px}
.pa-prog i{flex:1;height:5px;border-radius:100px;background:var(--pa-line);transition:background .3s ease}
.pa-prog i.is-on{background:var(--pa-accent)}
.pa-prog i.is-done{background:var(--pa-navy)}
.pa-sheet-head .pa-sheet-sub{margin-top:9px}
.pa-list{transition:transform .22s ease, opacity .22s ease}
.pa-list.is-out-left{transform:translateX(-26px);opacity:0}
.pa-list.is-out-right{transform:translateX(26px);opacity:0}
.pa-list.is-in-right{transform:translateX(26px);opacity:0;transition:none}
.pa-list.is-in-left{transform:translateX(-26px);opacity:0;transition:none}
.pa-steptitle.is-out-left{transform:translateX(-18px);opacity:0}
.pa-steptitle.is-out-right{transform:translateX(18px);opacity:0}
.pa-steptitle.is-in-right{transform:translateX(18px);opacity:0;transition:none}
.pa-steptitle.is-in-left{transform:translateX(-18px);opacity:0;transition:none}
@media (prefers-reduced-motion: reduce){
  .pa-list,.pa-steptitle,.pa-toast{transition:none !important}
}
.pa-opt.is-picked{
  border-color:var(--pa-green);border-width:2px;background:#e9f8f1;padding:5px 8px 4px
}
.pa-opt.is-picked .pa-opt-mg{color:#0b5c44}
.pa-opt.is-picked .pa-opt-price{color:#2f6d5c}
.pa-check{font-style:normal;color:var(--pa-green);font-weight:800;margin-left:5px}

/* ---------- picker: toast ---------- */
.pa-toast{
  position:absolute;left:22px;right:22px;bottom:92px;z-index:4;
  background:#0f2a3d;color:#fff;border-radius:10px;padding:11px 14px;font-size:13.5px;
  box-shadow:0 12px 28px rgba(10,35,55,.28);
  transform:translateY(14px);opacity:0;transition:transform .24s ease, opacity .24s ease
}
.pa-toast.is-on{transform:translateY(0);opacity:1}
.pa-toast b{font-weight:700}
.pa-toast .pa-check{color:#5ce0ac}
.pa-toast-sub{display:block;font-size:12px;opacity:.82;margin-top:2px}

/* ---------- picker: review screen ---------- */
.pa-sheet.is-review .pa-list{padding-top:16px}
.pa-sheet.is-review .pa-sheet-sub{display:block}
.pa-sheet.is-review .pa-foot-line{font-size:21px}
.pa-sheet.is-review .pa-foot-sub{font-size:13px}
.pa-review{display:flex;flex-direction:column;gap:12px;padding-bottom:4px}
.pa-pcard{border:1px solid var(--pa-line);border-radius:12px;background:#fff;overflow:hidden}
.pa-pcard-head{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:9px 14px;background:var(--pa-b1);border-bottom:1px solid var(--pa-line)
}
.pa-pcard-n{font-size:11px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--pa-navy)}
.pa-pcard-change{
  background:none;border:none;padding:0;cursor:pointer;font-family:inherit;
  font-size:12.5px;font-weight:600;color:var(--pa-navy);text-decoration:underline
}
.pa-pcard-row{display:flex;align-items:center;gap:12px;padding:11px 14px}
.pa-pcard-row img{width:46px;height:46px;border-radius:8px;border:1px solid var(--pa-line);object-fit:contain;padding:3px;background:#fff}
.pa-pcard-name{flex:1;font-size:14.5px;font-weight:700;color:var(--pa-ink);min-width:0}
.pa-pcard-amt{font-size:15px;font-weight:700;color:var(--pa-ink)}
.pa-pcard-plus{display:flex;align-items:center;gap:10px;padding:0 14px}
.pa-pcard-plus:before,.pa-pcard-plus:after{content:"";flex:1;height:1px;background:#f0f4f7}
.pa-pcard-plus span{
  width:22px;height:22px;border-radius:50%;background:var(--pa-b2);color:var(--pa-navy);
  display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;flex:none
}
.pa-muted{color:#93a3ad;font-weight:600}
.pa-foot-line b{font-weight:800}
.pa-footwrap{flex:none;border-top:1px solid var(--pa-line);background:#fff;box-shadow:0 -6px 18px rgba(18,52,78,.05)}
.pa-pairs{display:flex;flex-direction:column;gap:12px}

/* ---------- mobile ---------- */
@media (max-width:767px){
  .pa-long{display:none}
  .pa-short{display:inline}

  .pa-count{display:none}
  .pa-sortrow{justify-content:flex-end;margin-top:8px}
  .pa-pinned{padding:9px 10px}
  .pa-pinned-s{display:none}
  .pa-pinned-r{margin-top:2px}
  .pa-opt{padding:5px 8px 4px}

  .pa-sheet{
    left:0;top:auto;bottom:0;transform:none;width:100%;height:92vh;max-height:92vh;
    border-radius:18px 18px 0 0;
  }
  .pa-grab{display:block;width:40px;height:4px;border-radius:100px;background:#d7e0e6;margin:0 auto 12px}
  .pa-sheet-head{padding:9px 16px 10px}
  .pa-sheet-head h2{font-size:17.5px}
  .pa-sheet-sub{font-size:12.5px;margin-top:4px;padding-right:34px}
  .pa-controls{padding:10px 16px 8px}
  .pa-list{padding:4px 16px 14px}
  .pa-hint{padding:7px 2px 3px;font-size:11.5px}
  .pa-x{top:34px;right:12px;width:30px;height:30px;font-size:18px}
  .pa-foot{flex-direction:column;align-items:stretch;gap:10px;padding:12px 18px calc(22px + env(safe-area-inset-bottom))}
  .pa-footwrap{position:relative;z-index:5}
  .pa-toast{left:16px;right:16px;bottom:140px}
  .pa-headrow{padding-right:38px}
  .pa-prog{margin-right:42px}
  .pa-tile{min-width:0;padding:9px 6px}
  .pa-tile img,.pa-tile-plus{width:40px;height:40px}
  .pa-tile-name{font-size:11.5px}
  .pa-pcard-row{padding:10px 12px}
  .pa-pcard-name{font-size:13.5px}
  .pa-foot-line{font-size:14.5px}
  .pa-cta{width:100%;min-width:0;height:54px}
  .pa-row{grid-template-columns:42px 1fr;gap:11px;padding:10px 0;align-items:start}
  .pa-row-img{width:42px;height:42px;grid-row:1/span 2}
  .pa-row-name{grid-column:2;grid-row:1;font-size:14px}
  .pa-pills{grid-column:2;grid-row:2;margin-top:7px}
  .pa-rowflip{grid-column:2;grid-row:3}
  .pa-opt{min-width:0;flex:1 1 calc(50% - 3px)}
  .pa-pinned{grid-template-columns:42px 1fr;row-gap:6px}
  .pa-pinned img{grid-row:1/span 2}
  .pa-pinned-r{grid-column:2;text-align:left;font-size:12px}
  .pa-card{grid-template-columns:48px 1fr;align-items:start}
  .pa-card-img{width:48px;height:48px;grid-column:1;grid-row:1/span 2}
  .pa-card-mid{grid-column:2;grid-row:1}
  .pa-card-right{grid-column:2;grid-row:2;flex-direction:row;align-items:center;justify-content:flex-start;gap:8px;margin-top:6px}
}

/* ---------- lane F: Back control + real-phone sheet height ----------
   Back sits LEFT of the step title as a real button (not a 13px link hugging
   the close X), on every wizard step after the first and on the review
   screen. [hidden] must win over the display below. */
.pa-headrow{justify-content:flex-start;align-items:center;gap:12px}
.pa-back{
  display:inline-flex;align-items:center;gap:4px;height:34px;padding:0 13px 0 9px;
  border:1.5px solid var(--pa-accent);border-radius:100px;background:#fff;
  font-family:inherit;font-size:14px;font-weight:600;line-height:1;color:var(--pa-navy);
  cursor:pointer;white-space:nowrap;flex:none;transition:background .14s ease
}
.pa-back:hover{background:var(--pa-blue-soft);text-decoration:none}
.pa-back:focus-visible{outline:2px solid var(--pa-accent);outline-offset:2px}
.pa-back svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.pa-back[hidden]{display:none !important}
.pa-headrow .pa-steptitle{min-width:0}
.pa-pinned .pa-check{margin-left:6px}
.pa-pinned.is-flip .pa-pinned-r{color:#8a5a00}
@media (max-width:767px){
  /* 92vh is the LARGE viewport on iOS Safari. With the address bar and
     toolbar showing, a 92vh sheet pinned to the bottom is taller than the
     visible area and its head (grab, title, Back, close) sits above the top
     of the screen. Size it against the fixed modal instead, which is always
     the visible area. */
  .pa-sheet{height:92%;max-height:92%}
  .pa-back{height:32px;font-size:13.5px;padding:0 11px 0 7px}
  .pa-headrow{gap:10px}
}

/* ---------- 9/23: Back lives in the footer, left of Next ----------
   Up by the title it was easy to miss. Now a solid black button beside the
   blue CTA, same height, on desktop and mobile. */
.pa-actions{display:flex;align-items:stretch;gap:10px;flex:none}
.pa-actions .pa-back{
  height:52px;padding:0 20px 0 14px;gap:6px;border:none;border-radius:10px;
  background:#111;color:#fff;font-size:16px;font-weight:600
}
.pa-actions .pa-back:hover{background:#333}
.pa-actions .pa-back:focus-visible{outline:2px solid #111;outline-offset:2px}
.pa-actions .pa-back svg{width:18px;height:18px}
@media (max-width:767px){
  .pa-actions{width:100%}
  .pa-actions .pa-back{height:54px;font-size:15.5px;padding:0 16px 0 12px}
  .pa-actions .pa-cta{flex:1 1 auto;width:auto}
}

/* ---------- lane K + L: Subscribe & Save keeps 2 for 1 until cancelled ----------
   Lane L moved the line from the footer to the sheet head (picker steps only). */
.pa-keep{display:flex;align-items:flex-start;gap:6px;font-size:12.5px;line-height:1.4;color:var(--pa-ink2)}
.pa-keep[hidden]{display:none !important}
.pa-keep svg{flex:none;width:14px;height:14px;margin-top:1.5px;fill:none;stroke:var(--pa-green);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pa-keep b{font-weight:600;color:var(--pa-ink)}
.pa-sheet-head .pa-keep{margin-top:8px;max-width:60ch}
@media (max-width:767px){
  .pa-sheet-head .pa-keep{margin-top:6px;font-size:12px;padding-right:34px}
}

/* ---------- lane L/L2: review step purchase option, sticky footer ---------- */
.pa-buywrap{padding:10px 22px 0}
.pa-buywrap[hidden]{display:none !important}
.pa-buy{display:flex;flex-direction:column;gap:6px}
.pa-buy-opt{position:relative;display:grid;grid-template-columns:16px 1fr auto;column-gap:9px;align-items:center;
  padding:7px 12px;border:1px solid var(--pa-line2);border-radius:10px;background:#fff;cursor:pointer;margin:0}
.pa-buy-opt input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.pa-buy-opt.is-on{border-color:var(--pa-accent);box-shadow:0 0 0 1px var(--pa-accent);background:var(--pa-b1)}
.pa-buy-opt.is-off{cursor:not-allowed;opacity:.7}
.pa-buy-opt input:focus-visible ~ .pa-buy-dot{outline:2px solid var(--pa-accent);outline-offset:2px}
.pa-buy-dot{width:16px;height:16px;border-radius:50%;border:1.5px solid #c3ccd3;background:#fff;box-sizing:border-box}
.pa-buy-opt.is-on .pa-buy-dot{border:5px solid var(--pa-accent)}
.pa-buy-t{font-size:14px;font-weight:600;color:var(--pa-ink);line-height:1.3;display:contents}
.pa-buy-t > .pa-buy-note{grid-column:2 / -1;grid-row:2}
.pa-buy-note{display:block;font-size:11.5px;font-weight:400;color:var(--pa-ink2);margin-top:1px;line-height:1.35}
.pa-buy-p{font-size:14px;font-weight:700;color:var(--pa-ink);white-space:nowrap;text-align:right;line-height:1.3;grid-row:1;grid-column:3}
.pa-buy-p small{font-size:12px;font-weight:500;color:var(--pa-ink2)}
.pa-buywrap + .pa-foot{padding-top:10px}
@media (max-width:767px){
  .pa-buywrap{padding:8px 16px 0}
  .pa-buy{gap:5px}
  .pa-buy-opt{padding:6px 10px;column-gap:8px}
  .pa-buy-t,.pa-buy-p{font-size:13.5px}
  .pa-buy-note{font-size:11px}
  .pa-buywrap + .pa-foot{padding-top:8px}
}

/* ---------- lane L3: qty 2+ slots start pre-selected with the same vial ---------- */
.pa-tile-same{font-size:11.5px;color:var(--pa-ink2);line-height:1.3}
.pa-tile.is-same .pa-tag{margin-top:4px;font-size:10.5px;padding:2px 8px}
@media (max-width:767px){
  .pa-tile-same{font-size:10.5px}
}

/* ---------- lane L6: slot grid, max 5 per row at every width ---------- */
.pa-tiles{display:grid;grid-template-columns:repeat(var(--pa-cols,2),minmax(0,1fr));gap:10px}
.pa-tiles .pa-tile{min-width:0}
.pa-tile-name,.pa-tile-same,.pa-tile-sub{overflow-wrap:break-word;max-width:100%}
.pa-tiles.is-dense{gap:8px}
@media (max-width:767px){
  .pa-tiles.is-dense{gap:6px}
  .pa-tiles.is-dense .pa-tile{padding:8px 3px}
  .pa-tiles.is-dense .pa-tile img{width:32px;height:32px;margin-bottom:3px}
  .pa-tiles.is-dense .pa-tile-name{font-size:10.5px;line-height:1.2}
  .pa-tiles.is-dense .pa-tile-same,.pa-tiles.is-dense .pa-tile-sub{font-size:9.5px;line-height:1.2;letter-spacing:0}
  .pa-tiles.is-dense .pa-tag{font-size:9px;padding:2px 6px;letter-spacing:.2px}
}

/* ---------- lane L7: 16px inputs on mobile so iOS Safari does not zoom ---------- */
@media (max-width:767px){
  .pa-search input{font-size:16px}
  .pa-sort select{font-size:16px}
}