/* tokens.css — Farb-Tokens (hell/dunkel) für alle Seiten.
   Neutrale Graphit-Skala für Flächen, Linien und Text; Blau (aus dem Logo)
   ist der einzige Akzent. Kräftig wird nur das Passwort selbst. */

:root, [data-theme="light"] {
  --bg: #fafafa;
  --card: #ffffff;
  --raised: #f4f4f5;
  --line: rgba(23, 23, 23, .08);
  --line-strong: rgba(23, 23, 23, .14);
  --text: #171717;
  --text-2: #525252;
  --muted: #737373;

  --accent: #2563eb;
  --accent-hover: #1d4ed8;
  --accent-ink: #1d4ed8;
  --on-accent: #ffffff;
  --ring: rgba(37, 99, 235, .28);

  --pw-bg: #18181b;
  --pw-text: #fafafa;
  --pw-digit: #7cb2ff;
  --digit: #2563eb;
  --track: rgba(23, 23, 23, .08);

  --good: #16a34a;
  --bad: #dc2626;
  --warn: #b45309;
  --good-tint: rgba(22, 163, 74, .07);
  --bad-tint: rgba(220, 38, 38, .06);
  --warn-tint: rgba(217, 119, 6, .07);
  --good-line: rgba(22, 163, 74, .22);
  --bad-line: rgba(220, 38, 38, .22);
  --warn-line: rgba(217, 119, 6, .26);

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);
  --shadow-float: 0 8px 24px rgba(0, 0, 0, .08);
  --scrim: rgba(23, 23, 23, .32);
}

[data-theme="dark"] {
  --bg: #141415;
  --card: #19191b;
  --raised: #232325;
  --line: rgba(237, 237, 237, .08);
  --line-strong: rgba(237, 237, 237, .14);
  --text: #ededed;
  --text-2: #a1a1a6;
  --muted: #85858b;

  --accent: #ededed;
  --accent-hover: #ffffff;
  --accent-ink: #7cb2ff;
  --on-accent: #171717;
  --ring: rgba(124, 178, 255, .35);

  --pw-bg: #0f0f10;
  --pw-text: #ededed;
  --pw-digit: #7cb2ff;
  --digit: #7cb2ff;
  --track: rgba(237, 237, 237, .08);

  --good: #4cc38a;
  --bad: #e5484d;
  --warn: #e0a23a;
  --good-tint: rgba(76, 195, 138, .07);
  --bad-tint: rgba(229, 72, 77, .08);
  --warn-tint: rgba(224, 162, 58, .07);
  --good-line: rgba(76, 195, 138, .22);
  --bad-line: rgba(229, 72, 77, .26);
  --warn-line: rgba(224, 162, 58, .26);

  --shadow-sm: none;
  --shadow-float: 0 12px 32px rgba(0, 0, 0, .5);
  --scrim: rgba(0, 0, 0, .6);
}

* { box-sizing: border-box; }
img { max-width: 100%; }