:root{--bg:#f5f6f8;--card:#fff;--fg:#1c2330;--mut:#6b7585;--bd:#e1e5ec;--ac:#2563eb;--ok:#15803d;--warn:#b45309;--err:#b91c1c;--okbg:#dcfce7;--warnbg:#fef3c7;--errbg:#fee2e2;--inbg:#dbeafe}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#10141b;--card:#181e28;--fg:#e6eaf1;--mut:#8b95a7;--bd:#2a3342;--ac:#6ea0ff;--ok:#4ade80;--warn:#fbbf24;--err:#f87171;--okbg:#14301f;--warnbg:#38290b;--errbg:#3b1616;--inbg:#17284a}}
:root[data-theme=dark]{--bg:#10141b;--card:#181e28;--fg:#e6eaf1;--mut:#8b95a7;--bd:#2a3342;--ac:#6ea0ff;--ok:#4ade80;--warn:#fbbf24;--err:#f87171;--okbg:#14301f;--warnbg:#38290b;--errbg:#3b1616;--inbg:#17284a}
:root[data-theme=light]{color-scheme:light}
:root{--g1:#7c3aed;--g2:#0891b2;--glow1:rgba(124,58,237,.10);--glow2:rgba(8,145,178,.08)}
:root[data-theme=dark]{--glow1:rgba(124,58,237,.20);--glow2:rgba(6,182,212,.14)}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--g2:#06b6d4;--glow1:rgba(124,58,237,.20);--glow2:rgba(6,182,212,.14)}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font:15px/1.5 system-ui,-apple-system,Segoe UI,Roboto,sans-serif}
a{color:var(--ac);text-decoration:none}
header{background:var(--card);border-bottom:1px solid var(--bd)}
.bar{max-width:1000px;margin:0 auto;padding:0 16px;display:flex;align-items:center;gap:16px;min-height:56px}
.brand{font-weight:700;font-size:17px;color:var(--fg)}
nav{display:flex;gap:4px;flex:1;flex-wrap:wrap}
nav a{padding:6px 12px;border-radius:8px;color:var(--mut)}
nav a.on,nav a:hover{background:var(--bg);color:var(--fg)}
main{max-width:1000px;margin:0 auto;padding:20px 16px 48px}
h1{font-size:22px;margin:0 0 16px}
.card{background:var(--card);border:1px solid var(--bd);border-radius:12px;padding:16px;margin-bottom:16px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:16px}
.stat{background:var(--card);border:1px solid var(--bd);border-radius:12px;padding:14px}
.stat b{display:block;font-size:26px}.stat span{color:var(--mut);font-size:13px}
.badge{display:inline-block;padding:1px 9px;border-radius:99px;font-size:12px;font-weight:600}
.b-ok{background:var(--okbg);color:var(--ok)}.b-warn{background:var(--warnbg);color:var(--warn)}.b-err{background:var(--errbg);color:var(--err)}.b-in{background:var(--inbg);color:var(--ac)}
table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:9px 8px;border-bottom:1px solid var(--bd);vertical-align:top}
th{color:var(--mut);font-size:12px;text-transform:uppercase;letter-spacing:.04em}
td.body{white-space:pre-wrap;word-break:break-word;max-width:420px}
.tbl{overflow-x:auto}
label{display:block;font-weight:600;margin:12px 0 4px}
input,textarea{width:100%;padding:9px 11px;border:1px solid var(--bd);border-radius:8px;background:var(--bg);color:var(--fg);font:inherit}
textarea{min-height:130px;resize:vertical}
button,.btn{display:inline-block;padding:9px 16px;border:0;border-radius:8px;background:linear-gradient(135deg,var(--g1),var(--g2));color:#fff;font:inherit;font-weight:600;cursor:pointer}
button.ghost{background:transparent;color:var(--mut);border:1px solid var(--bd);padding:3px 10px;font-weight:400}
.flash{padding:10px 14px;border-radius:8px;margin-bottom:16px;background:var(--okbg);color:var(--ok)}
.err{color:var(--err);font-size:13px;margin-top:4px}
.mut{color:var(--mut);font-size:13px}
.tabs{display:flex;gap:6px;margin-bottom:12px;flex-wrap:wrap}
.tabs a{padding:5px 12px;border:1px solid var(--bd);border-radius:99px;color:var(--mut)}.tabs a.on{background:var(--ac);color:#fff;border-color:var(--ac)}
.login{max-width:360px;margin:12vh auto}
code{background:var(--bg);padding:2px 6px;border-radius:5px;word-break:break-all}
pre{background:var(--bg);padding:12px;border-radius:8px;overflow-x:auto;font-size:13px}
.pager{margin-top:12px}.pager nav{display:block}.pager svg{width:16px;height:16px}.pager a,.pager span{font-size:14px}

.hero{padding:28px 0 8px}.hero h1{font-size:30px;margin-bottom:6px}
.foot{max-width:1000px;margin:0 auto;padding:16px;color:var(--mut);font-size:13px;text-align:center}
ul{padding-left:20px}
h3{margin:18px 0 6px;font-size:16px}

/* Admin, Wartung, Modem */
.maint{background:var(--warnbg);color:var(--warn);text-align:center;padding:9px 16px;font-weight:600;border-bottom:1px solid var(--bd)}
details.fold>summary{cursor:pointer;list-style:none}details.fold>summary::-webkit-details-marker{display:none}
details.fold>summary::before{content:"▸";display:inline-block;width:18px;color:var(--mut);transition:transform .15s}
details.fold[open]>summary::before{transform:rotate(90deg)}
details.user{padding:12px 16px;margin-bottom:8px}details.user .ugrid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:14px 0}
.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
select{width:100%;padding:9px 11px;border:1px solid var(--bd);border-radius:8px;background:var(--bg);color:var(--fg);font:inherit}
.captcha{display:block;border-radius:8px;border:1px solid var(--bd);margin-bottom:8px;max-width:100%;height:auto}
.modem .mhead{display:flex;align-items:center;gap:14px;margin-bottom:12px}
.sig{display:flex;align-items:flex-end;gap:3px;height:26px}.sig i{display:block;width:6px;border-radius:2px;background:var(--bd)}
.sig.good i.on{background:var(--ok)}.sig.mid i.on{background:var(--warn)}.sig.low i.on{background:var(--err)}
.mgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px}.mgrid span{display:block;color:var(--mut);font-size:12px}.mgrid b{font-size:15px}
@media(max-width:760px){details.user .ugrid,.two{grid-template-columns:1fr}}

.imp{background:#4c1d95;color:#fff;text-align:center;padding:9px 16px;font-size:14px}.imp button{margin-left:10px;padding:4px 12px;background:#fff;color:#4c1d95}

/* Icons, Skip-Link */
.skip{position:absolute;left:-9999px;top:0;background:var(--ac);color:#fff;padding:8px 14px;z-index:99;border-radius:0 0 8px 0}.skip:focus{left:0}
nav a i,.btn i,.brand i,button i,.badge i{margin-right:2px}
.brand i{color:var(--ac)}.stat b i{font-size:.8em}
.lp-btn i{margin:0 4px}
.lp-trust i{color:#4ade80}
:focus-visible{outline:2px solid var(--ac);outline-offset:2px}

/* Wartungsseite */
.mt-body{margin:0;background:radial-gradient(900px 500px at 80% -10%,#3b2a8c,transparent 60%),radial-gradient(800px 500px at -10% 110%,#0b5d7a,transparent 55%),#0a0d18;color:#f4f7ff;min-height:100vh}
.mt-wrap{display:grid;place-items:center;min-height:100vh;padding:20px;max-width:none}
.mt-card{max-width:520px;text-align:center;padding:40px 32px;border:1px solid rgba(255,255,255,.14);border-radius:22px;background:rgba(255,255,255,.05);backdrop-filter:blur(8px);box-shadow:0 30px 80px -30px rgba(124,58,237,.6)}
.mt-card h1{font-size:34px;margin:14px 0 10px}.mt-text{font-size:18px;line-height:1.5;color:#dfe5f7;margin:0 0 14px}
.mt-icon{width:72px;height:72px;margin:0 auto;display:grid;place-items:center;font-size:30px;border-radius:50%;background:linear-gradient(135deg,#7c3aed,#06b6d4)}
.mt-card .mut,.mt-card a{color:#aeb8d6}.mt-actions{margin-top:18px}
.mt-admin{display:inline-block;padding:11px 22px;border:1px solid rgba(255,255,255,.28);border-radius:12px;color:#f4f7ff!important;font-weight:600}.mt-admin:hover{background:rgba(255,255,255,.1)}

/* Diagramme, 2FA */
svg.chart{width:100%;height:auto;display:block;margin-top:8px}
svg.chart .grid{stroke:var(--bd);stroke-width:1}svg.chart .axis{fill:var(--mut);font-size:10px}
.c-ok{fill:#16a34a;background:#16a34a}.c-sent{fill:#3b82f6;background:#3b82f6}.c-other{fill:#94a3b8;background:#94a3b8}.c-err{fill:#dc2626;background:#dc2626}
.legend{display:flex;gap:14px;flex-wrap:wrap;margin-top:6px;font-size:12px;color:var(--mut)}.legend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:4px;vertical-align:-1px}
.qr{margin:10px 0;padding:10px;background:#fff;border-radius:12px;display:inline-block}.qr svg{display:block;width:220px;height:220px}
.steps2{padding-left:20px;line-height:1.6}pre.codes{font-size:20px;letter-spacing:.06em;line-height:1.9;text-align:center}

/* Kontakte, Gruppen */
.chips{display:flex;gap:8px;flex-wrap:wrap;margin:4px 0 8px}
.chip{display:inline-flex;align-items:center;gap:6px;margin:0!important;padding:5px 12px;border:1px solid var(--bd);border-radius:99px;font-weight:400!important;background:var(--bg)}
.chip input{width:auto}.chip.on{border-color:var(--ac);background:var(--inbg)}
.chip a{color:inherit}

/* Hauptnavigation */
header .bar{position:relative;flex-wrap:nowrap}
.brand{white-space:nowrap;margin-right:4px}.grow{flex:1}
header nav{display:flex;align-items:center;gap:2px;flex:1;flex-wrap:nowrap}
header nav a,.dd-btn{display:inline-flex;align-items:center;gap:7px;padding:8px 12px;border-radius:9px;color:var(--mut);white-space:nowrap;font:inherit;font-weight:500;background:none;border:0;cursor:pointer;line-height:1.2}
header nav a:hover,.dd-btn:hover,header nav a.on,.dd-btn.on,.dd.open>.dd-btn{background:var(--bg);color:var(--fg)}
header nav a.admin{color:var(--ac);margin-left:auto}header nav a.admin.on,header nav a.admin:hover{background:var(--inbg)}
.dd{position:relative}.dd .caret{font-size:.65em;opacity:.7;margin:0 0 0 2px;transition:transform .15s}.dd.open .caret{transform:rotate(180deg)}
.dd-menu{display:none;position:absolute;left:0;top:calc(100% + 6px);min-width:230px;background:var(--card);border:1px solid var(--bd);border-radius:12px;box-shadow:0 14px 34px -12px rgba(0,0,0,.35);padding:6px;z-index:50}
.dd-menu.right{left:auto;right:0}.dd.open>.dd-menu{display:block}
.dd-menu a,.dd-menu form button{display:flex;align-items:center;gap:10px;width:100%;padding:9px 12px;border-radius:8px;color:var(--fg);background:none;border:0;font:inherit;font-weight:500;cursor:pointer;text-align:left}
.dd-menu a i,.dd-menu form button i{width:16px;text-align:center;color:var(--mut)}
.dd-menu a:hover,.dd-menu form button:hover,.dd-menu a.on{background:var(--bg)}
.dd-menu hr{border:0;border-top:1px solid var(--bd);margin:6px 4px}
.dd-menu .who{padding:8px 12px 6px;display:flex;flex-direction:column;gap:2px}.dd-menu .who span{color:var(--mut);font-size:12px;word-break:break-all}
.dd.user .uname{max-width:110px;overflow:hidden;text-overflow:ellipsis}
.burger{display:none;background:none;border:1px solid var(--bd);color:var(--fg);padding:8px 12px;border-radius:9px;margin-left:auto}
@media(max-width:860px){
  .burger{display:inline-flex}
  header .bar{flex-wrap:wrap;gap:8px 12px;padding-top:8px;padding-bottom:8px}
  header nav{display:none;order:5;flex-basis:100%;flex-direction:column;align-items:stretch;gap:2px;padding:6px 0 4px;border-top:1px solid var(--bd)}
  header nav.open{display:flex}
  header nav a.admin{margin-left:0}
  header nav .dd-menu{position:static;box-shadow:none;border:0;background:transparent;padding:0 0 0 18px;min-width:0}
  header nav .dd-btn{width:100%;justify-content:flex-start}
  .dd.user .uname{display:none}
}

.ok-hint{color:var(--ok);font-size:13px;margin-top:4px}

/* Rechtstexte, Cookie-Hinweis */
.legal{line-height:1.65}.legal h2{font-size:20px;margin:28px 0 8px;padding-top:6px;border-top:1px solid var(--bd);scroll-margin-top:70px}
.legal h2:first-of-type{border-top:0;margin-top:8px}.legal h3{font-size:16px;margin:16px 0 6px}
.legal ul{margin:6px 0 12px}.legal li{margin:4px 0}.legal .toc{columns:2;column-gap:28px;list-style:none;padding:0}.legal .toc li{break-inside:avoid;margin:3px 0}
.legal table{font-size:14px}
@media(max-width:700px){.legal .toc{columns:1}}
.cookie{position:fixed;left:16px;right:16px;bottom:16px;z-index:60;max-width:760px;margin:0 auto;background:var(--card);color:var(--fg);border:1px solid var(--bd);border-radius:14px;padding:14px 16px;box-shadow:0 18px 50px -14px rgba(0,0,0,.55);display:flex;gap:16px;align-items:flex-start;flex-wrap:wrap}
.cookie-text{flex:1;min-width:240px}.cookie-text p{margin:4px 0 6px;font-size:14px;color:var(--mut)}
.cookie-text details{font-size:13px}.cookie-text summary{cursor:pointer;color:var(--ac)}.cookie-text ul{margin:6px 0 0;padding-left:18px;color:var(--mut)}
.cookie-actions{display:flex;gap:12px;align-items:center;align-self:center}.cookie-actions a{color:var(--mut);font-size:14px}
@media print{.cookie{display:none}}

/* Cookie-Auswahl: Hintergrund weichzeichnen und sperren, bis entschieden wurde (nicht auf Impressum/Datenschutz) */
.cookie-wall{position:fixed;inset:0;z-index:55;background:rgba(8,10,18,.45);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}

/* Modale Dialoge (Rechtstexte, Hinweis bei externen Links) */
dialog.modal{width:min(900px,94vw);max-height:88vh;padding:0;border:1px solid var(--bd);border-radius:14px;background:var(--card);color:var(--fg);box-shadow:0 30px 80px -20px rgba(0,0,0,.65);overflow:hidden}
dialog.modal[open]{display:flex;flex-direction:column}
dialog.modal::backdrop{background:rgba(8,10,18,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.modal-head{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--bd)}
.modal-title{font-size:18px}.modal-x{padding:6px 10px}
.modal-body{padding:16px;overflow:auto;overscroll-behavior:contain}
.modal-body .card{border:0;box-shadow:none;padding:0;background:transparent}
.modal-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.ext-url{word-break:break-all}

/* Changelog */
.cl{display:inline-block;min-width:78px;text-align:center;padding:1px 9px;border-radius:6px;font-size:12px;font-weight:700;letter-spacing:.2px;vertical-align:1px}
.cl-new{background:var(--okbg);color:var(--ok)}.cl-improved{background:var(--inbg);color:var(--ac)}.cl-change{background:var(--bd);color:var(--fg)}
.cl-bugfix{background:var(--warnbg);color:var(--warn)}.cl-security{background:var(--errbg);color:var(--err)}
.cl-legend{display:flex;gap:8px;flex-wrap:wrap}.cl-rel h2{font-size:19px;margin:22px 0 8px}.cl-rel h2 small{font-size:13px;font-weight:400}
.cl-list{list-style:none;padding:0;margin:0}.cl-list li{display:flex;gap:10px;align-items:baseline;padding:5px 0}.cl-list .cl{flex:none}

/* Footer-Helfer: Design-Umschalter, Changelog-Hinweis */
.foot .theme{background:none;border:0;padding:0;margin:0;color:inherit;font:inherit;cursor:pointer;text-decoration:underline}
.foot .cl-dot::after{content:'';display:inline-block;width:8px;height:8px;margin-left:5px;border-radius:50%;background:var(--err);vertical-align:1px}

/* Docs: Playground und Beispiele */
.snip-tabs{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0}.snip-tabs button{padding:5px 12px}.snip-tabs button.on{background:var(--ac);color:#fff;border-color:var(--ac)}
.snip-tabs .snip-copy{margin-left:auto}.snip-item h4{margin:14px 0 4px}
#pg-out{white-space:pre-wrap;word-break:break-word}

/* ===== Design-Politur: Markenverlauf Violett -> Cyan, weiche Tiefe, kleine Hover-Effekte. Nur CSS, keine Dauer-Animationen. ===== */
::selection{background:rgba(124,58,237,.32)}
html{scrollbar-width:thin;scrollbar-color:var(--bd) transparent}
body{background-image:radial-gradient(900px 360px at 88% -90px,var(--glow1),transparent 70%),radial-gradient(700px 300px at -4% -70px,var(--glow2),transparent 70%);background-repeat:no-repeat}
header{position:sticky;top:0;z-index:40;box-shadow:0 8px 24px -18px rgba(0,0,0,.55)}
header::after{content:'';display:block;height:2px;background:linear-gradient(90deg,var(--g1),var(--g2),transparent 85%)}
.brand i{background:linear-gradient(135deg,var(--g1),var(--g2));-webkit-background-clip:text;background-clip:text;color:transparent}
nav a{transition:background .15s,color .15s}
nav a.on{background:linear-gradient(135deg,rgba(124,58,237,.18),rgba(6,182,212,.14));color:var(--fg)}
h1{letter-spacing:-.01em}
main:not(.wide) h1::after{content:'';display:block;width:44px;height:4px;border-radius:4px;margin-top:8px;background:linear-gradient(90deg,var(--g1),var(--g2))}
.card,.stat{border-radius:14px;box-shadow:0 1px 0 rgba(255,255,255,.04) inset,0 12px 30px -22px rgba(0,0,0,.5);transition:border-color .2s,box-shadow .2s,transform .2s}
.card:hover,.stat:hover{border-color:color-mix(in srgb,var(--g1) 40%,var(--bd))}
.stat:hover{transform:translateY(-2px);box-shadow:0 1px 0 rgba(255,255,255,.04) inset,0 16px 32px -20px rgba(124,58,237,.55)}
.stat b{background:linear-gradient(90deg,var(--g1),var(--g2));-webkit-background-clip:text;background-clip:text;color:transparent}
main button:not([class]),main .btn{box-shadow:0 8px 20px -10px rgba(124,58,237,.75);transition:transform .15s,box-shadow .15s,filter .15s}
main button:not([class]):hover,main .btn:hover{transform:translateY(-1px);filter:brightness(1.08);box-shadow:0 12px 24px -10px rgba(6,182,212,.6)}
main button:not([class]):active,main .btn:active{transform:none;filter:brightness(.96)}
button.ghost{transition:border-color .15s,color .15s,background .15s}button.ghost:hover{border-color:var(--g1);color:var(--fg)}
input,textarea,select{transition:border-color .15s,box-shadow .15s}
input:focus,textarea:focus,select:focus{outline:0;border-color:var(--g1);box-shadow:0 0 0 3px rgba(124,58,237,.25)}
:focus-visible{outline:2px solid var(--g2);outline-offset:2px}
tbody tr:hover td{background:color-mix(in srgb,var(--g1) 7%,transparent)}
.tabs a.on,.snip-tabs button.on{background:linear-gradient(135deg,var(--g1),var(--g2));border-color:transparent}
.badge{letter-spacing:.01em}
.flash{border-left:4px solid var(--ok);border-radius:10px}
main a:not(.btn):not(.chip):hover{text-decoration:underline;text-underline-offset:3px}
.foot{border-top:1px solid var(--bd);margin-top:8px;padding-top:18px}
.foot a{color:var(--mut)}.foot a:hover{color:var(--fg)}
.cookie{border-top:3px solid var(--g1)}
.modal-head{background:linear-gradient(90deg,rgba(124,58,237,.14),rgba(6,182,212,.10))}
code{border:1px solid color-mix(in srgb,var(--bd) 70%,transparent)}
@keyframes rise{from{opacity:0;transform:translateY(6px)}}
main:not(.wide)>*{animation:rise .35s ease-out both}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
@media(prefers-reduced-motion:reduce){.bub{opacity:1!important;transform:none!important}.lp-typing{display:none}}

/* Setup-Assistent, Diagramm-Kopf, API-Nutzung, Auffälligkeiten */
.onb-head{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;align-items:baseline}
.prog{height:8px;border-radius:99px;background:var(--bd);overflow:hidden;margin:10px 0 6px}
.prog i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--g1),var(--g2));transition:width .6s}
.onb-steps{list-style:none;margin:6px 0 0;padding:0}
.onb-steps li{display:flex;align-items:center;gap:12px;padding:9px 0;border-top:1px solid var(--bd)}
.onb-steps li:first-child{border-top:0}
.onb-ico{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--bg);color:var(--mut);border:1px solid var(--bd)}
.onb-steps li.done .onb-ico{background:linear-gradient(135deg,var(--g1),var(--g2));color:#fff;border-color:transparent}
.onb-txt{flex:1;display:flex;flex-direction:column;line-height:1.3}
.onb-steps li.done .onb-txt b{color:var(--mut);text-decoration:line-through;text-decoration-thickness:1px}
.chart-head{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:6px}
.usage{display:inline-flex;gap:2px;align-items:flex-end;height:18px;margin-left:8px;vertical-align:middle}
.usage i{width:5px;border-radius:2px;background:linear-gradient(180deg,var(--g1),var(--g2))}.usage i.e{background:var(--err)}
.anom{display:flex;gap:10px;align-items:flex-start;padding:8px 0;border-top:1px solid var(--bd)}.anom:first-of-type{border-top:0}
.anom .badge{flex:none;margin-top:2px}

/* Erklärung zur Token-Berechtigung */
.scope-help{background:var(--bg);border:1px solid var(--bd);border-left:4px solid var(--g1);border-radius:10px;padding:10px 14px;margin:10px 0}
.scope-help ul{margin:6px 0}.scope-help p{margin:6px 0 0}

/* API-Dokumentation: Seitenmenü, Abschnitte, Konverter */
main.docs-wide{max-width:1180px}
.docs{display:grid;grid-template-columns:210px minmax(0,1fr);gap:26px;align-items:start}
.docs-nav{position:sticky;top:78px;display:flex;flex-direction:column;gap:2px;font-size:14px}
.docs-nav a{padding:7px 10px;border-radius:8px;color:var(--mut);border-left:3px solid transparent}
.docs-nav a i{width:18px;text-align:center;margin-right:4px;opacity:.8}
.docs-nav a:hover,.docs-nav a.on{background:var(--card);color:var(--fg);border-left-color:var(--g1);text-decoration:none}
.docs-main section{scroll-margin-top:80px}
.docs-main h2{font-size:20px;margin:0 0 10px}.docs-main h2 i{color:var(--g1);margin-right:6px}
.docs-main h3{margin:18px 0 6px;font-size:16px}
.docs-main .two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.cv-table td{white-space:nowrap}
@media(max-width:860px){
  .docs{grid-template-columns:minmax(0,1fr)}
  .docs-nav{position:sticky;top:57px;z-index:30;flex-direction:row;flex-wrap:nowrap;overflow-x:auto;gap:4px;padding:8px 0;background:var(--bg);border-bottom:1px solid var(--bd);white-space:nowrap}
  .docs-nav a{border-left:0;border-bottom:3px solid transparent;border-radius:8px 8px 0 0}
  .docs-nav a:hover,.docs-nav a.on{border-bottom-color:var(--g1)}
  .docs-main .two{grid-template-columns:1fr}
}
.docs-main code{word-break:normal;overflow-wrap:anywhere}
.docs-main .tbl table{min-width:460px}

/* Seitenlayout mit Navigation links (Admin-Center, Einstellungen) */
main.side-layout{max-width:1260px;display:grid;grid-template-columns:220px minmax(0,1fr);column-gap:26px;align-content:start}
main.side-layout>*{grid-column:2;min-width:0}
main.side-layout>.side-nav{grid-column:1;grid-row:1/span 80;align-self:start}
.docs-nav .gh{display:block;margin:12px 10px 3px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--mut);opacity:.85}
.docs-nav .gh:first-child{margin-top:0}
@media(max-width:860px){main.side-layout{display:block}.docs-nav .gh{display:none}}
.card h2{font-size:17px;margin:0 0 8px}.card h2 i{color:var(--g1);margin-right:6px}
.warn-card{border-color:var(--warn)}
.danger-card{border-color:color-mix(in srgb,var(--err) 45%,var(--bd))}
.pagehead{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap}
details.card.fold>summary{cursor:pointer;list-style-position:inside}
details.card.fold[open]>summary{margin-bottom:8px}

/* Ankündigung, AV-Vertrag */
.announce{background:var(--inbg);color:var(--ac);text-align:center;padding:9px 16px;font-weight:600;border-bottom:1px solid var(--bd)}
.avv-preview{max-height:420px;overflow:auto;border:1px solid var(--bd);border-radius:10px;padding:6px 18px;background:var(--bg);margin-top:8px}
.avv-doc h1{font-size:20px;margin:10px 0 2px}.avv-doc h1::after{display:none}.avv-doc h2{font-size:15px;margin:18px 0 6px}.avv-sub{color:var(--mut);margin:0 0 12px}.avv-party{margin:6px 0 6px 12px}

input[data-lowercase]{text-transform:lowercase}

/* Passwortfelder: Auge und Stärke-Anzeige */
.pw-wrap{position:relative}.pw-wrap input{padding-right:46px}
.pw-eye{position:absolute;right:4px;top:50%;transform:translateY(-50%);padding:6px 10px!important;border:0!important;background:none!important;color:var(--mut)!important;box-shadow:none!important;cursor:pointer}
.pw-eye:hover{color:var(--fg)!important}
.pw-meter{display:flex;gap:4px;align-items:center;margin-top:6px;font-size:12px;min-height:14px}
.pw-meter i{flex:0 0 38px;height:5px;border-radius:3px;background:var(--bd)}
.pw-meter span{margin-left:6px;color:var(--mut)}
.pw-meter.l1 i:nth-child(1){background:var(--err)}.pw-meter.l1 span{color:var(--err)}
.pw-meter.l2 i:nth-child(-n+2){background:#eab308}.pw-meter.l2 span{color:var(--warn)}
.pw-meter.l3 i{background:var(--ok)}.pw-meter.l3 span{color:var(--ok)}

/* Bot-Abwehr: unsichtbare Fallen für Skripte und KI-Agenten (für Menschen und Screenreader verborgen) */
.trap{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
img.captcha{display:block;border-radius:8px;border:1px solid var(--bd);margin:4px 0}

/* API-Tokens im Kundenkonto */
.tk-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}.tk-head h2{margin:0}
.tk-list{display:grid;gap:10px;margin:12px 0}
.tk{border:1px solid var(--bd);border-radius:12px;padding:12px 14px;background:var(--bg)}
.tk-top{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.tk-meta{display:flex;gap:6px 16px;flex-wrap:wrap;margin:6px 0;font-size:13px;color:var(--mut)}
.tk-meta i{margin-right:4px}
.tk-chip{border:1px solid var(--bd);border-radius:99px;padding:0 9px}.tk-chip.on{color:var(--ok);border-color:color-mix(in srgb,var(--ok) 45%,var(--bd))}
.tk-usage{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px}
.tk-mail{margin-top:8px;padding-top:8px;border-top:1px dashed var(--bd);display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:13px}
.tk-new{border:1px solid color-mix(in srgb,var(--warn) 55%,var(--bd));background:var(--warnbg);color:var(--fg);border-radius:12px;padding:12px 14px;margin:12px 0}
.tk-new b i{color:var(--ok);margin-right:4px}
.tk-secret{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.tk-secret code{flex:1;min-width:220px;padding:8px 10px;font-size:14px;user-select:all}
.tk-empty{border:1px dashed var(--bd);border-radius:12px;padding:14px;color:var(--mut);margin:12px 0}
.tk-form{margin-top:6px}.tk-revoked{margin-top:12px}.tk-rev{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:6px 0;border-top:1px solid var(--bd);opacity:.7}
.danger-btn:hover{border-color:var(--err)!important;color:var(--err)!important}

/* Hilfeseite für SMS-Empfänger */
.lead{font-size:17px;line-height:1.55;max-width:760px}
.help-num{text-align:center}.help-big{font-size:clamp(30px,6vw,46px);font-weight:800;letter-spacing:.02em;margin:6px 0;background:linear-gradient(90deg,var(--g1),var(--g2));-webkit-background-clip:text;background-clip:text;color:transparent}
.help-form{max-width:480px}
main:not(.wide)>.card h3{margin-top:14px}

/* Menü-Kopf: Hilfe/FAQ für Besucher */
.guestnav{display:flex;flex:0 0 auto;flex-direction:row;flex-wrap:nowrap;gap:2px;align-items:center}
.guestnav a{padding:6px 10px;border-radius:8px;color:var(--mut);white-space:nowrap}
.guestnav a:hover,.guestnav a.on{background:var(--bg);color:var(--fg);text-decoration:none}
@media(max-width:700px){header .bar:has(.guestnav){flex-wrap:wrap;gap:2px 8px;padding-bottom:4px}header .bar:has(.guestnav) .btn{padding:7px 11px;font-size:14px}header .bar:has(.guestnav) .brand{font-size:16px}.guestnav{order:3;flex:1 0 100%;justify-content:center;gap:22px;border-top:1px solid var(--bd);padding-top:2px}}
.faq-list details.card{padding:12px 16px;margin-bottom:8px}.faq-list summary{cursor:pointer}.faq-list p{margin:8px 0 2px}

/* AV-Vertrag: Ablauf, Kurzfassung, Vertragstabellen */
.avv-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:0 0 14px}
.avv-steps>div{background:var(--card);border:1px solid var(--bd);border-radius:12px;padding:12px 14px;display:grid;gap:2px;opacity:.65}
.avv-steps>div.now,.avv-steps>div.done{opacity:1}.avv-steps>div.now{border-color:var(--ac)}.avv-steps>div.done{border-color:var(--ok)}
.avv-steps i{color:var(--ac);font-size:18px}.avv-steps .done i{color:var(--ok)}.avv-steps span{color:var(--mut);font-size:13px}
.avv-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px;margin:12px 0}
.avv-facts>div{background:var(--bg);border-radius:10px;padding:10px 12px;display:grid;gap:2px}.avv-facts i{color:var(--ac)}.avv-facts span{color:var(--mut);font-size:13px}
.avv-toc{border:1px solid var(--bd);border-radius:10px;padding:8px 14px;margin:14px 0}.avv-toc ol{columns:2;margin:4px 0;padding-left:22px}
.avv-tbl{overflow-x:auto}.avv-tbl table{border-collapse:collapse;width:100%;font-size:13px}.avv-tbl th,.avv-tbl td{border:1px solid var(--bd);padding:5px 8px;text-align:left;vertical-align:top}
.avv-note{color:var(--mut);font-size:13px}
@media(max-width:700px){.avv-steps{grid-template-columns:1fr}.avv-toc ol{columns:1}}

/* Tageskontingent, Zeitplan-Vorschau */
.quota{background:var(--card);border:1px solid var(--bd);border-radius:12px;padding:12px 14px;margin:0 0 14px}
.quota .q-top{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap}
.quota .q-bar{height:8px;border-radius:99px;background:var(--bg);overflow:hidden;margin:8px 0 2px}
.quota .q-bar i{display:block;height:100%;background:var(--ok);border-radius:99px}
.quota.warn .q-bar i{background:var(--warn)}.quota.full .q-bar i{background:var(--err)}
.quota .q-note{margin:6px 0 0;font-size:13px}.quota.warn .q-note:first-of-type{color:var(--warn)}.quota.full .q-note:first-of-type{color:var(--err)}
details.up summary{cursor:pointer;font-size:13px}details.up div{font-size:13px}

/* Passkeys */
.pk-login{margin:4px 0 8px}.pk-login .err{margin-top:6px}.pk-add{margin-top:10px}

/* Integrationen */
.int-snip{margin:10px 0}.int-head{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:4px}
.int-snip pre{margin:0;overflow-x:auto;white-space:pre}

/* Erfolgsmeldung als Modal */
.flash[data-flash-modal]{display:none}
dialog.modal-sm{width:min(380px,92vw)}
.flash-modal{text-align:center;position:relative;padding:26px 22px 22px}
.flash-ic{font-size:46px;color:var(--ok);line-height:1;animation:flashpop .35s cubic-bezier(.2,1.4,.4,1) both}
.flash-msg{margin:12px 0 16px;font-size:16px}
.flash-bar{position:absolute;left:0;right:0;bottom:0;height:3px;background:linear-gradient(90deg,#7c3aed,#06b6d4);transform-origin:left;animation:flashbar 5s linear forwards}
@keyframes flashpop{from{transform:scale(.4);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes flashbar{from{transform:scaleX(1)}to{transform:scaleX(0)}}
@media(prefers-reduced-motion:reduce){.flash-ic,.flash-bar{animation:none}}

/* ===== App-Shell: Seitenleiste, Kopfleiste, Befehlspalette, Mobil-Leiste ===== */
:root{--sn-w:252px;--sn-wc:72px;--tb-h:56px}
.shell{display:flex;min-height:100vh}
.sidenav{position:sticky;top:0;align-self:flex-start;height:100vh;width:var(--sn-w);flex:0 0 var(--sn-w);display:flex;flex-direction:column;background:var(--card);border-right:1px solid var(--bd);z-index:45;transition:width .2s ease,flex-basis .2s ease}
.shell-main{flex:1;min-width:0;display:flex;flex-direction:column}
.shell-main>main{flex:1 0 auto;width:100%;max-width:1060px;margin-left:auto;margin-right:auto}
.shell-main>main.side-layout{max-width:1200px}.shell-main>main.docs-wide{max-width:1200px}
.sn-top{display:flex;align-items:center;justify-content:space-between;padding:14px 16px 6px}
.sn-close{display:none;padding:6px 10px}
.sn-mode{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin:8px 12px 4px;padding:4px;background:var(--bg);border-radius:11px}
.sn-mode a{display:flex;align-items:center;justify-content:center;gap:6px;padding:7px 6px;border-radius:8px;color:var(--mut);font-weight:600;font-size:13px}
.sn-mode a:hover{color:var(--fg);text-decoration:none}
.sn-mode a.on{background:var(--card);color:var(--fg);box-shadow:0 1px 6px rgba(0,0,0,.2)}.is-admin .sn-mode a.on{color:var(--ac)}
.sn-cta{margin:8px 12px 2px;display:flex;align-items:center;justify-content:center;gap:8px;padding:10px;border-radius:11px;background:linear-gradient(135deg,var(--g1),var(--g2));color:#fff;font-weight:600;box-shadow:0 10px 22px -12px rgba(124,58,237,.9);transition:transform .15s,filter .15s}
.sn-cta:hover{transform:translateY(-1px);filter:brightness(1.08);text-decoration:none;color:#fff}
.sn-scroll{flex:1;overflow-y:auto;padding:2px 10px 8px;scrollbar-width:thin}
.sn-gh{display:block;margin:14px 10px 4px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--mut);opacity:.8}
.si{position:relative;display:flex;align-items:center;gap:11px;padding:8px 10px;border-radius:9px;color:var(--mut);font-weight:500;transition:background .15s,color .15s}
.si i{width:20px;text-align:center;font-size:15px;flex:0 0 20px}
.si:hover{background:var(--bg);color:var(--fg);text-decoration:none}
.si.on{background:linear-gradient(135deg,rgba(124,58,237,.18),rgba(6,182,212,.14));color:var(--fg)}
.si.on::before{content:'';position:absolute;left:-10px;top:8px;bottom:8px;width:4px;border-radius:0 4px 4px 0;background:linear-gradient(var(--g1),var(--g2))}
.si-b{margin-left:auto;min-width:20px;padding:1px 6px;border-radius:99px;font-size:11px;font-weight:700;text-align:center;background:var(--inbg);color:var(--ac)}
.si-b.err{background:var(--errbg);color:var(--err)}.si-b.warn{background:var(--warnbg);color:var(--warn)}
.sn-bottom{padding:10px 12px 12px;border-top:1px solid var(--bd);display:grid;gap:8px}
.sn-use{display:grid;gap:5px;font-size:12px;color:var(--mut)}.sn-use b{color:var(--fg)}.sn-use:hover{text-decoration:none}
.sn-bar{display:block;height:6px;border-radius:99px;background:var(--bg);overflow:hidden}
.sn-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--g1),var(--g2));border-radius:99px}
.sn-bar.warn i{background:var(--warn)}.sn-bar.full i{background:var(--err)}
.sn-collapse{display:flex;align-items:center;gap:11px;padding:7px 10px;color:var(--mut);justify-content:flex-start;border:0;background:none;font:inherit;cursor:pointer;border-radius:9px}
.sn-collapse:hover{background:var(--bg);color:var(--fg)}.sn-collapse i{width:20px;text-align:center;transition:transform .2s}
.scrim{display:none}
/* Kopfleiste */
.topbar{display:flex;align-items:center;gap:12px;min-height:var(--tb-h);padding:0 18px;background:var(--card)}
@supports(background:color-mix(in srgb,red,blue)){.topbar{background:color-mix(in srgb,var(--card) 86%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}}
.topbar .burger{display:none;margin:0}
.crumb{display:flex;align-items:center;gap:8px;color:var(--mut);font-size:14px;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.crumb b{color:var(--fg);overflow:hidden;text-overflow:ellipsis}.crumb i{font-size:9px;opacity:.6}
kbd{font:600 11px ui-monospace,Consolas,monospace;padding:2px 6px;border-radius:6px;border:1px solid var(--bd);background:var(--card);color:var(--mut)}
.cmdk-btn{margin-left:auto;display:flex;align-items:center;gap:10px;min-width:280px;padding:8px 12px;border-radius:10px;background:var(--bg);border:1px solid var(--bd);color:var(--mut);font:inherit;cursor:pointer;box-shadow:none;transition:border-color .15s,color .15s}
.cmdk-btn:hover{border-color:var(--g1);color:var(--fg)}.cmdk-btn kbd{margin-left:auto}
.gw{display:inline-flex;align-items:center;gap:6px;color:var(--mut);font-size:13px;padding:6px 8px;border-radius:8px;white-space:nowrap}
.gw:hover{background:var(--bg);text-decoration:none;color:var(--fg)}.gw i{font-size:9px}
.gw-ok i{color:var(--ok)}.gw-warn i{color:var(--warn)}.gw-down i{color:var(--err);animation:gwpulse 1.4s infinite}
@keyframes gwpulse{50%{opacity:.35}}
.avatar{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:linear-gradient(135deg,var(--g1),var(--g2));color:#fff;font-weight:700;font-size:13px}
.topbar .dd-btn{padding:4px 8px}
/* Befehlspalette */
dialog.cmdk{width:min(620px,94vw);max-height:72vh;margin:11vh auto auto;padding:0;border:1px solid var(--bd);border-radius:16px;background:var(--card);color:var(--fg);box-shadow:0 40px 90px -20px rgba(0,0,0,.7);overflow:hidden}
dialog.cmdk[open]{display:flex;flex-direction:column}
dialog.cmdk::backdrop{background:rgba(8,10,18,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.cmdk-head{display:flex;align-items:center;gap:10px;padding:10px 16px;border-bottom:1px solid var(--bd)}
.cmdk-head i{color:var(--mut)}
dialog.cmdk .cmdk-head input{flex:1;min-width:0;border:0;background:none;color:var(--fg);font:inherit;font-size:16px;outline:0;padding:8px 0;box-shadow:none;margin:0}
.cmdk-list{overflow:auto;padding:8px;flex:1;overscroll-behavior:contain}
.cmdk-gh{padding:10px 10px 4px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--mut)}
.cmdk-it{display:flex;align-items:center;gap:12px;padding:9px 10px;border-radius:9px;cursor:pointer}
.cmdk-it i{width:20px;text-align:center;color:var(--mut)}.cmdk-it small{margin-left:auto;color:var(--mut)}
.cmdk-it.sel{background:linear-gradient(135deg,rgba(124,58,237,.2),rgba(6,182,212,.16))}.cmdk-it.sel i{color:var(--ac)}
.cmdk-it mark{background:none;color:var(--ac);font-weight:700}
.cmdk-empty{padding:26px 12px;text-align:center;color:var(--mut)}
.cmdk-foot{display:flex;gap:16px;flex-wrap:wrap;padding:8px 14px;border-top:1px solid var(--bd);color:var(--mut);font-size:12px}
.cmdk-foot kbd{margin-right:3px}
.tabbar{display:none}
@media(min-width:992px){
  .snav-c .sidenav{width:var(--sn-wc);flex-basis:var(--sn-wc)}
  .snav-c .si-l,.snav-c .sn-gh{display:none}
  .snav-c .sn-top{justify-content:center;padding-inline:0}
  .snav-c .sn-mode{grid-template-columns:1fr}
  .snav-c .si,.snav-c .sn-collapse,.snav-c .sn-cta,.snav-c .sn-mode a{justify-content:center;padding-inline:0}
  .snav-c .si-b{position:absolute;top:3px;right:9px;min-width:9px;height:9px;padding:0;font-size:0;border-radius:50%}
  .snav-c .si.on::before{left:-10px}
  .snav-c .sn-collapse i{transform:rotate(180deg)}
  .snav-c .sn-use .si-l{display:none}
  .snav-c .sn-gh+.si,.snav-c .sn-group+.sn-group{margin-top:6px}
}
@media(max-width:991px){
  .sidenav{position:fixed;left:0;top:0;bottom:0;height:auto;width:min(300px,86vw);flex-basis:auto;transform:translateX(-104%);z-index:60;transition:transform .22s ease;border-right:1px solid var(--bd)}
  html.snav-open .sidenav{transform:none;box-shadow:0 0 70px rgba(0,0,0,.55)}
  html.snav-open .scrim{display:block;position:fixed;inset:0;z-index:55;background:rgba(8,10,18,.55);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
  .sn-close{display:inline-flex}.sn-collapse{display:none}
  .topbar{padding:0 12px;gap:8px}.topbar .burger{display:inline-flex}
  .crumb .cr-g,.crumb .fa-chevron-right{display:none}
  .cmdk-btn{min-width:0;padding:8px 11px}.cb-t,.cmdk-btn kbd{display:none}
  .gw-t,.topbar .uname{display:none}
  body.has-shell{padding-bottom:calc(66px + env(safe-area-inset-bottom))}
  .tabbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:50;background:var(--card);border-top:1px solid var(--bd);padding:4px 6px calc(4px + env(safe-area-inset-bottom));box-shadow:0 -10px 30px -18px rgba(0,0,0,.6)}
  .tabbar a,.tabbar button{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:6px 2px;border:0;background:none;box-shadow:none;border-radius:10px;color:var(--mut);font:inherit;font-size:11px;font-weight:600;cursor:pointer}
  .tabbar a i,.tabbar button i{font-size:18px;margin:0}
  .tabbar a.on{color:var(--ac)}.tabbar a:hover,.tabbar button:hover{text-decoration:none;color:var(--fg);transform:none;filter:none}
  .tabbar .tb-mid{flex:0 0 58px;height:50px;margin-top:-16px;align-self:flex-start;border-radius:16px;background:linear-gradient(135deg,var(--g1),var(--g2));color:#fff;box-shadow:0 12px 24px -10px rgba(124,58,237,.9)}
  .tabbar .tb-mid i{font-size:20px}.tabbar .tb-mid.on,.tabbar .tb-mid:hover{color:#fff;filter:brightness(1.1)}
  .shell-main>main.side-layout{max-width:1060px}
  dialog.cmdk{margin-top:6vh}
}
@media(prefers-reduced-motion:reduce){.sidenav,.gw-down i{transition:none;animation:none}}

/* Benutzermenü: Schaltflächen wie die Links gestalten */
.dd-menu>button{display:flex;align-items:center;gap:10px;width:100%;padding:9px 12px;border-radius:8px;color:var(--fg);background:none;border:0;box-shadow:none;font:inherit;font-weight:500;cursor:pointer;text-align:left;transform:none;filter:none}
.dd-menu>button:hover{background:var(--bg);transform:none;filter:none;box-shadow:none}
.dd-menu>button i{width:16px;text-align:center;color:var(--mut)}
.dd-menu>button kbd{margin-left:auto}

.dd.user .dd-menu{min-width:250px}.dd-menu>button kbd{white-space:nowrap}

/* Umschalter (wie Kunde | Admin) und aufgeräumter Footer */
.seg{display:inline-grid;grid-auto-flow:column;gap:4px;padding:4px;background:var(--card);border:1px solid var(--bd);border-radius:12px}
.seg a{display:flex;align-items:center;justify-content:center;gap:7px;padding:8px 18px;border-radius:9px;color:var(--mut);font-weight:600;font-size:14px}
.seg a:hover{color:var(--fg);text-decoration:none}
.seg a.on{background:var(--bg);color:var(--fg);box-shadow:0 1px 6px rgba(0,0,0,.2)}
main:not(.wide) .dev-seg{margin:0 0 14px}main:not(.wide) a.on:hover{text-decoration:none}
.foot{max-width:1060px;margin:0 auto;padding:44px 22px 24px;text-align:left;font-size:14px;color:var(--mut);border-top:1px solid var(--bd);margin-top:8px}
.foot-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:30px}
.foot-brand b{color:var(--fg);font-size:17px}.foot-brand p{margin:8px 0 0;max-width:260px;line-height:1.55}
.foot h4{margin:0 0 12px;font:700 12px ui-monospace,'SF Mono',Consolas,monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--fg)}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.foot a{color:var(--mut)}.foot a:hover{color:var(--fg)}
.foot-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-top:34px;padding-top:18px;border-top:1px solid var(--bd);font-size:13px}
.foot-tools{display:flex;align-items:center;gap:18px}
@media(max-width:820px){.foot-grid{grid-template-columns:1fr 1fr}.foot-brand{grid-column:1/-1}}
@media(max-width:420px){.foot-grid{grid-template-columns:1fr}.foot{padding-top:32px}}

/* API-Dokumentation: Vor/Zurück unter jeder Seite */
.docs-pager{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:22px}
.docs-pager a{display:grid;gap:3px;padding:14px 16px;border:1px solid var(--bd);border-radius:12px;background:var(--card);color:var(--fg);transition:border-color .15s,transform .15s}
.docs-pager a:hover{border-color:var(--g1);text-decoration:none;transform:translateY(-1px)}
.docs-pager small{color:var(--mut);font-size:12px;text-transform:uppercase;letter-spacing:.06em}
.docs-pager .next{text-align:right;grid-column:2}
main.side-layout>.docs-main{grid-column:2}
@media(max-width:860px){.docs-pager{grid-template-columns:1fr}.docs-pager .next{grid-column:1}}

.dev-seg{justify-self:start}

/* Integrationen: Kachelübersicht */
.int-gh{margin:26px 0 10px;font-size:15px;color:var(--mut);text-transform:uppercase;letter-spacing:.06em}
.int-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.int-tile{display:grid;gap:6px;align-content:start;padding:16px;border:1px solid var(--bd);border-radius:12px;background:var(--card);color:var(--fg);transition:border-color .15s,transform .15s}
.int-tile:hover{border-color:var(--g1);text-decoration:none;transform:translateY(-1px)}
.int-tile i{color:var(--g1);font-size:20px}
.int-tile span{color:var(--mut);font-size:13px;line-height:1.45}

/* Nach-oben-Button */
.totop{position:fixed;right:16px;bottom:18px;z-index:45;width:44px;height:44px;border-radius:50%;border:1px solid var(--bd);background:var(--card);color:var(--fg);box-shadow:0 10px 24px -12px rgba(0,0,0,.6);cursor:pointer;display:grid;place-items:center;padding:0;opacity:0;transform:translateY(8px);pointer-events:none;transition:opacity .2s,transform .2s,border-color .15s}
.totop.show{opacity:1;transform:none;pointer-events:auto}
.totop:hover{border-color:var(--g1);filter:none;transform:translateY(-2px)}
.totop[hidden]{display:none}
@media(max-width:860px){.totop{bottom:calc(76px + env(safe-area-inset-bottom));right:12px}}

/* Gast-Kopfzeile: mehr Menüpunkte, mobil ohne Icons */
@media(min-width:701px){header .bar:has(.guestnav) .grow{flex:0 0 12px}header .bar:has(.guestnav) .guestnav{margin-right:auto}}
@media(max-width:700px){.guestnav{gap:4px;overflow-x:auto;justify-content:space-between}.guestnav i{display:none}.guestnav a{padding:6px 8px;font-size:14px}}
@media(max-width:700px){.guestnav{overflow:visible;gap:0}.guestnav a{padding:6px 5px;font-size:13px}}

/* Admin: Systemzustand */
.sys-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px;margin:12px 0}
.sys-tile{background:var(--bg);border:1px solid var(--bd);border-radius:12px;padding:13px 14px;display:grid;gap:5px;align-content:start;min-width:0}
.sys-k{color:var(--mut);font-size:12.5px;text-transform:uppercase;letter-spacing:.05em}
.sys-tile b{font-size:26px;line-height:1.1}.sys-tile small{color:var(--mut);font-size:12.5px;line-height:1.4}
b.sys-ok{color:var(--ok)}b.sys-warn{color:var(--warn)}b.sys-err{color:var(--err)}b.sys-mut{color:var(--mut)}
.sys-bar{height:6px;border-radius:6px;background:var(--bd);overflow:hidden}.sys-bar i{display:block;height:100%;border-radius:6px;background:var(--ok)}
.sys-bar i.sys-warn{background:var(--warn)}.sys-bar i.sys-err{background:var(--err)}
.sys-spark{width:100%;height:30px;color:var(--ac)}
.sys-svc{display:flex;flex-wrap:wrap;gap:8px}

/* Status-Seite: Verfügbarkeit der letzten 30 Tage */
.uptime{display:grid;grid-template-columns:repeat(30,1fr);gap:3px;height:38px}
.uptime i{border-radius:3px;background:var(--bd);min-width:0}
.u-ok{background:var(--ok)}.u-warn{background:var(--warn)}.u-err{background:var(--err)}.u-none{background:var(--bd)}
.uptime i:hover{filter:brightness(1.2);outline:1px solid var(--fg)}
.uptime-axis{display:flex;justify-content:space-between;color:var(--mut);font-size:12px;margin-top:6px}
.u-key{display:inline-block;width:10px;height:10px;border-radius:2px;margin:0 4px 0 12px;vertical-align:-1px}.u-key:first-child{margin-left:0}
.uptime i.u-ok{background:var(--ok)}.uptime i.u-warn{background:var(--warn)}.uptime i.u-err{background:var(--err)}