/* zplCore Server page (/server/, /de/server/): architecture diagram, flowcharts, logo wall, feature blocks.
Plain CSS next to the precompiled /css/site.css (no new Tailwind classes needed). Theme: :root[data-theme="dark"] (/js/theme.js). */
:root{
--sv-fg:#1c2b40;--sv-muted:#5b6475;--sv-line:#e2e8f0;--sv-panel:#fff;--sv-soft:#f8fafc;--sv-accent:#c2570a;
--sv-g:#f8fafc;--sv-gl:#dbe2ec;--sv-n:#fff;--sv-nl:#94a3b8;--sv-c:#fff7ed;--sv-cl:#f0a060;
--sv-st:#eef4ff;--sv-stl:#7c9fd8;--sv-ok:#ecfdf3;--sv-okl:#4ead78;--sv-okt:#166534;
--sv-x:#fef2f2;--sv-xl:#e08a8a;--sv-xt:#991b1b;--sv-r:#fffbeb;--sv-rl:#d6a54a;
--sv-d:#f5f3ff;--sv-dl:#9b8bd6;--sv-e:#7a8699;--sv-lbg:#f6f7f9;--sv-sp:#f0a060;
--sv-tile:#fff;--sv-tile-l:#e2e8f0
}
:root[data-theme="dark"]{
--sv-fg:#e2e8f0;--sv-muted:#9aa8bd;--sv-line:rgba(255,255,255,.1);--sv-panel:#111a2e;--sv-soft:rgba(255,255,255,.03);--sv-accent:#f59a4a;
--sv-g:rgba(255,255,255,.025);--sv-gl:rgba(255,255,255,.13);--sv-n:#16213a;--sv-nl:#55657f;--sv-c:#2a2130;--sv-cl:#c9824a;
--sv-st:#17284a;--sv-stl:#5a7cc0;--sv-ok:#10291f;--sv-okl:#3a8f60;--sv-okt:#86efac;
--sv-x:#2e1519;--sv-xl:#a85a5a;--sv-xt:#fca5a5;--sv-r:#2b2414;--sv-rl:#a8833c;
--sv-d:#211d3a;--sv-dl:#7a6cc0;--sv-e:#8b98ad;--sv-lbg:#0b1120;--sv-sp:#c9824a;
--sv-tile:#fff;--sv-tile-l:rgba(255,255,255,.14)
}
/* ---------- sections ---------- */
.sv-sec{padding-top:3rem;padding-bottom:1rem}
.sv-sec>.wrap{border-top:1px solid var(--sv-line);padding-top:2.5rem}
@media (min-width:640px){.sv-sec{padding-top:3.5rem}.sv-sec>.wrap{padding-top:3rem}}
.sv-sec h2{scroll-margin-top:7rem}
.sv-sub{margin:2.25rem 0 1rem;font-size:1.05rem}
.sv-p{color:var(--sv-muted);line-height:1.65;margin:1rem 0 0;max-width:72ch}
.sv-sec p a:not(.btn):not(.isv-badge),.sv-road a{color:var(--sv-accent);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px}
.sv-two{display:grid;gap:1.5rem;margin-top:1.75rem}
@media (min-width:1024px){.sv-two{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:2.5rem}}
.sv-two>*{min-width:0}
.sv-cards{display:grid;gap:1.25rem;margin-top:1.75rem}
@media (min-width:640px){.sv-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1024px){.sv-cards.c3{grid-template-columns:repeat(3,minmax(0,1fr))}}
.sv-cards .usp>p+p{margin-top:.6rem}
.sv-cards .usp ul{margin:.75rem 0 0;padding:0;list-style:none;display:grid;gap:.4rem;font-size:.9rem;line-height:1.5;color:var(--sv-muted)}
.sv-cards .usp li{position:relative;padding-left:1rem}
.sv-cards .usp li::before{content:"";position:absolute;left:0;top:.6em;width:6px;height:6px;border-radius:50%;background:var(--sv-accent)}
.sv-cards code,.sv-p code,.sv-tbl code,.sv-note code{overflow-wrap:anywhere}
/* status chips: tested / planned */
.sv-chip{display:inline-flex;align-items:center;gap:.35rem;border-radius:999px;padding:.15rem .6rem;font-size:.72rem;font-weight:600;line-height:1.4;white-space:nowrap;vertical-align:middle}
.sv-chip.ok{background:var(--sv-ok);color:var(--sv-okt);box-shadow:inset 0 0 0 1px var(--sv-okl)}
.sv-chip.pl{background:var(--sv-r);color:#92400e;box-shadow:inset 0 0 0 1px var(--sv-rl)}
:root[data-theme="dark"] .sv-chip.pl{color:#fcd34d}
.sv-chip.bt{background:var(--sv-st);color:var(--sv-fg);box-shadow:inset 0 0 0 1px var(--sv-stl)}
/* callout (fonts, honesty notes) */
.sv-note{margin:1.5rem 0 0;border-radius:14px;padding:1rem 1.1rem;background:var(--sv-r);box-shadow:inset 0 0 0 1px var(--sv-rl);color:var(--sv-fg);font-size:.93rem;line-height:1.6}
.sv-note b{display:block;margin-bottom:.25rem}
.sv-note p{margin:.4rem 0 0}
.sv-note.info{background:var(--sv-st);box-shadow:inset 0 0 0 1px var(--sv-stl)}
/* ---------- diagrams ---------- */
.sv-fig{margin:1.75rem 0 0;border-radius:18px;background:var(--sv-panel);box-shadow:0 0 0 1px var(--sv-line);padding:16px}
@media (min-width:640px){.sv-fig{padding:24px}}
.sv-fig figcaption{margin-top:.9rem;font-size:.8rem;color:var(--sv-muted);line-height:1.5}
.sv-svg{display:block;width:100%;height:auto;max-width:100%;font-family:inherit;overflow:visible}
.sv-lr{display:block}.sv-tb{display:none;max-width:420px;margin:0 auto}
@media (max-width:767.98px){.sv-lr{display:none}.sv-tb{display:block}}
.sv-svg text{fill:var(--sv-fg);font-size:13px}
.sv-svg .t{font-weight:600}
.sv-svg .s{fill:var(--sv-muted);font-size:11.5px}
.sv-svg .m{font-family:"Roboto Mono",ui-monospace,monospace}
.sv-svg .gt{font-size:11.5px;font-weight:700;letter-spacing:.08em;fill:var(--sv-muted)}
.sv-svg .gt.srv{font-size:15px;letter-spacing:0;fill:var(--sv-fg)}
.sv-svg .gs{font-size:11px;fill:var(--sv-muted)}
.sv-svg .g{fill:var(--sv-g);stroke:var(--sv-gl);stroke-width:1.2}
.sv-svg .n{fill:var(--sv-n);stroke:var(--sv-nl);stroke-width:1.2}
.sv-svg .c{fill:var(--sv-c);stroke:var(--sv-cl);stroke-width:1.3}
.sv-svg .st{fill:var(--sv-st);stroke:var(--sv-stl);stroke-width:1.2}
.sv-svg .ok{fill:var(--sv-ok);stroke:var(--sv-okl);stroke-width:1.2}
.sv-svg .x{fill:var(--sv-x);stroke:var(--sv-xl);stroke-width:1.2}
.sv-svg .r{fill:var(--sv-r);stroke:var(--sv-rl);stroke-width:1.2}
.sv-svg .d{fill:var(--sv-d);stroke:var(--sv-dl);stroke-width:1.2}
.sv-svg .xt{fill:var(--sv-xt)}
.sv-svg .okt{fill:var(--sv-okt)}
.sv-svg .e{fill:none;stroke:var(--sv-e);stroke-width:1.5}
.sv-svg .e.dash{stroke-dasharray:5 4}
.sv-svg .ah{fill:var(--sv-e)}
.sv-svg .sp{fill:none;stroke:var(--sv-sp);stroke-width:1.5;stroke-dasharray:2 4;stroke-linecap:round}
.sv-svg .lb{fill:var(--sv-lbg)}
.sv-svg .lt{font-size:11px;fill:var(--sv-muted)}
.sv-svg .mk-b{fill:#f59a4a;opacity:.16}
.sv-svg .mk-p{fill:none;stroke:#f59a4a;stroke-width:5;stroke-linecap:round}
.sv-flows{display:grid;gap:1.25rem;margin-top:1.75rem}
@media (min-width:768px){.sv-flows{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.sv-flows{grid-template-columns:repeat(3,minmax(0,1fr))}}
.sv-flow-card{display:flex;flex-direction:column;min-width:0;border-radius:18px;background:var(--sv-panel);box-shadow:0 0 0 1px var(--sv-line);padding:16px}
.sv-flow-card h3{margin:0 0 .35rem;font-size:1rem}
.sv-flow-card>p{margin:0 0 1rem;font-size:.88rem;line-height:1.55;color:var(--sv-muted)}
.sv-flow-card .sv-svg{max-width:370px;margin:0 auto}
.sv-legend{display:flex;flex-wrap:wrap;gap:.4rem 1rem;margin:1rem 0 0;padding:0;list-style:none;font-size:.78rem;color:var(--sv-muted)}
.sv-legend li{display:inline-flex;align-items:center;gap:.4rem}
.sv-legend i{display:inline-block;width:14px;height:10px;border-radius:3px;box-shadow:inset 0 0 0 1px var(--sv-nl);background:var(--sv-n)}
.sv-legend i.c{background:var(--sv-c);box-shadow:inset 0 0 0 1px var(--sv-cl)}
.sv-legend i.st{background:var(--sv-st);box-shadow:inset 0 0 0 1px var(--sv-stl);border-radius:6px}
.sv-legend i.ok{background:var(--sv-ok);box-shadow:inset 0 0 0 1px var(--sv-okl);border-radius:6px}
.sv-legend i.x{background:var(--sv-x);box-shadow:inset 0 0 0 1px var(--sv-xl);border-radius:6px}
.sv-legend i.r{background:var(--sv-r);box-shadow:inset 0 0 0 1px var(--sv-rl);border-radius:6px}
.sv-legend i.d{width:10px;height:10px;transform:rotate(45deg);background:var(--sv-d);box-shadow:inset 0 0 0 1px var(--sv-dl);border-radius:1px}
/* ---------- logo wall ---------- */
.sv-lw{display:grid;gap:1.25rem;margin-top:1.75rem}
@media (min-width:768px){.sv-lw{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.sv-lw{grid-template-columns:repeat(4,minmax(0,1fr))}}
.sv-lg{min-width:0;border-radius:16px;background:var(--sv-panel);box-shadow:0 0 0 1px var(--sv-line);padding:14px}
.sv-lg h3{margin:0 0 .7rem;font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--sv-muted)}
.sv-lg ul{list-style:none;margin:0;padding:0;display:grid;gap:.45rem}
.sv-lg li{display:flex;align-items:center;gap:.65rem;min-width:0;font-size:.88rem;line-height:1.3;color:var(--sv-fg)}
.sv-lg li small{display:block;font-size:.74rem;color:var(--sv-muted)}
.sv-lg li>span:last-child{min-width:0;overflow-wrap:anywhere}
.sv-li{flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:9px;background:var(--sv-tile);box-shadow:inset 0 0 0 1px var(--sv-tile-l)}
.sv-li img{display:block;width:22px;height:22px}
.sv-li.gen{background:var(--sv-soft);color:var(--sv-muted)}
.sv-li.gen svg{display:block;width:20px;height:20px}
.sv-tm{margin:1rem 0 0;font-size:.78rem;line-height:1.5;color:var(--sv-muted)}
.sv-tm a{color:inherit}
/* hero logo row: brand logos as ![]()
on white tiles (replaces the sprite