UI: Touch-Sichtbarkeit der Hover-Aktionen

Edit/Delete/Start/Zeit-Buttons waren nur per group-hover sichtbar (opacity-0)
und damit auf Touch-Geraeten unerreichbar. Jetzt mobil dauerhaft sichtbar, ab
sm (Desktop) weiterhin Hover-Reveal.

- TimelineSection (Bearbeiten/Loeschen einer Zeit-Zeile)
- heute (Task starten/fortsetzen, Zeit nachtragen)
- reflexion (ToDo-Titel bearbeiten)

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

apps/web/src/components/time/TimelineSection.tsx

@@ -271,7 +271,7 @@ function TimelineRow({
         {formatDuration(duration)}
       </div>
       {!isRunning && (
-        <div className="flex shrink-0 gap-1 opacity-0 group-hover:opacity-100">
+        <div className="flex shrink-0 gap-1 opacity-100 sm:opacity-0 sm:group-hover:opacity-100">
           <button
             type="button"
             onClick={onEdit}

apps/web/src/routes/heute.tsx

@@ -242,7 +242,7 @@ function TodoRow({
           className={
             isRunningHere
               ? 'inline-flex h-7 items-center gap-1 rounded-full bg-[var(--color-ampel-red-bg)] px-2 text-xs font-medium text-[var(--color-ampel-red-fg)]'
-              : 'inline-flex h-7 w-7 items-center justify-center rounded-full text-[var(--color-ink-muted)] opacity-0 hover:bg-black/5 hover:text-[var(--color-ink)] group-hover:opacity-100'
+              : 'inline-flex h-7 w-7 items-center justify-center rounded-full text-[var(--color-ink-muted)] opacity-100 hover:bg-black/5 hover:text-[var(--color-ink)] sm:opacity-0 sm:group-hover:opacity-100'
           }
         >
           {isRunningHere ? (
@@ -264,7 +264,7 @@ function TodoRow({
           onClick={() => setRetroOpen(true)}
           aria-label="Zeit nachtragen"
           title="Zeit nachtragen"
-          className="inline-flex h-7 w-7 items-center justify-center rounded-full text-[var(--color-ink-muted)] opacity-0 hover:bg-black/5 hover:text-[var(--color-ink)] group-hover:opacity-100"
+          className="inline-flex h-7 w-7 items-center justify-center rounded-full text-[var(--color-ink-muted)] opacity-100 hover:bg-black/5 hover:text-[var(--color-ink)] sm:opacity-0 sm:group-hover:opacity-100"
         >
           <Clock size={12} />
         </button>

apps/web/src/routes/reflexion.tsx

@@ -391,7 +391,7 @@ function EditableTodoTitle({ id, title }: { id: string; title: string }) {
       <span>{title}</span>
       <Pencil
         size={12}
-        className="text-[var(--color-ink-faint)] opacity-0 transition-opacity group-hover:opacity-100"
+        className="text-[var(--color-ink-faint)] opacity-100 transition-opacity sm:opacity-0 sm:group-hover:opacity-100"
       />
     </button>
   );