/* Breakage Calendar. The date leads every row, as on the home page's dated list; the fix is the
 * payoff, so it carries its own shape as well as its words: a filled square for a tested fix, an
 * outlined one for a guide, an open dashed ring for "no tested fix yet". */
.cal-page { padding: var(--wp-16) 0 var(--wp-24); }
.cal-page h2 { margin: 0; }
.cal-page :where(p) { margin: 0; }

/* ---------- intro: the name, then the next date ---------- */
.cal-intro { align-items: end; display: grid; gap: var(--wp-8) var(--wp-16); grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); }
.cal-intro-copy { display: grid; gap: var(--wp-4); }
.cal-intro h1 { font-size: var(--wp-text-hero); line-height: .95; margin: 0; text-wrap: wrap; }
.cal-intro .lede { font-size: var(--wp-text-lede); line-height: 1.5; max-width: 38em; }

.cal-next { border-top: var(--wp-rule-strong) solid var(--wp-ink); color: var(--wp-ink); display: grid; gap: var(--wp-2); padding: var(--wp-4) 0 var(--wp-2); text-decoration: none; }
.cal-next-date { align-items: baseline; display: flex; flex-wrap: wrap; gap: 0 var(--wp-4); }
.cal-next-date time { font: 700 3.5rem/1 var(--wp-font-display); letter-spacing: -0.02em; }
.cal-next .cal-count { color: var(--wp-rust); font: 500 1rem/1.2 var(--wp-font-mono); min-height: 1.2em; }
.cal-next-title { font: 700 1.5rem/1.15 var(--wp-font-display); letter-spacing: -0.01em; text-decoration: underline; text-decoration-color: transparent; text-decoration-thickness: 2px; text-underline-offset: 4px; text-wrap: balance; }
.cal-next:hover .cal-next-title { text-decoration-color: currentColor; }
.cal-next-fix { align-items: center; display: inline-flex; font: 500 var(--wp-text-cite)/1.2 var(--wp-font-mono); gap: var(--wp-2); letter-spacing: .06em; text-transform: uppercase; }
.cal-next-more { color: var(--wp-muted); font: 500 var(--wp-text-cite)/1.2 var(--wp-font-mono); }
.cal-next-more:empty { display: none; }

/* ---------- fix marks ---------- */
.cal-fix-mark { display: inline-block; flex: none; height: .8125rem; width: .8125rem; }
.cal-fix--tested .cal-fix-mark { background: var(--wp-cobalt); }
.cal-fix--guide .cal-fix-mark { border: var(--wp-rule-strong) solid var(--wp-ink); }
.cal-fix--none .cal-fix-mark { border: var(--wp-rule-strong) dashed var(--wp-rust); border-radius: 50%; }

/* ---------- subscribe ---------- */
.cal-actions { align-items: center; display: flex; flex-wrap: wrap; gap: var(--wp-2) var(--wp-8); list-style: none; margin: var(--wp-2) 0 0; padding: 0; }
.cal-actions-note { color: var(--wp-muted); font-size: var(--wp-text-meta); }
.cal-actions-status { font-size: var(--wp-text-meta); margin-top: var(--wp-2); overflow-wrap: anywhere; }
.cal-actions-status:empty { display: none; }
.cal-address { align-items: baseline; display: flex; flex-wrap: wrap; gap: var(--wp-1) var(--wp-3); }
.cal-address code { background: var(--wp-panel); font: 500 var(--wp-text-ledger)/1.4 var(--wp-font-mono); overflow-wrap: anywhere; padding: var(--wp-1) var(--wp-2); user-select: all; }

