/**
 * SafeInvest AI v3.15 — 생애주기 페이지 CSS
 *
 * 기존 디자인 토큰 활용: --c-brand, --c-ink, --r-md, --shadow-sm 등
 */

/* ============== 페이지 헤더 ============== */
.ls-header {
  text-align: center;
  margin: 32px 0 48px;
  padding: 0 16px;
}

.ls-header h1 {
  font-size: 32px;
  font-weight: 700;
  color: var(--c-ink);
  margin-bottom: 12px;
}

.ls-subtitle {
  font-size: 15px;
  color: var(--c-ink-3);
  line-height: 1.6;
}

.ls-privacy-note {
  display: inline-block;
  margin-top: 8px;
  font-size: 13px;
  color: var(--c-ink-2);
  background: var(--c-brand-soft);
  padding: 6px 12px;
  border-radius: var(--r-sm);
}

/* ============== 탭 UI (v4.0 - 입력 4탭 분할) ============== */
.ls-tabs {
  display: flex;
  gap: 0;
  margin-bottom: 32px;
  border-bottom: 2px solid var(--c-border, #e5e7eb);
  flex-wrap: wrap;
  padding: 0 4px;
}

.ls-tab {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 18px;
  cursor: pointer;
  font-size: 14px;
  font-weight: 600;
  color: var(--c-ink-3);
  border: none;
  background: transparent;
  border-bottom: 3px solid transparent;
  margin-bottom: -2px;
  transition: all 0.2s ease;
  position: relative;
}

.ls-tab:hover:not(.disabled) {
  color: var(--c-brand);
  background: var(--c-brand-soft);
}

.ls-tab.active {
  color: var(--c-brand);
  border-bottom-color: var(--c-brand);
}

.ls-tab.disabled {
  cursor: not-allowed;
  opacity: 0.45;
}

.ls-tab-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--c-ink-4, #d1d5db);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
}

.ls-tab.active .ls-tab-num {
  background: var(--c-brand);
}

.ls-tab.completed .ls-tab-num {
  background: #2ecc71;
}

.ls-tab.completed .ls-tab-num::before {
  content: "✓";
}
.ls-tab.completed .ls-tab-num-text { display: none; }

.ls-tab-pane {
  display: none;
  animation: ls-tab-fade-in 0.25s ease;
}

.ls-tab-pane.active {
  display: block;
}

