.ib{background:var(--panel);border:1px solid var(--line);border-radius:12px;min-width:0}.ib-tools{display:flex;flex-wrap:wrap;align-items:end;gap:10px;padding:16px;border-bottom:1px solid var(--line)}.ib-tools>label:first-child{flex:1;min-width:180px;margin:0}.ib-tools input[type=search]{margin-top:6px}.ib-workspace{display:grid;grid-template-columns:190px minmax(0,1fr)}.ib-workspace.ib-picker{grid-template-columns:1fr}.ib-categories{display:flex;flex-direction:column;gap:6px;padding:12px;border-right:1px solid var(--line)}.ib-categories button{display:flex;justify-content:space-between;gap:10px;text-align:left;background:var(--category-tint,var(--linen));border-left:6px solid var(--category-color,var(--secondary));font-size:13px;color:var(--ink)}.ib-categories button[aria-pressed=true]{outline:2px solid var(--ink);outline-offset:-2px}.ib-content{min-width:0;padding:16px}.ib-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px;font-size:13px}.ib-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:88px;gap:8px;align-content:start}.ib-tile{height:88px;min-width:0;display:flex;align-items:center;gap:6px;padding:8px;border:1px solid var(--line);border-left:5px solid var(--category-color);border-radius:8px;background:var(--category-tint)}.ib-name{border:0;background:transparent;text-align:left;height:100%;flex:1;min-width:0;padding:4px}.ib-name strong,.ib-choice strong{display:block;font-size:13px;overflow-wrap:anywhere}.ib small{display:block;font-size:11px;color:var(--muted);margin-top:5px}.ib .ib-star{padding:4px 8px;min-width:36px;min-height:38px;font-size:19px;background:var(--panel);color:#6b4912;border:1px solid #bdb4a6}.ib .ib-star[aria-pressed=true]{background:#fff2c5;color:#704b00}.ib-added{outline:2px solid var(--forest);outline-offset:-2px}.ib-added .ib-name:disabled{opacity:1;color:#36533b}.ib-choice,.ib-multi{display:flex;align-items:center;gap:8px;margin:0;min-width:0}.ib-choice{flex:1;height:100%}.ib-choice input,.ib-multi input{width:18px;height:18px;flex:none}.ib-directory{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.ib-directory button{text-align:left;padding:20px;background:var(--category-tint);border-left:6px solid var(--category-color)}.ib-pages{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:16px}.ib-selection{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px;border-top:1px solid var(--line)}.ib-selection [data-chips]{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}.ib-selection [data-chips] button{font-size:12px}.ingredient-browser-dialog{width:1100px;max-width:calc(100vw - 24px);max-height:92dvh;overflow:auto;padding:18px;border:1px solid var(--line);border-radius:14px;background:var(--panel);color:var(--ink)}.ingredient-browser-dialog::backdrop{background:#25231f66}.ingredient-browser-dialog>header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.ingredient-browser-dialog h2{margin:0;font-family:Georgia,serif}.ingredient-browser-dialog button:focus-visible,.ib button:focus-visible{outline:3px solid #306c9a;outline-offset:2px}@media(max-width:1100px){.ib-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:800px){.ib-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ib-workspace{grid-template-columns:165px minmax(0,1fr)}}@media(max-width:600px){.ib-workspace{grid-template-columns:1fr}.ib-categories{flex-direction:row;overflow:auto;border-right:0;border-bottom:1px solid var(--line)}.ib-categories button{flex:none}.ib-grid{grid-template-columns:1fr}.ib-results{max-height:55dvh;overflow-y:auto;overscroll-behavior-y:contain;scrollbar-gutter:stable;padding:3px}.ib-pages{display:none}.ib-directory{grid-template-columns:repeat(2,minmax(0,1fr))}.ib-directory button{padding:12px}.ib-content,.ib-tools{padding:10px}.ib-tools>label:first-child{flex-basis:100%}.ib-selection{flex-wrap:wrap}.ib button{min-height:44px}.ib input[type=search]{font-size:16px}.ingredient-browser-dialog{padding:10px}.ib-name strong{font-size:14px}}
/* The dialog itself stays fixed; only results scroll, leaving actions in view. */
html:has(.ingredient-browser-dialog[open]),html:has(.ingredient-browser-dialog[open]) body{overflow:hidden;overscroll-behavior:none}
.ingredient-browser-dialog[open]{display:flex;flex-direction:column;overflow:hidden;height:min(760px,calc(var(--picker-height,100dvh) - 24px));max-height:calc(var(--picker-height,100dvh) - 24px)}
.ingredient-browser-dialog>header{flex:none;gap:12px;margin-bottom:8px}
html body .ingredient-browser-dialog .picker-new{font-size:13px;min-height:34px;padding:5px 10px}
html body .ingredient-browser-dialog .picker-close{font-size:26px;line-height:1;padding:0;width:44px;height:44px;min-height:44px;border:0;background:transparent;margin-left:auto}
.ingredient-browser-dialog [data-browser]{display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden}
.ingredient-browser-dialog .ib-tools{flex:none}
.ingredient-browser-dialog .ib-workspace{flex:1;min-height:0}
.ingredient-browser-dialog .ib-content{display:flex;flex-direction:column;min-height:0;overflow:hidden}
.ingredient-browser-dialog .ib-heading{flex:none}
.ingredient-browser-dialog .ib-workspace.ib-picker .ib-grid{grid-auto-rows:max-content}
.ingredient-browser-dialog .ib-picker .ib-tile{display:grid;grid-template-columns:minmax(0,1fr) 36px;align-items:start}
.ingredient-browser-dialog .ib-picker :is(.ib-choice,.ib-name){height:auto;align-self:start}
.ingredient-browser-dialog .ib-choice{display:grid;grid-template-columns:18px minmax(0,1fr);align-items:start}
.ingredient-browser-dialog .ib-choice>span{display:block;min-width:0;flex:1}
.ingredient-browser-dialog .ib-choice .heat-rating{display:flex;width:100%}
.ingredient-browser-dialog .ib-choice .heat-peppers{width:78px;max-width:100%;height:36px}
.ingredient-browser-dialog .ib-results{flex:1;min-height:0;max-height:none;overflow-y:auto;overscroll-behavior:contain;align-content:start}
.ingredient-browser-dialog .ib-pages{flex:none;margin-top:8px}
.ingredient-browser-dialog .ib-selection{flex:none;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;padding:8px}
.ingredient-browser-dialog .ib-selection[hidden]{display:none!important}
.ingredient-browser-dialog [data-chips]{max-height:76px;overflow-y:auto}
@media(max-width:650px){
 .ingredient-browser-dialog[open]{position:fixed;inset:var(--picker-top,0px) 0 auto;width:calc(100vw - 12px);max-width:calc(100vw - 12px);margin:6px auto;padding:8px;height:calc(var(--picker-height,100dvh) - 12px);max-height:calc(var(--picker-height,100dvh) - 12px)}
 .ingredient-browser-dialog .ib-tools{padding:8px;gap:6px;display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center}
 .ingredient-browser-dialog .ib-tools>label:first-child{grid-column:1 / -1;min-width:0}
 .ingredient-browser-dialog .ib-tools input[type=search]{margin:0}
 html body .ingredient-browser-dialog .ib-tools button{font-size:13px;min-height:36px;padding:5px 8px}
 html body .ingredient-browser-dialog .ib-multi{font-size:13px!important;white-space:nowrap}
 .ingredient-browser-dialog .ib-content{padding:8px}
 .ingredient-browser-dialog .ib-heading{gap:6px;margin-bottom:6px;font-size:12px}
 html body .ingredient-browser-dialog .ib-heading button{font-size:12px;padding:4px;min-height:36px}
 .ingredient-browser-dialog .ib-selection [data-chips]{display:none}
 html body .ingredient-browser-dialog .ib-selection button{font-size:14px;min-height:44px;padding:8px 10px}
 .ingredient-browser-dialog .ib-selection [data-selected]{font-size:14px}
}
