/* Calendar structures for many goals (cal-more.js). Phone width; reuses the week pager styles in cal-options.css. */
@media (max-width: 760px) {
  .cm-note { font-family: var(--mono); font-size: 11px; color: var(--muted); margin-bottom: 10px; }
  .cal-many .cw { padding-bottom: 6px; }
  .cal-many .cw-nav { margin-bottom: 12px; }

  /* Day dots, shared by D */
  .pc-dots { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; align-items: center; justify-items: center; }
  .pc-dots i { width: 16px !important; height: 16px !important; }
  .pc-dots i { width: 13px; height: 13px; border-radius: 50%; border: 1.5px solid var(--line); background: var(--card); }
  .pc-dots i.on { background: var(--line); }
  .pc-dots i.part { background: conic-gradient(var(--line) var(--p), var(--card) 0); }
  .pc-dots i.miss { border-color: var(--pop); }
  .pc-dots i.fut { border-style: dashed; border-color: color-mix(in srgb, var(--muted) 50%, transparent); }

  /* D. Platform cards */
  .pd-head { padding: 0 14px 4px; } .pd-head > span:not(.pd-l) { display: none; }
  .pd-l { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; text-align: center; font-family: var(--mono); font-size: 10px; color: var(--muted); line-height: 1.1; }
  .pd-l b { display: block; font-family: var(--display); font-size: 12px; color: var(--text); }
  .pd-l .today { color: var(--pop); } .pd-l .today b { color: var(--pop); }
  .pc-card { border: 2px solid var(--line); border-radius: 14px; background: color-mix(in srgb, var(--tint) 55%, var(--card)); padding: 8px 12px; margin-bottom: 10px; box-shadow: 2px 2px 0 var(--line); }
  .pc-name { font-size: 15px; font-weight: 800; }
  .pc-row { display: grid; grid-template-columns: 1fr auto; gap: 4px 8px; align-items: baseline; padding: 7px 0; border-top: 1.5px dashed color-mix(in srgb, var(--line) 25%, transparent); }
  .pc-row .pc-dots { grid-column: 1 / -1; }
  .pc-name + .pc-row { border-top: 0; }
  .pc-kind { font-size: 13px; font-weight: 600; line-height: 1.15; }
  .pc-kind small { font-family: var(--mono); font-size: 10px; font-weight: 400; color: var(--muted); margin-left: 6px; }
  .pc-sum { font-family: var(--mono); font-size: 12px; text-align: right; }
  .pc-sum.full { font-weight: 600; }

  /* E. Day checklist */
  .dv-strip { display: grid; grid-template-columns: repeat(7, 1fr); gap: 5px; }
  .calm .dv-day { display: flex; flex-direction: column; align-items: center; font-family: var(--mono); font-size: 10px; color: var(--muted); border: 2px solid var(--line); border-radius: 12px; padding: 4px 0 6px; background: var(--card); }
  .dv-day b { font-family: var(--display); font-size: 15px; color: var(--text); }
  .dv-day i { width: 70%; height: 5px; border-radius: 99px; margin-top: 3px; background: linear-gradient(90deg, var(--go) var(--p), color-mix(in srgb, var(--muted) 25%, transparent) 0); }
  .calm .dv-day.fut { border-style: dashed; border-color: color-mix(in srgb, var(--muted) 50%, transparent); background: transparent; }
  .dv-day.fut i { opacity: 0; }
  .calm .dv-day.today { border-color: var(--pop); }
  .calm .dv-day.sel { background: var(--line); color: var(--bg); } .dv-day.sel b { color: var(--bg); }
  .dv-when { font-weight: 800; font-size: 16px; margin: 14px 0 6px; }
  .dv-group { border-left: 6px solid var(--tint); padding-left: 10px; margin: 10px 0; }
  .dv-group > b { font-size: 13px; }
  .dv-item { display: grid; grid-template-columns: 22px 1fr auto; gap: 8px; align-items: center; padding: 5px 0; font-size: 14px; }
  .dv-box { width: 20px; height: 20px; border: 2px solid var(--line); border-radius: 6px; display: grid; place-content: center; font-size: 12px; font-weight: 800; }
  .dv-item.ok .dv-box { background: var(--go); color: #062b16; }
  .dv-item:not(.ok) span:nth-child(2) { color: var(--muted); }
  .dv-n { font-family: var(--mono); font-size: 12px; }
  .dv-empty { color: var(--muted); padding: 14px 0; }

  /* F. Week rings */
  .rg-group { margin-bottom: 10px; }
  .rg-group > b { font-size: 13px; font-weight: 800; border-bottom: 4px solid var(--tint); }
  .rg-row { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; margin-top: 6px; }
  .rg { display: grid; grid-template-columns: 44px 1fr; grid-template-rows: auto auto; column-gap: 8px; align-items: center; border: 2px solid var(--line); border-radius: 12px; padding: 6px 8px; background: var(--card); }
  .rg svg { grid-row: 1 / 3; width: 44px; height: 44px; }
  .rg .bg, .rg .fg { fill: none; stroke-width: 6; } .rg .bg { stroke: color-mix(in srgb, var(--muted) 25%, transparent); }
  .rg .fg { stroke-linecap: round; }
  .rg-n { font-weight: 800; font-size: 17px; line-height: 1; } .rg-n small { font-size: 11px; color: var(--muted); font-weight: 600; }
  .rg-k { font-size: 11px; line-height: 1.15; color: var(--muted); }

  /* G. Heat strips */
  .ht-key { display: flex; align-items: center; gap: 4px; font-family: var(--mono); font-size: 10px; color: var(--muted); margin-bottom: 8px; }
  .ht-key i, .ht-cells i { display: block; aspect-ratio: 1; border-radius: 2px; background: color-mix(in srgb, var(--go) var(--p), color-mix(in srgb, var(--muted) 15%, transparent)); }
  .ht-key i { width: 10px; }
  .ht-key .ht-wk { margin-left: auto; border-bottom: 2px solid var(--line); }
  .ht-group { margin-bottom: 8px; }
  .ht-group > b { font-size: 13px; font-weight: 800; border-bottom: 4px solid var(--tint); }
  .ht-row { display: grid; gap: 4px; padding: 5px 0; }
  .ht-k { font-size: 13px; font-weight: 600; line-height: 1.1; } .ht-k small { margin-left: 6px; font-family: var(--mono); font-weight: 400; font-size: 10px; color: var(--muted); }
  .ht-cells { display: grid; grid-template-columns: repeat(30, 1fr); gap: 2px; }
  .ht-cells i.fut { background: transparent; outline: 1px dashed color-mix(in srgb, var(--muted) 40%, transparent); outline-offset: -1px; }
  .ht-cells i.wk { box-shadow: 0 2px 0 var(--line); }
  .ht-cells i.today { outline: 1.5px solid var(--pop); outline-offset: 0; }
}