:root {
  color-scheme: light;
  font-family: "Aptos", "IBM Plex Sans KR", "IBM Plex Sans", "Helvetica Neue", sans-serif;
  background: #f8fafc;
  color: #18213a;
  text-rendering: geometricPrecision;
  font-synthesis: none;
  --ink: #07100f;
  --panel: rgba(6, 13, 13, 0.42);
  --panel-strong: rgba(6, 13, 13, 0.58);
  --line: rgba(237, 244, 231, 0.13);
  --text: #f6f1e6;
  --muted: rgba(246, 241, 230, 0.62);
  --soft: rgba(246, 241, 230, 0.08);
  --accent: #78d6b4;
}

* {
  box-sizing: border-box;
}

html,
body,
#root {
  width: 100%;
  min-width: 0;
  min-height: 100%;
  margin: 0;
}

body {
  overflow-x: hidden;
}

button,
a {
  font: inherit;
  -webkit-tap-highlight-color: transparent;
}

button {
  cursor: pointer;
}
.silicon-shell {
  min-height: 100vh;
  display: grid;
  grid-template-columns: minmax(340px, 420px) minmax(0, 1fr);
  background:
    radial-gradient(circle at 70% 8%, rgba(127, 156, 255, 0.14), transparent 34%),
    radial-gradient(circle at 20% 78%, rgba(217, 162, 79, 0.1), transparent 28%),
    linear-gradient(135deg, #101017 0%, #171722 48%, #14151d 100%);
  color: #f6f1e6;
}

.silicon-shell.setup-only {
  display: block;
}

.silicon-shell.setup-only .silicon-config {
  position: relative;
  height: auto;
  max-width: 1320px;
  margin: 0 auto;
  border-right: 0;
  background: transparent;
}

.silicon-setup-grid {
  display: block;
}

.silicon-shell.setup-only .silicon-setup-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  align-items: start;
}

.silicon-shell.setup-only .silicon-card {
  margin-top: 0;
}

.silicon-shell.setup-only .silicon-hero {
  margin-bottom: 12px;
}

.silicon-shell.setup-only .location-card,
.silicon-shell.setup-only .persona-card,
.silicon-shell.setup-only .nemotron-card,
.silicon-shell.setup-only .question-card {
  grid-column: span 3;
}

.silicon-config {
  position: sticky;
  top: 0;
  height: 100vh;
  overflow: auto;
  border-right: 1px solid rgba(246, 241, 230, 0.11);
  padding: 18px;
  background: rgba(13, 13, 20, 0.66);
}

.silicon-hero,
.silicon-card,
.silicon-result-head,
.silicon-summary-panel,
.silicon-chart-card,
.silicon-open-panel {
  border: 1px solid rgba(246, 241, 230, 0.12);
  border-radius: 18px;
  background: rgba(246, 241, 230, 0.055);
  box-shadow: 0 20px 70px rgba(0, 0, 0, 0.22);
  backdrop-filter: blur(18px) saturate(1.1);
}

.silicon-hero {
  padding: 16px;
}

.silicon-brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #f6f1e6;
  text-decoration: none;
}

