:root {
  --bg: #07111f;
  --surface: #0f172a;
  --surface-strong: #111827;
  --panel: #172033;
  --panel-soft: #1e293b;
  --border: rgba(148, 163, 184, 0.2);
  --border-strong: rgba(148, 163, 184, 0.38);
  --text: #e5e7eb;
  --muted: #94a3b8;
  --accent: #38bdf8;
  --accent-strong: #0ea5e9;
  --success: #22c55e;
  --warning: #f59e0b;
  --shadow: 0 24px 80px rgba(0, 0, 0, 0.35);
  --radius: 18px;
  --radius-sm: 12px;
  --sidebar-width: 292px;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  background:
    radial-gradient(circle at top left, rgba(56, 189, 248, 0.18), transparent 30rem),
    radial-gradient(circle at bottom right, rgba(34, 197, 94, 0.08), transparent 28rem),
    var(--bg);
  color: var(--text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}

button,
input,
select {
  font: inherit;
}

button {
  cursor: pointer;
}

.cj-saas-shell {
  display: grid;
  grid-template-columns: var(--sidebar-width) minmax(0, 1fr);
  min-height: 100vh;
}

.cj-sidebar {
  position: sticky;
  top: 0;
  height: 100vh;
  overflow-y: auto;
  padding: 22px;
  border-right: 1px solid var(--border);
  background: rgba(15, 23, 42, 0.92);
  backdrop-filter: blur(18px);
}

.cj-brand-block {
  display: flex;
  gap: 14px;
  align-items: center;
  padding-bottom: 22px;
  border-bottom: 1px solid var(--border);
}

.cj-brand-mark {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 16px;
  background: linear-gradient(135deg, var(--accent), #1d4ed8);
  color: #06111f;
  font-weight: 900;
  letter-spacing: -0.04em;
}

.cj-brand-block h2 {
  margin: 0;
  font-size: 18px;
}

.cj-brand-block p,
.cj-role-card span,
.cj-nav-section h3,
.cj-field span,
.cj-profile-button small,
.cj-context-strip span {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.cj-role-card {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin: 18px 0;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: rgba(30, 41, 59, 0.75);
}

.cj-role-card strong {
  color: var(--accent);
  font-size: 13px;
}

.cj-nav {
  display: grid;
  gap: 18px;
}

.cj-nav-section h3 {
  margin: 0 0 8px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

.cj-nav-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  padding: 12px 13px;
  border: 1px solid transparent;
  border-radius: 13px;
  color: var(--text);
  text-decoration: none;
}

.cj-nav-link small {
  color: var(--muted);
  font-size: 11px;
}

.cj-nav-link:hover,
.cj-nav-link.active {
  border-color: rgba(56, 189, 248, 0.38);
  background: rgba(56, 189, 248, 0.12);
}

.cj-app-frame {
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.cj-topbar {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 18px 24px;
  border-bottom: 1px solid var(--border);
  background: rgba(7, 17, 31, 0.9);
  backdrop-filter: blur(18px);
}

.cj-topbar-title h1 {
  margin: 4px 0 0;
  font-size: clamp(22px, 3vw, 32px);
  letter-spacing: -0.04em;
}

.cj-breadcrumbs {
  color: var(--muted);
  font-size: 12px;
}

.cj-topbar-actions {
  display: flex;
  align-items: end;
  gap: 12px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.cj-field {
  display: grid;
  gap: 6px;
}

.cj-field input,
.cj-field select {
  min-height: 40px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: rgba(15, 23, 42, 0.95);
  color: var(--text);
  padding: 0 12px;
  outline: none;
}

.cj-field input:focus,
.cj-field select:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(56, 189, 248, 0.16);
}

.cj-search-field input {
  width: min(36vw, 360px);
}

.cj-icon-button,
.cj-profile-button {
  min-height: 40px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: rgba(30, 41, 59, 0.9);
  color: var(--text);
}

.cj-icon-button {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 12px;
}

.cj-icon-button span {
  color: var(--success);
}

.cj-profile-button {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 5px 12px 5px 6px;
  text-align: left;
}

.cj-profile-button > span {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 10px;
  background: var(--accent);
  color: #06111f;
  font-weight: 900;
}

.cj-context-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  padding: 18px 24px 0;
}

.cj-context-strip article {
  padding: 14px 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: rgba(15, 23, 42, 0.72);
}

.cj-context-strip strong {
  display: block;
  margin-top: 5px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cj-content,
.content {
  min-width: 0;
  padding: 24px;
}

.page {
  display: grid;
  gap: 16px;
  max-width: 1280px;
}

.page > h1 {
  margin: 0;
  font-size: clamp(24px, 3vw, 36px);
  letter-spacing: -0.04em;
}

.panel {
  background: linear-gradient(180deg, rgba(23, 32, 51, 0.98), rgba(15, 23, 42, 0.98));
  padding: 18px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  margin-bottom: 16px;
  box-shadow: var(--shadow);
}

.badge {
  color: var(--accent);
}

.layout,
.sidebar {
  display: contents;
}

@media (max-width: 1120px) {
  .cj-saas-shell {
    grid-template-columns: 1fr;
  }

  .cj-sidebar {
    position: relative;
    height: auto;
    border-right: 0;
    border-bottom: 1px solid var(--border);
  }

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

  .cj-topbar {
    align-items: flex-start;
    flex-direction: column;
  }

  .cj-topbar-actions {
    justify-content: flex-start;
    width: 100%;
  }

  .cj-search-field input {
    width: min(76vw, 420px);
  }
}

@media (max-width: 760px) {
  .cj-sidebar,
  .cj-topbar,
  .cj-content,
  .content {
    padding: 16px;
  }

  .cj-nav,
  .cj-context-strip {
    grid-template-columns: 1fr;
  }

  .cj-topbar-actions,
  .cj-field,
  .cj-field input,
  .cj-field select,
  .cj-search-field input,
  .cj-icon-button,
  .cj-profile-button {
    width: 100%;
  }

  .cj-icon-button,
  .cj-profile-button {
    justify-content: center;
  }
}


/* UI02-UI06 Commercial SaaS UX additions */
.cj-mobile-menu{display:none;min-height:40px;border:1px solid var(--border);border-radius:12px;background:rgba(30,41,59,.92);color:var(--text);padding:0 12px}.cj-kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:16px}.cj-kpi-card{padding:18px;border:1px solid var(--border);border-radius:var(--radius);background:linear-gradient(180deg,rgba(30,41,59,.96),rgba(15,23,42,.96));box-shadow:var(--shadow)}.cj-kpi-card span,.cj-kpi-card small,.cj-panel-header span,.cj-onboarding header span,.cj-workspace-experience span{display:block;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.1em}.cj-kpi-card strong{display:block;margin:8px 0;font-size:30px;letter-spacing:-.05em}.cj-data-panel,.cj-onboarding{border:1px solid var(--border);border-radius:var(--radius);background:rgba(15,23,42,.82);box-shadow:var(--shadow);overflow:hidden}.cj-panel-header{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:18px;border-bottom:1px solid var(--border)}.cj-panel-header h2,.cj-onboarding h2{margin:4px 0 0}.cj-panel-header input{min-height:40px;border:1px solid var(--border);border-radius:12px;background:rgba(7,17,31,.86);color:var(--text);padding:0 12px}.cj-table-wrap{overflow:auto}.cj-data-grid{width:100%;border-collapse:collapse}.cj-data-grid th,.cj-data-grid td{padding:13px 16px;border-bottom:1px solid var(--border);text-align:left}.cj-data-grid th{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.08em;background:rgba(30,41,59,.55)}.cj-empty{padding:18px;color:var(--muted)}.cj-onboarding{padding:18px;display:grid;gap:12px}.cj-onboarding article{display:flex;gap:12px;align-items:flex-start;padding:13px;border:1px solid var(--border);border-radius:14px;background:rgba(30,41,59,.58)}.cj-onboarding article.complete{border-color:rgba(34,197,94,.36);background:rgba(34,197,94,.08)}.cj-onboarding h3,.cj-onboarding p{margin:0}.cj-onboarding p{color:var(--muted);font-size:13px}.cj-workspace-experience{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}.cj-workspace-experience article{padding:20px;border:1px solid var(--border);border-radius:var(--radius);background:rgba(15,23,42,.85);box-shadow:var(--shadow)}.cj-workspace-experience p{color:var(--muted)}.cj-workspace-experience button{border:1px solid rgba(56,189,248,.4);border-radius:12px;background:rgba(56,189,248,.12);color:var(--text);padding:10px 14px}.cj-theme-light{--bg:#f8fafc;--surface:#fff;--surface-strong:#f1f5f9;--panel:#fff;--panel-soft:#f8fafc;--border:rgba(15,23,42,.15);--text:#0f172a;--muted:#475569;--shadow:0 20px 50px rgba(15,23,42,.1)}.cj-theme-contrast{--bg:#000;--surface:#020617;--surface-strong:#000;--panel:#020617;--panel-soft:#111827;--border:rgba(255,255,255,.55);--text:#fff;--muted:#e5e7eb;--accent:#facc15;--shadow:none}
@media (max-width:1120px){.cj-mobile-menu{display:inline-flex;align-items:center;justify-content:center}.cj-saas-shell .cj-sidebar{display:none}.cj-saas-shell.sidebar-open .cj-sidebar{display:block}.cj-panel-header{align-items:flex-start;flex-direction:column}.cj-panel-header input{width:100%}}

/* UI07-UI11 commercial SaaS extensions */
.cj-commercial-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 18px;
  margin-top: 22px;
}
.cj-card {
  grid-column: span 6;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: rgba(15, 23, 42, 0.78);
  box-shadow: var(--shadow);
  padding: 18px;
}
.cj-card header span { color: var(--accent); font-size: 12px; text-transform: uppercase; letter-spacing: .12em; }
.cj-card header h2 { margin: 5px 0 16px; font-size: 18px; }
.cj-notification-center, .cj-timeline { grid-column: span 7; }
.cj-command-palette, .cj-accessibility { grid-column: span 5; }
.cj-saved-views, .cj-onboarding { grid-column: span 6; }
.cj-notice, .cj-timeline article, .cj-command-palette a, .cj-view-grid article {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  padding: 13px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: rgba(30, 41, 59, 0.58);
  margin-bottom: 10px;
}
.cj-notice p, .cj-timeline p { margin: 4px 0; color: var(--muted); }
.cj-notice small, .cj-timeline small, .cj-command-palette small, .cj-view-grid small { color: var(--muted); }
.cj-notice a, .cj-command-palette a { color: var(--accent); text-decoration: none; }
.cj-severity-danger { border-color: rgba(239,68,68,.55); }
.cj-severity-warning { border-color: rgba(245,158,11,.55); }
.cj-severity-success { border-color: rgba(34,197,94,.55); }
.cj-view-grid { display: grid; gap: 10px; }
.cj-view-grid article { display: block; }
.cj-bulk-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 12px; }
.cj-bulk-actions button {
  border: 1px solid var(--border-strong);
  border-radius: 999px;
  background: rgba(56, 189, 248, 0.10);
  color: var(--text);
  padding: 8px 12px;
}
#cj-command-results { display: grid; gap: 10px; margin-top: 12px; }
.cj-command-palette a { align-items: center; }
.cj-timeline article { justify-content: flex-start; }
.cj-timeline time { min-width: 140px; color: var(--accent); font-size: 12px; }
.cj-access-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.cj-access-grid span {
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: rgba(30, 41, 59, 0.58);
  padding: 12px;
}
@media (max-width: 980px) {
  .cj-commercial-grid { grid-template-columns: 1fr; }
  .cj-card, .cj-notification-center, .cj-command-palette, .cj-saved-views, .cj-timeline, .cj-accessibility, .cj-onboarding { grid-column: 1; }
  .cj-timeline article { display: block; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .001ms !important; animation-duration: .001ms !important; }
}


/* UI12-UI16 Commercial SaaS experience */
.cj-executive-cockpit,.cj-module-marketplace,.cj-billing-center,.cj-evidence-explorer,.cj-federation-console{grid-column:span 2;}
.cj-scorecards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:16px 0;}
.cj-scorecards article,.cj-module-cards article,.cj-connector-list article{border:1px solid rgba(148,163,184,.22);border-radius:18px;padding:16px;background:rgba(15,23,42,.52);}
.cj-scorecards strong{display:block;font-size:28px;margin:6px 0;color:#fff;}
.cj-focus-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;}
.cj-focus-list a{display:block;text-decoration:none;color:inherit;border:1px solid rgba(99,102,241,.35);border-radius:16px;padding:14px;background:rgba(37,99,235,.13);}
.cj-focus-list span{display:block;margin-top:6px;color:#cbd5e1;font-size:13px;line-height:1.45;}
.cj-module-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:14px;}
.cj-module-cards h3{margin:8px 0;color:#fff;}
.cj-module-cards b{display:inline-block;margin:8px 6px 0 0;padding:5px 8px;border-radius:999px;background:rgba(16,185,129,.12);color:#a7f3d0;font-size:11px;}
.cj-billing-summary{display:grid;grid-template-columns:auto 1fr auto 1fr;gap:10px;align-items:center;margin:14px 0;padding:14px;border-radius:16px;background:rgba(2,6,23,.42);}
.cj-billing-summary strong{font-size:24px;color:#fff;}.cj-billing-summary small{grid-column:1/-1;color:#cbd5e1;}
.cj-table{display:grid;gap:8px;}.cj-table>div{display:grid;grid-template-columns:1.2fr 1fr 1.4fr .7fr .7fr;gap:10px;align-items:center;padding:10px 12px;border-radius:12px;background:rgba(15,23,42,.58);border:1px solid rgba(148,163,184,.18);}
.cj-evidence-table>div{grid-template-columns:1fr 1.4fr 1fr 1fr;}.cj-table code{color:#93c5fd;}
.cj-connector-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:14px;}.cj-connector-list p{word-break:break-all;color:#cbd5e1;}
@media (max-width:1100px){.cj-scorecards,.cj-module-cards,.cj-focus-list,.cj-connector-list{grid-template-columns:1fr 1fr}.cj-executive-cockpit,.cj-module-marketplace,.cj-billing-center,.cj-evidence-explorer,.cj-federation-console{grid-column:span 1}.cj-table>div{grid-template-columns:1fr}.cj-billing-summary{grid-template-columns:1fr 1fr}}
@media (max-width:720px){.cj-scorecards,.cj-module-cards,.cj-focus-list,.cj-connector-list{grid-template-columns:1fr}.cj-billing-summary{grid-template-columns:1fr}}

/* UI17_UI21_PRODUCTIVITY_STYLES */
.cj-ui17-ui21-suite{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px;grid-column:1/-1}
.cj-productivity-card{min-height:220px}
.cj-branding-preview{display:flex;align-items:center;gap:14px;padding:16px;border:1px solid rgba(255,255,255,.12);border-radius:18px;background:linear-gradient(135deg,var(--cj-accent),rgba(255,255,255,.06))}
.cj-branding-preview>b{display:grid;place-items:center;width:56px;height:56px;border-radius:18px;background:rgba(0,0,0,.28);font-size:20px}
.cj-branding-preview div{display:flex;flex-direction:column;gap:4px}.cj-branding-preview small{opacity:.78}
.cj-mobile-nav-preview{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.cj-mobile-nav-preview a{display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px;border:1px solid rgba(255,255,255,.12);border-radius:16px;text-decoration:none}.cj-mobile-nav-preview b{font-size:20px}
.cj-form-preview{display:grid;gap:10px}.cj-form-preview label{display:flex;flex-direction:column;gap:6px}.cj-form-preview input{border:1px solid rgba(255,255,255,.16);border-radius:12px;padding:11px 12px;background:rgba(0,0,0,.16);color:inherit}.cj-form-preview input[data-required="true"]{border-color:rgba(111,173,255,.55)}
.cj-help-center{display:grid;gap:12px}.cj-help-center article{display:flex;flex-direction:column;gap:6px;padding:12px;border-radius:14px;background:rgba(255,255,255,.05)}.cj-help-center a{color:inherit;opacity:.82;text-decoration:none}
.cj-export-center{display:grid;gap:10px}.cj-export-center article{display:grid;grid-template-columns:1fr auto;gap:4px;align-items:center;padding:12px;border-radius:14px;background:rgba(255,255,255,.05)}.cj-export-center small{grid-column:1/-1;opacity:.72}
@media(max-width:900px){.cj-saas-shell{display:block}.cj-sidebar{position:relative;width:auto}.cj-mobile-nav-preview{grid-template-columns:repeat(2,1fr)}.cj-topbar-actions{flex-wrap:wrap}.cj-ui17-ui21-suite{grid-template-columns:1fr}}


/* UI22-UI26 commercial operations UX */
.cj-ui22-ui26-suite { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; grid-column: 1 / -1; }
.cj-ui22-ui26-suite .cj-operations-card { min-height: 280px; }
.cj-presence-row, .cj-channel-list, .cj-dataset-list, .cj-connector-list, .cj-policy-list { display: grid; gap: 10px; }
.cj-presence-row { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); margin-bottom: 14px; }
.cj-presence-row span, .cj-channel-list article, .cj-dataset-list article, .cj-connector-list article, .cj-policy-list article, .cj-workflow-board article, .cj-thread-list p, .cj-risk-list p { border: 1px solid var(--border); border-radius: 14px; background: rgba(15,23,42,.62); padding: 12px; }
.cj-presence-row b { color: var(--success); margin-right: 8px; }
.cj-channel-list, .cj-dataset-list, .cj-policy-list { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
.cj-dataset-list article, .cj-policy-list article, .cj-connector-list article { display: grid; gap: 6px; }
.cj-dataset-list span, .cj-policy-list span { color: var(--accent); font-weight: 800; }
.cj-workflow-board { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; }
.cj-workflow-board h3 { margin: 0 0 10px; font-size: 14px; color: var(--accent); }
.cj-workflow-board article div { padding: 10px; margin-bottom: 8px; border-radius: 12px; background: rgba(56,189,248,.08); display: grid; gap: 6px; }
.cj-thread-list p, .cj-risk-list p { margin: 10px 0 0; color: var(--muted); }
@media (max-width: 900px) { .cj-ui22-ui26-suite { grid-template-columns: 1fr; } }

/* UI27-UI31 Enterprise SaaS experience */
.cj-ui27-ui31-suite { display: contents; }
.cj-enterprise-card { border-color: rgba(34, 197, 94, 0.28); }
.cj-agent-grid,
.cj-template-grid,
.cj-flow-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
.cj-agent-grid article,
.cj-template-grid article,
.cj-flow-grid article,
.cj-service-list article { padding: 14px; border: 1px solid var(--border); border-radius: 14px; background: rgba(15, 23, 42, 0.62); }
.cj-agent-grid strong,
.cj-template-grid strong,
.cj-flow-grid strong { display: block; margin-bottom: 6px; color: var(--text); }
.cj-agent-grid span,
.cj-template-grid small,
.cj-service-list small { color: var(--muted); font-size: 12px; }
.cj-agent-grid p { color: var(--muted); margin: 8px 0 0; }
.cj-runtime-chip-row { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.cj-runtime-chip-row span { padding: 7px 10px; border-radius: 999px; background: rgba(34, 197, 94, 0.12); border: 1px solid rgba(34, 197, 94, 0.24); color: var(--success); font-size: 12px; }
.cj-proof-timeline { display: grid; gap: 10px; }
.cj-proof-timeline article { display: grid; grid-template-columns: 70px minmax(0,1fr); gap: 10px; align-items: start; padding: 10px; border: 1px solid var(--border); border-radius: 12px; background: rgba(15, 23, 42, 0.52); }
.cj-proof-timeline b { color: var(--accent); text-transform: uppercase; font-size: 11px; }
.cj-proof-timeline small { display: block; color: var(--muted); margin-top: 4px; word-break: break-all; }
.cj-flow-grid ol { margin: 8px 0 0; padding-left: 18px; color: var(--muted); }
.cj-sla-status { display: inline-flex; align-items: center; padding: 8px 12px; border-radius: 999px; background: rgba(34, 197, 94, 0.14); color: var(--success); text-transform: uppercase; letter-spacing: .08em; font-size: 12px; margin-bottom: 12px; }
.cj-service-list { display: grid; gap: 10px; }
.cj-service-list article { display: grid; gap: 4px; }
.cj-service-list b { color: var(--accent); }

/* UI32-UI36 commercial SaaS expansion */
.cj-security-center,.cj-localization-center,.cj-theme-studio,.cj-kpi-builder,.cj-import-center{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));}
.cj-security-control,.cj-locale-card,.cj-theme-token,.cj-kpi-card,.cj-import-template{border:1px solid rgba(148,163,184,.24);border-radius:14px;padding:14px;background:rgba(255,255,255,.88);box-shadow:0 8px 24px rgba(15,23,42,.06);}
.cj-kpi-builder .cj-kpi-value{font-size:28px;font-weight:800;letter-spacing:-.03em;}
.cj-import-center .cj-import-status{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:4px 10px;background:rgba(16,185,129,.12);}
@media (max-width: 720px){.cj-security-center,.cj-localization-center,.cj-theme-studio,.cj-kpi-builder,.cj-import-center{grid-template-columns:1fr;}}

/* UI37-UI40 final commercial SaaS completion */
.cj-ui37-ui40-suite{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;grid-column:1/-1;}
.cj-final-card{border-color:rgba(99,102,241,.30);}
.cj-final-dataset-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin-bottom:14px;}
.cj-final-dataset-grid article,.cj-final-list p,.cj-readiness-list article{border:1px solid var(--border);border-radius:14px;background:rgba(15,23,42,.62);padding:12px;margin:0;}
.cj-final-dataset-grid strong,.cj-final-list b{display:block;color:var(--text);margin-bottom:4px;}
.cj-final-dataset-grid small,.cj-final-list span{display:block;color:var(--muted);font-size:12px;line-height:1.45;}
.cj-final-list{display:grid;gap:10px;}
.cj-permission-matrix{overflow:auto;border:1px solid var(--border);border-radius:14px;background:rgba(15,23,42,.50);}
.cj-permission-matrix table{width:100%;border-collapse:collapse;min-width:720px;}
.cj-permission-matrix th,.cj-permission-matrix td{padding:10px;border-bottom:1px solid var(--border);text-align:center;font-size:12px;}
.cj-permission-matrix th:first-child,.cj-permission-matrix td:first-child{text-align:left;position:sticky;left:0;background:rgba(15,23,42,.92);}
.cj-release-current{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px;border-radius:16px;background:rgba(99,102,241,.12);border:1px solid rgba(99,102,241,.22);margin-bottom:12px;}
.cj-release-current strong{font-size:18px;color:var(--text);}.cj-release-current span{color:var(--muted);font-size:12px;}
.cj-check-chip-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px;}
.cj-check-chip-row span{border:1px solid rgba(56,189,248,.28);background:rgba(56,189,248,.10);border-radius:999px;padding:7px 10px;font-size:12px;}
.cj-readiness-status{display:inline-flex;padding:8px 12px;border-radius:999px;background:rgba(16,185,129,.12);color:var(--success);margin-bottom:12px;}
.cj-readiness-list{display:grid;gap:10px;}
.cj-readiness-list article{display:grid;grid-template-columns:28px 1fr auto;gap:10px;align-items:center;}
.cj-readiness-list article[data-ok="yes"] b{color:var(--success);}.cj-readiness-list article[data-ok="no"] b{color:var(--warning);}
.cj-readiness-list small{color:var(--muted);font-size:12px;}
@media(max-width:980px){.cj-ui37-ui40-suite{grid-template-columns:1fr;}.cj-readiness-list article{grid-template-columns:28px 1fr;}.cj-readiness-list small{grid-column:2;}}