/* GOOD CHIPS — box
   Ported from the supplied static build. Colors and type sizes resolve from
   global theme settings via the --gc-* custom properties emitted by
   components/theme-css-var.html. */

.after-story {
  --box-accent:var(--gc-teal);
  --box-accent-rgb:14,110,139;
  --box-cta-text:#fff;
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:100dvh;
  background:radial-gradient(circle at 18% 12%,rgba(255,255,255,.72),transparent 34%),var(--gc-cream);
  padding:clamp(82px,11dvh,140px) max(5vw,48px) clamp(90px,12dvh,150px);
}
.after-story[data-box-step="2"] { --box-accent:var(--gc-cheddar); --box-accent-rgb:200,148,31; --box-cta-text:var(--gc-ink); }
.after-story[data-box-step="3"] { --box-accent:var(--gc-korean); --box-accent-rgb:122,27,29; --box-cta-text:#fff; }
.box-atmosphere { position:absolute; z-index:-1; inset:-12%; pointer-events:none; }
.box-atmosphere-field { position:absolute; inset:0; opacity:0; transform:translateZ(0); }
.box-atmosphere-field { animation:boxAtmosphereDrift 15s ease-in-out infinite alternate; }
.box-atmosphere-field:nth-child(2) { animation-delay:-5s; animation-duration:17s; }
.box-atmosphere-field:nth-child(3) { animation-delay:-9s; animation-duration:16s; }
@keyframes boxAtmosphereDrift { from { transform:translate3d(-1.2%,.6%,0) scale(1.01); } to { transform:translate3d(1.4%,-.8%,0) scale(1.035); } }
.box-atmosphere-field[data-atmosphere="1"] { opacity:1; background:radial-gradient(ellipse 58% 48% at 25% 54%,rgba(var(--gc-teal-rgb),.16),rgba(var(--gc-teal-rgb),.055) 43%,transparent 72%); }
.box-atmosphere-field[data-atmosphere="2"] { background:radial-gradient(ellipse 62% 52% at 72% 48%,rgba(var(--gc-cheddar-rgb),.19),rgba(var(--gc-cheddar-rgb),.06) 45%,transparent 74%); }
.box-atmosphere-field[data-atmosphere="3"] { background:radial-gradient(ellipse 58% 50% at 30% 55%,rgba(var(--gc-korean-rgb),.16),rgba(var(--gc-korean-rgb),.05) 44%,transparent 74%); }
.box-builder { width:min(90vw,1480px); margin:0 auto; color:var(--gc-ink); }
.box-builder-intro { margin:0 auto clamp(34px,5dvh,64px); text-align:center; }
.box-builder-eyebrow { margin:0 0 14px; font:300 calc((24px) * var(--gc-type-scale, 1))/1.2 var(--gc-product-serif); letter-spacing:.22em; text-transform:uppercase; }
.box-step-count,
.box-summary-label { margin:0 0 14px; font:400 calc((12px) * var(--gc-type-scale, 1))/1.2 var(--gc-product-serif); letter-spacing:.22em; text-transform:uppercase; }
.box-builder-title { margin:0; font:600 italic calc((clamp(64px,7.2vw,118px)) * var(--gc-type-scale, 1))/.9 var(--gc-product-serif); letter-spacing:-.055em; text-wrap:balance; }
.box-builder-title strong { font-family:var(--gc-display); font-style:normal; font-weight:900; }
.box-builder-title strong span[aria-hidden] span:nth-child(1) { color:var(--gc-teal); }
.box-builder-title strong span[aria-hidden] span:nth-child(2) { color:var(--gc-korean); }
.box-builder-title strong span[aria-hidden] span:nth-child(3) { color:var(--gc-cheddar); }
.box-builder-title strong span[aria-hidden] span:nth-child(4) { color:#c0371a; }
.box-configurator { position:relative; min-height:min(68dvh,720px); padding:clamp(42px,5vw,82px); overflow:hidden; border:1px solid rgba(255,255,255,.66); border-radius:28px; background:linear-gradient(135deg,rgba(255,255,255,.44),rgba(244,235,216,.24)); box-shadow:0 28px 72px rgba(62,46,25,.12),inset 0 1px 0 rgba(255,255,255,.88),inset 0 -1px 0 rgba(var(--box-accent-rgb),.08); backdrop-filter:blur(18px) saturate(112%); -webkit-backdrop-filter:blur(18px) saturate(112%); }
.box-configurator:before { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(115deg,rgba(255,255,255,.26),transparent 35%,rgba(255,255,255,.12)); }
.box-configurator-inner { position:relative; z-index:1; }
.box-progress-nav { display:grid; grid-template-columns:auto minmax(72px,180px) auto minmax(72px,180px) auto; align-items:center; width:min(100%,540px); margin-bottom:clamp(34px,4.5dvh,54px); }
.box-progress-number { font:700 calc((14px) * var(--gc-type-scale, 1))/1 var(--gc-product-serif); letter-spacing:.12em; color:rgba(var(--gc-ink-rgb),.34); transition:color .35s ease; }
.box-progress-number.is-seasalt { color:var(--gc-teal); }
.box-progress-number.is-cheddar { color:var(--gc-cheddar); }
.box-progress-number.is-korean { color:var(--gc-korean); }
.box-progress-nav[data-progress="1"] .box-progress-number:not(.is-seasalt),
.box-progress-nav[data-progress="2"] .box-progress-number.is-korean { filter:grayscale(1); opacity:.38; }
.box-progress-track { position:relative; height:4px; margin:0 16px; border-radius:999px; background:rgba(var(--gc-ink-rgb),.12); overflow:hidden; box-shadow:inset 0 1px 1px rgba(var(--gc-ink-rgb),.08); }
.box-progress-fill { position:absolute; inset:0; transform:scaleX(0); transform-origin:left; }
.box-progress-track.track-one .box-progress-fill { background:linear-gradient(90deg,var(--gc-teal),var(--gc-cheddar)); }
.box-progress-track.track-two .box-progress-fill { background:linear-gradient(90deg,var(--gc-cheddar),var(--gc-korean)); }
.box-progress-copy { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.box-step-title { margin:0 0 clamp(30px,5dvh,56px); font:600 italic calc((clamp(48px,5vw,82px)) * var(--gc-type-scale, 1))/.95 var(--gc-product-serif); letter-spacing:-.045em; }
.box-step-title.has-size-note { margin-bottom:12px; }
.box-bag-size-note { width:max-content; margin:0 0 clamp(28px,4dvh,46px); color:var(--gc-teal); font:800 calc((11px) * var(--gc-type-scale, 1))/1 var(--gc-sans); letter-spacing:.16em; text-transform:uppercase; }
.box-choice-grid { display:grid; grid-template-columns:1fr 1fr; gap:clamp(22px,3vw,46px); }
.box-choice { min-height:260px; padding:clamp(28px,3.5vw,52px); text-align:left; color:inherit; cursor:pointer; border:0; border-top:1px solid rgba(var(--gc-ink-rgb),.28); border-bottom:1px solid rgba(var(--gc-ink-rgb),.12); background:rgba(255,255,255,.12); transition:background .3s ease,transform .3s ease,border-color .3s ease; }
.box-choice:hover,
.box-choice:focus-visible { background:rgba(var(--box-accent-rgb),.07); border-color:var(--box-accent); transform:translateY(-3px); }
.box-choice-index { display:block; margin-bottom:clamp(54px,8dvh,92px); font:400 calc((11px) * var(--gc-type-scale, 1))/1 var(--gc-product-serif); letter-spacing:.18em; }
.box-choice strong { display:block; margin-bottom:12px; font:900 calc((clamp(30px,3vw,48px)) * var(--gc-type-scale, 1))/1 var(--gc-display); letter-spacing:-.035em; }
.box-choice small { font:400 calc((20px) * var(--gc-type-scale, 1))/1.35 var(--gc-product-serif); }
.box-size-prompt { margin-top:30px; padding-top:30px; border-top:1px solid rgba(var(--gc-ink-rgb),.15); }
.box-size-prompt[hidden] { display:none; }
.box-size-prompt p { margin:0 0 18px; font:600 italic calc((24px) * var(--gc-type-scale, 1))/1.2 var(--gc-product-serif); }
.box-size-options { display:flex; gap:12px; flex-wrap:wrap; }
.box-size-button { min-height:50px; padding:12px 24px; border:1px solid rgba(var(--gc-ink-rgb),.35); border-radius:999px; background:rgba(255,255,255,.24); color:inherit; cursor:pointer; font:600 calc((13px) * var(--gc-type-scale, 1))/1 var(--gc-product-serif); letter-spacing:.1em; }
.box-size-button[aria-pressed="true"] { border-color:var(--box-accent); background:var(--box-accent); color:var(--box-cta-text); }
.box-workspace { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(300px,.72fr); align-items:stretch; gap:clamp(42px,6vw,90px); }
.box-size-selector { display:flex; gap:12px; margin-bottom:clamp(30px,4dvh,48px); }
.box-builder-purchase-block { margin:0 0 clamp(30px,4dvh,44px); }
.box-builder-purchase-heading { margin:0 0 12px; font:700 calc((11px) * var(--gc-type-scale, 1))/1.2 var(--gc-sans); letter-spacing:.15em; text-transform:uppercase; color:rgba(var(--gc-ink-rgb),.58); }
.box-builder-purchase-toggle { display:grid; grid-template-columns:1fr 1fr; gap:6px; width:min(100%,620px); padding:5px; border:1px solid rgba(var(--gc-ink-rgb),.18); border-radius:999px; background:rgba(255,255,255,.42); box-shadow:inset 0 1px 0 rgba(255,255,255,.72); }
.box-builder-purchase-option { min-height:48px; padding:10px 18px; border:0; border-radius:999px; background:transparent; color:var(--gc-ink); cursor:pointer; font:700 calc((12px) * var(--gc-type-scale, 1))/1.15 var(--gc-sans); letter-spacing:.06em; text-transform:uppercase; transition:background .2s ease,color .2s ease,transform .2s ease; }
.box-builder-purchase-option[aria-checked="true"] { background:var(--gc-ink); color:#fff; }
.box-builder-purchase-option:active { transform:scale(.98); }
.box-builder-purchase-note { display:flex; align-items:center; flex-wrap:wrap; gap:9px 12px; margin:12px 2px 0; font:400 calc((15px) * var(--gc-type-scale, 1))/1.35 var(--gc-product-serif); color:rgba(var(--gc-ink-rgb),.64); }
.box-order-price { margin:8px 0 5px; font:900 calc((clamp(34px,3vw,48px)) * var(--gc-type-scale, 1))/1 var(--gc-display); letter-spacing:-.035em; }
.box-order-meta { margin:0 0 28px; font:500 calc((15px) * var(--gc-type-scale, 1))/1.35 var(--gc-product-serif); color:rgba(var(--gc-ink-rgb),.64); }
.box-flavor-list { border-top:1px solid rgba(var(--gc-ink-rgb),.2); }
.box-flavor-row { display:grid; grid-template-columns:1fr auto; align-items:center; min-height:92px; border-bottom:1px solid rgba(var(--gc-ink-rgb),.16); }
.box-flavor-name { font:900 calc((clamp(25px,2.3vw,36px)) * var(--gc-type-scale, 1))/1 var(--gc-display); }
.box-flavor-name[data-flavor="seasalt"] { color:var(--gc-teal); }
.box-flavor-name[data-flavor="koreanbbq"] { color:var(--gc-korean); }
.box-flavor-name[data-flavor="cheddar"] { color:#a9780f; }
.box-quantity { display:grid; grid-template-columns:48px 54px 48px; align-items:center; border:1px solid rgba(var(--gc-ink-rgb),.24); border-radius:12px; background:rgba(255,255,255,.24); }
.box-quantity button { width:48px; height:48px; border:0; background:transparent; cursor:pointer; font-size:calc((25px) * var(--gc-type-scale, 1)); }
.box-quantity button:active { transform:scale(.88); }
.box-quantity button:disabled { opacity:.25; cursor:not-allowed; }
.box-quantity output { text-align:center; font:600 calc((18px) * var(--gc-type-scale, 1))/1 var(--gc-product-serif); }
#build-your-box button,
#build-your-box [role="radio"],
#build-your-box .box-quantity,
#build-your-box .box-quantity button,
#build-your-box .box-size-button,
#build-your-box .box-auto-size-card {
  touch-action:manipulation;
  -webkit-user-select:none;
  user-select:none;
  -webkit-touch-callout:none;
  -webkit-tap-highlight-color:transparent;
}
#build-your-box .box-quantity button {
  -webkit-appearance:none;
  appearance:none;
}
.box-support { display:flex; flex-direction:column; padding-left:clamp(28px,3vw,48px); border-left:1px solid rgba(var(--gc-ink-rgb),.16); }
.box-support .box-primary { margin-top:auto; }
.box-progress { margin:0 0 12px; font:900 calc((clamp(38px,3.7vw,58px)) * var(--gc-type-scale, 1))/1 var(--gc-display); }
.box-status { min-height:24px; margin:0 0 38px; font:600 italic calc((18px) * var(--gc-type-scale, 1))/1.3 var(--gc-product-serif); }
.box-summary-label { margin-bottom:16px; }
.box-live-summary { min-height:74px; margin:0 0 34px; font:400 calc((19px) * var(--gc-type-scale, 1))/1.55 var(--gc-product-serif); }
.box-complete-wrap { margin:0; }
.box-complete-kicker { display:flex; align-items:center; gap:10px; margin:0 0 18px; font:800 calc((11px) * var(--gc-type-scale, 1))/1 var(--gc-sans); letter-spacing:.16em; text-transform:uppercase; color:var(--box-accent); }
.box-complete-check { display:grid; place-items:center; width:27px; height:27px; border-radius:999px; background:var(--box-accent); color:var(--box-cta-text); font:800 calc((15px) * var(--gc-type-scale, 1))/1 var(--gc-sans); box-shadow:0 8px 20px rgba(var(--box-accent-rgb),.18); }
.box-complete-card { padding:24px; border:1px solid rgba(var(--box-accent-rgb),.34); border-radius:18px; background:rgba(255,255,255,.48); box-shadow:0 16px 38px rgba(var(--box-accent-rgb),.08); }
.box-complete-top { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; }
.box-complete-pack { margin:0; font:900 calc((clamp(24px,2.4vw,34px)) * var(--gc-type-scale, 1))/1 var(--gc-display); letter-spacing:-.025em; }
.box-complete-price { margin:12px 0 4px; font:900 calc((clamp(42px,4vw,58px)) * var(--gc-type-scale, 1))/.95 var(--gc-display); letter-spacing:-.045em; }
.box-complete-meta { margin:0; font:500 calc((15px) * var(--gc-type-scale, 1))/1.4 var(--gc-product-serif); color:rgba(var(--gc-ink-rgb),.68); }
.box-complete-mix { margin-top:22px; padding-top:20px; border-top:1px solid rgba(var(--gc-ink-rgb),.14); }
.box-complete-mix-label { margin:0 0 10px; font:800 calc((10px) * var(--gc-type-scale, 1))/1 var(--gc-sans); letter-spacing:.16em; text-transform:uppercase; color:rgba(var(--gc-ink-rgb),.48); }
.box-complete-mix-list { margin:0; font:500 calc((18px) * var(--gc-type-scale, 1))/1.5 var(--gc-product-serif); }
.box-complete-edit { display:inline-flex; margin:16px 0 18px; padding:0; border:0; background:none; color:var(--gc-ink); cursor:pointer; font:600 calc((15px) * var(--gc-type-scale, 1))/1.2 var(--gc-product-serif); text-decoration:underline; text-underline-offset:5px; }
.box-complete-cta { min-height:62px; font:700 calc((14px) * var(--gc-type-scale, 1))/1 var(--gc-sans); letter-spacing:.12em; }
.box-primary,
.box-secondary { width:100%; min-height:56px; padding:15px 24px; border-radius:12px; cursor:pointer; font:600 calc((14px) * var(--gc-type-scale, 1))/1 var(--gc-product-serif); letter-spacing:.1em; text-transform:uppercase; }
.box-primary,
.box-secondary { position:relative; overflow:hidden; transition:transform .2s ease,box-shadow .28s ease,background-color .28s ease; }
.box-primary:hover { transform:translateY(-2px); box-shadow:0 16px 34px rgba(var(--box-accent-rgb),.25); }
.box-primary:active,
.box-secondary:active { transform:scale(.97); }
.box-particle { position:absolute; z-index:8; left:50%; top:72%; width:8px; height:8px; border-radius:50%; pointer-events:none; }
.box-particle.is-chip { border-radius:1px; clip-path:polygon(50% 0,100% 100%,0 100%); }
.box-primary { border:1px solid var(--box-accent); background:var(--box-accent); color:var(--box-cta-text); box-shadow:0 12px 28px rgba(var(--box-accent-rgb),.19); }
.box-secondary { margin-top:11px; border:1px solid var(--box-accent); background:rgba(255,255,255,.22); color:var(--box-accent); }
.box-primary:disabled { opacity:.3; cursor:not-allowed; box-shadow:none; }
.box-text-action { margin-top:20px; padding:5px 0; border:0; background:none; cursor:pointer; font:600 calc((16px) * var(--gc-type-scale, 1))/1 var(--gc-product-serif); text-decoration:underline; text-underline-offset:6px; }
.box-receipt { width:100%; max-width:760px; margin:0; }
.box-receipt-size { display:flex; align-items:center; gap:14px; margin:0 0 30px; font:900 calc((clamp(30px,3vw,46px)) * var(--gc-type-scale, 1))/1 var(--gc-display); }
.box-best-tag { display:inline-block; margin-left:10px; padding:4px 9px 3px; border-radius:999px; background:var(--gold,var(--gc-cheddar)); background:var(--gc-cheddar); color:#fff; font:700 calc((10px) * var(--gc-type-scale, 1))/1 var(--gc-sans); letter-spacing:.12em; text-transform:uppercase; vertical-align:middle; }
.box-receipt-size .box-best-tag { margin-left:0; }
.box-purchase-options { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin:24px 0 4px; }
.box-purchase { display:flex; flex-direction:column; gap:5px; padding:16px 16px 14px; border:1.5px solid rgba(var(--gc-ink-rgb),.22); border-radius:12px; background:rgba(255,255,255,.5); text-align:left; cursor:pointer; transition:border-color .2s ease, background .2s ease, box-shadow .2s ease; }
.box-purchase[aria-checked="true"] { border-color:var(--gc-cheddar); background:#fff; box-shadow:0 8px 24px rgba(var(--gc-cheddar-rgb),.16); }
.box-purchase-name { font:700 calc((14px) * var(--gc-type-scale, 1))/1.2 var(--gc-sans); letter-spacing:.04em; text-transform:uppercase; color:var(--gc-ink); }
.box-purchase-price { font:700 calc((clamp(22px,2vw,28px)) * var(--gc-type-scale, 1))/1 var(--gc-product-serif); color:var(--gc-ink); }
.box-purchase-meta { font:400 calc((14px) * var(--gc-type-scale, 1))/1.3 var(--gc-product-serif); color:rgba(var(--gc-ink-rgb),.62); }
.box-purchase-tag { margin-top:6px; }
.box-total-cycle { display:block; font:400 calc((13px) * var(--gc-type-scale, 1))/1.2 var(--gc-product-serif); letter-spacing:0; text-transform:none; color:rgba(var(--gc-ink-rgb),.55); }
@media (max-width:560px) {
.box-purchase-options { grid-template-columns:1fr; }
}
.box-receipt-lines { border-top:1px solid rgba(var(--gc-ink-rgb),.22); border-bottom:1px solid rgba(var(--gc-ink-rgb),.22); padding:24px 0; }
.box-receipt-row,
.box-receipt-total { display:flex; justify-content:space-between; gap:24px; font:400 calc((20px) * var(--gc-type-scale, 1))/1.5 var(--gc-product-serif); }
.box-receipt-totals { padding:24px 0 30px; }
.box-receipt-total { margin-bottom:12px; }
.box-receipt-total.shipping { align-items:center; padding:12px 14px; border:1px solid rgba(var(--gc-teal-rgb),.22); border-radius:12px; background:rgba(var(--gc-teal-rgb),.07); color:var(--gc-teal); font-weight:700; }
.box-receipt-total.grand { margin-top:24px; padding-top:22px; border-top:1px solid rgba(var(--gc-ink-rgb),.22); font-weight:700; font-size:calc((26px) * var(--gc-type-scale, 1)); }
.box-builder-message { margin:18px 0 0; min-height:22px; text-align:center; font:600 italic calc((16px) * var(--gc-type-scale, 1))/1.3 var(--gc-product-serif); }
.box-primary,
.box-secondary {
  position:relative;
  overflow:hidden;
  isolation:isolate;
}
.box-primary::before,
.box-secondary::before {
  content:"";
  position:absolute;
  z-index:0;
  inset:-45% auto -45% -42%;
  width:32%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.42),transparent);
  transform:translateX(-180%) skewX(-16deg);
  transition:transform .7s cubic-bezier(.2,.7,.2,1);
  pointer-events:none;
}
.box-primary { gap:12px; }
.box-primary::after {
  content:"→";
  display:inline-block;
  font-size:calc((1.18em) * var(--gc-type-scale, 1));
  line-height:.8;
  transition:transform .28s ease;
}
@media (hover:hover) and (pointer:fine) {
.box-primary:hover::before,
.box-secondary:hover::before { transform:translateX(590%) skewX(-16deg); }
.box-primary:hover::after { transform:translateX(5px); }
.box-secondary:hover { transform:translateY(-2px); box-shadow:0 15px 34px rgba(58,43,24,.16),0 0 0 1px rgba(255,255,255,.32) inset; }
.box-quantity button:hover { color:var(--gc-teal); background:rgba(var(--gc-teal-rgb),.09); }
}
@media (max-aspect-ratio:9/10) {
.box-builder-eyebrow { font-size:calc((11px) * var(--gc-type-scale, 1)); }
.after-story { padding:76px 16px 84px; }
.box-atmosphere { inset:-6% -50%; }
.box-atmosphere-field[data-atmosphere="1"] { background:radial-gradient(ellipse 48% 42% at 54% 35%,rgba(var(--gc-teal-rgb),.16),rgba(var(--gc-teal-rgb),.05) 47%,transparent 75%); }
.box-atmosphere-field[data-atmosphere="2"] { background:radial-gradient(ellipse 52% 46% at 48% 52%,rgba(var(--gc-cheddar-rgb),.18),rgba(var(--gc-cheddar-rgb),.06) 48%,transparent 76%); }
.box-atmosphere-field[data-atmosphere="3"] { background:radial-gradient(ellipse 48% 43% at 53% 62%,rgba(var(--gc-korean-rgb),.15),rgba(var(--gc-korean-rgb),.05) 48%,transparent 76%); }
.box-builder { width:100%; }
.box-builder-intro { margin-bottom:34px; padding:0 10px; }
.box-builder-eyebrow { font-size:calc((11px) * var(--gc-type-scale, 1)); }
.box-builder-title { font-size:calc((clamp(48px,13vw,66px)) * var(--gc-type-scale, 1)); }
.box-configurator { min-height:640px; padding:30px 18px 28px; border-radius:22px; backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); }
.box-step-count { margin-bottom:24px; font-size:calc((10px) * var(--gc-type-scale, 1)); }
.box-progress-nav { grid-template-columns:auto minmax(48px,1fr) auto minmax(48px,1fr) auto; width:100%; margin-bottom:34px; }
.box-progress-number { font-size:calc((12px) * var(--gc-type-scale, 1)); }
.box-progress-track { height:3px; margin:0 10px; }
.box-step-title { margin-bottom:30px; font-size:calc((clamp(42px,12vw,58px)) * var(--gc-type-scale, 1)); }
.box-step-title.has-size-note { margin-bottom:10px; }
.box-bag-size-note { margin-bottom:28px; font-size:calc((10px) * var(--gc-type-scale, 1)); letter-spacing:.13em; }
.box-choice-grid { grid-template-columns:1fr; gap:14px; }
.box-choice { min-height:170px; padding:25px 22px; }
.box-choice-index { margin-bottom:34px; }
.box-choice strong { font-size:calc((30px) * var(--gc-type-scale, 1)); }
.box-choice small { font-size:calc((17px) * var(--gc-type-scale, 1)); }
.box-size-options,
.box-size-selector { display:grid; grid-template-columns:1fr 1fr; }
.box-builder-purchase-block { margin-bottom:26px; }
.box-builder-purchase-toggle { width:100%; }
.box-builder-purchase-option { min-height:46px; padding:9px 8px; font-size:calc((10.5px) * var(--gc-type-scale, 1)); letter-spacing:.035em; }
.box-builder-purchase-note { margin-top:9px; font-size:calc((14px) * var(--gc-type-scale, 1)); }
.box-order-price { font-size:calc((36px) * var(--gc-type-scale, 1)); }
.box-order-meta { margin-bottom:24px; font-size:calc((14px) * var(--gc-type-scale, 1)); }
.box-size-button { padding:11px 10px; font-size:calc((11px) * var(--gc-type-scale, 1)); }
.box-workspace { grid-template-columns:1fr; gap:34px; }
.box-flavor-row { grid-template-columns:1fr; gap:16px; padding:22px 0; }
.box-flavor-name { font-size:calc((27px) * var(--gc-type-scale, 1)); }
.box-quantity { grid-template-columns:52px 1fr 52px; width:100%; }
.box-quantity button { width:52px; height:52px; }
.box-support { padding:28px 0 0; border-left:0; border-top:1px solid rgba(var(--gc-ink-rgb),.16); }
.box-progress { font-size:calc((40px) * var(--gc-type-scale, 1)); }
.box-status { margin-bottom:28px; }
.box-live-summary { min-height:auto; margin-bottom:28px; font-size:calc((17px) * var(--gc-type-scale, 1)); }
.box-support.is-complete { padding-top:6px; }
.box-support.is-complete .box-progress,
.box-support.is-complete .box-status,
.box-support.is-complete .box-summary-label,
.box-support.is-complete .box-order-price,
.box-support.is-complete .box-order-meta,
.box-support.is-complete .box-live-summary { display:none; }
.box-complete-kicker { margin-bottom:14px; }
.box-complete-card { padding:20px; border-radius:16px; }
.box-complete-top { gap:12px; }
.box-complete-pack { font-size:calc((25px) * var(--gc-type-scale, 1)); }
.box-complete-price { margin-top:10px; font-size:calc((46px) * var(--gc-type-scale, 1)); }
.box-complete-meta { font-size:calc((14px) * var(--gc-type-scale, 1)); }
.box-complete-mix { margin-top:18px; padding-top:16px; }
.box-complete-mix-list { font-size:calc((17px) * var(--gc-type-scale, 1)); }
.box-complete-edit { margin:14px 0 16px; }
.box-complete-cta { min-height:62px; }
.box-receipt-row,
.box-receipt-total { font-size:calc((17px) * var(--gc-type-scale, 1)); }
.box-receipt-total.grand { font-size:calc((22px) * var(--gc-type-scale, 1)); }
}
@media (prefers-reduced-motion:reduce) {
.box-choice { transition:none !important; }
.box-atmosphere-field { animation:none!important; }
}
@media (max-width:899px) {
.box-size-selector {
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:10px !important;
    margin:0 0 24px !important;
  }
.box-size-selector .box-size-button {
    position:relative;
    min-height:84px !important;
    padding:14px 10px 12px !important;
    border-radius:18px !important;
    display:flex !important;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:5px;
    font:700 calc((14px) * var(--gc-type-scale, 1))/1 var(--gc-sans) !important;
    letter-spacing:.08em !important;
    text-transform:uppercase;
    background:rgba(255,255,255,.5) !important;
    border:1.5px solid rgba(var(--gc-ink-rgb),.18) !important;
    box-shadow:0 7px 18px rgba(50,42,28,.035);
  }
.box-size-selector .box-size-button[aria-pressed="true"] {
    border:2px solid var(--box-accent) !important;
    background:color-mix(in srgb,var(--box-accent) 9%, white) !important;
    color:var(--gc-ink) !important;
    box-shadow:0 9px 22px color-mix(in srgb,var(--box-accent) 14%, transparent);
  }
.box-size-selector .box-size-button .box-size-price {
    display:block;
    font:700 calc((22px) * var(--gc-type-scale, 1))/1 var(--gc-product-serif);
    letter-spacing:-.02em;
    text-transform:none;
  }
.box-size-selector .box-size-button[aria-pressed="true"] .box-size-price { color:var(--box-accent); }
.box-size-selector .box-size-button .box-size-meta {
    display:block;
    font:500 calc((10px) * var(--gc-type-scale, 1))/1.15 var(--gc-sans);
    letter-spacing:0;
    text-transform:none;
    color:rgba(var(--gc-ink-rgb),.56);
  }
.box-size-selector .box-best-tag {
    position:absolute;
    top:-9px;
    left:50%;
    transform:translateX(-50%);
    margin:0 !important;
    white-space:nowrap;
    font-size:calc((8px) * var(--gc-type-scale, 1)) !important;
    padding:5px 8px 4px !important;
  }
}
@media (min-width:900px) {
#build-your-box .box-size-selector {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px;
    width:min(100%,700px);
    margin:0 0 30px;
  }
#build-your-box .box-size-selector .box-size-button {
    position:relative;
    min-height:112px;
    padding:22px 24px 20px;
    border:1px solid rgba(var(--gc-ink-rgb),.16);
    border-radius:18px;
    background:rgba(255,255,255,.42);
    color:var(--gc-ink);
    display:grid;
    grid-template-columns:1fr auto;
    grid-template-rows:auto auto;
    column-gap:18px;
    row-gap:8px;
    align-items:end;
    text-align:left;
    font-family:var(--gc-sans);
    letter-spacing:0;
    box-shadow:0 8px 24px rgba(54,43,26,.035),inset 0 1px 0 rgba(255,255,255,.7);
    transition:border-color .2s ease,background .2s ease,box-shadow .2s ease,transform .2s ease;
  }
#build-your-box .box-size-selector .box-size-button:hover {
    transform:translateY(-2px);
    border-color:rgba(var(--gc-ink-rgb),.28);
    box-shadow:0 12px 30px rgba(54,43,26,.07),inset 0 1px 0 rgba(255,255,255,.8);
  }
