/* Homepage cards use current catalog records and links with explicit set intent. */
body.public-ui #sets .ui-sets{gap:24px}
body.public-ui #sets .ui-set{display:flex;flex-direction:column;align-items:stretch;padding:0;border:0;border-radius:20px;background:transparent;overflow:visible;gap:0}
body.public-ui #sets .ui-set-photo{display:block;width:100%;aspect-ratio:16/10;border-radius:20px;overflow:hidden;background:#bee3b5}
body.public-ui #sets .ui-set-photo img{width:100%;height:100%;object-fit:contain;transform:none;background:transparent}
body.public-ui #sets .ui-set-body{display:flex;flex:1;flex-direction:column;padding:20px 0 0;gap:10px}
body.public-ui #sets .ui-set h3{font-size:23px;line-height:1.3;font-weight:600;letter-spacing:-.02em;padding:0;margin:0}
body.public-ui #sets .ui-set p{font-size:15px;line-height:1.5;margin:0;color:#65705e;padding:0}
body.public-ui #sets .ui-set-bottom{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:auto;padding-top:12px;flex-wrap:nowrap}
body.public-ui #sets .ui-set-bottom strong{font-size:24px;font-weight:600;white-space:nowrap;line-height:1.3}
body.public-ui #sets .ui-set .ui-button{font-size:14px;min-height:44px;padding:10px 14px;width:auto!important;flex:none}
/* Same published field and renderer power the homepage and editor preview. Images are visible without animation. */
.how22 .how22-steps{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.how22 .how22-step{position:relative;min-width:0;min-height:470px;padding:26px;border:0;border-radius:28px;overflow:hidden;isolation:isolate;opacity:1;transform:none;color:#263d2b}
.how22-yellow{background:#f4efbe}.how22-lime{background:#dfedc9}.how22-sand{background:#eee6d6}.how22-peach{background:#f7deca}
.how22 .how22-copy{position:relative;z-index:2;pointer-events:none}
.how22 .how22-number{display:block;font-size:36px;line-height:1;font-weight:450;letter-spacing:-.04em;color:#58624e;margin:0 0 18px}
.how22 .how22-step h3{font-size:29px;line-height:1.2;letter-spacing:-.025em;font-weight:600;margin:0 0 12px;max-width:100%}
.how22 .how22-step p{font-size:15px;line-height:1.5;color:#56614f;margin:0;max-width:500px}
.how22 .how22-photos{position:absolute;inset:0;z-index:1;pointer-events:none}
.how22 .how22-photos img{display:block;position:absolute;bottom:0;left:0;width:100%;height:100%;object-fit:contain;object-position:center bottom;background:transparent;transform:none}
.how22 .how22-photos-multiple img{height:55%;width:auto;max-width:none;object-fit:contain;bottom:-6px;left:4%}
.how22 .how22-photos-multiple img:nth-child(2){left:48%}
.how22 .how22-photos-multiple img:nth-child(3){left:92%}
.how22 .how22-fallback{display:block;margin:38px auto 0;color:#477044}
.how16-admin-preview .how22 .ui-container{width:100%;max-width:none}
.how16-admin-preview .how22 .how22-step{min-height:440px}
/* Restore compact size buttons; the rest of stage21's delivery/header fixes remain. */
html:root body.public-ui.page-menu .weekly-customer[data-menu-page]{padding-top:24px!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-heading{margin:0 0 20px!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-heading h1{font-size:32px!important;line-height:1.2!important;margin:0 0 8px!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-heading p{margin:0!important;color:#65705e!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .set-size-title{font-size:18px!important;margin:0 0 12px!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-set-list{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:12px!important;margin:0 0 18px!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-set{min-height:112px!important;padding:16px 18px 36px!important;border-radius:16px!important;gap:6px!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-set strong{font-size:18px!important;line-height:1.3!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-set small{font-size:14px!important;margin-top:5px!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-set b{font-size:21px!important;line-height:1.3!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-layout{display:block!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-note{background:transparent!important;padding:0!important;margin:0 0 12px!important;font-size:14px!important;line-height:1.5!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-feedback:empty{display:none}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .week-reset[hidden]{display:none!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .week-reset{margin:0 0 16px!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-category-links{display:none}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-categories{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:20px!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-category{display:contents!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-category__heading{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip-path:inset(50%)!important;margin:0!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dishes{display:contents!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish{display:flex!important;flex-direction:column!important;border-radius:16px!important;margin:0!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish>img{width:100%!important;height:auto!important;aspect-ratio:4/3!important;object-fit:contain!important;border-radius:16px 16px 0 0!important;background:#e7efda!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__body{flex:1!important;justify-content:flex-start!important;padding:14px!important;gap:7px!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish h3{font-size:17px!important;line-height:1.35!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__body>p{font-size:14px!important;line-height:1.4!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__actions{display:flex!important;align-items:center!important;justify-content:space-between!important;flex-wrap:wrap!important;width:100%!important;gap:8px!important;margin-top:auto!important;padding:0 14px 14px!important;box-sizing:border-box!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__actions button{font-size:13px!important;min-height:44px!important;padding:8px 6px!important;gap:5px!important}
/* MENU-ACTIONS-35: these two menu actions own their appearance here. */
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__actions :is(.menu-page-composition,.menu-page-replace){display:inline-flex;align-items:center;justify-content:center;flex-shrink:0!important;font-size:14px!important;gap:7px!important;padding:8px 3px!important;box-sizing:border-box;border:0!important;border-radius:9px!important;background:transparent!important;color:#586b5c;font-family:inherit;font-weight:500;line-height:1.4;white-space:nowrap!important;box-shadow:none!important;transform:none;transition:background-color 160ms ease,color 160ms ease;cursor:pointer;-webkit-tap-highlight-color:rgba(50,105,67,.1)}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__actions .menu-page-replace{color:var(--action-fill,#326943);font-weight:600}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__actions :is(.menu-page-composition,.menu-page-replace) svg{display:block;flex:none;width:18px;height:18px;transform:none}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__actions .menu-page-composition[aria-expanded=true]{color:#244b31;background:#edf4ee!important}
@media(hover:hover) and (pointer:fine){
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__actions :is(.menu-page-composition,.menu-page-replace):not(:disabled):not([aria-disabled=true]):hover{background:#f0f6f0!important;color:#244b31}
}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__actions :is(.menu-page-composition,.menu-page-replace):not(:disabled):not([aria-disabled=true]):active{background:#e4efe5!important;color:#244b31}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__actions :is(.menu-page-composition,.menu-page-replace):is(:disabled,[aria-disabled=true]){background:transparent!important;color:#7b877d;opacity:1;cursor:default;pointer-events:none}
@media(prefers-reduced-motion:reduce){
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__actions :is(.menu-page-composition,.menu-page-replace){transition:none}
}

html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-summary{display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:space-between!important;gap:20px!important;margin:24px 0 0!important;padding:18px!important;background:#edf3e7!important;border-radius:16px!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-order{width:auto!important;padding:0!important;background:transparent!important;border:0!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-order-panel{padding:0!important;border:0!important;background:transparent!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-summary__head{display:flex!important;align-items:center!important;gap:12px!important;margin:0!important;padding:0!important;border:0!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-summary__head img{width:64px!important;height:64px!important;border-radius:10px!important;object-fit:contain!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-summary__footer{display:flex!important;align-items:center!important;gap:20px!important;width:auto!important;padding:0!important;background:transparent!important;border:0!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-summary__total{display:grid!important;gap:4px!important;margin:0!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-summary__total strong{font-size:24px!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-cart-link{font-size:14px!important;margin:0!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-addon-link{margin-top:24px;padding:18px 20px;align-items:center;flex-direction:row}
.menu-addon-link h2{font-size:20px;margin-bottom:6px}
/* Real gaps between transparent addon cards, with the circle fully inside each cell. */
body.public-ui .addons-page [data-addons-catalog]{column-gap:24px;row-gap:30px}
body.public-ui .cart-content [data-addons-catalog]{column-gap:22px;row-gap:28px}
body.public-ui .addition-card{gap:14px}
body.public-ui .addition-card .addition-photo-shell,body.public-ui .cart-content .addition-card .addition-photo-shell{width:calc(100% - 12px);max-width:210px;overflow:hidden}
body.public-ui .addition-card .addition-copy{gap:10px;padding:0 4px}
body.public-ui .addition-heading{gap:4px 10px;align-items:baseline}
@media(max-width:1099px){
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-categories{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:16px!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-summary{display:none!important}
 body.public-ui #sets .ui-set h3{font-size:20px}
 body.public-ui #sets .ui-set-bottom{flex-wrap:wrap}
 .how22 .how22-step{min-height:430px;padding:24px}
 .how22 .how22-step h3{font-size:25px}
 .how22 .how22-step p{font-size:14px}
}
@media(max-width:700px){
 body.public-ui #sets .ui-sets{grid-template-columns:1fr;gap:28px}
 body.public-ui #sets .ui-set-photo{aspect-ratio:16/10}
 body.public-ui #sets .ui-set-body{padding-top:16px}
 body.public-ui #sets .ui-set h3{font-size:22px}
 body.public-ui #sets .ui-set-bottom{flex-wrap:nowrap;padding-top:6px}
 body.public-ui #sets .ui-set-bottom strong{font-size:23px}
 .how22 .how22-steps{grid-template-columns:1fr;gap:16px}
 .how22 .how22-step{min-height:420px;padding:24px;border-radius:24px}
 .how22 .how22-number{font-size:30px;margin-bottom:16px}
 .how22 .how22-step h3{font-size:25px;margin-bottom:12px}
 .how22 .how22-step p{font-size:15px;line-height:1.5}
 .how22 .how22-photos-multiple img{height:48%}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-heading h1{font-size:28px!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-set-list{grid-template-columns:1fr!important;gap:8px!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-set{flex-direction:row!important;min-height:84px!important;padding:12px 14px 30px!important;align-items:center!important;gap:10px!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-set strong{font-size:16px!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-set b{font-size:19px!important;flex:none!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-set>.set-choice-state{bottom:6px!important;left:14px!important;font-size:12px!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-categories{grid-template-columns:1fr!important;gap:12px!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish{display:grid!important;grid-template-columns:36% minmax(0,1fr)!important;align-items:stretch!important;min-height:154px!important;overflow:hidden!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish>img{height:100%!important;min-height:154px!important;aspect-ratio:auto!important;border-radius:15px 0 0 15px!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__body{width:100%!important;padding:12px!important;gap:6px!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish h3{font-size:16px!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__body>p{font-size:14px!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__actions{grid-column:1/-1!important;padding:0 12px 12px!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__actions button{font-size:14px!important;padding:8px 10px!important;min-height:44px!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__actions :is(.menu-page-composition,.menu-page-replace){padding:8px 10px!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__actions svg{width:18px;height:18px;flex:none}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-addon-link{align-items:flex-start;flex-direction:column;gap:14px}
 body.public-ui .addons-page [data-addons-catalog],body.public-ui .cart-content [data-addons-catalog]{column-gap:14px;row-gap:16px}
 body.public-ui .addition-card .addition-photo-shell,body.public-ui .cart-content .addition-card .addition-photo-shell{width:calc(100% - 8px)}
 body.public-ui .addition-card .addition-copy{padding:0 2px}
}
@media(max-width:359px){
 .how22 .how22-step{min-height:400px;padding:20px}
 .how22 .how22-step h3{font-size:24px}
 .how22 .how22-step p{font-size:14px}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish{grid-template-columns:34% minmax(0,1fr)!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__body{padding:10px!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__actions{padding:0 10px 10px!important}
}

html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-composition span{display:inline!important}

/* The phone uses a dedicated photo area under the readable copy. */
@media(max-width:700px){
 .how22 .how22-step{display:flex;flex-direction:column;min-height:0;padding:24px}
 .how22 .how22-photos{position:relative;inset:auto;flex:none;height:230px;margin:12px -24px -24px;overflow:clip}
 .how22 .how22-photos:not(.how22-photos-multiple) img{width:130%;height:auto;left:-15%;max-width:none;bottom:0}
 .how22 .how22-photos-multiple img{height:100%;bottom:-6px}
}
@media(max-width:359px){
 .how22 .how22-step{padding:20px}
 .how22 .how22-photos{height:215px;margin:12px -20px -20px}
}

@media(min-width:701px) and (max-width:759px){html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__actions :is(.menu-page-composition,.menu-page-replace){padding-inline:0!important;gap:6px!important}html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__actions :is(.menu-page-composition,.menu-page-replace) svg{width:17px;height:17px}}
@media(min-width:701px) and (max-width:719px){html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__actions{gap:6px!important}html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__actions :is(.menu-page-composition,.menu-page-replace){font-size:13.5px!important}}
/* A restore action has its own row; the two primary actions remain at the edges. */
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__actions .week-restore{flex-basis:100%;margin-top:0}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__actions button:focus-visible{outline:2px solid #99601b!important;outline-offset:2px!important}