/* Anmeldeseite analytics.hellokiwi.app: CI wie www.hellokiwi.app (pink #ff5c82 → #e23a64, Bricolage 800, Inter). */
@font-face { font-family: "Bricolage"; font-weight: 800; font-display: swap; src: url("/_hkgate/bricolage-grotesque-latin-800-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-weight: 400; font-display: swap; src: url("/_hkgate/inter-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-weight: 600; font-display: swap; src: url("/_hkgate/inter-latin-600-normal.woff2") format("woff2"); }
:root { --bg: #fdf4f6; --card: rgba(255,255,255,.8); --ink: #1a1220; --muted: #6f6370; --line: #f0e3e7; --pink: #ff5c82; --deep: #e23a64; --field: #fff; }
@media (prefers-color-scheme: dark) { :root { --bg: #140e17; --card: rgba(33,26,37,.85); --ink: #f6eef2; --muted: #a99cab; --line: #34283a; --field: #1a141d; } }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: radial-gradient(circle at 20% 0%, rgba(255,92,130,.18), transparent 50%), var(--bg); color: var(--ink);
  font: 400 16px/1.45 "Inter", -apple-system, "Segoe UI", Roboto, sans-serif; display: grid; place-items: center; }
.wrap { width: 100%; max-width: 420px; padding: 24px 16px; }
.card { background: var(--card); border: 1px solid var(--line); border-radius: 28px; padding: 32px 24px 24px; text-align: center;
  -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); box-shadow: 0 20px 50px -24px rgba(80,30,50,.35); }
.mark { width: 72px; height: 72px; margin: 0 auto 16px; border-radius: 20px; display: grid; place-items: center;
  background: linear-gradient(140deg, #ff8aa5, #ff5c82 45%, #e23a64); box-shadow: inset 0 1px 0 rgba(255,255,255,.45); }
h1 { font: 800 28px/1.1 "Bricolage", system-ui, sans-serif; letter-spacing: -.03em; margin: 0 0 8px; }
.muted { color: var(--muted); margin: 0 0 20px; }
input { width: 100%; font: inherit; padding: 14px 16px; border-radius: 14px; border: 1px solid var(--line); background: var(--field); color: var(--ink); outline: none; }
input:focus { border-color: var(--pink); box-shadow: 0 0 0 3px rgba(255,92,130,.2); }
.code { text-align: center; font-size: 26px; letter-spacing: .4em; font-weight: 600; }
.btn { width: 100%; margin-top: 12px; padding: 14px; border: 0; border-radius: 14px; font: 600 16px "Inter", sans-serif; color: #fff; cursor: pointer;
  background: linear-gradient(140deg, #ff8aa5, #ff5c82 45%, #e23a64); }
.btn:disabled { opacity: .6; }
.link { margin-top: 10px; background: none; border: 0; color: var(--deep); font: 600 15px "Inter", sans-serif; cursor: pointer; }
.msg { min-height: 1.4em; margin: 14px 0 0; font-size: 14px; color: var(--muted); }
.msg.err { color: #ef4444; }