:root{--ink:#26312d;--muted:#6f7d79;--paper:#f7faf7;--card:#fff;--brand:#7f9870;--brand2:#9eb4ca;--accent:#dce8dc;--line:#dce6e2;--green:#617c66;--blue:#dce9f3;--shadow:0 12px 34px rgba(66,91,80,.12);--radius:22px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:linear-gradient(180deg,#e4eee3 0,#eef5fa 330px,#f7faf7 620px);color:var(--ink)}button,input,select{font:inherit}.app{max-width:780px;margin:auto;min-height:100vh;padding-bottom:104px}.hero{padding:30px 18px 18px}.hero-card{position:relative;overflow:hidden;background:linear-gradient(135deg,#718b68,#9bb1c5);color:white;border-radius:28px;padding:25px;box-shadow:var(--shadow)}.hero-card:after{content:"";position:absolute;width:180px;height:180px;border-radius:50%;right:-58px;top:-72px;background:rgba(255,255,255,.12)}.eyebrow{font-size:12px;font-weight:850;letter-spacing:.12em;text-transform:uppercase;opacity:.82}h1{font-family:Georgia,serif;font-size:42px;line-height:1.02;margin:8px 0}.hero p{font-size:16px;margin:0;max-width:470px;opacity:.92}.copyright-mini{font-size:11px;margin-top:17px;opacity:.7}.content{padding:0 15px}.panel{background:rgba(255,255,255,.92);border:1px solid var(--line);border-radius:var(--radius);padding:17px;box-shadow:var(--shadow);margin-bottom:15px}.panel h2{margin:0 0 12px;font-size:22px}.decision-buttons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;margin-bottom:15px}.surprise{display:grid;grid-template-columns:1fr;gap:10px;align-content:space-between;text-align:left;margin:0;min-height:164px;background:linear-gradient(135deg,#edf4e9,#dce8d8);border:1px solid #cbdcc6}.surprise.random{background:linear-gradient(135deg,#edf5fb,#d9e7f2)}.surprise h2{font-family:Georgia,serif;font-size:23px;line-height:1.05;margin-bottom:6px}.surprise p{margin:0;color:var(--muted);font-size:13px}.dice{border:0;width:54px;height:54px;border-radius:17px;background:var(--brand);color:white;font-size:27px;box-shadow:0 9px 20px rgba(88,112,78,.25);display:flex;align-items:center;justify-content:center}.surprise.random .dice{background:var(--green)}.quick-cats{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.quick-cat{position:relative;overflow:hidden;border:1px solid var(--line);background:#fff;border-radius:18px;padding:0;text-align:left;min-height:116px;box-shadow:0 5px 15px rgba(66,91,80,.10);isolation:isolate}.quick-cat img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .25s ease}.quick-cat:after{content:"";position:absolute;inset:38% 0 0;background:linear-gradient(180deg,transparent,rgba(23,38,32,.82));z-index:1}.quick-cat strong{position:absolute;left:12px;right:10px;bottom:11px;display:block;font-size:15px;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.45);z-index:2}.quick-cat:hover img,.quick-cat:focus-visible img{transform:scale(1.045)}.quick-cat.active{border-color:#526c59;box-shadow:0 0 0 3px rgba(127,152,112,.30),0 7px 18px rgba(66,91,80,.15)}.quick-cat.active:before{content:"✓";position:absolute;right:9px;top:9px;z-index:3;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.94);color:var(--green);font-weight:900;box-shadow:0 2px 8px rgba(0,0,0,.18)}.chips{display:flex;gap:8px;overflow:auto;padding-bottom:4px}.chip{border:1px solid var(--line);background:#fff;border-radius:999px;padding:9px 13px;white-space:nowrap;color:var(--ink)}.chip.active{background:var(--brand);color:#fff;border-color:var(--brand)}.search-row{display:grid;grid-template-columns:1fr auto;gap:8px}.search{width:100%;border:1px solid var(--line);border-radius:14px;padding:14px;background:#fff;outline:none}.search:focus{border-color:var(--brand2);box-shadow:0 0 0 3px rgba(191,112,91,.14)}.search-button{border:0;border-radius:14px;padding:0 17px;background:var(--brand);color:#fff;font-weight:800}.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.card{position:relative;text-align:left;background:#fff;border:1px solid var(--line);border-radius:19px;overflow:hidden;min-height:188px;box-shadow:0 5px 15px rgba(66,91,80,.07)}.food-art{height:92px;display:flex;align-items:center;justify-content:center;font-size:43px;background:linear-gradient(145deg,#dce8dc,#dce9f3);position:relative}.food-art:after{content:"";position:absolute;inset:12px 30%;border-radius:50%;background:rgba(255,255,255,.34)}.food-art span{position:relative;z-index:1}.food-art img{width:100%;height:100%;object-fit:cover;display:block}.detail-art{overflow:hidden}.detail-art img{width:100%;height:100%;object-fit:cover;display:block}.card-body{padding:13px}.card h3{font-size:16px;margin:0 0 5px 0}.meta{color:var(--muted);font-size:12px}.fav{position:static;flex:0 0 34px;border:0;background:#f0f6ef;border-radius:50%;width:34px;height:34px;font-size:20px;color:var(--brand);z-index:2;padding:0;display:grid;place-items:center}.primary{width:100%;border:0;border-radius:14px;padding:14px;background:var(--brand);color:#fff;font-weight:800}.secondary{border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:#fff;color:var(--ink)}.danger-button{border-color:#e7bbb4;color:#9f382d}.empty{text-align:center;color:var(--muted);padding:26px 12px}.bottom{position:fixed;left:0;right:0;bottom:0;background:rgba(247,250,247,.96);backdrop-filter:blur(10px);border-top:1px solid var(--line);display:flex;justify-content:center;z-index:20;padding-bottom:env(safe-area-inset-bottom)}.nav{max-width:780px;width:100%;display:grid;grid-template-columns:repeat(4,1fr)}.nav button{border:0;background:none;padding:11px 4px 9px;color:var(--muted);font-size:11px;font-weight:750}.nav button span{display:block;font-size:21px;margin-bottom:2px}.nav button.active{color:var(--brand)}.screen{display:none}.screen.active{display:block}.modal{position:fixed;inset:0;background:rgba(30,20,15,.48);display:none;align-items:flex-end;z-index:50}.modal.open{display:flex}.sheet{background:var(--paper);width:100%;max-width:780px;margin:auto;border-radius:25px 25px 0 0;max-height:93vh;overflow:auto;padding:17px 17px 38px}.handle{width:45px;height:5px;border-radius:5px;background:#d1c2b8;margin:0 auto 15px}.close{float:right;border:0;background:#e5eeea;border-radius:50%;width:38px;height:38px;font-size:20px}.detail-art{height:170px;border-radius:20px;display:flex;align-items:center;justify-content:center;font-size:74px;background:linear-gradient(145deg,#dce8dc,#dce9f3);margin-bottom:15px}.sheet h2{font-family:Georgia,serif;font-size:30px;margin:5px 45px 8px 0}.tag{display:inline-block;background:#e4eee2;color:var(--brand);border-radius:99px;padding:6px 10px;font-size:12px;font-weight:800;margin:0 5px 5px 0}.section-title{margin:24px 0 10px}.checkrow{display:flex;gap:10px;align-items:flex-start;padding:10px 0;border-bottom:1px solid var(--line)}.checkrow input{margin-top:4px;transform:scale(1.22)}ol{padding-left:24px}li{margin:0 0 12px;line-height:1.48}.shopping-item{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;padding:12px 4px;border-bottom:1px solid var(--line);animation:fadeIn .2s ease}.shopping-item button{border:0;background:#edf4ed;color:var(--brand);width:38px;height:38px;border-radius:50%;font-size:19px}.toolbar{display:flex;gap:8px;margin-bottom:12px}.toolbar button{flex:1}.idea{padding:13px 0;border-bottom:1px solid var(--line)}.idea strong{display:block}.idea small{color:var(--muted)}.count{font-size:13px;color:var(--muted);margin:-4px 0 9px}.choice-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin:10px 0 18px}.choice{border:1px solid var(--line);border-radius:15px;background:#fff;padding:13px 10px;text-align:left}.choice.active{background:var(--brand);color:#fff;border-color:var(--brand)}.result-card{text-align:center;padding:8px 0 3px}.result-emoji{font-size:68px}.result-card h2{margin:6px 0}.spin{animation:spin .55s ease}.toast{position:fixed;left:50%;bottom:92px;transform:translateX(-50%);background:#2f2723;color:white;border-radius:999px;padding:10px 15px;font-size:13px;opacity:0;pointer-events:none;transition:.2s;z-index:80}.toast.show{opacity:1}.about-copy{line-height:1.55;color:var(--muted)}footer{text-align:center;font-size:12px;color:var(--muted);padding:12px 15px 0}@keyframes spin{0%{transform:rotate(-4deg) scale(.93);opacity:.45}55%{transform:rotate(4deg) scale(1.04)}100%{transform:none;opacity:1}}@keyframes fadeIn{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:none}}@media(min-width:600px){.quick-cats{grid-template-columns:repeat(4,1fr)}.grid{grid-template-columns:repeat(3,1fr)}.hero{padding-top:42px}.sheet{border-radius:25px;margin-bottom:18px}.modal{align-items:center}.choice-grid{grid-template-columns:repeat(3,1fr)}}

/* Tick-off method steps */
.method-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:22px}.method-heading .section-title{margin:0}.method-reset{border:0;background:var(--pale-blue,#dceaf3);color:var(--ink,#31423b);padding:8px 11px;border-radius:999px;font-weight:700;cursor:pointer}.method-list{display:grid;gap:10px;margin-top:12px}.method-step{display:grid;grid-template-columns:24px 30px 1fr;align-items:start;gap:9px;padding:12px;border:1px solid rgba(82,104,91,.18);border-radius:14px;background:#fff;cursor:pointer;transition:.18s ease}.method-step input{width:20px;height:20px;margin:2px 0 0;accent-color:var(--brand)}.method-number{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--pale-blue,#dceaf3);font-weight:800;color:var(--brand)}.method-text{line-height:1.48;transition:.18s ease}.method-step.done{background:#f1f3f2;border-color:#d7ddda}.method-step.done .method-text{color:#8b918e;text-decoration:line-through}.method-step.done .method-number{background:#dfe5e2;color:#89918d}

.photo-fallback{width:100%;height:100%;min-height:180px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;background:linear-gradient(135deg,#dceaf2,#e7efe2);color:#526454}.photo-fallback span{font-size:38px}.photo-fallback strong{font-size:14px}

.version-card{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:18px 0}.version-card>div{background:linear-gradient(145deg,#edf4e9,#e4eff7);border:1px solid var(--line);border-radius:14px;padding:12px}.version-card span{display:block;font-size:11px;color:var(--muted);margin-bottom:5px}.version-card strong{display:block;font-size:14px;color:var(--ink)}#versionTap{cursor:pointer;user-select:none}.small-note{font-size:12px}.developer-preview{background:#eef5eb;border:1px solid #cbdcc6;border-radius:15px;padding:14px;margin-top:14px}.developer-preview h3{margin:0 0 6px}.developer-preview p{margin:0}.quick-cat img{object-position:center}@media(max-width:470px){.version-card{grid-template-columns:1fr}}




/* Version 1.2: step ingredient pop-ups and clearer method controls */
.method-step{grid-template-columns:24px 30px minmax(0,1fr) auto;cursor:default}
.method-text{display:block;cursor:help;touch-action:pan-y;user-select:none}
.step-info-button{align-self:center;border:0;border-radius:999px;padding:7px 9px;background:#e9f1e6;color:var(--brand);font-size:11px;font-weight:800;cursor:pointer}
.method-step.done .step-info-button{opacity:.62}
.step-ingredient-popup{position:fixed;inset:0;display:none;align-items:flex-end;justify-content:center;padding:16px;background:rgba(25,31,28,.52);z-index:95}.step-ingredient-popup.open{display:flex}.step-popup-card{position:relative;width:min(520px,100%);max-height:78vh;overflow:auto;background:var(--paper);border-radius:22px;padding:22px 17px 18px;box-shadow:0 18px 50px rgba(0,0,0,.25)}.step-popup-close{position:absolute;right:12px;top:11px;border:0;width:36px;height:36px;border-radius:50%;background:#e5eeea;color:var(--ink);font-size:22px}.step-popup-kicker{margin:0;color:var(--brand);font-size:12px;font-weight:850;text-transform:uppercase;letter-spacing:.08em}.step-popup-card h3{margin:5px 42px 8px 0;font-family:Georgia,serif;font-size:24px}.step-popup-instruction{margin:0 0 15px;padding:11px 12px;border-radius:13px;background:#edf4eb;line-height:1.45}.step-popup-list{display:grid;gap:8px}.step-popup-list button{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;border:1px solid var(--line);border-radius:13px;padding:12px;text-align:left;background:#fff;color:var(--ink)}.step-popup-list button small{color:var(--brand);font-weight:750}.step-popup-list button.added{background:#eef5eb}.step-popup-empty{color:var(--muted);margin:8px 0}.wake-note{display:flex;gap:8px;align-items:flex-start;padding:11px 12px;border-radius:13px;background:#edf4eb;color:var(--ink)}
@media(max-width:470px){.method-step{grid-template-columns:22px 28px minmax(0,1fr)}.step-info-button{grid-column:3;justify-self:start;margin-top:5px}}


/* Version 1.3: linked photographic filters and timed method steps */
.filter-panel h2{margin-bottom:5px}.photo-filter-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin-top:12px}.photo-filter{position:relative;overflow:hidden;min-width:0;border:2px solid transparent;border-radius:15px;background:#fff;padding:0;text-align:left;box-shadow:0 4px 12px rgba(66,91,80,.08);cursor:pointer}.photo-filter img{display:block;width:100%;height:76px;object-fit:cover}.photo-filter strong{display:block;padding:8px 7px;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.photo-filter.active{border-color:var(--brand);box-shadow:0 0 0 3px rgba(76,112,87,.15)}.photo-filter.active:after{content:'✓';position:absolute;right:7px;top:7px;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--brand);color:#fff;font-weight:900}.filter-summary{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:13px;padding-top:11px;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}.filter-summary button{border:0;border-radius:999px;padding:7px 10px;background:#e8f0e5;color:var(--brand);font-weight:800}.timer-button{background:#e4edf7;color:#315873}.timer-button.running{background:#315873;color:#fff;min-width:88px}.timer-button.finished{background:#dcebd8;color:#315b3d}@media(max-width:520px){.photo-filter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.photo-filter img{height:92px}.photo-filter strong{font-size:13px}.filter-summary{align-items:flex-start}.method-step .timer-button{grid-column:3;justify-self:start;margin-top:5px}}


/* Version 1.5: persistent cooking alarm and corrected accompaniment filters */
.timer-alarm{position:fixed;inset:0;z-index:140;display:none;align-items:center;justify-content:center;padding:18px;background:rgba(25,31,28,.72);backdrop-filter:blur(5px)}
.timer-alarm.open{display:flex;animation:alarmBackdrop 1s ease-in-out infinite alternate}
.timer-alarm-card{width:min(520px,100%);border-radius:26px;padding:25px 20px 22px;text-align:center;background:var(--paper);box-shadow:0 24px 80px rgba(0,0,0,.36);border:4px solid #e1a83f}
.timer-alarm-icon{font-size:58px;animation:alarmBell .7s ease-in-out infinite alternate}.timer-alarm-kicker{margin:4px 0 5px;color:#9a6515;font-weight:900;text-transform:uppercase;letter-spacing:.1em;font-size:12px}.timer-alarm-card h2{margin:0;font-family:Georgia,serif;font-size:30px;color:var(--green)}.timer-alarm-step{font-weight:850;color:var(--muted);margin:8px 0}.timer-alarm-instruction{margin:15px 0 19px;padding:18px;border-radius:17px;background:#edf4eb;font-size:22px;font-weight:800;line-height:1.35;color:var(--ink)}.timer-dismiss{width:100%;font-size:18px;padding:14px}.photo-filter img[src$="bread.jpg"],.photo-filter img[src$="salad.jpg"],.photo-filter img[src$="vegetables.jpg"]{object-position:center}
@keyframes alarmBell{from{transform:rotate(-8deg) scale(1)}to{transform:rotate(8deg) scale(1.07)}}@keyframes alarmBackdrop{from{background:rgba(25,31,28,.68)}to{background:rgba(119,83,21,.76)}}


/* Version 1.6: Heather's Kitchen recipe editor */
.editor-shell{padding-bottom:24px}.editor-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.editor-header h2{font-family:Georgia,serif;font-size:29px;margin:0 0 5px}.editor-actions{display:flex;flex-wrap:wrap;gap:8px}.editor-actions button,.editor-file-label{border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:#fff;color:var(--ink);font-weight:750;cursor:pointer}.editor-file-label input{display:none}.editor-danger{color:#9f382d!important;border-color:#e7bbb4!important}.editor-layout{display:grid;grid-template-columns:minmax(190px, .7fr) minmax(0,1.5fr);gap:14px}.editor-list{max-height:70vh;overflow:auto}.editor-search{margin-bottom:10px}.editor-recipe-button{display:block;width:100%;border:0;border-bottom:1px solid var(--line);padding:12px 9px;background:transparent;text-align:left;color:var(--ink)}.editor-recipe-button.active{background:#eaf2e7;border-radius:11px;color:var(--green);font-weight:850}.editor-form label{display:block;font-size:12px;font-weight:800;color:var(--muted);margin:12px 0 5px}.editor-form input,.editor-form textarea,.editor-form select{width:100%;border:1px solid var(--line);border-radius:12px;padding:11px;background:#fff;color:var(--ink)}.editor-form textarea{min-height:84px;resize:vertical;line-height:1.45}.editor-two{display:grid;grid-template-columns:1fr 1fr;gap:10px}.editor-section-title{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:20px 0 8px}.editor-section-title h3{margin:0}.editor-row{border:1px solid var(--line);background:#fff;border-radius:14px;padding:11px;margin-bottom:9px}.editor-row-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:7px}.editor-row-head strong{font-size:13px}.editor-mini-actions{display:flex;gap:5px}.editor-mini-actions button{border:1px solid var(--line);background:#f8faf8;border-radius:9px;padding:6px 8px}.editor-ingredient-grid{display:grid;grid-template-columns:1.2fr .65fr .55fr;gap:7px}.editor-savebar{position:sticky;bottom:78px;display:flex;gap:8px;padding:10px;margin-top:15px;background:rgba(247,250,247,.95);border:1px solid var(--line);border-radius:15px;backdrop-filter:blur(8px)}.editor-savebar .primary{flex:1}.editor-note{padding:11px 12px;border-radius:12px;background:#edf4eb;color:var(--muted);font-size:12px;line-height:1.45}.editor-empty{padding:30px;text-align:center;color:var(--muted)}
@media(max-width:650px){.editor-layout{grid-template-columns:1fr}.editor-list{max-height:240px}.editor-two,.editor-ingredient-grid{grid-template-columns:1fr}.editor-savebar{bottom:76px}}

.editor-ingredient-grid-v2{display:grid;grid-template-columns:.7fr .8fr 1.25fr 1fr;gap:8px;align-items:start}.editor-ingredient-grid-v2 label{margin:0 0 4px}.editor-custom{margin-top:6px}.hidden{display:none!important}.editor-timer-row{display:flex;align-items:end;gap:14px;margin-top:9px;padding-top:9px;border-top:1px dashed var(--line)}.editor-timer-row .timer-check{display:flex;align-items:center;gap:7px;margin:0;font-size:13px}.editor-timer-row .timer-check input{width:auto}.timer-minutes{max-width:130px}.timer-minutes label{margin:0 0 4px}.about-copy h3{font-family:Georgia,serif;font-size:24px;margin:0 0 10px;color:var(--brand)}@media(max-width:760px){.editor-ingredient-grid-v2{grid-template-columns:1fr 1fr}}@media(max-width:430px){.editor-ingredient-grid-v2{grid-template-columns:1fr}}


/* v1.9 desktop spreadsheet editor */
.editor-layout{grid-template-columns:220px minmax(860px,1fr);align-items:start}.editor-workspace{overflow-x:auto}.editor-sidebar{position:sticky;top:12px}.editor-form input,.editor-form textarea,.editor-form select{border-radius:7px}.ingredient-sheet,.method-sheet{min-width:850px;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#fff}.ingredient-sheet-head,.ingredient-sheet-row{display:grid;grid-template-columns:38px 90px 115px minmax(190px,1.35fr) minmax(180px,1.15fr) 96px;align-items:stretch}.ingredient-sheet-head,.method-sheet-head{background:#eef3ec;font-size:12px;font-weight:850;color:var(--muted);border-bottom:1px solid var(--line)}.ingredient-sheet-head span,.method-sheet-head span{padding:9px 7px}.ingredient-sheet-row{border-bottom:1px solid var(--line)}.ingredient-sheet-row:last-child{border-bottom:0}.ingredient-sheet-row>input,.ingredient-sheet-row>div>select,.ingredient-sheet-row>div>input{height:100%;min-height:40px;border:0!important;border-right:1px solid var(--line)!important;border-radius:0!important;padding:8px!important}.ingredient-sheet-row>div{min-width:0}.ingredient-sheet-row .editor-custom{border-top:1px dashed var(--line)!important;height:auto}.sheet-number{display:flex;align-items:center;justify-content:center;background:#fafbf9;color:var(--muted);font-weight:800;border-right:1px solid var(--line)}.sheet-actions{display:flex!important;align-items:center;justify-content:center;gap:3px;padding:4px;border-left:0}.sheet-actions button,.note-sheet-row>button{border:1px solid var(--line);background:#f8faf8;border-radius:6px;padding:5px 7px;cursor:pointer}.editor-add-row{width:100%;margin-top:7px;padding:10px;border:1px dashed #a9b9a2;background:#f5f8f3;color:var(--green);border-radius:8px;font-weight:850;cursor:pointer}.method-sheet-head,.method-sheet-row{display:grid;grid-template-columns:38px minmax(520px,1fr) 135px 96px}.method-sheet-row{border-bottom:1px solid var(--line);align-items:stretch}.method-sheet-row:last-child{border-bottom:0}.method-sheet-row textarea{border:0!important;border-right:1px solid var(--line)!important;border-radius:0!important;min-height:74px!important;padding:9px!important}.sheet-timer{padding:8px;border-right:1px solid var(--line);display:grid;grid-template-columns:auto 55px;gap:4px;align-content:center}.sheet-timer label{grid-column:1/-1;display:flex!important;align-items:center;gap:5px;margin:0!important}.sheet-timer label input{width:auto!important}.sheet-timer>input{padding:5px!important}.sheet-timer small{align-self:center}.note-sheet-row{display:grid;grid-template-columns:38px 1fr 45px;border:1px solid var(--line);border-radius:8px;overflow:hidden;margin-bottom:6px}.note-sheet-row textarea{border:0!important;border-radius:0!important;min-height:58px!important}.note-sheet-row>button{margin:6px}.editor-section-title{margin-top:26px}.editor-savebar{bottom:12px}.methods-search{margin:10px 0 14px}.methods-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}.method-card{display:grid;grid-template-columns:32px 1fr;text-align:left;gap:3px 8px;align-items:center;border:1px solid var(--line);border-radius:13px;padding:12px;background:#fff;cursor:pointer;color:var(--ink)}.method-card:hover{background:#f3f7f1;border-color:#b7c8b0}.method-card>span{grid-row:1/3;font-size:22px}.method-card strong{font-size:15px}.method-card small{color:var(--muted);line-height:1.25}.method-word{display:inline;border:0;border-bottom:2px dotted var(--brand);padding:0 1px;background:transparent;color:inherit;font:inherit;font-weight:750;cursor:pointer}.method-word:hover{color:var(--brand);background:#fff5ee}.method-help-sheet{max-width:620px!important}.method-help-icon{font-size:34px;margin-bottom:5px}.method-help-block{border-top:1px solid var(--line);padding:13px 0 2px}.method-help-block strong,.method-result strong{color:var(--green)}.method-help-block p,.method-result p{margin:5px 0 10px;line-height:1.5}.method-result{background:#f0f5ed;border-radius:12px;padding:13px;margin-top:10px}.method-result p{margin-bottom:0}.nav{grid-template-columns:repeat(5,1fr)!important}
@media(max-width:900px){.editor-layout{grid-template-columns:190px minmax(760px,1fr)}}

/* v1.11 recipe scaling */
.recipe-scaler{margin:16px 0 8px;padding:14px;border:1px solid var(--border);border-radius:16px;background:var(--soft)}.scaler-title{font-weight:800;margin-bottom:10px}.recipe-scaler label{font-weight:700}.scaler-input-row{display:flex;align-items:center;gap:9px;margin-top:7px}.scaler-input-row input{max-width:150px;font-size:18px;font-weight:700}.serves-result{margin-top:10px;font-size:16px}.serves-result strong{font-size:22px}.scaler-reset{margin-top:10px}.serves-static{margin:10px 0;font-weight:600}

.step-actions{display:flex;align-items:center;justify-content:flex-end;gap:7px;align-self:center;flex-wrap:wrap}.step-actions .step-info-button{margin:0}@media(max-width:520px){.step-actions{grid-column:3;justify-self:start;justify-content:flex-start;margin-top:5px}.method-step .step-actions .timer-button{grid-column:auto;margin-top:0}}

/* v1.12.8: restore Preparation and Cooking notes around Method */
.recipe-notes-box{margin-top:20px}.recipe-notes-box .section-title{margin-bottom:10px}.recipe-notes-list{display:grid;gap:9px}.recipe-note-item{background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px 14px;line-height:1.48}.preparation-box .recipe-note-item{background:linear-gradient(135deg,#f7faf5,#eef6f0)}.cooking-notes-box{margin-top:22px}.cooking-notes-box .recipe-note-item{background:linear-gradient(135deg,#f7fafc,#eef5fa)}

.method-help-drawing{display:block;width:min(240px,72%);max-height:165px;object-fit:contain;margin:0 auto 10px;background:#fff;border-radius:10px}.method-help-sheet #methodHelpBody{color:var(--ink)}

/* v1.15.0: private notes + illustrated chopping guide */
.cut-guide-wrap{margin:12px 0 20px;padding:14px;border:1px solid var(--line);border-radius:16px;background:linear-gradient(135deg,#fffaf3,#f7faf5)}
.cut-guide-wrap h3{margin:0 0 4px;font-family:Georgia,serif}.cut-guide-grid{display:grid;grid-template-columns:repeat(5,minmax(92px,1fr));gap:8px;margin-top:10px}.cut-guide-card{border:1px solid #dfd6ca;border-radius:12px;background:#fff;padding:8px 5px;color:var(--ink);font-weight:800;cursor:pointer}.cut-guide-card svg{width:100%;height:76px;display:block}.cut-guide-card span{display:block;font-size:12px;line-height:1.15}.cut-guide-card:hover{border-color:#bba783;background:#fffdf9}.personal-notes-box{margin-top:22px;padding:14px;border:1px solid #d8d2c8;border-radius:16px;background:#fffaf3}.personal-notes-title{display:flex;align-items:baseline;justify-content:space-between;gap:10px}.personal-notes-title .section-title{margin:0}.personal-notes-title span{font-size:11px;color:var(--muted);font-weight:700}.personal-notes-box textarea{width:100%;min-height:96px;resize:vertical;border:1px solid var(--line);border-radius:12px;padding:11px;font:inherit;line-height:1.45;background:#fff}.notes-count{text-align:right;font-size:11px;color:var(--muted);margin-top:4px}
@media(max-width:600px){.cut-guide-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.cut-guide-card svg{height:84px}}

/* v1.15.1 illustrated Methods page */
.cut-guide-card img{width:100%;height:92px;display:block;object-fit:contain;border-radius:9px;margin-bottom:4px;background:#fffdf9}
.method-card{grid-template-columns:72px 1fr;min-height:92px}
.method-card-art{grid-row:1/3;width:72px;height:68px;object-fit:contain;border-radius:9px;background:#fffdf9}
.method-card-fallback{grid-row:1/3;font-size:22px}
@media(max-width:600px){.cut-guide-card img{height:104px}.methods-grid{grid-template-columns:1fr}.method-card{grid-template-columns:82px 1fr}.method-card-art{width:82px;height:76px}}

/* v1.15.3 artwork fit fix: never crop help art */
.cut-guide-card{overflow:hidden;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start}
.cut-guide-card img{box-sizing:border-box;width:100%!important;height:108px!important;object-fit:contain!important;object-position:center center!important;padding:4px!important;background:#fffdf9!important}
.method-card{overflow:hidden}
.method-card-art{box-sizing:border-box;object-fit:contain!important;object-position:center center!important;padding:3px!important;background:#fffdf9!important}
@media(max-width:600px){.cut-guide-card img{height:118px!important}}

/* v1.15.4 author search */
.search-stack{display:grid;gap:10px}.author-search-row{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:center}.author-search-row label{font-size:13px;font-weight:850;color:var(--muted)}@media(max-width:430px){.author-search-row{grid-template-columns:1fr}.author-search-row label{margin-bottom:-5px}}
.recipe-author{margin:-2px 0 10px;color:var(--muted);font-size:13px}.recipe-author strong{color:var(--ink)}

/* v1.15.6 image system repair */
.method-help-drawing{width:min(420px,94%)!important;max-height:290px!important;object-fit:contain!important;object-position:center center!important;padding:2px!important;background:#fffdf9!important}
.cut-guide-popup-art{width:min(440px,96%)!important;max-height:300px!important}
.cut-guide-card{padding:7px!important}
.cut-guide-card img{width:100%!important;height:132px!important;object-fit:contain!important;object-position:center center!important;padding:1px!important}
.method-card{grid-template-columns:104px 1fr!important;min-height:116px!important}
.method-card-art{width:104px!important;height:96px!important;object-fit:contain!important;object-position:center center!important;padding:1px!important}
@media(max-width:600px){.cut-guide-card img{height:142px!important}.method-card{grid-template-columns:112px 1fr!important}.method-card-art{width:112px!important;height:102px!important}.method-help-drawing{width:98%!important;max-height:275px!important}}

/* v1.15.7 bottom Methods review fixes */
.methods-grid .method-card{grid-template-columns:138px 1fr!important;min-height:150px!important;padding:10px!important}
.methods-grid .method-card-art{width:138px!important;height:128px!important;object-fit:contain!important;object-position:center!important;padding:0!important;background:#fffdf9!important}
@media(max-width:600px){.methods-grid .method-card{grid-template-columns:145px 1fr!important}.methods-grid .method-card-art{width:145px!important;height:134px!important}}


/* v1.15.8 final Methods/Chopping artwork system
   Chopping examples are now native SVGs, so generated-image crop lines cannot recur. */
.cut-guide-card{overflow:hidden!important;align-items:center!important}
.cut-guide-svg{display:block;width:100%;height:112px;margin:0 auto 4px;background:#fffdf9;border-radius:9px;overflow:visible}
.cut-guide-card .cut-guide-svg{padding:8px 10px}
.cut-guide-popup-art{display:block;width:min(360px,88%)!important;height:230px!important;margin:0 auto 12px;padding:12px!important;background:#fffdf9;border-radius:12px}
.methods-grid .method-card{grid-template-columns:88px 1fr!important;min-height:106px!important;padding:10px!important;column-gap:10px!important}
.methods-grid .method-card-art{width:88px!important;height:84px!important;object-fit:contain!important;object-position:center!important;padding:2px!important;background:#fffdf9!important;border-radius:10px!important}
@media(max-width:600px){.cut-guide-svg{height:122px}.methods-grid .method-card{grid-template-columns:96px 1fr!important}.methods-grid .method-card-art{width:96px!important;height:90px!important}}

/* v1.15.10 — use desktop space more naturally without changing mobile layout */
@media (min-width: 900px){
  .app{max-width:1120px}
  .nav{max-width:1120px}
  .content{padding-left:22px;padding-right:22px}
  .hero{padding-left:22px;padding-right:22px}
  .grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
  .sheet{max-width:1060px;padding:22px 28px 42px}
  #recipeDetail{font-size:15px}
  #recipeDetail .checkrow{padding:11px 4px}
  #recipeDetail .method-step{padding:14px 16px;column-gap:12px}
  #recipeDetail .method-text{line-height:1.58}
  #recipeDetail .preparation-box,
  #recipeDetail .cooking-notes-box,
  #recipeDetail .personal-notes-box{line-height:1.58}
  .methods-panel .meta,.about-copy{line-height:1.65}
}

/* v1.15.12 shopping delete clarity */
.shopping-delete{font-size:18px;line-height:1;background:#fff;border:1px solid #d9d7cf;border-radius:9px;min-width:38px;min-height:36px;cursor:pointer}.shopping-delete:hover{background:#f7eeee;border-color:#caa}

@media(min-width:700px){.recipe-scaler{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:24px;align-items:end}.recipe-scaler .scaler-title,.recipe-scaler label,.recipe-scaler .serves-result{grid-column:1}.recipe-scaler .scaler-reset{grid-column:2;grid-row:2 / span 2;align-self:end;margin:0 0 0 auto}}

/* v1.15.16 global artwork consistency */
.method-help-drawing{box-sizing:border-box!important;width:min(440px,96%)!important;height:310px!important;max-height:310px!important;object-fit:contain!important;object-position:center center!important;padding:12px!important;background:#fffdf9!important;border-radius:12px!important}
@media(max-width:600px){.method-help-drawing{width:98%!important;height:270px!important;max-height:270px!important;padding:10px!important}}

/* v1.15.16 — Methods becomes the master artwork review page */
.methods-subheading{margin:18px 0 8px;font-family:Georgia,serif}.equipment-heading{margin-top:24px}
.equipment-card small{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}


/* v1.16.0 — Smart Shopping List */
.ingredient-actions{display:grid;grid-template-columns:auto 1fr;gap:9px;margin-top:12px}.ingredient-actions .primary{width:auto}.manual-shop-row{display:grid;grid-template-columns:1fr auto;gap:8px;margin-bottom:12px}.shopping-group{margin:14px 0 20px}.shopping-group h3{font-size:14px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:0 0 5px}.shop-check{display:flex;align-items:center;gap:11px;min-width:0}.shop-check span{line-height:1.35}.shop-check input,.checkrow input{appearance:none;-webkit-appearance:none;width:22px;height:22px;min-width:22px;border:2px solid #89958f;border-radius:5px;background:#fff;display:grid;place-content:center;transform:none;margin-top:0}.shop-check input:checked::after,.checkrow input:checked::after{content:'×';font-size:24px;line-height:18px;font-weight:800;color:var(--green);transform:translateY(-1px)}.shop-check input:checked+span{text-decoration:line-through;color:var(--muted)}
@media(max-width:480px){.ingredient-actions{grid-template-columns:1fr}.ingredient-actions .primary{width:100%}}

.ingredient-choice{flex:0 0 auto;width:30px;height:30px;border-radius:8px;border:2px solid var(--brand);font-size:18px;font-weight:900;line-height:1;background:#fff;color:var(--brand);display:flex;align-items:center;justify-content:center;padding:0;cursor:pointer}
.ingredient-choice.needed{background:var(--brand);color:#fff}
.ingredient-choice.have{border-color:#b7b7b7;color:#777;background:#f3f3f3}
.washing-up-box{margin:14px 0 6px;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff}
.washing-up-summary{width:100%;border:0;background:transparent;display:grid;grid-template-columns:auto 1fr auto;gap:9px;align-items:center;text-align:left;padding:12px 14px;color:var(--ink);cursor:pointer}
.washing-up-level{font-size:12px;font-weight:800;color:var(--muted)}
.washing-up-breakdown{padding:0 14px 12px 42px;font-size:13px;color:var(--muted)}
.washing-up-breakdown p{margin:0 0 6px}
.washing-up-breakdown ul{margin:0;padding-left:18px}
.washing-up-breakdown li{margin:2px 0}
.washing-up-box.green{border-left:5px solid #4f9b62}
.washing-up-box.amber{border-left:5px solid #d6922f}
.washing-up-box.red{border-left:5px solid #c75a4d}

.washing-up-simple{margin:14px 0 6px;padding:10px 13px;border:1px solid var(--line);border-radius:12px;background:#fff;display:flex;align-items:center;gap:8px;font-size:14px}
.washing-up-simple.green{border-left:5px solid #4f9b62}
.washing-up-simple.amber{border-left:5px solid #f0b500;background:#fffdf3}
.washing-up-simple.red{border-left:5px solid #c75a4d}

/* v1.18.0 washing-up filters + Ideas ingredient matcher */
.washing-filter-wrap{margin-top:15px;padding-top:13px;border-top:1px solid var(--line)}
.washing-filter-wrap h3{font-size:14px;margin:0 0 9px}
.washing-filter{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}
.washing-filter-button{border:1px solid var(--line);background:#fff;border-radius:12px;padding:9px 6px;font-size:12px;font-weight:800;color:var(--ink)}
.washing-filter-button.active{box-shadow:0 0 0 3px rgba(127,152,112,.18);border-color:var(--brand);background:#f3f7f1}
.washing-filter-button.green.active{border-color:#4f9b62}.washing-filter-button.amber.active{border-color:#f0b500;background:#fff9df}.washing-filter-button.red.active{border-color:#c75a4d}
.card-title-row{display:grid;grid-template-columns:minmax(0,1fr) auto 34px;align-items:start;gap:7px}
.card-title-row h3{min-width:0;margin-right:0}
.washing-badge{flex:0 0 auto;border-radius:999px;padding:4px 7px;font-size:10px;font-weight:850;white-space:nowrap;border:1px solid var(--line);background:#fff}
.washing-badge.green{background:#edf7ef;border-color:#b9d8bf}.washing-badge.amber{background:#fff9df;border-color:#f0b500}.washing-badge.red{background:#fff0ed;border-color:#e7b9b1}
.author-only-panel{padding-top:14px;padding-bottom:14px}
.author-only-panel .author-search-row{margin:0}
.have-panel h2{margin-bottom:5px}.have-panel .search-row{margin-top:12px}
.text-button{border:0;background:none;color:var(--brand);font-weight:800;padding:9px 2px 3px;cursor:pointer}
.compact-empty{padding:18px 6px}
.have-result{width:100%;border:1px solid var(--line);background:#fff;border-radius:14px;padding:12px;margin-top:9px;text-align:left;display:grid;grid-template-columns:1fr auto;gap:4px 10px;color:var(--ink)}
.have-result-main strong{display:block;font-size:14px}.have-result-main small{display:block;color:var(--muted);margin-top:2px}
.have-match{font-weight:900;color:var(--brand);align-self:start}
.have-missing{grid-column:1/-1;font-size:11px;color:var(--muted);line-height:1.35}.have-missing.ready{color:#4f7b58;font-weight:800}
@media(max-width:520px){.washing-filter{grid-template-columns:repeat(2,1fr)}.washing-badge{font-size:9px;padding:4px 6px}.have-panel .search-row{grid-template-columns:1fr}.have-panel .search-button{padding:12px}}

/* v1.18.1 — Ideas refinement and card spacing */
.ideas-search-row{margin-top:10px}.ideas-search-row + #ideaList:empty{display:none}
@media(max-width:520px){.card-title-row{grid-template-columns:minmax(0,1fr) auto 34px}.washing-badge{align-self:start}}


/* v1.19.19 personalised banner + expressive decision artwork */
.personalised-hero{display:grid;grid-template-columns:minmax(0,1fr) 150px;gap:14px;align-items:center;overflow:hidden}
.hero-copy{min-width:0}.hero-welcome-art{width:150px;height:132px;object-fit:cover;object-position:center 38%;border-radius:22px;border:1px solid rgba(255,255,255,.72);box-shadow:0 8px 22px rgba(43,72,57,.16);background:#fff}
.personalised-hero h1{margin-bottom:5px}.decision-buttons .surprise{display:grid;grid-template-columns:minmax(0,1fr) 86px;align-items:center;gap:8px;overflow:hidden}.decision-face{width:82px;height:82px;border-radius:50%;object-fit:cover;object-position:center;background:#fff;border:3px solid rgba(255,255,255,.8);box-shadow:0 4px 14px rgba(55,80,67,.14)}
.name-preference{margin:18px 0;padding:14px;border:1px solid var(--line);border-radius:15px;background:linear-gradient(135deg,#fffaf3,#f2f7ef)}.name-preference h3{margin:0 0 4px}.name-preference-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;margin-top:9px}.name-preference-row .secondary{white-space:nowrap}
@media(max-width:520px){.personalised-hero{grid-template-columns:minmax(0,1fr) 104px}.hero-welcome-art{width:104px;height:108px;border-radius:18px}.personalised-hero h1{font-size:29px}.decision-buttons .surprise{grid-template-columns:minmax(0,1fr) 72px}.decision-face{width:68px;height:68px}.name-preference-row{grid-template-columns:1fr}.name-preference-row .secondary{width:100%}}

/* v1.19.19 home artwork polish */
.personalised-hero{
  background:linear-gradient(135deg,#6f8f63 0%,#88a978 30%,#d9a76c 67%,#b67a73 100%);
}
.personalised-hero h1{
  font-family:Georgia,serif;
  color:#fff8e9;
  text-shadow:0 2px 0 rgba(72,77,52,.18),0 4px 14px rgba(53,67,54,.22);
}
.personalised-hero .eyebrow{
  color:#fff4d9;
  opacity:1;
}
.decision-face{
  object-fit:cover;
  object-position:center;
}

/* v1.19.19 — approved phone artwork */
.phone-art-hero{
  padding:18px 16px 6px;
  background:transparent;
}
.phone-art-banner-wrap{
  position:relative;
  max-width:980px;
  margin:0 auto;
}
.phone-art-banner{
  display:block;
  width:100%;
  height:auto;
  object-fit:contain;
  border-radius:22px;
  box-shadow:0 8px 24px rgba(82,35,92,.12);
}
.personal-name-pill{
  position:absolute;
  left:22px;
  bottom:16px;
  z-index:2;
  padding:7px 13px;
  border-radius:999px;
  background:rgba(255,250,244,.93);
  border:1px solid rgba(91,22,101,.20);
  color:#5b1665;
  font-size:14px;
  box-shadow:0 3px 10px rgba(65,34,66,.10);
}
.personal-name-pill strong{font-weight:900}
.decision-buttons .surprise{
  grid-template-columns:minmax(0,1fr) 96px;
  min-height:116px;
  overflow:visible;
}
.decision-face{
  width:92px !important;
  height:92px !important;
  object-fit:contain !important;
  object-position:center !important;
  border-radius:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  padding:2px;
}
#surpriseStart{
  border-color:#d9d9b4;
  background:linear-gradient(135deg,#fbfbef,#f5f5e4);
}
#randomStart{
  border-color:#e4cfe8;
  background:linear-gradient(135deg,#fbf4fc,#f1e7f4);
}
#surpriseStart h2{color:#355c32}
#randomStart h2{color:#6a2475}
@media(max-width:520px){
  .phone-art-hero{padding:10px 10px 4px}
  .phone-art-banner{border-radius:16px}
  .personal-name-pill{
    left:12px;
    bottom:10px;
    padding:5px 9px;
    font-size:12px;
  }
  .decision-buttons .surprise{
    grid-template-columns:minmax(0,1fr) 76px;
    min-height:100px;
  }
  .decision-face{
    width:74px !important;
    height:74px !important;
  }
}

/* v1.19.19 — faces are standalone artwork only */
.decision-face{
  border:none !important;
  outline:none !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  padding:0 !important;
}

/* v1.19.19 — dynamic [username]'s Recipes banner */
.dynamic-recipe-banner{
  position:relative;
  min-height:230px;
  overflow:hidden;
  border:4px solid #5b1665;
  border-radius:28px;
  background:#fffaf4;
  box-shadow:0 8px 24px rgba(82,35,92,.12);
}
.dynamic-recipe-banner::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  border:2px solid rgba(91,22,101,.75);
  border-radius:20px;
  margin:8px;
}
.dynamic-banner-copy{
  position:relative;
  z-index:2;
  width:54%;
  min-height:230px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  padding:24px 18px;
  background:linear-gradient(90deg,#fffaf4 82%,rgba(255,250,244,.86) 92%,rgba(255,250,244,0));
}
.dynamic-banner-copy .made-love{
  color:#5b1665;
  font-weight:900;
  letter-spacing:.12em;
  font-size:13px;
}
.dynamic-banner-copy h1{
  margin:5px 0 0;
  color:#5b1665;
  font-family:Georgia,"Times New Roman",serif;
  font-style:italic;
  font-size:clamp(38px,6vw,72px);
  line-height:.95;
  text-align:center;
  text-shadow:none;
}
.banner-heart{
  color:#5b1665;
  font-size:34px;
  line-height:1;
  margin-top:5px;
}
.banner-herbs{
  position:absolute;
  z-index:1;
  right:0;
  top:0;
  width:53%;
  height:100%;
  background-image:url("ui-art/mums-recipes-phone-banner.webp?v=1.19.19");
  background-size:auto 145%;
  background-position:88% 51%;
  background-repeat:no-repeat;
}
@media(max-width:520px){
  .dynamic-recipe-banner{min-height:180px;border-width:3px;border-radius:20px}
  .dynamic-banner-copy{width:59%;min-height:180px;padding:16px 8px}
  .dynamic-banner-copy .made-love{font-size:9px;letter-spacing:.08em}
  .dynamic-banner-copy h1{font-size:clamp(30px,10vw,46px)}
  .banner-herbs{width:49%;background-size:auto 138%;background-position:89% 50%}
}

/* v1.19.19 — responsive personalised banner */
.phone-art-hero{
  padding:14px 18px 8px !important;
  background:transparent !important;
}
.dynamic-recipe-banner{
  position:relative;
  width:min(100%, 1180px);
  min-height:250px;
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(190px, 28%) minmax(340px, 44%) minmax(190px, 28%);
  align-items:center;
  overflow:hidden;
  border:4px solid #5b1665;
  border-radius:28px;
  background:#fffaf4;
  box-shadow:0 8px 24px rgba(82,35,92,.12);
}
.dynamic-recipe-banner::after{
  content:"";
  position:absolute;
  inset:8px;
  border:2px solid rgba(91,22,101,.78);
  border-radius:20px;
  pointer-events:none;
  z-index:5;
}
.banner-side-art{
  width:100%;
  height:250px;
  object-fit:contain;
  object-position:center;
  display:block;
  position:relative;
  z-index:1;
  pointer-events:none;
}
.banner-left-art{justify-self:start;}
.banner-right-art{justify-self:end;}
.dynamic-banner-copy{
  position:relative;
  z-index:3;
  width:auto !important;
  min-height:auto !important;
  padding:20px 12px !important;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  text-align:center;
  background:#fffaf4 !important;
}
.dynamic-banner-copy .made-love{
  color:#5b1665;
  font-weight:900;
  letter-spacing:.13em;
  font-size:13px;
  margin-bottom:4px;
}
.dynamic-banner-copy h1{
  margin:0;
  color:#5b1665;
  font-family:Georgia,"Times New Roman",serif;
  font-style:italic;
  font-size:clamp(40px,5vw,70px);
  line-height:.98;
  text-align:center;
  white-space:normal;
}
.banner-subtitle{
  margin-top:12px;
  color:#5b1665;
  font-family:Georgia,"Times New Roman",serif;
  font-style:italic;
  font-size:clamp(18px,2vw,26px);
}
.banner-est{
  margin-top:8px;
  color:#5b1665;
  font-weight:800;
  font-size:12px;
  letter-spacing:.16em;
}
.banner-herbs{display:none !important;}
.personal-name-pill{display:none !important;}

@media (max-width:900px){
  .dynamic-recipe-banner{
    grid-template-columns:24% 52% 24%;
    min-height:210px;
  }
  .banner-side-art{height:210px;}
  .dynamic-banner-copy h1{font-size:clamp(34px,7vw,56px);}
  .banner-subtitle{font-size:clamp(16px,2.6vw,22px);}
}

@media (max-width:600px){
  .phone-art-hero{padding:8px 10px 4px !important;}
  .dynamic-recipe-banner{
    grid-template-columns:22% 56% 22%;
    min-height:170px;
    border-width:3px;
    border-radius:20px;
  }
  .dynamic-recipe-banner::after{
    inset:6px;
    border-radius:14px;
  }
  .banner-side-art{
    height:165px;
    object-fit:contain;
  }
  .dynamic-banner-copy{
    padding:10px 2px !important;
  }
  .dynamic-banner-copy .made-love{
    font-size:8px;
    letter-spacing:.08em;
    margin-bottom:3px;
  }
  .dynamic-banner-copy h1{
    font-size:clamp(28px,9vw,40px);
  }
  .banner-subtitle{
    margin-top:6px;
    font-size:12px;
    line-height:1.1;
  }
  .banner-est{
    margin-top:5px;
    font-size:8px;
    letter-spacing:.12em;
  }
}

/* v1.19.19 — standalone face glyphs: no image background, no tile */
.decision-emoji{
  display:flex !important;
  align-items:center;
  justify-content:center;
  width:92px !important;
  height:92px !important;
  font-size:72px !important;
  line-height:1 !important;
  background:transparent !important;
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  padding:0 !important;
  overflow:visible !important;
}
@media(max-width:520px){
  .decision-emoji{
    width:74px !important;
    height:74px !important;
    font-size:58px !important;
  }
}

/* v1.19.19 — approved adult artwork */
.banner-copy-lines{
  margin-top:12px;
  display:grid;
  gap:6px;
  max-width:620px;
}
.banner-copy-lines p{
  margin:0;
  color:#303047;
  font-size:clamp(14px,1.55vw,19px);
  line-height:1.3;
  font-weight:400 !important;
  font-family:system-ui,-apple-system,"Segoe UI",sans-serif;
}
.dynamic-banner-copy .made-love{
  text-transform:none !important;
  letter-spacing:.03em !important;
  font-family:Georgia,"Times New Roman",serif;
  font-style:italic;
  font-weight:500 !important;
  font-size:18px;
}
.decision-buttons .surprise{
  grid-template-columns:minmax(0,1fr) 150px !important;
  min-height:150px !important;
  overflow:hidden !important;
}
.decision-face{
  display:block !important;
  width:150px !important;
  height:145px !important;
  object-fit:contain !important;
  object-position:center bottom !important;
  padding:0 !important;
  margin:0 !important;
  background:transparent !important;
  border:0 !important;
  outline:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}
.ideas-panel-heading{
  display:flex;
  align-items:center;
  gap:18px;
  margin-bottom:8px;
}
.ideas-feature-art{
  flex:0 0 auto;
  width:112px;
  height:98px;
  object-fit:contain;
  object-position:center;
  background:transparent;
}
.ideas-panel-heading h2{
  margin:3px 0 0;
}
@media(max-width:600px){
  .decision-buttons .surprise{
    grid-template-columns:minmax(0,1fr) 104px !important;
    min-height:116px !important;
  }
  .decision-face{
    width:104px !important;
    height:108px !important;
  }
  .ideas-panel-heading{
    gap:12px;
  }
  .ideas-feature-art{
    width:82px;
    height:72px;
  }
  .banner-copy-lines p{
    font-size:11px;
  }
  .dynamic-banner-copy .made-love{
    font-size:12px;
  }
}

/* v1.19.19 — restore proven dynamic banner */
.phone-art-hero{
  padding:18px 16px 8px !important;
  background:transparent !important;
}
.dynamic-recipe-banner{
  position:relative !important;
  width:min(1180px,100%) !important;
  min-height:330px !important;
  margin:0 auto !important;
  overflow:hidden !important;
  border:4px solid #5b1665 !important;
  border-radius:30px !important;
  background:#fffaf4 !important;
  box-shadow:0 8px 24px rgba(82,35,92,.12) !important;
}
.dynamic-recipe-banner::after{
  content:"" !important;
  position:absolute !important;
  inset:9px !important;
  border:2px solid rgba(91,22,101,.72) !important;
  border-radius:20px !important;
  pointer-events:none !important;
  z-index:4 !important;
}
.dynamic-banner-copy{
  position:relative !important;
  z-index:3 !important;
  width:58% !important;
  min-height:330px !important;
  box-sizing:border-box !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  align-items:center !important;
  padding:26px 34px 24px !important;
  background:linear-gradient(
    90deg,
    #fffaf4 0%,
    #fffaf4 82%,
    rgba(255,250,244,.93) 90%,
    rgba(255,250,244,0) 100%
  ) !important;
}
.dynamic-banner-copy .made-love{
  color:#5b1665 !important;
  font-family:Georgia,"Times New Roman",serif !important;
  font-style:italic !important;
  font-weight:500 !important;
  letter-spacing:.03em !important;
  font-size:18px !important;
  text-transform:none !important;
  text-align:center !important;
}
.dynamic-banner-copy h1{
  margin:5px 0 0 !important;
  max-width:100% !important;
  color:#5b1665 !important;
  font-family:Georgia,"Times New Roman",serif !important;
  font-style:italic !important;
  font-size:clamp(42px,5vw,74px) !important;
  line-height:.96 !important;
  text-align:center !important;
  overflow-wrap:anywhere !important;
}
.banner-copy-lines{
  width:min(520px,92%) !important;
  display:grid !important;
  gap:8px !important;
  margin-top:14px !important;
}
.banner-copy-lines p{
  margin:0 !important;
  color:#4e2d55 !important;
  font-family:system-ui,-apple-system,"Segoe UI",sans-serif !important;
  font-size:16px !important;
  line-height:1.3 !important;
  font-weight:400 !important;
  text-align:left !important;
}
.banner-herbs{
  position:absolute !important;
  z-index:1 !important;
  right:0 !important;
  top:0 !important;
  width:51% !important;
  height:100% !important;
  background-image:url("ui-art/mums-recipes-phone-banner.webp?v=1.19.19") !important;
  background-size:auto 138% !important;
  background-position:88% 50% !important;
  background-repeat:no-repeat !important;
}

@media(max-width:900px){
  .dynamic-recipe-banner{min-height:290px !important}
  .dynamic-banner-copy{
    width:63% !important;
    min-height:290px !important;
    padding:22px 22px !important;
  }
  .dynamic-banner-copy h1{font-size:clamp(38px,7vw,60px) !important}
  .banner-copy-lines p{font-size:14px !important}
  .banner-herbs{
    width:46% !important;
    background-size:auto 132% !important;
    background-position:88% 50% !important;
  }
}
@media(max-width:560px){
  .phone-art-hero{padding:10px 10px 4px !important}
  .dynamic-recipe-banner{
    min-height:250px !important;
    border-width:3px !important;
    border-radius:20px !important;
  }
  .dynamic-recipe-banner::after{
    inset:6px !important;
    border-radius:14px !important;
  }
  .dynamic-banner-copy{
    width:70% !important;
    min-height:250px !important;
    padding:16px 12px !important;
    align-items:flex-start !important;
  }
  .dynamic-banner-copy .made-love{
    width:100% !important;
    font-size:11px !important;
  }
  .dynamic-banner-copy h1{
    width:100% !important;
    font-size:clamp(30px,9vw,44px) !important;
    text-align:center !important;
  }
  .banner-copy-lines{
    width:100% !important;
    gap:6px !important;
  }
  .banner-copy-lines p{
    font-size:11px !important;
    line-height:1.24 !important;
  }
  .banner-herbs{
    width:39% !important;
    background-size:auto 116% !important;
    background-position:89% 52% !important;
  }
}
@media(min-width:1400px){
  .dynamic-recipe-banner{
    width:1180px !important;
    min-height:340px !important;
  }
  .dynamic-banner-copy{
    min-height:340px !important;
  }
}

/* v1.19.19 — stable banner; isolated from all legacy dynamic-banner rules */
.phone-art-hero{
  box-sizing:border-box !important;
  width:100% !important;
  padding:16px !important;
}
.stable-recipe-banner{
  box-sizing:border-box !important;
  display:grid !important;
  grid-template-columns:minmax(0, 3fr) minmax(260px, 2fr) !important;
  width:min(1180px, calc(100vw - 32px)) !important;
  min-width:0 !important;
  min-height:300px !important;
  margin:0 auto !important;
  position:relative !important;
  overflow:hidden !important;
  border:4px solid #5b1665 !important;
  border-radius:28px !important;
  background:#fffaf4 !important;
  box-shadow:0 8px 24px rgba(82,35,92,.12) !important;
}
.stable-recipe-banner::after{
  content:"" !important;
  position:absolute !important;
  inset:9px !important;
  border:2px solid rgba(91,22,101,.65) !important;
  border-radius:19px !important;
  pointer-events:none !important;
  z-index:5 !important;
}
.stable-banner-text{
  box-sizing:border-box !important;
  min-width:0 !important;
  width:auto !important;
  padding:38px 34px 32px !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  align-items:center !important;
  position:relative !important;
  z-index:3 !important;
}
.stable-banner-text .made-love{
  margin:0 0 6px !important;
  color:#5b1665 !important;
  font:italic 500 18px/1.15 Georgia,"Times New Roman",serif !important;
  text-align:center !important;
  white-space:normal !important;
}
.stable-banner-text h1{
  box-sizing:border-box !important;
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  color:#5b1665 !important;
  font:italic 700 clamp(44px,5.1vw,72px)/.98 Georgia,"Times New Roman",serif !important;
  text-align:center !important;
  white-space:normal !important;
  overflow-wrap:normal !important;
  word-break:normal !important;
  hyphens:none !important;
}
.stable-banner-text .banner-copy-lines{
  box-sizing:border-box !important;
  display:grid !important;
  width:min(600px,100%) !important;
  gap:8px !important;
  margin:20px auto 0 !important;
}
.stable-banner-text .banner-copy-lines p{
  margin:0 !important;
  padding:0 !important;
  color:#4e465c !important;
  font:400 16px/1.35 system-ui,-apple-system,"Segoe UI",sans-serif !important;
  text-align:center !important;
  white-space:normal !important;
  word-break:normal !important;
}
.stable-banner-art{
  min-width:0 !important;
  min-height:300px !important;
  position:relative !important;
  z-index:1 !important;
  background-image:url("ui-art/mums-recipes-phone-banner.webp?v=1.19.19") !important;
  background-repeat:no-repeat !important;
  background-size:auto 135% !important;
  background-position:88% 50% !important;
}

/* Tablet: still two sensible columns */
@media (max-width:820px){
  .stable-recipe-banner{
    grid-template-columns:minmax(0, 65%) minmax(180px, 35%) !important;
    min-height:270px !important;
  }
  .stable-banner-text{
    padding:28px 22px 24px !important;
  }
  .stable-banner-text h1{
    font-size:clamp(36px,7vw,54px) !important;
  }
  .stable-banner-text .banner-copy-lines{
    margin-top:14px !important;
  }
  .stable-banner-text .banner-copy-lines p{
    font-size:13px !important;
  }
  .stable-banner-art{
    min-height:270px !important;
    background-size:auto 125% !important;
  }
}

/* Phone: stack the artwork below, so even long usernames have full width */
@media (max-width:560px){
  .phone-art-hero{padding:10px !important}
  .stable-recipe-banner{
    width:calc(100vw - 20px) !important;
    grid-template-columns:1fr !important;
    grid-template-rows:auto 105px !important;
    min-height:0 !important;
    border-width:3px !important;
    border-radius:20px !important;
  }
  .stable-recipe-banner::after{
    inset:6px !important;
    border-radius:13px !important;
  }
  .stable-banner-text{
    width:100% !important;
    padding:22px 18px 14px !important;
  }
  .stable-banner-text .made-love{
    font-size:12px !important;
  }
  .stable-banner-text h1{
    font-size:clamp(31px,10vw,46px) !important;
  }
  .stable-banner-text .banner-copy-lines{
    margin-top:12px !important;
    gap:5px !important;
  }
  .stable-banner-text .banner-copy-lines p{
    font-size:11px !important;
    line-height:1.28 !important;
  }
  .stable-banner-art{
    min-height:105px !important;
    background-size:auto 205% !important;
    background-position:78% 50% !important;
  }
}

/* v1.19.19 — approved compact phone decision cards */
@media(max-width:560px){
 .decision-buttons{grid-template-columns:1fr!important;gap:10px!important}
 .decision-buttons .surprise{
   display:grid!important;grid-template-columns:minmax(0,1fr) 112px!important;
   align-items:center!important;min-height:118px!important;
   padding:14px 12px 14px 18px!important;overflow:hidden!important}
 .decision-buttons .surprise>div{min-width:0!important;text-align:left!important}
 .decision-buttons .surprise h2{margin:0 0 5px!important;font-size:22px!important;line-height:1.05!important}
 .decision-buttons .surprise p{margin:0!important;font-size:13px!important;line-height:1.3!important}
 .decision-face{
   width:112px!important;height:112px!important;object-fit:contain!important;
   object-position:center bottom!important;align-self:end!important;justify-self:end!important;
   border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
}

/* v1.19.19 — confirmed approved phone cards */
@media(max-width:560px){
  #home .decision-buttons{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
  }
  #home .decision-buttons #surpriseStart,
  #home .decision-buttons #randomStart{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 112px!important;
    align-items:center!important;
    min-height:118px!important;
    padding:14px 12px 14px 18px!important;
    overflow:hidden!important;
  }
  #home .decision-buttons #surpriseStart>div,
  #home .decision-buttons #randomStart>div{
    min-width:0!important;
    text-align:left!important;
  }
  #home .decision-buttons h2{
    margin:0 0 5px!important;
    font-size:22px!important;
    line-height:1.05!important;
  }
  #home .decision-buttons p{
    margin:0!important;
    font-size:13px!important;
    line-height:1.3!important;
  }
  #home .decision-buttons .decision-face{
    width:112px!important;
    height:112px!important;
    object-fit:contain!important;
    object-position:center bottom!important;
    justify-self:end!important;
    align-self:end!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    padding:0!important;
  }
}

/* v1.19.19 — Cooking Guide category cards */
.guide-category-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  margin:14px 0 10px;
}
.guide-category-card{
  min-height:92px;
  border:1px solid #e1ddd4;
  border-radius:18px;
  background:#fff;
  padding:16px;
  text-align:left;
  cursor:pointer;
  box-shadow:0 4px 12px rgba(54,45,38,.06);
}
.guide-category-card:hover,.guide-category-card.active{
  border-color:var(--brand);
  box-shadow:0 5px 15px rgba(54,45,38,.10);
}
.guide-category-title{
  font-family:Georgia,serif;
  font-size:20px;
  font-weight:700;
  color:var(--brand);
}
.guide-results-heading{
  display:flex;align-items:baseline;gap:10px;margin:18px 2px 8px;
}
.guide-results-heading h3{margin:0}
.guide-result-list{display:grid;gap:8px}
.guide-result-card{
  width:100%;border:1px solid #e4dfd7;border-radius:14px;background:#fff;
  padding:12px 14px;text-align:left;cursor:pointer;
}
.guide-result-card strong,.guide-result-card small{display:block}
.guide-result-card small{margin-top:3px;color:var(--muted)}
@media(max-width:560px){
  .guide-category-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  .guide-category-card{min-height:74px;padding:12px;border-radius:15px}
  .guide-category-title{font-size:17px}
}

/* v1.19.19 — Cooking Guides at bottom with image cards */
.guide-panel{margin-top:18px}
.guide-category-grid{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:12px !important;
}
.guide-category-card{
  position:relative !important;
  min-height:126px !important;
  overflow:hidden !important;
  padding:0 !important;
  border-radius:17px !important;
  background:#fff !important;
  border:1px solid #e8e6df !important;
  display:flex !important;
  flex-direction:column !important;
  text-align:left !important;
}
.guide-category-image{
  display:block !important;
  width:100% !important;
  height:88px !important;
  object-fit:cover !important;
  object-position:center !important;
  background:#fff !important;
}
.guide-category-title{
  display:block !important;
  width:100% !important;
  padding:8px 10px 9px !important;
  box-sizing:border-box !important;
  background:#fff !important;
  color:#111 !important;
  font-family:system-ui,-apple-system,"Segoe UI",sans-serif !important;
  font-size:14px !important;
  font-weight:700 !important;
}
@media(max-width:560px){
  .guide-category-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:9px !important}
  .guide-category-card{min-height:110px !important}
  .guide-category-image{height:74px !important}
  .guide-category-title{font-size:13px !important;padding:7px 8px !important}
}

/* v1.19.19 — decision card borders */
#surpriseStart{
  border:4px solid #81966f !important;
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.72) !important;
}
#randomStart{
  border:4px solid #fff !important;
  box-shadow:0 0 0 1px rgba(86,32,103,.12) !important;
}
@media(max-width:560px){
  #surpriseStart,#randomStart{border-width:3px !important}
}

/* v1.19.24 — approved centred botanical banner for all non-widescreen layouts */
.responsive-herbs,
.responsive-basil,
.responsive-banner-features{display:none}

@media(max-width:1199px){
  .phone-art-hero{padding:10px 10px 6px!important}

  .stable-recipe-banner{
    position:relative!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    grid-template-rows:auto auto!important;
    width:min(100%,980px)!important;
    min-height:430px!important;
    overflow:hidden!important;
    background:#fffaf4!important;
    border:4px solid #5b1665!important;
    border-radius:28px!important;
    padding:0!important;
  }
  .stable-recipe-banner::after{
    content:""!important;
    position:absolute!important;
    inset:8px!important;
    border:2px solid rgba(91,22,101,.72)!important;
    border-radius:19px!important;
    pointer-events:none!important;
    z-index:8!important;
  }

  .stable-banner-art{display:none!important}

  .stable-banner-text{
    position:relative!important;
    z-index:5!important;
    width:56%!important;
    min-height:330px!important;
    margin:0 auto!important;
    padding:34px 10px 92px!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:flex-start!important;
    align-items:center!important;
    text-align:center!important;
    background:transparent!important;
  }

  .stable-banner-text .made-love{
    margin:0 0 5px!important;
    color:#5b1665!important;
    font-family:"Just Another Hand","Segoe Print","Bradley Hand",cursive!important;
    font-size:30px!important;
    line-height:1!important;
    font-style:normal!important;
    font-weight:400!important;
    letter-spacing:.02em!important;
    text-transform:none!important;
  }

  .stable-banner-text h1{
    margin:0!important;
    color:#5b1665!important;
    font-family:"Just Another Hand","Segoe Print","Bradley Hand",cursive!important;
    font-style:normal!important;
    font-weight:400!important;
    font-size:clamp(62px,9vw,104px)!important;
    line-height:.82!important;
    text-align:center!important;
    overflow-wrap:anywhere!important;
  }

  .banner-copy-lines{display:none!important}

  .responsive-herbs{
    display:block!important;
    position:absolute!important;
    top:18px!important;
    bottom:92px!important;
    width:31%!important;
    z-index:2!important;
    background-repeat:no-repeat!important;
    background-size:contain!important;
  }
  .responsive-herbs-left{
    left:10px!important;
    background-image:url("ui-art/responsive-herbs-left.webp?v=1.22.1")!important;
    background-position:left bottom!important;
  }
  .responsive-herbs-right{
    right:10px!important;
    background-image:url("ui-art/responsive-herbs-right.webp?v=1.22.1")!important;
    background-position:right bottom!important;
  }

  .responsive-basil{
    display:block!important;
    position:absolute!important;
    z-index:4!important;
    left:50%!important;
    bottom:89px!important;
    width:250px!important;
    height:92px!important;
    transform:translateX(-50%)!important;
    background:url("ui-art/responsive-basil.webp?v=1.22.1") center/contain no-repeat!important;
  }

  .responsive-banner-features{
    display:grid!important;
    position:absolute!important;
    z-index:6!important;
    left:8px!important;
    right:8px!important;
    bottom:8px!important;
    min-height:78px!important;
    grid-template-columns:1fr 1fr 1.35fr 1fr!important;
    background:#fffaf4!important;
    border-top:2px solid #5b1665!important;
    border-radius:0 0 18px 18px!important;
  }
  .responsive-banner-features>div{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:2px!important;
    padding:6px 8px!important;
    color:#4e1958!important;
    font-size:12px!important;
    line-height:1.1!important;
    font-weight:700!important;
    text-align:center!important;
    border-right:1px solid rgba(91,22,101,.55)!important;
  }
  .responsive-banner-features>div:last-child{border-right:0!important}
  .responsive-banner-features .feature-icon{
    display:block!important;
    font-size:25px!important;
    line-height:1!important;
    font-weight:400!important;
  }
}

@media(max-width:650px){
  .stable-recipe-banner{
    min-height:390px!important;
    border-width:3px!important;
    border-radius:22px!important;
  }
  .stable-recipe-banner::after{inset:6px!important;border-radius:15px!important}
  .stable-banner-text{
    width:58%!important;
    min-height:295px!important;
    padding:28px 4px 80px!important;
  }
  .stable-banner-text .made-love{font-size:24px!important}
  .stable-banner-text h1{font-size:clamp(50px,15vw,76px)!important;line-height:.84!important}
  .responsive-herbs{
    top:22px!important;
    bottom:88px!important;
    width:33%!important;
  }
  .responsive-herbs-left{left:4px!important}
  .responsive-herbs-right{right:4px!important}
  .responsive-basil{
    bottom:82px!important;
    width:190px!important;
    height:72px!important;
  }
  .responsive-banner-features{
    left:6px!important;
    right:6px!important;
    bottom:6px!important;
    min-height:74px!important;
    grid-template-columns:1fr 1fr!important;
    border-radius:0 0 14px 14px!important;
  }
  .responsive-banner-features>div{
    min-height:34px!important;
    padding:4px 5px!important;
    font-size:10px!important;
    border-right:1px solid rgba(91,22,101,.4)!important;
  }
  .responsive-banner-features>div:nth-child(2){border-right:0!important}
  .responsive-banner-features>div:nth-child(-n+2){border-bottom:1px solid rgba(91,22,101,.35)!important}
  .responsive-banner-features .feature-icon{font-size:18px!important}
}

@media(max-width:360px){
  .stable-recipe-banner{min-height:365px!important}
  .stable-banner-text{width:60%!important;min-height:275px!important;padding-top:26px!important}
  .stable-banner-text .made-love{font-size:20px!important}
  .stable-banner-text h1{font-size:clamp(46px,15vw,62px)!important}
  .responsive-basil{width:160px!important;height:62px!important}
  .responsive-banner-features>div{font-size:9px!important}
}

/* v1.19.24 — refined responsive botanical banner */
@media(max-width:1199px){
  .responsive-herbs{
    display:block!important;
    position:absolute!important;
    z-index:2!important;
    top:10px!important;
    bottom:86px!important;
    width:35%!important;
    background-repeat:no-repeat!important;
    background-size:contain!important;
    pointer-events:none!important;
  }
  .responsive-herbs-left{
    left:0!important;
    background-image:url("ui-art/banner-outer-left.webp?v=1.22.1")!important;
    background-position:left bottom!important;
  }
  .responsive-herbs-right{
    right:0!important;
    background-image:url("ui-art/banner-outer-right.webp?v=1.22.1")!important;
    background-position:right bottom!important;
  }

  .responsive-inner-herbs{
    display:block!important;
    position:absolute!important;
    z-index:3!important;
    bottom:88px!important;
    width:18%!important;
    height:145px!important;
    background-repeat:no-repeat!important;
    background-size:contain!important;
    pointer-events:none!important;
  }
  .responsive-inner-left{
    left:22%!important;
    background-image:url("ui-art/banner-inner-left.webp?v=1.22.1")!important;
    background-position:left bottom!important;
  }
  .responsive-inner-right{
    right:22%!important;
    background-image:url("ui-art/banner-inner-right.webp?v=1.22.1")!important;
    background-position:right bottom!important;
  }

  .responsive-basil{
    display:block!important;
    position:absolute!important;
    z-index:4!important;
    left:50%!important;
    bottom:82px!important;
    width:220px!important;
    height:84px!important;
    transform:translateX(-50%)!important;
    background:url("ui-art/responsive-basil-transparent.webp?v=1.22.1") center/contain no-repeat!important;
    pointer-events:none!important;
  }

  .stable-banner-text{
    z-index:6!important;
    width:52%!important;
    padding-left:6px!important;
    padding-right:6px!important;
  }

  .stable-banner-text .made-love{
    color:#5b1665!important;
  }

  .stable-banner-text h1{
    color:#5b1665!important;
    max-width:100%!important;
  }
}

@media(max-width:650px){
  .responsive-herbs{
    width:37%!important;
    top:14px!important;
    bottom:80px!important;
  }
  .responsive-inner-herbs{
    width:16%!important;
    height:112px!important;
    bottom:82px!important;
  }
  .responsive-inner-left{left:23%!important}
  .responsive-inner-right{right:23%!important}
  .responsive-basil{
    width:170px!important;
    height:66px!important;
    bottom:76px!important;
  }
  .stable-banner-text{
    width:54%!important;
  }
}

@media(max-width:360px){
  .responsive-herbs{width:38%!important}
  .responsive-inner-herbs{width:14%!important;height:96px!important}
  .responsive-basil{width:150px!important;height:58px!important}
}


/* v1.19.24 — phone banner spacing + wider title + cleaner botanical frame */
@media(max-width:650px){
  .stable-recipe-banner{
    min-height:390px!important;
    overflow:hidden!important;
  }

  /* Keep a clear central reading area. Botanicals frame the copy rather than sit behind it. */
  .responsive-herbs{
    top:118px!important;
    bottom:78px!important;
    width:30%!important;
    height:auto!important;
    background-size:100% auto!important;
  }
  .responsive-herbs-left{left:-2px!important;background-position:left bottom!important}
  .responsive-herbs-right{right:-2px!important;background-position:right bottom!important}

  /* The extra inner sprigs were what made the centre feel crowded on a phone. */
  .responsive-inner-herbs{display:none!important}

  /* Remove the narrow central basil sprig on phone layouts; the side foliage now carries the frame. */
  .responsive-basil{display:none!important}

  .stable-banner-text{
    width:72%!important;
    max-width:72%!important;
    min-height:292px!important;
    padding:25px 4px 88px!important;
    position:relative!important;
    z-index:7!important;
  }

  .stable-banner-text .made-love{
    font-size:23px!important;
    line-height:1!important;
    margin-bottom:2px!important;
  }

  /* Keep the approved handwritten font, but make the title visibly broader without changing its character. */
  .stable-banner-text h1{
    width:112%!important;
    max-width:none!important;
    margin-left:-6%!important;
    font-size:clamp(49px,14.5vw,72px)!important;
    line-height:.88!important;
    letter-spacing:.01em!important;
    transform:scaleX(1.10)!important;
    transform-origin:center top!important;
  }

  .banner-copy-lines{
    width:88%!important;
    margin-left:auto!important;
    margin-right:auto!important;
    position:relative!important;
    z-index:8!important;
  }
  .banner-copy-lines p{
    font-size:14px!important;
    line-height:1.22!important;
    margin:8px 0!important;
  }
}

@media(max-width:390px){
  .responsive-herbs{top:126px!important;width:31%!important}
  .stable-banner-text{width:74%!important;max-width:74%!important}
  .stable-banner-text h1{font-size:clamp(47px,14.5vw,66px)!important;transform:scaleX(1.08)!important}
  .banner-copy-lines{width:90%!important}
}

/* v1.20.0 — approved dynamic banner: no small middle copy, bowl centred, herbs at sides */
@media(max-width:1199px){
 .stable-recipe-banner{min-height:470px!important;}
 .stable-banner-text{width:62%!important;min-height:220px!important;padding:28px 8px 230px!important;justify-content:flex-start!important;}
 .stable-banner-text h1{font-stretch:expanded!important;transform:scaleX(1.08);transform-origin:center top;}
 .responsive-inner-herbs,.responsive-basil{display:none!important;}
 .stable-banner-art{display:block!important;position:absolute!important;z-index:3!important;left:50%!important;bottom:82px!important;width:58%!important;height:225px!important;transform:translateX(-50%)!important;background-image:url("ui-art/banner-bowl-v1200.webp")!important;background-size:contain!important;background-position:center bottom!important;background-repeat:no-repeat!important;}
 .responsive-herbs{top:165px!important;bottom:82px!important;width:31%!important;}
}
@media(max-width:650px){
 .stable-recipe-banner{min-height:480px!important;}
 .stable-banner-text{width:74%!important;min-height:210px!important;padding:24px 4px 250px!important;}
 .stable-banner-text h1{font-size:clamp(54px,15vw,78px)!important;}
 .stable-banner-art{width:68%!important;height:210px!important;bottom:145px!important;}
 .responsive-herbs{top:190px!important;bottom:145px!important;width:34%!important;}
}
\n\n/* v1.20.4 — phone banner spacing, transparent bowl overlap, rice guide cards */\n@media(max-width:650px){\n  .stable-recipe-banner{min-height:438px!important;}\n  .stable-banner-text{width:78%!important;min-height:150px!important;padding:18px 4px 0!important;}\n  .stable-banner-text .made-love{margin-bottom:0!important;}\n  .stable-banner-text h1{margin-top:0!important;margin-bottom:0!important;}\n  .stable-banner-art{\n    width:76%!important;height:238px!important;\n    left:50%!important;top:142px!important;bottom:auto!important;\n    background-image:url("ui-art/banner-bowl-v1201.webp?v=1.22.1")!important;\n    background-size:contain!important;background-position:center bottom!important;background-repeat:no-repeat!important;\n    transform:translateX(-50%)!important;z-index:6!important;\n  }\n  .responsive-herbs{top:165px!important;bottom:126px!important;width:35%!important;z-index:4!important;}\n  .responsive-banner-features{z-index:8!important;}\n}\n@media(max-width:390px){\n  .stable-recipe-banner{min-height:430px!important;}\n  .stable-banner-art{top:136px!important;height:226px!important;width:78%!important;}\n  .responsive-herbs{top:158px!important;bottom:126px!important;}\n}\n.guide-result-card.with-guide-art{display:grid!important;grid-template-columns:92px 1fr!important;align-items:center!important;gap:12px!important;text-align:left!important;padding:8px 12px 8px 8px!important;min-height:88px!important;}\n.guide-result-thumb{width:92px;height:72px;object-fit:contain;background:#fff;border-radius:12px;display:block;}\n.guide-result-copy{display:flex;flex-direction:column;gap:4px;}\n
/* v1.20.4 — one banner layout for phone + desktop; no blank middle gap */
.stable-recipe-banner{
  min-height:520px!important;
  position:relative!important;
  overflow:hidden!important;
}
.stable-banner-text{
  position:relative!important;
  z-index:10!important;
  width:min(78%,760px)!important;
  min-height:0!important;
  padding:22px 6px 0!important;
  margin:0 auto!important;
  justify-content:flex-start!important;
  background:transparent!important;
}
.stable-banner-text .made-love{margin:0 0 2px!important;}
.stable-banner-text h1{margin:0!important;}
.stable-banner-art{
  display:block!important;
  position:absolute!important;
  z-index:6!important;
  left:50%!important;
  top:145px!important;
  bottom:auto!important;
  width:min(62%,720px)!important;
  height:270px!important;
  transform:translateX(-50%)!important;
  background-image:url("ui-art/banner-bowl-v1202.webp?v=1.22.1")!important;
  background-size:contain!important;
  background-position:center bottom!important;
  background-repeat:no-repeat!important;
}
.responsive-herbs{
  display:block!important;
  top:150px!important;
  bottom:105px!important;
  width:30%!important;
  z-index:4!important;
  background-size:contain!important;
  background-repeat:no-repeat!important;
}
.responsive-inner-herbs,.responsive-basil{display:none!important;}
.responsive-banner-features{
  position:absolute!important;
  left:0!important;right:0!important;bottom:0!important;
  z-index:12!important;
}
@media(max-width:650px){
  .stable-recipe-banner{min-height:435px!important;}
  .stable-banner-text{width:82%!important;padding-top:15px!important;}
  .stable-banner-text h1{font-size:clamp(49px,14.5vw,70px)!important;line-height:.88!important;}
  .stable-banner-art{top:125px!important;width:79%!important;height:205px!important;}
  .responsive-herbs{top:133px!important;bottom:121px!important;width:35%!important;}
}
@media(max-width:390px){
  .stable-recipe-banner{min-height:420px!important;}
  .stable-banner-art{top:120px!important;width:82%!important;height:195px!important;}
  .responsive-herbs{top:128px!important;bottom:118px!important;width:36%!important;}
}

/* v1.20.4 — rice cooking-guide cards always show the approved method image */
.guide-result-card.with-guide-art{display:grid!important;grid-template-columns:110px 1fr!important;align-items:center!important;gap:12px!important;text-align:left!important;}
.guide-result-thumb{display:block!important;width:110px!important;height:84px!important;object-fit:contain!important;background:#fff!important;border-radius:12px!important;}


/* v1.20.4 — definitive banner layout + approved handwritten title */
.stable-recipe-banner{
  position:relative!important;
  overflow:hidden!important;
  min-height:445px!important;
}
.stable-banner-text{
  position:relative!important;
  z-index:20!important;
  width:100%!important;
  min-height:0!important;
  padding:16px 18px 0!important;
  margin:0 auto!important;
  background:transparent!important;
  align-items:center!important;
  justify-content:flex-start!important;
}
.stable-banner-text .made-love{
  margin:0!important;
  color:#5b1665!important;
  font-family:"Just Another Hand","Segoe Print","Bradley Hand",cursive!important;
  font-style:normal!important;
  font-weight:400!important;
  font-size:29px!important;
  line-height:1!important;
  text-align:center!important;
}
.stable-banner-text h1{
  margin:0!important;
  padding:0!important;
  color:#5b1665!important;
  font-family:"Just Another Hand","Segoe Print","Bradley Hand",cursive!important;
  font-style:normal!important;
  font-weight:400!important;
  font-size:clamp(66px,8vw,104px)!important;
  line-height:.82!important;
  letter-spacing:.005em!important;
  text-align:center!important;
  transform:none!important;
  width:100%!important;
}
.banner-copy-lines{display:none!important;}
.stable-banner-art{
  display:block!important;
  position:absolute!important;
  z-index:8!important;
  left:50%!important;
  top:108px!important;
  bottom:auto!important;
  width:min(58%,700px)!important;
  height:275px!important;
  transform:translateX(-50%)!important;
  background-image:url("ui-art/banner-bowl-v1203.webp?v=1.22.1")!important;
  background-size:contain!important;
  background-position:center center!important;
  background-repeat:no-repeat!important;
}
.responsive-herbs{
  display:block!important;
  position:absolute!important;
  z-index:6!important;
  top:118px!important;
  bottom:102px!important;
  width:29%!important;
  background-size:contain!important;
  background-repeat:no-repeat!important;
}
.responsive-inner-herbs,.responsive-basil{display:none!important;}
.responsive-banner-features{
  position:absolute!important;
  left:0!important;
  right:0!important;
  bottom:0!important;
  z-index:15!important;
}
@media(max-width:650px){
  .stable-recipe-banner{min-height:405px!important;}
  .stable-banner-text{padding:12px 5px 0!important;}
  .stable-banner-text .made-love{font-size:23px!important;}
  .stable-banner-text h1{font-size:clamp(52px,14.5vw,72px)!important;line-height:.82!important;}
  .stable-banner-art{
    top:86px!important;
    width:82%!important;
    height:230px!important;
    background-position:center top!important;
  }
  .responsive-herbs{
    top:103px!important;
    bottom:116px!important;
    width:38%!important;
  }
}
@media(max-width:390px){
  .stable-recipe-banner{min-height:397px!important;}
  .stable-banner-art{top:82px!important;width:84%!important;height:224px!important;}
  .responsive-herbs{top:98px!important;bottom:114px!important;width:39%!important;}
}
/* Rice cooking guides use their approved images everywhere: card + opened recipe. */
.guide-result-card.with-guide-art{display:grid!important;grid-template-columns:110px 1fr!important;align-items:center!important;gap:12px!important;text-align:left!important;}
.guide-result-thumb{display:block!important;width:110px!important;height:84px!important;object-fit:contain!important;background:#fff!important;border-radius:12px!important;}


/* v1.20.4 — approved banner, mirrored purple-basil side herbs, tighter mobile spacing */
.stable-recipe-banner{min-height:430px!important;position:relative!important;overflow:hidden!important;}
.stable-banner-text{width:100%!important;padding:14px 20px 0!important;text-align:center!important;align-items:center!important;}
.stable-banner-text .made-love{font-family:"Just Another Hand","Segoe Print","Bradley Hand",cursive!important;font-style:normal!important;text-align:center!important;font-size:30px!important;margin:0!important;}
.stable-banner-text h1{font-family:"Just Another Hand","Segoe Print","Bradley Hand",cursive!important;font-style:normal!important;font-weight:400!important;text-align:center!important;width:100%!important;margin:0!important;font-size:clamp(66px,8vw,104px)!important;line-height:.82!important;}
.stable-banner-art{position:absolute!important;display:block!important;left:50%!important;top:105px!important;width:min(55%,690px)!important;height:265px!important;transform:translateX(-50%)!important;background:url("ui-art/banner-bowl-v1204.webp?v=1.22.1") center bottom/contain no-repeat!important;z-index:8!important;}
.responsive-herbs{display:block!important;position:absolute!important;top:118px!important;bottom:105px!important;width:29%!important;z-index:6!important;background-image:url("ui-art/banner-herbs-approved-v1204.webp?v=1.22.1")!important;background-size:contain!important;background-repeat:no-repeat!important;background-position:center bottom!important;}
.responsive-herbs.left{left:1%!important;right:auto!important;transform:none!important;}
.responsive-herbs.right{right:1%!important;left:auto!important;transform:scaleX(-1)!important;}
.responsive-inner-herbs,.responsive-basil{display:none!important;}
#surpriseStart{border:3px solid #6b1a73!important;box-shadow:0 5px 16px rgba(91,22,101,.12)!important;}
@media(max-width:650px){
 .stable-recipe-banner{min-height:370px!important;}
 .stable-banner-text{padding:10px 4px 0!important;}
 .stable-banner-text .made-love{font-size:23px!important;}
 .stable-banner-text h1{font-size:clamp(50px,14vw,70px)!important;line-height:.82!important;}
 .stable-banner-art{top:75px!important;width:79%!important;height:205px!important;}
 .responsive-herbs{top:92px!important;bottom:112px!important;width:36%!important;}
}
@media(max-width:390px){
 .stable-recipe-banner{min-height:360px!important;}
 .stable-banner-art{top:72px!important;width:81%!important;height:198px!important;}
 .responsive-herbs{top:88px!important;bottom:110px!important;width:37%!important;}
}

/* v1.21.2 — definitive banner, mirrored herbs, Surprise Me border, plate badges */
#surpriseStart,#randomStart{border:4px solid #5b1665!important;box-shadow:0 5px 16px rgba(91,22,101,.14)!important}
.washing-badge{padding:4px 7px!important;background:#fff!important;border-color:#d8d2dc!important;font-size:15px!important;letter-spacing:-3px!important}
@media(min-width:651px){
 .stable-recipe-banner{min-height:540px!important;overflow:hidden!important}
 .stable-banner-text{width:100%!important;padding:18px 24px 0!important;align-items:center!important;text-align:center!important}
 .stable-banner-text .made-love{font-size:31px!important;text-align:center!important}
 .stable-banner-text h1{font-size:clamp(72px,7vw,108px)!important;line-height:.84!important;text-align:center!important;width:100%!important;transform:none!important}
 .stable-banner-art{display:block!important;top:150px!important;left:50%!important;width:min(54%,700px)!important;height:300px!important;background:url("ui-art/banner-bowl-approved-transparent-v1205.webp?v=1.22.1") center/contain no-repeat!important;transform:translateX(-50%)!important;z-index:8!important}
 .responsive-herbs{display:block!important;top:150px!important;bottom:92px!important;width:25%!important;height:auto!important;background-size:contain!important;background-repeat:no-repeat!important;background-position:center bottom!important;z-index:7!important}
 .responsive-herbs-left{left:2%!important;right:auto!important;background-image:url("ui-art/banner-herbs-approved-left-v1205.webp?v=1.22.1")!important;transform:none!important}
 .responsive-herbs-right{right:2%!important;left:auto!important;background-image:url("ui-art/banner-herbs-approved-right-v1205.webp?v=1.22.1")!important;transform:none!important}
}
@media(max-width:650px){
 .stable-recipe-banner{min-height:390px!important;overflow:hidden!important}
 .stable-banner-text{width:100%!important;padding:10px 8px 0!important;align-items:center!important;text-align:center!important}
 .stable-banner-text .made-love{font-size:23px!important;text-align:center!important}
 .stable-banner-text h1{font-size:clamp(50px,14vw,70px)!important;line-height:.82!important;text-align:center!important;width:100%!important;transform:none!important}
 .stable-banner-art{display:block!important;top:86px!important;left:50%!important;width:76%!important;height:220px!important;background:url("ui-art/banner-bowl-approved-transparent-v1205.webp?v=1.22.1") center/contain no-repeat!important;transform:translateX(-50%)!important;z-index:8!important}
 .responsive-herbs{display:block!important;top:104px!important;bottom:112px!important;width:34%!important;background-size:contain!important;background-repeat:no-repeat!important;background-position:center bottom!important;z-index:7!important}
 .responsive-herbs-left{left:0!important;right:auto!important;background-image:url("ui-art/banner-herbs-approved-left-v1205.webp?v=1.22.1")!important;transform:none!important}
 .responsive-herbs-right{right:0!important;left:auto!important;background-image:url("ui-art/banner-herbs-approved-right-v1205.webp?v=1.22.1")!important;transform:none!important}
 #surpriseStart,#randomStart{border-width:3px!important}
}
.guide-result-card.with-guide-art{grid-template-columns:96px 1fr!important;min-height:92px!important}
.guide-result-thumb{width:96px!important;height:76px!important;object-fit:contain!important;padding:5px!important;background:#fff!important}

/* v1.21.2 — colour-safe banner, purple dish icons, green Can't Decide */
/* Render approved PNG artwork directly: no blend/filter/opacity effects. */
.stable-banner-art,.responsive-herbs{
  filter:none!important;
  opacity:1!important;
  mix-blend-mode:normal!important;
  background-color:transparent!important;
}
.responsive-herbs-left{
  background-image:url("ui-art/banner-herbs-approved-left-v1205.webp?v=1.22.1")!important;
}
/* Use the exact same source on the right and mirror it in CSS. */
.responsive-herbs-right{
  background-image:url("ui-art/banner-herbs-approved-left-v1205.webp?v=1.22.1")!important;
  transform:scaleX(-1)!important;
}
.stable-banner-art{
  background-image:url("ui-art/banner-bowl-approved-transparent-v1205.webp?v=1.22.1")!important;
}
.washing-badge{
  color:#5b1665!important;
  background:#fff!important;
  border-color:#c9b2cf!important;
  letter-spacing:-3px!important;
}
#randomStart{border:4px solid #5b1665!important;}
#surpriseStart{border:4px solid #6f8f61!important;box-shadow:0 5px 16px rgba(83,119,70,.14)!important;}
@media(max-width:650px){#randomStart,#surpriseStart{border-width:3px!important;}}

/* v1.21.2 — Patrick Hand headings + approved borderless Recipes icon */
@import url('https://fonts.googleapis.com/css2?family=Patrick+Hand&display=swap');
:root{--heading-hand:"Patrick Hand","Segoe Print","Bradley Hand",cursive;}
h1,h2,h3,
.card h3,.sheet h2,.panel h2,.surprise h2,
.section-title,.methods-subheading,.step-popup-card h3,
.guide-result-card strong,.recipe-title,.recipe-card-title{
  font-family:var(--heading-hand)!important;
  font-style:normal!important;
  font-weight:400!important;
}
/* Keep the dynamic main banner in its established tall handwritten style. */
.stable-banner-text .made-love,
.stable-banner-text h1{
  font-family:"Just Another Hand","Segoe Print","Bradley Hand",cursive!important;
}
\n\n/* v1.21.2 — direct full-colour banner images + Patrick Hand banner + purple washing controls */
/* Do not render the approved artwork as CSS backgrounds; use ordinary IMG elements so
   the browser cannot blend/filter the artwork through the old banner layers. */
.stable-banner-art,
.responsive-herbs{
  background:none!important;
  background-image:none!important;
  filter:none!important;
  opacity:1!important;
  mix-blend-mode:normal!important;
}
.stable-banner-art::before,.stable-banner-art::after,
.responsive-herbs::before,.responsive-herbs::after{display:none!important;content:none!important;}
.banner-bowl-img,.banner-herb-img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center bottom!important;
  filter:none!important;
  opacity:1!important;
  mix-blend-mode:normal!important;
}
.responsive-herbs-right{transform:none!important;}
.responsive-herbs-right .banner-herb-img{transform:scaleX(-1)!important;transform-origin:center!important;}
.stable-banner-text .made-love,
.stable-banner-text h1{
  font-family:"Patrick Hand","Segoe Print","Bradley Hand",cursive!important;
  font-style:normal!important;
  font-weight:400!important;
}
/* Washing-up selector: clear purple cards, white text and larger white plate icons. */
.washing-filter{gap:10px!important;}
.washing-filter-button[data-washing="Few"],
.washing-filter-button[data-washing="Some"],
.washing-filter-button[data-washing="Lots"]{
  background:#5b1665!important;
  color:#fff!important;
  border:2px solid #5b1665!important;
  font-family:"Patrick Hand","Segoe Print","Bradley Hand",cursive!important;
  font-size:20px!important;
  line-height:1.1!important;
  font-weight:400!important;
  min-height:58px!important;
  padding:10px 16px!important;
  box-shadow:none!important;
}
.washing-filter-button[data-washing="Few"]::first-letter,
.washing-filter-button[data-washing="Some"]::first-letter,
.washing-filter-button[data-washing="Lots"]::first-letter{font-size:28px!important;}
.washing-filter-button.active[data-washing="Few"],
.washing-filter-button.active[data-washing="Some"],
.washing-filter-button.active[data-washing="Lots"]{
  outline:3px solid rgba(91,22,101,.22)!important;
  outline-offset:2px!important;
}
/* Card badge remains compact but clearly purple. */
.washing-badge{
  color:#5b1665!important;
  background:#fff!important;
  border:2px solid #c9b2cf!important;
  font-size:20px!important;
  line-height:1!important;
  letter-spacing:-2px!important;
  min-width:38px!important;
  min-height:38px!important;
}

.washing-filter-button[data-washing="Few"],.washing-filter-button[data-washing="Some"],.washing-filter-button[data-washing="Lots"]{display:flex!important;align-items:center!important;justify-content:center!important;gap:9px!important;}
.wash-plates{font-family:Arial,"Segoe UI Emoji",sans-serif!important;font-size:27px!important;line-height:1!important;color:#fff!important;letter-spacing:-4px!important;}

/* v1.21.2 — Kalam, full-colour banner assets, edible mirrored herbs, crisp white washing-up plates */
@import url('https://fonts.googleapis.com/css2?family=Kalam:wght@400;700&display=swap');
:root{--heading-hand:"Kalam","Segoe Print","Bradley Hand",cursive;--mk-purple:#5b1665;--mk-cream:#fffaf4;}

h1,h2,h3,.card h3,.sheet h2,.panel h2,.surprise h2,.section-title,.methods-subheading,
.step-popup-card h3,.guide-result-card strong,.recipe-title,.recipe-card-title,
.stable-banner-text .made-love,.stable-banner-text h1,
.washing-filter-button[data-washing="Few"],.washing-filter-button[data-washing="Some"],.washing-filter-button[data-washing="Lots"]{
  font-family:var(--heading-hand)!important;font-style:normal!important;
}
.stable-banner-text .made-love{font-weight:400!important;letter-spacing:0!important;}
.stable-banner-text h1{font-weight:700!important;letter-spacing:-.02em!important;}

/* Use corrected full-colour cut-outs only; legacy background artwork is disabled. */
.stable-banner-art,.responsive-herbs{background:none!important;background-image:none!important;filter:none!important;opacity:1!important;mix-blend-mode:normal!important;}
.stable-banner-art::before,.stable-banner-art::after,.responsive-herbs::before,.responsive-herbs::after{display:none!important;content:none!important;}
.banner-bowl-img{content:url("ui-art/banner-bowl-fullcolour-v1209.webp?v=1.22.1")!important;display:block!important;width:100%!important;height:100%!important;object-fit:contain!important;object-position:center bottom!important;filter:none!important;opacity:1!important;mix-blend-mode:normal!important;}
.banner-herb-img{content:url("ui-art/banner-herbs-edible-left-v1209.webp?v=1.22.1")!important;display:block!important;width:100%!important;height:100%!important;object-fit:contain!important;object-position:center bottom!important;filter:none!important;opacity:1!important;mix-blend-mode:normal!important;}
.responsive-herbs-right .banner-herb-img{transform:scaleX(-1)!important;transform-origin:center!important;}
.responsive-inner-herbs,.responsive-basil{display:none!important;}

/* Desktop banner: centred title, coloured bowl, identical mirrored edible herb clusters. */
@media(min-width:651px){
  .stable-recipe-banner{min-height:520px!important;overflow:hidden!important;}
  .stable-banner-text{width:100%!important;padding:16px 22px 0!important;text-align:center!important;align-items:center!important;}
  .stable-banner-text .made-love{font-size:30px!important;margin:0!important;line-height:1!important;}
  .stable-banner-text h1{font-size:clamp(66px,7.2vw,106px)!important;line-height:.9!important;margin:0!important;text-align:center!important;width:100%!important;}
  .stable-banner-art{display:block!important;position:absolute!important;left:50%!important;top:142px!important;width:min(58%,720px)!important;height:315px!important;transform:translateX(-50%)!important;z-index:8!important;}
  .responsive-herbs{display:block!important;position:absolute!important;top:145px!important;bottom:92px!important;width:27%!important;height:auto!important;z-index:7!important;}
  .responsive-herbs-left{left:2%!important;right:auto!important;transform:none!important;}
  .responsive-herbs-right{right:2%!important;left:auto!important;transform:none!important;}
}

/* Mobile banner: keep the bowl close to the name and the mirrored herb clusters fully visible. */
@media(max-width:650px){
  .stable-recipe-banner{min-height:392px!important;overflow:hidden!important;}
  .stable-banner-text{width:100%!important;min-height:0!important;padding:9px 7px 0!important;text-align:center!important;align-items:center!important;}
  .stable-banner-text .made-love{font-size:22px!important;margin:0!important;line-height:1!important;}
  .stable-banner-text h1{font-size:clamp(48px,13vw,68px)!important;line-height:.9!important;margin:0!important;text-align:center!important;width:100%!important;}
  .stable-banner-art{display:block!important;position:absolute!important;left:50%!important;top:82px!important;width:78%!important;height:225px!important;transform:translateX(-50%)!important;z-index:8!important;}
  .responsive-herbs{display:block!important;position:absolute!important;top:104px!important;bottom:112px!important;width:34%!important;height:auto!important;z-index:7!important;}
  .responsive-herbs-left{left:-1%!important;right:auto!important;transform:none!important;}
  .responsive-herbs-right{right:-1%!important;left:auto!important;transform:none!important;}
}

/* Washing-up filter buttons: purple cards with genuinely white, larger vector plate icons. */
.washing-filter{gap:10px!important;}
.washing-filter-button[data-washing="Few"],
.washing-filter-button[data-washing="Some"],
.washing-filter-button[data-washing="Lots"]{
  background:var(--mk-purple)!important;color:#fff!important;border:2px solid var(--mk-purple)!important;
  min-height:62px!important;padding:9px 14px!important;font-size:20px!important;font-weight:700!important;line-height:1.08!important;
  display:flex!important;align-items:center!important;justify-content:center!important;gap:10px!important;box-shadow:none!important;
}
.wash-icon-row{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:1px!important;color:#fff!important;flex:0 0 auto!important;}
.wash-plate-svg{display:block!important;width:43px!important;height:34px!important;color:#fff!important;overflow:visible!important;}
.washing-filter-button.active[data-washing="Few"],.washing-filter-button.active[data-washing="Some"],.washing-filter-button.active[data-washing="Lots"]{outline:3px solid rgba(91,22,101,.22)!important;outline-offset:2px!important;}

/* Recipe-card washing badge: icon only, purple background, visible white plates. */
.washing-badge{background:var(--mk-purple)!important;border:2px solid var(--mk-purple)!important;color:#fff!important;min-width:40px!important;min-height:40px!important;padding:4px 5px!important;display:grid!important;place-items:center!important;border-radius:999px!important;}
.mini-plate-row{display:flex!important;align-items:center!important;justify-content:center!important;gap:1px!important;}
.mini-plate{display:block!important;width:11px!important;height:11px!important;border:2px solid #fff!important;border-radius:50%!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.8)!important;}

#randomStart{border:4px solid var(--mk-purple)!important;}
#surpriseStart{border:4px solid #6f8f61!important;}


/* v1.21.2 — final responsive banner spacing + Plant Points */
.stable-recipe-banner{position:relative!important;}
.stable-banner-text{position:relative!important;z-index:20!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:flex-start!important;box-sizing:border-box!important;}
.stable-banner-text .made-love{font-family:'Kalam','Segoe Print','Comic Sans MS',cursive!important;font-weight:400!important;}
.stable-banner-text h1{font-family:'Kalam','Segoe Print','Comic Sans MS',cursive!important;font-weight:700!important;text-wrap:balance;}
@media(min-width:651px){
  .stable-recipe-banner{min-height:438px!important;height:438px!important;overflow:hidden!important;}
  .stable-banner-text{width:100%!important;padding:12px 24px 0!important;}
  .stable-banner-text .made-love{font-size:30px!important;line-height:1.08!important;margin:0 0 12px!important;}
  .stable-banner-text h1{white-space:nowrap!important;line-height:.86!important;margin:0!important;width:auto!important;max-width:88%!important;text-align:center!important;letter-spacing:-.025em!important;}
  .stable-banner-art{display:block!important;position:absolute!important;left:50%!important;top:132px!important;width:min(58%,700px)!important;height:282px!important;transform:translateX(-50%)!important;z-index:8!important;}
  .responsive-herbs{display:block!important;position:absolute!important;top:145px!important;bottom:22px!important;width:27%!important;height:auto!important;z-index:7!important;}
  .responsive-herbs-left{left:2%!important;right:auto!important;}
  .responsive-herbs-right{right:2%!important;left:auto!important;}
}
@media(min-width:1200px){
  .stable-banner-art{width:min(54%,720px)!important;top:128px!important;height:288px!important;}
  .responsive-herbs{width:25%!important;top:142px!important;bottom:20px!important;}
}
@media(max-width:650px){
  .stable-recipe-banner{min-height:374px!important;height:374px!important;overflow:hidden!important;}
  .stable-banner-text{width:100%!important;padding:8px 7px 0!important;}
  .stable-banner-text .made-love{font-size:22px!important;line-height:1.05!important;margin:0 0 7px!important;}
  .stable-banner-text h1{font-size:clamp(45px,12.5vw,66px)!important;line-height:.88!important;margin:0!important;width:96%!important;text-align:center!important;letter-spacing:-.02em!important;}
  .stable-banner-art{display:block!important;position:absolute!important;left:50%!important;top:88px!important;width:78%!important;height:218px!important;transform:translateX(-50%)!important;z-index:8!important;}
  .responsive-herbs{display:block!important;position:absolute!important;top:116px!important;bottom:56px!important;width:34%!important;height:auto!important;z-index:7!important;}
  .responsive-herbs-left{left:-1%!important;right:auto!important;}
  .responsive-herbs-right{right:-1%!important;left:auto!important;}
}
@media(max-width:390px){
  .stable-recipe-banner{min-height:360px!important;height:360px!important;}
  .stable-banner-text .made-love{font-size:20px!important;margin-bottom:6px!important;}
  .stable-banner-text h1{font-size:clamp(42px,12vw,58px)!important;}
  .stable-banner-art{top:84px!important;height:208px!important;width:80%!important;}
  .responsive-herbs{top:112px!important;bottom:54px!important;width:35%!important;}
}

.card-status-badges{display:flex;align-items:center;gap:6px;margin-left:auto;flex:0 0 auto;}
.plant-points-badge{display:inline-flex;align-items:center;justify-content:center;gap:3px;min-height:40px;min-width:48px;padding:4px 8px;border:2px solid #6f8f52;border-radius:999px;background:#f3f8ee;color:#476b35;font-family:system-ui,-apple-system,'Segoe UI',sans-serif;font-size:15px;line-height:1;letter-spacing:0!important;white-space:nowrap;}
.plant-points-badge strong{font-size:15px;line-height:1;}
.recipe-indicators{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;margin:16px 0 18px;}
.plant-points-detail{display:flex;align-items:center;gap:10px;padding:12px 14px;border:1.5px solid #9eb88b;border-left:5px solid #6f8f52;border-radius:14px;background:#f4f8ef;color:#30452a;min-height:52px;box-sizing:border-box;}
.plant-points-detail .plant-leaf{font-size:25px;line-height:1;}
.plant-points-detail>span:last-child{display:flex;flex-direction:column;gap:2px;}
.plant-points-detail strong{font-size:16px;color:#30452a;}
.plant-points-detail small{font-size:12px;line-height:1.25;color:#66735f;}
.shopping-plant-points{display:flex;align-items:center;gap:10px;width:max-content;max-width:100%;margin:8px 0 14px;padding:10px 14px;border:1.5px solid #9eb88b;border-radius:14px;background:#f4f8ef;color:#30452a;}
.shopping-plant-points>span:first-child{font-size:24px;}
.shopping-plant-points>span:last-child{display:flex;flex-direction:column;}
.shopping-plant-points strong{font-size:17px;}
.shopping-plant-points small{font-size:12px;color:#66735f;}
@media(max-width:760px){
  .recipe-indicators{grid-template-columns:1fr;}
  .card-title-row h3{min-width:0;}
  .card-status-badges{gap:4px;}
  .plant-points-badge{min-width:42px;min-height:38px;padding:3px 6px;font-size:14px;}
  .plant-points-badge strong{font-size:14px;}
}

/* v1.21.2 — keep Plant Points visible without crowding recipe titles */
.food-art>.plant-points-badge{position:absolute;left:8px;bottom:8px;z-index:6;min-height:31px;min-width:44px;padding:3px 7px;background:rgba(244,248,239,.95);box-shadow:0 2px 7px rgba(28,55,24,.16);backdrop-filter:blur(3px);}


/* v1.21.2 — recipe-card Plant Points + complete washing-up place settings */
.card-meta-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:8px;margin-top:3px;}
.card-meta-row .meta{min-width:0;line-height:1.35;}
.card-meta-row .plant-points-badge{position:static!important;align-self:end;min-width:44px;min-height:30px;padding:3px 7px;border-width:1.5px;box-shadow:none;backdrop-filter:none;font-size:13px;}
.card-meta-row .plant-points-badge strong{font-size:13px;}
.washing-badge{width:auto!important;min-width:42px!important;min-height:40px!important;padding:4px 7px!important;}
.mini-plate-row{gap:3px!important;}
.mini-plate{position:relative!important;display:block!important;width:18px!important;height:14px!important;border:0!important;border-radius:0!important;box-shadow:none!important;flex:0 0 18px!important;}
.mini-plate::before{content:"";position:absolute;left:5px;top:1px;width:9px;height:9px;border:2px solid #fff;border-radius:50%;box-sizing:border-box;box-shadow:inset 0 0 0 1px rgba(255,255,255,.25);}
.mini-plate::after{content:"";position:absolute;inset:0;background:
 linear-gradient(#fff,#fff) 1px 2px/1.5px 10px no-repeat,
 linear-gradient(#fff,#fff) 0px 2px/1px 4px no-repeat,
 linear-gradient(#fff,#fff) 2px 2px/1px 4px no-repeat,
 linear-gradient(#fff,#fff) 16px 2px/1.5px 10px no-repeat,
 linear-gradient(#fff,#fff) 15px 2px/1px 5px no-repeat;
 border-radius:2px;}
@media(max-width:520px){
 .card-meta-row{gap:6px;}
 .card-meta-row .plant-points-badge{min-width:40px;min-height:28px;padding:3px 6px;font-size:12px;}
 .card-meta-row .plant-points-badge strong{font-size:12px;}
 .washing-badge{padding:4px 6px!important;}
 .mini-plate-row{gap:2px!important;}
 .mini-plate{width:17px!important;flex-basis:17px!important;}
}


/* v1.21.2 — restore the original pale-purple plate + cutlery washing-up artwork. */
.washing-badge{
  background:transparent!important;
  border:0!important;
  color:var(--mk-purple)!important;
  min-width:0!important;
  min-height:26px!important;
  padding:0 2px!important;
  border-radius:0!important;
  box-shadow:none!important;
}
.mini-plate-row{display:flex!important;align-items:center!important;justify-content:center!important;gap:2px!important;letter-spacing:0!important;}
.mini-plate-img{display:block!important;width:20px!important;height:17px!important;object-fit:contain!important;flex:0 0 20px!important;filter:none!important;opacity:1!important;}
.washing-up-simple>.mini-plate-row{flex:0 0 auto;justify-content:flex-start!important;gap:3px!important;}
.washing-detail-plate{display:block!important;width:24px!important;height:20px!important;object-fit:contain!important;flex:0 0 24px!important;filter:none!important;opacity:1!important;}
@media(max-width:520px){
  .mini-plate-img{width:18px!important;height:15px!important;flex-basis:18px!important;}
  .mini-plate-row{gap:1px!important;}
  .washing-detail-plate{width:21px!important;height:18px!important;flex-basis:21px!important;}
}


/* v1.21.3 — one washing-up graphic everywhere, traffic-light filter colours,
   matched recipe indicators and a mobile-safe recipe-card layout. */
.washing-filter-button[data-washing="Few"],
.washing-filter-button[data-washing="Some"],
.washing-filter-button[data-washing="Lots"]{
  color:var(--mk-purple)!important;
  border-width:2px!important;
  font-family:var(--heading-hand)!important;
  font-weight:700!important;
  min-height:64px!important;
  padding:9px 12px!important;
  box-shadow:none!important;
}
.washing-filter-button[data-washing="Few"]{
  background:#dcebd3!important;
  border-color:#8eae78!important;
}
.washing-filter-button[data-washing="Some"]{
  background:#f6d6a7!important;
  border-color:#df9f42!important;
}
.washing-filter-button[data-washing="Lots"]{
  background:#f1beb8!important;
  border-color:#cd7469!important;
}
.washing-filter-button.active[data-washing="Few"],
.washing-filter-button.active[data-washing="Some"],
.washing-filter-button.active[data-washing="Lots"]{
  outline:3px solid rgba(91,22,101,.28)!important;
  outline-offset:2px!important;
}
.wash-icon-row{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:3px!important;
  color:var(--mk-purple)!important;
  flex:0 0 auto!important;
}
.wash-filter-plate{
  display:block!important;
  width:31px!important;
  height:26px!important;
  object-fit:contain!important;
  flex:0 0 31px!important;
  filter:none!important;
  opacity:1!important;
}
.wash-plate-svg{display:none!important;}

/* Recipe cards: title gets the full line; washing-up + Plant Points sit together below. */
.card-title-row{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 34px!important;
  align-items:start!important;
  gap:8px!important;
}
.card-title-row h3{min-width:0!important;margin:0!important;}
.card-meta-row{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:end!important;
  gap:8px!important;
  margin-top:7px!important;
}
.card-badges{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:7px!important;
  flex:0 0 auto!important;
}
.washing-badge{
  background:transparent!important;
  border:0!important;
  min-width:0!important;
  min-height:0!important;
  padding:0!important;
  border-radius:0!important;
  box-shadow:none!important;
}
.mini-plate-row{gap:2px!important;}
.mini-plate-img{
  width:20px!important;
  height:17px!important;
  flex:0 0 20px!important;
}

/* Open recipe: Plant Points and Washing Up are an equal 50/50 matched pair. */
.recipe-indicators{
  grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
  align-items:stretch!important;
}
.recipe-indicators>.plant-points-detail,
.recipe-indicators>.washing-up-simple{
  margin:0!important;
  min-height:78px!important;
  height:100%!important;
  box-sizing:border-box!important;
}
.recipe-indicators>.washing-up-simple{
  padding:12px 14px!important;
}

/* Phone/tablet card fix: no badge may steal title width or cover text. */
@media(max-width:650px){
  .card-body{padding:12px!important;}
  .card-title-row{grid-template-columns:minmax(0,1fr) 34px!important;gap:6px!important;}
  .card h3{font-size:17px!important;line-height:1.12!important;}
  .card-meta-row{display:block!important;margin-top:7px!important;}
  .card-meta-row .meta{line-height:1.35!important;min-height:0!important;}
  .card-badges{
    margin-top:8px!important;
    width:100%!important;
    justify-content:space-between!important;
    gap:8px!important;
  }
  .washing-badge{max-width:52%!important;}
  .mini-plate-img{width:19px!important;height:16px!important;flex-basis:19px!important;}
  .card-meta-row .plant-points-badge{
    min-width:44px!important;
    min-height:30px!important;
    padding:3px 7px!important;
    font-size:13px!important;
  }
  .recipe-indicators{grid-template-columns:1fr 1fr!important;}
}
@media(max-width:430px){
  .grid{gap:10px!important;}
  .card-body{padding:10px!important;}
  .card h3{font-size:16px!important;}
  .card-meta-row .meta{font-size:11.5px!important;}
  .mini-plate-img{width:18px!important;height:15px!important;flex-basis:18px!important;}
}

/* Four washing-up filter choices remain usable on phones without squeezed labels. */
@media(max-width:520px){
  .washing-filter{grid-template-columns:1fr 1fr!important;gap:9px!important;}
  .washing-filter-button[data-washing="All"]{min-height:58px!important;}
  .washing-filter-button[data-washing="Few"],
  .washing-filter-button[data-washing="Some"],
  .washing-filter-button[data-washing="Lots"]{
    min-height:66px!important;
    font-size:17px!important;
    padding:8px!important;
    gap:6px!important;
  }
  .wash-filter-plate{width:26px!important;height:22px!important;flex-basis:26px!important;}
}

/* Very narrow phones: stack the two recipe-detail info boxes only when needed. */
@media(max-width:360px){
  .recipe-indicators{grid-template-columns:1fr!important;}
}

/* v1.22.1 — right-hand recipe-card status rail, compact mobile washing filters,
   stronger decision cards and focused Cooking Mode. */

/* Recipe card information stays on the left; controls/status always live on the right. */
.card-body{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 64px!important;
  align-items:start!important;
  gap:9px!important;
}
.card-copy{min-width:0!important;}
.card-copy h3{margin:0 0 7px!important;overflow-wrap:anywhere;}
.card-copy .meta{line-height:1.38!important;}
.card-actions{
  width:64px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:8px!important;
}
.card-actions .fav{width:38px!important;height:38px!important;flex:0 0 38px!important;}
.card-actions .washing-badge{
  width:60px!important;
  min-height:28px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:2px 1px!important;
}
.card-actions .mini-plate-row{width:100%!important;justify-content:center!important;gap:1px!important;}
.card-actions .mini-plate-img{width:18px!important;height:16px!important;flex:0 0 18px!important;}
.card-actions .plant-points-badge{
  position:static!important;
  min-width:52px!important;
  min-height:31px!important;
  padding:4px 6px!important;
  font-size:13px!important;
  border-width:1.5px!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
}
.card-actions .plant-points-badge strong{font-size:13px!important;}
/* supersede the older title/meta badge layout rules */
.card-title-row,.card-meta-row,.card-badges{display:contents!important;}

/* Give the two decision cards more presence. */
#home .decision-buttons .surprise{
  min-height:190px!important;
  grid-template-columns:minmax(0,1fr) 118px!important;
  align-items:center!important;
  gap:14px!important;
  padding:22px!important;
}
#home .decision-buttons .surprise h2{
  font-size:31px!important;
  line-height:1.02!important;
  margin:0 0 8px!important;
}
#home .decision-buttons .surprise p{font-size:16px!important;line-height:1.35!important;}
#home #surpriseFace{width:104px!important;height:104px!important;}
#home #cantDecideFace{width:124px!important;height:124px!important;max-width:124px!important;}

/* Open recipe controls. */
.start-cooking-mode{
  margin:2px 0 18px!important;
  min-height:52px!important;
  font-size:18px!important;
  background:#5b1665!important;
}
.recipe-footer-actions{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:10px!important;
  margin:28px 0 8px!important;
  padding-top:18px!important;
  border-top:1px solid var(--line)!important;
}
.recipe-footer-actions button{min-height:50px!important;font-weight:800!important;}

/* Cooking Mode: one calm, readable step at a time. */
.cooking-mode{
  position:fixed;
  inset:0;
  z-index:110;
  display:none;
  padding:0;
  background:rgba(30,20,15,.62);
  backdrop-filter:blur(5px);
}
.cooking-mode.open{display:flex;}
.cooking-mode-shell{
  width:min(780px,100%);
  height:min(94vh,900px);
  margin:auto;
  overflow:auto;
  background:#fbf8f2;
  border-radius:28px;
  box-shadow:0 28px 90px rgba(0,0,0,.32);
  padding:24px;
}
.cooking-mode-header{display:flex;flex-direction:row-reverse;justify-content:space-between;align-items:flex-start;gap:16px;}
.cooking-header-copy{min-width:0;}
.cooking-kicker{margin:0 0 4px;color:#6f8f61;font-size:12px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;}
.cooking-mode-header h2{margin:0!important;color:#5b1665!important;font-family:var(--heading-hand)!important;font-size:31px!important;line-height:1.08!important;}
.cooking-exit{border:0;background:#e9eee7;color:#26312d;width:42px;height:42px;border-radius:50%;font-size:24px;line-height:1;flex:0 0 42px;}
.cooking-progress{height:10px;border-radius:999px;background:#e2e8df;overflow:hidden;margin:20px 0 7px;}
.cooking-progress span{display:block;height:100%;background:#6f8f61;border-radius:inherit;transition:width .2s ease;}
.cooking-step-count{font-weight:850;color:#66735f;margin-bottom:14px;}
.cooking-step-card{background:#fff;border:1px solid #dfe6dc;border-radius:22px;padding:20px;box-shadow:0 8px 24px rgba(58,77,64,.08);}
.cooking-step-card h3{margin:0 0 10px;font-family:var(--heading-hand)!important;color:#5b1665;font-size:22px;}
.cooking-step-card h3:not(:first-child){margin-top:22px;}
.cooking-step-ingredients{display:grid;gap:8px;}
.cooking-ingredient{display:flex;align-items:flex-start;gap:10px;padding:10px 12px;border-radius:13px;background:#f3f7ef;font-size:16px;line-height:1.35;}
.cooking-ingredient input{width:22px;height:22px;min-width:22px;margin:0;accent-color:#6f8f61;}
.cooking-ingredient:has(input:checked) span{text-decoration:line-through;color:#77827a;}
.cooking-no-ingredients{margin:0;color:#6f7d79;}
.cooking-instruction{font-size:25px;line-height:1.47;color:#26312d;font-weight:650;}
.cooking-timer{width:100%;margin-top:18px;border:0;border-radius:14px;padding:14px 16px;background:#f2d99d;color:#5b4310;font-weight:900;font-size:17px;}
.cooking-timer.running{background:#f5e8bf;}
.cooking-all-ingredients{margin:14px 0;border:1px solid #dfe6dc;border-radius:15px;background:#fff;padding:0 14px;}
.cooking-all-ingredients summary{cursor:pointer;padding:13px 0;font-weight:850;color:#5b1665;}
.cooking-all-ingredients ul{margin:0 0 14px;padding-left:22px;line-height:1.5;}
.cooking-nav{display:grid;grid-template-columns:1fr 1.4fr;gap:10px;position:sticky;bottom:-24px;margin:16px -24px -24px;padding:14px 24px calc(14px + env(safe-area-inset-bottom));background:rgba(251,248,242,.96);border-top:1px solid #dfe6dc;backdrop-filter:blur(8px);}
.cooking-nav button{min-height:54px;font-size:17px;}
.cooking-nav .primary{background:#5b1665!important;}
.cooking-prev:disabled{opacity:.45;}
.cooking-complete{text-align:center;padding:54px 12px 24px;}
.cooking-finish-icon{width:86px;height:86px;margin:0 auto 16px;border-radius:50%;display:grid;place-items:center;background:#dcebd3;color:#4f7b3f;font-size:48px;font-weight:900;}
.cooking-complete h2{font-family:var(--heading-hand)!important;color:#5b1665;font-size:36px;margin:7px 0 8px;}
.cooking-complete p:not(.cooking-kicker){font-size:19px;color:#5f6e66;margin:0 0 24px;}
.cooking-complete .secondary{width:100%;margin-top:10px;min-height:48px;}

/* Mobile washing-up filter: All across the top, then three compact equal buttons.
   Three plates form a 2+1 pyramid to avoid horizontal squeeze. */
@media(max-width:520px){
  .washing-filter{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:8px!important;
  }
  .washing-filter-button[data-washing="All"]{
    grid-column:1 / -1!important;
    min-height:48px!important;
    font-size:16px!important;
  }
  .washing-filter-button[data-washing="Few"],
  .washing-filter-button[data-washing="Some"],
  .washing-filter-button[data-washing="Lots"]{
    min-width:0!important;
    min-height:100px!important;
    padding:8px 5px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:5px!important;
    font-size:15px!important;
    line-height:1.05!important;
    text-align:center!important;
    overflow:hidden!important;
  }
  .wash-filter-plate{width:24px!important;height:21px!important;flex:0 0 24px!important;}
  .wash-icon-row{gap:2px!important;min-height:24px!important;}
  .wash-icon-pyramid{
    width:52px!important;
    display:grid!important;
    grid-template-columns:24px 24px!important;
    grid-auto-rows:20px!important;
    gap:0 3px!important;
    align-items:center!important;
    justify-content:center!important;
  }
  .wash-icon-pyramid .wash-filter-plate:nth-child(3){grid-column:1 / -1!important;justify-self:center!important;margin-top:-1px!important;}

  .card-body{grid-template-columns:minmax(0,1fr) 58px!important;gap:7px!important;padding:10px!important;}
  .card-actions{width:58px!important;gap:7px!important;}
  .card-actions .washing-badge{width:56px!important;}
  .card-actions .mini-plate-img{width:16px!important;height:14px!important;flex-basis:16px!important;}
  .card-actions .plant-points-badge{min-width:50px!important;min-height:29px!important;padding:3px 5px!important;font-size:12px!important;}
  .card-actions .plant-points-badge strong{font-size:12px!important;}
  .card-copy h3{font-size:17px!important;line-height:1.12!important;}
  .card-copy .meta{font-size:11.5px!important;}

  #home .decision-buttons .surprise{
    min-height:160px!important;
    grid-template-columns:minmax(0,1fr) 92px!important;
    gap:8px!important;
    padding:16px!important;
  }
  #home .decision-buttons .surprise h2{font-size:25px!important;}
  #home .decision-buttons .surprise p{font-size:14px!important;}
  #home #surpriseFace{width:78px!important;height:78px!important;}
  #home #cantDecideFace{width:94px!important;height:94px!important;max-width:94px!important;}

  .recipe-footer-actions{grid-template-columns:1fr!important;}
  .cooking-mode-shell{height:100%;border-radius:0;padding:18px 16px calc(18px + env(safe-area-inset-bottom));}
  .cooking-mode-header h2{font-size:27px!important;}
  .cooking-step-card{padding:16px;}
  .cooking-instruction{font-size:22px;line-height:1.45;}
  .cooking-nav{bottom:-18px;margin:14px -16px calc(-18px - env(safe-area-inset-bottom));padding:12px 16px calc(12px + env(safe-area-inset-bottom));}
}

@media(max-width:370px){
  #home .decision-buttons{grid-template-columns:1fr!important;}
  #home .decision-buttons .surprise{grid-template-columns:minmax(0,1fr) 100px!important;}
  .cooking-nav{grid-template-columns:1fr!important;}
}

/* v1.22.1 — weekly meal planning */
.week-planner{margin:8px 0 18px;padding:15px;border:1.5px solid #cbb6cf;border-radius:20px;background:linear-gradient(145deg,#fbf7fc,#f3edf5)}
.week-planner-header{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:12px}
.week-planner-kicker{display:block;color:#5b1665;font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.06em;margin-bottom:2px}
.week-planner-header h3{margin:0;color:#3f2942;font-size:20px}
.week-planner-summary{margin-top:4px;color:#6b5d6d;font-size:12px;display:flex;gap:7px;flex-wrap:wrap;align-items:center}
.week-planner-summary strong{color:#5b1665;font-size:13px}.week-planner-summary span{white-space:nowrap}
.week-planner-nav{display:flex;gap:5px;align-items:center}.week-planner-nav .secondary{padding:7px 10px;min-width:34px}.week-today{font-size:12px}
.week-planner-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:7px}
.week-day{position:relative;min-width:0;min-height:112px;border:1px solid #ded5df;border-radius:14px;background:#fff;padding:8px 6px 7px;display:flex;flex-direction:column;gap:6px}
.week-day.today{box-shadow:0 0 0 2px rgba(91,22,101,.18);border-color:#a879af}.week-day.planned{background:#fff8eb;border-color:#e3bd79}.week-day.covered{background:#edf6e9;border-color:#9db98d}
.week-day-head{display:flex;align-items:baseline;justify-content:space-between;color:#756878;font-size:11px;font-weight:800}.week-day-head strong{font-size:16px;color:#3e3440}
.week-meal{border:0;background:none;padding:0;text-align:left;min-width:0;color:#3f2942;cursor:pointer}.week-meal span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:11px;line-height:1.2;font-weight:900}.week-meal small{display:block;margin-top:5px;font-size:9px;line-height:1.15;color:#7b6b55}.week-day.covered .week-meal small{color:#47623d}
.week-empty{margin:auto 0;text-align:center;color:#aaa0ac}.week-empty span{font-size:18px}.week-empty small{display:block;font-size:9px}
.week-remove{position:absolute;right:3px;bottom:3px;width:22px;height:22px;border:0;border-radius:50%;background:transparent;color:#9a859d;font-size:18px;line-height:1;cursor:pointer}.week-remove:hover{background:#f4e9f5;color:#5b1665}
.week-planner-note{font-size:11px;line-height:1.35;color:#756878;margin:10px 2px 0}
.meal-plan-box{margin:16px 0;padding:14px;border:1.5px solid #cbb6cf;border-radius:18px;background:#faf6fb}.meal-plan-title{display:flex;gap:9px;align-items:flex-start;margin-bottom:10px}.meal-plan-title>span{font-size:23px}.meal-plan-title strong{display:block;color:#5b1665;font-size:16px}.meal-plan-title small{display:block;color:#756878;font-size:12px;margin-top:2px}.meal-plan-date-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}.meal-plan-date-row input{min-width:0;border:1px solid #d5c6d8;border-radius:12px;background:#fff;padding:10px 11px;font:inherit;color:#342b35}.meal-plan-shop{margin-top:8px}.meal-plan-status{display:block;color:#557048;font-weight:700;font-size:11px;margin-top:7px;min-height:14px}
@media(max-width:650px){.week-planner{padding:12px 9px}.week-planner-header{display:block}.week-planner-nav{margin-top:9px;justify-content:space-between}.week-planner-nav .week-today{flex:1}.week-planner-days{gap:4px}.week-day{padding:7px 4px 5px;min-height:103px;border-radius:11px}.week-day-head{display:block;text-align:center}.week-day-head strong{display:block;font-size:15px}.week-meal{text-align:center}.week-meal span{font-size:9.5px;-webkit-line-clamp:3}.week-meal small{font-size:8px}.week-empty small{font-size:8px}.week-remove{right:1px;bottom:1px;width:19px;height:19px;font-size:16px}.meal-plan-date-row{grid-template-columns:1fr}.meal-plan-date-row .secondary{width:100%}}
@media(max-width:390px){.week-planner-days{gap:3px}.week-day{padding-left:2px;padding-right:2px}.week-meal span{font-size:9px}.week-planner-summary{font-size:11px}}

/* v1.22.2 — mobile shopping flow: weekly plan follows the shopping list */
@media(max-width:650px){
  #shopping .panel{display:flex;flex-direction:column}
  #shopping .week-planner{order:99;margin-top:20px;margin-bottom:4px}
  #shopping #shoppingList{order:20}
  #shopping .manual-shop-row,
  #shopping #shoppingCount,
  #shopping .shopping-plant-points,
  #shopping .toolbar{order:10}
}


/* v1.22.3 — Weekly Meal Planner promoted to About; About text compressed */
#about .about-panel{display:block}
#about .about-week-planner{margin:0 0 18px}
#about .about-week-planner .week-planner-header h2{margin:0;color:#3f2942;font-size:22px}
#about .about-compact{padding-top:2px}
#about .about-compact>h2{margin:0 0 8px;color:#5b1665}
#about .about-compact>p{margin:5px 0 8px;line-height:1.42;color:#655b67;font-size:13px}
#about .compact-name-preference{margin:13px 0 10px;padding:12px 13px}
#about .compact-name-preference h3{font-size:18px;margin:0 0 2px}
#about .compact-name-preference .meta{margin:0 0 7px;line-height:1.3}
#about .about-details{margin-top:8px;border:1px solid #ded5df;border-radius:14px;background:#faf8fb;overflow:hidden}
#about .about-details summary{cursor:pointer;list-style:none;padding:11px 13px;color:#5b1665;font-weight:900;font-size:13px}
#about .about-details summary::-webkit-details-marker{display:none}
#about .about-details summary:after{content:'+';float:right;font-size:18px;line-height:14px}
#about .about-details[open] summary:after{content:'−'}
#about .about-details-body{padding:0 12px 11px}
#about .about-details-body .version-card{margin:2px 0 9px}
#about .about-details-body p{margin:6px 0;line-height:1.35}
#shopping .week-planner{display:none!important}
@media(max-width:650px){
  #about .panel{padding-top:12px}
  #about .about-week-planner{margin-bottom:14px}
  #about .about-compact>p{font-size:12.5px}
  #about .compact-name-preference{padding:10px 11px}
}

/* v1.22.4 — clearer home choices + Ideas hub + tap-first mobile ingredient finder */
.home-pathways{
  display:grid;
  grid-template-columns:1.35fr 1fr 1fr;
  gap:12px;
  margin:0 0 20px;
}
.home-pathway{
  position:relative;
  min-width:0;
  min-height:154px;
  margin:0!important;
  padding:16px!important;
  border:1.5px solid #d8cddd!important;
  display:grid;
  grid-template-columns:minmax(0,1fr) 88px;
  gap:9px;
  align-items:center;
  text-align:left;
  overflow:hidden;
  cursor:pointer;
}
.home-pathway:hover,.home-pathway:focus-visible{transform:translateY(-1px);box-shadow:0 8px 22px rgba(70,47,73,.12)}
.home-pathway-copy{display:block;min-width:0;position:relative;z-index:2}
.home-pathway-copy strong{display:block;font-family:var(--heading-hand);font-size:25px;line-height:1.05;color:#5b1665;margin:0 0 6px}
.home-pathway-copy small{display:block;font-size:12.5px;line-height:1.35;color:#655b67}
.home-pathway-kicker{display:block;color:#537a46;font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.07em;margin-bottom:5px}
.home-pathway-link{display:block;margin-top:10px;color:#5b1665;font-size:12px;font-weight:900}
.home-pathway img{width:86px;height:86px;object-fit:contain;justify-self:end;position:relative;z-index:1}
.home-pathway-have{background:linear-gradient(145deg,#f4f8ef,#eef4e9)!important;border-color:#9db98d!important;box-shadow:0 7px 18px rgba(86,116,72,.10)!important}
.home-pathway-have img{width:96px;height:96px}
.home-pathway-browse{background:#fffaf1!important;border-color:#e6d4aa!important}
.home-pathway-browse img{border-radius:16px;object-fit:cover}
.home-pathway-ideas{background:linear-gradient(145deg,#fbf7fc,#f2eaf5)!important;border-color:#cbb6cf!important}
.home-section-heading{margin:4px 2px 10px;scroll-margin-top:12px}
.home-section-heading h2{margin:1px 0 0;color:#5b1665;font-family:var(--heading-hand);font-size:27px}

#ideas .panel{scroll-margin-top:12px}
#whatHavePanel{border-color:#9db98d;background:linear-gradient(180deg,#fff,#fbfdf9)}
.have-mobile-picks{display:none}
.ideas-inspiration-panel{border-color:#cbb6cf;background:linear-gradient(180deg,#fff,#fcf8fd)}
.compact-ideas-heading{margin-bottom:11px}
.ideas-decision-buttons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;margin:8px 0 18px}
.ideas-decision-buttons .surprise{
  width:100%;min-width:0;min-height:132px;border:1.5px solid #cbb6cf;border-radius:18px;background:#fff;padding:13px 14px;
  display:grid;grid-template-columns:minmax(0,1fr) 82px;gap:9px;align-items:center;text-align:left;cursor:pointer;overflow:hidden;
}
.ideas-decision-buttons .surprise.random{border-color:#9db98d;background:#fbfdf9}
.ideas-decision-buttons .surprise:hover,.ideas-decision-buttons .surprise:focus-visible{box-shadow:0 6px 16px rgba(70,47,73,.10);transform:translateY(-1px)}
.ideas-decision-buttons h3{font-family:var(--heading-hand);font-size:23px;line-height:1.05;color:#5b1665;margin:0 0 5px}
.ideas-decision-buttons p{margin:0;color:#6d626f;font-size:12px;line-height:1.3}
.ideas-decision-buttons .decision-face{width:78px;height:78px;max-width:78px;justify-self:end}
.ideas-search-block{padding-top:14px;border-top:1px solid #e4dbe6}
.ideas-search-block>h3{margin:0 0 8px;color:#4d3e50;font-size:16px}

@media(max-width:650px){
  .home-pathways{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-bottom:16px}
  .home-pathway{min-height:138px;padding:12px!important;border-radius:17px!important}
  .home-pathway-have{grid-column:1 / -1;grid-template-columns:minmax(0,1fr) 92px;min-height:132px}
  .home-pathway-have img{width:90px;height:90px}
  .home-pathway-browse,.home-pathway-ideas{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:5px;min-height:172px}
  .home-pathway-browse img,.home-pathway-ideas img{order:-1;width:68px;height:58px;align-self:center;justify-self:center;margin:-1px auto 2px;object-fit:contain}
  .home-pathway-browse img{object-fit:cover;width:72px;height:56px}
  .home-pathway-copy strong{font-size:21px}
  .home-pathway-copy small{font-size:11.5px;line-height:1.25}
  .home-pathway-link{font-size:11px;margin-top:7px}
  .home-section-heading h2{font-size:24px}

  .have-desktop-help{display:none}
  .have-mobile-picks{display:block;margin:7px 0 11px;padding:10px;border:1px solid #d7e3cf;border-radius:15px;background:#f6faf3}
  .have-mobile-picks>p{margin:0 0 8px;color:#4a5947;font-size:13px}
  .have-mobile-picks>p strong{display:block;color:#5b1665;font-size:14px}
  .have-mobile-picks>p small{display:block;margin-top:2px;color:#758071;font-size:10.5px;font-weight:500}
  .have-quick-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .have-quick-chip{min-width:0;border:1px solid #c8d8bf;border-radius:999px;background:#fff;color:#485646;padding:9px 4px;font-size:11.5px;font-weight:800;text-align:center;cursor:pointer}
  .have-quick-chip.active{background:#5b1665;color:#fff;border-color:#5b1665;box-shadow:0 0 0 2px rgba(91,22,101,.10)}
  .have-mobile-more{margin:8px 1px 0!important;color:#766d78!important;font-size:10.5px!important}
  #whatHavePanel .search-row{grid-template-columns:1fr auto!important}
  #whatHavePanel .search{padding:12px;font-size:14px}
  #whatHavePanel .search-button{padding:0 11px;font-size:12px}

  .ideas-decision-buttons{gap:8px}
  .ideas-decision-buttons .surprise{min-height:145px;display:flex;flex-direction:column-reverse;justify-content:flex-end;align-items:flex-start;padding:10px;text-align:center}
  .ideas-decision-buttons .surprise>div{width:100%}
  .ideas-decision-buttons h3{font-size:20px}
  .ideas-decision-buttons p{font-size:10.5px;line-height:1.25}
  .ideas-decision-buttons .decision-face{width:66px;height:66px;max-width:66px;align-self:center;margin:0 auto 4px}
  .ideas-search-block .search-row{grid-template-columns:1fr auto}
  .ideas-search-block .search-button{padding:0 11px}
}
@media(max-width:370px){
  .home-pathway-browse,.home-pathway-ideas{min-height:184px}
  .have-quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ideas-decision-buttons{grid-template-columns:1fr}
  .ideas-decision-buttons .surprise{min-height:118px;display:grid;grid-template-columns:minmax(0,1fr) 70px;text-align:left}
  .ideas-decision-buttons .decision-face{margin:0;align-self:center}
}


/* v1.22.5 — Summers Kitchen banner + larger Ideas headings */
/* Give the handwritten Made with Love line a little more breathing room from the banner edge. */
@media(min-width:651px){
  .stable-banner-text{padding-top:20px!important;}
}
@media(max-width:650px){
  .stable-banner-text{padding-top:14px!important;}
}

/* Match the Ideas headings to the stronger Browse recipes heading on the Recipes tab. */
#ideas .ideas-panel-heading h2,
#ideas .guide-panel .ideas-panel-heading h2,
#ideas .ideas-decision-buttons h3{
  font-family:var(--heading-hand)!important;
  font-size:27px!important;
  line-height:1.05!important;
  color:#5b1665!important;
}
@media(max-width:650px){
  #ideas .ideas-panel-heading h2,
  #ideas .guide-panel .ideas-panel-heading h2,
  #ideas .ideas-decision-buttons h3{
    font-size:24px!important;
  }
}

/* v1.22.7 — Planner navigation and clearer shopping status */
.shopping-heading-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.shopping-heading-row h2{margin:0}
.planner-jump{flex:0 0 auto;font-weight:850;color:#5b1665;border-color:#cdb9d1;background:#faf7fb}
.meal-plan-view{width:100%;margin-top:9px;font-weight:850;color:#5b1665}
#about .week-planner-kicker{text-transform:none;letter-spacing:.02em}
@media(max-width:520px){
  .shopping-heading-row{align-items:stretch;flex-direction:column}
  .planner-jump{width:100%}
}


/* v1.22.11 — developer name sits in the former Made with Love line; personalised [name]’s Recipes title restored. Existing banner font sizes retained. */
\n\n/* v1.22.11 — compact banner away from Recipes/Home */
.app.compact-banner .phone-art-hero{padding-bottom:0!important;margin-bottom:10px!important}
.app.compact-banner .stable-recipe-banner{min-height:112px!important;height:112px!important;overflow:hidden!important}
.app.compact-banner .stable-banner-text{position:absolute!important;inset:0!important;width:100%!important;min-height:0!important;height:112px!important;padding:0 96px!important;display:flex!important;align-items:center!important;justify-content:center!important;z-index:8!important}
.app.compact-banner .stable-banner-text .made-love{display:none!important}
.app.compact-banner .stable-banner-text h1{margin:0!important;font-size:38px!important;line-height:1.05!important;white-space:nowrap!important;text-align:center!important}
.app.compact-banner .stable-banner-art,.app.compact-banner .responsive-banner-features,.app.compact-banner .responsive-herbs-right,.app.compact-banner .responsive-inner-herbs,.app.compact-banner .responsive-basil{display:none!important}
.app.compact-banner .responsive-herbs-left{display:block!important;position:absolute!important;left:18px!important;right:auto!important;top:12px!important;bottom:auto!important;width:86px!important;height:86px!important;z-index:7!important;transform:none!important;opacity:1!important}
.app.compact-banner .responsive-herbs-left .banner-herb-img{width:100%!important;height:100%!important;object-fit:contain!important;filter:none!important;opacity:1!important;transform:none!important}
@media(max-width:650px){
 .app.compact-banner .stable-recipe-banner{min-height:94px!important;height:94px!important}
 .app.compact-banner .stable-banner-text{height:94px!important;padding:0 58px 0 80px!important}
 .app.compact-banner .stable-banner-text h1{font-size:29px!important;white-space:nowrap!important}
 .app.compact-banner .responsive-herbs-left{left:10px!important;top:10px!important;width:70px!important;height:70px!important}
}
@media(max-width:370px){.app.compact-banner .stable-banner-text h1{font-size:25px!important}}

/* v1.22.13 — Cooking Mode preparation screen */
.cooking-preparation-card .cooking-prep-intro{margin:-2px 0 14px;color:#65736b;font-size:16px;line-height:1.45;}
.cooking-prep-list{display:grid;gap:9px;}
.cooking-prep-item{background:#f7faf5;}
.cooking-prep-item span{line-height:1.45;}
.cooking-prep-nav{grid-template-columns:1fr 1.6fr;}
@media(max-width:420px){.cooking-prep-nav{grid-template-columns:1fr!important;}.cooking-prep-nav .cooking-prep-next{grid-row:1;}}
\n\n/* v1.22.15 — contextual recipe tips from Builder */
#methodHelpModal{z-index:130!important}
.recipe-tip-links,.cooking-tip-links{display:flex;flex-wrap:wrap;gap:7px;margin-top:9px}
.recipe-tip-button{border:1px solid #d8c7df;background:#fbf6fc;color:#5b1665;border-radius:999px;padding:7px 10px;font-weight:800;font-size:12px;line-height:1.2;cursor:pointer;text-align:left}
.recipe-tip-button:hover,.recipe-tip-button:focus-visible{background:#f3e9f6;border-color:#b99cc4;outline:none}
.recipe-tip-kicker{color:#5b1665!important}
.recipe-tip-popup{background:linear-gradient(135deg,#fbf6fc,#f3edf7);border:1px solid #e3d4e8;border-radius:15px;padding:14px 15px;margin-top:12px}
.recipe-tip-popup p{margin:0;line-height:1.58;font-size:15px}
.preparation-box .recipe-note-item>div:first-child{line-height:1.48}
.tip-button{background:#f5eaf8!important;color:#5b1665!important;border-color:#dcc6e4!important}
.cooking-prep-row{display:grid;gap:4px}
.cooking-prep-row+.cooking-prep-row{margin-top:10px}
.cooking-prep-row .cooking-tip-links{margin:5px 0 0 36px}
.cooking-tip-links{margin:11px 0 2px}
.cooking-tip-links .recipe-tip-button{font-size:13px;padding:9px 12px;background:#fff7ff}
@media(max-width:520px){.recipe-tip-button{white-space:normal}.cooking-prep-row .cooking-tip-links{margin-left:32px}}

/* v1.22.17 — widescreen desktop editorial polish
   Keep the friendly handwritten character, but use a calmer scale and tighter density on large screens. */
@media(min-width:1200px){
  .app,.nav{max-width:1040px!important;}
  .content,.hero{padding-left:18px!important;padding-right:18px!important;}
  .phone-art-hero{padding:16px 18px 8px!important;}

  .stable-recipe-banner{
    min-height:350px!important;
    height:350px!important;
    border-radius:24px!important;
  }
  .stable-banner-text{padding:14px 24px 0!important;}
  .stable-banner-text .made-love{
    font-size:21px!important;
    line-height:1.05!important;
    margin:0 0 6px!important;
    letter-spacing:.01em!important;
  }
  .stable-banner-text h1{
    font-size:56px!important;
    line-height:.92!important;
    max-width:84%!important;
    letter-spacing:-.015em!important;
  }
  .stable-banner-art{
    top:94px!important;
    width:min(50%,560px)!important;
    height:235px!important;
  }
  .responsive-herbs{
    width:22%!important;
    top:108px!important;
    bottom:16px!important;
  }

  .home-pathways{gap:10px!important;margin-bottom:17px!important;}
  .home-pathway{
    min-height:126px!important;
    padding:13px 14px!important;
    grid-template-columns:minmax(0,1fr) 72px!important;
    gap:8px!important;
    border-radius:17px!important;
  }
  .home-pathway-copy strong{
    font-size:20px!important;
    line-height:1.04!important;
    margin-bottom:4px!important;
  }
  .home-pathway-copy small{font-size:11px!important;line-height:1.3!important;}
  .home-pathway-kicker{font-size:8.5px!important;letter-spacing:.09em!important;margin-bottom:4px!important;}
  .home-pathway-link{font-size:10.5px!important;margin-top:7px!important;}
  .home-pathway img{width:70px!important;height:70px!important;}
  .home-pathway-have img{width:78px!important;height:78px!important;}

  .home-section-heading{margin:2px 2px 9px!important;}
  .home-section-heading h2{font-size:22px!important;line-height:1.05!important;}
  .panel{padding:16px!important;}
  .panel h2{font-size:20px!important;}
  .eyebrow{font-size:10.5px!important;letter-spacing:.11em!important;}
  .card-copy h3{font-size:15px!important;line-height:1.16!important;}
  .card-copy .meta{font-size:11px!important;}
  .nav button{font-size:10.5px!important;}
}


/* v1.22.17 — desktop navigation fix
   Mobile/tablet keeps the fixed bottom navigation. On desktop the same nav
   sits in the normal page flow directly below the banner, so it cannot cover content. */
@media(min-width:900px){
  .app{padding-bottom:28px!important;}
  .bottom{
    position:relative!important;
    left:auto!important;
    right:auto!important;
    bottom:auto!important;
    width:calc(100% - 36px)!important;
    max-width:1040px!important;
    margin:0 auto 12px!important;
    padding:0!important;
    background:rgba(255,255,255,.88)!important;
    border:1px solid var(--line)!important;
    border-radius:16px!important;
    box-shadow:0 7px 20px rgba(66,91,80,.08)!important;
    backdrop-filter:none!important;
    overflow:hidden!important;
  }
  .bottom .nav{
    max-width:none!important;
    width:100%!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
  }
  .bottom .nav button{
    min-height:58px!important;
    padding:8px 6px 7px!important;
    border-right:1px solid rgba(220,230,226,.8)!important;
  }
  .bottom .nav button:last-child{border-right:0!important;}
  .bottom .nav button span{font-size:19px!important;margin-bottom:1px!important;}
}


/* v1.22.24 — experimental navigation: GIMI first; Browse + Cooking Guides together */
.home-start-intro{margin:2px 2px 11px}.home-start-intro h2{margin:2px 0 0;font-family:var(--heading-hand);font-size:28px;color:#5b1665}
#home .panel,#browse .panel{scroll-margin-top:12px}
#home .ideas-panel-heading h2,#browse .guide-panel .ideas-panel-heading h2{font-family:var(--heading-hand)!important;font-size:27px!important;line-height:1.05!important;color:#5b1665!important}
.home-shortcuts-panel{border-color:#d9cddd;background:linear-gradient(180deg,#fff,#fcf9fd)}
.home-shortcut-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px;margin-top:10px}
.home-shortcut-card{min-width:0;min-height:166px;border:1.5px solid #cbb6cf;border-radius:18px;background:#fff;padding:13px;display:flex;flex-direction:column;align-items:flex-start;text-align:left;gap:9px;cursor:pointer;color:var(--ink);box-shadow:0 4px 13px rgba(70,47,73,.05)}
.home-shortcut-card:hover,.home-shortcut-card:focus-visible{transform:translateY(-1px);box-shadow:0 7px 18px rgba(70,47,73,.11)}
.home-shortcut-card img{width:76px;height:70px;object-fit:contain;align-self:center;border-radius:14px}.home-shortcut-card.browse-shortcut img{object-fit:cover;width:88px}
.home-shortcut-card strong{display:block;font-family:var(--heading-hand);font-size:22px;line-height:1.05;color:#5b1665;margin-bottom:5px}.home-shortcut-card small{display:block;color:#6d626f;font-size:11.5px;line-height:1.3}
.home-shortcut-card.surprise-shortcut{border-color:#9db98d;background:#fbfdf9}
#browse .browse-search-panel{margin-bottom:15px;border-color:#d7dfcf;background:#fbfdf9}#browse .browse-search-panel>h3{margin-top:0}
#browse .guide-panel{margin-top:18px}
@media(max-width:650px){.home-start-intro h2{font-size:24px}.home-shortcut-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.home-shortcut-card{min-height:153px;padding:10px}.home-shortcut-card:first-child{grid-column:1/-1;min-height:118px;display:grid;grid-template-columns:minmax(0,1fr) 92px;align-items:center}.home-shortcut-card:first-child img{grid-column:2;grid-row:1}.home-shortcut-card:first-child span{grid-column:1;grid-row:1}.home-shortcut-card strong{font-size:20px}.home-shortcut-card small{font-size:10.5px}#home .ideas-panel-heading h2,#browse .guide-panel .ideas-panel-heading h2{font-size:24px!important}}
@media(max-width:370px){.home-shortcut-grid{grid-template-columns:1fr}.home-shortcut-card:first-child{grid-column:auto}}


/* v1.22.24 — real recipe photos must not inherit the old placeholder oval */
.food-art::after{
  display:none!important;
  content:none!important;
}


/* v1.22.24 — banner stability + home artwork polish
   The previous compact-banner treatment inherited pieces of the full banner on
   some desktop states. These final rules make the two banner modes explicit. */

/* HOME: one stable full banner on every desktop width. */
@media (min-width:900px){
  .app:not(.compact-banner) .stable-recipe-banner{
    height:350px!important;
    min-height:350px!important;
    overflow:hidden!important;
    border-radius:24px!important;
  }
  .app:not(.compact-banner) .stable-banner-text{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    padding:13px 22px 0!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:flex-start!important;
  }
  .app:not(.compact-banner) .stable-banner-text .made-love{
    display:block!important;
    font-size:21px!important;
    line-height:1!important;
    margin:0 0 4px!important;
  }
  .app:not(.compact-banner) .stable-banner-text h1{
    display:block!important;
    width:100%!important;
    max-width:92%!important;
    margin:0!important;
    font-size:clamp(52px,4.2vw,66px)!important;
    line-height:.92!important;
    white-space:nowrap!important;
    text-align:center!important;
    transform:none!important;
  }
  .app:not(.compact-banner) .stable-banner-art{
    display:block!important;
    position:absolute!important;
    left:50%!important;
    top:88px!important;
    width:min(52%,560px)!important;
    height:246px!important;
    transform:translateX(-50%)!important;
    z-index:8!important;
  }
  .app:not(.compact-banner) .stable-banner-art .banner-bowl-img{
    width:100%!important;height:100%!important;object-fit:contain!important;object-position:center bottom!important;
  }
  .app:not(.compact-banner) .responsive-herbs{
    display:block!important;
    position:absolute!important;
    top:103px!important;
    bottom:12px!important;
    width:22%!important;
    height:auto!important;
    z-index:7!important;
  }
  .app:not(.compact-banner) .responsive-herbs-left{left:2.5%!important;right:auto!important;}
  .app:not(.compact-banner) .responsive-herbs-right{right:2.5%!important;left:auto!important;}
  .app:not(.compact-banner) .responsive-banner-features{display:none!important;}
}

/* SECONDARY PAGES: a deliberately compact masthead, not a cropped full banner. */
@media (min-width:651px){
  .app.compact-banner .phone-art-hero{padding:12px 18px 4px!important;margin:0!important;}
  .app.compact-banner .stable-recipe-banner{
    position:relative!important;
    height:126px!important;
    min-height:126px!important;
    overflow:hidden!important;
    border-radius:21px!important;
  }
  .app.compact-banner .stable-banner-text{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:126px!important;
    min-height:0!important;
    padding:14px 180px 8px 120px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    z-index:20!important;
  }
  .app.compact-banner .stable-banner-text .made-love{
    display:block!important;
    margin:0 0 1px!important;
    font-size:15px!important;
    line-height:1!important;
  }
  .app.compact-banner .stable-banner-text h1{
    display:block!important;
    width:auto!important;
    max-width:100%!important;
    margin:0!important;
    padding:0!important;
    font-size:38px!important;
    line-height:.98!important;
    white-space:nowrap!important;
    text-align:center!important;
    transform:none!important;
  }
  .app.compact-banner .responsive-herbs-left{
    display:block!important;
    position:absolute!important;
    left:18px!important;
    right:auto!important;
    top:13px!important;
    bottom:auto!important;
    width:94px!important;
    height:98px!important;
    z-index:8!important;
    opacity:1!important;
  }
  .app.compact-banner .responsive-herbs-right,
  .app.compact-banner .responsive-inner-herbs,
  .app.compact-banner .responsive-basil,
  .app.compact-banner .responsive-banner-features{display:none!important;}
  .app.compact-banner .stable-banner-art{
    display:block!important;
    position:absolute!important;
    left:auto!important;
    right:15px!important;
    top:9px!important;
    width:160px!important;
    height:110px!important;
    transform:none!important;
    z-index:8!important;
  }
  .app.compact-banner .stable-banner-art .banner-bowl-img{
    width:100%!important;height:100%!important;object-fit:contain!important;object-position:center bottom!important;
  }
}

@media (max-width:650px){
  .app.compact-banner .phone-art-hero{padding:8px 10px 3px!important;margin:0!important;}
  .app.compact-banner .stable-recipe-banner{height:92px!important;min-height:92px!important;}
  .app.compact-banner .stable-banner-text{height:92px!important;padding:0 92px 0 68px!important;justify-content:center!important;}
  .app.compact-banner .stable-banner-text .made-love{display:none!important;}
  .app.compact-banner .stable-banner-text h1{font-size:27px!important;line-height:1!important;white-space:nowrap!important;}
  .app.compact-banner .responsive-herbs-left{left:8px!important;top:8px!important;width:58px!important;height:74px!important;}
  .app.compact-banner .stable-banner-art{display:block!important;position:absolute!important;left:auto!important;right:5px!important;top:6px!important;width:92px!important;height:78px!important;transform:none!important;z-index:8!important;}
  .app.compact-banner .responsive-herbs-right,.app.compact-banner .responsive-banner-features{display:none!important;}
}

/* GIMI hero: make the illustration feel intentional instead of like a small icon
   stranded inside a large desktop panel. */
#home .have-panel{
  position:relative!important;
  overflow:hidden!important;
  border-color:#a9bf9b!important;
  background:linear-gradient(145deg,#ffffff 0%,#fbfdf8 62%,#f2f7ed 100%)!important;
}
#home .have-panel .ideas-panel-heading{
  display:grid!important;
  grid-template-columns:142px minmax(0,1fr)!important;
  align-items:center!important;
  gap:18px!important;
  margin:0 0 10px!important;
}
#home .have-panel .ideas-feature-art{
  width:142px!important;
  height:118px!important;
  object-fit:contain!important;
  filter:drop-shadow(0 7px 10px rgba(74,86,64,.10))!important;
}
#home .have-panel .ideas-panel-heading h2{font-size:32px!important;}

/* The three alternate routes are links, so use a compact illustrated strip rather
   than three large empty cards. */
#home .home-shortcuts-panel{padding:15px!important;}
#home .home-shortcut-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:10px!important;}
#home .home-shortcut-card{
  min-height:128px!important;
  padding:12px 12px 12px 14px!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 92px!important;
  grid-template-rows:1fr!important;
  align-items:center!important;
  gap:8px!important;
  border-radius:17px!important;
}
#home .home-shortcut-card span{grid-column:1!important;grid-row:1!important;align-self:center!important;}
#home .home-shortcut-card img{
  grid-column:2!important;grid-row:1!important;
  width:92px!important;height:92px!important;
  margin:0!important;align-self:center!important;justify-self:center!important;
  object-fit:contain!important;border-radius:14px!important;
  filter:drop-shadow(0 5px 8px rgba(61,51,63,.08))!important;
}
#home .home-shortcut-card.browse-shortcut img{width:96px!important;height:90px!important;object-fit:cover!important;}
#home .home-shortcut-card strong{font-size:22px!important;margin-bottom:5px!important;}
#home .home-shortcut-card small{font-size:11px!important;line-height:1.3!important;}

/* Browse + Cooking Guides page: give the guide artwork more visual weight. */
#browse .guide-panel .ideas-panel-heading{min-height:112px!important;}
#browse .guide-panel .ideas-feature-art{width:132px!important;height:108px!important;filter:drop-shadow(0 6px 10px rgba(61,51,63,.09))!important;}

@media(max-width:650px){
  #home .have-panel .ideas-panel-heading{grid-template-columns:86px minmax(0,1fr)!important;gap:11px!important;}
  #home .have-panel .ideas-feature-art{width:86px!important;height:78px!important;}
  #home .have-panel .ideas-panel-heading h2{font-size:25px!important;}
  #home .home-shortcut-grid{grid-template-columns:1fr!important;}
  #home .home-shortcut-card{min-height:104px!important;grid-template-columns:minmax(0,1fr) 80px!important;padding:10px 11px!important;}
  #home .home-shortcut-card img,#home .home-shortcut-card.browse-shortcut img{width:76px!important;height:72px!important;}
  #browse .guide-panel .ideas-feature-art{width:82px!important;height:72px!important;}
}


/* v1.22.24 — recipe flow, planner controls, Plant Points target and linked Cooking Guides */
.got-it-ingredient-intro{margin:18px 0 8px;padding:11px 13px;border:1.5px solid #a9bd99;border-radius:14px;background:#f5f9f1;display:flex;align-items:baseline;gap:9px;flex-wrap:wrap}
.got-it-ingredient-intro strong{font-family:var(--heading-hand);font-size:24px;line-height:1;color:#5b1665}
.got-it-ingredient-intro span{font-size:12px;line-height:1.4;color:#60705b}
.start-cooking-mode{margin:15px 0 14px!important;font-size:18px!important;letter-spacing:.01em}
.meal-plan-top-row{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:10px}
.meal-plan-top-row .meal-plan-title{margin-bottom:0;min-width:0}
.meal-plan-top-row .meal-plan-view{width:auto;margin:0;white-space:nowrap;align-self:center}
.meal-plan-shop{width:100%;line-height:1.25}
.shopping-plant-points{display:block;width:100%;max-width:540px}
.shopping-plant-summary{display:flex;align-items:center;gap:10px}
.shopping-plant-summary>span:first-child{font-size:24px}
.shopping-plant-summary>span:last-child{display:flex;flex-direction:column}
.plant-target-celebration{margin-top:10px;padding:12px 14px;border:2px solid #91a97e;border-radius:16px;background:linear-gradient(135deg,#fffdf4,#eef7e7);text-align:center;box-shadow:0 5px 15px rgba(74,96,62,.10)}
.plant-target-celebration .plant-target-stars{display:block;font-size:25px;line-height:1.1;margin-bottom:2px}
.plant-target-celebration strong{display:block;font-family:var(--heading-hand);font-size:23px;color:#5b1665}
.plant-target-setting{margin:10px 0;padding:12px 13px;border:1px solid #d7dfcf;border-radius:14px;background:#f8faf6}
.plant-target-setting h3{margin:0 0 2px;font-size:18px;color:#5b1665}
.plant-target-setting .meta{margin:0 0 8px}
.plant-target-setting-row{display:grid;grid-template-columns:minmax(90px,130px) auto;gap:8px;align-items:center}
.plant-target-setting-row input{min-width:0;border:1px solid #cfd8c8;border-radius:11px;padding:9px 10px;background:#fff;font:inherit}
.cooking-guide-link{color:#5b1665!important;border-color:#cdb8d3!important;background:#faf6fb!important;font-weight:850!important}
.cooking-step-card>.cooking-guide-link{display:block;width:100%;margin:12px 0 0;padding:10px 12px;border:1px solid #cdb8d3;border-radius:12px;text-align:left}
.guide-return-button{margin:0 0 12px;width:auto}
@media(max-width:650px){
  .meal-plan-top-row{display:grid;grid-template-columns:1fr auto;gap:8px}
  .meal-plan-top-row .meal-plan-view{font-size:11px;padding:8px 9px}
  .plant-target-setting-row{grid-template-columns:1fr auto}
  .got-it-ingredient-intro{align-items:flex-start}
}
\n\n/* v1.22.24 — Make It! popup layering and simpler cooking view */
/* Help/tip dialogs must sit above the full-screen Make It! layer. */
#methodHelpModal{z-index:510!important;}
#methodHelpModal.open{display:flex!important;}
.step-ingredient-popup{z-index:520!important;}
.timer-alarm{z-index:530!important;}
.toast{z-index:540!important;}
/* View-all-ingredients was intentionally removed from Make It!; hide any stale cached markup too. */
.cooking-mode .cooking-all-ingredients{display:none!important;}


/* v1.22.24 — navigation icons, consistent headings, strong borders, Browse order and banner stability */

/* Clear, non-emoji navigation artwork: no platform-dependent magnifying-glass/emoji rendering. */
.nav button .nav-icon{display:block!important;width:24px!important;height:24px!important;margin:0 auto 3px!important;line-height:0!important;color:currentColor!important}
.nav button .nav-icon svg{display:block!important;width:24px!important;height:24px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.8!important;stroke-linecap:round!important;stroke-linejoin:round!important}
.bottom .nav button span.nav-icon{font-size:0!important}

/* All main page headers use the same handwritten face, weight and scale. */
.content h2,
.content .home-start-intro h2,
.content .home-section-heading h2,
.content .ideas-panel-heading h2,
#browse .browse-search-panel>h2,
#shopping .shopping-heading-row h2,
#methods .methods-panel>h2,
#about .week-planner-header h2,
#about #aboutHeading{
  font-family:var(--heading-hand)!important;
  font-size:28px!important;
  line-height:1.08!important;
  font-weight:700!important;
  color:#5b1665!important;
  letter-spacing:0!important;
}
#browse .filter-panel>h2{margin:0 0 10px!important}
#browse .browse-search-panel>h2{margin:0 0 10px!important}
@media(max-width:650px){
  .content h2,
  .content .home-start-intro h2,
  .content .home-section-heading h2,
  .content .ideas-panel-heading h2,
  #browse .browse-search-panel>h2,
  #shopping .shopping-heading-row h2,
  #methods .methods-panel>h2,
  #about .week-planner-header h2,
  #about #aboutHeading{font-size:24px!important;font-weight:700!important}
}

/* Stronger card/panel outlines throughout the user-facing app. Inputs keep their lighter borders. */
.panel,
.home-shortcut-card,
.photo-filter,
.card,
.guide-category-card,
.guide-result-card,
.method-card,
.cut-guide-card,
.week-planner,
.week-day-card,
.plant-target-setting,
.personal-notes-box{
  border-width:2px!important;
  border-style:solid!important;
}
.panel{border-color:#b8c9ae!important}
.home-shortcuts-panel{border-color:#bda8c3!important}
.home-shortcut-card{border-color:#bda8c3!important}
#surpriseStart{border-color:#6f8f61!important}
#randomStart{border-color:#5b1665!important}
#home .have-panel{border-color:#87a274!important}
#browse .filter-panel,#browse .browse-search-panel,#browse .guide-panel{border-color:#9fb58f!important}
.photo-filter,.guide-category-card{border-color:#b7c8ad!important}
.card{border-color:#b9c6bf!important}
.method-card,.cut-guide-card{border-color:#c5b6c8!important}

/* Browse search belongs directly above Cooking Guides. */
#browse .browse-search-panel{margin:20px 0 12px!important}
#browse .guide-panel{margin-top:0!important}

/* Permanent dedication. */
.rebecca-love{margin:14px 0 6px!important;text-align:center!important;font-family:var(--heading-hand)!important;font-size:20px!important;font-weight:700!important;color:#5b1665!important}

/* Banner reset: final rules deliberately override the many historical banner experiments. */
.phone-art-hero{box-sizing:border-box!important;width:100%!important}
.stable-recipe-banner{display:block!important;position:relative!important;width:100%!important;max-width:none!important;margin:0 auto!important;background:#fffaf4!important;border:4px solid #5b1665!important;box-shadow:0 8px 24px rgba(82,35,92,.12)!important}
.stable-recipe-banner::after{display:block!important;content:""!important;position:absolute!important;pointer-events:none!important;border:2px solid rgba(91,22,101,.65)!important;z-index:30!important}
.stable-banner-art,.responsive-herbs{background:none!important;background-image:none!important}
.banner-bowl-img,.banner-herb-img{display:block!important;width:100%!important;height:100%!important;object-fit:contain!important;filter:none!important;opacity:1!important}
.responsive-herbs-right .banner-herb-img{transform:scaleX(-1)!important;transform-origin:center!important}
.responsive-banner-features,.responsive-inner-herbs,.responsive-basil{display:none!important}

/* Full Home banner — fixed composition inside the app width, including very wide monitors. */
@media(min-width:651px){
  .app:not(.compact-banner) .phone-art-hero{padding:14px 18px 9px!important;margin:0!important}
  .app:not(.compact-banner) .stable-recipe-banner{height:350px!important;min-height:350px!important;border-radius:24px!important;overflow:hidden!important}
  .app:not(.compact-banner) .stable-recipe-banner::after{inset:9px!important;border-radius:17px!important}
  .app:not(.compact-banner) .stable-banner-text{position:absolute!important;left:0!important;right:0!important;top:10px!important;width:100%!important;height:auto!important;min-height:0!important;padding:0 22px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:flex-start!important;z-index:20!important}
  .app:not(.compact-banner) .stable-banner-text .made-love{display:block!important;margin:0 0 3px!important;font-family:var(--heading-hand)!important;font-size:20px!important;line-height:1!important;font-weight:400!important;color:#5b1665!important}
  .app:not(.compact-banner) .stable-banner-text h1{display:block!important;width:100%!important;max-width:94%!important;margin:0!important;padding:0!important;font-family:var(--heading-hand)!important;font-size:clamp(50px,6.1vw,68px)!important;line-height:.94!important;font-weight:700!important;white-space:nowrap!important;text-align:center!important;transform:none!important;color:#5b1665!important}
  .app:not(.compact-banner) .stable-banner-art{display:block!important;position:absolute!important;left:50%!important;top:86px!important;bottom:auto!important;width:min(53%,555px)!important;height:250px!important;min-height:0!important;transform:translateX(-50%)!important;z-index:9!important}
  .app:not(.compact-banner) .responsive-herbs{display:block!important;position:absolute!important;top:105px!important;bottom:auto!important;width:21.5%!important;height:226px!important;z-index:8!important;opacity:1!important}
  .app:not(.compact-banner) .responsive-herbs-left{left:2.5%!important;right:auto!important;transform:none!important}
  .app:not(.compact-banner) .responsive-herbs-right{right:2.5%!important;left:auto!important;transform:none!important}
}

/* Full Home banner on phones — the whole bowl and both herb clusters fit without cropping. */
@media(max-width:650px){
  .app:not(.compact-banner) .phone-art-hero{padding:8px 9px 7px!important;margin:0!important}
  .app:not(.compact-banner) .stable-recipe-banner{height:324px!important;min-height:324px!important;border-width:3px!important;border-radius:19px!important;overflow:hidden!important}
  .app:not(.compact-banner) .stable-recipe-banner::after{inset:6px!important;border-radius:12px!important}
  .app:not(.compact-banner) .stable-banner-text{position:absolute!important;left:0!important;right:0!important;top:7px!important;width:100%!important;height:auto!important;min-height:0!important;padding:0 8px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:flex-start!important;z-index:20!important}
  .app:not(.compact-banner) .stable-banner-text .made-love{display:block!important;margin:0 0 2px!important;font-family:var(--heading-hand)!important;font-size:18px!important;line-height:1!important;font-weight:400!important;color:#5b1665!important}
  .app:not(.compact-banner) .stable-banner-text h1{display:block!important;width:100%!important;max-width:100%!important;margin:0!important;padding:0!important;font-family:var(--heading-hand)!important;font-size:clamp(38px,11.7vw,50px)!important;line-height:.94!important;font-weight:700!important;white-space:nowrap!important;text-align:center!important;transform:none!important;color:#5b1665!important;letter-spacing:-.02em!important}
  .app:not(.compact-banner) .stable-banner-art{display:block!important;position:absolute!important;left:50%!important;top:68px!important;bottom:auto!important;width:78%!important;height:190px!important;min-height:0!important;transform:translateX(-50%)!important;z-index:9!important}
  .app:not(.compact-banner) .responsive-herbs{display:block!important;position:absolute!important;top:102px!important;bottom:auto!important;width:34%!important;height:188px!important;z-index:8!important;opacity:1!important}
  .app:not(.compact-banner) .responsive-herbs-left{left:0!important;right:auto!important;transform:none!important}
  .app:not(.compact-banner) .responsive-herbs-right{right:0!important;left:auto!important;transform:none!important}
}
@media(max-width:370px){
  .app:not(.compact-banner) .stable-recipe-banner{height:306px!important;min-height:306px!important}
  .app:not(.compact-banner) .stable-banner-text h1{font-size:40px!important}
  .app:not(.compact-banner) .stable-banner-art{top:64px!important;height:178px!important;width:79%!important}
  .app:not(.compact-banner) .responsive-herbs{top:96px!important;height:177px!important;width:35%!important}
}

/* Compact banner on Browse/Shopping/Methods/Planner — stable on phones and wide screens. */
@media(min-width:651px){
  .app.compact-banner .phone-art-hero{padding:10px 18px 5px!important;margin:0!important}
  .app.compact-banner .stable-recipe-banner{height:118px!important;min-height:118px!important;border-radius:20px!important;overflow:hidden!important}
  .app.compact-banner .stable-recipe-banner::after{inset:7px!important;border-radius:13px!important}
  .app.compact-banner .stable-banner-text{position:absolute!important;inset:0!important;width:100%!important;height:118px!important;min-height:0!important;padding:8px 150px 6px 105px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;z-index:20!important}
  .app.compact-banner .stable-banner-text .made-love{display:block!important;margin:0!important;font-family:var(--heading-hand)!important;font-size:14px!important;line-height:1!important;font-weight:400!important}
  .app.compact-banner .stable-banner-text h1{display:block!important;width:100%!important;max-width:100%!important;margin:0!important;padding:0!important;font-family:var(--heading-hand)!important;font-size:36px!important;line-height:.98!important;font-weight:700!important;white-space:nowrap!important;text-align:center!important;transform:none!important}
  .app.compact-banner .responsive-herbs-left{display:block!important;position:absolute!important;left:15px!important;right:auto!important;top:10px!important;bottom:auto!important;width:82px!important;height:94px!important;z-index:8!important;transform:none!important}
  .app.compact-banner .responsive-herbs-right{display:none!important}
  .app.compact-banner .stable-banner-art{display:block!important;position:absolute!important;left:auto!important;right:12px!important;top:7px!important;bottom:auto!important;width:132px!important;height:102px!important;min-height:0!important;transform:none!important;z-index:8!important}
}
@media(max-width:650px){
  .app.compact-banner .phone-art-hero{padding:7px 9px 4px!important;margin:0!important}
  .app.compact-banner .stable-recipe-banner{height:82px!important;min-height:82px!important;border-width:3px!important;border-radius:18px!important;overflow:hidden!important}
  .app.compact-banner .stable-recipe-banner::after{inset:5px!important;border-radius:11px!important}
  .app.compact-banner .stable-banner-text{position:absolute!important;inset:0!important;width:100%!important;height:82px!important;min-height:0!important;padding:0 74px 0 57px!important;display:flex!important;align-items:center!important;justify-content:center!important;z-index:20!important}
  .app.compact-banner .stable-banner-text .made-love{display:none!important}
  .app.compact-banner .stable-banner-text h1{display:block!important;width:100%!important;max-width:100%!important;margin:0!important;padding:0!important;font-family:var(--heading-hand)!important;font-size:clamp(22px,7.2vw,28px)!important;line-height:1!important;font-weight:700!important;white-space:nowrap!important;text-align:center!important;transform:none!important}
  .app.compact-banner .responsive-herbs-left{display:block!important;position:absolute!important;left:6px!important;right:auto!important;top:7px!important;bottom:auto!important;width:47px!important;height:64px!important;z-index:8!important;transform:none!important}
  .app.compact-banner .responsive-herbs-right{display:none!important}
  .app.compact-banner .stable-banner-art{display:block!important;position:absolute!important;left:auto!important;right:3px!important;top:5px!important;bottom:auto!important;width:72px!important;height:68px!important;min-height:0!important;transform:none!important;z-index:8!important}
}

/* v1.22.24 final consistency corrections */
.nav{grid-template-columns:repeat(5,minmax(0,1fr))!important}

/* Match the visibly strong Can't Decide / Surprise Me outlines across all main boxes. */
.panel,
.home-shortcut-card,
.photo-filter,
.card,
.guide-category-card,
.guide-result-card,
.method-card,
.cut-guide-card,
.week-planner,
.week-day-card,
.plant-target-setting,
.personal-notes-box{border-width:3px!important}
#surpriseStart,#randomStart{border-width:3px!important}

/* High-specificity heading reset so older experimental rules cannot make individual headings larger/bolder. */
#home .home-start-intro h2,
#home .have-panel .ideas-panel-heading h2,
#home .home-section-heading h2,
#browse .home-section-heading h2,
#browse .filter-panel>h2,
#browse .browse-search-panel>h2,
#browse .guide-panel .ideas-panel-heading h2,
#shopping .shopping-heading-row h2,
#methods .methods-panel>h2,
#about .week-planner-header h2,
#about #aboutHeading{
  font-family:var(--heading-hand)!important;
  font-size:28px!important;
  line-height:1.08!important;
  font-weight:700!important;
  color:#5b1665!important;
  letter-spacing:0!important;
}
@media(max-width:650px){
  #home .home-start-intro h2,
  #home .have-panel .ideas-panel-heading h2,
  #home .home-section-heading h2,
  #browse .home-section-heading h2,
  #browse .filter-panel>h2,
  #browse .browse-search-panel>h2,
  #browse .guide-panel .ideas-panel-heading h2,
  #shopping .shopping-heading-row h2,
  #methods .methods-panel>h2,
  #about .week-planner-header h2,
  #about #aboutHeading{font-size:24px!important;font-weight:700!important}
}


/* v1.22.29 — Android banner + Make It! reliability
   Final overrides intentionally come last. */
#methodHelpModal{z-index:10000!important;position:fixed!important;inset:0!important;}
.cooking-mode.help-paused{visibility:hidden!important;}
.cooking-mode-shell{
  touch-action:pan-y!important;
  overscroll-behavior:contain!important;
  -webkit-overflow-scrolling:touch;
}

/* Keep the entire artwork inside the banner on Android phones. The image boxes
   use their real source aspect ratios instead of stretched fixed heights. */
@media(max-width:650px){
  .phone-art-hero{
    width:100%!important;
    max-width:100%!important;
    padding-left:9px!important;
    padding-right:9px!important;
    overflow:visible!important;
  }

  .app:not(.compact-banner) .stable-recipe-banner{
    width:100%!important;
    height:clamp(268px,78vw,316px)!important;
    min-height:0!important;
    max-height:316px!important;
    overflow:hidden!important;
  }
  .app:not(.compact-banner) .stable-banner-text{
    top:7px!important;
    padding:0 7px!important;
  }
  .app:not(.compact-banner) .stable-banner-text .made-love{
    font-size:17px!important;
    line-height:1!important;
  }
  .app:not(.compact-banner) .stable-banner-text h1{
    font-size:clamp(34px,10.2vw,44px)!important;
    line-height:.96!important;
    letter-spacing:-.025em!important;
    white-space:nowrap!important;
  }
  .app:not(.compact-banner) .stable-banner-art{
    left:50%!important;
    top:22%!important;
    width:79%!important;
    height:auto!important;
    aspect-ratio:893 / 535!important;
    transform:translateX(-50%)!important;
  }
  .app:not(.compact-banner) .responsive-herbs{
    top:32%!important;
    width:29%!important;
    height:auto!important;
    aspect-ratio:322 / 421!important;
  }
  .app:not(.compact-banner) .responsive-herbs-left{left:1%!important;}
  .app:not(.compact-banner) .responsive-herbs-right{right:1%!important;}

  .app.compact-banner .stable-recipe-banner{
    width:100%!important;
    height:86px!important;
    min-height:86px!important;
    max-height:86px!important;
    overflow:hidden!important;
  }
  .app.compact-banner .stable-banner-text{
    height:86px!important;
    padding:0 72px 0 58px!important;
  }
  .app.compact-banner .stable-banner-text h1{
    font-size:clamp(21px,6.7vw,27px)!important;
    line-height:1!important;
    white-space:nowrap!important;
  }
  .app.compact-banner .responsive-herbs-left{
    left:7px!important;
    top:10px!important;
    width:43px!important;
    height:auto!important;
    aspect-ratio:322 / 421!important;
  }
  .app.compact-banner .stable-banner-art{
    right:4px!important;
    top:12px!important;
    width:68px!important;
    height:auto!important;
    aspect-ratio:893 / 535!important;
  }
}

/* Extra-small Android screens: leave a little more breathing room for the title. */
@media(max-width:370px){
  .app:not(.compact-banner) .stable-recipe-banner{
    height:272px!important;
  }
  .app:not(.compact-banner) .stable-banner-text h1{
    font-size:35px!important;
  }
}


/* v1.22.30 — ingredient Alternatives / “Don’t have it?” */
.ingredient-with-alternatives{align-items:flex-start}
.ingredient-copy{flex:1;min-width:0}
.ingredient-line{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
  min-height:30px;
  line-height:1.4;
}
.ingredient-line>span{padding-top:3px}
.ingredient-swap-link{
  flex:0 0 auto;
  border:0;
  background:transparent;
  color:var(--brand);
  padding:4px 0 4px 8px;
  font-size:12px;
  font-weight:850;
  text-decoration:underline;
  text-underline-offset:2px;
  cursor:pointer;
}
.ingredient-swap-panel{
  margin:7px 0 2px;
  padding:9px 11px;
  border-left:4px solid #8eae83;
  border-radius:0 9px 9px 0;
  background:#f4f8f1;
  font-size:13px;
}
.ingredient-swap-panel[hidden]{display:none!important}
.ingredient-swap-panel strong{display:block;margin-bottom:4px;color:var(--green)}
.ingredient-swap-panel ul{margin:0;padding-left:19px}
.ingredient-swap-panel li{margin:3px 0;line-height:1.4}
@media(max-width:430px){
  .ingredient-line{display:block}
  .ingredient-swap-link{padding:4px 0 0;font-size:12px}
}


/* v1.22.31 — cleaner main banner + visible vegan classification */
.app:not(.compact-banner) .stable-recipe-banner::after{
  display:none!important;
  content:none!important;
  border:0!important;
}
.vegan-tag{
  font-weight:900;
}


/* v1.22.32 — persistent dietary preference */
.dietary-preference-setting{
  margin:18px 0;
  padding:15px;
  border:1px solid var(--line);
  border-radius:16px;
  background:#fbfdfb;
}
.settings-eyebrow{
  color:var(--brand);
  margin-bottom:4px;
}
.dietary-preference-setting h3{
  margin:0 0 5px;
  font-size:18px;
}
.dietary-preference-setting>.meta{
  margin:0 0 12px;
  line-height:1.45;
}
.dietary-preference-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
}
.dietary-preference-choice{
  border:1px solid var(--line);
  border-radius:13px;
  background:#fff;
  color:var(--ink);
  padding:11px 9px;
  text-align:left;
  cursor:pointer;
  min-height:76px;
}
.dietary-preference-choice strong{
  display:block;
  margin-bottom:3px;
  font-size:13px;
}
.dietary-preference-choice small{
  display:block;
  color:var(--muted);
  font-size:10px;
  line-height:1.3;
}
.dietary-preference-choice.active{
  border-color:var(--green);
  background:#eaf3e7;
  box-shadow:0 0 0 2px rgba(97,124,102,.15);
}
.dietary-preference-choice.active strong{
  color:var(--green);
}
.dietary-preference-status{
  margin:10px 0 0;
  padding:9px 10px;
  border-radius:10px;
  background:#f0f5ef;
  color:#526459;
  font-size:11px;
  line-height:1.4;
}
.dietary-modal-note{
  margin:0 0 13px;
  padding:9px 11px;
  border-radius:10px;
  background:#edf5e9;
  color:var(--green);
  font-size:12px;
  font-weight:750;
}
.surprise-question{
  display:block;
  margin:13px 0;
}
.surprise-question strong{
  display:block;
  margin-bottom:6px;
  font-size:13px;
}
@media(max-width:520px){
  .dietary-preference-grid{
    grid-template-columns:1fr;
  }
  .dietary-preference-choice{
    min-height:0;
  }
}


/* v1.22.33 — plan after reading + free/busy chooser + movable meals */
.end-of-recipe-planner{margin-top:22px;border-width:2px}
.meal-plan-top-row{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.meal-plan-top-row .meal-plan-title{margin-bottom:0}
.meal-availability-wrap{margin:12px 0 10px;padding:10px;border:1px solid #ded5df;border-radius:14px;background:#fff}
.meal-availability-heading{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:7px}
.meal-availability-heading strong{color:#5b1665;font-size:13px}
.meal-availability-heading span{color:#756878;font-size:10px;text-align:right}
.meal-availability-nav{display:grid;grid-template-columns:34px 1fr 34px;gap:6px;align-items:center;margin-bottom:7px}
.meal-availability-nav .secondary{padding:5px;min-width:0}
#mealAvailabilityWeek{text-align:center;color:#6b5d6d;font-size:11px;font-weight:850}
.meal-availability-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px}
.meal-availability-day{min-width:0;padding:7px 3px;border:1px solid #d9d2da;border-radius:10px;background:#f6fbf4;color:#3f2942;cursor:pointer;text-align:center}
.meal-availability-day>span,.meal-availability-day>strong,.meal-availability-day>small,.meal-availability-day>em{display:block;min-width:0}
.meal-availability-day>span{font-size:9px;font-weight:850;color:#756878}
.meal-availability-day>strong{font-size:15px;line-height:1.2}
.meal-availability-day>small{margin-top:2px;font-size:8.5px;font-weight:900;color:#557048}
.meal-availability-day>em{margin-top:2px;font-size:7.5px;line-height:1.15;color:#756878;font-style:normal;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.meal-availability-day.busy{background:#fff4e8;border-color:#deb67b}
.meal-availability-day.busy>small{color:#9a5d19}
.meal-availability-day.same-meal{background:#edf6e9;border-color:#8faa80}
.meal-availability-day.selected{box-shadow:0 0 0 2px #5b1665;border-color:#5b1665}
.week-meal[draggable="true"]{cursor:grab}
.week-day.dragging{opacity:.55}
.week-day.drag-over{box-shadow:0 0 0 3px rgba(91,22,101,.26);border-color:#5b1665!important}
.week-day.moving-source{box-shadow:0 0 0 2px #5b1665}
.week-move{align-self:flex-start;border:0;border-radius:999px;padding:3px 7px;background:#f1e8f3;color:#5b1665;font-size:8.5px;font-weight:900;cursor:pointer}
.week-move-here{position:absolute;inset:31px 4px 4px;z-index:3;border:2px dashed #5b1665;border-radius:9px;background:rgba(250,246,251,.94);color:#5b1665;font-size:9px;font-weight:900;cursor:pointer}
.week-planner-summary em{color:#5b1665;font-style:normal;font-weight:850}
@media(max-width:650px){
  .meal-plan-top-row{display:block}
  .meal-plan-view{width:100%;margin:7px 0 2px}
  .meal-availability-wrap{padding:8px 5px}
  .meal-availability-days{gap:3px}
  .meal-availability-day{padding:6px 1px}
  .meal-availability-day>strong{font-size:14px}
  .meal-availability-day>em{display:none}
  .week-move{align-self:center;font-size:8px;padding:3px 5px}
}
@media(max-width:390px){
  .meal-availability-day>span{font-size:8px}
  .meal-availability-day>strong{font-size:13px}
  .meal-availability-day>small{font-size:7.5px}
}


/* v1.22.34 — Builder descriptions + weekly Plant Points */
.recipe-card-description{
  margin:5px 0 0;
  color:#5f5261;
  font-size:12px;
  line-height:1.42;
}
.recipe-description{
  margin:7px 0 11px;
  color:#453b46;
  font-size:15px;
  line-height:1.55;
}
.recipe-tags{margin-bottom:2px}
.plant-info-trigger{cursor:pointer}
button.plant-points-badge{
  font:inherit;
  border:0;
}
button.plant-points-detail{
  width:100%;
  text-align:left;
  font:inherit;
}
.plant-info-icon{
  flex:0 0 auto;
  align-self:center;
  margin-left:auto;
  font-weight:900;
  opacity:.78;
}
.planner-plant-points{
  margin:9px 0 12px;
}
.planner-plant-summary,
.shopping-plant-summary{
  width:100%;
  display:flex;
  align-items:center;
  gap:9px;
  text-align:left;
  border:1px solid #bdd0b6;
  border-radius:13px;
  background:#f0f7ed;
  color:#38533a;
  padding:9px 11px;
  font:inherit;
}
.planner-plant-summary>span:first-child,
.shopping-plant-summary>span:first-child{font-size:21px}
.planner-plant-summary strong,
.shopping-plant-summary strong{display:block}
.planner-plant-summary small,
.shopping-plant-summary small{display:block;margin-top:2px;color:#657566;line-height:1.3}
.planner-plant-celebration{
  margin-top:6px;
  padding:6px 9px;
  border-radius:9px;
  background:#eef7e9;
  color:#4d6948;
  font-size:11px;
  font-weight:900;
  text-align:center;
}
.week-day-plant{
  color:#4f714c!important;
  font-weight:850!important;
}
.plant-points-modal{
  z-index:160!important;
}
.plant-points-help-sheet{
  max-width:620px;
}
.plant-points-kicker{
  color:#557653;
}
.plant-points-explainer{
  font-size:14px;
  line-height:1.55;
}
.plant-points-explainer p{margin:9px 0}
.plant-points-breakdown{
  margin:12px 0;
  padding:10px 11px;
  border-radius:11px;
  background:#f2f7f0;
  border-left:4px solid #7ea273;
}
.plant-points-breakdown p{
  margin:4px 0 0;
  color:#5d685a;
  font-size:12px;
}
.plant-points-difference{
  margin-top:14px!important;
  padding-top:12px;
  border-top:1px solid #ddd;
}
@media(max-width:520px){
  .recipe-card-description{font-size:11px}
  .recipe-description{font-size:14px}
  .planner-plant-summary,.shopping-plant-summary{padding:8px 9px}
}


/* v1.22.35 — allergen exclusions in Settings */
.allergen-preference-setting{
  margin:18px 0;
  padding:15px;
  border:1px solid var(--line);
  border-radius:16px;
  background:#fffafb;
}
.allergen-preference-setting h3{
  margin:0 0 5px;
  font-size:18px;
}
.allergen-preference-setting>.meta{
  margin:0 0 12px;
  line-height:1.45;
}
.allergen-preference-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:7px;
}
.allergen-preference-choice{
  border:1px solid var(--line);
  border-radius:11px;
  background:#fff;
  color:var(--ink);
  padding:9px 10px;
  text-align:left;
  cursor:pointer;
  font-size:11px;
  font-weight:800;
  line-height:1.25;
}
.allergen-preference-choice.active{
  background:#fbe9e9;
  border-color:#b76262;
  color:#7c2f2f;
  box-shadow:0 0 0 2px rgba(183,98,98,.12);
}
.allergen-preference-choice.active::before{
  content:'✕ ';
  font-weight:950;
}
.allergen-preference-status{
  margin:10px 0 0;
  padding:9px 10px;
  border-radius:10px;
  background:#f7f1f1;
  color:#6e5050;
  font-size:11px;
  line-height:1.4;
}
.allergen-filter-warning{
  margin:9px 0 0;
  color:#6b5f65;
  font-size:10px;
  line-height:1.45;
}
@media(max-width:520px){
  .allergen-preference-grid{grid-template-columns:1fr}
}


/* v1.22.37 — recipe opening position + main banner title spacing */
.app:not(.compact-banner) .stable-banner-text .made-love{
  margin-bottom:9px!important;
  transform:translateY(-2px)!important;
}
@media(max-width:650px){
  .app:not(.compact-banner) .stable-banner-text .made-love{
    margin-bottom:7px!important;
    transform:translateY(-1px)!important;
  }
}
\n\n/* v1.22.37 — simpler Home + GIMI-first banner polish */
/* Both large and compact banners use only the outer purple border. */
.stable-recipe-banner::after,
.app:not(.compact-banner) .stable-recipe-banner::after,
.app.compact-banner .stable-recipe-banner::after{
  display:none!important;
  content:none!important;
  border:0!important;
}

/* Home begins directly with Got It? Make It! — no redundant Start here heading. */
#home .home-start-intro{display:none!important;}
#home .have-panel{margin-top:2px!important;}
#home .have-panel .ideas-panel-heading{
  display:grid!important;
  grid-template-columns:170px minmax(0,1fr)!important;
  align-items:center!important;
  gap:22px!important;
  text-align:left!important;
  margin:0 0 12px!important;
}
#home .have-panel .ideas-feature-art{
  grid-column:1!important;
  grid-row:1!important;
  justify-self:start!important;
  align-self:center!important;
  width:165px!important;
  height:136px!important;
  object-fit:contain!important;
}
#home .have-panel .ideas-panel-heading>div{
  grid-column:2!important;
  grid-row:1!important;
  min-width:0!important;
  text-align:left!important;
}
/* Match the visual scale of the Recipes title in the main banner. */
#home .have-panel .ideas-panel-heading h2{
  font-family:var(--heading-hand)!important;
  font-size:clamp(50px,5.5vw,66px)!important;
  line-height:.94!important;
  font-weight:700!important;
  letter-spacing:-.02em!important;
  color:#5b1665!important;
  margin:2px 0 0!important;
  white-space:normal!important;
}
#home .have-panel .ideas-panel-heading .eyebrow{
  margin-bottom:3px!important;
}

@media(max-width:650px){
  #home .have-panel .ideas-panel-heading{
    grid-template-columns:96px minmax(0,1fr)!important;
    gap:12px!important;
  }
  #home .have-panel .ideas-feature-art{
    width:94px!important;
    height:86px!important;
  }
  #home .have-panel .ideas-panel-heading h2{
    font-size:clamp(36px,10vw,44px)!important;
    line-height:.96!important;
  }
}
@media(max-width:370px){
  #home .have-panel .ideas-panel-heading{
    grid-template-columns:82px minmax(0,1fr)!important;
    gap:9px!important;
  }
  #home .have-panel .ideas-feature-art{
    width:80px!important;
    height:74px!important;
  }
  #home .have-panel .ideas-panel-heading h2{
    font-size:34px!important;
  }
}


/* v1.22.38 — GIMI quick ingredient buttons on desktop too */
#home .have-mobile-picks{
  display:block!important;
  margin:10px 0 12px!important;
  padding:12px!important;
  border:1px solid #d7e3cf!important;
  border-radius:15px!important;
  background:#f6faf3!important;
}
#home .have-mobile-picks>p{
  margin:0 0 9px!important;
  color:#4a5947!important;
  font-size:13px!important;
}
#home .have-mobile-picks>p strong{
  display:block!important;
  color:#5b1665!important;
  font-size:15px!important;
}
#home .have-mobile-picks>p small{
  display:block!important;
  margin-top:2px!important;
  color:#758071!important;
  font-size:11px!important;
  font-weight:500!important;
}
#home .have-quick-grid{
  display:grid!important;
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
  gap:7px!important;
}
#home .have-quick-chip{
  min-width:0!important;
  border:1px solid #c8d8bf!important;
  border-radius:999px!important;
  background:#fff!important;
  color:#485646!important;
  padding:9px 7px!important;
  font-size:12px!important;
  font-weight:800!important;
  text-align:center!important;
  cursor:pointer!important;
}
#home .have-quick-chip:hover{
  border-color:#8fad82!important;
  background:#f0f6ec!important;
}
#home .have-quick-chip.active{
  background:#5b1665!important;
  color:#fff!important;
  border-color:#5b1665!important;
  box-shadow:0 0 0 2px rgba(91,22,101,.10)!important;
}
#home .have-mobile-more{
  margin:8px 1px 0!important;
  color:#766d78!important;
  font-size:10.5px!important;
}
@media(max-width:900px){
  #home .have-quick-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;}
}
@media(max-width:650px){
  #home .have-mobile-picks{margin:7px 0 11px!important;padding:10px!important;}
  #home .have-quick-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:6px!important;}
  #home .have-quick-chip{padding:9px 4px!important;font-size:11.5px!important;}
}
@media(max-width:390px){
  #home .have-quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}


/* v1.22.39 — more breathing room in the GIMI heading */
#home .have-panel .ideas-panel-heading .eyebrow{
  margin-bottom:12px!important;
}
@media(max-width:650px){
  #home .have-panel .ideas-panel-heading .eyebrow{
    margin-bottom:9px!important;
  }
}


/* v1.22.40 — Home/Browse layout + responsive descriptions */

/* Got It? Make It! chopping-board artwork on the RIGHT. */
#home .have-panel .ideas-panel-heading{
  grid-template-columns:minmax(0,1fr) 170px!important;
}
#home .have-panel .ideas-panel-heading>div{
  grid-column:1!important;
  grid-row:1!important;
  text-align:left!important;
}
#home .have-panel .ideas-feature-art{
  grid-column:2!important;
  grid-row:1!important;
  justify-self:end!important;
  margin:0!important;
}
@media(max-width:650px){
  #home .have-panel .ideas-panel-heading{
    grid-template-columns:minmax(0,1fr) 96px!important;
  }
}
@media(max-width:370px){
  #home .have-panel .ideas-panel-heading{
    grid-template-columns:minmax(0,1fr) 82px!important;
  }
}

/* The extra large desktop banner title was overpowering the artwork. */
@media(min-width:1200px){
  .app:not(.compact-banner) .stable-banner-text h1{
    font-size:48px!important;
    line-height:.94!important;
  }
}

/* Keep only the small cue above the three alternative Home routes. */
#home .home-shortcuts-heading{
  margin-bottom:3px!important;
}
#home .home-shortcuts-heading .eyebrow{
  margin-bottom:0!important;
}

/* Browse: make What Else? a distinct green/purple box and match Washing Up? */
#browse .what-else-panel{
  border:2px solid #5b1665!important;
}
#browse .what-else-panel>h2,
#browse .washing-filter-wrap>h2{
  margin:0 0 9px!important;
  color:var(--green)!important;
  font-family:var(--heading-hand)!important;
  font-size:27px!important;
  line-height:1.05!important;
  font-weight:700!important;
}
#browse .what-else-panel>p.meta{
  color:#617c66!important;
}
#browse .washing-filter-wrap{
  margin-top:17px!important;
  padding-top:15px!important;
}
@media(max-width:650px){
  #browse .what-else-panel>h2,
  #browse .washing-filter-wrap>h2{
    font-size:24px!important;
  }
}

/* Card descriptions: phone 1 sentence, tablet 2, desktop 3, wide desktop 4. */
.recipe-card-description-part{
  display:none;
}
.recipe-card-description-part:nth-child(1){
  display:inline;
}
.recipe-card-description-part + .recipe-card-description-part::before{
  content:" ";
}
@media(min-width:650px){
  .recipe-card-description-part:nth-child(-n+2){display:inline;}
}
@media(min-width:900px){
  .recipe-card-description-part:nth-child(-n+3){display:inline;}
}
@media(min-width:1400px){
  .recipe-card-description-part:nth-child(-n+4){display:inline;}
}


/* v1.22.41 — crisp, white washing-up selector */
#browse .washing-filter{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:10px!important;
}
#browse .washing-filter-button{
  min-width:0!important;
  min-height:70px!important;
  padding:10px 8px!important;
  border-radius:13px!important;
  background:#fff!important;
  color:var(--ink)!important;
  font-family:var(--font, Arial, sans-serif)!important;
  font-style:normal!important;
  font-size:15px!important;
  font-weight:800!important;
  line-height:1.15!important;
  letter-spacing:0!important;
  text-align:center!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:5px!important;
  box-shadow:none!important;
  outline:none!important;
}
#browse .washing-filter-button[data-washing="All"]{
  border:2px solid #a9b7a4!important;
}
#browse .washing-filter-button[data-washing="Few"]{
  border:2px solid #6f9c66!important;
}
#browse .washing-filter-button[data-washing="Some"]{
  border:2px solid #d59b34!important;
}
#browse .washing-filter-button[data-washing="Lots"]{
  border:2px solid #c96a61!important;
}

#browse .wash-icon-row{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:2px!important;
  min-height:28px!important;
}
#browse .wash-vector-icon{
  display:block!important;
  width:38px!important;
  height:25px!important;
  flex:0 0 38px!important;
  background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D'http://www.w3.org/2000/svg'%20viewBox%3D'0%200%2064%2042'%20fill%3D'none'%20stroke%3D'currentColor'%20stroke-width%3D'3'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%3E%0A%3Ccircle%20cx%3D'32'%20cy%3D'21'%20r%3D'13'/%3E%3Ccircle%20cx%3D'32'%20cy%3D'21'%20r%3D'8'/%3E%0A%3Cpath%20d%3D'M9%207v12M5%207v8c0%203%208%203%208%200V7M9%2019v16'/%3E%0A%3Cpath%20d%3D'M52%207v28M52%207c5%203%207%208%207%2013h-7'/%3E%0A%3C/svg%3E")!important;
  background-repeat:no-repeat!important;
  background-position:center!important;
  background-size:contain!important;
}
#browse .wash-vector-icon.wash-green{color:#5f9158!important;}
#browse .wash-vector-icon.wash-amber{color:#d39427!important;}
#browse .wash-vector-icon.wash-red{color:#be5d55!important;}

/* Keep the selected state clear without filling the whole tile. */
#browse .washing-filter-button.active{
  background:#fff!important;
  box-shadow:0 0 0 3px rgba(91,22,101,.14)!important;
}
#browse .washing-filter-button.active[data-washing="All"]{border-color:#5b1665!important;}
#browse .washing-filter-button.active[data-washing="Few"]{border-color:#5f9158!important;}
#browse .washing-filter-button.active[data-washing="Some"]{border-color:#d39427!important;}
#browse .washing-filter-button.active[data-washing="Lots"]{border-color:#be5d55!important;}

@media(max-width:700px){
  #browse .washing-filter{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media(max-width:430px){
  #browse .washing-filter{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;}
  #browse .washing-filter-button{min-height:76px!important;font-size:14px!important;padding:9px 5px!important;}
  #browse .wash-vector-icon{width:33px!important;height:23px!important;flex-basis:33px!important;}
}


/* v1.22.42 — Meal Planner heading + target celebration layout */
#about .about-week-planner .week-planner-kicker{
  display:block!important;
  margin:0 0 3px!important;
  color:var(--green)!important;
  font-family:Arial,Helvetica,sans-serif!important;
  font-size:12px!important;
  line-height:1!important;
  font-weight:900!important;
  letter-spacing:.10em!important;
  text-transform:uppercase!important;
}
#about .about-week-planner .week-planner-header h2{
  margin:0!important;
  color:#3f2942!important;
  font-family:var(--heading-hand)!important;
  font-size:28px!important;
  line-height:1.05!important;
  font-weight:700!important;
}

/* Desktop: Plant Points summary left, celebration on the right. */
@media(min-width:760px){
  #about .planner-plant-points{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:12px!important;
    align-items:stretch!important;
  }
  #about .planner-plant-summary{
    min-width:0!important;
    height:100%!important;
  }
  #about .planner-plant-celebration{
    margin:0!important;
    min-width:220px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:9px 14px!important;
    text-align:center!important;
    font-size:12px!important;
    border:1px solid #bdd0b6!important;
  }
}

/* Phone: keep the achievement underneath so the week stays readable. */
@media(max-width:759px){
  #about .planner-plant-points{
    display:block!important;
  }
  #about .planner-plant-celebration{
    margin-top:6px!important;
  }
}


/* v1.22.43 — block-cap GIMI banner + matching Clear ingredients */
.stable-banner-text .made-love,
.app:not(.compact-banner) .stable-banner-text .made-love,
.app.compact-banner .stable-banner-text .made-love{
  display:block!important;
  margin:0 0 8px!important;
  color:var(--green)!important;
  font-family:Arial,Helvetica,sans-serif!important;
  font-style:normal!important;
  font-size:12px!important;
  line-height:1!important;
  font-weight:850!important;
  letter-spacing:.12em!important;
  text-transform:uppercase!important;
  text-align:center!important;
  transform:none!important;
}
.app.compact-banner .stable-banner-text .made-love{
  margin-bottom:4px!important;
  font-size:10px!important;
}
#clearHaveIngredients{
  border:0!important;
  background:transparent!important;
  color:var(--green)!important;
  font-family:Arial,Helvetica,sans-serif!important;
  font-style:normal!important;
  font-size:12px!important;
  line-height:1.15!important;
  font-weight:850!important;
  letter-spacing:.12em!important;
  text-transform:uppercase!important;
  opacity:.82!important;
  padding:9px 2px 3px!important;
  cursor:pointer!important;
}
#clearHaveIngredients:hover{
  opacity:1!important;
}
@media(max-width:650px){
  .app:not(.compact-banner) .stable-banner-text .made-love{
    margin-bottom:6px!important;
    font-size:10.5px!important;
  }
  #clearHaveIngredients{
    font-size:10.5px!important;
    letter-spacing:.11em!important;
  }
}


/* v1.22.44 — Browse filter structure + cleaner washing-up selector */

/* What Else? is now its own complete panel; Washing Up? is separate. */
#browse .what-else-panel{
  margin-bottom:14px!important;
}
#browse .washing-up-filter-panel{
  border:2px solid #5b1665!important;
  margin-bottom:14px!important;
}
#browse .washing-up-filter-panel>h2{
  margin:0 0 6px!important;
  color:var(--green)!important;
  font-family:var(--heading-hand)!important;
  font-size:27px!important;
  line-height:1.05!important;
  font-weight:700!important;
}
#browse .washing-up-filter-panel>.meta{
  margin:0 0 11px!important;
  color:#617c66!important;
}

/* Remove the previous plate icons completely. Use simple traffic-light level numbers. */
#browse .wash-icon-row,
#browse .wash-vector-icon{
  display:none!important;
}
#browse .washing-filter{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:10px!important;
}
#browse .washing-filter-button{
  min-height:68px!important;
  padding:10px 8px!important;
  background:#fff!important;
  color:var(--ink)!important;
  border-radius:13px!important;
  font-family:Arial,Helvetica,sans-serif!important;
  font-style:normal!important;
  font-size:14px!important;
  line-height:1.15!important;
  font-weight:800!important;
  letter-spacing:0!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  align-items:center!important;
  gap:6px!important;
  box-shadow:none!important;
}
#browse .washing-filter-button[data-washing="All"]{border:2px solid #a9b7a4!important;}
#browse .washing-filter-button[data-washing="Few"]{border:2px solid #6f9c66!important;}
#browse .washing-filter-button[data-washing="Some"]{border:2px solid #d59b34!important;}
#browse .washing-filter-button[data-washing="Lots"]{border:2px solid #c96a61!important;}

#browse .washing-level-number{
  width:28px!important;
  height:28px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:50%!important;
  color:#fff!important;
  font-size:15px!important;
  font-weight:900!important;
  line-height:1!important;
}
#browse .washing-level-green{background:#5f9158!important;}
#browse .washing-level-amber{background:#d39427!important;}
#browse .washing-level-red{background:#be5d55!important;}

#browse .washing-filter-button.active{
  background:#fff!important;
  box-shadow:0 0 0 3px rgba(91,22,101,.14)!important;
}
#browse .washing-filter-button.active[data-washing="All"]{border-color:#5b1665!important;}

/* Browse small section labels all use the same block-cap treatment. */
#browse .browse-eyebrow-label,
#browse .author-search-row .browse-eyebrow-label{
  display:block!important;
  margin:0 0 7px!important;
  color:var(--green)!important;
  font-family:Arial,Helvetica,sans-serif!important;
  font-style:normal!important;
  font-size:12px!important;
  line-height:1.1!important;
  font-weight:850!important;
  letter-spacing:.12em!important;
  text-transform:uppercase!important;
  opacity:.82!important;
}
#browse .browse-search-panel .browse-eyebrow-label{
  margin-bottom:5px!important;
}
#browse .author-search-row{
  align-items:end!important;
}

@media(max-width:700px){
  #browse .washing-filter{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media(max-width:650px){
  #browse .washing-up-filter-panel>h2{font-size:24px!important;}
  #browse .browse-eyebrow-label,
  #browse .author-search-row .browse-eyebrow-label{
    font-size:10.5px!important;
    letter-spacing:.11em!important;
  }
}


/* v1.22.45 — washing artwork, CD, Shopping share, tips and collapsible Settings */

/* Washing-up choice artwork from the approved trial graphic. */
#browse .washing-filter-button.washing-art-choice{
  min-height:118px!important;
  padding:6px 8px 9px!important;
  gap:5px!important;
  overflow:hidden!important;
}
#browse .washing-choice-art{
  display:block!important;
  width:100%!important;
  height:78px!important;
  object-fit:contain!important;
  object-position:center!important;
  border-radius:8px!important;
  background:#fff!important;
}
#browse .washing-level-number{display:none!important;}
@media(max-width:700px){
  #browse .washing-filter-button.washing-art-choice{min-height:112px!important;}
  #browse .washing-choice-art{height:72px!important;}
}

/* The last Browse panel should finish neatly above the fixed navigation. */
#browse .guide-panel{
  margin-bottom:0!important;
  padding-bottom:10px!important;
}
#browse .guide-panel #guideCategoryResults:empty{display:none!important;}
#browse.active{margin-bottom:-22px!important;}

/* Bought Shopping items are visibly complete. */
.shopping-item.bought .shop-check span{
  text-decoration:line-through;
  opacity:.55;
}
.shopping-share-toolbar{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
}
.shopping-share-toolbar button{
  min-width:0!important;
  padding-left:8px!important;
  padding-right:8px!important;
}
@media(max-width:650px){
  .shopping-share-toolbar{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}

/* Plant target message sits beside the Plant Points box on desktop, underneath on mobile. */
@media(min-width:760px){
  #about .planner-plant-points,
  #shopping .shopping-plant-points{
    width:100%!important;
    max-width:none!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(220px,auto)!important;
    gap:12px!important;
    align-items:stretch!important;
  }
  #about .planner-plant-celebration,
  #shopping .plant-target-celebration{
    margin:0!important;
    height:100%!important;
    min-height:100%!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
  }
}
@media(max-width:759px){
  #about .planner-plant-points,
  #shopping .shopping-plant-points{display:block!important;}
}

/* Tip of the day at the top of Cooking Methods. */
.tip-of-the-day{
  margin:8px 0 14px!important;
  padding:12px 14px!important;
  border:2px solid #9fb58f!important;
  border-radius:15px!important;
  background:#f6faf3!important;
}
.tip-of-the-day-kicker{
  margin-bottom:4px!important;
  color:var(--green)!important;
  font-family:Arial,Helvetica,sans-serif!important;
  font-size:11px!important;
  line-height:1!important;
  font-weight:900!important;
  letter-spacing:.12em!important;
}
.tip-of-the-day strong{
  display:block!important;
  color:#5b1665!important;
  font-family:var(--heading-hand)!important;
  font-size:19px!important;
}
.tip-of-the-day p{
  margin:4px 0 0!important;
  color:#5f685e!important;
  font-size:12px!important;
  line-height:1.45!important;
}

/* One collapsible Settings area. */
.settings-details{
  margin:15px 0!important;
  border:2px solid #9fb58f!important;
  border-radius:16px!important;
  background:#fbfdf9!important;
  overflow:hidden!important;
}
.settings-details>summary{
  list-style:none!important;
  cursor:pointer!important;
  padding:13px 15px!important;
  color:#5b1665!important;
  font-family:var(--heading-hand)!important;
  font-size:22px!important;
  font-weight:700!important;
}
.settings-details>summary::-webkit-details-marker{display:none!important;}
.settings-details>summary::after{
  content:'+'!important;
  float:right!important;
  font-family:Arial,Helvetica,sans-serif!important;
  font-size:24px!important;
  line-height:20px!important;
}
.settings-details[open]>summary::after{content:'−'!important;}
.settings-details-body{
  padding:0 12px 12px!important;
  border-top:1px solid #d7dfcf!important;
}
.settings-details-body>.dietary-preference-setting,
.settings-details-body>.allergen-preference-setting,
.settings-details-body>.name-preference,
.settings-details-body>.plant-target-setting{
  margin:12px 0 0!important;
  box-shadow:none!important;
}
.dietary-preference-grid{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
}
@media(max-width:800px){
  .dietary-preference-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media(max-width:520px){
  .dietary-preference-grid{grid-template-columns:1fr!important;}
}


/* v1.22.46 — Settings summary matches App information */
#about .settings-details>summary{
  cursor:pointer!important;
  list-style:none!important;
  padding:11px 13px!important;
  color:#5b1665!important;
  font-family:inherit!important;
  font-size:13px!important;
  line-height:normal!important;
  font-weight:900!important;
}
#about .settings-details>summary::-webkit-details-marker{display:none!important;}
#about .settings-details>summary::after{
  content:'+'!important;
  float:right!important;
  font-family:inherit!important;
  font-size:18px!important;
  line-height:14px!important;
}
#about .settings-details[open]>summary::after{content:'−'!important;}


/* v1.22.47 — stable banner across widescreen, landscape, portrait and phone
   IMPORTANT: title size is CSS-only. Do not size it from window.innerWidth in JS. */
.app:not(.compact-banner) .stable-banner-text h1{
  font-size:clamp(42px,4.8vw,58px)!important;
  line-height:.92!important;
  width:100%!important;
  max-width:100%!important;
  white-space:nowrap!important;
  transform:none!important;
}
.app:not(.compact-banner) .stable-banner-text{
  box-sizing:border-box!important;
}

/* Large desktop / wide landscape */
@media(min-width:1200px){
  .app:not(.compact-banner) .stable-banner-text h1{
    font-size:58px!important;
  }
}

/* Regular desktop and landscape tablet */
@media(min-width:900px) and (max-width:1199px){
  .app:not(.compact-banner) .stable-banner-text h1{
    font-size:52px!important;
  }
}

/* Portrait tablet */
@media(min-width:651px) and (max-width:899px){
  .app:not(.compact-banner) .stable-banner-text h1{
    font-size:44px!important;
  }
}

/* Phone: allow the title to scale gently, but never jump on rotation. */
@media(max-width:650px){
  .app:not(.compact-banner) .stable-banner-text h1{
    font-size:clamp(29px,8vw,38px)!important;
    line-height:.94!important;
  }
  .app.compact-banner .stable-banner-text h1{
    font-size:clamp(22px,6vw,28px)!important;
    line-height:.98!important;
  }
}

/* Keep the GIMI line visually separate from the personalised title at all sizes. */
.app:not(.compact-banner) .stable-banner-text .made-love{
  margin-bottom:8px!important;
}
@media(max-width:650px){
  .app:not(.compact-banner) .stable-banner-text .made-love{
    margin-bottom:6px!important;
  }
}

/* v1.22.48 — Premium Save time placeholder */
.preparation-heading-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.preparation-heading-row .section-title{margin-bottom:0}.save-time-premium-button{white-space:nowrap}.save-time-premium-note{margin:6px 0 12px;color:var(--muted);font-size:.9rem}
@media(max-width:560px){.preparation-heading-row{align-items:flex-start}.save-time-premium-button{padding:8px 10px}}


/* v1.22.49 — GIMI selection feedback, Browse Choose for me, compact cards + dual scaler */

/* Make the Got It? Make It! heading more compact so the artwork does not create a large blank area underneath. */
#home .have-panel .ideas-panel-heading{
  grid-template-columns:minmax(0,1fr) 128px!important;
  gap:14px!important;
  align-items:start!important;
  margin-bottom:3px!important;
}
#home .have-panel .ideas-feature-art{
  width:122px!important;
  height:100px!important;
  align-self:start!important;
}
#home .have-panel .ideas-panel-heading .eyebrow{margin-bottom:3px!important;}
#home .have-panel .ideas-panel-heading h2{margin-top:0!important;}

@media(max-width:650px){
  #home .have-panel .ideas-panel-heading{
    grid-template-columns:minmax(0,1fr) 84px!important;
    gap:9px!important;
    margin-bottom:2px!important;
  }
  #home .have-panel .ideas-feature-art{width:82px!important;height:70px!important;}
  #home .have-panel .ideas-panel-heading .eyebrow{margin-bottom:2px!important;}
}

/* Two alternative Home routes now that Can't Decide? has moved into Browse as Choose for me. */
#home .home-shortcut-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
#home .home-shortcut-card{
  min-height:126px!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 96px!important;
  align-items:center!important;
}
#home .home-shortcut-card span{grid-column:1!important;grid-row:1!important;}
#home .home-shortcut-card img,#home .home-shortcut-card.browse-shortcut img{
  grid-column:2!important;grid-row:1!important;
  width:90px!important;height:84px!important;
}
@media(max-width:650px){
  #home .home-shortcut-grid{grid-template-columns:1fr!important;}
  #home .home-shortcut-card{
    min-height:102px!important;
    grid-template-columns:minmax(0,1fr) 78px!important;
  }
  #home .home-shortcut-card img,#home .home-shortcut-card.browse-shortcut img{width:74px!important;height:70px!important;}
}

/* GIMI: active common ingredients are unmistakably purple and every selected ingredient is visible. */
#home .have-quick-chip.active,
#home .have-quick-chip[aria-pressed="true"]{
  background:#5b1665!important;
  color:#fff!important;
  border-color:#5b1665!important;
  box-shadow:0 0 0 3px rgba(91,22,101,.17),0 4px 10px rgba(91,22,101,.16)!important;
}
.have-selected-wrap{
  margin:11px 0 9px;
  padding:10px 11px;
  border:1px solid #d8c9dc;
  border-radius:14px;
  background:#fbf8fc;
}
.have-selected-heading{display:flex;justify-content:space-between;gap:10px;align-items:baseline;margin-bottom:7px;}
.have-selected-heading strong{color:#5b1665;font-size:13px;}
.have-selected-heading small{color:#766d78;font-size:10.5px;text-align:right;}
.have-selected-list{display:flex;flex-wrap:wrap;gap:7px;min-height:29px;align-items:center;}
.have-selected-chip{
  border:1px solid #5b1665;
  background:#5b1665;
  color:#fff;
  border-radius:999px;
  padding:6px 9px 6px 11px;
  display:inline-flex;
  align-items:center;
  gap:7px;
  font-size:12px;
  font-weight:800;
  cursor:pointer;
}
.have-selected-chip b{font-size:16px;line-height:1;font-weight:700;}
.have-selected-empty{font-size:11px;color:#8a7f8c;}
.have-results-heading{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin:12px 1px 2px;}
.have-results-heading strong{font-size:13px;color:#5b1665;}
.have-results-heading small{font-size:10.5px;color:var(--muted);}
.have-empty{padding:15px 8px!important;}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;}
@media(max-width:520px){
  .have-selected-heading{display:block;}
  .have-selected-heading small{display:block;text-align:left;margin-top:2px;}
}

/* Browse: choose a random recipe from the filters currently on screen. */
#browse .browse-choose-panel{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:16px;
  align-items:center;
  border:2px solid #b9a2c0!important;
  background:#fcf9fd!important;
}
#browse .browse-choose-copy h2{
  font-family:var(--heading-hand);
  color:#5b1665;
  margin:2px 0 3px!important;
  font-size:28px!important;
}
#browse .browse-choose-copy .meta{margin:0;}
#browse .browse-choose-button{
  width:auto!important;
  min-width:160px;
  background:#5b1665!important;
}
@media(max-width:560px){
  #browse .browse-choose-panel{grid-template-columns:1fr;}
  #browse .browse-choose-button{width:100%!important;}
}

/* Recipe cards: concise dietary/allergen suitability labels instead of the long Builder description. */
.recipe-card-flags{
  display:flex;
  flex-wrap:wrap;
  gap:4px;
  margin:0 0 7px;
}
.recipe-card-flags span{
  display:inline-block;
  border-radius:999px;
  background:#edf5e9;
  border:1px solid #c8dbc0;
  color:#486241;
  padding:3px 6px;
  font-size:9.5px;
  line-height:1.1;
  font-weight:850;
}
.recipe-card-flags span:first-child{background:#f4edf6;border-color:#d8c5dd;color:#5b1665;}
.recipe-card-meta{font-size:10.5px;color:var(--muted);line-height:1.25;}
.card-copy .recipe-card-description{display:none!important;}

/* The recipe scaler is now a clearly defined box with two equivalent ways to scale. */
.recipe-scaler{
  display:block!important;
  margin:17px 0 12px!important;
  padding:15px!important;
  border:2px solid #b9a2c0!important;
  border-radius:18px!important;
  background:#fcf9fd!important;
}
.recipe-scaler .scaler-title{
  color:#5b1665!important;
  font-family:var(--heading-hand)!important;
  font-size:25px!important;
  line-height:1.05!important;
  margin:0 0 4px!important;
}
.scaler-intro{margin:0 0 12px;color:#746a76;font-size:11.5px;line-height:1.35;}
.scaler-options{
  display:grid;
  grid-template-columns:minmax(0,1fr) 38px minmax(0,1fr);
  gap:9px;
  align-items:stretch;
}
.scaler-choice{
  display:block;
  padding:11px;
  border:1px solid #ded1e1;
  border-radius:13px;
  background:#fff;
  font-size:12px;
  font-weight:800!important;
}
.scaler-choice>span:first-child{display:block;min-height:31px;}
.scaler-or{
  display:grid;
  place-items:center;
  color:#5b1665;
  font-size:10px;
  font-weight:900;
}
.recipe-scaler .scaler-input-row{margin-top:7px!important;}
.recipe-scaler .scaler-input-row input{
  width:100%!important;
  max-width:125px!important;
  border:1px solid #cdbbd2;
  border-radius:10px;
  padding:9px;
}
.recipe-scaler .serves-result{
  margin:11px 0 0!important;
  padding-top:10px;
  border-top:1px solid #e3d8e6;
  font-size:13px!important;
}
.recipe-scaler .serves-result strong{font-size:18px!important;color:#5b1665;}
.recipe-scaler .scaler-reset{margin-top:9px!important;}
@media(max-width:590px){
  .scaler-options{grid-template-columns:1fr;}
  .scaler-or{min-height:18px;}
  .scaler-choice>span:first-child{min-height:0;}
  .recipe-scaler .scaler-input-row input{max-width:140px!important;}
}

/* Keep the copyright clear of the fixed mobile navigation and give it its own breathing room. */
footer{
  line-height:1.35!important;
  padding:14px 15px 8px!important;
  margin:8px 0 82px!important;
  background:transparent!important;
}
@media(min-width:900px){
  footer{margin-bottom:8px!important;padding-bottom:10px!important;}
}


/* v1.22.50 — Works well with links */
.works-well-with{margin:10px 0 15px}.works-well-with .section-title{margin:12px 0 8px}.works-well-list{display:flex;flex-wrap:wrap;gap:7px}.works-well-chip{display:inline-flex;align-items:center;gap:5px;border:1px solid #d7e2d3;border-radius:999px;padding:8px 11px;background:#f4f8f1;color:var(--ink);font-size:12px;font-weight:800}.works-well-chip.linked{cursor:pointer;background:#fff;color:var(--green)}.works-well-chip.linked:hover,.works-well-chip.linked:focus-visible{border-color:var(--brand);box-shadow:0 0 0 3px rgba(127,152,112,.14);outline:0}.works-well-chip.linked span{font-size:11px;color:var(--brand)}

/* v1.22.51 — GIMI count + percentage, voice shopping, yields and people graphic */
#home .home-shortcut-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;}
#home .home-shortcut-card.search-shortcut .home-shortcut-symbol{
  grid-column:2!important;grid-row:1!important;
  width:78px;height:78px;border-radius:50%;display:grid;place-items:center;
  justify-self:center;background:#f4edf6;color:#5b1665;font-size:52px;font-weight:900;line-height:1;
}
@media(max-width:650px){
  #home .home-shortcut-grid{grid-template-columns:1fr!important;}
  #home .home-shortcut-card.search-shortcut .home-shortcut-symbol{width:68px;height:68px;font-size:45px;}
}
.have-match{display:flex;flex-direction:column;align-items:flex-end;gap:2px;white-space:nowrap;}
.have-match small{font-size:10px;font-weight:900;color:#64705e;background:#edf5e9;border-radius:999px;padding:2px 6px;}
@media(max-width:560px){.have-results-heading{display:block}.have-results-heading small{display:block;margin-top:2px}}

#shopping .manual-shop-row{grid-template-columns:minmax(0,1fr) auto auto!important;margin-bottom:4px!important;}
.voice-shop-button{border:1px solid #cdbbd2;border-radius:12px;background:#fff;color:#5b1665;padding:9px 11px;font-weight:850;cursor:pointer;white-space:nowrap;}
.voice-shop-button.listening{background:#5b1665;color:#fff;box-shadow:0 0 0 4px rgba(91,22,101,.14);}
.voice-shop-button:disabled{opacity:.5;cursor:not-allowed;}
.voice-shop-status{min-height:18px;margin:0 2px 8px;color:var(--muted);font-size:10.5px;line-height:1.25;}
@media(max-width:520px){.voice-shop-button span{display:none}.voice-shop-button{padding-inline:12px}}

/* On wider screens the feeding/makes box stays on the right; phones stack it. */
.scaler-options{grid-template-columns:minmax(0,1fr) 42px minmax(0,1fr)!important;align-items:stretch!important;}
.scaler-choice.servings-choice{grid-column:3;}
.scaler-or{grid-column:2;}
.output-count-wrap{min-height:25px;margin-top:8px;display:flex;align-items:center;}
.output-count-graphic{display:inline-flex;align-items:center;gap:3px;flex-wrap:wrap;color:#5b1665;}
.person-count-icon{width:19px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.output-count-graphic b{font-size:10px;border-radius:999px;background:#f4edf6;padding:2px 5px;}
.cookie-count-graphic{font-size:17px;letter-spacing:-2px;}
.serves-static .output-count-graphic{margin-left:7px;vertical-align:middle;}
@media(max-width:590px){
  .scaler-options{grid-template-columns:1fr!important;}
  .scaler-choice.servings-choice,.scaler-or{grid-column:1;}
}

/* Recipe browse cards never show the long Builder description. The opened recipe still keeps its intro. */
#recipeGrid .card .recipe-card-description,
#recipeGrid .card .recipe-description,
#recipeGrid .card [class*="description"]{display:none!important;}
.recipe-discovery-footer{margin:18px 0 10px;padding:13px;border:1px solid #d9cedc;border-radius:15px;background:#fcf9fd;}
.recipe-discovery-footer>strong{display:block;color:#5b1665;margin-bottom:8px;font-size:12px;}
.recipe-discovery-footer>div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;}
.recipe-discovery-footer button{width:100%;font-size:11px;}
@media(max-width:520px){.recipe-discovery-footer>div{grid-template-columns:1fr;}}


/* v1.22.52 — full descriptions on Browse cards; suitability labels on opened recipe */
#recipeGrid .card .recipe-card-description{
  display:block!important;
  margin:7px 0 0!important;
  color:#514653!important;
  font-size:12px!important;
  line-height:1.42!important;
}
#recipeGrid .card .card-copy{min-width:0;}
.recipe-detail-flags{
  display:flex;
  flex-wrap:wrap;
  gap:5px;
  margin:8px 0 8px;
}
.recipe-detail-flags span{
  display:inline-block;
  border-radius:999px;
  background:#edf5e9;
  border:1px solid #c8dbc0;
  color:#486241;
  padding:4px 8px;
  font-size:10.5px;
  line-height:1.1;
  font-weight:850;
}
.recipe-detail-flags span:first-child{background:#f4edf6;border-color:#d8c5dd;color:#5b1665;}


/* v1.22.53 — centred GIMI, pale-purple shortcut groups, in-recipe Works well with guides */
@media(min-width:760px){
  #home .have-panel{
    max-width:820px!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
}
#home .home-shortcuts-panel{
  background:#f4edf6!important;
  border-color:#d7c3dd!important;
}
#home .home-shortcut-card,
#home .home-shortcut-card.surprise-shortcut{
  background:#fff!important;
}
.recipe-discovery-footer{
  background:#f4edf6!important;
  border-color:#d7c3dd!important;
  padding:15px!important;
}
.recipe-discovery-footer button,
#recipeFooterSurprise{
  background:#fff!important;
}

/* Explain the guide action before the cook leaves the recipe content. */
.works-well-with{margin:12px 0 17px!important;}
.works-well-help{margin:-2px 0 9px;color:#756b77;font-size:11.5px;line-height:1.4;max-width:680px;}
.works-well-list{gap:8px!important;}
.works-well-chip{
  min-height:44px;
  border-radius:13px!important;
  padding:7px 10px!important;
}
button.works-well-chip.linked{
  display:grid!important;
  grid-template-columns:auto 1fr auto;
  grid-template-rows:auto auto;
  column-gap:8px!important;
  row-gap:0!important;
  text-align:left!important;
  background:#fff!important;
  border-color:#b9cfb3!important;
  color:#394b3c!important;
}
.works-well-chip .works-well-label{grid-column:1/3;font-size:12px;font-weight:900;}
.works-well-chip small{grid-column:1/3;font-size:9.5px;color:#6b7769;font-weight:750;}
.works-well-chip .works-well-action{grid-column:3;grid-row:1/3;align-self:center;color:#5b1665!important;font-size:20px!important;line-height:1;}
.works-well-chip.unlinked{background:#f4f8f1!important;}

.works-guide-overlay{
  position:fixed;
  inset:0;
  z-index:75;
  display:none;
  align-items:center;
  justify-content:center;
  padding:18px;
  background:rgba(35,24,37,.56);
  backdrop-filter:blur(2px);
}
.works-guide-overlay.open{display:flex;}
.works-guide-sheet{
  width:min(760px,100%);
  max-height:min(90vh,900px);
  overflow:auto;
  background:#f8faf7;
  border-radius:24px;
  box-shadow:0 22px 70px rgba(38,23,41,.28);
  padding:0 19px 24px;
  overscroll-behavior:contain;
}
.works-guide-sticky{
  position:sticky;
  top:0;
  z-index:3;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin:0 -19px 14px;
  padding:12px 16px;
  background:rgba(248,250,247,.96);
  border-bottom:1px solid #ded3e1;
  backdrop-filter:blur(9px);
}
.works-guide-back{
  border:1px solid #cdbbd2;
  border-radius:12px;
  background:#fff;
  color:#5b1665;
  padding:9px 12px;
  font-weight:900;
  cursor:pointer;
}
.works-guide-close{
  width:38px;height:38px;border:0;border-radius:50%;
  background:#eee5f0;color:#5b1665;font-size:22px;line-height:1;cursor:pointer;
}
.works-guide-context{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  gap:5px 12px;
  padding:9px 11px;
  margin-bottom:12px;
  border:1px solid #d8c8dc;
  border-radius:13px;
  background:#f4edf6;
  color:#5b1665;
}
.works-guide-context span{font-size:10px;text-transform:uppercase;letter-spacing:.08em;font-weight:900;}
.works-guide-context strong{font-size:11px;}
.works-guide-art{height:190px;border-radius:18px;overflow:hidden;background:#fff;margin-bottom:13px;display:grid;place-items:center;}
.works-guide-art img{width:100%;height:100%;object-fit:contain;display:block;}
.works-guide-sheet h2{font-family:Georgia,serif;font-size:29px;margin:5px 0 8px;color:#332c34;}
.works-guide-section{margin-top:19px;padding-top:2px;}
.works-guide-section h3{color:#5b1665;margin:0 0 8px;font-size:17px;}
.works-guide-section ol{margin-top:6px;}
.works-guide-ingredients{margin:5px 0 0;padding-left:20px;}
.works-guide-ingredients li{margin-bottom:7px;}
.works-guide-bottom-back{margin-top:22px!important;background:#5b1665!important;}
.works-guide-choice-help{color:#706672;font-size:12px;line-height:1.45;margin:0 0 13px;}
.works-guide-choice-list{display:grid;gap:9px;}
.works-guide-choice{
  width:100%;
  border:1px solid #d7c6dc;
  border-radius:15px;
  background:#fff;
  padding:9px;
  display:grid;
  grid-template-columns:86px minmax(0,1fr) auto;
  gap:11px;
  align-items:center;
  text-align:left;
  color:var(--ink);
  cursor:pointer;
}
.works-guide-choice img{width:86px;height:66px;object-fit:contain;border-radius:10px;background:#fff;}
.works-guide-choice span strong,.works-guide-choice span small{display:block;}
.works-guide-choice span strong{color:#5b1665;font-size:14px;}
.works-guide-choice span small{color:#716777;font-size:10.5px;margin-top:3px;}
.works-guide-choice>b{font-size:22px;color:#5b1665;}
.works-guide-choice:hover,.works-guide-choice:focus-visible{border-color:#5b1665;box-shadow:0 0 0 3px rgba(91,22,101,.10);outline:0;}
@media(max-width:650px){
  .works-guide-overlay{padding:0;align-items:flex-end;}
  .works-guide-sheet{width:100%;max-height:94vh;border-radius:22px 22px 0 0;padding:0 15px 28px;}
  .works-guide-sticky{margin:0 -15px 12px;padding:10px 12px;}
  .works-guide-art{height:150px;}
  .works-guide-sheet h2{font-size:25px;}
  .works-guide-choice{grid-template-columns:70px minmax(0,1fr) auto;gap:9px;}
  .works-guide-choice img{width:70px;height:58px;}
}
/* Method/tip help opened from a Works well with overlay must sit above that overlay. */
#methodHelpModal.open{z-index:90!important;}


/* v1.22.54 — preserve chopping-guide aspect ratios + approved washing artwork */
.cut-guide-popup-art{
  display:block!important;
  width:auto!important;
  height:auto!important;
  max-width:min(440px,96%)!important;
  max-height:min(520px,62vh)!important;
  object-fit:contain!important;
  object-position:center center!important;
  padding:8px!important;
  margin:0 auto 12px!important;
  background:#fffdf9!important;
  border-radius:12px!important;
}
.cut-guide-card .cut-guide-svg{object-fit:contain!important;object-position:center center!important;}
.washing-level-row{display:flex!important;align-items:center!important;justify-content:center!important;width:auto!important;}
.washing-level-art{height:24px!important;width:auto!important;max-width:82px!important;object-fit:contain!important;flex:0 1 auto!important;}
.washing-up-simple .washing-level-art{height:32px!important;max-width:112px!important;}
.washing-art-choice .washing-choice-art{object-fit:contain!important;background:#fff!important;padding:5px!important;}
@media(max-width:600px){
  .cut-guide-popup-art{max-width:94%!important;max-height:56vh!important;}
  .washing-level-art{height:21px!important;max-width:72px!important;}
  .washing-up-simple .washing-level-art{height:28px!important;max-width:98px!important;}
}
/* v1.22.54 — keep the approved multi-plate art legible in the narrow recipe-card status rail. */
.card-actions .mini-plate-img.washing-level-art{
  width:auto!important;
  height:23px!important;
  max-width:60px!important;
  flex:0 1 auto!important;
  object-fit:contain!important;
}
.recipe-indicators .washing-detail-plate.washing-level-art{
  width:auto!important;
  height:32px!important;
  max-width:118px!important;
  flex:0 1 auto!important;
  object-fit:contain!important;
}
@media(max-width:430px){
  .card-actions .mini-plate-img.washing-level-art{height:21px!important;max-width:58px!important;}
}


/* v1.22.55 — repeat the screen-awake reminder at the very bottom of Home. */
.home-wake-note{margin:14px 0 0}


/* v1.22.61 — approved Search Recipes artwork: open recipe book + magnifying glass. */
#home .home-shortcut-card.search-shortcut .search-shortcut-art{
  grid-column:2!important;
  grid-row:1!important;
  width:104px!important;
  height:94px!important;
  object-fit:contain!important;
  object-position:center!important;
  border-radius:12px!important;
  filter:none!important;
  justify-self:center!important;
  align-self:center!important;
}
@media(max-width:650px){
  #home .home-shortcut-card.search-shortcut .search-shortcut-art{width:78px!important;height:72px!important;}
}


/* v1.22.61 — Search Recipes uses the full shortcut row and larger artwork. */
#home .home-shortcut-card.search-shortcut{
  grid-column:1 / -1!important;
  min-height:148px!important;
  grid-template-columns:minmax(0,1fr) 238px!important;
  padding:12px 18px 12px 20px!important;
  column-gap:18px!important;
}
#home .home-shortcut-card.search-shortcut .search-shortcut-art{
  width:224px!important;
  height:132px!important;
  max-width:100%!important;
  object-fit:contain!important;
  object-position:center!important;
  justify-self:end!important;
}
#home .home-shortcut-card.search-shortcut strong{font-size:25px!important;}
#home .home-shortcut-card.search-shortcut small{font-size:12px!important;max-width:440px;}
@media(max-width:650px){
  #home .home-shortcut-card.search-shortcut{
    grid-column:auto!important;
    min-height:112px!important;
    grid-template-columns:minmax(0,1fr) 112px!important;
    padding:10px 11px 10px 13px!important;
    column-gap:8px!important;
  }
  #home .home-shortcut-card.search-shortcut .search-shortcut-art{
    width:108px!important;
    height:88px!important;
    justify-self:center!important;
  }
  #home .home-shortcut-card.search-shortcut strong{font-size:21px!important;}
  #home .home-shortcut-card.search-shortcut small{font-size:10.5px!important;}
}
@media(max-width:370px){
  #home .home-shortcut-card.search-shortcut{grid-template-columns:minmax(0,1fr) 92px!important;}
  #home .home-shortcut-card.search-shortcut .search-shortcut-art{width:90px!important;height:78px!important;}
}

/* v1.22.61 — FINAL phone compact-banner correction.
   Must remain after historical banner rules so secondary screens cannot inherit
   the full Home masthead or wrap the GOT IT? MAKE IT! line. */
@media (max-width:650px){
  .app.compact-banner .phone-art-hero{
    padding:7px 9px 4px!important;
    margin:0!important;
  }
  .app.compact-banner .stable-recipe-banner{
    height:96px!important;
    min-height:96px!important;
    max-height:96px!important;
    overflow:hidden!important;
    border:3px solid #5b1665!important;
    border-radius:18px!important;
    background:#fffaf4!important;
  }
  .app.compact-banner .stable-recipe-banner::after{
    display:none!important;
    content:none!important;
  }
  .app.compact-banner .stable-banner-text{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:96px!important;
    min-height:0!important;
    padding:12px 80px 8px 65px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    box-sizing:border-box!important;
    z-index:20!important;
    overflow:hidden!important;
  }
  .app.compact-banner .stable-banner-text .made-love{
    display:block!important;
    width:100%!important;
    margin:0 0 3px!important;
    padding:0!important;
    color:var(--green)!important;
    font-family:Arial,Helvetica,sans-serif!important;
    font-size:clamp(8px,2.35vw,10px)!important;
    line-height:1!important;
    font-weight:850!important;
    letter-spacing:.10em!important;
    text-transform:uppercase!important;
    text-align:center!important;
    white-space:nowrap!important;
    overflow:visible!important;
    transform:none!important;
  }
  .app.compact-banner .stable-banner-text h1{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    padding:0!important;
    color:#5b1665!important;
    font-family:var(--heading-hand)!important;
    font-size:clamp(21px,6.25vw,27px)!important;
    line-height:1!important;
    font-weight:700!important;
    letter-spacing:-.025em!important;
    white-space:nowrap!important;
    text-align:center!important;
    transform:none!important;
  }
  .app.compact-banner .responsive-herbs-left{
    display:block!important;
    position:absolute!important;
    left:7px!important;
    right:auto!important;
    top:9px!important;
    bottom:auto!important;
    width:52px!important;
    height:72px!important;
    z-index:8!important;
    transform:none!important;
    overflow:visible!important;
  }
  .app.compact-banner .responsive-herbs-left .banner-herb-img{
    width:100%!important;
    height:100%!important;
    object-fit:contain!important;
    object-position:center!important;
  }
  .app.compact-banner .responsive-herbs-right,
  .app.compact-banner .responsive-banner-features,
  .app.compact-banner .responsive-inner-herbs,
  .app.compact-banner .responsive-basil{
    display:none!important;
  }
  .app.compact-banner .stable-banner-art{
    display:block!important;
    position:absolute!important;
    left:auto!important;
    right:4px!important;
    top:8px!important;
    bottom:auto!important;
    width:76px!important;
    height:72px!important;
    min-height:0!important;
    transform:none!important;
    z-index:8!important;
    overflow:visible!important;
  }
  .app.compact-banner .stable-banner-art .banner-bowl-img{
    width:100%!important;
    height:100%!important;
    object-fit:contain!important;
    object-position:center!important;
  }
}
@media (max-width:370px){
  .app.compact-banner .stable-recipe-banner{
    height:90px!important;
    min-height:90px!important;
    max-height:90px!important;
  }
  .app.compact-banner .stable-banner-text{
    height:90px!important;
    padding:10px 70px 7px 58px!important;
  }
  .app.compact-banner .stable-banner-text .made-love{
    font-size:8px!important;
    letter-spacing:.075em!important;
  }
  .app.compact-banner .stable-banner-text h1{
    font-size:clamp(19px,6vw,23px)!important;
  }
  .app.compact-banner .responsive-herbs-left{
    left:6px!important;
    top:9px!important;
    width:46px!important;
    height:66px!important;
  }
  .app.compact-banner .stable-banner-art{
    right:3px!important;
    top:9px!important;
    width:67px!important;
    height:65px!important;
  }
}


/* v1.22.61 — dedicated phone masthead + unmistakable Home artwork fixes.
   The secondary-screen phone banner is now its own element rather than a restyled Home banner. */
.mobile-compact-masthead{display:none}
@media(max-width:650px){
  .app.compact-banner > .phone-art-hero{display:none!important}
  .app.compact-banner > .mobile-compact-masthead{
    display:grid!important;
    grid-template-columns:58px minmax(0,1fr) 82px!important;
    align-items:center!important;
    gap:4px!important;
    width:calc(100% - 18px)!important;
    height:92px!important;
    min-height:92px!important;
    box-sizing:border-box!important;
    margin:7px 9px 9px!important;
    padding:5px 7px!important;
    overflow:hidden!important;
    background:#fffaf4!important;
    border:3px solid #5b1665!important;
    border-radius:18px!important;
    box-shadow:0 5px 14px rgba(82,35,92,.09)!important;
  }
  .mobile-compact-herbs,
  .mobile-compact-bowl{
    display:block!important;
    width:100%!important;
    height:76px!important;
    max-width:100%!important;
    object-fit:contain!important;
    object-position:center!important;
    margin:0!important;
  }
  .mobile-compact-copy{
    min-width:0!important;
    width:100%!important;
    text-align:center!important;
    align-self:center!important;
    overflow:visible!important;
  }
  .mobile-compact-kicker{
    margin:0 0 3px!important;
    color:#71886c!important;
    font:800 9px/1 Arial,Helvetica,sans-serif!important;
    letter-spacing:.105em!important;
    white-space:nowrap!important;
  }
  .mobile-compact-title{
    margin:0!important;
    color:#5b1665!important;
    font-family:var(--heading-hand)!important;
    font-size:clamp(21px,6.25vw,28px)!important;
    font-weight:700!important;
    line-height:.95!important;
    letter-spacing:-.025em!important;
    white-space:nowrap!important;
  }

  /* Centre the GIMI identity on the phone and make its artwork clearly visible. */
  #home .have-panel .ideas-panel-heading{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    text-align:center!important;
    gap:5px!important;
  }
  #home .have-panel .ideas-feature-art{
    width:118px!important;
    height:102px!important;
    margin:0 auto 1px!important;
    object-fit:contain!important;
    object-position:center!important;
    filter:drop-shadow(0 4px 8px rgba(61,51,63,.07))!important;
  }
  #home .have-panel .ideas-panel-heading>div{width:100%!important;text-align:center!important}
  #home .have-panel .ideas-panel-heading .eyebrow,
  #home .have-panel .ideas-panel-heading h2{text-align:center!important;margin-left:auto!important;margin-right:auto!important}

  /* The new Search image is deliberately prominent and cannot collapse to the legacy icon size. */
  #home .home-shortcut-card.search-shortcut{
    grid-column:1/-1!important;
    grid-template-columns:minmax(0,1fr) 138px!important;
    min-height:130px!important;
    padding:10px 12px 10px 15px!important;
    column-gap:10px!important;
  }
  #home .home-shortcut-card.search-shortcut .search-shortcut-art{
    display:block!important;
    width:134px!important;
    height:108px!important;
    max-width:none!important;
    object-fit:contain!important;
    object-position:center!important;
    justify-self:end!important;
    align-self:center!important;
    border-radius:10px!important;
  }
}
@media(max-width:370px){
  .app.compact-banner > .mobile-compact-masthead{
    grid-template-columns:48px minmax(0,1fr) 70px!important;
    height:86px!important;
    min-height:86px!important;
    padding:4px 5px!important;
  }
  .mobile-compact-herbs,.mobile-compact-bowl{height:68px!important}
  .mobile-compact-kicker{font-size:8px!important;letter-spacing:.075em!important}
  .mobile-compact-title{font-size:clamp(19px,6vw,23px)!important}
  #home .have-panel .ideas-feature-art{width:105px!important;height:92px!important}
  #home .home-shortcut-card.search-shortcut{grid-template-columns:minmax(0,1fr) 112px!important}
  #home .home-shortcut-card.search-shortcut .search-shortcut-art{width:110px!important;height:94px!important}
}


/* v1.22.61 — desktop Home layout polish requested during widescreen QA. */
/* The second navigation is desktop-only: phones keep the single fixed bottom bar. */
.desktop-bottom-nav{display:none!important;}
@media(min-width:900px){
  .desktop-bottom-nav{
    display:flex!important;
    position:relative!important;
    left:auto!important;
    right:auto!important;
    bottom:auto!important;
    width:calc(100% - 44px)!important;
    max-width:1076px!important;
    margin:12px auto 8px!important;
    padding:0!important;
    background:rgba(255,255,255,.92)!important;
    border:1px solid var(--line)!important;
    border-radius:16px!important;
    box-shadow:0 7px 20px rgba(66,91,80,.08)!important;
    backdrop-filter:none!important;
    overflow:hidden!important;
  }
  .desktop-bottom-nav .nav{max-width:none!important;width:100%!important;}
}

/* Let the main Got It? panel use the same available desktop width as the full Home banner. */
@media(min-width:760px){
  #home .have-panel{
    width:100%!important;
    max-width:none!important;
    margin-left:0!important;
    margin-right:0!important;
  }
}

/* Desktop GIMI header: larger artwork, smaller title and no artificial dead space underneath. */
@media(min-width:651px){
  #home .have-panel .ideas-panel-heading{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 205px!important;
    align-items:center!important;
    gap:18px!important;
    margin:0!important;
    min-height:0!important;
  }
  #home .have-panel .ideas-panel-heading>div{
    grid-column:1!important;
    grid-row:1!important;
    align-self:center!important;
  }
  #home .have-panel .ideas-feature-art{
    grid-column:2!important;
    grid-row:1!important;
    width:195px!important;
    height:145px!important;
    max-width:100%!important;
    align-self:center!important;
    justify-self:end!important;
    object-fit:contain!important;
    margin:0!important;
  }
  #home .have-panel .ideas-panel-heading h2{
    font-size:clamp(42px,4.25vw,54px)!important;
    line-height:.96!important;
    margin:0!important;
  }
  #home .have-panel .ideas-panel-heading .eyebrow{
    margin:0 0 5px!important;
  }
  #home .have-panel .have-desktop-help{
    margin:0 0 10px!important;
  }

  /* Search belongs in the third top shortcut slot rather than spanning a second row. */
  #home .home-shortcut-grid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
  #home .home-shortcut-card.search-shortcut{
    grid-column:auto!important;
    min-height:126px!important;
    grid-template-columns:minmax(0,1fr) 92px!important;
    padding:12px 11px 12px 14px!important;
    column-gap:8px!important;
  }
  #home .home-shortcut-card.search-shortcut .search-shortcut-art{
    width:88px!important;
    height:78px!important;
    max-width:88px!important;
    justify-self:center!important;
    align-self:center!important;
    object-fit:contain!important;
  }
  #home .home-shortcut-card.search-shortcut strong{
    font-size:22px!important;
  }
  #home .home-shortcut-card.search-shortcut small{
    font-size:11px!important;
    max-width:none!important;
  }
}


/* v1.22.61 — final alignment refinement after moving GIMI help into its title column. */
@media(min-width:900px){
  /* Banner is inside an 18px hero gutter; make both desktop nav bars match it. */
  .bottom{
    width:calc(100% - 36px)!important;
    max-width:none!important;
  }
  .desktop-bottom-nav{
    width:calc(100% - 36px)!important;
    max-width:none!important;
  }
  /* Content uses a 22px gutter, so add the 4px each side needed to align the green panel to the banner. */
  #home .have-panel{
    width:calc(100% + 8px)!important;
    margin-left:-4px!important;
    margin-right:-4px!important;
  }
}
@media(min-width:651px){
  #home .have-panel .ideas-panel-heading>div{
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
  }
  #home .have-panel .have-desktop-help{
    margin:7px 0 0!important;
    max-width:620px!important;
  }
}


/* v1.22.61 — image optimisation: consistent recipe-photo presentation */
.food-art img,.detail-art img{object-position:center center;background:#f7f4ef;}


/* v1.22.65 — tester wording + responsive shopping action */
.add-shopping-desktop{display:none}
@media(min-width:700px){.add-shopping-mobile{display:none}.add-shopping-desktop{display:inline}}


/* v1.22.66 — tester polish: Save Time upsell, guide art fit, mobile descriptions, Surprise Me portrait */
.save-time-entry{margin:-6px 0 18px;display:flex;justify-content:flex-start;}
.save-time-entry .save-time-premium-button{width:auto;min-width:138px;border-color:#cdb8d3;background:#faf6fb;color:#5b1665;font-weight:850;}
.preparation-box>.section-title{margin-top:0;}
.premium-upsell-modal{position:fixed;inset:0;z-index:105;background:rgba(31,24,31,.55);display:none;align-items:center;justify-content:center;padding:18px;}
.premium-upsell-modal.open{display:flex;}
.premium-upsell-card{position:relative;width:min(520px,100%);background:#fffdfb;border:1px solid #ded2e0;border-radius:22px;box-shadow:0 18px 60px rgba(37,24,39,.22);padding:24px;}
.premium-upsell-card h2{font-family:Georgia,serif;color:#332c34;margin:6px 42px 10px 0;font-size:27px;}
.premium-upsell-card p{line-height:1.55;color:#514653;}
.premium-upsell-close{position:absolute;right:15px;top:14px;width:38px;height:38px;border:0;border-radius:50%;background:#edf3e9;font-size:22px;cursor:pointer;}
.premium-upsell-actions{display:grid;grid-template-columns:1fr 1.3fr;gap:9px;margin-top:18px;}
.premium-upsell-actions .primary,.premium-upsell-actions .secondary{width:100%;}
.cooking-guide-detail-art{background:#fff!important;height:230px!important;padding:8px!important;}
.cooking-guide-detail-art img{object-fit:contain!important;object-position:center center!important;background:#fff!important;}
#home #surpriseFace{display:block!important;opacity:1!important;visibility:visible!important;object-fit:contain!important;object-position:center bottom!important;border-radius:0!important;background:transparent!important;}
@media(max-width:649px){
  #recipeGrid .card .recipe-card-description{font-size:11px!important;line-height:1.35!important;}
  #recipeGrid .card .recipe-card-description-part{display:none!important;}
  #recipeGrid .card .recipe-card-description-part:first-child{display:inline!important;}
  .cooking-guide-detail-art{height:200px!important;}
  .premium-upsell-actions{grid-template-columns:1fr;}
}

/* v1.22.68 — Make It Now action treatment */
.start-cooking-mode{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:3px!important;
  width:100%!important;
  min-height:66px!important;
  margin:16px 0 16px!important;
  padding:10px 18px!important;
  border:2px solid #4f0f59!important;
  border-radius:16px!important;
  box-shadow:0 5px 12px rgba(91,22,101,.16)!important;
  cursor:pointer!important;
}
.start-cooking-mode:hover{transform:translateY(-1px);box-shadow:0 7px 15px rgba(91,22,101,.20)!important}
.start-cooking-mode:focus-visible{outline:3px solid rgba(91,22,101,.24)!important;outline-offset:3px!important}
.make-it-main{display:block;font-size:19px;font-weight:900;line-height:1.1}
.make-it-helper{display:block;font-size:12px;font-weight:700;line-height:1.2;opacity:.92}
.make-it-helper-mobile{display:none}
@media(max-width:650px){
  .make-it-helper-desktop{display:none}
  .make-it-helper-mobile{display:block}
}

/* v1.22.68 serving scaler plate icons */
.serving-plate-count-graphic{color:#75639a}.serving-plate-icon{width:26px;height:22px;display:inline-block;vertical-align:middle;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.serving-plate-count-graphic b{margin-left:3px}


/* v1.22.70 — Alternative ways + compact standard-weight display support */
.method-alternative-ways{margin-top:.65rem;padding:.65rem .75rem;border:1px solid rgba(0,0,0,.12);border-radius:12px;background:rgba(255,255,255,.55);display:grid;gap:.45rem}
.method-alternative-ways>strong{font-size:.9rem}
.method-alternative-card{display:grid;gap:.18rem;padding:.55rem .65rem;border-radius:10px;background:rgba(255,255,255,.8)}
.method-alternative-card>b{font-size:.92rem}
.method-alternative-card>span,.method-alternative-card>small{font-size:.8rem;opacity:.78}
.method-alternative-card>p{margin:.12rem 0 0}
.cooking-alternative-ways{margin-top:1rem}

/* v1.22.72 — compact recipe-card thumbnails.
   Title/description use the full card width; favourite, Plant Points and washing-up
   sit in one horizontal row underneath so short cards are not stretched by a side rail. */
#recipeGrid .card-body{
  display:block!important;
  padding:11px 12px 10px!important;
}
#recipeGrid .card-copy{min-width:0!important;}
#recipeGrid .card-copy h3{margin:0 0 5px!important;}
#recipeGrid .card-actions{
  width:100%!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:7px!important;
  margin-top:8px!important;
}
#recipeGrid .card-actions .fav{
  width:32px!important;
  height:32px!important;
  flex:0 0 32px!important;
  font-size:18px!important;
}
#recipeGrid .card-actions .plant-points-badge{
  position:static!important;
  min-width:0!important;
  width:auto!important;
  min-height:28px!important;
  height:28px!important;
  padding:3px 7px!important;
  font-size:12px!important;
  flex:0 0 auto!important;
}
#recipeGrid .card-actions .plant-points-badge strong{font-size:12px!important;}
#recipeGrid .card-actions .washing-badge{
  width:auto!important;
  min-width:0!important;
  min-height:28px!important;
  height:28px!important;
  padding:1px 4px!important;
  flex:0 0 auto!important;
}
#recipeGrid .card-actions .mini-plate-row{width:auto!important;}
#recipeGrid .card-actions .mini-plate-img.washing-level-art{
  height:20px!important;
  width:auto!important;
  max-width:58px!important;
}
#recipeGrid .recipe-card-meta{display:none!important;}
@media(max-width:430px){
  #recipeGrid .card-body{padding:9px 10px 9px!important;}
  #recipeGrid .card-actions{gap:6px!important;margin-top:7px!important;}
  #recipeGrid .card-actions .fav{width:30px!important;height:30px!important;flex-basis:30px!important;}
  #recipeGrid .card-actions .plant-points-badge{height:27px!important;min-height:27px!important;padding:2px 6px!important;}
  #recipeGrid .card-actions .washing-badge{height:27px!important;min-height:27px!important;}
  #recipeGrid .card-actions .mini-plate-img.washing-level-art{height:19px!important;}
}

/* v1.22.73 — card layout correction.
   Cards show the recipe description first, then Washing Up, Plant Points and Favourite.
   Desktop additionally shows compact suitability labels; mobile keeps them hidden for the shortest possible cards.
   Protein/author metadata is deliberately not shown on Browse recipe cards. */
#recipeGrid .card-copy .recipe-card-flags{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:4px!important;
  margin:0 0 6px!important;
}
#recipeGrid .card-copy .recipe-card-description{
  display:block!important;
  margin:0!important;
}
#recipeGrid .card-actions{
  order:2!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:7px!important;
  margin-top:7px!important;
}
#recipeGrid .card-actions .washing-badge{order:1!important;}
#recipeGrid .card-actions .plant-points-badge{order:2!important;}
#recipeGrid .card-actions .fav{order:3!important;}
#recipeGrid .recipe-card-meta,
#recipeGrid .card .meta{display:none!important;}
@media(max-width:649px){
  #recipeGrid .card-copy .recipe-card-flags{display:none!important;}
  #recipeGrid .card-copy .recipe-card-description{margin:0!important;}
}


/* v1.22.83 — definitive Browse card layout.
   This uses new class names so historical card-description rules cannot hide the intro. */
#recipeGrid .card .card-body-v12276{
  display:block!important;
  padding:11px 12px 10px!important;
  height:auto!important;
  min-height:0!important;
}
#recipeGrid .card .card-copy-v12276{
  display:block!important;
  min-width:0!important;
}
#recipeGrid .card .card-copy-v12276 h3{
  margin:0 0 5px!important;
}
#recipeGrid .card .recipe-card-intro-v12276{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  position:static!important;
  width:auto!important;
  height:auto!important;
  max-height:none!important;
  overflow:visible!important;
  margin:6px 0 0!important;
  padding:0!important;
  color:#514653!important;
  font-size:12px!important;
  line-height:1.38!important;
  white-space:normal!important;
  -webkit-line-clamp:unset!important;
}
#recipeGrid .card .card-actions-v12276{
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:nowrap!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:7px!important;
  width:100%!important;
  margin:8px 0 0!important;
}
#recipeGrid .card .card-actions-v12276 .washing-badge{order:1!important;}
#recipeGrid .card .card-actions-v12276 .plant-points-badge{order:2!important;}
#recipeGrid .card .card-actions-v12276 .fav{order:3!important;}
#recipeGrid .card .recipe-card-meta,
#recipeGrid .card .card-copy-v12276 > .meta{display:none!important;}
@media(max-width:649px){
  #recipeGrid .card .card-copy-v12276 .recipe-card-flags{display:none!important;}
  #recipeGrid .card .recipe-card-intro-v12276{
    display:block!important;
    font-size:11.5px!important;
    line-height:1.34!important;
    margin-top:5px!important;
  }
  #recipeGrid .card .card-body-v12276{padding:9px 10px 9px!important;}
  #recipeGrid .card .card-actions-v12276{gap:6px!important;margin-top:7px!important;}
}
@media(min-width:650px){
  #recipeGrid .card .card-copy-v12276 .recipe-card-flags{display:flex!important;}
}


/* v1.22.83 — artwork review tidy-up.
   One calm green treatment for all suitability labels, matching Plant Points.
   Phone Home banner keeps the artwork but removes the empty space beneath it.
   The GIMI chopping-board illustration is hidden on phones and portrait tablets. */
.recipe-card-flags span,
.recipe-card-flags span:first-child,
.recipe-detail-flags span,
.recipe-detail-flags span:first-child{
  background:#f3f8ee!important;
  border-color:#c8dbc0!important;
  color:#476b35!important;
}

@media (max-width:650px){
  .app:not(.compact-banner) .stable-recipe-banner{
    height:clamp(245px,68vw,280px)!important;
    max-height:280px!important;
  }
}

@media (max-width:900px) and (orientation:portrait), (max-width:650px){
  #home .have-panel .ideas-feature-art{display:none!important;}
  #home .have-panel .ideas-panel-heading{
    grid-template-columns:minmax(0,1fr)!important;
  }
  #home .have-panel .ideas-panel-heading>div{
    grid-column:1!important;
    width:100%!important;
  }
}

/* v1.22.83 — approved Home shortcut border consistency */
#home .home-shortcut-card.surprise-shortcut,
#home .home-shortcut-card.browse-shortcut,
#home .home-shortcut-card.search-shortcut{
  border-color:#5b1665!important;
  border-width:2px!important;
}


/* v1.22.83 — Can’t Decide? discovery layout + Search All Recipes */

/* Give the renamed discovery screen a clear, compact flow. */
#browse .quick-recipe-panel{
  border:3px solid #9fb58f!important;
  background:#fbfdf9!important;
  padding:13px 14px 14px!important;
  margin-bottom:14px!important;
}
#browse .quick-recipe-heading{
  display:flex!important;
  align-items:flex-end!important;
  justify-content:space-between!important;
  gap:12px!important;
  margin-bottom:9px!important;
}
#browse .quick-recipe-heading>div{min-width:0!important;}
#browse .quick-recipe-heading h2,
#browse .browse-results-heading h2{
  margin:0!important;
  color:#5b1665!important;
  font-family:var(--heading-hand)!important;
  font-size:25px!important;
  line-height:1.05!important;
  font-weight:700!important;
}
#browse .quick-recipe-heading .meta{
  margin:0!important;
  max-width:360px!important;
  text-align:right!important;
  line-height:1.3!important;
}
#browse .quick-recipe-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:8px!important;
}
#browse .quick-recipe-card{
  min-width:0!important;
  padding:0!important;
  overflow:hidden!important;
  border:2px solid #d6e1d0!important;
  border-radius:13px!important;
  background:#fff!important;
  color:var(--ink)!important;
  text-align:left!important;
  box-shadow:0 4px 10px rgba(66,91,80,.08)!important;
  cursor:pointer!important;
}
#browse .quick-recipe-card:hover,
#browse .quick-recipe-card:focus-visible{
  border-color:#7f9870!important;
  box-shadow:0 0 0 2px rgba(127,152,112,.13),0 5px 13px rgba(66,91,80,.10)!important;
}
#browse .quick-recipe-art{
  display:block!important;
  width:100%!important;
  height:76px!important;
  overflow:hidden!important;
  background:#eef4eb!important;
}
#browse .quick-recipe-art>img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
}
#browse .quick-recipe-art .photo-fallback{
  min-height:0!important;
  height:100%!important;
  font-size:20px!important;
  gap:2px!important;
}
#browse .quick-recipe-art .photo-fallback strong{display:none!important;}
#browse .quick-recipe-name{
  display:-webkit-box!important;
  -webkit-box-orient:vertical!important;
  -webkit-line-clamp:2!important;
  overflow:hidden!important;
  min-height:39px!important;
  padding:7px 8px 8px!important;
  font-size:11.5px!important;
  line-height:1.18!important;
  font-weight:800!important;
}
#browse .quick-recipe-empty{
  grid-column:1 / -1!important;
  padding:14px 8px!important;
}

/* What with? keeps the existing What Else? controls and styling. */
#browse .what-else-panel{margin-top:0!important;}

/* The Washing Up choice remains visual but takes much less vertical space. */
#browse .washing-up-filter-panel{
  padding:12px 14px!important;
}
#browse .washing-up-filter-panel>h2{
  margin-bottom:3px!important;
}
#browse .washing-up-filter-panel>.meta{
  margin-bottom:7px!important;
}
#browse .washing-filter{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:7px!important;
}
#browse .washing-filter-button,
#browse .washing-filter-button.washing-art-choice{
  min-height:72px!important;
  height:72px!important;
  padding:5px 5px 6px!important;
  gap:3px!important;
  font-size:11.5px!important;
  line-height:1.08!important;
}
#browse .washing-choice-art{
  width:100%!important;
  height:43px!important;
  max-height:43px!important;
  padding:2px 4px!important;
  object-fit:contain!important;
}
#browse .filter-summary{
  margin-top:8px!important;
  padding-top:7px!important;
}

/* Separate the full filtered list from the four quick ideas, then keep the
   larger recipe results two across as in the approved sketch. */
#browse .browse-results-heading{
  margin:18px 2px 9px!important;
}
#browse .browse-results-heading .meta{
  margin:3px 0 0!important;
}
#browse #recipeGrid{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:13px!important;
}
#browse #recipeGrid .food-art{
  height:126px!important;
}
#browse #recipeGrid .card h3{
  font-size:17px!important;
}

/* Search All Recipes: make guide results unmistakable without changing the
   existing lightweight result-list behaviour. */
#browse .browse-search-panel .search-result-guide{
  border-left:4px solid #7f9870!important;
  padding-left:10px!important;
}
#browse .browse-search-panel .search-result-guide small{
  color:#56724f!important;
  font-weight:700!important;
}
#browse .browse-search-panel .search-result-idea:not([data-open]){
  opacity:.72!important;
}

/* The longer navigation label may wrap naturally but should stay compact. */
.nav button[data-screen="browse"]{
  line-height:1.05!important;
}

@media(max-width:650px){
  #browse .quick-recipe-heading{
    display:block!important;
  }
  #browse .quick-recipe-heading .meta{
    margin-top:4px!important;
    max-width:none!important;
    text-align:left!important;
  }
  #browse .quick-recipe-heading h2,
  #browse .browse-results-heading h2{
    font-size:23px!important;
  }
  #browse .quick-recipe-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  #browse .quick-recipe-art{
    height:82px!important;
  }
  #browse .quick-recipe-name{
    min-height:37px!important;
    font-size:11.5px!important;
  }
  #browse .washing-filter{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:5px!important;
  }
  #browse .washing-filter-button,
  #browse .washing-filter-button.washing-art-choice{
    min-height:66px!important;
    height:66px!important;
    padding:4px 2px 5px!important;
    font-size:10px!important;
  }
  #browse .washing-choice-art{
    height:38px!important;
    max-height:38px!important;
    padding:1px 2px!important;
  }
  #browse #recipeGrid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }
  #browse #recipeGrid .food-art{
    height:94px!important;
  }
  #browse #recipeGrid .card h3{
    font-size:14px!important;
  }
}
@media(max-width:370px){
  #browse .washing-filter-button,
  #browse .washing-filter-button.washing-art-choice{
    font-size:9px!important;
  }
  #browse .washing-choice-art{
    height:34px!important;
    max-height:34px!important;
  }
}


/* v1.22.84 — GIMI top 3 now use visual recipe cards, matching Can’t Decide? quick suggestions. */
#home #haveResults .have-recipe-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:9px!important;
  margin-top:9px!important;
}
#home #haveResults .have-recipe-card{
  min-width:0!important;
  padding:0!important;
  overflow:hidden!important;
  border:2px solid #d6e1d0!important;
  border-radius:13px!important;
  background:#fff!important;
  color:var(--ink)!important;
  text-align:left!important;
  box-shadow:0 4px 10px rgba(66,91,80,.08)!important;
  cursor:pointer!important;
}
#home #haveResults .have-recipe-card:hover,
#home #haveResults .have-recipe-card:focus-visible{
  border-color:#7f9870!important;
  box-shadow:0 0 0 2px rgba(127,152,112,.13),0 5px 13px rgba(66,91,80,.10)!important;
}
#home #haveResults .have-recipe-art{
  display:block!important;
  width:100%!important;
  height:92px!important;
  overflow:hidden!important;
  background:#eef4eb!important;
}
#home #haveResults .have-recipe-art>img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
}
#home #haveResults .have-recipe-art .photo-fallback{
  min-height:0!important;
  height:100%!important;
  font-size:22px!important;
  gap:2px!important;
}
#home #haveResults .have-recipe-art .photo-fallback strong{display:none!important;}
#home #haveResults .have-recipe-body{
  display:flex!important;
  flex-direction:column!important;
  gap:5px!important;
  padding:8px 9px 9px!important;
}
#home #haveResults .have-recipe-name{
  display:-webkit-box!important;
  -webkit-box-orient:vertical!important;
  -webkit-line-clamp:2!important;
  overflow:hidden!important;
  min-height:34px!important;
  font-size:12.5px!important;
  line-height:1.2!important;
  font-weight:800!important;
}
#home #haveResults .have-main-match{
  display:inline-flex!important;
  width:max-content!important;
  max-width:100%!important;
  padding:3px 6px!important;
  border-radius:999px!important;
  background:#f3eaf6!important;
  color:#5b1665!important;
  font-size:9px!important;
  line-height:1.1!important;
  font-weight:800!important;
}
#home #haveResults .have-recipe-scores{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:5px!important;
}
#home #haveResults .have-score-count,
#home #haveResults .have-score-percent{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:26px!important;
  padding:4px 7px!important;
  border-radius:999px!important;
  font-size:10px!important;
  line-height:1!important;
  font-weight:900!important;
  white-space:nowrap!important;
}
#home #haveResults .have-score-count{
  background:#f3eaf6!important;
  color:#5b1665!important;
}
#home #haveResults .have-score-percent{
  background:#f3f8ee!important;
  color:#476b35!important;
  border:1px solid #c8dbc0!important;
}
#home #haveResults .have-recipe-matched{
  display:-webkit-box!important;
  -webkit-box-orient:vertical!important;
  -webkit-line-clamp:1!important;
  overflow:hidden!important;
  color:var(--muted)!important;
  font-size:9.5px!important;
  line-height:1.2!important;
}
@media(max-width:560px){
  #home #haveResults .have-recipe-grid{gap:6px!important;}
  #home #haveResults .have-recipe-art{height:72px!important;}
  #home #haveResults .have-recipe-body{padding:6px 6px 7px!important;gap:4px!important;}
  #home #haveResults .have-recipe-name{font-size:10.5px!important;min-height:25px!important;}
  #home #haveResults .have-main-match{font-size:7.7px!important;padding:2px 4px!important;}
  #home #haveResults .have-score-count,
  #home #haveResults .have-score-percent{font-size:8.5px!important;min-height:22px!important;padding:3px 5px!important;}
  #home #haveResults .have-recipe-matched{font-size:8px!important;}
}


/* v1.22.86 — Can’t Decide? combined veg card + two compact quick-idea rows */
#browse .quick-recipe-heading{
  align-items:center!important;
  margin-bottom:7px!important;
}
#browse .quick-recipe-heading .browse-eyebrow-label{
  margin-bottom:0!important;
}
#browse .quick-recipe-with-panel{margin-top:0!important;}
@media(max-width:650px){
  #browse .main-filter-grid{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }
}

/* v1.22.89 — GIMI visual polish: main choices purple, secondary choices green. */
#home .gimi-main-picks{
  margin:10px 0 8px!important;
  padding:11px!important;
  border:1px solid #d8c9dc!important;
  border-radius:15px!important;
  background:#fbf8fc!important;
}
#home .gimi-main-picks>p{color:#655b67!important;}
#home .gimi-main-picks>p strong{color:#5b1665!important;}
#home .gimi-main-picks>p small{color:#766d78!important;}
#home .gimi-main-chip{
  border:1px solid #cdb9d1!important;
  border-radius:999px!important;
  background:#fff!important;
  color:#5b1665!important;
  padding:9px 5px!important;
  font-size:11.5px!important;
  font-weight:800!important;
  box-shadow:none!important;
}
#home .gimi-main-chip:hover{
  background:#faf4fb!important;
  border-color:#9f75a8!important;
}
#home .gimi-main-chip.active,
#home .gimi-main-chip[aria-checked="true"]{
  background:#5b1665!important;
  color:#fff!important;
  border-color:#5b1665!important;
  box-shadow:0 0 0 2px rgba(91,22,101,.10)!important;
}
#home .gimi-main-selected-chip{
  background:#5b1665!important;
  color:#fff!important;
  border-color:#5b1665!important;
}

#home .gimi-secondary-picks{
  margin-top:8px!important;
  border:1px solid #cbdcc0!important;
  border-radius:15px!important;
  background:#f6faf3!important;
}
#home .gimi-secondary-picks>p{color:#4a5947!important;}
#home .gimi-secondary-picks>p strong{color:#537a46!important;}
#home .gimi-secondary-picks>p small{color:#758071!important;}
#home .gimi-secondary-picks .have-quick-chip{
  border:1px solid #bfd2b3!important;
  background:#fff!important;
  color:#4f7045!important;
  box-shadow:none!important;
}
#home .gimi-secondary-picks .have-quick-chip:hover{
  border-color:#7da06e!important;
  background:#f3f8ef!important;
}
#home .gimi-secondary-picks .have-quick-chip.active{
  background:#5f884f!important;
  color:#fff!important;
  border-color:#5f884f!important;
  box-shadow:0 0 0 2px rgba(95,136,79,.11)!important;
}

/* v1.22.90 — GIMI visual tidy after desktop QA. */
/* Main ingredient choices use the same full-width button grid as the green secondary choices. */
#home .gimi-main-picks{
  margin:3px 0 8px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
}
#home .gimi-main-picks>p{
  margin:0 0 8px!important;
  color:#5b1665!important;
  font-size:15px!important;
  line-height:1.1!important;
}
#home .gimi-main-picks>p strong{
  display:block!important;
  color:#5b1665!important;
  font-size:15px!important;
  letter-spacing:.015em!important;
}
#home .gimi-main-grid{
  display:grid!important;
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
  gap:7px!important;
  width:100%!important;
}
#home .gimi-main-chip{
  width:100%!important;
  min-width:0!important;
  border:1px solid #cdb9d1!important;
  border-radius:999px!important;
  background:#fff!important;
  color:#5b1665!important;
  padding:9px 7px!important;
  font-size:12px!important;
  font-weight:800!important;
  text-align:center!important;
  cursor:pointer!important;
  box-shadow:none!important;
}
#home .gimi-main-chip:hover{
  background:#faf4fb!important;
  border-color:#9f75a8!important;
}
#home .gimi-main-chip.active,
#home .gimi-main-chip[aria-checked="true"]{
  background:#5b1665!important;
  color:#fff!important;
  border-color:#5b1665!important;
  box-shadow:0 0 0 2px rgba(91,22,101,.10)!important;
}

/* Selected ingredient summary mirrors the source controls: main = purple, extras = green. */
#home .have-selected-chip:not(.gimi-main-selected-chip){
  background:#5f884f!important;
  color:#fff!important;
  border-color:#5f884f!important;
}
#home .gimi-main-selected-chip{
  background:#5b1665!important;
  color:#fff!important;
  border-color:#5b1665!important;
}

/* Tighten the desktop GIMI heading so there is no large blank band above Main Ingredient. */
@media(min-width:651px){
  #home .have-panel .ideas-panel-heading{
    grid-template-columns:minmax(0,1fr) 160px!important;
    gap:12px!important;
  }
  #home .have-panel .ideas-feature-art{
    width:155px!important;
    height:108px!important;
  }
  #home .have-panel .have-desktop-help{
    margin:0!important;
  }
}
@media(max-width:900px){
  #home .gimi-main-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;}
}
@media(max-width:650px){
  #home .gimi-main-picks{margin:3px 0 7px!important;}
  #home .gimi-main-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:6px!important;}
  #home .gimi-main-chip{padding:9px 4px!important;font-size:11.5px!important;}
}
@media(max-width:390px){
  #home .gimi-main-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}


/* v1.22.91 — Make It! fit-to-screen + collapsed alternative methods. */
.cooking-mode-shell{overflow-y:hidden;}
.cooking-alternative-details{
  margin-top:14px;
  border:1px solid #cdb8d3;
  border-radius:14px;
  background:#faf6fb;
  overflow:hidden;
}
.cooking-alternative-details summary{
  cursor:pointer;
  list-style:none;
  padding:11px 13px;
  color:#5b1665;
  font-weight:900;
  font-size:15px;
}
.cooking-alternative-details summary::-webkit-details-marker{display:none;}
.cooking-alternative-details summary::after{content:' ▾';font-size:.85em;}
.cooking-alternative-details[open] summary::after{content:' ▴';}
.cooking-alternative-details .method-alternative-ways{
  margin:0;
  border:0;
  border-top:1px solid #e4d9e7;
  border-radius:0;
  background:#fff;
}
.cooking-fit-tight{padding:18px;}
.cooking-fit-tight .cooking-mode-header h2{font-size:27px!important;}
.cooking-fit-tight .cooking-progress{margin:12px 0 5px;}
.cooking-fit-tight .cooking-step-count{margin-bottom:9px;}
.cooking-fit-tight .cooking-step-card{padding:15px;}
.cooking-fit-tight .cooking-step-card h3{font-size:19px;margin-bottom:7px;}
.cooking-fit-tight .cooking-step-card h3:not(:first-child){margin-top:13px;}
.cooking-fit-tight .cooking-ingredient{padding:7px 10px;font-size:14px;line-height:1.25;}
.cooking-fit-tight .cooking-ingredient input{width:19px;height:19px;min-width:19px;}
.cooking-fit-tight .cooking-instruction{font-size:21px;line-height:1.34;}
.cooking-fit-tight .cooking-nav{margin:11px -18px -18px;padding:10px 18px calc(10px + env(safe-area-inset-bottom));}
.cooking-fit-tight .cooking-nav button{min-height:48px;font-size:15px;}
.cooking-fit-tight .cooking-alternative-details{margin-top:10px;}
.cooking-fit-tight .cooking-alternative-details summary{padding:9px 11px;font-size:14px;}

.cooking-fit-tighter{padding:13px;}
.cooking-fit-tighter .cooking-mode-header h2{font-size:23px!important;}
.cooking-fit-tighter .cooking-exit{width:36px;height:36px;flex-basis:36px;font-size:21px;}
.cooking-fit-tighter .cooking-kicker{font-size:10px;margin-bottom:2px;}
.cooking-fit-tighter .cooking-progress{height:7px;margin:8px 0 4px;}
.cooking-fit-tighter .cooking-step-count{font-size:13px;margin-bottom:6px;}
.cooking-fit-tighter .cooking-step-card{padding:11px;border-radius:16px;}
.cooking-fit-tighter .cooking-step-card h3{font-size:17px;margin-bottom:5px;}
.cooking-fit-tighter .cooking-step-card h3:not(:first-child){margin-top:9px;}
.cooking-fit-tighter .cooking-step-ingredients{gap:5px;}
.cooking-fit-tighter .cooking-ingredient{padding:5px 8px;font-size:12.5px;line-height:1.18;gap:7px;}
.cooking-fit-tighter .cooking-ingredient input{width:17px;height:17px;min-width:17px;}
.cooking-fit-tighter .cooking-instruction{font-size:18px;line-height:1.25;}
.cooking-fit-tighter .cooking-timer{margin-top:9px;padding:9px 12px;font-size:14px;}
.cooking-fit-tighter .cooking-nav{margin:8px -13px -13px;padding:8px 13px calc(8px + env(safe-area-inset-bottom));gap:7px;}
.cooking-fit-tighter .cooking-nav button{min-height:43px;font-size:14px;}
.cooking-fit-tighter .cooking-alternative-details{margin-top:7px;border-radius:10px;}
.cooking-fit-tighter .cooking-alternative-details summary{padding:7px 9px;font-size:12.5px;}

.cooking-fit-tiny{padding:9px;}
.cooking-fit-tiny .cooking-mode-header h2{font-size:20px!important;}
.cooking-fit-tiny .cooking-exit{width:32px;height:32px;flex-basis:32px;font-size:19px;}
.cooking-fit-tiny .cooking-progress{height:6px;margin:6px 0 3px;}
.cooking-fit-tiny .cooking-step-count{font-size:12px;margin-bottom:4px;}
.cooking-fit-tiny .cooking-step-card{padding:8px;border-radius:13px;}
.cooking-fit-tiny .cooking-step-card h3{font-size:15px;margin-bottom:4px;}
.cooking-fit-tiny .cooking-step-card h3:not(:first-child){margin-top:6px;}
.cooking-fit-tiny .cooking-step-ingredients{gap:3px;}
.cooking-fit-tiny .cooking-ingredient{padding:4px 6px;font-size:11px;line-height:1.13;gap:5px;}
.cooking-fit-tiny .cooking-ingredient input{width:15px;height:15px;min-width:15px;}
.cooking-fit-tiny .cooking-instruction{font-size:15px;line-height:1.18;}
.cooking-fit-tiny .cooking-timer{margin-top:6px;padding:7px 9px;font-size:12px;}
.cooking-fit-tiny .cooking-nav{margin:6px -9px -9px;padding:6px 9px calc(6px + env(safe-area-inset-bottom));gap:6px;}
.cooking-fit-tiny .cooking-nav button{min-height:38px;font-size:12px;}
.cooking-fit-tiny .cooking-alternative-details{margin-top:5px;}
.cooking-fit-tiny .cooking-alternative-details summary{padding:6px 8px;font-size:11px;}
.cooking-fit-scroll{overflow-y:auto!important;}

@media(max-width:520px){
  .cooking-mode-shell{height:100dvh!important;max-height:100dvh!important;}
}


/* v1.22.99 — optimised recipe/guide placeholder photos + finished-dish image at recipe end. */
.recipe-bottom-photo{
  margin:20px 0 8px;
  border:1px solid var(--line,#dfe5da);
  border-radius:16px;
  overflow:hidden;
  background:#fff;
  box-shadow:0 5px 18px rgba(39,62,31,.08);
}
.recipe-bottom-photo img{
  display:block;
  width:100%;
  aspect-ratio:5/4;
  max-height:540px;
  object-fit:cover;
}
@media (max-width:700px){
  .recipe-bottom-photo{margin:14px 0 6px;border-radius:13px}
  .recipe-bottom-photo img{max-height:none}
}


/* v1.22.99 — Cooking Guide timers that continue after returning to the recipe */
.works-guide-timer-note{
  margin:4px 0 12px;
  padding:10px 12px;
  border-radius:13px;
  background:#edf4eb;
  color:#45614c;
  font-size:11.5px;
  line-height:1.45;
}
.works-guide-method-list{display:grid;gap:10px;padding-left:25px;}
.works-guide-method-step{padding:0 0 10px 2px;border-bottom:1px solid rgba(91,22,101,.10);}
.works-guide-method-step:last-child{border-bottom:0;}
.works-guide-timer{margin-top:8px!important;background:#e4edf7!important;color:#315873!important;}
.works-guide-timer.running{background:#315873!important;color:#fff!important;}
.works-guide-timer.finished{background:#dcebd8!important;color:#315b3d!important;}


/* v1.22.99 — Tips stay over the current recipe as a centred popup card. */
#methodHelpModal.recipe-tip-modal{
  align-items:center!important;
  justify-content:center!important;
  padding:18px!important;
  background:rgba(37,29,39,.34)!important;
  backdrop-filter:blur(1.5px);
  -webkit-backdrop-filter:blur(1.5px);
}
#methodHelpModal.recipe-tip-modal .method-help-sheet{
  width:min(460px,calc(100vw - 36px))!important;
  max-width:460px!important;
  max-height:min(72vh,560px)!important;
  margin:auto!important;
  padding:20px 20px 22px!important;
  border-radius:22px!important;
  overflow:auto!important;
  box-shadow:0 22px 70px rgba(35,22,39,.28)!important;
  border:1px solid rgba(91,22,101,.16)!important;
  background:#fffdfd!important;
}
#methodHelpModal.recipe-tip-modal .handle{display:none!important;}
#methodHelpModal.recipe-tip-modal .close{
  position:sticky!important;
  top:0!important;
  float:right!important;
  z-index:2!important;
  margin:-3px -3px 2px 10px!important;
  background:#f4eaf6!important;
  color:#5b1665!important;
}
#methodHelpModal.recipe-tip-modal #methodHelpBody{clear:both!important;}
#methodHelpModal.recipe-tip-modal #methodHelpBody h2{
  margin:5px 0 10px!important;
  padding-right:2px!important;
  font-size:26px!important;
  line-height:1.12!important;
}
#methodHelpModal.recipe-tip-modal .recipe-tip-popup{
  margin-top:8px!important;
  padding:14px 15px!important;
}
@media(max-width:520px){
  #methodHelpModal.recipe-tip-modal{padding:14px!important;}
  #methodHelpModal.recipe-tip-modal .method-help-sheet{
    width:min(440px,calc(100vw - 28px))!important;
    max-height:76vh!important;
    padding:18px 17px 19px!important;
    border-radius:20px!important;
  }
  #methodHelpModal.recipe-tip-modal #methodHelpBody h2{font-size:23px!important;}
}


