/* Shared phone layout rules, loaded after feature and theme styles. */
@media(max-width:760px){
  .main,.card,.today-layout>*,.grid>*,.formgrid>*,.body-layout>*,.hourly-layout>*{min-width:0}
  .card{max-width:100%;height:auto}
  .card :is(h2,h3,p,small,label,dt,dd){overflow-wrap:anywhere}
  .card :is(input,select,textarea){min-width:0;max-width:100%}
  .card :is(button,.pill){max-width:100%}
  .card>.row,.card>form>.row,.card .entry>.row,.routinecard>.row,.stretchbrowsecard>.row,.stretchbuilderitem>.row,.builderitem>.row,.savings-goal>.row{flex-wrap:wrap;align-items:center}
  .row>div,.flex>div,.exercisehead>div,.stretchentry>div,.stretchheading>div{min-width:0}
  .card>.row>.actions,.card>form>.row>.actions{margin-top:0;max-width:100%}
  .card>.row>h2,.card>.row>h3{flex:1 1 150px}
  .card>.row>div:first-child{flex:1 1 160px}
  .card>.row>.pill{flex:0 0 auto;white-space:normal}
  .grid,.routinegrid,.stretchbrowsegrid,.stretchroutinegrid,.combinedweek,.today-layout,.hourly-layout{grid-template-columns:minmax(0,1fr)}
  .macrogrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
  .macrogrid>div,.metricgrid>div,.food-detail-macros>div{min-width:0;overflow-wrap:anywhere}
  .formgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .setrow{grid-template-columns:28px minmax(0,1fr) minmax(0,1fr) 36px;gap:6px}
  .setrow input{min-width:0;padding:9px 5px}
  .actions{max-width:100%;gap:8px}
  .actions>button{white-space:normal;line-height:1.4}
  .stretchentry,.stretchheading,.calendar-import-card,.life-grocery-link{flex-wrap:wrap}
  .stretchentry>.actions,.stretchheading>.actions{margin-top:0}
  .weekly-body .body-layout{grid-template-columns:minmax(0,1fr)}
  .body-viewport{min-width:0;max-width:100%}
  .body-viewport canvas{max-width:100%}
  .trainingtabs.training-word-tabs .training-word{min-width:max-content;flex:0 0 auto}
  .weekstrip{grid-template-columns:repeat(7,minmax(66px,1fr));max-width:100%;overflow-x:auto;padding:4px 3px 10px;scroll-snap-type:x proximity}
  .weekstrip .weekday{scroll-snap-align:start;padding:12px 6px}
  .weekstrip .weekday small{font-size:11px;white-space:normal;overflow-wrap:anywhere}
  .hormone-scroll,.blood-trend-scroll,.measurement-plot,.wellbeing-chart,.tablewrap{width:100%;max-width:100%;min-width:0;overflow-x:auto;overscroll-behavior-x:contain}
  .wellbeing-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:16px}
  .wellbeing-stats>div{min-width:0;overflow-wrap:anywhere}
  .wellbeing-stats b{font-size:clamp(19px,5vw,26px)}
  .avatar-summary{gap:12px;flex-wrap:wrap}
  .avatar-summary>div{min-width:100px}
  .theme-current>div,.theme-option>span:last-child{min-width:0;overflow-wrap:anywhere}
  .modalhead{gap:12px;align-items:flex-start}.modalhead h2{min-width:0;overflow-wrap:anywhere}.modalhead button{flex-shrink:0}
  dialog{max-width:calc(100% - 24px);padding:20px;max-height:calc(100dvh - 32px);overflow-y:auto}
}
@media(max-width:480px){
  .main{padding-inline:12px}
  .card{padding:18px;border-radius:20px}
  .top{gap:12px}.top h1{font-size:27px;line-height:1.25}
  .top>.datebox{display:grid;grid-template-columns:36px minmax(0,1fr) 36px auto;gap:5px;width:100%}
  .datebox input{width:100%;min-width:0;padding:9px 5px}
  .datebox button{min-width:0;padding:9px 8px}
  .hero{flex-direction:column;align-items:center;gap:18px;padding:22px 0}
  .hero .stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;gap:16px;text-align:center}
  .hero .stats>div{min-width:0}.hero .stats small{display:block;line-height:1.5}
  .hero .ring{width:144px;height:144px}.hero .ringinner{width:122px;height:122px}
  .macrogrid{font-size:13px;gap:9px}.macrogrid p small{display:block;margin-top:4px}.macrogrid .bar{margin-top:10px}
  .formgrid,.profile-fields .formgrid,.lab-review-rows .formgrid{grid-template-columns:minmax(0,1fr)}
  .exercise-timers .formgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .formgrid .full{grid-column:1/-1}
  .settings-facts{grid-template-columns:minmax(0,1fr)}
  .lab-focus-grid,.measurement-selectors,.food-detail-macros{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .lab-focus-tile{padding:14px}.lab-value{font-size:21px;overflow-wrap:anywhere}
  .sessiongoal{grid-template-columns:minmax(0,1fr);gap:12px}
  .sessiongoal>div:last-child{display:flex;align-items:center;justify-content:center;gap:10px}
  .stretch-week{grid-template-columns:repeat(2,minmax(0,1fr))}
  .card>.stretchroutinegrid{display:grid;grid-template-columns:minmax(0,1fr);overflow:visible}
  .card>.stretchroutinegrid>.stretchroutine{min-width:0;padding:18px}
  .cycle-phase-strip{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cycle-position>.row{align-items:flex-start}.cycle-day-number{min-width:65px}
  .calendar{grid-template-columns:repeat(7,minmax(0,1fr));gap:3px}
  .cycle-date{font-size:12px}.cycle-weekday{font-size:10px}
  .shared-calendar-grid{gap:4px}.calendar-week-label{font-size:10px}
  .gentle-metric{gap:12px;flex-wrap:wrap}.gentle-metric>div{min-width:0}
  .learning-topic-grid{grid-template-columns:minmax(0,1fr)}
  .learning-category{padding:20px}.learning-category p{font-size:14px}
  .learning-category-meta,.learning-sub-open>span{flex-wrap:wrap;gap:8px}
  .home-option{gap:6px}.home-option label{min-width:0;gap:8px;overflow-wrap:anywhere}.home-option .actions{flex:0 0 auto;gap:3px;flex-wrap:nowrap}
  .home-option .actions button{min-width:32px;padding:8px}.home-option .home-drag-handle{padding:4px;min-width:28px}
  .grocery-row,.life-task-row{gap:9px;flex-wrap:wrap}.grocery-check,.life-task-row>label{flex-basis:65%;min-width:0}
  .water-moment{gap:14px}.water-drop{flex-basis:80px;width:80px}.water-tally .waterbig{font-size:30px}
  .savings-goal .actions{flex-wrap:wrap}.savings-amount b{font-size:22px}
}
