.attendance-heading h1 { margin-top: 8px; }
.attendance-heading > .subtle { margin: 0 0 18px; }
.attendance-start,
.attendance-success { padding: 14px; border: 1px solid var(--ate-line); border-radius: 6px; background: #f8faff; }
.attendance-start h2,
.attendance-success h2 { margin: 9px 0 6px; font-size: 19px; }
.attendance-success > p { margin: 0 0 12px; color: var(--ate-muted); font-size: 13px; }
.attendance-list { padding: 0; overflow: hidden; }
.attendance-list > h2 { margin: 0; padding: 16px 16px 8px; }
.attendance-list > .subtle { padding: 0 16px 16px; }
.attendance-mark { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 11px; align-items: center; padding: 11px 16px; border-top: 1px solid var(--ate-line); }
.attendance-mark img { width: 56px; height: 56px; border: 1px solid var(--ate-line); border-radius: 50%; object-fit: cover; background: #edf1f6; }
.attendance-mark strong,
.attendance-mark small { display: block; }
.attendance-mark strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; }
.attendance-mark small { margin-top: 3px; color: var(--ate-muted); font-size: 12px; }
.attendance-photo-unavailable img { opacity: .45; }