/* Karli v15 — app.css (auto-generated) */
/* ═══ Patch 1/13 ═══ */
.ceo-dash{display:flex;flex-direction:column;gap:16px;padding-bottom:20px}
.ceo-briefing{background:var(--accent-l,#E8ECFF);border:1px solid rgba(92,112,255,.2);border-radius:10px;padding:12px 18px;font-size:13px;color:var(--text);cursor:pointer;transition:all .15s;display:flex;align-items:center;gap:10px}
.ceo-briefing:hover{box-shadow:0 2px 8px rgba(92,112,255,.12);transform:translateY(-1px)}
.ceo-briefing b{color:var(--accent,#5C70FF);font-weight:600}
.ceo-head{display:flex;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;gap:16px}
.ceo-greet{font-size:24px;font-weight:700;color:var(--text);margin:0}
.ceo-date{font-size:13px;color:var(--sub);margin-top:4px}
.ceo-countdowns{display:flex;gap:8px;flex-wrap:wrap}
.ceo-cd{background:var(--bg3);border:1px solid var(--border);border-left:3px solid var(--accent);border-radius:8px;padding:8px 12px;cursor:pointer;transition:all .15s;min-width:150px}
.ceo-cd:hover{transform:translateY(-1px);box-shadow:var(--sh-lg,0 4px 12px rgba(0,0,0,.08))}
.ceo-cd.urgent{border-left-color:var(--warn);background:var(--bg3)}
.ceo-cd-title{font-size:11px;color:var(--sub);font-weight:500}
.ceo-cd-days{font-size:16px;font-weight:700;color:var(--text);margin-top:2px}
.ceo-cd-rev{font-size:10px;color:#22c55e;font-weight:600}
.ceo-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px}
.ceo-stat{background:var(--bg3);border:1px solid var(--border);border-radius:12px;padding:10px 14px;cursor:pointer;transition:all .15s;min-width:0;overflow:hidden}
.ceo-stat:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.08)}
.ceo-stat-head{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--sub);font-weight:500;text-transform:uppercase;letter-spacing:.3px}
.ceo-stat-val{font-size:22px;font-weight:700;color:var(--text);margin-top:4px;line-height:1.1}
.ceo-stat-sub{font-size:10px;color:var(--muted);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ceo-grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.ceo-card{background:var(--bg3);border:1px solid var(--border);border-radius:12px;padding:14px 16px;cursor:pointer;transition:all .15s;min-width:0;overflow:hidden}
.ceo-card:hover{box-shadow:0 4px 12px rgba(0,0,0,.08)}
.ceo-card-title{font-size:12px;font-weight:600;color:var(--sub);text-transform:uppercase;letter-spacing:.3px;margin-bottom:12px}
.ceo-bar{display:flex;align-items:center;gap:10px;margin-bottom:10px}.ceo-bar-lbl{font-size:12px;color:var(--sub);min-width:70px}.ceo-bar-track{flex:1;height:8px;background:var(--bg);border-radius:4px;overflow:hidden;min-width:60px}.ceo-bar-fill{height:100%;border-radius:4px;min-width:2px;transition:width .3s}.ceo-bar-cnt{font-size:13px;font-weight:700;min-width:28px;text-align:right}
.ceo-bar-lbl{flex:0 0 80px;font-size:12px;color:var(--sub)}
.ceo-bar-track{flex:1;height:5px;background:var(--bg2);border-radius:3px;overflow:hidden}
.ceo-bar-fill{height:100%;border-radius:3px;transition:width .4s}
.ceo-bar-cnt{flex:0 0 32px;text-align:right;font-size:12px;font-weight:600}
.ceo-pipeline{display:flex;justify-content:space-between;align-items:stretch;gap:4px}
.ceo-stage{flex:1;text-align:center;padding:8px 4px;background:var(--bg2);border-radius:6px}
.ceo-stage-icon{font-size:16px}
.ceo-stage-cnt{font-size:18px;font-weight:700;color:var(--text);margin-top:2px}
.ceo-stage-lbl{font-size:9px;text-transform:uppercase;color:var(--muted);letter-spacing:.3px}
.ceo-audits{margin-top:14px;padding-top:12px;border-top:1px solid var(--border-l,var(--border))}
.ceo-audit{display:flex;justify-content:space-between;align-items:center;padding:6px 0;font-size:12px}
.ceo-audit-url{color:var(--sub);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:60%}
.ceo-audit-score{display:flex;align-items:center;gap:6px;font-weight:600}
.ceo-grade-badge{font-size:10px;padding:2px 7px;border-radius:4px;color:#fff;font-weight:700}
.ceo-score-ring{display:flex;align-items:center;justify-content:center;flex-direction:column;padding:10px 0}
.ceo-score-ring svg{transform:rotate(-90deg)}
.ceo-score-txt{font-size:20px;font-weight:800;color:var(--text)}
.ceo-score-grade{font-size:10px;color:var(--sub);margin-top:-2px}
.ceo-sysrow{display:flex;justify-content:space-between;align-items:center;padding:6px 0;font-size:12px}
.ceo-sysrow-lbl{color:var(--sub)}
.ceo-sysrow-val{font-weight:600}
.ceo-brands{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:8px}
.ceo-brand{background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:10px 12px;border-left:3px solid}
.ceo-brand-name{font-size:13px;font-weight:600;color:var(--text);display:flex;justify-content:space-between;align-items:center}
.ceo-brand-badge{font-size:9px;padding:2px 6px;border-radius:3px;font-weight:600;text-transform:uppercase}
.ceo-brand-badge.live{background:#DCFCE7;color:#059669}
.ceo-brand-badge.active{background:#FEF3C7;color:#92400E}
.ceo-brand-badge.planned{background:var(--bg2);color:var(--muted)}
.ceo-brand-rev{font-size:11px;color:#059669;font-weight:600;margin-top:4px}
.ceo-brand-note{font-size:10px;color:var(--muted);margin-top:2px}
.ceo-grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.ceo-upcoming-item{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid var(--border-l,var(--border));font-size:12px;cursor:pointer}
.ceo-upcoming-item:last-child{border:none}
.ceo-upcoming-date{font-weight:600;color:var(--sub);flex:0 0 55px}
.ceo-upcoming-title{flex:1;color:var(--text);padding:0 8px}
.ceo-upcoming-badge{font-size:9px;padding:2px 6px;border-radius:3px;font-weight:700}
.ceo-upcoming-badge.soon{background:#FEF3C7;color:#92400E}
.ceo-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.ceo-action{background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:10px 12px;cursor:pointer;display:flex;align-items:center;gap:8px;font-size:12px;font-weight:500;color:var(--text);transition:all .15s}
.ceo-action:hover{border-color:var(--accent);background:var(--accent-l,#E8ECFF)}
.ceo-footer{text-align:center;font-size:10px;color:var(--muted);padding:12px 0}
@media (max-width:1024px){.ceo-stats{grid-template-columns:repeat(3,1fr)}.ceo-grid3{grid-template-columns:1fr 1fr}.ceo-grid3 > :nth-child(3){grid-column:1/-1}}
@media (max-width:640px){.ceo-stats{grid-template-columns:repeat(2,1fr)}.ceo-grid3,.ceo-grid2{grid-template-columns:1fr}.ceo-head{flex-direction:column}}

/* ═══ Patch 2/13 ═══ */
body.theme-collab .tab[data-p="bots"],
body.theme-collab .tab[data-p="pipeline"],
body.theme-collab .tab[data-p="roadmap"],
body.theme-collab .tab[data-p="security"],
body.theme-collab .tab[data-p="audits"],
body.theme-collab .tab[data-p="revenue"],
body.theme-collab .tab[data-p="emails"],
body.theme-collab .tab[data-p="finance"] { display: none !important; }
body.theme-collab .mtab[data-mp="bots"],
body.theme-collab .mtab[data-mp="pipeline"],
body.theme-collab .mtab[data-mp="roadmap"],
body.theme-collab .mtab[data-mp="security"] { display: none !important; }

/* ═══ Patch 3/13 ═══ */
/* Dashboard Layout Fix v2 */
.pc { overflow-y: auto !important; overflow-x: hidden !important; }
/* Hide old dashboard cards that are now superseded by CEO dashboard */
#dealPipelineCard,
#pipelineForecastCard,
#karliStatus { display: none !important; }
/* Hide DM widget from dashboard (belongs in chat area) */
#dmDashWidget { display: none !important; }
/* Hide duplicate bottom menu inside dashboard tab */
#pg-dashboard .mehr-menu,
#pg-dashboard #mehrMenu { display: none !important; }
/* Style sync-accordion inside dashboard */
#pg-dashboard .sync-accordion { margin-top: 16px; }
/* CEO Dashboard root has its own spacing */
#ceoDashboardRoot { padding-bottom: 40px; }
/* Ensure .ps (page section) also scrolls */
.ps { overflow-y: auto !important; overflow-x: hidden !important; -webkit-overflow-scrolling: touch; }

/* ═══ Patch 4/13 ═══ */
/* Desktop + Mobile: Topbar immer sichtbar, pc darunter */
.app { display: flex !important; flex-direction: column !important; height: 100vh !important; overflow: hidden !important; }
.topbar { position: sticky !important; top: 0 !important; z-index: 1000 !important; flex-shrink: 0 !important; }
.pc { flex: 1 1 auto !important; position: relative !important; overflow: hidden !important; min-height: 0 !important; }
.pg { position: absolute !important; inset: 0 !important; overflow-y: auto !important; overflow-x: hidden !important; }

@media (max-width: 768px) {
  /* Override die mobile-only Regeln die die Topbar versteckt haben */
  body { overflow: hidden !important; }
  .app { height: 100vh !important; overflow: hidden !important; }
  .topbar { display: flex !important; position: sticky !important; top: 0 !important; z-index: 1000 !important; height: 52px !important; }
  .pc {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    flex: 1 1 auto !important;
    bottom: max(70px, calc(60px + env(safe-area-inset-bottom))) !important;
    /* bottom als margin, nicht als position */
    margin-bottom: 0 !important;
  }
  /* Mobile-only: lass die untere Tabbar Platz */
  .pc { padding-bottom: max(70px, calc(60px + env(safe-area-inset-bottom))) !important; bottom: auto !important; }
}

/* ═══ Patch 5/13 ═══ */
.cal-viewswitch{display:inline-flex;background:var(--bg3);border:1px solid var(--border);border-radius:8px;overflow:hidden}
.cal-viewswitch button{background:transparent;border:none;color:var(--sub);padding:6px 14px;font-size:12px;cursor:pointer;font-weight:500}
.cal-viewswitch button.active{background:var(--accent);color:#fff}
.cal-nav{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.cal-nav h3{flex:1;margin:0;font-size:18px;font-weight:600}
.cal-month-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:1px;background:var(--border);border:1px solid var(--border);border-radius:8px;overflow:hidden}
.cal-hd{background:var(--bg3);padding:8px;text-align:center;font-size:11px;font-weight:600;color:var(--sub);text-transform:uppercase;letter-spacing:.5px}
.cal-cell{background:var(--bg2);min-height:90px;padding:6px;cursor:pointer;position:relative;transition:background .15s;display:flex;flex-direction:column;gap:2px}
.cal-cell:hover{background:var(--bg3)}
.cal-cell.we{background:rgba(0,0,0,.02)}
.cal-cell.other{opacity:.35}
.cal-daynum{font-size:13px;font-weight:600;color:var(--text);margin-bottom:2px}
.cal-today-dot{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background:#EF4444;color:#fff;font-weight:700;font-size:12px}
.cal-ev{font-size:11px;padding:2px 6px;border-radius:4px;margin-bottom:1px;color:#fff;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;line-height:1.3}
.cal-more{font-size:10px;color:var(--sub);padding:1px 6px;cursor:pointer}
.cal-week{position:relative;border:1px solid var(--border);border-radius:8px;overflow:hidden;background:var(--bg2)}
.cal-week-head{display:flex;background:var(--bg3);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:2}
.cal-week-tcol{width:60px;flex-shrink:0;padding:8px 4px;text-align:center;font-size:11px;color:var(--sub);border-right:1px solid var(--border)}
.cal-week-day{flex:1;padding:8px;text-align:center;font-size:11px;color:var(--sub);border-right:1px solid var(--border);cursor:pointer;text-transform:uppercase;font-weight:600}
.cal-week-day.today{background:rgba(92,112,255,.1);color:var(--accent)}
.cal-week-num{display:inline-block;font-size:14px;margin-left:4px;color:var(--text)}
.cal-week-num.today-dot{background:#EF4444;color:#fff;border-radius:50%;width:22px;height:22px;line-height:22px;margin-left:4px;text-align:center}
.cal-week-allday{display:flex;border-bottom:1px solid var(--border);min-height:30px;background:var(--bg2)}
.cal-week-ad-cell{flex:1;border-right:1px solid var(--border);padding:2px;min-width:0}
.cal-week-body{position:relative}
.cal-week-row{display:flex;height:44px;border-bottom:1px solid var(--border)}
.cal-week-cell{flex:1;border-right:1px solid var(--border);cursor:pointer}
.cal-week-cell:hover{background:var(--bg3)}
.cal-week-cell.today{background:rgba(92,112,255,.05)}
.cal-week-events{position:absolute;top:82px;left:0;right:0;pointer-events:none}
.cal-week-events .cal-ev-block{pointer-events:auto}
.cal-ev-block{position:absolute;color:#fff;padding:4px 8px;border-radius:4px;font-size:11px;font-weight:500;cursor:pointer;overflow:hidden;box-shadow:0 1px 3px rgba(0,0,0,.2);line-height:1.3}
.cal-nowline{position:absolute;left:60px;right:0;height:2px;background:#EF4444;z-index:5;pointer-events:none}
.cal-nowline::before{content:'';position:absolute;left:-6px;top:-4px;width:10px;height:10px;border-radius:50%;background:#EF4444}
.cal-day{position:relative;border:1px solid var(--border);border-radius:8px;overflow:hidden;background:var(--bg2)}
.cal-day-allday{display:flex;flex-wrap:wrap;gap:4px;padding:8px;border-bottom:1px solid var(--border);background:var(--bg3)}
.cal-day-grid{position:relative}
.cal-day-row{display:flex;height:44px;border-bottom:1px solid var(--border)}
.cal-day-slot{flex:1;cursor:pointer}
.cal-day-slot:hover{background:var(--bg3)}
.cal-day-events{position:absolute;top:0;left:0;right:0;pointer-events:none}
.cal-day-events .cal-ev-block{pointer-events:auto}
@media(max-width:768px){.cal-cell{min-height:64px;padding:3px}.cal-daynum{font-size:11px}.cal-today-dot{width:20px;height:20px;font-size:10px}.cal-ev{font-size:9px;padding:1px 3px}.cal-more{font-size:9px}}

/* ═══ Patch 6/13 ═══ */
.task-filters{display:flex;gap:6px;flex-wrap:wrap;margin:4px 0 12px;padding:4px}
.task-filter{background:var(--bg2);border:1px solid var(--border);color:var(--sub);padding:6px 12px;border-radius:6px;font-size:12px;cursor:pointer;font-weight:500;display:flex;align-items:center;gap:6px;transition:all .15s}
.task-filter:hover{background:var(--bg3);color:var(--text)}
.task-filter.active{background:var(--accent);color:#fff;border-color:var(--accent)}
.task-filter .tfc{background:rgba(0,0,0,.15);padding:1px 6px;border-radius:10px;font-size:10px;font-weight:700}
.task-filter.active .tfc{background:rgba(255,255,255,.25)}

/* ═══ Patch 7/13 ═══ */
.task-card{transition:box-shadow .15s}
.task-card:hover{box-shadow:0 2px 8px rgba(0,0,0,.08)}
.task-detail{margin-top:12px;padding:14px 16px;background:var(--bg2);border-radius:8px;border:1px solid var(--border);font-size:13px;line-height:1.6;cursor:default}
.td-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px;font-size:12px;color:var(--sub)}
.td-grid b{color:var(--text);font-weight:600}
.td-desc{margin-bottom:12px;padding:10px;background:var(--bg3);border-radius:6px;font-size:12px}
.td-meta{font-size:11px;color:var(--muted);margin-bottom:4px}
.td-actions-label{margin:12px 0 6px;font-size:12px}
.td-actions{display:flex;flex-wrap:wrap;gap:6px}
.btn-quick{padding:6px 12px;font-size:11px;background:var(--bg3);border:1px solid var(--border);color:var(--text);border-radius:6px;cursor:pointer;font-weight:500;transition:all .15s}
.btn-quick:hover{background:var(--accent);color:#fff;border-color:var(--accent)}
@media(max-width:768px){.td-grid{grid-template-columns:1fr}}

/* ═══ Patch 8/13 ═══ */
@media (max-width: 768px) {
  .topbar { padding: 0 10px !important; gap: 4px !important; }
  .topbar .logo-text, .topbar .uarea { display: none !important; }
  .tab { padding: 6px 8px !important; font-size: 11px !important; min-width: auto !important; }
  .ceo-stats { grid-template-columns: 1fr 1fr !important; gap: 8px !important; }
  .ceo-grid3, .ceo-grid2 { grid-template-columns: 1fr !important; gap: 10px !important; }
  .ceo-stat { padding: 12px !important; }
  .ceo-stat-val { font-size: 22px !important; }
  .ceo-stat-head { font-size: 11px !important; }
  .ceo-card { padding: 14px !important; }
  .ceo-greet { font-size: 20px !important; }
  .ceo-date { font-size: 11px !important; }
  .ph h2 { font-size: 16px !important; }
  .card { padding: 12px !important; }
  .ps { padding: 12px !important; }
  #notifDropdown { width: calc(100vw - 20px) !important; right: 10px !important; }
}

/* ═══ Patch 9/13 ═══ */
.task-group{margin-bottom:18px}
.task-group-header{cursor:pointer;padding:8px 12px;font-size:13px;color:var(--sub);border-bottom:1px solid var(--border);margin-bottom:6px;user-select:none;display:flex;align-items:center;gap:6px}
.task-group-header:hover{color:var(--text)}
.task-group-header b{color:var(--text);font-weight:600;font-size:13px}
.task-group-header .tgh-count{color:var(--muted);font-size:12px}
.task-group-header .tgh-note{color:var(--muted);font-size:11px;font-style:italic}
.task-group-header.collapsed{opacity:.7}
.task-group-items{display:flex;flex-direction:column;gap:6px}
.tl-row{display:flex;align-items:center;gap:10px;padding:10px 14px;border:1px solid var(--border);border-radius:8px;background:var(--bg2);transition:background .12s,box-shadow .12s;font-size:13px;min-height:44px}
.tl-row:hover{background:var(--bg3);box-shadow:0 1px 4px rgba(0,0,0,.06)}
.tl-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.tl-dot.prio-critical{background:#EF4444}
.tl-dot.prio-high{background:#F59E0B}
.tl-dot.prio-medium{background:#3B82F6}
.tl-dot.prio-low{background:#9CA3AF}
.tl-title{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text);font-weight:500}
.tl-meta{font-size:11px;color:var(--sub);flex-shrink:0}
.tl-status{font-size:10px;flex-shrink:0}
.btn-karli{background:var(--accent,#5C70FF);color:#fff;border:none;border-radius:6px;padding:5px 10px;font-size:11px;cursor:pointer;font-weight:600;flex-shrink:0;transition:all .15s}
.btn-karli:hover{background:#4A5EE0;transform:scale(1.05)}
.audit-group .tl-row{opacity:.85}
@media(max-width:768px){.tl-row{flex-wrap:wrap;gap:6px}.tl-title{flex:1 1 100%;order:1}.tl-dot{order:0}.tl-meta,.tl-status{order:2;font-size:10px}.btn-karli{order:3;margin-left:auto}}

/* ═══ Patch 10/13 ═══ */
.conv-sb{transition:left .2s ease}
@media(max-width:768px){
  .conv-sb{position:fixed!important;left:-280px;top:52px;bottom:0;width:260px;z-index:200;box-shadow:2px 0 12px rgba(0,0,0,.2);background:var(--bg2)!important}
  .conv-sb.open{left:0!important}
}

/* ═══ Patch 11/13 ═══ */
.btn-batch{background:var(--accent);color:#fff;border:none;border-radius:5px;padding:3px 8px;font-size:10px;cursor:pointer;margin-left:8px;font-weight:600;opacity:.8}
.btn-batch:hover{opacity:1;transform:scale(1.05)}

/* ═══ Patch 12/13 ═══ */
.ceo-stats{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))!important}

/* ═══ Patch 13/13 ═══ */
.ctx-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px;padding-top:12px;border-top:1px solid var(--border)}
.ctx-label{width:100%;font-size:11px;font-weight:600;color:var(--sub);margin-bottom:4px}
.ctx-btn{background:var(--bg3);border:1px solid var(--border);color:var(--text);padding:6px 12px;border-radius:8px;font-size:12px;cursor:pointer;transition:all .15s;white-space:nowrap}
.ctx-btn:hover{background:var(--accent);border-color:var(--accent);color:#fff;transform:translateY(-1px)}
@media(max-width:768px){.ctx-btn{font-size:11px;padding:5px 8px}}

.sc-dot{width:20px;height:20px;border-radius:50%;cursor:pointer;border:2px solid rgba(255,255,255,.3);transition:all .15s;flex-shrink:0}
.sc-dot:hover{transform:scale(1.3);border-color:#fff;box-shadow:0 0 8px rgba(255,255,255,.4)}
.sc-dot.active{border-color:#fff;box-shadow:0 0 0 2px var(--accent)}
@media(max-width:768px){#studioGrid{grid-template-columns:1fr!important;height:auto!important}#studioGrid>div{max-height:none}}
@keyframes toastIn{from{opacity:0;transform:translateX(-50%) translateY(20px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}
@keyframes pulse-hint{0%,100%{box-shadow:0 0 0 0 rgba(0,232,152,.4)}50%{box-shadow:0 0 0 8px rgba(0,232,152,0)}}
.btn-loading{opacity:.7;pointer-events:none}

/* v13: Dashboard layout fixes */
.ceo-dash{overflow:hidden;max-width:100%}
.ceo-dash *{min-width:0}
.ceo-grid3,.ceo-grid2{min-width:0;max-width:100%}
.ceo-grid3>div,.ceo-grid2>div{min-width:0;overflow:hidden}
.ceo-card div[style*="font-size:18px"]{font-size:15px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ceo-card div[style*="font-size:11px"]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ceo-card-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;align-items:center;gap:6px}
.ceo-stage{min-width:0;overflow:hidden;text-align:center}
.ceo-stage-lbl{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ceo-stage-cnt{font-size:18px;font-weight:700}
.ceo-pipeline{display:flex;gap:6px;justify-content:space-between}
.ceo-brands{display:flex;flex-wrap:wrap;gap:6px;min-width:0}
.ceo-bar-lbl{flex:0 0 70px;font-size:11px;color:var(--sub);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ceo-bar-track{flex:1;min-width:40px}
.ceo-bar-fill{min-width:4px}
.ceo-bar-cnt{flex:0 0 28px;font-size:12px;font-weight:700;text-align:right}
.ceo-upcoming-item{display:flex;gap:8px;padding:6px 0;border-bottom:1px solid var(--border-l);font-size:12px;min-width:0}
.ceo-upcoming-date{flex:0 0 42px;color:var(--sub);font-weight:600;font-size:11px}
.ceo-upcoming-title{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ceo-actions{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.ceo-action{font-size:11px;padding:8px 10px;display:flex;align-items:center;gap:6px;background:var(--bg);border:1px solid var(--border);border-radius:6px;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ceo-action:hover{background:var(--bg2);border-color:var(--accent)}
@media (max-width:1280px){.ceo-stat-val{font-size:20px}.ceo-card div[style*="font-size:18px"]{font-size:14px!important}}

/* v14: Dashboard stat-cards height fix */
.ceo-stats{align-items:start!important}
.ceo-stat{height:auto!important;max-height:120px!important}
.ceo-dash{display:flex;flex-direction:column;gap:14px}
.ceo-dash>.ceo-stats,.ceo-dash>.ceo-grid3,.ceo-dash>.ceo-grid2,.ceo-dash>.ceo-card,.ceo-dash>.ceo-footer{width:100%}

/* ═══════════════════════════════════════════════════════
   DARK MODE
   ═══════════════════════════════════════════════════════ */

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg-main: #0f1117; --bg-card: #1a1d27; --bg-card-hover: #22263a;
    --bg-input: #1e2130; --bg-sidebar: #141722; --bg-header: #0f1117;
    --bg-nav: #141722; --bg-modal: #1a1d27; --bg-code: #1e2130;
    --bg: #0f1117; --bg2: #1a1d27; --bg3: #22263a;
    --text: #e4e6eb; --text-primary: #e4e6eb; --text-secondary: #9ba1b0;
    --sub: #9ba1b0; --text-muted: #6b7280; --text-heading: #f0f2f5;
    --border: #2a2e3f; --border-color: #2a2e3f; --border-subtle: #1e2130;
    --shadow-sm: 0 1px 3px rgba(0,0,0,0.4);
    --shadow-md: 0 4px 12px rgba(0,0,0,0.5);
    --shadow-lg: 0 8px 24px rgba(0,0,0,0.6);
    --accent: #6366f1; --accent-hover: #818cf8;
    --accent-bg: rgba(99,102,241,0.15);
    --success: #1D9E75; --warning: #F59E0B; --err: #E24B4A;
    color-scheme: dark;
  }
}

:root[data-theme="dark"] {
  --bg-main: #0f1117; --bg-card: #1a1d27; --bg-card-hover: #22263a;
  --bg-input: #1e2130; --bg-sidebar: #141722; --bg-header: #0f1117;
  --bg-nav: #141722; --bg-modal: #1a1d27; --bg-code: #1e2130;
  --bg: #0f1117; --bg2: #1a1d27; --bg3: #22263a;
  --text: #e4e6eb; --text-primary: #e4e6eb; --text-secondary: #9ba1b0;
  --sub: #9ba1b0; --text-muted: #6b7280; --text-heading: #f0f2f5;
  --border: #2a2e3f; --border-color: #2a2e3f; --border-subtle: #1e2130;
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.4);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.5);
  --shadow-lg: 0 8px 24px rgba(0,0,0,0.6);
  --accent: #6366f1; --accent-hover: #818cf8;
  --accent-bg: rgba(99,102,241,0.15);
  --success: #1D9E75; --warning: #F59E0B; --err: #E24B4A;
  color-scheme: dark;
}

:root[data-theme="dark"] .ceo-stat,
:root[data-theme="dark"] .ceo-card,
:root[data-theme="dark"] .ceo-cd {
  background: var(--bg2); color: var(--text); border-color: var(--border);
}
:root[data-theme="dark"] .ceo-stat:hover,
:root[data-theme="dark"] .ceo-card:hover { background: var(--bg3); }

:root[data-theme="dark"] input,
:root[data-theme="dark"] textarea,
:root[data-theme="dark"] select {
  background: var(--bg-input); color: var(--text); border-color: var(--border);
}

:root[data-theme="dark"] .nav-link,
:root[data-theme="dark"] [onclick*="switchTab"] { color: var(--sub); }
:root[data-theme="dark"] .nav-link.active,
:root[data-theme="dark"] .nav-link:hover { color: var(--text); }

:root[data-theme="dark"] ::-webkit-scrollbar-track { background: var(--bg); }
:root[data-theme="dark"] ::-webkit-scrollbar-thumb { background: var(--border); }

:root[data-theme="dark"] pre,
:root[data-theme="dark"] code { background: var(--bg-code); color: #e4e6eb; }

:root[data-theme="dark"] table th { background: var(--bg2); color: var(--text); }
:root[data-theme="dark"] table td { border-color: var(--border); }
:root[data-theme="dark"] table tr:hover td { background: var(--bg3); }

:root[data-theme="dark"] .login-box { background: var(--bg2); color: var(--text); }
:root[data-theme="dark"] .login-box h1 { color: var(--text); }
:root[data-theme="dark"] .login-box .sub { color: var(--sub); }
:root[data-theme="dark"] .login-wrap { background: var(--bg); }
:root[data-theme="dark"] .ceo-briefing { background: var(--bg2); color: var(--text); border-color: var(--border); }
:root[data-theme="dark"] .ceo-greet { color: var(--text); }
:root[data-theme="dark"] .ceo-date { color: var(--sub); }
:root[data-theme="dark"] .btn.bg { background: var(--bg2); color: var(--text); border-color: var(--border); }
:root[data-theme="dark"] .btn.bg:hover { background: var(--bg3); }
:root[data-theme="dark"] .chat-msg { background: var(--bg2); color: var(--text); }
:root[data-theme="dark"] .chat-input-wrap { background: var(--bg2); border-color: var(--border); }

/* ═══════════════════════════════════════════════════════
   ACCESSIBILITY
   ═══════════════════════════════════════════════════════ */

[onclick] { cursor: pointer; }
[onclick]:focus-visible,
[onclick*="switchTab"]:focus-visible {
  outline: 2px solid var(--accent, #6366f1);
  outline-offset: 2px;
  border-radius: 6px;
}

:focus:not(:focus-visible) { outline: none; }
:focus-visible {
  outline: 2px solid var(--accent, #6366f1);
  outline-offset: 2px;
}

.skip-link {
  position: absolute; top: -100%; left: 16px; padding: 8px 16px;
  background: var(--accent, #6366f1); color: white; border-radius: 4px;
  z-index: 10000; font-size: 14px;
}
.skip-link:focus { top: 8px; }

/* ═══════════════════════════════════════════════════════
   TOUCH TARGETS (Mobile)
   ═══════════════════════════════════════════════════════ */

@media (max-width: 768px) {
  button, [role="button"] {
    min-height: 44px; min-width: 44px;
  }
}

/* ═══════════════════════════════════════════════════════
   SKELETON SCREENS
   ═══════════════════════════════════════════════════════ */

.skeleton {
  background: linear-gradient(90deg,
    var(--bg-card, #f0f0f0) 25%,
    var(--bg-card-hover, #e0e0e0) 50%,
    var(--bg-card, #f0f0f0) 75%);
  background-size: 200% 100%;
  animation: skeleton-pulse 1.5s ease-in-out infinite;
  border-radius: 8px;
}
@keyframes skeleton-pulse {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* ═══════════════════════════════════════════════════════
   HERO KPI CARDS
   ═══════════════════════════════════════════════════════ */

.hero-kpis {
  display: grid; grid-template-columns: 1fr 1fr 1fr;
  gap: 12px; margin-bottom: 20px;
}
.hero-kpi-card {
  background: var(--bg-card, #fff); border-radius: 12px; padding: 16px;
  text-align: center; border: 2px solid var(--border-color, #e5e7eb);
  transition: transform 0.15s, box-shadow 0.15s; cursor: pointer;
}
.hero-kpi-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-md, 0 4px 12px rgba(0,0,0,0.1));
}
.hero-kpi-card.status-good { border-color: var(--success, #1D9E75); }
.hero-kpi-card.status-bad { border-color: var(--err, #E24B4A); }
.hero-kpi-label {
  font-size: 11px; color: var(--text-muted, #888);
  text-transform: uppercase; letter-spacing: 1px; margin-bottom: 4px;
}
.hero-kpi-value { font-size: 32px; font-weight: 700; line-height: 1.2; }
.hero-kpi-value .target { font-size: 16px; color: var(--text-muted, #888); font-weight: 400; }

@media (max-width: 480px) {
  .hero-kpis { grid-template-columns: 1fr; gap: 8px; }
  .hero-kpi-card {
    display: flex; align-items: center; justify-content: space-between; padding: 12px 16px;
  }
  .hero-kpi-value { font-size: 24px; }
}

/* ═══════════════════════════════════════════════════════
   UX POLISH
   ═══════════════════════════════════════════════════════ */

button, [onclick], a, input, select, textarea {
  transition: background 0.15s, color 0.15s, border-color 0.15s, box-shadow 0.15s;
}

::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: var(--bg-main, #f5f5f5); }
::-webkit-scrollbar-thumb { background: var(--text-muted, #ccc); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--text-secondary, #999); }

::selection { background: var(--accent-bg, rgba(99,102,241,0.3)); }
html { scroll-behavior: smooth; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}

/* Theme toggle button */
#themeToggle {
  background: none; border: none; cursor: pointer; padding: 8px;
  color: var(--sub, #888); display: inline-flex; align-items: center;
  border-radius: 6px; margin-right: 4px;
}
#themeToggle:hover { color: var(--text, #333); background: var(--bg3, #f0f0f0); }