/* ---------------------------------------------------------------------------
   ClaimScan · gemeinsame Styles der Anmelde-Seiten
   (Login, Passwort vergessen, Passwort neu, Einladung)
   EHNES-Design: Fraunces + Mona Sans, Petrol/Mint.
   --------------------------------------------------------------------------- */
:root{
  --petrol-950:#061013;--petrol-900:#0C1E21;--petrol-850:#10262A;--teal-ghost:#1C464C;
  --mint-400:#4FC9AB;--mint-500:#2FB897;--mint-600:#279A80;
  --white:#fff;--text-on-dark:#E8F0F1;--text-muted-dark:#A5BFC1;--ink:#182022;
  --border-subtle:rgba(232,240,241,0.14);--border-accent:rgba(47,184,151,0.45);
  --font-display:"Fraunces",Georgia,serif;--font-body:"Mona Sans",system-ui,sans-serif;
  --radius-card:12px;--radius-pill:999px;--disp:'SOFT' 100,'WONK' 0;
  --glow:radial-gradient(closest-side,rgba(23,90,94,0.5),rgba(23,90,94,0) 70%);
}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;display:flex;align-items:center;justify-content:center;
     background:var(--petrol-900);color:var(--text-on-dark);font-family:var(--font-body);
     position:relative;overflow:hidden}

/* Dekor */
.pattern{position:absolute;inset:0;background:url('/assets/pattern-2.svg');background-size:900px;
         opacity:.4;pointer-events:none}
.glow{position:absolute;top:-200px;right:-160px;width:800px;height:600px;background:var(--glow);
      pointer-events:none}
.ghost{position:absolute;bottom:-30px;left:-10px;font-family:var(--font-display);
       font-variation-settings:var(--disp);font-weight:700;font-size:200px;color:var(--teal-ghost);
       opacity:.4;user-select:none;pointer-events:none}

/* Karte */
.card{position:relative;z-index:2;width:100%;max-width:400px;margin:20px;background:var(--petrol-850);
      border:1px solid var(--border-subtle);border-radius:16px;padding:36px 34px;
      box-shadow:0 24px 48px rgba(6,16,19,0.5);max-height:calc(100vh - 40px);overflow-y:auto}
.card.wide{max-width:460px}
.brand{display:flex;flex-direction:column;gap:6px;margin-bottom:26px}
.brand img{height:40px;width:auto;align-self:flex-start}
.brand .t{font-family:var(--font-display);font-variation-settings:var(--disp);font-weight:700;
          font-size:22px;color:var(--white);margin-top:8px}
.brand .t span{color:var(--mint-400)}
.brand .s{font-size:12px;color:var(--text-muted-dark);line-height:1.5}

/* Formular */
label{display:block;font-size:12.5px;font-weight:700;color:var(--text-muted-dark);margin:16px 0 6px}
input[type=text],input[type=email],input[type=password],input[type=tel]{
  width:100%;padding:12px 14px;border:1px solid var(--border-subtle);border-radius:10px;
  background:var(--petrol-900);color:var(--white);font-size:14px;font-family:var(--font-body)}
input:focus{outline:none;border-color:var(--mint-500)}
input[readonly]{opacity:.65;cursor:not-allowed}
button{width:100%;margin-top:22px;padding:13px;border:none;border-radius:var(--radius-pill);
       background:var(--mint-500);color:var(--petrol-950);font-size:14px;font-weight:700;
       cursor:pointer;font-family:var(--font-body)}
button:hover{background:var(--mint-400)}
button:disabled{opacity:.5;cursor:default}
.hint{font-size:11.5px;color:var(--text-muted-dark);margin-top:6px;line-height:1.5}

/* Einwilligung */
.consent{display:flex;gap:10px;align-items:flex-start;margin-top:22px;font-size:12.5px;
         color:var(--text-muted-dark);line-height:1.55}
.consent input{margin-top:2px;accent-color:var(--mint-500);width:16px;height:16px;flex:0 0 auto}
.consent a{color:var(--mint-400)}
.consent-lead{margin-top:22px;font-size:13px;font-weight:700;color:var(--text-on-dark)}
.consent-info{margin-top:16px;font-size:12px;line-height:1.55;color:var(--text-muted-dark);
  background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.1);
  border-radius:8px;padding:10px 12px}

/* Meldungen */
.err{margin-top:16px;font-size:13px;color:#ffb4a8;background:rgba(192,57,43,0.15);
     border:1px solid rgba(192,57,43,0.4);border-radius:8px;padding:10px 12px;display:none}
.ok{margin-top:16px;font-size:13px;color:#bff0e0;background:rgba(47,184,151,0.12);
    border:1px solid var(--border-accent);border-radius:8px;padding:12px 14px;display:none;
    line-height:1.55}
.ok b{color:var(--white)}

/* Fuß */
.foot{margin-top:22px;font-size:12.5px;color:var(--text-muted-dark);text-align:center;line-height:1.9}
.foot a{color:var(--mint-400);text-decoration:none}
.foot a:hover{text-decoration:underline}