/* ---------- six small months ---------- */
.cal-overview { margin-top: var(--wp-12); }
.cal-intro { align-items: start; }
.cal-next { margin-top: 1.75rem; }
.cal-minis { display: grid; gap: var(--wp-6) var(--wp-8); grid-template-columns: repeat(6, minmax(0, 1fr)); }
.cal-mini { min-width: 0; }
.cal-mini-title { border-bottom: var(--wp-rule-strong) solid var(--wp-ink); font: 700 1.125rem/1.2 var(--wp-font-display); padding-bottom: var(--wp-1); }
.cal-mini-head, .cal-mini-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); list-style: none; margin: 0; padding: 0; text-align: center; }
.cal-mini-head { color: var(--wp-muted); font: 500 .6875rem/2 var(--wp-font-mono); }
.cal-mini-days { font: 500 .75rem/1 var(--wp-font-mono); row-gap: 2px; }
.cal-mini-days .d { align-items: center; aspect-ratio: 1; color: var(--wp-muted); display: flex; justify-content: center; position: relative; }
.cal-mini-days .s2 { grid-column-start: 2; } .cal-mini-days .s3 { grid-column-start: 3; } .cal-mini-days .s4 { grid-column-start: 4; }
.cal-mini-days .s5 { grid-column-start: 5; } .cal-mini-days .s6 { grid-column-start: 6; } .cal-mini-days .s7 { grid-column-start: 7; }
.cal-mini-days .in-range { background: var(--wp-hair); color: var(--wp-ink); }
.cal-mini-days .mark a { align-items: center; color: inherit; display: flex; font-weight: 500; height: 100%; justify-content: center; position: relative; text-decoration: none; width: 100%; }
.cal-mini-days .mark.cal-fix--tested { background: var(--wp-cobalt); color: var(--wp-on-bio); }
.cal-mini-days .mark.cal-fix--guide { box-shadow: inset 0 0 0 2px var(--wp-ink); color: var(--wp-ink); }
.cal-mini-days .mark.cal-fix--none { color: var(--wp-rust); }
.cal-mini-days .mark.cal-fix--none::before { background: var(--wp-paper); border: var(--wp-rule-strong) dashed var(--wp-rust); border-radius: 50%; content: ""; inset: 1px; position: absolute; }
.cal-mini-days .multi::after { background: currentColor; border-radius: 50%; content: ""; height: 4px; position: absolute; right: 2px; top: 2px; width: 4px; }
.cal-mini-days .is-today { color: var(--wp-ink); font-weight: 700; }
.cal-mini-days .is-today::after, .cal-key-today .cal-fix-mark { border-bottom: 3px solid var(--wp-focus); }
.cal-mini-days .is-today:not(.multi)::after { bottom: 1px; content: ""; left: 15%; position: absolute; right: 15%; }
.cal-key-today .cal-fix-mark { height: .5rem; }
.cal-page .cal-key { color: var(--wp-muted); display: flex; flex-wrap: wrap; font: 500 var(--wp-text-cite)/1.2 var(--wp-font-mono); gap: var(--wp-2) var(--wp-6); letter-spacing: .06em; margin-top: var(--wp-4); text-transform: uppercase; }
.cal-key > span { align-items: center; display: inline-flex; gap: var(--wp-2); }

.cal-page .cal-today { align-items: baseline; border-bottom: var(--wp-rule-strong) solid var(--wp-focus); display: flex; gap: var(--wp-3); margin-top: var(--wp-12); padding-bottom: var(--wp-2); }
.cal-today .label { color: var(--wp-focus); }
.cal-today [data-today-text] { font: 500 var(--wp-text-ledger)/1.2 var(--wp-font-mono); }

/* ---------- the list ---------- */
.cal-months, .cal-entries { list-style: none; margin: 0; padding: 0; }
.cal-month { margin-top: var(--wp-8); }
.cal-month-title { border-bottom: var(--wp-rule-strong) solid var(--wp-ink); font: 500 var(--wp-text-cite)/1.2 var(--wp-font-mono); letter-spacing: .08em; padding-bottom: var(--wp-2); text-transform: uppercase; }
.cal-entry { border-bottom: var(--wp-rule) solid var(--wp-hair); column-gap: var(--wp-8); display: grid; grid-template-columns: 7rem minmax(0, 1fr); padding: var(--wp-6) 0 var(--wp-8); scroll-margin-top: var(--wp-6); }
.cal-entry:target { box-shadow: inset 4px 0 0 var(--wp-cobalt); }
.cal-when { align-content: start; display: grid; gap: var(--wp-2); }
.cal-when time { display: grid; font-family: var(--wp-font-display); line-height: 1; }
.cal-when .mon, .cal-when .until { font: 500 var(--wp-text-cite)/1.2 var(--wp-font-mono); letter-spacing: .08em; text-transform: uppercase; }
.cal-when .day { font-size: 3.25rem; font-weight: 700; letter-spacing: -0.02em; }
.cal-when .day--month { font-size: 2.25rem; }
.cal-when .until { color: var(--wp-muted); margin-top: var(--wp-1); }
.cal-when .cal-count { color: var(--wp-rust); font: 500 var(--wp-text-cite)/1.2 var(--wp-font-mono); min-height: 1.2em; }

.cal-body { display: grid; gap: var(--wp-3); min-width: 0; }
.cal-kind { color: var(--wp-muted); display: flex; flex-wrap: wrap; font: 500 var(--wp-text-cite)/1.2 var(--wp-font-mono); gap: 0 var(--wp-3); letter-spacing: .08em; text-transform: uppercase; }
.cal-kind .cal-date { letter-spacing: .04em; text-transform: none; }
.cal-entry h3 { font: 700 1.75rem/1.1 var(--wp-font-display); letter-spacing: -0.01em; margin: 0; max-width: 32em; text-wrap: balance; }
.cal-what { font-size: 1.125rem; line-height: 1.5; max-width: 46em; }