.silicon-brand span {
  width: 34px;
  height: 34px;
  border: 1px solid rgba(246, 241, 230, 0.22);
  border-radius: 10px;
  background:
    linear-gradient(90deg, transparent 45%, rgba(246, 241, 230, .5) 46%, rgba(246, 241, 230, .5) 54%, transparent 55%),
    linear-gradient(0deg, transparent 45%, rgba(246, 241, 230, .5) 46%, rgba(246, 241, 230, .5) 54%, transparent 55%),
    linear-gradient(135deg, #7f9cff, #d9a24f);
}

.silicon-hero h1 {
  margin: 18px 0 8px;
  font-size: clamp(30px, 4vw, 48px);
  line-height: 0.96;
  letter-spacing: 0;
}

.silicon-hero p {
  margin: 0;
  color: rgba(246, 241, 230, 0.66);
  line-height: 1.45;
}

.silicon-actions,
.sample-presets,
.custom-kind,
.result-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.silicon-actions {
  margin-top: 16px;
}

.silicon-actions button,
.sample-presets button,
.custom-kind button,
.custom-question > button {
  min-height: 38px;
  border: 1px solid rgba(246, 241, 230, 0.13);
  border-radius: 999px;
  padding: 8px 12px;
  background: rgba(246, 241, 230, 0.08);
  color: #f6f1e6;
  font-weight: 850;
}

.silicon-actions .primary,
.sample-presets button.active,
.custom-kind button.active {
  border-color: rgba(127, 156, 255, 0.68);
  background: rgba(127, 156, 255, 0.2);
}

.silicon-actions button:disabled {
  cursor: not-allowed;
  opacity: 0.52;
}

.silicon-run-chip {
  margin-top: 12px;
  border: 1px solid rgba(246, 241, 230, 0.11);
  border-radius: 12px;
  padding: 9px 10px;
  background: rgba(246, 241, 230, 0.05);
  color: rgba(246, 241, 230, 0.68);
  font-size: 12px;
  line-height: 1.35;
}

.silicon-run-chip.running {
  border-color: rgba(217, 162, 79, 0.5);
  background: rgba(217, 162, 79, 0.12);
  color: rgba(246, 241, 230, 0.86);
}

.silicon-card {
  margin-top: 12px;
  padding: 14px;
}

.default-ratio-box {
  display: grid;
  gap: 8px;
  margin-top: 12px;
  border-top: 1px solid rgba(246, 241, 230, 0.09);
  padding-top: 12px;
}

.default-ratio-box button {
  min-height: 38px;
  border: 1px solid rgba(217, 162, 79, 0.42);
  border-radius: 999px;
  padding: 8px 12px;
  background: rgba(217, 162, 79, 0.13);
  color: #f6f1e6;
  font-weight: 850;
}

.default-ratio-box span {
  color: rgba(246, 241, 230, 0.62);
  font-size: 12px;
  line-height: 1.4;
}

.silicon-section-head,
.silicon-summary-panel header {
  display: flex;
  align-items: center;
  gap: 10px;
}

.question-card .silicon-section-head {
  justify-content: space-between;
}

.silicon-section-head span,
.toggle-head span,
.silicon-result-head span,
.silicon-summary-panel header span,
.silicon-chart-card header span,
.silicon-open-panel header span {
  display: block;
  color: rgba(246, 241, 230, 0.56);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.silicon-section-head strong,
.toggle-head strong,
.silicon-summary-panel header strong,
.silicon-chart-card header strong,
.silicon-open-panel header strong {
  display: block;
  margin-top: 2px;
  font-size: 16px;
}

.sample-presets {
  margin-top: 12px;
}

.number-field,
.custom-question label {
  display: grid;
  gap: 6px;
  margin-top: 12px;
}

.number-field span,
.custom-question label span {
  color: rgba(246, 241, 230, 0.58);
  font-size: 11px;
  font-weight: 800;
}

.number-field input,
.toggle-chip input,
.custom-question input,
.custom-kind select {
  min-width: 0;
  border: 1px solid rgba(246, 241, 230, 0.13);
  border-radius: 10px;
  background: rgba(5, 12, 12, 0.62);
  color: #f6f1e6;
  padding: 9px 10px;
  outline: none;
}

.number-field input:focus,
.toggle-chip input:focus,
.custom-question input:focus,
.custom-kind select:focus {
  border-color: rgba(127, 156, 255, 0.68);
}

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

.toggle-head em {
  border: 1px solid rgba(246, 241, 230, 0.12);
  border-radius: 999px;
  padding: 5px 8px;
  color: rgba(246, 241, 230, 0.64);
  font-size: 11px;
  font-style: normal;
  font-weight: 850;
}

.toggle-head em.warn {
  border-color: rgba(217, 162, 79, 0.42);
  color: rgba(246, 241, 230, 0.78);
}

.toggle-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 12px;
}

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

.toggle-chip {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 54px;
  gap: 6px;
  align-items: center;
  border: 1px solid rgba(246, 241, 230, 0.1);
  border-radius: 12px;
  padding: 6px;
  background: rgba(246, 241, 230, 0.045);
}

.toggle-chip.active {
  border-color: rgba(127, 156, 255, 0.5);
  background: rgba(127, 156, 255, 0.13);
}

.toggle-chip button {
  min-height: 34px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: #f6f1e6;
  font-weight: 850;
  text-align: left;
}

.toggle-chip input {
  height: 34px;
  padding: 6px;
  text-align: center;
}

.toggle-chip input:disabled {
  opacity: 0.34;
}

.estimate-count {
  grid-column: 1 / -1;
  min-height: 14px;
  color: rgba(246, 241, 230, 0.56);
  font-size: 11px;
  font-weight: 780;
}

.question-bank {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}

.question-bank button {
  display: grid;
  gap: 4px;
  border: 1px solid rgba(246, 241, 230, 0.1);
  border-radius: 12px;
  background: rgba(246, 241, 230, 0.045);
  color: #f6f1e6;
  padding: 10px;
  text-align: left;
}

.question-bank button.selected {
  border-color: rgba(127, 156, 255, 0.56);
  background: rgba(127, 156, 255, 0.14);
}

.question-bank button.kind-likert {
  border-left: 4px solid rgba(127, 156, 255, 0.8);
}

.question-bank button.kind-open {
  border-left: 4px solid rgba(217, 162, 79, 0.86);
}

.question-bank span,
.question-bank em {
  color: rgba(246, 241, 230, 0.58);
  font-size: 11px;
  font-style: normal;
}

.question-bank strong {
  line-height: 1.3;
}

.custom-question {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  margin-top: 14px;
  border-top: 1px solid rgba(246, 241, 230, 0.1);
  padding-top: 12px;
}

.custom-kind {
  grid-column: 1 / -1;
}

.question-bank-toggle {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-left: auto;
  border: 1px solid rgba(84, 96, 137, 0.16);
  border-radius: 999px;
  padding: 7px 10px;
  background: #f5f7fc;
  color: #273047;
  font-size: 12px;
  font-weight: 850;
}

.question-bank-toggle svg {
  transition: transform 0.16s ease;
}

.question-bank-toggle.open svg {
  transform: rotate(180deg);
}

.silicon-results {
  min-width: 0;
  padding: 18px;
}

.silicon-result-head {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: center;
  padding: 14px 16px;
}

.silicon-result-head h2 {
  margin: 2px 0 0;
  font-size: clamp(28px, 4vw, 58px);
  line-height: 0.96;
}

.result-stats span {
  border: 1px solid rgba(246, 241, 230, 0.12);
  border-radius: 999px;
  padding: 7px 10px;
  background: rgba(246, 241, 230, 0.06);
  color: rgba(246, 241, 230, 0.68);
  font-size: 12px;
  font-weight: 800;
}

.result-stats strong {
  color: #f6f1e6;
}

.silicon-summary-panel,
.silicon-chart-card,
.silicon-open-panel {
  padding: 14px;
}

.silicon-open-panel header,
.silicon-chart-card header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.method-note {
  border: 1px solid rgba(246, 241, 230, 0.1);
  border-radius: 999px;
  padding: 7px 9px;
  background: rgba(246, 241, 230, 0.055);
}

.silicon-summary-panel {
  display: grid;
  align-content: start;
  gap: 10px;
  margin-top: 12px;
}

.silicon-metric {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid rgba(246, 241, 230, 0.09);
  padding: 10px 0;
}

.silicon-metric span {
  color: rgba(246, 241, 230, 0.6);
  font-size: 12px;
  font-weight: 780;
}

.silicon-metric strong {
  font-size: 19px;
}

.method-note {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  border-radius: 13px;
  color: rgba(246, 241, 230, 0.68);
  font-size: 12px;
  line-height: 1.45;
}

.silicon-chart-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-top: 12px;
}

