/* ══════════════════════════════════════════════
   RESET & TOKENS
══════════════════════════════════════════════ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
:root{
  --bd:#5C0F2F;--bx:#8B1A4A;--bm:#B8356A;--bp:#F5E0EA;
  --tp:#6B6458;--ink:#1A1614;--ch:#2E2926;--st:#F2EFE9;
  --sg:#E8C84A;--sgd:#C4A420;--wh:#FFFFFF;
  --so:#E8682A;--sod:#C44E18;--sob:#FDE8D8;  /* Sport Orange */
  --nb:#1A3C6E;--nbm:#2E5FAD;--nbl:#D0DCEF;  /* News Blue */
  --lb:#0D1F3C;--lbm:#1A3472;--lr:#E03C3C;   /* Live Blue + On-Air Red */
  --ub:#0E0B0A;--us:#1A1614;--u2:#251E1C;--u3:#1F1714;
  /* v0.5.105+ Welle 18 Folge — historischer Token-Alias: --u1 wurde an 7 Stellen genutzt, war aber nie definiert (fiel auf transparent zurück) → Modals/Cards waren durchscheinend. Alias auf --us. */
  --u1:#1A1614;
  --bo:rgba(255,255,255,0.08);--b2:rgba(255,255,255,0.14);--b3:rgba(255,255,255,0.22);
  --tx:#E8E2DC;--mu:rgba(232,226,220,0.45);--mi:rgba(232,226,220,0.22);
}
html,body{height:100%;overflow:hidden;}
body{font-family:'Montserrat',system-ui,sans-serif;background:var(--ub);color:var(--tx);display:flex;flex-direction:column;}

