/* DidiBot 4A – Clean Premium
   Additive theme layer: keeps legacy class contracts intact while modernising the shell. */
:root {
  --bg: #090d16;
  --bg-elevated: #0d1320;
  --bg-input: #0b111d;
  --card: #111827;
  --card-elevated: #151d2c;
  --border: rgba(255, 255, 255, 0.045);
  --border-strong: rgba(255, 255, 255, 0.085);
  --text: #f8fafc;
  --text-muted: #94a3b8;
  --text-soft: #64748b;
  --accent: #7c5cfc;
  --accent-hover: #8b6cff;
  --accent-soft: #a78bfa;
  --success: #22c55e;
  --danger: #ef4444;
  --warning: #f59e0b;
  --info: #3b82f6;
  --radius: 12px;
  --radius-sm: 9px;
  --shadow: 0 14px 40px rgba(0, 0, 0, 0.22);
  --sidebar-width: 264px;
  --sidebar-collapsed: 78px;
  --topbar-height: 64px;
  --font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

html { background: var(--bg); }
body {
  font-family: var(--font);
  background:
    radial-gradient(circle at 78% -10%, rgba(124, 92, 252, .055), transparent 32rem),
    linear-gradient(180deg, #090d16 0%, #080c14 100%);
  color: var(--text);
  letter-spacing: -.01em;
}

button, input, select, textarea { font: inherit; }

/* ── App shell ─────────────────────────────────────────────────── */
.dashboard.dashboard-premium {
  display: grid;
  grid-template-columns: var(--sidebar-width) minmax(0, 1fr);
  min-height: 100vh;
  background: transparent;
  transition: grid-template-columns .18s ease;
}

.dashboard.dashboard-premium.sidebar-is-collapsed {
  grid-template-columns: var(--sidebar-collapsed) minmax(0, 1fr);
}

.workspace {
  min-width: 0;
  min-height: 100vh;
  display: grid;
  grid-template-rows: var(--topbar-height) minmax(0, 1fr);
}

.premium-sidebar {
  position: sticky;
  inset: 0 auto 0 0;
  height: 100vh;
  overflow: hidden auto;
  padding: 16px 12px 14px;
  background: linear-gradient(180deg, rgba(13, 19, 32, .985), rgba(10, 15, 25, .985));
  border-right: 1px solid var(--border);
  gap: 12px;
  z-index: 40;
  box-shadow: none;
}

.sidebar-brand-row,
.sidebar-brand,
.server-switcher-control,
.sidebar-user,
.topbar,
.top-status,
.overview-heading-row,
.kpi-card-head,
.panel-title-row,
.activity-row,
.module-status-row,
.quick-action,
.server-info-row,
.preview-author,
.command-palette-input-row {
  display: flex;
  align-items: center;
}

.sidebar-brand-row { justify-content: space-between; min-height: 42px; }
.sidebar-brand { gap: 10px; min-width: 0; }
.brand-mark {
  width: 36px; height: 36px; border-radius: 10px;
  display: grid; place-items: center;
  background: linear-gradient(145deg, #6f52e8, #8b6cff);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.14);
  font-size: 19px;
}
.brand-copy { min-width: 0; }
.brand-copy strong { display: block; font-size: 17px; line-height: 1.2; }
.brand-copy small { display: block; margin-top: 2px; color: var(--text-soft); font-size: 10px; }

.icon-btn {
  position: relative;
  border: 1px solid transparent;
  background: transparent;
  color: var(--text-muted);
  width: 34px; height: 34px;
  border-radius: 9px;
  display: inline-grid; place-items: center;
  cursor: pointer;
  text-decoration: none;
  transition: background .16s ease, border-color .16s ease, color .16s ease, transform .16s ease;
}
.icon-btn:hover { background: rgba(255,255,255,.045); border-color: var(--border); color: var(--text); text-decoration: none; }
.icon-btn:active { transform: translateY(1px); }
.sidebar-collapse { border-color: var(--border); background: rgba(255,255,255,.025); font-size: 20px; }

.server-switcher {
  padding: 9px;
  border: 1px solid var(--border);
  background: rgba(255,255,255,.018);
  border-radius: 12px;
}
.server-switcher-label,
.nav-section {
  display: block;
  margin: 0 0 7px;
  color: var(--text-soft);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .065em;
  font-size: 9px;
}
.server-switcher-control { gap: 9px; }
.server-switcher-icon {
  width: 32px; height: 32px; border-radius: 9px; object-fit: cover; flex: 0 0 auto;
  background: rgba(124,92,252,.16);
}
.server-switcher-fallback { display: grid; place-items: center; color: #d9d2ff; font-weight: 800; }
.server-select {
  min-width: 0; flex: 1; height: 34px;
  padding: 0 26px 0 0 !important;
  border: 0 !important; box-shadow: none !important;
  background-color: transparent !important;
  color: var(--text) !important; font-weight: 650;
}

.premium-nav { gap: 2px; }
.premium-nav .nav-section { margin: 10px 8px 5px; }
.premium-nav .nav-item,
.sidebar-help {
  min-height: 38px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 9px;
  border: 1px solid transparent;
  background: transparent;
  color: var(--text-muted);
  font-size: 13px;
  font-weight: 520;
  text-align: left;
  transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.premium-nav .nav-item:hover,
.sidebar-help:hover { background: rgba(255,255,255,.035); color: var(--text); text-decoration: none; }
.premium-nav .nav-item.active {
  background: linear-gradient(90deg, rgba(124,92,252,.28), rgba(124,92,252,.12));
  color: #eeeaff;
  border-color: rgba(124,92,252,.28);
  box-shadow: inset 2px 0 0 var(--accent);
}
.nav-glyph,
.module-nav .nav-item > :first-child { width: 18px; text-align: center; color: #c8bfff; flex: 0 0 auto; }
.module-nav { display: flex; flex-direction: column; gap: 2px; }
.module-nav .nav-item { width: 100%; }

.premium-sidebar-footer { margin-top: auto; padding-top: 12px; border-top: 1px solid var(--border); gap: 8px; }
.sidebar-help { padding-inline: 10px; }
.sidebar-user {
  min-width: 0; gap: 9px; padding: 8px 6px;
  background: rgba(255,255,255,.018); border: 1px solid var(--border); border-radius: 11px;
}
.user-avatar, .top-user-avatar {
  object-fit: cover; flex: 0 0 auto; background: rgba(124,92,252,.2); color: #eeeaff;
}
.user-avatar { width: 34px; height: 34px; border-radius: 50%; }
.user-avatar-fallback { display: grid; place-items: center; font-weight: 800; }
.sidebar-user-copy { min-width: 0; flex: 1; }
.sidebar-user-copy strong { display: block; font-size: 12px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.sidebar-user-copy small { display: block; color: var(--text-soft); font-size: 10px; margin-top: 2px; }
.user-menu-btn { width: 28px; height: 28px; }

.dashboard-premium.sidebar-is-collapsed .brand-copy,
.dashboard-premium.sidebar-is-collapsed .server-switcher-label,
.dashboard-premium.sidebar-is-collapsed .server-select,
.dashboard-premium.sidebar-is-collapsed .nav-label,
.dashboard-premium.sidebar-is-collapsed .premium-nav .nav-section,
.dashboard-premium.sidebar-is-collapsed .sidebar-user-copy,
.dashboard-premium.sidebar-is-collapsed .user-menu-btn { display: none; }
.dashboard-premium.sidebar-is-collapsed .premium-sidebar { padding-inline: 10px; }
.dashboard-premium.sidebar-is-collapsed .sidebar-brand-row { justify-content: center; flex-wrap: wrap; }
.dashboard-premium.sidebar-is-collapsed .sidebar-collapse { width: 28px; height: 28px; transform: rotate(180deg); }
.dashboard-premium.sidebar-is-collapsed .server-switcher { padding: 8px; }
.dashboard-premium.sidebar-is-collapsed .server-switcher-control,
.dashboard-premium.sidebar-is-collapsed .sidebar-user { justify-content: center; }
.dashboard-premium.sidebar-is-collapsed .premium-nav .nav-item,
.dashboard-premium.sidebar-is-collapsed .sidebar-help { justify-content: center; padding-inline: 6px; }
.dashboard-premium.sidebar-is-collapsed .nav-glyph { width: 20px; }

/* topbar */
.topbar {
  position: sticky; top: 0; z-index: 32;
  min-width: 0;
  height: var(--topbar-height);
  padding: 0 22px;
  gap: 10px;
  background: rgba(9,13,22,.88);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--border);
}
.command-trigger {
  width: min(420px, 42vw); height: 36px;
  display: flex; align-items: center; gap: 9px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: rgba(255,255,255,.025);
  color: var(--text-muted);
  padding: 0 10px;
  cursor: pointer;
  text-align: left;
}
.command-trigger:hover { border-color: rgba(124,92,252,.28); background: rgba(124,92,252,.04); }
.command-trigger > span:nth-child(2) { flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
kbd { font: 600 10px/1 var(--font); color: var(--text-soft); border: 1px solid var(--border); background: rgba(255,255,255,.03); padding: 4px 6px; border-radius: 6px; }
.topbar-spacer { flex: 1; }
.top-status { gap: 6px; color: var(--text-muted); font-size: 11px; white-space: nowrap; }
.top-status + .top-status { padding-left: 12px; border-left: 1px solid var(--border); }
.status-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--text-soft); box-shadow: 0 0 0 3px rgba(100,116,139,.08); flex: 0 0 auto; }
.status-dot.online { background: var(--success); box-shadow: 0 0 0 3px rgba(34,197,94,.08); }
.status-dot.warning { background: var(--warning); box-shadow: 0 0 0 3px rgba(245,158,11,.08); }
.status-dot.offline { background: var(--danger); box-shadow: 0 0 0 3px rgba(239,68,68,.08); }
.top-status-icon { color: #8ebaff; }
.notification-btn { font-size: 18px; }
.notification-badge {
  position: absolute; top: 1px; right: 0;
  min-width: 15px; height: 15px; padding: 0 3px;
  display: grid; place-items: center;
  border-radius: 999px; background: var(--accent); color: #fff; border: 2px solid #090d16;
  font-size: 8px; font-weight: 800;
}
.top-user-avatar { width: 31px; height: 31px; border-radius: 50%; margin-left: 4px; }
.topbar > .icon-btn { margin-left: 2px; }
.topbar .notification-btn { margin-left: 5px; }
.topbar .top-status + .icon-btn { margin-left: 8px; }
.mobile-menu { display: none; }

/* main */
.premium-main {
  min-width: 0;
  padding: 18px 18px 28px 14px;
  overflow: visible;
}
.premium-main .main-header { width: 100%; margin: 0 0 14px; max-width: none; }
.premium-main .main-header h2 { font-size: 22px; letter-spacing: -.03em; }
.premium-main .subtitle { margin-top: 4px; color: var(--text-muted); font-size: 12px; }
.premium-main .content { width: 100%; max-width: none; margin: 0; }
.overview-header-hidden { display: none !important; }

/* global component refresh, retaining old class names */
.card,
.module-card,
.stat-card {
  background: linear-gradient(180deg, rgba(17,24,39,.96), rgba(15,22,35,.96));
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: none;
}
.card:hover { border-color: rgba(255,255,255,.09); }
.input, .select, textarea.input {
  background: #0b111d;
  border: 1px solid var(--border-strong);
  color: var(--text);
  border-radius: 9px;
  box-shadow: none;
}
.input:focus, .select:focus, textarea.input:focus {
  border-color: rgba(124,92,252,.65);
  box-shadow: 0 0 0 3px rgba(124,92,252,.1);
  outline: none;
}
.btn {
  border-radius: 9px;
  font-weight: 650;
  box-shadow: none;
  transition: background .15s ease, border-color .15s ease, color .15s ease, transform .15s ease;
}
.btn:hover { transform: translateY(-1px); }
.btn-primary { background: var(--accent); border-color: var(--accent); color: white; }
.btn-primary:hover { background: var(--accent-hover); border-color: var(--accent-hover); }
.btn-secondary { background: rgba(255,255,255,.025); border-color: var(--border-strong); color: var(--text); }
.btn-secondary:hover { background: rgba(255,255,255,.05); border-color: rgba(255,255,255,.16); }
.btn-danger { background: rgba(239,68,68,.1); border-color: rgba(239,68,68,.24); color: #ff9c9c; }
.badge { border-radius: 999px; font-weight: 650; }
.module-header h3, .module-header h4 { letter-spacing: -.02em; }
.module-header p, .hint, .empty-state { color: var(--text-muted); }
.modal-card { background: #101827; border-color: var(--border-strong); border-radius: 14px; box-shadow: 0 24px 80px rgba(0,0,0,.48); }
.toast { border-radius: 10px; border: 1px solid var(--border-strong); background: #111827; color: var(--text); box-shadow: var(--shadow); }

/* ── 4A overview ───────────────────────────────────────────────── */
.overview-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 344px;
  gap: 14px;
}
.overview-main { min-width: 0; }
.overview-aside { min-width: 0; display: flex; flex-direction: column; gap: 11px; position: sticky; top: calc(var(--topbar-height) + 16px); align-self: start; }

.overview-heading-row { justify-content: space-between; gap: 16px; margin-bottom: 14px; }
.overview-heading-copy h1 { margin: 0; font-size: clamp(25px, 2vw, 30px); letter-spacing: -.04em; }
.overview-heading-copy p { margin: 6px 0 0; color: var(--text-muted); font-size: 13px; }
.overview-actions { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }

.kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 11px;
  margin-bottom: 12px;
}
.kpi-card {
  min-height: 112px;
  padding: 16px;
  position: relative;
  overflow: hidden;
  background: linear-gradient(180deg, #111827, #0f1624);
  border: 1px solid var(--border);
  border-radius: 12px;
}
.kpi-card::before {
  content: ""; position: absolute; inset: 0 auto auto 0; width: 100%; height: 2px;
  background: linear-gradient(90deg, var(--kpi-accent, var(--accent)), transparent 62%);
  opacity: .85;
}
.kpi-card-head { justify-content: space-between; gap: 10px; }
.kpi-eyebrow { color: var(--text-muted); font-size: 10px; font-weight: 750; text-transform: uppercase; letter-spacing: .06em; }
.kpi-icon {
  width: 40px; height: 40px; border-radius: 11px; display: grid; place-items: center;
  background: color-mix(in srgb, var(--kpi-accent, var(--accent)) 15%, transparent);
  color: var(--kpi-accent, var(--accent)); font-size: 18px;
}
.kpi-value { margin: 9px 0 0; font-size: 31px; line-height: 1; font-weight: 790; letter-spacing: -.04em; }
.kpi-meta { margin-top: 9px; color: var(--text-muted); font-size: 11px; line-height: 1.35; }
.kpi-meta strong { color: var(--text); font-weight: 650; }

.dashboard-grid-primary {
  display: grid;
  grid-template-columns: minmax(0, 1.52fr) minmax(340px, .92fr);
  gap: 12px;
  margin-bottom: 12px;
  align-items: stretch;
}
.dashboard-grid-secondary {
  display: grid;
  grid-template-columns: 1.02fr .94fr 1fr;
  gap: 12px;
  margin-bottom: 12px;
  align-items: start;
}
.dashboard-panel {
  min-width: 0;
  background: linear-gradient(180deg, rgba(17,24,39,.96), rgba(14,21,34,.96));
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
}
.dashboard-panel-inner { padding: 14px 15px; }
.panel-title-row { justify-content: space-between; gap: 11px; margin-bottom: 12px; }
.panel-title-row h3 { margin: 0; font-size: 14.5px; letter-spacing: -.02em; }
.panel-link, .text-link { color: #a78bfa; font-size: 10.5px; font-weight: 650; background: none; border: 0; padding: 0; cursor: pointer; }
.panel-link:hover, .text-link:hover { color: #c4b5fd; text-decoration: none; }
.panel-control {
  border: 1px solid var(--border); background: rgba(255,255,255,.02); color: var(--text-muted);
  height: 31px; padding: 0 10px; border-radius: 8px; font-size: 10.5px;
}

.activity-chart-wrap { min-height: 252px; position: relative; }
.activity-chart { display: block; width: 100%; height: 252px; overflow: visible; }
.chart-grid-line { stroke: rgba(148,163,184,.09); stroke-width: 1; }
.chart-area { fill: url(#didibotArea); }
.chart-line { fill: none; stroke: #8b5cf6; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.chart-dot { fill: #c4b5fd; stroke: #6d4ce4; stroke-width: 2; }
.chart-label { fill: #64748b; font-size: 9px; }
.chart-legend { display: flex; gap: 13px; margin-bottom: 6px; color: var(--text-muted); font-size: 9px; }
.chart-legend span { display: inline-flex; align-items: center; gap: 5px; }
.legend-dot { width: 7px; height: 7px; border-radius: 50%; background: #8b5cf6; }
.chart-empty { min-height: 150px; display: grid; place-items: center; text-align: center; color: var(--text-muted); font-size: 12px; padding: 24px; }

.activity-list { display: flex; flex-direction: column; }
.activity-row { gap: 10px; min-height: 48px; padding: 6px 1px; border-bottom: 1px solid rgba(255,255,255,.04); }
.activity-row:last-child { border-bottom: 0; }
.activity-icon {
  width: 31px; height: 31px; border-radius: 8px; flex: 0 0 auto; display: grid; place-items: center;
  background: rgba(124,92,252,.12); color: #b8a7ff; font-size: 15px;
}
.activity-copy { min-width: 0; flex: 1; }
.activity-copy strong { display: block; font-size: 12px; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.activity-copy small { display: block; color: var(--text-muted); font-size: 10.5px; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.activity-time { color: var(--text-soft); font-size: 10px; white-space: nowrap; margin-left: auto; }

.ticket-list { display: flex; flex-direction: column; }
.ticket-row {
  display: grid; grid-template-columns: 52px minmax(0,1fr) auto auto; gap: 8px; align-items: center;
  min-height: 46px; border: 0; border-bottom: 1px solid rgba(255,255,255,.04); font-size: 10.5px;
  width: 100%; padding: 0; background: transparent; color: inherit; text-align: left; cursor: pointer;
}
.ticket-row:last-child { border-bottom: 0; }
.ticket-id { color: var(--text); font-weight: 700; }
.ticket-subject { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: var(--text-muted); }
.ticket-pill { padding: 4px 8px; border-radius: 999px; background: rgba(124,92,252,.12); color: #c4b5fd; font-size: 9px; white-space: nowrap; }
.ticket-age { color: var(--text-soft); white-space: nowrap; }

.module-status-list { display: flex; flex-direction: column; gap: 2px; }
.module-status-row { min-height: 31px; gap: 8px; color: var(--text-muted); font-size: 11px; }
.module-status-icon { width: 21px; height: 21px; border-radius: 6px; display: grid; place-items: center; background: rgba(124,92,252,.1); font-size: 11px; }
.module-status-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text); }
.module-state { display: inline-flex; align-items: center; gap: 5px; color: var(--success); font-size: 9.5px; }
.module-state .status-dot { width: 6px; height: 6px; }
.module-state.off { color: var(--text-soft); }

.quick-actions-grid { display: grid; grid-template-columns: 1fr; gap: 7px; }
.quick-action {
  width: 100%; min-height: 56px; gap: 11px; padding: 10px 11px; text-align: left;
  border: 1px solid var(--border); border-radius: 9px; background: rgba(255,255,255,.018); color: var(--text); cursor: pointer;
  transition: background .15s ease, border-color .15s ease, transform .15s ease;
}
.quick-action:hover { background: rgba(124,92,252,.055); border-color: rgba(124,92,252,.22); transform: translateY(-1px); }
.quick-action-icon { width: 35px; height: 35px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 9px; background: rgba(124,92,252,.12); color: #b9a9ff; font-size: 15px; }
.quick-action-copy { min-width: 0; flex: 1; }
.quick-action-copy strong { display: block; font-size: 11.8px; }
.quick-action-copy small { display: block; margin-top: 3px; color: var(--text-soft); font-size: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.quick-action-arrow { color: var(--text-soft); }

.category-list { display: flex; flex-direction: column; gap: 9px; }
.category-row { display: grid; grid-template-columns: minmax(72px,.75fr) 1.6fr 26px; gap: 8px; align-items: center; font-size: 9px; }
.category-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text-muted); }
.category-bar { height: 6px; border-radius: 999px; background: rgba(255,255,255,.05); overflow: hidden; }
.category-bar > span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #7552ef, #9a78ff); }
.category-count { text-align: right; color: var(--text-soft); }

/* aside / preview */
.aside-panel { background: linear-gradient(180deg, rgba(17,24,39,.98), rgba(13,20,32,.98)); border: 1px solid var(--border); border-radius: 12px; overflow: hidden; }
.aside-panel .dashboard-panel-inner { padding: 16px; }
.preview-tabs { display: flex; gap: 17px; border-bottom: 1px solid var(--border); margin: 0 -16px 14px; padding: 0 16px; }
.preview-tab { position: relative; border: 0; background: transparent; color: var(--text-muted); padding: 0 0 11px; font-size: 10.5px; cursor: pointer; }
.preview-tab.active { color: #bcaeff; }
.preview-tab.active::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--accent); border-radius: 2px; }
.discord-preview { padding: 12px; border: 1px solid var(--border-strong); border-radius: 10px; background: #0c121e; }
.preview-author { gap: 8px; margin-bottom: 11px; color: var(--text-muted); font-size: 10px; }
.preview-bot-avatar { width: 29px; height: 29px; border-radius: 8px; display: grid; place-items: center; background: linear-gradient(145deg,#6e4ee6,#8b6cff); font-size: 13px; }
.preview-bot-name { color: #f8fafc; font-weight: 700; }
.app-badge { padding: 2px 4px; border-radius: 4px; background: #5865f2; color: white; font-size: 7px; font-weight: 800; }
.preview-embed { position: relative; overflow: hidden; border-radius: 6px; background: #111827; border: 1px solid rgba(255,255,255,.07); padding: 12px 12px 12px 15px; }
.preview-embed::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--preview-color, var(--accent)); }
.preview-embed h4 { margin: 0 0 9px; font-size: 14px; }
.preview-embed p { margin: 0; color: #cbd5e1; font-size: 10.5px; line-height: 1.55; white-space: pre-wrap; }
.preview-embed img { width: 100%; margin-top: 11px; border-radius: 7px; max-height: 185px; object-fit: cover; }
.preview-note { color: var(--text-soft); font-size: 8.8px; text-align: center; margin-top: 10px; }
.preview-empty { min-height: 190px; display: grid; place-items: center; text-align: center; padding: 16px; color: var(--text-muted); font-size: 10px; }

.server-info-list { display: flex; flex-direction: column; gap: 8px; }
.server-info-row { justify-content: space-between; gap: 12px; font-size: 11px; }
.server-info-row span:first-child { color: var(--text-muted); }
.server-info-row strong { max-width: 58%; text-align: right; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }

.notice-card { border-color: rgba(245,158,11,.24); background: linear-gradient(180deg, rgba(245,158,11,.065), rgba(17,24,39,.96)); }
.notice-title { display: flex; align-items: center; gap: 7px; margin: 0 0 9px; font-size: 11px; }
.notice-title span { color: var(--warning); }
.notice-list { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 7px; }
.notice-list li { color: var(--text-muted); font-size: 10px; line-height: 1.4; }
.notice-list li::before { content: "•"; color: var(--warning); margin-right: 7px; }
.notice-ok { color: var(--text-muted); font-size: 10px; }

/* Compact secondary analytics: intentionally lower visual priority than primary dashboard blocks. */
.compact-stats-panel { margin-bottom: 0; }
.compact-stats-panel .dashboard-panel-inner { padding-block: 13px; }
.compact-stats-panel .panel-title-row { margin-bottom: 10px; }
.compact-stats-panel .category-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px 24px; }
.compact-stats-panel .category-row { grid-template-columns: minmax(80px,.7fr) 1.4fr 24px; }

.dashboard-grid-primary > .dashboard-panel { align-self: stretch; height: 100%; }
.dashboard-grid-secondary > .dashboard-panel,
.dashboard-grid-secondary > .dashboard-stack { align-self: start; }
.dashboard-panel.activity-panel-empty .dashboard-panel-inner { height: 100%; min-height: 0; display: flex; flex-direction: column; }
.dashboard-panel.activity-panel-empty .activity-chart-wrap { min-height: 0; flex: 1; display: grid; }
.dashboard-panel.activity-panel-empty .chart-empty { min-height: 0; height: 100%; }

.dashboard-panel .empty-state { font-size: 11px; line-height: 1.5; padding: 12px 4px; }
.compact-empty-state { min-height: 52px; display: flex; align-items: center; gap: 6px; }
.chart-empty-rich { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 7px; padding: 26px 18px; }
.chart-empty-rich strong { color: var(--text); font-size: 12.5px; }
.chart-empty-rich small { max-width: 430px; color: var(--text-soft); font-size: 10.5px; line-height: 1.5; }
.chart-empty-icon { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; background: rgba(124,92,252,.10); color: #b9a9ff; font-size: 18px; }

.dashboard-stack { display: flex; min-width: 0; flex-direction: column; gap: 12px; }
.health-panel .panel-title-row { margin-bottom: 10px; }
.health-overall { padding: 3px 7px; border-radius: 999px; font-size: 9px; font-weight: 700; background: rgba(245,158,11,.09); color: #f8c76a; }
.health-overall.ok { background: rgba(34,197,94,.09); color: #76e39a; }
.health-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; }
.health-item { min-width: 0; padding: 9px 10px; border: 1px solid var(--border); border-radius: 8px; background: rgba(255,255,255,.014); }
.health-label { display: flex; align-items: center; gap: 6px; color: var(--text-muted); font-size: 9.5px; }
.health-label .status-dot { width: 6px; height: 6px; }
.health-item strong { display: block; margin-top: 6px; color: var(--text); font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.health-item .health-good { color: #75df96; }
.health-item .health-bad { color: #ff8e8e; }
.health-item .health-warn { color: #f6c664; }

/* module overview from old page: premium cards */
.cog-grid { gap: 10px; }
.cog-card { background: rgba(255,255,255,.018); border-color: var(--border); border-radius: 11px; }
.cog-card-on { border-color: var(--border); }
.cog-card-off { opacity: .72; }
.cog-card-icon { background: rgba(124,92,252,.12); border-radius: 9px; }
.cog-card-actions { border-top-color: var(--border); }

/* command palette */
.command-palette { position: fixed; inset: 0; z-index: 100; }
.command-palette-backdrop { position: absolute; inset: 0; background: rgba(2,6,12,.68); backdrop-filter: blur(5px); }
.command-palette-card {
  position: relative; z-index: 1; width: min(620px, calc(100vw - 32px)); max-height: min(620px, calc(100vh - 80px)); overflow: hidden;
  margin: 11vh auto 0; border: 1px solid var(--border-strong); border-radius: 14px; background: #101827; box-shadow: 0 28px 90px rgba(0,0,0,.52);
}
.command-palette-input-row { gap: 10px; padding: 12px 13px; border-bottom: 1px solid var(--border); }
.command-palette-input-row input { min-width: 0; flex: 1; background: transparent; color: var(--text); border: 0; outline: 0; font-size: 13px; }
.command-palette-results { max-height: 430px; overflow: auto; padding: 8px; }
.command-result { width: 100%; display: flex; align-items: center; gap: 10px; padding: 9px 10px; border: 0; border-radius: 9px; background: transparent; color: var(--text); text-align: left; cursor: pointer; }
.command-result:hover, .command-result.active { background: rgba(124,92,252,.1); }
.command-result-icon { width: 28px; height: 28px; border-radius: 8px; display: grid; place-items: center; background: rgba(124,92,252,.12); }
.command-result-copy strong { display: block; font-size: 11px; }
.command-result-copy small { display: block; margin-top: 2px; color: var(--text-soft); font-size: 9px; }

.sidebar-scrim { display: none; }

/* login in same visual language */
.login-screen { background: radial-gradient(circle at 50% 0%, rgba(124,92,252,.14), transparent 30rem), var(--bg); }
.login-card { background: rgba(17,24,39,.94); border-color: var(--border-strong); border-radius: 16px; box-shadow: 0 24px 80px rgba(0,0,0,.34); }
.btn-discord { background: var(--accent); }

/* v3: keep the working area close to the sidebar instead of centering a capped canvas. */
@media (min-width: 1281px) {
  .premium-main { padding-left: 14px; padding-right: 18px; }
  .premium-main .content, .premium-main .main-header { margin-left: 0; margin-right: 0; }
}

/* ── responsive ───────────────────────────────────────────────── */
@media (max-width: 1280px) {
  .overview-shell { grid-template-columns: minmax(0,1fr) 312px; }
  .dashboard-grid-secondary { grid-template-columns: 1fr 1fr; }
  .dashboard-grid-secondary > :last-child { grid-column: 1 / -1; }
  .dashboard-stack { height: 100%; }
  .top-backup { display: none; }
}

@media (max-width: 1060px) {
  .dashboard.dashboard-premium { grid-template-columns: var(--sidebar-collapsed) minmax(0, 1fr); }
  .dashboard.dashboard-premium:not(.sidebar-mobile-open) .brand-copy,
  .dashboard.dashboard-premium:not(.sidebar-mobile-open) .server-switcher-label,
  .dashboard.dashboard-premium:not(.sidebar-mobile-open) .server-select,
  .dashboard.dashboard-premium:not(.sidebar-mobile-open) .nav-label,
  .dashboard.dashboard-premium:not(.sidebar-mobile-open) .premium-nav .nav-section,
  .dashboard.dashboard-premium:not(.sidebar-mobile-open) .sidebar-user-copy,
  .dashboard.dashboard-premium:not(.sidebar-mobile-open) .user-menu-btn { display: none; }
  .dashboard.dashboard-premium:not(.sidebar-mobile-open) .premium-nav .nav-item,
  .dashboard.dashboard-premium:not(.sidebar-mobile-open) .sidebar-help,
  .dashboard.dashboard-premium:not(.sidebar-mobile-open) .server-switcher-control,
  .dashboard.dashboard-premium:not(.sidebar-mobile-open) .sidebar-user { justify-content: center; }
  .sidebar-collapse { display: none; }
  .overview-shell { grid-template-columns: 1fr; }
  .overview-aside { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); align-items: start; }
  .overview-aside > :first-child { grid-row: span 2; }
  .dashboard-grid-primary { grid-template-columns: 1fr; }
  .dashboard-grid-primary > .dashboard-panel { height: auto; }
}

@media (max-width: 760px) {
  .dashboard.dashboard-premium { display: block; }
  .workspace { min-height: 100vh; }
  .premium-sidebar {
    position: fixed; left: 0; top: 0; width: min(290px, 86vw); transform: translateX(-102%); transition: transform .18s ease;
    box-shadow: 18px 0 55px rgba(0,0,0,.35);
  }
  .dashboard-premium.sidebar-mobile-open .premium-sidebar { transform: translateX(0); }
  .dashboard-premium.sidebar-mobile-open .brand-copy,
  .dashboard-premium.sidebar-mobile-open .server-switcher-label,
  .dashboard-premium.sidebar-mobile-open .server-select,
  .dashboard-premium.sidebar-mobile-open .nav-label,
  .dashboard-premium.sidebar-mobile-open .premium-nav .nav-section,
  .dashboard-premium.sidebar-mobile-open .sidebar-user-copy,
  .dashboard-premium.sidebar-mobile-open .user-menu-btn { display: block; }
  .sidebar-scrim { position: fixed; inset: 0; z-index: 35; background: rgba(2,6,12,.6); }
  .dashboard-premium.sidebar-mobile-open .sidebar-scrim { display: block !important; }
  .mobile-menu { display: inline-grid; }
  .topbar { padding-inline: 12px; }
  .command-trigger { width: auto; flex: 1; min-width: 0; }
  .command-trigger kbd, .command-trigger > span:nth-child(2) { display: none; }
  .top-status, .topbar > .icon-btn:not(.mobile-menu):not(.notification-btn), .top-user-avatar, #top-user-avatar-fallback { display: none !important; }
  .premium-main { padding: 16px 12px 24px; }
  .overview-heading-row { align-items: flex-start; flex-direction: column; }
  .overview-actions { justify-content: flex-start; }
  .kpi-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .dashboard-grid-secondary, .overview-aside { grid-template-columns: 1fr; }
  .overview-aside > :first-child { grid-row: auto; }
  .dashboard-grid-secondary > :last-child { grid-column: auto; }
}

@media (max-width: 470px) {
  .kpi-grid { grid-template-columns: 1fr; }
  .kpi-card { min-height: 94px; }
  .ticket-row { grid-template-columns: 48px 1fr auto; }
  .ticket-age { display: none; }
  .overview-actions .btn { flex: 1; }
}

/* central module page */
.module-page-head {
  display: flex; align-items: end; justify-content: space-between; gap: 20px;
  margin-bottom: 16px; padding: 16px 18px;
  border: 1px solid var(--border); border-radius: 12px;
  background: linear-gradient(110deg, rgba(124,92,252,.11), rgba(17,24,39,.92) 55%);
}
.module-page-head h3 { margin: 4px 0 4px; font-size: 18px; }
.module-page-head p { margin: 0; }
.module-page-eyebrow { color: #a78bfa; font-size: 9px; text-transform: uppercase; letter-spacing: .08em; font-weight: 750; }
.module-page-summary { display: flex; flex-direction: column; align-items: end; color: var(--text-soft); font-size: 9px; }
.module-page-summary strong { color: var(--text); font-size: 22px; line-height: 1; }
.premium-cog-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); }
.premium-cog-grid .cog-card { min-height: 142px; padding: 14px; display: flex; flex-direction: column; }
.premium-cog-grid .cog-card-actions { margin-top: auto; }
@media (max-width: 1120px) { .premium-cog-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 600px) { .premium-cog-grid { grid-template-columns: 1fr; } .module-page-head { align-items: flex-start; } }

/* ── v4 reference alignment: mirror the approved 4A composition ─────── */
.sidebar-status-card {
  margin-top: auto;
  margin-bottom: 10px;
  padding: 14px;
  border: 1px solid rgba(124,92,252,.38);
  border-radius: 12px;
  background: linear-gradient(145deg, rgba(124,92,252,.12), rgba(17,24,39,.72));
}
.sidebar-status-head { display:flex; align-items:center; gap:8px; }
.sidebar-status-head strong { font-size: 13px; }
.sidebar-status-spark { color:#a78bfa; font-size:16px; }
.sidebar-status-card small { display:block; margin-top:8px; color:var(--text-muted); font-size:10px; line-height:1.45; }
.sidebar-status-value { display:block; margin-top:6px; font-size:16px; color:var(--text); }
.sidebar-status-action {
  width:100%; margin-top:12px; min-height:32px; border-radius:8px;
  border:1px solid rgba(124,92,252,.55); background:transparent; color:#b9a9ff;
  font-weight:650; font-size:10px; cursor:pointer;
}
.sidebar-status-action:hover { background:rgba(124,92,252,.09); }
.premium-sidebar-footer { margin-top:0; }
.dashboard-premium.sidebar-is-collapsed .sidebar-status-card { display:none; }

.overview-shell.overview-shell-4a { grid-template-columns:minmax(0,1fr) 320px; gap:14px; }
.overview-heading-row { min-height:48px; margin-bottom:14px; }
.overview-heading-copy h1 { font-size:24px; }
.overview-heading-copy p { font-size:12px; }

.kpi-grid { gap:12px; margin-bottom:14px; }
.kpi-card {
  min-height:104px; padding:15px 16px;
  background:#111827;
  border-color:rgba(148,163,184,.10);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.012);
}
.kpi-card::before { display:none; }
.kpi-eyebrow { font-size:9.5px; }
.kpi-icon { width:38px; height:38px; border-radius:50%; }
.kpi-value { font-size:28px; margin-top:6px; }
.kpi-meta { margin-top:7px; font-size:10.5px; }

.dashboard-panel, .aside-panel {
  background:#111827;
  border-color:rgba(148,163,184,.10);
  border-radius:11px;
}
.dashboard-panel-inner { padding:14px 15px; }
.panel-title-row { margin-bottom:11px; }
.panel-title-row h3 { font-size:13.5px; }

.dashboard-grid-primary {
  grid-template-columns:minmax(0,1.48fr) minmax(320px,.92fr);
  gap:12px; margin-bottom:12px;
}
.dashboard-grid-primary > .dashboard-panel { min-height:250px; }
.dashboard-panel.activity-panel-empty { min-height:250px; }
.dashboard-panel.activity-panel-empty .activity-chart-wrap { min-height:185px; }
.dashboard-panel.activity-panel-empty .chart-empty { min-height:185px; }
.activity-chart-wrap { min-height:220px; }
.activity-chart { height:220px; }

.dashboard-grid-secondary.dashboard-grid-reference {
  grid-template-columns:1fr .88fr 1fr;
  gap:12px; margin-bottom:12px; align-items:stretch;
}
.dashboard-grid-reference > .dashboard-panel { min-height:204px; height:100%; }
.dashboard-grid-reference .ticket-row { min-height:34px; }
.dashboard-grid-reference .module-status-row { min-height:27px; }
.dashboard-grid-reference .module-status-list { gap:1px; }

.stats-donut-panel .dashboard-panel-inner { height:100%; display:flex; flex-direction:column; }
.panel-control-button { cursor:pointer; }
.donut-layout { display:grid; grid-template-columns:118px minmax(0,1fr); gap:14px; align-items:center; flex:1; }
.donut-chart {
  width:112px; aspect-ratio:1; border-radius:50%; position:relative; display:grid; place-items:center;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.05);
}
.donut-hole {
  width:66px; aspect-ratio:1; border-radius:50%; background:#111827; display:grid; place-items:center;
  align-content:center; border:1px solid rgba(255,255,255,.04);
}
.donut-hole strong { font-size:15px; line-height:1; }
.donut-hole small { margin-top:4px; color:var(--text-soft); font-size:8px; }
.donut-legend { display:flex; flex-direction:column; gap:8px; min-width:0; }
.donut-legend-row { display:flex; align-items:center; justify-content:space-between; gap:10px; color:var(--text-muted); font-size:9.5px; }
.donut-legend-row > span { min-width:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.donut-legend-row i { width:7px; height:7px; border-radius:50%; display:inline-block; margin-right:6px; }
.donut-legend-row strong { color:var(--text-muted); font-weight:600; }
.panel-footer-link {
  margin:10px -15px -14px; padding:9px 12px; border:0; border-top:1px solid rgba(255,255,255,.04);
  background:rgba(255,255,255,.008); color:#a78bfa; font-size:9.5px; cursor:pointer;
}

.quick-actions-panel { margin-bottom:12px; }
.quick-actions-reference { grid-template-columns:repeat(5,minmax(0,1fr)); gap:8px; }
.quick-actions-reference .quick-action { min-height:54px; padding:9px 10px; border-radius:8px; gap:9px; }
.quick-actions-reference .quick-action-icon { width:32px; height:32px; border-radius:8px; }
.quick-actions-reference .quick-action-copy strong { font-size:10.5px; }
.quick-actions-reference .quick-action-copy small { font-size:9px; }
.quick-action-icon-success { color:#6ee7b7; background:rgba(34,197,94,.13); }
.quick-action-icon-warning { color:#fbbf24; background:rgba(245,158,11,.13); }
.quick-action-icon-pink { color:#f0abfc; background:rgba(217,70,239,.13); }

.system-status-wide { margin-bottom:0; }
.system-status-layout { display:grid; grid-template-columns:.9fr .72fr 1.25fr; padding:12px 15px; min-height:104px; }
.system-block { min-width:0; padding-right:18px; }
.system-block + .system-block { border-left:1px solid rgba(255,255,255,.05); padding-left:20px; }
.system-block h3 { margin:0 0 10px; font-size:11px; }
.system-service-list { display:grid; grid-template-columns:1fr; gap:7px; }
.system-service-list > div { display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:9.5px; }
.system-service-list span { display:flex; align-items:center; gap:7px; color:var(--text-muted); }
.system-service-list strong { font-size:9px; }
.backup-wide-value { font-size:21px; line-height:1; font-weight:760; letter-spacing:-.03em; }
.system-block-center small { display:block; margin-top:8px; color:var(--text-soft); font-size:9px; }
.system-block-resources { padding-right:0; }
.resource-row { display:grid; grid-template-columns:44px minmax(0,1fr) 34px; align-items:center; gap:9px; margin-top:9px; font-size:9px; color:var(--text-muted); }
.resource-row strong { color:var(--text-muted); text-align:right; font-size:8.5px; }
.resource-track { height:5px; border-radius:999px; overflow:hidden; background:rgba(255,255,255,.045); }
.resource-track i { display:block; height:100%; border-radius:inherit; background:#8b5cf6; }
.resource-track i.resource-good { background:#22c55e; }
.resource-track i.resource-warning { background:#f59e0b; }

.overview-aside { gap:10px; }
.preview-panel-reference .dashboard-panel-inner { padding:15px; }
.preview-panel-reference .preview-tabs { gap:14px; margin-left:-15px; margin-right:-15px; padding-left:15px; padding-right:15px; }
.preview-panel-reference .preview-tab { font-size:9.5px; }
.preview-panel-reference .discord-preview { padding:11px; }
.preview-panel-reference .preview-embed h4 { font-size:13.5px; }
.preview-panel-reference .preview-embed p { font-size:10px; }
.preview-panel-reference .preview-embed img { max-height:165px; }
.server-owner-value { display:flex; align-items:center; justify-content:flex-end; gap:6px; }
.server-owner-value img { width:18px; height:18px; border-radius:50%; object-fit:cover; }
.notice-action { border:0; background:transparent; color:#a78bfa; padding:7px 0 0; font-size:9.5px; cursor:pointer; }
.tasks-list { display:flex; flex-direction:column; }
.task-row {
  display:grid; grid-template-columns:20px minmax(0,1fr) auto; align-items:center; gap:7px; width:100%;
  min-height:30px; border:0; border-bottom:1px solid rgba(255,255,255,.04); background:transparent; color:var(--text); text-align:left; cursor:pointer;
}
.task-row:last-child { border-bottom:0; }
.task-row > span { color:#b9a9ff; font-size:11px; }
.task-row strong { font-size:9.5px; font-weight:580; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.task-row small { color:var(--text-soft); font-size:8.5px; white-space:nowrap; }

/* Keep content visually anchored like the reference, without a large dead gutter. */
.premium-main { padding-left:22px; padding-right:18px; }

@media (max-width:1380px) {
  .overview-shell.overview-shell-4a { grid-template-columns:minmax(0,1fr) 300px; }
  .quick-actions-reference { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .quick-actions-reference .quick-action:nth-child(n+4) { min-height:50px; }
}
@media (max-width:1180px) {
  .overview-shell.overview-shell-4a { grid-template-columns:1fr; }
  .overview-aside { position:static; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .overview-aside > :first-child { grid-row:span 2; }
  .dashboard-grid-secondary.dashboard-grid-reference { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .stats-donut-panel { grid-column:1/-1; }
}
@media (max-width:760px) {
  .sidebar-status-card { display:none; }
  .dashboard-grid-secondary.dashboard-grid-reference { grid-template-columns:1fr; }
  .stats-donut-panel { grid-column:auto; }
  .quick-actions-reference { grid-template-columns:1fr; }
  .system-status-layout { grid-template-columns:1fr; gap:14px; }
  .system-block + .system-block { border-left:0; border-top:1px solid rgba(255,255,255,.05); padding:14px 0 0; }
  .system-block { padding-right:0; }
  .donut-layout { grid-template-columns:104px minmax(0,1fr); }
  .donut-chart { width:100px; }
}

/* ── v5 final layout alignment ─────────────────────────────────────
   Keeps the 4A composition left-anchored on ultrawide screens while
   matching the approved header/sidebar proportions more closely. */
:root {
  --sidebar-width: 276px;
  --topbar-height: 72px;
  --dashboard-max-width: 2200px;
}

[hidden] { display: none !important; }

/* Left anchored canvas: no dead gutter after the sidebar, no ultrawide stretching. */
.workspace { justify-items: start; width: 100%; }
.topbar,
.premium-main {
  width: min(100%, var(--dashboard-max-width));
  max-width: var(--dashboard-max-width);
  justify-self: start;
  box-sizing: border-box;
}
.premium-main {
  padding: 18px 20px 30px 18px;
  margin: 0;
}
.premium-main .content,
.premium-main .main-header { max-width: none; width: 100%; }

/* Sidebar – structure and hierarchy of the 4A reference. */
.premium-sidebar {
  padding: 18px 14px 16px;
  gap: 12px;
}
.sidebar-brand-row { min-height: 42px; margin-bottom: 2px; }
.sidebar-brand { gap: 11px; }
.brand-mark { width: 38px; height: 38px; border-radius: 10px; font-size: 20px; }
.brand-copy strong { font-size: 18px; letter-spacing: -.025em; }
.brand-copy small { display: none; }

.server-switcher {
  padding: 0;
  border: 0;
  background: transparent;
  border-radius: 0;
}
.server-switcher-control {
  position: relative;
  min-height: 62px;
  gap: 11px;
  padding: 9px 10px;
  border: 1px solid var(--border-strong);
  border-radius: 12px;
  background: rgba(255,255,255,.024);
  transition: background .15s ease, border-color .15s ease;
}
.server-switcher-control:hover { background: rgba(255,255,255,.038); border-color: rgba(255,255,255,.13); }
.server-switcher-icon { width: 40px; height: 40px; border-radius: 10px; }
.server-switcher-meta { min-width: 0; flex: 1; display: flex; flex-direction: column; gap: 3px; }
.server-switcher-meta strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; color: var(--text); }
.server-switcher-meta small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text-muted); font-size: 10px; }
.server-switcher-chevron { flex: 0 0 auto; color: var(--text-muted); font-size: 15px; transform: translateY(-1px); }
.server-select-overlay {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  opacity: 0;
  cursor: pointer;
  z-index: 3;
}
.server-switcher-fallback[hidden],
.server-switcher-icon[hidden] { display: none !important; }

.premium-nav { gap: 2px; margin-top: 2px; }
.premium-nav .nav-section {
  margin: 16px 10px 6px;
  color: #708097;
  font-size: 9px;
  letter-spacing: .08em;
}
.premium-nav .nav-overview { margin-bottom: 2px; }
.premium-nav .nav-item {
  min-height: 40px;
  gap: 11px;
  padding: 8px 11px;
  border-radius: 9px;
  font-size: 12.5px;
  font-weight: 540;
}
.premium-nav .nav-item.active {
  background: linear-gradient(90deg, rgba(124,92,252,.34), rgba(124,92,252,.16));
  border-color: rgba(139,108,255,.32);
  box-shadow: none;
  color: #f1edff;
}
.premium-nav .nav-item.active::before {
  content: "";
  position: absolute;
  left: 0;
  width: 2px;
  height: 22px;
  border-radius: 0 2px 2px 0;
  background: #9a7bff;
}
.premium-nav .nav-item { position: relative; }
.nav-svg {
  width: 17px;
  height: 17px;
  flex: 0 0 17px;
  fill: none;
  stroke: #9aa8bb;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.premium-nav .nav-item.active .nav-svg { stroke: #c5b8ff; }
.nav-count {
  margin-left: auto;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  display: inline-grid;
  place-items: center;
  border-radius: 7px;
  background: #6f45ec;
  color: #fff;
  font-size: 9px;
  font-weight: 750;
}

.sidebar-status-card {
  padding: 15px 14px;
  margin-top: auto;
  margin-bottom: 8px;
  min-height: 128px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.sidebar-status-action { min-height: 34px; }
.premium-sidebar-footer { border-top: 0; padding-top: 0; }
.sidebar-user { padding: 9px 8px; }

/* Header right side: two-line status blocks + tools, matching 4A. */
.topbar {
  height: var(--topbar-height);
  padding: 0 22px;
  gap: 10px;
  background: rgba(9,13,22,.94);
}
.command-trigger { width: 290px; height: 38px; padding: 0 11px; }
.topbar-search-svg,
.topbar-tool svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.top-status-block {
  min-height: 44px;
  gap: 9px;
  padding: 0 14px;
  border-left: 0 !important;
}
.top-status-block + .top-status-block { border-left: 1px solid var(--border) !important; }
.top-status-symbol {
  width: 18px;
  height: 18px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  flex: 0 0 auto;
  font-size: 10px;
  font-weight: 800;
}
.top-status-symbol.backup-ok { background: rgba(34,197,94,.16); color: #5ee784; }
.top-status-copy { display: flex; flex-direction: column; gap: 2px; line-height: 1.1; }
.top-status-copy small { color: var(--text-muted); font-size: 9.5px; }
.top-status-copy strong { color: var(--text); font-size: 10.5px; font-weight: 620; }
.top-status-block .status-dot { width: 8px; height: 8px; }
.top-status-block:has(.status-dot.online) .top-status-copy strong { color: #5ee784; }
.top-status-block:has(.status-dot.offline) .top-status-copy strong { color: #ff8d8d; }
.topbar-separator { width: 1px; height: 30px; background: var(--border); margin: 0 5px; }
.topbar-tool { width: 36px; height: 36px; color: #9aa7b9; }
.notification-btn { font-size: inherit; }
.notification-badge { top: 0; right: -2px; min-width: 17px; height: 17px; font-size: 8px; }

/* 4A desktop composition – stable proportions on 1440p/ultrawide. */
.overview-shell.overview-shell-4a {
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 16px;
}
.overview-heading-row { min-height: 52px; margin-bottom: 16px; }
.overview-heading-copy h1 { font-size: 27px; }
.overview-heading-copy p { font-size: 12.5px; }
.overview-actions { gap: 9px; }
.overview-actions .btn { min-height: 38px; padding-inline: 14px; }

.kpi-grid { gap: 14px; margin-bottom: 16px; }
.kpi-card { min-height: 124px; padding: 17px 18px; border-radius: 12px; }
.kpi-eyebrow { font-size: 10px; }
.kpi-icon { width: 42px; height: 42px; }
.kpi-value { font-size: 31px; margin-top: 8px; }
.kpi-meta { font-size: 10.5px; margin-top: 8px; }

.dashboard-grid-primary {
  grid-template-columns: minmax(0, 1.5fr) minmax(360px, .95fr);
  gap: 14px;
  margin-bottom: 14px;
}
.dashboard-grid-primary > .dashboard-panel,
.dashboard-panel.activity-panel-empty { min-height: 330px; }
.dashboard-panel.activity-panel-empty .activity-chart-wrap,
.dashboard-panel.activity-panel-empty .chart-empty { min-height: 260px; }
.activity-chart-wrap { min-height: 285px; }
.activity-chart { height: 285px; }
.dashboard-panel-inner { padding: 16px 17px; }
.panel-title-row { margin-bottom: 13px; }
.panel-title-row h3 { font-size: 14px; }
.activity-row { min-height: 51px; }
.activity-copy strong { font-size: 11.5px; }
.activity-copy small { font-size: 10px; }

.dashboard-grid-secondary.dashboard-grid-reference {
  grid-template-columns: 1.15fr .96fr 1fr;
  gap: 14px;
  margin-bottom: 14px;
}
.dashboard-grid-reference > .dashboard-panel { min-height: 238px; }
.dashboard-grid-reference .ticket-row { min-height: 39px; }
.dashboard-grid-reference .module-status-row { min-height: 29px; }
.donut-layout { grid-template-columns: 126px minmax(0,1fr); gap: 17px; }
.donut-chart { width: 120px; }
.donut-hole { width: 70px; }

.quick-actions-panel { margin-bottom: 14px; }
.quick-actions-panel .dashboard-panel-inner { padding-top: 14px; padding-bottom: 14px; }
.quick-actions-reference { gap: 10px; }
.quick-actions-reference .quick-action { min-height: 64px; padding: 10px 12px; }
.quick-actions-reference .quick-action-icon { width: 36px; height: 36px; }
.quick-actions-reference .quick-action-copy strong { font-size: 11px; }
.quick-actions-reference .quick-action-copy small { font-size: 9.5px; }

.system-status-layout {
  min-height: 126px;
  grid-template-columns: .92fr .76fr 1.3fr;
  padding: 15px 17px;
}
.system-block h3 { font-size: 11.5px; margin-bottom: 11px; }
.system-service-list > div { font-size: 10px; }
.backup-wide-value { font-size: 23px; }
.resource-row { margin-top: 10px; }

.overview-aside { gap: 12px; }
.preview-panel-reference { min-height: 418px; }
.preview-panel-reference .dashboard-panel-inner { padding: 16px; }
.preview-panel-reference .preview-tabs { margin-left: -16px; margin-right: -16px; padding-left: 16px; padding-right: 16px; }
.preview-panel-reference .discord-preview { padding: 12px; }
.preview-panel-reference .preview-embed img { max-height: 190px; }
.aside-panel .server-info-row { min-height: 24px; }
.tasks-panel .task-row { min-height: 34px; }

/* Preserve left anchoring when the sidebar is collapsed. */
.dashboard-premium.sidebar-is-collapsed .server-switcher-meta,
.dashboard-premium.sidebar-is-collapsed .server-switcher-chevron,
.dashboard-premium.sidebar-is-collapsed .nav-count { display: none; }
.dashboard-premium.sidebar-is-collapsed .server-switcher-control { padding: 8px; justify-content: center; }
.dashboard-premium.sidebar-is-collapsed .server-select-overlay { display: block; }

@media (max-width: 2380px) {
  :root { --dashboard-max-width: 100%; }
}
@media (max-width: 1550px) {
  .overview-shell.overview-shell-4a { grid-template-columns: minmax(0,1fr) 330px; }
  .dashboard-grid-primary { grid-template-columns: minmax(0,1.4fr) minmax(320px,.9fr); }
  .quick-actions-reference { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width: 1180px) {
  .top-status-block { display: none; }
  .topbar-separator { display: none; }
}


/* ── v6 4A final layout + real module navigation ─────────────────────
   4A controls proportions and visual hierarchy; DidiBot's real modules
   remain the source of truth for navigation. */
:root {
  --sidebar-width: 292px;
  --topbar-height: 76px;
  --dashboard-max-width: 2080px;
}

/* Keep the workspace attached to the sidebar while preventing ultrawide stretch. */
.workspace { width:100%; justify-items:start; }
.topbar,
.premium-main { width:min(100%, var(--dashboard-max-width)); max-width:var(--dashboard-max-width); justify-self:start; }
.premium-main { padding:20px 22px 34px 18px; }

/* Sidebar: 4A proportions with the real DidiBot module catalog. */
.premium-sidebar { padding:18px 16px 16px; gap:11px; }
.sidebar-brand-row { min-height:46px; }
.brand-mark { width:40px; height:40px; border-radius:11px; }
.brand-copy strong { font-size:19px; }
.server-switcher-control { min-height:66px; padding:10px 11px; }
.server-switcher-icon { width:42px; height:42px; border-radius:11px; }
.server-switcher-meta strong { font-size:13.5px; }
.server-switcher-meta small { font-size:10.5px; }
.premium-nav { gap:2px; min-height:0; overflow-y:auto; overflow-x:hidden; padding-right:2px; scrollbar-width:thin; scrollbar-color:rgba(255,255,255,.08) transparent; }
.premium-nav::-webkit-scrollbar { width:5px; }
.premium-nav::-webkit-scrollbar-thumb { background:rgba(255,255,255,.08); border-radius:8px; }
.premium-nav .nav-section { margin:15px 10px 6px; font-size:9.5px; letter-spacing:.09em; }
.premium-nav .nav-item { min-height:39px; padding:8px 11px; gap:11px; font-size:12.8px; }
.module-nav-list { display:flex; flex-direction:column; gap:2px; }
.module-nav-list .nav-item { width:100%; }
.nav-section-management { margin-top:17px !important; }
.nav-future { opacity:.78; }
.nav-future:hover { opacity:1; }
.nav-svg { width:18px; height:18px; flex-basis:18px; }
.sidebar-status-card { min-height:132px; padding:15px; }
.sidebar-status-head strong { font-size:13.5px; }
.sidebar-status-card small { font-size:10.5px; }
.sidebar-status-value { font-size:17px; }
.sidebar-user-copy strong { font-size:12.5px; }
.sidebar-user-copy small { font-size:10.5px; }

/* Header right side now matches the visual weight of 4A. */
.topbar { padding:0 24px; gap:11px; }
.command-trigger { width:300px; height:40px; font-size:12px; }
.top-status-block { min-height:48px; gap:10px; padding:0 16px; }
.top-status-symbol { width:20px; height:20px; font-size:11px; }
.top-status-copy small { font-size:10.5px; }
.top-status-copy strong { font-size:12px; }
.top-status-block .status-dot { width:9px; height:9px; }
.topbar-separator { height:32px; margin:0 6px; }
.topbar-tool { width:38px; height:38px; }
.topbar-search-svg,
.topbar-tool svg { width:19px; height:19px; }
.notification-badge { min-width:18px; height:18px; font-size:9px; top:-1px; right:-2px; }

/* 4A overview scale: slightly larger text/cards, tighter proportional canvas. */
.overview-shell.overview-shell-4a { grid-template-columns:minmax(0,1fr) 386px; gap:16px; }
.overview-heading-row { min-height:56px; margin-bottom:16px; }
.overview-heading-copy h1 { font-size:30px; line-height:1.1; }
.overview-heading-copy p { font-size:13.5px; }
.overview-actions .btn { min-height:40px; padding-inline:15px; font-size:12px; }

.kpi-grid { gap:14px; margin-bottom:16px; }
.kpi-card { min-height:132px; padding:18px 19px; }
.kpi-eyebrow { font-size:10.5px; }
.kpi-icon { width:44px; height:44px; }
.kpi-value { font-size:34px; }
.kpi-meta { font-size:11.5px; }

.dashboard-grid-primary { grid-template-columns:minmax(0,1.48fr) minmax(360px,.92fr); gap:14px; }
.dashboard-grid-primary > .dashboard-panel,
.dashboard-panel.activity-panel-empty { min-height:350px; }
.dashboard-panel.activity-panel-empty .activity-chart-wrap,
.dashboard-panel.activity-panel-empty .chart-empty { min-height:275px; }
.activity-chart-wrap, .activity-chart { min-height:300px; height:300px; }
.dashboard-panel-inner { padding:17px 18px; }
.panel-title-row h3 { font-size:14.5px; }
.activity-row { min-height:53px; }
.activity-copy strong { font-size:12px; }
.activity-copy small { font-size:10.5px; }

.dashboard-grid-secondary.dashboard-grid-reference { grid-template-columns:1fr 1fr 1fr; gap:14px; }
.dashboard-grid-reference > .dashboard-panel { min-height:250px; }
.dashboard-grid-reference .ticket-row { min-height:41px; }
.dashboard-grid-reference .module-status-row { min-height:30px; }
.donut-layout { grid-template-columns:132px minmax(0,1fr); gap:18px; }
.donut-chart { width:126px; }

.quick-actions-panel .dashboard-panel-inner { padding:15px 17px; }
.quick-actions-reference { gap:11px; }
.quick-actions-reference .quick-action { min-height:70px; padding:11px 13px; }
.quick-actions-reference .quick-action-icon { width:39px; height:39px; }
.quick-actions-reference .quick-action-copy strong { font-size:11.8px; }
.quick-actions-reference .quick-action-copy small { font-size:10px; }

.system-status-layout { min-height:138px; grid-template-columns:.95fr .82fr 1.35fr; padding:17px 18px; }
.system-block h3 { font-size:12px; }
.system-service-list > div { font-size:10.5px; }
.backup-wide-value { font-size:25px; }

.overview-aside { gap:13px; }
.preview-panel-reference { min-height:440px; }
.preview-panel-reference .dashboard-panel-inner { padding:17px; }
.preview-panel-reference .preview-tabs { margin-left:-17px; margin-right:-17px; padding-left:17px; padding-right:17px; }
.preview-panel-reference .discord-preview { padding:13px; }
.preview-panel-reference .preview-embed img { max-height:205px; }
.aside-panel .server-info-row { min-height:26px; font-size:11.5px; }
.tasks-panel .task-row { min-height:37px; }

/* Collapsed sidebar must also hide dynamically rendered module labels. */
.dashboard-premium.sidebar-is-collapsed .module-nav-list .nav-item { justify-content:center; padding-inline:6px; }

@media (max-width: 2200px) {
  :root { --dashboard-max-width:100%; }
}
@media (max-width: 1550px) {
  :root { --sidebar-width:276px; }
  .overview-shell.overview-shell-4a { grid-template-columns:minmax(0,1fr) 340px; }
  .dashboard-grid-primary { grid-template-columns:minmax(0,1.4fr) minmax(320px,.9fr); }
}

/* ── v7 Functional Pass ───────────────────────────────────────────── */
.top-status-block {
  appearance:none;
  border:0;
  background:transparent;
  font:inherit;
  cursor:pointer;
}
.top-status-block:hover .top-status-copy strong { color:var(--text); }
.notification-badge[hidden] { display:none !important; }

.notification-popover {
  position:fixed;
  z-index:80;
  top:calc(var(--topbar-height) - 2px);
  right:max(22px, calc(100vw - var(--dashboard-max-width) + 22px));
  width:min(390px, calc(100vw - 28px));
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
  background:#0f1725;
  box-shadow:0 22px 60px rgba(0,0,0,.42);
  overflow:hidden;
}
.notification-popover.hidden { display:none !important; }
.notification-popover-head {
  display:flex; align-items:center; justify-content:space-between; gap:14px;
  padding:15px 16px 13px; border-bottom:1px solid var(--border);
}
.notification-popover-head > div { display:flex; flex-direction:column; gap:3px; }
.notification-popover-head strong { font-size:13px; }
.notification-popover-head small { color:var(--text-muted); font-size:10.5px; }
.notification-list { max-height:390px; overflow:auto; padding:7px; }
.notification-item {
  width:100%; display:grid; grid-template-columns:34px minmax(0,1fr) auto; align-items:center; gap:10px;
  border:0; background:transparent; color:var(--text); text-align:left; padding:10px; border-radius:10px; cursor:pointer;
}
.notification-item:hover { background:rgba(255,255,255,.035); }
.notification-item-icon { width:32px; height:32px; display:grid; place-items:center; border-radius:9px; background:rgba(124,92,252,.12); color:#a78bfa; font-weight:800; }
.notification-warning .notification-item-icon { background:rgba(245,158,11,.12); color:#fbbf24; }
.notification-danger .notification-item-icon { background:rgba(239,68,68,.12); color:#f87171; }
.notification-item-copy { display:flex; flex-direction:column; min-width:0; gap:3px; }
.notification-item-copy strong { font-size:11.5px; }
.notification-item-copy small { color:var(--text-muted); font-size:10px; line-height:1.35; }
.notification-item-meta { color:var(--text-soft); font-size:9px; }
.notification-empty { padding:26px 16px; display:flex; flex-direction:column; align-items:center; gap:5px; text-align:center; }
.notification-empty > span { width:34px; height:34px; display:grid; place-items:center; border-radius:50%; background:rgba(34,197,94,.1); color:var(--success); }
.notification-empty strong { font-size:12px; }
.notification-empty small { color:var(--text-muted); font-size:10px; }
.notification-footer { width:100%; height:40px; border:0; border-top:1px solid var(--border); background:rgba(255,255,255,.015); color:#a78bfa; font:600 10.5px/1 var(--font); cursor:pointer; }
.notification-footer:hover { background:rgba(124,92,252,.06); }

.dashboard-user-avatar,
.activity-avatar,
.ticket-avatar {
  width:32px; height:32px; border-radius:50%; object-fit:cover; flex:0 0 auto;
  border:1px solid rgba(255,255,255,.08); background:#202942;
}
.dashboard-user-avatar-fallback { display:grid; place-items:center; font-size:11px; font-weight:800; color:#d8def0; background:linear-gradient(145deg,#2b3150,#191f34); }
.activity-row-button { width:100%; border:0; background:transparent; color:inherit; text-align:left; cursor:pointer; }
.activity-row-button:hover { background:rgba(255,255,255,.025); }
.activity-icon { display:none; }
.activity-copy { min-width:0; }

.ticket-row-with-avatar {
  grid-template-columns:32px minmax(84px,.72fr) minmax(92px,1fr) auto auto !important;
  gap:9px !important;
}
.ticket-user { display:flex; flex-direction:column; min-width:0; gap:2px; }
.ticket-user strong { font-size:10.5px; }
.ticket-user small { font-size:9px; color:var(--text-muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ticket-subject { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.nav-count { margin-left:auto; min-width:20px; height:20px; padding:0 6px; display:grid; place-items:center; border-radius:7px; background:var(--accent); color:#fff; font-size:9px; font-weight:800; }
.nav-count[hidden] { display:none !important; }
.dashboard-grid-secondary.dashboard-grid-two { grid-template-columns:1fr 1fr !important; }
.preview-discord-button { margin-top:10px; min-height:32px; padding:0 12px; border:0; border-radius:5px; background:#4e5661; color:#fff; font:600 10px/1 var(--font); }

.dashboard-widget-options { display:flex; flex-direction:column; gap:8px; margin:8px 0 2px; }
.dashboard-widget-option { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px; border:1px solid var(--border); border-radius:10px; background:rgba(255,255,255,.02); }
.dashboard-widget-option > span { display:flex; flex-direction:column; gap:3px; }
.dashboard-widget-option strong { font-size:12px; }
.dashboard-widget-option small { color:var(--text-muted); font-size:10px; }
.dashboard-widget-option input { width:18px; height:18px; accent-color:var(--accent); }

.management-shell { display:flex; flex-direction:column; gap:14px; width:100%; }
.management-summary-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.management-stat { min-height:112px; padding:16px; display:flex; flex-direction:column; justify-content:center; border:1px solid var(--border); border-radius:12px; background:var(--card); }
.management-stat > span { color:var(--text-muted); font-size:10px; text-transform:uppercase; letter-spacing:.05em; font-weight:700; }
.management-stat > strong { margin-top:7px; font-size:27px; letter-spacing:-.03em; }
.management-stat > small { margin-top:5px; color:var(--text-muted); font-size:10px; }
.management-grid-two { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.management-grid-stats { grid-template-columns:minmax(0,1.5fr) minmax(320px,.8fr); }
.management-card { padding:0; overflow:hidden; }
.management-card-head { display:flex; align-items:center; justify-content:space-between; gap:15px; padding:16px 17px; border-bottom:1px solid var(--border); }
.management-card-head h3 { margin:0; font-size:14px; }
.management-card-head p { margin:4px 0 0; }
.server-info-list-wide { padding:12px 17px 16px; }
.resource-chip-list { display:flex; flex-wrap:wrap; gap:7px; padding:14px 16px 4px; }
.roles-chip-list { padding-top:9px; padding-bottom:16px; border-top:1px solid rgba(255,255,255,.035); margin-top:10px; }
.resource-chip { padding:6px 9px; border:1px solid var(--border); border-radius:8px; background:rgba(255,255,255,.025); color:var(--text-muted); font-size:10px; }
.stats-page-chart { padding:0 16px 14px; min-height:290px; }
.stats-bars { display:flex; flex-direction:column; gap:10px; padding:16px; }
.stats-bar-row { display:grid; grid-template-columns:minmax(110px,.9fr) minmax(100px,1.5fr) 28px; align-items:center; gap:9px; font-size:10px; color:var(--text-muted); }
.stats-bar-row > div { height:7px; border-radius:999px; background:#1c2638; overflow:hidden; }
.stats-bar-row i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#6d4df4,#8b5cf6); }
.stats-bar-row strong { color:var(--text); text-align:right; }
.management-log-list { padding:5px 15px 12px; }
.management-log-row { display:grid; grid-template-columns:32px minmax(0,1fr) auto; gap:10px; align-items:center; min-height:54px; border-bottom:1px solid rgba(255,255,255,.04); }
.management-log-row:last-child { border-bottom:0; }
.management-log-row > div { display:flex; flex-direction:column; gap:3px; min-width:0; }
.management-log-row strong { font-size:11.5px; }
.management-log-row small { color:var(--text-muted); font-size:10px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.management-log-row > span:last-child { color:var(--text-soft); font-size:9.5px; }
.backup-list-page { padding:8px 15px 15px; }
.backup-row-page { display:grid; grid-template-columns:40px minmax(0,1fr) auto; align-items:center; gap:12px; min-height:66px; border-bottom:1px solid rgba(255,255,255,.04); }
.backup-row-page:last-child { border-bottom:0; }
.backup-icon-page { width:38px; height:38px; display:grid; place-items:center; border-radius:10px; background:rgba(124,92,252,.11); color:#a78bfa; }
.backup-copy-page { display:flex; flex-direction:column; gap:4px; }
.backup-copy-page strong { font-size:12px; }
.backup-copy-page small { color:var(--text-muted); font-size:10px; }
.backup-actions-page { display:flex; gap:7px; }
.management-empty { min-height:160px; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:6px; }
.management-empty small { color:var(--text-muted); }
.task-page-list { padding:8px 14px 14px; display:flex; flex-direction:column; gap:7px; }
.task-page-row { display:grid; grid-template-columns:34px minmax(0,1fr) 18px; gap:10px; align-items:center; min-height:58px; padding:8px 10px; border:1px solid var(--border); border-radius:10px; background:rgba(255,255,255,.015); color:var(--text); text-align:left; cursor:pointer; }
.task-page-row:hover { background:rgba(124,92,252,.04); border-color:rgba(124,92,252,.18); }
.task-page-row > span:nth-child(2) { display:flex; flex-direction:column; gap:3px; }
.task-page-row strong { font-size:11.5px; }
.task-page-row small { color:var(--text-muted); font-size:10px; }
.task-page-row i { color:var(--text-soft); font-style:normal; font-size:16px; }
.task-warning { border-color:rgba(245,158,11,.18); }
.task-danger { border-color:rgba(239,68,68,.2); }
.integration-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.integration-card { min-height:100px; display:grid; grid-template-columns:44px minmax(0,1fr) auto; gap:13px; align-items:center; padding:15px; border:1px solid var(--border); border-radius:12px; background:var(--card); color:var(--text); text-align:left; cursor:pointer; }
.integration-card:hover { border-color:rgba(124,92,252,.2); background:#141d2e; }
.integration-icon { width:42px; height:42px; display:grid; place-items:center; border-radius:11px; background:rgba(124,92,252,.1); font-size:18px; }
.integration-card > span:nth-child(2) { display:flex; flex-direction:column; gap:5px; }
.integration-card strong { font-size:12.5px; }
.integration-card small { color:var(--text-muted); font-size:10px; }
.integration-state { color:var(--success); font-size:10px; font-weight:700; }
.integration-state.off { color:var(--text-soft); }
.future-integration-card { padding:16px 17px; }
.future-integration-card h3 { margin:0 0 6px; font-size:13px; }

@media (max-width: 1000px) {
  .management-summary-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .management-grid-two, .management-grid-stats, .integration-grid { grid-template-columns:1fr; }
  .notification-popover { right:14px; }
}
@media (max-width: 700px) {
  .management-summary-grid { grid-template-columns:1fr; }
  .backup-row-page { grid-template-columns:38px 1fr; }
  .backup-actions-page { grid-column:1 / -1; padding-bottom:8px; }
  .ticket-row-with-avatar { grid-template-columns:30px 1fr auto !important; }
  .ticket-row-with-avatar .ticket-subject { grid-column:2; }
  .ticket-row-with-avatar .ticket-age { display:none; }
}
.resource-row .resource-muted { background:#475569; }

/* ── v8 functional polish ───────────────────────────────────────── */
/* The old sidebar health card was intentionally removed. Keep the user
   profile anchored to the bottom while the module navigation may scroll. */
.premium-sidebar-footer {
  margin-top: auto !important;
  padding-top: 10px;
}
.premium-nav {
  flex: 1 1 auto;
  min-height: 0;
}

/* ── v11 functional pass II ────────────────────────────────────── */
.top-status-symbol.backup-warning {
  background: rgba(245,158,11,.16);
  color: #fbbf24;
}
.notification-head-actions { display:flex; align-items:center; gap:4px; }
.notification-head-actions .icon-btn { width:30px; height:30px; }
.is-spinning { animation: didibot-spin .7s linear infinite; }
@keyframes didibot-spin { to { transform: rotate(360deg); } }

.user-menu-popover {
  position: fixed;
  z-index: 95;
  left: 12px;
  bottom: 76px;
  width: calc(var(--sidebar-width) - 24px);
  padding: 7px;
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 12px;
  background: #101827;
  box-shadow: 0 18px 44px rgba(0,0,0,.42);
}
.user-menu-popover.hidden { display:none !important; }
.user-menu-popover > button,
.user-menu-popover > a {
  width:100%; min-height:48px; display:grid; grid-template-columns:30px minmax(0,1fr); gap:9px; align-items:center;
  padding:7px 8px; border:0; border-radius:9px; background:transparent; color:var(--text); text-align:left; text-decoration:none; cursor:pointer;
}
.user-menu-popover > button:hover,
.user-menu-popover > a:hover { background:rgba(255,255,255,.04); }
.user-menu-popover > button > span:first-child,
.user-menu-popover > a > span:first-child { width:28px; height:28px; display:grid; place-items:center; border-radius:8px; background:rgba(124,92,252,.11); color:#b9aaff; }
.user-menu-popover > button > span:last-child,
.user-menu-popover > a > span:last-child { display:flex; flex-direction:column; gap:2px; min-width:0; }
.user-menu-popover strong { font-size:11px; }
.user-menu-popover small { font-size:9.5px; color:var(--text-muted); }
.user-menu-popover .user-menu-danger { color:#fca5a5; border-top:1px solid var(--border); border-radius:0 0 9px 9px; margin-top:3px; padding-top:10px; }
.dashboard-premium.sidebar-is-collapsed .user-menu-popover { display:none !important; }

.help-modal-card { width:min(560px, calc(100vw - 28px)); }
.help-action-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; margin-top:8px; }
.help-action {
  min-height:76px; display:grid; grid-template-columns:38px minmax(0,1fr); gap:11px; align-items:center; padding:12px;
  border:1px solid var(--border); border-radius:11px; background:rgba(255,255,255,.018); color:var(--text); text-align:left; text-decoration:none; cursor:pointer;
}
.help-action:hover { background:rgba(124,92,252,.05); border-color:rgba(124,92,252,.2); }
.help-action > span:first-child { width:36px; height:36px; display:grid; place-items:center; border-radius:10px; background:rgba(124,92,252,.12); color:#b9aaff; }
.help-action > span:last-child { display:flex; flex-direction:column; gap:3px; }
.help-action strong { font-size:12px; }
.help-action small { color:var(--text-muted); font-size:10px; }

.announcement-modal-card { width:min(620px, calc(100vw - 28px)); }
.announcement-fields { display:flex; flex-direction:column; gap:12px; margin-top:8px; }
.announcement-fields .field { display:flex; flex-direction:column; gap:6px; }
.announcement-fields .field > span { font-size:11px; font-weight:650; color:var(--text); }
.announcement-fields .field > span small { color:var(--text-muted); font-weight:400; }
.announcement-message { min-height:150px; resize:vertical; line-height:1.5; }
.announcement-color-field { max-width:190px; }

.command-result.active { outline:1px solid rgba(124,92,252,.22); }
.command-result.active .command-result-icon { background:rgba(124,92,252,.2); color:#d8d0ff; }

@media (max-width: 760px) {
  .help-action-grid { grid-template-columns:1fr; }
  .user-menu-popover { left:12px; width:calc(min(86vw, var(--sidebar-width)) - 24px); }
}

/* ── v12 server activity analytics ─────────────────────────────── */
.chart-legend-triple { align-items:center; flex-wrap:wrap; row-gap:6px; }
.chart-legend-triple .legend-members { background:#8b5cf6; }
.chart-legend-triple .legend-users { background:#3b82f6; }
.chart-legend-triple .legend-tickets { background:#f59e0b; }
.chart-axis-hint { margin-left:auto; color:#536177; font-size:8.5px; white-space:nowrap; }

.activity-chart-multi .chart-line { stroke-width:2.4; }
.activity-chart-multi .chart-line-members { stroke:#8b5cf6; }
.activity-chart-multi .chart-line-users { stroke:#3b82f6; }
.activity-chart-multi .chart-line-tickets { stroke:#f59e0b; }
.activity-chart-multi .chart-dot { stroke-width:1.7; }
.activity-chart-multi .chart-dot-members { fill:#c4b5fd; stroke:#6d4ce4; }
.activity-chart-multi .chart-dot-users { fill:#93c5fd; stroke:#2563eb; }
.activity-chart-multi .chart-dot-tickets { fill:#fcd34d; stroke:#d97706; }
.activity-chart-multi .chart-hover-zone { fill:transparent; pointer-events:all; outline:none; }
.activity-chart-multi .chart-hover-zone:focus { fill:rgba(124,92,252,.035); }
.activity-chart-multi .chart-label-left { fill:#8f7ed1; }
.activity-chart-multi .chart-label-right { fill:#6f86a9; }

@media (max-width: 760px) {
  .chart-axis-hint { width:100%; margin-left:0; }
  .chart-legend-triple { gap:10px; }
}

/* ── v13 Tickets – 4A module design ───────────────────────────── */
.ticket-module-shell { display:flex; flex-direction:column; gap:14px; }
.ticket-module-warning { margin:0; }
.ticket-header-create { min-height:36px; padding-inline:14px; gap:7px; }

.ticket-kpi-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}
.ticket-kpi-card {
  min-height:118px;
  display:grid;
  grid-template-columns:46px minmax(0,1fr);
  gap:13px;
  align-items:center;
  padding:16px;
  background:linear-gradient(180deg,rgba(20,29,45,.98),rgba(16,24,39,.98));
  border:1px solid var(--border);
  border-top:2px solid rgba(124,92,252,.72);
  border-radius:12px;
  overflow:hidden;
}
.ticket-kpi-card:hover { border-color:rgba(124,92,252,.18); transform:translateY(-1px); }
.ticket-kpi-icon {
  width:44px; height:44px; display:grid; place-items:center;
  border-radius:11px; background:rgba(124,92,252,.11); color:#b8a9ff;
  font-size:13px; font-style:normal; font-weight:750;
}
.ticket-kpi-icon .nav-svg { width:21px; height:21px; stroke:currentColor; fill:none; stroke-width:1.8; }
.ticket-kpi-success { background:rgba(34,197,94,.1); color:#6ee7a0; font-size:18px; }
.ticket-kpi-time { background:rgba(59,130,246,.1); color:#93c5fd; font-size:21px; }
.ticket-kpi-copy { display:flex; flex-direction:column; min-width:0; gap:3px; }
.ticket-kpi-copy small { color:var(--text-muted); font-size:10.5px; font-weight:600; }
.ticket-kpi-copy strong { color:var(--text); font-size:24px; line-height:1.05; letter-spacing:-.025em; }
.ticket-kpi-copy em { color:var(--text-soft); font-size:9.5px; font-style:normal; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

.ticket-workspace-card,
.ticket-panels-card,
.ticket-insights-card { padding:0; overflow:hidden; }
.ticket-section-head {
  min-height:78px;
  display:flex; align-items:center; justify-content:space-between; gap:18px;
  padding:14px 16px;
  border-bottom:1px solid rgba(255,255,255,.045);
}
.ticket-section-head > div:first-child { min-width:0; }
.ticket-section-head h3 { margin:2px 0 3px; font-size:14px; }
.ticket-section-head p { margin:0; color:var(--text-muted); font-size:10px; }
.ticket-section-head-compact { min-height:70px; }
.ticket-eyebrow { display:block; color:#8f7ed1; font-size:8.5px; text-transform:uppercase; letter-spacing:.09em; font-weight:750; }

.ticket-filter-bar { display:inline-flex; gap:3px; margin:0; padding:3px; border:1px solid var(--border); border-radius:9px; background:#0d1421; }
.ticket-filter {
  min-height:30px; padding:0 11px; border:0; border-radius:7px; background:transparent;
  color:var(--text-muted); font:inherit; font-size:10px; font-weight:650; cursor:pointer;
}
.ticket-filter:hover { color:var(--text); background:rgba(255,255,255,.035); }
.ticket-filter.active { color:#ddd6fe; background:rgba(124,92,252,.14); box-shadow:inset 0 0 0 1px rgba(124,92,252,.12); }

.ticket-table-premium { min-height:220px; }
.ticket-table-v13 { font-size:10px; }
.ticket-table-v13 th,
.ticket-table-v13 td { padding:10px 12px; vertical-align:middle; border-bottom-color:rgba(255,255,255,.042); }
.ticket-table-v13 th { height:38px; color:#66748b; font-size:8.5px; letter-spacing:.06em; background:rgba(255,255,255,.012); }
.ticket-table-v13 tbody tr { transition:background .16s ease; }
.ticket-table-v13 tbody tr:hover { background:rgba(124,92,252,.027); }
.ticket-number { color:#c4b5fd; font-weight:750; font-variant-numeric:tabular-nums; }
.ticket-owner-cell { display:grid; grid-template-columns:32px minmax(100px,1fr); align-items:center; gap:9px; min-width:150px; }
.ticket-owner-cell > span { display:flex; flex-direction:column; min-width:0; gap:2px; }
.ticket-owner-cell strong { color:var(--text); font-size:10.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ticket-owner-cell small { color:var(--text-soft); font-size:8.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ticket-table-avatar { width:30px; height:30px; border-radius:50%; object-fit:cover; background:#202b3d; }
.ticket-table-avatar.dashboard-user-avatar-fallback { display:grid; place-items:center; color:#c8d2e1; font-weight:750; font-size:10px; }
.ticket-table-subject { display:block; max-width:220px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#c5cedc; }
.ticket-status { display:inline-flex; align-items:center; gap:5px; padding:4px 8px; }
.ticket-status i { width:5px; height:5px; border-radius:50%; background:currentColor; box-shadow:0 0 8px currentColor; }
.ticket-priority-badge { display:inline-flex; align-items:center; min-height:23px; padding:0 8px; border-radius:999px; font-size:8.5px; font-weight:700; background:rgba(148,163,184,.08); color:#94a3b8; }
.ticket-priority-badge-important { background:rgba(245,158,11,.11); color:#fbbf24; }
.ticket-priority-badge-urgent { background:rgba(239,68,68,.11); color:#fca5a5; }
.ticket-date-cell { color:var(--text-soft); white-space:nowrap; }
.ticket-row-action { min-height:28px; padding:0 9px; border:1px solid var(--border); border-radius:7px; background:rgba(255,255,255,.018); color:#b7c1d1; font:inherit; font-size:8.5px; cursor:pointer; }
.ticket-row-action:hover { color:#fff; border-color:rgba(124,92,252,.22); background:rgba(124,92,252,.06); }
.ticket-muted { color:#536177; }
.ticket-table-v13 .tag-pill { min-height:20px; padding:2px 6px; font-size:8px; background:rgba(124,92,252,.09); color:#b8a9ff; }

.ticket-loading-row { min-height:210px; display:flex; flex-direction:column; justify-content:center; gap:10px; padding:18px; }
.ticket-loading-row .skeleton { height:32px; border-radius:8px; }
.ticket-premium-empty { min-height:210px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; color:var(--text-muted); }
.ticket-premium-empty > span { width:34px; height:34px; display:grid; place-items:center; border-radius:10px; background:rgba(34,197,94,.08); color:#6ee7a0; font-weight:750; }
.ticket-premium-empty strong { color:var(--text); font-size:11.5px; }
.ticket-premium-empty small { color:var(--text-soft); font-size:9.5px; }
.ticket-error-empty > span { background:rgba(239,68,68,.1); color:#fca5a5; }

.ticket-pagination { min-height:50px; padding:9px 13px; border-top:1px solid rgba(255,255,255,.04); }
.ticket-pagination-info,.ticket-pagination-pages { color:var(--text-muted); font-size:9px; }

.ticket-module-lower-grid { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(280px,.75fr); gap:14px; align-items:start; }
.ticket-panel-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; padding:12px; }
.ticket-panel-card {
  position:relative; min-height:90px; display:grid; grid-template-columns:4px minmax(0,1fr) auto; gap:12px; align-items:center;
  padding:12px 13px 12px 10px; border:1px solid var(--border); border-radius:11px; background:rgba(255,255,255,.014);
  color:var(--text); text-align:left; cursor:pointer; overflow:hidden;
}
.ticket-panel-card:hover { border-color:rgba(124,92,252,.2); background:rgba(124,92,252,.035); transform:translateY(-1px); }
.ticket-panel-accent { width:3px; height:54px; border-radius:999px; background:var(--panel-accent,#7c5cfc); box-shadow:0 0 18px color-mix(in srgb,var(--panel-accent,#7c5cfc) 35%,transparent); }
.ticket-panel-main { display:flex; flex-direction:column; min-width:0; gap:4px; }
.ticket-panel-main > strong { font-size:11px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ticket-panel-main > small { color:var(--text-muted); font-size:9px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ticket-panel-meta { display:inline-flex; align-items:center; gap:5px; width:max-content; color:var(--text-soft); font-size:8.5px; }
.ticket-panel-meta .status-dot { width:6px; height:6px; }
.status-muted { background:#475569 !important; box-shadow:none !important; }
.ticket-panel-action { color:#7e8da5; font-size:9px; white-space:nowrap; }
.ticket-panel-empty-card { grid-template-columns:40px minmax(0,1fr); border-style:dashed; }
.ticket-panel-plus { width:38px; height:38px; display:grid; place-items:center; border-radius:10px; background:rgba(124,92,252,.1); color:#b8a9ff; font-size:19px; }

.ticket-insights-card { min-height:100%; }
.ticket-insight-block { padding:12px 14px 14px; }
.ticket-insight-block + .ticket-insight-block { border-top:1px solid rgba(255,255,255,.04); }
.ticket-insight-label { display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; }
.ticket-insight-label strong { font-size:10px; }
.ticket-insight-label span { color:var(--text-soft); font-size:8.5px; }
.ticket-insight-bars { display:flex; flex-direction:column; gap:8px; }
.ticket-insight-row { display:grid; grid-template-columns:minmax(80px,1fr) minmax(70px,1.5fr) 22px; align-items:center; gap:8px; }
.ticket-insight-row > span { color:var(--text-muted); font-size:9px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ticket-insight-row > div,.ticket-priority-row > div { height:6px; border-radius:999px; background:#1b2638; overflow:hidden; }
.ticket-insight-row i,.ticket-priority-row i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#6d4df4,#8b5cf6); }
.ticket-insight-row > strong,.ticket-priority-row > strong { color:#cad3df; font-size:9px; text-align:right; }
.ticket-priority-list { display:flex; flex-direction:column; gap:8px; }
.ticket-priority-row { display:grid; grid-template-columns:7px 58px minmax(60px,1fr) 22px; align-items:center; gap:7px; color:var(--text-muted); font-size:9px; }
.ticket-priority-dot { width:6px; height:6px; border-radius:50%; background:#64748b; }
.ticket-priority-important { background:#f59e0b; }
.ticket-priority-urgent { background:#ef4444; }
.ticket-priority-normal { background:#7c5cfc; }
.ticket-inline-empty { color:var(--text-soft); font-size:9px; padding:6px 0; }

/* Ticket panel editor */
.panel-editor-top { border-radius:12px !important; border:1px solid var(--border) !important; padding:14px 15px !important; margin-bottom:10px !important; background:linear-gradient(180deg,#141d2d,#111827) !important; }
.panel-top-row { grid-template-columns:minmax(200px,.9fr) minmax(270px,1.15fr) auto; gap:12px; }
.panel-publish-wrap { align-items:flex-end; }
.panel-channel-hint { max-width:270px; text-align:right; font-size:9px; }
.tab-bar { padding:5px; gap:3px; border:1px solid var(--border); border-radius:10px; background:#0e1624; margin-bottom:10px; }
.tab-btn { min-height:34px; padding:0 12px; border-radius:7px; color:#7e8da4; font-size:10px; }
.tab-btn.active { background:rgba(124,92,252,.14); color:#d8d0ff; box-shadow:inset 0 0 0 1px rgba(124,92,252,.1); }
#panel-tab-content { border:1px solid var(--border) !important; border-radius:12px !important; background:#111827; }
.panel-tab-card { padding:15px 16px; }
.setting-row { min-height:68px; padding:12px 2px; border-bottom-color:rgba(255,255,255,.045); }
.setting-row strong { font-size:10.5px; }
.setting-row .hint { font-size:9px; }
.setting-row-control { min-width:145px; }
.category-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.category-card { min-height:76px; border-radius:10px; background:rgba(255,255,255,.015); }
.category-card:hover { background:rgba(124,92,252,.04); border-color:rgba(124,92,252,.2); }

.ticket-panel-embed-layout { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(310px,.85fr); gap:16px; align-items:start; }
.ticket-panel-embed-form { min-width:0; }
.ticket-editor-section-head { display:flex; flex-direction:column; gap:3px; margin-bottom:13px; }
.ticket-editor-section-head > span { color:#8f7ed1; font-size:8.5px; font-weight:750; text-transform:uppercase; letter-spacing:.08em; }
.ticket-editor-section-head > strong { font-size:12px; }
.ticket-editor-section-head > small { color:var(--text-muted); font-size:9px; }
.ticket-color-field input[type="color"] { min-height:38px; padding:4px; }
.ticket-panel-live-preview { position:sticky; top:88px; padding:13px; border:1px solid rgba(255,255,255,.055); border-radius:11px; background:#0d1421; }
.ticket-discord-preview-shell { padding:13px; border:1px solid rgba(255,255,255,.05); border-radius:10px; background:#15171b; }
.ticket-discord-message-head { display:flex; gap:8px; align-items:center; margin-bottom:9px; }
.ticket-preview-bot-avatar { width:30px; height:30px; display:grid; place-items:center; border-radius:50%; background:linear-gradient(145deg,#7455ff,#8b6cff); color:white; font-size:11px; font-weight:800; }
.ticket-discord-message-head > span:last-child { display:flex; align-items:center; gap:5px; }
.ticket-discord-message-head strong { color:#f2f3f5; font-size:10px; }
.ticket-discord-message-head small { padding:1px 4px; border-radius:3px; background:#5865f2; color:#fff; font-size:6.5px; font-weight:750; }
.ticket-discord-embed { position:relative; padding:12px 12px 10px 15px; border-radius:4px; background:#2b2d31; overflow:hidden; }
.ticket-discord-embed::before { content:""; position:absolute; inset:0 auto 0 0; width:4px; background:var(--ticket-embed-color,#5865f2); }
.ticket-discord-embed strong { display:block; margin-bottom:6px; color:#f2f3f5; font-size:11px; }
.ticket-discord-embed p { margin:0; color:#dbdee1; font-size:9.5px; line-height:1.45; white-space:pre-wrap; }
.ticket-discord-embed img { display:block; width:100%; max-height:180px; object-fit:cover; margin-top:10px; border-radius:4px; }
.ticket-discord-button { margin-top:8px; min-height:30px; padding:0 11px; border:0; border-radius:4px; background:#5865f2; color:#fff; font:inherit; font-size:9px; font-weight:650; pointer-events:none; }

@media (max-width: 1180px) {
  .ticket-kpi-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ticket-module-lower-grid { grid-template-columns:1fr; }
  .ticket-panel-embed-layout { grid-template-columns:1fr; }
  .ticket-panel-live-preview { position:static; }
}
@media (max-width: 760px) {
  .ticket-kpi-grid { grid-template-columns:1fr; }
  .ticket-section-head { align-items:flex-start; flex-direction:column; }
  .ticket-filter-bar { width:100%; }
  .ticket-filter { flex:1; }
  .ticket-panel-grid,.category-grid { grid-template-columns:1fr; }
  .panel-top-row { grid-template-columns:1fr; }
  .panel-publish-wrap { align-items:stretch; }
  .panel-channel-hint { text-align:left; max-width:none; }
}
.panel-tab-svg { width:14px; height:14px; margin-right:6px; vertical-align:-2px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }


/* === 4A v14 · Ticket panel editor === */
.ticket-panel-editor-shell { display:flex; flex-direction:column; gap:12px; width:100%; }
.ticket-editor-identity,
.ticket-editor-content,
.ticket-editor-section {
  border:1px solid rgba(255,255,255,.055);
  background:linear-gradient(180deg,rgba(21,29,44,.98),rgba(17,24,39,.98));
  box-shadow:0 12px 34px rgba(0,0,0,.09);
}
.ticket-editor-identity { position:relative; overflow:hidden; border-radius:13px; padding:18px 19px; }
.ticket-editor-identity::before { content:""; position:absolute; inset:0 0 auto 0; height:2px; background:linear-gradient(90deg,#7c5cfc,rgba(124,92,252,.18),transparent 72%); }
.ticket-editor-identity-head { display:flex; align-items:flex-start; justify-content:space-between; gap:22px; margin-bottom:18px; }
.ticket-editor-title-block { min-width:0; }
.ticket-editor-eyebrow,
.ticket-editor-page-head span { display:block; margin-bottom:5px; color:#9a87ef; font-size:9px; font-weight:750; letter-spacing:.085em; text-transform:uppercase; }
.ticket-editor-title-line { display:flex; align-items:center; flex-wrap:wrap; gap:10px; }
.ticket-editor-title-line h2 { margin:0; color:var(--text); font-size:18px; line-height:1.2; letter-spacing:-.025em; }
.ticket-editor-title-block > p { max-width:680px; margin:7px 0 0; color:var(--text-muted); font-size:10px; line-height:1.55; }
.ticket-editor-status { display:inline-flex; align-items:center; gap:6px; min-height:24px; padding:0 9px; border:1px solid rgba(255,255,255,.055); border-radius:999px; background:rgba(255,255,255,.025); color:#8f9db1; font-size:8.5px; font-weight:650; white-space:nowrap; }
.ticket-editor-status.is-published { color:#8de2ad; border-color:rgba(34,197,94,.13); background:rgba(34,197,94,.055); }
.ticket-editor-hero-actions { flex:0 0 auto; }
.ticket-editor-hero-actions .btn { min-height:36px; padding-inline:13px; gap:7px; }
.ticket-editor-hero-actions svg { width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.ticket-editor-identity-grid { display:grid; grid-template-columns:minmax(220px,.9fr) minmax(280px,1.15fr) minmax(230px,.75fr); gap:12px; align-items:stretch; }
.ticket-editor-identity-grid > .field,
.ticket-editor-channel-field,
.ticket-editor-sync-card { min-width:0; padding:12px; border:1px solid rgba(255,255,255,.05); border-radius:10px; background:rgba(8,13,22,.28); }
.ticket-editor-name-field { position:relative; }
.ticket-editor-char-count { position:absolute; right:18px; top:14px; }
.ticket-editor-channel-field > .field { margin:0; }
.ticket-editor-channel-field > .hint { margin-top:7px; }
.ticket-editor-sync-card { display:flex; align-items:center; gap:10px; }
.ticket-editor-sync-icon { flex:0 0 34px; width:34px; height:34px; display:grid; place-items:center; border-radius:9px; background:rgba(124,92,252,.1); color:#ad9dff; }
.ticket-editor-sync-icon svg { width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.ticket-editor-sync-card div { display:flex; flex-direction:column; gap:3px; }
.ticket-editor-sync-card strong { color:#dce4ef; font-size:10px; }
.ticket-editor-sync-card small { color:var(--text-muted); font-size:8.5px; line-height:1.45; }

/* Replace the old generic tab strip inside the panel editor only. */
.ticket-editor-tabs { display:flex; align-items:center; gap:4px; padding:5px; border:1px solid rgba(255,255,255,.055); border-radius:11px; background:#0d1522; overflow:auto; scrollbar-width:none; }
.ticket-editor-tabs::-webkit-scrollbar { display:none; }
.ticket-editor-tab { min-height:38px; display:inline-flex; align-items:center; justify-content:center; gap:7px; padding:0 13px; border:0; border-radius:8px; background:transparent; color:#7f8da3; font:inherit; font-size:10px; font-weight:650; cursor:pointer; white-space:nowrap; transition:background .16s ease,color .16s ease,box-shadow .16s ease; }
.ticket-editor-tab:hover { color:#c8d1df; background:rgba(255,255,255,.025); }
.ticket-editor-tab.active { color:#ddd6ff; background:rgba(124,92,252,.13); box-shadow:inset 0 0 0 1px rgba(124,92,252,.13); }
.ticket-editor-tab .panel-tab-svg { width:15px; height:15px; margin:0; }

.ticket-editor-content { border-radius:13px; padding:17px 18px; min-width:0; }
.ticket-editor-page-head { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; padding-bottom:14px; margin-bottom:14px; border-bottom:1px solid rgba(255,255,255,.045); }
.ticket-editor-page-head h3 { margin:0; color:#eef2f7; font-size:15px; letter-spacing:-.018em; }
.ticket-editor-page-head p { max-width:660px; margin:5px 0 0; color:var(--text-muted); font-size:9.5px; line-height:1.5; }
.ticket-editor-page-head > .btn { flex:0 0 auto; }
.ticket-editor-settings-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.ticket-editor-section { min-width:0; border-radius:11px; padding:14px; background:rgba(11,17,28,.42); box-shadow:none; }
.ticket-editor-section-wide { grid-column:1 / -1; }
.ticket-editor-section-title { display:flex; align-items:center; gap:9px; padding-bottom:11px; margin-bottom:3px; border-bottom:1px solid rgba(255,255,255,.04); }
.ticket-editor-section-icon { flex:0 0 32px; width:32px; height:32px; display:grid; place-items:center; border-radius:9px; background:rgba(124,92,252,.09); color:#aa9aff; }
.ticket-editor-section-icon svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.65; stroke-linecap:round; stroke-linejoin:round; }
.ticket-editor-section-title > div { display:flex; flex-direction:column; gap:2px; }
.ticket-editor-section-title strong { color:#dce4ef; font-size:10.5px; }
.ticket-editor-section-title small { color:var(--text-muted); font-size:8.5px; }
.premium-setting-list { display:flex; flex-direction:column; }
.premium-setting-row { min-height:64px; display:flex; align-items:center; justify-content:space-between; gap:14px; padding:11px 2px; border-bottom:1px solid rgba(255,255,255,.038); }
.premium-setting-row:last-child { border-bottom:0; }
.premium-setting-row > div:first-child { min-width:0; }
.premium-setting-row strong { display:block; color:#d5deea; font-size:10px; font-weight:650; }
.premium-setting-row p { max-width:440px; margin:3px 0 0; color:#75839a; font-size:8.7px; line-height:1.45; }
.premium-setting-row-control > .input,
.premium-setting-row-control > .select { flex:0 0 128px; max-width:128px; }
.ticket-editor-number-wrap { display:flex; align-items:center; gap:6px; flex:0 0 auto; }
.ticket-editor-number-wrap .input { width:84px; }
.ticket-editor-number-wrap span { color:#718097; font-size:8.5px; }
.ticket-editor-format-row { padding-top:12px; }
.ticket-editor-format-row > .input { margin-bottom:10px; }
.ticket-editor-format-row .var-pills { gap:6px; }
.ticket-editor-format-row .var-pill { min-height:26px; padding:0 8px; border:1px solid rgba(124,92,252,.12); border-radius:7px; background:rgba(124,92,252,.055); color:#a99df0; font-size:8px; }
.ticket-editor-format-row .var-pill:hover { background:rgba(124,92,252,.1); color:#d2caff; }
.premium-tag-pills { padding-top:12px; gap:7px; }
.premium-tag-editor { margin-top:10px; max-width:620px; }
.premium-tag-editor .input { min-width:220px; }

.ticket-editor-routing-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.ticket-editor-routing-grid .ticket-editor-section { display:flex; flex-direction:column; gap:12px; }
.ticket-editor-routing-grid .field { margin:0; }
.ticket-editor-field-note { margin:auto 0 0; padding-top:9px; border-top:1px solid rgba(255,255,255,.04); color:#748196; font-size:8.5px; line-height:1.45; }

/* Categories follow the same 4A module language instead of the old settings page. */
.ticket-editor-category-head { margin-bottom:12px; }
.ticket-editor-content .category-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.ticket-editor-content .category-card { position:relative; min-height:92px; display:flex; align-items:center; justify-content:space-between; padding:14px; border:1px solid rgba(255,255,255,.05); border-radius:10px; background:rgba(10,16,27,.42); color:inherit; text-align:left; }
.ticket-editor-content .category-card::before { content:""; position:absolute; inset:0 auto 0 0; width:2px; border-radius:10px 0 0 10px; background:#7c5cfc; opacity:.55; }
.ticket-editor-content .category-card:hover { border-color:rgba(124,92,252,.18); background:rgba(124,92,252,.035); transform:translateY(-1px); }
.ticket-editor-content .category-card-name { color:#dbe4ef; font-size:10.5px; font-weight:650; }
.ticket-editor-content .category-card-icon { width:30px; height:30px; display:grid; place-items:center; border-radius:8px; background:rgba(255,255,255,.03); font-size:12px; opacity:.8; }
.ticket-editor-content .category-card-new { border-style:dashed; }
.ticket-editor-content .category-card-plus { width:30px; height:30px; display:grid; place-items:center; border-radius:8px; background:rgba(124,92,252,.1); color:#b8a9ff; font-size:17px; }
.premium-category-editor-header { margin-bottom:12px; padding-bottom:12px; border-bottom:1px solid rgba(255,255,255,.045); }
.premium-category-active { display:flex; align-items:center; gap:12px; padding:7px 9px 7px 11px; border:1px solid rgba(255,255,255,.05); border-radius:9px; background:rgba(255,255,255,.018); }
.premium-category-active > div { display:flex; flex-direction:column; gap:2px; }
.premium-category-active strong { color:#dbe4ef; font-size:9.5px; }
.premium-category-active small { color:#748198; font-size:8px; }
.premium-category-section { margin-bottom:11px; }
.premium-category-section .form-grid { padding-top:12px; }
.premium-setting-row-standalone { padding:2px 0; border:0; }
.premium-form-fields-editor { margin-top:12px; }
.premium-category-form-actions { justify-content:space-between; align-items:center; padding-top:12px; }
.premium-category-footer { justify-content:space-between; margin-top:12px; padding-top:14px; border-top:1px solid rgba(255,255,255,.045); }

/* Embed tab: blend it into the same card language. */
.ticket-panel-embed-layout { gap:13px; }
.ticket-panel-embed-form { padding:14px; border:1px solid rgba(255,255,255,.05); border-radius:11px; background:rgba(10,16,27,.38); }
.ticket-panel-live-preview { top:82px; border-color:rgba(255,255,255,.05); border-radius:11px; background:rgba(10,16,27,.55); }
.ticket-editor-section-head > strong { color:#dce4ef; font-size:11px; }
.ticket-editor-section-head > small { line-height:1.45; }

@media (max-width: 1250px) {
  .ticket-editor-identity-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ticket-editor-sync-card { grid-column:1 / -1; }
  .ticket-editor-routing-grid { grid-template-columns:1fr; }
  .ticket-editor-content .category-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 920px) {
  .ticket-editor-settings-grid { grid-template-columns:1fr; }
  .ticket-editor-section-wide { grid-column:auto; }
  .ticket-editor-identity-head,.ticket-editor-page-head { flex-direction:column; }
  .ticket-editor-hero-actions,.ticket-editor-page-head > .btn { width:100%; }
  .ticket-editor-hero-actions .btn,.ticket-editor-page-head > .btn { width:100%; justify-content:center; }
}
@media (max-width: 720px) {
  .ticket-editor-identity { padding:15px; }
  .ticket-editor-identity-grid { grid-template-columns:1fr; }
  .ticket-editor-sync-card { grid-column:auto; }
  .ticket-editor-content { padding:14px; }
  .ticket-editor-content .category-grid { grid-template-columns:1fr; }
  .premium-setting-row { align-items:flex-start; }
  .premium-setting-row-control { flex-direction:column; }
}

/* === DidiBot 4A v15 · Ticket editor final polish === */
.ticket-editor-page-head-clean { margin-bottom:16px; }
.ticket-editor-settings-grid-v15 { align-items:start; }
.ticket-setting-card { border:1px solid rgba(255,255,255,.055); background:linear-gradient(180deg,rgba(18,27,42,.72),rgba(11,17,28,.6)); }
.ticket-setting-card .ticket-editor-section-title { margin-bottom:10px; }
.premium-setting-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.premium-setting-grid .premium-setting-tile { min-height:88px; padding:11px 12px; border:1px solid rgba(255,255,255,.045); border-radius:9px; background:rgba(7,12,21,.34); }
.premium-setting-grid .premium-setting-tile:last-child { border-bottom:1px solid rgba(255,255,255,.045); }
.premium-setting-grid .premium-setting-tile:hover { border-color:rgba(124,92,252,.13); background:rgba(124,92,252,.028); }
.ticket-format-card,.ticket-tags-card { padding-bottom:16px; }
.ticket-format-preview { display:flex; align-items:center; justify-content:space-between; gap:14px; margin:0 0 10px; padding:10px 12px; border:1px solid rgba(124,92,252,.11); border-radius:9px; background:rgba(124,92,252,.045); }
.ticket-format-preview span { color:#7f8ca1; font-size:8px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; }
.ticket-format-preview strong { color:#cfc7ff; font-size:10px; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; word-break:break-all; }
.ticket-tag-workspace { display:grid; grid-template-columns:minmax(0,1fr) minmax(260px,.42fr); gap:12px; align-items:start; padding-top:12px; }
.ticket-tag-workspace .premium-tag-pills { min-height:42px; align-content:flex-start; }
.ticket-tag-workspace .premium-tag-editor { margin:0; }

.ticket-sticky-savebar { position:sticky; bottom:12px; z-index:12; display:flex; align-items:center; gap:14px; margin-top:14px; padding:10px 12px; border:1px solid rgba(124,92,252,.12); border-radius:11px; background:rgba(13,21,34,.94); box-shadow:0 10px 32px rgba(0,0,0,.28); backdrop-filter:blur(12px); }
.ticket-sticky-savebar > div:first-child:not(.ticket-savebar-copy) { display:flex; flex-direction:column; gap:2px; min-width:0; margin-right:auto; }
.ticket-sticky-savebar strong { color:#dfe6f0; font-size:10px; }
.ticket-sticky-savebar span { color:#76849a; font-size:8.5px; }
.ticket-sticky-savebar .btn-primary { margin-left:auto; }

.ticket-routing-v15 { align-items:stretch; }
.ticket-routing-card { min-height:250px; display:flex; flex-direction:column; gap:12px; padding:15px; border:1px solid rgba(255,255,255,.055); background:linear-gradient(180deg,rgba(18,27,42,.76),rgba(10,16,27,.55)); }
.ticket-routing-card-head { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.ticket-routing-card > div:nth-child(2) strong { color:#dfe6f0; font-size:11px; }
.ticket-routing-card > div:nth-child(2) p { margin:4px 0 0; color:#748198; font-size:8.7px; line-height:1.5; }
.ticket-routing-state { padding:4px 7px; border-radius:999px; background:rgba(34,197,94,.07); color:#72d99a; font-size:7.5px; font-weight:750; text-transform:uppercase; letter-spacing:.06em; }
.ticket-routing-current { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 11px; border:1px solid rgba(255,255,255,.045); border-radius:8px; background:rgba(6,11,19,.34); }
.ticket-routing-current span { color:#6f7e94; font-size:8px; text-transform:uppercase; letter-spacing:.07em; }
.ticket-routing-current strong { color:#cbd5e1; font-size:9px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ticket-routing-card .picker-field { margin-top:auto; }
.ticket-routing-card .picker-field .picker-search { display:none; }

.ticket-editor-content .category-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.ticket-editor-content .category-card-v15 { min-height:164px; display:flex; flex-direction:column; align-items:stretch; justify-content:space-between; gap:12px; padding:14px; overflow:hidden; }
.ticket-editor-content .category-card-v15::before { width:3px; opacity:.75; }
.category-card-v15-top { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:10px; width:100%; }
.category-card-avatar { width:36px; height:36px; display:grid; place-items:center; flex:0 0 auto; border-radius:10px; background:rgba(124,92,252,.1); border:1px solid rgba(124,92,252,.12); font-size:16px; }
.category-card-v15-title { display:flex; flex-direction:column; min-width:0; gap:2px; }
.category-card-v15-title strong { color:#e1e7f0; font-size:11px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.category-card-v15-title small { color:#74839a; font-size:8.3px; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; }
.category-state { padding:4px 7px; border-radius:999px; font-size:7.5px; font-weight:750; text-transform:uppercase; letter-spacing:.05em; }
.category-state.is-active { background:rgba(34,197,94,.07); color:#6ed493; }
.category-state.is-inactive { background:rgba(100,116,139,.09); color:#8794a7; }
.category-card-v15-meta { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; width:100%; }
.category-card-v15-meta > span { min-width:0; padding:8px 9px; border:1px solid rgba(255,255,255,.04); border-radius:8px; background:rgba(6,11,19,.28); }
.category-card-v15-meta small,.category-card-v15-meta strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.category-card-v15-meta small { color:#67768d; font-size:7.3px; text-transform:uppercase; letter-spacing:.06em; }
.category-card-v15-meta strong { margin-top:3px; color:#bac5d4; font-size:8.5px; }
.category-card-v15-footer { display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; padding-top:10px; border-top:1px solid rgba(255,255,255,.04); color:#76849a; font-size:8.5px; }
.category-card-v15-footer strong { color:#aa9bff; font-size:8.5px; }
.category-card-create-v15 { min-height:164px!important; justify-content:center!important; align-items:center!important; text-align:center!important; border-style:dashed!important; }
.category-card-create-v15 .category-card-plus { margin:auto auto 4px; }
.category-card-create-v15 > span:last-child { display:flex; flex-direction:column; gap:4px; }
.category-card-create-v15 strong { color:#d8e0eb; font-size:10.5px; }
.category-card-create-v15 small { color:#748198; font-size:8.5px; }

.category-editor-hero-v15 { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:13px 14px; border:1px solid rgba(255,255,255,.05); border-radius:11px; background:linear-gradient(135deg,rgba(124,92,252,.065),rgba(14,22,35,.72) 48%); }
.category-editor-hero-main { display:flex; align-items:center; gap:10px; min-width:0; }
.category-editor-avatar { width:42px; height:42px; font-size:19px; }
.category-editor-hero-main h3 { margin:0; color:#eef2f7; font-size:15px; }
.category-editor-hero-main p { max-width:470px; margin:3px 0 0; color:#748198; font-size:8.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.category-editor-hero-stats { display:flex; align-items:stretch; gap:7px; flex:0 0 auto; }
.category-editor-hero-stats > span,.category-active-control { min-width:94px; display:flex; flex-direction:column; justify-content:center; gap:3px; padding:8px 9px; border:1px solid rgba(255,255,255,.045); border-radius:8px; background:rgba(6,11,19,.27); }
.category-editor-hero-stats small { color:#68778e; font-size:7px; text-transform:uppercase; letter-spacing:.06em; }
.category-editor-hero-stats strong { max-width:120px; color:#cbd5e1; font-size:8.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.category-active-control { flex-direction:row; align-items:center; justify-content:space-between; color:#8fe0aa; font-size:8.5px; }
.category-editor-grid-v15 { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:12px; }
.category-editor-grid-v15 > .ticket-editor-section-wide { grid-column:1 / -1; }
.category-config-card { border:1px solid rgba(255,255,255,.05); background:linear-gradient(180deg,rgba(18,27,42,.66),rgba(10,16,27,.45)); }
.category-identity-grid { padding-top:4px; }
.category-routing-stack { display:flex; flex-direction:column; gap:10px; }
.category-routing-stack .picker-field { margin:0; }
.category-routing-stack .picker-search { min-height:32px; }
.category-compact-settings { display:grid; grid-template-columns:minmax(140px,.35fr) minmax(220px,1fr); gap:10px; align-items:stretch; }
.category-on-behalf-card { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 11px; border:1px solid rgba(255,255,255,.045); border-radius:9px; background:rgba(6,11,19,.28); }
.category-on-behalf-card strong { color:#cbd5e1; font-size:9px; }
.category-on-behalf-card p { margin:3px 0 0; color:#748198; font-size:8px; }
.category-form-builder-head { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:12px; }
.category-form-builder-head .ticket-editor-section-title { flex:1; margin:0; padding:0; border:0; }
.category-form-actions-v15 { display:flex; align-items:center; gap:8px; }
.category-form-actions-v15 .form-template-row { display:flex; align-items:center; gap:6px; }
.category-form-actions-v15 .select { min-width:160px; }

.premium-form-fields-editor { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.form-field-card-v15 { margin:0!important; padding:0!important; overflow:hidden; border:1px solid rgba(255,255,255,.055)!important; border-radius:10px!important; background:rgba(7,12,21,.3)!important; }
.form-field-card-head { display:grid; grid-template-columns:auto minmax(0,1fr) auto auto; align-items:center; gap:9px; padding:10px 11px; border-bottom:1px solid rgba(255,255,255,.045); background:rgba(255,255,255,.015); }
.form-field-order { width:26px; height:26px; display:grid; place-items:center; border-radius:8px; background:rgba(124,92,252,.11); color:#b7aaff; font-size:9px; font-weight:800; }
.form-field-card-head > div { display:flex; flex-direction:column; gap:2px; min-width:0; }
.form-field-card-head strong { color:#dbe3ee; font-size:9.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.form-field-card-head div span { color:#718096; font-size:7.7px; }
.form-field-type-pill { padding:4px 7px; border-radius:999px; background:rgba(59,130,246,.07); color:#79a9f7; font-size:7.5px; font-weight:700; }
.form-field-card-head .btn-danger { min-height:26px; padding-inline:8px; }
.form-field-controls-v15 { display:grid; grid-template-columns:1fr 1fr .7fr; gap:9px; padding:11px; align-items:end; }
.form-field-controls-v15 .field { margin:0; }
.form-field-placeholder-v15 { grid-column:1 / span 2; }
.form-field-required-v15 { display:flex; align-items:center; justify-content:space-between; gap:10px; min-height:54px; padding:9px 10px; border:1px solid rgba(255,255,255,.04); border-radius:8px; background:rgba(255,255,255,.012); }
.form-field-required-v15 > div { display:flex; flex-direction:column; gap:2px; }
.form-field-required-v15 strong { color:#cbd5e1; font-size:8.5px; }
.form-field-required-v15 span { color:#6f7e94; font-size:7.4px; }
.category-form-empty-v15 { grid-column:1 / -1; min-height:150px; }
.category-savebar-v15 .btn-danger { margin-right:4px; }
.ticket-savebar-copy { display:flex; flex-direction:column; gap:2px; min-width:0; margin-right:auto; }

@media (max-width:1280px) {
  .premium-setting-grid,.premium-form-fields-editor { grid-template-columns:1fr; }
  .ticket-tag-workspace { grid-template-columns:1fr; }
  .category-editor-hero-v15 { align-items:flex-start; flex-direction:column; }
  .category-editor-hero-stats { width:100%; flex-wrap:wrap; }
  .category-editor-grid-v15 { grid-template-columns:1fr; }
  .category-editor-grid-v15 > .ticket-editor-section-wide { grid-column:auto; }
}
@media (max-width:900px) {
  .ticket-editor-content .category-grid { grid-template-columns:1fr; }
  .ticket-sticky-savebar { bottom:8px; flex-wrap:wrap; }
  .ticket-sticky-savebar .btn-primary { width:100%; margin-left:0; justify-content:center; }
  .category-savebar-v15 .btn-danger { order:3; width:100%; }
  .category-form-builder-head { align-items:flex-start; flex-direction:column; }
  .category-form-actions-v15 { width:100%; align-items:stretch; flex-direction:column; }
  .category-form-actions-v15 .form-template-row { width:100%; }
  .category-form-actions-v15 .select { flex:1; min-width:0; }
  .form-field-card-head { grid-template-columns:auto minmax(0,1fr) auto; }
  .form-field-type-pill { display:none; }
  .form-field-controls-v15 { grid-template-columns:1fr; }
  .form-field-placeholder-v15 { grid-column:auto; }
  .category-compact-settings { grid-template-columns:1fr; }
}

/* === DidiBot 4A v16 · Ticket channel-name field width fix === */
.ticket-format-card .ticket-editor-format-row > #channel-name-format {
  display: block;
  width: 100%;
  max-width: none;
  min-width: 0;
  box-sizing: border-box;
}

/* === DidiBot 4A v17 · Tickets final UX pass === */
.ticket-table-v13 .ticket-action-col {
  width: 96px;
  text-align: right;
}
.ticket-table-v13 td:last-child {
  text-align: right;
}

/* Keep the last form cards comfortably above the sticky save bar. */
.category-editor-grid-v15 {
  padding-bottom: 96px;
  scroll-padding-bottom: 120px;
}
.form-field-card-v15 {
  scroll-margin-bottom: 128px;
}

.form-field-card-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 5px;
}
.form-field-move {
  width: 27px;
  height: 27px;
  display: inline-grid;
  place-items: center;
  padding: 0;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 7px;
  background: rgba(255,255,255,.018);
  color: #9aa8bd;
  font: inherit;
  font-size: 12px;
  line-height: 1;
  cursor: pointer;
  transition: background .16s ease,border-color .16s ease,color .16s ease,transform .16s ease;
}
.form-field-move:hover:not(:disabled) {
  border-color: rgba(124,92,252,.24);
  background: rgba(124,92,252,.085);
  color: #d6ceff;
  transform: translateY(-1px);
}
.form-field-move:disabled {
  opacity: .28;
  cursor: default;
}
.cat-form-key[readonly] {
  border-color: rgba(124,92,252,.09);
  background: rgba(124,92,252,.025);
  color: #8390a5;
  cursor: not-allowed;
}
.key-lock-hint {
  color: #8174bb;
}

/* The builder becomes one column before its controls get cramped. */
@media (max-width: 1420px) {
  .premium-form-fields-editor { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
  .category-editor-grid-v15 { padding-bottom: 132px; }
  .form-field-card-head { grid-template-columns: auto minmax(0,1fr); }
  .form-field-card-head > .form-field-type-pill { display: none; }
  .form-field-card-actions { grid-column: 1 / -1; justify-content: flex-end; }
  .form-field-card-actions .cat-form-remove { margin-left: auto; }
}


/* === DidiBot 4A v18 · Welcome editor === */
.welcome-editor-v18 {
  display: grid;
  gap: 12px;
  padding-bottom: 94px;
}
.welcome-editor-v18 .card {
  border-color: rgba(255,255,255,.055);
  box-shadow: none;
}
.welcome-hero-card {
  display: grid;
  grid-template-columns: minmax(0,1.25fr) minmax(320px,.75fr);
  gap: 14px;
  padding: 16px;
  border-top: 2px solid rgba(124,92,252,.78);
}
.welcome-hero-copy,
.welcome-channel-card {
  min-width: 0;
  padding: 14px;
  border: 1px solid rgba(255,255,255,.045);
  border-radius: 11px;
  background: rgba(8,13,22,.28);
}
.welcome-eyebrow {
  display: block;
  margin-bottom: 6px;
  color: #9f90f3;
  font-size: 9px;
  font-weight: 760;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.welcome-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}
.welcome-title-row h2 {
  margin: 0;
  color: #eef2f7;
  font-size: 18px;
  line-height: 1.25;
  letter-spacing: -.025em;
}
.welcome-title-row p {
  max-width: 650px;
  margin: 6px 0 0;
  color: var(--text-muted);
  font-size: 9.5px;
  line-height: 1.5;
}
.welcome-status-toggle {
  flex: 0 0 auto;
  min-width: 220px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  padding: 11px 12px;
  border: 1px solid rgba(255,255,255,.05);
  border-radius: 9px;
  background: rgba(255,255,255,.018);
}
.welcome-status-toggle > span:first-child {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.welcome-status-toggle strong { color: #dce4ef; font-size: 10px; }
.welcome-status-toggle small { color: var(--text-muted); font-size: 8px; line-height: 1.4; }
.welcome-section-heading {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
}
.welcome-section-heading-bordered {
  padding-bottom: 12px;
  margin-bottom: 13px;
  border-bottom: 1px solid rgba(255,255,255,.045);
}
.welcome-section-icon {
  flex: 0 0 32px;
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  background: rgba(124,92,252,.09);
  color: #aa9aff;
  font-size: 13px;
  font-weight: 700;
}
.welcome-section-heading > div {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.welcome-section-heading strong { color: #dce4ef; font-size: 10.5px; }
.welcome-section-heading small { color: var(--text-muted); font-size: 8.4px; line-height: 1.45; }
.welcome-channel-card .picker-field { margin: 12px 0 0; }
.welcome-channel-card .picker-search { margin-bottom: 6px; }
.welcome-inline-status {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 8px 0 0;
  color: #78869a;
  font-size: 8.4px;
}
.welcome-inline-status .status-dot { width: 6px; height: 6px; }
.welcome-inline-status .status-dot.is-warning { background: #f59e0b; box-shadow: 0 0 0 3px rgba(245,158,11,.08); }

.welcome-editor-grid {
  display: grid;
  grid-template-columns: minmax(0,1.45fr) minmax(330px,.72fr);
  gap: 12px;
  align-items: start;
}
.welcome-editor-main { display: grid; gap: 12px; min-width: 0; }
.welcome-editor-card { min-width: 0; padding: 16px; }
.welcome-message-fields {
  display: grid;
  grid-template-columns: 1fr;
  gap: 11px;
}
.welcome-message-fields .field { margin: 0; }
.welcome-description-input {
  min-height: 158px;
  resize: vertical;
  line-height: 1.55;
}
.welcome-char-count {
  display: block;
  margin-top: 5px;
  color: #66758a;
  font-size: 8px;
  text-align: right;
}
.welcome-variable-panel {
  display: grid;
  grid-template-columns: minmax(170px,.28fr) minmax(0,1fr);
  gap: 12px;
  align-items: start;
  margin-top: 14px;
  padding-top: 13px;
  border-top: 1px solid rgba(255,255,255,.04);
}
.welcome-variable-panel > div:first-child { display: flex; flex-direction: column; gap: 3px; }
.welcome-variable-panel strong { color: #dce4ef; font-size: 10px; }
.welcome-variable-panel small { color: var(--text-muted); font-size: 8.2px; line-height: 1.45; }
.welcome-variable-pills { display: flex; flex-wrap: wrap; gap: 6px; }
.welcome-variable-pill {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0 9px;
  border: 1px solid rgba(124,92,252,.13);
  border-radius: 8px;
  background: rgba(124,92,252,.045);
  color: #a99df0;
  font: inherit;
  cursor: pointer;
  transition: background .16s ease,border-color .16s ease,transform .16s ease,color .16s ease;
}
.welcome-variable-pill:hover {
  border-color: rgba(124,92,252,.25);
  background: rgba(124,92,252,.09);
  color: #d6ceff;
  transform: translateY(-1px);
}
.welcome-variable-pill code { color: inherit; font-size: 8px; }
.welcome-variable-pill span { color: #7e8ca2; font-size: 7.5px; }

.welcome-image-card .image-upload-field { margin: 0; }
.welcome-image-card .image-upload-field > .field-label { display: none; }
.welcome-image-card .image-upload-box {
  display: grid;
  grid-template-columns: minmax(220px,.42fr) minmax(0,1fr);
  gap: 12px;
  align-items: center;
}
.welcome-image-card .image-upload-preview-wrap {
  min-height: 130px;
  max-height: 210px;
  border-radius: 10px;
  overflow: hidden;
  background: rgba(4,8,15,.45);
}
.welcome-image-card .image-upload-preview { width: 100%; height: 100%; max-height: 210px; object-fit: cover; }
.welcome-image-card .image-upload-controls { align-self: end; }
.welcome-image-card .image-upload-url { grid-column: 2; min-width: 0; }
.welcome-image-card .hint { grid-column: 2; margin-top: -3px; }

.welcome-preview-column {
  display: grid;
  gap: 12px;
  min-width: 0;
  position: sticky;
  top: 62px;
}
.welcome-preview-card,
.welcome-help-card { padding: 15px; }
#welcome-live-preview { min-height: 310px; }
.welcome-preview-message {
  padding: 13px;
  border: 1px solid rgba(255,255,255,.055);
  border-radius: 11px;
  background: #0a101a;
  transition: opacity .16s ease,filter .16s ease;
}
.welcome-preview-message.is-disabled { opacity: .55; filter: saturate(.7); }
.welcome-preview-author {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 10px;
  color: #e8edf5;
  font-size: 9px;
}
.welcome-preview-bot {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: linear-gradient(145deg,#7c5cfc,#5c48d8);
  color: #fff;
  font-size: 10px;
  font-weight: 800;
}
.welcome-preview-author strong { font-size: 9.5px; }
.welcome-preview-app {
  padding: 2px 4px;
  border-radius: 4px;
  background: #5865f2;
  color: #fff;
  font-size: 6.7px;
  font-weight: 750;
}
.welcome-preview-author small { color: #68758a; font-size: 7px; }
.welcome-preview-embed {
  position: relative;
  overflow: hidden;
  padding: 12px 12px 11px 15px;
  border-radius: 4px;
  background: #111820;
}
.welcome-preview-embed::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: var(--welcome-embed-color,#5865f2);
}
.welcome-preview-title { display: block; color: #f1f4f8; font-size: 11px; line-height: 1.35; }
.welcome-preview-description { margin-top: 7px; color: #c2cad6; font-size: 8.7px; line-height: 1.55; overflow-wrap: anywhere; }
.welcome-preview-image {
  display: block;
  width: 100%;
  max-height: 240px;
  margin-top: 11px;
  object-fit: cover;
  border-radius: 5px;
  background: #080d15;
}
.welcome-preview-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: 9px;
  color: #66758a;
  font-size: 7.5px;
}
.welcome-help-card { background: rgba(124,92,252,.02); }

.welcome-savebar {
  position: sticky;
  bottom: 10px;
  z-index: 14;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 10px 12px;
  border: 1px solid rgba(255,255,255,.065);
  border-radius: 11px;
  background: rgba(13,21,34,.96);
  box-shadow: 0 12px 35px rgba(0,0,0,.25);
  backdrop-filter: blur(14px);
}
.welcome-savebar > div { display: flex; flex-direction: column; gap: 2px; }
.welcome-savebar strong { color: #dce4ef; font-size: 9.5px; }
.welcome-savebar small { color: var(--text-muted); font-size: 7.8px; }
.welcome-savebar .btn { min-width: 150px; }

@media (max-width: 1380px) {
  .welcome-editor-grid { grid-template-columns: minmax(0,1.25fr) minmax(300px,.75fr); }
  .welcome-variable-panel { grid-template-columns: 1fr; }
  .welcome-image-card .image-upload-box { grid-template-columns: 1fr; }
  .welcome-image-card .image-upload-url,
  .welcome-image-card .hint { grid-column: 1; }
}
@media (max-width: 1100px) {
  .welcome-hero-card,
  .welcome-editor-grid { grid-template-columns: 1fr; }
  .welcome-preview-column { position: static; }
  .welcome-title-row { align-items: stretch; flex-direction: column; }
  .welcome-status-toggle { width: 100%; min-width: 0; }
}
@media (max-width: 720px) {
  .welcome-hero-card,
  .welcome-editor-card,
  .welcome-preview-card,
  .welcome-help-card { padding: 12px; }
  .welcome-savebar { align-items: stretch; flex-direction: column; bottom: 6px; }
  .welcome-savebar .btn { width: 100%; }
  .welcome-variable-pill span { display: none; }
}

/* === DidiBot 4A v19 · Welcome typography polish === */
/* Only lifts micro-copy in the Welcome editor. Main content sizing stays unchanged. */
.welcome-editor-v18 .welcome-eyebrow {
  font-size: 9.6px;
}
.welcome-editor-v18 .welcome-title-row p {
  font-size: 10.4px;
  line-height: 1.55;
}
.welcome-editor-v18 .welcome-status-toggle strong {
  font-size: 11.2px;
  line-height: 1.35;
}
.welcome-editor-v18 .welcome-status-toggle small {
  font-size: 9.3px;
  line-height: 1.5;
}
.welcome-editor-v18 .welcome-section-heading strong {
  font-size: 11.5px;
  line-height: 1.35;
}
.welcome-editor-v18 .welcome-section-heading small {
  font-size: 9.5px;
  line-height: 1.5;
}
.welcome-editor-v18 .welcome-inline-status {
  gap: 7px;
  font-size: 9.3px;
  line-height: 1.45;
}
.welcome-editor-v18 .welcome-char-count {
  font-size: 9px;
}
.welcome-editor-v18 .welcome-variable-panel {
  gap: 14px;
}
.welcome-editor-v18 .welcome-variable-panel > div:first-child {
  gap: 4px;
}
.welcome-editor-v18 .welcome-variable-panel strong {
  font-size: 11.3px;
  line-height: 1.35;
}
.welcome-editor-v18 .welcome-variable-panel small {
  font-size: 9.4px;
  line-height: 1.5;
}
.welcome-editor-v18 .welcome-variable-pills {
  gap: 7px;
}
.welcome-editor-v18 .welcome-variable-pill {
  min-height: 32px;
  gap: 8px;
  padding: 0 10px;
}
.welcome-editor-v18 .welcome-variable-pill code {
  font-size: 9px;
  font-weight: 650;
}
.welcome-editor-v18 .welcome-variable-pill span {
  font-size: 8.5px;
}
.welcome-editor-v18 .welcome-image-card .hint {
  font-size: 9.4px;
  line-height: 1.5;
}
.welcome-editor-v18 .welcome-preview-author strong {
  font-size: 10.2px;
}
.welcome-editor-v18 .welcome-preview-author small {
  font-size: 8px;
}
.welcome-editor-v18 .welcome-preview-meta {
  font-size: 8.4px;
}
.welcome-editor-v18 .welcome-savebar {
  padding: 11px 13px;
}
.welcome-editor-v18 .welcome-savebar > div {
  gap: 3px;
}
.welcome-editor-v18 .welcome-savebar strong {
  font-size: 11px;
  line-height: 1.35;
}
.welcome-editor-v18 .welcome-savebar small {
  font-size: 9.2px;
  line-height: 1.45;
}

/* === DidiBot 4A v20 · Shared module typography ===
   Tickets + Welcome now share one semantic type scale.
   Whenever the modules previously differed, the larger existing size wins. */
:root {
  --module-type-eyebrow: 9.6px;
  --module-type-lead: 10.4px;
  --module-type-section-title: 11.5px;
  --module-type-section-subtitle: 9.5px;
  --module-type-setting-title: 11.2px;
  --module-type-setting-copy: 9.5px;
  --module-type-pill-code: 9px;
  --module-type-pill-meta: 8.5px;
  --module-type-save-title: 11px;
  --module-type-save-copy: 9.2px;
}

/* Eyebrows / overlines */
.ticket-editor-eyebrow,
.ticket-editor-page-head > span,
.welcome-editor-v18 .welcome-eyebrow {
  font-size: var(--module-type-eyebrow);
}

/* Intro / lead copy */
.ticket-editor-title-block > p,
.welcome-editor-v18 .welcome-title-row p {
  font-size: var(--module-type-lead);
  line-height: 1.55;
}

/* Section headings */
.ticket-editor-section-title strong,
.ticket-editor-sync-card strong,
.ticket-editor-section-head > strong,
.welcome-editor-v18 .welcome-section-heading strong,
.welcome-editor-v18 .welcome-variable-panel strong {
  font-size: var(--module-type-section-title);
  line-height: 1.35;
}

.ticket-editor-section-title small,
.ticket-editor-sync-card small,
.ticket-editor-page-head p,
.ticket-editor-field-note,
.welcome-editor-v18 .welcome-section-heading small,
.welcome-editor-v18 .welcome-variable-panel small,
.welcome-editor-v18 .welcome-image-card .hint {
  font-size: var(--module-type-section-subtitle);
  line-height: 1.5;
}

/* Setting titles and their helper copy */
.premium-setting-row strong,
.welcome-editor-v18 .welcome-status-toggle strong {
  font-size: var(--module-type-setting-title);
  line-height: 1.35;
}

.premium-setting-row p,
.ticket-editor-number-wrap span,
.welcome-editor-v18 .welcome-status-toggle small,
.welcome-editor-v18 .welcome-inline-status {
  font-size: var(--module-type-setting-copy);
  line-height: 1.5;
}

/* Variable / placeholder pills */
.ticket-editor-format-row .var-pill,
.welcome-editor-v18 .welcome-variable-pill code {
  font-size: var(--module-type-pill-code);
}

.welcome-editor-v18 .welcome-variable-pill span {
  font-size: var(--module-type-pill-meta);
}

/* Sticky save bars */
.ticket-sticky-savebar strong,
.welcome-editor-v18 .welcome-savebar strong {
  font-size: var(--module-type-save-title);
  line-height: 1.35;
}

.ticket-sticky-savebar span,
.welcome-editor-v18 .welcome-savebar small {
  font-size: var(--module-type-save-copy);
  line-height: 1.45;
}

/* === DidiBot 4A v21 · Welcome layout polish ===
   Final spacing pass: compact hero, tighter preview rail and denser image card. */
.welcome-editor-v18 .welcome-hero-card {
  align-items: start;
  gap: 10px;
  padding: 12px;
}
.welcome-editor-v18 .welcome-hero-copy,
.welcome-editor-v18 .welcome-channel-card {
  align-self: start;
  padding: 12px;
}
.welcome-editor-v18 .welcome-title-row {
  gap: 14px;
}
.welcome-editor-v18 .welcome-status-toggle {
  min-width: 205px;
  padding: 9px 10px;
}
.welcome-editor-v18 .welcome-channel-card .picker-field {
  margin-top: 9px;
}
.welcome-editor-v18 .welcome-inline-status {
  margin-top: 6px;
}

/* Give the Discord preview a little more room without stealing the editor. */
.welcome-editor-v18 .welcome-editor-grid {
  grid-template-columns: minmax(0,1.34fr) minmax(360px,.78fr);
  gap: 10px;
}
.welcome-editor-v18 .welcome-preview-column {
  gap: 8px;
}
.welcome-editor-v18 .welcome-preview-card {
  padding: 14px;
}
.welcome-editor-v18 .welcome-help-card {
  padding: 11px 12px;
  background: rgba(124,92,252,.025);
}
.welcome-editor-v18 #welcome-live-preview {
  min-height: 0;
}

/* Keep the image editor close to its actual content instead of feeling like a large empty panel. */
.welcome-editor-v18 .welcome-image-card {
  padding-bottom: 13px;
}
.welcome-editor-v18 .welcome-image-card .welcome-section-heading-bordered {
  margin-bottom: 10px;
  padding-bottom: 10px;
}
.welcome-editor-v18 .welcome-image-card .image-upload-box {
  grid-template-columns: minmax(240px,320px) minmax(0,1fr);
  gap: 10px 12px;
  align-items: start;
}
.welcome-editor-v18 .welcome-image-card .image-upload-preview-wrap {
  min-height: 108px;
  max-height: 170px;
}
.welcome-editor-v18 .welcome-image-card .image-upload-preview {
  max-height: 170px;
}
.welcome-editor-v18 .welcome-image-card .image-upload-controls {
  align-self: start;
  padding-top: 2px;
}
.welcome-editor-v18 .welcome-image-card .hint {
  margin-top: 7px;
  margin-bottom: 0;
}

@media (max-width: 1380px) {
  .welcome-editor-v18 .welcome-editor-grid {
    grid-template-columns: minmax(0,1.2fr) minmax(320px,.8fr);
  }
}
@media (max-width: 1100px) {
  .welcome-editor-v18 .welcome-editor-grid {
    grid-template-columns: 1fr;
  }
  .welcome-editor-v18 .welcome-image-card .image-upload-box {
    grid-template-columns: minmax(220px,300px) minmax(0,1fr);
  }
}
@media (max-width: 760px) {
  .welcome-editor-v18 .welcome-image-card .image-upload-box {
    grid-template-columns: 1fr;
  }
  .welcome-editor-v18 .welcome-image-card .image-upload-url {
    grid-column: 1;
  }
}

/* =========================================================
   v22 · Moderation 4A module
   ========================================================= */
.moderation-v22 {
  display: grid;
  gap: 12px;
  padding-bottom: 18px;
}
.moderation-v22 .card {
  border-color: rgba(255,255,255,.055);
}
.moderation-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 18px;
  background: linear-gradient(120deg, rgba(124,92,252,.075), rgba(17,24,39,.98) 35%, rgba(17,24,39,.96));
  border-top: 1px solid rgba(124,92,252,.55);
}
.moderation-hero-main { min-width: 0; }
.moderation-eyebrow {
  display: block;
  margin-bottom: 5px;
  color: #9d8cff;
  font-size: 11.5px;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: .055em;
  text-transform: uppercase;
}
.moderation-hero-title-row {
  display: flex;
  align-items: center;
  gap: 12px;
}
.moderation-hero-icon,
.moderation-section-icon {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  color: #b8a8ff;
  background: rgba(124,92,252,.13);
  border: 1px solid rgba(124,92,252,.14);
  font-size: 15px;
  font-weight: 700;
}
.moderation-hero h2 {
  margin: 0;
  color: var(--text-primary);
  font-size: 21px;
  line-height: 1.2;
}
.moderation-hero p,
.moderation-data-head p {
  margin: 4px 0 0;
  color: var(--text-secondary);
  font-size: 12.5px;
  line-height: 1.5;
}
.moderation-hero-status {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}
.status-chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 30px;
  padding: 0 10px;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 9px;
  background: rgba(255,255,255,.025);
  color: var(--text-secondary);
  font-size: 11.5px;
  font-weight: 600;
}
.status-chip .status-dot { width: 6px; height: 6px; border-radius: 50%; background: #64748b; }
.status-chip.is-success { color: #b8f7cc; border-color: rgba(34,197,94,.14); background: rgba(34,197,94,.045); }
.status-chip.is-success .status-dot { background: #22c55e; }
.status-chip.is-warning { color: #f9d58a; border-color: rgba(245,158,11,.14); background: rgba(245,158,11,.045); }
.status-chip.is-warning .status-dot { background: #f59e0b; }

.moderation-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 10px;
}
.moderation-kpi-card {
  position: relative;
  min-width: 0;
  padding: 14px 15px;
  overflow: hidden;
}
.moderation-kpi-card::before {
  content: "";
  position: absolute;
  inset: 0 auto auto 0;
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, rgba(124,92,252,.9), rgba(124,92,252,.05));
}
.moderation-kpi-card > span {
  display: block;
  color: #7f8ca0;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .035em;
  text-transform: uppercase;
}
.moderation-kpi-card > strong {
  display: block;
  margin-top: 7px;
  color: #f5f7fb;
  font-size: 23px;
  line-height: 1;
}
.moderation-kpi-card > small {
  display: block;
  margin-top: 6px;
  color: var(--text-muted);
  font-size: 11.5px;
  line-height: 1.35;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.moderation-tabs {
  display: flex;
  gap: 4px;
  padding: 5px;
  overflow-x: auto;
}
.moderation-tab {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 34px;
  padding: 0 11px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: #8795aa;
  font: inherit;
  font-size: 11.5px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  transition: 160ms ease;
}
.moderation-tab > span { color: #76859b; font-size: 12px; }
.moderation-tab:hover { color: #d9e0ea; background: rgba(255,255,255,.025); }
.moderation-tab.active {
  color: #eeeaff;
  border-color: rgba(124,92,252,.16);
  background: rgba(124,92,252,.14);
}
.moderation-tab.active > span { color: #a997ff; }

.moderation-settings-form { display: grid; gap: 12px; padding-bottom: 76px; }
.moderation-section { padding: 15px; min-width: 0; }
.moderation-settings-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 12px;
}
.moderation-section-head,
.moderation-section-title-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
}
.moderation-section-head {
  margin-bottom: 13px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(255,255,255,.05);
}
.moderation-section-head-actions { justify-content: space-between; gap: 14px; }
.moderation-section-head strong,
.moderation-history-head h4 {
  display: block;
  margin: 0;
  color: #dce4ef;
  font-size: 13px;
  line-height: 1.3;
}
.moderation-section-head small {
  display: block;
  margin-top: 2px;
  color: var(--text-muted);
  font-size: 11.5px;
  line-height: 1.4;
}
.moderation-core-grid {
  display: grid;
  grid-template-columns: minmax(0,1.35fr) minmax(260px,.65fr);
  gap: 10px;
  align-items: stretch;
}
.moderation-picker-card,
.mod-toggle-tile,
.mod-number-field {
  min-width: 0;
  border: 1px solid rgba(255,255,255,.055);
  border-radius: 10px;
  background: rgba(6,11,20,.26);
}
.moderation-picker-card { padding: 12px; }
.moderation-picker-card .field { margin: 0; }
.mod-toggle-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.mod-toggle-grid-2 { margin-top: 8px; }
.mod-toggle-tile {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 62px;
  padding: 10px 11px;
  cursor: pointer;
}
.mod-toggle-tile > span:first-child { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.mod-toggle-tile strong,
.mod-number-field strong {
  color: #dce4ef;
  font-size: 12px;
  line-height: 1.3;
}
.mod-toggle-tile small,
.mod-number-field small,
.moderation-help {
  color: var(--text-muted);
  font-size: 10.5px;
  line-height: 1.4;
}
.moderation-help { margin: 7px 0 0; }
.mod-toggle-tile .toggle { flex: 0 0 auto; }
.mod-number-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
.mod-number-grid-3 { grid-template-columns: repeat(3,minmax(0,1fr)); }
.mod-number-grid-2 { grid-template-columns: repeat(2,minmax(0,1fr)); }
.mod-number-field {
  display: grid;
  grid-template-columns: minmax(0,1fr) 86px;
  align-items: center;
  gap: 9px;
  min-height: 60px;
  padding: 9px 10px;
}
.mod-number-field > span { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.mod-number-field .input { width: 100%; min-width: 0; text-align: right; }
.moderation-textarea-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.moderation-textarea-grid textarea { resize: vertical; min-height: 92px; }
.mod-policy-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
.moderation-escalation-table { margin-top: 10px; }
.moderation-escalation-table table { min-width: 720px; }
.moderation-escalation-table td,
.moderation-escalation-table th { padding-top: 8px; padding-bottom: 8px; }
.moderation-escalation-table .input-sm { min-height: 34px; }
.moderation-savebar {
  position: sticky;
  z-index: 9;
  bottom: 8px;
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 10px 12px;
  background: rgba(13,19,32,.96);
  border-color: rgba(124,92,252,.16) !important;
  backdrop-filter: blur(14px);
}
.moderation-savebar > div { display: flex; flex-direction: column; gap: 2px; margin-right: auto; }
.moderation-savebar strong { color: #dce4ef; font-size: 12px; }
.moderation-savebar small { color: var(--text-muted); font-size: 10.5px; }

.moderation-data-panel,
.moderation-user-panel { padding: 15px; }
.moderation-data-head { margin-bottom: 12px; }
.moderation-data-head h3 { margin: 0; color: #eef2f7; font-size: 15px; }
.moderation-filter-bar {
  display: grid !important;
  grid-template-columns: repeat(3,minmax(150px,220px)) auto;
  align-items: end;
  gap: 8px;
  margin: 0 0 12px;
  padding: 10px;
  border: 1px solid rgba(255,255,255,.05);
  border-radius: 10px;
  background: rgba(6,11,20,.22);
}
#mod-case-filters.moderation-filter-bar { grid-template-columns: minmax(150px,220px) minmax(170px,240px) auto; }
.moderation-filter-bar .field { margin: 0; }
.moderation-data-panel .table-wrap {
  border: 1px solid rgba(255,255,255,.045);
  border-radius: 10px;
  overflow: auto;
}
.moderation-data-panel table { margin: 0; }
.moderation-data-panel thead { background: rgba(255,255,255,.018); }
.moderation-data-panel tbody tr:hover { background: rgba(124,92,252,.025); }
.moderation-person-cell { display: inline-flex; align-items: center; gap: 8px; min-width: 0; }
.moderation-avatar {
  width: 25px;
  height: 25px;
  flex: 0 0 25px;
  border-radius: 50%;
  object-fit: cover;
  border: 1px solid rgba(255,255,255,.08);
}
.moderation-avatar.dashboard-user-avatar-fallback { display: grid; place-items: center; background: #242c3c; color: #b8c1d0; font-size: 9px; font-weight: 700; }
.mod-action-pill {
  display: inline-flex;
  align-items: center;
  min-height: 23px;
  padding: 0 8px;
  border-radius: 999px;
  background: rgba(100,116,139,.11);
  color: #aab5c5;
  font-size: 10.5px;
  font-weight: 650;
  white-space: nowrap;
}
.mod-action-warn, .mod-action-warn_remove { background: rgba(245,158,11,.1); color: #f6c562; }
.mod-action-timeout, .mod-action-untimeout { background: rgba(59,130,246,.1); color: #83b4ff; }
.mod-action-kick { background: rgba(249,115,22,.1); color: #f7a66d; }
.mod-action-ban, .mod-action-unban { background: rgba(239,68,68,.1); color: #f58d8d; }
.mod-action-automod { background: rgba(124,92,252,.12); color: #b5a7ff; }

.moderation-user-search {
  display: grid !important;
  grid-template-columns: minmax(220px,1.2fr) minmax(220px,.8fr) auto;
  gap: 8px;
  align-items: end;
  padding: 10px;
  border: 1px solid rgba(255,255,255,.05);
  border-radius: 10px;
  background: rgba(6,11,20,.22);
}
.moderation-user-search .field { margin: 0; }
#mod-user-search-results { display: flex; flex-wrap: wrap; gap: 7px; margin: 9px 0 0; padding: 0; }
.mod-user-result {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 9px;
  border: 1px solid rgba(255,255,255,.055);
  border-radius: 9px;
  background: rgba(255,255,255,.025);
  color: inherit;
  cursor: pointer;
}
.mod-user-result:hover { border-color: rgba(124,92,252,.25); background: rgba(124,92,252,.055); }
.mod-user-result > span:last-child { display: flex; flex-direction: column; align-items: flex-start; gap: 1px; }
.mod-user-result strong { color: #dce4ef; font-size: 11.5px; }
.mod-user-result small { color: var(--text-muted); font-size: 9.5px; }
.moderation-user-profile-card {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 10px;
  padding: 12px;
  background: rgba(124,92,252,.035);
}
.moderation-profile-avatar {
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid rgba(124,92,252,.2);
}
.moderation-profile-avatar.dashboard-user-avatar-fallback { display: grid; place-items: center; background: #292346; color: #c7bbff; font-size: 16px; font-weight: 700; }
.moderation-user-profile-copy { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; min-width: 0; }
.moderation-user-profile-copy > strong { width: 100%; color: #f1f4f8; font-size: 15px; }
.moderation-user-profile-copy .hint { margin: 0; font-size: 10.5px; }
.moderation-history-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; margin-top: 10px; }
.moderation-history-card { padding: 12px; min-width: 0; }
.moderation-history-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-bottom: 9px; margin-bottom: 9px; border-bottom: 1px solid rgba(255,255,255,.05); }
.moderation-history-head .moderation-eyebrow { margin-bottom: 2px; font-size: 9.5px; }
.moderation-history-head > strong { color: #9f8cff; font-size: 18px; }
.moderation-warning-list, .moderation-case-list { display: grid; gap: 6px; }
.moderation-warning-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 9px;
  border: 1px solid rgba(255,255,255,.045);
  border-radius: 8px;
  background: rgba(255,255,255,.018);
}
.moderation-warning-item > div { display: grid; gap: 2px; min-width: 0; margin-right: auto; }
.moderation-warning-item strong { color: #f2cf72; font-size: 10.5px; }
.moderation-warning-item span { color: #c6cfdb; font-size: 10.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.moderation-warning-item small { color: var(--text-muted); font-size: 9px; }
.moderation-case-history-row {
  display: grid;
  grid-template-columns: auto minmax(0,1fr) auto;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 7px 8px;
  border: 1px solid rgba(255,255,255,.045);
  border-radius: 8px;
  background: rgba(255,255,255,.018);
  color: inherit;
  text-align: left;
}
button.moderation-case-history-row { cursor: pointer; }
button.moderation-case-history-row:hover { border-color: rgba(124,92,252,.22); background: rgba(124,92,252,.04); }
.moderation-case-history-row > span:nth-child(2) { color: #c3ccd8; font-size: 10.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.moderation-case-history-row small { color: var(--text-muted); font-size: 9px; white-space: nowrap; }
.moderation-action-grid {
  grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  gap: 10px !important;
  margin-top: 10px;
}
.moderation-action-grid > .inner-card {
  min-width: 0;
  padding: 12px;
  border-color: rgba(255,255,255,.05);
  background: rgba(255,255,255,.018);
}
.moderation-action-grid > .inner-card h4 { margin: 0 0 10px; color: #dfe5ee; font-size: 13px; }
.moderation-action-grid .field { margin-bottom: 8px; }
.moderation-action-grid .btn + .btn { margin-left: 6px; }

@media (max-width: 1250px) {
  .moderation-kpi-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .moderation-settings-grid { grid-template-columns: 1fr; }
  .moderation-core-grid { grid-template-columns: 1fr; }
  .mod-policy-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 900px) {
  .moderation-hero { align-items: stretch; flex-direction: column; }
  .moderation-hero-status { justify-content: flex-start; }
  .moderation-textarea-grid,
  .moderation-history-grid,
  .moderation-action-grid { grid-template-columns: 1fr !important; }
  .moderation-filter-bar,
  #mod-case-filters.moderation-filter-bar,
  .moderation-user-search { grid-template-columns: 1fr !important; }
  .moderation-filter-bar .btn,
  .moderation-user-search .btn { width: 100%; }
}
@media (max-width: 680px) {
  .moderation-kpi-grid { grid-template-columns: 1fr; }
  .mod-toggle-grid,
  .mod-number-grid,
  .mod-number-grid-2,
  .mod-number-grid-3,
  .mod-policy-grid { grid-template-columns: 1fr; }
  .mod-number-field { grid-template-columns: minmax(0,1fr) 90px; }
  .moderation-savebar { align-items: stretch; flex-direction: column; }
  .moderation-savebar .btn { width: 100%; }
  .moderation-section-head-actions { align-items: stretch; flex-direction: column; }
  .moderation-section-head-actions .btn { width: 100%; }
}

/* === DidiBot 4A v23 · Moderation final polish ===
   Compact AutoMod composition, card-based escalation rules and calmer empty/filter states. */
.moderation-v22 .moderation-eyebrow {
  font-size: var(--module-type-eyebrow);
}
.moderation-v22 .moderation-hero p,
.moderation-v22 .moderation-data-head p {
  font-size: var(--module-type-lead);
  line-height: 1.5;
}
.moderation-v22 .moderation-section-head strong,
.moderation-v22 .moderation-history-head h4 {
  font-size: var(--module-type-section-title);
}
.moderation-v22 .moderation-section-head small,
.moderation-v22 .moderation-help {
  font-size: var(--module-type-section-subtitle);
  line-height: 1.5;
}
.moderation-v22 .mod-toggle-tile strong,
.moderation-v22 .mod-number-field strong {
  font-size: var(--module-type-setting-title);
}
.moderation-v22 .mod-toggle-tile small,
.moderation-v22 .mod-number-field small {
  font-size: var(--module-type-setting-copy);
  line-height: 1.45;
}
.moderation-v22 .moderation-savebar strong {
  font-size: var(--module-type-save-title);
}
.moderation-v22 .moderation-savebar small {
  font-size: var(--module-type-save-copy);
}

/* Let cards follow their actual content instead of stretching to the tallest neighbor. */
.moderation-settings-grid {
  align-items: start;
}
.moderation-core-grid {
  align-items: start;
}
.moderation-core-grid > .mod-toggle-tile {
  align-self: start;
  width: 100%;
  min-height: 68px;
}
.mod-toggle-tile {
  min-height: 56px;
}
.mod-number-field {
  min-height: 54px;
}
.moderation-section {
  align-self: start;
}
.moderation-settings-form {
  padding-bottom: 112px;
}

/* Escalation rules are compact cards rather than an admin-table strip. */
.moderation-escalation-list {
  display: grid;
  gap: 8px;
  margin-top: 11px;
}
.escalation-rule-row {
  display: grid;
  grid-template-columns: 28px minmax(92px,.55fr) minmax(130px,.8fr) minmax(130px,.8fr) minmax(260px,2fr) 34px;
  align-items: end;
  gap: 8px;
  padding: 9px;
  border: 1px solid rgba(255,255,255,.055);
  border-radius: 10px;
  background: rgba(6,11,20,.24);
}
.escalation-rule-row .field {
  margin: 0;
  min-width: 0;
}
.escalation-rule-row .field-label {
  font-size: var(--module-type-setting-copy);
}
.escalation-rule-index {
  align-self: center;
  display: grid;
  place-items: center;
  width: 25px;
  height: 25px;
  border-radius: 8px;
  color: #b9adff;
  background: rgba(124,92,252,.12);
  border: 1px solid rgba(124,92,252,.16);
  font-size: 10px;
  font-weight: 750;
}
.escalation-rule-remove {
  width: 34px;
  min-width: 34px;
  padding-inline: 0;
}

/* Filters should read like toolbars, not full-width submit banners. */
.moderation-filter-bar {
  justify-content: start;
  grid-template-columns: minmax(145px,190px) minmax(165px,220px) minmax(165px,220px) max-content;
}
#mod-case-filters.moderation-filter-bar {
  grid-template-columns: minmax(145px,190px) minmax(165px,220px) max-content;
}
.moderation-filter-bar .btn {
  width: auto !important;
  min-width: 92px;
  justify-self: start;
}

/* Purpose-built empty states keep sparse moderation tabs compact and intentional. */
.moderation-empty-state {
  display: grid;
  place-items: center;
  align-content: center;
  gap: 6px;
  min-height: 170px;
  margin-top: 12px;
  padding: 24px;
  border: 1px dashed rgba(255,255,255,.07);
  border-radius: 11px;
  background: rgba(6,11,20,.18);
  text-align: center;
}
.moderation-empty-state-compact {
  min-height: 145px;
  margin-top: 4px;
}
.moderation-empty-icon {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  color: #b8abff;
  background: rgba(124,92,252,.11);
  border: 1px solid rgba(124,92,252,.13);
  font-size: 15px;
}
.moderation-empty-state strong {
  color: #dfe5ee;
  font-size: var(--module-type-section-title);
}
.moderation-empty-state p {
  max-width: 560px;
  margin: 0;
  color: var(--text-muted);
  font-size: var(--module-type-section-subtitle);
  line-height: 1.5;
}
.moderation-channel-action {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #b6c0cf;
}

@media (max-width: 1180px) {
  .escalation-rule-row {
    grid-template-columns: 28px repeat(3,minmax(110px,1fr)) 34px;
  }
  .escalation-rule-reason {
    grid-column: 2 / 5;
  }
  .escalation-rule-remove {
    grid-column: 5;
    grid-row: 1 / 3;
    align-self: center;
  }
}
@media (max-width: 900px) {
  .escalation-rule-row {
    grid-template-columns: 28px 1fr 1fr 34px;
  }
  .escalation-rule-count { grid-column: 2; }
  .escalation-rule-action { grid-column: 3; }
  .escalation-rule-duration { grid-column: 2; }
  .escalation-rule-reason { grid-column: 3; }
  .escalation-rule-remove { grid-column: 4; grid-row: 1 / 3; }
}
@media (max-width: 680px) {
  .escalation-rule-row {
    grid-template-columns: 28px minmax(0,1fr) 34px;
    align-items: center;
  }
  .escalation-rule-count,
  .escalation-rule-action,
  .escalation-rule-duration,
  .escalation-rule-reason { grid-column: 2; }
  .escalation-rule-remove { grid-column: 3; grid-row: 1 / 5; }
}

/* ── v24: Moderation case detail modal ─────────────────────────────── */
.mod-case-modal-card {
  width: min(980px, calc(100vw - 32px));
  max-height: calc(100vh - 40px);
  padding: 0;
  overflow: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(124,92,252,.4) rgba(255,255,255,.035);
}
.mod-case-modal-card::-webkit-scrollbar,
.mod-case-notes-scroll::-webkit-scrollbar { width: 9px; }
.mod-case-modal-card::-webkit-scrollbar-track,
.mod-case-notes-scroll::-webkit-scrollbar-track { background: rgba(255,255,255,.025); border-radius: 999px; }
.mod-case-modal-card::-webkit-scrollbar-thumb,
.mod-case-notes-scroll::-webkit-scrollbar-thumb { background: rgba(124,92,252,.34); border-radius: 999px; border: 2px solid #101827; }
.mod-case-modal-card::-webkit-scrollbar-thumb:hover,
.mod-case-notes-scroll::-webkit-scrollbar-thumb:hover { background: rgba(124,92,252,.55); }

.mod-case-modal-header {
  position: sticky;
  top: 0;
  z-index: 4;
  margin: 0;
  padding: 17px 20px 15px;
  background: rgba(16,24,39,.97);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--border);
}
.mod-case-modal-header > div { display: grid; gap: 3px; }
.mod-case-modal-eyebrow {
  color: var(--accent-soft, #a78bfa);
  font-size: 10.5px;
  line-height: 1.2;
  font-weight: 750;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.mod-case-modal-header h3 { font-size: 20px; letter-spacing: -.03em; }
.mod-case-modal-card .modal-actions {
  position: sticky;
  bottom: 0;
  z-index: 4;
  margin: 0;
  padding: 12px 20px;
  background: rgba(16,24,39,.97);
  backdrop-filter: blur(12px);
  border-top: 1px solid var(--border);
}
.mod-case-modal-card .modal-close { width: 34px; height: 34px; display:grid; place-items:center; border-radius:9px; }
.mod-case-modal-card .modal-close:hover { background: rgba(255,255,255,.05); }

.mod-case-body {
  display: grid;
  gap: 13px;
  max-height: none;
  overflow: visible;
  padding: 16px 20px 18px;
}
.mod-case-loading { display:grid; gap:10px; padding:8px 0; }
.mod-case-loading-line { height: 18px; width: 34%; border-radius: 7px; }
.mod-case-loading-card { height: 180px; width: 100%; border-radius: 12px; }

.mod-case-summary-grid {
  display: grid;
  grid-template-columns: .8fr 1.35fr 1.35fr 1fr;
  gap: 10px;
}
.mod-case-summary-card {
  min-width: 0;
  min-height: 88px;
  padding: 12px;
  display: flex;
  align-items: center;
  gap: 10px;
  background: #0d1523;
  border: 1px solid var(--border);
  border-radius: 11px;
}
.mod-case-summary-card > div:not(.mod-case-person) { min-width:0; display:grid; gap:4px; }
.mod-case-summary-card small,
.mod-case-person-card > small {
  color: var(--text-muted);
  font-size: 9.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .055em;
}
.mod-case-summary-card strong { font-size: 13px; line-height:1.25; }
.mod-case-summary-card > div > span { color:var(--text-muted); font-size:10px; }
.mod-case-summary-icon {
  width: 34px;
  height: 34px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border-radius: 9px;
  color: #c7bbff;
  background: rgba(124,92,252,.12);
  border: 1px solid rgba(124,92,252,.12);
}
.mod-case-inline-svg { fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; vertical-align:middle; }

.mod-case-person-card { display:grid; align-content:center; gap:7px; }
.mod-case-person { min-width:0; display:grid; grid-template-columns:34px minmax(0,1fr); align-items:center; gap:9px; }
.mod-case-person-avatar,
.mod-case-timeline-avatar {
  width:34px;
  height:34px;
  border-radius:50%;
  object-fit:cover;
  background:#252d3d;
}
.mod-case-person-avatar.dashboard-user-avatar-fallback,
.mod-case-timeline-avatar.dashboard-user-avatar-fallback { display:grid; place-items:center; color:#d2d8e5; font-size:10px; font-weight:800; }
.mod-case-person-copy { min-width:0; display:grid; gap:1px; }
.mod-case-person-copy > strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; }
.mod-case-person-copy > small { color:var(--text-muted); font-size:9.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mod-case-id-row { display:flex; align-items:center; gap:5px; min-width:0; margin-top:2px; }
.mod-case-id-row code { color:#69778d; font-size:8.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mod-case-copy-id { width:22px; height:22px; padding:0; flex:0 0 auto; display:grid; place-items:center; color:#78869c; border:0; border-radius:6px; background:transparent; cursor:pointer; }
.mod-case-copy-id:hover { color:#c7bbff; background:rgba(124,92,252,.1); }
.mod-case-person-empty { color:var(--text-muted); }

.mod-case-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr);
  gap: 11px;
  align-items: start;
}
.mod-case-section-card {
  min-width:0;
  padding: 13px;
  background: #0d1523;
  border: 1px solid var(--border);
  border-radius: 11px;
}
.mod-case-section-head {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding-bottom:11px;
  margin-bottom:11px;
  border-bottom:1px solid var(--border);
}
.mod-case-section-head > div { display:flex; align-items:center; gap:9px; min-width:0; }
.mod-case-section-head > div > span:first-child { width:31px; height:31px; flex:0 0 auto; display:grid; place-items:center; border-radius:8px; color:#c4b5fd; background:rgba(124,92,252,.1); }
.mod-case-section-head > div > div { min-width:0; display:grid; gap:2px; }
.mod-case-section-head strong { font-size:12.5px; }
.mod-case-section-head small { color:var(--text-muted); font-size:9.5px; line-height:1.35; }
.mod-case-section-badge { flex:0 0 auto; padding:4px 7px; border-radius:999px; color:#aeb8cb; background:rgba(255,255,255,.035); border:1px solid var(--border); font-size:9px; font-weight:700; }

.mod-case-field { gap:6px; }
.mod-case-field .field-label { display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:10px; }
.mod-case-field .field-label small { color:var(--text-muted); font-weight:500; text-transform:none; letter-spacing:0; }
.mod-case-field textarea.input { resize:vertical; min-height:72px; line-height:1.45; font-size:11px; }
.mod-case-proof-wrap { display:grid; gap:7px; margin-top:10px; }
.mod-case-inline-label { display:flex; align-items:center; justify-content:space-between; color:#b9c3d4; font-size:10px; font-weight:700; }
.mod-case-inline-label small { color:var(--text-muted); font-size:9px; }
.mod-case-proof-list { display:grid; gap:6px; }
.mod-case-proof-chip {
  min-width:0;
  display:grid;
  grid-template-columns:20px max-content minmax(0,1fr);
  align-items:center;
  gap:6px;
  padding:7px 8px;
  color:#dbe3f0;
  text-decoration:none;
  background:#0a111d;
  border:1px solid var(--border);
  border-radius:8px;
}
.mod-case-proof-chip > span:first-child { display:grid; place-items:center; color:#8b6cff; }
.mod-case-proof-chip > span:nth-child(2) { font-size:10px; font-weight:700; }
.mod-case-proof-chip small { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--text-muted); font-size:9px; }
.mod-case-proof-chip:hover { border-color:rgba(124,92,252,.28); background:rgba(124,92,252,.045); }
.mod-case-proof-invalid { opacity:.7; }
.mod-case-proof-editor { margin-top:10px; }
.mod-case-section-actions { margin-top:10px; display:flex; justify-content:flex-end; }
.mod-case-section-actions .btn { display:inline-flex; align-items:center; gap:6px; }
.mod-case-empty-inline { padding:12px; color:var(--text-muted); font-size:10.5px; text-align:center; background:#0a111d; border:1px dashed var(--border-strong); border-radius:8px; }

.mod-case-notes-scroll {
  max-height: 210px;
  overflow-y:auto;
  scrollbar-width:thin;
  scrollbar-color:rgba(124,92,252,.35) rgba(255,255,255,.02);
  padding-right:3px;
}
.mod-case-timeline { display:grid; gap:7px; }
.mod-case-timeline-item { display:grid; grid-template-columns:30px minmax(0,1fr); gap:8px; padding:8px; background:#0a111d; border:1px solid var(--border); border-radius:8px; }
.mod-case-timeline-avatar { width:30px; height:30px; }
.mod-case-timeline-copy { min-width:0; display:grid; gap:5px; }
.mod-case-timeline-head { display:flex; justify-content:space-between; gap:8px; }
.mod-case-timeline-head strong { font-size:10.5px; }
.mod-case-timeline-head time { color:var(--text-muted); font-size:8.8px; white-space:nowrap; }
.mod-case-timeline-copy p { margin:0; color:#cbd4e2; font-size:10.5px; line-height:1.4; white-space:pre-wrap; }
.mod-case-note-form { display:grid; gap:0; margin-top:10px; padding-top:10px; border-top:1px solid var(--border); }

.mod-case-history-card { padding-bottom:10px; }
.mod-case-edit-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }
.mod-case-edit-row { position:relative; display:grid; grid-template-columns:10px minmax(0,1fr); gap:7px; padding:8px 9px; background:#0a111d; border:1px solid var(--border); border-radius:8px; }
.mod-case-edit-dot { width:7px; height:7px; margin-top:5px; border-radius:50%; background:#7c5cfc; box-shadow:0 0 0 3px rgba(124,92,252,.11); }
.mod-case-edit-row > div { min-width:0; display:grid; gap:2px; }
.mod-case-edit-row strong { font-size:10px; }
.mod-case-edit-row small { color:var(--text-muted); font-size:8.8px; }
.mod-case-edit-row p { margin:4px 0 0; display:flex; align-items:center; gap:6px; min-width:0; color:#b6c0d1; font-size:9.5px; }
.mod-case-edit-row p span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mod-case-edit-row p svg { flex:0 0 auto; color:#6f7c91; }

@media (max-width: 900px) {
  .mod-case-modal-card { width:min(760px, calc(100vw - 20px)); max-height:calc(100vh - 20px); }
  .mod-case-summary-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .mod-case-workspace { grid-template-columns:1fr; }
  .mod-case-edit-list { grid-template-columns:1fr; }
}
@media (max-width: 560px) {
  .mod-case-modal-card { width:calc(100vw - 12px); max-height:calc(100vh - 12px); border-radius:11px; }
  .mod-case-modal-header { padding:14px; }
  .mod-case-body { padding:12px 14px 14px; }
  .mod-case-summary-grid { grid-template-columns:1fr; }
  .mod-case-summary-card { min-height:74px; }
  .mod-case-modal-card .modal-actions { padding:10px 14px; }
}

/* ============================================================
   Verification · 4A module polish (v25)
   ============================================================ */
.verification-editor-v25 {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding-bottom: 76px;
}

.verification-hero-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 18px 20px;
  border-top: 1px solid rgba(124,92,252,.55);
  background: linear-gradient(115deg, rgba(124,92,252,.055), rgba(17,24,39,.96) 48%, rgba(17,24,39,.96));
}

.verification-hero-copy { min-width: 0; }
.verification-eyebrow {
  display: block;
  margin-bottom: 6px;
  color: #9f8cff;
  font-size: 11.5px;
  font-weight: 750;
  letter-spacing: .055em;
  text-transform: uppercase;
}
.verification-hero-copy h2 { margin: 0; color: #f5f7fb; font-size: 18px; line-height: 1.25; }
.verification-hero-copy p { margin: 6px 0 0; color: var(--text-secondary); font-size: 12.5px; line-height: 1.5; }
.verification-hero-status { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.verification-status-badge {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 30px;
  padding: 0 10px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 9px;
  background: rgba(8,13,23,.5);
  color: #92a0b5;
  font-size: 11px;
  font-weight: 650;
}
.verification-status-badge.is-ready { border-color: rgba(34,197,94,.16); background: rgba(34,197,94,.055); color: #7ee89d; }
.verification-status-badge.is-warning { border-color: rgba(245,158,11,.18); background: rgba(245,158,11,.055); color: #f7c15b; }

.verification-editor-grid {
  display: grid;
  grid-template-columns: minmax(0,1.35fr) minmax(330px,.65fr);
  gap: 14px;
  align-items: start;
}
.verification-editor-main { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.verification-section-card,
.verification-preview-card,
.verification-info-card { padding: 16px; }
.verification-section-heading {
  display: flex;
  align-items: center;
  gap: 10px;
}
.verification-section-heading-bordered {
  padding-bottom: 12px;
  margin-bottom: 14px;
  border-bottom: 1px solid rgba(255,255,255,.055);
}
.verification-section-heading > div { display: flex; min-width: 0; flex-direction: column; gap: 2px; }
.verification-section-heading strong { color: #e5eaf2; font-size: 11.5px; line-height: 1.35; }
.verification-section-heading small { color: var(--text-muted); font-size: 9.5px; line-height: 1.45; }
.verification-section-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 30px;
  height: 30px;
  border-radius: 9px;
  background: rgba(124,92,252,.12);
  color: #a995ff;
  font-size: 13px;
  font-weight: 750;
}

.verification-channel-layout {
  display: grid;
  grid-template-columns: minmax(0,1.5fr) minmax(220px,.5fr);
  gap: 12px;
  align-items: stretch;
}
.verification-channel-layout .picker-field { margin: 0; }
.verification-channel-note {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 100%;
  padding: 11px 12px;
  border: 1px solid rgba(255,255,255,.055);
  border-radius: 10px;
  background: rgba(8,13,23,.28);
}
.verification-note-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  flex: 0 0 auto;
  border-radius: 9px;
  background: rgba(124,92,252,.12);
  color: #a995ff;
  font-weight: 800;
}
.verification-channel-note > div { display: flex; flex-direction: column; gap: 2px; }
.verification-channel-note strong { color: #dce4ef; font-size: 11.5px; }
.verification-channel-note small { color: var(--text-muted); font-size: 9.5px; line-height: 1.45; }
.verification-inline-status {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 10px 0 0;
  color: #7f8da2;
  font-size: 9.5px;
}

.verification-role-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.verification-role-card {
  padding: 13px;
  border: 1px solid rgba(255,255,255,.055);
  border-radius: 11px;
  background: rgba(8,13,23,.25);
}
.verification-role-card.is-primary { border-color: rgba(34,197,94,.13); background: linear-gradient(145deg,rgba(34,197,94,.035),rgba(8,13,23,.25)); }
.verification-role-card-head { display: flex; align-items: center; gap: 9px; margin-bottom: 11px; }
.verification-role-card-head > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 27px;
  height: 27px;
  border-radius: 8px;
  background: rgba(124,92,252,.11);
  color: #ae9cff;
  font-size: 12px;
  font-weight: 800;
}
.verification-role-card.is-primary .verification-role-card-head > span { background: rgba(34,197,94,.10); color: #68df8d; }
.verification-role-card-head > div { display: flex; flex-direction: column; gap: 2px; }
.verification-role-card-head strong { color: #e1e7f0; font-size: 11.5px; }
.verification-role-card-head small { color: var(--text-muted); font-size: 9.5px; line-height: 1.4; }
.verification-role-card .picker-field { margin: 0; }

.verification-role-flow {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr);
  align-items: center;
  gap: 9px;
}
.verification-flow-step {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
  padding: 11px;
  border: 1px solid rgba(255,255,255,.055);
  border-radius: 10px;
  background: rgba(8,13,23,.25);
}
.verification-flow-step.is-action { border-color: rgba(124,92,252,.14); background: rgba(124,92,252,.045); }
.verification-flow-index {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 23px;
  height: 23px;
  flex: 0 0 auto;
  border-radius: 999px;
  background: rgba(124,92,252,.12);
  color: #ac9aff;
  font-size: 9px;
  font-weight: 800;
}
.verification-flow-step > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.verification-flow-step small { color: var(--text-muted); font-size: 8.8px; }
.verification-flow-step strong { overflow: hidden; color: #dce4ef; font-size: 10.5px; text-overflow: ellipsis; white-space: nowrap; }
.verification-role-dot { width: 9px; height: 9px; margin-left: auto; flex: 0 0 auto; border-radius: 999px; background: var(--role-color,#5865F2); box-shadow: 0 0 0 3px color-mix(in srgb,var(--role-color,#5865F2) 16%,transparent); }
.verification-flow-arrow { color: #566277; font-size: 14px; }

.verification-preview-column { position: sticky; top: 64px; display: flex; flex-direction: column; gap: 12px; min-width: 0; }
#verification-live-preview { min-height: 300px; }
.verification-preview-message {
  padding: 12px;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 10px;
  background: #0b1019;
  transition: opacity .18s ease,filter .18s ease;
}
.verification-preview-message.is-disabled { opacity: .58; filter: saturate(.72); }
.verification-preview-author { display: flex; align-items: center; gap: 6px; margin-bottom: 10px; }
.verification-preview-bot {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  background: linear-gradient(135deg,#7c5cfc,#5f46d9);
  color: #fff;
  font-size: 10px;
  font-weight: 800;
}
.verification-preview-author strong { color: #e8edf5; font-size: 9.5px; }
.verification-preview-author small { color: #667286; font-size: 7.5px; }
.verification-preview-app { padding: 2px 4px; border-radius: 3px; background: #5865f2; color: white; font-size: 6.5px; font-weight: 800; }
.verification-preview-embed {
  position: relative;
  padding: 12px 13px 11px 16px;
  border-radius: 4px;
  background: #121820;
  overflow: hidden;
}
.verification-preview-embed::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 4px; background: #57f287; }
.verification-preview-title { display: block; color: #f0f3f7; font-size: 11px; line-height: 1.35; }
.verification-preview-description { margin-top: 8px; color: #c0c8d3; font-size: 8.8px; line-height: 1.55; }
.verification-preview-footer { margin-top: 10px; color: #8e9aac; font-size: 7.8px; }
.verification-preview-button {
  margin-top: 8px;
  padding: 7px 11px;
  border: 0;
  border-radius: 4px;
  background: #248046;
  color: #fff;
  font: inherit;
  font-size: 8.5px;
  font-weight: 700;
  pointer-events: none;
}
.verification-preview-meta { display: flex; justify-content: space-between; gap: 10px; margin-top: 9px; color: #657186; font-size: 7.8px; }
.verification-preview-meta span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.verification-info-card { background: rgba(124,92,252,.018); }
.verification-info-list { display: grid; gap: 8px; margin-top: 12px; }
.verification-info-list span { display: flex; align-items: flex-start; gap: 7px; color: #8d9aae; font-size: 9.5px; line-height: 1.5; }
.verification-info-list i { color: #57d97e; font-style: normal; font-weight: 800; }

.verification-savebar {
  position: sticky;
  z-index: 8;
  bottom: 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 10px 12px;
  border: 1px solid rgba(255,255,255,.065);
  border-radius: 11px;
  background: rgba(13,19,32,.96);
  box-shadow: 0 -12px 34px rgba(3,7,14,.22);
  backdrop-filter: blur(14px);
}
.verification-savebar > div { display: flex; flex-direction: column; gap: 2px; }
.verification-savebar strong { color: #dce4ef; font-size: 11.5px; }
.verification-savebar small { color: var(--text-muted); font-size: 9.5px; line-height: 1.4; }
.verification-savebar .btn { min-width: 170px; }

@media (max-width: 1250px) {
  .verification-editor-grid { grid-template-columns: minmax(0,1.15fr) minmax(300px,.85fr); }
  .verification-channel-layout { grid-template-columns: 1fr; }
  .verification-role-flow { grid-template-columns: 1fr; }
  .verification-flow-arrow { display: none; }
}
@media (max-width: 980px) {
  .verification-hero-card { align-items: flex-start; flex-direction: column; }
  .verification-editor-grid { grid-template-columns: 1fr; }
  .verification-preview-column { position: static; }
  .verification-role-grid { grid-template-columns: 1fr; }
}
@media (max-width: 680px) {
  .verification-section-card,
  .verification-preview-card,
  .verification-info-card,
  .verification-hero-card { padding: 12px; }
  .verification-savebar { align-items: stretch; flex-direction: column; bottom: 6px; }
  .verification-savebar .btn { width: 100%; }
}
\n\n/* === v26 Verification final polish === */\n.verification-editor-v25 {\n  --verification-small: 10px;\n  --verification-body: 11.5px;\n}\n\n.verification-hero-card {\n  grid-template-columns: minmax(0,1fr) minmax(270px,auto);\n  gap: 18px;\n}\n.verification-hero-status { min-width: min(390px, 34vw); }\n.verification-setup-status {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  width: 100%;\n  min-height: 48px;\n  padding: 9px 12px;\n  border: 1px solid rgba(255,255,255,.07);\n  border-radius: 11px;\n  background: rgba(8,13,23,.42);\n}\n.verification-setup-status.is-ready {\n  border-color: rgba(34,197,94,.17);\n  background: rgba(34,197,94,.045);\n}\n.verification-setup-status.is-warning {\n  border-color: rgba(245,158,11,.18);\n  background: rgba(245,158,11,.045);\n}\n.verification-status-icon {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 28px;\n  height: 28px;\n  flex: 0 0 auto;\n  border-radius: 9px;\n  background: rgba(245,158,11,.12);\n  color: #f7c15b;\n  font-size: 12px;\n  font-weight: 850;\n}\n.verification-setup-status.is-ready .verification-status-icon {\n  background: rgba(34,197,94,.11);\n  color: #69df8d;\n}\n.verification-setup-status > div { display:flex; min-width:0; flex-direction:column; gap:2px; }\n.verification-setup-status strong { color:#e7ecf4; font-size:11.5px; line-height:1.3; }\n.verification-setup-status small { color:var(--text-muted); font-size:10px; line-height:1.4; }\n\n.verification-editor-grid {\n  grid-template-columns: minmax(0,1.25fr) minmax(370px,.75fr);\n  gap: 16px;\n}\n.verification-channel-layout {\n  grid-template-columns: minmax(0,1fr) minmax(180px,230px);\n}\n.verification-channel-note {\n  min-height: 72px;\n  padding: 10px 11px;\n}\n.verification-channel-note small,\n.verification-section-heading small,\n.verification-role-card-head small,\n.verification-savebar small { font-size: 10px; }\n.verification-channel-note strong,\n.verification-section-heading strong,\n.verification-role-card-head strong,\n.verification-savebar strong { font-size: 11.5px; }\n.verification-inline-status { font-size: 10px; }\n\n.verification-role-card.is-secondary {\n  border-color: rgba(245,158,11,.10);\n  background: linear-gradient(145deg,rgba(245,158,11,.018),rgba(8,13,23,.25));\n}\n.verification-role-card.is-secondary .verification-role-card-head > span {\n  background: rgba(245,158,11,.08);\n  color: #d7ab5f;\n}\n\n.verification-role-flow { gap: 10px; }\n.verification-flow-step {\n  min-height: 58px;\n  padding: 13px 12px;\n}\n.verification-flow-index {\n  width: 26px;\n  height: 26px;\n  font-size: 10px;\n}\n.verification-flow-step small { font-size: 10px; }\n.verification-flow-step strong { font-size: 11.5px; }\n.verification-flow-arrow { font-size: 16px; }\n\n#verification-live-preview { min-height: 315px; }\n.verification-preview-card { padding: 17px; }\n.verification-preview-message { padding: 14px; }\n.verification-preview-bot { width:30px; height:30px; font-size:10.5px; }\n.verification-preview-author strong { font-size: 10.5px; }\n.verification-preview-author small { font-size: 8.5px; }\n.verification-preview-app { font-size: 7px; }\n.verification-preview-title { font-size: 12px; }\n.verification-preview-description { font-size: 9.6px; }\n.verification-preview-footer,\n.verification-preview-meta { font-size: 8.6px; }\n.verification-preview-button { font-size: 9.2px; }\n\n.verification-info-card { padding: 15px 16px; }\n.verification-info-card .verification-section-heading small { font-size: 10px; }\n.verification-info-list { gap: 9px; margin-top: 11px; }\n.verification-info-list span { font-size: 10.5px; line-height: 1.5; }\n\n@media (max-width: 1250px) {\n  .verification-editor-grid { grid-template-columns: minmax(0,1.08fr) minmax(340px,.92fr); }\n  .verification-channel-layout { grid-template-columns: 1fr; }\n}\n@media (max-width: 980px) {\n  .verification-hero-status { width:100%; min-width:0; }\n  .verification-editor-grid { grid-template-columns:1fr; }\n}\n

/* === v27 Verification header restore (v25 style) === */
.verification-hero-status {
  min-width: 0;
  width: auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}
.verification-status-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 28px;
  padding: 5px 9px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 8px;
  background: rgba(8,13,23,.4);
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
}
.verification-status-badge.is-ready {
  border-color: rgba(34,197,94,.15);
  color: #72dc92;
  background: rgba(34,197,94,.045);
}
.verification-status-badge.is-warning {
  border-color: rgba(245,158,11,.17);
  color: #e5b85d;
  background: rgba(245,158,11,.045);
}
.verification-status-badge .status-dot { width: 6px; height: 6px; }

/* === v27 Server Watcher 4A === */
.watcher-editor-v27 {
  display: flex;
  flex-direction: column;
  gap: 14px;
  width: 100%;
  --watcher-body: 11.5px;
  --watcher-small: 10px;
}
.watcher-editor-v27 .card { border-color: rgba(255,255,255,.055); box-shadow: none; }
.watcher-hero-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  min-height: 92px;
  padding: 16px 18px;
  border-top: 1px solid rgba(124,92,252,.45) !important;
  background: linear-gradient(110deg,rgba(124,92,252,.055),rgba(17,24,39,.78) 45%,rgba(17,24,39,.72));
}
.watcher-hero-copy { min-width: 0; }
.watcher-eyebrow {
  display: block;
  margin-bottom: 5px;
  color: #9b82ff;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .055em;
}
.watcher-hero-copy h2 { margin: 0; color:#f5f7fb; font-size:18px; line-height:1.25; }
.watcher-hero-copy p { margin: 6px 0 0; color:var(--text-secondary); font-size:12.5px; line-height:1.5; }
.watcher-hero-status { display:flex; align-items:center; justify-content:flex-end; gap:8px; flex-wrap:wrap; }
.watcher-status-badge {
  display:inline-flex; align-items:center; gap:6px; padding:6px 9px;
  border:1px solid rgba(255,255,255,.07); border-radius:8px;
  background:rgba(8,13,23,.42); color:var(--text-secondary); font-size:10px; font-weight:700; white-space:nowrap;
}
.watcher-status-badge.is-ready { color:#72dc92; border-color:rgba(34,197,94,.15); background:rgba(34,197,94,.045); }
.watcher-status-badge .status-dot { width:6px; height:6px; }
.watcher-kpi-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.watcher-kpi-card {
  position:relative; min-height:92px; padding:14px 16px; overflow:hidden;
  border:1px solid rgba(255,255,255,.055); border-radius:12px; background:var(--card-bg,#111827);
}
.watcher-kpi-card::before { content:""; position:absolute; top:0; left:0; right:0; height:1px; background:rgba(124,92,252,.55); }
.watcher-kpi-card > span { display:block; color:#7f8da3; font-size:9.5px; font-weight:800; letter-spacing:.04em; }
.watcher-kpi-card > strong { display:block; margin-top:8px; color:#f3f6fb; font-size:25px; line-height:1; }
.watcher-kpi-card > small { display:block; margin-top:6px; color:var(--text-muted); font-size:10px; line-height:1.4; }
.watcher-section-card, .watcher-create-card { padding:16px; }
.watcher-section-heading { display:flex; align-items:center; gap:9px; min-width:0; }
.watcher-section-heading-bordered { padding-bottom:12px; margin-bottom:12px; border-bottom:1px solid rgba(255,255,255,.055); }
.watcher-section-icon {
  display:grid; place-items:center; width:28px; height:28px; flex:0 0 auto; border-radius:9px;
  background:rgba(124,92,252,.11); color:#ac9bff; font-size:11px; font-weight:800;
}
.watcher-section-heading > div { display:flex; min-width:0; flex-direction:column; gap:2px; }
.watcher-section-heading strong { color:#e6ebf3; font-size:11.5px; }
.watcher-section-heading small { color:var(--text-muted); font-size:10px; line-height:1.45; }
.watcher-section-count { margin-left:auto; min-width:26px; padding:3px 7px; border-radius:999px; background:rgba(124,92,252,.09); color:#aa98ff; text-align:center; font-size:9.5px; font-weight:800; }
.watcher-server-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.watcher-server-card {
  display:flex; flex-direction:column; gap:11px; min-width:0; padding:13px;
  border:1px solid rgba(255,255,255,.055); border-left:2px solid rgba(100,116,139,.45);
  border-radius:11px; background:rgba(8,13,23,.32); transition:border-color .16s ease,background .16s ease,transform .16s ease;
}
.watcher-server-card:hover { border-color:rgba(124,92,252,.14); background:rgba(124,92,252,.025); transform:translateY(-1px); }
.watcher-server-card.is-online { border-left-color:rgba(34,197,94,.75); }
.watcher-server-card.is-offline { border-left-color:rgba(239,68,68,.65); }
.watcher-server-head { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.watcher-server-title { display:flex; align-items:center; gap:9px; min-width:0; }
.watcher-server-title > div { min-width:0; display:flex; flex-direction:column; gap:2px; }
.watcher-server-title strong { overflow:hidden; color:#eef2f8; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.watcher-server-title small { color:var(--text-muted); font-size:9.5px; }
.watcher-server-status { width:9px; height:9px; flex:0 0 auto; border-radius:50%; background:#64748b; box-shadow:0 0 0 4px rgba(100,116,139,.08); }
.watcher-server-status.is-online { background:#22c55e; box-shadow:0 0 0 4px rgba(34,197,94,.08); }
.watcher-server-status.is-offline { background:#ef4444; box-shadow:0 0 0 4px rgba(239,68,68,.08); }
.watcher-state-pill { padding:4px 7px; border-radius:999px; background:rgba(100,116,139,.1); color:#9ba8ba; font-size:8.8px; font-weight:800; }
.watcher-state-pill.is-online { background:rgba(34,197,94,.09); color:#61db86; }
.watcher-state-pill.is-offline { background:rgba(239,68,68,.09); color:#ee7a7a; }
.watcher-address-row { display:flex; align-items:center; gap:7px; min-width:0; padding:8px 9px; border:1px solid rgba(255,255,255,.05); border-radius:8px; background:#090f1a; }
.watcher-address-row code { flex:1; min-width:0; overflow:hidden; color:#bec8d8; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.watcher-copy-btn { width:25px; height:25px; display:grid; place-items:center; border:0; border-radius:7px; background:rgba(124,92,252,.09); color:#ad9cff; cursor:pointer; }
.watcher-server-metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; }
.watcher-server-metrics > div { min-width:0; padding:8px 9px; border:1px solid rgba(255,255,255,.045); border-radius:8px; background:rgba(17,24,39,.56); }
.watcher-server-metrics small { display:block; color:var(--text-muted); font-size:8.7px; }
.watcher-server-metrics strong { display:block; margin-top:3px; overflow:hidden; color:#dce3ed; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.watcher-discord-row { display:flex; align-items:center; gap:14px; flex-wrap:wrap; color:#8c99ac; font-size:9.2px; }
.watcher-discord-row span { display:inline-flex; align-items:center; gap:5px; }
.watcher-discord-row i { color:#9b82ff; font-style:normal; font-weight:800; }
.watcher-discord-row .is-muted { opacity:.6; }
.watcher-server-actions { display:flex; align-items:center; gap:7px; margin-top:auto; padding-top:2px; }
.watcher-server-actions .btn-danger { margin-left:auto; }
.watcher-empty-state { display:flex; min-height:220px; flex-direction:column; align-items:center; justify-content:center; gap:8px; text-align:center; }
.watcher-empty-icon { display:grid; place-items:center; width:42px; height:42px; border-radius:12px; background:rgba(124,92,252,.1); color:#ab9aff; font-size:16px; }
.watcher-empty-state strong { color:#e6ebf3; font-size:12px; }
.watcher-empty-state small { max-width:460px; color:var(--text-muted); font-size:10px; line-height:1.5; }
.watcher-empty-state .btn { margin-top:4px; }
.watcher-create-grid { display:grid; grid-template-columns:1fr 1.15fr .95fr; gap:10px; align-items:stretch; }
.watcher-config-group { min-width:0; padding:12px; border:1px solid rgba(255,255,255,.05); border-radius:10px; background:rgba(8,13,23,.28); }
.watcher-config-head { display:flex; align-items:center; gap:8px; margin-bottom:11px; }
.watcher-config-head > span { display:grid; place-items:center; width:25px; height:25px; flex:0 0 auto; border-radius:8px; background:rgba(124,92,252,.1); color:#ae9eff; font-size:9.5px; font-weight:850; }
.watcher-config-head > div { display:flex; min-width:0; flex-direction:column; gap:2px; }
.watcher-config-head strong { color:#e2e8f1; font-size:11px; }
.watcher-config-head small { color:var(--text-muted); font-size:9.4px; line-height:1.4; }
.watcher-form-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.watcher-form-grid .field:first-child { grid-column:1/-1; }
.watcher-config-group .field-label, .watcher-edit-section .field-label { font-size:9.7px; }
.watcher-config-group .input, .watcher-edit-section .input { min-height:38px; }
.watcher-game-results { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; max-height:180px; overflow:auto; margin-top:6px; }
.watcher-game-result { display:flex; align-items:center; gap:8px; width:100%; padding:8px; border:1px solid rgba(255,255,255,.05); border-radius:8px; background:#0a101b; color:inherit; text-align:left; cursor:pointer; }
.watcher-game-result:hover { border-color:rgba(124,92,252,.2); background:rgba(124,92,252,.04); }
.watcher-game-result-icon { display:grid; place-items:center; width:26px; height:26px; flex:0 0 auto; border-radius:7px; background:rgba(124,92,252,.1); color:#a996ff; }
.watcher-game-result > span:last-child { min-width:0; display:flex; flex-direction:column; gap:2px; }
.watcher-game-result strong { color:#dde5ef; font-size:9.8px; }
.watcher-game-result small { color:var(--text-muted); font-size:8.5px; }
.watcher-game-result code { color:#a694ff; }
.watcher-selected-game { display:flex; align-items:center; gap:7px; min-height:30px; margin:7px 0 0; padding:6px 8px; border:1px solid rgba(124,92,252,.1); border-radius:8px; background:rgba(124,92,252,.035); color:var(--text-secondary); font-size:9px; }
.watcher-selected-game span { color:var(--text-muted); }
.watcher-selected-game strong { color:#dcd4ff; }
.watcher-selected-game code { margin-left:auto; color:#9c89fb; font-size:8.5px; }
.watcher-extra-fields { margin-top:9px; }
.watcher-config-discord .picker-field { margin:0; }
.watcher-discord-note { display:flex; align-items:center; gap:8px; margin-top:10px; padding:9px; border:1px solid rgba(124,92,252,.08); border-radius:9px; background:rgba(124,92,252,.025); }
.watcher-discord-note > span { display:grid; place-items:center; width:26px; height:26px; flex:0 0 auto; border-radius:7px; background:rgba(124,92,252,.1); color:#aa98ff; }
.watcher-discord-note > div { display:flex; flex-direction:column; gap:2px; }
.watcher-discord-note strong { color:#dfe5ed; font-size:9.8px; }
.watcher-discord-note small { color:var(--text-muted); font-size:8.9px; line-height:1.4; }
.watcher-create-actions { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-top:12px; padding-top:12px; border-top:1px solid rgba(255,255,255,.055); }
.watcher-create-actions > div:first-child { display:flex; min-width:0; flex-direction:column; gap:2px; }
.watcher-create-actions strong { color:#dfe5ed; font-size:10.5px; }
.watcher-create-actions small { color:var(--text-muted); font-size:9px; }

/* v27 watcher edit modal */
.watcher-edit-modal-card { width:min(980px,calc(100vw - 32px)); max-height:min(86vh,820px); overflow:hidden; padding:0; }
.watcher-edit-modal-header { align-items:flex-start; padding:16px 18px 13px; border-bottom:1px solid rgba(255,255,255,.055); }
.watcher-edit-modal-header > div { display:flex; min-width:0; flex-direction:column; gap:3px; }
.watcher-modal-eyebrow { color:#9a82ff; font-size:9px; font-weight:800; letter-spacing:.055em; }
.watcher-edit-modal-header h3 { margin:0; color:#f1f4f9; font-size:17px; }
.watcher-modal-meta { margin:1px 0 0; color:var(--text-muted); font-size:9.5px; }
.watcher-edit-form { display:flex; min-height:0; flex-direction:column; }
.watcher-edit-grid { display:grid; grid-template-columns:1.1fr .9fr; gap:10px; min-height:0; max-height:calc(86vh - 145px); padding:14px 16px; overflow:auto; scrollbar-width:thin; scrollbar-color:#334155 transparent; }
.watcher-edit-section { min-width:0; height:max-content; padding:12px; border:1px solid rgba(255,255,255,.055); border-radius:10px; background:rgba(8,13,23,.3); }
.watcher-channel-fields { grid-template-columns:1fr; }
.watcher-edit-options { margin-top:10px; }
.watcher-edit-note { margin-top:10px; }
.watcher-modal-actions { margin:0; padding:11px 16px 14px; border-top:1px solid rgba(255,255,255,.055); background:#101827; }

@media (max-width: 1280px) {
  .watcher-create-grid { grid-template-columns:1fr 1fr; }
  .watcher-config-discord { grid-column:1/-1; }
}
@media (max-width: 980px) {
  .watcher-hero-card { align-items:flex-start; flex-direction:column; }
  .watcher-hero-status { justify-content:flex-start; }
  .watcher-kpi-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .watcher-server-grid { grid-template-columns:1fr; }
  .watcher-create-grid { grid-template-columns:1fr; }
  .watcher-config-discord { grid-column:auto; }
  .watcher-edit-grid { grid-template-columns:1fr; }
}
@media (max-width: 650px) {
  .watcher-kpi-grid { grid-template-columns:1fr; }
  .watcher-server-metrics { grid-template-columns:1fr; }
  .watcher-form-grid { grid-template-columns:1fr; }
  .watcher-form-grid .field:first-child { grid-column:auto; }
  .watcher-game-results { grid-template-columns:1fr; }
  .watcher-create-actions { align-items:stretch; flex-direction:column; }
  .watcher-create-actions .actions { width:100%; }
  .watcher-create-actions .btn { flex:1; }
}
.watcher-edit-game-pick {
  display:flex; align-items:center; gap:8px; width:100%; padding:8px;
  border:1px solid rgba(255,255,255,.05); border-radius:8px;
  background:#0a101b; color:inherit; text-align:left; cursor:pointer;
}
.watcher-edit-game-pick:hover { border-color:rgba(124,92,252,.2); background:rgba(124,92,252,.04); }
.watcher-edit-game-pick strong { color:#dde5ef; font-size:9.8px; }
.watcher-edit-game-pick span { color:var(--text-muted); font-size:8.5px; }


/* v28 Server Watcher final polish */
.watcher-server-card { padding:13px; gap:10px; }
.watcher-server-title strong { font-size:12.5px; }
.watcher-server-title small { font-size:10.2px; line-height:1.4; }
.watcher-state-pill { padding:5px 9px; font-size:9.6px; letter-spacing:.01em; }
.watcher-server-metrics small { font-size:9.4px; }
.watcher-server-metrics strong { font-size:10.8px; }
.watcher-discord-row { gap:16px; font-size:10px; line-height:1.4; }
.watcher-server-actions { margin-top:2px; padding-top:9px; border-top:1px solid rgba(255,255,255,.05); }
.watcher-server-actions .btn { min-height:31px; }
.watcher-server-actions .btn-danger { margin-left:auto; }
.watcher-game-results { max-height:148px; padding-right:3px; scrollbar-width:thin; scrollbar-color:#334155 transparent; }
.watcher-game-results::-webkit-scrollbar { width:7px; }
.watcher-game-results::-webkit-scrollbar-thumb { border-radius:999px; background:#334155; }
.watcher-game-result { padding:7px 8px; }
.watcher-game-result strong { font-size:10.2px; }
.watcher-game-result small { font-size:9px; }
.watcher-config-discord { display:flex; flex-direction:column; }
.watcher-discord-preview { margin-top:10px; padding:11px; border:1px solid rgba(124,92,252,.1); border-radius:10px; background:#090f1a; }
.watcher-preview-head { display:flex; align-items:center; gap:8px; }
.watcher-preview-head > div { display:flex; min-width:0; flex:1; flex-direction:column; gap:1px; }
.watcher-preview-head strong { overflow:hidden; color:#e7ebf2; font-size:10.8px; text-overflow:ellipsis; white-space:nowrap; }
.watcher-preview-head small { color:var(--text-muted); font-size:9.3px; }
.watcher-preview-head > span:last-child { padding:3px 6px; border-radius:999px; background:rgba(124,92,252,.1); color:#aa98ff; font-size:8.8px; font-weight:800; }
.watcher-preview-dot { width:8px; height:8px; flex:0 0 auto; border-radius:50%; background:#22c55e; box-shadow:0 0 0 4px rgba(34,197,94,.08); }
.watcher-discord-preview code { display:block; margin-top:9px; padding:7px 8px; border-radius:7px; background:rgba(17,24,39,.75); color:#b8c4d5; font-size:9.6px; }
.watcher-preview-meta { display:grid; grid-template-columns:1fr 1fr; gap:6px; margin-top:7px; }
.watcher-preview-meta span { padding:7px 8px; border:1px solid rgba(255,255,255,.04); border-radius:7px; color:var(--text-muted); font-size:9px; }
.watcher-preview-meta strong { display:block; margin-top:2px; overflow:hidden; color:#dce4ee; font-size:9.5px; text-overflow:ellipsis; white-space:nowrap; }
.watcher-kpi-card > span { font-size:10px; }
.watcher-kpi-card > small { font-size:10.2px; }
.watcher-edit-game-pick strong { font-size:10.2px; }
.watcher-edit-game-pick span { font-size:9px; }
@media (max-width: 760px) {
  .watcher-preview-meta { grid-template-columns:1fr; }
}

/* === v29 Reaktionsrollen / Rollen-Panels === */
.roles-page-v29,
.roles-panel-editor-v29 {
  --roles-small: 10px;
  --roles-body: 11.5px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding-bottom: 28px;
}
.roles-hero-card,
.roles-edit-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  min-height: 92px;
  padding: 18px 20px;
  border-top: 1px solid rgba(124,92,252,.65);
  background: linear-gradient(120deg,rgba(124,92,252,.055),rgba(17,24,39,.88) 42%,rgba(12,18,30,.9));
}
.roles-eyebrow {
  display: block;
  margin-bottom: 7px;
  color: #9b84ff;
  font-size: 10px;
  line-height: 1;
  font-weight: 850;
  letter-spacing: .045em;
}
.roles-hero-title-row,
.roles-edit-title-row {
  display: flex;
  align-items: center;
  gap: 12px;
}
.roles-hero-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  flex: 0 0 auto;
  border-radius: 11px;
  background: rgba(124,92,252,.12);
  color: #a98fff;
  font-size: 17px;
}
.roles-hero-icon .nav-svg { width: 19px; height: 19px; stroke: currentColor; fill: none; stroke-width: 1.7; }
.roles-hero-copy h2,
.roles-edit-hero h2 { margin: 0; color: #f4f7fb; font-size: 19px; line-height: 1.25; font-weight: 780; }
.roles-hero-copy p,
.roles-edit-hero p { margin: 4px 0 0; color: #94a2b7; font-size: 10.5px; line-height: 1.45; }
.roles-hero-badges,
.roles-edit-hero-actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 8px; }
.roles-status-badge,
.roles-panel-state,
.roles-count-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  padding: 4px 8px;
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 999px;
  background: rgba(9,14,24,.7);
  color: #a9b4c5;
  font-size: 9.5px;
  font-weight: 750;
  white-space: nowrap;
}
.roles-status-badge.is-success,
.roles-panel-state.is-success { border-color: rgba(34,197,94,.16); background: rgba(34,197,94,.07); color: #54d97e; }
.roles-panel-state.is-warning { border-color: rgba(245,158,11,.16); background: rgba(245,158,11,.07); color: #e7b552; }
.roles-kpi-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; }
.roles-kpi-card { position: relative; min-height: 92px; padding: 14px 16px; overflow: hidden; }
.roles-kpi-card::before { content:""; position:absolute; inset:0 0 auto; height:2px; background:rgba(124,92,252,.72); }
.roles-kpi-label { color: #8190a6; font-size: 9.5px; font-weight: 800; letter-spacing: .035em; }
.roles-kpi-card strong { display:block; margin-top: 7px; color:#f5f7fb; font-size:22px; line-height:1; font-weight:800; }
.roles-kpi-card small { display:block; margin-top:6px; color:#8492a6; font-size:10px; line-height:1.4; }
.roles-section-card,
.roles-preview-card,
.roles-guide-card,
.roles-config-card { padding: 15px 16px; }
.roles-section-heading,
.roles-config-head {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  padding-bottom: 11px;
  border-bottom: 1px solid rgba(255,255,255,.055);
}
.roles-section-heading > div,
.roles-config-head > div { display:flex; min-width:0; flex-direction:column; gap:2px; }
.roles-section-heading strong,
.roles-config-head strong,
.roles-mini-heading strong { color:#e9edf5; font-size:11.5px; line-height:1.35; }
.roles-section-heading small,
.roles-config-head small,
.roles-mini-heading small { color:#7e8ca0; font-size:10px; line-height:1.4; }
.roles-section-icon,
.roles-config-head > span:first-child {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  flex: 0 0 auto;
  border-radius: 9px;
  background: rgba(124,92,252,.10);
  color: #a38aff;
  font-size: 10.5px;
  font-weight: 850;
}
.roles-section-heading .roles-count-pill { margin-left:auto; min-width:26px; }
.roles-autorole-layout { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(310px,.65fr); gap:14px; margin-top:12px; }
.roles-autorole-list { display:flex; align-content:flex-start; flex-wrap:wrap; gap:8px; min-width:0; }
.roles-autorole-chip {
  display:flex;
  align-items:center;
  gap:9px;
  min-width:210px;
  padding:9px 10px;
  border:1px solid rgba(255,255,255,.055);
  border-radius:10px;
  background:rgba(8,13,23,.38);
}
.roles-role-dot { width:8px; height:8px; flex:0 0 auto; border-radius:999px; background:#7c5cfc; box-shadow:0 0 0 4px rgba(124,92,252,.08); }
.roles-autorole-chip > div { min-width:0; display:flex; flex-direction:column; gap:2px; }
.roles-autorole-chip strong { color:#e5eaf2; font-size:10.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.roles-autorole-chip small { color:#758397; font-size:9px; }
.roles-chip-remove { margin-left:auto; width:25px; height:25px; border:0; border-radius:7px; background:transparent; color:#7e899b; cursor:pointer; font-size:14px; }
.roles-chip-remove:hover { background:rgba(239,68,68,.08); color:#f47c7c; }
.roles-autorole-add { display:flex; flex-direction:column; gap:9px; padding:12px; border:1px solid rgba(124,92,252,.09); border-radius:11px; background:rgba(124,92,252,.018); }
.roles-mini-heading { display:flex; flex-direction:column; gap:2px; }
.roles-autorole-add .picker-field { margin:0; }
.roles-empty-compact { display:flex; align-items:center; gap:10px; min-height:66px; padding:12px; border:1px dashed rgba(255,255,255,.07); border-radius:10px; color:#738096; }
.roles-empty-compact > span { display:inline-flex; align-items:center; justify-content:center; width:30px; height:30px; border-radius:9px; background:rgba(124,92,252,.08); color:#9f88ff; }
.roles-empty-compact div { display:flex; flex-direction:column; gap:2px; }
.roles-empty-compact strong { color:#cdd5e0; font-size:10.5px; }
.roles-empty-compact small { font-size:9.5px; }
.roles-panel-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:12px; }
.roles-panel-card { position:relative; display:flex; flex-direction:column; gap:10px; min-width:0; padding:12px; border:1px solid rgba(255,255,255,.055); border-left:2px solid rgba(124,92,252,.72); border-radius:11px; background:rgba(9,14,24,.46); }
.roles-panel-card.is-published { border-left-color:rgba(34,197,94,.78); }
.roles-panel-card-head { display:flex; align-items:center; gap:9px; min-width:0; }
.roles-panel-card-icon { display:inline-flex; align-items:center; justify-content:center; width:30px; height:30px; flex:0 0 auto; border-radius:9px; background:rgba(124,92,252,.1); font-size:13px; }
.roles-panel-card-title { min-width:0; display:flex; flex:1; flex-direction:column; gap:2px; }
.roles-panel-card-title strong { color:#edf1f7; font-size:11.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.roles-panel-card-title small { color:#7f8da0; font-size:9.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.roles-panel-description { margin:0; min-height:30px; color:#98a5b7; font-size:10px; line-height:1.5; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.roles-panel-meta-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; }
.roles-panel-meta-grid > div { padding:8px 9px; border:1px solid rgba(255,255,255,.045); border-radius:8px; background:rgba(17,24,39,.5); }
.roles-panel-meta-grid small { display:block; color:#68768a; font-size:8.5px; text-transform:uppercase; letter-spacing:.025em; }
.roles-panel-meta-grid strong { display:block; margin-top:3px; color:#dce3ed; font-size:10px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.roles-panel-card-actions { display:flex; align-items:center; gap:7px; padding-top:9px; border-top:1px solid rgba(255,255,255,.045); }
.roles-panel-card-actions .roles-panel-delete { margin-left:auto; }
.roles-empty-panel { display:flex; min-height:120px; align-items:center; justify-content:center; flex-direction:column; gap:5px; margin-top:12px; border:1px dashed rgba(255,255,255,.07); border-radius:11px; color:#768397; }
.roles-empty-panel .roles-empty-icon { font-size:24px; opacity:.8; }
.roles-empty-panel strong { color:#ccd4df; font-size:11.5px; }
.roles-empty-panel small { font-size:10px; }
.roles-create-shell,
.roles-edit-grid { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(360px,.7fr); gap:14px; align-items:start; }
.roles-create-main,
.roles-edit-main { display:flex; flex-direction:column; gap:12px; min-width:0; }
.roles-create-main { padding:0; background:transparent; border:0; box-shadow:none; }
.roles-create-main > .roles-section-heading { padding:15px 16px 11px; border:1px solid rgba(255,255,255,.055); border-radius:11px; background:var(--card); }
.roles-config-card { border:1px solid rgba(255,255,255,.055); border-radius:11px; background:var(--card); }
.roles-config-head-actions > div { flex:1; }
.roles-config-head-actions .btn { margin-left:auto; }
.roles-form-grid { margin-top:12px; grid-template-columns:repeat(2,minmax(0,1fr)); }
.roles-form-grid .full { grid-column:1/-1; }
.roles-description-input { min-height:92px; }
.roles-mode-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:12px; }
.roles-mode-option { position:relative; display:flex; min-width:0; cursor:pointer; }
.roles-mode-option input { position:absolute; opacity:0; pointer-events:none; }
.roles-mode-option span { display:flex; width:100%; min-height:67px; flex-direction:column; gap:3px; padding:10px; border:1px solid rgba(255,255,255,.055); border-radius:10px; background:rgba(8,13,23,.32); transition:150ms ease; }
.roles-mode-option strong { color:#dce3ed; font-size:10.5px; }
.roles-mode-option small { color:#748196; font-size:9.3px; line-height:1.4; }
.roles-mode-option input:checked + span { border-color:rgba(124,92,252,.38); background:rgba(124,92,252,.075); box-shadow:inset 0 0 0 1px rgba(124,92,252,.08); }
.roles-mode-option input:checked + span strong { color:#b7a5ff; }
.roles-options-row { display:grid; grid-template-columns:minmax(200px,.42fr) minmax(0,1fr); gap:10px; margin-top:10px; }
.roles-toggle-tile { display:flex; align-items:center; justify-content:space-between; gap:14px; min-height:67px; padding:10px 11px; border:1px solid rgba(255,255,255,.055); border-radius:10px; background:rgba(8,13,23,.3); }
.roles-toggle-tile > div { display:flex; flex-direction:column; gap:3px; }
.roles-toggle-tile strong { color:#dce3ed; font-size:10.5px; }
.roles-toggle-tile small,.field-help { color:#748196; font-size:9.3px; line-height:1.4; }
.roles-entry-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; margin-top:12px; }
.roles-role-config-card { display:block; padding:10px; border:1px solid rgba(255,255,255,.055); border-radius:10px; background:rgba(8,13,23,.35); }
.roles-role-config-head { display:flex; align-items:center; gap:8px; padding-bottom:9px; margin-bottom:9px; border-bottom:1px solid rgba(255,255,255,.045); }
.roles-role-index { display:inline-flex; align-items:center; justify-content:center; width:25px; height:25px; flex:0 0 auto; border-radius:8px; background:rgba(124,92,252,.1); color:#a38aff; font-size:9px; font-weight:850; }
.roles-role-config-head > div { min-width:0; display:flex; flex:1; flex-direction:column; gap:2px; }
.roles-role-config-head strong { color:#dfe5ed; font-size:10.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.roles-role-config-head small { color:#738095; font-size:9px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.roles-role-config-fields { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,.9fr) minmax(130px,.5fr); gap:8px; }
.roles-role-config-fields .field { min-width:0; margin:0; }
.roles-role-config-fields .picker-search { min-height:32px; }
.roles-savebar { position:sticky; bottom:10px; z-index:12; display:flex; align-items:center; justify-content:space-between; gap:15px; padding:10px 12px; border:1px solid rgba(124,92,252,.12); border-radius:11px; background:rgba(14,21,35,.96); box-shadow:0 10px 26px rgba(0,0,0,.18); backdrop-filter:blur(10px); }
.roles-savebar > div { display:flex; min-width:0; flex-direction:column; gap:2px; }
.roles-savebar strong { color:#dfe5ed; font-size:11.5px; }
.roles-savebar small { color:#7e8ca0; font-size:10px; line-height:1.4; }
.roles-preview-column { position:sticky; top:64px; display:flex; flex-direction:column; gap:12px; min-width:0; }
.roles-preview-card { min-height:340px; }
.roles-guide-list { display:flex; flex-direction:column; gap:8px; margin-top:10px; }
.roles-guide-list span { padding:8px 9px; border:1px solid rgba(255,255,255,.045); border-radius:8px; background:rgba(8,13,23,.28); color:#8e9bad; font-size:9.7px; line-height:1.5; }
.roles-guide-list b { color:#cfd6e1; }
.roles-discord-message { margin-top:12px; padding:12px; border:1px solid rgba(255,255,255,.055); border-radius:10px; background:#0b1019; }
.roles-discord-author { display:flex; align-items:center; gap:5px; margin-bottom:9px; color:#e6ebf2; font-size:9px; }
.roles-discord-avatar { display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px; border-radius:50%; background:#7c5cfc; color:white; font-size:10px; font-weight:800; }
.roles-discord-author strong { font-size:9.5px; }
.roles-discord-app { padding:2px 4px; border-radius:3px; background:#5865f2; color:#fff; font-size:6.5px; font-weight:800; }
.roles-discord-author small { color:#657186; font-size:7.5px; }
.roles-discord-embed { position:relative; padding:11px 12px 10px 14px; border-radius:4px; background:#151a22; overflow:hidden; }
.roles-discord-embed::before { content:""; position:absolute; inset:0 auto 0 0; width:4px; background:#5865f2; }
.roles-discord-title { display:block; color:#f0f2f5; font-size:11px; line-height:1.35; }
.roles-discord-description { margin-top:6px; color:#c0c7d2; font-size:8.8px; line-height:1.5; overflow-wrap:anywhere; }
.roles-discord-field-title { margin-top:10px; color:#f0f2f5; font-size:8.8px; font-weight:700; }
.roles-discord-role-list { display:flex; flex-direction:column; gap:3px; margin-top:5px; color:#c8ced8; font-size:8.6px; }
.roles-discord-role-list b { margin-right:3px; }
.roles-discord-role-list .is-muted { color:#707c8d; }
.roles-discord-footer { margin-top:9px; color:#808b9c; font-size:7.8px; line-height:1.4; }
.roles-discord-select { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:8px; min-height:32px; padding:7px 9px; border:1px solid #202631; border-radius:4px; background:#111720; color:#b4bdc9; font-size:8.5px; }
.roles-discord-clear { margin-top:7px; min-height:28px; padding:6px 8px; border:0; border-radius:4px; background:#4e5058; color:#f0f1f3; font-size:8px; }
.roles-discord-meta { display:flex; justify-content:space-between; gap:8px; margin-top:8px; color:#677386; font-size:7.8px; }
.roles-discord-meta span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.roles-edit-shell { display:flex; flex-direction:column; gap:14px; }
.roles-edit-hero { margin-bottom:0; }
.roles-edit-grid { align-items:start; }
.roles-edit-preview-column { top:64px; }
.roles-sync-meta { display:grid; grid-template-columns:1fr 1fr; gap:7px; margin-top:10px; }
.roles-sync-meta span { padding:8px; border:1px solid rgba(255,255,255,.045); border-radius:8px; background:rgba(8,13,23,.28); min-width:0; }
.roles-sync-meta small { display:block; color:#68768a; font-size:8.5px; text-transform:uppercase; }
.roles-sync-meta strong { display:block; margin-top:3px; color:#dce3ed; font-size:9.8px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

@media (max-width: 1280px) {
  .roles-autorole-layout { grid-template-columns:1fr; }
  .roles-create-shell,.roles-edit-grid { grid-template-columns:minmax(0,1.25fr) minmax(330px,.75fr); }
  .roles-role-config-fields { grid-template-columns:1fr 1fr; }
  .roles-role-config-fields > :last-child { grid-column:1/-1; }
}
@media (max-width: 1050px) {
  .roles-kpi-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .roles-panel-grid { grid-template-columns:1fr; }
  .roles-create-shell,.roles-edit-grid { grid-template-columns:1fr; }
  .roles-preview-column { position:static; }
  .roles-preview-card { min-height:0; }
}
@media (max-width: 760px) {
  .roles-hero-card,.roles-edit-hero { align-items:flex-start; flex-direction:column; }
  .roles-hero-badges,.roles-edit-hero-actions { justify-content:flex-start; }
  .roles-kpi-grid,.roles-entry-grid,.roles-mode-grid,.roles-options-row,.roles-form-grid { grid-template-columns:1fr; }
  .roles-form-grid .full { grid-column:auto; }
  .roles-role-config-fields { grid-template-columns:1fr; }
  .roles-role-config-fields > :last-child { grid-column:auto; }
  .roles-panel-meta-grid { grid-template-columns:1fr 1fr; }
  .roles-panel-card-actions { flex-wrap:wrap; }
  .roles-panel-card-actions .roles-panel-delete { margin-left:0; }
  .roles-savebar { position:static; align-items:flex-start; flex-direction:column; }
  .roles-savebar .btn { width:100%; }
}

/* === v30 Reaktionsrollen final polish === */
.roles-page-v29,
.roles-panel-editor-v29 {
  --roles-small: 10px;
  --roles-body: 11.5px;
}

/* Auto-Roles: vorhandene Rollen nutzen die Fläche, Add-Panel bleibt kompakt. */
.roles-autorole-layout {
  grid-template-columns: minmax(0,1fr) minmax(330px,420px);
  gap: 12px;
  align-items: start;
}
.roles-autorole-list {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(250px,1fr));
  gap: 8px;
  align-content: start;
}
.roles-autorole-chip {
  width: 100%;
  min-width: 0;
  min-height: 58px;
  padding: 10px 12px;
}
.roles-autorole-chip strong { font-size: 11.5px; }
.roles-autorole-chip small { font-size: 10px; }
.roles-autorole-add {
  width: 100%;
  padding: 13px;
  gap: 10px;
}
.roles-autorole-add .btn { min-height: 38px; }

/* Panel-Liste: ein einzelnes Panel füllt die Zeile, mehrere Panels reagieren responsiv. */
.roles-panel-grid {
  grid-template-columns: repeat(auto-fit,minmax(440px,1fr));
  gap: 11px;
}
.roles-panel-card {
  gap: 11px;
  padding: 14px;
}
.roles-panel-card-head { gap: 10px; }
.roles-panel-card-icon { width: 32px; height: 32px; }
.roles-panel-card-title strong { font-size: 12px; }
.roles-panel-card-title small { font-size: 10px; }
.roles-panel-state { font-size: 10px; padding-inline: 9px; }
.roles-panel-description {
  min-height: 0;
  font-size: 10.5px;
  line-height: 1.5;
}
.roles-panel-meta-grid { gap: 8px; }
.roles-panel-meta-grid > div { padding: 9px 10px; }
.roles-panel-meta-grid small { font-size: 9px; }
.roles-panel-meta-grid strong { margin-top: 4px; font-size: 11px; }
.roles-panel-card-actions {
  gap: 8px;
  padding-top: 10px;
}
.roles-panel-card-actions .btn-ghost {
  border: 1px solid rgba(124,92,252,.20);
  background: rgba(124,92,252,.075);
  color: #b9a9ff;
}
.roles-panel-card-actions .btn-ghost:hover {
  border-color: rgba(124,92,252,.34);
  background: rgba(124,92,252,.12);
  color: #d0c6ff;
}
.roles-panel-card-actions .roles-panel-delete { margin-left: auto; }

/* Editor: dichter, Preview bleibt klar rechts und sticky. */
.roles-create-shell,
.roles-edit-grid {
  grid-template-columns: minmax(0,1.68fr) minmax(380px,.72fr);
  gap: 12px;
}
.roles-create-main,
.roles-edit-main { gap: 10px; }
.roles-create-main > .roles-section-heading { padding: 13px 15px 10px; }
.roles-section-card,
.roles-preview-card,
.roles-guide-card,
.roles-config-card { padding: 14px 15px; }
.roles-config-head { padding-bottom: 10px; }
.roles-form-grid { margin-top: 10px; gap: 10px; }
.roles-description-input { min-height: 84px; }
.roles-mode-grid { margin-top: 10px; gap: 7px; }
.roles-mode-option span { min-height: 64px; padding: 10px 11px; }
.roles-options-row { margin-top: 9px; gap: 9px; }
.roles-entry-grid { margin-top: 10px; gap: 8px; }
.roles-role-config-card { padding: 10px 11px; }
.roles-preview-column {
  top: 58px;
  gap: 10px;
}
.roles-preview-card { min-height: 320px; }
.roles-guide-card { padding-top: 13px; padding-bottom: 13px; }
.roles-guide-list { gap: 7px; margin-top: 9px; }
.roles-savebar { bottom: 10px; margin-top: 2px; }

/* gemeinsame 4A Mikrotypografie */
.roles-section-heading strong,
.roles-config-head strong,
.roles-mini-heading strong,
.roles-savebar strong { font-size: 11.5px; }
.roles-section-heading small,
.roles-config-head small,
.roles-mini-heading small,
.roles-savebar small { font-size: 10px; }
.roles-mode-option strong,
.roles-toggle-tile strong,
.roles-role-config-head strong { font-size: 11px; }
.roles-mode-option small,
.roles-toggle-tile small,
.roles-role-config-head small,
.roles-guide-list span,
.roles-sync-meta strong { font-size: 10px; }

@media (max-width: 1400px) {
  .roles-create-shell,
  .roles-edit-grid { grid-template-columns: minmax(0,1.4fr) minmax(350px,.75fr); }
  .roles-autorole-layout { grid-template-columns:minmax(0,1fr) minmax(310px,380px); }
}
@media (max-width: 1150px) {
  .roles-autorole-layout { grid-template-columns: 1fr; }
  .roles-panel-grid { grid-template-columns: 1fr; }
  .roles-create-shell,
  .roles-edit-grid { grid-template-columns: 1fr; }
  .roles-preview-column { position: static; }
  .roles-preview-card { min-height: 0; }
}
@media (max-width: 760px) {
  .roles-autorole-list { grid-template-columns:1fr; }
  .roles-panel-grid { grid-template-columns:1fr; }
}

/* === v31 Reaktionsrollen final compact fix === */
.roles-autorole-section { padding-bottom: 13px; }
.roles-autorole-section .roles-autorole-layout { margin-top: 10px; }
.roles-autorole-section .roles-autorole-chip { min-height: 54px; }
@media (min-width: 1160px) {
  .roles-autorole-section .roles-autorole-layout {
    grid-template-columns: minmax(260px,1fr) minmax(650px,1.15fr);
    align-items: start;
  }
  .roles-autorole-section .roles-autorole-add {
    display: grid;
    grid-template-columns: minmax(170px,.58fr) minmax(330px,1fr) auto;
    align-items: end;
    gap: 10px;
    min-height: 0;
    padding: 10px 11px;
  }
  .roles-autorole-section .roles-autorole-add .roles-mini-heading { align-self:center; }
  .roles-autorole-section .roles-autorole-add .picker-field { min-width:0; }
  .roles-autorole-section .roles-autorole-add .btn { min-width:180px; }
}
.roles-create-main > .roles-config-card { padding-top: 12px; padding-bottom: 12px; }
.roles-create-main .roles-description-input { min-height: 72px; }
.roles-create-main .roles-mode-option span { min-height: 58px; padding-top: 9px; padding-bottom: 9px; }
.roles-create-main .roles-toggle-tile { min-height: 58px; }
.roles-create-main .roles-role-config-card { padding-top: 9px; padding-bottom: 9px; }

/* === v31 Free Games 4A === */
.freegames-page-v31 {
  --fg-small: 10px;
  --fg-body: 11.5px;
  display:flex;
  flex-direction:column;
  gap:14px;
  padding-bottom:28px;
}
.freegames-hero-card {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  min-height:92px;
  padding:15px 17px;
  border-top-color:rgba(124,92,252,.46);
}
.freegames-hero-copy { min-width:0; }
.freegames-eyebrow {
  color:#9f88ff;
  font-size:9.5px;
  font-weight:850;
  letter-spacing:.055em;
}
.freegames-hero-title-row { display:flex; align-items:center; gap:11px; margin-top:5px; }
.freegames-hero-icon {
  display:inline-flex; align-items:center; justify-content:center;
  width:34px; height:34px; flex:0 0 auto; border-radius:10px;
  background:rgba(124,92,252,.12); font-size:16px;
}
.freegames-hero-title-row h2 { margin:0; color:#f3f6fb; font-size:18px; line-height:1.25; }
.freegames-hero-title-row p { margin:3px 0 0; color:#8896aa; font-size:10.5px; line-height:1.45; }
.freegames-hero-badges { display:flex; align-items:center; justify-content:flex-end; gap:7px; flex-wrap:wrap; }
.freegames-status-badge {
  display:inline-flex; align-items:center; min-height:25px; padding:4px 9px;
  border:1px solid rgba(255,255,255,.07); border-radius:999px;
  background:rgba(8,13,23,.55); color:#9ba8b9; font-size:9.5px; font-weight:800;
}
.freegames-status-badge.is-success { border-color:rgba(34,197,94,.16); background:rgba(34,197,94,.07); color:#55db7f; }
.freegames-status-badge.is-warning { border-color:rgba(245,158,11,.16); background:rgba(245,158,11,.065); color:#e8b65a; }
.freegames-kpi-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.freegames-kpi-card { position:relative; min-height:94px; padding:14px 16px; overflow:hidden; }
.freegames-kpi-card::before { content:""; position:absolute; inset:0 0 auto; height:2px; background:rgba(124,92,252,.72); }
.freegames-kpi-card > span { color:#8190a6; font-size:9.5px; font-weight:800; letter-spacing:.035em; }
.freegames-kpi-card > strong { display:block; margin-top:7px; color:#f5f7fb; font-size:22px; line-height:1; font-weight:800; }
.freegames-kpi-card > small { display:block; margin-top:6px; color:#8492a6; font-size:10px; line-height:1.4; }
.freegames-kpi-card .freegames-kpi-channel { font-size:15px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.freegames-settings-grid { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(360px,.7fr); gap:14px; align-items:start; }
.freegames-settings-card,
.freegames-preview-card,
.freegames-info-card,
.freegames-current-section { padding:15px 16px; }
.freegames-section-heading {
  display:flex; align-items:center; gap:10px; min-width:0; padding-bottom:11px;
  border-bottom:1px solid rgba(255,255,255,.055);
}
.freegames-section-heading > div { display:flex; min-width:0; flex-direction:column; gap:2px; }
.freegames-section-heading strong { color:#e9edf5; font-size:11.5px; line-height:1.35; }
.freegames-section-heading small { color:#7e8ca0; font-size:10px; line-height:1.4; }
.freegames-section-icon {
  display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px; flex:0 0 auto;
  border-radius:9px; background:rgba(124,92,252,.1); color:#a38aff; font-size:10.5px; font-weight:850;
}
.freegames-channel-block { display:grid; grid-template-columns:minmax(0,1fr) minmax(230px,.42fr); gap:10px; margin-top:12px; align-items:end; }
.freegames-channel-block .picker-field { margin:0; }
.freegames-sync-note {
  display:flex; align-items:center; gap:9px; min-height:70px; padding:10px 11px;
  border:1px solid rgba(124,92,252,.08); border-radius:10px; background:rgba(124,92,252,.025);
}
.freegames-sync-note > span { display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px; flex:0 0 auto; border-radius:9px; background:rgba(124,92,252,.1); color:#a38aff; }
.freegames-sync-note > div { display:flex; flex-direction:column; gap:2px; }
.freegames-sync-note strong { color:#dfe5ee; font-size:11px; }
.freegames-sync-note small { color:#7c899d; font-size:10px; line-height:1.4; }
.freegames-source-heading { margin-top:15px; }
.freegames-source-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; margin-top:11px; }
.freegames-source-card {
  display:grid; grid-template-columns:34px minmax(0,1fr) auto; gap:10px; align-items:center;
  min-height:72px; padding:11px; border:1px solid rgba(255,255,255,.055); border-radius:10px;
  background:rgba(8,13,23,.34); cursor:pointer;
}
.freegames-source-mark { display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:9px; background:rgba(124,92,252,.1); color:#c7bbff; font-size:12px; font-weight:900; }
.freegames-source-card.is-epic .freegames-source-mark { background:rgba(255,255,255,.08); color:#f0f2f5; }
.freegames-source-card.is-steam .freegames-source-mark { background:rgba(59,130,246,.10); color:#78aef7; }
.freegames-source-card.is-gog .freegames-source-mark { background:rgba(168,85,247,.10); color:#c99af9; }
.freegames-source-card > div { min-width:0; display:flex; flex-direction:column; gap:3px; }
.freegames-source-card strong { color:#e7ecf3; font-size:11px; }
.freegames-source-card small { color:#78869a; font-size:10px; line-height:1.35; }
.freegames-savebar {
  position:sticky; bottom:10px; z-index:12; display:flex; align-items:center; justify-content:space-between;
  gap:14px; margin-top:14px; padding:10px 12px; border:1px solid rgba(124,92,252,.12); border-radius:11px;
  background:rgba(14,21,35,.96); box-shadow:0 10px 26px rgba(0,0,0,.18); backdrop-filter:blur(10px);
}
.freegames-savebar > div:first-child { display:flex; min-width:0; flex-direction:column; gap:2px; }
.freegames-savebar strong { color:#dfe5ed; font-size:11.5px; }
.freegames-savebar small { color:#7e8ca0; font-size:10px; line-height:1.4; }
.freegames-save-actions { display:flex; align-items:center; gap:8px; }
.freegames-preview-column { position:sticky; top:58px; display:flex; min-width:0; flex-direction:column; gap:10px; }
.freegames-preview-card { min-height:290px; }
.freegames-discord-message { margin-top:12px; padding:12px; border:1px solid rgba(255,255,255,.055); border-radius:10px; background:#0b1019; }
.freegames-discord-author { display:flex; align-items:center; gap:8px; margin-bottom:9px; }
.freegames-discord-author > span { display:inline-flex; align-items:center; justify-content:center; width:29px; height:29px; border-radius:50%; background:#7c5cfc; color:white; font-size:10px; font-weight:850; }
.freegames-discord-author > div { display:flex; flex-direction:column; gap:1px; }
.freegames-discord-author strong { color:#e9edf4; font-size:10.5px; }
.freegames-discord-author b { padding:1px 4px; border-radius:3px; background:#5865f2; color:#fff; font-size:6.5px; }
.freegames-discord-author small { color:#657186; font-size:8.3px; }
.freegames-discord-embed { position:relative; padding:12px 12px 11px 15px; border-radius:4px; background:#151a22; overflow:hidden; }
.freegames-discord-embed::before { content:""; position:absolute; inset:0 auto 0 0; width:4px; background:#7c5cfc; }
.freegames-discord-embed > strong { color:#f0f2f5; font-size:11.5px; }
.freegames-discord-embed > p { margin:6px 0 0; color:#bec6d1; font-size:9.4px; line-height:1.5; }
.freegames-preview-sources { display:flex; gap:5px; margin-top:10px; flex-wrap:wrap; }
.freegames-preview-sources span { padding:4px 7px; border:1px solid rgba(255,255,255,.06); border-radius:999px; color:#667386; font-size:8.5px; }
.freegames-preview-sources span.is-active { border-color:rgba(34,197,94,.16); background:rgba(34,197,94,.06); color:#62da86; }
.freegames-discord-meta { display:flex; justify-content:space-between; gap:8px; margin-top:8px; color:#68768a; font-size:8.5px; }
.freegames-discord-meta span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.freegames-info-list { display:flex; flex-direction:column; gap:8px; margin-top:11px; }
.freegames-info-list span { padding:8px 9px; border:1px solid rgba(255,255,255,.045); border-radius:8px; background:rgba(8,13,23,.28); color:#8e9bad; font-size:10px; line-height:1.45; }
.freegames-info-list code { color:#b7a5ff; font-size:9.5px; }
.freegames-current-heading .btn { margin-left:auto; }
.freegames-current-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(400px,1fr)); gap:10px; margin-top:12px; }
.freegames-game-card { display:flex; min-width:0; min-height:160px; overflow:hidden; border:1px solid rgba(255,255,255,.055); border-radius:11px; background:rgba(8,13,23,.38); }
.freegames-game-media { position:relative; display:flex; align-items:center; justify-content:center; width:165px; flex:0 0 165px; min-height:160px; overflow:hidden; background:linear-gradient(145deg,rgba(124,92,252,.12),rgba(8,13,23,.5)); color:#a993ff; font-size:28px; font-weight:900; }
.freegames-game-media img { width:100%; height:100%; object-fit:cover; }
.freegames-platform-badge { position:absolute; top:8px; left:8px; padding:4px 7px; border-radius:999px; background:rgba(8,13,23,.88); color:#e1e6ee; font-size:8.5px; font-weight:800; backdrop-filter:blur(6px); }
.freegames-game-body { display:flex; min-width:0; flex:1; flex-direction:column; padding:12px; }
.freegames-game-title-row { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.freegames-game-title-row > div { min-width:0; display:flex; flex-direction:column; gap:3px; }
.freegames-game-title-row strong { color:#edf1f7; font-size:12px; line-height:1.35; }
.freegames-game-title-row small { color:#7f8da0; font-size:9.5px; }
.freegames-free-pill { flex:0 0 auto; padding:4px 7px; border:1px solid rgba(34,197,94,.16); border-radius:999px; background:rgba(34,197,94,.07); color:#5bdc82; font-size:8px; font-weight:900; letter-spacing:.035em; }
.freegames-game-body > p { margin:9px 0 10px; color:#98a5b7; font-size:10px; line-height:1.45; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.freegames-game-body > p.is-muted { color:#677488; }
.freegames-game-footer { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:auto; }
.freegames-rating { color:#d7b75d; font-size:9.5px; }
.freegames-empty-current { grid-column:1/-1; display:flex; align-items:center; justify-content:center; gap:11px; min-height:120px; padding:16px; border:1px dashed rgba(255,255,255,.07); border-radius:10px; color:#748196; }
.freegames-empty-current > span { display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; border-radius:10px; background:rgba(34,197,94,.08); color:#5bdc82; font-weight:900; }
.freegames-empty-current > div { display:flex; flex-direction:column; gap:3px; }
.freegames-empty-current strong { color:#d7dee8; font-size:11.5px; }
.freegames-empty-current small { font-size:10px; }
.freegames-empty-current.is-error > span { background:rgba(239,68,68,.08); color:#f47c7c; }
.freegames-loading { grid-column:1/-1; display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.freegames-loading .skeleton { display:block; height:160px; border-radius:10px; }
@media (max-width: 1280px) {
  .freegames-settings-grid { grid-template-columns:minmax(0,1.25fr) minmax(340px,.75fr); }
  .freegames-source-grid { grid-template-columns:1fr; }
  .freegames-channel-block { grid-template-columns:1fr; }
}
@media (max-width: 1000px) {
  .freegames-kpi-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .freegames-settings-grid { grid-template-columns:1fr; }
  .freegames-preview-column { position:static; }
}
@media (max-width: 720px) {
  .freegames-hero-card { align-items:flex-start; flex-direction:column; }
  .freegames-kpi-grid { grid-template-columns:1fr; }
  .freegames-savebar { position:static; align-items:flex-start; flex-direction:column; }
  .freegames-save-actions { width:100%; flex-direction:column; }
  .freegames-save-actions .btn { width:100%; }
  .freegames-current-heading { align-items:flex-start; flex-wrap:wrap; }
  .freegames-current-heading .btn { margin-left:0; width:100%; }
  .freegames-current-grid { grid-template-columns:1fr; }
  .freegames-game-card { flex-direction:column; }
  .freegames-game-media { width:100%; height:170px; flex-basis:170px; }
  .freegames-loading { grid-template-columns:1fr; }
}

/* ========================================================================== */
/* 4A · Music & Sound · v33                                                   */
/* ========================================================================== */
.music4-hero,
.music4-card,
.music4-kpi,
.music4-tabs,
.music4-playlist-head {
  border: 1px solid rgba(255,255,255,.065);
  background: #111827;
  border-radius: 12px;
}
.music4-hero {
  min-height: 92px;
  padding: 18px 20px;
  display: flex;
  align-items: center;
  gap: 14px;
  border-top-color: rgba(124,92,252,.7);
}
.music4-hero-icon,
.music4-section-icon {
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  background: rgba(124,92,252,.16);
  color: #a78bfa;
  border: 1px solid rgba(124,92,252,.16);
}
.music4-hero-icon { width: 42px; height: 42px; border-radius: 11px; font-size: 20px; font-weight: 800; }
.music4-section-icon { width: 28px; height: 28px; border-radius: 8px; font-size: 12px; }
.music4-hero-copy { min-width: 0; }
.music4-eyebrow { display:block; color:#9d84ff; font-size:11.5px; line-height:1.3; font-weight:800; letter-spacing:.055em; text-transform:uppercase; }
.music4-hero-copy h2 { margin:3px 0 2px; font-size:20px; line-height:1.15; color:#f8fafc; }
.music4-hero-copy p,
.music4-playlist-head p { margin:0; color:#94a3b8; font-size:12.5px; line-height:1.5; }
.music4-hero-status { margin-left:auto; display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; }
.music4-status-pill { min-height:27px; display:inline-flex; align-items:center; gap:6px; padding:5px 9px; border:1px solid rgba(255,255,255,.06); border-radius:999px; background:#0d1421; color:#94a3b8; font-size:11.5px; font-weight:700; white-space:nowrap; }
.music4-status-pill i { width:6px; height:6px; border-radius:50%; background:#64748b; }
.music4-status-pill.ok { color:#63e6a0; background:rgba(34,197,94,.07); border-color:rgba(34,197,94,.14); }
.music4-status-pill.ok i { background:#22c55e; box-shadow:0 0 8px rgba(34,197,94,.4); }
.music4-status-pill.warn { color:#fbbf24; background:rgba(245,158,11,.07); border-color:rgba(245,158,11,.15); }
.music4-status-pill.warn i { background:#f59e0b; }
.music4-status-pill.muted { color:#94a3b8; }

.music4-kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-top:12px; }
.music4-kpi { min-height:88px; padding:14px 16px; border-top-color:rgba(124,92,252,.7); }
.music4-kpi span { display:block; color:#8291aa; font-size:10.5px; font-weight:800; letter-spacing:.04em; }
.music4-kpi strong { display:block; margin:5px 0 2px; color:#f8fafc; font-size:21px; line-height:1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.music4-kpi small { display:block; color:#71819b; font-size:11.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

.music4-tabs { display:flex; align-items:center; gap:4px; padding:5px; margin:12px 0; background:#0f1726; }
.music4-tab { border:0; color:#8694aa; background:transparent; padding:8px 12px; border-radius:8px; font-size:12px; font-weight:700; cursor:pointer; transition:background .16s,color .16s; }
.music4-tab span { margin-right:6px; color:#8492a8; }
.music4-tab b { display:inline-grid; place-items:center; min-width:19px; height:18px; margin-left:5px; padding:0 5px; border-radius:999px; background:#182235; color:#94a3b8; font-size:10px; }
.music4-tab:hover { background:#141e2f; color:#f8fafc; }
.music4-tab.active { color:#ddd5ff; background:rgba(124,92,252,.17); box-shadow:inset 0 0 0 1px rgba(124,92,252,.22); }
.music4-tab.active span,.music4-tab.active b { color:#b9a7ff; }
.music4-content { min-width:0; }

.music4-player-grid { display:grid; grid-template-columns:minmax(0,1.75fr) minmax(310px,.75fr); gap:12px; align-items:start; }
.music4-card { padding:14px; min-width:0; }
.music4-card-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding-bottom:11px; margin-bottom:12px; border-bottom:1px solid rgba(255,255,255,.055); }
.music4-card-head > div:first-child { min-width:0; display:flex; align-items:center; gap:9px; }
.music4-card-head strong { display:block; color:#f1f5f9; font-size:13px; line-height:1.3; }
.music4-card-head small { display:block; margin-top:2px; color:#7f8ea7; font-size:11.5px; line-height:1.35; }
.music4-player-card { min-height:310px; }
.music4-side-stack { display:grid; gap:12px; position:sticky; top:68px; }
.music4-now { min-height:136px; display:flex; gap:16px; align-items:center; padding:7px 2px 12px; }
.music4-now-art { width:126px; height:126px; flex:0 0 126px; border-radius:12px; overflow:hidden; background:#0b111d; border:1px solid rgba(255,255,255,.06); }
.music4-now-art img { width:100%; height:100%; object-fit:cover; display:block; }
.music4-art-fallback { width:100%; height:100%; display:grid; place-items:center; background:radial-gradient(circle at 30% 20%,rgba(124,92,252,.3),rgba(17,24,39,.8) 55%),#0d1421; color:#a78bfa; font-size:38px; font-weight:800; }
.music4-now-copy { flex:1; min-width:0; }
.music4-now-label { color:#8f77fb; font-size:10.5px; font-weight:800; letter-spacing:.06em; }
.music4-now h3 { margin:6px 0 3px; font-size:21px; line-height:1.25; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.music4-now p { margin:0; color:#8796ad; font-size:12px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.music4-progress { height:4px; margin-top:16px; background:#1c2638; border-radius:999px; overflow:hidden; }
.music4-progress span { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#7c5cfc,#a78bfa); }
.music4-time { display:flex; justify-content:space-between; margin-top:5px; color:#65758f; font-size:10.5px; }
.music4-search-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; margin-top:7px; }
.music4-controls { display:flex; align-items:center; gap:7px; margin-top:10px; }
.music4-control { width:38px; height:35px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.07); border-radius:9px; color:#e2e8f0; background:#131d2e; font-weight:800; cursor:pointer; }
.music4-control:hover { background:#1a2538; border-color:rgba(124,92,252,.35); }
.music4-control.danger { color:#fb7185; background:rgba(239,68,68,.08); }
.music4-control:disabled,.music4-card button:disabled { opacity:.4; cursor:not-allowed; }
.music4-volume { margin-left:auto; flex:1; max-width:280px; display:grid; grid-template-columns:auto 1fr 40px; align-items:center; gap:8px; color:#94a3b8; font-size:11px; }
.music4-volume input { width:100%; accent-color:#7c5cfc; }
.music4-volume b { color:#dce3ee; text-align:right; font-size:11.5px; }
.music4-connect-form { display:grid; gap:9px; }
.music4-connect-form .picker-field { margin:0; }
.music4-note { margin:10px 0 0; padding:9px 10px; border-radius:8px; background:#0c1421; border:1px solid rgba(255,255,255,.045); color:#73839d; font-size:11.5px; line-height:1.45; }
.music4-note code { color:#ad9bff; }
.music4-shortcuts { display:grid; }
.music4-library-link { width:100%; display:grid; grid-template-columns:30px 1fr auto; align-items:center; gap:9px; text-align:left; padding:9px; border:1px solid rgba(255,255,255,.05); background:#101929; border-radius:9px; color:#dce3ee; cursor:pointer; margin-top:7px; }
.music4-library-link > span { width:30px; height:30px; display:grid; place-items:center; border-radius:8px; background:rgba(124,92,252,.13); color:#a78bfa; }
.music4-library-link p { margin:0; min-width:0; }
.music4-library-link strong,.music4-library-link small { display:block; }
.music4-library-link strong { font-size:11.5px; }
.music4-library-link small { color:#72819a; font-size:10.5px; margin-top:2px; }
.music4-library-link b { color:#7f8da4; }
.music4-library-link:hover { border-color:rgba(124,92,252,.25); background:#141e30; }
.music4-queue-card { margin-top:12px; }
.music4-queue { display:grid; gap:6px; }
.music4-queue-item { min-height:48px; display:grid; grid-template-columns:26px 34px minmax(0,1fr) auto; align-items:center; gap:9px; padding:6px 9px; border-radius:9px; border:1px solid rgba(255,255,255,.045); background:#0e1726; }
.music4-queue-item > div { width:34px; height:34px; border-radius:7px; overflow:hidden; }
.music4-queue-item img { width:100%;height:100%;object-fit:cover; }
.music4-queue-item .music4-art-fallback { font-size:15px; }
.music4-queue-index { color:#66758e; font-size:11px; text-align:center; }
.music4-queue-item p { margin:0; min-width:0; }
.music4-queue-item strong,.music4-queue-item small { display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.music4-queue-item strong { font-size:11.5px; color:#e2e8f0; }
.music4-queue-item small,.music4-queue-item > span:last-child { color:#75859f; font-size:10.5px; }
.music4-empty { min-height:130px; display:grid; place-items:center; align-content:center; gap:5px; color:#72819a; text-align:center; }
.music4-empty > span { width:34px; height:34px; display:grid; place-items:center; border-radius:9px; background:rgba(124,92,252,.12); color:#a78bfa; }
.music4-empty strong { color:#cbd5e1; font-size:12px; }
.music4-empty small { font-size:11px; }
.music4-empty.compact { min-height:76px; grid-template-columns:auto auto; grid-template-rows:auto auto; justify-content:center; column-gap:9px; text-align:left; }
.music4-empty.compact > span { grid-row:1/3; }

.music4-library-layout { display:grid; grid-template-columns:minmax(0,2fr) minmax(300px,.72fr); gap:12px; align-items:start; }
.music4-radio-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.music4-radio-card { display:grid; grid-template-columns:42px minmax(0,1fr) auto; gap:10px; padding:12px; border:1px solid rgba(255,255,255,.055); border-radius:10px; background:#0f1828; }
.music4-radio-mark { width:42px; height:42px; display:grid; place-items:center; border-radius:10px; background:linear-gradient(145deg,rgba(124,92,252,.23),rgba(59,130,246,.10)); color:#b8a7ff; font-size:16px; font-weight:900; }
.music4-radio-copy { min-width:0; }
.music4-radio-copy span { color:#8373ca; font-size:10px; font-weight:800; text-transform:uppercase; }
.music4-radio-copy h3 { margin:2px 0; font-size:13px; color:#f1f5f9; }
.music4-radio-copy p { margin:0; color:#75849d; font-size:10.5px; line-height:1.4; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.music4-radio-meta { text-align:right; color:#8493aa; font-size:10.5px; }
.music4-radio-meta span,.music4-radio-meta code { display:block; }
.music4-radio-meta code { margin-top:4px; color:#a997ff; }
.music4-card-actions { grid-column:1/-1; display:flex; align-items:center; gap:6px; padding-top:8px; border-top:1px solid rgba(255,255,255,.045); }
.music4-card-actions .btn-danger:last-child { margin-left:auto; }
.music4-create-card { display:grid; gap:9px; position:sticky; top:68px; }
.music4-create-card .music4-card-head { margin-bottom:0; }
.music4-two { display:grid; grid-template-columns:1fr 1fr; gap:8px; }

.music4-playlist-head { padding:14px; display:flex; justify-content:space-between; align-items:end; gap:14px; margin-bottom:10px; }
.music4-playlist-head h3 { margin:3px 0 2px; font-size:17px; }
.music4-inline-create { width:min(470px,45%); display:grid; grid-template-columns:1fr auto; gap:7px; }
.music4-playlist-stack { display:grid; gap:8px; }
.music4-playlist-card { padding:0; overflow:hidden; }
.music4-playlist-card > summary { list-style:none; }
.music4-playlist-card > summary::-webkit-details-marker { display:none; }
.music4-playlist-summary { min-height:70px; display:grid; grid-template-columns:38px minmax(0,1fr) auto; align-items:center; gap:10px; padding:11px 13px; cursor:pointer; }
.music4-playlist-icon { width:38px; height:38px; display:grid; place-items:center; border-radius:9px; background:rgba(124,92,252,.13); color:#a78bfa; }
.music4-playlist-title { min-width:0; }
.music4-playlist-title strong,.music4-playlist-title small { display:block; }
.music4-playlist-title strong { color:#f1f5f9; font-size:13px; }
.music4-playlist-title small { color:#71819a; font-size:10.5px; margin-top:3px; }
.music4-playlist-summary-actions { display:flex; align-items:center; gap:9px; color:#6f7e96; font-size:10.5px; }
.music4-playlist-body { padding:0 13px 13px; border-top:1px solid rgba(255,255,255,.05); }
.music4-song-list { display:grid; gap:5px; padding:10px 0; }
.music4-song-row { display:grid; grid-template-columns:24px minmax(0,1fr) auto; align-items:center; gap:8px; min-height:46px; padding:6px 8px; background:#0d1624; border:1px solid rgba(255,255,255,.04); border-radius:8px; }
.music4-song-row > span { text-align:center; color:#63738b; font-size:10.5px; }
.music4-song-row strong,.music4-song-row small { display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.music4-song-row strong { color:#dce4ef; font-size:11.5px; }
.music4-song-row small { color:#6e7e97; font-size:10px; margin-top:2px; }
.music4-add-song { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,.8fr) auto; gap:7px; padding:10px 0; border-top:1px solid rgba(255,255,255,.045); }
.music4-playlist-body > .music4-card-actions { padding-bottom:0; }

#radio-edit-modal .modal-card { max-width:760px; background:#111827; border-color:rgba(124,92,252,.2); }
#radio-edit-modal .modal-header { border-bottom-color:rgba(255,255,255,.06); }
#radio-edit-modal .form-grid { gap:10px; padding-top:6px; }
#radio-edit-modal .modal-actions { border-top-color:rgba(255,255,255,.06); }

@media (max-width: 1500px) {
  .music4-player-grid { grid-template-columns:minmax(0,1.45fr) minmax(280px,.75fr); }
  .music4-library-layout { grid-template-columns:minmax(0,1.6fr) minmax(280px,.75fr); }
}
@media (max-width: 1150px) {
  .music4-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .music4-player-grid,.music4-library-layout { grid-template-columns:1fr; }
  .music4-side-stack,.music4-create-card { position:static; }
  .music4-radio-grid { grid-template-columns:1fr; }
  .music4-inline-create { width:100%; }
  .music4-playlist-head { align-items:stretch; flex-direction:column; }
}
@media (max-width: 720px) {
  .music4-hero { align-items:flex-start; flex-wrap:wrap; }
  .music4-hero-status { margin-left:0; width:100%; justify-content:flex-start; }
  .music4-kpis { grid-template-columns:1fr; }
  .music4-tabs { overflow-x:auto; }
  .music4-now { align-items:flex-start; }
  .music4-now-art { width:82px; height:82px; flex-basis:82px; }
  .music4-now h3 { font-size:16px; }
  .music4-search-row,.music4-inline-create,.music4-add-song { grid-template-columns:1fr; }
  .music4-controls { flex-wrap:wrap; }
  .music4-volume { width:100%; max-width:none; flex-basis:100%; }
  .music4-two { grid-template-columns:1fr; }
  .music4-radio-card { grid-template-columns:38px minmax(0,1fr); }
  .music4-radio-meta { grid-column:2; text-align:left; display:flex; gap:8px; }
  .music4-playlist-summary { grid-template-columns:34px minmax(0,1fr); }
  .music4-playlist-summary-actions { grid-column:1/-1; justify-content:flex-end; }
}


/* v34 · Music & Sound final polish */
.music4-player-card.is-empty { min-height:250px; }
.music4-player-card.is-empty .music4-now { min-height:92px; padding-top:2px; padding-bottom:7px; }
.music4-player-card.is-empty .music4-now-art { width:82px; height:82px; flex-basis:82px; }
.music4-player-card.is-empty .music4-now h3 { font-size:18px; }
.music4-player-card.is-empty .music4-progress,
.music4-player-card.is-empty .music4-time { display:none; }
.music4-volume { max-width:240px; grid-template-columns:auto minmax(105px,1fr) 46px; }
.music4-volume b { padding:4px 7px; border:1px solid rgba(255,255,255,.055); border-radius:7px; background:#0c1421; text-align:center; }

.music4-radio-toolbar { display:grid; grid-template-columns:minmax(260px,1fr) minmax(150px,.32fr) minmax(130px,.26fr); gap:8px; margin-bottom:10px; }
.music4-radio-search { position:relative; display:block; }
.music4-radio-search > span { position:absolute; left:11px; top:50%; transform:translateY(-50%); color:#71819a; z-index:1; font-size:14px; pointer-events:none; }
.music4-radio-search .input { padding-left:32px; }
.music4-radio-scroll { max-height:690px; overflow:auto; padding-right:4px; scrollbar-width:thin; scrollbar-color:#35405a transparent; }
.music4-radio-scroll::-webkit-scrollbar { width:7px; }
.music4-radio-scroll::-webkit-scrollbar-thumb { background:#35405a; border-radius:999px; }
.music4-radio-scroll::-webkit-scrollbar-track { background:transparent; }
.music4-stream-actions { display:grid; grid-template-columns:auto 1fr; gap:8px; }
.music4-stream-test-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; }
.music4-stream-test-status { display:block; min-height:18px; margin-top:5px; color:#7f8ea7; font-size:11.5px; line-height:1.4; }
.music4-stream-test-status.checking { color:#c4b5fd; }
.music4-stream-test-status.ok { color:#63e6a0; }
.music4-stream-test-status.error { color:#fb7185; }

.music4-playlist-summary { min-height:94px; }
.music4-playlist-preview { display:flex; flex-wrap:wrap; gap:5px; margin-top:7px; }
.music4-playlist-preview span,
.music4-playlist-preview em { display:inline-flex; align-items:center; gap:5px; max-width:240px; min-height:23px; padding:3px 7px; border:1px solid rgba(255,255,255,.045); border-radius:7px; background:#0d1624; color:#8391a7; font-size:10.5px; font-style:normal; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.music4-playlist-preview span b { color:#a997ff; font-size:9.5px; }
.music4-playlist-preview em { color:#66768f; }
.music4-open-action { display:inline-flex; align-items:center; gap:5px; min-height:30px; padding:5px 8px; border:1px solid rgba(255,255,255,.06); border-radius:8px; background:#101929; color:#9aa7ba; font-size:11px; font-weight:700; }
.music4-playlist-card[open] .music4-open-action b { transform:rotate(180deg); }
.music4-open-action b { display:inline-block; transition:transform .16s ease; }

@media (max-width: 1150px) {
  .music4-radio-toolbar { grid-template-columns:1fr 1fr; }
  .music4-radio-search { grid-column:1/-1; }
  .music4-radio-scroll { max-height:none; overflow:visible; padding-right:0; }
}
@media (max-width: 720px) {
  .music4-radio-toolbar, .music4-stream-actions, .music4-stream-test-row { grid-template-columns:1fr; }
  .music4-playlist-preview { display:none; }
}

/* v35 · Private Channels 4A */
.voice4-shell { display:grid; gap:14px; padding-bottom:20px; }
.voice4-hero { display:flex; align-items:center; gap:14px; min-height:86px; padding:18px 20px; border:1px solid rgba(124,92,252,.2); border-top-color:#7c5cfc; border-radius:12px; background:linear-gradient(110deg,rgba(124,92,252,.09),rgba(17,24,39,.96) 36%,#111827 100%); }
.voice4-hero-icon { display:grid; place-items:center; width:42px; height:42px; flex:0 0 42px; border:1px solid rgba(124,92,252,.18); border-radius:11px; background:rgba(124,92,252,.14); font-size:20px; }
.voice4-hero-copy { min-width:0; }
.voice4-eyebrow { display:block; margin-bottom:3px; color:#9d89ff; font-size:10.5px; font-weight:800; letter-spacing:.055em; text-transform:uppercase; }
.voice4-hero h2 { margin:0; color:#f8fafc; font-size:19px; line-height:1.2; }
.voice4-hero p { margin:4px 0 0; max-width:760px; color:#8f9db2; font-size:11.5px; line-height:1.45; }
.voice4-hero-status { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:7px; margin-left:auto; }
.voice4-status { display:inline-flex; align-items:center; min-height:27px; padding:5px 9px; border:1px solid rgba(255,255,255,.06); border-radius:999px; background:#0d1624; color:#8d9bb0; font-size:10.5px; font-weight:800; }
.voice4-status::before { content:""; width:6px; height:6px; margin-right:6px; border-radius:50%; background:#64748b; }
.voice4-status.is-ok { color:#71e6a2; border-color:rgba(34,197,94,.17); background:rgba(34,197,94,.07); }
.voice4-status.is-ok::before { background:#22c55e; }
.voice4-status.is-warn { color:#f7c76d; border-color:rgba(245,158,11,.18); background:rgba(245,158,11,.065); }
.voice4-status.is-warn::before { background:#f59e0b; }
.voice4-status.is-off { color:#f28b9a; border-color:rgba(239,68,68,.18); background:rgba(239,68,68,.06); }
.voice4-status.is-off::before { background:#ef4444; }
.voice4-module-off { display:flex; align-items:center; gap:12px; padding:11px 13px; border:1px solid rgba(245,158,11,.16); border-radius:10px; background:rgba(245,158,11,.045); }
.voice4-module-off div { display:grid; gap:2px; }
.voice4-module-off strong { color:#f7d186; font-size:12px; }
.voice4-module-off small { color:#8d98a9; font-size:10.5px; }
.voice4-module-off .btn { margin-left:auto; }

.voice4-kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.voice4-kpis article { min-height:78px; padding:13px 14px; border:1px solid rgba(255,255,255,.055); border-top:2px solid rgba(124,92,252,.72); border-radius:11px; background:#111827; }
.voice4-kpis span { display:block; color:#70809a; font-size:9.5px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; }
.voice4-kpis strong { display:block; margin-top:5px; color:#f8fafc; font-size:19px; line-height:1.1; }
.voice4-kpis small { display:block; margin-top:5px; color:#75859c; font-size:10.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

.voice4-section { border:1px solid rgba(255,255,255,.055); border-radius:11px; background:#111827; overflow:hidden; }
.voice4-section-head { display:flex; align-items:center; min-height:50px; padding:10px 13px; border-bottom:1px solid rgba(255,255,255,.045); }
.voice4-section-title { display:flex; align-items:center; min-width:0; gap:9px; }
.voice4-section-title > span { display:grid; place-items:center; width:28px; height:28px; flex:0 0 28px; border-radius:8px; background:rgba(124,92,252,.13); color:#a995ff; font-size:11px; font-weight:800; }
.voice4-section-title > div { display:grid; min-width:0; gap:2px; }
.voice4-section-title strong { color:#edf2f8; font-size:12px; line-height:1.25; }
.voice4-section-title small { color:#7d8ca2; font-size:10.5px; line-height:1.35; }
.voice4-count { display:grid; place-items:center; min-width:24px; min-height:24px; margin-left:auto; padding:3px 7px; border-radius:999px; background:#0d1624; color:#8e9cb0; font-size:10px; font-weight:800; }
.voice4-stale-note { margin:10px 12px 0; padding:8px 10px; border:1px solid rgba(245,158,11,.13); border-radius:8px; background:rgba(245,158,11,.04); color:#b99c66; font-size:10.5px; }
.voice4-room-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; padding:12px; }
.voice4-room-card { min-width:0; padding:11px; border:1px solid rgba(34,197,94,.14); border-left:2px solid #22c55e; border-radius:9px; background:#0f1827; }
.voice4-room-card.is-locked { border-color:rgba(245,158,11,.14); border-left-color:#f59e0b; }
.voice4-room-head { display:flex; align-items:center; gap:9px; }
.voice4-owner-avatar { display:grid; place-items:center; width:34px; height:34px; flex:0 0 34px; overflow:hidden; border:1px solid rgba(255,255,255,.07); border-radius:50%; background:#202c40; color:#d9dff0; font-size:12px; font-weight:800; }
.voice4-owner-avatar img { width:100%; height:100%; object-fit:cover; }
.voice4-room-title { display:grid; min-width:0; gap:2px; }
.voice4-room-title strong { color:#eef2f8; font-size:11.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.voice4-room-title small { color:#75849a; font-size:10px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.voice4-state-pill { margin-left:auto; padding:4px 7px; border-radius:999px; font-size:9.5px; font-weight:800; }
.voice4-state-pill.is-open { color:#62e89b; background:rgba(34,197,94,.08); }
.voice4-state-pill.is-locked { color:#fac469; background:rgba(245,158,11,.08); }
.voice4-room-stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; margin-top:10px; }
.voice4-room-stats > div { padding:7px 8px; border:1px solid rgba(255,255,255,.04); border-radius:7px; background:#0c1421; }
.voice4-room-stats span { display:block; color:#65758d; font-size:9px; text-transform:uppercase; }
.voice4-room-stats strong { display:block; margin-top:3px; color:#dfe6ef; font-size:10.5px; }
.voice4-room-footer { display:flex; align-items:center; gap:8px; margin-top:8px; color:#65758d; font-size:9.5px; }
.voice4-room-footer code { margin-left:auto; color:#7d8ca1; font-size:9px; }
.voice4-empty { grid-column:1/-1; display:flex; align-items:center; justify-content:center; gap:10px; min-height:106px; padding:18px; border:1px dashed rgba(255,255,255,.06); border-radius:9px; background:#0e1725; }
.voice4-empty-icon { display:grid; place-items:center; width:34px; height:34px; border-radius:9px; background:rgba(124,92,252,.12); color:#9b87ff; font-size:17px; }
.voice4-empty div { display:grid; gap:2px; }
.voice4-empty strong { color:#dfe6ef; font-size:11.5px; }
.voice4-empty small { color:#74839a; font-size:10.5px; }

.voice4-form { display:grid; gap:12px; }
.voice4-main-grid { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(300px,.62fr); gap:12px; align-items:start; }
.voice4-main-column,.voice4-side-column { display:grid; gap:12px; min-width:0; }
.voice4-side-column { position:sticky; top:68px; }
.voice4-config-card { overflow:visible; }
.voice4-config-card > :not(.voice4-section-head) { margin-left:12px; margin-right:12px; }
.voice4-config-card > :last-child { margin-bottom:12px; }
.voice4-two { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; margin-top:12px; }
.voice4-flow { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr); align-items:center; gap:8px; margin-top:10px; padding:9px; border:1px solid rgba(124,92,252,.08); border-radius:9px; background:#0d1624; }
.voice4-flow > div { display:grid; grid-template-columns:24px minmax(0,1fr); align-items:center; column-gap:7px; row-gap:1px; min-width:0; }
.voice4-flow > div > span { grid-row:1/3; display:grid; place-items:center; width:24px; height:24px; border-radius:7px; background:rgba(124,92,252,.12); color:#a793ff; font-size:9.5px; font-weight:800; }
.voice4-flow small { color:#67778f; font-size:9px; }
.voice4-flow strong { min-width:0; color:#cfd7e3; font-size:10.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.voice4-flow > b { color:#4c5a70; font-size:13px; }
.voice4-name-field { margin-top:12px; }
.voice4-name-preview { display:flex; align-items:center; gap:9px; min-height:38px; margin-top:8px; padding:7px 9px; border:1px solid rgba(124,92,252,.11); border-radius:8px; background:rgba(124,92,252,.045); }
.voice4-name-preview span { color:#6f7f96; font-size:9px; font-weight:800; text-transform:uppercase; }
.voice4-name-preview strong { color:#dfe5ee; font-size:11px; }
.voice4-config-card .var-pills { margin-top:8px; }
.voice4-prefix-row { display:grid; grid-template-columns:minmax(220px,.38fr) minmax(0,1fr); gap:9px; align-items:end; margin-top:9px; }
.voice4-tip { display:flex; align-items:center; gap:8px; min-height:54px; padding:8px 10px; border:1px solid rgba(255,255,255,.04); border-radius:8px; background:#0d1624; }
.voice4-tip > span { display:grid; place-items:center; width:24px; height:24px; flex:0 0 24px; border-radius:7px; background:rgba(59,130,246,.09); color:#79aaf7; font-size:10px; font-weight:800; }
.voice4-tip p { margin:0; color:#75849a; font-size:10.5px; line-height:1.4; }
.voice4-tip strong { color:#b4c0d0; }
.voice4-quality-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(320px,.8fr); gap:9px; margin-top:12px; }
.voice4-bitrate-card,.voice4-toggle-card { min-height:106px; padding:10px; border:1px solid rgba(255,255,255,.045); border-radius:9px; background:#0d1624; }
.voice4-bitrate-head { display:flex; align-items:flex-start; gap:10px; }
.voice4-bitrate-head > div { display:grid; gap:2px; }
.voice4-bitrate-head strong,.voice4-toggle-copy strong { color:#e7ecf4; font-size:11px; }
.voice4-bitrate-head small,.voice4-toggle-copy small { color:#738298; font-size:10px; line-height:1.35; }
.voice4-bitrate-head > b { margin-left:auto; color:#a997ff; font-size:12px; white-space:nowrap; }
.voice4-bitrate-card input[type="range"] { width:100%; margin-top:16px; accent-color:#7c5cfc; }
.voice4-range-labels { display:flex; justify-content:space-between; margin-top:3px; color:#5f6f87; font-size:9px; }
.voice4-toggle-card { display:flex; align-items:center; gap:10px; cursor:pointer; }
.voice4-toggle-copy { display:flex; align-items:center; gap:9px; min-width:0; }
.voice4-toggle-copy > div { display:grid; gap:2px; }
.voice4-toggle-icon { display:grid; place-items:center; width:30px; height:30px; flex:0 0 30px; border-radius:8px; background:rgba(124,92,252,.12); color:#a592ff; }
.voice4-toggle-card > .toggle { margin-left:auto; flex:0 0 auto; }

.voice4-panel-preview-card,.voice4-command-card { overflow:hidden; }
.voice4-discord-preview { padding:12px; background:#0b121d; }
.voice4-discord-author { display:flex; align-items:center; gap:6px; color:#e8edf4; font-size:10.5px; }
.voice4-discord-author > span { display:grid; place-items:center; width:28px; height:28px; border-radius:50%; background:#7657f5; color:white; font-size:10px; font-weight:800; }
.voice4-discord-author > b { padding:2px 4px; border-radius:4px; background:#5865f2; color:#fff; font-size:7px; }
.voice4-discord-embed { margin-top:8px; padding:10px; border-left:3px solid #7c5cfc; border-radius:4px; background:#141b26; }
.voice4-discord-embed strong { color:#f1f4f8; font-size:11px; }
.voice4-discord-embed p { margin:5px 0 0; color:#c5ccd7; font-size:9.5px; line-height:1.45; }
.voice4-discord-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; margin-top:7px; }
.voice4-discord-actions span { display:flex; align-items:center; min-height:28px; padding:5px 7px; border-radius:5px; background:#252b36; color:#d8dde5; font-size:8.7px; font-weight:700; }
.voice4-discord-note { display:block; margin-top:8px; color:#64748b; font-size:9px; line-height:1.4; }
.voice4-command-list { display:flex; flex-wrap:wrap; gap:6px; padding:12px; }
.voice4-command-list code { padding:5px 7px; border:1px solid rgba(124,92,252,.11); border-radius:7px; background:rgba(124,92,252,.05); color:#aa9afd; font-size:9.5px; }
.voice4-savebar { position:sticky; bottom:8px; z-index:9; display:flex; align-items:center; gap:12px; min-height:58px; padding:9px 11px; border:1px solid rgba(124,92,252,.14); border-radius:10px; background:rgba(15,24,39,.96); box-shadow:0 12px 34px rgba(0,0,0,.25); backdrop-filter:blur(12px); }
.voice4-savebar > div { display:grid; gap:2px; }
.voice4-savebar strong { color:#e7ecf4; font-size:11.5px; }
.voice4-savebar small { color:#78879d; font-size:10.5px; }
.voice4-savebar .btn { margin-left:auto; }

@media (max-width:1400px) {
  .voice4-main-grid { grid-template-columns:minmax(0,1.45fr) minmax(285px,.7fr); }
  .voice4-room-stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:1120px) {
  .voice4-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .voice4-main-grid { grid-template-columns:1fr; }
  .voice4-side-column { position:static; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .voice4-quality-grid { grid-template-columns:1fr; }
}
@media (max-width:820px) {
  .voice4-room-grid,.voice4-two,.voice4-prefix-row { grid-template-columns:1fr; }
  .voice4-flow { grid-template-columns:1fr; }
  .voice4-flow > b { transform:rotate(90deg); justify-self:center; }
  .voice4-side-column { grid-template-columns:1fr; }
}
@media (max-width:620px) {
  .voice4-hero { align-items:flex-start; flex-wrap:wrap; }
  .voice4-hero-status { width:100%; margin-left:0; justify-content:flex-start; }
  .voice4-kpis { grid-template-columns:1fr; }
  .voice4-room-stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .voice4-savebar { align-items:stretch; flex-direction:column; }
  .voice4-savebar .btn { width:100%; margin-left:0; }
  .voice4-module-off { align-items:flex-start; flex-direction:column; }
  .voice4-module-off .btn { margin-left:0; }
}

/* v36 — Private Channels: mehrere Join-to-Create-Profile */
.voice4-profiles-section .voice4-section-head { gap:12px; }
.voice4-profiles-section .voice4-section-head .btn { margin-left:auto; }
.voice4-profile-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; padding:12px; }
.voice4-profile-card { min-width:0; padding:12px; border:1px solid rgba(124,92,252,.13); border-left:2px solid #7c5cfc; border-radius:10px; background:#0e1725; }
.voice4-profile-head { display:flex; align-items:center; gap:9px; }
.voice4-profile-icon { display:grid; place-items:center; width:34px; height:34px; flex:0 0 34px; border-radius:9px; background:rgba(124,92,252,.13); font-size:15px; }
.voice4-profile-title { display:grid; min-width:0; gap:2px; }
.voice4-profile-title strong { color:#eef2f8; font-size:12.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.voice4-profile-title small { color:#7c8ba0; font-size:10.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.voice4-profile-head .voice4-status { margin-left:auto; }
.voice4-profile-route { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr); gap:7px; align-items:center; margin-top:10px; padding:8px; border:1px solid rgba(255,255,255,.04); border-radius:8px; background:#0b1420; }
.voice4-profile-route > div { min-width:0; }
.voice4-profile-route span,.voice4-profile-meta span { display:block; color:#66768e; font-size:9px; font-weight:700; text-transform:uppercase; }
.voice4-profile-route strong { display:block; margin-top:3px; color:#cfd8e5; font-size:10.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.voice4-profile-route > b { color:#56657c; font-size:12px; }
.voice4-profile-meta { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; margin-top:8px; }
.voice4-profile-meta > div { padding:7px 8px; border:1px solid rgba(255,255,255,.035); border-radius:7px; background:#0c1421; }
.voice4-profile-meta strong { display:block; margin-top:3px; color:#dce4ef; font-size:10.5px; }
.voice4-profile-actions { display:flex; align-items:center; gap:7px; margin-top:9px; padding-top:9px; border-top:1px solid rgba(255,255,255,.04); }
.voice4-profile-actions .btn-danger { margin-left:auto; }
.voice4-profile-empty { grid-column:1/-1; display:flex; align-items:center; justify-content:center; gap:10px; min-height:92px; padding:16px; border:1px dashed rgba(124,92,252,.12); border-radius:9px; background:#0d1624; }
.voice4-profile-empty > span { display:grid; place-items:center; width:32px; height:32px; border-radius:8px; background:rgba(124,92,252,.12); color:#a492ff; font-size:16px; }
.voice4-profile-empty > div { display:grid; gap:2px; }
.voice4-profile-empty strong { color:#e4eaf2; font-size:11.5px; }
.voice4-profile-empty small { color:#7b8a9f; font-size:10.5px; }
.voice4-editor-head { display:flex; align-items:flex-start; gap:12px; padding:14px 16px; border:1px solid rgba(124,92,252,.15); border-top:2px solid #7c5cfc; border-radius:11px; background:linear-gradient(110deg,rgba(124,92,252,.07),#111827 36%); }
.voice4-editor-head > div { display:grid; gap:2px; }
.voice4-editor-head h3 { margin:0; color:#f1f5f9; font-size:16px; }
.voice4-editor-head p { margin:2px 0 0; color:#7d8ba0; font-size:10.5px; }
.voice4-editor-head .btn { margin-left:auto; }
.voice4-form.is-collapsed { display:none; }
.voice4-profile-name-field { margin-top:12px; }
.voice4-active-section .voice4-empty { min-height:82px; }
.voice4-shell { padding-bottom:82px; }

@media (max-width: 1180px) {
  .voice4-profile-grid { grid-template-columns:1fr; }
}
@media (max-width: 760px) {
  .voice4-profile-route { grid-template-columns:1fr; }
  .voice4-profile-route > b { display:none; }
  .voice4-profile-meta { grid-template-columns:1fr; }
  .voice4-editor-head { flex-direction:column; }
  .voice4-editor-head .btn { margin-left:0; }
}

/* v38 — Alerts: 4A redesign, preserving original functionality */
.alerts4-shell { display:grid; gap:12px; padding-bottom:78px; }
.alerts4-hero { display:flex; align-items:center; gap:12px; min-height:84px; padding:14px 16px; border:1px solid rgba(124,92,252,.17); border-top:2px solid #7c5cfc; border-radius:11px; background:linear-gradient(110deg,rgba(124,92,252,.075),#111827 38%); }
.alerts4-hero-icon,.alerts4-section-icon { display:grid; place-items:center; flex:0 0 auto; width:36px; height:36px; border-radius:10px; background:rgba(124,92,252,.14); color:#aa98ff; font-size:16px; font-weight:800; }
.alerts4-hero-copy { display:grid; min-width:0; gap:2px; }
.alerts4-hero-copy > span,.alerts4-eyebrow { color:#8e7cf5; font-size:10.5px; font-weight:800; letter-spacing:.035em; text-transform:uppercase; }
.alerts4-hero-copy h3 { margin:0; color:#f3f6fb; font-size:17px; line-height:1.2; }
.alerts4-hero-copy p { margin:2px 0 0; color:#8391a5; font-size:10.5px; line-height:1.45; }
.alerts4-hero-status { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:7px; margin-left:auto; }
.alerts4-status,.alerts4-state,.alerts4-template-badge { display:inline-flex; align-items:center; gap:5px; min-height:24px; padding:4px 8px; border:1px solid rgba(255,255,255,.055); border-radius:999px; background:#0d1624; color:#9ba9bc; font-size:9.5px; font-weight:700; white-space:nowrap; }
.alerts4-status i,.alerts4-state i,.alerts4-api-strip i { width:6px; height:6px; border-radius:50%; background:#64748b; }
.alerts4-status.is-ok,.alerts4-state:not(.is-paused) { border-color:rgba(34,197,94,.17); color:#56d987; background:rgba(34,197,94,.055); }
.alerts4-status.is-ok i,.alerts4-state:not(.is-paused) i { background:#22c55e; box-shadow:0 0 0 3px rgba(34,197,94,.07); }
.alerts4-status.is-warn { border-color:rgba(245,158,11,.18); color:#f5bc55; background:rgba(245,158,11,.05); }
.alerts4-state.is-live { border-color:rgba(239,68,68,.2); color:#ff7a7a; background:rgba(239,68,68,.06); }
.alerts4-state.is-live i { background:#ef4444; box-shadow:0 0 0 3px rgba(239,68,68,.08); }
.alerts4-state.is-paused { color:#8c99aa; }

.alerts4-kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:9px; }
.alerts4-kpi { min-height:76px; padding:12px 13px; border:1px solid rgba(255,255,255,.055); border-top:2px solid rgba(124,92,252,.75); border-radius:10px; background:#111827; }
.alerts4-kpi > span { display:block; color:#7889a1; font-size:9.5px; font-weight:800; letter-spacing:.04em; }
.alerts4-kpi > strong { display:block; margin-top:4px; color:#f3f6fb; font-size:20px; line-height:1; }
.alerts4-kpi > small { display:block; margin-top:5px; color:#78879b; font-size:10.5px; }

.alerts4-tabs { display:flex; align-items:center; gap:5px; min-height:42px; padding:5px; border:1px solid rgba(255,255,255,.05); border-radius:9px; background:#101927; }
.alerts4-tab { display:inline-flex; align-items:center; gap:7px; min-height:30px; padding:6px 10px; border:1px solid transparent; border-radius:7px; background:transparent; color:#8392a6; font:inherit; font-size:10.5px; font-weight:700; cursor:pointer; }
.alerts4-tab:hover { color:#dce3ed; background:rgba(255,255,255,.025); }
.alerts4-tab.active { border-color:rgba(124,92,252,.2); background:rgba(124,92,252,.15); color:#dfd8ff; }
.alerts4-tab b { display:grid; place-items:center; min-width:18px; height:18px; padding:0 5px; border-radius:999px; background:rgba(124,92,252,.12); color:#a998ff; font-size:8.5px; }
.alerts4-panel.hidden { display:none; }

.alerts4-card { overflow:hidden; border:1px solid rgba(255,255,255,.055); border-radius:11px; background:#111827; }
.alerts4-section-head { display:flex; align-items:center; gap:10px; min-height:54px; padding:10px 12px; border-bottom:1px solid rgba(255,255,255,.045); }
.alerts4-section-head > div:nth-child(2) { display:grid; min-width:0; gap:2px; }
.alerts4-section-head strong { color:#eaf0f7; font-size:11.5px; }
.alerts4-section-head small { color:#78889e; font-size:10.5px; line-height:1.35; }
.alerts4-section-head .btn { margin-left:auto; }
.alerts4-section-icon { width:30px; height:30px; border-radius:8px; font-size:12px; }
.alerts4-api-strip { display:flex; flex-wrap:wrap; gap:6px; padding:9px 12px; border-bottom:1px solid rgba(255,255,255,.04); background:#0e1724; }
.alerts4-api-strip span { display:inline-flex; align-items:center; gap:5px; min-height:24px; padding:4px 7px; border:1px solid rgba(255,255,255,.045); border-radius:7px; color:#8190a4; font-size:9.5px; }
.alerts4-api-strip .is-ready { color:#7fcf98; }
.alerts4-api-strip .is-ready i { background:#22c55e; }
.alerts4-api-strip .is-missing { color:#e1a95c; }
.alerts4-api-strip .is-missing i { background:#f59e0b; }

.alerts4-alert-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; padding:12px; }
.alerts4-alert-card { min-width:0; padding:11px; border:1px solid rgba(255,255,255,.05); border-left:2px solid rgba(124,92,252,.82); border-radius:9px; background:#0e1725; }
.alerts4-alert-card-head { display:flex; align-items:center; gap:9px; }
.alerts4-platform-mark { display:grid; place-items:center; width:34px; height:34px; flex:0 0 34px; border-radius:9px; background:rgba(124,92,252,.13); color:#ab99ff; font-size:9px; font-weight:900; letter-spacing:-.02em; }
.alerts4-platform-mark[data-platform="youtube"] { background:rgba(239,68,68,.1); color:#ff7c7c; }
.alerts4-platform-mark[data-platform="twitch"] { background:rgba(145,70,255,.12); color:#b788ff; }
.alerts4-platform-mark[data-platform="kick"] { background:rgba(83,252,24,.08); color:#76ec5d; }
.alerts4-platform-mark[data-platform="steam"] { background:rgba(59,130,246,.1); color:#7eb4ff; }
.alerts4-platform-mark[data-platform="x"] { background:rgba(148,163,184,.08); color:#d0d7e0; }
.alerts4-platform-mark[data-platform="instagram"] { background:rgba(236,72,153,.1); color:#f28abc; }
.alerts4-alert-title { display:grid; min-width:0; gap:2px; }
.alerts4-alert-title strong { color:#eef2f7; font-size:12px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.alerts4-alert-title small { color:#78879c; font-size:10px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.alerts4-alert-eyebrow { display:flex; flex-wrap:wrap; gap:5px; color:#73839a; font-size:8.7px; font-weight:800; text-transform:uppercase; }
.alerts4-alert-eyebrow span + span::before { content:"·"; margin-right:5px; color:#4f5d71; }
.alerts4-alert-card .alerts4-state { margin-left:auto; }
.alerts4-alert-meta-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; margin-top:10px; }
.alerts4-alert-meta-grid > div { min-width:0; padding:7px 8px; border:1px solid rgba(255,255,255,.035); border-radius:7px; background:#0b1420; }
.alerts4-alert-meta-grid span { display:block; color:#65758c; font-size:8.7px; font-weight:800; text-transform:uppercase; }
.alerts4-alert-meta-grid strong { display:block; margin-top:3px; color:#cbd5e1; font-size:10.2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.alerts4-alert-actions { display:flex; align-items:center; gap:6px; margin-top:9px; padding-top:9px; border-top:1px solid rgba(255,255,255,.04); }
.alerts4-alert-actions .btn-danger { margin-left:auto; }
.alerts4-empty { grid-column:1/-1; display:flex; align-items:center; justify-content:center; gap:10px; min-height:110px; padding:18px; border:1px dashed rgba(124,92,252,.14); border-radius:9px; background:#0c1522; }
.alerts4-empty > span { display:grid; place-items:center; width:34px; height:34px; border-radius:9px; background:rgba(124,92,252,.12); color:#a897ff; font-weight:800; }
.alerts4-empty > div { display:grid; gap:2px; }
.alerts4-empty strong { color:#e5ebf4; font-size:11.5px; }
.alerts4-empty small { color:#77879c; font-size:10.5px; }
.alerts4-empty .btn { margin-left:10px; }
.alerts4-origin-note { display:flex; align-items:flex-start; gap:8px; margin:0 12px 12px; padding:8px 9px; border:1px solid rgba(59,130,246,.08); border-radius:8px; background:rgba(59,130,246,.035); }
.alerts4-origin-note > span { display:grid; place-items:center; width:22px; height:22px; flex:0 0 22px; border-radius:6px; background:rgba(59,130,246,.1); color:#82b0ff; font-size:10px; font-weight:800; }
.alerts4-origin-note p { margin:1px 0 0; color:#728198; font-size:10px; line-height:1.45; }
.alerts4-origin-note code { color:#a998ff; }

/* Alert create wizard */
.alerts4-create-form { padding-bottom:76px; }
.alerts4-create-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; padding:12px; }
.alerts4-step-card { min-width:0; padding:11px; border:1px solid rgba(255,255,255,.045); border-radius:9px; background:#0e1725; }
.alerts4-step-wide { grid-column:1/-1; }
.alerts4-step-head { display:flex; align-items:center; gap:9px; padding-bottom:9px; border-bottom:1px solid rgba(255,255,255,.04); }
.alerts4-step-head > span { display:grid; place-items:center; width:24px; height:24px; flex:0 0 24px; border-radius:7px; background:rgba(124,92,252,.13); color:#aa98ff; font-size:9.5px; font-weight:900; }
.alerts4-step-head > div { display:grid; gap:2px; }
.alerts4-step-head strong { color:#e8edf4; font-size:11.5px; }
.alerts4-step-head small { color:#75849a; font-size:10.5px; }
.alerts4-step-body { margin-top:10px; }
.alerts4-two { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.alerts4-create-form .field-label,.alerts4-template-card .field-label,.alerts4-edit-form .field-label { color:#8292a8; font-size:10.5px; font-weight:800; }
.alerts4-create-form .hint,.alerts4-template-card .hint,.alerts4-edit-form .hint { color:#718198; font-size:10.5px; line-height:1.4; }
.alerts4-steam-search { margin-top:2px; padding:10px; border:1px solid rgba(124,92,252,.08); border-radius:8px; background:#0b1420; }
.alerts4-savebar { position:sticky; bottom:8px; z-index:12; display:flex; align-items:center; gap:10px; min-height:58px; margin:0 10px 10px; padding:9px 10px; border:1px solid rgba(124,92,252,.15); border-radius:10px; background:rgba(15,24,39,.97); box-shadow:0 12px 32px rgba(0,0,0,.28); backdrop-filter:blur(12px); }
.alerts4-savebar > div { display:grid; gap:2px; }
.alerts4-savebar strong { color:#e7edf5; font-size:11.5px; }
.alerts4-savebar small { color:#77879c; font-size:10.5px; }
.alerts4-savebar .btn:first-of-type { margin-left:auto; }

/* Stream template editor */
.alerts4-template-card { padding-bottom:74px; }
.alerts4-template-head > div:nth-child(2) { gap:2px; }
.alerts4-template-head .alerts4-eyebrow { margin-bottom:1px; }
.alerts4-template-badge { margin-left:auto; color:#aa9bf7; border-color:rgba(124,92,252,.15); }
.alerts4-template-toolbar { display:flex; align-items:end; gap:12px; padding:10px 12px; border-bottom:1px solid rgba(255,255,255,.04); background:#0e1724; }
.alerts4-inner-tabs { display:flex; gap:4px; padding:3px; border:1px solid rgba(255,255,255,.045); border-radius:8px; background:#0b1420; }
.alerts4-template-card .alert-editor-tab,.alerts4-template-card .alert-editor-subtab,.alerts4-template-card .alert-phase-tab,.alerts4-template-card .alert-preview-phase-tab { min-height:28px; padding:5px 9px; border:1px solid transparent; border-radius:6px; background:transparent; color:#7d8da2; font-size:10px; font-weight:800; }
.alerts4-template-card .alert-editor-tab.active,.alerts4-template-card .alert-editor-subtab.active,.alerts4-template-card .alert-phase-tab.active,.alerts4-template-card .alert-preview-phase-tab.active { border-color:rgba(124,92,252,.19); background:rgba(124,92,252,.14); color:#ddd5ff; }
.alerts4-template-selects { display:grid; grid-template-columns:minmax(230px,1fr) minmax(170px,.55fr); gap:8px; margin-left:auto; }
.alerts4-template-selects .field { margin:0; }
.alerts4-template-panel { padding:12px; }
.alerts4-template-config-grid { display:grid; grid-template-columns:minmax(230px,.6fr) minmax(0,1.4fr); gap:9px; }
.alerts4-toggle-card,.alerts4-ping-card { min-height:68px; padding:9px 10px; border:1px solid rgba(255,255,255,.045); border-radius:8px; background:#0d1624; }
.alerts4-toggle-card { display:flex; align-items:center; gap:10px; cursor:pointer; }
.alerts4-toggle-card > div { display:grid; gap:2px; }
.alerts4-toggle-card strong,.alerts4-mini-head strong { color:#e6ecf4; font-size:11px; }
.alerts4-toggle-card small,.alerts4-mini-head small { color:#76869c; font-size:10.5px; line-height:1.35; }
.alerts4-toggle-card > .toggle { margin-left:auto; }
.alerts4-ping-card { display:grid; gap:8px; }
.alerts4-mini-head { display:grid; gap:2px; }
.alerts4-role-checks { display:flex; flex-wrap:wrap; gap:5px; }
.alerts4-role-checks .checkbox-inline { min-height:25px; padding:4px 7px; border:1px solid rgba(124,92,252,.1); border-radius:7px; background:rgba(124,92,252,.04); color:#aeb8c7; font-size:9.7px; }
.alerts4-editor-nav { display:flex; align-items:center; gap:10px; margin-top:10px; padding:7px 8px; border:1px solid rgba(255,255,255,.04); border-radius:8px; background:#0c1522; }
.alerts4-phase-tabs { display:flex; gap:4px; margin-left:auto; }
.alerts4-phase-tabs button { display:inline-flex; align-items:center; gap:5px; }
.alerts4-phase-tabs i { width:6px; height:6px; border-radius:50%; background:#6b7280; }
.alerts4-phase-tabs i.is-live { background:#ef4444; }
.alerts4-phase-tabs i.is-youtube { background:#ff3b3b; }
.alerts4-editor-split { display:grid !important; grid-template-columns:minmax(0,1.38fr) minmax(330px,.72fr) !important; gap:10px !important; margin-top:10px; }
.alerts4-editor-visual-col,.alerts4-editor-preview-col { min-width:0; padding:10px; border:1px solid rgba(255,255,255,.045); border-radius:9px; background:#0d1624; }
.alerts4-editor-preview-col { position:sticky; top:72px; align-self:start; }
.alerts4-discord-preview { margin-top:9px; padding:10px !important; border:1px solid rgba(255,255,255,.045); border-radius:8px; background:#0a1019 !important; }
.alerts4-preview-label { margin-left:4px; color:#687990; font-size:8px; }
.alerts4-template-card .discord-visual-editor { margin-top:8px; }
.alerts4-template-card .discord-message { border-color:rgba(255,255,255,.045); background:#0a1019; }
.alerts4-template-card .alert-layout-panel { border-color:rgba(124,92,252,.09); background:#0c1522; }
.alerts4-template-card .discord-embed { background:#151c27; }
.alerts4-template-card .discord-embed-label { color:#7e8da1; font-size:9.5px; font-weight:800; }
.alerts4-template-card .discord-visual-input { background:#0b1420; border-color:rgba(255,255,255,.06); color:#e7edf5; }
.alerts4-raw-panel,.alerts4-vars-panel { margin-top:10px; padding:10px; border:1px solid rgba(255,255,255,.045); border-radius:9px; background:#0d1624; }
.alerts4-raw-panel .alert-raw-json { margin-top:8px; min-height:360px; font-size:10.5px; }
.alerts4-vars-panel #alert-var-pills { margin-top:9px; }
.alerts4-template-card .alert-var-pill { min-height:27px; padding:5px 8px; font-size:9.7px; }
.alerts4-full-preview-panel { padding:12px; }
.alerts4-full-preview-head { display:flex; align-items:center; gap:10px; margin-bottom:9px; }
.alerts4-full-preview-head .alerts4-phase-tabs { margin-left:auto; }
.alerts4-discord-preview-large { max-width:860px; margin:0 auto; }
.alerts4-template-savebar { margin-top:0; }

/* Alert edit modal */
.alerts4-edit-modal-card { width:min(720px,calc(100vw - 32px)); max-height:min(760px,calc(100vh - 48px)); overflow:auto; scrollbar-color:#344155 #111827; scrollbar-width:thin; }
.alerts4-edit-modal-header { align-items:flex-start; }
.alerts4-edit-modal-header > div { display:grid; gap:2px; }
.alerts4-edit-modal-header h3 { margin:0; color:#f0f4f8; font-size:16px; }
.alerts4-edit-meta { margin:2px 0 0; color:#79889d; font-size:10.5px; }
.alerts4-edit-form { padding:12px; }
.alerts4-edit-section-head { display:flex; align-items:center; gap:9px; margin-bottom:10px; padding:9px; border:1px solid rgba(124,92,252,.08); border-radius:8px; background:#0d1624; }
.alerts4-edit-section-head > span { display:grid; place-items:center; width:27px; height:27px; border-radius:7px; background:rgba(124,92,252,.12); color:#aa99ff; }
.alerts4-edit-section-head > div { display:grid; gap:2px; }
.alerts4-edit-section-head strong { color:#e5ebf3; font-size:11px; }
.alerts4-edit-section-head small { color:#76869b; font-size:10.5px; }
.alerts4-edit-fields { grid-template-columns:repeat(2,minmax(0,1fr)); }
.alerts4-edit-fields .picker-field:first-child { grid-column:1/-1; }
.alerts4-edit-actions { margin-top:12px; padding-top:10px; border-top:1px solid rgba(255,255,255,.045); }

@media (max-width:1320px) {
  .alerts4-alert-grid { grid-template-columns:1fr; }
  .alerts4-editor-split { grid-template-columns:minmax(0,1fr) minmax(300px,.75fr) !important; }
  .alerts4-alert-meta-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:1080px) {
  .alerts4-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .alerts4-create-grid { grid-template-columns:1fr; }
  .alerts4-step-wide { grid-column:auto; }
  .alerts4-template-toolbar { align-items:stretch; flex-direction:column; }
  .alerts4-template-selects { width:100%; margin-left:0; }
  .alerts4-template-config-grid { grid-template-columns:1fr; }
  .alerts4-editor-split { grid-template-columns:1fr !important; }
  .alerts4-editor-preview-col { position:static; }
}
@media (max-width:760px) {
  .alerts4-hero { align-items:flex-start; flex-wrap:wrap; }
  .alerts4-hero-status { width:100%; margin-left:0; justify-content:flex-start; }
  .alerts4-kpis,.alerts4-two,.alerts4-template-selects,.alerts4-edit-fields { grid-template-columns:1fr; }
  .alerts4-alert-meta-grid { grid-template-columns:1fr; }
  .alerts4-editor-nav,.alerts4-full-preview-head { align-items:stretch; flex-direction:column; }
  .alerts4-phase-tabs { margin-left:0; overflow-x:auto; }
  .alerts4-savebar { align-items:stretch; flex-direction:column; }
  .alerts4-savebar .btn:first-of-type { margin-left:0; }
  .alerts4-savebar .btn { width:100%; }
  .alerts4-empty { align-items:flex-start; flex-direction:column; }
  .alerts4-empty .btn { margin-left:0; }
}

/* v39 — Alerts final polish: grouped overview, filters, clearer template/create flow */
.alerts4-source-summary { margin-left:auto; border-color:rgba(245,158,11,.12) !important; background:rgba(245,158,11,.035); color:#d8a855 !important; font-weight:800; }
.alerts4-source-summary.is-complete { border-color:rgba(34,197,94,.12) !important; background:rgba(34,197,94,.035); color:#69cf8b !important; }
.alerts4-overview-toolbar { display:flex; align-items:center; gap:10px; padding:10px 12px; border-bottom:1px solid rgba(255,255,255,.04); background:#101926; }
.alerts4-filter-tabs { display:flex; align-items:center; flex-wrap:wrap; gap:5px; }
.alerts4-filter { display:inline-flex; align-items:center; gap:6px; min-height:30px; padding:6px 9px; border:1px solid rgba(255,255,255,.05); border-radius:7px; background:#0c1521; color:#8b9aaf; font:inherit; font-size:10.5px; font-weight:800; cursor:pointer; transition:150ms ease; }
.alerts4-filter:hover { color:#dce4ef; border-color:rgba(124,92,252,.14); }
.alerts4-filter.active { border-color:rgba(124,92,252,.22); background:rgba(124,92,252,.14); color:#ded7ff; }
.alerts4-filter b { display:grid; place-items:center; min-width:18px; height:18px; padding:0 5px; border-radius:999px; background:rgba(124,92,252,.1); color:#a998ff; font-size:8.5px; }
.alerts4-search-wrap { display:flex; align-items:center; gap:7px; min-width:260px; max-width:380px; margin-left:auto; padding:0 9px; border:1px solid rgba(255,255,255,.055); border-radius:8px; background:#0b1420; }
.alerts4-search-wrap > span { color:#67778e; font-size:13px; }
.alerts4-search-wrap input { width:100%; min-height:32px; border:0; outline:0; background:transparent; color:#e4eaf2; font:inherit; font-size:10.5px; }
.alerts4-search-wrap input::placeholder { color:#5f6e82; }
.alerts4-alert-sections { display:grid; }
.alerts4-alert-section { border-bottom:1px solid rgba(255,255,255,.045); }
.alerts4-alert-section:last-child { border-bottom:0; }
.alerts4-alert-section-head { display:flex; align-items:center; gap:10px; min-height:44px; padding:8px 12px 0; }
.alerts4-alert-section-title { display:flex; align-items:center; gap:8px; min-width:0; }
.alerts4-alert-section-title > span { display:grid; place-items:center; width:25px; height:25px; flex:0 0 25px; border-radius:7px; background:rgba(124,92,252,.1); color:#9f90f5; font-size:9px; font-weight:900; }
.alerts4-alert-section-title > div { display:grid; gap:1px; }
.alerts4-alert-section-title strong { color:#dfe6ef; font-size:11.5px; }
.alerts4-alert-section-title small { color:#718198; font-size:10.5px; }
.alerts4-alert-section-head > b { display:grid; place-items:center; min-width:22px; height:22px; margin-left:auto; padding:0 6px; border-radius:999px; background:#0c1522; color:#8e7cf5; font-size:9px; }
.alerts4-alert-section .alerts4-alert-grid { padding-top:9px; }
.alerts4-alert-actions { justify-content:space-between; }
.alerts4-alert-action-main { display:flex; align-items:center; gap:6px; }
.alerts4-alert-actions .btn-danger { margin-left:0; }
.alerts4-alert-meta-grid strong.is-empty-value { color:#748399; font-weight:600; }
.alerts4-filter-empty { margin:12px; }

.alerts4-create-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:0 12px 10px; padding:9px; border:1px solid rgba(124,92,252,.1); border-radius:9px; background:rgba(124,92,252,.035); }
.alerts4-create-summary > div { min-width:0; padding:7px 8px; border:1px solid rgba(255,255,255,.04); border-radius:7px; background:#0c1522; }
.alerts4-create-summary span { display:block; color:#6f7f95; font-size:9.5px; font-weight:800; text-transform:uppercase; letter-spacing:.03em; }
.alerts4-create-summary strong { display:block; margin-top:3px; color:#dce4ed; font-size:10.8px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

.alerts4-template-config-title { grid-column:1/-1; display:grid; gap:2px; padding:2px 1px 1px; }
.alerts4-template-config-title > span { color:#8877e8; font-size:9.5px; font-weight:900; letter-spacing:.04em; }
.alerts4-template-config-title > strong { color:#e2e8f0; font-size:11.5px; }
.alerts4-template-config-title > small { color:#738399; font-size:10.5px; }
.alerts4-template-config-grid { grid-template-columns:minmax(210px,.5fr) minmax(0,1.5fr); align-items:start; }
.alerts4-toggle-card,.alerts4-ping-card { min-height:72px; }
.alerts4-ping-card { align-content:start; }
.alerts4-role-checks { max-height:86px; overflow:auto; padding-right:3px; scrollbar-color:#344155 transparent; scrollbar-width:thin; }
.alerts4-role-checks .checkbox-inline { min-height:27px; padding:5px 8px; font-size:10px; }
.alerts4-editor-visual-col > .alerts4-mini-head { margin-bottom:7px; padding-bottom:7px; border-bottom:1px solid rgba(255,255,255,.04); }

@media (max-width: 980px) {
  .alerts4-overview-toolbar { align-items:stretch; flex-direction:column; }
  .alerts4-search-wrap { width:100%; max-width:none; margin-left:0; }
  .alerts4-create-summary { grid-template-columns:1fr; }
}
@media (max-width: 680px) {
  .alerts4-filter-tabs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); width:100%; }
  .alerts4-filter { justify-content:center; }
  .alerts4-alert-action-main { flex-wrap:wrap; }
  .alerts4-alert-section-head { align-items:flex-start; }
}


/* ==========================================================================\n   DidiBot 4A v40 — Alerts final template-editor polish\n   ========================================================================== */
.alerts4-role-checks {
  display:grid !important;
  grid-template-columns:repeat(auto-fill,minmax(132px,1fr));
  gap:6px;
  max-height:132px;
  padding:2px 4px 2px 0;
  overflow:auto;
}
.alerts4-role-checks .checkbox-inline {
  display:flex;
  align-items:center;
  width:100%;
  min-width:0;
  min-height:32px;
  margin:0 !important;
  padding:6px 9px;
  border:1px solid rgba(255,255,255,.05);
  border-radius:7px;
  background:#0b1420;
  color:#aeb9c8;
  font-size:10.5px;
  font-weight:700;
  overflow:hidden;
}
.alerts4-role-checks .checkbox-inline:hover {
  border-color:rgba(124,92,252,.16);
  background:rgba(124,92,252,.045);
  color:#e2e7ef;
}
.alerts4-role-checks .checkbox-inline input { flex:0 0 auto; margin-right:7px; }
.alerts4-role-checks .checkbox-inline span,
.alerts4-role-checks .checkbox-inline { text-overflow:ellipsis; white-space:nowrap; }

.alerts4-template-card .discord-visual-editor {
  display:grid;
  gap:9px;
  padding:0;
  background:transparent;
}
.alerts4-template-card .discord-message > .discord-msg-header { margin-bottom:4px; }
.alerts4-visual-section {
  border:1px solid rgba(255,255,255,.045);
  border-radius:9px;
  background:#0c1522;
}
.alerts4-message-section { padding:9px; }
.alerts4-message-section .discord-msg-content-wrap { margin:8px 0 0; }
.alerts4-message-section .discord-msg-textarea { min-height:38px; }
.alerts4-visual-section-head {
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:8px;
}
.alerts4-visual-section-head > span {
  display:grid;
  place-items:center;
  width:23px;
  height:23px;
  flex:0 0 23px;
  border-radius:6px;
  background:rgba(124,92,252,.13);
  color:#aa9bff;
  font-size:9px;
  font-weight:900;
}
.alerts4-visual-section-head > div { display:grid; gap:1px; min-width:0; }
.alerts4-visual-section-head strong { color:#e4eaf2; font-size:11px; }
.alerts4-visual-section-head small { color:#77879c; font-size:10.5px; line-height:1.35; }
.alerts4-visual-section-head code { color:#a998ff; font-size:9.5px; }

.alerts4-template-card .alert-layout-panel.alerts4-visual-section-images {
  margin:0;
  padding:9px;
  border-color:rgba(255,255,255,.045);
  background:#0c1522;
}
.alerts4-template-card .alert-layout-panel.alerts4-visual-section-images > .hint { margin:0 0 8px; }
.alerts4-template-card .alert-layout-grid { gap:7px; margin-bottom:7px; }
.alerts4-template-card .alert-layout-presets { gap:5px; }

.alerts4-template-card .discord-embed-editable.alerts4-visual-section-embed {
  width:100%;
  max-width:none;
  margin:0;
  padding:9px;
  border-left:3px solid var(--embed-color,#9146ff);
  border-top:1px solid rgba(255,255,255,.045);
  border-right:1px solid rgba(255,255,255,.045);
  border-bottom:1px solid rgba(255,255,255,.045);
  border-radius:9px;
  background:#0c1522;
}
.alerts4-template-card .alert-color-hint {
  margin:0 0 8px;
  padding:6px 8px;
  border-radius:6px;
  background:#0a121d;
  color:#72839a;
}
.alerts4-embed-editor-block {
  margin:0 0 7px !important;
  padding:8px;
  border:1px solid rgba(255,255,255,.04);
  border-radius:7px;
  background:#0a131f;
}
.alerts4-embed-editor-block:last-child { margin-bottom:0 !important; }
.alerts4-fields-editor-block { display:grid; gap:7px; }
.alerts4-fields-editor-block::before {
  content:"FELDER";
  display:block;
  color:#7e8da1;
  font-size:9.5px;
  font-weight:800;
  letter-spacing:.035em;
}
.alerts4-template-card .discord-embed-field-edit {
  gap:7px;
  padding:7px;
  border:1px solid rgba(255,255,255,.035);
  background:#0c1623;
}
.alerts4-template-card .discord-embed-main { gap:8px; }
.alerts4-template-card .discord-embed-image-slot { margin:7px 0; }

.alerts4-group-empty {
  grid-column:1/-1;
  display:flex;
  align-items:center;
  gap:9px;
  min-height:62px;
  padding:10px 12px;
  border:1px dashed rgba(255,255,255,.055);
  border-radius:8px;
  background:#0b1420;
}
.alerts4-group-empty > span {
  display:grid;
  place-items:center;
  width:26px;
  height:26px;
  border-radius:7px;
  background:rgba(124,92,252,.1);
  color:#9e8ef4;
  font-weight:900;
}
.alerts4-group-empty > div { display:grid; gap:2px; }
.alerts4-group-empty strong { color:#cfd8e4; font-size:10.8px; }
.alerts4-group-empty small { color:#718198; font-size:10.5px; }

@media (max-width:1100px) {
  .alerts4-role-checks { grid-template-columns:repeat(auto-fill,minmax(118px,1fr)); }
}
@media (max-width:720px) {
  .alerts4-role-checks { grid-template-columns:1fr 1fr; max-height:176px; }
  .alerts4-template-card .discord-embed-field-edit { grid-template-columns:1fr; }
}


/* ========================================================================== */
/* Utility 4A — v41                                                          */
/* ========================================================================== */

.utility4-page {
  display:grid;
  gap:12px;
  padding-bottom:26px;
}

.utility4-hero {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:15px 18px;
  border-top:1px solid rgba(124,92,252,.75);
  background:linear-gradient(115deg,rgba(124,92,252,.075),rgba(17,24,39,.98) 42%,rgba(17,24,39,.98));
}

.utility4-hero-main {
  display:flex;
  align-items:center;
  gap:13px;
  min-width:0;
}

.utility4-hero-icon,
.utility4-section-icon,
.utility4-quick-icon {
  display:grid;
  place-items:center;
  flex:0 0 auto;
  border:1px solid rgba(124,92,252,.18);
  background:rgba(124,92,252,.12);
  color:#a99bff;
}

.utility4-hero-icon {
  width:38px;
  height:38px;
  border-radius:10px;
}

.utility4-hero-icon svg {
  width:19px;
  height:19px;
  stroke:currentColor;
  fill:none;
  stroke-width:1.8;
}

.utility4-eyebrow {
  display:block;
  margin-bottom:3px;
  color:#8f7df2;
  font-size:11.5px;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.utility4-hero h3,
.utility4-server-hero h3,
.utility4-profile-name h3 {
  margin:0;
  color:#f8fafc;
  font-size:17px;
  line-height:1.2;
}

.utility4-hero p,
.utility4-server-hero p,
.utility4-profile-name p {
  margin:4px 0 0;
  color:#8795aa;
  font-size:12.5px;
  line-height:1.45;
}

.utility4-hero-badges,
.utility4-profile-badges {
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:7px;
  flex-wrap:wrap;
}

.utility4-status-badge,
.utility4-state {
  display:inline-flex;
  align-items:center;
  gap:5px;
  min-height:23px;
  padding:3px 8px;
  border:1px solid rgba(255,255,255,.065);
  border-radius:999px;
  background:#0c1522;
  color:#94a3b8;
  font-size:10.5px;
  font-weight:800;
  white-space:nowrap;
}

.utility4-status-badge::before,
.utility4-state::before {
  content:"";
  width:5px;
  height:5px;
  border-radius:50%;
  background:#64748b;
}

.utility4-status-badge.is-success,
.utility4-state.is-success {
  border-color:rgba(34,197,94,.2);
  background:rgba(34,197,94,.07);
  color:#5ee28a;
}

.utility4-status-badge.is-success::before,
.utility4-state.is-success::before { background:#22c55e; }

.utility4-status-badge.is-info,
.utility4-state.is-info {
  border-color:rgba(59,130,246,.2);
  background:rgba(59,130,246,.07);
  color:#78a9ff;
}

.utility4-status-badge.is-info::before,
.utility4-state.is-info::before { background:#3b82f6; }

.utility4-state.is-neutral::before { background:#7c8aa0; }

.utility4-kpi-grid,
.utility4-stat-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:9px;
}

.utility4-kpi-card,
.utility4-stat-card {
  min-height:83px;
  padding:12px 14px;
  border-top:1px solid rgba(124,92,252,.65);
  background:#111827;
}

.utility4-kpi-label,
.utility4-stat-card > small {
  display:block;
  color:#77869d;
  font-size:10.5px;
  font-weight:800;
  letter-spacing:.035em;
}

.utility4-kpi-card > strong,
.utility4-stat-card > strong {
  display:block;
  margin:5px 0 2px;
  color:#f8fafc;
  font-size:22px;
  line-height:1;
}

.utility4-kpi-card > small,
.utility4-stat-card > span {
  color:#8190a5;
  font-size:11px;
}

.utility4-tabs {
  display:flex;
  align-items:center;
  gap:5px;
  padding:5px;
  border:1px solid rgba(255,255,255,.055);
  border-radius:10px;
  background:#0e1725;
  overflow:auto hidden;
}

.utility4-tab {
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-height:31px;
  padding:6px 10px;
  border:1px solid transparent;
  border-radius:7px;
  background:transparent;
  color:#8493a8;
  font:inherit;
  font-size:11.5px;
  font-weight:700;
  cursor:pointer;
  white-space:nowrap;
}

.utility4-tab:hover {
  color:#d8e0eb;
  background:rgba(255,255,255,.025);
}

.utility4-tab.active {
  border-color:rgba(124,92,252,.28);
  background:rgba(124,92,252,.14);
  color:#e8e3ff;
}

.utility4-tab small {
  display:grid;
  place-items:center;
  min-width:18px;
  height:18px;
  padding:0 5px;
  border-radius:999px;
  background:#172238;
  color:#9e8ef4;
  font-size:9.5px;
}

.utility4-overview-grid {
  display:grid;
  grid-template-columns:minmax(0,1.55fr) minmax(300px,.7fr);
  gap:10px;
}

.utility4-section-card {
  padding:11px 12px;
  background:#111827;
}

.utility4-section-heading {
  display:flex;
  align-items:center;
  gap:9px;
  padding-bottom:9px;
  margin-bottom:9px;
  border-bottom:1px solid rgba(255,255,255,.045);
}

.utility4-section-icon {
  width:26px;
  height:26px;
  border-radius:7px;
  font-size:9.5px;
  font-weight:900;
}

.utility4-section-heading > div {
  display:grid;
  gap:1px;
}

.utility4-section-heading strong {
  color:#e9eef6;
  font-size:11.5px;
  line-height:1.25;
}

.utility4-section-heading small {
  color:#7f8ea3;
  font-size:10.5px;
  line-height:1.35;
}

.utility4-quick-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:7px;
}

.utility4-quick-card {
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:9px;
  min-height:59px;
  padding:9px 10px;
  border:1px solid rgba(255,255,255,.05);
  border-radius:9px;
  background:#0d1624;
  color:inherit;
  text-align:left;
  cursor:pointer;
  transition:border-color .16s ease,background .16s ease,transform .16s ease;
}

.utility4-quick-card:hover {
  border-color:rgba(124,92,252,.25);
  background:#101b2b;
  transform:translateY(-1px);
}

.utility4-quick-icon {
  width:29px;
  height:29px;
  border-radius:8px;
  font-size:10px;
  font-weight:900;
}

.utility4-quick-card > span:nth-child(2) {
  display:grid;
  gap:2px;
  min-width:0;
}

.utility4-quick-card strong {
  color:#e5ebf3;
  font-size:11.5px;
}

.utility4-quick-card small {
  overflow:hidden;
  color:#7c8ca2;
  font-size:10.5px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.utility4-quick-card b {
  color:#7968db;
  font-size:15px;
  font-weight:500;
}

.utility4-command-grid {
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}

.utility4-command-grid code,
.utility4-command-hint > code {
  padding:5px 7px;
  border:1px solid rgba(124,92,252,.15);
  border-radius:6px;
  background:#0b1421;
  color:#a999ff;
  font-size:10.5px;
}

.utility4-note {
  margin:10px 0 0;
  padding:8px 9px;
  border:1px solid rgba(255,255,255,.04);
  border-radius:7px;
  background:#0c1522;
  color:#78889e;
  font-size:10.5px;
  line-height:1.5;
}

.utility4-activity-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}

.utility4-activity-column {
  display:grid;
  align-content:start;
  gap:5px;
  min-width:0;
}

.utility4-mini-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:2px;
}

.utility4-mini-head strong {
  color:#cad4e1;
  font-size:10.8px;
}

.utility4-mini-head button {
  border:0;
  background:transparent;
  color:#8877ed;
  font:inherit;
  font-size:10.5px;
  cursor:pointer;
}

.utility4-overview-item {
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:8px;
  min-height:47px;
  padding:7px 8px;
  border:1px solid rgba(255,255,255,.035);
  border-radius:7px;
  background:#0c1522;
}

.utility4-overview-dot {
  width:7px;
  height:7px;
  border-radius:50%;
  background:#7c5cfc;
  box-shadow:0 0 0 4px rgba(124,92,252,.08);
}

.utility4-overview-dot.is-blue {
  background:#3b82f6;
  box-shadow:0 0 0 4px rgba(59,130,246,.08);
}

.utility4-overview-item > div {
  display:grid;
  gap:2px;
  min-width:0;
}

.utility4-overview-item strong {
  overflow:hidden;
  color:#dbe3ed;
  font-size:10.8px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.utility4-overview-item small,
.utility4-overview-item time {
  color:#75869d;
  font-size:10px;
}

.utility4-overview-item time {
  text-align:right;
  white-space:nowrap;
}

.utility4-empty-compact {
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-height:61px;
  padding:9px 10px;
  border:1px dashed rgba(255,255,255,.055);
  border-radius:7px;
  background:#0b1420;
}

.utility4-empty-compact strong {
  color:#bdc8d6;
  font-size:10.8px;
}

.utility4-empty-compact small {
  margin-top:2px;
  color:#6f8097;
  font-size:10.2px;
}

.utility4-split-layout {
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(350px,.65fr);
  align-items:start;
  gap:10px;
}

.utility4-sticky-editor {
  position:sticky;
  top:58px;
}

.utility4-poll-list,
.utility4-reminder-list {
  display:grid;
  gap:7px;
}

.utility4-poll-card {
  padding:10px;
  border:1px solid rgba(255,255,255,.05);
  border-left:2px solid rgba(124,92,252,.82);
  border-radius:9px;
  background:#0c1522;
}

.utility4-poll-card.is-closed {
  border-left-color:#58677c;
  opacity:.86;
}

.utility4-poll-head {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}

.utility4-poll-head > div { min-width:0; }

.utility4-poll-id {
  color:#7d8ca1;
  font-size:9.5px;
  font-weight:800;
  letter-spacing:.035em;
}

.utility4-poll-head h4 {
  margin:3px 0 0;
  color:#edf2f8;
  font-size:12.5px;
  line-height:1.35;
}

.utility4-poll-meta {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:6px;
  margin:9px 0;
}

.utility4-poll-meta > span,
.utility4-profile-grid > div {
  display:grid;
  gap:2px;
  min-width:0;
  padding:6px 7px;
  border:1px solid rgba(255,255,255,.035);
  border-radius:6px;
  background:#0a131f;
}

.utility4-poll-meta small,
.utility4-profile-grid small {
  color:#65758d;
  font-size:9px;
  font-weight:800;
  letter-spacing:.035em;
  text-transform:uppercase;
}

.utility4-poll-meta strong,
.utility4-profile-grid strong {
  overflow:hidden;
  color:#bec9d7;
  font-size:10.3px;
  font-weight:700;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.utility4-poll-results {
  display:grid;
  gap:5px;
}

.utility4-poll-option {
  display:grid;
  gap:4px;
}

.utility4-poll-option > div:first-child {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  color:#9facbe;
  font-size:10.3px;
}

.utility4-poll-option > div:first-child strong {
  color:#d7dfeb;
}

.utility4-progress {
  height:4px;
  overflow:hidden;
  border-radius:999px;
  background:#172235;
}

.utility4-progress i {
  display:block;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,#6f52e8,#9a7cff);
}

.utility4-card-actions {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:9px;
  margin-top:10px;
  padding-top:8px;
  border-top:1px solid rgba(255,255,255,.04);
}

.utility4-card-actions > div {
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
}

.utility4-form-stack {
  display:grid;
  gap:9px;
}

.utility4-form-grid-3 {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:7px;
}

.utility4-option-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding-top:2px;
}

.utility4-option-head > div {
  display:grid;
  gap:1px;
}

.utility4-option-head strong {
  color:#cfd8e4;
  font-size:10.8px;
}

.utility4-option-head small {
  color:#75859b;
  font-size:10px;
}

.utility4-option-list {
  display:grid;
  gap:5px;
}

.utility4-option-list .poll-option-row {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:end;
  gap:6px;
  margin:0;
  padding:6px;
  border:1px solid rgba(255,255,255,.035);
  border-radius:7px;
  background:#0b1420;
}

.utility4-option-list .poll-option-row .field {
  margin:0;
}

.utility4-save-row {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin:10px -12px -11px;
  padding:9px 12px;
  border-top:1px solid rgba(255,255,255,.05);
  border-radius:0 0 10px 10px;
  background:#0d1624;
}

.utility4-save-row > span {
  color:#74849a;
  font-size:10px;
  line-height:1.4;
}

.utility4-empty-panel {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  min-height:106px;
  padding:14px;
  border:1px dashed rgba(255,255,255,.055);
  border-radius:8px;
  background:#0b1420;
  text-align:left;
}

.utility4-empty-panel > span {
  display:grid;
  place-items:center;
  width:30px;
  height:30px;
  border-radius:8px;
  background:rgba(124,92,252,.1);
  color:#a392ff;
  font-size:11px;
  font-weight:900;
}

.utility4-empty-panel > div {
  display:grid;
  gap:2px;
}

.utility4-empty-panel strong {
  color:#c6d0dd;
  font-size:11px;
}

.utility4-empty-panel small {
  color:#74849b;
  font-size:10.3px;
}

.utility4-reminder-card {
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  min-height:63px;
  padding:9px 10px;
  border:1px solid rgba(255,255,255,.045);
  border-radius:8px;
  background:#0c1522;
}

.utility4-reminder-marker {
  width:8px;
  height:8px;
  border-radius:50%;
  background:#3b82f6;
  box-shadow:0 0 0 5px rgba(59,130,246,.07);
}

.utility4-reminder-copy {
  display:grid;
  gap:2px;
  min-width:0;
}

.utility4-reminder-copy > strong {
  overflow:hidden;
  color:#dde5ef;
  font-size:11px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.utility4-reminder-copy > small {
  color:#75869c;
  font-size:10px;
}

.utility4-reminder-time {
  display:grid;
  gap:2px;
  text-align:right;
}

.utility4-reminder-time strong {
  color:#9f8fff;
  font-size:10.8px;
}

.utility4-reminder-time small {
  color:#6e7f95;
  font-size:9.8px;
}

.utility4-reminder-text {
  min-height:92px;
  resize:vertical;
}

.utility4-server-hero {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:15px 16px;
  border-top:1px solid rgba(124,92,252,.7);
  background:linear-gradient(110deg,rgba(124,92,252,.07),#111827 38%);
}

.utility4-server-identity {
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
}

.utility4-server-icon,
.utility4-profile-avatar {
  width:54px;
  height:54px;
  flex:0 0 auto;
  border:1px solid rgba(255,255,255,.065);
  border-radius:12px;
  object-fit:cover;
  background:#0b1420;
}

.utility4-avatar-fallback {
  display:grid;
  place-items:center;
  color:#9a8aef;
  font-size:17px;
  font-weight:900;
}

.utility4-owner-card {
  display:flex;
  align-items:center;
  gap:8px;
  min-width:190px;
  padding:8px 10px;
  border:1px solid rgba(255,255,255,.05);
  border-radius:9px;
  background:#0c1522;
}

.utility4-owner-card > img,
.utility4-owner-card > span {
  width:30px;
  height:30px;
  flex:0 0 auto;
  border-radius:50%;
  object-fit:cover;
}

.utility4-owner-card > span {
  display:grid;
  place-items:center;
  background:rgba(124,92,252,.12);
  color:#9f8fff;
  font-size:11px;
  font-weight:900;
}

.utility4-owner-card > div {
  display:grid;
  gap:1px;
}

.utility4-owner-card small {
  color:#6e7e94;
  font-size:9.5px;
}

.utility4-owner-card strong {
  color:#dce4ee;
  font-size:10.8px;
}

.utility4-stat-grid {
  grid-template-columns:repeat(3,minmax(0,1fr));
}

.utility4-command-hint {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.utility4-command-hint > div {
  display:grid;
  gap:2px;
}

.utility4-command-hint strong {
  color:#cdd7e3;
  font-size:11px;
}

.utility4-command-hint small {
  color:#77889e;
  font-size:10.5px;
}

.utility4-user-layout {
  display:grid;
  grid-template-columns:minmax(350px,.72fr) minmax(0,1.28fr);
  align-items:start;
  gap:10px;
}

.utility4-user-search-grid {
  display:grid;
  grid-template-columns:1fr 1fr auto;
  align-items:end;
  gap:7px;
}

.utility4-user-results {
  display:grid;
  gap:5px;
  margin-top:9px;
}

.utility4-user-result {
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:8px;
  width:100%;
  padding:7px 8px;
  border:1px solid rgba(255,255,255,.04);
  border-radius:7px;
  background:#0b1420;
  color:inherit;
  text-align:left;
  cursor:pointer;
}

.utility4-user-result:hover {
  border-color:rgba(124,92,252,.22);
  background:#0f1928;
}

.utility4-user-result > img,
.utility4-user-result-fallback {
  width:28px;
  height:28px;
  border-radius:50%;
  object-fit:cover;
}

.utility4-user-result-fallback {
  display:grid;
  place-items:center;
  background:rgba(124,92,252,.12);
  color:#a797ff;
  font-size:10px;
  font-weight:900;
}

.utility4-user-result > span:nth-child(2) {
  display:grid;
  gap:1px;
  min-width:0;
}

.utility4-user-result strong {
  color:#dbe3ed;
  font-size:10.8px;
}

.utility4-user-result small {
  overflow:hidden;
  color:#718198;
  font-size:9.8px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.utility4-user-result b {
  color:#7c6add;
  font-weight:500;
}

.utility4-search-loading {
  padding:8px;
  color:#77879e;
  font-size:10.5px;
}

.utility4-user-command-hint {
  margin-top:10px;
  padding:8px 9px;
  border:1px solid rgba(255,255,255,.04);
  border-radius:7px;
  background:#0b1420;
}

.utility4-user-profile-shell {
  min-height:260px;
}

.utility4-user-empty {
  min-height:185px;
}

.utility4-profile-card {
  display:grid;
  gap:11px;
}

.utility4-profile-head {
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:11px;
  padding:10px;
  border:1px solid rgba(255,255,255,.045);
  border-radius:9px;
  background:#0c1522;
}

.utility4-profile-name {
  min-width:0;
}

.utility4-profile-actions {
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:6px;
  flex-wrap:wrap;
}

.utility4-profile-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:6px;
}

@media (max-width:1180px) {
  .utility4-overview-grid,
  .utility4-user-layout,
  .utility4-split-layout {
    grid-template-columns:1fr;
  }

  .utility4-sticky-editor {
    position:static;
  }

  .utility4-kpi-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .utility4-stat-grid {
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}

@media (max-width:820px) {
  .utility4-hero,
  .utility4-server-hero,
  .utility4-command-hint {
    align-items:flex-start;
    flex-direction:column;
  }

  .utility4-hero-badges {
    justify-content:flex-start;
  }

  .utility4-activity-grid,
  .utility4-quick-grid,
  .utility4-stat-grid {
    grid-template-columns:1fr;
  }

  .utility4-poll-meta,
  .utility4-profile-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .utility4-user-search-grid,
  .utility4-form-grid-3 {
    grid-template-columns:1fr;
  }

  .utility4-profile-head {
    grid-template-columns:auto 1fr;
  }

  .utility4-profile-actions {
    grid-column:1/-1;
    justify-content:flex-start;
  }
}

@media (max-width:560px) {
  .utility4-kpi-grid,
  .utility4-poll-meta,
  .utility4-profile-grid {
    grid-template-columns:1fr;
  }

  .utility4-card-actions,
  .utility4-save-row,
  .utility4-reminder-card {
    align-items:flex-start;
    flex-direction:column;
  }

  .utility4-reminder-card {
    display:flex;
  }

  .utility4-reminder-time {
    text-align:left;
  }
}

/* ========================================================================== */
/* DidiBot 4A v42 · Utility final polish                                     */
/* ========================================================================== */

.utility4-split-layout.is-empty-list {
  grid-template-columns:minmax(0,1fr) minmax(480px,.92fr);
}

.utility4-split-layout.is-empty-list .utility4-empty-panel {
  min-height:72px;
  padding:11px 13px;
}

.utility4-split-layout.is-empty-list > .utility4-section-card:first-child {
  align-self:start;
}

.utility4-owner-meta {
  overflow:hidden;
  max-width:180px;
  color:#65758d;
  font-size:9.5px;
  line-height:1.25;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.utility4-stat-value-row {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  min-width:0;
  margin:5px 0 2px;
}

.utility4-stat-value-row > strong {
  overflow:hidden;
  min-width:0;
  color:#f8fafc;
  font-size:22px;
  line-height:1;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.utility4-copy-link {
  flex:0 0 auto;
  min-height:25px;
  padding:4px 7px;
  border:1px solid rgba(124,92,252,.2);
  border-radius:6px;
  background:rgba(124,92,252,.08);
  color:#a99aff;
  font:inherit;
  font-size:9.8px;
  font-weight:800;
  cursor:pointer;
}

.utility4-copy-link:hover {
  border-color:rgba(124,92,252,.38);
  background:rgba(124,92,252,.14);
  color:#d7d0ff;
}

.utility4-user-layout {
  grid-template-columns:minmax(330px,.62fr) minmax(0,1.38fr);
}

.utility4-user-search-grid {
  grid-template-columns:minmax(180px,1fr) minmax(220px,.9fr) auto;
}

.utility4-role-section {
  display:grid;
  gap:8px;
  padding:10px;
  border:1px solid rgba(255,255,255,.045);
  border-radius:9px;
  background:#0c1522;
}

.utility4-role-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.utility4-role-head > div {
  display:grid;
  gap:2px;
}

.utility4-role-head strong {
  color:#d7e0ea;
  font-size:11.5px;
}

.utility4-role-head small,
.utility4-role-head > span {
  color:#74849a;
  font-size:10.5px;
}

.utility4-role-head > span {
  flex:0 0 auto;
  padding:3px 7px;
  border:1px solid rgba(255,255,255,.045);
  border-radius:999px;
  background:#0a131f;
  font-weight:800;
}

.utility4-role-pills {
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}

.utility4-role-pill {
  display:inline-flex;
  align-items:center;
  min-height:27px;
  max-width:100%;
  padding:4px 8px;
  border:1px solid rgba(124,92,252,.18);
  border-radius:999px;
  background:rgba(124,92,252,.08);
  color:#c8bfff;
  font-size:10.5px;
  font-weight:700;
  line-height:1.25;
}

.utility4-role-pill.is-more {
  border-color:rgba(255,255,255,.055);
  background:#0a131f;
  color:#8493a8;
}

@media (max-width:1180px) {
  .utility4-split-layout.is-empty-list,
  .utility4-user-layout {
    grid-template-columns:1fr;
  }
}

@media (max-width:820px) {
  .utility4-user-search-grid {
    grid-template-columns:1fr;
  }

  .utility4-stat-value-row {
    align-items:flex-start;
    flex-direction:column;
  }
}

/* v43 · Server 4A */
.server43-shell{display:flex;flex-direction:column;gap:14px;width:100%;padding-bottom:10px}
.server43-hero,.server43-card,.server43-kpi{border:1px solid var(--border);background:var(--card);border-radius:12px}
.server43-hero{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 18px;border-top-color:rgba(124,92,252,.72)}
.server43-hero-main{display:flex;align-items:center;gap:13px;min-width:0}
.server43-guild-icon{width:48px;height:48px;border-radius:13px;object-fit:cover;flex:0 0 auto;border:1px solid rgba(255,255,255,.08)}
.server43-guild-fallback{display:grid;place-items:center;background:rgba(124,92,252,.16);color:#c4b5fd;font-size:19px;font-weight:800}
.server43-eyebrow,.server43-card-kicker{display:block;color:#9b87ff;font-size:11.5px;line-height:1.2;font-weight:800;letter-spacing:.055em;text-transform:uppercase}
.server43-hero h3{margin:3px 0 2px;font-size:20px;line-height:1.2}
.server43-hero p,.server43-card-head p{margin:0;color:var(--text-muted);font-size:12.5px;line-height:1.45}
.server43-hero-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}
.server43-status{display:inline-flex;align-items:center;gap:6px;padding:6px 9px;border:1px solid var(--border);border-radius:999px;background:rgba(255,255,255,.018);font-size:11.5px;font-weight:700;color:var(--text-muted);white-space:nowrap}
.server43-status i,.server43-system-dot{width:7px;height:7px;border-radius:50%;background:#64748b;box-shadow:0 0 0 3px rgba(100,116,139,.08)}
.server43-status.is-ok i,.server43-system-dot.is-ok{background:#22c55e;box-shadow:0 0 0 3px rgba(34,197,94,.1)}
.server43-status.is-bad i,.server43-system-dot.is-bad{background:#ef4444;box-shadow:0 0 0 3px rgba(239,68,68,.1)}
.server43-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.server43-kpi{min-height:104px;padding:14px 16px;border-top-color:rgba(124,92,252,.65);display:flex;flex-direction:column;justify-content:center}
.server43-kpi>span{color:#8fa1b9;font-size:11.5px;font-weight:800;text-transform:uppercase;letter-spacing:.045em}
.server43-kpi>strong{margin-top:5px;font-size:26px;line-height:1.05;letter-spacing:-.025em}
.server43-kpi>small{margin-top:5px;color:var(--text-muted);font-size:12.5px}
.server43-main-grid{display:grid;grid-template-columns:minmax(310px,.83fr) minmax(0,1.5fr);gap:14px;align-items:stretch}
.server43-card{overflow:hidden}
.server43-card-head{padding:15px 16px;border-bottom:1px solid var(--border)}
.server43-card-head-row{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.server43-card-head h3{margin:3px 0 2px;font-size:15px}
.server43-owner-card{margin:14px 15px 10px;padding:12px;display:flex;align-items:center;gap:11px;border:1px solid var(--border);border-radius:10px;background:rgba(255,255,255,.015)}
.server43-owner-card img,.server43-owner-fallback{width:38px;height:38px;border-radius:50%;object-fit:cover;flex:0 0 auto}
.server43-owner-fallback{display:grid;place-items:center;background:rgba(124,92,252,.16);color:#c4b5fd;font-weight:800}
.server43-owner-card div{display:flex;flex-direction:column;min-width:0}
.server43-owner-card small,.server43-profile-list span,.server43-id-row span{color:var(--text-muted);font-size:11.5px}
.server43-owner-card strong{font-size:13px;margin-top:2px}
.server43-owner-card span{font-size:10.5px;color:#64748b;margin-top:2px}
.server43-profile-list{padding:0 15px 8px;display:grid;grid-template-columns:1fr 1fr;gap:7px}
.server43-profile-list>div{padding:10px 11px;border:1px solid var(--border);border-radius:9px;background:rgba(7,12,22,.22);display:flex;align-items:center;justify-content:space-between;gap:10px}
.server43-profile-list strong{font-size:12.5px;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.server43-id-row{margin:2px 15px 15px;padding:10px 11px;border:1px solid rgba(124,92,252,.18);border-radius:9px;background:rgba(124,92,252,.045);display:flex;align-items:center;justify-content:space-between;gap:10px}
.server43-id-row>div{display:flex;flex-direction:column;gap:3px;min-width:0}
.server43-id-row code{font-size:11px;color:#c4b5fd;overflow:hidden;text-overflow:ellipsis}
.server43-resource-counts{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.server43-resource-counts span{padding:5px 7px;border-radius:999px;border:1px solid var(--border);font-size:10.5px;color:var(--text-muted);white-space:nowrap}
.server43-resource-section{padding:11px 15px 0}
.server43-resource-section:last-child{padding-bottom:15px}
.server43-resource-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:7px}
.server43-resource-title span{font-size:12.5px;font-weight:800}
.server43-resource-title small{color:#9b87ff;font-size:11px;font-weight:800}
.server43-resource-scroll{display:flex;flex-wrap:wrap;gap:6px;max-height:82px;overflow:auto;padding:1px 3px 5px 1px;scrollbar-width:thin;scrollbar-color:#334155 transparent}
.server43-role-scroll{max-height:104px}
.server43-resource-chip{display:inline-flex;align-items:center;gap:5px;padding:6px 8px;border-radius:8px;border:1px solid var(--border);background:rgba(255,255,255,.018);font-size:11.5px;color:#b8c4d6;max-width:230px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.server43-resource-chip b{color:#8796aa;font-size:11px}
.server43-role-chip i{width:7px;height:7px;border-radius:50%;background:var(--server43-role-color,#64748b);flex:0 0 auto}
.server43-empty-inline{font-size:12px;color:var(--text-muted);padding:5px 1px}
.server43-bottom-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.server43-system-grid{display:grid;grid-template-columns:.72fr .9fr 1.6fr;gap:8px;padding:13px 15px 10px}
.server43-system-grid>div{min-height:62px;padding:10px 11px;border:1px solid var(--border);border-radius:9px;background:rgba(255,255,255,.014);display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:8px;align-content:center}
.server43-system-grid>div>.server43-system-dot{grid-row:1/3;align-self:center}
.server43-system-grid small{font-size:10.5px;color:var(--text-muted)}
.server43-system-grid strong{font-size:12.5px;margin-top:2px}
.server43-module-progress{display:block!important}
.server43-module-progress>div{display:flex;align-items:center;justify-content:space-between;gap:10px}
.server43-module-progress>span{display:block;height:5px;border-radius:999px;background:#1b2637;margin-top:10px;overflow:hidden}
.server43-module-progress>span i{display:block;height:100%;background:#7c5cfc;border-radius:inherit}
.server43-link-row{width:calc(100% - 30px);margin:0 15px 14px;padding:9px 10px;border:1px solid var(--border);border-radius:9px;background:rgba(255,255,255,.012);color:var(--text);display:flex;align-items:center;justify-content:space-between;font-size:12px;font-weight:700;cursor:pointer}
.server43-link-row:hover,.server43-action-grid button:hover{border-color:rgba(124,92,252,.34);background:rgba(124,92,252,.055)}
.server43-action-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:13px 15px 15px}
.server43-action-grid button{min-width:0;padding:11px;border:1px solid var(--border);border-radius:9px;background:rgba(255,255,255,.014);color:var(--text);display:grid;grid-template-columns:auto 1fr auto;gap:9px;align-items:center;text-align:left;cursor:pointer}
.server43-action-grid button>span{width:30px;height:30px;border-radius:8px;background:rgba(124,92,252,.12);color:#b9a8ff;display:grid;place-items:center;font-size:14px}
.server43-action-grid button>div{min-width:0;display:flex;flex-direction:column}
.server43-action-grid strong{font-size:12px}
.server43-action-grid small{margin-top:2px;color:var(--text-muted);font-size:10.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.server43-action-grid b{color:#77869b;font-size:13px}
@media (max-width:1180px){.server43-main-grid,.server43-bottom-grid{grid-template-columns:1fr}.server43-action-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:860px){.server43-hero{align-items:flex-start;flex-direction:column}.server43-hero-actions{justify-content:flex-start}.server43-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.server43-profile-list{grid-template-columns:1fr}.server43-system-grid,.server43-action-grid{grid-template-columns:1fr}.server43-card-head-row{flex-direction:column}.server43-resource-counts{justify-content:flex-start}}
@media (max-width:540px){.server43-kpi-grid{grid-template-columns:1fr}.server43-id-row{align-items:flex-start;flex-direction:column}.server43-id-row .btn{width:100%}.server43-guild-icon{width:42px;height:42px}.server43-hero h3{font-size:18px}}

/* v43 server polish end */

/* ── v44 Statistics – 4A management analytics ─────────────────── */
.stats4-shell { gap:14px; }
.stats4-hero {
  min-height:82px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:15px 17px;
  border:1px solid rgba(124,92,252,.2);
  border-top-color:#7c5cfc;
  border-radius:12px;
  background:linear-gradient(105deg,rgba(124,92,252,.055),rgba(17,24,39,.96) 42%,#111827);
}
.stats4-hero-copy { min-width:0; }
.stats4-eyebrow { display:block; margin-bottom:4px; color:#9d8cff; font-size:11.5px; line-height:1.2; font-weight:800; letter-spacing:.045em; text-transform:uppercase; }
.stats4-hero h2 { margin:0; color:var(--text); font-size:18px; letter-spacing:-.02em; }
.stats4-hero p { margin:4px 0 0; color:var(--text-muted); font-size:12.5px; }
.stats4-hero-status { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:7px; }
.stats4-hero-status .status-badge { display:inline-flex; align-items:center; gap:6px; min-height:27px; padding:5px 9px; border:1px solid rgba(255,255,255,.06); border-radius:999px; background:#0d1421; color:#9aa9bc; font-size:11.5px; font-weight:700; white-space:nowrap; }
.stats4-hero-status .status-badge i { width:6px; height:6px; border-radius:50%; background:#64748b; }
.stats4-hero-status .status-badge.success { color:#6ee7a0; border-color:rgba(34,197,94,.15); background:rgba(34,197,94,.055); }
.stats4-hero-status .status-badge.success i { background:#22c55e; }

.stats4-kpi-grid .management-stat { min-height:104px; }
.stats4-kpi-grid .management-stat > span { font-size:11.5px; }
.stats4-kpi-grid .management-stat > small { font-size:11.5px; line-height:1.35; }

.stats4-chart-card { overflow:visible; }
.stats4-chart-head { align-items:flex-start; }
.stats4-chart-head h3,.stats4-category-card h3,.stats4-summary-card h3 { font-size:14.5px; }
.stats4-chart-head .hint,.stats4-category-card .hint,.stats4-summary-card .hint { font-size:12.5px; }
.stats4-range { display:inline-flex; gap:5px; padding:3px; border:1px solid rgba(255,255,255,.055); border-radius:9px; background:#0b121e; }
.stats4-range-btn { min-height:30px; padding:5px 10px; border:0; border-radius:7px; background:transparent; color:#8291a6; font:inherit; font-size:11.5px; font-weight:700; cursor:pointer; }
.stats4-range-btn:hover { color:#dbe4ef; background:rgba(255,255,255,.035); }
.stats4-range-btn.active { color:#efeaff; background:rgba(124,92,252,.18); box-shadow:inset 0 0 0 1px rgba(124,92,252,.2); }
.stats4-tracking-note { display:flex; align-items:center; flex-wrap:wrap; gap:8px 16px; padding:10px 16px 0; color:#718198; font-size:11.5px; }
.stats4-tracking-note span { display:inline-flex; align-items:center; gap:6px; }
.stats4-chart { position:relative; min-height:320px; padding:4px 16px 15px; }
.stats4-chart .activity-chart { min-height:280px; height:280px; }
.stats4-chart-legend { min-height:38px; gap:7px; }
.stats4-series-toggle { display:inline-flex; align-items:center; gap:6px; min-height:28px; padding:5px 8px; border:1px solid rgba(255,255,255,.055); border-radius:8px; background:#0d1522; color:#77869b; font:inherit; font-size:11.5px; font-weight:700; cursor:pointer; opacity:.58; }
.stats4-series-toggle:hover { color:#d6deea; border-color:rgba(124,92,252,.18); }
.stats4-series-toggle.active { opacity:1; color:#dce4ef; background:rgba(255,255,255,.028); }
.stats4-series-toggle .legend-dot { flex:0 0 auto; }
.stats4-chart-tooltip { position:absolute; z-index:6; min-width:178px; transform:translate(-50%,-108%); display:grid; grid-template-columns:1fr; gap:4px; padding:9px 10px; border:1px solid rgba(124,92,252,.2); border-radius:9px; background:#0a111d; box-shadow:0 12px 30px rgba(0,0,0,.3); pointer-events:none; color:#9caabd; font-size:11.5px; }
.stats4-chart-tooltip[hidden] { display:none; }
.stats4-chart-tooltip strong { color:#f3f6fa; font-size:12.5px; margin-bottom:2px; }
.stats4-chart-tooltip span { display:flex; justify-content:space-between; gap:18px; }
.stats4-chart-tooltip b { color:#e1e7ef; font-weight:750; }

.stats4-lower-grid { grid-template-columns:minmax(0,1.15fr) minmax(340px,.85fr); align-items:stretch; }
.stats4-category-list { display:flex; flex-direction:column; gap:8px; padding:14px 16px 16px; }
.stats4-category-row { display:grid; grid-template-columns:24px minmax(130px,.78fr) minmax(130px,1.45fr) 32px; align-items:center; gap:9px; min-height:30px; }
.stats4-category-rank { width:22px; height:22px; display:grid; place-items:center; border-radius:7px; background:rgba(124,92,252,.1); color:#a99cff; font-size:10.5px; font-weight:800; }
.stats4-category-name { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#aab6c6; font-size:11.5px; }
.stats4-category-bar { height:7px; overflow:hidden; border-radius:999px; background:#1b2638; }
.stats4-category-bar i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#6d4df4,#8b5cf6); }
.stats4-category-row strong { color:#e5eaf1; font-size:11.5px; text-align:right; }
.stats4-summary-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; padding:14px 16px 16px; }
.stats4-summary-grid article { min-height:92px; display:flex; flex-direction:column; justify-content:center; padding:12px; border:1px solid rgba(255,255,255,.05); border-radius:10px; background:#0d1522; }
.stats4-summary-grid span { color:#77869b; font-size:11.5px; font-weight:700; }
.stats4-summary-grid strong { margin-top:5px; color:#f0f3f8; font-size:22px; letter-spacing:-.025em; }
.stats4-summary-grid small { margin-top:4px; color:#718198; font-size:11.5px; line-height:1.35; }

@media (max-width: 1000px) {
  .stats4-lower-grid { grid-template-columns:1fr; }
}
@media (max-width: 760px) {
  .stats4-hero { align-items:flex-start; flex-direction:column; }
  .stats4-hero-status { justify-content:flex-start; }
  .stats4-chart-head { flex-direction:column; }
  .stats4-range { width:100%; }
  .stats4-range-btn { flex:1; }
  .stats4-chart { padding-inline:8px; }
  .stats4-summary-grid { grid-template-columns:1fr; }
  .stats4-category-row { grid-template-columns:24px minmax(100px,.9fr) minmax(80px,1fr) 28px; }
}

/* ──────────────────────────────────────────────────────────────
   v46 · Statistics final polish + Logs 4A
   ────────────────────────────────────────────────────────────── */
.stats4-series-toggle.is-unavailable,
.stats4-series-toggle:disabled {
  cursor:not-allowed;
  opacity:.38;
  color:#667388;
  background:#0b121d;
  border-color:rgba(255,255,255,.04);
}
.stats4-series-toggle.is-unavailable small {
  margin-left:2px;
  color:#566376;
  font-size:9px;
  font-weight:600;
}

.logs46-shell { gap:14px; }
.logs46-hero {
  min-height:92px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
  padding:17px 18px;
  border:1px solid rgba(124,92,252,.28);
  border-top-color:#7c5cfc;
  border-radius:13px;
  background:linear-gradient(110deg,rgba(124,92,252,.055),rgba(17,24,39,.98) 36%,rgba(17,24,39,.98));
}
.logs46-hero-copy { min-width:0; }
.logs46-eyebrow {
  display:block;
  margin-bottom:4px;
  color:#9b82ff;
  font-size:10px;
  line-height:1;
  font-weight:800;
  letter-spacing:.055em;
}
.logs46-hero h2 { margin:0; font-size:18px; letter-spacing:-.02em; }
.logs46-hero p { max-width:760px; margin:5px 0 0; color:var(--text-muted); font-size:10.5px; line-height:1.45; }
.logs46-hero-actions { display:flex; align-items:center; justify-content:flex-end; gap:9px; flex-wrap:wrap; }
.logs46-kpi-grid .management-stat { min-height:100px; }
.logs46-kpi-channel { font-size:18px !important; line-height:1.15; overflow-wrap:anywhere; }
.logs46-card { overflow:visible; }
.logs46-head { border-bottom:0; padding-bottom:10px; }
.logs46-result-count {
  flex:0 0 auto;
  padding:6px 9px;
  border:1px solid var(--border);
  border-radius:8px;
  background:#0b1320;
  color:#aeb9c9;
  font-size:10px;
  font-weight:700;
}
.logs46-toolbar {
  display:grid;
  grid-template-columns:minmax(260px,1.4fr) minmax(190px,.65fr) auto auto;
  gap:9px;
  align-items:end;
  margin:0 16px 12px;
  padding:12px;
  border:1px solid var(--border);
  border-radius:11px;
  background:#0d1522;
}
.logs46-toolbar .field { margin:0; }
.logs46-toolbar .field-label { margin-bottom:6px; }
.logs46-toolbar .btn { min-height:38px; white-space:nowrap; }
.logs46-table-wrap {
  margin:0 16px 14px;
  border:1px solid var(--border);
  border-radius:11px;
  overflow:auto;
  background:#0d1522;
}
.logs46-table { width:100%; min-width:1050px; border-collapse:collapse; table-layout:fixed; }
.logs46-table th {
  padding:10px 11px;
  border-bottom:1px solid var(--border);
  color:#718097;
  background:#101927;
  text-align:left;
  font-size:9px;
  line-height:1;
  font-weight:800;
  letter-spacing:.045em;
  text-transform:uppercase;
}
.logs46-table th:nth-child(1) { width:145px; }
.logs46-table th:nth-child(2) { width:145px; }
.logs46-table th:nth-child(3) { width:205px; }
.logs46-table th:nth-child(4) { width:205px; }
.logs46-table th:nth-child(5) { width:auto; }
.logs46-table th:nth-child(6) { width:105px; }
.logs46-table td {
  padding:10px 11px;
  border-bottom:1px solid rgba(255,255,255,.042);
  vertical-align:middle;
  color:#d9e1ec;
  font-size:10.5px;
}
.logs46-table tbody tr:last-child td { border-bottom:0; }
.logs46-table tbody tr:hover { background:rgba(124,92,252,.025); }
.logs46-time { display:flex; flex-direction:column; gap:3px; }
.logs46-time strong { font-size:10px; font-weight:700; white-space:nowrap; }
.logs46-time small { color:var(--text-soft); font-size:9px; }
.logs46-person { display:flex; align-items:center; gap:9px; min-width:0; }
.logs46-person > span:last-child { display:flex; min-width:0; flex-direction:column; gap:2px; }
.logs46-person strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:10.5px; }
.logs46-person small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--text-soft); font-size:8.8px; font-variant-numeric:tabular-nums; }
.logs46-avatar { width:28px; height:28px; border-radius:50%; object-fit:cover; flex:0 0 auto; }
.logs46-channel-avatar { display:grid; place-items:center; border:1px solid rgba(124,92,252,.16); background:rgba(124,92,252,.10); color:#a78bfa; font-size:11px; font-weight:800; }
.logs46-reason { min-width:0; }
.logs46-reason strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:10.5px; font-weight:650; }
.logs46-reason small { display:block; margin-top:3px; color:var(--text-soft); font-size:9px; }
.logs46-case-btn {
  min-height:28px;
  padding:0 8px;
  border:1px solid rgba(124,92,252,.20);
  border-radius:7px;
  background:rgba(124,92,252,.08);
  color:#b19cff;
  font:700 9px/1 var(--font);
  cursor:pointer;
}
.logs46-case-btn:hover { background:rgba(124,92,252,.14); border-color:rgba(124,92,252,.34); }
.logs46-case-muted { color:var(--text-soft); font-size:9px; }
.logs46-empty { min-height:170px; margin:0 16px 14px; border:1px dashed rgba(255,255,255,.065); border-radius:11px; background:#0c1420; }
.logs46-empty > span { width:34px; height:34px; display:grid; place-items:center; border-radius:9px; background:rgba(124,92,252,.10); color:#a78bfa; }
.logs46-pagination {
  min-height:50px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:8px 16px 14px;
  color:var(--text-muted);
  font-size:9.5px;
}
.logs46-pagination > div { display:flex; align-items:center; gap:8px; }
.logs46-pagination > div > span { min-width:84px; text-align:center; }
.logs46-footnote {
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding:12px 14px;
  border:1px solid rgba(59,130,246,.13);
  border-radius:11px;
  background:rgba(59,130,246,.035);
}
.logs46-footnote > span { width:25px; height:25px; display:grid; place-items:center; flex:0 0 auto; border-radius:8px; background:rgba(124,92,252,.10); color:#a78bfa; font-size:10px; font-weight:800; }
.logs46-footnote > div { display:flex; flex-direction:column; gap:3px; }
.logs46-footnote strong { font-size:10.5px; }
.logs46-footnote small { color:var(--text-muted); font-size:9.5px; line-height:1.45; }

@media (max-width: 1180px) {
  .logs46-toolbar { grid-template-columns:minmax(220px,1fr) minmax(180px,.7fr); }
  .logs46-toolbar .btn { width:100%; }
}
@media (max-width: 820px) {
  .logs46-hero { align-items:flex-start; flex-direction:column; }
  .logs46-hero-actions { justify-content:flex-start; }
  .logs46-toolbar { grid-template-columns:1fr; }
  .logs46-pagination { align-items:flex-start; flex-direction:column; }
}


/* ──────────────────────────────────────────────────────────────
   v47 · Statistics chart ultrawide proportion hotfix
   ────────────────────────────────────────────────────────────── */
.stats4-chart { overflow-x:auto; }
.stats4-chart .activity-chart {
  display:block;
  width:100%;
  max-width:1400px;
  min-width:760px;
  min-height:220px;
  height:auto;
  max-height:305px;
  aspect-ratio:1200 / 260;
  margin-inline:auto;
}

/* ──────────────────────────────────────────────────────────────
   v48 · Statistics chart no-scroll proportion fix
   Keep the SVG responsive without turning the chart card into
   its own scroll container on ultrawide displays.
   ────────────────────────────────────────────────────────────── */
.stats4-chart {
  overflow: visible;
}
.stats4-chart .activity-chart {
  display: block;
  width: 100%;
  max-width: none;
  min-width: 0;
  min-height: 280px;
  height: 280px;
  max-height: none;
  aspect-ratio: auto;
  margin-inline: 0;
}
@media (max-width: 820px) {
  .stats4-chart .activity-chart {
    min-height: 235px;
    height: 235px;
  }
}

/* ──────────────────────────────────────────────────────────────
   v49 · Statistics bottom breathing room + Backups 4A
   ────────────────────────────────────────────────────────────── */
.stats4-chart-card { padding-bottom: 8px; }
.stats4-chart {
  min-height: 344px;
  padding-bottom: 34px;
}
.stats4-chart .activity-chart {
  min-height: 292px;
  height: 292px;
}

.backup49-shell { display:flex; flex-direction:column; gap:14px; }
.backup49-hero {
  min-height:92px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:17px 19px;
  border:1px solid rgba(124,92,252,.34);
  border-radius:12px;
  background:linear-gradient(180deg,rgba(18,27,43,.98),rgba(15,23,37,.98));
}
.backup49-hero-copy { min-width:0; }
.backup49-eyebrow,.backup49-modal-eyebrow { display:block; margin-bottom:5px; color:#9c7cff; font-size:10.5px; font-weight:800; letter-spacing:.045em; }
.backup49-hero h2 { margin:0; font-size:20px; letter-spacing:-.03em; }
.backup49-hero p { margin:5px 0 0; color:var(--text-muted); font-size:11.5px; }
.backup49-hero-status { display:flex; gap:7px; align-items:center; flex-wrap:wrap; justify-content:flex-end; }
.backup49-kpi-grid { margin:0; }
.backup49-config-grid { display:grid; grid-template-columns:minmax(0,1.28fr) minmax(340px,.72fr); gap:12px; }
.backup49-create-card,.backup49-auto-card,.backup49-history-card { padding:0; overflow:hidden; }
.backup49-create-card > .management-card-head,.backup49-auto-card > .management-card-head,.backup49-history-card > .management-card-head { padding:14px 15px 12px; margin:0; border-bottom:1px solid rgba(255,255,255,.05); }
.backup49-create-card > .management-card-head > div,.backup49-auto-card > .management-card-head > div,.backup49-history-card > .management-card-head > div { min-width:0; }
.backup49-section-icon { width:27px; height:27px; margin-right:7px; display:inline-grid; place-items:center; border-radius:8px; background:rgba(124,92,252,.13); color:#a78bfa; float:left; }
.backup49-field { display:flex; flex-direction:column; gap:6px; padding:14px 15px 10px; }
.backup49-field > span { color:#7f90a8; font-size:10px; font-weight:800; letter-spacing:.035em; }
.backup49-field .input { min-height:38px; }
.backup49-scope-row { display:flex; gap:7px; flex-wrap:wrap; padding:0 15px 13px; }
.backup49-scope-row span { display:inline-flex; align-items:center; min-height:27px; padding:4px 8px; border:1px solid rgba(34,197,94,.12); border-radius:8px; background:rgba(34,197,94,.055); color:#89dca5; font-size:10.5px; font-weight:700; }
.backup49-card-footer { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:11px 15px; border-top:1px solid rgba(255,255,255,.045); background:rgba(5,10,18,.16); }
.backup49-card-footer small { max-width:64%; color:#718198; font-size:10.5px; line-height:1.45; }
.backup49-auto-card .management-card-head { align-items:center; }
.backup49-auto-stats { display:grid; grid-template-columns:1fr 1fr; gap:8px; padding:14px 15px 10px; }
.backup49-auto-stats article { min-height:62px; padding:10px 11px; border:1px solid rgba(255,255,255,.055); border-radius:9px; background:#0c1421; }
.backup49-auto-stats span { display:block; color:#6f8099; font-size:9.5px; font-weight:800; text-transform:uppercase; }
.backup49-auto-stats strong { display:block; margin-top:5px; font-size:13px; }
.backup49-auto-note { display:flex; align-items:flex-start; gap:9px; margin:0 15px 14px; padding:10px 11px; border:1px solid rgba(255,255,255,.055); border-radius:9px; background:#0c1421; }
.backup49-auto-note > span { width:25px; height:25px; display:grid; place-items:center; flex:0 0 auto; border-radius:7px; background:rgba(124,92,252,.12); color:#a78bfa; font-weight:800; }
.backup49-auto-note.is-active > span { background:rgba(34,197,94,.12); color:#55dd83; }
.backup49-auto-note strong,.backup49-auto-note small { display:block; }
.backup49-auto-note strong { font-size:11px; }
.backup49-auto-note small { margin-top:3px; color:#718198; font-size:10px; line-height:1.4; }
.backup49-count { min-width:26px; height:24px; display:grid; place-items:center; padding:0 7px; border-radius:999px; background:#0c1421; border:1px solid rgba(255,255,255,.055); color:#92a0b4; font-size:10.5px; font-weight:800; }
.backup49-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; padding:12px; }
.backup49-item { position:relative; overflow:hidden; min-width:0; padding:12px; border:1px solid rgba(255,255,255,.055); border-radius:10px; background:linear-gradient(180deg,#101927,#0d1623); }
.backup49-item-accent { position:absolute; inset:0 auto 0 0; width:2px; background:#7c5cff; }
.backup49-item-accent.auto { background:#22c55e; }
.backup49-item-head { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.backup49-item-title { min-width:0; display:flex; gap:9px; align-items:flex-start; }
.backup49-kind-icon { width:29px; height:29px; display:grid; place-items:center; flex:0 0 auto; border-radius:8px; background:rgba(124,92,252,.13); color:#ae95ff; }
.backup49-item-title > div { min-width:0; }
.backup49-item-eyebrow { display:block; color:#75869e; font-size:8.5px; font-weight:800; letter-spacing:.035em; }
.backup49-item-title strong { display:block; margin-top:3px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12.5px; }
.backup49-item-title small { display:block; margin-top:3px; color:#718198; font-size:9.5px; }
.backup49-meta-grid { display:grid; grid-template-columns:1fr 1fr 1.18fr; gap:6px; margin-top:11px; }
.backup49-meta-grid > div { min-width:0; padding:8px 9px; border:1px solid rgba(255,255,255,.045); border-radius:7px; background:#0b1320; }
.backup49-meta-grid span { display:block; color:#62748e; font-size:8.5px; font-weight:800; text-transform:uppercase; }
.backup49-meta-grid strong { display:block; margin-top:4px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:10.5px; }
.backup49-item-actions { display:flex; align-items:center; justify-content:space-between; gap:9px; margin-top:10px; padding-top:10px; border-top:1px solid rgba(255,255,255,.045); }
.backup49-item-actions > div { display:flex; gap:6px; flex-wrap:wrap; }
.backup49-restore-btn { border-color:rgba(124,92,252,.2); color:#c1b2ff; }
.backup49-empty { grid-column:1/-1; min-height:140px; display:grid; place-items:center; align-content:center; gap:5px; border:1px dashed rgba(255,255,255,.07); border-radius:9px; }
.backup49-empty > span { width:34px; height:34px; display:grid; place-items:center; border-radius:9px; background:rgba(124,92,252,.11); color:#a78bfa; }
.backup49-command-note { display:flex; align-items:center; min-height:56px; padding:10px 13px; border:1px solid rgba(255,255,255,.05); border-radius:10px; background:#0d1522; }
.backup49-command-note strong,.backup49-command-note small { display:block; }
.backup49-command-note strong { font-size:10.5px; }
.backup49-command-note small { margin-top:3px; color:#718198; font-size:9.5px; }
.backup49-modal-card { width:min(620px,calc(100vw - 32px)); max-width:620px; }
.backup49-restore-options { display:grid; gap:8px; margin-top:12px; }
.backup49-restore-option { display:flex; align-items:center; justify-content:space-between; gap:15px; padding:11px 12px; border:1px solid rgba(255,255,255,.06); border-radius:9px; background:#0c1421; }
.backup49-restore-option > span { min-width:0; }
.backup49-restore-option strong,.backup49-restore-option small { display:block; }
.backup49-restore-option strong { font-size:11.5px; }
.backup49-restore-option small { margin-top:3px; color:#718198; font-size:10px; line-height:1.4; }
.backup49-warning { display:flex; gap:9px; align-items:flex-start; margin-top:10px; padding:10px 11px; border:1px solid rgba(245,158,11,.18); border-radius:9px; background:rgba(245,158,11,.055); }
.backup49-warning > span { width:23px; height:23px; display:grid; place-items:center; flex:0 0 auto; border-radius:7px; background:rgba(245,158,11,.13); color:#fbbf24; font-weight:900; }
.backup49-warning strong,.backup49-warning small { display:block; }
.backup49-warning strong { color:#f3d998; font-size:10.5px; }
.backup49-warning small { margin-top:2px; color:#9b8d6c; font-size:9.5px; line-height:1.4; }
.backup49-detail-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:7px; margin-top:12px; }
.backup49-detail-grid article { min-width:0; padding:10px; border:1px solid rgba(255,255,255,.055); border-radius:8px; background:#0c1421; }
.backup49-detail-grid span,.backup49-detail-grid small { display:block; color:#718198; font-size:9px; }
.backup49-detail-grid strong { display:block; margin:4px 0 1px; font-size:18px; }
.backup49-detail-note { margin-top:10px; padding:10px 11px; border:1px solid rgba(255,255,255,.055); border-radius:8px; background:#0c1421; }
.backup49-detail-note strong { font-size:10.5px; }
.backup49-detail-note p { margin:4px 0 0; color:#718198; font-size:9.5px; line-height:1.5; }

@media (max-width:1100px) {
  .backup49-config-grid { grid-template-columns:1fr; }
  .backup49-list { grid-template-columns:1fr; }
}
@media (max-width:760px) {
  .stats4-chart { min-height:300px; padding-bottom:28px; }
  .stats4-chart .activity-chart { min-height:250px; height:250px; }
  .backup49-hero { align-items:flex-start; flex-direction:column; }
  .backup49-hero-status { justify-content:flex-start; }
  .backup49-card-footer,.backup49-item-actions { align-items:stretch; flex-direction:column; }
  .backup49-card-footer small { max-width:none; }
  .backup49-item-actions > div { width:100%; }
  .backup49-item-actions .btn { flex:1 1 auto; }
  .backup49-meta-grid { grid-template-columns:1fr; }
  .backup49-detail-grid { grid-template-columns:1fr 1fr; }
}

/* ── v51 Aufgaben + Integrationen 4A ───────────────────────────── */
.tasks51-shell,
.integration51-shell { gap:12px; }

.tasks51-hero,
.integration51-hero {
  min-height:84px;
  display:grid;
  grid-template-columns:38px minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  padding:14px 16px;
  border:1px solid rgba(124,92,252,.42);
  border-radius:11px;
  background:linear-gradient(110deg,rgba(124,92,252,.055),rgba(18,27,43,.96) 36%,rgba(18,27,43,.96));
}
.tasks51-hero-icon,
.integration51-hero-icon {
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:9px;
  background:rgba(124,92,252,.16);
  color:#b8a5ff;
  font-weight:800;
  font-size:16px;
}
.tasks51-hero-copy,
.integration51-hero-copy { min-width:0; }
.tasks51-eyebrow,
.integration51-eyebrow {
  display:block;
  margin-bottom:3px;
  color:#9b82ff;
  font-size:9px;
  line-height:1.15;
  letter-spacing:.045em;
  font-weight:800;
}
.tasks51-hero h2,
.integration51-hero h2 { margin:0; font-size:17px; line-height:1.15; letter-spacing:-.02em; }
.tasks51-hero p,
.integration51-hero p { margin:4px 0 0; max-width:920px; color:var(--text-muted); font-size:10px; line-height:1.45; }
.tasks51-hero-state,
.integration51-hero-state { display:flex; align-items:center; gap:7px; justify-self:end; }
.tasks51-kpis .management-stat,
.integration51-kpis .management-stat { min-height:78px; padding:12px 14px; }
.tasks51-kpis .management-stat > strong,
.integration51-kpis .management-stat > strong { margin-top:4px; font-size:22px; }
.tasks51-kpis .management-stat > small,
.integration51-kpis .management-stat > small { margin-top:3px; }

.tasks51-layout {
  display:grid;
  grid-template-columns:minmax(0,1.75fr) minmax(300px,.72fr);
  gap:12px;
  align-items:start;
}
.tasks51-main,
.tasks51-side { display:flex; flex-direction:column; gap:12px; min-width:0; }
.tasks51-group { padding:0; overflow:hidden; }
.tasks51-group-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:13px 14px 11px;
  border-bottom:1px solid var(--border);
}
.tasks51-group-kicker { color:#9278fa; font-size:8.5px; line-height:1; letter-spacing:.055em; font-weight:800; }
.tasks51-group-head h3 { margin:3px 0 0; font-size:12.5px; }
.tasks51-group-head p { margin:3px 0 0; color:var(--text-muted); font-size:9.5px; }
.tasks51-count {
  min-width:24px;
  height:24px;
  padding:0 7px;
  display:grid;
  place-items:center;
  border:1px solid var(--border);
  border-radius:8px;
  background:#0f1726;
  color:var(--text-soft);
  font-size:9px;
  font-weight:800;
}
.tasks51-danger-group .tasks51-count { border-color:rgba(239,68,68,.25); color:#fca5a5; background:rgba(239,68,68,.06); }
.tasks51-list { display:flex; flex-direction:column; padding:6px 8px 8px; }
.tasks51-item {
  width:100%;
  min-height:54px;
  display:grid;
  grid-template-columns:32px minmax(0,1fr) auto;
  align-items:center;
  gap:9px;
  padding:7px 8px;
  border:0;
  border-bottom:1px solid rgba(255,255,255,.045);
  background:transparent;
  color:var(--text);
  text-align:left;
  cursor:pointer;
}
.tasks51-item:last-child { border-bottom:0; }
.tasks51-item:hover { background:rgba(124,92,252,.045); border-radius:8px; }
.tasks51-item.task-warning:hover { background:rgba(245,158,11,.035); }
.tasks51-item.task-danger:hover { background:rgba(239,68,68,.035); }
.tasks51-item-icon {
  width:29px;
  height:29px;
  display:grid;
  place-items:center;
  border-radius:8px;
  background:rgba(124,92,252,.12);
  color:#b8a5ff;
  font-size:12px;
}
.tasks51-item.task-warning .tasks51-item-icon { background:rgba(245,158,11,.1); color:#fbbf24; }
.tasks51-item.task-danger .tasks51-item-icon { background:rgba(239,68,68,.1); color:#f87171; }
.tasks51-item-copy { display:flex; flex-direction:column; gap:3px; min-width:0; }
.tasks51-item-copy strong { font-size:10.5px; }
.tasks51-item-copy small { color:var(--text-muted); font-size:9px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.tasks51-item-meta { display:flex; align-items:center; gap:8px; color:var(--text-soft); font-size:8.8px; white-space:nowrap; }
.tasks51-item-meta i { font-size:15px; font-style:normal; color:#73809a; }
.tasks51-empty { min-height:64px; display:flex; align-items:center; justify-content:center; gap:9px; color:var(--text-muted); }
.tasks51-empty > span { width:27px; height:27px; display:grid; place-items:center; border-radius:8px; background:rgba(34,197,94,.09); color:#4ade80; }
.tasks51-empty > div { display:flex; flex-direction:column; gap:2px; }
.tasks51-empty strong { color:var(--text); font-size:10.5px; }
.tasks51-empty small { font-size:9px; }

.tasks51-status-card,
.tasks51-quick-card { padding:0; overflow:hidden; }
.tasks51-side-head { display:flex; gap:9px; align-items:flex-start; padding:13px 14px 11px; border-bottom:1px solid var(--border); }
.tasks51-side-icon { width:27px; height:27px; flex:0 0 auto; display:grid; place-items:center; border-radius:8px; background:rgba(124,92,252,.11); color:#aa94ff; font-weight:800; }
.tasks51-side-head h3 { margin:0; font-size:11.5px; }
.tasks51-side-head p { margin:3px 0 0; color:var(--text-muted); font-size:9px; }
.tasks51-status-list { padding:5px 8px 8px; }
.tasks51-status-row {
  width:100%;
  min-height:50px;
  display:grid;
  grid-template-columns:27px minmax(0,1fr) auto;
  align-items:center;
  gap:8px;
  padding:7px 6px;
  border:0;
  border-bottom:1px solid rgba(255,255,255,.04);
  background:transparent;
  color:var(--text);
  text-align:left;
  cursor:pointer;
}
.tasks51-status-row:last-child { border-bottom:0; }
.tasks51-status-row:hover { background:rgba(255,255,255,.018); border-radius:7px; }
.tasks51-status-icon { width:24px; height:24px; display:grid; place-items:center; border-radius:7px; font-size:9px; font-weight:800; }
.tasks51-status-icon.ok { color:#4ade80; background:rgba(34,197,94,.09); }
.tasks51-status-icon.warn { color:#fbbf24; background:rgba(245,158,11,.09); }
.tasks51-status-row > span:nth-child(2) { min-width:0; display:flex; flex-direction:column; gap:2px; }
.tasks51-status-row strong { font-size:9.8px; }
.tasks51-status-row small { color:var(--text-muted); font-size:8.5px; line-height:1.35; }
.tasks51-status-row em { font-size:8.5px; font-style:normal; font-weight:750; }
.tasks51-status-row em.ok { color:#4ade80; }
.tasks51-status-row em.warn { color:#fbbf24; }
.tasks51-quick-grid { display:grid; grid-template-columns:1fr 1fr; gap:7px; padding:9px; }
.tasks51-quick-grid button {
  min-height:65px;
  display:grid;
  grid-template-columns:25px minmax(0,1fr);
  grid-template-rows:auto auto;
  column-gap:7px;
  align-items:center;
  padding:8px;
  border:1px solid var(--border);
  border-radius:9px;
  background:#101827;
  color:var(--text);
  text-align:left;
  cursor:pointer;
}
.tasks51-quick-grid button:hover { border-color:rgba(124,92,252,.23); background:#131d2e; }
.tasks51-quick-grid button > span { grid-row:1 / 3; width:25px; height:25px; display:grid; place-items:center; border-radius:7px; background:rgba(124,92,252,.11); font-size:10px; }
.tasks51-quick-grid strong { align-self:end; font-size:9.5px; }
.tasks51-quick-grid small { align-self:start; color:var(--text-muted); font-size:8.2px; }

.integration51-section { padding:0; overflow:hidden; }
.integration51-section-head {
  min-height:56px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:11px 13px;
  border-bottom:1px solid var(--border);
}
.integration51-section-head > div:first-child { display:flex; gap:9px; align-items:center; }
.integration51-section-icon { width:28px; height:28px; display:grid; place-items:center; border-radius:8px; background:rgba(124,92,252,.11); color:#a992ff; font-weight:800; }
.integration51-section-head h3 { margin:0; font-size:11.5px; }
.integration51-section-head p { margin:3px 0 0; color:var(--text-muted); font-size:9px; }
.integration51-grid { display:grid; gap:8px; padding:10px; }
.integration51-grid-core { grid-template-columns:repeat(3,minmax(0,1fr)); }
.integration51-grid-api { grid-template-columns:repeat(4,minmax(0,1fr)); }
.integration51-grid-sources { grid-template-columns:repeat(5,minmax(0,1fr)); }
.integration51-grid-modules { grid-template-columns:repeat(5,minmax(0,1fr)); }
.integration51-card {
  min-width:0;
  min-height:88px;
  display:grid;
  grid-template-columns:34px minmax(0,1fr) auto;
  align-items:center;
  gap:9px;
  padding:10px;
  border:1px solid var(--border);
  border-radius:10px;
  background:#101827;
  color:var(--text);
  text-align:left;
}
button.integration51-card { cursor:pointer; }
button.integration51-card:hover { border-color:rgba(124,92,252,.24); background:#131d2e; }
.integration51-card-icon { width:32px; height:32px; display:grid; place-items:center; border-radius:9px; background:rgba(124,92,252,.12); color:#b6a5ff; font-size:10px; font-weight:850; }
.integration51-card-copy { min-width:0; display:flex; flex-direction:column; gap:2px; }
.integration51-card-copy > small { color:#8874e9; font-size:7.5px; letter-spacing:.05em; font-weight:800; }
.integration51-card-copy > strong { font-size:10.5px; }
.integration51-card-copy > span { color:var(--text-muted); font-size:8.5px; line-height:1.35; }
.integration51-card-copy > em { margin-top:2px; color:#94a3ba; font-size:8px; font-style:normal; }
.integration51-card-side { height:100%; display:flex; flex-direction:column; justify-content:space-between; align-items:flex-end; gap:8px; }
.integration51-card-side > i { color:#6f7b91; font-size:15px; font-style:normal; line-height:1; }
.integration51-badge { display:inline-flex; align-items:center; gap:5px; min-height:20px; padding:0 7px; border:1px solid rgba(148,163,184,.11); border-radius:999px; background:#0c1422; color:#94a3b8; font-size:7.8px; font-weight:800; white-space:nowrap; }
.integration51-badge i { width:5px; height:5px; border-radius:50%; background:currentColor; }
.integration51-badge.success { color:#4ade80; border-color:rgba(34,197,94,.18); background:rgba(34,197,94,.055); }
.integration51-badge.warning { color:#fbbf24; border-color:rgba(245,158,11,.18); background:rgba(245,158,11,.055); }
.integration51-badge.danger { color:#fb7185; border-color:rgba(239,68,68,.18); background:rgba(239,68,68,.055); }
.integration51-badge.neutral { color:#94a3b8; }
.integration51-note { display:flex; gap:9px; align-items:flex-start; padding:10px 12px; border:1px solid var(--border); border-radius:9px; background:rgba(255,255,255,.012); }
.integration51-note > span { width:22px; height:22px; flex:0 0 auto; display:grid; place-items:center; border-radius:7px; background:rgba(124,92,252,.1); color:#a992ff; font-weight:800; }
.integration51-note > div { display:flex; flex-direction:column; gap:2px; }
.integration51-note strong { font-size:9.5px; }
.integration51-note small { color:var(--text-muted); font-size:8.5px; line-height:1.4; }

@media (max-width: 1350px) {
  .integration51-grid-api,
  .integration51-grid-modules { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .integration51-grid-sources { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width: 1050px) {
  .tasks51-layout { grid-template-columns:1fr; }
  .integration51-grid-core { grid-template-columns:1fr; }
  .integration51-grid-sources { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 700px) {
  .tasks51-hero,
  .integration51-hero { grid-template-columns:34px 1fr; }
  .tasks51-hero-state,
  .integration51-hero-state { grid-column:1 / -1; justify-self:start; }
  .tasks51-quick-grid,
  .integration51-grid-api,
  .integration51-grid-sources,
  .integration51-grid-modules { grid-template-columns:1fr; }
  .tasks51-item { grid-template-columns:30px minmax(0,1fr); }
  .tasks51-item-meta { grid-column:2; justify-content:flex-start; }
}

/* =========================================================
   V52 · Module + Settings 4A
   ========================================================= */
.modules52-shell,.settings52-shell{display:flex;flex-direction:column;gap:12px;width:100%;padding-bottom:12px}
.modules52-hero,.settings52-hero{display:grid;grid-template-columns:38px minmax(0,1fr) auto;gap:12px;align-items:center;padding:14px 16px;border:1px solid var(--border);border-top-color:rgba(124,92,252,.72);border-radius:11px;background:var(--card)}
.modules52-hero-icon,.settings52-hero-icon{width:34px;height:34px;display:grid;place-items:center;border-radius:9px;background:rgba(124,92,252,.14);color:#b49dff;font-size:15px;font-weight:850}
.modules52-hero-copy,.settings52-hero-copy{min-width:0}
.modules52-eyebrow,.settings52-eyebrow{display:block;color:#9c83ff;font-size:8.5px;font-weight:850;letter-spacing:.055em;text-transform:uppercase}
.modules52-hero h2,.settings52-hero h2{margin:3px 0 0;font-size:16px;line-height:1.16;letter-spacing:-.02em}
.modules52-hero p,.settings52-hero p{margin:4px 0 0;color:var(--text-muted);font-size:9px;line-height:1.45;max-width:920px}
.modules52-hero-state,.settings52-hero-state{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap}
.modules52-badge,.settings52-badge,.modules52-status,.settings52-state,.settings52-upload-state{display:inline-flex;align-items:center;gap:5px;min-height:20px;padding:0 7px;border:1px solid rgba(148,163,184,.1);border-radius:999px;background:#0c1422;color:#9aa9bc;font-size:7.8px;font-weight:850;white-space:nowrap}
.modules52-badge i,.settings52-badge i,.modules52-status i,.settings52-state i,.settings52-upload-state i{width:5px;height:5px;border-radius:50%;background:currentColor;flex:0 0 auto}
.modules52-badge.success,.modules52-status.success,.settings52-state.success,.settings52-upload-state.success{color:#4ade80;border-color:rgba(34,197,94,.18);background:rgba(34,197,94,.055)}
.modules52-badge.neutral,.modules52-status.neutral,.settings52-badge.neutral{color:#94a3b8}
.modules52-kpis .management-stat{min-height:76px;padding:11px 13px}
.modules52-kpis .management-stat>span{font-size:8px}
.modules52-kpis .management-stat>strong{margin-top:3px;font-size:20px}
.modules52-kpis .management-stat>small{margin-top:3px;font-size:8.5px}
.modules52-section{padding:0;overflow:hidden}
.modules52-section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 12px;border-bottom:1px solid rgba(255,255,255,.05)}
.modules52-section-head>div{display:flex;align-items:center;gap:8px;min-width:0}
.modules52-section-icon{width:27px;height:27px;display:grid;place-items:center;border-radius:8px;background:rgba(124,92,252,.11);color:#aa94ff;font-size:11px;font-weight:850;flex:0 0 auto}
.modules52-section-head h3{margin:0;font-size:10.5px}
.modules52-section-head p{margin:2px 0 0;color:var(--text-muted);font-size:8px;line-height:1.35}
.modules52-section-count{padding:4px 7px;border:1px solid var(--border);border-radius:999px;background:#0c1422;color:#94a3b8;font-size:7.8px;font-weight:800;white-space:nowrap}
.modules52-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:9px}
.modules52-card{position:relative;min-width:0;min-height:160px;padding:11px;border:1px solid rgba(255,255,255,.055);border-radius:9px;background:linear-gradient(180deg,#101927,#0d1623);overflow:hidden;display:flex;flex-direction:column}
.modules52-card.is-disabled{opacity:.72}
.modules52-card-accent{position:absolute;inset:0 auto 0 0;width:2px;background:#7c5cff}
.modules52-card.is-disabled .modules52-card-accent{background:#475569}
.modules52-card-head{display:flex;align-items:flex-start;gap:9px}
.modules52-icon{width:30px;height:30px;display:grid;place-items:center;flex:0 0 auto;border-radius:8px;background:rgba(124,92,252,.13);font-size:14px}
.modules52-card-copy{min-width:0;flex:1}
.modules52-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
.modules52-title-row>div{min-width:0}
.modules52-title-row small{display:block;color:#7464d2;font-size:7px;font-weight:850;text-transform:uppercase;letter-spacing:.045em}
.modules52-title-row h4{margin:2px 0 0;font-size:10.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.modules52-card-copy>p{margin:5px 0 0;color:var(--text-muted);font-size:8.2px;line-height:1.4;min-height:23px}
.modules52-command-box{margin-top:9px;padding:7px 8px;border:1px solid rgba(255,255,255,.045);border-radius:7px;background:#0b1320}
.modules52-command-box span{display:block;color:#65758d;font-size:7px;font-weight:850;text-transform:uppercase;letter-spacing:.04em}
.modules52-command-box strong{display:block;margin-top:3px;color:#98a7bb;font-size:7.8px;line-height:1.35;font-weight:650;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.modules52-card-actions{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto;padding-top:10px}
.modules52-card-actions .btn{min-height:28px;font-size:8.5px}
.modules52-no-dashboard{font-size:8px;color:var(--text-muted)}
.modules52-toggle{margin-left:auto}
.modules52-note,.settings52-info-note{display:flex;align-items:flex-start;gap:8px;padding:9px 11px;border:1px solid var(--border);border-radius:9px;background:rgba(255,255,255,.012)}
.modules52-note>span,.settings52-info-note>span{width:21px;height:21px;display:grid;place-items:center;flex:0 0 auto;border-radius:7px;background:rgba(124,92,252,.11);color:#ad98ff;font-size:9px;font-weight:900}
.modules52-note strong,.modules52-note small{display:block}
.modules52-note strong{font-size:8.8px}
.modules52-note small{margin-top:2px;color:var(--text-muted);font-size:8px;line-height:1.4}

.settings52-main-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(270px,.55fr);gap:10px;align-items:stretch}
.settings52-card{padding:0;overflow:hidden}
.settings52-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:11px 12px;border-bottom:1px solid rgba(255,255,255,.05)}
.settings52-card-head.compact{border-bottom:1px solid rgba(255,255,255,.05)}
.settings52-card-head>div{display:flex;align-items:center;gap:8px;min-width:0}
.settings52-card-icon{width:27px;height:27px;display:grid;place-items:center;flex:0 0 auto;border-radius:8px;background:rgba(124,92,252,.11);color:#aa94ff;font-size:10px;font-weight:850}
.settings52-card-head h3{margin:0;font-size:10.5px}
.settings52-card-head p{margin:2px 0 0;color:var(--text-muted);font-size:8px;line-height:1.4}
.settings52-fields{display:grid;grid-template-columns:1.1fr .9fr 1fr;gap:8px;padding:10px 12px}
.settings52-field{display:flex;flex-direction:column;gap:5px;min-width:0;padding:9px;border:1px solid rgba(255,255,255,.05);border-radius:8px;background:#0c1421}
.settings52-field>span{color:#8190a7;font-size:7.5px;font-weight:850;letter-spacing:.04em}
.settings52-field>small{min-height:21px;color:#687991;font-size:7.5px;line-height:1.35}
.settings52-field .select{min-height:34px}
.settings52-color-row{display:grid;grid-template-columns:42px minmax(0,1fr);gap:7px;align-items:center}
.settings52-color-input{width:42px;height:34px;padding:3px;border:1px solid var(--border);border-radius:7px;background:#0a111d;cursor:pointer}
.settings52-color-row code{min-height:34px;display:flex;align-items:center;padding:0 9px;border:1px solid var(--border);border-radius:7px;background:#09111d;color:#c4b5fd;font-size:9.5px}
.settings52-preview-wrap{display:grid;grid-template-columns:minmax(170px,.48fr) minmax(0,1.2fr);gap:9px;padding:0 12px 10px}
.settings52-preview-copy{padding:10px;border:1px solid rgba(255,255,255,.05);border-radius:8px;background:#0b1320}
.settings52-preview-copy span{display:block;color:#7765db;font-size:7px;font-weight:850;letter-spacing:.04em}
.settings52-preview-copy strong{display:block;margin-top:4px;font-size:9.5px}
.settings52-preview-copy small{display:block;margin-top:3px;color:var(--text-muted);font-size:7.8px;line-height:1.4}
.settings52-discord-preview{padding:9px;border:1px solid rgba(255,255,255,.05);border-radius:8px;background:#0b111b}
.settings52-preview-author{display:flex;align-items:center;gap:5px;font-size:8px}
.settings52-preview-author>span{width:22px;height:22px;display:grid;place-items:center;border-radius:50%;background:#7255e8;color:white;font-weight:800}
.settings52-preview-author>b{padding:2px 4px;border-radius:3px;background:#5865f2;color:#fff;font-size:6px}
.settings52-preview-embed{position:relative;margin:7px 0 0 27px;padding:8px 9px 8px 11px;border-radius:4px;background:#151b23;overflow:hidden}
.settings52-preview-embed:before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:var(--settings52-embed,#5865F2)}
.settings52-preview-embed strong{font-size:8.8px}
.settings52-preview-embed p{margin:3px 0 0;color:#c2c9d4;font-size:7.7px;line-height:1.4}
.settings52-savebar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 12px;border-top:1px solid rgba(255,255,255,.05);background:#0c1421}
.settings52-savebar>div{display:flex;flex-direction:column;gap:2px}
.settings52-savebar strong{font-size:8.5px}
.settings52-savebar small{color:var(--text-muted);font-size:7.5px}
.settings52-command-list{display:grid;gap:7px;padding:10px}
.settings52-command-list article{padding:8px;border:1px solid rgba(255,255,255,.05);border-radius:8px;background:#0c1421}
.settings52-command-list code{display:block;color:#b8a8ff;font-size:8.5px}
.settings52-command-list span{display:block;margin-top:3px;color:var(--text-muted);font-size:7.8px;line-height:1.35}
.settings52-command-card .settings52-info-note{margin:0 10px 10px}
.settings52-info-note p{margin:0;color:var(--text-muted);font-size:7.8px;line-height:1.4}
.settings52-uploads-panel{padding:10px 12px 12px}
.settings52-upload-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin-bottom:9px}
.settings52-upload-kpis article{min-height:58px;padding:8px 9px;border:1px solid rgba(255,255,255,.05);border-radius:8px;background:#0c1421}
.settings52-upload-kpis article.has-warning{border-color:rgba(245,158,11,.15);background:rgba(245,158,11,.025)}
.settings52-upload-kpis span{display:block;color:#667890;font-size:7px;font-weight:850;letter-spacing:.04em}
.settings52-upload-kpis strong{display:block;margin-top:3px;font-size:15px}
.settings52-upload-kpis small{display:block;margin-top:2px;color:var(--text-muted);font-size:7.5px}
.settings52-upload-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;max-height:250px;overflow:auto;padding-right:2px;scrollbar-width:thin;scrollbar-color:#334155 transparent}
.settings52-upload-item{display:grid;grid-template-columns:36px minmax(0,1fr) auto;gap:7px;align-items:center;min-width:0;padding:7px;border:1px solid rgba(255,255,255,.05);border-radius:8px;background:#0c1421}
.settings52-upload-item.is-orphan{border-color:rgba(245,158,11,.12)}
.settings52-upload-thumb{width:36px;height:30px;border-radius:6px;overflow:hidden;background:#111b2a;display:grid;place-items:center}
.settings52-upload-thumb img{width:100%;height:100%;object-fit:cover}
.settings52-upload-thumb.is-broken:after{content:"IMG";color:#64748b;font-size:6px;font-weight:800}
.settings52-upload-copy{min-width:0}
.settings52-upload-copy strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:8px}
.settings52-upload-copy span{display:block;margin-top:2px;color:var(--text-muted);font-size:7px}
.settings52-upload-state.warning{color:#fbbf24;border-color:rgba(245,158,11,.16);background:rgba(245,158,11,.045)}
.settings52-upload-empty{min-height:100px;display:grid;place-items:center;align-content:center;gap:4px;border:1px dashed rgba(255,255,255,.07);border-radius:8px;color:var(--text-muted)}
.settings52-upload-empty>span{width:29px;height:29px;display:grid;place-items:center;border-radius:8px;background:rgba(124,92,252,.1);color:#a992ff;font-weight:850}
.settings52-upload-empty strong{font-size:9px;color:var(--text)}
.settings52-upload-empty small{font-size:7.8px;text-align:center}

@media (max-width:1180px){.modules52-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.settings52-main-grid{grid-template-columns:1fr}.settings52-fields{grid-template-columns:repeat(3,minmax(0,1fr))}.settings52-upload-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:820px){.modules52-hero,.settings52-hero{grid-template-columns:34px 1fr}.modules52-hero-state,.settings52-hero-state{grid-column:1/-1;justify-content:flex-start}.modules52-grid{grid-template-columns:1fr}.settings52-fields{grid-template-columns:1fr}.settings52-preview-wrap{grid-template-columns:1fr}.settings52-upload-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.modules52-section-head,.settings52-card-head,.settings52-savebar{align-items:flex-start;flex-direction:column}.modules52-section-count{align-self:flex-start}.settings52-upload-list{grid-template-columns:1fr}.settings52-upload-kpis{grid-template-columns:1fr 1fr}.settings52-card-head .btn{width:100%}}

/* =========================================================
   V53 · Module KPI layout fix
   ========================================================= */
.modules52-kpis{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
  width:100%;
}
@media (max-width: 980px){
  .modules52-kpis{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width: 560px){
  .modules52-kpis{grid-template-columns:1fr;}
}

/* ── v61 Asset Manager ─────────────────────────────────────────── */
.asset61-shell { display: grid; gap: 18px; }
.asset61-hero {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 18px; align-items: center;
  padding: 22px 24px; overflow: hidden; position: relative;
  background: linear-gradient(135deg, rgba(124,92,252,.09), rgba(17,24,39,.96) 44%, rgba(59,130,246,.055));
}
.asset61-hero-icon { width: 54px; height: 54px; border-radius: 15px; display: grid; place-items: center; font-size: 25px; background: rgba(124,92,252,.12); border: 1px solid rgba(167,139,250,.22); }
.asset61-eyebrow { display: block; margin-bottom: 5px; color: var(--accent-soft); font-size: 10px; font-weight: 800; letter-spacing: .14em; }
.asset61-hero-copy h2 { margin: 0; font-size: 24px; }
.asset61-hero-copy p { margin: 7px 0 0; color: var(--text-muted); line-height: 1.55; max-width: 760px; }
.asset61-hero-copy p strong { color: var(--text); }
.asset61-hero-state { align-self: start; }
.asset61-kpis { margin: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.asset61-kpis .management-stat { min-height: 92px; padding: 13px 15px; }
.asset61-kpis .management-stat > strong { margin-top: 4px; font-size: 23px; }
.asset61-kpis .management-stat > small { margin-top: 3px; }
.asset61-toolbar { padding: 14px 16px; }
.asset61-filter-form { display: grid; grid-template-columns: minmax(150px, .7fr) minmax(210px, 1.2fr) minmax(170px, .7fr) auto; gap: 12px; align-items: end; }
.asset61-filter-form label, .asset61-upload-form > label:not(.asset61-dropzone) { display: grid; gap: 6px; color: var(--text-muted); font-size: 11px; font-weight: 700; }
.asset61-filter-actions { display: flex; gap: 8px; }
.asset61-layout { display: grid; grid-template-columns: minmax(260px, 320px) minmax(0, 1fr); gap: 18px; align-items: start; }
.asset61-upload { padding: 17px; position: sticky; top: calc(var(--topbar-height) + 16px); }
.asset61-section-head > div { display: flex; gap: 10px; align-items: center; }
.asset61-section-head > div > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; background: rgba(124,92,252,.12); color: var(--accent-soft); font-size: 18px; }
.asset61-section-head strong, .asset61-library-head strong { display: block; }
.asset61-section-head small, .asset61-library-head small { display: block; margin-top: 2px; color: var(--text-soft); }
.asset61-upload-form { display: grid; gap: 12px; margin-top: 15px; }
.asset61-dropzone { min-height: 145px; display: grid; place-items: center; align-content: center; gap: 5px; text-align: center; border: 1px dashed rgba(167,139,250,.35); background: rgba(124,92,252,.045); border-radius: 12px; cursor: pointer; padding: 18px; transition: border-color .16s ease, background .16s ease; }
.asset61-dropzone:hover { border-color: rgba(167,139,250,.7); background: rgba(124,92,252,.075); }
.asset61-dropzone input { display: none; }
.asset61-dropzone strong { font-size: 14px; }
.asset61-dropzone small { color: var(--text-soft); max-width: 220px; overflow-wrap: anywhere; }
.asset61-drop-icon { font-size: 25px; color: var(--accent-soft); }
.asset61-upload-btn { width: 100%; justify-content: center; }
.asset61-category-manager { display: grid; gap: 8px; margin-top: 15px; padding-top: 13px; border-top: 1px solid var(--border); }
.asset61-category-head strong { display: block; font-size: 11px; }
.asset61-category-head small { display: block; margin-top: 2px; color: var(--text-soft); font-size: 9.5px; }
.asset61-category-create { display: grid; grid-template-columns: minmax(0, 1fr) 34px; gap: 6px; }
.asset61-category-create .btn { min-width: 34px; padding-inline: 0; justify-content: center; }
.asset61-category-list { display: grid; gap: 4px; }
.asset61-category-row { display: grid; grid-template-columns: minmax(0, 1fr) 26px; gap: 4px; align-items: center; }
.asset61-category-filter { min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 8px; border: 0; background: transparent; color: var(--text-muted); border-radius: 8px; padding: 7px 8px; cursor: pointer; }
.asset61-category-filter:hover { background: rgba(255,255,255,.035); color: var(--text); }
.asset61-category-filter span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.asset61-category-filter b { min-width: 25px; text-align: center; padding: 2px 6px; border-radius: 999px; background: rgba(255,255,255,.05); color: var(--text-soft); font-size: 10px; }
.asset61-category-delete,.asset61-category-default { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 7px; }
.asset61-category-delete { border: 0; background: transparent; color: #ef8a8a; font-size: 16px; cursor: pointer; }
.asset61-category-delete:hover:not(:disabled) { background: rgba(239,68,68,.1); color: #fecaca; }
.asset61-category-delete:disabled { opacity: .28; cursor: not-allowed; }
.asset61-category-default { color: #5c6b7f; font-size: 14px; }
.asset61-library { min-width: 0; }
.asset61-library-head { min-height: 42px; display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.asset61-library-actions { display: flex; align-items: center; justify-content: flex-end; gap: 7px; flex-wrap: wrap; }
.asset61-select-page { display: inline-flex; align-items: center; gap: 6px; min-height: 30px; padding: 5px 8px; border: 1px solid var(--border); border-radius: 8px; color: var(--text-muted); font-size: 10px; cursor: pointer; background: rgba(255,255,255,.015); }
.asset61-select-page input { accent-color: var(--accent); }
#asset-delete-selected b { min-width: 18px; margin-left: 3px; padding: 1px 5px; border-radius: 999px; background: rgba(255,255,255,.1); }
.asset61-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px; }
.asset61-card { min-width: 0; overflow: hidden; padding: 0; position: relative; }
.asset61-select { position: absolute; z-index: 4; left: 9px; top: 9px; width: 28px; height: 28px; cursor: pointer; }
.asset61-select input { position: absolute; opacity: 0; pointer-events: none; }
.asset61-select span { width: 28px; height: 28px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.16); border-radius: 8px; background: rgba(7,12,20,.82); color: transparent; box-shadow: 0 5px 14px rgba(0,0,0,.18); transition: .15s ease; }
.asset61-select:hover span { border-color: rgba(167,139,250,.5); }
.asset61-select input:checked + span { color: #fff; border-color: rgba(124,92,252,.7); background: var(--accent); }
.asset61-preview { position: relative; display: block; height: 170px; background: rgba(255,255,255,.025); overflow: hidden; border-bottom: 1px solid var(--border); }
.asset61-preview img { width: 100%; height: 100%; object-fit: contain; display: block; transition: transform .18s ease; }
.asset61-preview:hover img { transform: scale(1.02); }
.asset61-preview span { position: absolute; right: 8px; bottom: 8px; opacity: 0; padding: 5px 7px; border-radius: 7px; background: rgba(9,13,22,.88); color: var(--text); font-size: 10px; transition: opacity .16s ease; }
.asset61-preview:hover span { opacity: 1; }
.asset61-card-body { padding: 12px; display: grid; gap: 9px; }
.asset61-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; min-width: 0; }
.asset61-card-head > div { min-width: 0; }
.asset61-card-head strong { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 13px; }
.asset61-card-head small { display: block; margin-top: 3px; color: var(--text-soft); font-size: 10px; }
.asset61-type { flex: 0 0 auto; border: 1px solid var(--border-strong); border-radius: 6px; padding: 3px 5px; color: var(--text-soft); font-size: 9px; font-weight: 800; }
.asset61-meta { display: flex; gap: 9px; flex-wrap: wrap; color: var(--text-soft); font-size: 10px; }
.asset61-id { display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 6px 7px; border-radius: 7px; background: rgba(0,0,0,.15); color: var(--text-muted); font-size: 9px; }
.asset61-actions { display: grid; grid-template-columns: 1fr auto auto; gap: 7px; }
.asset61-actions .btn { min-width: 0; justify-content: center; }
.asset61-pagination { display: flex; align-items: center; justify-content: center; gap: 12px; margin-top: 14px; color: var(--text-muted); font-size: 11px; }
.asset61-empty { grid-column: 1 / -1; min-height: 250px; display: grid; place-items: center; align-content: center; gap: 7px; text-align: center; }
.asset61-empty span { font-size: 34px; }
.asset61-empty small { color: var(--text-soft); }
.asset62-detail-card { width: min(980px, calc(100vw - 34px)); max-width: 980px; }
.asset62-detail-header h3 { margin: 3px 0 0; overflow-wrap: anywhere; }
.asset62-detail-layout { display: grid; grid-template-columns: minmax(300px, 1.05fr) minmax(320px, .95fr); gap: 18px; padding: 0 20px 20px; }
.asset62-detail-preview { position: relative; min-height: 360px; display: grid; place-items: center; overflow: hidden; border: 1px solid var(--border); border-radius: 13px; background: rgba(0,0,0,.16); }
.asset62-detail-preview img { width: 100%; height: 100%; max-height: 520px; object-fit: contain; }
.asset62-detail-preview span { position: absolute; right: 10px; bottom: 10px; padding: 6px 8px; border-radius: 7px; background: rgba(8,12,20,.88); color: var(--text); font-size: 10px; }
.asset62-detail-side { min-width: 0; display: grid; align-content: start; gap: 14px; }
.asset62-detail-meta { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; }
.asset62-detail-meta > div { min-width: 0; padding: 10px; border: 1px solid var(--border); border-radius: 9px; background: rgba(255,255,255,.018); }
.asset62-detail-meta span { display: block; color: var(--text-soft); font-size: 9px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.asset62-detail-meta strong,.asset62-detail-meta code { display: block; margin-top: 4px; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text); font-size: 11px; }
.asset62-detail-meta code { color: var(--text-muted); }
.asset62-detail-copy { display: flex; gap: 7px; flex-wrap: wrap; }
.asset62-detail-form { display: grid; gap: 12px; padding-top: 13px; border-top: 1px solid var(--border); }
.asset62-detail-form label { display: grid; gap: 6px; color: var(--text-muted); font-size: 11px; font-weight: 700; }
.asset62-detail-form label small { color: var(--text-soft); font-size: 9px; font-weight: 500; }
.asset62-detail-actions { margin-top: 2px; }

@media (max-width: 1250px) {
  .asset61-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .asset61-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .asset61-hero { grid-template-columns: auto minmax(0, 1fr); }
  .asset61-hero-state { grid-column: 1 / -1; }
  .asset61-filter-form { grid-template-columns: 1fr; }
  .asset61-layout { grid-template-columns: 1fr; }
  .asset62-detail-layout { grid-template-columns: 1fr; }
  .asset62-detail-preview { min-height: 280px; }
  .asset61-library-head { align-items: flex-start; flex-direction: column; }
  .asset61-library-actions { width: 100%; justify-content: flex-start; }
  .asset61-upload { position: static; }
}
@media (max-width: 620px) {
  .asset61-kpis { grid-template-columns: 1fr; }
  .asset61-grid { grid-template-columns: 1fr; }
  .asset61-preview { height: 190px; }
  .asset61-filter-actions { flex-wrap: wrap; }
  .asset61-actions { grid-template-columns: 1fr 1fr; }
  .asset61-actions .btn:last-child { grid-column: 1 / -1; }
  .asset62-detail-meta { grid-template-columns: 1fr; }
}