/* Schlankes, eigenstaendiges Stylesheet fuer die Rechtsseiten.
   Bewusst NICHT style.css (207 KB Tool-CSS) - diese Seiten sollen
   auch ohne den Tool-Bundle sofort laden. */
:root{
  --bg:#fbfbfd; --surface:#fff; --fg:#0a0a0c; --muted:#55555f; --line:#e6e6ec;
  --indigo:#635bff; --pink:#ff385c;
}
@media (prefers-color-scheme: dark){
  :root{ --bg:#0e0e12; --surface:#16161c; --fg:#f4f4f7; --muted:#a5a5b2; --line:#2a2a33; }
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);
  font:16px/1.65 system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  -webkit-text-size-adjust:100%}
.wrap{max-width:820px;margin:0 auto;padding:0 20px 80px}
header.top{border-bottom:1px solid var(--line);margin-bottom:40px;background:var(--surface)}
header.top .wrap{padding-block:18px;display:flex;align-items:center;gap:12px;justify-content:space-between}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:inherit;font-weight:650}
.brand img{width:26px;height:26px;border-radius:7px;display:block}
.back{font-size:.9rem;color:var(--indigo);text-decoration:none}
.back:hover{text-decoration:underline}
/* clamp + Silbentrennung: lange deutsche Komposita wie
   "Datenschutzerklärung" sind bei 2rem breiter als ein
   390px-Display und weiteten den Viewport auf. */
h1{font-size:clamp(1.45rem,6.2vw,2rem);line-height:1.2;letter-spacing:-.02em;margin:0 0 8px;
   overflow-wrap:break-word;hyphens:auto}
h2,h3,p,li{overflow-wrap:break-word}
.lede{color:var(--muted);margin:0 0 36px}
h2{font-size:1.15rem;letter-spacing:-.01em;margin:38px 0 10px;padding-top:18px;border-top:1px solid var(--line)}
h2:first-of-type{border-top:0;padding-top:0}
h3{font-size:1rem;margin:22px 0 6px}
p,li{color:var(--fg)}
p{margin:0 0 14px}
ul{margin:0 0 14px;padding-left:22px}
li{margin-bottom:6px}
a{color:var(--indigo)}
.muted{color:var(--muted)}
.box{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:18px 20px;margin:0 0 22px}
.box.accent{border-left:3px solid var(--indigo)}
.eml{user-select:none;-webkit-user-select:none}
code{background:var(--surface);border:1px solid var(--line);border-radius:5px;padding:1px 6px;font-size:.9em}
footer.btm{border-top:1px solid var(--line);margin-top:56px;padding-top:22px;font-size:.88rem;color:var(--muted)}
footer.btm a{color:var(--muted)}
.lang-note{font-size:.88rem;color:var(--muted);margin-bottom:30px}
table{border-collapse:collapse;width:100%;margin:0 0 18px;font-size:.94rem;display:block;overflow-x:auto}
th,td{text-align:left;padding:8px 12px;border-bottom:1px solid var(--line);vertical-align:top}
th{font-weight:600}

/* Lokalisierte Kernaussage auf der Seite mit den Nutzungsbedingungen:
   Der verbindliche Text steht auf Englisch und Deutsch, dieser Hinweis
   in der Sprache, in der jemand das Werkzeug benutzt. */
.terms-locale {
  margin: 0 0 26px;
  padding: 14px 18px;
  border-inline-start: 3px solid var(--indigo);
  background: var(--surface);
  border-radius: 0 10px 10px 0;
  font-size: 1rem;
}
.terms-locale[dir="rtl"] { border-radius: 10px 0 0 10px; }
.terms-locale .muted { font-size: .86rem; }