/* /alarm-clock - the large clock face, weekday toggles and the ringing panel. */
#alcApp .alc-clock { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 18px 12px; margin-bottom: 12px; border: 1px solid var(--bm-line); border-radius: 16px; background: var(--bm-surface); }
#alcApp .alc-clock span { font-size: clamp(2.6rem, 11vw, 4.4rem); font-weight: 800; line-height: 1; color: var(--bm-ink); font-variant-numeric: tabular-nums; letter-spacing: .02em; }
#alcApp .alc-clock small { color: var(--bm-ink-2); font-weight: 600; }
#alcApp .alc-days { display: flex; flex-wrap: wrap; gap: 6px; }
#alcApp .alc-days label { position: relative; margin: 0; }
#alcApp .alc-days input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
#alcApp .alc-days span { display: inline-block; min-width: 46px; padding: 8px 10px; text-align: center; border: 1px solid var(--bm-line); border-radius: 10px; font-weight: 700; font-size: .86rem; color: var(--bm-ink-2); background: var(--bm-surface); }
#alcApp .alc-days input:checked + span { background: var(--bm-accent-soft); border-color: var(--bm-accent-strong); color: var(--bm-accent-strong); }
#alcApp .alc-days input:focus-visible + span { outline: 3px solid var(--bm-accent-ring); outline-offset: 1px; }
#alcApp .alc-ring { margin-bottom: 12px; padding: 16px; border: 2px solid var(--ic-bad); border-radius: 16px; background: var(--ic-bad-soft); }
#alcApp .alc-ring-title { margin: 0 0 4px; font-size: 1.4rem; font-weight: 800; color: var(--bm-ink); }
#alcApp .alc-item { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding: 10px 0; border-top: 1px solid var(--bm-line-2, var(--bm-line)); }
#alcApp .alc-item:first-child { border-top: 0; }
#alcApp .alc-item-time { font-size: 1.5rem; font-weight: 800; font-variant-numeric: tabular-nums; color: var(--bm-ink); }
#alcApp .alc-item.is-off .alc-item-time { color: var(--bm-ink-3); }
#alcApp .alc-item-meta { flex: 1 1 140px; min-width: 0; color: var(--bm-ink-2); font-size: .9rem; overflow-wrap: anywhere; }
#alcApp .alc-item-meta strong { display: block; color: var(--bm-ink); }
@media (prefers-reduced-motion: no-preference) {
    #alcApp .alc-ring:not([hidden]) { animation: alc-pulse 1s ease-in-out infinite alternate; }
    @keyframes alc-pulse { from { box-shadow: 0 0 0 0 var(--ic-bad); } to { box-shadow: 0 0 0 10px transparent; } }
}
@media (forced-colors: active) {
    #alcApp .alc-days span, #alcApp .alc-ring, #alcApp .alc-clock { border: 1px solid CanvasText; }
    #alcApp .alc-days input:checked + span { outline: 2px solid Highlight; }
}