.daily-focus { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: .75rem 1rem; margin: 0 0 1.5rem; padding: 1.25rem; border: 1px solid var(--ui-border); border-radius: 1rem; background: var(--ui-surface); color: var(--ui-text); }
.daily-focus h2 { margin: 0 0 .4rem; font-size: 1.25rem; color: var(--ui-text); }
.daily-focus p { color: var(--ui-muted); margin: 0; }
.daily-shortcuts { display: flex; flex-wrap: wrap; align-content: start; gap: .5rem; }
.daily-shortcuts a, .daily-focus button, .quick-water-actions button, #waterUndo, .water-refresh { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: .6rem .8rem; font: inherit; color: var(--ui-accent); background: var(--ui-surface); border: 1px solid var(--ui-border); border-radius: .5rem; text-decoration: none; cursor: pointer; white-space: normal; }
.water-refresh { width: 100%; margin-bottom: .5rem; }
.water-refresh[hidden] { display: none; }
.water-refresh:hover, .water-refresh:active { background: var(--ui-raised); }
.water-refresh:disabled { opacity: .55; cursor: not-allowed; }
.daily-shortcuts a:hover, .daily-focus button:hover, .quick-water-actions button:hover, #waterUndo:hover { background: var(--ui-raised); border-color: var(--ui-focus); }
.daily-shortcuts a:active, .daily-focus button:active, .quick-water-actions button:active, #waterUndo:active { background: var(--ui-raised); }
.daily-status { min-height: 2.6em; overflow-wrap: anywhere; color: var(--ui-muted); font-size: .9rem; }
.metric-schedule-link { display: flex; align-items: center; justify-content: center; gap: .5rem; width: 100%; min-height: 44px; margin-top: .75rem; padding: .65rem .8rem; border: 1px solid var(--ui-border); border-radius: .5rem; background: var(--ui-surface); color: var(--ui-accent); text-align: center; text-decoration: none; font-weight: 600; cursor: pointer; }
.metric-schedule-link:hover, .metric-schedule-link:active { background: var(--ui-raised); border-color: var(--ui-focus); }
.metric-schedule-link:focus-visible { outline: 3px solid var(--ui-focus); outline-offset: 3px; }
.metric-schedule-link .ui-icon { flex: 0 0 20px; width: 20px; height: 20px; }
.metric-schedule-link span { min-width: 0; overflow-wrap: anywhere; }
.quick-water-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
.quick-water-actions button { flex: 1 1 100px; font-weight: 600; }
#waterUndo { width: 100%; margin-bottom: .5rem; }
.daily-focus button:disabled, .quick-water-actions button:disabled, #waterUndo:disabled { opacity: .55; cursor: not-allowed; }
#waterCard, #sleep-panel { scroll-margin-top: 6rem; scroll-margin-bottom: calc(var(--mobile-nav-height,0px) + 1rem); }
/* O dialog é um painel nativo com foco contido, não o overlay legado de tela inteira. */
.metric-dialog { position: fixed; inset: 0; width: min(480px,calc(100% - 1.5rem)); height: fit-content; max-height: calc(100dvh - 2rem); margin: auto; padding: 0; overflow: auto; border: 1px solid var(--ui-border); border-radius: 1rem; background: var(--ui-surface); color: var(--ui-text); z-index: 100; }
.metric-dialog::backdrop { background: rgb(0 0 0 / 45%); }
.metric-dialog:not([open]) { display: none; }
.metric-dialog .modal-content { width: 100%; max-width: none; margin: 0; padding: 1.25rem; box-shadow: none; background: var(--ui-surface); color: var(--ui-text); }
.metric-dialog .close-btn { float: right; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid var(--ui-border); border-radius: .5rem; background: var(--ui-surface); color: var(--ui-text); cursor: pointer; }
.metric-dialog .close-btn:hover { background: var(--ui-raised); }
.metric-dialog [aria-invalid=true] { border-color: var(--ui-danger); }
@media (max-width: 720px) { .daily-focus { grid-template-columns: minmax(0,1fr); } .daily-shortcuts a { flex: 1 1 120px; } }

/* O controle de sono pertence ao Início, junto às métricas, não aos relatórios. */
.sleep-panel--daily { max-width: none; margin: 1.5rem 0; padding: 1.25rem; }
.sleep-overview { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 1rem 2rem; }
.sleep-panel--daily h2 { display: flex; align-items: center; gap: .5rem; font-size: 1.25rem; }
.sleep-panel--daily p { margin: .4rem 0; color: var(--ui-muted); overflow-wrap: anywhere; }
.sleep-panel--daily .sleep-clock { color: var(--ui-text); font-size: 1.5rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.sleep-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1rem 0 .5rem; }
.sleep-actions button { margin: 0; }
.sleep-options { border-top: 1px solid var(--ui-border); margin-top: 1rem; padding-top: .5rem; }
.sleep-options summary { min-height: 44px; padding: .6rem 0; cursor: pointer; color: var(--ui-accent); font-weight: 600; }
.sleep-options .sleep-controls { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); align-items: center; gap: 1rem; margin: .5rem 0; }
.sleep-panel--daily button:hover:not(:disabled) { filter: brightness(1.1); }
.sleep-panel--daily button:active:not(:disabled) { filter: brightness(.95); }
@media (max-width: 720px) {
    .sleep-overview, .sleep-options .sleep-controls { grid-template-columns: minmax(0,1fr); }
    .sleep-actions button { flex: 1 1 160px; }
}