/* PROMA – Tokens aus dem Handoff (verbindliche Referenz) + noa-A11y-Fixes.
   Layout-Feinheiten sitzen als Inline-Styles im Renderer, um die Pixel-Treue
   des Handoffs zu halten; hier nur Tokens, Basis und globale Zustände. */
:root{
  --bg0:#F7F7F8;--bg1:#ECECEE;
  --surface:rgba(255,255,255,.62);--surface-strong:rgba(255,255,255,.82);
  --text:#1D1D1F;
  --muted:rgba(60,60,67,.78);           /* noa #7: von .62 -> .78 fuer Kontrast */
  --line:rgba(0,0,0,.07);--edge:rgba(255,255,255,.55);--hover:rgba(0,0,0,.04);
  --accent:#007AFF;--accent-soft:rgba(0,122,255,.1);
  --warn:#A05A00;--warn-soft:rgba(255,149,0,.12);
  --danger:#FF3B30;--ok:#34C759;
  --prio-hoch:#FF3B30;--prio-mittel:#FF9500;--prio-niedrig:#AEAEB2;
  --glass:saturate(180%) blur(20px);
  --shadow:0 0 0 .5px rgba(0,0,0,.04),0 1px 2px rgba(0,0,0,.05),0 4px 10px rgba(0,0,0,.05);
  --cardpad:12px 14px;
}
body.dark{
  --bg0:#1A1A1C;--bg1:#0E0E10;
  --surface:rgba(28,28,30,.6);--surface-strong:rgba(38,38,40,.78);
  --text:#F5F5F7;--muted:rgba(235,235,245,.7);
  --line:rgba(255,255,255,.1);--edge:rgba(255,255,255,.12);--hover:rgba(255,255,255,.06);
  --accent:#0A84FF;--accent-soft:rgba(10,132,255,.16);
  --warn:#FFB340;--warn-soft:rgba(255,159,10,.14);
  --danger:#FF453A;--ok:#30D158;
  --prio-hoch:#FF453A;--prio-mittel:#FF9F0A;--prio-niedrig:#636366;
  --shadow:0 0 0 .5px rgba(0,0,0,.28),0 1px 2px rgba(0,0,0,.3),0 5px 12px rgba(0,0,0,.32);
}
*{box-sizing:border-box}
body{
  margin:0;background:linear-gradient(180deg,var(--bg0),var(--bg1)) fixed;color:var(--text);
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;transition:background .25s;
  min-height:100vh;min-height:100dvh;
}
/* Mobil: 16px verhindert das automatische Reinzoomen von iOS beim Fokus
   (Hauptursache fuer springendes Layout und verschobenes Spacing). */
@media (max-width: 760px){
  input, textarea, select { font-size:16px; }
}
a{color:var(--accent)}a:hover{opacity:.75}
input,textarea,select,button{font-family:inherit;color:inherit}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}
@keyframes toastin{from{opacity:0;transform:translate(-50%,10px)}to{opacity:1;transform:translate(-50%,0)}}

/* noa #9: sichtbarer Fokus fuer Tastaturnutzung */
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}
button,[role=button]{-webkit-tap-highlight-color:transparent}

/* noa #11: Bewegungen respektieren die Systempraeferenz */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}

/* Toast (noa #1: ehrliches Erfolg-/Fehler-Feedback) */
#toast{
  position:fixed;left:50%;bottom:26px;transform:translateX(-50%);z-index:80;
  background:var(--surface-strong);backdrop-filter:var(--glass);-webkit-backdrop-filter:var(--glass);
  border:1px solid var(--edge);box-shadow:var(--shadow);border-radius:999px;
  padding:10px 18px;font-size:13px;font-weight:500;display:none;animation:toastin .18s ease;max-width:90vw;
}
#toast.err{color:var(--danger)}
#toast.show{display:block}
