:root {
  --bg: #050505;
  --panel: #0d0d0d;
  --panel-2: #111827;
  --line: rgba(0, 255, 204, 0.22);
  --cyan: #00ffcc;
  --purple: #a855f7;
  --text: #f8fafc;
  --muted: #94a3b8;
  --danger: #f43f5e;
  --success: #36d399;
  --watch: #fbbf24;
  --action: #fb923c;
  --critical: #fb7185;
  --surface: #0b1014;
  --surface-raised: #11181e;
  --sidebar-width: 248px;
}

* {
  box-sizing: border-box;
}

body {
  background:
    radial-gradient(circle at 20% 0%, rgba(0, 255, 204, 0.08), transparent 32rem),
    radial-gradient(circle at 85% 8%, rgba(168, 85, 247, 0.1), transparent 28rem),
    var(--bg);
  color: var(--text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  margin: 0;
  min-height: 100vh;
  overflow-x: hidden;
}

.eyebrow,
.metric-value,
.source-meta,
.state-pill,
.environment-badge,
th,
.nav-count {
  font-family: "JetBrains Mono", Consolas, monospace;
}

.dashboard-view:not(.hidden) {
  display: grid;
  grid-template-columns: var(--sidebar-width) minmax(0, 1fr);
  min-height: 100vh;
}

.control-workspace {
  min-width: 0;
}

.control-nav {
  background: rgba(6, 10, 13, 0.98);
  border-right: 1px solid rgba(148, 163, 184, 0.14);
  display: flex;
  flex-direction: column;
  height: 100vh;
  inset: 0 auto 0 0;
  overflow-y: auto;
  padding: 20px 14px;
  position: sticky;
  top: 0;
  z-index: 40;
}

.control-brand {
  align-items: center;
  color: var(--text);
  display: flex;
  gap: 10px;
  margin: 0 8px 26px;
  text-decoration: none;
}

.control-brand span:last-child { display: grid; font-size: 12px; letter-spacing: .13em; }
.control-brand small { color: var(--muted); font-size: 9px; }
.brand-mark { border: 1px solid rgba(0,255,204,.45); color: var(--cyan); font: 800 13px/1 "JetBrains Mono", monospace; padding: 9px 7px; }
.control-nav-groups { display: grid; gap: 19px; }
.control-nav-groups section { display: grid; gap: 3px; }
.control-nav-groups h2 { color: #64748b; font: 700 10px/1.2 "JetBrains Mono", monospace; letter-spacing: .12em; margin: 0 10px 7px; text-transform: uppercase; }
.nav-item { align-items: center; border: 0; border-left: 2px solid transparent; border-radius: 4px; color: #aab7c4; display: flex; font-size: 12px; justify-content: space-between; min-height: 35px; padding: 7px 10px; text-align: left; width: 100%; }
.nav-item:hover { transform: none !important; }
.nav-item.active { background: rgba(0,255,204,.07); border-left-color: var(--cyan); color: #f1fffc; }
.nav-count { background: rgba(251,146,60,.14); border: 1px solid rgba(251,146,60,.35); border-radius: 999px; color: #fdba74; font-size: 10px; padding: 3px 6px; }
.nav-footer { border-top: 1px solid rgba(148,163,184,.13); color: var(--muted); display: grid; font: 10px/1.5 "JetBrains Mono", monospace; gap: 2px; margin-top: auto; overflow-wrap: anywhere; padding: 18px 8px 0; }
.nav-toggle { display: none; }
.nav-scrim { display: none; }

.admin-header,
main {
  max-width: 1640px;
  padding-left: clamp(20px, 3vw, 44px);
  padding-right: clamp(20px, 3vw, 44px);
}

.admin-header {
  background: rgba(5,8,10,.88);
  border-bottom: 1px solid rgba(148,163,184,.12);
  min-height: 82px;
  position: sticky;
  top: 0;
  z-index: 30;
}

.admin-header h1 { font-size: clamp(22px, 2.2vw, 31px); }
.environment-badge,
.state-pill { align-items: center; border: 1px solid rgba(148,163,184,.24); border-radius: 999px; display: inline-flex; font-size: 10px; font-weight: 800; letter-spacing: .05em; min-height: 26px; padding: 5px 9px; text-transform: uppercase; }
.environment-badge[data-environment="staging"] { background: rgba(168,85,247,.13); border-color: rgba(168,85,247,.42); color: #d8b4fe; }
.environment-badge[data-environment="production"] { background: rgba(54,211,153,.08); border-color: rgba(54,211,153,.28); color: #86efac; }
.state-ok, .state-ready, .state-zero { color: #86efac; border-color: rgba(54,211,153,.35); }
.state-stale, .state-partial { color: #fde68a; border-color: rgba(251,191,36,.38); }
.state-unavailable, .state-auth_required { color: #fdba74; border-color: rgba(251,146,60,.38); }
.state-error, .state-critical { color: #fda4af; border-color: rgba(251,113,133,.42); }
.state-no_data, .state-not_available, .state-not_configured { color: #aab7c4; border-color: rgba(148,163,184,.28); }
.state-loading { color: var(--muted); }

.attention-panel { background: linear-gradient(100deg, rgba(17,24,30,.94), rgba(8,12,15,.96)); border: 1px solid rgba(251,146,60,.28); border-radius: 7px; margin-bottom: 14px; padding: 16px 18px; }
.attention-list { display: grid; gap: 7px; margin-top: 12px; }
.attention-list .alert-item { border-left: 2px solid var(--watch); border-radius: 2px; margin: 0; padding: 9px 11px; }
.attention-list:empty::after { color: var(--muted); content: "No deterministic attention items."; font-size: 12px; }
.overview-secondary { display: none; }
.executive-home { display: none; }
.executive-home.active { display: grid; gap: 14px; grid-template-columns: minmax(0, 1.6fr) minmax(280px, .8fr); }
.executive-home > .attention-panel, .executive-home > .executive-hero, .executive-home > .executive-hidden-data { grid-column: 1 / -1; }
.executive-home > .executive-block { margin: 0; }
.executive-home > .executive-block:nth-of-type(4) { grid-column: 1; }
.executive-home > .executive-block:nth-of-type(5) { grid-column: 2; }
.executive-home > .executive-block:nth-of-type(6) { grid-column: 1 / -1; }
.executive-hero, .executive-block, .panel, .attention-panel { box-shadow: none; }
.executive-block:hover, .panel:hover { transform: none; }
.module-intro { color: var(--muted); font-size: 13px; margin: 8px 0 18px; }
.state-legend { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.tertiary-button { background: transparent; border-color: transparent; color: var(--muted); min-height: 34px; padding: 6px 8px; }
.primary-button { background: var(--cyan); border-color: var(--cyan); color: #02100d; }
.danger-button { border-color: rgba(251,113,133,.48); color: #fda4af; }
.module-close-row, [data-close-module] { display: none; }
.tab-panel:not(#tab-summary).active { margin-top: 0; }

@media (min-width: 1440px) {
  .dashboard-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .dashboard-grid .span-2 { grid-column: span 2; }
}

@media (max-width: 1024px) {
  :root { --sidebar-width: 214px; }
  .controls label { display: none; }
}

@media (max-width: 820px) {
  .dashboard-view:not(.hidden) { display: block; }
  .control-nav { box-shadow: 20px 0 60px rgba(0,0,0,.5); position: fixed; transform: translateX(-105%); transition: transform 180ms ease; width: min(82vw, 280px); }
  .dashboard-view.nav-open .control-nav { transform: translateX(0); }
  .nav-toggle { display: inline-flex; left: 12px; min-height: 34px; position: fixed; top: 14px; z-index: 60; }
  .nav-scrim { background: rgba(0,0,0,.65); inset: 0; position: fixed; z-index: 35; }
  .dashboard-view.nav-open .nav-scrim { display: block; }
  .admin-header { padding-left: 80px; }
  .executive-home.active { display: block; }
  .executive-home > * { margin-bottom: 12px !important; }
}

@media (max-width: 430px) {
  .admin-header { align-items: flex-start; padding-left: 72px; }
  .admin-header .controls { display: grid; grid-template-columns: auto auto; width: 100%; }
  .admin-session { grid-column: 1 / -1; justify-items: start; }
  main { padding: 16px 12px 32px; }
  .metric-grid { grid-template-columns: 1fr 1fr; }
  .metric-card { min-width: 0; padding: 12px; }
  .metric-value { font-size: 22px; }
  .table-wrap { border: 1px solid rgba(148,163,184,.13); max-width: calc(100vw - 24px); }
}

.admin-header,
main {
  margin: 0 auto;
  max-width: 1280px;
  padding: 24px;
}

.admin-header {
  align-items: center;
  display: flex;
  justify-content: space-between;
  gap: 20px;
}

.eyebrow {
  color: var(--cyan);
  font-size: 12px;
  letter-spacing: 0.16em;
  margin: 0 0 8px;
  text-transform: uppercase;
}

h1,
h2 {
  letter-spacing: 0;
  margin: 0;
}

h1 {
  font-size: clamp(28px, 4vw, 46px);
}

h2 {
  color: var(--text);
  font-size: 16px;
}

.controls {
  align-items: end;
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

label {
  color: var(--muted);
  display: grid;
  font-size: 12px;
  gap: 6px;
}

select,
input,
button {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--text);
  font: inherit;
  min-height: 42px;
  padding: 0 14px;
}

button {
  color: var(--cyan);
  cursor: pointer;
  font-weight: 700;
  min-height: 44px;
  padding: 10px 16px;
  transition: background 160ms ease, border-color 160ms ease, color 160ms ease, transform 160ms ease;
}

button:disabled {
  cursor: wait;
  opacity: 0.55;
}

button:not(:disabled):hover {
  background: rgba(0, 255, 204, 0.1);
  border-color: rgba(0, 255, 204, 0.48);
  transform: translateY(-1px);
}

button:focus-visible,
input:focus-visible,
select:focus-visible {
  outline: 2px solid var(--cyan);
  outline-offset: 2px;
}

.hidden {
  display: none !important;
}

.login-view {
  align-items: center;
  display: flex;
  min-height: 100vh;
  padding: 24px;
}

.login-card {
  background: linear-gradient(180deg, rgba(17, 24, 39, 0.9), rgba(13, 13, 13, 0.98));
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.42);
  display: grid;
  gap: 16px;
  margin: 0 auto;
  max-width: 440px;
  padding: 28px;
  width: min(100%, 440px);
}

.login-copy,
.login-status {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.5;
  margin: 0;
}

.login-status.error {
  color: var(--danger);
}

.login-status.success {
  color: var(--cyan);
}

.admin-session {
  align-items: end;
  display: grid;
  gap: 6px;
  justify-items: end;
}

.admin-session span {
  color: var(--muted);
  font-size: 12px;
  max-width: 260px;
  overflow-wrap: anywhere;
}

.link-button {
  min-height: 34px;
}

.status-row {
  align-items: center;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 24px;
}

.admin-tabs {
  background: rgba(5, 5, 5, 0.52);
  border: 1px solid rgba(148, 163, 184, 0.16);
  border-radius: 8px;
  display: flex;
  gap: 6px;
  margin-bottom: 24px;
  padding: 6px;
  width: fit-content;
}

.module-launcher {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  width: 100%;
}

.tab-button {
  border-color: transparent;
  color: var(--muted);
  min-height: 38px;
}

.tab-button.active {
  background: rgba(0, 255, 204, 0.12);
  border-color: var(--line);
  color: var(--cyan);
}

.tab-panel {
  display: none;
}

.tab-panel.active {
  display: block;
  animation: moduleIn 180ms ease both;
}

.tab-panel:not(#tab-summary).active {
  margin-top: 18px;
}

.executive-home {
  display: block;
}

.executive-hero,
.executive-block,
.helix-coo-card {
  background: linear-gradient(180deg, rgba(17, 24, 39, 0.76), rgba(5, 5, 5, 0.92));
  border: 1px solid rgba(0, 255, 204, 0.2);
  border-radius: 8px;
  margin-bottom: 16px;
  padding: 18px;
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.executive-block:hover,
.helix-coo-card:hover,
.metric-card:hover,
.panel:hover {
  border-color: rgba(0, 255, 204, 0.34);
  box-shadow: 0 20px 48px rgba(0, 0, 0, 0.28);
}

.helix-coo-card {
  display: grid;
  gap: 16px;
}

.helix-coo-header,
.helix-coo-intro {
  align-items: start;
  display: flex;
  justify-content: space-between;
  gap: 16px;
}

.helix-coo-header h2 {
  font-size: clamp(32px, 5vw, 62px);
  margin: 0;
}

.helix-coo-intro {
  border-top: 1px solid rgba(148, 163, 184, 0.14);
  padding-top: 16px;
}

.helix-coo-intro strong {
  color: var(--cyan);
  font-size: 20px;
  min-width: 150px;
}

.helix-coo-intro p {
  color: var(--text);
  font-size: 18px;
  line-height: 1.45;
  margin: 0;
  max-width: 760px;
}

.helix-coo-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.helix-coo-grid section {
  background: rgba(5, 5, 5, 0.42);
  border: 1px solid rgba(148, 163, 184, 0.12);
  border-radius: 8px;
  min-height: 180px;
  padding: 14px;
}

.helix-coo-grid h3 {
  color: var(--muted);
  font-size: 12px;
  letter-spacing: 0.08em;
  margin: 0 0 12px;
  text-transform: uppercase;
}

.coo-list {
  display: grid;
  gap: 10px;
}

.coo-item {
  align-items: start;
  display: grid;
  gap: 10px;
  grid-template-columns: auto 1fr;
}

.coo-item span {
  border-radius: 999px;
  height: 10px;
  margin-top: 5px;
  width: 10px;
}

.coo-item p {
  color: var(--text);
  line-height: 1.45;
  margin: 0;
}

.coo-period {
  border-radius: 0;
  color: var(--muted);
  display: inline-block;
  font-size: 11px;
  height: auto;
  margin-top: 4px;
  width: auto;
}

.coo-info > span {
  background: #22c55e;
}

.coo-ok > span,
.coo-success > span {
  background: #22c55e;
}

.coo-warning > span {
  background: #facc15;
}

.coo-danger > span,
.coo-error > span {
  background: #ef4444;
}

.executive-hero {
  align-items: center;
  display: flex;
  justify-content: space-between;
  gap: 16px;
}

.executive-hero h2 {
  font-size: clamp(30px, 5vw, 58px);
  margin: 0;
}

.executive-health {
  color: var(--muted);
  display: grid;
  gap: 6px;
  justify-items: end;
  text-align: right;
}

.executive-health strong {
  color: var(--cyan);
  font-size: 18px;
}

.executive-health .health-error {
  color: var(--danger);
}

.executive-health .health-partial,
.executive-health .health-attention {
  color: #facc15;
}

.executive-health .health-healthy { color: var(--cyan); }

.source-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
  margin-top: 8px;
}

.source-pill {
  align-items: center;
  background: rgba(5, 5, 5, 0.48);
  border: 1px solid rgba(148, 163, 184, 0.14);
  border-radius: 999px;
  color: var(--muted);
  display: inline-flex;
  font-size: 12px;
  gap: 7px;
  min-height: 30px;
  padding: 5px 10px;
}

.source-pill span {
  border-radius: 999px;
  display: inline-block;
  height: 9px;
  width: 9px;
}

.source-ok span {
  background: #22c55e;
}

.source-warning span {
  background: #facc15;
}

.source-danger span {
  background: #ef4444;
}

.source-offline span {
  background: #94a3b8;
}

.source-not-configured span, .source-neutral span { background: #94a3b8; }
.metric-card-not_configured { background: rgba(15, 23, 42, 0.46); border-color: rgba(148, 163, 184, 0.18); }
.metric-card-not_configured .metric-value, .metric-card-no_data .metric-value { color: #aab7c4; font-size: 18px; line-height: 1.35; }

.executive-today-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin-bottom: 0;
}

.executive-list + .executive-list {
  margin-top: 10px;
}

.executive-hidden-data {
  display: none;
}

.module-groups {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.module-group {
  background: rgba(5, 5, 5, 0.42);
  border: 1px solid rgba(148, 163, 184, 0.12);
  border-radius: 8px;
  display: grid;
  gap: 8px;
  padding: 12px;
}

.module-group h3 {
  color: var(--muted);
  font-size: 12px;
  letter-spacing: 0.08em;
  margin: 0 0 4px;
  text-transform: uppercase;
}

.module-group .tab-button {
  align-items: center;
  background: rgba(17, 24, 39, 0.62);
  border-color: rgba(148, 163, 184, 0.16);
  display: flex;
  justify-content: space-between;
  text-align: left;
  width: 100%;
}

.module-group .tab-button span {
  color: var(--text);
}

.module-group .tab-button small {
  color: var(--cyan);
}

.panel-actions,
.module-close-row {
  align-items: center;
  display: flex;
  gap: 10px;
  justify-content: flex-end;
}

.module-close-row {
  margin-bottom: 12px;
}

.section-heading {
  align-items: end;
  display: flex;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}

.status,
.updated-at {
  color: var(--muted);
  font-size: 13px;
}

.status.error {
  color: var(--danger);
}

.metric-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin: 14px 0 24px;
}

.metric-card,
.panel {
  background: linear-gradient(180deg, rgba(17, 24, 39, 0.86), rgba(13, 13, 13, 0.95));
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.24);
}

.metric-card {
  min-height: 104px;
  padding: 16px;
}

.metric-label {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.metric-card-top {
  align-items: center;
  display: flex;
  gap: 10px;
  justify-content: space-between;
}

.metric-icon {
  border: 1px solid rgba(0, 255, 204, 0.24);
  border-radius: 8px;
  color: var(--cyan);
  font-size: 10px;
  font-weight: 900;
  min-width: 34px;
  padding: 6px;
  text-align: center;
}

.metric-value {
  color: var(--cyan);
  font-size: 30px;
  font-weight: 800;
  margin-top: 12px;
}

.metric-hint {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
  margin-top: 8px;
}

.metric-trend {
  color: var(--purple);
  font-size: 11px;
  margin-top: 6px;
}

.metric-card-unavailable .metric-value {
  color: var(--muted);
}

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

.panel {
  min-width: 0;
  padding: 16px;
}

.span-2 {
  grid-column: span 2;
}

.panel-header {
  align-items: center;
  border-bottom: 1px solid rgba(148, 163, 184, 0.16);
  display: flex;
  justify-content: space-between;
  margin-bottom: 12px;
  padding-bottom: 12px;
}

.insight-list {
  display: grid;
  gap: 10px;
}

.highlight-card {
  align-items: start;
  background: rgba(5, 5, 5, 0.36);
  border: 1px solid rgba(148, 163, 184, 0.12);
  border-left: 3px solid rgba(0, 255, 204, 0.55);
  border-radius: 8px;
  display: grid;
  gap: 10px;
  grid-template-columns: auto 1fr;
  min-height: 58px;
  padding: 12px;
}

.highlight-card > span {
  border-radius: 999px;
  display: inline-block;
  height: 11px;
  margin-top: 4px;
  width: 11px;
}

.highlight-card p {
  color: var(--text);
  line-height: 1.45;
  margin: 0;
  min-width: 0;
  overflow-wrap: normal;
  word-break: normal;
}

#business-insights-list .highlight-card .muted {
  background: transparent;
  box-shadow: none;
  color: #b8c4d6;
  display: inline;
  overflow-wrap: anywhere;
  white-space: normal;
}

#business-insights-list .highlight-ok .muted {
  color: #b9dec8;
}

#business-insights-list .highlight-warning .muted {
  color: #ddd2a4;
}

.highlight-ok span {
  background: #22c55e;
}

.highlight-ok {
  border-left-color: rgba(34, 197, 94, 0.72);
}

.highlight-warning span {
  background: #facc15;
}

.highlight-warning {
  border-left-color: rgba(250, 204, 21, 0.72);
}

.highlight-danger span {
  background: #ef4444;
}

.highlight-danger,
.highlight-error {
  border-left-color: rgba(239, 68, 68, 0.74);
}

.highlight-info {
  border-left-color: rgba(0, 255, 204, 0.62);
}

.highlight-info span {
  background: var(--cyan);
}

.data-sources-panel {
  margin-top: 16px;
}

.source-status-list {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.source-card {
  align-items: center;
  background: rgba(5, 5, 5, 0.52);
  border: 1px solid rgba(148, 163, 184, 0.14);
  border-radius: 8px;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  min-height: 72px;
  padding: 12px;
}

.source-state-row { align-items: center; color: var(--muted); display: flex; font: 10px/1.3 "JetBrains Mono", Consolas, monospace; gap: 8px; margin-top: 8px; text-transform: uppercase; }
.source-message { color: var(--muted); font-size: 12px; line-height: 1.5; margin-top: 10px; }
.source-message-error { color: #fda4af; }
.source-message-auth_required, .source-message-unavailable, .source-message-partial, .source-message-stale { color: #fdba74; }

.source-name {
  color: var(--text);
  font-size: 13px;
  font-weight: 800;
}

.source-meta {
  color: var(--muted);
  font-size: 11px;
  margin-top: 5px;
}

.source-error {
  color: var(--danger);
  font-size: 11px;
  margin-top: 5px;
}

.source-warning {
  color: #facc15;
  font-size: 11px;
  margin-top: 5px;
}

.source-status {
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 999px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  padding: 6px 8px;
  white-space: nowrap;
}

.source-card-success .source-status,
.source-card-connected .source-status,
.source-card-ready .source-status {
  border-color: rgba(0, 255, 204, 0.32);
  color: var(--cyan);
}

.source-card-no_data .source-status,
.source-card-stale .source-status,
.source-card-degraded .source-status {
  border-color: rgba(250, 204, 21, 0.35);
  color: #facc15;
}

.source-card-error .source-status {
  border-color: rgba(244, 63, 94, 0.35);
  color: var(--danger);
}

.game-detail-grid {
  display: grid;
  gap: 12px;
  margin-top: 14px;
}

.game-status-note {
  background: rgba(5, 5, 5, 0.42);
  border: 1px solid rgba(148, 163, 184, 0.14);
  border-left: 3px solid rgba(0, 255, 204, 0.62);
  border-radius: 8px;
  display: grid;
  gap: 4px;
  padding: 12px;
}

.game-status-note strong {
  color: var(--text);
  font-size: 13px;
}

.game-status-note span,
.game-secondary-metrics {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

.game-warning {
  border-left-color: rgba(250, 204, 21, 0.72);
}

.game-danger {
  border-left-color: rgba(239, 68, 68, 0.74);
}

.game-offline {
  border-left-color: rgba(148, 163, 184, 0.45);
}

.game-secondary-metrics {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.game-secondary-metrics span {
  background: rgba(15, 23, 42, 0.5);
  border: 1px solid rgba(148, 163, 184, 0.12);
  border-radius: 999px;
  padding: 7px 10px;
}

.insight-item {
  background: rgba(5, 5, 5, 0.52);
  border: 1px solid rgba(148, 163, 184, 0.12);
  border-left: 3px solid var(--cyan);
  border-radius: 8px;
  color: #dbeafe;
  font-size: 14px;
  line-height: 1.5;
  padding: 12px 14px;
}

.business-status,
.data-quality,
.activity-list,
.alerts-list,
.trend-selector,
.csv-preview {
  display: grid;
  gap: 10px;
}

.business-status-card,
.activity-item,
.alert-item {
  background: rgba(5, 5, 5, 0.52);
  border: 1px solid rgba(148, 163, 184, 0.14);
  border-radius: 8px;
  padding: 12px;
}

.business-status-card {
  align-items: center;
  display: flex;
  gap: 12px;
}

.business-status-icon,
.quality-grade {
  color: var(--cyan);
  font-size: 20px;
  font-weight: 900;
}

.business-status-label {
  color: var(--text);
  font-size: 15px;
  font-weight: 900;
}

.business-status-yellow .business-status-icon {
  color: #facc15;
}

.business-status-red .business-status-icon,
.alert-item {
  color: var(--danger);
}

.executive-funnel {
  align-items: stretch;
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(7, minmax(0, 1fr));
}

.executive-funnel-stage {
  background: rgba(5, 5, 5, 0.52);
  border: 1px solid rgba(0, 255, 204, 0.22);
  border-radius: 8px;
  min-height: 84px;
  padding: 12px;
}

.executive-funnel-stage.is-unavailable {
  border-color: rgba(148, 163, 184, 0.16);
  opacity: 0.75;
}

.stage-label,
.activity-label {
  color: var(--text);
  font-size: 13px;
  font-weight: 900;
}

.stage-value {
  color: var(--cyan);
  font-size: 18px;
  font-weight: 900;
  margin-top: 10px;
}

.stage-arrow {
  display: none;
}

.activity-item {
  align-items: center;
  display: flex;
  justify-content: space-between;
  gap: 14px;
}

.activity-group {
  display: grid;
  gap: 8px;
}

.activity-group + .activity-group {
  border-top: 1px solid rgba(148, 163, 184, 0.14);
  margin-top: 8px;
  padding-top: 12px;
}

.activity-group h3 {
  color: var(--muted);
  font-size: 12px;
  letter-spacing: 0.08em;
  margin: 0;
  text-transform: uppercase;
}

.activity-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 10px;
}

.activity-filter {
  background: rgba(5, 5, 5, 0.46);
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-radius: 999px;
  color: var(--muted);
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  min-height: 34px;
  padding: 7px 12px;
}

.activity-filter.active,
.activity-filter:focus-visible {
  border-color: rgba(0, 255, 204, 0.55);
  color: var(--cyan);
  outline: none;
}

.activity-icon {
  align-items: center;
  background: rgba(0, 255, 204, 0.1);
  border: 1px solid rgba(0, 255, 204, 0.2);
  border-radius: 8px;
  color: var(--cyan);
  display: inline-flex;
  flex: 0 0 42px;
  font-size: 10px;
  font-weight: 900;
  height: 42px;
  justify-content: center;
}

.activity-item > div:first-of-type {
  flex: 1;
  min-width: 0;
}

.activity-source {
  color: var(--purple);
  font-size: 11px;
  white-space: nowrap;
}

.empty-state {
  align-items: start;
  background: rgba(5, 5, 5, 0.46);
  border: 1px dashed rgba(148, 163, 184, 0.22);
  border-radius: 8px;
  color: var(--muted);
  display: grid;
  gap: 6px;
  padding: 18px;
}

.empty-state strong {
  color: var(--text);
}

.empty-state.compact-empty {
  min-height: 0;
  padding: 12px;
}

.trend-selector {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.trend-option:disabled {
  color: var(--muted);
}

.placeholder-panel,
.csv-picker {
  max-width: 760px;
}

.csv-picker {
  margin-bottom: 14px;
}

.csv-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 14px 0;
}

.csv-actions[hidden] {
  display: none;
}

.primary-button,
.ghost-button {
  min-height: 44px;
  border-radius: 8px;
  padding: 10px 16px;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}

.primary-button {
  border: 1px solid var(--cyan);
  background: var(--cyan);
  color: #020617;
}

.ghost-button {
  border: 1px solid rgba(0, 255, 204, 0.4);
  background: rgba(0, 255, 204, 0.05);
  color: var(--cyan);
}

.primary-button:disabled,
.ghost-button:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

.panel-subsection {
  margin-top: 24px;
  border-top: 1px solid rgba(148, 163, 184, 0.16);
  padding-top: 20px;
}

.panel-header.compact {
  align-items: center;
  gap: 16px;
}

.csv-history,
.csv-detail {
  display: grid;
  gap: 12px;
  margin-top: 14px;
}

.youtube-grid {
  margin-top: 16px;
}

.youtube-video-list,
.external-list {
  display: grid;
  gap: 10px;
}

.youtube-video-item,
.external-list-item {
  align-items: center;
  background: rgba(5, 5, 5, 0.52);
  border: 1px solid rgba(148, 163, 184, 0.14);
  border-radius: 8px;
  display: grid;
  gap: 12px;
  grid-template-columns: 96px 1fr;
  min-height: 96px;
  padding: 10px;
}

.external-list-item > div {
  min-width: 0;
}

.external-list-item.text-only {
  grid-template-columns: 1fr;
}

.external-list-item.text-only .source-meta,
.external-list-item.text-only .activity-label {
  overflow-wrap: normal;
  word-break: normal;
}

.top-model-card {
  align-items: start;
  grid-template-columns: 132px minmax(0, 1fr);
  min-height: 122px;
}

.top-model-card .activity-label {
  display: -webkit-box;
  line-height: 1.3;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.top-model-card img,
.top-model-card .youtube-thumb-placeholder {
  width: 132px;
}

.free-paid-summary {
  align-items: stretch;
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.free-paid-summary div {
  background: rgba(5, 5, 5, 0.46);
  border: 1px solid rgba(148, 163, 184, 0.12);
  border-radius: 8px;
  padding: 10px;
}

.free-paid-summary span {
  color: var(--muted);
  display: block;
  font-size: 12px;
}

.free-paid-summary strong {
  color: var(--purple);
  display: block;
  font-size: 22px;
  margin-top: 4px;
}

.free-paid-summary p {
  color: var(--muted);
  grid-column: 1 / -1;
  margin: 0;
}

.reconciliation-card {
  background: rgba(5, 5, 5, 0.52);
  border: 1px solid rgba(148, 163, 184, 0.14);
  border-radius: 8px;
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 12px;
}

.reconciliation-values {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
}

.reconciliation-values span {
  color: var(--muted);
  font-size: 11px;
  min-width: 0;
}

.reconciliation-values strong {
  color: var(--text);
  display: block;
  margin-top: 2px;
  overflow-wrap: normal;
  word-break: normal;
}

.reconciliation-note {
  background: rgba(250, 204, 21, 0.08);
  border: 1px solid rgba(250, 204, 21, 0.24);
  border-radius: 8px;
  color: var(--muted);
  font-size: 12px;
  grid-column: 1 / -1;
  line-height: 1.45;
  padding: 10px 12px;
}

.cults-sync-panel .source-status-list {
  grid-template-columns: 1fr;
}

.cults-sync-panel .source-card {
  min-height: 0;
}

.cults-reconciliation-panel > .panel-header {
  align-items: start;
  flex-wrap: wrap;
  gap: 12px;
}

.cults-reconciliation-panel #cults-reconciliation-summary {
  align-items: start;
}

.youtube-video-item img,
.external-list-item img,
.youtube-thumb-placeholder {
  aspect-ratio: 16 / 9;
  background: rgba(148, 163, 184, 0.12);
  border-radius: 6px;
  object-fit: cover;
  width: 96px;
}

.external-grid {
  margin-top: 16px;
}

@media (min-width: 981px) {
  #models-cults-panel > .external-grid {
    align-items: start;
    grid-template-columns: minmax(0, 1.6fr) minmax(0, 1.4fr) minmax(220px, 1fr);
  }

  .cults-top-models-panel,
  .cults-sales-country-panel,
  .cults-free-paid-panel {
    grid-column: span 1;
  }

  .cults-recent-sales-panel {
    grid-column: 1 / span 2;
  }

  .cults-sync-panel {
    grid-column: span 1;
  }

  .cults-reconciliation-panel {
    grid-column: 1 / -1;
  }
}

.layout-compact { max-width: 760px; }
.layout-standard { max-width: 1080px; }
.layout-wide { max-width: none; }
.module-controls { align-items: end; background: rgba(148, 163, 184, .04); border: 1px solid rgba(148, 163, 184, .12); border-radius: 6px; display: flex; flex-wrap: wrap; gap: 12px; margin: 0 0 18px; padding: 11px 13px; }
.module-controls select { min-height: 36px; }
.module-subnav { border-bottom: 1px solid rgba(148, 163, 184, .18); display: flex; gap: 6px; margin: 0 0 18px; }
.module-subnav button { border: 0; border-bottom: 2px solid transparent; border-radius: 0; color: var(--muted); min-height: 40px; padding: 8px 14px; }
.module-subnav button.active { border-bottom-color: var(--cyan); color: var(--text); }
.model-channel[hidden] { display: none !important; }
.module-state { margin: 0 0 16px; }
.operational-state { background: rgba(148, 163, 184, .035); border: 1px solid rgba(148, 163, 184, .16); border-left: 3px solid #64748b; border-radius: 6px; display: grid; gap: 8px; max-width: 760px; padding: 16px 18px; }
.operational-state > div { align-items: center; display: flex; flex-wrap: wrap; gap: 9px; }
.operational-state strong { font-size: 14px; }
.operational-state p { color: var(--muted); font-size: 12px; line-height: 1.5; margin: 0; }
.operational-source { color: var(--muted); font: 10px/1.3 "JetBrains Mono", Consolas, monospace; text-transform: uppercase; }
.operational-state-ready { border-left-color: var(--success); }
.operational-state-zero, .operational-state-no_data { border-left-color: #64748b; }
.operational-state-stale, .operational-state-partial { border-left-color: var(--watch); }
.operational-state-unavailable { border-left-color: var(--action); }
.module-footnote { color: var(--muted); font-size: 11px; line-height: 1.5; max-width: 760px; }
.tertiary-link { color: var(--cyan); display: inline-flex; font-size: 12px; margin: 10px 0 16px; }
.status.warning { color: var(--watch); }

@media (max-width: 430px) {
  .module-subnav button { flex: 1; }
  .operational-state { padding: 14px; }
}

.external-state {
  align-items: center;
  background: rgba(5, 5, 5, 0.52);
  border: 1px solid rgba(148, 163, 184, 0.16);
  border-radius: 8px;
  display: flex;
  gap: 14px;
  justify-content: space-between;
  padding: 14px;
}

.external-state-error {
  border-color: rgba(244, 63, 94, 0.36);
}

.external-state-not_configured {
  border-color: rgba(250, 204, 21, 0.32);
}

.skeleton-line {
  animation: pulse-skeleton 1.2s ease-in-out infinite;
  background: linear-gradient(90deg, rgba(148, 163, 184, 0.08), rgba(148, 163, 184, 0.18), rgba(148, 163, 184, 0.08));
  border-radius: 8px;
  min-height: 48px;
}

@keyframes pulse-skeleton {
  0% {
    opacity: 0.5;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0.5;
  }
}

.lead-filters {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 14px;
}

.filter-search {
  min-width: 220px;
}

.table-wrap {
  overflow: auto;
}

table {
  border-collapse: collapse;
  min-width: 100%;
  width: 100%;
}

.leads-table-wrap table {
  min-width: 920px;
}

th,
td {
  border-bottom: 1px solid rgba(148, 163, 184, 0.12);
  font-size: 13px;
  padding: 10px 8px;
  text-align: left;
  vertical-align: top;
}

th {
  color: var(--cyan);
  font-size: 11px;
  text-transform: uppercase;
}

td {
  color: #dbeafe;
}

.muted {
  color: var(--muted);
}

.badge {
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 999px;
  display: inline-flex;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
  padding: 6px 9px;
  white-space: nowrap;
}

.badge-area {
  background: rgba(0, 255, 204, 0.11);
  border-color: rgba(0, 255, 204, 0.3);
  color: var(--cyan);
}

.badge-type {
  background: rgba(168, 85, 247, 0.12);
  border-color: rgba(168, 85, 247, 0.34);
  color: #d8b4fe;
}

.badge-status {
  background: rgba(59, 130, 246, 0.12);
  border-color: rgba(59, 130, 246, 0.34);
  color: #bfdbfe;
}

.funnel-list,
.compact-list {
  display: grid;
  gap: 10px;
}

.funnel-item,
.compact-item {
  align-items: center;
  background: rgba(5, 5, 5, 0.52);
  border: 1px solid rgba(148, 163, 184, 0.12);
  border-radius: 8px;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 12px;
}

.funnel-item {
  display: grid;
  grid-template-columns: minmax(150px, 1.2fr) minmax(120px, 2fr) auto;
}

.funnel-copy {
  min-width: 0;
}

.funnel-bar {
  background: rgba(148, 163, 184, 0.14);
  border-radius: 999px;
  height: 12px;
  overflow: hidden;
}

.funnel-bar span {
  background: linear-gradient(90deg, var(--cyan), var(--purple));
  border-radius: inherit;
  display: block;
  height: 100%;
}

.funnel-name,
.compact-name {
  color: var(--muted);
  font-size: 13px;
}

.funnel-count,
.compact-count {
  color: var(--purple);
  font-size: 18px;
  font-weight: 800;
}

.detail-modal.hidden {
  display: none;
}

.detail-modal {
  inset: 0;
  position: fixed;
  z-index: 100;
}

.detail-backdrop {
  background: rgba(0, 0, 0, 0.72);
  inset: 0;
  position: absolute;
}

.detail-panel {
  background: var(--panel);
  border-left: 1px solid var(--line);
  box-shadow: -24px 0 60px rgba(0, 0, 0, 0.45);
  height: 100%;
  margin-left: auto;
  max-width: 560px;
  overflow: auto;
  padding: 24px;
  position: relative;
  width: min(100%, 560px);
}

.detail-header {
  align-items: start;
  border-bottom: 1px solid rgba(148, 163, 184, 0.16);
  display: flex;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
  padding-bottom: 16px;
}

.detail-content {
  display: grid;
  gap: 12px;
}

.rsvp-detail-panel:empty {
  display: none;
}

.rsvp-detail-grid {
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.rsvp-detail-grid div,
.rsvp-response-detail {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(148, 163, 184, 0.14);
  border-radius: 8px;
  padding: 12px;
}

.rsvp-detail-grid span {
  color: var(--muted);
  display: block;
  font-size: 0.78rem;
  margin-bottom: 4px;
}

.rsvp-detail-grid strong {
  color: var(--text);
  overflow-wrap: anywhere;
}

.rsvp-response-detail {
  margin-top: 16px;
}

.detail-section {
  background: rgba(5, 5, 5, 0.38);
  border: 1px solid rgba(148, 163, 184, 0.14);
  border-radius: 8px;
  padding: 10px;
}

.detail-section summary,
.technical-events summary {
  color: var(--cyan);
  cursor: pointer;
  font-size: 13px;
  font-weight: 800;
}

.detail-section-grid {
  display: grid;
  gap: 10px;
  margin-top: 10px;
}

.detail-row {
  background: rgba(5, 5, 5, 0.52);
  border: 1px solid rgba(148, 163, 184, 0.12);
  border-radius: 8px;
  padding: 10px 12px;
}

.detail-key {
  color: var(--cyan);
  font-size: 11px;
  margin-bottom: 5px;
  text-transform: uppercase;
}

.detail-value {
  color: var(--text);
  font-size: 13px;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}

@keyframes moduleIn {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 980px) {
  .metric-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .module-launcher,
  .executive-today-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .module-groups {
    grid-template-columns: 1fr;
  }

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

  .source-status-list {
    grid-template-columns: 1fr;
  }

  .executive-funnel,
  .trend-selector {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .admin-header,
  .status-row,
  .controls {
    align-items: stretch;
    flex-direction: column;
  }

  .dashboard-grid,
  .metric-grid {
    grid-template-columns: 1fr;
  }

  .executive-hero,
  .helix-coo-header,
  .helix-coo-intro,
  .panel-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .helix-coo-grid {
    grid-template-columns: 1fr;
  }

  .executive-health {
    justify-items: start;
    text-align: left;
  }

  .admin-tabs {
    width: 100%;
  }

  .module-launcher,
  .executive-today-grid {
    grid-template-columns: 1fr;
  }

  .source-strip {
    justify-content: flex-start;
  }

  .tab-button {
    flex: 1;
    padding: 0 8px;
  }

  .panel-header.compact {
    align-items: stretch;
    flex-wrap: wrap;
  }

  .panel-header.compact .filter-select {
    max-width: 100%;
    min-width: 0;
  }

  .lead-filters {
    grid-template-columns: 1fr;
  }

  .source-status-list {
    grid-template-columns: 1fr;
  }

  .executive-funnel,
  .trend-selector {
    grid-template-columns: 1fr;
  }

  .activity-item {
    align-items: stretch;
    flex-direction: column;
  }

  .youtube-video-item,
  .external-list-item {
    grid-template-columns: 1fr;
  }

  .reconciliation-values {
    grid-template-columns: 1fr;
  }

  .youtube-video-item img,
  .external-list-item img,
  .youtube-thumb-placeholder {
    width: 100%;
  }

  .funnel-item {
    align-items: stretch;
    grid-template-columns: 1fr;
  }

  .detail-panel {
    border-left: 0;
    max-width: none;
    width: 100%;
  }

  .span-2 {
    grid-column: span 1;
  }
}

/* DASH-03 final cascade: the shell owns canvas, navigation and one-panel routing. */
.dashboard-view:not(.hidden) {
  display: grid;
  grid-template-columns: var(--sidebar-width) minmax(0, 1fr);
  min-height: 100vh;
}

.control-workspace .admin-header,
.control-workspace main {
  max-width: 1640px;
  padding-left: clamp(20px, 3vw, 44px);
  padding-right: clamp(20px, 3vw, 44px);
}

.control-workspace .admin-header {
  min-height: 82px;
  padding-bottom: 16px;
  padding-top: 16px;
}

.tab-panel,
.executive-home { display: none; }
.tab-panel.active:not(.executive-home) { display: block; }
.executive-home.active { display: grid; }
.attention-item p { line-height: 1.45; margin: 7px 0 5px; }
.attention-item small,
.attention-meta { color: var(--muted); font-size: 10px; }
.attention-meta { align-items: center; display: flex; font-family: "JetBrains Mono", Consolas, monospace; gap: 8px; }
.attention-action { border-left-color: var(--action) !important; }

@media (max-width: 820px) {
  .dashboard-view:not(.hidden) { display: block; }
  .executive-home.active { display: block; }
}
.validation-mode-control { display: inline-flex; align-items: center; gap: .45rem; font-size: .72rem; }
.validation-mode-control select { max-width: 13rem; }
.production-origin-label { position: sticky; top: .5rem; z-index: 20; color: #ffd166; border: 1px solid #ffd166; border-radius: 999px; padding: .45rem .7rem; background: #241d08; letter-spacing: .06em; font-size: .7rem; }
.production-admin-warning { position: sticky; top: .5rem; z-index: 21; color: #fff; border: 2px solid #fff; border-radius: .4rem; padding: .5rem .75rem; background: #9b1c1c; letter-spacing: .04em; font-size: .72rem; }
body.production-admin-mode .admin-header { border-bottom-color: #ef4444; }
body.production-admin-mode [data-youtube-operational-controls] { display: none !important; }
body.production-read-only-mode .admin-header { border-bottom-color: #ffd166; }
body.production-read-only-mode #tab-leads .lead-filters,
body.production-read-only-mode #tab-rsvp .lead-filters,
body.production-read-only-mode #rsvp-event-detail,
body.production-read-only-mode #tab-rsvp .rsvp-responses-panel,
body.production-read-only-mode [data-youtube-operational-controls] { display: none !important; }

/* DASH-04B: action-first operational Overview. */
.executive-home.active {
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
}
.executive-home > .attention-panel,
.executive-home > .executive-hero,
.executive-home > .executive-block { grid-column: 1 / -1 !important; }
.executive-hero { padding: 14px 18px; }
.executive-hero h2 { font-size: clamp(24px, 3vw, 36px); }
.attention-panel { margin-bottom: 0; padding: 13px 16px; }
.attention-list { margin-top: 8px; }
.executive-today-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.executive-today-grid .metric-card { min-height: 0; padding: 12px; }
.executive-today-grid .metric-value { font-size: clamp(20px, 2.2vw, 30px); }
.executive-today-grid .metric-hint { line-height: 1.25; }
.attention-item a,
.highlight-card a,
.attention-more { color: var(--cyan); display: inline-block; font-size: 11px; margin-top: 7px; }
.compact-empty { padding: 9px 11px; }
#tab-insights .panel-subsection { margin-top: 20px; }
.operations-panel { margin-bottom: 12px; }
.operations-table-wrap { overflow-x: auto; }
.operations-table { border-collapse: collapse; min-width: 980px; width: 100%; }
.operations-table th, .operations-table td { border-bottom: 1px solid var(--border); padding: 10px 8px; text-align: left; vertical-align: top; }
.operations-table th { color: var(--muted); font-size: 10px; letter-spacing: .06em; text-transform: uppercase; }
.operations-table td { font-size: 12px; }
.operations-status { border: 1px solid currentColor; border-radius: 999px; display: inline-block; font: 10px "JetBrains Mono", monospace; padding: 3px 7px; }
.operations-actions, .operations-history, .operations-debt { display: grid; gap: 8px; }
.operation-history-row { display: grid; gap: 8px; grid-template-columns: 1.2fr .8fr .8fr .8fr 1fr .6fr; padding: 9px 0; border-bottom: 1px solid var(--border); font-size: 11px; }

@media (max-width: 980px) {
  .executive-today-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 430px) {
  .executive-today-grid { grid-template-columns: 1fr; }
  .attention-panel .panel-header { align-items: flex-start; gap: 8px; }
}