.silicon-chart-grid.single {
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.65fr);
}

.silicon-chart-card {
  min-width: 0;
}

.silicon-chart-card.wide,
.silicon-open-panel {
  grid-column: span 2;
}

.silicon-chart {
  height: 260px;
  margin-top: 10px;
}

.silicon-open-panel {
  min-width: 0;
}

.silicon-answer-list {
  display: grid;
  gap: 8px;
  max-height: 324px;
  overflow: auto;
  margin-top: 10px;
}

.silicon-answer-list article {
  display: grid;
  gap: 5px;
  border: 1px solid rgba(246, 241, 230, 0.1);
  border-radius: 12px;
  padding: 10px;
  background: rgba(246, 241, 230, 0.045);
}

.silicon-answer-list span {
  color: rgba(246, 241, 230, 0.55);
  font-size: 11px;
  font-weight: 780;
}

.silicon-answer-list p {
  margin: 0;
  color: rgba(246, 241, 230, 0.84);
  font-size: 13px;
  line-height: 1.45;
}

.silicon-answer-list article strong {
  width: fit-content;
  border-radius: 999px;
  padding: 4px 7px;
  background: rgba(127, 156, 255, 0.16);
  color: #b7c4ff;
  font-size: 11px;
}

.location-tabs,
.result-mode-buttons,
.metric-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.location-tabs button,
.result-mode-buttons button,
.metric-tabs button {
  min-height: 34px;
  border: 1px solid rgba(246, 241, 230, 0.12);
  border-radius: 999px;
  padding: 7px 10px;
  background: rgba(246, 241, 230, 0.06);
  color: #f6f1e6;
  font-size: 12px;
  font-weight: 850;
}

.location-tabs button.active,
.result-mode-buttons button.active,
.metric-tabs button.active {
  border-color: rgba(127, 156, 255, 0.58);
  background: rgba(127, 156, 255, 0.16);
}

.location-toggle-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  max-height: 320px;
  overflow: auto;
  margin-top: 10px;
  padding-right: 4px;
}

.location-detail-panel {
  margin-top: 12px;
  border-top: 1px solid rgba(246, 241, 230, 0.09);
  padding-top: 12px;
}

