main,.wrap,.hero>*,.section-head>*,.planner-grid>*,.recipe-card,.database-card-content{min-width:0}
img,svg{max-width:100%}
h1,h2,h3,p,a,span,strong{overflow-wrap:break-word}

@media(max-width:1100px){
    input:not([type=checkbox]):not([type=radio]),select,textarea{font-size:16px}
    .admin-grid{grid-template-columns:1fr}
}

.admin-grid>*,.admin-ingredient-row>*{min-width:0}
.admin-ingredient-row [data-remove-ingredient]{grid-column:1/-1;justify-self:end}

@media(min-width:851px){
    .admin-ingredient-row{grid-template-columns:minmax(0,1fr) minmax(100px,.45fr) minmax(100px,.45fr)}
}

@media(min-width:1350px){
    .admin-ingredient-row{grid-template-columns:minmax(0,1fr) minmax(90px,.4fr) minmax(90px,.4fr) max-content}
    .admin-ingredient-row [data-remove-ingredient]{grid-column:auto;justify-self:stretch}
}

@media(max-width:850px){
    .recipes-hero,.profile-grid,.form-columns{grid-template-columns:1fr}
    .health-preferences{grid-template-columns:1fr}
    .admin-card,.profile-card,.document-card,.document-editor,.knowledge-card,.knowledge-note{min-width:0}
}

.weekly-grid{grid-template-columns:minmax(0,1fr)}
.weekly-grid>*,.weekly-plan-card,.weekly-calendar-scroll{min-width:0;max-width:100%}

@media(max-width:700px){
    .shopping-grid,.shopping-sections{grid-template-columns:minmax(0,1fr)}
    .shopping-card,.shopping-section,.shopping-item,.template-list li,.recipe-plan-list li{min-width:0}
    .item-name,.template-list li>span,.recipe-plan-list li>span{min-width:0;overflow-wrap:anywhere}
    .shopping-item>form,.template-list li>div,.recipe-plan-list li>form{flex:0 0 auto}
    .compact-form{grid-template-columns:minmax(0,1fr)}
    .compact-form>*{grid-column:1/-1}
    .shopping-add-dialog{width:calc(100% - 16px);max-height:calc(100dvh - 16px);overflow-y:auto}
}

@media(max-width:640px){
    .document-grid{grid-template-columns:1fr}
    .document-editor fieldset{padding:16px}
}

@media(max-width:560px){
    dialog{max-height:calc(100dvh - 16px)}
    .hero-card,.mini-list,.knowledge-grid article{padding:18px}
    .hero-card-top,.mini-list-head{gap:10px;flex-wrap:wrap}
    .plate{max-width:100%;height:auto;aspect-ratio:1}
    .button{max-width:100%;white-space:normal;text-align:center}

    .recipes-hero h1,.recipe-title{font-size:48px}
    .recipe-tools input,.recipe-tools select{width:100%;min-width:0}
    .database-card-content,.recipe-top,.recipe-panel,.profile-card,.admin-card,.shopping-card{padding:18px}
    .db-ingredients li,.ingredients li{align-items:flex-start}
    .db-ingredients li span,.ingredients li span{min-width:0;overflow-wrap:anywhere}
    .focus-panel summary{padding:18px}
    .focus-panel summary small{display:none}
    .focus-content{padding:18px}

    .weekly-section{padding-top:38px}
    .weekly-page{width:calc(100% - 16px)}
    .weekly-head{gap:20px}
    .weekly-week-form{width:100%;min-width:0}
    .weekly-card-heading{flex-wrap:wrap}
    .weekly-add-form,.weekly-swap-dialog form,.weekly-move-dialog form{padding:22px 18px}
    .weekly-add-day,.weekly-open-link,.weekly-dialog-close{min-width:44px;min-height:44px}

    .shopping-page{padding:2rem .5rem 7rem}
    .shopping-card{border-radius:14px}
    .section-heading{align-items:flex-start;flex-direction:column}
    .shopping-item{gap:.65rem}
    .item-check,.icon-button{min-width:44px;min-height:44px}
    .template-list li,.recipe-plan-list li{align-items:stretch;flex-direction:column}
    .template-list li>div{display:flex;justify-content:flex-end}
    .standard-list-row{grid-template-columns:minmax(0,1fr) 72px}
    .standard-list-row select{grid-column:1/-1}
    .shopping-actions{gap:.5rem;padding-inline:.5rem}
    .shopping-action{padding:10px 12px;font-size:14px}
    .shopping-confirm-actions{display:grid;grid-template-columns:1fr 1fr}
    .shopping-confirm-actions .button{width:100%}
    .dialog-heading{align-items:flex-start}
}

@media(max-width:360px){
    .site-header{padding-inline:10px}
    .weekly-actions{align-items:stretch;flex-direction:column}
    .weekly-actions .button{width:100%}
    .shopping-actions{align-items:stretch;flex-direction:column}
    .shopping-actions form,.shopping-actions .shopping-action{width:100%}
}