/* v2.5.1: primary actions before the result, available while reading a long meal.
   No blanket overflow hiding, forced zoom or backdrop-filter. */
#pickView{--pick-action-height:100px}
.pick-action-bar{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:14px;padding:14px 18px;margin:0 0 18px;border:1px solid #dce4d3;border-radius:16px;background:#fffef9;box-shadow:0 4px 14px rgba(33,66,49,.06);position:sticky;top:8px;z-index:12;isolation:isolate}
.pick-action-context{min-width:0;display:flex;flex-direction:column;gap:4px}
.pick-action-context strong{font-size:14px;color:#203e37;line-height:1.5}
.pick-action-context span{font-size:12px;line-height:1.55;color:#687b68;overflow-wrap:anywhere}
.pick-action-buttons{display:flex;align-items:center;gap:10px;min-width:0}
#pickActionBar button{min-height:44px;line-height:1.4;white-space:normal;touch-action:manipulation}
#pickActionBar .primary-btn{gap:8px;padding:12px 18px;font-size:14px;min-width:170px}
#pickActionBar .primary-btn .icon{flex:none;width:18px;height:18px}
#quickDrawLabel{overflow-wrap:anywhere}
#quickConfirmBtn{padding:11px 16px;font-size:13px;max-width:205px}
.pick-action-jumps{display:flex;flex-direction:column;align-items:stretch;gap:0}
#pickActionBar .pick-action-jumps button{min-height:30px;padding:3px 7px;font-size:12px;white-space:nowrap}
#pickActionBar button:focus-visible{outline:3px solid #b58c3c;outline-offset:3px}
#pickActionBar.is-small-viewport{position:relative;top:auto}
#pickView #resultCard,#pickView #pickFilters{scroll-margin-top:calc(var(--pick-action-height) + 24px)}
#pickView #resultCard:focus,#pickView #pickFilters:focus{outline:none}
#pickView #resultCard:focus-visible,#pickView #pickFilters:focus-visible{outline:2px solid #90a57d;outline-offset:4px}
/* The original bottom controls remain the single authority for actions and state. */
@media(max-width:1000px){
 .pick-action-bar{grid-template-columns:minmax(0,1fr) auto;gap:8px 12px;padding:12px 14px}
 .pick-action-context{grid-column:1;grid-row:1}
 .pick-action-jumps{grid-column:2;grid-row:1;flex-direction:row;align-items:center;gap:8px}
 .pick-action-buttons{grid-column:1/-1;grid-row:2}
 #pickActionBar .primary-btn{flex:1;min-width:0}
 #quickConfirmBtn{flex:0 1 auto;min-width:120px}
}
@media(max-width:520px){
 .pick-action-bar{top:4px;padding:10px 11px;margin-bottom:14px;border-radius:13px;gap:8px}
 .pick-action-context{grid-column:1/-1;grid-row:1}
 .pick-action-context strong{font-size:13px}
 .pick-action-context span{font-size:11px;line-height:1.45}
 .pick-action-buttons{gap:8px;grid-row:2}
 #pickActionBar .primary-btn{font-size:13px;padding:10px 8px;min-height:44px}
 #quickConfirmBtn{font-size:12px;padding:10px 8px;min-width:90px;max-width:140px}
 .pick-action-jumps{grid-row:3;grid-column:1/-1;justify-content:space-between}
 #pickActionBar .pick-action-jumps button{min-height:28px;padding:3px 2px}
}
@media(prefers-reduced-motion:reduce){#pickActionBar button{transition:none}}
/* In short landscape windows keep the primary action inside the first screen.
   Only decorative intro copy collapses; the meal, settings and safety copy stay. */
@media(max-height:480px) and (max-width:820px){
 #pickView>.intro{padding:7px 0 9px}
 #pickView>.intro .eyebrow,#pickView>.intro .intro-copy,#pickView>.intro .date-block{display:none}
 #pickView>.intro h1{font-size:25px;margin:0;line-height:1.3}
 #quickPickHint{display:none}
}