/* 1:1 Stil-Uebernahme von login.html (bewusst self-contained, oeffentliche
       Seite ohne base.html) — nur reduziert auf das, was die Forgot-Seite braucht. */
    :root {
      color-scheme: dark;
      --bg: #050807; --panel-2: #111f1a; --line: rgba(62, 211, 155, .28);
      --text: #eef8f3; --muted: #91a69b; --accent: #39d99a; --danger: #ff5d65;
    }
    * { box-sizing: border-box; }
    body {
      margin: 0; min-height: 100vh; display: grid; place-items: center; padding: 24px;
      font: 15px/1.45 Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      color: var(--text);
      background:
        radial-gradient(circle at 20% 10%, rgba(57, 217, 154, .14), transparent 28%),
        radial-gradient(circle at 86% 20%, rgba(79, 140, 255, .13), transparent 26%),
        linear-gradient(145deg, #050807, #07100d 54%, #050807);
    }
    .card {
      width: min(420px, 100%); border: 1px solid var(--line); border-radius: 18px;
      background: linear-gradient(180deg, rgba(17, 31, 26, .96), rgba(9, 16, 14, .98));
      box-shadow: 0 28px 90px rgba(0, 0, 0, .48); padding: 30px;
    }
    .brand { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; }
    .mark { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center;
            overflow: hidden; background: #070b10; box-shadow: 0 10px 30px rgba(57, 217, 154, .24); }
    .mark img { width: 100%; height: 100%; object-fit: cover; display: block; }
    h1 { margin: 0; font-size: 22px; line-height: 1.1; }
    .sub { margin: 4px 0 0; color: var(--muted); font-size: 13px; }
    .hint { margin: 0 0 16px; color: var(--muted); font-size: 13px; }
    .note {
      margin: 0 0 16px; border: 1px solid rgba(255, 93, 101, .35); border-radius: 10px;
      padding: 10px 12px; color: #ffb1b5; background: rgba(255, 93, 101, .11); font-size: 13px;
    }
    .note.ok { background: rgba(34,197,94,.12); border-color: #14532d; color: #22c55e; }
    form { display: grid; gap: 15px; }
    label { display: block; margin-bottom: 7px; color: var(--muted); font-size: 12px;
            font-weight: 760; text-transform: uppercase; letter-spacing: .08em; }
    input[type="text"] {
      width: 100%; min-height: 46px; border: 1px solid rgba(145, 166, 155, .3);
      border-radius: 10px; background: var(--panel-2); color: var(--text); padding: 0 12px;
      font: inherit; outline: none;
    }
    input:focus { border-color: rgba(57, 217, 154, .78); box-shadow: 0 0 0 3px rgba(57, 217, 154, .13); }
    button[type="submit"] {
      min-height: 48px; border: 0; border-radius: 10px; color: #06110d;
      background: linear-gradient(135deg, var(--accent), #7ee7bd); font: inherit;
      font-weight: 850; cursor: pointer; box-shadow: 0 16px 34px rgba(57, 217, 154, .22);
    }
    button[type="submit"]:hover { filter: brightness(1.04); }
    .foot { margin-top: 18px; color: var(--muted); font-size: 12px; text-align: center; }
    .foot a { color: var(--accent); text-decoration: none; }