:root{
  --navbg:#ffffff; --navink:#0f172a; --muted:#64748b; --pill:#f1f5f9; --ring:#e5e7eb; --accent:#0ea5e9; --danger:#cf102d;
}
*{box-sizing:border-box}
body{margin:0;background:#f6f7f8;color:var(--navink);font:15px/1.45 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}

/* Topbar */
.topbar{position:sticky;top:0;z-index:1000;background:var(--navbg);border-bottom:1px solid var(--ring)}
.topbar .wrap{max-width:1180px;margin:0 auto;padding:.6rem 1rem;display:flex;align-items:center;gap:.75rem}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:inherit}
.brand img{height:40px;width:auto;border-radius:4px;display:block}
.brand .title{font-weight:800;letter-spacing:.2px}

.nav{margin-left:auto;display:flex;align-items:center;gap:.5rem}
.tab{display:inline-flex;align-items:center;gap:.4rem;padding:.52rem .9rem;border-radius:999px;text-decoration:none;background:var(--pill);color:var(--navink);border:1px solid var(--ring);font-weight:600;transition:background .15s ease, color .15s ease, border-color .15s ease}
.tab:hover{background:#e2e8f0}
.tab.active{background:var(--accent);border-color:var(--accent);color:#fff}
.tab.active:hover{filter:brightness(.92)} /* dunkler Hover für aktive Tabs */
.tab.danger{background:var(--danger);border-color:var(--danger);color:#fff}
.tab.danger:hover{filter:brightness(.92)}
.spacer{width:.25rem}

/* Burger-Menü */
.burger{display:none;margin-left:auto;background:transparent;border:1px solid var(--ring);border-radius:10px;padding:.45rem .6rem;cursor:pointer}
@media (max-width:860px){
  .burger{display:inline-flex}
  .nav{position:fixed;right:12px;top:64px;background:#fff;border:1px solid var(--ring);border-radius:12px;box-shadow:0 12px 30px rgba(0,0,0,.12);padding:.5rem;flex-direction:column;gap:.4rem;display:none;min-width:220px}
  .nav.open{display:flex}
  .tab{width:100%;justify-content:flex-start}
}

/* Gemeinsames Layout für Karten/Container */
.container{max-width:1180px;margin:1rem auto;padding:0 1rem}
.card{background:#fff;border:1px solid var(--ring);border-radius:14px;box-shadow:0 2px 6px rgba(0,0,0,.05);padding:1rem}
.hstack{display:flex;align-items:center;justify-content:space-between;gap:.75rem}
.label{font-size:.85rem;color:var(--muted)}
.input, select, textarea, button{font:inherit}
.input, select, textarea{width:100%;padding:.6rem .7rem;border:1px solid var(--ring);border-radius:10px}
.input:focus, select:focus, textarea:focus, button:focus{outline:3px solid rgba(14,165,233,.18);border-color:#cbd5e1}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:.7rem 1rem;border-radius:10px;border:1px solid var(--accent);background:var(--accent);color:#fff;cursor:pointer}
.btn.danger{border-color:var(--danger);background:var(--danger)}
.btn.ghost{background:#fff;color:var(--navink);border-color:var(--ring)}

/* Admin/Analyse: Textarea vollbreit + dynamisch */
textarea.autosize{width:100%;min-height:240px;resize:vertical}