/* v1.22.99 — subtle Kitchen Tip polish.
   Keep the compact centred popup; add only a lightbulb, yellow underline and green Top Tip box. */

#methodHelpModal.recipe-tip-modal .method-help-sheet{
  background:
    radial-gradient(circle at 12% 8%, rgba(255,220,78,.13) 0 42px, transparent 43px),
    linear-gradient(180deg,#fffefa 0%,#fffdf9 100%)!important;
}

#methodHelpModal.recipe-tip-modal .recipe-tip-kicker{
  display:inline-flex!important;
  align-items:center!important;
  gap:7px!important;
  margin:1px 0 3px!important;
  color:#557d4f!important;
  font-weight:800!important;
  letter-spacing:.065em!important;
}

#methodHelpModal.recipe-tip-modal .recipe-tip-kicker::before{
  content:"💡";
  display:grid;
  place-items:center;
  width:29px;
  height:29px;
  flex:0 0 29px;
  border-radius:50%;
  background:#fff4b8;
  box-shadow:0 2px 7px rgba(137,105,20,.12);
  font-size:18px;
  line-height:1;
  letter-spacing:0;
}

#methodHelpModal.recipe-tip-modal #methodHelpBody h2{
  position:relative!important;
  display:inline-block!important;
  margin-top:8px!important;
  margin-bottom:18px!important;
}

