/* Days since counter (kind "days"). Scoped to [data-days] or days- classes. */
[data-days] .days-head { flex-wrap: wrap; justify-content: space-between; }
[data-days] .days-add { min-height: 40px; padding: 8px 16px; font-size: 15px; }
[data-days] .days-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 12px; }
[data-days] .days-card { background: var(--canvas); border-radius: 12px; padding: 12px; display: flex; flex-direction: column; gap: 10px; min-width: 0; }
[data-days] .days-top { display: flex; align-items: center; gap: 6px; }
[data-days] .days-name { flex: 1; min-width: 0; border: 0; background: transparent; font-weight: 700; font-size: 18px; padding: 6px; border-radius: var(--input); }
[data-days] .days-name:focus { background: var(--soft); outline: none; }
[data-days] .days-name::placeholder { color: var(--mute); }
[data-days] .days-main { display: flex; align-items: baseline; gap: 10px; padding: 0 6px; min-width: 0; }
[data-days] .days-n { font-size: clamp(72px, 18vw, 120px); overflow-wrap: anywhere; }
[data-days] .days-unit { font-size: 22px; font-weight: 700; color: var(--body); }
[data-days] .days-alt { font-size: 15px; color: var(--body); padding: 0 6px; font-variant-numeric: tabular-nums; }
[data-days] .days-rec { font-size: 15px; font-weight: 600; padding: 0 6px; }
[data-days] .days-dates { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
[data-days] .days-dates input { background: var(--soft); min-height: 48px; }
[data-days] .days-dates input[aria-invalid="true"] { box-shadow: inset 0 0 0 2px var(--ink); }
[data-days] .days-card .row .pill { flex: 1 1 auto; }
[data-days] .days-hist summary { cursor: pointer; font-size: 14px; font-weight: 600; color: var(--body); padding: 6px; }
[data-days] .days-hist .muted { margin: 4px 6px; font-size: 14px; }
[data-days] .days-note { margin: 0; font-size: 14px; padding: 0 4px; }
[data-days] .days-show { background: var(--canvas); border-radius: 12px; padding: 24px 16px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 8px; min-height: 60vh; }
[data-days] .days-show-name { font-size: clamp(26px, 5vw, 56px); font-weight: 800; letter-spacing: -0.02em; line-height: 1.1; max-width: 100%; overflow-wrap: anywhere; }
[data-days] .days-show-n { font-size: clamp(140px, min(38vw, 48vh), 420px); }
[data-days] .days-show-n[data-len="m"] { font-size: clamp(110px, min(28vw, 40vh), 340px); }
[data-days] .days-show-n[data-len="l"] { font-size: clamp(80px, min(20vw, 32vh), 260px); }
[data-days] .days-show-unit { font-size: clamp(24px, 5vw, 48px); font-weight: 700; color: var(--body); }
[data-days] .days-show-alt { font-size: clamp(16px, 2.6vw, 26px); color: var(--body); }
[data-days] .days-show-rec { font-size: clamp(14px, 2vw, 20px); }
body.is-focus [data-days] .days-show { flex: 1; }
[data-days] .days-pick { margin-bottom: 12px; max-width: 360px; }
[data-days] .days-pick select { background: var(--canvas); min-height: 48px; }
[data-days] .days-axis { margin: 0 0 8px; font-size: 14px; font-weight: 600; color: var(--body); }
/* printed sign and list (inside #ct-print) */
.days-sign { text-align: center; padding-top: 0.4in; color: #000; }
.days-sign-n { font-size: 300pt; font-weight: 900; line-height: 0.95; letter-spacing: -0.04em; font-variant-numeric: tabular-nums; }
.days-sign-n[data-len="m"] { font-size: 220pt; }
.days-sign-n[data-len="l"] { font-size: 160pt; }
.days-sign-n[data-len="xl"] { font-size: 110pt; }
.days-sign-name { font-size: 42pt; font-weight: 800; text-transform: uppercase; line-height: 1.1; margin: 14pt 0 28pt; overflow-wrap: anywhere; }
.days-sign-meta { font-size: 22pt; margin: 6pt 0; }
.days-sheet-note { font-size: 10pt; margin: 0 0 10px; }
@media (max-width: 520px) {
  [data-days] .days-list { grid-template-columns: 1fr; }
  [data-days] .days-dates input { padding: 10px 8px; font-size: 15px; }
}