Spaces:
Sleeping
Sleeping
| :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; | |
| } | |
| } | |