:root {
  --bg: #f3f0e8;
  --surface: #fffaf0;
  --surface-strong: #ffffff;
  --ink: #211f1a;
  --muted: #706a5d;
  --line: #ded5c2;
  --accent: #d85032;
  --accent-dark: #96351f;
  --green: #2f8f64;
  --shadow: 0 18px 46px rgba(66, 50, 20, 0.14);
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  min-height: 100vh;
  background:
    radial-gradient(circle at 8% 12%, rgba(216, 80, 50, 0.14), transparent 26%),
    linear-gradient(135deg, #f6f0df 0%, #eef4ec 52%, #f7e8d4 100%);
  color: var(--ink);
  font-family:
    Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

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

button {
  border: 0;
  border-radius: 8px;
  background: var(--accent);
  color: white;
  padding: 10px 14px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 8px 18px rgba(216, 80, 50, 0.24);
}

button:hover {
  background: var(--accent-dark);
}

input,
select {
  width: 100%;
  min-height: 40px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-strong);
  color: var(--ink);
  padding: 8px 10px;
}

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

.checkbox-label {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}

.checkbox-label input[type="checkbox"] {
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  min-height: 18px;
  margin: 0;
  padding: 0;
}

code {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
}

.auth-page {
  display: grid;
  place-items: center;
}

.auth-shell {
  width: min(420px, calc(100% - 32px));
}

.auth-panel,
.builder-panel,
.report-panel {
  border: 1px solid rgba(94, 75, 40, 0.16);
  border-radius: 8px;
  background: rgba(255, 250, 240, 0.92);
  box-shadow: var(--shadow);
}

.auth-panel {
  padding: 32px;
}

.brand-mark {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border-radius: 8px;
  background: var(--ink);
  color: #ffd970;
  font-weight: 900;
  letter-spacing: 0;
}

.auth-panel h1,
.topbar h1,
.report-header h2,
.section-heading h2 {
  margin: 0;
  letter-spacing: 0;
}

.auth-panel h1 {
  margin-top: 18px;
  font-size: 28px;
}

.auth-panel p,
.muted {
  color: var(--muted);
}

.auth-form {
  display: grid;
  gap: 14px;
  margin-top: 24px;
}

.form-error {
  min-height: 20px;
  color: #b42318;
  font-weight: 700;
}

.topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 24px clamp(16px, 4vw, 40px) 12px;
}

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

.eyebrow {
  margin: 0 0 6px;
  color: var(--accent-dark);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.ghost-button {
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.5);
  color: var(--ink);
  box-shadow: none;
}

.ghost-button:hover {
  background: var(--surface-strong);
}

.top-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.nav-link {
  min-height: 40px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.5);
  color: var(--ink);
  padding: 9px 12px;
  font-weight: 900;
  text-decoration: none;
}

.nav-link:hover,
.nav-link.active {
  border-color: rgba(216, 80, 50, 0.38);
  background: #fff3df;
  color: var(--accent-dark);
}

.danger-button {
  color: #b42318;
}

.metrics-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  padding: 0 clamp(16px, 4vw, 40px) 4px;
}

.metric-item {
  min-width: 0;
  border: 1px solid rgba(94, 75, 40, 0.16);
  border-radius: 8px;
  background: rgba(255, 250, 240, 0.88);
  padding: 16px 18px;
  box-shadow: 0 10px 24px rgba(66, 50, 20, 0.1);
}

.metric-item strong {
  display: block;
  overflow-wrap: anywhere;
  font-size: clamp(26px, 4vw, 38px);
  line-height: 1;
}

.dashboard-layout {
  display: grid;
  grid-template-columns: minmax(340px, 440px) minmax(0, 1fr);
  gap: 18px;
  padding: 16px clamp(16px, 4vw, 40px) 36px;
}

.single-report-layout {
  grid-template-columns: 1fr;
}

.funnels-layout {
  grid-template-columns: minmax(0, 1fr);
}

.builder-panel,
.report-panel,
.top-filter-panel {
  overflow: hidden;
}

.user-group-controls {
  display: grid;
  grid-template-columns: minmax(430px, 2fr) minmax(160px, 1fr) minmax(160px, 1fr) auto;
  align-items: end;
  gap: 12px;
  margin: 16px clamp(16px, 4vw, 40px) 0;
  border: 1px solid rgba(94, 75, 40, 0.16);
  border-radius: 8px;
  background: rgba(255, 250, 240, 0.92);
  padding: 14px;
  box-shadow: var(--shadow);
}

.grouping-builder,
.grouping-fields {
  display: grid;
  gap: 8px;
}

.grouping-row {
  display: grid;
  grid-template-columns: 76px minmax(160px, 1fr) repeat(3, 30px);
  align-items: center;
  gap: 6px;
}

.grouping-keyword {
  color: var(--accent-dark);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.05em;
}

.grouping-row select {
  min-height: 34px;
  padding: 6px 8px;
}

.add-grouping-button {
  justify-self: start;
  min-height: 32px;
  padding: 6px 10px;
  color: var(--accent-dark);
}

.users-layout {
  padding-top: 16px;
}

.users-panel {
  min-height: 440px;
}

.users-table {
  min-width: 680px;
}

.share-cell {
  display: grid;
  grid-template-columns: 72px minmax(120px, 1fr);
  align-items: center;
  gap: 12px;
}

.share-track {
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: #eadfc9;
}

