/* v6.1-v6.6: guided, decision-first workspace */
.core-task-switcher {
  transition: padding .2s ease, border-color .2s ease, background .2s ease;
}

.core-task-switcher.is-collapsed {
  padding-block: 10px;
}

/* v7.20.3: this rule dates from the v6.1-v6.6 guided-workspace design,
   where .core-task-intro/.core-task-demos/.catalog-request-center all used
   to live directly inside .core-task-switcher and got hidden once the user
   had already picked a task (is-collapsed). All three have since moved out
   (the intro/demos blocks were removed entirely; catalog-request-center now
   lives in the footer, per earlier refactors) -- so of the four selectors
   here, only ".getting-started-panel" still matches anything, and it's a
   real bug: #coreTaskSwitcher gets .is-collapsed applied any time a GPU is
   already selected (setStarted(true), the normal case for a returning
   visitor), and this rule's (0,3,0) specificity beats the panel's own
   .getting-started-panel[hidden] rule regardless of source order -- so
   clicking the header's "가이드"/"Getting started" button correctly clears
   the panel's [hidden] attribute (confirmed via toggleGuide()'s own DOM
   state), but the panel stays forced to display:none here and never
   actually becomes visible. Removed entirely since none of its targets are
   still valid children of .core-task-switcher. */

/* v7.20.3: the rest of this "collapse to a single active pill, hide the
   other tabs" v6 design is also dead against the current always-show-all-6
   -flat-tabs layout -- #coreTaskSwitcher's later ID-scoped rules for
   .core-task-actions/.core-task-button always win the cascade for display,
   so .core-task-actions never actually becomes display:block and inactive
   buttons never actually get display:none here. The one exception was
   dangerous rather than just inert: .core-task-button.is-active's
   width: 100% has no ID-scoped counterpart to lose to, so it silently WAS
   still winning and setting the active tab's flex-basis (via flex: 1 1
   auto, whose auto basis defers to width) to 100% of the row whenever
   .is-collapsed was applied -- which is any time a GPU is already selected,
   the normal case for a returning visitor. That's the same "one tab
   balloons, the rest lose space" failure mode fixed for the non-collapsed
   case in v7.20.1, just still lurking here for the collapsed case. Removed
   the whole group since none of it matches the current design's intent. */

.workspace-journey [data-change-path] {
  margin-inline-start: auto;
}

.gpu-search-suggestions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 10px;
}

.gpu-search-suggestions button {
  min-height: 38px;
}

.si-simple-wizard [data-si-step-panel] {
  display: none;
}

.si-simple-wizard[data-step="1"] [data-si-step-panel="1"],
.si-simple-wizard[data-step="2"] [data-si-step-panel="2"],
.si-simple-wizard[data-step="3"] [data-si-step-panel="3"],
.si-simple-wizard[data-step="4"] [data-si-step-panel="4"] {
  display: block;
}

.si-simple-wizard .si-wizard-step,
.si-simple-wizard .si-wizard-result {
  animation: v6-step-in .18s ease-out;
}

@keyframes v6-step-in {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}