#methodHelpModal.recipe-tip-modal #methodHelpBody h2::after{
  content:"";
  position:absolute;
  left:1px;
  right:8%;
  bottom:-8px;
  height:5px;
  border-radius:999px;
  background:linear-gradient(90deg,#f4c62e 0%,#ffd95c 70%,rgba(255,217,92,.18) 100%);
  transform:rotate(-1deg);
}

#methodHelpModal.recipe-tip-modal .recipe-tip-popup{
  position:relative!important;
  margin-top:3px!important;
  padding:35px 15px 14px!important;
  background:linear-gradient(135deg,#f2f8ed,#e9f4e3)!important;
  border:1px solid #d3e5ca!important;
  border-radius:16px!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.72)!important;
}

#methodHelpModal.recipe-tip-modal .recipe-tip-popup::before{
  content:"✓  Top tip";
  position:absolute;
  top:10px;
  left:14px;
  color:#3f7441;
  font-weight:800;
  font-size:12px;
  letter-spacing:.02em;
}

#methodHelpModal.recipe-tip-modal .recipe-tip-popup p{
  color:#39453b!important;
}

@media(max-width:520px){
  #methodHelpModal.recipe-tip-modal .recipe-tip-kicker::before{
    width:27px;
    height:27px;
    flex-basis:27px;
    font-size:17px;
  }
  #methodHelpModal.recipe-tip-modal #methodHelpBody h2{
    margin-bottom:17px!important;
  }
}


/* v1.22.99 — method art at top, high-resolution finished dish at guide bottom. */
.cooking-guide-finished-photo{
  margin-top:24px!important;
}
.cooking-guide-finished-photo img{
  image-rendering:auto;
}
.cooking-guide-finished-photo figcaption{
  padding:8px 12px 10px;
  text-align:center;
  font-size:11px;
  font-weight:700;
  color:#6a666b;
  background:#fbfbf8;
  border-top:1px solid #eceee8;
}
.works-guide-art img,
.cooking-guide-detail-art img,
.guide-result-thumb,
.works-guide-choice img{
  image-rendering:auto;
}


/* v1.22.99 — phone working recipe marker for Strawberry Cheesecake Bars */
.recipe-development-notice{
  display:flex;
  flex-direction:column;
  gap:3px;
  margin:8px 0 12px;
  padding:10px 12px;
  border:1px solid #eadb9e;
  border-radius:14px;
  background:#fff9dc;
  color:#6d5a24;
}
.recipe-development-notice strong{font-size:12px;}
.recipe-development-notice span{font-size:11px;line-height:1.4;}
