:root{
  --bg:#0b1020;
  --panel:#121a33;
  --panel2:#0f1630;
  --text:#e8ecff;
  --muted:#aab2d6;
  --accent:#6ee7ff;
  --accent2:#9b8cff;
  --border:rgba(255,255,255,.10);
  --shadow:0 10px 30px rgba(0,0,0,.35);
  --r:16px;
  --r2:22px;
  --font:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
body{
  margin:0; color:var(--text); font-family:var(--font);
  background: radial-gradient(1100px 600px at 25% 20%, rgba(155,140,255,.22), transparent 55%),
              radial-gradient(900px 500px at 80% 30%, rgba(110,231,255,.18), transparent 55%),
              linear-gradient(180deg,#070a14,var(--bg));
}
a{color:inherit; text-decoration:none}
.container{max-width:1200px; margin:0 auto; padding:24px}
.topbar{position:sticky; top:0; z-index:10; backdrop-filter:blur(10px); background:rgba(7,10,20,.65); border-bottom:1px solid var(--border)}
.topbar-inner{
  max-width:1200px; margin:0 auto; padding:14px 24px;
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  position:relative; /* für mittiges Logo */
}
.brand{display:flex; gap:12px; align-items:center; font-weight:800}
.brand small{display:block; color:var(--muted); font-weight:600}
.dot{width:10px; height:10px; border-radius:999px; background:linear-gradient(135deg,var(--accent),var(--accent2)); box-shadow:0 0 18px rgba(110,231,255,.35)}
.actions{display:flex; gap:10px; align-items:center; flex-wrap:wrap}
.badge{font-size:12px; padding:6px 10px; border-radius:999px; border:1px solid var(--border); color:var(--muted); background:rgba(255,255,255,.03)}
.btn{border:1px solid var(--border); background:rgba(255,255,255,.05); color:var(--text); padding:10px 14px; border-radius:999px; cursor:pointer; font-weight:700}
.btn:hover{background:rgba(255,255,255,.08)}
.btn.primary{background:linear-gradient(135deg, rgba(110,231,255,.20), rgba(155,140,255,.16)); border-color:rgba(110,231,255,.22)}

.mw-center-logo{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  height:50px;        /* <= kleiner als Button */
  max-height:50px;
  width:auto;
  opacity:.95;
  pointer-events:none;
}
@media (max-width: 900px){
  .mw-center-logo{ display:none; }
}

.layout{display:grid; grid-template-columns:280px 1fr; gap:18px; align-items:start}
.sidebar{position:sticky; top:76px; padding:14px; border-radius:var(--r2); border:1px solid var(--border); background:rgba(18,26,51,.72); box-shadow:var(--shadow)}
.main{padding:18px; border-radius:var(--r2); border:1px solid var(--border); background:rgba(18,26,51,.55); box-shadow:var(--shadow)}
.navtitle{font-size:12px; color:var(--muted); text-transform:uppercase; letter-spacing:.12em; margin:10px 10px}
.nav a{display:flex; gap:10px; align-items:center; padding:10px 12px; border-radius:14px; border:1px solid transparent}
.nav a:hover{background:rgba(255,255,255,.05); border-color:rgba(255,255,255,.08)}
.nav a.active{background:rgba(110,231,255,.10); border-color:rgba(110,231,255,.18)}
.icon{width:26px; height:26px; border-radius:10px; display:grid; place-items:center; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.08)}
.h1{font-size:26px; margin:0 0 10px}
.sub{color:var(--muted); margin:0 0 18px; line-height:1.45}
.grid{display:grid; grid-template-columns:repeat(12,1fr); gap:14px}
.card{padding:14px; border-radius:var(--r); border:1px solid var(--border); background:rgba(15,22,48,.65)}
.card h3{margin:0 0 10px; font-size:14px; color:var(--muted); font-weight:800}
.kpi{font-size:28px; font-weight:900}
.hr{height:1px; background:var(--border); margin:14px 0}
.row{display:flex; gap:10px; align-items:center; flex-wrap:wrap}
.pill{font-size:12px; padding:6px 10px; border-radius:999px; border:1px solid var(--border); background:rgba(255,255,255,.03); color:var(--muted)}
.pill.ok{border-color:rgba(74,222,128,.25); background:rgba(74,222,128,.10); color:#bff7d2}
.table{width:100%; border-collapse:separate; border-spacing:0; border:1px solid var(--border); border-radius:14px; overflow:hidden}
.table th,.table td{padding:10px 12px; border-bottom:1px solid var(--border); text-align:left; font-size:14px}
.table th{color:var(--muted); background:rgba(255,255,255,.03)}
.table tr:last-child td{border-bottom:none}
.input,select{width:100%; padding:11px 12px; border-radius:14px; border:1px solid var(--border); background:rgba(255,255,255,.03); color:var(--text)}
label{display:block; margin:0 0 6px; color:var(--muted); font-size:13px; font-weight:800}
.form{display:grid; gap:12px}
.notice{padding:10px 12px; border-radius:14px; border:1px solid var(--border); background:rgba(110,231,255,.07); color:#d6fbff}
.footer{color:var(--muted); font-size:12px; padding:12px 24px; text-align:center}
@media (max-width:980px){.layout{grid-template-columns:1fr}.sidebar{position:relative; top:auto}}