/* ══ NAV ══ */
.app-nav{height:52px;background:rgba(14,11,10,0.97);border-bottom:1px solid var(--bo);display:flex;align-items:center;padding:0 20px;gap:0;flex-shrink:0;z-index:100;}
.nav-brand{display:flex;align-items:center;gap:9px;margin-right:24px;}
.nav-dots{display:flex;flex-direction:column;gap:3px;}
.nav-dots span{display:block;height:4px;border-radius:1.5px;background:var(--bx);}
.nav-brand-text{font-size:15px;font-weight:800;color:#fff;letter-spacing:.04em;white-space:nowrap;}
.nav-version{font-size:9px;font-weight:600;letter-spacing:.1em;color:rgba(255,255,255,.3);padding:2px 6px;border:1px solid rgba(255,255,255,.12);border-radius:4px;margin-left:2px;}
/* v0.5.55 / v0.5.56 — Mode-Toggle Configurator ↔ Client */
.nav-mode-toggle{font-size:9px;font-weight:700;letter-spacing:.12em;color:#fff;background:#22C55E;padding:3px 9px;border-radius:4px;margin-left:6px;border:none;cursor:pointer;font-family:inherit;transition:all .15s;}
.nav-mode-toggle:hover{filter:brightness(1.15);}
body[data-mode="client"] .nav-mode-toggle{background:var(--bm);}
body[data-mode="client"] .nav-mode-toggle::before{content:"CLIENT";}
.nav-mode-toggle::before{content:"CONFIG";}
.nav-mode-toggle{font-size:0;}            /* hide raw text — pseudo-element shows label */
.nav-mode-toggle::before{font-size:9px;}
body[data-mode="client"] .config-only{display:none !important;}
body[data-mode="client"] .config-only-inline{display:none !important;}
body[data-mode="client"] .client-only,
body[data-mode="client"] .client-only-inline{display:inline-flex !important;}
.client-only,.client-only-inline{display:none;}
.tab-btns{display:flex;gap:2px;}
.tab-btn{font-family:'Montserrat',system-ui;font-size:12px;font-weight:600;letter-spacing:.04em;padding:6px 16px;border-radius:8px;border:none;background:transparent;color:var(--mu);cursor:pointer;transition:all .15s;}
.tab-btn:hover{color:var(--tx);}
.tab-btn.on{background:var(--u2);color:var(--tx);}
.nav-right{margin-left:auto;display:flex;align-items:center;gap:8px;}
.nav-pill{font-family:'Montserrat',system-ui;font-size:11px;font-weight:600;padding:5px 12px;border-radius:14px;border:1px solid var(--b2);background:transparent;color:var(--mu);cursor:pointer;transition:all .15s;}
.nav-pill:hover,.nav-pill.on{background:rgba(232,200,74,.12);border-color:var(--sg);color:var(--sg);}
/* v0.5.31 — Globaler LM-Studio-Status-Indikator (in jedem Tab sichtbar) */
.nav-lm{display:flex;align-items:center;gap:6px;font-size:10px;letter-spacing:.04em;padding:5px 10px;border-radius:14px;border:1px solid var(--b2);background:transparent;color:var(--mu);cursor:pointer;transition:all .15s;font-family:'Montserrat',system-ui;max-width:240px;overflow:hidden;}
.nav-lm:hover{border-color:var(--tx);color:var(--tx);}
.nav-lm .dot{width:7px;height:7px;border-radius:50%;background:var(--mu);flex-shrink:0;}
.nav-lm.ok{border-color:#16a34a44;color:#22c55e;}
.nav-lm.ok .dot{background:#22c55e;box-shadow:0 0 5px #22c55e88;}
.nav-lm.fail{border-color:#dc262644;color:#ef4444;}
.nav-lm.fail .dot{background:#ef4444;}
.nav-lm.checking .dot{background:#eab308;animation:sdAiPulse 1s ease-in-out infinite;}
/* v0.5.57 — Labels nehmen volle Content-Breite an statt mit ellipsis abzuschneiden */
.nav-lm-model{white-space:nowrap;}

/* ══ TAB PANELS ══ */
.tab-panel{flex:1;overflow:hidden;display:none;}
.tab-panel.on{display:flex;}

/* ══════════════════════════════════════════════
   TAB 3 — BRAND SETUP  v0.5.15 (Pane-System)
══════════════════════════════════════════════ */
#tab-brand{flex-direction:row;overflow:hidden;}

/* ── Innere Sidebar-Navigation ── */
.bs-nav{width:220px;flex-shrink:0;background:rgba(8,7,6,.98);border-right:1px solid var(--bo);display:flex;flex-direction:column;overflow:hidden;}
.bs-nav-header{padding:16px 16px 12px;border-bottom:1px solid var(--bo);flex-shrink:0;}
.bs-nav-logo-wrap{height:36px;display:flex;align-items:center;margin-bottom:8px;}
.bs-nav-logo-wrap img{max-height:32px;max-width:160px;object-fit:contain;}
.bs-nav-logo-placeholder{display:flex;gap:3px;align-items:center;}
.bs-nav-logo-placeholder span{display:block;height:4px;border-radius:2px;}
.bs-nav-title{font-size:13px;font-weight:800;color:#fff;letter-spacing:.01em;line-height:1.2;}
.bs-nav-title em{font-style:normal;}
.bs-nav-subtitle{font-size:9px;color:var(--mu);letter-spacing:.08em;margin-top:2px;}
.bs-nav-scroll{flex:1;overflow-y:auto;padding:10px 0;}
.bs-nav-group{padding:10px 0 4px;}
.bs-nav-group-label{font-size:9px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.22);padding:0 16px;margin-bottom:3px;}
.bs-nav-item{display:flex;align-items:center;gap:9px;padding:7px 16px;cursor:pointer;color:rgba(255,255,255,.5);font-size:12px;font-weight:500;transition:all .15s;border-left:2px solid transparent;position:relative;}
.bs-nav-item:hover{color:rgba(255,255,255,.85);background:rgba(255,255,255,.04);}
.bs-nav-item.on{color:#fff;border-left-color:var(--bm);background:rgba(255,255,255,.05);}
.bs-nav-item .nav-dot{width:6px;height:6px;border-radius:50%;background:var(--bo);flex-shrink:0;margin-left:auto;}
.bs-nav-item .nav-dot.filled{background:#22C55E;}
.bs-nav-item .nav-dot.partial{background:var(--sg);}
.bs-nav-footer{flex-shrink:0;padding:12px 14px;border-top:1px solid var(--bo);}
.bs-progress-label{font-size:9px;color:var(--mu);display:flex;justify-content:space-between;margin-bottom:5px;letter-spacing:.04em;}
.bs-progress-track{height:2px;background:rgba(255,255,255,.08);border-radius:1px;margin-bottom:10px;}
.bs-progress-fill{height:100%;background:var(--bm);border-radius:1px;transition:width .4s;}
.bs-footer-row{display:flex;gap:5px;margin-bottom:6px;}
.bs-select{background:var(--u2);border:1px solid var(--bo);border-radius:5px;color:var(--tx);font-size:10px;padding:5px 7px;outline:none;width:100%;}
.bs-lm-row{display:flex;align-items:center;gap:6px;font-size:9px;color:var(--mu);margin-top:6px;}
.bs-lm-dot{width:5px;height:5px;border-radius:50%;background:#EF4444;flex-shrink:0;}
.bs-lm-dot.ok{background:#22C55E;}

/* ── Content Area ── */
.bs-content{flex:1;overflow:hidden;display:flex;flex-direction:column;}
.bs-topbar{height:44px;border-bottom:1px solid var(--bo);display:flex;align-items:center;padding:0 20px;gap:10px;flex-shrink:0;background:rgba(12,11,10,.6);}
.bs-page-title{font-size:13px;font-weight:700;color:#fff;flex:1;}
.bs-pane{flex:1;overflow-y:auto;padding:20px 24px;display:none;}
.bs-pane.on{display:block;}

/* ── Gemeinsame Komponenten ── */
/* v0.5.63 — Live-Vorschau-Pane (alle 4 Formate als Mini-Stages) */
.bs-preview-toolbar{display:flex;align-items:center;gap:10px;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid var(--bo);flex-wrap:wrap;}
.bs-preview-toolbar-lbl{font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--mu);}
.bs-preview-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;}
.bs-preview-cell{display:flex;flex-direction:column;gap:6px;min-width:0;}
.bs-preview-meta{font-size:9.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--mu);}
.bs-preview-stage-wrap{position:relative;background:#0a0608;border:1px solid var(--bo);border-radius:6px;overflow:hidden;width:100%;display:flex;align-items:center;justify-content:center;}
.bs-preview-stage-wrap[data-aspect="16/9"]{aspect-ratio:16/9;}
.bs-preview-stage-wrap[data-aspect="1/1"]{aspect-ratio:1/1;}
.bs-preview-stage-wrap[data-aspect="4/5"]{aspect-ratio:4/5;}
.bs-preview-stage-wrap[data-aspect="9/16"]{aspect-ratio:9/16;max-width:240px;margin:0 auto;}
.bs-preview-stage{position:absolute;left:0;top:0;background:#fff;overflow:hidden;transform-origin:top left;box-shadow:0 4px 18px rgba(0,0,0,.45);}
/* v0.5.67 — Mini-Stage direkt im Chrome-Pane (Welle 7b) */
.bs-chrome-preview-stage-wrap{position:relative;background:#0a0608;border:1px solid var(--bo);border-radius:6px;overflow:hidden;width:100%;height:380px;display:flex;align-items:center;justify-content:center;}
.bs-chrome-preview-stage{position:absolute;left:0;top:0;background:#fff;overflow:hidden;transform-origin:top left;box-shadow:0 4px 18px rgba(0,0,0,.45);}
/* v0.5.69 — Welle 7d: Selektion + Resize-Handles auf Chrome-Elementen */
.bs-chrome-sel-overlay{position:absolute;border:2px solid #2bd1ff;box-shadow:0 0 0 1px rgba(0,0,0,.4);pointer-events:none;z-index:50;box-sizing:border-box;}
.bs-chrome-sel-handle{position:absolute;width:14px;height:14px;background:#fff;border:2px solid #2bd1ff;border-radius:50%;pointer-events:auto;box-sizing:border-box;}
.bs-chrome-sel-handle[data-dir="nw"]{left:-9px;top:-9px;cursor:nwse-resize;}
.bs-chrome-sel-handle[data-dir="n"]{left:50%;top:-9px;margin-left:-7px;cursor:ns-resize;}
.bs-chrome-sel-handle[data-dir="ne"]{right:-9px;top:-9px;cursor:nesw-resize;}
.bs-chrome-sel-handle[data-dir="w"]{left:-9px;top:50%;margin-top:-7px;cursor:ew-resize;}
.bs-chrome-sel-handle[data-dir="e"]{right:-9px;top:50%;margin-top:-7px;cursor:ew-resize;}
.bs-chrome-sel-handle[data-dir="sw"]{left:-9px;bottom:-9px;cursor:nesw-resize;}
.bs-chrome-sel-handle[data-dir="s"]{left:50%;bottom:-9px;margin-left:-7px;cursor:ns-resize;}
.bs-chrome-sel-handle[data-dir="se"]{right:-9px;bottom:-9px;cursor:nwse-resize;}
.bs-chrome-sel-tag{position:absolute;top:-22px;left:0;background:#2bd1ff;color:#000;font-size:10px;font-weight:700;padding:2px 6px;border-radius:3px;white-space:nowrap;pointer-events:none;letter-spacing:.04em;text-transform:uppercase;}
/* v0.5.72 — Background Designer Phase 1 */
.bs-bg-toolbar{display:flex;gap:6px;margin:14px 0 10px;flex-wrap:wrap;}
.bs-bg-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px;}
.bs-bg-card{background:var(--u1);border:1px solid var(--bo);border-radius:8px;overflow:hidden;display:flex;flex-direction:column;}
.bs-bg-preview{aspect-ratio:16/9;background:#fff;position:relative;}
.bs-bg-meta{padding:10px 12px;display:flex;flex-direction:column;gap:8px;background:rgba(255,255,255,.02);}
.bs-bg-row{display:flex;align-items:center;gap:6px;}
.bs-bg-row label{font-size:10px;color:var(--mu);min-width:54px;}
.bs-bg-name{flex:1;background:var(--u2);border:1px solid var(--bo);border-radius:4px;padding:4px 7px;font-size:11px;color:var(--tx);outline:none;font-family:inherit;}
.bs-bg-type-badge{font-size:9px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:rgba(184,53,106,.18);color:var(--bm);padding:2px 7px;border-radius:3px;}
.bs-bg-stops{display:flex;flex-direction:column;gap:4px;}
.bs-bg-stop{display:grid;grid-template-columns:30px 50px 1fr 16px;gap:6px;align-items:center;}
.bs-bg-stop input[type="number"]{background:var(--u2);border:1px solid var(--bo);border-radius:3px;padding:3px 4px;font-size:10px;color:var(--tx);text-align:right;font-family:monospace;outline:none;}
.bs-bg-stop input[type="text"]{background:var(--u2);border:1px solid var(--bo);border-radius:3px;padding:3px 6px;font-size:10px;color:var(--tx);outline:none;font-family:monospace;}
.bs-bg-stop button{background:transparent;border:1px solid var(--bo);border-radius:3px;color:var(--mu);font-size:11px;line-height:1;cursor:pointer;width:16px;height:18px;padding:0;}
.bs-bg-stop button:hover{color:#f87171;border-color:rgba(239,68,68,.5);}
.bs-bg-swatch{width:24px;height:18px;border:1px solid var(--bo);border-radius:3px;cursor:pointer;flex-shrink:0;}
.bs-bg-actions{display:flex;gap:6px;justify-content:flex-end;margin-top:4px;}
/* v0.5.79 — Layout-Library */
.bs-layouts-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px;margin-top:14px;}
.bs-layout-card{background:var(--u1);border:1px solid var(--bo);border-radius:8px;overflow:hidden;display:flex;flex-direction:column;}
.bs-layout-thumb{aspect-ratio:16/9;background:#f7f5f1;position:relative;overflow:hidden;}
.bs-layout-thumb-stage{position:absolute;left:0;top:0;background:#fff;overflow:hidden;transform-origin:top left;pointer-events:none;}
.bs-layout-meta{padding:8px 10px;display:flex;flex-direction:column;gap:6px;}
.bs-layout-name{flex:1;background:var(--u2);border:1px solid var(--bo);border-radius:4px;padding:4px 7px;font-size:11px;color:var(--tx);outline:none;font-family:inherit;}
.bs-layout-formats{display:flex;gap:3px;flex-wrap:wrap;}
.bs-layout-fmt-tag{font-size:8.5px;font-weight:700;letter-spacing:.04em;background:rgba(184,53,106,.14);color:var(--bm);padding:1px 5px;border-radius:3px;}
.bs-layout-actions{display:flex;gap:5px;}
.bs-layout-empty{grid-column:1/-1;color:var(--mu);font-size:11px;padding:24px;text-align:center;font-style:italic;line-height:1.6;}
.bs-chrome-fmt-btn{font-size:9.5px;font-weight:600;letter-spacing:.04em;padding:4px 8px;border-radius:4px;border:1px solid var(--bo);background:transparent;color:var(--mu);cursor:pointer;transition:all .12s;font-family:inherit;}
.bs-chrome-fmt-btn:hover{border-color:var(--bm);color:var(--tx);}
.bs-chrome-fmt-btn.on{background:var(--bm);border-color:var(--bm);color:#fff;}
.bs-card{background:var(--us);border:1px solid var(--bo);border-radius:10px;padding:16px 18px;margin-bottom:14px;}
.bs-card-title{font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--bm);margin-bottom:3px;}
.bs-card-desc{font-size:10px;color:var(--mu);line-height:1.5;margin-bottom:14px;}
.bs-divider{border:none;border-top:1px solid var(--bo);margin:14px 0;}
.bs-field{display:flex;flex-direction:column;gap:4px;margin-bottom:10px;}
.bs-field label{font-size:10px;color:var(--mu);font-weight:600;letter-spacing:.04em;}
.bs-input{background:var(--u2);border:1px solid var(--bo);border-radius:5px;color:var(--tx);font-size:12px;padding:7px 10px;width:100%;outline:none;font-family:'Montserrat',system-ui;transition:border .15s;}
.bs-input:focus{border-color:var(--bm);}
.bs-textarea{background:var(--u2);border:1px solid var(--bo);border-radius:5px;color:var(--tx);font-size:11px;padding:7px 10px;width:100%;outline:none;resize:vertical;font-family:'Montserrat',system-ui;min-height:60px;line-height:1.5;}
.bs-textarea:focus{border-color:var(--bm);}
.bs-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.bs-grid-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;}

/* v0.5.32 — Brand-Formen Pane */
.bs-shape-drop{border:2px dashed var(--bo);border-radius:10px;padding:28px 18px;text-align:center;cursor:pointer;transition:all .15s;background:var(--u2);}
.bs-shape-drop:hover{border-color:var(--bm);background:rgba(184,53,106,0.04);}
.bs-shape-drop.dragover{border-color:var(--bm);background:rgba(184,53,106,0.08);}
.bs-shape-drop-icon{font-size:34px;color:var(--mu);margin-bottom:6px;}
.bs-shape-drop-title{font-size:13px;color:var(--tx);font-weight:600;margin-bottom:3px;}
.bs-shape-drop-sub{font-size:10px;color:var(--mu);line-height:1.5;}
.bs-shape-count{float:right;font-size:10px;color:var(--mu);font-weight:500;letter-spacing:.04em;text-transform:none;}
.bs-shape-filters{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:14px;}
.bs-num{margin-top:3px;background:var(--u2);border:1px solid var(--bo);border-radius:4px;padding:5px 7px;font-size:11px;color:var(--tx);font-family:inherit;outline:none;width:100%;}
.bs-num:focus{border-color:var(--bm);}
/* v0.5.42 — Schlanke Slider unter den Number-Inputs */
.bs-slot{display:flex;align-items:center;gap:6px;margin-top:3px;}
.bs-slot .bs-num{margin-top:0;width:50px;flex-shrink:0;padding:4px 5px;font-size:10px;text-align:right;}
.bs-slider{-webkit-appearance:none;appearance:none;flex:1;height:3px;background:var(--bo);border-radius:2px;outline:none;margin:0;cursor:pointer;}
.bs-slider::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;border-radius:50%;background:var(--bm);cursor:grab;border:2px solid var(--u1);box-shadow:0 1px 3px rgba(0,0,0,.3);transition:transform .08s;}
.bs-slider::-webkit-slider-thumb:hover{transform:scale(1.15);}
.bs-slider::-webkit-slider-thumb:active{cursor:grabbing;}
.bs-slider::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:var(--bm);cursor:grab;border:2px solid var(--u1);box-shadow:0 1px 3px rgba(0,0,0,.3);}
.bs-fill-mode{background:var(--u2);border:1px solid var(--bo);border-radius:5px;padding:6px 12px;font-size:10px;color:var(--tx);cursor:pointer;font-family:inherit;transition:all .12s;}
.bs-fill-mode:hover{border-color:var(--bm);}
.bs-fill-mode.on{background:var(--bm);color:#fff;border-color:var(--bm);}
.bs-stop-row{display:flex;align-items:center;gap:6px;background:var(--u2);border:1px solid var(--bo);border-radius:4px;padding:5px 7px;}
.bs-stop-color-sw{width:22px;height:22px;border-radius:3px;border:1px solid rgba(0,0,0,.2);cursor:pointer;flex-shrink:0;}
.bs-stop-row .bs-num{width:56px;margin:0;}
.bs-stop-del{background:transparent;border:none;color:var(--mu);cursor:pointer;font-size:14px;padding:0 4px;line-height:1;}
.bs-stop-del:hover{color:var(--bm);}
.bs-shape-filter{background:var(--u2);border:1px solid var(--bo);border-radius:12px;padding:4px 10px;font-size:10px;color:var(--mu);cursor:pointer;font-family:inherit;transition:all .12s;}
.bs-shape-filter:hover{color:var(--tx);border-color:var(--bm);}
.bs-shape-filter.on{background:var(--bm);color:#fff;border-color:var(--bm);}
.bs-shape-grid{display:grid;grid-template-columns:repeat(auto-fill, minmax(110px, 1fr));gap:10px;}
.bs-shape-empty{grid-column:1/-1;text-align:center;padding:30px 0;color:var(--mu);font-size:11px;}
.bs-shape-card{background:var(--u2);border:1px solid var(--bo);border-radius:7px;padding:8px;display:flex;flex-direction:column;gap:6px;position:relative;transition:border .15s;}
.bs-shape-card:hover{border-color:var(--bm);}
.bs-shape-card.layout{border-color:#22D3EE44;}
.bs-shape-thumb{aspect-ratio:1/1;background:rgba(255,255,255,0.04);border-radius:5px;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.bs-shape-thumb svg{max-width:90%;max-height:90%;}
.bs-shape-name{font-size:10px;color:var(--tx);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.bs-shape-role{font-size:9px;color:var(--mu);}
.bs-shape-card .bs-shape-del{position:absolute;top:3px;right:3px;width:18px;height:18px;background:none;border:none;color:var(--mu);font-size:13px;cursor:pointer;border-radius:3px;line-height:1;padding:0;opacity:0;transition:opacity .12s;}
.bs-shape-card:hover .bs-shape-del{opacity:1;}
.bs-shape-del:hover{background:#dc2626;color:#fff;}
.bs-shape-card .bs-shape-role-sel{background:var(--bg);border:1px solid var(--bo);border-radius:3px;padding:2px 4px;font-size:9px;color:var(--mu);font-family:inherit;width:100%;}

/* Brand-Shape-Confirm-Modal */
.bs-shape-modal{width:780px;max-width:96vw;max-height:88vh;display:flex;flex-direction:column;}
.bs-shape-modal .sd-modal-body{overflow:auto;}
.bs-shape-confirm-list{display:flex;flex-direction:column;gap:6px;}
.bs-shape-confirm-row{display:grid;grid-template-columns:60px 1fr 160px 130px 30px;gap:10px;align-items:center;background:var(--u2);border:1px solid var(--bo);border-radius:6px;padding:6px 8px;}
.bs-shape-confirm-row.skip{opacity:.4;}
.bs-shape-confirm-thumb{width:50px;height:50px;background:rgba(255,255,255,0.04);border-radius:4px;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.bs-shape-confirm-thumb svg{max-width:90%;max-height:90%;}
.bs-shape-confirm-name{background:transparent;border:1px solid transparent;color:var(--tx);font-size:11px;padding:4px 6px;border-radius:3px;font-family:inherit;width:100%;}
.bs-shape-confirm-name:hover{background:var(--bg);border-color:var(--bo);}
.bs-shape-confirm-name:focus{outline:none;background:var(--bg);border-color:var(--bm);}
.bs-shape-confirm-role{background:var(--bg);border:1px solid var(--bo);border-radius:4px;padding:4px 6px;font-size:10px;color:var(--tx);font-family:inherit;}
.bs-shape-confirm-meta{font-size:9px;color:var(--mu);line-height:1.4;}
.bs-shape-confirm-skip{background:transparent;border:none;color:var(--mu);font-size:14px;cursor:pointer;padding:2px 4px;border-radius:3px;line-height:1;}
.bs-shape-confirm-skip:hover{background:#dc2626;color:#fff;}
.bs-shape-section{font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--mu);margin:14px 0 8px;}
.bs-shape-section:first-child{margin-top:0;}
.bs-color-map{display:flex;flex-wrap:wrap;gap:5px;padding:8px;background:var(--u2);border:1px solid var(--bo);border-radius:5px;margin-top:8px;}
.bs-color-map-item{display:flex;align-items:center;gap:5px;background:var(--bg);border:1px solid var(--bo);border-radius:14px;padding:3px 8px;font-size:10px;color:var(--mu);}
.bs-color-map-swatch{width:12px;height:12px;border-radius:50%;border:1px solid var(--bo);}
.bs-color-map-arrow{color:var(--mu);}
.bs-color-map-token{background:transparent;border:none;color:var(--bm);font-family:inherit;font-size:10px;cursor:pointer;}

/* ── Buttons ── */
.bs-btn{padding:8px 14px;border-radius:6px;border:none;font-family:'Montserrat',system-ui;font-size:11px;font-weight:700;letter-spacing:.05em;cursor:pointer;transition:all .18s;}
.bs-btn-primary{background:var(--bm);color:#fff;width:100%;}
.bs-btn-primary:hover{background:var(--bx);}
.bs-btn-primary:disabled{opacity:.35;cursor:not-allowed;}
.bs-btn-secondary{background:var(--u2);color:var(--tx);border:1px solid var(--bo);}
.bs-btn-secondary:hover{background:var(--b2);}
.bs-btn-block{display:block;width:100%;margin-bottom:7px;}

/* ── Log / Status ── */
.bs-log{background:rgba(0,0,0,.3);border:1px solid var(--bo);border-radius:6px;padding:8px 10px;font-size:10px;color:var(--mu);font-family:monospace;max-height:90px;overflow-y:auto;display:none;margin-top:8px;}
.bs-log.on{display:block;}
.bs-log-line{line-height:1.6;}
.bs-log-line.ok{color:#22C55E;}
.bs-log-line.err{color:#EF4444;}

/* ── Dropzone ── */
.bs-dropzone{border:2px dashed var(--b2);border-radius:10px;padding:22px 14px;text-align:center;cursor:pointer;transition:all .2s;position:relative;}
.bs-dropzone:hover,.bs-dropzone.drag-over{border-color:var(--bm);background:rgba(184,53,106,.06);}
.bs-dropzone input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%;}
.bs-drop-icon{font-size:20px;margin-bottom:5px;}
.bs-drop-label{font-size:11px;font-weight:600;color:var(--tx);}
.bs-drop-hint{font-size:9px;color:var(--mu);margin-top:3px;}

/* ── PDF Thumbs ── */
.bs-pdf-pages{display:flex;flex-wrap:wrap;gap:5px;margin-top:10px;}

/* v0.5.96 — Hex-Scan + Analyse-Vorschau */
.bs-hex-scan-list{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px;}
.bs-hex-scan-chip{display:flex;align-items:center;gap:6px;padding:4px 8px 4px 4px;background:var(--u2);border:1px solid var(--bo);border-radius:99px;cursor:pointer;font-size:10px;font-family:monospace;color:var(--tx);transition:all .15s;}
.bs-hex-scan-chip:hover{border-color:var(--bm);}
.bs-hex-scan-chip .sw{width:18px;height:18px;border-radius:50%;border:1px solid rgba(255,255,255,.15);flex-shrink:0;}
.bs-hex-scan-chip .ct{font-size:8px;color:var(--mu);font-weight:700;padding:1px 4px;border-radius:99px;background:rgba(255,255,255,.05);}
.bs-preview-modal-bg{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:9998;display:none;align-items:center;justify-content:center;}
.bs-preview-modal-bg.on{display:flex;}
.bs-preview-modal{background:var(--u1);border:1px solid var(--bo);border-radius:11px;width:min(720px,94vw);max-height:88vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,0,0,.5);}
.bs-preview-modal-head{padding:14px 18px;border-bottom:1px solid var(--bo);display:flex;justify-content:space-between;align-items:center;}
.bs-preview-modal-title{font-size:13px;font-weight:700;color:var(--tx);}
.bs-preview-modal-body{padding:14px 18px;overflow-y:auto;flex:1;}
.bs-preview-modal-section{margin-bottom:14px;}
.bs-preview-modal-section h4{font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--mu);margin:0 0 6px 0;}
.bs-preview-modal-foot{padding:12px 18px;border-top:1px solid var(--bo);display:flex;gap:8px;justify-content:flex-end;}
.bs-preview-color-row{display:flex;gap:6px;flex-wrap:wrap;}
.bs-preview-color-tile{display:flex;align-items:center;gap:6px;padding:4px 8px 4px 4px;background:var(--u2);border:1px solid var(--bo);border-radius:5px;font-size:10px;}
.bs-preview-color-tile .sw{width:20px;height:20px;border-radius:3px;border:1px solid rgba(255,255,255,.15);}
.bs-preview-kv{display:grid;grid-template-columns:90px 1fr;gap:6px;font-size:11px;color:var(--tx);margin-bottom:3px;}
.bs-preview-kv .k{color:var(--mu);font-size:10px;}
.bs-preview-empty{font-size:10px;color:var(--mu);font-style:italic;}
.bs-pdf-thumb{width:60px;height:45px;border-radius:4px;border:2px solid var(--bo);overflow:hidden;cursor:pointer;position:relative;flex-shrink:0;}
.bs-pdf-thumb.on{border-color:var(--bm);}
.bs-pdf-thumb canvas{display:block;width:100%;height:100%;}
.bs-pdf-thumb .pg-num{position:absolute;bottom:2px;right:3px;font-size:8px;color:#fff;font-weight:700;text-shadow:0 1px 2px rgba(0,0,0,.9);}
.bs-img-strip{display:flex;gap:5px;flex-wrap:wrap;margin-top:8px;}
.bs-img-thumb{width:60px;height:45px;border-radius:4px;object-fit:cover;border:2px solid var(--bo);}

/* ── Farb-Tiles (brand-manual-tool Stil) ── */
.bs-color-grid{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-start;margin-bottom:14px;}
.bs-color-tile{display:flex;flex-direction:column;align-items:center;gap:5px;}
.bs-color-swatch{width:52px;height:52px;border-radius:7px;border:1px solid rgba(255,255,255,.1);position:relative;cursor:pointer;transition:transform .15s;overflow:hidden;}
.bs-color-swatch:hover{transform:scale(1.06);}
.bs-color-swatch input[type=color]{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%;border:none;padding:0;}
.bs-color-role{font-size:9px;font-weight:700;letter-spacing:.06em;color:var(--mu);text-transform:uppercase;}
.bs-color-hex-label{font-size:9px;color:var(--mu);font-family:monospace;}
.bs-color-name-input{width:60px;font-size:9px;padding:2px 4px;text-align:center;border:1px solid var(--bo);border-radius:3px;background:var(--u2);color:var(--tx);font-family:monospace;outline:none;}
.bs-add-swatch{width:52px;height:52px;border:2px dashed var(--b2);border-radius:7px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--mu);font-size:22px;transition:all .15s;}
.bs-add-swatch:hover{border-color:var(--bm);color:var(--bm);}

/* ── Template-Galerie Filter-Bar (v0.5.105, Welle 18) ── */
.bs-layouts-filter-bar{display:flex;gap:8px;align-items:center;margin-bottom:10px;flex-wrap:wrap;}
.bs-layouts-search{flex:1;min-width:160px;background:var(--u2);border:1px solid var(--bo);border-radius:6px;padding:6px 10px;color:var(--tx);font-size:11px;outline:none;}
.bs-layouts-search:focus{border-color:var(--bm);}
.bs-layouts-filter-sel{background:var(--u2);border:1px solid var(--bo);border-radius:6px;padding:6px 10px;color:var(--tx);font-size:11px;cursor:pointer;outline:none;font-family:inherit;}
.bs-layouts-filter-sel:hover{border-color:var(--bm);}
.bs-layouts-count{font-size:10px;color:var(--mu);margin-left:auto;}

/* ── Header & Footer Workspace · Modell C (v0.5.107, Welle 1) ── */
.bs-chrome-workspace{display:grid;grid-template-columns:1fr 320px;gap:12px;margin-bottom:14px;align-items:start;}
@media (max-width:1100px){.bs-chrome-workspace{grid-template-columns:1fr;}}
.bs-chrome-canvas-card{margin:0;}
.bs-chrome-canvas-overlay{position:absolute;inset:0;pointer-events:none;}
.bs-chrome-canvas-hint{margin-top:8px;font-size:10px;color:var(--mu);font-style:italic;text-align:center;}
.bs-chrome-advanced{margin-top:4px;}
.bs-chrome-advanced[open] summary span{transform:rotate(90deg);}

/* Inspector-Panel rechts */
.bs-inspector-panel{background:var(--us);border:1px solid var(--bo);border-radius:9px;display:flex;flex-direction:column;min-height:240px;max-height:560px;overflow:hidden;position:sticky;top:8px;}
.bs-inspector-head{display:flex;align-items:center;gap:6px;padding:10px 12px;border-bottom:1px solid var(--bo);background:rgba(0,0,0,.15);}
.bs-inspector-title{flex:1;font-size:11px;font-weight:700;letter-spacing:.04em;color:var(--tx);text-transform:uppercase;}
.bs-inspector-clear{background:transparent;border:1px solid var(--bo);color:var(--mu);font-size:14px;width:22px;height:22px;border-radius:4px;cursor:pointer;line-height:1;}
.bs-inspector-clear:hover{border-color:var(--bm);color:var(--bm);}
.bs-inspector-body{flex:1;overflow-y:auto;padding:10px 12px;display:flex;flex-direction:column;gap:8px;}
.bs-inspector-empty{font-size:10px;color:var(--mu);font-style:italic;line-height:1.5;text-align:center;padding:14px 6px;}
.bs-inspector-row{display:flex;flex-direction:column;gap:3px;}
.bs-inspector-label{font-size:9px;font-weight:700;letter-spacing:.05em;color:var(--mu);text-transform:uppercase;}
.bs-inspector-input{background:var(--u2);border:1px solid var(--bo);border-radius:5px;color:var(--tx);font-size:11px;padding:5px 8px;font-family:inherit;outline:none;}
.bs-inspector-input:focus{border-color:var(--bm);}
select.bs-inspector-input{cursor:pointer;}
.bs-inspector-toggle{position:relative;width:32px;height:16px;}
.bs-inspector-toggle input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%;margin:0;z-index:2;}
.bs-inspector-toggle span{position:absolute;inset:0;background:var(--u2);border:1px solid var(--bo);border-radius:99px;transition:all .15s;}
.bs-inspector-toggle span::after{content:'';position:absolute;top:1px;left:1px;width:12px;height:12px;border-radius:50%;background:var(--mu);transition:all .15s;}
.bs-inspector-toggle input:checked + span{background:var(--bm);border-color:var(--bm);}
.bs-inspector-toggle input:checked + span::after{left:17px;background:#fff;}

/* Klickbare Zone in der Canvas: Hover-Outline */
.bs-chrome-preview-stage [data-chrome-zone]{outline:1px dashed transparent;transition:outline-color .12s;}
.bs-chrome-preview-stage [data-chrome-zone]:hover{outline-color:rgba(184,53,106,.6);}

/* v0.5.112 — Quickbar für Schnell-Konfiguration Header/Footer */
.bs-chrome-quick-row{display:flex;align-items:center;gap:8px;margin-bottom:6px;}
.bs-chrome-quick-label{font-size:9px;font-weight:700;letter-spacing:.05em;color:var(--mu);text-transform:uppercase;width:80px;flex-shrink:0;}

/* moveable.js Brand-Style-Overrides für Resize-Handles */
.moveable-control{background:var(--bm) !important;border-color:#fff !important;width:8px !important;height:8px !important;}
.moveable-line{background:var(--bm) !important;}

/* ── Raster & Guides Pane · Modell C (v0.5.108, Welle 2) ── */
.bs-raster-preview-stage-wrap{position:relative;background:#0a0608;border:1px solid var(--bo);border-radius:6px;overflow:hidden;width:100%;height:440px;}
.bs-raster-preview-stage{position:absolute;background:#fff;overflow:hidden;transform-origin:top left;box-shadow:0 4px 18px rgba(0,0,0,.45);cursor:default;}
.bs-raster-canvas-overlay{position:absolute;inset:0;pointer-events:none;}
.bs-raster-ruler{position:absolute;background:linear-gradient(to bottom, #1b1416 0%, #0f0a0c 100%);border:1px solid rgba(255,255,255,.06);cursor:crosshair;z-index:5;user-select:none;}
.bs-raster-ruler-top{left:18px;top:0;height:18px;}
.bs-raster-ruler-left{left:0;top:18px;width:18px;}
.bs-raster-ruler:hover{background:linear-gradient(to bottom, #261a1c 0%, #160e10 100%);}
.bs-raster-ruler-tick{position:absolute;font-size:7.5px;font-family:monospace;color:rgba(255,255,255,.35);}
.bs-raster-ruler-tick:not(.vertical){top:2px;width:1px;background:rgba(255,255,255,.18);height:6px;transform:translateX(-0.5px);}
.bs-raster-ruler-tick:not(.vertical).major{height:11px;background:rgba(255,255,255,.42);color:rgba(255,255,255,.72);padding-left:3px;width:auto;font-size:8px;line-height:11px;}
.bs-raster-ruler-tick.vertical{left:2px;height:1px;background:rgba(255,255,255,.18);width:6px;transform:translateY(-0.5px);}
.bs-raster-ruler-tick.vertical.major{width:14px;background:rgba(255,255,255,.42);color:rgba(255,255,255,.72);writing-mode:vertical-rl;text-orientation:mixed;padding-top:3px;height:auto;font-size:8px;}
/* Raster-Layer im Canvas */
.bs-raster-preview-stage .bs-raster-column{position:absolute;mix-blend-mode:multiply;pointer-events:none;}
.bs-raster-preview-stage .bs-raster-row-line{position:absolute;height:1px;pointer-events:none;}
.bs-raster-preview-stage .bs-raster-margin-frame{position:absolute;border:1px dashed currentColor;pointer-events:none;background:transparent;}
.bs-raster-preview-stage .bs-raster-baseline{position:absolute;height:1px;pointer-events:none;}
.bs-raster-preview-stage .bs-raster-guide{position:absolute;cursor:move;z-index:3;}
.bs-raster-preview-stage .bs-raster-guide.v{width:1px;}
.bs-raster-preview-stage .bs-raster-guide.h{height:1px;}
.bs-raster-preview-stage .bs-raster-guide::before{content:'';position:absolute;background:rgba(0,0,0,0);}
.bs-raster-preview-stage .bs-raster-guide.v::before{left:-4px;top:0;width:9px;height:100%;}
.bs-raster-preview-stage .bs-raster-guide.h::before{top:-4px;left:0;height:9px;width:100%;}
.bs-raster-preview-stage .bs-raster-guide:hover{outline:1px dashed rgba(43,209,255,.6);}
.bs-raster-preview-stage .bs-raster-guide.selected{box-shadow:0 0 0 1px #2bd1ff;outline:1px solid #2bd1ff;}
/* Guides-Tabelle im Advanced-Block */
.bs-raster-table{width:100%;border-collapse:collapse;font-size:11px;}
.bs-raster-table th{text-align:left;padding:6px 8px;border-bottom:1px solid var(--bo);font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--mu);}
.bs-raster-table td{padding:6px 8px;border-bottom:1px solid rgba(255,255,255,.04);color:var(--tx);}

/* ── Brand-Formate (v0.5.109, Welle 4a) ── */
.bs-formats-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;}
.bs-format-card{background:var(--u1);border:1px solid var(--bo);border-radius:9px;padding:12px;display:flex;gap:12px;flex-direction:column;}
.bs-format-thumb{height:84px;background:rgba(255,255,255,.02);border:1px dashed var(--bo);border-radius:6px;display:flex;align-items:center;justify-content:center;}
.bs-format-thumb-inner{background:var(--bm);opacity:.35;border-radius:2px;}
.bs-format-body{display:flex;flex-direction:column;gap:7px;}
.bs-format-row{display:flex;flex-direction:column;gap:3px;}
.bs-format-row label{font-size:9px;color:var(--mu);font-weight:600;letter-spacing:.05em;text-transform:uppercase;}
.bs-format-row-2col{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.bs-format-row-2col > div{display:flex;flex-direction:column;gap:3px;}
.bs-format-meta{display:flex;gap:10px;font-size:9px;color:var(--mu);font-family:monospace;padding-top:3px;border-top:1px solid var(--bo);}
.bs-format-actions{display:flex;justify-content:flex-end;}

/* Slides-Designer Brand-Raster-Overlay (v0.5.108, Welle 2) */
.sd-brand-raster-overlay{position:absolute;inset:0;pointer-events:none;z-index:6;}
.sd-brand-raster-overlay .sd-br-column{position:absolute;mix-blend-mode:multiply;}
.sd-brand-raster-overlay .sd-br-row-line{position:absolute;height:1px;}
.sd-brand-raster-overlay .sd-br-margin-frame{position:absolute;border:1px dashed currentColor;}
.sd-brand-raster-overlay .sd-br-baseline{position:absolute;height:1px;opacity:.35;}
.sd-brand-raster-overlay .sd-br-guide{position:absolute;}
.sd-brand-raster-overlay .sd-br-guide.v{width:1px;}
.sd-brand-raster-overlay .sd-br-guide.h{height:1px;}

/* ── Plattform-Profile (v0.5.104, Welle 17) ── */
.bs-platform-group{margin-bottom:18px;}
.bs-platform-group-title{font-size:10px;font-weight:700;letter-spacing:.08em;color:var(--mu);text-transform:uppercase;margin:0 0 8px 0;padding-bottom:4px;border-bottom:1px solid var(--bo);}
.bs-platform-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px;}
.bs-platform-card{background:var(--u2);border:1px solid var(--bo);border-radius:7px;padding:10px;display:flex;flex-direction:column;gap:6px;transition:all .15s;}
.bs-platform-card.on{border-color:var(--bm);background:rgba(184,53,106,.08);}
.bs-platform-card-head{display:flex;align-items:center;gap:6px;justify-content:space-between;}
.bs-platform-name{flex:1;font-size:11px;font-weight:600;color:var(--tx);line-height:1.2;}
.bs-platform-toggle{position:relative;width:30px;height:16px;flex-shrink:0;}
.bs-platform-toggle input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%;margin:0;z-index:2;}
.bs-platform-toggle span{position:absolute;inset:0;background:var(--us);border:1px solid var(--bo);border-radius:99px;transition:all .15s;}
.bs-platform-toggle span::after{content:'';position:absolute;top:1px;left:1px;width:12px;height:12px;border-radius:50%;background:var(--mu);transition:all .15s;}
.bs-platform-toggle input:checked + span{background:var(--bm);border-color:var(--bm);}
.bs-platform-toggle input:checked + span::after{left:15px;background:#fff;}
.bs-platform-preview{display:flex;justify-content:center;align-items:center;background:rgba(0,0,0,.2);border-radius:4px;padding:8px;min-height:108px;}
.bs-platform-meta{display:flex;justify-content:space-between;align-items:center;font-size:9px;color:var(--mu);font-family:monospace;}
.bs-platform-dim{}
.bs-platform-ratio{background:var(--us);padding:1px 6px;border-radius:99px;font-weight:600;}
.bs-platform-notes{font-size:9px;color:var(--mu);line-height:1.3;font-style:italic;margin-top:2px;}

/* ── Google-Font-Wähler (v0.5.103, Welle 16) ── */
.bs-font-picker-wrap{position:relative;}
.bs-font-picker-trigger{position:absolute;right:4px;top:50%;transform:translateY(-50%);background:var(--us);border:1px solid var(--bo);border-radius:4px;color:var(--mu);font-size:10px;padding:2px 6px;cursor:pointer;line-height:1;transition:all .15s;z-index:2;}
.bs-font-picker-trigger:hover{border-color:var(--bm);color:var(--bm);background:rgba(184,53,106,.08);}
.bs-font-picker-modal{position:fixed;inset:0;background:rgba(0,0,0,.85);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);z-index:9999;display:none;align-items:center;justify-content:center;}
.bs-font-picker-modal.on{display:flex;}
.bs-font-picker-panel{background:var(--us);border:1px solid var(--b2);border-radius:10px;width:min(720px,94vw);max-height:84vh;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 24px 60px rgba(0,0,0,.7);}
.bs-font-picker-head{display:flex;gap:8px;align-items:center;padding:12px 14px;border-bottom:1px solid var(--bo);}
.bs-font-picker-head h3{flex:1;font-size:13px;font-weight:700;color:var(--tx);margin:0;}
.bs-font-picker-head button{background:transparent;border:none;color:var(--mu);cursor:pointer;font-size:18px;padding:2px 6px;}
.bs-font-picker-search{padding:10px 14px;border-bottom:1px solid var(--bo);display:flex;flex-direction:column;gap:6px;}
.bs-font-picker-search input{width:100%;background:var(--u2);border:1px solid var(--bo);border-radius:6px;padding:8px 10px;color:var(--tx);font-size:12px;outline:none;}
.bs-font-picker-search input:focus{border-color:var(--bm);}
.bs-font-picker-cats{display:flex;flex-wrap:wrap;gap:4px;}
.bs-font-picker-cat{background:var(--u2);border:1px solid var(--bo);border-radius:99px;color:var(--mu);font-size:10px;padding:3px 9px;cursor:pointer;transition:all .15s;}
.bs-font-picker-cat:hover{border-color:var(--bm);color:var(--bm);}
.bs-font-picker-cat.on{background:var(--bm);border-color:var(--bm);color:#fff;}
.bs-font-picker-list{flex:1;overflow-y:auto;padding:6px 0;}
.bs-font-picker-item{display:flex;flex-direction:column;gap:2px;padding:10px 14px;cursor:pointer;border-bottom:1px solid rgba(255,255,255,.03);transition:background .12s;}
.bs-font-picker-item:hover{background:rgba(255,255,255,.04);}
.bs-font-picker-item.on{background:rgba(184,53,106,.15);}
.bs-font-picker-name{font-size:10px;color:var(--mu);font-weight:600;letter-spacing:.04em;}
.bs-font-picker-name .cat{color:var(--bm);font-size:9px;margin-left:6px;text-transform:uppercase;}
.bs-font-picker-preview{font-size:20px;color:var(--tx);line-height:1.2;}
.bs-font-picker-foot{padding:10px 14px;border-top:1px solid var(--bo);display:flex;justify-content:space-between;align-items:center;gap:8px;}
.bs-font-picker-foot .hint{font-size:10px;color:var(--mu);flex:1;}
.bs-font-picker-foot button{background:var(--u2);border:1px solid var(--bo);border-radius:6px;padding:6px 12px;color:var(--tx);cursor:pointer;font-size:11px;}
.bs-font-picker-foot button.primary{background:var(--bm);border-color:var(--bm);color:#fff;}
.bs-font-picker-empty{padding:20px;text-align:center;color:var(--mu);font-size:11px;font-style:italic;}
/* Trigger-Button positioniert in font-name inputs */
.bs-font-meta input.bs-input{padding-right:48px !important;}

/* ── Typografie ── */
.bs-font-row{display:flex;align-items:center;gap:12px;padding:10px 14px;background:var(--u2);border:1px solid var(--bo);border-radius:7px;margin-bottom:8px;}
.bs-font-preview-text{font-size:20px;flex:1;color:#fff;line-height:1.1;}
.bs-font-meta{font-size:10px;color:var(--mu);line-height:1.5;}
.bs-font-tag{display:inline-block;font-size:9px;padding:1px 6px;border-radius:99px;background:var(--us);border:1px solid var(--bo);color:var(--mu);margin-top:2px;}

/* ── Color Categories (v0.5.15) ── */
.bs-cat-section{margin-bottom:16px;}
.bs-cat-header{display:flex;align-items:center;gap:6px;margin-bottom:8px;}
.bs-cat-name{flex:1;font-size:10px;font-weight:700;letter-spacing:.04em;color:var(--mu);background:transparent;border:none;border-bottom:1px solid var(--bo);padding:2px 0;outline:none;cursor:text;text-transform:uppercase;}
.bs-cat-name:focus{border-bottom-color:var(--bm);color:var(--tx);}
.bs-cat-add-btn,.bs-cat-del-btn{background:transparent;border:1px solid var(--bo);border-radius:4px;color:var(--mu);font-size:13px;width:22px;height:22px;cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:1;transition:all .15s;flex-shrink:0;}
.bs-cat-add-btn:hover{border-color:var(--bm);color:var(--bm);}
.bs-cat-del-btn:hover{border-color:#f87171;color:#f87171;}
.bs-token-badge{position:absolute;bottom:3px;left:50%;transform:translateX(-50%);background:rgba(0,0,0,.6);color:#fff;font-size:7px;font-weight:700;letter-spacing:.05em;padding:1px 4px;border-radius:3px;white-space:nowrap;pointer-events:none;text-transform:uppercase;}
.bs-color-del{position:absolute;top:3px;right:3px;background:rgba(239,68,68,.8);border:none;border-radius:3px;color:#fff;font-size:9px;cursor:pointer;padding:0 4px;line-height:18px;display:none;}
.bs-color-swatch:hover .bs-color-del{display:block;}

/* ── Type Scale Rows (v0.5.15) ── */
.bs-typo-row{display:flex;gap:14px;padding:12px 14px;background:var(--u2);border:1px solid var(--bo);border-radius:7px;margin-bottom:8px;align-items:flex-start;}
.bs-typo-preview{flex:0 0 200px;min-width:0;}
.bs-typo-meta-tag{font-size:9px;font-weight:700;letter-spacing:.08em;color:var(--mu);text-transform:uppercase;margin-bottom:4px;}
.bs-typo-sample{color:var(--tx);line-height:1.2;word-break:break-word;overflow:hidden;}
.bs-typo-ctrl{flex:1;min-width:0;}
.bs-typo-ctrl .bs-input{font-size:10px;}

/* ── Typografie konsolidiert (v0.5.95): Familien-Gruppen mit Rollen darunter ── */
.bs-typo-family{border:1px solid var(--bo);border-radius:9px;background:var(--u2);margin-bottom:12px;overflow:hidden;}
.bs-typo-family-head{display:flex;align-items:flex-start;gap:14px;padding:11px 14px;background:rgba(255,255,255,.025);border-bottom:1px solid var(--bo);}
.bs-typo-family-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px;}
.bs-typo-family-tag{display:inline-block;font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--bm);padding:2px 7px;border-radius:99px;background:rgba(184,53,106,.12);border:1px solid rgba(184,53,106,.3);align-self:flex-start;}
.bs-typo-family-info .bs-font-preview-text{font-size:22px;color:#fff;line-height:1.1;}
.bs-typo-family-controls{flex:0 0 240px;display:flex;flex-direction:column;gap:5px;}
.bs-typo-family-controls .bs-input{font-size:10px;}
.bs-typo-family-controls .bs-typo-fc-row{display:flex;gap:5px;align-items:center;}
.bs-typo-family-roles{padding:10px 12px 4px;display:flex;flex-direction:column;gap:6px;}
.bs-typo-family-roles .bs-typo-row{margin-bottom:0;background:var(--us);}
.bs-typo-family-roles-empty{font-size:10px;color:var(--mu);font-style:italic;padding:4px 4px 8px;}
.bs-typo-add-role{display:block;width:calc(100% - 24px);margin:0 12px 12px;padding:6px;border:1px dashed var(--b2);border-radius:6px;background:transparent;color:var(--mu);font-size:10px;cursor:pointer;transition:all .15s;}
.bs-typo-add-role:hover{border-color:var(--bm);color:var(--bm);background:rgba(184,53,106,.06);}

/* ── Logo Slots ── */
.bs-logo-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px;}
.bs-logo-slot{}
.bs-logo-slot-label{font-size:10px;font-weight:600;color:var(--mu);margin-bottom:5px;letter-spacing:.04em;}
.bs-logo-preview{min-height:72px;border:1px solid var(--bo);border-radius:7px;display:flex;align-items:center;justify-content:center;overflow:hidden;padding:8px;background:var(--u2);position:relative;cursor:pointer;}
.bs-logo-preview.dark-bg{background:#0a0908;}
.bs-logo-preview.light-bg{background:#f5f3ef;}
.bs-logo-preview.mid-bg{background:#d0cdc8;}
.bs-logo-preview img{max-width:100%;max-height:60px;object-fit:contain;}
.bs-logo-preview input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%;}
.bs-logo-empty{font-size:10px;color:var(--mu);text-align:center;pointer-events:none;}
.bs-logo-del{position:absolute;top:4px;right:4px;background:rgba(239,68,68,.8);border:none;border-radius:3px;color:#fff;font-size:9px;cursor:pointer;padding:1px 5px;display:none;}
.bs-logo-preview:hover .bs-logo-del{display:block;}

/* ── Asset Grid ── */
.bs-asset-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(72px,1fr));gap:8px;margin-bottom:10px;}
.bs-asset-card{cursor:pointer;position:relative;}
.bs-asset-thumb{aspect-ratio:1;border:1px solid var(--bo);border-radius:6px;overflow:hidden;background:var(--u2);display:flex;align-items:center;justify-content:center;transition:border-color .15s;}
.bs-asset-thumb:hover{border-color:var(--bm);}
.bs-asset-thumb img{width:100%;height:100%;object-fit:contain;}
.bs-asset-fname{font-size:9px;color:var(--mu);text-align:center;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.bs-asset-del{position:absolute;top:3px;right:3px;background:rgba(239,68,68,.85);border:none;border-radius:3px;color:#fff;font-size:9px;cursor:pointer;padding:1px 4px;display:none;}
.bs-asset-card:hover .bs-asset-del{display:block;}
.bs-asset-drop{border:2px dashed var(--b2);border-radius:7px;padding:14px 8px;text-align:center;cursor:pointer;font-size:10px;color:var(--mu);position:relative;transition:all .2s;margin-bottom:10px;}
.bs-asset-drop:hover,.bs-asset-drop.drag-over{border-color:var(--bm);color:var(--tx);}
.bs-asset-drop input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%;}

/* ── Dachmarke / Submarken ── */
.bs-brand-hierarchy{display:flex;flex-direction:column;gap:8px;margin-bottom:14px;}
.bs-brand-node{background:var(--u2);border:1px solid var(--bo);border-radius:7px;padding:10px 14px;display:flex;align-items:center;gap:10px;cursor:pointer;transition:border-color .15s;}
.bs-brand-node:hover{border-color:var(--bm);}
.bs-brand-node.active{border-color:var(--bm);background:rgba(184,53,106,.08);}
.bs-brand-node-color{width:10px;height:10px;border-radius:50%;flex-shrink:0;}
.bs-brand-node-name{font-size:12px;font-weight:600;color:#fff;flex:1;}
.bs-brand-node-type{font-size:9px;color:var(--mu);}
.bs-brand-node-del{background:transparent;border:none;color:var(--mu);font-size:13px;cursor:pointer;padding:0 3px;transition:color .15s;}
.bs-brand-node-del:hover{color:#EF4444;}
.bs-sub-indent{padding-left:24px;}

/* ── Do/Don't ── */
.bs-rule-rows{display:flex;flex-direction:column;gap:5px;margin-bottom:8px;}
.bs-rule-item{display:flex;align-items:center;gap:6px;}
.bs-rule-item input{flex:1;background:var(--u2);border:1px solid var(--bo);border-radius:5px;color:var(--tx);font-size:11px;padding:5px 8px;outline:none;font-family:'Montserrat',system-ui;}
.bs-rule-item input:focus{border-color:var(--bm);}
.bs-rule-del{background:transparent;border:none;color:var(--mu);cursor:pointer;font-size:14px;padding:0 3px;}
.bs-rule-del:hover{color:#EF4444;}
.bs-rule-badge{font-size:9px;font-weight:700;padding:2px 5px;border-radius:3px;flex-shrink:0;}
.bs-rule-badge.do{background:rgba(34,197,94,.15);color:#22C55E;}
.bs-rule-badge.dont{background:rgba(239,68,68,.15);color:#EF4444;}

/* ── JSON Panel (rechts, toggle) ── */
.bs-json-panel{width:0;overflow:hidden;transition:width .25s;background:rgba(8,7,6,.98);border-left:0px solid var(--bo);display:flex;flex-direction:column;flex-shrink:0;}
.bs-json-panel.open{width:280px;border-left-width:1px;}
.bs-json-toolbar{padding:8px 12px;border-bottom:1px solid var(--bo);display:flex;align-items:center;justify-content:space-between;flex-shrink:0;}
.bs-json-label{font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--mu);}
.bs-json-wrap{flex:1;overflow:hidden;display:flex;flex-direction:column;}
.bs-json-area{flex:1;background:transparent;border:none;color:#86efac;font-family:monospace;font-size:10px;padding:12px;resize:none;outline:none;line-height:1.6;}

/* ── Tag chips ── */
.bs-tag-row{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px;}
.bs-tag{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;font-size:10px;border-radius:99px;background:var(--u2);border:1px solid var(--bo);color:var(--mu);}
.bs-tag-x{cursor:pointer;color:var(--mu);font-size:12px;line-height:1;}
.bs-tag-x:hover{color:#EF4444;}

/* ── Infografik Tab ── */
#tab-info{flex-direction:column;align-items:center;justify-content:center;background:var(--ub);}
.info-placeholder{text-align:center;color:var(--mu);}
.info-placeholder-icon{font-size:48px;margin-bottom:16px;opacity:.3;}
.info-placeholder-title{font-size:18px;font-weight:700;color:var(--tx);margin-bottom:8px;}
.info-placeholder-sub{font-size:12px;line-height:1.6;max-width:360px;}

/* ── Coming-soon tabs ── */
.ph-tab{display:flex;flex-direction:column;gap:0;height:100%;overflow:hidden;}
.ph-hero{padding:32px 32px 24px;border-bottom:1px solid var(--bo);}
.ph-hero-eyebrow{font-size:9px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--bm);margin-bottom:6px;}
.ph-hero-title{font-size:22px;font-weight:800;color:#fff;margin-bottom:6px;line-height:1.2;}
.ph-hero-sub{font-size:12px;color:var(--mu);line-height:1.6;max-width:560px;}
.ph-body{flex:1;overflow-y:auto;padding:24px 32px;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;align-content:start;}
.ph-card{background:var(--u2);border:1px solid var(--bo);border-radius:10px;padding:16px 18px;}
.ph-card-icon{font-size:22px;margin-bottom:8px;opacity:.6;}
.ph-card-title{font-size:12px;font-weight:700;color:var(--tx);margin-bottom:4px;}
.ph-card-desc{font-size:10px;color:var(--mu);line-height:1.55;}
.ph-card.soon{opacity:.5;}
.ph-card.soon .ph-card-title::after{content:' · soon';font-size:9px;font-weight:400;color:var(--bm);}
.ph-badge{display:inline-block;font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:2px 7px;border-radius:4px;border:1px solid var(--bo);color:var(--mu);margin-top:8px;}
.ph-badge.active{border-color:var(--bm);color:var(--bm);}

/* ══════════════════════════════════════════════
   TAB 1 — DESIGN KIT (scrollable page)
══════════════════════════════════════════════ */
#tab-kit{overflow-y:auto;flex-direction:column;}
.kit-page{max-width:1080px;margin:0 auto;padding:40px 28px 80px;}
.kit-header{margin-bottom:18px;}
/* v0.5.60 — Demo-Banner über den FAM-Beispiel-Tokens */
.kit-demo-banner{display:flex;align-items:center;gap:12px;background:rgba(184,53,106,.08);border:1px solid rgba(184,53,106,.35);border-left:3px solid var(--bm);border-radius:6px;padding:10px 16px;margin-bottom:30px;font-size:12px;line-height:1.5;color:var(--tx);}
.kit-demo-banner a{color:var(--bm);}
.kit-header h1{font-size:34px;font-weight:800;letter-spacing:-.02em;color:#fff;}
.kit-header h1 em{color:var(--bm);font-style:normal;}
.kit-header p{font-size:13px;color:var(--mu);margin-top:7px;line-height:1.6;}
.ks{margin-bottom:44px;scroll-margin-top:64px;}
.ksh{display:flex;align-items:center;gap:12px;margin-bottom:18px;}
.ksn{font-size:11px;font-weight:700;color:var(--bm);letter-spacing:.12em;flex-shrink:0;}
.kst{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--tx);}
.ksh::after{content:'';flex:1;height:1px;background:var(--bo);}
hr.khr{border:none;border-top:1px solid var(--bo);margin:40px 0;}
.plbl{font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--mu);margin:20px 0 9px;}
.plbl:first-child{margin-top:0;}
/* Swatches */
.sw-grid{display:grid;gap:7px;}
.sw-grid.c4{grid-template-columns:repeat(4,1fr);}
.sw-grid.c8{grid-template-columns:repeat(8,1fr);}
.sw{border-radius:8px;padding:11px 9px 9px;display:flex;flex-direction:column;justify-content:flex-end;gap:3px;min-height:82px;position:relative;cursor:pointer;transition:transform .1s;}
.sw:hover{transform:scale(1.02);}
.sw-name{font-size:11px;font-weight:600;line-height:1.2;}
.sw-hex{font-size:10px;font-weight:400;font-family:monospace;opacity:.7;}
.sw-role{font-size:9px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;opacity:.5;margin-top:1px;}
.sw-cp{position:absolute;top:7px;right:7px;font-size:9px;font-weight:700;padding:2px 5px;border-radius:3px;background:rgba(0,0,0,.25);opacity:0;transition:opacity .15s;}
.sw:hover .sw-cp{opacity:1;}
.c-bd {background:#5C0F2F;color:#F5C8DA;} .c-bx{background:#8B1A4A;color:#F5C8DA;}
.c-bm{background:#B8356A;color:#FAE0EB;} .c-tp{background:#6B6458;color:#EDE9E4;}
.c-ink{background:#1A1614;color:#C8C4BF;border:1px solid #2E2926;}
.c-ch{background:#2E2926;color:#C8C4BF;} .c-st{background:#F2EFE9;color:#2E2926;}
.c-wh{background:#FFFFFF;color:#2E2926;border:1px solid #E0DBD5;}
.c-sg{background:#E8C84A;color:#3A2E00;} .c-sgd{background:#C4A420;color:#1A1000;}
.c-tl{background:#1A5C52;color:#A8DDD7;} .c-bp2{background:#F5E0EA;color:#5C0F2F;}
.c-so{background:#E8682A;color:#FDE8D8;} .c-sod{background:#C44E18;color:#FDE8D8;}
.c-nb{background:#1A3C6E;color:#D0DCEF;} .c-nbm{background:#2E5FAD;color:#D0DCEF;}
.c-lb{background:#0D1F3C;color:#8AAAD0;} .c-lr{background:#E03C3C;color:#FFE0E0;}
/* Type scale */
.type-card{background:var(--us);border:1px solid var(--bo);border-radius:10px;padding:20px;display:flex;flex-direction:column;gap:16px;}
.tr{display:flex;align-items:baseline;gap:18px;padding-bottom:16px;border-bottom:1px solid var(--bo);}
.tr:last-child{padding-bottom:0;border-bottom:none;}
.tm{min-width:78px;display:flex;flex-direction:column;gap:2px;}
.tt{font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--bm);}
.ts{font-size:10px;color:var(--mi);font-family:monospace;}
.t-disp{font-size:38px;font-weight:800;line-height:.95;letter-spacing:-.025em;color:#fff;}
.t-h1{font-size:24px;font-weight:700;line-height:1.05;letter-spacing:-.015em;color:#fff;}
.t-h2{font-size:19px;font-weight:600;line-height:1.1;color:#fff;}
.t-body{font-size:15px;font-weight:400;line-height:1.65;color:var(--tx);}
.t-cap{font-size:12px;font-weight:400;line-height:1.4;letter-spacing:.02em;color:var(--mu);}
.t-lbl{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--sg);}
/* Logo variants */
.logo-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;}
.logo-card{border-radius:10px;padding:24px 16px 16px;display:flex;flex-direction:column;align-items:center;gap:8px;cursor:pointer;transition:transform .15s;}
.logo-card:hover{transform:scale(1.02);}
.logo-bug{display:flex;align-items:center;gap:8px;}
.logo-dots{display:flex;flex-direction:column;gap:2.5px;}
.logo-dots span{display:block;height:3.5px;border-radius:1.5px;}
.logo-fam{font-size:22px;font-weight:800;letter-spacing:.05em;line-height:1;}
.logo-sub{font-size:7px;font-weight:600;letter-spacing:.17em;text-transform:uppercase;text-align:center;line-height:1.5;}
.logo-clbl{font-size:9px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;opacity:.45;margin-top:3px;}
.old-logo-wrap{width:100%;min-height:55px;display:flex;align-items:center;justify-content:center;background:var(--bd);}
.old-logo-img{display:block;width:64%;max-width:280px;height:auto;}
.old-logo-mask{display:block;width:86px;aspect-ratio:424.03/215.26;background:currentColor;-webkit-mask:center/contain no-repeat;mask:center/contain no-repeat;}
/* Editor panel */
.ep{background:var(--us);border:1px solid var(--b2);border-radius:10px;padding:14px 16px;margin-bottom:16px;}
.ep-title{font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--mu);margin-bottom:12px;}
.ep-rows{display:flex;flex-direction:column;gap:9px;}
.ep-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.ep-lbl{font-size:11px;font-weight:500;color:var(--mu);min-width:70px;}
.ei,.es{font-family:'Montserrat',system-ui;font-size:12px;padding:5px 9px;border-radius:6px;border:1px solid var(--b2);background:var(--u2);color:var(--tx);flex:1;outline:none;transition:border-color .15s;min-width:0;}
.ei:focus,.es:focus{border-color:var(--bm);}
.es option{background:var(--u2);}
.logo-choice{font-family:'Montserrat',system-ui;font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:5px 12px;border-radius:14px;border:1px solid var(--b2);background:transparent;color:var(--mu);cursor:pointer;transition:all .15s;}
.logo-choice:hover,.logo-choice.on{background:var(--sg);border-color:var(--sg);color:var(--ink);}
.kit-old-logo-mark{display:flex!important;align-items:center!important;justify-content:center!important;gap:0!important;}
.kit-old-logo-mark .old-logo-img{display:block;width:70px;max-width:112px;max-height:76%;object-fit:contain;}
.fab.kit-old-logo-mark{width:clamp(48px,8%,112px);height:auto;min-height:20px;}
.fab.kit-old-logo-mark .old-logo-img{width:100%;max-width:none;max-height:none;}
/* Card grid */
.g2{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.g3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;}
.cw{display:flex;flex-direction:column;gap:7px;margin-bottom:20px;}
.cm{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:7px;}
.ctitle{font-size:10px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--tx);}
.cspec{font-size:10px;color:var(--mu);margin-top:2px;}
.cacts{display:flex;gap:5px;flex-wrap:wrap;}
.kb{font-family:'Montserrat',system-ui;font-size:10px;font-weight:600;letter-spacing:.04em;padding:5px 10px;border-radius:14px;border:1px solid var(--b2);background:transparent;color:var(--mu);cursor:pointer;transition:all .15s;white-space:nowrap;}
.kb:hover,.kb.on{background:var(--bx);color:#fff;border-color:var(--bx);}
.kdl{font-family:'Montserrat',system-ui;font-size:10px;font-weight:700;letter-spacing:.04em;padding:5px 12px;border-radius:14px;border:none;background:var(--sg);color:var(--ink);cursor:pointer;transition:all .15s;white-space:nowrap;}
.kdl:hover{background:var(--sgd);}
.img-ubtn{display:inline-flex;align-items:center;gap:5px;font-family:'Montserrat',system-ui;font-size:10px;font-weight:600;letter-spacing:.04em;padding:5px 10px;border-radius:14px;border:1px dashed var(--b2);background:transparent;color:var(--mu);cursor:pointer;transition:all .15s;white-space:nowrap;}
.img-ubtn:hover{border-color:var(--bm);color:var(--tx);}
.img-ubtn.hf{border-style:solid;border-color:var(--bm);color:var(--bp);}
.img-ubtn input{display:none;}
/* FAM bug in cards */
.fab{position:absolute;top:clamp(10px,2%,18px);left:clamp(10px,2%,18px);display:flex;align-items:center;gap:5px;z-index:10;}
.fab-dots{display:flex;flex-direction:column;gap:2px;}
.fab-dots span{display:block;height:3px;border-radius:1px;}
/* v0.5.90 — Corporate-Brand-Mark als SVG. 3 horizontale Balken in dem
   im User-Screenshot gezeigten Verhältnis (kurz / kurz / lang). `fill="currentColor"`
   im SVG erbt die Eltern-color → einfach via CSS einfärbbar. Default-Größe via
   inline `style="height:Xpx"`. ViewBox 14×13. */
.cps-mark{display:inline-block;vertical-align:middle;line-height:0;color:currentColor;flex-shrink:0;}
.cps-mark svg{display:block;height:100%;width:auto;}
.fab-text{font-size:11px;font-weight:800;letter-spacing:.07em;}
/* Overlay stuff */
.ov-row{display:flex;align-items:center;gap:9px;margin-top:5px;}
.ov-row label{font-size:11px;color:var(--mu);min-width:100px;}
.ov-sl{-webkit-appearance:none;appearance:none;flex:1;height:3px;border-radius:2px;background:var(--b2);outline:none;cursor:pointer;}
.ov-sl::-webkit-slider-thumb{-webkit-appearance:none;width:13px;height:13px;border-radius:50%;background:var(--bm);cursor:pointer;}
.ov-val{font-size:11px;color:var(--sg);font-weight:600;min-width:28px;text-align:right;}

/* ── KIT CARDS SHARED ── */
.yt-thumb{width:100%;aspect-ratio:16/9;border-radius:10px;overflow:hidden;position:relative;display:flex;flex-direction:column;justify-content:flex-end;}
.yt-dark{background:var(--bd);}
.yt-dark::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 70% 25%,rgba(184,53,106,.38) 0%,transparent 55%);}
.yt-light{background:var(--st);}
.yt-ink2{background:var(--ink);}
.yt-ink2::before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(92,15,47,.42) 0%,transparent 52%);}
.yt-body{position:relative;z-index:5;padding:0 6% 6%;}
.yt-eyebrow{font-size:9px;font-weight:700;letter-spacing:.17em;text-transform:uppercase;margin-bottom:4px;}
.yt-title{font-size:clamp(15px,3.2vw,26px);font-weight:800;line-height:1.0;letter-spacing:-.02em;}
.yt-title em{font-style:normal;}
.yt-wnum{position:absolute;bottom:3%;right:4%;font-size:clamp(38px,9vw,75px);font-weight:800;letter-spacing:-.05em;line-height:1;pointer-events:none;user-select:none;}
.rec-pill{position:absolute;top:12px;right:12px;background:#E03030;color:#fff;font-size:8px;font-weight:800;letter-spacing:.12em;padding:3px 7px 3px 5px;border-radius:3px;display:flex;align-items:center;gap:3px;z-index:10;}
.rec-pill::before{content:'';width:5px;height:5px;border-radius:50%;background:#fff;}
.sq-card{width:100%;aspect-ratio:1/1;border-radius:10px;overflow:hidden;position:relative;}
.sq-event{background:var(--bd);display:flex;flex-direction:column;justify-content:space-between;padding:18px;}
.sq-event::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 100% 0%,rgba(184,53,106,.48) 0%,transparent 52%);}
.sq-clean{background:#fff;display:flex;flex-direction:column;justify-content:space-between;padding:18px;border:1px solid #E8E3DD;}
.sq-clean .sq-stripe{position:absolute;top:0;left:0;right:0;height:4px;background:var(--bx);}
.sq-top{display:flex;justify-content:space-between;align-items:flex-start;position:relative;z-index:3;}
.sq-body{position:relative;z-index:3;}
.sq-bot{display:flex;justify-content:space-between;align-items:flex-end;position:relative;z-index:3;}
.sq-eyebrow{font-size:9px;font-weight:700;letter-spacing:.17em;text-transform:uppercase;margin-bottom:5px;}
.sq-headline{font-size:clamp(18px,4vw,30px);font-weight:800;line-height:1.0;letter-spacing:-.02em;}
.sq-headline em{font-style:normal;display:block;}
.sq-text{font-size:11px;line-height:1.5;margin-top:7px;}
.sq-wnum{position:absolute;bottom:6px;right:10px;font-size:64px;font-weight:800;letter-spacing:-.05em;line-height:1;pointer-events:none;user-select:none;z-index:1;}
.sq-chip{font-size:9px;font-weight:800;letter-spacing:.08em;padding:3px 9px;border-radius:4px;background:var(--sg);color:var(--ink);text-transform:uppercase;}
.sq-cta{font-size:9px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;display:flex;align-items:center;gap:3px;}
.sq-cta::after{content:'→';font-size:11px;}
.og-card{width:100%;aspect-ratio:1.91/1;border-radius:10px;overflow:hidden;position:relative;background:var(--ch);display:flex;align-items:stretch;}
.og-side{width:6px;background:var(--bx);flex-shrink:0;}
.og-cnt{flex:1;display:flex;flex-direction:column;justify-content:space-between;padding:18px 22px;position:relative;}
.og-cnt::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 85% 20%,rgba(139,26,74,.2) 0%,transparent 55%);}
.og-ey{font-size:9px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--tp);position:relative;z-index:2;}
.og-t{font-size:clamp(16px,2.8vw,24px);font-weight:800;letter-spacing:-.01em;line-height:1.1;color:#fff;position:relative;z-index:2;margin-top:5px;}
.og-t em{color:var(--sg);font-style:normal;}
.og-d{font-size:10px;color:rgba(255,255,255,.38);line-height:1.55;margin-top:5px;position:relative;z-index:2;}
.og-bot{display:flex;justify-content:space-between;align-items:flex-end;position:relative;z-index:2;}
.og-url{font-size:9px;color:var(--tp);opacity:.6;}
/* Stage */
.stage{width:100%;aspect-ratio:16/9;border-radius:10px;overflow:hidden;position:relative;background:#111;display:flex;align-items:flex-end;}
.stage-bg{position:absolute;inset:0;background:linear-gradient(135deg,#1a2a35 0%,#0d1820 50%,#1a1010 100%);}
.stage-bg::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 30% 40%,rgba(255,255,255,.03) 0%,transparent 50%),radial-gradient(ellipse at 70% 60%,rgba(139,26,74,.07) 0%,transparent 40%);}
.stage-safe{position:relative;z-index:10;width:100%;padding:0 5% 6%;}
/* Lower thirds */
.lt-classic{display:flex;align-items:stretch;height:clamp(38px,4.5vw,54px);max-width:56%;overflow:hidden;}
.lt-classic .acc{width:4px;background:var(--sg);flex-shrink:0;}
.lt-classic .body{background:rgba(92,15,47,.92);backdrop-filter:blur(8px);padding:0 14px;display:flex;flex-direction:column;justify-content:center;gap:2px;}
.lt-classic .logo{background:var(--bx);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0 12px;gap:2px;}
.lt-classic .logo .ld{display:flex;flex-direction:column;gap:2px;}
.lt-classic .logo .ld span{display:block;height:2px;border-radius:1px;background:var(--bp);}
.lt-classic .logo .lf{font-size:9px;font-weight:800;color:var(--bp);letter-spacing:.1em;}
.lt-split{display:flex;align-items:flex-end;max-width:60%;}
.lt-split .nb{background:var(--sg);width:clamp(38px,4.5vw,54px);height:clamp(38px,4.5vw,54px);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.lt-split .nb span{font-size:clamp(13px,2vw,20px);font-weight:800;color:var(--ink);line-height:1;}
.lt-split .tb{background:rgba(26,22,20,.9);backdrop-filter:blur(8px);padding:0 14px;height:clamp(38px,4.5vw,54px);display:flex;flex-direction:column;justify-content:center;gap:2px;}
.lt-split .tag{background:var(--bx);height:clamp(38px,4.5vw,54px);padding:0 10px;display:flex;align-items:center;justify-content:center;}
.lt-split .tag span{font-size:7px;font-weight:700;color:var(--bp);letter-spacing:.14em;text-transform:uppercase;writing-mode:vertical-rl;transform:rotate(180deg);}
.lt-minimal{display:flex;flex-direction:column;gap:4px;max-width:50%;}
.lt-minimal .lt{display:flex;align-items:center;gap:7px;}
.lt-pip{width:7px;height:7px;border-radius:50%;background:var(--sg);flex-shrink:0;}
.lt-rule{height:1px;background:linear-gradient(90deg,var(--sg) 0%,var(--bm) 40%,transparent 100%);}
.lt-minimal .lb{display:flex;align-items:center;gap:9px;}
.lt-org{font-size:9px;font-weight:700;color:var(--sg);letter-spacing:.1em;text-transform:uppercase;text-shadow:0 1px 6px rgba(0,0,0,.9);}
.lt-ticker{width:100%;height:clamp(34px,4vw,42px);background:rgba(92,15,47,.95);display:flex;align-items:stretch;overflow:hidden;}
.lt-ticker .tl{background:var(--bd);border-right:2px solid var(--sg);display:flex;align-items:center;padding:0 12px;gap:4px;flex-shrink:0;}
.lt-ticker .tl .td{display:flex;flex-direction:column;gap:2px;}
.lt-ticker .tl .td span{display:block;height:2px;border-radius:1px;background:var(--sg);}
.lt-ticker .tl .tw{font-size:10px;font-weight:800;color:var(--sg);letter-spacing:.08em;}
.lt-ticker .tc2{flex:1;display:flex;align-items:center;padding:0 14px;gap:12px;overflow:hidden;}
.lt-ticker .tlab{font-size:9px;font-weight:700;color:var(--sg);letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;flex-shrink:0;}
.lt-ticker .tpipe{width:1px;height:13px;background:rgba(255,255,255,.18);flex-shrink:0;}
.lt-ticker .ttxt{font-size:11px;font-weight:500;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.lt-ticker .ttime{font-size:10px;font-weight:700;color:rgba(255,255,255,.35);letter-spacing:.06em;flex-shrink:0;padding:0 12px;font-variant-numeric:tabular-nums;}
.lt-name{font-size:clamp(10px,1.8vw,15px);font-weight:800;line-height:1.1;letter-spacing:-.01em;}
.lt-role{font-size:clamp(7px,1.1vw,10px);font-weight:500;letter-spacing:.1em;text-transform:uppercase;}
/* Titelcards */
.tc{width:100%;aspect-ratio:16/9;border-radius:10px;overflow:hidden;position:relative;display:flex;flex-direction:column;justify-content:flex-end;}
.tc-finex{background:var(--ink);}
.tc-finex .geo{position:absolute;inset:0;overflow:hidden;}
.tc-finex .geo::before{content:'';position:absolute;inset:-20%;background-image:repeating-linear-gradient(-45deg,transparent,transparent 38px,rgba(139,26,74,.07) 38px,rgba(139,26,74,.07) 39px);}
.tc-finex .geo::after{content:'';position:absolute;top:-20%;right:-10%;width:70%;height:100%;background:radial-gradient(ellipse,rgba(184,53,106,.2) 0%,transparent 65%);}
.tc-finex .wnum{position:absolute;bottom:3%;right:4%;font-size:clamp(58px,12vw,105px);font-weight:800;color:rgba(139,26,74,.1);letter-spacing:-.05em;line-height:1;z-index:2;user-select:none;}
.tc-finex .rule{height:1px;background:linear-gradient(90deg,var(--bm) 0%,transparent 55%);opacity:.4;margin-bottom:13px;}
.tc-lcup{background:var(--bd);}
.tc-lcup .rings{position:absolute;inset:0;overflow:hidden;}
.tc-lcup .rings::before{content:'';position:absolute;top:-55%;left:50%;transform:translateX(-50%);width:155%;height:115%;border-radius:50%;border:1px solid rgba(232,200,74,.06);}
.tc-lcup .rings::after{content:'';position:absolute;top:-35%;left:50%;transform:translateX(-50%);width:115%;height:95%;border-radius:50%;border:1px solid rgba(232,200,74,.04);}
.tc-lcup .topglow{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 0%,rgba(232,200,74,.1) 0%,transparent 50%);}
.tc-lcup .slns .sl{position:absolute;top:50%;transform:translateY(-50%);height:28%;width:2px;background:linear-gradient(180deg,transparent,rgba(232,200,74,.25),transparent);}
.tc-lcup .slns .sl.l{left:5%;} .tc-lcup .slns .sl.r{right:5%;}
.tc-lcup .tc-body{align-items:center;text-align:center;}
.tc-lcup .stars{display:flex;gap:5px;margin-top:7px;}
.tc-lcup .stars span{width:6px;height:6px;border-radius:50%;background:var(--sg);opacity:.35;}
.tc-lcup .stars span.on{opacity:1;}
.tc-teppich{background:#1a0808;}
.tc-teppich .lux{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 100%,rgba(139,26,74,.55) 0%,transparent 52%),radial-gradient(ellipse at 80% 20%,rgba(184,53,106,.16) 0%,transparent 38%);}
.tc-teppich .lux::after{content:'';position:absolute;inset:0;background-image:repeating-linear-gradient(90deg,transparent,transparent 80px,rgba(232,200,74,.016) 80px,rgba(232,200,74,.016) 81px);}
.tc-teppich .vig{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 50%,transparent 24%,rgba(8,0,3,.62) 100%);}
.tc-teppich .orn{position:absolute;top:17%;left:50%;transform:translateX(-50%);width:56px;height:1px;background:linear-gradient(90deg,transparent,rgba(232,200,74,.36),transparent);z-index:5;}
.tc-teppich .orn::before,.tc-teppich .orn::after{content:'';position:absolute;top:-3px;width:6px;height:6px;border:1px solid rgba(232,200,74,.36);transform:rotate(45deg);}
.tc-teppich .orn::before{left:-4px;} .tc-teppich .orn::after{right:-4px;}
.tc-teppich .tc-body{align-items:center;text-align:center;}
.tc-teppich .rec-row{display:flex;align-items:center;gap:5px;margin-bottom:9px;}
.tc-teppich .rdot{width:7px;height:7px;border-radius:50%;background:#E03030;}
.tc-teppich .rtxt{font-size:9px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.42);}
.tc-teppich .div2{width:36px;height:1px;background:rgba(232,200,74,.32);margin:8px auto;}
.tc-stream{background:var(--ch);}
.tc-stream .scan{position:absolute;inset:0;background-image:repeating-linear-gradient(0deg,transparent,transparent 3px,rgba(255,255,255,.011) 3px,rgba(255,255,255,.011) 4px);}
.tc-stream .scan::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% 50%,rgba(139,26,74,.13) 0%,transparent 57%);}
.tc-stream .tc-body{align-items:center;text-align:center;}
.tc-stream .soon{font-size:9px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--sg);margin-bottom:7px;display:flex;align-items:center;gap:7px;}
.tc-stream .soon::before,.tc-stream .soon::after{content:'';width:16px;height:1px;background:var(--sg);opacity:.42;}
.tc-stream .cd{display:flex;gap:10px;margin-top:12px;align-items:flex-end;}
.cd-b{text-align:center;}
.cd-n{font-size:clamp(18px,4vw,28px);font-weight:800;color:var(--sg);line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-.02em;}
.cd-l{font-size:8px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.26);margin-top:2px;}
.cd-sep{font-size:22px;font-weight:800;color:rgba(232,200,74,.26);line-height:1.1;margin-bottom:12px;}
.tc-body{position:relative;z-index:5;padding:0 8% 7%;display:flex;flex-direction:column;}
.tc-ey{font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;margin-bottom:6px;}
.tc-edition{font-size:9px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:rgba(232,200,74,.52);margin-bottom:3px;}
.tc-bignum{font-size:clamp(42px,8.5vw,72px);font-weight:800;line-height:.9;letter-spacing:-.04em;color:var(--sg);}
.tc-title{font-size:clamp(22px,5.2vw,44px);font-weight:800;line-height:1.0;letter-spacing:-.025em;}
.tc-title em{font-style:italic;}
.tc-sub{font-size:clamp(9px,1.5vw,13px);font-weight:400;letter-spacing:.1em;margin-top:7px;}
.tc-pres{font-size:9px;font-weight:500;letter-spacing:.1em;margin-top:4px;}
/* BG image layer */
.bil{position:absolute;inset:0;z-index:0;background-size:cover;background-position:center;background-repeat:no-repeat;opacity:0;transition:opacity .3s;}
.bil.on{opacity:1;}
.bol{position:absolute;inset:0;z-index:1;pointer-events:none;}
.tc .bol{background:linear-gradient(to top,rgba(6,1,4,.9) 0%,rgba(6,1,4,.55) 38%,rgba(6,1,4,.12) 68%,transparent 100%),linear-gradient(135deg,rgba(6,1,4,.72) 0%,rgba(6,1,4,.3) 28%,transparent 52%);}
.sq-card .bol{background:linear-gradient(to top,rgba(6,1,4,.92) 0%,rgba(6,1,4,.5) 38%,transparent 68%),linear-gradient(135deg,rgba(6,1,4,.6) 0%,transparent 45%);}
.yt-thumb .bol{background:linear-gradient(to top,rgba(6,1,4,.92) 0%,rgba(6,1,4,.55) 30%,rgba(6,1,4,.06) 58%,transparent 100%),linear-gradient(to right,rgba(6,1,4,.55) 0%,transparent 42%),linear-gradient(to bottom,rgba(6,1,4,.5) 0%,transparent 26%);}
.og-card .bol{background:linear-gradient(to right,rgba(6,1,4,.97) 0%,rgba(6,1,4,.7) 45%,rgba(6,1,4,.18) 100%);}
#social,#lowerthird,#titelcards{--soc-dark:#5C0F2F;--soc-mid:#8B1A4A;--soc-accent:#E8C84A;--soc-light:#F2EFE9;--soc-ink:#1A1614;--soc-muted:#6B6458;--soc-alert:#E03030;--soc-chip-text:#1A1614;--soc-mid-rgb:139,26,74;--soc-dark-rgb:92,15,47;--soc-ink-rgb:26,22,20;}
#social .kb.on,#lowerthird .kb.on,#titelcards .kb.on{background:var(--soc-mid);border-color:var(--soc-mid);color:#fff;}
#social .ov-sl::-webkit-slider-thumb,#lowerthird .ov-sl::-webkit-slider-thumb,#titelcards .ov-sl::-webkit-slider-thumb{background:var(--soc-mid);}
#social .ov-val,#lowerthird .ov-val,#titelcards .ov-val{color:var(--soc-accent);}
#social .yt-dark,#social #ig45-1{background:var(--soc-dark)!important;}
#social .yt-dark::before{background:radial-gradient(ellipse at 70% 25%,rgba(var(--soc-mid-rgb),.42) 0%,transparent 55%);}
#social .yt-light{background:var(--soc-light)!important;}
#social .yt-ink2,#social #ig45-2{background:var(--soc-ink)!important;}
#social .yt-ink2::before{background:linear-gradient(180deg,rgba(var(--soc-mid-rgb),.42) 0%,transparent 52%);}
#social .sq-event{background:var(--soc-dark)!important;}
#social .sq-event::before{background:radial-gradient(ellipse at 100% 0%,rgba(var(--soc-mid-rgb),.52) 0%,transparent 52%);}
#social .sq-clean .sq-stripe,#social .og-side{background:var(--soc-mid)!important;}
#social .og-cnt::before{background:radial-gradient(ellipse at 85% 20%,rgba(var(--soc-mid-rgb),.24) 0%,transparent 55%);}
#social .sq-chip{background:var(--soc-accent);color:var(--soc-chip-text);}
#social .rec-pill{background:var(--soc-alert);}
#lowerthird .stage-bg{background:linear-gradient(135deg,var(--soc-dark) 0%,var(--soc-ink) 52%,var(--soc-mid) 100%);}
#lowerthird .stage-bg::after{background:radial-gradient(ellipse at 30% 40%,rgba(255,255,255,.035) 0%,transparent 50%),radial-gradient(ellipse at 70% 60%,rgba(var(--soc-mid-rgb),.14) 0%,transparent 42%);}
#lowerthird .lt-classic .acc{background:var(--soc-accent);}
#lowerthird .lt-classic .body{background:rgba(var(--soc-dark-rgb),.92);}
#lowerthird .lt-classic .logo,#lowerthird .lt-split .tag{background:var(--soc-mid);}
#lowerthird .lt-classic .logo .ld span,#lowerthird .lt-ticker .tl .td span{background:var(--soc-light);}
#lowerthird .lt-classic .logo .lf,#lowerthird .lt-split .tag span{color:var(--soc-light);}
#lowerthird .lt-split .nb{background:var(--soc-accent);}
#lowerthird .lt-split .nb span{color:var(--soc-chip-text);}
#lowerthird .lt-split .tb{background:rgba(var(--soc-ink-rgb),.9);}
#lowerthird .lt-pip{background:var(--soc-accent);}
#lowerthird .lt-rule{background:linear-gradient(90deg,var(--soc-accent) 0%,var(--soc-mid) 42%,transparent 100%);}
#lowerthird .lt-org,#lowerthird .lt-ticker .tw,#lowerthird .lt-ticker .tlab{color:var(--soc-accent);}
#lowerthird .lt-ticker{background:rgba(var(--soc-mid-rgb),.95);}
#lowerthird .lt-ticker .tl{background:var(--soc-dark);border-right-color:var(--soc-accent);}
#titelcards .tc-finex,#titelcards .tc-stream{background:var(--soc-ink);}
#titelcards .tc-lcup,#titelcards .tc-teppich{background:var(--soc-dark);}
#titelcards .tc-finex .geo::before{background-image:repeating-linear-gradient(-45deg,transparent,transparent 38px,rgba(var(--soc-mid-rgb),.08) 38px,rgba(var(--soc-mid-rgb),.08) 39px);}
#titelcards .tc-finex .geo::after{background:radial-gradient(ellipse,rgba(var(--soc-mid-rgb),.22) 0%,transparent 65%);}
#titelcards .tc-finex .wnum{color:rgba(var(--soc-mid-rgb),.12);}
#titelcards .tc-finex .rule{background:linear-gradient(90deg,var(--soc-mid) 0%,transparent 55%);}
#titelcards .tc-lcup .rings::before{border-color:rgba(var(--soc-mid-rgb),.12);}
#titelcards .tc-lcup .rings::after{border-color:rgba(var(--soc-mid-rgb),.08);}
#titelcards .tc-lcup .topglow{background:radial-gradient(ellipse at 50% 0%,rgba(var(--soc-mid-rgb),.18) 0%,transparent 50%);}
#titelcards .tc-lcup .slns .sl{background:linear-gradient(180deg,transparent,rgba(var(--soc-mid-rgb),.32),transparent);}
#titelcards .tc-lcup .stars span,#titelcards .tc-stream .soon::before,#titelcards .tc-stream .soon::after{background:var(--soc-accent);}
#titelcards .tc-teppich .lux{background:radial-gradient(ellipse at 50% 100%,rgba(var(--soc-mid-rgb),.58) 0%,transparent 52%),radial-gradient(ellipse at 80% 20%,rgba(var(--soc-mid-rgb),.2) 0%,transparent 38%);}
#titelcards .tc-teppich .lux::after{background-image:repeating-linear-gradient(90deg,transparent,transparent 80px,rgba(var(--soc-mid-rgb),.035) 80px,rgba(var(--soc-mid-rgb),.035) 81px);}
#titelcards .tc-teppich .orn,#titelcards .tc-teppich .div2{background:linear-gradient(90deg,transparent,rgba(var(--soc-mid-rgb),.42),transparent);}
#titelcards .tc-teppich .orn::before,#titelcards .tc-teppich .orn::after{border-color:rgba(var(--soc-mid-rgb),.42);}
#titelcards .tc-teppich .rdot{background:var(--soc-alert);}
#titelcards .tc-stream .scan::after{background:radial-gradient(ellipse at 50% 50%,rgba(var(--soc-mid-rgb),.18) 0%,transparent 57%);}
#titelcards .tc-stream .soon,#titelcards .cd-n,#titelcards .tc-bignum{color:var(--soc-accent);}
#titelcards .tc-edition,#titelcards .tc-pres{color:rgba(var(--soc-mid-rgb),.58);}
.stage .bol{background:linear-gradient(to top,rgba(4,1,3,.9) 0%,rgba(4,1,3,.25) 30%,transparent 55%),linear-gradient(135deg,rgba(4,1,3,.45) 0%,transparent 32%);}
.has-bg{background:#050103!important;}
.has-bg .geo,.has-bg .rings,.has-bg .scan{opacity:.22!important;}
.has-bg .lux{opacity:.38!important;}
.has-bg .stage-bg{opacity:.1!important;}
/* Anims */
@keyframes slideL{from{transform:translateX(-28px);opacity:0}to{transform:translateX(0);opacity:1}}
.anim-sl{animation:slideL .4s cubic-bezier(.16,1,.3,1) both;}

/* ══════════════════════════════════════════════
   TAB 2 — TITLE DESIGNER
══════════════════════════════════════════════ */
#tab-td{flex-direction:row;}
.td-sidebar{width:290px;flex-shrink:0;background:var(--us);border-right:1px solid var(--bo);overflow-y:auto;padding:14px;display:flex;flex-direction:column;}
.td-canvas-area{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#050202;overflow:hidden;padding:16px;gap:10px;}
.cg{padding:10px 0;border-bottom:1px solid var(--bo);}
.cg:last-child{border-bottom:none;}
.cgt{font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--mu);margin-bottom:8px;}
.cr{display:flex;align-items:center;gap:6px;margin-bottom:6px;flex-wrap:wrap;}
.cl{font-size:11px;font-weight:500;color:var(--mu);min-width:52px;}
.ci,.cs{font-family:'Montserrat',system-ui;font-size:11px;padding:4px 8px;border-radius:5px;border:1px solid var(--b2);background:var(--u2);color:var(--tx);flex:1;outline:none;transition:border-color .15s;min-width:0;}
.ci:focus,.cs:focus{border-color:var(--bm);}
.cs option{background:var(--u2);}
.ci[type=color]{padding:2px 3px;height:26px;min-width:36px;flex:none;cursor:pointer;}
.ci[type=range]{-webkit-appearance:none;height:3px;border-radius:2px;background:var(--b2);padding:0;cursor:pointer;appearance:none;}
.ci[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:13px;height:13px;border-radius:50%;background:var(--bm);cursor:pointer;}
.cv{font-size:10px;color:var(--sg);font-weight:600;min-width:28px;text-align:right;}
.dbr{display:flex;gap:4px;flex-wrap:wrap;margin-top:2px;}
.dbtn{font-family:'Montserrat',system-ui;font-size:10px;font-weight:600;letter-spacing:.04em;padding:4px 9px;border-radius:12px;border:1px solid var(--b2);background:transparent;color:var(--mu);cursor:pointer;transition:all .15s;white-space:nowrap;}
.dbtn:hover,.dbtn.on{background:var(--bx);color:#fff;border-color:var(--bx);}
.ddl{font-family:'Montserrat',system-ui;font-size:11px;font-weight:700;padding:8px;border-radius:18px;border:none;background:var(--sg);color:var(--ink);cursor:pointer;transition:all .15s;width:100%;margin-top:4px;}
.ddl:hover{background:var(--sgd);}
.dubtn{display:flex;align-items:center;justify-content:center;gap:5px;padding:6px;border-radius:7px;border:1px dashed var(--b2);background:transparent;color:var(--mu);cursor:pointer;font-size:10px;font-family:'Montserrat',system-ui;transition:all .15s;width:100%;}
.dubtn:hover{border-color:var(--bm);color:var(--tx);}
.dubtn.hf{border-style:solid;border-color:var(--bm);color:var(--bp);}
.dubtn input{display:none;}
/* Format grid */
.fg{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;}
.fb2{display:flex;flex-direction:column;align-items:center;gap:1px;padding:5px 3px;border-radius:6px;border:1px solid var(--b2);background:transparent;color:var(--mu);cursor:pointer;font-family:'Montserrat',system-ui;transition:all .15s;}
.fb2:hover,.fb2.on{border-color:var(--bx);background:rgba(139,26,74,.1);color:var(--tx);}
.fr2{font-size:9px;font-weight:700;color:var(--sg);}
.fn2{font-size:8px;text-align:center;line-height:1.2;}
.fp2{font-size:7px;color:var(--mu);}
/* Mood grid */
.dmg{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;}
.dmb{display:flex;flex-direction:column;padding:0;border-radius:7px;border:2px solid transparent;background:transparent;cursor:pointer;font-family:'Montserrat',system-ui;transition:all .15s;overflow:hidden;}
.dmb:hover{transform:scale(1.03);}
.dmb.on{border-color:var(--sg);}
.dms{width:100%;height:30px;display:flex;}
.dms span{flex:1;}
.dml{width:100%;padding:3px 3px 4px;background:var(--u2);font-size:8px;font-weight:700;color:var(--tx);text-align:center;letter-spacing:.04em;}
.dmsub{font-size:7px;color:var(--mu);font-weight:400;display:block;}
/* Shadow grid */
.dsg{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;}
.dsb{padding:5px 3px;border-radius:6px;border:1px solid var(--b2);background:transparent;color:var(--mu);cursor:pointer;font-family:'Montserrat',system-ui;font-size:8px;font-weight:600;text-align:center;transition:all .15s;}
.dsb:hover,.dsb.on{border-color:var(--bx);background:rgba(139,26,74,.1);color:var(--tx);}
.dsp{font-size:15px;font-weight:800;margin-bottom:2px;}
.td-cw{position:relative;}
#td-cv{display:block;}
#sa-cv{position:absolute;top:0;left:0;pointer-events:none;display:none;}
#sa-cv.on{display:block;}
.td-info{font-size:10px;color:var(--mu);letter-spacing:.06em;}

/* Mode toggle */
.mode-btns{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-bottom:8px;}
.mode-btn{font-family:'Montserrat',system-ui;font-size:11px;font-weight:700;padding:8px 6px;border-radius:8px;border:2px solid var(--b2);background:transparent;color:var(--mu);cursor:pointer;transition:all .15s;text-align:center;}
.mode-btn:hover{border-color:var(--bm);color:var(--tx);}
.mode-btn.on{border-color:var(--sg);background:rgba(232,200,74,.1);color:var(--sg);}
.mode-badge{display:block;font-size:8px;font-weight:400;color:var(--mu);margin-top:2px;letter-spacing:.06em;}
/* Logo color presets */
.logo-presets{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:5px;}
.lcp{width:22px;height:22px;border-radius:4px;border:2px solid transparent;cursor:pointer;transition:all .15s;flex-shrink:0;}
.lcp:hover,.lcp.on{border-color:#fff;transform:scale(1.12);}
/* Anim controls */
.anim-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;margin-bottom:8px;}
.anim-btn{font-family:'Montserrat',system-ui;font-size:9px;font-weight:600;padding:5px 4px;border-radius:6px;border:1px solid var(--b2);background:transparent;color:var(--mu);cursor:pointer;text-align:center;transition:all .15s;}
.anim-btn:hover,.anim-btn.on{border-color:var(--bm);background:rgba(139,26,74,.1);color:var(--tx);}
.play-bar{display:flex;gap:5px;align-items:center;margin-top:4px;}
.play-btn{font-family:'Montserrat',system-ui;font-size:11px;font-weight:700;padding:7px 10px;border-radius:8px;border:none;background:var(--bm);color:#fff;cursor:pointer;transition:all .15s;flex:1;text-align:center;}
.play-btn:hover{background:var(--bx);}
.play-btn.playing{background:var(--sg);color:var(--ink);}
.loop-btn{font-family:'Montserrat',system-ui;font-size:10px;padding:7px 8px;border-radius:8px;border:1px solid var(--b2);background:transparent;color:var(--mu);cursor:pointer;transition:all .15s;white-space:nowrap;}
.loop-btn.on{border-color:var(--sg);color:var(--sg);}
/* Länderfarben dots row */
.land-row{display:flex;gap:4px;align-items:center;flex-wrap:wrap;}
.land-btn{display:flex;flex-direction:column;gap:2px;padding:4px 6px;border-radius:6px;border:1px solid var(--b2);background:transparent;cursor:pointer;transition:all .15s;}
.land-btn:hover,.land-btn.on{border-color:var(--tx);}
.land-dots{display:flex;flex-direction:column;gap:1.5px;}
.land-dots span{display:block;height:3px;width:16px;border-radius:1px;}
.land-lbl{font-size:8px;color:var(--mu);font-weight:600;letter-spacing:.06em;text-align:center;}
/* Modal */
.modal-bg{position:fixed;inset:0;background:rgba(0,0,0,.72);z-index:300;display:none;align-items:center;justify-content:center;}
.modal-bg.open{display:flex;}
.modal{background:var(--us);border:1px solid var(--b2);border-radius:12px;padding:18px;width:280px;display:flex;flex-direction:column;gap:10px;}
.modal h3{font-size:12px;font-weight:700;color:var(--tx);}
.modal-row{display:flex;flex-direction:column;gap:3px;}
.modal-row label{font-size:10px;color:var(--mu);}
.modal-cols{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;}
.mc-item{display:flex;flex-direction:column;gap:2px;align-items:center;}
.mc-item label{font-size:8px;color:var(--mu);text-align:center;}
.mbtns{display:flex;gap:7px;margin-top:3px;}
.mbtns button{flex:1;font-family:'Montserrat',system-ui;font-size:11px;font-weight:600;padding:7px;border-radius:7px;cursor:pointer;border:1px solid var(--b2);background:transparent;color:var(--mu);transition:all .15s;}
.mbtns button.pri{background:var(--sg);color:var(--ink);border-color:var(--sg);}

/* ══════════════════════════════════════
   SLIDES & CAROUSEL DESIGNER  v0.5.31 — Globaler LM-Studio-Status-Indikator (Top-Bar)
   ══════════════════════════════════════ */
#tab-slides{padding:0;overflow:hidden;}
.sd-layout{display:flex;height:100%;overflow:hidden;}

/* Sidebar */
.sd-sidebar{width:200px;flex-shrink:0;border-right:1px solid var(--bo);display:flex;flex-direction:column;overflow-y:auto;padding:14px 10px;gap:16px;background:var(--bg);}
.sd-section-label{font-size:9px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--mu);margin-bottom:7px;}
.sd-format-grid{display:grid;grid-template-columns:1fr 1fr;gap:5px;}
.sd-fmt-group-sep{grid-column:1/-1;font-size:8.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--mu);padding:6px 0 2px;border-top:1px solid var(--bo);margin-top:3px;}
.sd-fmt-btn{background:var(--u2);border:1px solid var(--bo);border-radius:7px;padding:8px 4px 6px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:4px;transition:all .15s;width:100%;}
.sd-fmt-btn:hover{border-color:var(--bm);}
.sd-fmt-btn.on{border-color:var(--bm);background:rgba(184,53,106,.1);}
.sd-fmt-icon-wrap{width:100%;display:flex;justify-content:center;align-items:center;height:28px;}
.sd-fmt-icon{background:var(--mu);border-radius:2px;opacity:.35;}
.sd-fmt-btn.on .sd-fmt-icon{background:var(--bm);opacity:.8;}
.sd-fmt-label{font-size:8px;color:var(--mu);line-height:1.2;text-align:center;}
.sd-fmt-btn.on .sd-fmt-label{color:var(--bm);}
.sd-tpl-list{display:flex;flex-direction:column;gap:5px;}
.sd-tpl-card{background:var(--u2);border:1px solid var(--bo);border-radius:7px;padding:9px 11px;cursor:pointer;transition:all .15s;}
.sd-tpl-card:hover{border-color:var(--bm);}
.sd-tpl-card.on{border-color:var(--bm);background:rgba(184,53,106,.08);}
.sd-tpl-icon{font-size:15px;margin-bottom:3px;opacity:.7;}
.sd-tpl-name{font-size:11px;font-weight:700;color:var(--tx);}
.sd-tpl-desc{font-size:9px;color:var(--mu);line-height:1.35;margin-top:2px;}

/* Stage center */
.sd-stage-area{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0;}
.sd-stage-wrap{flex:1;display:flex;align-items:center;justify-content:center;background:#0c0a09;overflow:hidden;padding:20px;position:relative;}
.sd-stage{position:absolute;background:#fff;box-shadow:0 12px 60px rgba(0,0,0,.7);transform-origin:center center;overflow:hidden;}
.sd-stage-toolbar{min-height:46px;border-top:1px solid var(--bo);display:flex;align-items:center;flex-wrap:wrap;gap:6px;padding:7px 14px;flex-shrink:0;background:var(--bg);}
.sd-stage-info{font-size:10px;color:var(--mu);}

/* Inspector right */
.sd-inspector{width:210px;flex-shrink:0;border-left:1px solid var(--bo);display:flex;flex-direction:column;overflow-y:auto;padding:14px 12px;gap:11px;background:var(--bg);}
.sd-insp-section{font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--mu);}
.sd-insp-field{display:flex;flex-direction:column;gap:3px;}
.sd-insp-label{font-size:9px;color:var(--mu);}
.sd-insp-input,.sd-insp-textarea{background:var(--u2);border:1px solid var(--bo);border-radius:5px;padding:5px 8px;font-size:11px;color:var(--tx);font-family:'Montserrat',system-ui;outline:none;width:100%;box-sizing:border-box;}
.sd-insp-input:focus,.sd-insp-textarea:focus{border-color:var(--bm);}
.sd-insp-textarea{resize:vertical;min-height:52px;line-height:1.4;}
.sd-insp-empty{font-size:10px;color:var(--mu);line-height:1.6;}
.sd-insp-divider{height:1px;background:var(--bo);margin:2px 0;}
.sd-brand-badge{display:inline-flex;align-items:center;gap:5px;font-size:9px;padding:3px 8px;border-radius:12px;border:1px solid var(--bo);color:var(--mu);}
.sd-brand-badge.ok{border-color:#22C55E33;color:#22C55E;}

/* Deck thumbnails strip (v0.5.16) */
.sd-strip{height:104px;border-top:1px solid var(--bo);background:var(--bg);display:flex;align-items:center;gap:10px;padding:10px 14px;overflow-x:auto;overflow-y:hidden;flex-shrink:0;scrollbar-width:thin;}
.sd-strip::-webkit-scrollbar{height:6px;}
.sd-strip::-webkit-scrollbar-thumb{background:var(--bo);border-radius:3px;}
.sd-strip-empty{font-size:10px;color:var(--mu);font-style:italic;padding:0 8px;}
.sd-thumb{position:relative;flex-shrink:0;height:80px;border:2px solid var(--bo);border-radius:6px;overflow:hidden;cursor:pointer;background:#fff;transition:border-color .12s, transform .12s;display:flex;align-items:flex-end;}
.sd-thumb:hover{border-color:var(--mu);}
.sd-thumb.on{border-color:var(--bm);box-shadow:0 0 0 2px rgba(184,53,106,.18);}
.sd-thumb.dragging{opacity:.4;}
.sd-thumb-canvas{position:absolute;inset:0;transform-origin:top left;pointer-events:none;}
.sd-thumb-num{position:absolute;top:3px;left:4px;font-size:9px;font-weight:700;color:#fff;background:rgba(0,0,0,.55);padding:1px 5px;border-radius:8px;letter-spacing:.04em;z-index:2;pointer-events:none;}
.sd-thumb-actions{position:absolute;top:3px;right:3px;display:flex;gap:2px;z-index:3;opacity:0;transition:opacity .12s;}
.sd-thumb:hover .sd-thumb-actions{opacity:1;}
.sd-thumb-act{width:18px;height:18px;background:rgba(0,0,0,.6);color:#fff;border:none;border-radius:4px;font-size:11px;line-height:18px;cursor:pointer;padding:0;display:flex;align-items:center;justify-content:center;}
.sd-thumb-act:hover{background:#000;}
.sd-thumb-act.del:hover{background:#dc2626;}
.sd-thumb-tplname{position:absolute;bottom:0;left:0;right:0;font-size:8px;color:#fff;background:rgba(0,0,0,.55);padding:2px 4px;text-align:center;letter-spacing:.02em;z-index:2;pointer-events:none;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;}
.sd-strip-add{flex-shrink:0;height:80px;width:60px;border:2px dashed var(--bo);border-radius:6px;background:transparent;color:var(--mu);font-size:22px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s;}
.sd-strip-add:hover{border-color:var(--bm);color:var(--bm);}
.sd-strip-add:disabled{opacity:.4;cursor:not-allowed;}

/* Toolbar buttons (v0.5.16) */
.sd-tb-btn{background:var(--u2);border:1px solid var(--bo);border-radius:5px;padding:5px 10px;font-size:11px;color:var(--tx);cursor:pointer;font-family:inherit;transition:all .12s;}
.sd-tb-btn:hover{border-color:var(--bm);color:var(--bm);}
.sd-tb-btn:disabled{opacity:.4;cursor:not-allowed;}
.sd-tb-btn.pri{background:var(--bm);border-color:var(--bm);color:#fff;font-weight:700;}
.sd-tb-btn.pri:hover{background:var(--bx);border-color:var(--bx);color:#fff;}
.sd-tb-spacer{flex:1;}
.sd-tb-divider{width:1px;height:22px;background:var(--bo);margin:0 4px;}
.sd-tb-label{font-size:9px;color:var(--mu);letter-spacing:.08em;text-transform:uppercase;margin-right:2px;}

/* Format-Umschalt-Pillen für aktive Folie (v0.5.17) */
.sd-fmt-switch{display:inline-flex;gap:3px;}
.sd-fmt-pill{font-size:10px;padding:3px 8px;border-radius:11px;border:1px solid var(--bo);background:var(--u2);color:var(--mu);cursor:pointer;font-family:inherit;line-height:1;}
.sd-fmt-pill:hover:not(:disabled){border-color:var(--bm);color:var(--bm);}
.sd-fmt-pill.on{border-color:var(--bm);background:var(--bm);color:#fff;}
.sd-fmt-pill:disabled{opacity:.3;cursor:not-allowed;}

/* Selection-Overlay & Resize-Handles (v0.5.19) */
.sd-stage [data-part-idx]{cursor:pointer;}
.sd-stage.editing [data-part-idx]:hover{outline:1px dashed rgba(184,53,106,.5);outline-offset:-1px;}
.sd-stage [data-part-idx].sd-selected{outline:2px solid var(--bm);outline-offset:-2px;}
.sd-sel-overlay{position:absolute;pointer-events:none;z-index:50;}
.sd-sel-box{position:absolute;inset:0;border:2px solid var(--bm);box-shadow:0 0 0 1px rgba(0,0,0,.3);pointer-events:none;}
/* v0.5.28 — Sekundär-Selektion (Multi-Select, nicht primary) */
.sd-sel-overlay.sd-sel-secondary .sd-sel-box{border-style:dashed;border-width:1.5px;border-color:var(--bm);opacity:.7;}
.sd-sel-handle{position:absolute;width:14px;height:14px;background:#fff;border:2px solid var(--bm);border-radius:2px;pointer-events:auto;z-index:51;}
.sd-sel-handle.nw{top:-7px;left:-7px;cursor:nwse-resize;}
.sd-sel-handle.n{top:-7px;left:50%;margin-left:-7px;cursor:ns-resize;}
.sd-sel-handle.ne{top:-7px;right:-7px;cursor:nesw-resize;}
.sd-sel-handle.e{top:50%;right:-7px;margin-top:-7px;cursor:ew-resize;}
.sd-sel-handle.se{bottom:-7px;right:-7px;cursor:nwse-resize;}
.sd-sel-handle.s{bottom:-7px;left:50%;margin-left:-7px;cursor:ns-resize;}
.sd-sel-handle.sw{bottom:-7px;left:-7px;cursor:nesw-resize;}
.sd-sel-handle.w{top:50%;left:-7px;margin-top:-7px;cursor:ew-resize;}
.sd-sel-info{position:absolute;top:-22px;left:0;background:var(--bm);color:#fff;font-size:10px;padding:2px 6px;border-radius:3px;white-space:nowrap;font-family:'Montserrat',sans-serif;pointer-events:none;}
.sd-stage-wrap.dragging{cursor:grabbing!important;}
.sd-stage-wrap.dragging *{user-select:none!important;}

/* Grid-Overlay (v0.5.20) */
.sd-grid{position:absolute;inset:0;pointer-events:none;z-index:40;}
.sd-grid-line{position:absolute;background:rgba(184,53,106,.18);}
.sd-grid-line.col{width:1px;top:0;bottom:0;}
.sd-grid-line.row{height:1px;left:0;right:0;}
.sd-grid-line.zone{background:rgba(184,53,106,.5);}
.sd-grid-line.zone.col{width:2px;}
.sd-grid-line.zone.row{height:2px;}
.sd-grid-zone-label{position:absolute;font-size:11px;color:rgba(184,53,106,.7);font-family:'Montserrat',monospace;letter-spacing:.08em;text-transform:uppercase;font-weight:700;background:rgba(255,255,255,.85);padding:2px 6px;border-radius:3px;pointer-events:none;}

/* Inline-Text-Editing (v0.5.20) */
.sd-stage [contenteditable="true"]{outline:2px solid var(--bm)!important;outline-offset:4px;background:rgba(184,53,106,.06);cursor:text!important;}
.sd-stage.text-editing [data-part-idx]:not(.editing){opacity:.5;}

/* Undo/Redo Indicator */
.sd-undo-toast{position:absolute;left:50%;top:18px;transform:translateX(-50%);background:rgba(0,0,0,.78);color:#fff;font-size:11px;padding:6px 14px;border-radius:14px;pointer-events:none;z-index:100;font-family:'Montserrat',sans-serif;letter-spacing:.04em;opacity:0;transition:opacity .2s;}
.sd-undo-toast.show{opacity:1;}

/* Insert-Palette (v0.5.21) */
.sd-insert-grid{display:grid;grid-template-columns:1fr 1fr;gap:5px;}
.sd-insert-tile{background:var(--u2);border:1px solid var(--bo);border-radius:6px;padding:9px 4px;cursor:pointer;text-align:center;transition:all .12s;display:flex;flex-direction:column;align-items:center;gap:3px;}
.sd-insert-tile:hover{border-color:var(--bm);background:rgba(184,53,106,.08);}
.sd-insert-tile-icon{font-size:18px;line-height:1;color:var(--bm);}
.sd-insert-tile-label{font-size:9px;font-weight:700;color:var(--tx);letter-spacing:.04em;}

/* Asset-Picker-Modal (v0.5.21) */
.sd-modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.65);z-index:200;display:flex;align-items:center;justify-content:center;}
.sd-modal{background:var(--u1);border:1px solid var(--bo);border-radius:12px;width:520px;max-width:92vw;max-height:80vh;display:flex;flex-direction:column;overflow:hidden;}
.sd-modal-head{padding:14px 18px;border-bottom:1px solid var(--bo);display:flex;align-items:center;justify-content:space-between;}
.sd-modal-title{font-size:13px;font-weight:700;color:var(--tx);}
.sd-modal-close{background:none;border:none;color:var(--mu);font-size:18px;cursor:pointer;padding:2px 8px;}
.sd-modal-close:hover{color:var(--tx);}
.sd-modal-body{padding:14px 18px;overflow-y:auto;flex:1;}
.sd-asset-empty{padding:30px 14px;text-align:center;color:var(--mu);font-size:11px;line-height:1.6;}
.sd-asset-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:10px;}
.sd-asset-tile{background:var(--u2);border:1px solid var(--bo);border-radius:6px;padding:6px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:4px;transition:all .12s;}
.sd-asset-tile:hover{border-color:var(--bm);}
.sd-asset-thumb{width:80px;height:80px;background:#fff;border-radius:4px;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.sd-asset-thumb img{max-width:100%;max-height:100%;object-fit:contain;}
.sd-asset-name{font-size:10px;color:var(--tx);text-align:center;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

/* Shape-Picker (v0.5.22) */
.sd-shape-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(78px,1fr));gap:8px;}
.sd-shape-tile{background:var(--u2);border:1px solid var(--bo);border-radius:6px;padding:8px 4px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:6px;transition:all .12s;}
.sd-shape-tile:hover{border-color:var(--bm);background:rgba(184,53,106,.07);}
.sd-shape-preview{width:48px;height:48px;background:var(--bm);}
.sd-shape-name{font-size:9px;color:var(--tx);text-align:center;line-height:1.2;}

/* SVG-Paste-Modal (v0.5.22) */
.sd-svg-textarea{width:100%;min-height:140px;background:var(--u2);border:1px solid var(--bo);border-radius:6px;padding:9px 11px;font-family:'Menlo','Consolas',monospace;font-size:11px;color:var(--tx);outline:none;resize:vertical;line-height:1.5;}
.sd-svg-textarea:focus{border-color:var(--bm);}
.sd-svg-hint{font-size:10px;color:var(--mu);line-height:1.5;margin:6px 0 12px;}
.sd-svg-hint code{background:var(--u2);padding:1px 5px;border-radius:3px;font-size:10px;color:var(--bm);}
/* SVG-Prompt-Tabs (v0.5.27) */
.sd-svg-tabs{display:flex;gap:4px;border-bottom:1px solid var(--bo);margin-bottom:12px;}
.sd-svg-tab{background:transparent;border:none;padding:8px 14px;font-size:11px;color:var(--mu);cursor:pointer;border-bottom:2px solid transparent;font-family:inherit;}
.sd-svg-tab:hover{color:var(--tx);}
.sd-svg-tab.on{color:var(--tx);border-bottom-color:var(--bm);font-weight:600;}
.sd-svg-prompt-status{font-size:10px;color:var(--mu);padding:6px 0 0;display:flex;align-items:center;gap:6px;}
.sd-svg-prompt-status .dot{width:6px;height:6px;border-radius:50%;background:var(--mu);}
.sd-svg-prompt-status.loading .dot{background:#eab308;animation:sdAiPulse 1s ease-in-out infinite;}
.sd-svg-prompt-status.success .dot{background:#22c55e;}
.sd-svg-prompt-status.error .dot{background:#ef4444;}
.sd-svg-preview{display:flex;align-items:center;justify-content:center;background:var(--u2);border:1px dashed var(--bo);border-radius:6px;min-height:140px;margin-top:10px;padding:10px;}
.sd-svg-preview svg{max-width:100%;max-height:120px;}
.sd-svg-preview-empty{font-size:10px;color:var(--mu);}
.sd-modal-actions{display:flex;justify-content:flex-end;gap:8px;padding:10px 18px;border-top:1px solid var(--bo);background:var(--bg);}
.sd-modal-btn{background:var(--u2);border:1px solid var(--bo);border-radius:5px;padding:6px 14px;font-size:11px;color:var(--tx);cursor:pointer;font-family:inherit;}
.sd-modal-btn:hover{border-color:var(--bm);}
.sd-modal-btn.pri{background:var(--bm);border-color:var(--bm);color:#fff;font-weight:700;}
.sd-modal-btn.pri:hover{background:var(--bx);border-color:var(--bx);}

/* Inspector Property-Panel & Brand-Color-Picker (v0.5.23) */
.sd-prop-row{display:flex;align-items:center;gap:6px;margin-bottom:6px;}
.sd-prop-label{font-size:9px;color:var(--mu);width:40px;flex-shrink:0;text-transform:uppercase;letter-spacing:.06em;}
.sd-prop-num{flex:1;background:var(--u2);border:1px solid var(--bo);border-radius:4px;padding:4px 6px;font-size:11px;color:var(--tx);font-family:'Menlo','Consolas',monospace;outline:none;width:100%;box-sizing:border-box;-moz-appearance:textfield;}
.sd-prop-num:focus{border-color:var(--bm);}
.sd-prop-num::-webkit-outer-spin-button,.sd-prop-num::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
.sd-prop-select{flex:1;background:var(--u2);border:1px solid var(--bo);border-radius:4px;padding:4px 6px;font-size:11px;color:var(--tx);font-family:'Montserrat',sans-serif;outline:none;cursor:pointer;}
.sd-prop-select:focus{border-color:var(--bm);}
.sd-prop-check{display:flex;align-items:center;gap:6px;font-size:10px;color:var(--mu);cursor:pointer;}
.sd-prop-check input{accent-color:var(--bm);cursor:pointer;}

.sd-color-pick{display:flex;flex-direction:column;gap:4px;width:100%;}
.sd-color-row{display:flex;align-items:center;gap:4px;flex-wrap:wrap;}
.sd-color-swatch{width:16px;height:16px;border-radius:3px;border:1px solid var(--bo);cursor:pointer;flex-shrink:0;position:relative;transition:transform .12s;}
.sd-color-swatch:hover{transform:scale(1.18);border-color:var(--bm);}
.sd-color-swatch.on{box-shadow:0 0 0 2px var(--bm);}
.sd-color-swatch.none{background:#fff;color:#999;font-size:11px;display:flex;align-items:center;justify-content:center;line-height:1;background-image:linear-gradient(45deg,transparent 47%,#dc2626 47%,#dc2626 53%,transparent 53%);}
.sd-color-free{display:inline-flex;align-items:center;gap:4px;font-size:9px;color:var(--mu);cursor:pointer;}
.sd-color-free input[type="color"]{width:18px;height:18px;border:none;background:none;cursor:pointer;padding:0;border-radius:3px;}
.sd-color-token{font-size:9px;color:var(--mu);font-family:'Menlo',monospace;}

/* Sidepanel-spezifische Inspector-Erweiterung */
.sd-prop-section{font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--bm);margin-top:8px;margin-bottom:6px;}
.sd-prop-empty{font-size:10px;color:var(--mu);font-style:italic;padding:4px 0;}
.sd-prop-actions{display:flex;gap:5px;flex-wrap:wrap;margin-top:6px;}
.sd-prop-act{font-size:10px;padding:4px 8px;border-radius:4px;background:var(--u2);border:1px solid var(--bo);color:var(--tx);cursor:pointer;font-family:inherit;}
.sd-prop-act:hover{border-color:var(--bm);color:var(--bm);}

/* Layer-Liste (v0.5.24) */
.sd-layers{display:flex;flex-direction:column;gap:2px;max-height:340px;min-height:60px;overflow-y:auto;border:1px solid var(--bo);border-radius:5px;background:var(--u2);padding:4px;flex-shrink:0;}
.sd-layers::-webkit-scrollbar{width:6px;}
.sd-layers::-webkit-scrollbar-thumb{background:var(--bo);border-radius:3px;}
.sd-layer{display:flex;align-items:center;gap:6px;padding:5px 7px;border-radius:4px;cursor:pointer;background:transparent;border:1px solid transparent;font-size:10px;color:var(--tx);transition:background .1s;}
.sd-layer:hover{background:rgba(184,53,106,.08);}
.sd-layer.on{background:rgba(184,53,106,.15);border-color:var(--bm);}
.sd-layer.dragging{opacity:.4;}
.sd-layer.hidden{opacity:.45;font-style:italic;}
.sd-layer-grip{color:var(--mu);font-size:11px;cursor:grab;flex-shrink:0;width:8px;line-height:1;}
.sd-layer-icon{width:14px;font-size:11px;color:var(--bm);flex-shrink:0;text-align:center;}
.sd-layer-label{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;}
.sd-layer-input{flex:1;min-width:0;background:transparent;border:1px solid transparent;border-radius:3px;color:var(--tx);font-size:10px;padding:2px 4px;font-family:inherit;outline:none;transition:all .1s;}
.sd-layer-input:hover{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.06);}
.sd-layer-input:focus{background:var(--u1);border-color:var(--bm);}
.sd-layer-input::placeholder{color:var(--mu);font-style:italic;}
.sd-layer-actions{display:flex;gap:2px;opacity:0;transition:opacity .1s;}
.sd-layer:hover .sd-layer-actions, .sd-layer.on .sd-layer-actions{opacity:1;}
.sd-layer-act{background:none;border:none;color:var(--mu);cursor:pointer;font-size:11px;padding:1px 4px;line-height:1;border-radius:3px;}
.sd-layer-act:hover{background:rgba(184,53,106,.18);color:var(--bm);}
.sd-layer-act.del:hover{background:#dc2626;color:#fff;}
.sd-layer-empty{padding:14px 8px;text-align:center;color:var(--mu);font-size:10px;font-style:italic;}

/* Auto-Save Indicator */
.sd-autosave-tag{font-size:9px;color:var(--mu);font-style:italic;}

/* KI-Generator-Modal (v0.5.25) */
.sd-ai-modal{width:640px;max-width:94vw;}
.sd-ai-textarea{width:100%;min-height:88px;background:var(--u2);border:1px solid var(--bo);border-radius:7px;padding:12px 14px;font-size:13px;color:var(--tx);font-family:'Montserrat',sans-serif;outline:none;resize:vertical;line-height:1.55;}
.sd-ai-textarea:focus{border-color:var(--bm);}
.sd-ai-controls{display:flex;gap:10px;margin-top:10px;flex-wrap:wrap;align-items:center;}
.sd-ai-ctrl{display:flex;align-items:center;gap:5px;font-size:10px;color:var(--mu);}
.sd-ai-ctrl select{background:var(--u2);border:1px solid var(--bo);border-radius:4px;padding:4px 7px;font-size:11px;color:var(--tx);}
.sd-ai-status{font-size:11px;color:var(--mu);margin-top:10px;line-height:1.5;}
.sd-ai-status.error{color:#dc2626;}
.sd-ai-status.success{color:#16a34a;}
.sd-ai-status.loading{color:var(--bm);}
.sd-ai-status .dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:currentColor;margin-right:6px;}
.sd-ai-status.loading .dot{animation:sdAiPulse 1s ease-in-out infinite;}
@keyframes sdAiPulse{0%,100%{opacity:.4}50%{opacity:1}}
.sd-ai-hint{font-size:10px;color:var(--mu);line-height:1.5;margin-top:8px;}
.sd-ai-examples{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px;}
.sd-ai-example{font-size:10px;background:var(--u2);border:1px solid var(--bo);border-radius:12px;padding:3px 9px;cursor:pointer;color:var(--mu);transition:all .12s;}
.sd-ai-example:hover{border-color:var(--bm);color:var(--bm);}
.sd-ai-lm-status{font-size:9px;letter-spacing:.04em;padding:3px 7px;border-radius:10px;border:1px solid var(--bo);color:var(--mu);}
.sd-ai-lm-status.ok{border-color:#16a34a44;color:#16a34a;}
.sd-ai-lm-status.fail{border-color:#dc262644;color:#dc2626;}

/* KI-Deck-Generator (v0.5.29) */
.sd-deck-modal{width:740px;max-width:95vw;max-height:88vh;display:flex;flex-direction:column;}
.sd-deck-modal .sd-modal-body{overflow:auto;}
.sd-deck-field{margin-bottom:14px;}
.sd-deck-label{font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--mu);margin-bottom:6px;font-weight:700;display:flex;align-items:center;gap:6px;}
.sd-deck-textarea{width:100%;min-height:120px;background:var(--u2);border:1px solid var(--bo);border-radius:7px;padding:12px 14px;font-size:13px;color:var(--tx);font-family:'Montserrat',sans-serif;outline:none;resize:vertical;line-height:1.55;}
.sd-deck-textarea:focus{border-color:var(--bm);}
.sd-deck-row{display:flex;gap:12px;align-items:flex-start;}
.sd-deck-row > *{flex:1;}
.sd-deck-input{background:var(--u2);border:1px solid var(--bo);border-radius:5px;padding:7px 10px;font-size:12px;color:var(--tx);font-family:inherit;}
.sd-deck-input:focus{outline:none;border-color:var(--bm);}
.sd-deck-mode{display:flex;gap:6px;margin-top:4px;}
.sd-deck-mode-btn{flex:1;background:var(--u2);border:1px solid var(--bo);border-radius:5px;padding:8px 10px;font-size:11px;color:var(--mu);cursor:pointer;font-family:inherit;text-align:left;}
.sd-deck-mode-btn.on{border-color:var(--bm);color:var(--tx);background:rgba(108,160,255,0.08);}
.sd-deck-mode-btn-title{font-weight:600;font-size:12px;color:var(--tx);}
.sd-deck-mode-btn-desc{font-size:10px;color:var(--mu);margin-top:2px;line-height:1.4;}
.sd-deck-presets{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px;}
.sd-deck-preset{font-size:10px;background:var(--u2);border:1px solid var(--bo);border-radius:12px;padding:4px 10px;cursor:pointer;color:var(--mu);transition:all .12s;}
.sd-deck-preset:hover{border-color:var(--bm);color:var(--bm);}
.sd-deck-progress{margin-top:14px;padding:14px;background:var(--u2);border-radius:8px;border:1px solid var(--bo);}
.sd-deck-progress-bar{height:6px;background:var(--bo);border-radius:3px;overflow:hidden;margin-top:8px;}
.sd-deck-progress-fill{height:100%;background:var(--bm);transition:width .25s;}
.sd-deck-progress-step{font-size:11px;color:var(--tx);font-weight:600;}
.sd-deck-progress-step .num{color:var(--bm);font-weight:700;}
.sd-deck-outline-table{width:100%;border-collapse:collapse;margin-top:10px;font-size:11px;}
.sd-deck-outline-table thead th{text-align:left;padding:6px 8px;border-bottom:1px solid var(--bo);color:var(--mu);font-size:9px;letter-spacing:.06em;text-transform:uppercase;font-weight:700;background:var(--u2);}
.sd-deck-outline-table tbody td{padding:8px;border-bottom:1px solid var(--bo);vertical-align:top;}
.sd-deck-outline-table tbody tr:hover{background:var(--u2);}
.sd-deck-outline-input{width:100%;background:transparent;border:1px solid transparent;border-radius:3px;padding:3px 5px;font-size:11px;color:var(--tx);font-family:inherit;}
.sd-deck-outline-input:hover{border-color:var(--bo);background:var(--u2);}
.sd-deck-outline-input:focus{outline:none;border-color:var(--bm);background:var(--u2);}
.sd-deck-outline-tpl{font-size:10px;background:var(--u2);border:1px solid var(--bo);border-radius:4px;padding:3px 6px;color:var(--mu);font-family:inherit;}
.sd-deck-outline-del{background:transparent;border:none;color:var(--mu);font-size:14px;cursor:pointer;padding:2px 6px;border-radius:3px;line-height:1;}
.sd-deck-outline-del:hover{background:#dc2626;color:#fff;}
.sd-deck-outline-row{display:flex;align-items:center;gap:8px;margin-top:10px;}
.sd-deck-summary{font-size:11px;color:var(--mu);background:var(--u2);border:1px solid var(--bo);border-radius:6px;padding:8px 10px;margin-bottom:10px;line-height:1.5;}
.sd-deck-summary strong{color:var(--tx);}
.sd-deck-step-pill{display:inline-block;font-size:9px;letter-spacing:.06em;padding:2px 7px;border-radius:10px;background:var(--bm);color:#fff;font-weight:700;margin-right:6px;text-transform:uppercase;}

/* User-Templates (v0.5.26) */
.sd-tpl-divider{font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--mu);margin:8px 4px 4px;padding-top:6px;border-top:1px dashed var(--bo);font-weight:700;}
.sd-tpl-card.user{position:relative;background:var(--u2);border-color:#22D3EE33;}
.sd-tpl-card.user .sd-tpl-icon{color:#22D3EE;}
.sd-tpl-card.user.on{border-color:var(--bm);}
.sd-tpl-del{position:absolute;top:4px;right:4px;width:18px;height:18px;background:none;border:none;color:var(--mu);font-size:13px;cursor:pointer;line-height:1;border-radius:3px;padding:0;display:none;}
.sd-tpl-card.user:hover .sd-tpl-del{display:block;}
.sd-tpl-del:hover{background:#dc2626;color:#fff;}

.sd-ai-prompt-history{display:flex;align-items:center;gap:5px;margin-top:6px;}
.sd-ai-prompt-history select{flex:1;background:var(--u2);border:1px solid var(--bo);border-radius:4px;padding:4px 7px;font-size:10px;color:var(--tx);}

/* v0.5.34 — SVG-Crop-Modal */
.sd-crop-modal{width:780px;max-width:96vw;display:flex;flex-direction:column;}
.sd-crop-modal .sd-modal-body{overflow:auto;}
.sd-crop-stage-wrap{position:relative;background:rgba(255,255,255,0.04);border:1px solid var(--bo);border-radius:8px;margin:10px 0 14px;overflow:hidden;}
.sd-crop-stage{position:relative;width:100%;}
.sd-crop-stage svg{display:block;width:100%;height:auto;}
.sd-crop-mask{position:absolute;inset:0;pointer-events:none;}
.sd-crop-mask-bg{position:absolute;background:rgba(0,0,0,0.55);}
.sd-crop-rect{position:absolute;border:2px dashed var(--bm);box-shadow:0 0 0 1px rgba(0,0,0,0.3);cursor:move;pointer-events:auto;}
.sd-crop-rect:hover{border-style:solid;}
.sd-crop-handle{position:absolute;width:14px;height:14px;background:#fff;border:2px solid var(--bm);border-radius:2px;pointer-events:auto;z-index:2;}
.sd-crop-handle.nw{top:-7px;left:-7px;cursor:nwse-resize;}
.sd-crop-handle.n{top:-7px;left:50%;margin-left:-7px;cursor:ns-resize;}
.sd-crop-handle.ne{top:-7px;right:-7px;cursor:nesw-resize;}
.sd-crop-handle.e{top:50%;right:-7px;margin-top:-7px;cursor:ew-resize;}
.sd-crop-handle.se{bottom:-7px;right:-7px;cursor:nwse-resize;}
.sd-crop-handle.s{bottom:-7px;left:50%;margin-left:-7px;cursor:ns-resize;}
.sd-crop-handle.sw{bottom:-7px;left:-7px;cursor:nesw-resize;}
.sd-crop-handle.w{top:50%;left:-7px;margin-top:-7px;cursor:ew-resize;}
.sd-crop-info{font-size:10px;color:var(--mu);text-align:center;padding:6px 0;}
.sd-crop-info strong{color:var(--tx);}

/* Bulk-Panel Multi-Select (v0.5.28) */
.sd-bulk-section{font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--bm);padding:10px 0 5px;font-weight:700;}
.sd-bulk-count{font-size:11px;color:var(--tx);font-weight:600;margin-bottom:8px;display:flex;align-items:center;gap:6px;}
.sd-bulk-count-pill{background:var(--bm);color:#fff;font-size:10px;padding:2px 7px;border-radius:10px;font-weight:700;}
.sd-bulk-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;margin-bottom:8px;}
.sd-bulk-btn{background:var(--u2);border:1px solid var(--bo);border-radius:5px;padding:8px 4px;font-size:11px;color:var(--tx);cursor:pointer;font-family:inherit;display:flex;align-items:center;justify-content:center;gap:4px;transition:border-color .12s;}
.sd-bulk-btn:hover{border-color:var(--bm);}
.sd-bulk-btn.wide{grid-column:span 3;}
.sd-bulk-btn.half{grid-column:span 1;}
.sd-bulk-btn.danger:hover{border-color:#dc2626;color:#dc2626;}
.sd-bulk-btn-icon{font-family:'Menlo',monospace;font-size:13px;}

/* Snap-Guide-Lines (v0.5.21) */
.sd-guides{position:absolute;inset:0;pointer-events:none;z-index:55;}
.sd-guide{position:absolute;background:#22D3EE;}
.sd-guide.v{width:1px;top:0;bottom:0;}
.sd-guide.h{height:1px;left:0;right:0;}
.sd-guide.center{background:#F59E0B;}


/* ══ grafik.tools Chrome-Anpassung (Override) ══ */
:root{
  --ub:#0c0c0e; --us:#141417; --u1:#141417; --u2:#1b1b1f; --u3:#17171b;
  --tx:#ecece7; --mu:rgba(236,236,231,.5); --mi:rgba(236,236,231,.24);
  --bo:rgba(255,255,255,.08); --b2:rgba(255,255,255,.14); --b3:rgba(255,255,255,.22);
}
body{font-family:'Hanken Grotesk','Montserrat',system-ui,sans-serif;}
.app-nav{background:rgba(12,12,14,.97);}
.nav-dots span{background:#d6f23f;}
#nav-brand-name{color:#d6f23f !important;}
.nav-mode-toggle{background:#d6f23f;color:#15150a;}