.cal-facts { border-top: var(--wp-rule) solid var(--wp-hair); display: grid; gap: var(--wp-6); grid-template-columns: minmax(0, 5fr) minmax(0, 6fr) minmax(0, 4fr); margin: var(--wp-2) 0 0; padding-top: var(--wp-4); }
.cal-fact { display: grid; gap: var(--wp-2); align-content: start; min-width: 0; }
.cal-fact dt { color: var(--wp-muted); font: 500 var(--wp-text-cite)/1.2 var(--wp-font-mono); letter-spacing: .08em; text-transform: uppercase; }
.cal-fact dd { display: grid; gap: var(--wp-2); font-size: 1rem; line-height: 1.5; margin: 0; }
.cal-url { overflow-wrap: anywhere; }
.cal-code { background: var(--wp-panel); border-left: var(--wp-rule-strong) solid var(--wp-ink); font: 500 .875rem/1.5 var(--wp-font-mono); margin: 0; overflow-x: auto; padding: var(--wp-2) var(--wp-3); white-space: pre; }
.cal-code code { font: inherit; }

.cal-fix { background: var(--wp-panel); padding: var(--wp-3) var(--wp-4) var(--wp-4); }
.cal-fix--tested.cal-fix { background: var(--wp-cited); }
.cal-fix--none.cal-fix { background: var(--wp-flag); }
.cal-fix-kind { align-items: center; display: flex; font-weight: 700; gap: var(--wp-2); }
.cal-fix--none .cal-fix-kind { color: var(--wp-rust); }
.cal-fix-link { color: var(--wp-ink); font-weight: 600; text-decoration-thickness: 2px; text-underline-offset: 4px; }
.cal-fix--tested .cal-fix-link { color: var(--wp-cobalt-deep); }
.cal-fix-when { color: var(--wp-muted); display: block; font: 500 var(--wp-text-cite)/1.4 var(--wp-font-mono); margin-top: var(--wp-1); }

.cal-source { color: var(--wp-muted); font-size: var(--wp-text-meta); line-height: 1.5; }
.cal-source a { color: inherit; }
.cal-permalink { margin-left: var(--wp-2); white-space: nowrap; }

/* A date that has passed for this reader: kept, quieter. */
.cal-entry.is-past .cal-when .day, .cal-entry.is-past h3 { color: var(--wp-muted); }

.cal-past { margin-top: var(--wp-16); }
.cal-past .cal-month-title { color: var(--wp-ink); }

.cal-about { border-top: var(--wp-rule-strong) solid var(--wp-ink); display: grid; gap: var(--wp-4); margin-top: var(--wp-16); max-width: var(--wp-measure); padding-top: var(--wp-6); }
.cal-about h2 { font-size: 1.75rem; line-height: 1.1; }
.cal-credit { color: var(--wp-muted); font-size: var(--wp-text-meta); }

@media (max-width: 1100px) {
  .cal-minis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1000px) {
  .cal-facts { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .cal-fix { grid-column: 1 / -1; }
}
@media (max-width: 860px) {
  .cal-intro { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
  .cal-page { padding-top: var(--wp-8); }
  .cal-intro h1 { font-size: min(15vw, 3.5rem); }
  .cal-next-date time { font-size: 2.75rem; }
  .cal-actions { align-items: start; flex-direction: column; gap: 0; }
  .cal-actions li:first-child { margin-bottom: var(--wp-2); width: 100%; }
  .cal-actions .btn { width: 100%; }
  .cal-entry { grid-template-columns: minmax(0, 1fr); padding: var(--wp-4) 0 var(--wp-6); row-gap: var(--wp-2); }
  .cal-when { align-items: baseline; display: flex; flex-wrap: wrap; gap: 0 var(--wp-3); }
  .cal-when time { display: flex; flex-wrap: wrap; gap: 0 var(--wp-2); align-items: baseline; }
  .cal-when .day { font-size: 2.25rem; }
  .cal-when .day--month { font-size: 1.75rem; }
  .cal-entry h3 { font-size: 1.5rem; }
  .cal-what { font-size: 1.0625rem; }
  .cal-facts { grid-template-columns: minmax(0, 1fr); gap: var(--wp-4); }
  .cal-minis { gap: var(--wp-6) var(--wp-4); grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cal-mini--later { display: none; }
}