.month-calendar { background:var(--panel); padding:18px; border-radius:24px; border:1px solid #303530; }
.month-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; }
.month-heading h2 { font-size:19px; font-weight:600; letter-spacing:-.5px; margin:0; }
.month-weekdays,.month-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:5px; }
.month-weekdays { text-align:center; color:#87927f; font-size:9px; margin-bottom:8px; }
.month-day { position:relative; min-height:46px; border:1px solid transparent; border-radius:11px; background:transparent; color:#abb2a6; padding:7px 2px 5px; font-weight:450; min-width:0; }
.month-day strong { font-size:13px; font-weight:500; }
.month-day.in-range { background:#2a342a; color:#d4e6c8; }
.month-day.selected { background:#a8e5bf; color:#153a22; border-color:#a8e5bf; }
.month-markers { display:flex; align-items:center; justify-content:center; gap:3px; height:9px; margin-top:4px; }
.month-markers i,.calendar-legend i { width:4px; height:4px; border-radius:50%; background:var(--mint); }
.month-markers svg { width:8px; height:8px; fill:none; stroke:#d7b79b; stroke-width:2; }
.month-day.selected i { background:#245035; }.month-day.selected svg { stroke:#245035; }
.month-meal-name { display:none; }
.calendar-legend { display:flex; align-items:center; gap:12px; margin-top:15px; flex-wrap:wrap; color:#98a38d; font-size:8px; line-height:1.5; }
.calendar-legend > span { display:flex; gap:5px; align-items:center; }
.calendar-legend svg { width:10px; height:10px; fill:none; stroke:#d7b79b; stroke-width:1.8; }
.calendar-legend b { width:9px; height:9px; border-radius:3px; background:#354830; }
.routine-summary { display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; background:#283328; border:1px solid #3c4a35; border-radius:16px; padding:16px; margin-top:13px; text-align:left; color:#c8e2b8; }
.routine-summary strong { display:block; font-size:12px; font-weight:600; }
.routine-summary small { display:block; font-size:10px; font-weight:400; color:#97af87; margin-top:6px; line-height:1.5; }
.grocery-runs-link { display:flex; align-items:center; gap:8px; width:100%; padding:12px 3px; min-height:44px; text-align:left; background:transparent; color:#b7c8a9; font-size:11px; font-weight:400; margin-bottom:7px; }
.grocery-runs-link > span:first-of-type { flex:1; }
.grocery-runs-link svg { width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:1.7; }
.planning-preview { padding:14px; background:#263321; border:1px solid #3c4c32; border-radius:12px; color:#bdd6aa; font-size:12px; line-height:1.7; }
#planning-error { color:#efada0; font-size:12px; line-height:1.7; }
.run-picker { padding:18px; background:#20291d; border-radius:16px; border:1px solid #35422c; }
.run-picker label { display:block; font-size:11px; color:#b7c9a7; margin-bottom:8px; }
.run-picker select { width:100%; font-size:13px; }
.run-picker .quiet-button { margin-top:7px; color:#b1c99f; }
.schedule-calendar .month-day { min-height:75px; text-align:left; padding:11px; }
.schedule-calendar .month-markers { justify-content:flex-start; }
.schedule-calendar .month-meal-name { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; margin-top:7px; font-size:10px; color:#a4bc94; font-weight:400; }
.schedule-calendar .month-day.selected .month-meal-name { color:#285239; }
.schedule-calendar .month-heading h2 { font-size:24px; }
.schedule-calendar .calendar-legend { font-size:10px; }
@media(min-width:760px) {
  body[data-screen='home'] #content { grid-template-columns:1.2fr 1fr; }
  .month-calendar { padding:20px; }
}
@media(max-width:700px) {
  .month-calendar { padding:16px; border-radius:22px; }
  .month-heading { margin-bottom:11px; }
  .month-heading h2 { font-size:18px; }
  .month-heading .week-controls { gap:0; }
  .month-heading .week-controls button { min-width:27px; }
  .month-weekdays,.month-grid { gap:4px; }
  .month-day { min-height:42px; padding:5px 1px; border-radius:10px; }
  .month-day strong { font-size:12px; }
  .calendar-legend { gap:10px; font-size:7px; margin-top:11px; }
  .routine-summary { padding:14px; margin-top:11px; }
  .routine-summary strong { font-size:11px; }
  .routine-summary small { font-size:9px; }
  .grocery-runs-link { font-size:10px; margin-bottom:5px; }
  .schedule-calendar .month-day { min-height:48px; padding:6px 3px; text-align:center; }
  .schedule-calendar .month-markers { justify-content:center; }
  .schedule-calendar .month-meal-name { display:none; }
  .schedule-calendar .month-heading h2 { font-size:18px; }
  .schedule-calendar .calendar-legend { font-size:7px; }
  .run-picker select { font-size:16px; }
}