/* Gemeinsame Gestaltung für Anmelde- und Kontoseite (gleiche Farben wie das Stallbuch) */
:root{
  --bg:#f3f1ea; --surface:#fbfaf6; --line:#d9d4c3; --fg:#25291f; --muted:#6a6c5d;
  --accent:#2f5d4e; --accent-ink:#ffffff; --hay:#c9a24a; --warn:#b4532a; --warn-soft:#f6e1d6;
  --f-display:"Zilla Slab",Rockwell,"Roboto Slab",Georgia,serif;
  --f-body:"Source Sans 3","Segoe UI",system-ui,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root{
  --bg:#171a15; --surface:#20241d; --line:#373c31; --fg:#ebe9de; --muted:#a3a593;
  --accent:#7fbfa6; --accent-ink:#10201a; --hay:#d9b45c; --warn:#ec9a74; --warn-soft:#3d261b; color-scheme:dark}}
:root[data-modus="hell"]{--bg:#f3f1ea;--surface:#fbfaf6;--line:#d9d4c3;--fg:#25291f;--muted:#6a6c5d;--accent:#2f5d4e;--accent-ink:#ffffff;--hay:#c9a24a;--warn:#b4532a;--warn-soft:#f6e1d6;color-scheme:light}
:root[data-modus="dunkel"]{--bg:#171a15;--surface:#20241d;--line:#373c31;--fg:#ebe9de;--muted:#a3a593;--accent:#7fbfa6;--accent-ink:#10201a;--hay:#d9b45c;--warn:#ec9a74;--warn-soft:#3d261b;color-scheme:dark}
:root[data-modus="dimm"]{--bg:#0b0a08;--surface:#13110e;--line:#2a261f;--fg:#b8ad95;--muted:#7c7363;--accent:#a8844a;--accent-ink:#0b0a08;--hay:#9a7d44;--warn:#b8774f;--warn-soft:#25170f;color-scheme:dark}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font:16px/1.5 var(--f-body)}
[hidden]{display:none!important}
.wrap{max-width:720px;margin:0 auto;padding:32px max(16px,env(safe-area-inset-right,0px)) 60px max(16px,env(safe-area-inset-left,0px));display:grid;gap:20px}
h1{font-family:var(--f-display);font-size:1.8rem;margin:0;display:flex;align-items:center;gap:10px}
h1 svg{color:var(--hay)}
h2{font-family:var(--f-display);font-size:1.25rem;margin:0}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:18px;display:grid;gap:12px}
label{display:grid;gap:4px;font-size:.88rem;font-weight:600;color:var(--muted)}
input,select{font:inherit;color:var(--fg);background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:9px 11px;width:100%}
.btn{font:600 .95rem var(--f-body);border-radius:8px;padding:9px 16px;cursor:pointer;border:1px solid var(--accent);background:var(--accent);color:var(--accent-ink);text-decoration:none;display:inline-block}
.btn.ghost{background:transparent;color:var(--accent)}
.btn.danger{border-color:var(--warn);background:transparent;color:var(--warn)}
.btn:disabled{opacity:.5}
button:focus-visible,input:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.ro{color:var(--muted);font-size:.9rem;margin:0}
.err{color:var(--warn);font-weight:600;margin:0}
.ok{color:var(--accent);font-weight:600;margin:0}
.users{display:grid;gap:0;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.user{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;padding:10px 12px;border-bottom:1px solid var(--line)}
.user:last-child{border-bottom:0}
.user b{flex:1;min-width:120px}
.tag{font:500 .72rem var(--f-mono);letter-spacing:.06em;text-transform:uppercase;border:1px solid var(--accent);color:var(--accent);border-radius:999px;padding:1px 8px}
code,.mono{font-family:var(--f-mono);font-size:.85rem;overflow-wrap:anywhere}
.check{display:flex;gap:6px;align-items:center;color:var(--fg)}
.check input{width:auto}

.geheim{-webkit-text-security:disc;text-security:disc}

@media (max-width:700px){input,select,textarea{font-size:16px!important}}
html{-webkit-text-size-adjust:100%}
.wrap{overflow-wrap:anywhere}