.si-wizard-navigation {
  position: sticky;
  bottom: 8px;
  z-index: 4;
  display: grid;
  grid-template-columns: minmax(100px, 1fr) auto minmax(100px, 1fr);
  align-items: center;
  gap: 10px;
  margin-top: 16px;
  padding: 10px;
  border: 1px solid var(--line, #ccd6dd);
  border-radius: 12px;
  background: color-mix(in srgb, var(--panel, #fff) 92%, transparent);
  box-shadow: 0 10px 28px rgb(0 0 0 / 10%);
  backdrop-filter: blur(10px);
}

.si-wizard-navigation > :last-child {
  justify-self: end;
}

.si-wizard-navigation > span {
  color: var(--muted, #66757f);
  font-weight: 800;
}

.simple-result-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}

.price-coverage-note,
.evidence-coverage-note {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-top: 12px;
  padding: 13px;
  /* var(--soft, ...) - same class of bug as the components.css --ui-border
     issue: --soft isn't a real token (--surface-soft is), so this note's
     background was stuck at the light-mode fallback color in dark mode. */
  border: 1px solid var(--line, #ccd6dd);
  border-radius: 11px;
  background: var(--surface-soft, #f4f7f9);
}

.price-coverage-note strong,
.price-coverage-note small,
.evidence-coverage-note strong,
.evidence-coverage-note small {
  display: block;
}

.evidence-coverage-note.is-review {
  border-color: color-mix(in srgb, #b86a13 45%, var(--line, #ccd6dd));
}

.evidence-status {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
}

/* These badges used fixed light-mode hex colors (no dark-theme override
   anywhere), so in dark mode the pale green/amber background tints barely
   showed up against the dark panel and the dark-on-light text colors lost
   contrast. Switched to the same --green/--yellow soft-background tokens
   used by grade pills elsewhere, which already have dark-mode variants. */
.evidence-status.is-official {
  background: var(--green-soft);
  color: var(--green);
}

.evidence-status.is-family,
.evidence-status.is-missing {
  background: var(--yellow-soft);
  color: var(--yellow);
}

.decision-studio.is-simple-sizing .decision-studio-tabs,
.decision-studio.is-simple-sizing .si-readiness-panel,
.decision-studio.is-simple-sizing .si-intro,
.decision-studio.is-simple-sizing .si-expert-form,
.decision-studio.is-simple-sizing .si-advanced,
.decision-studio.is-simple-sizing .si-output-grid,
.decision-studio.is-simple-sizing .si-deliverable-grid,
.decision-studio.is-simple-sizing .si-poc-mode,
.decision-studio.is-simple-sizing .si-version-section,
.decision-studio.is-simple-sizing .si-actions,
.decision-studio.is-simple-sizing .studio-form-note,
.decision-studio.is-simple-sizing #siPlans,
.decision-studio.is-simple-sizing .si-plan-detail,
.decision-studio.is-simple-sizing .decision-guidance {
  display: none;
}

.decision-studio.is-simple-sizing[data-wizard-step="4"] #siPlans {
  display: grid;
}

.decision-studio.is-simple-sizing[data-wizard-step="4"] .si-plan-detail,
.decision-studio.is-simple-sizing[data-wizard-step="4"] .decision-guidance {
  display: block;
}

.decision-studio.is-simple-sizing .si-decision-metrics span:nth-child(3),
.decision-studio.is-simple-sizing .si-decision-metrics span:nth-child(5),
.decision-studio.is-simple-sizing .si-decision-metrics span:nth-child(6) {
  display: none;
}

/* 위에서 6개 지표 중 3개(동시 사용자·소비전력·신뢰도)를 숨겨 3개만 남기지만,
   .si-decision-metrics는 2열 그리드라서 남은 3개(총 예상 가격/GPU/VRAM 여유)가
   2열에 걸쳐 배치되며 마지막 칸이 빈 회색 상자로 남는다. 간편 견적에서는
   1열로 쌓아 빈 칸이 생기지 않게 한다. */
.decision-studio.is-simple-sizing .si-decision-metrics {
  grid-template-columns: 1fr;
}

.decision-studio.is-simple-sizing .si-plan-detail-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.decision-studio.is-simple-sizing .si-plan-detail-grid > article:nth-child(2) {
  display: none;
}

@media (max-width: 760px) {
  .price-coverage-note,
  .evidence-coverage-note {
    align-items: stretch;
    flex-direction: column;
  }

  .si-wizard-navigation {
    bottom: 4px;
  }

  .decision-studio.is-simple-sizing .si-plan-detail-grid {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .core-task-switcher,
  .si-simple-wizard .si-wizard-step,
  .si-simple-wizard .si-wizard-result {
    animation: none;
    transition: none;
  }
}