.cl { display: grid; gap: 22px; max-width: 980px; }
.cl-day { display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: 20px; padding: 22px; background: var(--surface); border: 2px solid var(--ink); border-radius: 18px; box-shadow: 4px 4px 0 var(--shadow); }
.cl-big { background: var(--tint); }
.cl-date time { font: 800 1.3rem/1.05 var(--display); font-variation-settings: "wdth" 84; font-stretch: 84%; letter-spacing: -.02em; }
.cl-list h2 { margin: 0 0 10px; font: 800 1.6rem/1 var(--display); font-variation-settings: "wdth" 84; font-stretch: 84%; letter-spacing: -.03em; }
.cl-list ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.cl-list li { position: relative; padding-left: 22px; color: var(--brown); }
.cl-list li::before { content: ""; position: absolute; left: 0; top: .5em; width: 10px; height: 10px; border-radius: 50%; background: var(--brand); border: 2px solid var(--fixed-ink); }
.cl-list li b { color: var(--ink); }
@media (max-width: 700px) { .cl-day { grid-template-columns: minmax(0, 1fr); gap: 10px; padding: 18px 16px; } }