.share-track > span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--green);
}

.top-filter-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: end;
  gap: 10px;
  margin: 16px clamp(16px, 4vw, 40px) 0;
  border: 1px solid rgba(94, 75, 40, 0.16);
  border-radius: 8px;
  background: rgba(255, 250, 240, 0.92);
  padding: 10px 12px;
  box-shadow: var(--shadow);
}

.top-filter-panel .section-heading {
  display: none;
}

.panel-section {
  padding: 18px;
  border-bottom: 1px solid var(--line);
}

.panel-section:last-child {
  border-bottom: 0;
}

.section-heading,
.report-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.section-heading h2,
.section-heading h3,
.report-header h2 {
  margin: 0;
  font-size: 20px;
}

.steps-list {
  display: grid;
  gap: 10px;
  margin-top: 14px;
}

.step-item {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.62);
}

.step-number,
.step-badge {
  display: inline-grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border-radius: 7px;
  background: #2f3a2f;
  color: #ffe4a3;
  font-weight: 900;
}

.step-fields {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.step-actions {
  display: grid;
  grid-template-columns: repeat(3, 30px);
  gap: 6px;
}

.icon-button {
  width: 30px;
  height: 30px;
  padding: 0;
  border: 1px solid var(--line);
  background: var(--surface-strong);
  color: var(--ink);
  box-shadow: none;
}

.icon-button:hover {
  background: #f4e5ca;
}

.filters-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-top: 12px;
}

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

.top-filters-grid {
  grid-template-columns: repeat(6, minmax(130px, 1fr));
}

.events-filters-grid {
  grid-template-columns: repeat(5, minmax(130px, 1fr));
}

.filter-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 12px;
}

.top-filter-panel .filter-actions {
  margin-top: 0;
}

.top-filter-panel .filter-actions button {
  min-height: 34px;
  padding: 7px 10px;
  white-space: nowrap;
}

.active-filters {
  display: flex;
  min-width: 0;
  align-items: end;
  gap: 8px;
  overflow-x: auto;
  scrollbar-width: thin;
}

.modal-active-filters {
  margin-top: 12px;
}

.active-filter-item {
  flex: 0 0 180px;
  gap: 3px;
  font-size: 11px;
  line-height: 1.1;
}

.active-filter-control {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 30px;
  gap: 4px;
}

.active-filter-control input,
.active-filter-control select {
  min-height: 34px;
  padding: 6px 8px;
  font-size: 13px;
}

.add-filter-button {
  flex: 0 0 auto;
  font-size: 18px;
  font-weight: 900;
}

.page-size-field {
  min-width: 132px;
}

.page-size-field label {
  gap: 3px;
  font-size: 11px;
  line-height: 1.1;
}

.page-size-field select {
  min-height: 34px;
  padding: 6px 8px;
  font-size: 13px;
}

.compact-filters,
.top-filter-panel .filters-grid {
  display: flex;
  flex-wrap: nowrap;
  align-items: end;
  gap: 8px;
  margin-top: 0;
  overflow-x: auto;
  scrollbar-width: thin;
}

.compact-filters label,
.top-filter-panel label {
  flex: 0 0 132px;
  gap: 3px;
  font-size: 11px;
  line-height: 1.1;
}

.compact-filters input,
.compact-filters select,
.top-filter-panel input,
.top-filter-panel select {
  min-height: 34px;
  padding: 6px 8px;
  font-size: 13px;
}

.compact-filters label:first-child,
.compact-filters label:nth-child(2),
.top-filter-panel label:first-child,
.top-filter-panel label:nth-child(3) {
  flex-basis: 180px;
}

.primary-action {
  width: 100%;
  margin-top: 16px;
}

.preset-name-field {
  margin-top: 12px;
}

.preset-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 12px;
}

.preset-actions button {
  min-width: 0;
  padding-right: 10px;
  padding-left: 10px;
}

.branch-options { display: grid; gap: 8px; }
.branch-option { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; }
.branch-option span { display: grid; gap: 2px; }
.branch-option small { color: var(--muted); }
.branch-comparison { display: grid; gap: 16px; margin-top: 18px; }
.branch-card { padding: 16px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); }

button:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

.presets-list {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}

.reports-list {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding-bottom: 2px;
}

