/* Gedeelde opmaak voor /dash en /channels. Donker en licht thema via data-thema op ; de knop rechtsboven wisselt. */ :root, html[data-thema="light"] { --top:#1d2127; --top-2:#282d34; --accent:#0088cc; --accent-2:#00a5e5; --ok:#2fb344; --warn:#f0ad4e; --bad:#d9534f; --page:#f2f4f7; --card:#ffffff; --line:#e3e7ec; --tekst:#3b4149; --zacht:#8a929c; --raster:rgba(0,0,0,.08); } html[data-thema="dark"] { --top:#0f1215; --top-2:#1b2026; --accent:#0aa2e0; --accent-2:#3cc4ff; --ok:#3ecf5b; --warn:#f5b942; --bad:#e4635f; --page:#12161a; --card:#1a1f25; --line:#2a3138; --tekst:#dde3ea; --zacht:#8b95a1; --raster:rgba(255,255,255,.09); } *{box-sizing:border-box} body{margin:0;background:var(--page);color:var(--tekst); font-family:"Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-size:14px; transition:background .2s,color .2s} header.top{background:var(--top);color:#fff;display:flex;align-items:center; padding:0 22px;height:58px;box-shadow:0 2px 6px rgba(0,0,0,.18)} header.top .merk{font-weight:700;letter-spacing:.5px;font-size:17px;display:flex;align-items:center;gap:10px} header.top .merk .blok{background:var(--accent);border-radius:5px;padding:4px 9px;font-size:13px} header.top nav{margin-left:34px;display:flex;gap:6px} header.top nav a{color:#c6ccd4;text-decoration:none;padding:8px 14px;border-radius:5px;font-size:13px} header.top nav a.actief,header.top nav a:hover{background:var(--top-2);color:#fff} header.top .rechts{margin-left:auto;display:flex;align-items:center;gap:14px;font-size:12px;color:#9aa3ad} .themaknop{background:var(--top-2);border:1px solid rgba(255,255,255,.14);color:#dfe5ec; border-radius:6px;padding:6px 12px;font-size:12px;cursor:pointer;display:flex; align-items:center;gap:7px} .themaknop:hover{background:var(--accent);color:#fff;border-color:transparent} .puls{width:9px;height:9px;border-radius:50%;background:var(--ok);animation:puls 1.6s infinite} @keyframes puls{0%,100%{opacity:1}50%{opacity:.25}} main{padding:22px;max-width:1200px;margin:0 auto} .kaart{background:var(--card);border:1px solid var(--line);border-radius:7px; box-shadow:0 1px 2px rgba(16,24,40,.05);overflow:hidden} .kaart h2{margin:0;padding:12px 16px;font-size:13px;font-weight:600;color:var(--zacht); border-bottom:1px solid var(--line);text-transform:uppercase;letter-spacing:.6px} .kaart .body{padding:16px} .pil{display:inline-block;padding:2px 8px;border-radius:11px;font-size:11px;font-weight:600} .leeg{color:var(--zacht);padding:14px 0;text-align:center} footer{color:var(--zacht);font-size:12px;text-align:center;padding:18px}