@font-face{font-family:"Inter";src:url(/fonts/inter-latin.woff2) format("woff2");font-weight:400 800;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}/* Protein Aisle design system: one brand colour (deep emerald) on warm neutrals.
   White cards with soft shadows on a light canvas, ink text, pill controls, big bold numerals.
   Brand green is reserved for the logo, primary buttons, links and active states, value rings, deal pills and the hero. */
:root{--bg:#F6F7F6;--card:#fff;--soft:#F0F2F0;--soft2:#E4E8E5;--ink:#111;--ink2:#2B302D;--muted:#4A514D;--line:#E6E9E7;--line2:#D5DAD7;
--brand:#0E6249;--brand-d:#0A513C;--brand-dk:#073A2B;--t50:#EFF6F2;--t100:#DCEDE3;--t200:#B7D9C6;--good:var(--brand);
--coles:#E01A22;--woolworths:#178841;--aldi:#1F4FBF;
--sh1:0 1px 2px rgba(17,17,17,.04),0 2px 10px rgba(17,17,17,.05);--sh2:0 2px 6px rgba(17,17,17,.05),0 12px 32px rgba(17,17,17,.08);
--r:24px;--r2:18px;--r3:14px;--s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:56px;
--display:"Inter",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--body:var(--display)}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-padding-top:84px}
body{margin:0;font:18px/1.6 var(--body);background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;font-feature-settings:"cv11","ss01"}
h1,h2,h3,h4{font-family:var(--display);letter-spacing:-.025em;line-height:1.12;font-weight:700;color:var(--ink);margin:0}
h1{font-size:clamp(30px,4.4vw,44px);letter-spacing:-.035em}h2{font-size:clamp(21px,2.4vw,26px)}h3{font-size:19px;letter-spacing:-.015em}
p{margin:0 0 var(--s3)}
a{color:var(--ink);text-underline-offset:3px;text-decoration-color:var(--line2)}a:hover{text-decoration-color:currentColor}
.ic{width:20px;height:20px;flex:none;vertical-align:middle}
.wrap{max-width:1140px;margin:0 auto;padding:0 24px}
main{display:block;min-height:50vh;padding-bottom:var(--s7)}
.sr{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.skip{position:absolute;left:-9999px;top:0;background:#fff;padding:8px 12px;z-index:50;border-radius:999px}.skip:focus{left:8px;top:8px}
a:focus-visible,button:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:12px}
.num,.big,.pr b,.mc b,.kpis b,.rcard .pg,.facts dd{font-variant-numeric:tabular-nums}
/* header: a conventional website header. Desktop: text nav. Mobile: slim bar + menu panel. */
header.site{background:rgba(246,247,246,.88);backdrop-filter:saturate(1.6) blur(16px);-webkit-backdrop-filter:saturate(1.6) blur(16px);position:sticky;top:0;z-index:30;border-bottom:1px solid transparent;transition:transform .25s ease,border-color .2s}
header.site.hide{transform:translateY(-100%)}
.hd{display:flex;align-items:center;gap:var(--s5);height:calc(68px + env(safe-area-inset-top));padding-top:env(safe-area-inset-top)}
.logo{display:flex;align-items:center;gap:9px;text-decoration:none;color:var(--ink);margin-right:auto}
.logo .mark{width:30px;height:30px}
.wm{font-family:var(--display);font-weight:700;font-size:19px;letter-spacing:-.035em;color:var(--ink)}
nav.top{display:flex;gap:var(--s5)}
nav.top a{position:relative;color:var(--muted);text-decoration:none;font-weight:500;font-size:17px;padding:8px 0}
nav.top a:hover{color:var(--ink)}
nav.top a[aria-current]{color:var(--brand);font-weight:600}
nav.top a[aria-current]:after{content:"";position:absolute;left:0;right:0;bottom:1px;height:2px;border-radius:2px;background:var(--brand)}
.hact{display:flex;align-items:center;gap:4px;margin-left:var(--s3)}
.hic{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;border:0;background:none;color:var(--ink);cursor:pointer;padding:0}
.hic:hover{background:var(--soft)}.hic .ic{width:21px;height:21px}
.hlist{display:inline-flex;align-items:center;gap:7px;text-decoration:none;color:var(--ink);font-weight:600;font-size:16.5px;padding:9px 16px;border-radius:999px;background:var(--card);box-shadow:var(--sh1);margin-left:4px}
.hlist .ic{width:18px;height:18px}
.cnt{background:var(--brand);color:#fff;font-size:13px;font-weight:700;border-radius:999px;min-width:18px;height:18px;line-height:18px;text-align:center;padding:0 5px}
.cnt[hidden]{display:none}
.hmb{display:none}.hmb .i-close{display:none}.hmb[aria-expanded=true] .i-open{display:none}.hmb[aria-expanded=true] .i-close{display:block}
.mnav{display:none}
@media (max-width:820px){
 .hd{height:calc(56px + env(safe-area-inset-top));gap:var(--s2)}.logo .mark{width:28px;height:28px}.wm{font-size:18px}
 nav.top{display:none}.hmb{display:grid}
 .hlist{position:relative;width:40px;height:40px;padding:0;justify-content:center;background:none;box-shadow:none;margin:0;border-radius:50%}.hlist:hover{background:var(--soft)}.hlist .ic{width:21px;height:21px}
 .hlist .hl-t{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
 .hlist .cnt{position:absolute;top:3px;right:1px;min-width:16px;height:16px;line-height:16px;font-size:12px;padding:0 4px}
 .mnav:not([hidden]){display:block;position:fixed;left:0;right:0;top:calc(56px + env(safe-area-inset-top));bottom:0;z-index:29;background:var(--bg);overflow-y:auto;overscroll-behavior:contain;padding:var(--s3) 0 calc(var(--s6) + env(safe-area-inset-bottom));animation:mnin .18s ease-out}
 html.mopen{overflow:hidden}html.mopen header.site{border-bottom-color:var(--line);background:var(--bg)}
 .mrows{display:flex;flex-direction:column;background:var(--card);border-radius:var(--r);box-shadow:var(--sh1);padding:4px 16px}
 .mrows a{display:flex;align-items:center;gap:14px;padding:12px 0;min-height:60px;text-decoration:none;color:var(--ink);font-size:18px;font-weight:600;letter-spacing:-.02em;border-bottom:1px solid var(--line)}
 .mrows a:last-child{border-bottom:0}
 .mrows .mi{width:40px;height:40px;border-radius:50%;background:var(--soft);display:grid;place-items:center;flex:none}.mrows .mi .emo{width:24px;height:24px}
 .mrows .ml{flex:1}.mrows .mch{width:18px;height:18px;color:var(--muted)}
 .mrows a[aria-current] .mi{background:var(--t50);box-shadow:inset 0 0 0 2px var(--brand)}
 .msec{display:grid;grid-template-columns:1fr 1fr;gap:var(--s2);margin-top:var(--s4)}
 .msec a{display:flex;align-items:center;min-height:48px;padding:10px 16px;border-radius:var(--r3);background:var(--card);box-shadow:var(--sh1);text-decoration:none;color:var(--ink);font-size:17px;font-weight:500}
}
@keyframes mnin{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
/* page head */
.crumbs{font-size:15px;color:var(--muted);margin:var(--s3) 0 0;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.crumbs a{color:var(--muted);text-decoration:none}.crumbs a:hover{color:var(--ink)}.crumbs .sep{opacity:.5}
.hero{padding:var(--s5) 0 var(--s2);max-width:780px}
.hero h1{margin:0 0 var(--s3)}
.hero p,.lede{color:var(--muted);font-size:18px;max-width:680px;margin:0 0 var(--s2)}
.meta1{font-size:15.5px;color:var(--muted);margin:0}.meta1 a{color:var(--muted)}
.stamp{display:inline-block;font-size:15px;color:var(--muted);margin-top:var(--s1)}
.cred,.hero .cred{font-size:15px;color:var(--muted);margin:var(--s2) 0 0;display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center}.cred a{color:var(--muted)}
.credb{display:inline-flex;align-items:center;gap:6px;color:var(--muted);font-weight:500}.credb .ic{width:16px;height:16px}
.disclaimer{font-size:15px;color:var(--muted)}.disclaimer a{color:var(--muted)}
.count{font-size:15px;color:var(--muted);margin:0}
/* sections + surfaces */
.sh{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s3);margin:var(--s7) 0 var(--s4)}
.sh h2{margin:0}.sh a{font-weight:600;font-size:16px;white-space:nowrap;color:var(--brand);text-decoration:none}.sh a:hover{color:var(--brand-d);text-decoration:underline}
section{margin:0}
.panel{background:var(--card);border-radius:var(--r);padding:var(--s5);margin:var(--s5) 0;box-shadow:var(--sh1)}
.panel h2{margin:0 0 var(--s2)}
/* controls: everything is a pill */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--brand);color:#fff;border:0;border-radius:999px;padding:12px 22px;font:inherit;font-weight:600;font-size:17px;text-decoration:none;cursor:pointer;min-height:46px}
.btn:hover{background:var(--brand-d);color:#fff}.btn[disabled]{opacity:.45;cursor:not-allowed}
.btn.ghost{background:var(--card);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line2)}.btn.ghost:hover{box-shadow:inset 0 0 0 1px var(--brand);color:var(--brand)}
.btn .ic{width:18px;height:18px}
.chip{display:inline-flex;align-items:center;gap:6px;border:0;background:var(--card);border-radius:999px;padding:8px 15px;font:inherit;font-size:16px;font-weight:600;cursor:pointer;color:var(--ink);text-decoration:none;min-height:38px;box-shadow:var(--sh1)}
.chip:hover{box-shadow:inset 0 0 0 1px var(--line2),var(--sh1)}.chip[aria-pressed=true],.chip[aria-current]{background:var(--brand);color:#fff}
select,input[type=search],input[type=email],input[type=text],input[type=number],textarea{font:inherit;font-size:17px;border:0;border-radius:999px;padding:10px 16px;background:var(--card);color:var(--ink);min-height:44px;max-width:100%;box-shadow:var(--sh1)}
textarea{border-radius:var(--r3)}
select{padding-right:36px;font-weight:500;-webkit-appearance:none;appearance:none;background:var(--card) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23111' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 15px center}
select:hover,input:hover{box-shadow:inset 0 0 0 1px var(--line2),var(--sh1)}
input:focus-visible,select:focus-visible{outline:2px solid var(--ink);outline-offset:1px}
.row{display:flex;flex-wrap:wrap;gap:var(--s2);align-items:center}
.dot{width:8px;height:8px;border-radius:50%;display:inline-block;flex:none}
.d-coles{background:var(--coles)}.d-woolworths{background:var(--woolworths)}.d-aldi{background:var(--aldi)}
.ctl{display:flex;flex-wrap:wrap;gap:var(--s2);align-items:center;margin:var(--s5) 0 var(--s3)}
.ctl .grow{flex:1 1 260px}.ctl .count{margin-left:auto}
.sbox{display:flex;align-items:center;gap:10px;background:var(--card);border-radius:999px;padding:0 18px;min-width:0;min-height:48px;box-shadow:var(--sh1)}
.sbox:focus-within{box-shadow:inset 0 0 0 2px var(--ink)}.sbox .ic{color:var(--muted);width:19px;height:19px}
.sbox input[type=search]{border:0;padding:10px 0;flex:1;min-width:0;background:transparent;min-height:0;box-shadow:none;border-radius:0}.sbox input:focus,.sbox input:focus-visible{outline:none}
.tog{display:inline-flex;align-items:center;gap:10px;font-size:16.5px;font-weight:600;cursor:pointer;padding:0 16px 0 10px;min-height:44px;color:var(--ink);background:var(--card);border-radius:999px;box-shadow:var(--sh1)}
.tog input{-webkit-appearance:none;appearance:none;width:38px;height:22px;border-radius:999px;background:var(--soft2);position:relative;cursor:pointer;margin:0;transition:background .15s}
.tog input:before{content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#fff;transition:transform .15s;box-shadow:0 1px 3px rgba(0,0,0,.2)}
.tog input:checked{background:var(--brand)}.tog input:checked:before{transform:translateX(16px)}
.seg{display:inline-flex;background:var(--soft2);border-radius:999px;padding:4px;gap:2px}
.seg button,.seg a{border:0;background:none;border-radius:999px;padding:8px 16px;font:600 16px/1.2 var(--body);cursor:pointer;color:var(--muted);text-decoration:none;min-height:36px;display:inline-flex;gap:6px;align-items:center}
.seg button small,.seg a small{font-size:14px;color:var(--muted);font-weight:600}
.seg [aria-pressed=true],.seg [aria-current]{background:var(--card);color:var(--ink);box-shadow:0 1px 3px rgba(17,17,17,.1)}
.stabs,.ptabs{display:flex;gap:6px;overflow-x:auto;margin:var(--s4) 0 0;scrollbar-width:none;padding:2px}
.stabs::-webkit-scrollbar,.ptabs::-webkit-scrollbar{display:none}
.stabs button,.stabs a,.ptabs button{flex:none;border:0;background:var(--card);padding:9px 16px;border-radius:999px;font:600 16px/1.2 var(--body);color:var(--muted);cursor:pointer;text-decoration:none;white-space:nowrap;box-shadow:var(--sh1)}
.stabs [aria-pressed=true],.ptabs [aria-selected=true]{color:#fff;background:var(--brand)}.stabs button:hover,.stabs a:hover,.ptabs button:hover{color:var(--ink)}
.stabs [aria-pressed=true]:hover,.ptabs [aria-selected=true]:hover{color:#fff}
/* rings */
.ring{position:relative;display:inline-grid;place-items:center;flex:none;width:var(--rs,44px);height:var(--rs,44px);color:var(--ink)}
.ring>svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.ring>svg circle{cx:18px;cy:18px;r:15.5px;fill:none;stroke-width:3.4}.ring .tr{stroke:var(--soft2)}.ring .fl{stroke:currentColor;stroke-linecap:round}
.ring .ri{position:absolute;inset:0;font-size:14.5px;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--ink);display:grid;place-items:center}
.ring .ri .emo{width:40%;height:40%;min-width:16px;min-height:16px}
.ring.big circle{stroke-width:3}.ring.big .ri .emo{width:36px;height:36px}
.rv{color:var(--brand)}.rp{color:var(--brand)}.re{color:var(--ink2)}
/* product photo */
.ph{position:relative;display:grid;place-items:center;background:var(--soft);overflow:hidden;border-radius:var(--r2)}
.ph .pfb{width:34%;height:auto;max-width:64px}.ph:has(.pim) .pfb{display:none}
.pim{position:absolute;inset:9%;width:82%;height:82%;object-fit:contain}
.ph:has(.pim){background:#fff}
.th{position:relative;flex:none;width:44px;height:44px;border-radius:12px;display:inline-grid;place-items:center;background:var(--soft);overflow:hidden;vertical-align:middle}
.th .pfb{width:26px;max-width:none}.th.ph{background:#fff}.th.ph.noimg{background:var(--soft)}.th .pim{inset:3px;width:calc(100% - 6px);height:calc(100% - 6px)}
.noimg{background:var(--soft)!important}
/* product card */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:var(--s4)}
.card{position:relative;display:flex;flex-direction:column;gap:5px;min-width:0;background:var(--card);border-radius:var(--r);padding:10px 10px 16px;box-shadow:var(--sh1);transition:box-shadow .2s,transform .2s}
.card:hover{box-shadow:var(--sh2);transform:translateY(-1px)}
.card[hidden]{display:none}
.card .ph{aspect-ratio:1/1;margin-bottom:8px;border-radius:var(--r2)}
.card>:not(.ph):not(.spb):not(.hrt){margin-left:6px;margin-right:6px}
.nm{font:600 17px/1.35 var(--body);letter-spacing:-.01em;margin:0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.nm a{color:var(--ink);text-decoration:none}.nm a:hover{text-decoration:underline}
.nm a:after{content:"";position:absolute;inset:0;z-index:1}
/* variant line: the flavour/variant at the end of a long name, always visible even when the title clamps */
.vr{margin:0;font-size:15px;font-weight:700;line-height:1.3;color:var(--brand);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.st{display:flex;align-items:center;gap:6px;font-size:15px;color:var(--muted);margin:0;min-width:0}
.st span.sz{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.prw{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:6px}
.pr{margin:0;font-size:16px;color:var(--muted);display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.pr b{font-size:22px;color:var(--ink);letter-spacing:-.03em;font-weight:700}
.pr s{font-size:15.5px}
.m,.m2{margin:0;font-size:15.5px;color:var(--ink2);line-height:1.4}.m2{font-size:14.5px;color:var(--muted)}
.m>span,.m2>span{display:none}.m b{font-weight:700;color:var(--ink)}
html:not([data-unit]) :is(.m,.m2)>[data-u=p30],html[data-unit=serve] :is(.m,.m2)>[data-u=serve],html[data-unit=p30] :is(.m,.m2)>[data-u=p30],
html[data-unit=d1] :is(.m,.m2)>[data-u=d1],html[data-unit=g100] :is(.m,.m2)>[data-u=g100]{display:inline}
.spb{position:absolute;top:18px;left:18px;z-index:2;background:var(--t100);color:var(--brand-dk);font-size:14px;font-weight:700;border-radius:999px;padding:4px 10px;line-height:1.3;box-shadow:0 1px 4px rgba(17,17,17,.12)}
.spb.in{position:static;display:inline-block;background:var(--t100);color:var(--brand-dk);box-shadow:none;padding:3px 10px}
.hrt{position:absolute;top:14px;right:14px;z-index:2;width:36px;height:36px;border-radius:50%;border:0;background:rgba(255,255,255,.96);color:var(--ink);display:grid;place-items:center;cursor:pointer;padding:0;box-shadow:0 1px 4px rgba(17,17,17,.12)}
.hrt .ic{width:18px;height:18px}.hrt:hover{color:var(--brand)}
.hrt[aria-pressed=true]{color:var(--brand)}.hrt[aria-pressed=true] .ic{fill:currentColor}
.nxl{display:flex;align-items:center;gap:5px;font-size:15px;color:var(--ink2);margin:2px 0 0}.nxl .ic{width:15px;height:15px;color:var(--muted)}.nxl b{color:var(--ink)}
.row6{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(190px,1fr);gap:var(--s4);overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 4px 14px;margin:-4px -4px 0;scrollbar-width:none}
.row6::-webkit-scrollbar{display:none}
.row6>.card{scroll-snap-align:start}
@media (min-width:1000px){.row6{grid-auto-columns:calc((100% - 5 * var(--s4)) / 6)}}
/* ranked list rows: one white rounded sheet */
.list{margin:var(--s3) 0 var(--s5);background:var(--card);border-radius:var(--r);box-shadow:var(--sh1);padding:4px 20px}
.item{position:relative;display:grid;grid-template-columns:24px 64px minmax(0,1fr) minmax(170px,240px) 44px 40px;gap:var(--s4);align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}
.item:last-child{border-bottom:0}
.item[hidden]{display:none}
.item .rank{font-size:15px;color:var(--muted);text-align:right;font-variant-numeric:tabular-nums;font-weight:600}
.item .ph{width:64px;height:64px;border-radius:var(--r3)}.item .ph .pfb{width:28px;max-width:none}
.item .ib{min-width:0;display:flex;flex-direction:column;gap:3px}.item .iv{display:flex;flex-direction:column;gap:2px}
.item .pr{margin:0}.item .pr b{font-size:19px}.item .hrt{position:relative;top:auto;right:auto;box-shadow:none;background:var(--soft)}
.ex{font-size:15px;color:var(--muted);margin:2px 0 0}.ex b{color:var(--ink2);font-weight:600}
#list .item{content-visibility:auto;contain-intrinsic-size:auto 100px}
@media (max-width:700px){.list{padding:2px 14px}.item{grid-template-columns:56px minmax(0,1fr) 40px;gap:4px var(--s3);align-items:start}.item .rank{display:none}
 .item .ph{width:56px;height:56px;grid-row:1/span 2}.item .ib{grid-column:2}.item .iv{grid-column:2;grid-row:2}.item .ring{grid-column:3;grid-row:2;--rs:38px!important;align-self:center}.item .hrt{grid-column:3;grid-row:1;width:36px;height:36px}}
/* aisle tiles + tools */
.aisles{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:var(--s3)}
.aisle{display:flex;gap:var(--s3);align-items:center;background:var(--card);border-radius:var(--r2);padding:14px 16px;text-decoration:none;color:var(--ink);box-shadow:var(--sh1);transition:box-shadow .2s}
.aisle:hover{box-shadow:var(--sh2);color:var(--ink)}
.aisle .ci{flex:none;width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:var(--soft)}.aisle .ci .emo{width:32px;height:32px}
.aisle b{display:block;font-size:17px;font-weight:600;line-height:1.3;letter-spacing:-.01em}.aisle small{display:block;color:var(--muted);font-size:15px;line-height:1.35;margin-top:2px}
.tools3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s4)}
.tool{position:relative;background:var(--card);border-radius:var(--r);padding:var(--s5);box-shadow:var(--sh1);transition:box-shadow .2s}
.tool h3{margin:0 0 8px;display:flex;align-items:center;gap:12px}
.tool h3 .tic{flex:none;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--soft)}.tool h3 .emo{width:30px;height:30px}
.tool h3 a{text-decoration:none;color:var(--ink)}.tool h3 a:after{content:"";position:absolute;inset:0}
.tool p{margin:0;color:var(--muted);font-size:16px}.tool p a{position:relative;z-index:1;color:var(--ink2)}
.tool:hover{box-shadow:var(--sh2)}
.glist{list-style:none;padding:4px 20px;margin:0;display:grid;grid-template-columns:repeat(2,1fr);gap:0 var(--s6);background:var(--card);border-radius:var(--r);box-shadow:var(--sh1)}
.glist li{border-bottom:1px solid var(--line)}.glist li:nth-last-child(-n+2){border-bottom:0}
.glist a{display:flex;justify-content:space-between;gap:var(--s3);padding:15px 0;text-decoration:none;color:var(--ink);font-weight:500}
.glist a:after{content:"›";color:var(--muted);font-size:20px;line-height:1}.glist a:hover{color:var(--ink);text-decoration:underline}
/* home hero */
.hx{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:var(--s7);align-items:center;padding:var(--s7) 0 var(--s4)}
.hi{font-size:17px;font-weight:600;color:var(--muted);margin:0 0 var(--s2)}
.hx h1{font-size:clamp(34px,5.2vw,58px);line-height:1.02;letter-spacing:-.045em;margin:0 0 var(--s4);font-weight:800}
.hx .lede{margin:0 0 var(--s5)}
.hsearch{display:flex;background:var(--card);border-radius:999px;padding:6px 6px 6px 20px;gap:8px;max-width:580px;box-shadow:var(--sh2);align-items:center}
.hsearch:focus-within{box-shadow:inset 0 0 0 2px var(--ink),var(--sh2)}
.hsearch .ic{color:var(--muted);width:20px;height:20px}
.hsearch input{flex:1;min-width:0;border:0;font-size:17.5px;padding:12px 2px;background:transparent;min-height:0;box-shadow:none;border-radius:0}.hsearch input:focus,.hsearch input:focus-visible{outline:none}
.hsearch button{border:0;background:var(--brand);color:#fff;font:inherit;font-weight:600;border-radius:999px;padding:12px 24px;cursor:pointer}.hsearch button:hover{background:var(--brand-d)}
.qs{display:flex;flex-wrap:wrap;gap:8px;margin:var(--s4) 0 0;align-items:center}.qs span{font-size:15.5px;color:var(--muted);margin-right:2px}
.qs a{font-size:15.5px;font-weight:600;color:var(--ink);border-radius:999px;padding:7px 14px;text-decoration:none;background:var(--card);box-shadow:var(--sh1)}.qs a:hover{background:var(--brand);color:#fff}
.stat{background:var(--card);border-radius:28px;padding:var(--s5) var(--s5) var(--s4);box-shadow:var(--sh2)}
.stt{display:flex;align-items:center;justify-content:space-between;gap:var(--s4)}
.stat small{display:block;font-size:15.5px;color:var(--muted);font-weight:600}
.stat .big{font-weight:800;font-size:clamp(48px,6vw,64px);line-height:1;letter-spacing:-.05em;color:var(--ink);margin:var(--s2) 0 4px}
.stat .per{font-size:17px;color:var(--muted)}
.stat .what{display:flex;flex-direction:column;gap:2px;font-size:16px;color:var(--muted);margin:var(--s4) 0 0;padding:12px 16px;background:var(--soft);border-radius:var(--r3)}
.stat .what a{color:var(--ink);font-weight:600;text-decoration:none}.stat .what a:hover{text-decoration:underline}
.trust{font-size:15px;color:var(--muted);margin:var(--s4) 0 0;display:flex;flex-wrap:wrap;gap:4px 14px}.trust a{color:var(--muted)}
.nxline{display:flex;align-items:center;gap:10px;font-size:16.5px;color:var(--ink2);margin:var(--s6) 0 0;padding:var(--s3) var(--s3) var(--s3) var(--s4);background:var(--card);border-radius:999px;box-shadow:var(--sh1)}
.nxline .nxi{width:36px;height:36px}.nxline .nxi .emo{width:22px;height:22px}.nxline>span:not(.nxi){flex:1 1 220px;text-align:left}.nxline a{margin-left:auto;font-weight:600;white-space:nowrap;text-decoration:none;background:var(--soft);border-radius:999px;padding:7px 14px}
@media (max-width:860px){.hx{grid-template-columns:minmax(0,1fr);gap:var(--s5);padding:var(--s5) 0 var(--s3)}.tools3{grid-template-columns:1fr}.glist{grid-template-columns:1fr}.glist li:nth-last-child(2){border-bottom:1px solid var(--line)}}
/* catalogue / next week */
.nxe{display:flex;gap:var(--s3);align-items:flex-start;background:var(--card);border-radius:var(--r);padding:var(--s5);box-shadow:var(--sh1)}
.nxe b{font-size:17px}.nxe p{margin:4px 0 0;color:var(--ink2);font-size:16.5px}
.nxi{flex:none;color:var(--ink);width:40px;height:40px;border-radius:50%;background:var(--soft);display:grid;place-items:center}.nxi .emo{width:24px;height:24px}
.cdn{font-size:15.5px;color:var(--muted)}.cdn b{color:var(--ink);font-weight:600}
.nxs{padding-left:18px;font-size:16px;color:var(--ink2)}.nxs li{margin:0 0 6px}
.deals{margin:var(--s5) 0 var(--s2)}.deals .dh{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s3);margin-bottom:var(--s4)}
.deals .dh h2{font-size:21px}
.shelfsec{margin-top:var(--s6)}.shelfsec>h2{font-size:21px;margin:0 0 var(--s4);display:flex;align-items:baseline;gap:10px}.shelfsec>h2 small{font:500 15.5px var(--body);color:var(--muted)}
/* product detail */
.pd{display:grid;grid-template-columns:minmax(0,400px) minmax(0,1fr);gap:var(--s7);margin-top:var(--s4);align-items:center}
.pd>.ph{aspect-ratio:1/1;border-radius:32px;box-shadow:var(--sh1)}
.pd>.ph .pfb{max-width:96px}
.pd h1{font-size:clamp(26px,3.4vw,38px);margin:var(--s2) 0 var(--s3);letter-spacing:-.035em}
.pd .pbig b{font-size:clamp(40px,5vw,52px);font-weight:800;letter-spacing:-.05em;line-height:1}.pd .pr{font-size:18px;margin:0 0 var(--s3);align-items:center}
.pd .m{font-size:17px}.pd .m2{font-size:16px}
.acts2{display:flex;flex-wrap:wrap;gap:var(--s2);margin:var(--s5) 0 0}
.acts2 .cmp,.acts2 .fav,.acts2 .sw{display:inline-flex;align-items:center;gap:8px;border:0;background:var(--card);border-radius:999px;padding:11px 18px;font:inherit;font-weight:600;font-size:17px;cursor:pointer;color:var(--ink);text-decoration:none;min-height:46px;box-shadow:var(--sh1)}
.acts2 .cmp:hover,.acts2 .fav:hover,.acts2 .sw:hover{box-shadow:inset 0 0 0 1px var(--line2),var(--sh1)}.acts2 [aria-pressed=true]{background:var(--brand);color:#fff}
.acts2 .fav[aria-pressed=true] .ic{fill:#fff}
.stats{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,2fr);gap:var(--s4);margin:var(--s6) 0 0}
.scard{display:flex;align-items:center;justify-content:space-between;gap:var(--s4);background:var(--card);border-radius:28px;padding:var(--s5);box-shadow:var(--sh1)}
.scard .lbl{font-size:16px;font-weight:600;color:var(--muted)}
.scard .num{display:block;font-size:56px;font-weight:800;letter-spacing:-.05em;line-height:1.05;margin:4px 0 6px}.scard .num small{font-size:20px;color:var(--muted);font-weight:600;letter-spacing:-.02em;margin-left:2px}
.scard p{font-size:15.5px;color:var(--muted);margin:0;max-width:260px}.scard p a{color:var(--muted)}
.mcards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s4)}
.mc{display:flex;flex-direction:column;justify-content:space-between;gap:var(--s4);background:var(--card);border-radius:var(--r);padding:var(--s4) var(--s4) var(--s5);box-shadow:var(--sh1)}
.mc>div{display:flex;flex-direction:column}
.mc b{font-size:26px;font-weight:700;letter-spacing:-.04em;line-height:1.1}.mc b small{font-size:17px;color:var(--muted);font-weight:600;letter-spacing:0}
.mc span:not(.ring):not(.ri):not(.mci){font-size:15px;color:var(--muted);margin-top:2px}
.mc .ring,.mc .mci{align-self:center}
.mci{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:var(--soft)}.mci .emo{width:30px;height:30px}
.pdx{margin-top:var(--s6)}
.tp{background:var(--card);border-radius:var(--r);padding:var(--s2) var(--s5) var(--s4);margin:var(--s3) 0 var(--s3);box-shadow:var(--sh1)}
.tp>p:first-child{margin-top:var(--s4)}
.facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 var(--s6);margin:0 0 var(--s2)}
.facts div{display:flex;justify-content:space-between;gap:var(--s3);padding:13px 0;border-bottom:1px solid var(--line);font-size:16.5px}
.facts dt{color:var(--muted)}.facts dd{margin:0;font-weight:600;text-align:right}
.pd h2,.pdx h2{font-size:19px;margin:var(--s6) 0 var(--s2)}
.note{font-size:16px;color:var(--ink2);margin:var(--s3) 0 0}
@media (max-width:900px){.stats{grid-template-columns:1fr}}
@media (max-width:760px){.pd{grid-template-columns:1fr;gap:var(--s4)}.pd>.ph{width:100%;max-width:none;aspect-ratio:auto;height:280px;border-radius:28px}.facts{grid-template-columns:1fr}
 .mcards{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s2)}.mc{padding:var(--s3) var(--s3) var(--s4);gap:var(--s3);border-radius:var(--r2)}.mc b{font-size:20px}.mc .ring,.mc .mci{--rs:52px!important;width:52px;height:52px}
 .scard{padding:var(--s4) var(--s5)}.scard .num{font-size:46px}.scard .ring{--rs:96px!important}.tp{padding:var(--s1) var(--s4) var(--s3)}}
/* generic content */
article{max-width:740px}article h1{margin:var(--s5) 0 var(--s3)}article h2{margin:var(--s6) 0 var(--s2)}article li{margin:5px 0}
table.data{border-collapse:collapse;width:100%;font-size:16px;background:var(--card)}
table.data td,table.data th{border-bottom:1px solid var(--line);padding:12px;text-align:left;vertical-align:top}table.data tr:last-child td{border-bottom:0}
table.data th{font-size:14.5px;color:var(--muted);font-weight:600}
.table-wrap{overflow-x:auto;border-radius:var(--r);background:var(--card);box-shadow:var(--sh1);padding:4px 8px}
.guides{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:var(--s3);margin:var(--s3) 0}
.guides a{display:block;padding:16px 40px 16px 18px;border-radius:var(--r2);background:var(--card);box-shadow:var(--sh1);color:var(--ink);text-decoration:none;font-weight:600;font-size:17px;line-height:1.35;position:relative}
.guides a:after{content:"›";position:absolute;right:18px;top:50%;transform:translateY(-50%);color:var(--muted);font-size:22px}
.guides a:hover{box-shadow:var(--sh2)}.guides a small{display:block;color:var(--muted);font-weight:400;font-size:15px;margin-top:2px}
.tips{background:var(--card);border-radius:var(--r);padding:var(--s4) var(--s5) var(--s4) var(--s6);margin:var(--s4) 0;box-shadow:var(--sh1)}.tips li{margin:5px 0}
.faq,.accs{background:var(--card);border-radius:var(--r);box-shadow:var(--sh1);padding:2px 22px}
.faq details,details.acc{border-bottom:1px solid var(--line);margin:0}.faq details:last-child{border-bottom:0}
details.acc{background:var(--card);border-radius:var(--r2);border:0;box-shadow:var(--sh1);padding:0 20px;margin:var(--s3) 0}
.faq summary,details.acc>summary{font-weight:600;cursor:pointer;padding:16px 36px 16px 0;list-style:none;position:relative}
.faq summary::-webkit-details-marker,details.acc>summary::-webkit-details-marker{display:none}
.faq summary:after,details.acc>summary:after{content:"+";position:absolute;right:0;top:50%;transform:translateY(-50%);width:28px;height:28px;border-radius:50%;background:var(--soft);display:grid;place-items:center;font-size:18px;font-weight:500;color:var(--ink);line-height:1}
.faq details[open] summary:after,details.acc[open]>summary:after{content:"–"}
.faq p{margin:0 0 16px;color:var(--ink2)}details.acc>:last-child{margin-bottom:18px}
details.acc>summary{font-size:17.5px}
.featured{box-shadow:inset 0 0 0 1px var(--line2),var(--sh1)}.flabel{font-size:13px;font-weight:700;color:var(--muted);background:var(--soft);border-radius:999px;padding:2px 8px}
.combo{background:var(--card);border-radius:var(--r);padding:var(--s4) var(--s5);margin:var(--s3) 0;box-shadow:var(--sh1)}
.combo h2{font-size:19px;margin:0 0 6px}.combo .sum{font-weight:700;color:var(--ink)}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:var(--s3);margin:var(--s4) 0}
.kpis div{background:var(--card);border-radius:var(--r2);padding:16px 18px;box-shadow:var(--sh1)}.kpis b{display:block;font-size:28px;font-weight:700;letter-spacing:-.04em;line-height:1.1}.kpis small{color:var(--muted);font-size:14.5px}
.panel .kpis div{background:var(--soft);box-shadow:none}
.warn{color:#6A3A00;background:#FFF4E0;border-radius:var(--r3);padding:12px 14px}.ok{color:var(--good)}
.refs{font-size:15px;color:var(--muted)}.refs a{word-break:break-all;color:var(--muted)}
.cta{display:flex;flex-wrap:wrap;gap:var(--s2);margin:var(--s3) 0 0}
.sugg{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}.best{background:var(--t50);font-weight:700}table.cmpt th{vertical-align:top;min-width:140px;font-size:15.5px;color:var(--ink)}
.cmpt th a{color:var(--ink)}
.evidence{max-width:780px}
.tools{font-size:16px;color:var(--muted);margin:10px 0 0}
.chart{width:100%;height:auto;display:block}.chart-wrap{overflow-x:auto;background:var(--card);border-radius:var(--r);padding:12px;box-shadow:var(--sh1)}@media (max-width:640px){.chart{min-width:620px}}
.cmpbar{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(20px + env(safe-area-inset-bottom));z-index:40;background:var(--ink);color:#fff;border-radius:999px;padding:6px 6px 6px 20px;display:flex;gap:10px;align-items:center;box-shadow:0 12px 32px -8px rgba(17,17,17,.45);font-size:16px;font-weight:600}
.cmpbar[hidden]{display:none}.cmpbar a{background:#fff;color:var(--ink);border-radius:999px;padding:8px 16px;text-decoration:none;font-weight:700}
.cmpbar button{background:none;border:0;color:#BDBDC4;cursor:pointer;font:inherit;padding:6px 10px}
@media (max-width:820px){.cmpbar{bottom:calc(14px + env(safe-area-inset-bottom));max-width:calc(100% - 24px)}}
.prow{display:flex;gap:12px;align-items:center}.prow>div{min-width:0}
.ings{list-style:none;padding:0}.ings li{display:flex;gap:12px;align-items:center;margin:0 0 10px}
.cmpt th .th{width:64px;height:64px;margin-bottom:6px}
ul.swl{list-style:none;padding:0}ul.swl li{margin:0 0 12px}
.oos{color:#8A4A00;font-size:14.5px}.qb{font-size:14.5px;color:var(--muted)}
.spark{vertical-align:middle}.spark *{stroke:var(--ink)}
.qty{width:68px;font:inherit;border:0;border-radius:999px;padding:6px 10px;min-height:36px;background:var(--soft);box-shadow:none}
.calc label{max-width:100%}fieldset{min-width:0}
/* recipes */
.rgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:var(--s4);margin:var(--s3) 0 var(--s2)}
.rcard{display:flex;flex-direction:column;background:var(--card);border-radius:var(--r);text-decoration:none;color:var(--ink);padding:var(--s5);box-shadow:var(--sh1);transition:box-shadow .2s}
.rcard:hover{box-shadow:var(--sh2);color:var(--ink)}
.rcard .rv{display:flex;align-items:center;justify-content:space-between;color:var(--brand);margin-bottom:var(--s4)}
.rcard .rv .ci{flex:none;width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:var(--soft)}.rcard .rv .emo{width:32px;height:32px}
.rcard .rv .pg{font-weight:800;font-size:30px;letter-spacing:-.05em;line-height:1;text-align:right;color:var(--ink)}.rcard .rv .pg small{font-size:14.5px;font-weight:500;color:var(--muted);margin-left:4px;letter-spacing:0}
.rcard .rb{display:flex;flex-direction:column;gap:var(--s3);flex:1}
.rcard h3{font-size:18px;margin:0;line-height:1.3}
.rcard .rm{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto;font-size:15px;color:var(--muted)}.rcard .rm span{white-space:nowrap;background:var(--soft);border-radius:999px;padding:3px 10px}
.rcard .rm .cost{color:var(--ink);font-weight:700}.rcard .rm .vg{color:var(--good)}
.jump{display:flex;flex-wrap:wrap;gap:8px;margin:var(--s4) 0 var(--s2)}
/* footer */
footer{margin-top:var(--s7);padding:var(--s7) 0 var(--s6);font-size:16px;color:#C6CBC8;background:var(--ink)}
footer a{color:#fff;text-decoration:none}footer a:hover{color:#fff;text-decoration:underline}
footer .wm{color:#fff}footer .fsmall{color:#A3AAA6;border-top:1px solid #2A2E2C;padding-top:var(--s4)}
.fgrid{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--s4) var(--s6)}
.fbrand{max-width:380px}.fbrand .wm{font-size:18px}.fbrand p{margin:6px 0 0;font-size:15.5px}
.flinks{display:flex;flex-wrap:wrap;gap:8px 20px;align-content:flex-start;max-width:600px}
.fsmall{margin-top:var(--s5);font-size:14.5px;color:var(--muted)}.fsmall p{margin:4px 0}
/* small screens */
@media (max-width:560px){.wrap{padding:0 16px}.sh{margin:var(--s6) 0 var(--s3)}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s3)}
 .row6{grid-auto-columns:46%;gap:var(--s3)}.card{padding:8px 8px 14px;border-radius:var(--r2)}.card .ph{border-radius:var(--r3)}.card>:not(.ph):not(.spb):not(.hrt){margin-left:4px;margin-right:4px}
 .nm{font-size:16px}.pr b{font-size:19px}.m{font-size:15px}.m2{font-size:14px}.hrt{width:32px;height:32px;top:12px;right:12px}.hrt .ic{width:16px;height:16px}.spb{top:14px;left:14px;font-size:13.5px;padding:3px 8px}
 .card .ring{--rs:34px!important}.card .ring .ri{font-size:13px}
 .ctl{gap:8px}.ctl select{flex:1 1 calc(50% - 8px);min-width:0}.ctl .grow{flex-basis:100%}.ctl .count{margin-left:4px;width:100%}
 .hero p,.lede{font-size:17px}.aisles{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s2)}.aisle{padding:10px 12px;gap:10px;border-radius:var(--r3)}.aisle .ci{width:42px;height:42px}.aisle .ci .emo{width:27px;height:27px}.aisle b{font-size:16px;line-height:1.25}.aisle small{font-size:14px}.aisle .sps{display:none}
 .tool{padding:var(--s4) var(--s5)}.nxline{border-radius:var(--r2);flex-wrap:wrap}.nxline a{margin-left:0}table.data{font-size:15px}.panel{padding:var(--s4)}
 .stat{border-radius:var(--r)}.stat .ring{--rs:80px!important}.hsearch{padding-left:16px}.hsearch button{padding:12px 18px}.glist,.faq{padding:2px 16px}}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
@media print{header.site,.mnav,footer,.cmpbar,.np,.cta,.ctl,.calc,.hrt,.acts2{display:none!important}body{background:#fff;padding:0}.panel,.card,.list{box-shadow:none;padding:0}a{color:#000;text-decoration:none}}
section>h2:first-child{margin:var(--s7) 0 var(--s3)}
.faq>h2{margin:var(--s4) 0 var(--s2)}
section.panel>h2:first-child,.panel>h2:first-child{margin-top:var(--s1)}

/* ---------------------------------------------------------------- brand layer */
/* home hero: deep emerald panel with white type; the stat card sits on it as a white card */
.hx{position:relative;background:var(--brand-dk);box-shadow:0 0 0 100vmax var(--brand-dk);clip-path:inset(0 -100vmax);padding:var(--s7) 0;margin-bottom:0}
.hx h1,.hx .lede,.hx .qs span,.hx .trust,.hx .trust a{color:#fff}.hx .lede,.hx .trust,.hx .qs span{color:rgba(255,255,255,.78)}
.hx .qs a{background:rgba(255,255,255,.08);color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.22)}.hx .qs a:hover{background:#fff;color:var(--brand-dk)}
.hx .hsearch{box-shadow:0 10px 30px rgba(0,30,20,.3)}.hx .stat{box-shadow:0 18px 40px rgba(0,30,20,.32)}
.hx a:focus-visible,.hx button:focus-visible,.hx input:focus-visible{outline-color:#fff}
.gpill{display:inline-block!important;background:var(--t50);color:var(--brand)!important;border-radius:999px;padding:3px 10px;font-size:14.5px!important;font-weight:700!important}
.blk{border-top:1px solid var(--line);margin-top:var(--s7)}.blk>.sh{margin-top:var(--s6)}
.hx+.blk{border-top:0;margin-top:0}
/* aisle header icon chip */
.bic{display:grid;place-items:center;width:68px;height:68px;border-radius:50%;background:var(--card);box-shadow:var(--sh1);margin:var(--s3) 0 var(--s4)}.bic .emo{width:42px;height:42px}
.rv .ri{color:var(--ink)}
.save{color:var(--brand);font-weight:600;font-size:16.5px;margin:-4px 0 var(--s3)}
@media (max-width:560px){.hx{padding:var(--s5) 0 var(--s6)}.bic{width:56px;height:56px;margin:var(--s2) 0 var(--s3)}.bic .emo{width:34px;height:34px}}
.stat .ring.big{color:var(--brand)}
main p a:not(.btn){color:var(--brand);text-decoration-color:var(--t200)}main p a:not(.btn):hover{color:var(--brand-d);text-decoration-color:currentColor}
/* store logos in the hero headline: official artwork on white pills so the brand colours read on dark green */
.slogos{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0 6px}
.slg{display:inline-flex;align-items:center;justify-content:center;width:clamp(104px,10vw,128px);height:clamp(54px,5.2vw,66px);background:#fff;border-radius:16px;box-shadow:0 6px 18px rgba(0,30,20,.25);overflow:hidden}
.slg img{display:block;width:auto;max-width:86%;height:86%}.s-coles img{height:auto;width:76%}.s-woolworths img{height:94%}.s-aldi img{height:88%}
/* ---------------------------------------------------------------- motion
   Everything below runs only under html.m (set when the user has no reduced-motion preference) or inside a
   no-preference media query. Transform and opacity only, plus the SVG ring stroke. Finished state = static design. */
@keyframes pa-rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes pa-pill{from{opacity:0;transform:translateY(10px) scale(.94)}to{opacity:1;transform:none}}

@keyframes pa-pop{0%{transform:scale(1)}40%{transform:scale(1.22)}100%{transform:scale(1)}}
@keyframes pa-fade{from{opacity:0}to{opacity:1}}
.m .hx h1,.m .hx .lede,.m .hx .hsearch,.m .hx .qs,.m .hx .trust,.m .hx .stat{animation:pa-rise .56s cubic-bezier(.2,.7,.2,1) both}
.m .hx .lede{animation-delay:.16s}.m .hx .hsearch{animation-delay:.24s}.m .hx .qs{animation-delay:.32s}.m .hx .trust{animation-delay:.38s}.m .hx .stat{animation-delay:.2s}
.m .slg{animation:pa-pill .5s cubic-bezier(.2,.8,.2,1.15) both}.m .s-coles{animation-delay:.12s}.m .s-woolworths{animation-delay:.19s}.m .s-aldi{animation-delay:.26s}
.m main>.hero,.m main>.crumbs+.hero{animation:pa-rise .5s cubic-bezier(.2,.7,.2,1) both}
/* hero glow: one full-bleed layer (viewport wide, soft edges) so the emerald has no seam at the content column; fades in once, no drift */
body{overflow-x:clip}
.hx>*{position:relative;z-index:1}
.hx:before{content:"";position:absolute;top:0;bottom:0;left:calc(50% - 50vw);width:100vw;z-index:0;pointer-events:none;
 background:radial-gradient(60% 90% at 75% 20%,rgba(46,160,118,.16),rgba(46,160,118,0) 70%)}
.m .hx:before{animation:pa-fade 1.2s ease-out both}
/* scroll reveals (classes added by motion.js only to elements that start below the fold) */
.m .rvl{opacity:0;transform:translateY(16px);transition:opacity .5s ease-out,transform .55s cubic-bezier(.2,.7,.2,1)}
.m .rvl.in{opacity:1;transform:none}
/* rings draw in: --o is the filled percentage; the stroke starts empty and runs to its value */
.m .ring.o:not(.drawn) .fl{stroke-dashoffset:var(--o)}
.m .ring.o:not(.drawn) .ri{opacity:0}
.m .ring.drawn .fl{transition:stroke-dashoffset .95s cubic-bezier(.3,.7,.2,1)}
.m .ring.drawn .ri{animation:pa-fade .3s ease-out both}
/* micro-interactions */
@media (prefers-reduced-motion:no-preference){
 @media (hover:hover){
  .card:hover{transform:translateY(-3px)}
  .aisle,.tool,.rcard{transition:box-shadow .2s,transform .2s}.aisle:hover,.tool:hover,.rcard:hover{transform:translateY(-2px)}
  .aisle .emo,.tool .emo{transition:transform .35s cubic-bezier(.34,1.56,.64,1)}
  .aisle:hover .emo,.tool:hover .emo{transform:rotate(-8deg) scale(1.12)}
  .bic .emo{transition:transform .35s cubic-bezier(.34,1.56,.64,1)}.bic:hover .emo{transform:rotate(-8deg) scale(1.08)}
 }
 .btn,.chip,.qs a,.hsearch button,.acts2>*,.stabs button,.ptabs button,.seg button,.hlist,.hic,.hrt,.cmpbar a{transition:transform .12s ease-out,background-color .15s,color .15s,box-shadow .15s}
 .btn:active,.chip:active,.qs a:active,.hsearch button:active,.acts2>*:active,.stabs button:active,.ptabs button:active,.seg button:active,.hlist:active,.hic:active,.hrt:active,.cmpbar a:active{transform:scale(.96)}
 .fav.pop .ic{animation:pa-pop .38s cubic-bezier(.34,1.56,.64,1)}.hrt.pop{animation:pa-pop .38s cubic-bezier(.34,1.56,.64,1)}
 .cnt.bump{animation:pa-pop .4s cubic-bezier(.34,1.56,.64,1)}
}
/* emoji chips on guide/tool link cards */
.guides a{display:flex;flex-direction:column;justify-content:center;padding-left:72px;min-height:72px}
.guides a .gi{position:absolute;left:14px;top:50%;margin-top:-22px;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--soft)}.guides a .gi .emo{width:26px;height:26px}
.recipe-hd .bic{margin-top:var(--s2)}

/* ---- planner (/planner/) ---- */
.pl{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s4);margin-top:var(--s4)}
@media (min-width:1000px){.pl{grid-template-columns:minmax(0,430px) minmax(0,1fr);gap:var(--s5);align-items:start}}
.plf .panel,.plo .panel{margin:0 0 var(--s3)}.plc{padding:var(--s4) var(--s4) var(--s5)}
.plc h2{font-size:18px;display:flex;align-items:center;gap:10px;margin:0 0 var(--s3)}
.stp{width:26px;height:26px;border-radius:50%;background:var(--t100);color:var(--brand-dk);font-size:15px;font-weight:700;display:inline-grid;place-items:center;flex:none}
.dts{gap:6px;margin-bottom:var(--s3)}.dts .chip{background:var(--soft);box-shadow:none;min-height:36px;padding:6px 13px;font-size:15.5px}.dts .chip[aria-pressed=true]{background:var(--brand);color:#fff}
.ptc{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.ptb{position:relative;display:flex;align-items:center;gap:10px;text-align:left;border:0;background:var(--soft);border-radius:14px;padding:8px 28px 8px 10px;min-height:48px;font:600 15.5px/1.25 var(--body);color:var(--ink);cursor:pointer}
.ptb .emo{width:24px;height:24px;flex:none}.ptb:hover{box-shadow:inset 0 0 0 1px var(--line2)}
.ptb[aria-pressed=true]{background:var(--t50);box-shadow:inset 0 0 0 2px var(--brand);color:var(--brand-dk)}
.ptb[aria-pressed=true]:after{content:"✓";position:absolute;right:10px;top:50%;transform:translateY(-50%);font-weight:700;color:var(--brand)}
.ptb:disabled{opacity:.4;cursor:not-allowed;box-shadow:none}
.ptc.no{display:flex;flex-wrap:wrap;gap:6px}.ptc.no .ptb{min-height:36px;padding:6px 12px;font-size:15px;border-radius:999px}
.ptc.no .ptb[aria-pressed=true]{background:var(--ink);color:#fff;box-shadow:none;text-decoration:line-through}.ptc.no .ptb[aria-pressed=true]:after{content:none}
.hint{font-size:15px;color:var(--muted);margin:8px 0 0}.hint .lnk{font-size:15px;padding:0 2px;min-height:0}
.pdd{margin-top:var(--s3);border-top:1px solid var(--line);padding-top:4px}
.pdd>summary{cursor:pointer;font-weight:600;font-size:16.5px;padding:10px 0;list-style:none;color:var(--brand)}.pdd>summary::-webkit-details-marker{display:none}
.pdd>summary:before{content:"+";display:inline-block;width:1.1em}.pdd[open]>summary:before{content:"–"}
.pgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s3)}
.pl label,.lblk .lbl{font-size:15.5px;font-weight:600;color:var(--ink2);display:flex;flex-direction:column;gap:6px}
.pl input[type=number],.pl select{background-color:var(--soft);box-shadow:none;width:100%}
.lblk{display:flex;flex-direction:column;gap:6px;margin-top:var(--s3)}.pgrid .lblk{margin:0}
.qst{display:inline-flex;align-items:center;background:var(--soft);border-radius:999px;padding:3px;align-self:flex-start}
.qst button{width:32px;height:32px;border-radius:50%;border:0;background:var(--card);font:600 18px/1 var(--body);color:var(--ink);cursor:pointer;box-shadow:var(--sh1)}
.qst button:disabled{opacity:.4;cursor:not-allowed}.qst span,.qst output{text-align:center;padding:0 10px;font-size:14.5px;font-weight:600;color:var(--ink2)}
.qst.big{padding:4px}.qst.big button{width:36px;height:36px}.qst.big output{min-width:40px;font-size:17px;color:var(--ink)}
.plc .seg{display:flex}.plc .seg button{flex:1;justify-content:center}
.tgs{display:flex;flex-direction:column;align-items:flex-start;gap:8px;margin-top:var(--s4)}.plc .tog{box-shadow:none;background:var(--soft);flex-direction:row;align-items:center;color:var(--ink)}.tgs .hint{margin:0 0 0 4px}
.btn.wide{width:100%}
.plo .empty{text-align:center;padding:var(--s6) var(--s5)}.plo .empty .emo{width:56px;height:56px}.plo .empty h2{margin:var(--s3) 0 var(--s2)}.plo .empty p{max-width:34em;margin:0 auto var(--s2);color:var(--ink2)}
.res h2{outline:0}.res .meta1{margin:4px 0 0}
.kpis.k4{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.kpis.k4 div{padding:12px 14px}.kpis.k4 b{font-size:24px}.kpis.k4 small{display:block;line-height:1.35;margin-top:4px}
.note{font-size:16px;color:var(--ink2);background:var(--soft);border-radius:var(--r3);padding:10px 14px;margin:var(--s2) 0}
.warn p{margin:0}.fixes{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:10px}.fixes>span{font-weight:700;font-size:15.5px}
.fixes .chip{display:inline-block;text-align:left;line-height:1.3;min-height:34px;padding:6px 12px;font-size:15px;background:#fff;color:#6A3A00;box-shadow:inset 0 0 0 1px #E8C88F}.fixes .chip small{font-weight:500}
.meet{margin:var(--s5) 0 0}.meet h3,.bk h3{font-size:17px;margin:0 0 var(--s3)}
.meet ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.meet li{display:grid;grid-template-columns:22px minmax(0,10em) minmax(40px,1fr) 46px;gap:10px;align-items:center;font-size:16px}
.meet .mi{display:flex}.meet .emo{width:22px;height:22px}.meet .ml{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.meet b{text-align:right}
.mb{height:10px;background:var(--soft);border-radius:999px;overflow:hidden}.mb i{display:block;height:100%;background:var(--brand);border-radius:999px}
.bk{margin-top:var(--s5)}.bst{margin:0 0 var(--s4)}
.sth{display:flex;align-items:center;gap:8px;font-size:17px;margin:0 0 4px;padding-bottom:8px;border-bottom:1px solid var(--line2)}.sth small{margin-left:auto;font-weight:500;color:var(--muted);font-size:15px}
.its{list-style:none;margin:0;padding:0}.tgh{display:flex;align-items:center;gap:6px;font-size:14.5px;font-weight:700;color:var(--muted);margin:14px 0 2px}.tgh .emo{width:18px;height:18px}
.it{border-top:1px solid var(--line);padding:12px 0}.tgh+.it{border-top:0}
.itm{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:12px;align-items:start}
.iti a{font-weight:600;color:var(--ink);text-decoration:none;font-size:16.5px;line-height:1.3}.iti a:hover{color:var(--brand)}
.iti small{display:block;color:var(--muted);font-size:14.5px;margin-top:2px}.iti s{color:var(--muted)}
.msv{color:var(--brand);font-weight:600}.spt{background:var(--t100);color:var(--brand-dk);border-radius:999px;padding:1px 7px;font-size:13.5px}.itc{font-size:17px}
.ita{display:flex;flex-wrap:wrap;align-items:center;gap:4px 14px;margin:8px 0 0 56px}
.lnk{border:0;background:none;padding:6px 2px;font:600 15.5px/1.2 var(--body);color:var(--brand);cursor:pointer;min-height:32px;text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--t200)}
.lnk:hover{text-decoration-color:var(--brand)}.lnk[aria-pressed=true]{color:#fff;background:var(--brand);border-radius:999px;padding:6px 12px;text-decoration:none}
.swp{margin:10px 0 0 56px;background:var(--soft);border-radius:var(--r3);padding:10px 12px}.swp ul{list-style:none;margin:0;padding:0}
.swp li{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:10px;align-items:center;padding:8px 0;border-top:1px solid var(--line2)}.swp li:first-child{border-top:0}
.swn{font-weight:600;font-size:15.5px;display:block}.swp small{display:block;color:var(--muted);font-size:14px}.swh{font-size:15px;font-weight:700;margin:0 0 4px}.swp .chip{min-height:34px;padding:6px 14px}
.rmd{font-size:15.5px;color:var(--muted)}.plx{margin-top:var(--s6)}
@media (max-width:560px){.ita,.swp{margin-left:0}.plc{padding:var(--s4)}}
@media print{.plf,.plx,.ita,.swp,.fixes,.note{display:none!important}.pl{display:block}}

/* ---- meal planner (/planner/, assets/meal-ui.js) ---- */
.pmode{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;background:var(--soft2);border-radius:22px;padding:5px;margin:var(--s4) 0 0;max-width:620px}
.pmode button{display:flex;align-items:center;gap:10px;border:0;background:none;border-radius:18px;padding:10px 14px;font:700 17px/1.2 var(--body);color:var(--ink2);cursor:pointer;text-align:left;min-height:56px;transition:background .15s,box-shadow .15s}
.pmode button small{display:block;font-weight:500;font-size:14.5px;color:var(--muted);margin-top:2px}.pmode .emo{width:24px;height:24px;flex:none}
.pmode [aria-pressed=true]{background:var(--card);color:var(--ink);box-shadow:0 1px 3px rgba(17,17,17,.1)}
.mhg{margin-top:var(--s3)}#mwarn{margin:var(--s3) 0 0;font-size:15.5px}
.mres .mk b{font-size:22px}
.mdays{display:flex;gap:6px;overflow-x:auto;padding:4px 2px 8px;margin:var(--s4) 0 var(--s2);scrollbar-width:thin}
.mdays button{flex:none;border:0;background:var(--soft);border-radius:999px;padding:8px 15px;font:600 16px/1.2 var(--body);color:var(--ink2);cursor:pointer;min-height:38px}
.mdays [aria-selected=true]{background:var(--brand);color:#fff}.mdx{color:#8A4B00;font-weight:700}.mdays [aria-selected=true] .mdx{color:#fff}
.mdh{font-size:17px;margin:var(--s2) 0 var(--s3)}
.mls{display:grid;gap:10px}@media (min-width:760px){.mls{grid-template-columns:repeat(2,minmax(0,1fr))}}
.meal{background:var(--soft);border-radius:var(--r2);padding:14px 16px;animation:pmIn .25s ease-out both}
@keyframes pmIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.meal{animation:none}.pmode button{transition:none}}
.mh{display:grid;grid-template-columns:36px minmax(0,1fr) auto;gap:10px;align-items:center}
.mic{width:36px;height:36px;border-radius:12px;background:var(--card);display:grid;place-items:center}.mic .emo{width:24px;height:24px}
.msl{margin:0;font-size:14px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}.mh h4{font-size:17px;line-height:1.3;margin:1px 0 0}
.msw{min-height:32px;padding:5px 12px;font-size:15px}
.mit{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:7px}
.mit li{display:grid;grid-template-columns:22px 84px minmax(0,1fr);gap:8px;align-items:start;font-size:16px;line-height:1.3}.mit .emo{width:20px;height:20px}
.mq{font-weight:700;font-variant-numeric:tabular-nums;font-size:15.5px}.mn a{color:var(--ink);text-decoration:none;font-weight:600}.mn a:hover{color:var(--brand)}
.mn small{display:block;color:var(--muted);font-size:14px;margin-top:1px}
.mmac{font-size:14.5px;color:var(--muted);margin:10px 0 0;padding-top:8px;border-top:1px solid var(--line2)}
.mtot{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:var(--s3) 0 0}
.mtk{background:var(--soft);border-radius:var(--r3);padding:10px 12px;font-size:14.5px;color:var(--muted);line-height:1.3}
.mtk b{display:block;font-size:18px;color:var(--ink);letter-spacing:-.02em}.mtk small{display:block;font-size:13.5px;margin-top:2px;color:#8A4B00}
.mtk.on small{color:var(--brand)}.mtk.on small:before{content:"✓ "}
@media (max-width:560px){.mtot{grid-template-columns:repeat(2,minmax(0,1fr))}.mit li{grid-template-columns:22px 74px minmax(0,1fr)}}
.mact{margin-top:var(--s4)}
.mshop{margin-top:var(--s6);padding-top:var(--s5);border-top:1px solid var(--line2)}.mshh{margin-bottom:var(--s3)}.mshh h3{font-size:20px}
.shl{list-style:none;margin:0;padding:0}
.shl li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:start;padding:10px 0;border-top:1px solid var(--line)}.shl li:first-child{border-top:0}
.shl label{display:flex;flex-direction:row;gap:10px;align-items:flex-start;cursor:pointer;font-size:16.5px;font-weight:600;color:var(--ink);line-height:1.3}
.mtm{text-transform:none;letter-spacing:0;font-weight:600;color:var(--muted)}.mmd{margin:8px 0 0;font-size:15.5px}.mmd summary{cursor:pointer;font-weight:600;color:var(--brand);min-height:32px;display:flex;align-items:center}.mmd ol{margin:4px 0 0;padding-left:20px;color:var(--ink2);line-height:1.45}.mmd li{margin:2px 0}
.mbt{margin:4px 0 0;font-size:14.5px;font-weight:600;color:var(--brand)}
.shr{display:flex;flex-direction:column;align-items:flex-end;gap:6px}.shr .hv{min-height:32px;padding:4px 11px;font-size:14.5px;background:var(--soft);box-shadow:none}.shr .hv[aria-pressed=true]{background:var(--t50);color:var(--brand-dk)}.mhave .shn{font-size:16px;font-weight:600}
.shl input{width:20px;height:20px;margin:1px 0 0;accent-color:var(--brand);flex:none}
.shn small{display:block;font-weight:500;color:var(--muted);font-size:14.5px;margin-top:2px}.shl b{font-size:16.5px;font-variant-numeric:tabular-nums}
.shl li.done .shn>span,.shl li.done .shn{text-decoration:line-through;text-decoration-color:var(--line2);color:var(--muted)}
.mstot{background:var(--t50);border-radius:var(--r2);padding:14px 16px;margin:var(--s3) 0}.mstot p:first-child{display:flex;justify-content:space-between;align-items:baseline;margin:0;font-weight:700}
.mstot b{font-size:26px;letter-spacing:-.03em}.mstot .hint{margin:6px 0 0}
@media print{.mmd summary{display:none}.hv,.mhave,.pmode,#ppw,.mdays,.msw,.mact,#mf,.plx,.ok,.warn,.fixes{display:none!important}.meal{break-inside:avoid;background:#fff;border:1px solid #ddd}
 .mday[hidden]{display:block!important}.mday{break-inside:auto;margin-bottom:12px}
 body.pm-pl .mday,body.pm-pl .kpis,body.pm-pl .rh .meta1,body.pm-pl .note{display:none!important}body.pm-pl .mshop{margin:0;border:0;padding:0}
 body.pm-pp .mshop{break-before:page}.shl input{accent-color:#000}}

/* ---- price-drop alerts (FAV_JS + /list/) ---- */
.ndrop{position:absolute;top:7px;left:27px;width:10px;height:10px;border-radius:50%;background:var(--brand-dk);box-shadow:0 0 0 2px var(--card)}
.ndrop[hidden]{display:none}
@media (max-width:820px){.ndrop{top:24px;left:8px;width:9px;height:9px}}
.hlist{position:relative}
.drops{margin:0 0 var(--s5);border:1.5px solid var(--t200)}
.dhd{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:6px}
.dhd h2{display:flex;align-items:center;gap:8px;font-size:20px}.dhd h2 .cnt{display:inline-block}
.dhd .emo,.drn .emo{width:24px;height:24px;flex:none}
.dl{list-style:none;margin:0;padding:0}
.dl li{display:flex;align-items:center;gap:12px;padding:12px 0;border-top:1px solid var(--line)}
.dl li:first-child{border-top:0}
.dli{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.dli a{font-weight:600;color:var(--ink);text-decoration:none;overflow-wrap:anywhere}.dli a:hover{text-decoration:underline}
.dpx{font-size:17px}.dpx s{color:var(--muted)}.dpx b{font-size:18px}
.dli small{color:var(--muted);font-size:15px}
.pill{display:inline-block;background:var(--t100);color:var(--brand-dk);font-size:14px;font-weight:700;border-radius:999px;padding:2px 9px;line-height:1.4;vertical-align:1px}
.dx{flex:none;width:36px;height:36px;padding:0;justify-content:center}
.drn{display:flex;gap:10px;align-items:flex-start;background:var(--t50);border-radius:var(--r3);padding:12px 14px;margin:0 0 var(--s5);font-size:16.5px;color:var(--ink2)}
.drops .disclaimer{margin:8px 0 0}

/* ---- specials (/specials/): best 10, sticky filter chips, compact cards on phones ---- */
.b10 .sh h2{display:flex;align-items:center;gap:10px}.b10 .hint{margin:-4px 0 0}
.b10 .ex{font-size:14.5px;color:var(--brand-dk);font-weight:600;margin:2px 0 0}
.spf{position:sticky;top:0;z-index:20;margin:0 calc(-1*var(--s2)) var(--s4);padding:10px var(--s2);background:rgba(246,247,246,.94);backdrop-filter:saturate(1.6) blur(12px);-webkit-backdrop-filter:saturate(1.6) blur(12px);transition:top .25s ease}
body:has(header.site:not(.hide)) .spf{top:calc(68px + env(safe-area-inset-top))}
.fcs{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding:2px 0}.fcs::-webkit-scrollbar{display:none}
.fcr{align-items:center;gap:8px;margin-top:6px;overflow:visible;flex-wrap:wrap}.fcr .fcs{flex:0 1 auto}.fcr .count{margin-left:auto}
.fc{flex:none;min-height:36px;padding:6px 13px;font-size:15.5px;box-shadow:inset 0 0 0 1px var(--line2);background:var(--card)}
.fc .emo{width:20px;height:20px}.fc small{font-size:14px;color:var(--muted);font-weight:600}
.fc[aria-pressed=true]{background:var(--brand);color:#fff;box-shadow:none}.fc[aria-pressed=true] small{color:#DCEDE3}
.fc:disabled{opacity:.45;cursor:default}
.fc:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.spg .card{content-visibility:auto;contain-intrinsic-size:auto 340px}
.more{text-align:center;margin:var(--s4) 0}.more [hidden]{display:none}
@media (max-width:820px){body:has(header.site:not(.hide)) .spf{top:calc(56px + env(safe-area-inset-top))}}
@media (max-width:560px){
 .spg{grid-template-columns:1fr;gap:10px}
 .spg .card{display:grid;grid-template-columns:76px minmax(0,1fr);grid-template-areas:"ph nm" "ph vr" "ph st" "ph prw" "ph m" "ph m2";column-gap:12px;row-gap:2px;padding:12px;align-items:start;contain-intrinsic-size:auto 170px}
 .spg .card>.ph{grid-area:ph;width:76px;height:76px;margin:0;border-radius:14px}
 .spg .card>.nm{grid-area:nm;font-size:16.5px;margin:0;padding-right:34px}.spg .card>.vr{grid-area:vr;margin:0;padding-right:34px}.spg .card>.st{grid-area:st;margin:0}
 .spg .card>.prw{grid-area:prw;margin:4px 0 0}
 .spg .card>.m{grid-area:m;margin:2px 0 0}.spg .card>.m2{grid-area:m2;margin:0}.spg .card>.nxl{display:none}
 .spg .card>.spb{top:auto;bottom:10px;left:12px;font-size:13px;padding:2px 7px;width:76px;text-align:center;box-sizing:border-box}
 .spg .card>.hrt{top:8px;right:8px;width:30px;height:30px}
 .spf{margin:0 -16px var(--s3);padding:8px 16px}
 .fcr select{flex:1 1 auto}.fcr .count{width:auto}
}
.spe{grid-column:1/-1;text-align:center}

/* ---- smart search (/browse/) ---- */
.qch{margin:-4px 0 var(--s3);min-height:38px}.qch .qs{margin:0}
.qcs{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.qlab{font-size:15px;color:var(--muted);font-weight:600;margin-right:2px}
.qc{min-height:34px;padding:5px 8px 5px 13px;font-size:15.5px;background:var(--t50);color:var(--brand-dk);box-shadow:inset 0 0 0 1px var(--t200)}
.qc span{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;font-size:13px;background:var(--card);color:var(--ink2)}
.qc:hover span{background:var(--brand);color:#fff}
.qempty{padding:var(--s5)}
.qe{display:flex;gap:var(--s4);align-items:flex-start}.qe .emo{width:40px;height:40px;flex:none}
.qe h2{font-size:19px;margin:4px 0 8px;overflow-wrap:anywhere}.qe p{margin:6px 0}
.qsug{list-style:none;margin:4px 0 8px;padding:0}.qsug li{padding:2px 0}.qsug small{color:var(--muted)}
.qtry{font-size:15.5px;color:var(--muted)}.qtry .lnk{font-size:15.5px;min-height:0;padding:2px}

/* ---- price history (product pages) ---- */
.phx{max-width:560px}.pht{margin:0 0 8px;line-height:1.7}.pht .phv{margin-right:6px}
.phc{width:100%;max-width:440px;height:auto;display:block;margin:6px 0 4px;overflow:visible}
.phc .ln{fill:none;stroke:var(--brand);stroke-width:2.2;stroke-linejoin:round}
.phc .ty{stroke:var(--line2);stroke-width:1.5;stroke-dasharray:4 4}
.phc .now{fill:var(--brand);stroke:#fff;stroke-width:2}
.phc text{font:600 13px var(--body);fill:var(--muted)}
.phv{display:inline-block;font-size:14.5px;font-weight:700;border-radius:999px;padding:3px 10px;line-height:1.35}
.phv-lowest{background:var(--brand);color:#fff}.phv-typical{background:var(--soft2);color:var(--ink2)}.phv-higher{background:#FBEFD9;color:#6A3A00}
.phs{margin:6px 0 0;font-size:15.5px;color:var(--muted)}
.phf{font-size:15.5px;color:#6A3A00;background:#FDF6EA;border-radius:12px;padding:8px 12px;margin:8px 0}

/* ---- planner -> recipes ---- */
.rcs{margin:var(--s5) 0 0}.rcs h3{margin:0 0 var(--s2)}
.rcl{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px}
.rci{display:flex;gap:12px;align-items:center;padding:12px 14px;border-radius:var(--r3);background:var(--t50);text-decoration:none;color:var(--ink);height:100%;box-sizing:border-box}
.rci:hover{background:var(--t100)}.rci .emo{flex:none;width:36px;height:36px}
.rci b{display:block;font-size:16.5px;line-height:1.3}.rci small{display:block;color:var(--ink2);font-size:15px;margin-top:2px}
.rpl{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin:var(--s4) 0}.rpl .btn{display:inline-flex;align-items:center;gap:8px}.rpl .emo{width:22px;height:22px}.rpl small{color:var(--muted);font-size:15.5px}

/* ---- compare (/compare/) ---- */
#cmpout{--cl:150px;--cw:180px}
.csum{margin:var(--s4) 0}.csum h2{display:flex;align-items:center;gap:8px;font-size:20px;margin:0 0 6px}.csum .emo{width:26px;height:26px}
.csum ul{margin:0;padding-left:20px}.csum li{margin:4px 0;color:var(--ink2)}
.cwrap{overflow-x:auto;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory;scroll-padding-left:var(--cl);margin:var(--s3) 0;border-radius:var(--r);background:var(--card);box-shadow:var(--sh1)}
.cg{display:grid;min-width:min-content}
.cr{display:contents}
.cl,.ch,.cc{padding:12px 14px;border-bottom:1px solid var(--line)}
.cl{position:sticky;left:0;z-index:1;background:var(--card);font-size:15.5px;font-weight:600;color:var(--muted);box-shadow:1px 0 0 var(--line)}
.ch{scroll-snap-align:start;display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.ch .th{width:56px;height:56px}.cn{font-weight:700;color:var(--ink);text-decoration:none;font-size:16.5px;line-height:1.3}.cn:hover{text-decoration:underline}
.ch .st{font-size:15px;color:var(--muted)}.ch .lnk{min-height:0;padding:0;font-size:15px}
.cc{scroll-snap-align:start;font-size:16.5px;position:relative;padding-right:52px}.cc small{display:block;color:var(--muted);font-size:14.5px}
.cc.best{background:var(--t50)}.cc.best b{color:var(--brand-dk)}
.bt{position:absolute;top:10px;right:10px;font-size:13px;font-weight:700;color:#fff;background:var(--brand);border-radius:999px;padding:1px 8px}
.cswipe{display:none}
.csim{margin:var(--s5) 0}.csim .h3{font-size:18px;margin:0 0 var(--s2)}.fcs.wrap{flex-wrap:wrap;overflow:visible}
.csim .chip small{color:var(--muted);font-weight:500;font-size:14px}
@media (max-width:700px){#cmpout{--cl:96px;--cw:150px}.cl{font-size:14.5px;padding:10px}.ch,.cc{padding:10px 12px}.cswipe{display:block}}

/* ---- email sign-ups (footer, /newsletter/, My list) ---- */
.subf{margin:var(--s3) 0 0;max-width:520px}
.subr{display:flex;gap:8px}.subr input{flex:1;min-width:0;font:inherit;font-size:17px;padding:11px 16px;border-radius:999px;border:1px solid var(--line2);background:var(--card);color:var(--ink)}
.subr input:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-color:var(--brand)}
.subc{display:flex;gap:10px;align-items:flex-start;margin-top:10px;font-size:15px;line-height:1.45;color:var(--ink2);cursor:pointer}
.subc input{width:18px;height:18px;margin:1px 0 0;flex:none;accent-color:var(--brand)}
.hpf{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.subm{margin:8px 0 0;font-size:15.5px;min-height:1px}.subm:empty{display:none}.subm.ok{color:var(--brand-dk);font-weight:600}.subm.err{color:#9A2B1B;font-weight:600}
.subf.done .subr,.subf.done .subc{display:none}
.alsub{margin:var(--s5) 0}.alsub h2{display:flex;align-items:center;gap:10px;font-size:20px}.alsub h2 .emo{width:26px;height:26px}
.alsub>p{color:var(--ink2);margin:6px 0 0}.alon[hidden],.alsub .subf[hidden]{display:none}
footer .fsub{margin-top:var(--s4);max-width:380px}footer .fsh{font-weight:700;color:#fff;margin:0;font-size:16.5px}
footer .subf{margin-top:8px}footer .subr input{background:#fff;border-color:transparent;color:#111}
footer .subc{color:#C9CFCB}footer .subc a{color:#fff}footer .subm.ok{color:#B7D9C6}footer .subm.err{color:#FFB4A6}
footer .subr .btn{background:#fff;color:var(--brand-dk)}footer .subr .btn:hover{background:var(--t100)}
@media (max-width:420px){.subr{flex-direction:column}.subr .btn{width:100%}}

/* a11y: links inside running text are underlined, not colour-only (WCAG 1.4.1) */
footer p a,footer .subc a,.subc a,.disclaimer a{text-decoration:underline;text-underline-offset:2px}

/* My list: same protein, less money */
.lsw .dhd{flex-wrap:wrap;gap:8px}.lsw .cnt{width:auto;min-width:0;padding:2px 10px;white-space:nowrap}.swst{display:inline-flex;align-items:center;gap:8px;font-size:16px;font-weight:600;color:var(--ink2);cursor:pointer}
.swst input{width:18px;height:18px;margin:0;accent-color:var(--brand)}.drn .swst{display:flex;margin-top:6px}
.lsw .swb{background:var(--brand);color:#fff;font-weight:700;align-self:center}.lsw .swb:hover{background:#0B5440}
@media print{.lsw{display:none}}
/* homepage hero: one-sentence headline, two clear next steps, a realistic best-value card */
.hx h1{font-size:clamp(32px,4.6vw,52px);line-height:1.05;max-width:15ch}
.hcta{display:flex;flex-wrap:wrap;gap:10px;margin:var(--s4) 0 0}
.hcta .btn{gap:8px;padding:11px 18px}.hcta .emo{width:22px;height:22px}
.hx .hc1{background:#fff;color:var(--brand-dk)}.hx .hc1:hover{background:var(--t50)}
.hx .hc2{background:transparent;color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.5)}.hx .hc2:hover{background:rgba(255,255,255,.1)}
.bv{padding:var(--s5) var(--s4) var(--s4)}
.bvh{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.slogos.sm{margin:0;gap:6px;flex-wrap:nowrap}
.slogos.sm .slg{width:52px;height:28px;border-radius:8px;box-shadow:inset 0 0 0 1px var(--line,#e6ebe8)}
.bvs{font-size:16px;color:var(--muted);margin:10px 0 8px}
.bvl{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.bvl a{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:var(--r3);background:var(--soft);color:var(--ink);text-decoration:none;min-height:60px;transition:background-color .15s}
.bvl a:hover{background:var(--t50)}
.bvl .emo{flex:none;width:36px;height:36px}
.bvt{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.bvt b{font-size:16.5px;font-weight:600;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.bvt small,.bvp small{font-size:14.5px;color:var(--muted);font-weight:500}.bvt i{font-style:normal}
.bvp{flex:none;text-align:right;display:flex;flex-direction:column}
.bvp b{font-size:20px;font-weight:800;letter-spacing:-.03em;color:var(--brand)}
.bvn{font-size:14.5px;color:var(--muted);margin:10px 2px 0}.bvn a{color:var(--muted)}
.m .hx .hcta{animation:pa-rise .56s cubic-bezier(.2,.7,.2,1) .36s both}
.m .bvl li{animation:pa-rise .5s cubic-bezier(.2,.7,.2,1) both}.m .bvl li:nth-child(2){animation-delay:.08s}.m .bvl li:nth-child(3){animation-delay:.16s}
@media (prefers-reduced-motion:reduce){.m .hx .hcta,.m .bvl li{animation:none}}
@media (max-width:560px){.hcta{flex-wrap:nowrap;gap:8px}.hcta .btn{flex:1 1 auto;padding:10px 12px;font-size:16px;white-space:nowrap;gap:6px}.hcta .emo{width:18px;height:18px}}
/* emoji icon chips are fixed-size circles: never let a parent's flex rule stretch them into a pill (guard; check_site asserts it) */
.ci,.bic,.mi,.nxi,.mci,.gi,.tic{flex:none!important}
/* specials Best 10: rank-by pills + pantry staples toggle; the active metric is the row's headline */
.b10c{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin:0 0 var(--s3)}
.b10s{flex-wrap:nowrap;overflow-x:auto;max-width:100%;scrollbar-width:none}.b10s::-webkit-scrollbar{display:none}.b10s button{white-space:nowrap}
.b10p{display:flex;align-items:center;gap:8px;font-size:16px;color:var(--ink2);cursor:pointer;min-height:36px}.b10p input{width:18px;height:18px;accent-color:var(--brand)}.b10p small{color:var(--muted)}
.b10 .ex .b10m{font-size:16px;color:var(--ink2)}.b10 .ex .b10m b{color:var(--brand);font-size:17px;font-weight:800}
.b10p>span{display:block;flex:1;min-width:0}.b10p>span small{display:inline;margin:0;font-size:14.5px}
/* ---- easier to read and tap (50+ audit, Oct 2026): bigger targets, clearer focus, plain-English helpers ---- */
.hic,.hlist{min-width:48px;min-height:48px}.hic{width:48px;height:48px}
nav.top a{min-height:48px;display:inline-flex;align-items:center;font-size:17px}
.btn,.fav,.cmp,.sw,.acts2>*{min-height:48px}
.chip,.qs a,.seg button,.seg a,.ptb,.fc,.ptabs button,.stabs button,.mdays button,.hv{min-height:48px}
input[type=number],input[type=search],input[type=email],input[type=text],select{min-height:48px;font-size:17px}
input[type=checkbox],input[type=radio]{width:22px;height:22px;accent-color:var(--brand)}
.tog input[type=checkbox]{width:38px;height:22px;flex:0 0 38px;accent-color:initial}
.mrows a{min-height:56px}.msec a{min-height:48px;display:flex;align-items:center}
a:focus-visible,button:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid var(--brand);outline-offset:3px}
.hx a:focus-visible,.hx button:focus-visible,.hx input:focus-visible{outline:3px solid #fff}
.whatis{margin:12px 0 0;font-size:16px;color:var(--ink2)}
.whatis summary{cursor:pointer;color:var(--brand);font-weight:600;min-height:44px;display:inline-flex;align-items:center;gap:6px;list-style:none}
.whatis summary::-webkit-details-marker{display:none}.whatis summary:before{content:"?";display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--t100);color:var(--brand-dk);font-weight:800;font-size:14px}
.whatis dl{margin:6px 0 0;padding:12px 14px;background:var(--soft);border-radius:var(--r3)}.whatis dt{font-weight:700;color:var(--ink)}.whatis dd{margin:0 0 8px}
.stpick{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:8px 0 0}.stpick>span{font-weight:600;color:var(--ink2);margin-right:4px}
.stpick .chip{display:inline-flex;align-items:center;gap:8px;text-decoration:none}
.steps3{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s4)}
.steps3>li{display:flex;flex-direction:column;gap:10px;background:var(--card);border-radius:var(--r);padding:var(--s5);box-shadow:var(--sh1)}
.steps3 .sth{display:flex;align-items:center;gap:12px}
.steps3 .sn{flex:none;width:40px;height:40px;border-radius:50%;background:var(--brand);color:#fff;font-weight:800;font-size:19px;display:grid;place-items:center}
.steps3 h3{font-size:20px;line-height:1.25;margin:0}.steps3 p{color:var(--ink2);margin:0;font-size:17px;line-height:1.45}
.steps3 .sta{margin-top:auto;padding-top:6px;display:grid;grid-template-columns:1fr;gap:8px}
.steps3 .sta.s2{grid-template-columns:1fr 1fr}.steps3 .sta.s3{grid-template-columns:1.4fr 1fr 1fr}
.steps3 .sta .btn{margin:0;padding:12px 10px;min-width:0;white-space:nowrap;font-size:16.5px}.steps3 .sta .dot{flex:none}
@media (max-width:860px){.steps3{grid-template-columns:1fr}}
.qstart h2{font-size:24px}.qstart .lblk{margin:14px 0 0}.qstart .lbl{font-size:17px;font-weight:700;color:var(--ink);display:block;margin-bottom:8px}
.qseg{display:flex;flex-wrap:wrap;gap:8px;background:none;padding:0}.qseg button{flex:1 1 auto;min-height:52px;font-size:17px;border-radius:var(--r3);background:var(--soft);border:2px solid transparent;color:var(--ink);font-weight:600;padding:8px 14px;cursor:pointer}
.qseg button[aria-pressed=true]{background:var(--t100);border-color:var(--brand);color:var(--brand-dk)}
.qopt{margin-top:14px}.qtg{margin:16px 0 4px;font-size:18px;color:var(--ink)}
.pdd.more>summary{font-size:18px;min-height:52px}
/* large-type print for My list and the planner shopping list: 16pt+, black on white, a tick box per item */
@media print{body{font-size:16pt;line-height:1.45;color:#000}h1{font-size:26pt}h2{font-size:20pt;margin:14pt 0 6pt}
 .drops,.drn,.alsub,.whatis,.crumbs,.disclaimer .np{display:none!important}.prow img,.prow .th,.prow picture{display:none!important}
 table.data{font-size:16pt;width:100%;border-collapse:collapse}table.data td,table.data th{padding:8pt 6pt;border-bottom:1pt solid #999;color:#000}
 table.data td .prow{display:flex;align-items:flex-start;gap:10pt}table.data td .prow:before{content:"\2610";flex:none;font-size:22pt;line-height:1}
 table.data small{font-size:12pt;color:#333}table.data .qty{border:0!important;box-shadow:none!important;font-size:16pt!important;width:2.5em!important;min-height:0!important;padding:0!important;background:none!important;text-align:left;-moz-appearance:textfield;appearance:textfield}.qty::-webkit-inner-spin-button,.qty::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
 .kpis b{font-size:20pt}.kpis small{font-size:12pt}}
.row .chip,.ptc .ptb,.qst button{min-height:48px}.qst button{min-width:48px}.hrt{min-width:48px}
a.logo{min-height:48px;display:inline-flex;align-items:center}
.flinks a{display:inline-flex;align-items:center;min-height:44px}.crumbs a,.sh a{display:inline-flex;align-items:center;min-height:44px}
.ptc.no .ptb{min-height:48px}
.qseg button{white-space:nowrap}
@media (max-width:560px){.hcta .btn{padding:10px 8px;min-width:0;flex:1 1 0;justify-content:center}}@media (max-width:420px){.hcta{flex-wrap:wrap}.hcta .btn{flex:1 1 100%}}
.qs a{display:inline-flex;align-items:center}
@media print{.kpis>div,.table-wrap,table.data{box-shadow:none!important;border:1pt solid #999}}
.mbn{margin:4px 0 6px;font-size:15px;color:var(--brand-dk)}.mbn b{font-weight:700}

/* ---- feedback box (every page) ---- */
.fbk{margin:0}
.fbx{background:var(--card);border-radius:var(--r);box-shadow:var(--sh1);padding:var(--s5);max-width:760px;margin:0 auto var(--s6,40px);text-align:center}
.fbx h2{font-size:22px;margin:0 0 14px}
.fbv{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}
.fbv .btn{min-width:140px;min-height:54px;font-size:18px;gap:10px}.fbv .btn .emo{width:26px;height:26px}
.fbv .btn[aria-pressed=true]{background:var(--t50);box-shadow:inset 0 0 0 2px var(--brand);color:var(--brand-dk)}
.fbv .btn:disabled{cursor:default;opacity:.7}
.fbf{text-align:left;display:grid;gap:8px;margin:18px auto 0;max-width:560px}.fbf[hidden]{display:none}
.fbf label{font-weight:600;font-size:17px;margin-top:6px}.fbf .opt{font-weight:400;color:var(--muted)}
.fbf textarea,.fbf input[type=email]{font:inherit;font-size:17px;padding:12px 14px;border-radius:14px;border:1px solid var(--line2);background:#fff;color:var(--ink);width:100%;box-sizing:border-box}
.fbf textarea{resize:vertical;min-height:96px}
.fbf textarea:focus-visible,.fbf input:focus-visible{outline:2px solid var(--brand);outline-offset:1px}
.fbf .btn{justify-self:start;margin-top:6px;min-height:50px;font-size:18px}
.fbn{font-size:15px;color:var(--muted);margin:2px 0 0}
.fbm{margin:12px 0 0;font-size:17px}.fbm:empty{display:none}.fbm.ok{color:var(--brand-dk);font-weight:600}.fbm.err{color:#9A2B1B;font-weight:600}.fbm.big{font-size:19px}
@media (max-width:560px){.fbx{padding:var(--s4)}.fbv .btn{flex:1 1 0;min-width:0}.fbf .btn{justify-self:stretch}}
