/* Stabilitäts- und Darstellungs-Korrekturen */
[hidden]{display:none!important}
.nav{text-decoration:none}
.section-head a{font-size:12px;color:var(--muted);text-decoration:none}

/* Das native Dialog-Element darf keine eigene Fläche oder Umrandung zeigen.
   Nur die .modal darin schwebt als Karte über dem Inhalt. */
#taskDialog,#accountDialog{
  border:0;
  padding:0;
  margin:auto;
  background:transparent;
  overflow:visible;
  max-width:calc(100vw - 32px);
  color:inherit;
}
#taskDialog::backdrop,#accountDialog::backdrop{
  background:rgba(24,34,48,.22);
  -webkit-backdrop-filter:blur(4px);
  backdrop-filter:blur(4px);
}
#taskDialog .modal,#accountDialog .modal{margin:0}
.timer-hint{display:block;margin-top:14px;color:var(--muted);font-size:11px}
.session-history{margin-top:16px}
.session-row{display:flex;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid var(--line);font-size:13px}
.session-row:last-child{border-bottom:0}.session-row>span{color:var(--accent)}
.session-row div{display:grid;gap:3px;min-width:0;flex:1}.session-row b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.session-row small{color:var(--muted);font-size:11px}.session-row strong{font-size:14px}
.focus-task-select{display:block;max-width:360px;margin:20px auto 0;text-align:left;color:var(--muted);font-size:10px;font-weight:800;letter-spacing:.1em}.focus-task-select select{margin-top:7px;font-size:13px;letter-spacing:0;font-weight:500}
.task-focus-history{margin-top:0;margin-bottom:24px}

/* Statistik: Karten und Diagramm bewusst voneinander trennen. */
#stats .chart-card{margin-bottom:22px}
#stats .summary-grid{max-width:none;margin:0 0 24px;gap:18px}
#stats .summary-grid .stat{min-height:118px}
#stats .session-history{margin-top:0;margin-bottom:24px}
@media(min-width:720px){#stats .summary-grid{grid-template-columns:repeat(4,1fr);gap:20px}}

/* Kurzer, organischer „Plör“-Ladeeffekt statt eines statischen Logos. */
.splash{transition:opacity .18s ease,visibility .18s ease}
.splash.gone{visibility:hidden}
.splash-blob{position:relative;width:72px;height:62px;filter:blur(.2px);isolation:isolate}
.splash-blob i{position:absolute;display:block;width:37px;height:37px;border-radius:52% 48% 44% 56%;background:var(--accent);mix-blend-mode:multiply;animation:plop 1s ease-in-out infinite}
.splash-blob i:nth-child(1){left:4px;top:12px;background:#ef91b4}.splash-blob i:nth-child(2){right:4px;top:10px;background:#9dbaf5;animation-delay:-.34s}.splash-blob i:nth-child(3){left:20px;bottom:0;background:#94d5be;animation-delay:-.68s}
@keyframes plop{0%,100%{transform:scale(.8) translateY(3px);border-radius:52% 48% 44% 56%}50%{transform:scale(1.12) translateY(-5px);border-radius:42% 58% 58% 42%}}
@media(prefers-reduced-motion:reduce){.splash-blob i{animation:none}}
.auth-card small{min-height:18px}
.auth-card .primary:disabled{opacity:.65;cursor:wait}
/* Die höhere Selektorspezifität von .view.active würde sonst flex überschreiben. */
.view.focus-view.active{display:flex}
/* Wird vom Skript ausschließlich auf der Aufgaben-Seite eingeblendet. */
#fab{display:none}
body.dark .mode.active{background:#273345;color:var(--ink)}