/* Gemeinsame Gestaltung aller Cockpit-Apps. Nur Darstellung, keine Fachlogik.
   Referenz: marineblaue Arbeitsflaeche, Schiefer-Seitenleiste, Cyan und Pastell. */
:root,:root[data-theme="dark"] {
 color-scheme:dark;
 --bg:#101625;--bg-tint:#1c2836;--bg-subtle:#1c2836;--bg-card:#151e2e;--surface:#151e2e;
 --bg-elev:#233244;--surface-hover:#233244;--bg-active:#2d3e50;--surface-active:#2d3e50;
 --text:#edf3fa;--text-muted:#b1bfd0;--text-subtle:#8f9fb5;--text-2:#b1bfd0;--text-3:#8f9fb5;
 --border:#2a3649;--border-strong:#3a4960;
 --accent:#b7e7ee;--accent-hover:#d4f4f7;--accent-soft:#233e4b;--accent-ring:#628993;
 --danger:#ff8f97;--danger-soft:#432736;--success:#a7d7b6;--success-soft:#243b34;--warning:#ffcb92;--warning-soft:#45372b;
 --status-good:#a7d7b6;--status-warning:#f5d790;--status-serious:#ffc18a;--status-critical:#ff8f97;
 --viz-1:#b7e7ee;--viz-2:#ffc58a;--viz-3:#c5e7a4;--viz-4:#ccb8f2;--viz-5:#e7aecf;--viz-6:#70b9a7;--viz-7:#8da9e9;--viz-8:#f18c97;
 --viz-series:#b7e7ee;--viz-axis:#9bacbf;--viz-grid:#2a3649;--viz-muted:#a4b2c4;
 --radius-sm:8px;--radius:12px;--radius-lg:18px;
 --shadow-sm:0 4px 16px #0000000d;--shadow-md:0 12px 32px #0000001a;--shadow-lg:0 20px 60px #00000055;
 --shadow-card:0 4px 16px #0000000d;--shadow-card-hover:0 8px 24px #00000022;--shadow-pop:0 18px 50px #00000066;
 --sidebar-w:236px;--topbar-h:72px;
}
:root[data-theme="light"] {
 color-scheme:light;--bg:#f2f5f9;--bg-tint:#e5edf3;--bg-subtle:#e5edf3;--bg-card:#fff;--surface:#fff;
 --bg-elev:#e4edf2;--surface-hover:#e4edf2;--bg-active:#d8e8ee;--surface-active:#d8e8ee;
 --text:#1b2c3f;--text-muted:#52667c;--text-subtle:#63758a;--text-2:#52667c;--text-3:#63758a;
 --border:#dbe3ec;--border-strong:#bccbd8;--accent:#246272;--accent-hover:#194b5b;--accent-soft:#dceef2;--accent-ring:#7cb2bf;
 --danger:#af3348;--danger-soft:#fbe7ec;--success:#257149;--success-soft:#e4f2e9;--warning:#9a591e;--warning-soft:#fcf0df;
 --status-good:#257149;--status-warning:#947015;--status-serious:#9a591e;--status-critical:#af3348;
 --viz-1:#28778b;--viz-2:#b56b25;--viz-3:#578335;--viz-4:#8462b3;--viz-5:#ad547e;--viz-6:#317c69;--viz-7:#526ca7;--viz-8:#b34855;
 --viz-series:#28778b;--viz-axis:#60748a;--viz-grid:#dbe3ec;--viz-muted:#60748a;
 --shadow-sm:0 4px 16px #20384b06;--shadow-card:0 4px 16px #20384b06;--shadow-pop:0 18px 50px #20384b22;
}
html,body{background:var(--bg);color:var(--text)}
body{font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.55;-webkit-font-smoothing:antialiased}
h1,h2,h3{letter-spacing:-.025em}h1,.page-title,main.content h1{font-size:30px;font-weight:650;line-height:1.25}
.topbar{height:72px;min-height:72px;padding:0 28px;background:var(--bg);border-bottom:1px solid var(--border);gap:12px}
.topbar .brand-top,.breadcrumb-text{font-size:17px;font-weight:650;letter-spacing:-.025em}.breadcrumb{color:var(--text);text-decoration:none}
.topbar-right,.topbar-actions{gap:8px}.topbar .btn--icon,.icon-btn{width:36px;height:36px;border:1px solid var(--border);border-radius:50%;color:var(--text-2)}
.topbar .btn--icon:hover,.icon-btn:hover{color:var(--accent);background:var(--accent-soft)}
.sidebar,.topnav{top:72px;height:calc(100dvh - 72px);width:236px;max-width:86vw;padding:20px 14px;background:var(--bg-tint);border-right:1px solid var(--border);box-shadow:none}
.sidebar a,.topnav .topnav-item{min-height:42px;padding:11px 13px;border-radius:9px;color:var(--text-2);font-size:14px;text-decoration:none;gap:10px}
.sidebar a.active,.topnav .topnav-item.is-active{color:var(--text);background:var(--bg-active);font-weight:600}
.sidebar a:hover,.topnav-item:hover{color:var(--text);background:var(--bg-elev)}
.topnav-sep{background:var(--border);margin:18px 0}.sidebar a.cross-app{border-color:var(--border)}
.nav-scrim{inset:72px 0 0;background:#030a16aa;backdrop-filter:blur(3px)}
.modern-marke{display:flex!important;align-items:center;gap:10px;font-size:18px!important;font-weight:700;letter-spacing:-.03em;margin:0 0 22px!important;padding:6px 12px 22px!important;border-bottom:1px solid var(--border);border-radius:0!important;color:var(--text)!important}
.modern-marke::before{content:none!important}.modern-marke span{display:grid;place-items:center;width:28px;height:28px;border-radius:9px;color:#152a36;background:var(--accent);font-size:18px}
main.content,.page,.page-wide{padding:32px 32px 64px;max-width:1480px;min-width:0;width:100%;box-sizing:border-box}
.page{max-width:1100px}.page-sub{color:var(--text-2);margin-top:10px}.page-title{margin-bottom:0}
main.content>header{padding-bottom:0;border:0;margin-bottom:28px}.toolbar{padding:18px 28px;background:var(--bg);border-color:var(--border);min-height:64px;height:auto;flex-wrap:wrap}
.card,.stat-card,.agent-card,.chart-card,.kpi-card,.summary-card,.cockpit-karte{background:var(--surface);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow-card)}
.card,.agent-card{padding:22px}.board .card{padding:14px;border-radius:12px}.stat-card{padding:22px}.stat-card .val{font-weight:650;letter-spacing:-.035em}.stat-card .lab{color:var(--text-2);font-size:13px;margin-bottom:12px}
.section-head h2,.panel-head h2{font-size:16px;font-weight:600}.section-head{margin-bottom:20px}
.table,.data-table{border-collapse:separate;border-spacing:0}.table th,.data-table th{background:var(--bg-tint);color:var(--text-2);font-size:12px;font-weight:550;padding:12px}.table td,.data-table td{padding:12px;border-color:var(--border)}
.table tbody tr:hover,.data-table tbody tr:hover{background:var(--surface-hover)}
.input,.select,textarea,input:not([type=checkbox]):not([type=radio]):not([type=color]):not([type=range]):not([type=file]),select{background-color:var(--bg);color:var(--text);border:1px solid var(--border-strong);border-radius:9px;min-height:38px}
.input:focus,input:focus,textarea:focus,select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
label,.field>span{color:var(--text-2)}
.btn,button.primary,button.subtle,button.small{border-radius:9px}.btn--primary,button.primary,.primary{background:var(--accent);border-color:var(--accent);color:#10212c;font-weight:600}
:root[data-theme="light"] :is(.btn--primary,button.primary,.primary){color:#fff}
.btn--primary:hover,button.primary:hover{background:var(--accent-hover);border-color:var(--accent-hover)}
.btn--danger,button.danger{color:var(--danger)}
.modal,.modal-panel,.dialog{background:var(--surface);color:var(--text);border-color:var(--border);border-radius:18px}.modal-overlay,.modal-backdrop{backdrop-filter:blur(5px)}
.dropdown,.popover,.menu{background:var(--surface);border-color:var(--border);border-radius:12px;box-shadow:var(--shadow-pop)}
.cockpit-raster{gap:20px}.cockpit-karte{min-height:150px;padding:28px;position:relative;transition:background .15s,border-color .15s}.cockpit-karte:hover{background:var(--bg-elev);border-color:var(--accent)}
.cockpit-symbol{display:grid;place-items:center;background:var(--accent-soft);width:48px;height:48px;border-radius:14px;font-size:25px}.cockpit-kartentext h2{font-size:19px;margin-bottom:8px}.cockpit-pfeil{color:var(--accent)}
.cockpit-passwort{background:var(--surface);border:1px solid var(--border);border-radius:18px;padding:28px;max-width:540px}.cockpit-beschreibung{color:var(--text-2)}
.auth,.login-wrapper{background:radial-gradient(ellipse at 15% 10%,#6ec6d41a,transparent 55%),var(--bg);min-height:100dvh;padding:32px 20px}
.auth-card,.login-card{background:var(--surface);color:var(--text);border:1px solid var(--border-strong);border-radius:22px;box-shadow:0 24px 80px #00000033;width:440px;max-width:100%;padding:40px}
.auth-logo{background:var(--accent-soft);color:var(--accent);border-radius:14px;width:48px;height:48px}.auth-card h1,.login-card h1{font-size:28px}.auth-sub,.login-card .subtitle{color:var(--text-2);line-height:1.6}.auth-card .input,.login-card input{min-height:44px}.auth-card .btn--primary,.login-card button{height:44px}
.pipe,.cron-item{border-color:var(--border)}.pipe .log,.cron-item{background:var(--bg)}.svc-chip{box-shadow:none}.board{background:var(--bg)}
@media(min-width:1200px){
 body:has(.sidebar),body:has(.topnav){padding-left:236px}
 .sidebar,.topnav{top:0;height:100dvh;transform:none!important;z-index:80;padding-top:28px}
 .nav-toggle{display:none!important}.nav-scrim{display:none!important}
 .topbar{padding-inline:32px}.board{max-width:100%}
}
@media(max-width:1199px){.modern-marke{margin-bottom:12px!important}.sidebar,.topnav{z-index:80}.nav-scrim{z-index:70}.topbar{z-index:65}}
@media(max-width:700px){
 .topbar{height:64px;min-height:64px;padding:0 12px;gap:8px}.topbar-right,.topbar-actions{gap:4px}.topbar .brand-top,.breadcrumb-text{font-size:15px}
 .sidebar,.topnav{top:64px;height:calc(100dvh - 64px)}.nav-scrim{inset:64px 0 0}
 main.content,.page,.page-wide{padding:24px 16px 48px}.toolbar{padding:14px 16px;gap:8px}
 h1,.page-title,main.content h1{font-size:25px}.card,.stat-card,.agent-card{padding:18px;border-radius:14px}.board .card{padding:12px}
 .cockpit-raster{gap:12px}.cockpit-karte{min-height:112px;padding:20px}.cockpit-symbol{width:42px;height:42px;border-radius:12px;font-size:22px}.cockpit-kartentext h2{font-size:17px}.cockpit-passwort{padding:22px}
 .auth-card,.login-card{padding:28px 24px;border-radius:18px}.input,input:not([type=checkbox]):not([type=radio]):not([type=color]):not([type=range]),select,textarea{font-size:16px}.btn--primary,button.primary{min-height:42px}
 .pipe .ph,.cron-name{flex-wrap:wrap}.pipe .ph .sched,.cron-sched{white-space:normal}.updated{white-space:normal}
}
@media(prefers-reduced-motion:reduce){.cockpit-karte{transition:none}}
.modern-marke{text-decoration:none!important}.topnav-item[href="/"]{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7'%3E%3Crect x='3' y='3' width='7' height='7' rx='1'/%3E%3Crect x='14' y='3' width='7' height='7' rx='1'/%3E%3Crect x='3' y='14' width='7' height='7' rx='1'/%3E%3Crect x='14' y='14' width='7' height='7' rx='1'/%3E%3C/svg%3E")}
.topnav-item[href="/einstellungen.html"]{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7'%3E%3Cpath d='M4 3v18M12 3v18M20 3v18M1 8h6M9 16h6M17 9h6'/%3E%3C/svg%3E")}
.rund-btn.senden.aktiv{color:#10212c}.cockpit-symbol svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.cockpit-symbol{color:var(--accent)}
.auth-card,.login-card{box-sizing:border-box;width:min(440px,calc(100vw - 40px));min-width:0}
:root[data-theme="light"] .modern-marke span{color:#fff}