/* v5: silhouette-safe SVG art, wide product photography, designed pickers. */
body[data-screen=unavailable] #app,.photo-screen{background:linear-gradient(145deg,#ff518b,#ff287c)}
.photo-content{background:transparent}
body[data-screen=unavailable] #app{padding-bottom:24px}
svg.art{overflow:visible;object-fit:contain}
.round .art{width:34px;height:34px}
#bottomNav{height:84px;padding:7px 4px;background:#fff8ed}
#bottomNav button{gap:3px;font-size:12px}
#bottomNav .art{width:40px;height:40px}
#bottomNav button.on:after{bottom:-5px}
.brand-hero .hero-cone{right:2px;bottom:4px;width:90px;height:108px}
.brand-hero .hero-berry{left:3px;bottom:7px;width:85px;height:95px}
/* Every product gets a horizontal photo at its natural ratio and a separate info band. */
.products{display:flex;flex-direction:column;gap:27px;margin:14px calc(-1 * var(--body-gutter));}
.product{display:block;padding:0;background:none;border-radius:0;overflow:visible}
.product-visual{margin:0;min-height:0;background:#f3f3f3;position:relative}
.photo-button{display:block;padding:0;margin:0;width:100%;line-height:0;border-radius:0}
.product-image{display:block;width:100%;height:auto;max-height:none;object-fit:initial;margin:0;border-radius:0}
.product .favorite{top:12px;right:12px;background:#fff8ed;box-shadow:0 3px 0 #dba28d;width:40px;height:40px}
.product .favorite.selected{background:#ffcf00}
.advantage{left:14px;bottom:12px;max-width:calc(100% - 70px);font-size:12px;padding:7px 11px;transform:rotate(-2deg)}
.product-info{padding:15px 16px 14px;background:#fff0dc;border-radius:0 0 22px 22px;display:grid;grid-template-columns:1fr auto;column-gap:12px}
.product-title{grid-column:1/-1;grid-row:1;min-height:0;font-size:20px;line-height:1.2;margin:0 0 12px;max-width:100%;color:#64231b}
.product-info .score-row{grid-column:1/-1;grid-row:2;margin:0 0 8px;align-items:center}
.product-info .health{display:flex;align-items:baseline;gap:4px;padding:7px 10px;min-width:0;font-size:23px;border-radius:11px}
.product-info .health small{font-size:12px}
.product-info .health span{display:inline;font-size:10px;margin-left:4px}
.product-info .rating{display:flex;align-items:baseline;gap:4px;font-size:11px}
.product-info .rating b{font-size:17px}
.product-info .microfacts{grid-column:1/-1;grid-row:3;font-size:12px;line-height:1.45;display:flex;flex-wrap:wrap;gap:5px 13px;margin:0 0 11px}
.product-info .conflict{grid-column:1/-1;margin:0 0 10px}
.product-foot{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;margin:0}
.product-foot .price{font-size:26px}
.product-foot .add{width:52px;height:44px;font-size:27px;border-radius:14px}
.product-info .discount-detail{grid-column:1;align-self:center;font-size:10px;margin:5px 0 0}
.product-info .compare-link{grid-column:2;justify-self:end;align-self:end;font-size:12px;min-height:32px;margin:3px 0 0;padding:5px 0}
/* Cart/comparison/recipes also keep the original landscape image proportions. */
.cart-photo{width:38%;align-self:flex-start;overflow:hidden;border-radius:12px}
.cart-photo img{display:block;width:100%;height:auto;object-fit:initial}
.compare-grid{grid-template-columns:1fr}
.compare-grid>div{padding:0;overflow:hidden;background:#fff0dc}
.compare-grid img{display:block;width:100%;height:auto;object-fit:initial;margin:0}
.compare-grid>div>:not(img){margin-left:16px;margin-right:16px}
.compare-grid h3{min-height:0;margin-top:15px;font-size:18px}
.compare-grid .primary{width:calc(100% - 32px);margin-bottom:16px}
.recipe-photo img,.recipe-large{height:auto;object-fit:initial}
/* A custom picker, including search, grouped icon rows and a warm scrollbar. */
.native-choice{display:none!important}
.choice-picker{position:relative;min-width:0;flex:1}
.stage-label>.choice-picker{display:block}
.stage-label{align-items:stretch;position:relative;z-index:25}
.stage-label #nextScreen{flex:0 0 46px;align-self:center;box-shadow:0 3px 0 #e88e16}
.choice-trigger,.stage-label .choice-trigger{display:flex;align-items:center;gap:11px;width:100%;height:auto;min-height:66px;padding:9px 12px;text-align:left;background:#fff6e8;border:2px solid #ffb82b;border-radius:19px;box-shadow:0 4px 0 #de5d31;font-size:15px;line-height:1.2}
.choice-trigger .art{width:41px;height:41px}
.choice-copy{display:block;flex:1;min-width:0}
.choice-copy small{display:block;font-size:10px;color:#a65b38;margin-bottom:4px}
.choice-copy strong{font-size:15px;display:block;overflow-wrap:anywhere}
.choice-chevron{display:grid;place-items:center;width:27px;height:27px;border-radius:50%;background:#ffd150;font-size:24px;flex-shrink:0;transition:transform .18s}
.is-open .choice-chevron{transform:rotate(180deg)}
.choice-panel{position:absolute;left:0;right:0;top:calc(100% + 9px);z-index:45;background:#fff9ed;border:2px solid #ffbd39;border-radius:22px;box-shadow:0 12px 35px #81264040;padding:10px;max-width:100%}
.choice-panel-head{display:flex;justify-content:space-between;align-items:center;padding:7px 6px 10px;font-size:16px}
.choice-panel-head>span{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#ffcf00;font-size:12px;}
.choice-search{display:flex;gap:8px;align-items:center;border-radius:12px;background:#ffe9cf;padding:9px 10px;margin-bottom:9px}
.choice-search>span{font-size:22px;line-height:1}
.choice-search input{width:100%;min-width:0;padding:0;border:0;background:transparent;font:inherit;font-size:14px;outline-offset:4px}
.choice-options{max-height:min(390px,46dvh);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#ff9c27 #ffe8c7;padding:2px 6px 4px 0}
.choice-options::-webkit-scrollbar{width:7px}
.choice-options::-webkit-scrollbar-track{background:#ffe8c7;border-radius:12px}
.choice-options::-webkit-scrollbar-thumb{background:#ff9c27;border-radius:12px;border:1px solid #ffe8c7}
.choice-group{font-size:10px;text-transform:uppercase;color:#9c532b;margin:15px 7px 8px}
.choice-group:first-child{margin-top:4px}
.choice-option,.stage-label .choice-option{display:flex;align-items:center;gap:11px;width:100%;height:auto;min-height:58px;border-radius:13px;padding:8px;background:transparent;text-align:left;font-size:14px;line-height:1.25;margin:3px 0}
.choice-option .art{width:36px;height:36px}
.choice-option>span{flex:1}
.choice-option strong{display:block;font-size:14px;}
.choice-option small{display:block;color:#9d5b40;font-size:10px;margin-top:3px}
.choice-option[aria-selected=true]{background:#ffe09a;box-shadow:inset 3px 0 #f99723}
.choice-option:hover,.choice-option:focus-visible{background:#ffebc2}
.choice-tick{color:#a64a13;font-size:18px;min-width:16px}
.field .choice-picker{margin-top:8px;}
.field .choice-panel{z-index:49}
#app{scrollbar-color:#ffb52c #ff3e83}
@media(max-width:650px){#bottomNav{height:calc(84px + env(safe-area-inset-bottom));padding-bottom:calc(7px + env(safe-area-inset-bottom))}.choice-trigger,.stage-label .choice-trigger{min-height:62px}.choice-copy strong{font-size:14px}.choice-options{max-height:42dvh}.products{gap:24px}}
@media(max-width:380px){.product-title{font-size:18px;min-height:0}.product-info{padding:14px 12px}.product-image{height:auto}.product-visual{min-height:0}.product-info .microfacts{font-size:11px}.cart-photo{width:35%}.cart-photo img{width:100%}.choice-trigger .art{width:34px;height:34px}.choice-copy strong{font-size:13px}}