#build-your-box .box-size-selector .box-size-button[aria-pressed="true"] {
    border:2px solid var(--box-accent);
    background:color-mix(in srgb,var(--box-accent) 6%, white);
    color:var(--gc-ink);
    box-shadow:0 14px 34px color-mix(in srgb,var(--box-accent) 12%, transparent),inset 0 1px 0 rgba(255,255,255,.82);
  }
#build-your-box .box-size-selector .box-size-button > span:not(.box-size-price):not(.box-size-meta):not(.box-best-tag) {
    grid-column:1;
    grid-row:1;
    align-self:end;
    font:800 calc((13px) * var(--gc-type-scale, 1))/1 var(--gc-sans);
    letter-spacing:.12em;
    text-transform:uppercase;
    color:rgba(var(--gc-ink-rgb),.72);
  }
#build-your-box .box-size-selector .box-size-price {
    grid-column:1;
    grid-row:2;
    display:block;
    font:700 calc((31px) * var(--gc-type-scale, 1))/1 var(--gc-product-serif);
    letter-spacing:-.025em;
    color:var(--gc-ink);
  }
#build-your-box .box-size-selector .box-size-meta {
    grid-column:2;
    grid-row:2;
    align-self:center;
    display:block;
    white-space:nowrap;
    font:600 calc((12px) * var(--gc-type-scale, 1))/1 var(--gc-sans);
    letter-spacing:.01em;
    text-transform:none;
    color:rgba(var(--gc-ink-rgb),.52);
  }
