.cal-today {
margin-block-end: var(--space-lg);
}
.cal-today-date {
margin: 0;
font-family: var(--font-serif);
font-size: var(--font-size-lg);
line-height: var(--leading-snug);
color: var(--color-text);
}
.cal-today-now {
margin: var(--space-2xs) 0 0;
color: var(--color-text);
}
.cal-today-next {
margin: var(--space-2xs) 0 0;
font-size: var(--font-size-sm);
color: var(--color-text-muted);
}
.cal-row {
--dst-row-cols: 3.25rem minmax(0, 1fr) auto;
--dst-row-cols-narrow: 2.75rem minmax(0, 1fr);
align-items: start;
row-gap: var(--space-2xs);
}
.cal-date {
grid-row: 1 / span 4;
display: flex;
flex-direction: column;
align-items: center;
line-height: 1.1;
color: var(--color-text);
}
.cal-dow {
font-size: var(--font-size-2xs);
color: var(--dst-ink-3);
}
.cal-dom {
font-family: var(--font-display);
font-size: var(--font-size-xl);
font-weight: var(--font-weight-bold);
font-variant-numeric: tabular-nums;
}
.cal-name {
margin: 0;
min-inline-size: 0;
font-size: inherit;
font-weight: inherit;
line-height: var(--leading-snug);
}
.cal-aka {
margin-inline-start: var(--space-xs);
font-size: var(--font-size-sm);
color: var(--color-text-muted);
}
.cal-flag {
margin-inline-start: var(--space-xs);
font-size: var(--font-size-xs);
font-weight: var(--font-weight-medium);
color: var(--dst-hue);
white-space: nowrap;
}
.cal-entry.is-now > .cal-row {
background: color-mix(in srgb, var(--dst-hue) 5%, transparent);
}
.cal-when,
.cal-note,
.cal-refs {
grid-column: 2 / -1;
margin: 0;
}
.cal-when {
font-size: var(--font-size-xs);
color: var(--dst-ink-3);
font-variant-numeric: tabular-nums;
}
.cal-note {
max-inline-size: 42em;
font-size: var(--font-size-sm);
line-height: var(--leading-normal);
color: var(--color-text-muted);
}
.cal-refs {
display: flex;
flex-wrap: wrap;
gap: 0 var(--space-md);
font-size: var(--font-size-xs);
}
.cal-refs a {
color: var(--dst-hue);
text-decoration: none;
}
.cal-refs a:hover {
text-decoration: underline;
text-underline-offset: 3px;
}
.cal-notes {
max-inline-size: 42em;
margin-block-start: var(--space-xl);
padding-block-start: var(--space-md);
border-block-start: 1px solid var(--dst-seam);
font-size: var(--font-size-xs);
line-height: var(--leading-normal);
color: var(--dst-ink-3);
}
.cal-notes p {
margin: 0;
}
@media (width <= 640px) {
.cal-row .dst-row-meta {
grid-column: 2;
order: 0;
}
}