@keyframes ls-tab-fade-in {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

.ls-tab-nav {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-top: 24px;
  padding: 16px 4px 0;
  border-top: 1px solid var(--c-border, #e5e7eb);
}

.ls-tab-nav-spacer {
  flex: 1;
}

/* v4.0 #76: sub-탭 흐름 nav (current → domain → future → tax) */
.ls-subtab-flow {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  margin: 24px 4px 0;
  padding-top: 16px;
  border-top: 1px solid var(--c-border, #e5e7eb);
}
.ls-subtab-flow-both {
  justify-content: space-between;
}
.ls-subtab-flow .ls-subtab-next {
  font-weight: 600;
}

.btn-tab-nav {
  padding: 10px 20px;
  border-radius: var(--r-sm);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  border: 1px solid var(--c-border, #e5e7eb);
  background: var(--c-bg);
  color: var(--c-ink-2);
  transition: all 0.2s;
}

.btn-tab-nav:hover {
  background: var(--c-brand-soft);
  color: var(--c-brand);
  border-color: var(--c-brand);
}

.btn-tab-next {
  background: var(--c-brand);
  color: #fff;
  border-color: var(--c-brand);
}

.btn-tab-next:hover {
  filter: brightness(1.1);
  color: #fff;
  background: var(--c-brand);
}

/* ============== Y/N 라디오 옵션 (보장 입력 v4.0) ============== */
.ls-yn-options {
  display: flex;
  gap: 8px;
}

.ls-yn-option {
  flex: 1;
  cursor: pointer;
}

.ls-yn-option input[type="radio"] {
  position: absolute;
  opacity: 0;
}

.ls-yn-card {
  padding: 10px 14px;
  border: 1.5px solid var(--c-border, #e5e7eb);
  border-radius: var(--r-sm);
  text-align: center;
  font-size: 13px;
  font-weight: 600;
  color: var(--c-ink-3);
  transition: all 0.15s;
}

.ls-yn-option input[type="radio"]:checked + .ls-yn-card {
  border-color: var(--c-brand);
  background: var(--c-brand-soft);
  color: var(--c-brand);
}

.ls-yn-option:hover .ls-yn-card {
  border-color: var(--c-brand);
}

@media (max-width: 600px) {
  .ls-tabs { gap: 0; }
  .ls-tab { padding: 10px 12px; font-size: 13px; }
  .ls-tab-label-full { display: none; }
}

@media (min-width: 601px) {
  .ls-tab-label-short { display: none; }
}

/* ============== 결과 카드 그룹 (v4.0 - 3카드 그룹화) ============== */
.ls-result-card {
  background: var(--c-bg);
  border-radius: var(--r-md, 12px);
  border: 1px solid var(--c-border, #e5e7eb);
  box-shadow: var(--shadow-sm);
  margin-bottom: 24px;
  overflow: hidden;
}

.ls-result-card-header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 18px 24px;
  background: linear-gradient(180deg, var(--c-brand-soft) 0%, transparent 100%);
  border-bottom: 1px solid var(--c-border, #e5e7eb);
}

.ls-result-card-icon {
  font-size: 22px;
}

.ls-result-card-title {
  font-size: 17px;
  font-weight: 700;
  color: var(--c-ink);
  margin: 0;
  flex: 1;
}

.ls-result-card-subtitle {
  font-size: 13px;
  color: var(--c-ink-3);
  margin: 4px 0 0 0;
}

.ls-result-card-body {
  padding: 20px 24px;
}

/* 보장 매트릭스 placeholder (단계 3 진입 후 자동 교체) */
.ls-coverage-placeholder {
  text-align: center;
  padding: 40px 20px;
  color: var(--c-ink-3);
  background: var(--c-brand-soft);
  border-radius: var(--r-sm);
  border: 1px dashed var(--c-brand);
}

.ls-coverage-placeholder-icon {
  font-size: 32px;
  margin-bottom: 12px;
}

.ls-coverage-placeholder-text {
  font-size: 14px;
  font-weight: 600;
  color: var(--c-brand);
  margin-bottom: 4px;
}

.ls-coverage-placeholder-sub {
  font-size: 12px;
  color: var(--c-ink-3);
}

/* ============== v4.0 보장 매트릭스 (coverage-matrix.js) ============== */

/* 라이프스테이지 토글 */
.coverage-stage-tabs {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-bottom: 16px;
  padding: 6px;
  background: var(--c-brand-soft);
  border-radius: var(--r-sm);
}

.coverage-stage-tab {
  position: relative;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  border: 1px solid transparent;
  background: transparent;
  border-radius: var(--r-sm);
  font-size: 13px;
  font-weight: 600;
  color: var(--c-ink-3);
  cursor: pointer;
  transition: all 0.15s;
}

.coverage-stage-tab:hover {
  background: rgba(255, 255, 255, 0.6);
  color: var(--c-ink);
}

.coverage-stage-tab.active {
  background: var(--c-brand);
  color: #fff;
  border-color: var(--c-brand);
}

.coverage-stage-tab.inferred:not(.active) {
  border-color: var(--c-brand);
  color: var(--c-brand);
}

.coverage-stage-icon { font-size: 15px; }
.coverage-stage-label { font-size: 13px; }

.coverage-stage-current-badge {
  font-size: 10px;
  font-weight: 700;
  padding: 1px 6px;
  margin-left: 2px;
  border-radius: 9px;
  background: rgba(255, 255, 255, 0.25);
  color: inherit;
  border: 1px solid currentColor;
}
.coverage-stage-tab.inferred:not(.active) .coverage-stage-current-badge {
  background: var(--c-brand);
  color: #fff;
  border-color: var(--c-brand);
}

/* 스테이지 요약 */
.coverage-stage-summary {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  background: var(--c-bg, #fafbfc);
  border: 1px solid var(--c-border, #e5e7eb);
  border-radius: var(--r-sm);
  margin-bottom: 16px;
}

.coverage-stage-summary-icon { font-size: 28px; }
.coverage-stage-summary-title {
  font-size: 15px;
  font-weight: 700;
  color: var(--c-ink);
}
.coverage-stage-summary-desc {
  font-size: 13px;
  font-weight: 400;
  color: var(--c-ink-3);
}
.coverage-stage-summary-sub {
  font-size: 12px;
  color: var(--c-ink-3);
  margin-top: 4px;
}

/* 권장액 기준 토글 박스 — 영업 X / 교육 O */
.coverage-basis-box {
  background: rgba(99, 102, 241, 0.04);
  border: 1px solid rgba(99, 102, 241, 0.18);
  border-radius: var(--r-sm, 8px);
  padding: 0;
  margin-bottom: 12px;
  overflow: hidden;
}
.coverage-basis-summary {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  cursor: pointer;
  font-size: 13px;
  user-select: none;
  list-style: none;
}
.coverage-basis-summary::-webkit-details-marker { display: none; }
.coverage-basis-summary::before {
  content: '▸';
  font-size: 10px;
  color: var(--c-ink-4, #9ca3af);
  margin-right: 2px;
  transition: transform 0.15s;
}
.coverage-basis-box[open] .coverage-basis-summary::before { transform: rotate(90deg); }
.coverage-basis-icon { font-size: 16px; }
.coverage-basis-title { font-weight: 700; color: var(--c-ink, #111827); }
.coverage-basis-hint {
  flex: 1;
  font-size: 11px;
  color: var(--c-ink-3, #6b7280);
  text-align: right;
}
.coverage-basis-list {
  padding: 4px 14px 12px;
  border-top: 1px dashed rgba(99, 102, 241, 0.18);
}
.coverage-basis-row {
  display: grid;
  grid-template-columns: 24px 100px 1fr;
  gap: 10px;
  align-items: baseline;
  padding: 6px 0;
  font-size: 12px;
  border-bottom: 1px dashed rgba(0,0,0,0.05);
}
.coverage-basis-row:last-of-type { border-bottom: none; }
.coverage-basis-row-icon { font-size: 14px; }
.coverage-basis-row-name {
  font-weight: 600;
  color: var(--c-ink-2, #374151);
}
.coverage-basis-row-formula {
  color: var(--c-ink-2, #374151);
  line-height: 1.5;
}
.coverage-basis-row-formula strong {
  color: var(--c-brand, #5b6ee1);
  font-weight: 600;
}
.coverage-basis-footer {
  margin-top: 8px;
  padding: 8px 10px;
  background: rgba(245, 158, 11, 0.06);
  border-left: 3px solid #f59e0b;
  border-radius: 4px;
  font-size: 11px;
  color: var(--c-ink-2, #374151);
  line-height: 1.5;
}

/* v4.0 #83: 계산 기준 토글 — 섹션 구분 헤더 + 입력 한계 안내 */
.coverage-basis-section-title {
  font-size: 12px;
  font-weight: 700;
  color: var(--c-brand, #5b6ee1);
  padding: 6px 0 4px;
  border-bottom: 1px solid rgba(99, 102, 241, 0.12);
  margin-bottom: 2px;
  letter-spacing: -0.01em;
}
.coverage-basis-disclaimer {
  padding: 8px 10px;
  background: rgba(99, 102, 241, 0.05);
  border-left: 3px solid var(--c-brand, #5b6ee1);
  border-radius: 4px;
  font-size: 11.5px;
  color: var(--c-ink-2, #374151);
  line-height: 1.55;
  margin: 4px 0 6px;
}
.coverage-basis-disclaimer strong {
  color: var(--c-brand, #5b6ee1);
}

/* 6 카드 그리드 (.report-biz-card 패턴 참고) — 콤팩트 v2 */
.coverage-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}

.coverage-card {
  background: var(--c-bg, #fff);
  border: 1px solid var(--c-border, #e5e7eb);
  border-left: 3px solid var(--c-ink-4, #d1d5db);
  border-radius: var(--r-sm);
  padding: 10px 12px;
  cursor: pointer;
  transition: all 0.15s;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.coverage-card:hover {
  box-shadow: var(--shadow-md, 0 2px 8px rgba(0,0,0,0.08));
  transform: translateY(-1px);
}

.coverage-card:focus {
  outline: 2px solid var(--c-brand);
  outline-offset: 2px;
}

.coverage-severity-border-ok      { border-left-color: #2ecc71; }
.coverage-severity-border-low     { border-left-color: #fdcb6e; }
.coverage-severity-border-medium  { border-left-color: #e17055; }
.coverage-severity-border-high    { border-left-color: #d63031; }
.coverage-severity-border-na      { border-left-color: #d1d5db; }

.coverage-card-header {
  display: flex;
  align-items: center;
  gap: 6px;
}

.coverage-card-icon { font-size: 15px; flex-shrink: 0; }
.coverage-card-domain {
  font-size: 13px;
  font-weight: 700;
  color: var(--c-ink);
  flex: 1;
}

.coverage-card-severity {
  font-size: 10px;
  font-weight: 700;
  padding: 2px 6px;
  border-radius: 9px;
  white-space: nowrap;
}

.coverage-severity-ok     { color: #2ecc71; background: rgba(46, 204, 113, 0.12); }
.coverage-severity-low    { color: #b08400; background: rgba(253, 203, 110, 0.18); }
.coverage-severity-medium { color: #e17055; background: rgba(225, 112, 85, 0.12); }
.coverage-severity-high   { color: #d63031; background: rgba(214, 48, 49, 0.12); }
.coverage-severity-na     { color: #888; background: rgba(180, 180, 180, 0.12); }

/* 금액 표시 — v4.0 #80: 두 줄 (권장 / 현재) */
.coverage-card-amounts {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 12px;
}

.coverage-card-amounts-stacked {
  /* 명시적 두 줄 모드 */
}

.coverage-amount-line {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}

.coverage-amount-label {
  font-size: 11px;
  color: var(--c-ink-3);
  min-width: 28px;
}

.coverage-amount-value {
  font-size: 14px;
  font-weight: 700;
  color: var(--c-ink);
}

.coverage-amount-current {
  color: var(--c-ink-2, #374151);
}

.coverage-current-estimate-note {
  margin-top: 4px;
  padding-top: 6px;
  border-top: 1px dashed rgba(0,0,0,0.06);
  font-size: 10px;
  color: var(--c-ink-3);
  line-height: 1.4;
  font-style: italic;
}

.coverage-card-amounts-na {
  padding: 4px 0;
}

.coverage-card-na-text {
  font-size: 11px;
  color: var(--c-ink-3);
  font-style: italic;
}

/* 갭 막대 */
.coverage-gap-row {
  display: flex;
  align-items: center;
  gap: 8px;
}

.coverage-gap-bar {
  flex: 1;
  height: 5px;
  background: var(--c-bg-2, #f3f4f6);
  border-radius: 3px;
  overflow: hidden;
}

.coverage-gap-fill {
  height: 100%;
  border-radius: 3px;
  transition: width 0.4s ease;
}

.coverage-gap-percent {
  font-size: 10px;
  font-weight: 700;
  white-space: nowrap;
  min-width: 50px;
  text-align: right;
}

/* 카드 푸터 — hover에만 보이게 */
.coverage-card-footer {
  font-size: 10px;
  color: var(--c-ink-4, #b0b7c3);
  opacity: 0;
  transition: opacity 0.15s;
  margin-top: -2px;
}

.coverage-card:hover .coverage-card-footer,
.coverage-card:focus .coverage-card-footer {
  opacity: 1;
  color: var(--c-brand);
}

.coverage-card-learn {
  font-size: 10px;
  font-weight: 600;
}

/* 범례 */
.coverage-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  padding: 10px 14px;
  background: var(--c-bg-2, #f9fafb);
  border-radius: var(--r-sm);
  font-size: 11px;
  color: var(--c-ink-3);
}

.coverage-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.coverage-legend-dot {
  width: 10px;
  height: 10px;
  border-radius: 2px;
  display: inline-block;
}

@media (max-width: 600px) {
  .coverage-stage-tabs { gap: 4px; padding: 4px; }
  .coverage-stage-tab { padding: 6px 10px; font-size: 12px; }
  .coverage-stage-label { font-size: 12px; }
  .coverage-stage-current-badge { font-size: 9px; padding: 1px 4px; }
  .coverage-grid { grid-template-columns: 1fr; gap: 8px; }
  .coverage-amount-value { font-size: 14px; }
}

@media (max-width: 600px) {
  .ls-result-card-header { padding: 14px 16px; }
  .ls-result-card-body { padding: 16px; }
  .ls-result-card-title { font-size: 16px; }
}

/* ============== 섹션 그룹 (v3.16 13문항) ============== */
.ls-section {
  margin-bottom: 32px;
}

.ls-section-header {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 16px;
  padding: 0 4px;
}

.ls-section-num {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--c-brand);
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: var(--shadow-sm);
}

.ls-section-title-wrap {
  flex: 1;
  padding-top: 4px;
}

.ls-section-title {
  font-size: 18px;
  font-weight: 700;
  color: var(--c-ink);
  margin: 0 0 4px 0;
}

.ls-section-desc {
  font-size: 13px;
  color: var(--c-ink-3);
  margin: 0;
  line-height: 1.5;
}

/* 섹션 내 .ls-field 간격 조정 (섹션 그룹 안에서는 더 좁게) */
.ls-section .ls-field {
  margin-bottom: 12px;
}

.ls-section .ls-field:last-child {
  margin-bottom: 0;
}

/* ============== 모바일 반응형 (섹션 그룹) ============== */
@media (max-width: 600px) {
  .ls-section {
    margin-bottom: 24px;
  }

  .ls-section-header {
    gap: 12px;
  }

  .ls-section-num {
    width: 30px;
    height: 30px;
    font-size: 14px;
  }

  .ls-section-title {
    font-size: 16px;
  }

  .ls-section-desc {
    font-size: 12px;
  }
}

/* ============== 설문 폼 ============== */
/* v4.0 #85: 640 → 900 (입력 가독성 유지하면서 빈 공간 활용) */
.ls-form {
  max-width: 900px;
  margin: 0 auto;
  padding: 0 16px;
}

/* v4.0 #85: 진단 결과 탭은 표·차트가 있어 더 넓게 (900px → 1280px) */
.ls-form:has(.ls-tab-pane[data-tab-pane="result"].active) {
  max-width: 1280px;
}
/* fallback (Firefox <121 등): result 탭 활성 시 */
.ls-form.result-tab-active {
  max-width: 1280px;
}

.ls-field {
  background: #fff;
  border: 1px solid var(--c-line);
  border-radius: var(--r-md);
  padding: 20px 24px;
  margin-bottom: 16px;
  box-shadow: var(--shadow-sm);
  transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

.ls-field:focus-within {
  border-color: var(--c-brand);
  box-shadow: var(--shadow-md);
}

.ls-label {
  display: block;
  font-size: 16px;
  font-weight: 600;
  color: var(--c-ink);
  margin-bottom: 12px;
}

.ls-hint {
  display: block;
  font-size: 13px;
  font-weight: 400;
  color: var(--c-ink-3);
  margin-top: 4px;
}

.ls-input-row {
  display: flex;
  align-items: center;
  gap: 12px;
}

.ls-input {
  flex: 1;
  padding: 12px 16px;
  font-size: 16px;
  border: 1px solid var(--c-line);
  border-radius: var(--r-sm);
  background: var(--c-bg);
  color: var(--c-ink);
  transition: border-color 0.15s ease;
}

.ls-input:focus {
  outline: none;
  border-color: var(--c-brand);
  background: #fff;
}

.ls-unit {
  font-size: 15px;
  color: var(--c-ink-2);
  font-weight: 500;
  min-width: 32px;
}

/* ============== 위험 성향 카드 ============== */
.ls-risk-options {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-top: 4px;
}

.ls-risk-option {
  cursor: pointer;
  position: relative;
  display: flex;          /* 카드 높이 균일화 */
}

.ls-risk-option input[type="radio"] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.ls-risk-card {
  padding: 16px 12px;
  border: 2px solid var(--c-line);
  border-radius: var(--r-md);
  background: #fff;
  text-align: center;
  transition: all 0.15s ease;
  flex: 1;                /* 옵션 wrapper 높이를 모두 채움 */
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 96px;       /* 1줄/2줄 텍스트 차이 무시 — 일관된 높이 */
}

.ls-risk-option:hover .ls-risk-card {
  border-color: var(--c-brand-soft);
  background: var(--c-brand-soft);
}

.ls-risk-option input:checked + .ls-risk-card {
  border-color: var(--c-brand);
  background: var(--c-brand-soft);
  box-shadow: var(--shadow-sm);
}

.ls-risk-title {
  font-size: 15px;
  font-weight: 600;
  color: var(--c-ink);
  margin-bottom: 6px;
}

.ls-risk-desc {
  font-size: 12px;
  color: var(--c-ink-3);
  line-height: 1.4;
}

/* ============== 제출 버튼 ============== */
.ls-submit-row {
  margin-top: 24px;
  text-align: center;
}

.ls-submit-btn {
  font-size: 16px;
  padding: 14px 32px;
  min-width: 200px;
}

/* ============== 결과 영역 ============== */
.ls-result {
  max-width: 720px;
  margin: 0 auto;
  padding: 0 16px;
}

.ls-result-block {
  background: #fff;
  border: 1px solid var(--c-line);
  border-radius: var(--r-md);
  padding: 24px;
  margin-bottom: 16px;
  box-shadow: var(--shadow-sm);
}

.ls-result-block h3 {
  font-size: 18px;
  font-weight: 600;
  color: var(--c-ink);
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.ls-block-content p {
  font-size: 15px;
  color: var(--c-ink-2);
  line-height: 1.7;
  margin: 4px 0;
}

.ls-block-content strong {
  color: var(--c-ink);
  font-weight: 600;
}

.ls-block-note {
  font-size: 13px;
  color: var(--c-ink-3);
  margin-top: 12px;
  padding: 8px 12px;
  background: var(--c-bg);
  border-radius: var(--r-sm);
  border-left: 3px solid var(--c-warning);
}

/* ============== 자산 배분 막대 그래프 ============== */
.ls-allocation-bars {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin: 16px 0;
}

.ls-bar {
  display: flex;
  align-items: center;
  gap: 12px;
}

.ls-bar-label {
  width: 56px;
  font-size: 14px;
  font-weight: 600;
  color: var(--c-ink-2);
  text-align: right;
}

.ls-bar-track {
  flex: 1;
  height: 32px;
  background: var(--c-bg);
  border-radius: var(--r-sm);
  overflow: hidden;
  border: 1px solid var(--c-line);
}

.ls-bar-fill {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding-right: 12px;
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  transition: width 0.6s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  overflow: visible;
  min-width: 36px;  /* 텍스트 최소 영역 확보 */
}

.ls-bar-stocks {
  background: linear-gradient(90deg, #3b82f6, #2563eb);
}

.ls-bar-bonds {
  background: linear-gradient(90deg, #10b981, #059669);
}

.ls-bar-cash {
  background: linear-gradient(90deg, #f59e0b, #d97706);
}

/* ============== 결과 액션 (다시 입력 버튼) ============== */
.ls-result-actions {
  text-align: center;
  margin-top: 24px;
}

/* ============== 모바일 반응형 ============== */
@media (max-width: 600px) {
  .ls-header h1 {
    font-size: 26px;
  }

  .ls-field {
    padding: 16px;
  }

  .ls-risk-options {
    grid-template-columns: 1fr;
  }

  .ls-result-block {
    padding: 20px 16px;
  }

  .ls-bar-label {
    width: 48px;
    font-size: 13px;
  }
}

/* ============== 재무 현황 6지표 그리드 (v3.16) ============== */
.ls-metrics-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-top: 16px;
}

.ls-metric {
  padding: 16px 14px;
  background: var(--c-bg);
  border: 1px solid var(--c-line);
  border-radius: var(--r-sm);
}

.ls-metric-label {
  font-size: 12px;
  color: var(--c-ink-3);
  font-weight: 500;
  margin-bottom: 6px;
}

.ls-metric-value {
  font-size: 20px;
  font-weight: 700;
  color: var(--c-ink);
  margin-bottom: 4px;
}

.ls-metric-sub {
  font-size: 11px;
  color: var(--c-ink-3);
  line-height: 1.4;
}

/* ============== 신호 카드 (함정/기회) ============== */
.ls-signal-item {
  padding: 14px 16px;
  border-radius: var(--r-sm);
  margin-bottom: 10px;
  border-left: 4px solid;
}

.ls-signal-item:last-child {
  margin-bottom: 0;
}

.ls-signal-trap {
  background: #fef2f2;
  border-left-color: #ef4444;
}

.ls-signal-opp {
  background: #f0fdf4;
  border-left-color: #10b981;
}

.ls-signal-title {
  font-size: 15px;
  font-weight: 600;
  color: var(--c-ink);
  margin-bottom: 4px;
}

.ls-signal-detail {
  font-size: 13px;
  color: var(--c-ink-2);
  line-height: 1.5;
}

/* ============== 면책 조항 ============== */
.ls-disclaimer {
  background: var(--c-bg);
  border-color: var(--c-line);
}

.ls-disclaimer p {
  font-size: 12px;
  color: var(--c-ink-3);
  line-height: 1.6;
  margin: 0;
}

/* ============== 모바일 반응형 (재무 현황 + 신호) ============== */
@media (max-width: 600px) {
  .ls-metrics-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
  }

  .ls-metric {
    padding: 12px 10px;
  }

  .ls-metric-value {
    font-size: 17px;
  }

  .ls-signal-item {
    padding: 12px 14px;
  }
}

/* ============== AI 인사이트 블록 (v3.16) ============== */
.ls-loading {
  opacity: 0.8;
}

.ls-insight-loading {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 14px;
  color: var(--c-ink-3);
  padding: 8px 0;
  margin: 0;
}

.ls-spinner {
  width: 18px;
  height: 18px;
  border: 2px solid var(--c-line);
  border-top-color: var(--c-brand);
  border-radius: 50%;
  display: inline-block;
  animation: ls-spin 0.8s linear infinite;
}

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

.ls-insight-badge {
  display: inline-block;
  font-size: 11px;
  color: var(--c-ink-3);
  background: var(--c-brand-soft);
  padding: 3px 10px;
  border-radius: var(--r-sm);
  margin: 4px 0 12px 0;
  font-weight: 500;
}

.ls-insight-summary {
  font-size: 14px;
  color: var(--c-ink-2);
  line-height: 1.7;
  padding: 16px;
  background: var(--c-bg);
  border-radius: var(--r-sm);
  border-left: 3px solid var(--c-brand);
  margin-bottom: 20px;
  white-space: pre-line;
}

.ls-actions-header {
  font-size: 14px;
  font-weight: 600;
  color: var(--c-ink);
  margin-bottom: 12px;
}

.ls-actions-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.ls-action-item {
  display: flex;
  gap: 12px;
  padding: 14px 16px;
  background: #fff;
  border: 1px solid var(--c-line);
  border-radius: var(--r-sm);
}

.ls-action-num {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--c-brand);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ls-action-body {
  flex: 1;
}

.ls-action-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--c-ink);
  margin-bottom: 4px;
}

.ls-action-detail {
  font-size: 13px;
  color: var(--c-ink-2);
  line-height: 1.6;
}

/* 모바일 */
@media (max-width: 600px) {
  .ls-insight-summary {
    padding: 12px 14px;
    font-size: 13px;
  }

  .ls-action-item {
    padding: 12px 14px;
  }
}

/* ============== 아코디언 소섹션 (v3.16-A) ============== */
.ls-subsection {
  margin-top: 12px;
  margin-bottom: 12px;
  border: 1px solid var(--c-line);
  border-radius: var(--r-md);
  background: #fff;
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  transition: box-shadow 0.2s ease;
}

.ls-subsection[open] {
  box-shadow: var(--shadow-md);
}

.ls-subsection-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  cursor: pointer;
  list-style: none;
  user-select: none;
  transition: background 0.15s ease;
}

/* details 기본 마커 제거 (크롬/사파리/파이어폭스) */
.ls-subsection-header::-webkit-details-marker {
  display: none;
}
.ls-subsection-header::marker {
  display: none;
}

.ls-subsection-header:hover {
  background: var(--c-bg);
}

.ls-subsection[open] .ls-subsection-header {
  border-bottom: 1px solid var(--c-line);
  background: var(--c-brand-soft);
}

.ls-subsection-label {
  font-size: 15px;
  font-weight: 600;
  color: var(--c-ink);
}

.ls-subsection-meta {
  display: flex;
  align-items: center;
  gap: 12px;
}

.ls-subsection-count {
  font-size: 12px;
  color: var(--c-ink-3);
  background: var(--c-bg);
  padding: 3px 10px;
  border-radius: 12px;
  font-weight: 500;
}

.ls-subsection[open] .ls-subsection-count {
  background: #fff;
}

.ls-subsection-chevron {
  font-size: 11px;
  color: var(--c-ink-3);
  transition: transform 0.2s ease;
  display: inline-block;
}

.ls-subsection[open] .ls-subsection-chevron {
  transform: rotate(180deg);
}

.ls-subsection-body {
  padding: 16px 20px;
  animation: ls-slide-down 0.2s ease;
}

@keyframes ls-slide-down {
  from {
    opacity: 0;
    transform: translateY(-8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* 아코디언 안의 .ls-field — 흰 배경 카드 → 옅은 배경으로 변경 (아코디언이 카드 역할) */
.ls-subsection-body .ls-field {
  background: var(--c-bg);
  border: 1px solid var(--c-line);
  box-shadow: none;
  margin-bottom: 10px;
}

.ls-subsection-body .ls-field:last-child {
  margin-bottom: 0;
}

.ls-subsection-body .ls-field:focus-within {
  background: #fff;
  border-color: var(--c-brand);
  box-shadow: var(--shadow-sm);
}

/* 모바일 */
@media (max-width: 600px) {
  .ls-subsection-header {
    padding: 14px 16px;
  }

  .ls-subsection-label {
    font-size: 14px;
  }

  .ls-subsection-body {
    padding: 12px 14px;
  }
}

/* ============== 자산 배분 비교 (v3.16-A 옵션 A) ============== */
.ls-allocation-compare {
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin-top: 16px;
}

.ls-allocation-section {
  padding: 16px;
  background: var(--c-bg);
  border-radius: var(--r-sm);
  border: 1px solid var(--c-line);
}

.ls-allocation-section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
  gap: 12px;
  flex-wrap: wrap;
}

.ls-allocation-section-title {
  font-size: 14px;
  font-weight: 700;
  color: var(--c-ink);
}

.ls-allocation-section-meta {
  font-size: 12px;
  color: var(--c-ink-3);
  font-weight: 500;
}

.ls-note-info {
  border-left-color: var(--c-brand) !important;
}

/* 모바일 */
@media (max-width: 600px) {
  .ls-allocation-compare {
    gap: 16px;
  }

  .ls-allocation-section {
    padding: 12px;
  }

  .ls-allocation-section-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }
}
/* ============================================
   향후 순자산 시뮬 — 연도별 상세 보기 테이블
   ============================================ */
.ls-detail-table-box {
  background: rgba(99, 102, 241, 0.03);
  border: 1px solid rgba(99, 102, 241, 0.15);
  border-radius: 8px;
  margin-top: 12px;
  margin-bottom: 12px;
  overflow: hidden;
}
.ls-detail-table-summary {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  cursor: pointer;
  font-size: 13px;
  font-weight: 600;
  user-select: none;
  list-style: none;
}
.ls-detail-table-summary::-webkit-details-marker { display: none; }
.ls-detail-table-summary::before {
  content: '▸';
  font-size: 10px;
  color: var(--c-ink-4, #9ca3af);
  margin-right: 2px;
  transition: transform 0.15s;
}
.ls-detail-table-box[open] .ls-detail-table-summary::before { transform: rotate(90deg); }
.ls-detail-table-hint {
  flex: 1;
  font-size: 11px;
  font-weight: 400;
  color: var(--c-ink-3, #6b7280);
  text-align: right;
}
.ls-detail-table-controls {
  display: flex;
  gap: 18px;
  flex-wrap: wrap;
  padding: 10px 14px;
  border-top: 1px dashed rgba(99, 102, 241, 0.15);
  font-size: 12px;
  align-items: center;
}
.ls-detail-control {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.ls-detail-control-label {
  font-weight: 600;
  color: var(--c-ink-2, #374151);
}
.ls-detail-select {
  padding: 5px 10px;
  border: 1px solid var(--c-border, #e5e7eb);
  border-radius: 4px;
  font-size: 12px;
  background: #fff;
  font-family: inherit;
}
.ls-detail-table-wrap {
  overflow-x: auto;
  max-height: 480px;
  overflow-y: auto;
  padding: 0 14px;
}
.ls-detail-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 11.5px;
}
.ls-detail-table th {
  background: #f9fafb;
  padding: 6px 8px;
  text-align: right;
  font-weight: 600;
  color: var(--c-ink-3, #6b7280);
  border-bottom: 1px solid var(--c-border, #e5e7eb);
  position: sticky;
  top: 0;
  z-index: 1;
}
.ls-detail-table th:first-child,
.ls-detail-table th:nth-child(2) { text-align: left; }
.ls-detail-table th:nth-child(6) { text-align: left; }
.ls-detail-table td {
  padding: 5px 8px;
  text-align: right;
  border-bottom: 1px dashed rgba(0,0,0,0.05);
  font-family: 'SF Mono', Menlo, monospace;
  color: var(--c-ink, #111827);
}
.ls-detail-table td:first-child,
.ls-detail-table td:nth-child(2) { text-align: left; font-family: inherit; }
.ls-detail-table td:nth-child(6) {
  text-align: left;
  font-family: inherit;
  color: var(--c-ink-2, #374151);
}
.ls-detail-pos {
  color: #047857;
}
.ls-detail-end {
  font-weight: 700;
}
.ls-detail-row-event {
  background: rgba(245, 158, 11, 0.08);
}
.ls-detail-row-retire {
  background: rgba(99, 102, 241, 0.08);
}
.ls-detail-event-delta {
  font-size: 10.5px;
  color: #dc2626;
  font-weight: 600;
  margin-left: 4px;
}
.ls-detail-empty {
  padding: 30px;
  text-align: center;
  color: var(--c-ink-3, #6b7280);
  font-size: 13px;
}
.ls-detail-table-footer {
  padding: 12px 14px 14px;
  font-size: 11.5px;
  color: var(--c-ink-2, #374151);
  line-height: 1.55;
}
.ls-detail-def-title {
  font-weight: 700;
  margin-bottom: 6px;
  color: var(--c-ink, #111);
}
.ls-detail-def-list {
  list-style: none;
  padding: 0 0 0 4px;
  margin: 0 0 8px;
}
.ls-detail-def-list li {
  padding: 3px 0;
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.ls-detail-def-list li strong {
  min-width: 44px;
  color: var(--c-brand, #5b6ee1);
  font-weight: 700;
}
.ls-detail-def-list li em {
  color: var(--c-ink-3, #6b7280);
  font-style: normal;
  font-size: 11px;
}
/* v4.0 #90: 정의 라벨 — bold 대신 작은 chip 형태 */
.ls-detail-def-term {
  display: inline-block;
  min-width: 44px;
  padding: 1px 8px;
  margin-right: 6px;
  background: var(--c-brand-soft, #eef2ff);
  color: var(--c-brand, #5b6ee1);
  border-radius: 10px;
  font-size: 10.5px;
  font-weight: 600;
  text-align: center;
}
.ls-detail-def-warn {
  padding: 8px 10px;
  background: rgba(245, 158, 11, 0.08);
  border-left: 3px solid #f59e0b;
  border-radius: 4px;
  font-size: 11px;
  color: var(--c-ink-2, #374151);
  line-height: 1.5;
  margin-top: 4px;
}

/* ============================================
   진단 결과 Sub-탭 (3그룹: 현재·영역·미래)
   ============================================ */
.ls-result-subtabs {
  display: flex;
  gap: 4px;
  margin-bottom: 20px;
  padding: 4px;
  background: var(--c-brand-soft, #eef2ff);
  border-radius: 8px;
}
.ls-result-subtab {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 10px 14px;
  border: none;
  background: transparent;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 600;
  color: var(--c-ink-3, #6b7280);
  cursor: pointer;
  transition: all 0.15s;
}
.ls-result-subtab:hover {
  background: rgba(255, 255, 255, 0.6);
  color: var(--c-ink, #111827);
}
.ls-result-subtab.active {
  background: var(--c-brand, #5b6ee1);
  color: #fff;
  box-shadow: 0 2px 6px rgba(91, 110, 225, 0.25);
}
.ls-result-subtab-icon {
  font-size: 16px;
}
.ls-result-subtab-pane {
  display: none;
  animation: ls-subtab-fade 0.2s ease;
}
.ls-result-subtab-pane.active {
  display: block;
}
@keyframes ls-subtab-fade {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 600px) {
  .ls-result-subtab {
    padding: 8px 10px;
    font-size: 12px;
  }
  .ls-result-subtab span:not(.ls-result-subtab-icon) {
    display: none;
  }
}

/* ============================================
   미래 시뮬 — 자산 항목 요약 + 섹션 헤더
   ============================================ */
.ls-future-sec-title {
  font-size: 15px;
  font-weight: 700;
  color: var(--c-ink, #111827);
  margin: 0 0 8px 0;
  display: flex;
  align-items: center;
  gap: 6px;
}
.ls-asset-summary {
  background: #fafbfc;
  border: 1px solid var(--c-border, #e5e7eb);
  border-radius: 8px;
  padding: 12px 14px;
}
.ls-asset-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 8px;
  margin-bottom: 12px;
}
.ls-asset-cell {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 10px;
  background: #fff;
  border: 1px solid var(--c-border, #e5e7eb);
  border-radius: 6px;
  font-size: 12.5px;
}
.ls-asset-cell.ls-asset-debt {
  border-left: 3px solid #ef4444;
}
.ls-asset-cell.ls-asset-asset {
  border-left: 3px solid var(--c-brand, #5b6ee1);
}
.ls-asset-icon {
  font-size: 14px;
}
.ls-asset-label {
  flex: 1;
  color: var(--c-ink-2, #374151);
  font-weight: 500;
}
.ls-asset-value {
  font-weight: 700;
  font-family: 'SF Mono', Menlo, monospace;
  color: var(--c-ink, #111827);
}
.ls-asset-cell.ls-asset-debt .ls-asset-value {
  color: #dc2626;
}
.ls-asset-totals {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  padding: 8px 10px;
  border-top: 1px dashed var(--c-border, #e5e7eb);
  font-size: 12.5px;
  color: var(--c-ink-3, #6b7280);
}
.ls-asset-totals strong {
  color: var(--c-ink, #111827);
  font-family: 'SF Mono', Menlo, monospace;
  margin-left: 4px;
}
.ls-asset-totals .ls-asset-net {
  color: var(--c-brand, #5b6ee1);
  font-weight: 700;
}
.ls-asset-totals .ls-asset-net strong {
  color: var(--c-brand, #5b6ee1);
}

/* detail 테이블 펼침 default — details 토글 대신 항상 보이게 */
.ls-detail-table-controls {
  margin-top: 10px;
  margin-bottom: 8px;
  font-size: 12px;
}

/* ============================================
   9지표 계산 기준 토글 박스 (보장 매트릭스 패턴)
   ============================================ */
.ls-metric-basis-box {
  background: rgba(99, 102, 241, 0.04);
  border: 1px solid rgba(99, 102, 241, 0.18);
  border-radius: 8px;
  margin-bottom: 14px;
  overflow: hidden;
}
.ls-metric-basis-summary {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  cursor: pointer;
  font-size: 13px;
  user-select: none;
  list-style: none;
}
.ls-metric-basis-summary::-webkit-details-marker { display: none; }
.ls-metric-basis-summary::before {
  content: '▸';
  font-size: 10px;
  color: var(--c-ink-4, #9ca3af);
  margin-right: 2px;
  transition: transform 0.15s;
}
.ls-metric-basis-box[open] .ls-metric-basis-summary::before { transform: rotate(90deg); }
.ls-metric-basis-icon { font-size: 16px; }
.ls-metric-basis-title { font-weight: 700; color: var(--c-ink, #111827); }
.ls-metric-basis-hint {
  flex: 1;
  font-size: 11px;
  color: var(--c-ink-3, #6b7280);
  text-align: right;
}
.ls-metric-basis-list {
  padding: 4px 14px 12px;
  border-top: 1px dashed rgba(99, 102, 241, 0.18);
}
.ls-metric-basis-row {
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 10px;
  align-items: baseline;
  padding: 8px 0;
  font-size: 12px;
  border-bottom: 1px dashed rgba(0,0,0,0.05);
}
.ls-metric-basis-row:last-of-type { border-bottom: none; }
.ls-mb-name {
  font-weight: 600;
  color: var(--c-ink-2, #374151);
}
.ls-mb-formula {
  color: var(--c-ink-2, #374151);
  line-height: 1.6;
}
.ls-mb-formula strong {
  color: var(--c-brand, #5b6ee1);
  font-weight: 700;
}
.ls-mb-formula em {
  display: block;
  margin-top: 4px;
  font-style: normal;
  font-size: 11px;
  color: var(--c-ink-3, #6b7280);
}

/* 시나리오 카드 — 수익률 라벨 + 인출 sub */
.ls-stat-rate {
  font-size: 11px;
  font-weight: 500;
  color: var(--c-ink-3, #6b7280);
  margin-left: 4px;
}
.ls-stat-sub-line {
  font-size: 11.5px;
  color: var(--c-ink-3, #6b7280);
  margin-top: 2px;
  line-height: 1.4;
}
.ls-stat-sub-line.ls-stat-withdraw {
  color: var(--c-ink-2, #374151);
}
.ls-stat-sub-line.ls-stat-withdraw strong {
  color: var(--c-brand, #5b6ee1);
}

/* detail 테이블 — 인출 셀 */
.ls-detail-neg { color: #dc2626; font-weight: 600; }
.ls-detail-muted { color: var(--c-ink-4, #9ca3af); }

/* 개선 시나리오 카드 — reason + 효과 */
.ls-stat-improvement-detail {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px dashed rgba(245, 158, 11, 0.3);
}
.ls-stat-imp-reason {
  font-size: 11.5px;
  color: var(--c-ink-2, #374151);
  line-height: 1.5;
  margin-bottom: 4px;
}
.ls-stat-imp-delta {
  font-size: 11.5px;
  color: #047857;
  font-weight: 500;
}
.ls-stat-imp-delta strong {
  color: #059669;
  font-weight: 700;
}

/* 미래 시뮬 sub-title (차트/시나리오 카드/상세 구분) */
.ls-future-sub-title {
  font-size: 13px;
  font-weight: 700;
  color: var(--c-ink-2, #374151);
  margin: 18px 0 8px 0;
  padding-top: 12px;
  border-top: 1px dashed var(--c-border, #e5e7eb);
}
.ls-future-sub-title:first-of-type {
  border-top: none;
  padding-top: 0;
}

/* ============================================================
   사망 시점 상속세 자동 추정 카드 (25세션 Phase D 옵션 A)
   ============================================================ */
.ls-inheritance-card {
  margin-top: 24px;
  padding: 20px;
  background: linear-gradient(135deg, rgba(251,191,36,0.06), rgba(239,68,68,0.04));
  border: 1px solid rgba(251,191,36,0.25);
  border-left: 4px solid #f59e0b;
  border-radius: 12px;
}
.ls-inh-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  padding-bottom: 14px;
  border-bottom: 1px dashed rgba(251,191,36,0.3);
  margin-bottom: 16px;
}
.ls-inh-title {
  font-size: 16px;
  font-weight: 700;
  color: #b45309;
  margin: 0 0 4px;
}
.ls-inh-sub {
  font-size: 12.5px;
  color: var(--c-ink-3, #6b7280);
  line-height: 1.5;
}
.ls-inh-tax-value {
  font-size: 32px;
  font-weight: 800;
  color: #dc2626;
  letter-spacing: -0.02em;
  line-height: 1;
  white-space: nowrap;
}
.ls-inh-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-bottom: 16px;
}
.ls-inh-stat {
  background: white;
  padding: 12px 14px;
  border-radius: 8px;
  border: 1px solid rgba(0,0,0,0.05);
}
.ls-inh-stat-label {
  font-size: 11px;
  color: var(--c-ink-3, #9ca3af);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 4px;
}
.ls-inh-stat-value {
  font-size: 18px;
  font-weight: 700;
  color: var(--c-ink, #111827);
  letter-spacing: -0.01em;
}
.ls-inh-stat-meta {
  font-size: 11px;
  color: var(--c-ink-3, #6b7280);
  margin-top: 4px;
  line-height: 1.4;
}
.ls-inh-shock {
  padding: 12px 14px;
  background: rgba(239,68,68,0.06);
  border-left: 3px solid #ef4444;
  border-radius: 6px;
  font-size: 13px;
  line-height: 1.6;
  color: var(--c-ink-2, #4b5563);
  margin-bottom: 16px;
}
.ls-inh-shock strong { color: #b91c1c; }
.ls-inh-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}
.ls-inh-btn {
  background: white;
  border: 1px solid var(--c-line, #e5e7eb);
  color: var(--c-ink, #111827);
  padding: 9px 14px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  font-family: inherit;
  transition: all 0.15s;
}
.ls-inh-btn:hover {
  border-color: var(--c-brand, #5b6ee1);
  background: rgba(91,110,225,0.04);
}
.ls-inh-btn-primary {
  background: var(--c-brand, #5b6ee1);
  color: white;
  border-color: var(--c-brand, #5b6ee1);
  font-weight: 600;
}
.ls-inh-btn-primary:hover {
  background: #4f5dd0;
  border-color: #4f5dd0;
}
.ls-inh-disclaimer {
  font-size: 11.5px;
  color: var(--c-ink-3, #6b7280);
  line-height: 1.55;
  margin-top: 12px;
  padding: 10px 12px;
  background: rgba(245, 158, 11, 0.06);
  border-left: 3px solid #f59e0b;
  border-radius: 4px;
}
.ls-inh-disclaimer-title {
  font-weight: 700;
  color: var(--c-ink-2, #374151);
  margin-bottom: 4px;
}
.ls-inh-disclaimer-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.ls-inh-disclaimer-list li {
  padding: 3px 0;
  padding-left: 14px;
  position: relative;
}
.ls-inh-disclaimer-list li::before {
  content: "·";
  position: absolute;
  left: 4px;
  color: var(--c-ink-4, #d1d5db);
  font-weight: 700;
}
.ls-inh-disclaimer-list li strong {
  color: var(--c-ink-2, #374151);
}

.ls-inh-zero {
  border-left-color: #94a3b8;
  background: var(--c-bg, #f9fafb);
}
.ls-inh-zero-msg {
  font-size: 13px;
  color: var(--c-ink-3, #6b7280);
}

@media (max-width: 640px) {
  .ls-inh-grid { grid-template-columns: 1fr; }
  .ls-inh-tax-value { font-size: 26px; }
  .ls-inh-header { flex-direction: column; }
}

/* 옵션 B: 절세 시나리오 비교 표 */
.ls-inh-scenario-card {
  margin: 16px 0;
  padding: 14px 16px;
  background: rgba(34,197,94,0.05);
  border: 1px solid rgba(34,197,94,0.2);
  border-radius: 8px;
}
.ls-inh-scenario-title {
  font-size: 13px;
  font-weight: 700;
  color: #15803d;
  margin-bottom: 10px;
}
.ls-inh-scenario-table {
  width: 100%;
  border-collapse: collapse;
  background: white;
  border-radius: 6px;
  overflow: hidden;
  font-size: 12.5px;
}
.ls-inh-scenario-table th,
.ls-inh-scenario-table td {
  padding: 8px 10px;
  text-align: left;
  border-bottom: 1px solid rgba(0,0,0,0.05);
}
.ls-inh-scenario-table th {
  background: var(--c-bg, #f9fafb);
  font-size: 11px;
  font-weight: 600;
  color: var(--c-ink-3, #6b7280);
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.ls-inh-scenario-table td.num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.ls-inh-scenario-table td.emp {
  font-weight: 700;
  color: var(--c-ink, #111827);
}
.ls-inh-scenario-table td.saved {
  color: #16a34a;
  font-weight: 600;
}
.ls-inh-scenario-table tr.best {
  background: rgba(34,197,94,0.06);
}
.ls-inh-scenario-table tr.best td:first-child {
  font-weight: 600;
}
.ls-inh-scenario-tip {
  margin-top: 10px;
  font-size: 12px;
  color: var(--c-ink-2, #374151);
  line-height: 1.6;
}
.ls-inh-scenario-tip strong { color: #b91c1c; }
.ls-inh-scenario-skip {
  margin: 12px 0;
  padding: 10px 14px;
  background: var(--c-bg, #f9fafb);
  border-radius: 6px;
  font-size: 12.5px;
  color: var(--c-ink-3, #6b7280);
}

/* 옵션 C: AI 맞춤 절세 전략 카드 */
.ls-inh-ai-pending {
  margin: 16px 0;
  padding: 16px;
  background: var(--c-bg, #f9fafb);
  border-radius: 8px;
}
.ls-inh-ai-loading {
  font-size: 13px;
  color: var(--c-ink-3, #6b7280);
  text-align: center;
  padding: 12px;
}
.ls-inh-ai-card {
  margin: 16px 0;
  padding: 16px;
  background: linear-gradient(135deg, rgba(91,110,225,0.06), rgba(168,85,247,0.04));
  border: 1px solid rgba(91,110,225,0.25);
  border-radius: 10px;
}
.ls-inh-ai-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}
.ls-inh-ai-badge {
  font-size: 13px;
  font-weight: 700;
  color: #4338ca;
  background: rgba(91,110,225,0.12);
  padding: 4px 10px;
  border-radius: 999px;
}
.ls-inh-ai-model {
  font-size: 11px;
  color: var(--c-ink-3, #9ca3af);
  font-family: 'SF Mono', Menlo, monospace;
}
.ls-inh-ai-summary {
  font-size: 14px;
  font-weight: 600;
  color: var(--c-ink, #111827);
  line-height: 1.5;
  margin-bottom: 14px;
  padding: 10px 14px;
  background: rgba(255,255,255,0.6);
  border-radius: 6px;
}
.ls-inh-ai-steps {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 14px;
}
.ls-inh-ai-step {
  display: flex;
  gap: 12px;
  background: white;
  padding: 12px 14px;
  border-radius: 8px;
  border-left: 3px solid var(--c-brand, #5b6ee1);
}
.ls-inh-ai-step-order {
  font-size: 13px;
  font-weight: 700;
  color: var(--c-brand, #5b6ee1);
  flex-shrink: 0;
  min-width: 100px;
}
.ls-inh-ai-step-body { flex: 1; }
.ls-inh-ai-step-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--c-ink, #111827);
  margin-bottom: 4px;
  line-height: 1.4;
}
.ls-inh-ai-step-detail {
  font-size: 12.5px;
  color: var(--c-ink-2, #4b5563);
  line-height: 1.6;
}
.ls-inh-ai-step-benefit {
  margin-top: 6px;
  font-size: 12px;
  color: #15803d;
  font-weight: 600;
}
.ls-inh-ai-warnings {
  margin-bottom: 14px;
  padding: 10px 14px;
  background: rgba(239,68,68,0.05);
  border-left: 3px solid #ef4444;
  border-radius: 6px;
}
.ls-inh-ai-warnings-title {
  font-size: 12px;
  font-weight: 700;
  color: #b91c1c;
  margin-bottom: 6px;
}
.ls-inh-ai-warnings ul {
  margin: 0;
  padding-left: 18px;
  font-size: 12px;
  color: var(--c-ink-2, #374151);
  line-height: 1.6;
}
.ls-inh-ai-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}