/* Compact recipe browser, sharing the selected storefront's palette. */
.cookbook { grid-row:1 / -1; display:grid; grid-template-rows:auto minmax(0,1fr); min-width:0; min-height:0; padding:18px var(--pad); gap:18px; }
.cookbook__heading { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; }
.cookbook__eyebrow { display:block; font-size:12px; letter-spacing:.14em; margin-bottom:7px; color:var(--steel); }
.cookbook__heading h1 { font:400 clamp(24px,2.2vw,38px)/1.1 var(--display,var(--font)); }
.cookbook__caption { font-size:12px; color:var(--steel); }
.cookbook__workspace { display:grid; grid-template-columns:minmax(250px,27%) minmax(0,1fr); min-height:0; gap:24px; }
.cookbook__browse { display:flex; flex-direction:column; min-height:0; min-width:0; }
.cookbook__search { display:grid; gap:6px; font-size:12px; }
.cookbook__search input { width:100%; border:1px solid var(--line); border-radius:5px; padding:11px 12px; background:var(--field); }
.cookbook__filters { display:flex; flex-wrap:wrap; gap:6px; padding:12px 0 8px; }
.cookbook__filters button { min-height:40px; padding:8px 14px; font-size:13px; border:1px solid var(--line); border-radius:30px; background:transparent; }
.cookbook__filters button[aria-pressed="true"] { background:var(--solid); color:var(--on-solid); border-color:var(--solid); }
.cookbook__count { font-size:12px; color:var(--steel); margin-bottom:10px; }
.cookbook__count:empty { display:none; }
.cookbook__list { overflow:auto; min-height:0; scrollbar-width:thin; }
.cookbook__entry { display:grid; width:100%; grid-template-columns:minmax(0,1fr); align-items:center; gap:12px; padding:12px 12px; background:transparent; border:0; border-bottom:1px solid var(--line); text-align:left; transition:background .2s; }
.cookbook__entry:hover,.cookbook__entry[aria-current] { background:var(--ice); }
.cookbook__entry[aria-current] { box-shadow:inset 3px 0 var(--red); }
.cookbook__entry small { display:block; font-size:12px; color:var(--steel); margin-bottom:5px; }
.cookbook__entry strong { display:block; font-size:15px; font-weight:500; line-height:1.35; }
.cookbook__empty { padding:24px 8px; font-size:14px; }
.cookbook__empty button { margin-top:12px; padding:8px 12px; background:var(--ice); border:1px solid var(--line); }
.cookbook__detail { overflow:auto; min-height:0; min-width:0; background:var(--card); border:1px solid var(--line); border-radius:8px; scrollbar-width:thin; }
.dish { animation:dish-appear .25s ease-out; }
.dish__intro { display:grid; grid-template-columns:48% minmax(0,1fr); background:var(--ice); }
.dish__intro--text { grid-template-columns:minmax(0,1fr); }
.dish__intro > picture { display:contents; }
.dish__photo { display:block; width:100%; height:100%; min-height:220px; max-height:320px; object-fit:cover; }
.dish__summary { padding:clamp(18px,2vw,32px); align-self:center; }
.dish__summary h2 { font:400 clamp(23px,2.2vw,38px)/1.1 var(--display,var(--font)); margin-bottom:14px; }
.dish__summary p { font-size:14px; line-height:1.55; }
.dish__facts { display:flex; gap:22px; padding-top:18px; font-size:12px; }
.dish__facts strong { font-size:22px; font-weight:500; }
.dish__image-note { display:block; font-size:12px; color:var(--steel); margin-top:14px; }
.dish__body { display:grid; grid-template-columns:minmax(190px,33%) minmax(0,1fr); gap:30px; padding:26px; }
.dish__body:not(:has(.dish__ingredients)) { grid-template-columns:minmax(0,1fr); }
.dish__body h3 { margin:0 0 14px; font-size:18px; font-weight:500; }
.dish__ingredients > p { font-size:12px; color:var(--steel); margin-bottom:10px; }
.dish__ingredients li { border-bottom:1px solid var(--line); }
.dish__ingredients label { display:flex; align-items:flex-start; gap:9px; padding:12px 0; font-size:13px; line-height:1.4; cursor:pointer; }
.dish__ingredients input { width:17px; height:17px; flex:0 0 17px; margin:1px 0 0; accent-color:var(--red); }
.dish__ingredients label:has(:checked) span { text-decoration:line-through; color:var(--steel); }
.dish__shop { display:inline-block; padding:10px 0; margin-top:12px; margin-right:16px; font-size:14px; text-underline-offset:5px; }
.dish__shop-label { margin:14px 0 0; font-size:12px; color:var(--steel); }
.dish__shop-label + .dish__shop { margin-top:0; }
.dish__method { font-size:14px; line-height:1.6; }
.dish__method ol { counter-reset:step; }
.dish__method ol > li { counter-increment:step; position:relative; padding:0 0 20px 38px; }
.dish__method ol > li::before { content:counter(step,decimal-leading-zero); position:absolute; left:0; top:0; color:var(--red); font-size:15px; font-weight:700; }
.dish__method p,.dish__method ul { margin-bottom:16px; }
.dish__method ul { list-style:disc; padding-left:20px; }
.dish__method h2 { font-size:18px; margin:20px 0 10px; }
@keyframes dish-appear { from { opacity:.5; transform:translateY(5px); } to { opacity:1; transform:none; } }
@media(min-width:1100px) and (max-height:800px) { .cookbook { padding-block:12px; gap:12px; } .dish__photo { min-height:180px; max-height:230px; } .dish__summary { padding:18px; } .dish__body { padding:20px; gap:22px; } }
@media(max-width:1099px) { .cookbook { min-height:70vh; } .cookbook__workspace { grid-template-columns:250px minmax(0,1fr); gap:16px; } .cookbook__list { max-height:75vh; } .dish__intro { grid-template-columns:1fr; } .dish__photo { height:240px; min-height:0; } .dish__body { grid-template-columns:1fr; } }
@media(max-width:699px) { .cookbook { padding:18px 16px 24px; gap:18px; } .cookbook__heading { display:block; } .cookbook__caption { display:none; } .cookbook__workspace { grid-template-columns:minmax(0,1fr); } .cookbook__list { max-height:none; overflow:visible; } .cookbook__entry { padding-block:10px; } .dish__photo { height:auto; aspect-ratio:3/2; } .dish__body { padding:20px; gap:24px; } .cookbook__detail { overflow:visible; } }
@media(prefers-reduced-motion:reduce) { .dish { animation:none; } .cookbook__entry { transition:none; } }