.location-detail-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.location-detail-tabs button,
.nemotron-actions button,
.nemotron-column-grid button {
  border: 1px solid rgba(246, 241, 230, 0.12);
  border-radius: 999px;
  background: rgba(246, 241, 230, 0.055);
  color: #f6f1e6;
  font-size: 12px;
  font-weight: 820;
}

.location-detail-tabs button {
  min-height: 30px;
  padding: 6px 10px;
}

.location-detail-tabs button.active,
.nemotron-column-grid button.active {
  border-color: rgba(127, 156, 255, 0.58);
  background: rgba(127, 156, 255, 0.16);
}

.detail-grid {
  max-height: 220px;
}

.selector-empty-note {
  margin: 12px 0 0;
  border: 1px dashed rgba(246, 241, 230, 0.16);
  border-radius: 14px;
  padding: 14px;
  color: #a8a3b8;
  background: rgba(246, 241, 230, 0.035);
  font-size: 12px;
  font-weight: 760;
}

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

.nemotron-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.nemotron-actions button {
  min-height: 32px;
  padding: 6px 10px;
}

.nemotron-column-section {
  margin-top: 12px;
}

.nemotron-column-section > span {
  display: block;
  margin-bottom: 8px;
  color: rgba(246, 241, 230, 0.58);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.nemotron-column-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.nemotron-column-grid button {
  min-height: 32px;
  padding: 6px 10px;
  color: rgba(246, 241, 230, 0.74);
}

.silicon-shell.has-results .location-toggle-grid,
.silicon-shell.has-results .persona-toggle-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  max-height: 240px;
}

.silicon-state-panel {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 12px;
  border: 1px solid rgba(246, 241, 230, 0.12);
  border-radius: 18px;
  padding: 18px;
  background: rgba(246, 241, 230, 0.055);
}

.silicon-state-panel span,
.explorer-toolbar span,
.question-tabs span,
.metric-card-item span {
  display: block;
  color: rgba(246, 241, 230, 0.56);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.silicon-state-panel strong {
  display: block;
  margin-top: 2px;
  font-size: 18px;
}

.silicon-state-panel p {
  margin: 6px 0 0;
  color: rgba(246, 241, 230, 0.62);
  font-size: 13px;
  line-height: 1.45;
}

.silicon-spinner {
  width: 34px;
  height: 34px;
  flex: 0 0 auto;
  border: 3px solid rgba(246, 241, 230, 0.16);
  border-top-color: #d9a24f;
  border-radius: 999px;
  animation: silicon-spin 0.9s linear infinite;
}

@keyframes silicon-spin {
  to {
    transform: rotate(360deg);
  }
}

.silicon-explorer {
  margin-top: 12px;
}

.explorer-toolbar {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  border: 1px solid rgba(246, 241, 230, 0.12);
  border-radius: 18px;
  padding: 14px;
  background: rgba(246, 241, 230, 0.055);
}

.explorer-toolbar strong {
  display: block;
  margin-top: 3px;
  font-size: 17px;
}

.question-tabs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-top: 12px;
}

.question-tabs button {
  display: grid;
  gap: 5px;
  min-height: 84px;
  border: 1px solid rgba(246, 241, 230, 0.1);
  border-radius: 14px;
  padding: 10px;
  background: rgba(246, 241, 230, 0.045);
  color: #f6f1e6;
  text-align: left;
}

.question-tabs button.kind-likert {
  border-top: 3px solid rgba(127, 156, 255, 0.82);
}

.question-tabs button.kind-open {
  border-top: 3px solid rgba(217, 162, 79, 0.9);
}

.question-tabs button.active {
  border-color: rgba(246, 241, 230, 0.22);
  background: rgba(246, 241, 230, 0.09);
}

.question-tabs strong {
  line-height: 1.28;
}

.metric-card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}

.metric-card-item {
  border: 1px solid rgba(246, 241, 230, 0.1);
  border-radius: 14px;
  padding: 12px;
  background: rgba(246, 241, 230, 0.045);
}

.metric-card-item strong {
  display: block;
  margin-top: 8px;
  font-size: 24px;
}

/* Silicon Sampling: light research-dashboard theme */
.silicon-shell {
  background:
    linear-gradient(180deg, rgba(247, 249, 255, 0.94), rgba(255, 255, 255, 0.98)),
    #f8fafc;
  color: #18213a;
}

.silicon-config {
  border-right-color: rgba(84, 96, 137, 0.16);
  background: rgba(248, 250, 252, 0.86);
}

.silicon-hero,
.silicon-card,
.silicon-result-head,
.silicon-summary-panel,
.silicon-chart-card,
.silicon-open-panel,
.explorer-toolbar,
.silicon-response-table-card,
.silicon-state-panel {
  border-color: rgba(84, 96, 137, 0.14);
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 18px 48px rgba(39, 55, 96, 0.1);
  backdrop-filter: blur(18px) saturate(1.08);
}

