/* A Seder at a glance: stacked bar plus who came when. */
.seder-chart { --sc-present: #39a865; --sc-late: #e3a21a; --sc-absent: #d6483b; --sc-none: #d9dee5; text-align: left; }
.sc-bar { display: flex; height: 18px; border-radius: 6px; overflow: hidden; background: var(--sc-none); }
.sc-seg { display: grid; place-items: center; min-width: 4px; color: #fff; font: 700 10.5px/1 Inter, sans-serif; }
.sc-seg.present { background: var(--sc-present); }
.sc-seg.late { background: var(--sc-late); }
.sc-seg.absent { background: var(--sc-absent); }
.sc-seg.none { background: var(--sc-none); color: #5b6573; }
.sc-counts { margin: 6px 0 0; color: var(--muted, #656e78); font-size: 12px; }
.sc-counts b { font-weight: 700; }
.sc-counts b.present { color: #1f7a45; } .sc-counts b.late { color: #9a6a00; } .sc-counts b.absent { color: #b83a2e; } .sc-counts b.none { color: #5b6573; }
.sc-lines { margin-top: 8px; display: grid; gap: 5px; }
.sc-line { display: grid; grid-template-columns: 118px 1fr; gap: 8px; align-items: start; font-size: 12px; }
.sc-label { color: #5b6573; font-weight: 600; padding-top: 2px; }
.sc-line.present .sc-label { color: #1f7a45; } .sc-line.late .sc-label { color: #9a6a00; } .sc-line.absent .sc-label { color: #b83a2e; }
.sc-chips { display: flex; flex-wrap: wrap; gap: 3px; }
.sc-chip { padding: 1px 7px; border-radius: 999px; background: #f1f4f7; color: #2d3744; font-size: 12px; line-height: 1.6; white-space: nowrap; }
.sc-line.present .sc-chip { background: #e3f6ea; }
.sc-line.late .sc-chip { background: #fff3d6; }
.sc-line.absent .sc-chip { background: #fde8e4; }
.sc-chip.excused { opacity: .55; text-decoration: line-through; text-decoration-color: #b83a2e66; }
.sc-more { padding: 1px 7px; border: 0; border-radius: 999px; background: none; color: var(--blue, #1667d9); font: 600 12px/1.6 Inter, sans-serif; cursor: pointer; }
.seder-chart.compact .sc-line { grid-template-columns: 104px 1fr; }
@media (max-width: 600px) { .sc-line, .seder-chart.compact .sc-line { grid-template-columns: 1fr; gap: 2px; } }