#build-your-box .box-size-selector .box-size-button[aria-pressed="true"] .box-size-price {color:var(--box-accent);}
#build-your-box .box-size-selector .box-best-tag {
    position:absolute;
    top:16px;
    right:18px;
    left:auto;
    transform:none;
    margin:0;
    padding:6px 9px 5px;
    border-radius:999px;
    background:var(--gc-cheddar);
    color:#fff;
    font:800 calc((9px) * var(--gc-type-scale, 1))/1 var(--gc-sans);
    letter-spacing:.12em;
    text-transform:uppercase;
    white-space:nowrap;
  }
#build-your-box .box-builder-purchase-block {margin-top:4px;}
}
.box-size-prompt {
  margin-top:22px;
  padding:22px;
  border:1px solid rgba(var(--gc-ink-rgb),.14);
  border-radius:24px;
  background:rgba(255,255,255,.34);
  box-shadow:0 14px 36px rgba(var(--gc-ink-rgb),.055);
}
.box-size-prompt-head { margin-bottom:16px; }
.box-size-prompt .box-size-kicker {
  display:block;
  margin-bottom:8px;
  font:700 calc((10px) * var(--gc-type-scale, 1))/1 var(--product-sans);
  letter-spacing:.18em;
  text-transform:uppercase;
  opacity:.55;
}
.box-size-prompt .box-size-prompt-head p {
  margin:0 0 5px;
  font:700 calc((clamp(25px,3vw,34px)) * var(--gc-type-scale, 1))/1.05 var(--gc-product-serif);
  font-style:normal;
  letter-spacing:-.02em;
}
.box-size-prompt-head small {
  display:block;
  max-width:520px;
  font:500 calc((12px) * var(--gc-type-scale, 1))/1.45 var(--product-sans);
  opacity:.62;
}
.box-size-prompt .box-size-options {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.box-size-prompt .box-auto-plan {
  position:relative;
  min-height:116px;
  padding:17px 16px 15px;
  border:1px solid rgba(var(--gc-ink-rgb),.24);
  border-radius:18px;
  background:rgba(255,255,255,.28);
  color:inherit;
  text-align:left;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-start;
  gap:0;
  letter-spacing:0;
  transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease;
}
.box-size-prompt .box-auto-plan:hover,
.box-size-prompt .box-auto-plan:focus-visible {
  transform:translateY(-2px);
  border-color:rgba(var(--gc-ink-rgb),.5);
  outline:none;
  box-shadow:0 10px 24px rgba(var(--gc-ink-rgb),.07);
}
.box-size-prompt .box-auto-plan.is-best {
  border:1.5px solid var(--gc-cheddar);
  background:linear-gradient(180deg,rgba(var(--gc-cheddar-rgb),.11),rgba(255,255,255,.32));
}
.box-auto-plan-top {
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:12px;
}
.box-auto-plan-top strong {
  font:800 calc((12px) * var(--gc-type-scale, 1))/1 var(--product-sans);
  letter-spacing:.12em;
}
.box-auto-plan-top em {
  padding:5px 7px 4px;
  border-radius:999px;
  background:var(--gc-cheddar);
  color:#fffaf0;
  font:800 calc((8px) * var(--gc-type-scale, 1))/1 var(--product-sans);
  font-style:normal;
  letter-spacing:.12em;
  white-space:nowrap;
}
.box-auto-plan-price {
  display:block;
  margin-bottom:5px;
  font:700 calc((25px) * var(--gc-type-scale, 1))/1 var(--gc-product-serif);
  letter-spacing:-.025em;
}
.box-auto-plan-meta {
  font:600 calc((10px) * var(--gc-type-scale, 1))/1.2 var(--product-sans);
  letter-spacing:.02em;
  opacity:.58;
}
.box-size-subnote {
  margin-top:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  font:600 calc((10px) * var(--gc-type-scale, 1))/1.3 var(--product-sans);
  opacity:.62;
}
.box-size-subnote span {
  padding:4px 6px;
  border-radius:999px;
  background:rgba(var(--gc-cheddar-rgb),.13);
  color:#8b6512;
  font-weight:800;
  letter-spacing:.08em;
}
@media (max-width:899px) {
.box-size-prompt {
    margin-top:18px;
    padding:18px 16px 16px;
    border-radius:20px;
  }
.box-size-prompt-head { margin-bottom:14px; }
.box-size-prompt .box-size-prompt-head p { font-size:calc((27px) * var(--gc-type-scale, 1)); }
.box-size-prompt-head small { font-size:calc((11px) * var(--gc-type-scale, 1)); line-height:1.4; }
.box-size-prompt .box-size-options { gap:8px; }
.box-size-prompt .box-auto-plan {
    min-height:108px;
    padding:15px 13px 13px;
    border-radius:16px;
  }
.box-auto-plan-top { align-items:flex-start; margin-bottom:11px; }
.box-auto-plan-top strong { font-size:calc((11px) * var(--gc-type-scale, 1)); }
.box-auto-plan-top em { font-size:calc((7px) * var(--gc-type-scale, 1)); padding:5px 6px 4px; }
.box-auto-plan-price { font-size:calc((23px) * var(--gc-type-scale, 1)); }
.box-auto-plan-meta { font-size:calc((9px) * var(--gc-type-scale, 1)); }
.box-size-subnote { margin-top:10px; font-size:calc((9px) * var(--gc-type-scale, 1)); }
}
@media (max-aspect-ratio: 9/10) {
#build-your-box .box-flavor-row {
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:12px;
    min-height:0;
    padding:14px 0;
  }
#build-your-box .box-flavor-name {
    font-size:calc((clamp(22px,6.2vw,27px)) * var(--gc-type-scale, 1));
    line-height:1;
  }
#build-your-box .box-quantity {
    grid-template-columns:42px 40px 42px;
    width:auto;
    min-width:124px;
    border-radius:999px;
  }
#build-your-box .box-quantity button {
    width:42px;
    height:44px;
    font-size:calc((21px) * var(--gc-type-scale, 1));
  }
#build-your-box .box-quantity output {
    font-size:calc((16px) * var(--gc-type-scale, 1));
  }
}

/* ==========================================================================
   Section-driven support
   ========================================================================== */

/* Flavour colours now come from the flavour blocks rather than fixed handles,
   and the real add-to-cart form is posted invisibly by the configurator. */

.box-hidden-form {
  display: none;
}

.gc-page .box-flavor-name {
  color: var(--flavor-color, var(--gc-ink));
}

.gc-page .box-size-button[aria-pressed='true'] {
  border-color: var(--box-accent, var(--gc-teal));
  box-shadow: 0 0 0 1px var(--box-accent, var(--gc-teal)) inset;
}

.gc-page .box-size-button[disabled],
.gc-page .box-primary[disabled] {
  opacity: 0.45;
  cursor: not-allowed;
}


