/* Rhythm detail shares the application's existing theme tokens. */
#screen-analytics { padding: 20px 16px 120px; max-width: 760px; margin-inline: auto; }
.analytics-title { margin: 18px 0 6px; font-size: 28px; }
.analytics-note { font-size: 12px; line-height: 1.6; color: var(--text-secondary); margin: 10px 0; }
.analytics-periods { display: flex; gap: 8px; margin: 20px 0; }
.analytics-periods button { flex: 1; min-height: 44px; border: 1px solid var(--border); border-radius: 24px; background: var(--bg-card); color: var(--text-primary); font: inherit; }
.analytics-periods button[aria-pressed="true"] { background: var(--cta, #33513F); color: white; border-color: transparent; }
.analytics-card { padding: 20px; margin-bottom: 16px; }
.analytics-card h2 { font-size: 16px; margin: 0 0 16px; }
.analytics-summary { display: flex; gap: 20px; align-items: center; flex-wrap: wrap; }
#analytics-rate { font-size: 44px; letter-spacing: -2px; font-weight: 600; }
#analytics-trend { display: block; font-size: 12px; margin-top: 6px; color: var(--text-secondary); }
.analytics-weekdays { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); gap: 8px; }
.analytics-day { text-align: center; display: flex; flex-direction: column; gap: 8px; font-size: 12px; }
.analytics-day strong { font-size: 12px; }
.analytics-day small { color: var(--text-secondary); }
.analytics-track { height: 100px; display: flex; align-items: flex-end; background: var(--bg-surface-light, #EFEAD8); border-radius: 6px; overflow: hidden; }
.analytics-track span { width: 100%; background: var(--cta, #33513F); border-radius: 6px; }
.analytics-habit { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: 64px; padding: 14px 0; background: none; border: 0; border-bottom: 1px solid var(--border); font: inherit; color: var(--text-primary); text-align: left; cursor: pointer; }
.analytics-habit > span:first-child { min-width: 0; overflow-wrap: anywhere; }
.analytics-habit strong { font-size: 14px; }
.analytics-habit small { display: block; margin-top: 5px; font-size: 11px; color: var(--text-secondary); }
.analytics-habit-result { flex-shrink: 0; font-size: 12px; }
.analytics-axis { display: flex; justify-content: space-between; font-size: 11px; color: var(--text-secondary); margin-top: 8px; }
#profile-open-analytics { width: 100%; min-height: 44px; margin-top: 12px; }
.analytics-counts { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; padding: 18px 12px; }
.analytics-counts .profile-stat-number { font-size: 22px; }
.analytics-counts .profile-stat-label { font-size: 10px; text-align: center; line-height: 1.5; }
.rhythm-heatmap-cell:focus-visible, .analytics-habit:focus-visible, .analytics-periods button:focus-visible { outline: 2px solid var(--cta, #33513F); outline-offset: 3px; }
.rhythm-heatmap-cell { border: 0; padding: 0; font: inherit; }
#analytics-heatmap { width: 100%; }
@media (max-width: 360px) { .analytics-card { padding: 14px; } .analytics-weekdays { gap: 5px; } .analytics-habit { flex-wrap: wrap; } }
#analytics-heatmap { grid-template-columns: repeat(14, minmax(0, 1fr)); }
#analytics-heatmap .rhythm-heatmap-cell { width: 100%; height: auto; aspect-ratio: 1; }
.analytics-recorded-cell { box-shadow: inset 0 0 0 1px var(--cta, #33513F); }
#screen-profile .profile-rhythm-body { display: grid; grid-template-columns: minmax(86px, .7fr) minmax(0, 1fr); gap: 12px; }
#screen-profile .profile-consistency-sub { white-space: normal; }
#profile-7row-heatmap { grid-template-columns: repeat(14, minmax(0, 1fr)); padding: 0; gap: 3px; }
#profile-7row-heatmap .rhythm-heatmap-cell { width: 100%; height: auto; aspect-ratio: 1; }
#analytics-heatmap .rhythm-heatmap-cell::before { display: none; }
@media (max-width: 360px) {
    #screen-profile .profile-rhythm-body { grid-template-columns: 1fr; }
    #screen-profile .profile-consistency-block { text-align: left; }
}
#screen-profile .profile-heatmap-wrapper { display: block; min-width: 0; width: 100%; }
#profile-7row-heatmap { width: 100%; }
.analytics-list-header { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 6px; }
.analytics-list-header h2 { margin: 0; }
.analytics-sort-control { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; min-width: 0; max-width: 100%; }
.analytics-sort-control label { font-size: 12px; color: var(--text-secondary); }
#analytics-sort { min-height: 44px; min-width: 0; max-width: 100%; padding: 8px; border: 1px solid var(--border); border-radius: 10px; font: inherit; font-size: 12px; background: var(--bg-card, #fff); color: var(--text-primary); }
#analytics-sort:focus-visible { outline: 2px solid var(--cta, #33513F); outline-offset: 3px; }