/* Shared frame and name component; only the illustration differs. */
:is(.page-shop,.page-reservation)>.preview-note{font-size:11px;line-height:20px;padding:2px 12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:.04em;flex-shrink:0}
:is(.page-shop,.page-reservation)>main{padding-bottom:90px;min-height:0}
:is(.page-shop,.page-reservation) .play-heading{display:block!important;width:100%;max-width:560px;margin:10px auto;flex-shrink:0}
:is(.page-shop,.page-reservation) .play-heading h1{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;margin:0;padding:0}
:is(.page-shop,.page-reservation) .play-heading .eyebrow{display:block;font-size:11px;line-height:16px;margin:0;letter-spacing:.08em}
:is(.page-shop,.page-reservation) .play-heading .caption{font-size:12px;line-height:18px;margin:3px 0 0}
.page-shop #shop-play,.page-reservation #reservation-play{max-width:560px;padding:22px;flex:1;min-height:0;margin:0 auto;border-radius:24px;background-size:cover;isolation:isolate}
.page-shop #shop-play::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(to bottom,rgba(247,243,238,.92),rgba(247,243,238,.45) 38%,transparent 72%)}
.page-shop [data-shop-step="name"]{padding:0;display:block;flex:1}
.page-reservation #personal-reservation{padding:0;min-height:0}
#shop-play .guest-intro,#reservation-play .guest-intro{display:flex;flex-direction:column;gap:18px;padding:0;margin:0;background:none}
#shop-play .guest-intro h2,#reservation-play .guest-intro h2{font-size:28px;line-height:1.15;margin:0;padding:0;background:none;border-radius:0}
#shop-play .guest-intro input,#reservation-play .guest-intro input{height:50px;min-height:50px;width:100%;font-size:18px;padding:10px 12px}
#shop-play .guest-intro .button,#reservation-play .guest-intro .button{height:50px;min-height:50px;margin:0;width:100%;padding:10px 18px;font-size:18px}
.page-shop:has([data-shop-step="name"]:not([hidden])) .play-footnote{display:none}
.page-shop:has([data-shop-step="name"]:not([hidden])) #shop-cart-dock{display:none}
/* Keep adding another mix available while only the basket rows scroll. */
.page-shop #add-another{font-size:14px;min-height:44px;margin:0;padding:10px 12px}
.page-shop .cart-footer{display:flex;flex-direction:column;gap:6px;flex-shrink:0}
.page-shop .cart-footer .box-total{padding:2px 0;font-size:16px;line-height:22px}
.page-shop .cart-scroll>.cart-pickup{margin-top:8px}
.page-shop .cart-scroll>.quote-source{margin-top:6px}
.page-shop .cart-rebate{display:inline-block;padding:3px 8px;border-radius:12px;background:#e4ecd9;color:#36502b;font-size:12px;font-weight:600;margin:2px 0 8px}
.page-shop #cart-saving{display:block;color:#36502b;font-size:13px;line-height:18px}
.page-shop .quote-source{font-size:11px;line-height:15px;margin:0;flex-shrink:0;color:#685a4f}
.page-shop #cart-retry{align-self:flex-start;padding:4px 0;min-height:32px;font-size:14px}
.page-shop .play-feedback{flex-shrink:0}
.page-shop .play-progress{font-size:14px;line-height:20px;gap:6px}
.page-shop .play-progress .plain-button{min-height:32px;padding:4px 0}
.page-shop .cart-pickup{font-size:14px;line-height:19px;margin:0;color:#4e6042;flex-shrink:0}
.page-shop:has([data-shop-step="review"]:not([hidden])) .play-footnote{display:none}
.page-shop .pickup-overview{display:flex;flex-direction:column;gap:8px}
.page-shop .pickup-overview>*{flex-shrink:0}
.page-shop .pickup-preparation{padding:12px;border-radius:18px;background:#e5ebdc}
.page-shop .pickup-preparation[data-mode="production"]{background:#eee0ce}
.page-shop .pickup-preparation h3{font-size:21px;line-height:1.15;margin:0 0 7px}
.page-shop .pickup-preparation p{font-size:15px;line-height:1.45;margin:0}
.page-shop .pickup-instructions{display:flex;gap:10px;background:rgba(255,253,249,.91);border-radius:18px;padding:12px}
.page-shop .pickup-instructions svg{width:25px;height:25px;flex-shrink:0;margin-top:1px;color:#5a7050}
.page-shop .pickup-instructions p{margin:0;font-size:15px;line-height:1.45}
.page-shop .pickup-instructions strong{display:block;margin-bottom:5px;font-size:16px}
.page-shop .pickup-details{background:rgba(255,253,249,.94);border:1px solid rgba(80,65,50,.12);border-radius:15px;padding:0 13px}
.page-shop .pickup-details summary{min-height:46px;padding:12px 0;font-size:14px;font-weight:600;cursor:pointer}
.page-shop .pickup-details summary span{float:right;font-weight:400}
.page-shop .pickup-details-content{padding-bottom:12px;font-size:14px;line-height:1.45;overflow-wrap:anywhere}
.page-shop .pickup-details-content p{font-size:14px;margin:3px 0 9px}
.page-shop .pickup-hours{margin:0;font-size:14px}
.page-shop .pickup-hours>div{display:flex;justify-content:space-between;gap:8px}
.page-shop .pickup-hours dd{margin:0;text-align:right}
.page-shop .pickup-preview-note{font-size:12px;line-height:16px;margin:0;flex-shrink:0}
.page-shop:has([data-shop-step="contact"]:not([hidden])) .play-footnote{display:none}
.page-shop [data-shop-step="contact"]{padding:14px;background:rgba(248,245,240,.94);border-radius:18px}
.page-shop #shop-contact-form{display:flex;flex-direction:column;flex:1;min-height:0;gap:10px}
.page-shop .shop-contact-fields{display:flex;flex-direction:column;gap:12px}
.page-shop .shop-contact-fields label{font-size:15px;font-weight:600}
.page-shop #shop-email{font-size:18px;height:50px;min-height:50px;padding:10px 12px}
.page-shop #shop-email[aria-invalid="true"]{border:2px solid #993b37}
.page-shop #shop-email-note{font-size:16px;line-height:1.45;margin:0}
.page-shop .shop-contact-fields .caption{font-size:14px;line-height:1.45;margin:0}
.page-shop #shop-edit-name{align-self:flex-start;font-size:14px}
.page-shop #shop-contact-error{font-size:14px;line-height:1.3;color:#993b37;margin:0;flex-shrink:0}
.page-shop #shop-contact-error:empty{display:none}
.page-shop #shop-contact-back{align-self:flex-start;flex-shrink:0}
.page-shop .shop-review-card{border-radius:16px;background:rgba(255,253,249,.95);padding:10px}
.page-shop .shop-review-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:4px}
.page-shop .shop-review-title h3{font-size:16px;line-height:1.3;margin:0}
.page-shop .shop-review-title .review-edit{padding:6px 10px;min-height:40px;background:#e8ebdf;font-size:14px}
.page-shop .shop-review-box{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;padding:6px 0;border-top:1px solid #e8dfd3;font-size:15px;line-height:1.4}
.page-shop .shop-review-box>span:first-child{min-width:0;overflow-wrap:anywhere}
.page-shop .shop-review-box>span:last-child{white-space:nowrap;font-weight:400}
.page-shop .shop-review-box small{display:block;color:#616b51;font-size:13px;margin-top:3px}
.page-shop #shop-review-email{font-size:16px;line-height:1.4;overflow-wrap:anywhere;margin:0}
.page-shop .shop-review-footer{flex-shrink:0;display:flex;flex-direction:column;gap:6px}
.page-shop .shop-review-footer .pickup-preview-note{text-align:center}
.page-shop .shop-review-footer #shop-pay:disabled{opacity:.66;cursor:not-allowed}
.page-shop .shop-review-footer .box-total{padding:6px 0;font-size:16px}
.page-shop .shop-review-footer .box-total strong{line-height:1.25}
/* Calendar and times share the available frame with the back action. */
.page-reservation #reservation-play .play-progress{margin:0 0 12px;gap:7px;font-size:14px;line-height:20px}
.page-reservation #reservation-play:is([data-step="1"],[data-step="2"]) #personal-reservation{display:flex;flex-direction:column;gap:8px;overflow:visible}
.page-reservation #reservation-play #personal-reservation>section:is([data-res-step="1"],[data-res-step="2"]){display:flex;flex-direction:column;gap:8px;min-height:0;flex:1;padding:14px;overflow:visible}
.page-reservation #reservation-play #personal-reservation>section:is([data-res-step="1"],[data-res-step="2"]) h2{font-size:25px;line-height:1.15;margin:0;flex-shrink:0}
.page-reservation #reservation-play .calendar-bar{margin:0;flex-shrink:0;height:40px}
.page-reservation #reservation-play .calendar-bar button{height:40px;width:40px}
.page-reservation #reservation-play .calendar-week{margin:0;flex-shrink:0;font-size:13px;line-height:18px}
.page-reservation #reservation-play .calendar-days{flex:1;min-height:0;max-height:264px;grid-template-rows:repeat(var(--calendar-rows,5),minmax(0,1fr));gap:4px}
.page-reservation #reservation-play .calendar-days button{aspect-ratio:auto;min-height:0;height:auto;max-height:44px;font-size:16px;border-radius:10px}
.page-reservation #reservation-play #personal-times{grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:minmax(36px,44px);gap:7px}
.page-reservation #reservation-play #personal-times button{padding:4px;min-height:0;height:100%;font-size:16px;border-radius:12px}
.page-reservation #reservation-play #chosen-date{margin:0;font-size:15px;line-height:20px}
.page-reservation #reservation-play section:is([data-res-step="1"],[data-res-step="2"]) .caption{font-size:12px;line-height:16px;margin:0;flex-shrink:0}
.page-reservation #reservation-play #personal-back{align-self:flex-start;flex-shrink:0;min-height:40px;padding:6px 12px;font-size:14px;line-height:24px}
@media(min-width:761px){
 :is(.page-shop,.page-reservation)>main{padding-bottom:20px}
 .page-reservation #reservation-play,.page-shop #shop-play{flex:0 1 620px;width:560px;max-width:100%}
 .page-reservation #reservation-play #personal-reservation>section:is([data-res-step="1"],[data-res-step="2"]){flex:0 1 auto;min-height:340px}
 .page-reservation #reservation-play .calendar-days{flex:none;height:calc(var(--calendar-rows,5) * 44px + (var(--calendar-rows,5) - 1) * 4px)}
}
@media(max-width:760px){
 :is(.page-shop,.page-reservation)>.site-header{height:68px;min-height:68px;padding:5px 0;justify-content:center}
 :is(.page-shop,.page-reservation) .site-header .brand img{height:52px;width:80px;object-fit:contain}
 .page-shop #shop-play,.page-reservation #reservation-play{padding:18px}
 #shop-play .guest-intro h2,#reservation-play .guest-intro h2{font-size:27px}
 .page-reservation #reservation-play #personal-reservation>section:is([data-res-step="1"],[data-res-step="2"]) h2{font-size:23px}
}
@media(max-width:760px) and (max-height:680px){
 :is(.page-shop,.page-reservation)>main{padding-bottom:80px}
 :is(.page-shop,.page-reservation) .play-heading{margin:5px auto}
 :is(.page-shop,.page-reservation) .play-heading .eyebrow{display:none}
 .page-shop #shop-play,.page-reservation #reservation-play{padding:14px}
 .page-shop:has(:is([data-shop-step="cart"],[data-shop-step="review"]):not([hidden])) .play-footnote{display:none}
 .page-shop .play-progress{margin-bottom:8px;gap:4px;font-size:12px;line-height:18px}
 .page-shop [data-shop-step]>h2{font-size:22px;margin-bottom:2px}
 .page-reservation #reservation-play .play-progress{margin-bottom:8px;font-size:13px;gap:4px}
 .page-reservation #reservation-play #personal-reservation>section:is([data-res-step="1"],[data-res-step="2"]){padding:10px;gap:5px}
 .page-reservation #reservation-play #personal-reservation>section:is([data-res-step="1"],[data-res-step="2"]) h2{font-size:21px}
 .page-reservation #reservation-play #personal-times{grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:36px;gap:5px}
 .page-reservation #reservation-play .calendar-bar{height:32px}
 .page-reservation #reservation-play .calendar-bar button{height:32px;width:36px}
}
@media(max-width:760px) and (max-height:600px){
 :is(.page-shop,.page-reservation) .play-heading{display:none!important}
 :is(.page-shop,.page-reservation)>.site-header{height:56px;min-height:56px}
 .page-reservation #reservation-play .calendar-days{gap:3px}
}

/* Recovery shares the compact guest card; only offer details scroll. */
#shop-recovery:not([hidden]){display:flex;flex-direction:column;min-height:0;height:100%;gap:.7rem}
#shop-recovery .shop-scroll{flex:1;min-height:0;overflow:auto}
#shop-recovery .shop-actions{flex-shrink:0}
#shop-recovery h2,#shop-recovery>p{margin:0}
#shop-recovery .shop-actions{flex-direction:column;align-items:stretch;gap:2px;background:rgba(247,243,238,.94);padding:8px;border-radius:18px}
#shop-recovery .shop-actions>.wide-button{width:100%;margin-top:0;min-height:46px}
.page-shop:has(#shop-recovery:not([hidden])) .play-footnote{display:none}
#shop-recovery>p{overflow-wrap:anywhere}