.silicon-brand {
  color: #18213a;
}

.silicon-brand span {
  border-color: rgba(91, 110, 225, 0.24);
  background:
    linear-gradient(90deg, transparent 45%, rgba(255, 255, 255, .82) 46%, rgba(255, 255, 255, .82) 54%, transparent 55%),
    linear-gradient(0deg, transparent 45%, rgba(255, 255, 255, .82) 46%, rgba(255, 255, 255, .82) 54%, transparent 55%),
    linear-gradient(135deg, #5b6ee1, #f08a6c);
}

.silicon-hero p,
.default-ratio-box span,
.silicon-run-chip,
.silicon-metric span,
.method-note,
.silicon-state-panel p,
.estimate-count,
.question-bank span,
.question-bank em,
.number-field span,
.custom-question label span,
.nemotron-column-section > span,
.silicon-section-head span,
.toggle-head span,
.silicon-result-head span,
.silicon-summary-panel header span,
.silicon-chart-card header span,
.silicon-open-panel header span,
.silicon-state-panel span,
.explorer-toolbar span,
.question-tabs span,
.metric-card-item span {
  color: rgba(24, 33, 58, 0.58);
}

.silicon-section-head strong,
.toggle-head strong,
.silicon-summary-panel header strong,
.silicon-chart-card header strong,
.silicon-open-panel header strong,
.silicon-state-panel strong,
.explorer-toolbar strong,
.question-tabs strong,
.metric-card-item strong,
.silicon-metric strong {
  color: #18213a;
}

.silicon-actions button,
.sample-presets button,
.custom-kind button,
.custom-question > button,
.default-ratio-box button,
.location-tabs button,
.result-mode-buttons button,
.metric-tabs button,
.location-detail-tabs button,
.nemotron-actions button,
.nemotron-column-grid button {
  border-color: rgba(84, 96, 137, 0.16);
  background: #f5f7fc;
  color: #273047;
}

.silicon-actions .primary,
.sample-presets button.active,
.custom-kind button.active,
.location-tabs button.active,
.result-mode-buttons button.active,
.metric-tabs button.active,
.location-detail-tabs button.active,
.nemotron-column-grid button.active {
  border-color: rgba(91, 110, 225, 0.44);
  background: #eef1ff;
  color: #3647bf;
}

.silicon-actions .primary {
  background: linear-gradient(135deg, #5364d8, #6f7deb);
  color: #fff;
  box-shadow: 0 10px 24px rgba(83, 100, 216, 0.24);
}

.default-ratio-box {
  border-top-color: rgba(84, 96, 137, 0.12);
}

.default-ratio-box button {
  border-color: rgba(240, 138, 108, 0.34);
  background: #fff3ee;
  color: #af4f37;
}

.silicon-run-chip,
.method-note,
.selector-empty-note {
  border-color: rgba(84, 96, 137, 0.13);
  background: #f7f8fc;
}

.silicon-run-chip.running {
  border-color: rgba(240, 138, 108, 0.42);
  background: #fff3ee;
  color: #9a4a33;
}

.number-field input,
.toggle-chip input,
.custom-question input,
.custom-kind select {
  border-color: rgba(84, 96, 137, 0.18);
  background: #fff;
  color: #18213a;
}

.number-field input:focus,
.toggle-chip input:focus,
.custom-question input:focus,
.custom-kind select:focus {
  border-color: rgba(91, 110, 225, 0.6);
  box-shadow: 0 0 0 3px rgba(91, 110, 225, 0.1);
}

.toggle-head em,
.result-stats span {
  border-color: rgba(84, 96, 137, 0.15);
  background: #f7f8fc;
  color: rgba(24, 33, 58, 0.62);
}

.result-stats strong {
  color: #3647bf;
}

.toggle-chip,
.question-bank button,
.question-tabs button,
.metric-card-item,
.silicon-answer-list article {
  border-color: rgba(84, 96, 137, 0.13);
  background: #fbfcff;
}

.toggle-chip.active,
.question-bank button.selected {
  border-color: rgba(91, 110, 225, 0.38);
  background: #eef1ff;
}

.toggle-chip button,
.question-bank button,
.question-tabs button {
  color: #18213a;
}

.question-bank button.kind-likert,
.question-tabs button.kind-likert {
  border-left-color: #5b6ee1;
  border-top-color: #5b6ee1;
}

.question-bank button.kind-open,
.question-tabs button.kind-open {
  border-left-color: #f08a6c;
  border-top-color: #f08a6c;
}

.question-bank button.kind-categorical,
.question-tabs button.kind-categorical {
  border-left-color: #14b8a6;
  border-top-color: #14b8a6;
}

.question-tabs button.active {
  border-color: rgba(91, 110, 225, 0.38);
  background: linear-gradient(180deg, #f3f5ff, #ffffff);
}

.silicon-metric {
  border-bottom-color: rgba(84, 96, 137, 0.12);
}

.silicon-chart-grid.open-only {
  grid-template-columns: 1fr;
}

.silicon-chart-grid.open-only .silicon-open-panel,
.silicon-chart-grid.open-only .silicon-response-table-card,
.silicon-response-table-card {
  grid-column: 1 / -1;
}

.silicon-answer-list span {
  color: rgba(24, 33, 58, 0.56);
}

.silicon-answer-list p {
  color: rgba(24, 33, 58, 0.82);
}

.silicon-spinner {
  border-color: rgba(84, 96, 137, 0.16);
  border-top-color: #5b6ee1;
}

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

.custom-question-list > span {
  color: rgba(24, 33, 58, 0.58);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.custom-question-list article {
  display: grid;
  gap: 4px;
  border: 1px solid rgba(84, 96, 137, 0.13);
  border-radius: 12px;
  padding: 10px;
  background: #fbfcff;
}

.custom-question-list article.kind-likert {
  border-left: 4px solid #5b6ee1;
}

.custom-question-list article.kind-open {
  border-left: 4px solid #f08a6c;
}

.custom-question-list article.kind-categorical {
  border-left: 4px solid #14b8a6;
}

.custom-question-list em {
  color: rgba(24, 33, 58, 0.56);
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
}

.custom-question-list strong {
  color: #18213a;
  font-size: 13px;
}

.silicon-response-table-card {
  min-width: 0;
  padding: 14px;
}

.silicon-response-table-card header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.silicon-response-table-scroll {
  max-height: 340px;
  margin-top: 12px;
  overflow: auto;
  border: 1px solid rgba(84, 96, 137, 0.12);
  border-radius: 14px;
}

.silicon-response-table {
  width: 100%;
  min-width: 940px;
  border-collapse: collapse;
  background: #fff;
  font-size: 12px;
}

.silicon-response-table th,
.silicon-response-table td {
  border-bottom: 1px solid rgba(84, 96, 137, 0.1);
  padding: 10px;
  text-align: left;
  vertical-align: top;
}

.silicon-response-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #f5f7fc;
  color: rgba(24, 33, 58, 0.64);
  font-size: 11px;
  font-weight: 850;
}

.silicon-response-table td {
  color: rgba(24, 33, 58, 0.8);
  line-height: 1.4;
}

@media (max-width: 1280px) {
  .silicon-shell {
    grid-template-columns: 380px minmax(0, 1fr);
  }

  .silicon-shell.setup-only .silicon-setup-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .silicon-shell.setup-only .location-card,
  .silicon-shell.setup-only .persona-card,
  .silicon-shell.setup-only .nemotron-card,
  .silicon-shell.setup-only .question-card {
    grid-column: span 2;
  }

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

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

@media (max-width: 980px) {
  .silicon-shell {
    display: block;
  }

  .silicon-shell.setup-only .silicon-setup-grid {
    grid-template-columns: 1fr;
  }

  .silicon-shell.setup-only .location-card,
  .silicon-shell.setup-only .persona-card,
  .silicon-shell.setup-only .nemotron-card,
  .silicon-shell.setup-only .question-card {
    grid-column: auto;
  }

  .silicon-config {
    position: relative;
    height: auto;
    border-right: 0;
    border-bottom: 1px solid rgba(246, 241, 230, 0.11);
  }

  .silicon-chart-grid.single,
  .explorer-toolbar {
    grid-template-columns: 1fr;
  }

  .silicon-chart-grid.single,
  .explorer-toolbar {
    display: grid;
  }
}

@media (max-width: 640px) {
  .silicon-config,
  .silicon-results {
    padding: 10px;
  }

  .silicon-result-head,
  .silicon-open-panel header,
  .silicon-chart-card header {
    display: grid;
  }

  .toggle-grid,
  .toggle-grid.compact,
  .silicon-chart-grid,
  .silicon-chart-grid.single,
  .location-toggle-grid,
  .question-tabs,
  .metric-card-grid {
    grid-template-columns: 1fr;
  }

  .silicon-chart-card.wide,
  .silicon-open-panel {
    grid-column: auto;
  }

  .custom-question {
    grid-template-columns: 1fr;
  }
}

/* Local review flow: simplified respondent -> question -> result wizard */
.flow-shell {
  display: block;
  min-height: 100vh;
  background:
    radial-gradient(circle at 14% 8%, rgba(91, 110, 225, 0.12), transparent 28%),
    radial-gradient(circle at 86% 12%, rgba(240, 138, 108, 0.12), transparent 26%),
    linear-gradient(180deg, #f8fafc 0%, #ffffff 52%, #f7f9ff 100%);
  color: #18213a;
}

.silicon-page {
  width: min(1180px, calc(100% - 32px));
  margin: 0 auto;
  padding: 24px 0 44px;
}

.silicon-flow-hero {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 18px;
  align-items: start;
  border: 1px solid rgba(84, 96, 137, 0.14);
  border-radius: 22px;
  padding: 18px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 18px 52px rgba(39, 55, 96, 0.1);
}

.flow-hero-copy h1 {
  margin: 4px 0 6px;
  font-size: clamp(30px, 4vw, 48px);
  line-height: 1;
  letter-spacing: 0;
}

.flow-hero-copy p {
  margin: 0;
  color: rgba(24, 33, 58, 0.62);
  line-height: 1.5;
}

.flow-actions {
  display: flex;
  justify-content: flex-end;
}

.flow-actions button,
.flow-steps button,
.respondent-generate-row button,
.respondent-preview-card header button,
.question-run-row button,
.custom-question-form button,
.final-question-list button,
.silicon-state-panel button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 38px;
  border: 1px solid rgba(84, 96, 137, 0.16);
  border-radius: 999px;
  padding: 8px 13px;
  background: #f5f7fc;
  color: #273047;
  font-weight: 850;
}

.flow-actions button.primary,
.respondent-generate-row button.primary,
.respondent-preview-card header button.primary,
.question-run-row button.primary,
.custom-question-form button.primary {
  border-color: rgba(91, 110, 225, 0.44);
  background: linear-gradient(135deg, #5364d8, #6f7deb);
  color: #fff;
  box-shadow: 0 10px 24px rgba(83, 100, 216, 0.22);
}

.question-run-row button:disabled,
.custom-question-form button:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

.silicon-flow-hero .silicon-run-chip {
  grid-column: 1 / -1;
  margin-top: 0;
}

.flow-steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 14px 0;
}

.flow-steps button {
  justify-content: flex-start;
  min-height: 46px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.82);
}

.flow-steps button.active {
  border-color: rgba(91, 110, 225, 0.42);
  background: #eef1ff;
  color: #3647bf;
}

.flow-steps button:disabled {
  color: rgba(24, 33, 58, 0.36);
  cursor: not-allowed;
}

.flow-panel,
.respondent-preview-card,
.question-bank-card,
.custom-question-card,
.final-question-card,
.results-only-panel {
  border: 1px solid rgba(84, 96, 137, 0.14);
  border-radius: 22px;
  padding: 18px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 18px 52px rgba(39, 55, 96, 0.09);
}

.flow-panel-head {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.flow-panel-head.compact {
  margin-bottom: 12px;
}

.flow-panel-head span,
.flow-control-card > span,
.respondent-generate-row span,
.respondent-preview-card header span,
.final-question-card header span {
  display: block;
  color: rgba(24, 33, 58, 0.58);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.flow-panel-head strong,
.flow-control-card > strong,
.respondent-preview-card header strong,
.final-question-card header strong {
  display: block;
  margin-top: 2px;
  color: #18213a;
  font-size: 18px;
}

.flow-panel-head p,
.respondent-generate-row p {
  margin: 6px 0 0;
  color: rgba(24, 33, 58, 0.62);
  font-size: 13px;
  line-height: 1.5;
}

.respondent-form-grid {
  display: grid;
  grid-template-columns: minmax(260px, 1.3fr) repeat(3, minmax(180px, 1fr));
  gap: 12px;
  margin-top: 18px;
}

.flow-control-card {
  display: grid;
  align-content: start;
  gap: 10px;
  min-width: 0;
  border: 1px solid rgba(84, 96, 137, 0.13);
  border-radius: 18px;
  padding: 14px;
  background: #fbfcff;
}

.filter-select select,
.custom-question-form select,
.custom-question-form input {
  width: 100%;
  min-width: 0;
  border: 1px solid rgba(84, 96, 137, 0.18);
  border-radius: 12px;
  background: #fff;
  color: #18213a;
  padding: 10px 11px;
  outline: none;
}

.filter-select select:focus,
.custom-question-form select:focus,
.custom-question-form input:focus {
  border-color: rgba(91, 110, 225, 0.58);
  box-shadow: 0 0 0 3px rgba(91, 110, 225, 0.1);
}

.respondent-generate-row {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  margin-top: 14px;
  border: 1px solid rgba(91, 110, 225, 0.16);
  border-radius: 18px;
  padding: 14px;
  background: linear-gradient(135deg, #f7f8ff, #fff);
}

.respondent-preview-card,
.question-bank-card,
.custom-question-card,
.final-question-card {
  margin-top: 14px;
}

.prompt-preview-card {
  margin-top: 14px;
  border: 1px solid rgba(84, 96, 137, 0.14);
  border-radius: 22px;
  padding: 18px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 18px 52px rgba(39, 55, 96, 0.09);
}

.prompt-preview-card .question-bank-toggle {
  width: 100%;
  justify-content: flex-start;
  margin-left: 0;
}

.prompt-preview-body {
  display: grid;
  gap: 12px;
  margin-top: 12px;
}

.prompt-preview-status {
  margin: 0;
  color: rgba(24, 33, 58, 0.62);
  font-size: 13px;
  line-height: 1.5;
}

.prompt-preview-block {
  border: 1px solid rgba(84, 96, 137, 0.13);
  border-radius: 16px;
  padding: 12px;
  background: #fbfcff;
}

.prompt-preview-block span {
  display: block;
  color: rgba(24, 33, 58, 0.58);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.prompt-preview-block pre {
  margin: 8px 0 0;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: Consolas, "Courier New", monospace;
  font-size: 12px;
  line-height: 1.6;
  color: #18213a;
}

.respondent-preview-card header,
.final-question-card header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.final-question-card header em {
  border: 1px solid rgba(84, 96, 137, 0.14);
  border-radius: 999px;
  padding: 6px 10px;
  background: #f7f8fc;
  color: #3647bf;
  font-style: normal;
  font-weight: 850;
}

.respondent-table {
  min-width: 860px;
}

.question-bank-card .question-bank-toggle {
  margin-left: 0;
}

.custom-question-form {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) repeat(2, minmax(150px, 0.45fr)) auto;
  gap: 10px;
  align-items: end;
}

.custom-question-form label {
  display: grid;
  gap: 6px;
}

.custom-question-form label.wide {
  grid-column: span 2;
}

.categorical-options-editor {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
  border: 1px solid rgba(20, 184, 166, 0.18);
  border-radius: 16px;
  padding: 12px;
  background: linear-gradient(180deg, rgba(236, 253, 245, 0.7), rgba(255, 255, 255, 0.92));
}

.categorical-options-head {
  grid-column: 1 / -1;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}

.categorical-options-head span {
  color: rgba(24, 33, 58, 0.62);
  font-size: 11px;
  font-weight: 850;
}

.categorical-options-head button {
  min-height: 32px;
  padding: 6px 10px;
  background: #ecfdf5;
  color: #0f766e;
}

.custom-question-form label span {
  color: rgba(24, 33, 58, 0.58);
  font-size: 11px;
  font-weight: 850;
}

.final-question-list {
  display: grid;
  gap: 9px;
}

.final-question-list article {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  border: 1px solid rgba(84, 96, 137, 0.13);
  border-radius: 14px;
  padding: 12px;
  background: #fbfcff;
}

.final-question-list article.kind-likert {
  border-left: 4px solid #5b6ee1;
}

.final-question-list article.kind-open {
  border-left: 4px solid #f08a6c;
}

.final-question-list article.kind-categorical {
  border-left: 4px solid #14b8a6;
}

.final-question-list article span {
  color: rgba(24, 33, 58, 0.58);
  font-size: 11px;
  font-weight: 850;
}

.final-question-list article strong {
  display: block;
  margin-top: 3px;
  color: #18213a;
  line-height: 1.35;
}

.final-question-list button {
  min-height: 32px;
  padding: 6px 10px;
  color: #9a4a33;
}

.question-run-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-top: 14px;
}

.results-only-panel {
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.stage-results .silicon-result-head {
  margin-top: 0;
}

.silicon-answer-list article em {
  color: rgba(54, 71, 191, 0.76);
  font-size: 12px;
  font-style: normal;
  line-height: 1.45;
}

.silicon-response-table th:last-child,
.silicon-response-table td:last-child {
  min-width: 260px;
}

@media (max-width: 1100px) {
  .respondent-form-grid,
  .custom-question-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .custom-question-form label.wide {
    grid-column: 1 / -1;
  }
}

@media (max-width: 760px) {
  .silicon-page {
    width: min(100% - 20px, 1180px);
    padding-top: 10px;
  }

  .silicon-flow-hero,
  .flow-steps,
  .respondent-form-grid,
  .custom-question-form,
  .final-question-list article {
    grid-template-columns: 1fr;
  }

  .flow-actions {
    justify-content: flex-start;
  }

  .respondent-generate-row,
  .respondent-preview-card header,
  .final-question-card header,
  .question-run-row,
  .silicon-result-head {
    display: grid;
  }
}