.preset-item {
  display: grid;
  gap: 3px;
  width: 100%;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.62);
  color: var(--ink);
  padding: 10px 12px;
  text-align: left;
  box-shadow: none;
}
.preset-list-item{display:grid;grid-template-columns:minmax(0,1fr) 34px;align-items:center;border:1px solid var(--line);border-radius:8px;background:rgba(255,255,255,.62);overflow:hidden}.preset-list-item .preset-item{border:0;border-radius:0;background:transparent}.preset-list-item:hover,.preset-list-item.selected{border-color:rgba(216,80,50,.38);background:#fff3df}.preset-favorite-button{display:grid;width:28px;height:28px;min-height:28px;place-items:center;border:0;border-radius:0;background:transparent;color:var(--muted);padding:0;box-shadow:none}.preset-favorite-button:hover{background:transparent;color:var(--accent)}.preset-favorite-button svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2}.preset-list-item.favorite .preset-favorite-button svg{fill:currentColor}.preset-list-item.favorite .preset-favorite-button{background:transparent;color:#c98213}

.reports-list .preset-item {
  flex: 0 0 168px;
  padding: 7px 9px;
  font-size: 13px;
  line-height: 1.15;
}

.reports-list .preset-item code {
  margin-top: 2px;
  font-size: 11px;
}

.preset-item:hover,
.preset-item.selected {
  border-color: rgba(216, 80, 50, 0.38);
  background: #fff3df;
}

.preset-item span {
  overflow-wrap: anywhere;
  font-weight: 900;
}

.report-panel {
  min-height: 620px;
  background: rgba(255, 255, 255, 0.78);
}

.funnel-report-panel {
  display: grid;
  grid-template-columns: minmax(220px, 280px) minmax(0, 1fr);
}

.funnel-report-content {
  min-width: 0;
  overflow: hidden;
}

.saved-reports-panel {
  display: flex;
  min-width: 0;
  align-items: stretch;
  flex-direction: column;
  gap: 10px;
  padding: 16px 14px;
  border-right: 1px solid var(--line);
  background: rgba(255, 250, 240, 0.68);
}

.report-version-actions {
  display: flex;
  gap: 8px;
}

.report-version-actions .icon-button {
  width: 36px;
  min-width: 36px;
  min-height: 36px;
  padding: 8px;
}

.report-version-actions .icon-button svg {
  width: 18px;
  height: 18px;
  fill: currentColor;
}

.saved-reports-panel .section-heading {
  align-items: flex-start;
  flex-direction: column;
  justify-content: flex-start;
  gap: 10px;
}

.saved-reports-panel .eyebrow {
  display: none;
}

.saved-reports-panel h2 {
  font-size: 17px;
}

.saved-reports-panel button {
  min-height: 32px;
  padding: 7px 10px;
  white-space: nowrap;
}

.saved-reports-panel .reports-list {
  min-width: 0;
  display: grid;
  align-content: start;
  overflow: visible;
  margin-top: 0;
}

.saved-reports-panel .reports-list .preset-item {
  width: 100%;
  flex-basis: auto;
}
.saved-reports-panel .reports-list .preset-list-item{width:100%}

.saved-reports-panel .empty-inline {
  padding: 9px 10px;
  font-size: 13px;
}

.events-panel {
  min-height: 700px;
}

.report-header {
  padding: 20px;
  border-bottom: 1px solid var(--line);
}

.summary-pill {
  max-width: 260px;
  border: 1px solid rgba(47, 143, 100, 0.28);
  border-radius: 999px;
  background: rgba(47, 143, 100, 0.09);
  color: var(--green);
  padding: 8px 12px;
  font-size: 13px;
  font-weight: 900;
  text-align: center;
}

.state-message,
.empty-inline {
  margin: 18px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  background: rgba(255, 250, 240, 0.75);
  color: var(--muted);
  padding: 18px;
  font-weight: 700;
}

.empty-inline {
  margin: 0;
}

.error-state {
  border-color: rgba(180, 35, 24, 0.32);
  background: rgba(255, 232, 229, 0.78);
  color: #b42318;
}

.table-wrap {
  overflow-x: auto;
}

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

.events-table {
  min-width: 1320px;
}

th,
td {
  border-bottom: 1px solid var(--line);
  padding: 14px 16px;
  text-align: left;
  vertical-align: middle;
}

th {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.sort-button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border-radius: 6px;
  background: transparent;
  color: inherit;
  padding: 4px 0;
  font-size: inherit;
  text-align: left;
  text-transform: uppercase;
  box-shadow: none;
}

.sort-button:hover,
.sort-button.active {
  background: transparent;
  color: var(--accent-dark);
}

td {
  font-weight: 800;
}

.events-table td {
  max-width: 260px;
  font-size: 13px;
  vertical-align: top;
}

.events-table code {
  overflow-wrap: anywhere;
}

.json-cell {
  max-width: 360px;
  max-height: 180px;
  overflow: auto;
  margin: 0;
  border: 1px solid rgba(94, 75, 40, 0.16);
  border-radius: 8px;
  background: rgba(255, 250, 240, 0.82);
  color: #2f3a2f;
  padding: 10px;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.45;
  white-space: pre-wrap;
}

.log-level {
  display: inline-flex;
  padding: 4px 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}

.log-level-crash { background: #fee2e2; color: #991b1b; }
.log-level-error { background: #ffedd5; color: #9a3412; }
.log-stack { min-width: 320px; max-width: 560px; max-height: 180px; }

.pagination-bar {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  padding: 14px 20px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-weight: 900;
}

.modal-open {
  overflow: hidden;
}

.modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 30;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(33, 31, 26, 0.34);
}

.modal-backdrop[hidden] {
  display: none;
}

.modal-panel {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  width: min(760px, 100%);
  max-height: min(860px, calc(100vh - 48px));
  border: 1px solid rgba(94, 75, 40, 0.2);
  border-radius: 8px;
  background: rgba(255, 250, 240, 0.98);
  box-shadow: 0 28px 76px rgba(33, 31, 26, 0.32);
  overflow: hidden;
}

.small-modal-backdrop {
  z-index: 40;
}

.small-modal-panel {
  width: min(420px, 100%);
  max-height: min(360px, calc(100vh - 48px));
}

.modal-header,
.modal-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 18px 20px;
  border-bottom: 1px solid var(--line);
}

.modal-header h2 {
  margin: 0;
  font-size: 24px;
}

.modal-body {
  overflow: auto;
}

.modal-body .panel-section {
  background: transparent;
}

.modal-footer {
  border-top: 1px solid var(--line);
  border-bottom: 0;
}

.modal-footer .primary-action {
  margin-top: 0;
}

@media (max-width: 980px) {
  .dashboard-layout {
    grid-template-columns: 1fr;
  }

  .metrics-strip {
    grid-template-columns: 1fr;
  }

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

  .user-group-controls {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .funnel-report-panel {
    grid-template-columns: minmax(0, 1fr);
  }

  .saved-reports-panel {
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .saved-reports-panel .reports-list {
    display: flex;
    overflow-x: auto;
  }

  .saved-reports-panel .reports-list .preset-item {
    width: auto;
    flex: 0 0 180px;
  }
}

@media (max-width: 640px) {
  .topbar {
    align-items: flex-start;
    flex-direction: column;
  }

  .top-actions {
    align-items: stretch;
    flex-wrap: wrap;
    width: 100%;
  }

  .top-actions .ghost-button,
  .nav-link {
    flex: 1 1 auto;
    text-align: center;
  }

  .filters-grid,
  .top-filters-grid,
  .events-filters-grid,
  .preset-actions,
  .step-item {
    grid-template-columns: 1fr;
  }

  .user-group-controls {
    grid-template-columns: 1fr;
  }

  .filter-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .top-filter-panel,
  .saved-reports-panel {
    grid-template-columns: 1fr;
  }

  .step-actions {
    grid-template-columns: repeat(3, 1fr);
  }

  .icon-button {
    width: 100%;
  }

  .section-heading,
  .report-header,
  .pagination-bar,
  .modal-header,
  .modal-footer {
    align-items: flex-start;
    flex-direction: column;
  }

  .saved-reports-panel {
    grid-template-columns: 1fr;
  }

  .saved-reports-panel .section-heading {
    align-items: center;
    flex-direction: row;
  }

  .saved-reports-panel .reports-list {
    width: 100%;
  }

  .reports-list .preset-item {
    flex-basis: 180px;
  }
}
.production-filter {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.65rem 0.85rem;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
  font-weight: 700;
}

.production-filter input {
  width: 1rem;
  height: 1rem;
  accent-color: var(--accent);
}

.report-tabs {
  display: flex;
  gap: 4px;
  padding: 12px 20px 0;
  overflow-x: auto;
  border-bottom: 1px solid var(--line);
}

.report-tab {
  flex: 0 0 auto;
  padding: 10px 14px;
  border: 0;
  border-bottom: 3px solid transparent;
  border-radius: 8px 8px 0 0;
  background: transparent;
  color: var(--muted);
  white-space: nowrap;
}

.report-tab:hover,
.report-tab.active {
  background: rgba(255, 250, 240, 0.75);
  color: var(--ink);
}

.report-tab.active {
  border-bottom-color: var(--accent);
}

.report-tab-panel[hidden] {
  display: none;
}

.report-tab-panel {
  min-width: 0;
}

.progression-report-content {
  min-width: 0;
  padding: 18px 20px 20px;
}

.progression-report-content .report-header {
  padding: 0;
}

.report-description,
.quality-note {
  color: var(--muted);
}

.report-table-section {
  margin-top: 22px;
  min-width: 0;
}

.report-table-section h3 {
  margin: 0 0 10px;
}

.teams-table-section table {
  min-width: 680px;
}

.progression-table-section table {
  min-width: 820px;
}

.quality-note {
  margin-top: 14px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 250, 240, 0.75);
  font-size: 0.88rem;
}

.entity-badge {
  display: inline-flex;
  border-radius: 999px;
  padding: 4px 9px;
  background: #e7efe1;
  color: var(--green);
  font-weight: 700;
}

.entity-badge--card {
  background: #fff0cf;
  color: var(--accent-dark);
}

.entity-badge--hero {
  background: #e4f3ea;
  color: #246a43;
}

.entity-badge--dice {
  background: #e6efff;
  color: #285da8;
}

.entity-badge--hero_dice {
  background: #eee8f7;
  color: #65468a;
}

@media (max-width: 640px) {
  .report-tabs {
    padding-inline: 12px;
  }

  .progression-report-content {
    padding: 14px 12px 16px;
  }

  .report-table-section {
    margin-top: 18px;
  }
}

.empty-cell {
  color: var(--muted);
  text-align: center;
}
.ab-form{display:grid;gap:14px;padding:20px}.ab-form textarea{width:100%;border:1px solid var(--line);border-radius:8px;padding:10px;background:#fff;color:var(--ink);font:13px ui-monospace,monospace}.field-error{min-height:16px;color:#b42318;font-size:12px}.form-actions,.card-actions{display:flex;gap:8px;flex-wrap:wrap}.branch-editor-list{display:grid;gap:12px;padding:20px}.branch-card{display:flex;justify-content:space-between;gap:18px;border:1px solid var(--line);border-radius:8px;background:var(--surface-strong);padding:18px}.branch-card h3{margin:8px 0 4px}.branch-card p{color:var(--muted);margin:0 0 8px}.branch-card strong{display:block;margin-top:8px}.status{border-radius:999px;padding:4px 9px;font-size:12px;font-weight:800}.status.on{background:#e7efe1;color:var(--green)}.status.off{background:#eeeae2;color:var(--muted)}.empty-state{text-align:center;padding:64px 20px;color:var(--muted)}@media(max-width:850px){.branch-card{flex-direction:column}}

.ab-config-layout{display:grid;grid-template-columns:1fr;gap:22px;max-width:1560px;margin:0 auto}.ab-config-workspace{display:grid;grid-template-columns:minmax(340px,.75fr) minmax(520px,1.25fr);gap:18px;align-items:start}.ab-testing-workspace{display:grid;grid-template-columns:minmax(520px,1.1fr) minmax(380px,.9fr);gap:18px;align-items:start}.preset-library-panel,.preset-editor-panel,.ab-test-builder,.ab-test-list-panel{min-width:0}.config-preset-grid,.variant-list,.test-variants{display:grid;gap:12px}.config-preset-grid{padding:14px 20px 20px}.config-preset-card,.variant-row,.editor-placeholder{border:1px solid var(--line);border-radius:8px;background:var(--surface-strong)}.config-preset-card{padding:13px 14px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:start;transition:border-color .15s ease,transform .15s ease}.config-preset-card:hover{border-color:rgba(216,80,50,.38);transform:translateY(-1px)}.config-preset-card h3{margin:7px 0 2px;font-size:15px}.config-preset-card code{display:block;max-width:100%;margin-top:7px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.config-preset-card .card-actions{flex-direction:row;flex-wrap:nowrap}.compact-config-list{max-height:620px;overflow:auto}.icon-form-actions{justify-content:flex-end}.preset-meta-fields{display:grid;grid-template-columns:minmax(0,1fr) minmax(190px,.55fr);gap:12px}.config-editor-shell{display:grid;gap:12px}.editor-placeholder{display:flex;align-items:center;gap:12px;padding:12px 14px;background:#f6f2e8}.editor-placeholder>div{display:grid;gap:3px}.editor-placeholder span{color:var(--muted);font-size:.85rem}.editor-placeholder-icon{display:grid;flex:0 0 42px;width:42px;height:42px;place-items:center;border-radius:8px;background:var(--ink);color:#ffd970!important;font:700 14px ui-monospace,monospace}.ab-form textarea[name=config]{min-height:300px;resize:vertical;line-height:1.55}.test-meta-fields{display:grid;grid-template-columns:minmax(220px,1.4fr) minmax(150px,.8fr) minmax(160px,.8fr);gap:12px}.variant-heading{display:flex;align-items:end;justify-content:space-between;gap:16px;border-top:1px solid var(--line);padding-top:16px}.variant-heading p{margin:4px 0 0;color:var(--muted);font-size:13px}.variant-row{padding:12px;display:grid;grid-template-columns:minmax(0,1fr) 110px auto;gap:12px;align-items:end}.variant-row label{gap:4px}.test-variants{margin-top:12px;grid-template-columns:repeat(auto-fit,minmax(160px,max-content))}.test-variants span{display:flex;gap:8px;align-items:center;padding:8px 10px;border-radius:8px;background:#f4f1eb}.ab-test-list-panel .branch-editor-list{max-height:620px;overflow:auto}.ab-test-list-panel .branch-card{align-items:flex-start}.top-actions{flex-wrap:wrap;justify-content:flex-end}.topbar{align-items:flex-start}@media(max-width:1100px){.ab-config-workspace,.ab-testing-workspace{grid-template-columns:1fr}.ab-test-list-panel .branch-editor-list,.compact-config-list{max-height:none}}@media(max-width:720px){.topbar{flex-direction:column}.top-actions{width:100%;justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap;padding-bottom:4px}.nav-link{white-space:nowrap}.preset-meta-fields,.test-meta-fields{grid-template-columns:1fr}.variant-row{grid-template-columns:minmax(0,1fr) 90px auto}.config-preset-card{grid-template-columns:1fr}.config-preset-card .card-actions{flex-direction:row}}

/* A/B pages use the same 20px panel rhythm as report headers and forms. */
.preset-editor-panel > .section-heading,
.ab-test-builder > .section-heading {
  padding: 20px;
  border-bottom: 1px solid var(--line);
}

.preset-library-panel,
.preset-editor-panel,
.ab-test-builder,
.ab-test-list-panel {
  min-height: 0;
}

.preset-library-panel > .report-description {
  margin: 0;
  padding: 16px 20px 0;
}

.ab-test-card{min-width:0}.ab-test-card-main{min-width:0;flex:1}.ab-test-card h3{max-width:100%;overflow-wrap:anywhere;word-break:break-word}.distribution-scale{display:flex;width:100%;height:14px;margin-top:14px;overflow:hidden;border-radius:999px;background:#e8e2d8;box-shadow:inset 0 0 0 1px rgba(66,50,20,.08)}.distribution-scale span{display:block;min-width:2px}.distribution-legend{display:grid;gap:7px;margin-top:10px}.distribution-item{display:grid;grid-template-columns:10px minmax(0,1fr) 26px auto auto;align-items:center;gap:8px;min-width:0}.distribution-item i{width:10px;height:10px;border-radius:50%}.distribution-item strong{min-width:0;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.distribution-item span{font-variant-numeric:tabular-nums;color:var(--ink);font-weight:800}.distribution-item code{color:var(--muted)}.inline-icon-button{display:grid;width:26px;height:26px;padding:0;place-items:center;border:0;background:transparent;color:var(--muted);font-size:16px}.inline-icon-button:hover{color:var(--accent);background:#f1ebe1}.ab-test-list-panel .branch-card>.card-actions{flex:0 0 auto}.test-card-actions{display:grid;grid-template-columns:repeat(2,38px)}.icon-action{display:grid;width:38px;height:38px;padding:0;place-items:center;font-size:18px;line-height:1}

@media (max-width: 720px) {
  .preset-editor-panel > .section-heading,
  .ab-test-builder > .section-heading,
  .ab-form,
  .branch-editor-list,
  .report-header {
    padding: 16px;
  }

  .config-preset-grid {
    padding: 12px 16px 16px;
  }

  .preset-library-panel > .report-description {
    padding: 14px 16px 0;
  }
  .ab-test-list-panel .branch-card>.card-actions{width:100%;flex-direction:row}
}
/* Settings */
.settings-shell{display:grid;grid-template-columns:minmax(0,1fr);align-items:start;gap:18px}.settings-tabs{display:flex;gap:6px;width:max-content;max-width:100%;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.48);padding:5px}.settings-tab{border:0;background:transparent;color:var(--muted);box-shadow:none;padding:9px 16px}.settings-tab:hover{background:rgba(255,255,255,.7);color:var(--ink)}.settings-tab.active{background:var(--ink);color:#fff;box-shadow:0 5px 12px rgba(34,37,38,.14)}.settings-tab-panel[hidden]{display:none}.settings-tab-panel{width:100%;min-width:0}.settings-ab-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(420px,.9fr);gap:18px;align-items:start}.settings-ab-left{display:grid;gap:18px;min-width:0}.settings-groups-card{min-width:0}

.settings-card {
  min-height: 0;
  overflow: hidden;
}
.event-names-card{grid-column:1/-1}.event-name-toolbar{display:grid;grid-template-columns:minmax(240px,1fr) minmax(200px,280px);gap:12px}.event-name-list{display:grid;border:1px solid var(--line);border-radius:12px;overflow:hidden}.event-name-row{display:grid;grid-template-columns:minmax(230px,.85fr) minmax(300px,1.15fr) auto;align-items:center;gap:18px;background:rgba(255,255,255,.45);padding:14px 16px}.event-name-row+.event-name-row{border-top:1px solid var(--line)}.event-name-row:hover{background:rgba(255,255,255,.72)}.event-name-meta{display:grid;gap:7px;min-width:0}.event-name-meta code{overflow-wrap:anywhere;font-size:12px}.event-name-status{width:max-content;border-radius:999px;background:rgba(100,108,120,.1);color:var(--muted);padding:3px 8px;font-size:11px;font-weight:700}.event-name-status.named{background:rgba(42,130,100,.12);color:#227354}.event-name-input{display:grid;gap:6px;min-width:0}.event-name-input span{color:var(--muted);font-size:12px}.event-name-input input{width:100%}.event-name-actions{display:flex;justify-content:flex-end;gap:8px}.event-name-actions button{white-space:nowrap}.event-name-pagination{display:flex;align-items:center;justify-content:space-between;gap:16px;color:var(--muted);font-size:13px}.event-name-pagination>div{display:flex;gap:8px}
.json-group-list{display:grid;gap:10px}.json-group-item{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:start;gap:12px;border:1px solid var(--line);border-radius:10px;background:rgba(255,255,255,.5);padding:14px}.json-group-item input{width:18px;min-height:18px;margin-top:2px}.json-group-meta{display:grid;gap:5px}.json-group-meta strong{overflow-wrap:anywhere}.json-group-paths{display:grid;gap:2px;color:var(--muted);font-size:12px}
.codex-recommendation{display:grid;gap:2px;border-left:3px solid var(--accent);padding-left:9px;color:var(--muted);font-size:13px}.codex-recommendation b{color:var(--ink)}

.settings-card-header,
.settings-card-body {
  padding: 20px;
}

.settings-card-header {
  border-bottom: 1px solid var(--line);
}

.settings-card-header h2 {
  margin: 0;
}

.settings-description {
  max-width: 720px;
  margin: 8px 0 0;
  color: var(--muted);
  line-height: 1.5;
}

.settings-card-body {
  display: grid;
  gap: 16px;
}

.settings-card-body label {
  gap: 8px;
}

.settings-source-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(180px, 0.6fr);
  gap: 12px;
}

.connection-state,
.settings-message {
  margin: 0;
}

.settings-actions {
  align-items: center;
  margin-top: 16px;
}

.button-link {
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  border-radius: 8px;
  background: var(--accent);
  color: white;
  padding: 10px 14px;
  font-weight: 700;
  text-decoration: none;
  box-shadow: 0 8px 18px rgba(216, 80, 50, 0.24);
}

.config-type-list {
  gap: 10px;
}

.config-type-card {
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.5);
  padding: 14px;
}

.config-type-card div {
  display: flex;
  justify-content: space-between;
  gap: 16px;
}

.config-type-card span,
.config-type-card small {
  color: var(--muted);
}

@media (max-width: 980px) {
  .settings-ab-layout{grid-template-columns:1fr}.settings-groups-card{grid-row:auto}
}

@media (max-width: 720px) {
  .settings-card-header,
  .settings-card-body {
    padding: 16px;
  }

  .settings-actions {
    align-items: stretch;
  }

  .settings-source-grid {
    grid-template-columns: 1fr;
  }
  .event-name-toolbar,.event-name-row{grid-template-columns:1fr}.event-name-actions{justify-content:flex-end}
  .settings-tabs{width:100%}.settings-tab{flex:1}
}
.schema-editor{display:grid;gap:16px;grid-column:1/-1}.schema-editor-header,.schema-section{border:1px solid var(--line);border-radius:12px;padding:16px;background:rgba(255,255,255,.45)}.schema-editor-header h3,.schema-section h3{margin:0}.schema-editor-header p,.schema-section>div>p{margin:6px 0 0;color:var(--muted)}.schema-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin-top:14px}.schema-columns-1{grid-template-columns:1fr}.schema-columns-2{grid-template-columns:repeat(2,minmax(0,1fr))}.schema-columns-3{grid-template-columns:repeat(3,minmax(0,1fr))}.schema-field{margin:0}.schema-field-wide,.schema-group{grid-column:1/-1}.schema-field small,.schema-group small{display:block;color:var(--muted);font-weight:400;margin-top:5px}.schema-group{border:1px solid var(--line);border-radius:10px;padding:0;min-width:0;overflow:hidden}.schema-group>summary,.schema-array-item>summary{display:flex;align-items:center;gap:10px;padding:12px;cursor:pointer;font-weight:700;background:rgba(255,255,255,.55)}.schema-group>summary::marker,.schema-array-item>summary::marker{color:var(--accent)}.schema-node-kind{margin-left:auto;color:var(--muted);font-size:11px;font-weight:700}.schema-group-body{padding:0 12px 12px}.schema-array-items{display:grid;gap:10px;margin:10px 0}.schema-array-item{border:1px solid var(--line);border-radius:9px;padding:0;background:var(--surface);overflow:hidden}.schema-array-item>summary{padding:10px 12px}.schema-array-head{display:flex;justify-content:flex-end;align-items:center;gap:10px;padding:10px 12px 0}.schema-array-item>.schema-group{margin:10px 12px 12px}.schema-array-item>.schema-field{margin:10px 12px 12px}.ab-form details{border:1px solid var(--line);border-radius:10px;grid-column:1/-1}.ab-form>details{padding:12px}.ab-form summary{cursor:pointer;font-weight:700}@media(max-width:720px){.schema-columns-2,.schema-columns-3{grid-template-columns:1fr}.schema-editor-header,.schema-section{padding:12px}}
.schema-group>summary,.schema-array-item>summary{list-style:none}.schema-group>summary::-webkit-details-marker,.schema-array-item>summary::-webkit-details-marker{display:none}.schema-group>summary::before,.schema-array-item>summary::before{content:"›";color:var(--accent);font-size:18px;line-height:1;transition:transform .15s ease}.schema-group[open]>summary::before,.schema-array-item[open]>summary::before{transform:rotate(90deg)}
.schema-presentation-table .schema-grid{grid-template-columns:1fr}.schema-presentation-table .schema-field{display:grid;grid-template-columns:minmax(180px,.8fr) minmax(220px,1.2fr);align-items:center;border-bottom:1px solid var(--line);padding:8px 0}.schema-presentation-table .schema-field small{grid-column:1/-1}.schema-presentation-values .schema-field{border:1px solid var(--line);border-radius:9px;background:rgba(255,255,255,.55);padding:12px}@media(max-width:720px){.schema-presentation-table .schema-field{grid-template-columns:1fr}}
.config-proposal-card{grid-template-rows:auto minmax(0,1fr);width:min(1120px,calc(100vw - 40px));max-height:calc(100vh - 48px);border-radius:16px;background:#fbf8f1;overflow:hidden}.config-proposal-header{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;padding:24px 28px 22px;border-bottom:1px solid var(--line);background:linear-gradient(135deg,#fffaf0 0%,#f3f5ec 100%)}.config-proposal-header .eyebrow{margin:0 0 6px}.config-proposal-header h2{margin:0;font-size:26px;line-height:1.15}.config-proposal-header .report-description{margin:7px 0 0}.config-proposal-close{flex:0 0 38px;width:38px;height:38px;border-radius:50%}.config-proposal-view{display:grid;grid-template-rows:minmax(0,1fr) auto;min-height:0}.config-proposal-card>.config-proposal-view[hidden]{display:none}.config-proposal-body{min-height:0;overflow:auto;padding:28px}.config-proposal-prompt-field{display:grid;gap:10px;color:var(--ink);font-size:14px;font-weight:800}.config-proposal-prompt-field>span{font-size:16px}.config-proposal-prompt-field small{color:var(--muted);font-size:12px;font-weight:500;line-height:1.5}.config-proposal-card textarea{width:100%;min-height:180px;resize:vertical;border:1px solid rgba(94,75,40,.25);border-radius:12px;background:#fff;padding:16px;font:14px/1.6 inherit;box-shadow:inset 0 1px 2px rgba(33,31,26,.04)}.config-proposal-card textarea:focus{border-color:var(--accent);outline:3px solid rgba(216,80,50,.12)}.config-proposal-message{min-height:20px;margin:10px 0 0}.config-proposal-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;padding:18px 28px;border-top:1px solid var(--line);background:rgba(255,255,255,.72)}.config-proposal-actions button{min-width:150px}.config-proposal-result-body{display:grid;gap:22px}.config-proposal-reasoning{border:1px solid rgba(216,80,50,.18);border-left:4px solid var(--accent);border-radius:10px;background:rgba(216,80,50,.055);padding:16px 18px}.config-proposal-reasoning strong{font-size:14px}.config-proposal-reasoning p{margin:6px 0 0;color:var(--muted);line-height:1.55}.config-proposal-comparison{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.config-proposal-side{min-width:0;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.62);padding:16px}.config-proposal-side h3{margin:0 0 12px;font-size:15px}.config-change-table{display:grid;border:1px solid var(--line);border-radius:10px;overflow:hidden}.config-change-row{display:grid;grid-template-columns:minmax(130px,.8fr) minmax(0,1.2fr);gap:12px;padding:10px 12px;background:rgba(255,255,255,.55)}.config-change-row+.config-change-row{border-top:1px solid var(--line)}.config-change-row span{color:var(--muted);font-size:12px}.config-change-row strong{overflow-wrap:anywhere;white-space:pre-wrap}.config-change-row.changed{background:#fff0c9;box-shadow:inset 3px 0 #d39b31}@media(max-width:760px){.modal-backdrop{padding:12px}.config-proposal-card{width:100%;max-height:calc(100vh - 24px);border-radius:12px}.config-proposal-header{padding:20px}.config-proposal-header h2{font-size:22px}.config-proposal-body{padding:20px}.config-proposal-actions{padding:14px 20px;flex-direction:column-reverse}.config-proposal-actions button{width:100%}.config-proposal-comparison{grid-template-columns:1fr}.config-change-row{grid-template-columns:1fr}}
.device-filter-panel{display:grid;grid-template-columns:repeat(5,minmax(150px,1fr));gap:12px;padding:16px 28px;border-bottom:1px solid var(--line);background:rgba(255,255,255,.4)}.device-filter-panel label,.device-view-controls label{display:grid;gap:6px;color:var(--muted);font-size:12px;font-weight:800}.device-filter-actions{display:flex;align-items:flex-end;gap:8px}.device-filter-actions button{flex:1}.device-report-layout{padding-top:20px}.device-report-header{align-items:flex-end}.device-view-controls{display:flex;align-items:flex-end;gap:12px}.device-summary{padding:10px 20px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:rgba(255,255,255,.38);color:var(--muted);font-size:13px;font-weight:800}.device-users-table{min-width:1380px}.device-users-table code{font-size:11px;white-space:nowrap}.device-groups{display:grid;gap:20px;padding:20px}.device-group-card{overflow:hidden;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.35)}.device-group-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 16px;border-bottom:1px solid var(--line)}.device-group-heading h3{margin:2px 0 0}.device-group-heading .eyebrow{margin:0}.device-group-card .table-wrap{border:0;border-radius:0}.device-group-card .users-table{margin:0}@media(max-width:1050px){.device-filter-panel{grid-template-columns:repeat(3,minmax(150px,1fr))}}@media(max-width:720px){.device-filter-panel{grid-template-columns:1fr;padding:14px 18px}.device-filter-actions,.device-view-controls,.device-group-heading{align-items:stretch;flex-direction:column}.device-view-controls{width:100%}}
.funnel-event-count{font-size:15px;font-variant-numeric:tabular-nums}
.json-config-field{grid-column:1/-1}.json-config-field textarea{width:100%;font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace;font-size:12px;line-height:1.55;tab-size:2;white-space:pre}.config-json-file{max-height:560px;margin:0;overflow:auto;border:1px solid var(--line);border-radius:10px;background:#262a2d;color:#eef1f2;padding:12px 0;font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace;font-size:12px;line-height:1.55;tab-size:2}.config-json-file span{display:block;min-height:1.55em;padding:0 14px;white-space:pre}.config-json-file span.changed{background:rgba(255,198,72,.2);box-shadow:inset 3px 0 #e2a72e}
.config-diff-file{height:min(560px,52vh);overflow:auto;border:1px solid #3b4043;border-radius:9px;background:#202326;color:#e8ebed;font:12px/20px "SFMono-Regular",Consolas,"Liberation Mono",monospace;tab-size:2;scrollbar-color:#686e72 #292d30}.config-diff-line{display:grid;grid-template-columns:48px max-content;min-width:100%;height:20px}.config-diff-line>i{position:sticky;left:0;z-index:1;border-right:1px solid #3b4043;background:#292d30;color:#7f878c;padding:0 9px;text-align:right;font-style:normal;user-select:none}.config-diff-line>code{display:block;min-width:100%;height:20px;margin:0;padding:0 12px;color:inherit;font:inherit;white-space:pre}.config-diff-file[data-diff-side="before"] .config-diff-line.changed{background:rgba(166,62,62,.28)}.config-diff-file[data-diff-side="after"] .config-diff-line.changed{background:rgba(54,132,83,.25)}.config-diff-file[data-diff-side="before"] .config-diff-line.changed>i{background:#593234;color:#dda3a3}.config-diff-file[data-diff-side="after"] .config-diff-line.changed>i{background:#294a36;color:#9ed0ae}.config-diff-line.empty{background:repeating-linear-gradient(-45deg,rgba(255,255,255,.018),rgba(255,255,255,.018) 4px,transparent 4px,transparent 8px)}.config-diff-line.empty>code{opacity:.25}.config-diff-line.equal:hover{background:rgba(255,255,255,.035)}
.config-statuses{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.status.unverified{background:#fff0c9;color:#8a5a00}.verify-config-button{padding:8px 11px;white-space:nowrap;font-size:12px}