/* Fluid mobile surface: resize the layout, never scale down text or reset state. */
.mobile-layout .shell{width:100%;max-width:none;padding-left:max(22px,env(safe-area-inset-left));padding-right:max(22px,env(safe-area-inset-right))}.mobile-layout #nav{width:100%;max-width:none;padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}
@media(max-width:999px){html:not(.desktop-layout) .shell{width:100%;max-width:none;padding-left:max(22px,env(safe-area-inset-left));padding-right:max(22px,env(safe-area-inset-right))}html:not(.desktop-layout) #nav{width:100%;max-width:none;padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}}
@media(orientation:landscape) and (max-height:600px){
 html:not(.desktop-layout) body{padding:0}html:not(.desktop-layout) .shell{width:100%;max-width:none;min-height:100dvh;margin:0;border:0;border-radius:0;padding-top:0;padding-bottom:calc(76px + env(safe-area-inset-bottom));padding-left:max(22px,env(safe-area-inset-left));padding-right:max(22px,env(safe-area-inset-right))}
 html:not(.desktop-layout) .shell>header{padding:12px 0}html:not(.desktop-layout) .save-line{padding-top:6px}html:not(.desktop-layout) #nav{width:100%;max-width:none;bottom:0;border-radius:0;min-height:0;padding-top:5px;padding-bottom:max(5px,env(safe-area-inset-bottom));border-left:0;border-right:0}
 html:not(.desktop-layout) #nav button{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:3px;font-size:11px}html:not(.desktop-layout) #nav .nav-icon{padding:3px 12px}html:not(.desktop-layout) .days{margin-top:12px;margin-bottom:12px}html:not(.desktop-layout) .days button{padding:6px 0;gap:3px}html:not(.desktop-layout) .days b{font-size:16px}
 html:not(.desktop-layout) .people{flex-wrap:nowrap;gap:7px}html:not(.desktop-layout) .people button{flex:0 1 auto;padding:6px 10px;min-width:0}html:not(.desktop-layout) .section-title{margin-top:18px}html:not(.desktop-layout) .sub{margin-bottom:16px}
 html:not(.desktop-layout) .overlay{align-items:center;padding:12px max(12px,env(safe-area-inset-right)) 12px max(12px,env(safe-area-inset-left))}html:not(.desktop-layout) .sheet{width:min(720px,100%);max-height:calc(100dvh - 24px);overflow-y:auto;border-radius:18px;padding:16px}
 html:not(.desktop-layout) .food-layout{display:block}html:not(.desktop-layout) .food-planning{position:static}html:not(.desktop-layout) .week-menu{grid-template-columns:repeat(3,minmax(0,1fr))}html:not(.desktop-layout) .proposal-grid{grid-template-columns:repeat(2,minmax(0,1fr))}html:not(.desktop-layout) .task-list{grid-template-columns:repeat(2,minmax(0,1fr))}html:not(.desktop-layout) .task-empty{grid-column:1/-1}
 html:not(.desktop-layout) .meal-detail-layout{grid-template-columns:minmax(200px,1fr) minmax(250px,1.4fr)}html:not(.desktop-layout) .meal-fullscreen{max-width:100%;height:100dvh;max-height:100dvh}html:not(.desktop-layout) .member-row{min-width:0}html:not(.desktop-layout) .profile-photo-preview{margin:12px 0}
}
@media(orientation:landscape) and (max-height:600px) and (max-width:650px){html:not(.desktop-layout) .task-list,html:not(.desktop-layout) .proposal-grid{grid-template-columns:minmax(0,1fr)}html:not(.desktop-layout) .meal-detail-layout{grid-template-columns:minmax(0,1fr)}}