/* Reference-image layer. It enhances the current presentation without replacing its data or flows. */
.hero-media figure{background:radial-gradient(circle at 50% 44%,#ffd86a 0 32%,#ef8b1d 68%,#d66a12 100%)}
.hero-media figure img{object-fit:cover;padding:0;border-radius:50%;-webkit-clip-path:none;clip-path:none;transform:scale(1.075);filter:drop-shadow(0 18px 15px rgba(76,29,8,.26));transition:opacity .22s ease,transform .35s ease}
.hero-media figure figcaption{position:absolute;left:50%;bottom:13px;z-index:2;transform:translateX(-50%);width:max-content;max-width:82%;padding:7px 10px;border-radius:999px;background:rgba(33,21,18,.86);color:var(--c);font-size:8px;font-weight:900;letter-spacing:.1em;text-align:center}
.hero-pick{max-width:210px}
.hero-pick b{line-height:.92}

.menu-feature{display:grid;place-items:center;padding:34px;background:radial-gradient(circle at 50% 38%,#ffd85c 0 27%,#f39a27 58%,#d76412 100%)!important;isolation:isolate}
.menu-feature-rays{position:absolute;inset:-90%;z-index:-1;border-radius:50%;background:repeating-conic-gradient(rgba(255,241,216,.22) 0 10deg,transparent 10deg 22deg);animation:menu-rays 28s linear infinite;transform-origin:50% 50%;will-change:transform;backface-visibility:hidden}
.menu-feature>img{position:relative;z-index:1;width:min(86%,480px);height:auto!important;object-fit:contain!important;border-radius:50%;-webkit-clip-path:circle(44.7% at 50% 50%);clip-path:circle(44.7% at 50% 50%);background:transparent;filter:drop-shadow(0 20px 17px rgba(71,24,5,.28));transition:transform .28s ease,filter .28s ease}
.menu-feature.menu-changing>img{animation:menu-product-pop .42s ease}
.menu-feature-copy{position:absolute;z-index:3;left:20px;right:20px;bottom:20px;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:16px;padding:16px 17px;border:2px solid var(--d);border-radius:20px;background:rgba(255,241,216,.94);box-shadow:7px 7px 0 var(--d);backdrop-filter:blur(12px)}
.menu-feature-copy span,.menu-feature-copy strong,.menu-feature-copy p{display:block;margin:0}
.menu-feature-copy span{font-size:9px;font-weight:900;letter-spacing:.13em;color:var(--m)}
.menu-feature-copy strong{font-family:Anton,Impact,sans-serif;font-size:clamp(28px,3vw,43px);line-height:.95;text-transform:uppercase}
.menu-feature-copy p{margin-top:4px;font-size:11px;font-weight:700;color:var(--m2)}
.menu-feature-copy button{min-height:44px;padding:10px 14px;border:0;border-radius:999px;background:var(--d);color:var(--c);font-weight:900;box-shadow:0 5px 0 var(--m)}
.menu-feature-note{position:absolute;z-index:3;top:18px;left:50%;transform:translateX(-50%);width:max-content;max-width:86%;padding:7px 10px;border-radius:999px;background:rgba(33,21,18,.82);color:var(--c);font-size:8px;letter-spacing:.1em;text-align:center}
@keyframes menu-product-pop{0%{transform:scale(.94) rotate(-2deg);opacity:.55}100%{transform:none;opacity:1}}
@keyframes menu-rays{to{transform:rotate(360deg)}}

.card{display:grid!important;grid-template-columns:84px minmax(0,1fr);grid-template-rows:1fr auto;column-gap:14px;align-items:center;transition:transform .2s ease,box-shadow .2s ease,outline-color .2s ease}
.card-product{grid-row:1/3;position:relative;width:84px;aspect-ratio:1;border:2px solid var(--d);border-radius:50%;overflow:hidden;background:var(--o);box-shadow:4px 4px 0 rgba(33,21,18,.2)}
.card-product img{width:100%;height:100%;object-fit:contain;padding:0;background:radial-gradient(circle,#ffd878,#ed7d14);transform:scale(1.08)}
.card>div:not(.card-product){position:relative;z-index:2;align-self:end;min-width:0}
.card h3{margin-right:56px!important;font-size:26px!important;overflow-wrap:anywhere}
.card:nth-child(n) p{color:var(--m2)}
.card:nth-child(5n) p{color:#fff1d8e8}
.card button{position:relative;z-index:2;grid-column:2;align-self:start}
.card .num{right:14px;top:9px;z-index:1;font-size:43px;color:rgba(33,21,18,.12);pointer-events:none}
.card.menu-active{outline:4px solid var(--m);outline-offset:-7px}
.card:has([data-flavor="Woodsman"]){background:var(--m)!important;color:var(--c)!important;box-shadow:inset 0 0 0 2px var(--y)}
.card:has([data-flavor="Woodsman"]):before{content:"NEW";position:absolute;z-index:3;right:13px;bottom:12px;padding:5px 7px;border-radius:999px;background:var(--y);color:var(--d);font-size:8px;font-weight:900;letter-spacing:.1em}
.card:has([data-flavor="Woodsman"]) p{color:rgba(255,241,216,.78)!important}
.card:has([data-flavor="Woodsman"]) button{color:var(--y)}

/* iPad/Safari presentation cleanup: contain every wide surface and keep product art crisp. */
html,body{width:100%;max-width:100%;overflow-x:clip!important}
.section,.shell,.flavor-grid,.cards,.card{min-width:0}
.half-product img{-webkit-clip-path:circle(46.25% at 50% 50%);clip-path:circle(46.25% at 50% 50%)}
.menu-feature-note{white-space:normal;line-height:1.25}

.spin-product-image,.spin-result-image{width:100%;height:100%;object-fit:cover;border-radius:50%;-webkit-clip-path:none;clip-path:none;background:radial-gradient(circle,#ffd878,#ed7d14);transform:scale(1.1)}
.wheel .wl10 .spin-icon{width:36px;height:36px;flex:0 0 36px;border:2px solid var(--d);border-radius:50%;overflow:hidden;background:var(--o);box-shadow:0 3px 0 rgba(33,21,18,.2)}
.spin-detail-icon{padding:3px;overflow:hidden;border-radius:50%!important}
.spin-result-image{border:2px solid var(--c);box-shadow:0 0 0 2px var(--d)}
.hero-media.spin-result-reveal figure img{animation:hero-flavor-reveal .52s cubic-bezier(.2,.8,.2,1)}
@keyframes hero-flavor-reveal{0%{opacity:.15;transform:scale(.94) rotate(-3deg)}65%{opacity:1;transform:scale(1.1) rotate(1deg)}100%{transform:scale(1.075)}}

.half-photo{isolation:isolate;background:radial-gradient(circle,#ffd878,#c95812)}
.half-product{position:absolute;inset:0;width:50%;overflow:hidden}
.half-product img{position:absolute;top:0;width:200%;height:100%;object-fit:cover;transform:scale(1.075);filter:drop-shadow(0 18px 18px rgba(0,0,0,.3))}
.half-product-left{left:0;clip-path:inset(0 0 0 0)}
.half-product-left img{left:0}
.half-product-right{left:50%}
.half-product-right img{right:0}
.half-seam{position:absolute;z-index:2;left:50%;top:4%;bottom:4%;width:4px;border-radius:999px;background:var(--c);box-shadow:0 0 0 2px var(--d);transform:translateX(-50%)}
.half-photo>b{z-index:3;max-width:42%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.half-visual-note{display:block;margin:15px 3px 0;color:rgba(255,241,216,.66);font-size:9px;font-weight:900;letter-spacing:.11em;text-align:center}

.order-choice[data-choice-type="flavor"]{display:grid;grid-template-columns:62px minmax(0,1fr) auto;grid-template-rows:auto 1fr;column-gap:10px;align-items:center}
.order-choice-thumb{grid-row:1/3;width:62px;height:62px;border:2px solid currentColor;border-radius:50%;overflow:hidden;background:var(--o)}
.order-choice-thumb img{width:100%;height:100%;object-fit:cover;padding:0;background:#ef9a34;transform:scale(1.1)}
.order-choice[data-choice-type="flavor"]>strong{grid-column:2/4;align-self:end}
.order-choice[data-choice-type="flavor"]>.choice-meta{grid-column:3;grid-row:2;align-self:start}
.order-choice[data-choice-type="flavor"]>.choice-desc{grid-column:2;grid-row:2;align-self:start}
.half-choice{display:grid;grid-template-columns:30px minmax(0,1fr);align-items:center;gap:7px}
.half-choice-thumb{width:30px;height:30px;border-radius:50%;overflow:hidden;border:1px solid currentColor}
.half-choice-thumb img{width:100%;height:100%;object-fit:cover;background:#ef9a34;transform:scale(1.1)}
.order-live-preview{display:grid;grid-template-columns:88px minmax(0,1fr);gap:14px;align-items:center;margin:12px 0 17px;padding:12px;border:2px solid var(--d);border-radius:20px;background:#f5bf78;box-shadow:5px 5px 0 var(--o)}
.order-live-preview>div:last-child{min-width:0}
.order-live-preview small,.order-live-preview strong,.order-live-preview span{display:block}
.order-live-preview small{font-size:9px;font-weight:900;letter-spacing:.12em}
.order-live-preview strong{margin:2px 0;font-family:Anton,Impact,sans-serif;font-size:24px;line-height:1;text-transform:uppercase}
.order-live-preview span{font-size:11px;color:var(--m2)}
.order-live-media{width:88px;height:88px;border:2px solid var(--d);border-radius:18px;overflow:hidden;background:var(--o)}
.order-live-media img{width:100%;height:100%;object-fit:cover;background:#ef9a34;transform:scale(1.075)}
.order-live-media.half-media{display:grid;grid-template-columns:1fr 1fr}
.order-live-media.half-media img{min-width:0}
.order-live-media.half-media img:first-child{object-position:left center}
.order-live-media.half-media img:last-child{object-position:right center}

@media(max-width:1024px){
 .card{grid-template-columns:74px minmax(0,1fr)}.card-product{width:74px}.card h3{font-size:23px!important;margin-right:50px!important}.menu-feature{padding:26px}.menu-feature>img{width:min(82%,440px)}
}
@media(max-width:820px){
 .spin-grid{grid-template-columns:1fr!important;gap:28px!important}
 .wheel-wrap{order:-1;width:min(82vw,500px)!important}
 .spin-copy{text-align:center}.spin-copy .result{margin-inline:auto}.spin-copy>.btn{margin-inline:auto}
}
@media(max-width:620px){
 .hero-media figure figcaption{bottom:8px;font-size:7px}
 .menu-feature{min-height:0!important;aspect-ratio:1;padding:24px}.menu-feature>img{width:82%}.menu-feature-copy{left:13px;right:13px;bottom:13px;padding:13px;grid-template-columns:1fr}.menu-feature-copy strong{font-size:30px}.menu-feature-copy button{width:100%}.menu-feature-note{top:12px;font-size:7px}
 .card{grid-template-columns:74px minmax(0,1fr);min-height:148px!important}.card-product{width:74px}.card h3{font-size:24px!important;margin-right:46px!important}
 .order-choice[data-choice-type="flavor"]{grid-template-columns:58px minmax(0,1fr) auto}.order-choice-thumb{width:58px;height:58px}
 .order-live-preview{grid-template-columns:72px minmax(0,1fr)}.order-live-media{width:72px;height:72px}.order-live-preview strong{font-size:21px}
}
@media(max-width:390px){
 .menu-feature-copy p{font-size:10px}.menu-feature-copy button{min-height:40px}
 .card{grid-template-columns:62px minmax(0,1fr);column-gap:10px}.card-product{width:62px}.card h3{font-size:21px!important;margin-right:42px!important}
 .wheel .wl10 .spin-icon{width:28px;height:28px;flex-basis:28px}
 .order-choice[data-choice-type="flavor"]{grid-template-columns:50px minmax(0,1fr)}.order-choice-thumb{width:50px;height:50px}.order-choice[data-choice-type="flavor"]>.choice-meta{grid-column:2;grid-row:3}.order-choice[data-choice-type="flavor"]>.choice-desc{grid-column:2;grid-row:2}
 .half-photo>b{font-size:8px}
}
@media(prefers-reduced-motion:reduce){.menu-feature-rays,.menu-feature.menu-changing>img{animation:none!important}}


/* Clean pizza cutouts
   Some source product renders include a dark baked-in rim. Crop just inside
   that rim so thumbnails, Half & Half, Mystery Mix, and order previews all
   read as clean pizza cutouts instead of black-edged discs. */
.half-product img,
.half-flavor-pick img,
.mystery-reel img,
.order-choice-thumb img,
.half-choice-thumb img,
.order-live-media img,
.planner-pizza img{
  -webkit-clip-path:circle(44.4% at 50% 50%)!important;
  clip-path:circle(44.4% at 50% 50%)!important;
  filter:none!important;
  box-shadow:none!important;
  background:transparent!important;
}

.half-product img{transform:scale(1.11)!important}
.half-flavor-pick img{transform:scale(1.12)!important}
.mystery-reel img{transform:scale(1.11)!important}
.order-choice-thumb img,
.half-choice-thumb img,
.order-live-media img,
.planner-pizza img{transform:scale(1.10)!important}

/* Keep the circular product crop visually centered after the tighter mask. */
.mystery-reel img,
.half-flavor-pick img,
.order-choice-thumb img,
.half-choice-thumb img{
  object-position:center!important;
}


/* Spinner pizza-slice product markers */
.wheel .wl10 .spin-icon{
  position:relative!important;
  width:46px!important;
  height:56px!important;
  flex:0 0 56px!important;
  border:0!important;
  border-radius:0!important;
  overflow:hidden!important;
  background:linear-gradient(180deg,#f2a23a,#d56c18)!important;
  box-shadow:0 5px 10px rgba(53,23,8,.18)!important;
  -webkit-clip-path:polygon(50% 100%,4% 10%,96% 10%)!important;
  clip-path:polygon(50% 100%,4% 10%,96% 10%)!important;
  transform:rotate(var(--slice-rotation,0deg))!important;
  transform-origin:50% 50%!important;
}

.wheel .wl10 .spin-icon::after{
  content:""!important;
  position:absolute!important;
  z-index:2!important;
  left:7px!important;
  right:7px!important;
  top:8px!important;
  height:6px!important;
  border-radius:999px!important;
  background:linear-gradient(180deg,#e9aa57,#b95e1a)!important;
  box-shadow:0 1px 0 rgba(255,255,255,.24) inset!important;
  pointer-events:none!important;
}

.spin-product-image{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  border-radius:0!important;
  -webkit-clip-path:none!important;
  clip-path:none!important;
  background:transparent!important;
  transform:scale(1.72)!important;
  transform-origin:center!important;
  filter:none!important;
}

.spin-result-image{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  border-radius:50%!important;
  -webkit-clip-path:none!important;
  clip-path:none!important;
  background:radial-gradient(circle,#ffd878,#ed7d14)!important;
  transform:scale(1.08)!important;
}

.wheel .wl10.selected .spin-icon{
  filter:drop-shadow(0 0 4px rgba(255,241,216,.85)) brightness(1.06)!important;
}

@media(max-width:620px){
  .wheel .wl10 .spin-icon{
    width:38px!important;
    height:47px!important;
    flex-basis:47px!important;
  }
  .wheel .wl10 .spin-icon::after{
    left:6px!important;
    right:6px!important;
    top:7px!important;
    height:5px!important;
  }
}
@media(max-width:390px){
  .wheel .wl10 .spin-icon{
    width:34px!important;
    height:42px!important;
    flex-basis:42px!important;
  }
}