@charset "UTF-8";

/* ======================================== *
 * 대학점수산출 페이지 전용 스타일
 * ======================================== */

/* ── 필터 섹션 오버라이드 ── */
.sc-filter-sec { margin-top: 0; }

/* ── 대학구분 토글 ── */
.univ-category-toggle {
  display: flex;
  gap: 0.8rem;
  margin-bottom: 1.5rem;
}
.univ-category-toggle .toggle-btn {
  padding: 0.8rem 2.4rem;
  border: 1px solid #dadada;
  background: #fff;
  font-size: 1.4rem;
  font-weight: 600;
  color: #505050;
  cursor: pointer;
  border-radius: 20rem;
  transition: all 0.2s;
  font-family: inherit;
}
.univ-category-toggle .toggle-btn:hover { color: #0891b2; border-color: #0891b2; }
.univ-category-toggle .toggle-btn.active { background: #0891b2; color: #fff; border-color: #0891b2; }

/* ── 전형 탭 ── */
.type-tab-bar {
  display: flex;
  gap: 0.6rem;
  flex-wrap: wrap;
  margin-bottom: 1.5rem;
}
.type-tab-bar .type-tab-btn {
  padding: 0.7rem 1.8rem;
  border: 1px solid #dadada;
  background: #fff;
  font-size: 1.3rem;
  font-weight: 600;
  color: #505050;
  cursor: pointer;
  border-radius: 20rem;
  transition: all 0.2s;
  font-family: inherit;
}
.type-tab-bar .type-tab-btn:hover { color: #0891b2; border-color: #0891b2; }
.type-tab-bar .type-tab-btn.active { background: #0891b2; color: #fff; border-color: #0891b2; }

/* ── 결과 카드 ── */
.sc-result-section {
  margin-top: 3rem;
}
.sc-result-card {
  background: #fff;
  border: 1px solid #ebebeb;
  border-radius: 1.2rem;
  overflow: hidden;
}
.sc-result-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 2rem 2.4rem;
  background: #f8f9fb;
  border-bottom: 1px solid #ebebeb;
  flex-wrap: wrap;
  gap: 1rem;
}
.sc-result-header .result-title {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}
.sc-result-header .result-title .univ-name {
  font-size: 2rem;
  font-weight: 700;
  color: #202020;
}
.sc-result-header .result-title .dept-info {
  font-size: 1.4rem;
  color: #505050;
}

.sc-result-body {
  padding: 2.4rem;
}

/* 내 성적 요약 */
.my-grade-box {
  display: flex;
  align-items: center;
  gap: 2rem;
  padding: 2rem 2.4rem;
  background: #f0f6ff;
  border-radius: 1rem;
  margin-bottom: 2.4rem;
  flex-wrap: wrap;
}
.my-grade-box .grade-label {
  font-size: 1.4rem;
  color: #505050;
  font-weight: 600;
}
.my-grade-box .grade-value {
  font-size: 2.4rem;
  font-weight: 700;
  color: #0891b2;
}
.my-grade-box .grade-sub {
  font-size: 1.3rem;
  color: #808080;
}

/* 커트라인 비교 테이블 */
.cutline-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 1.4rem;
  margin-bottom: 2rem;
}
.cutline-table thead th {
  background: #f8f9fb;
  padding: 1.2rem 1.6rem;
  font-weight: 600;
  color: #505050;
  border-bottom: 2px solid #101010;
  text-align: center;
  white-space: nowrap;
}
.cutline-table tbody td {
  padding: 1.2rem 1.6rem;
  border-bottom: 1px solid #ebebeb;
  text-align: center;
  vertical-align: middle;
}
.cutline-table tbody td.label-cell {
  font-weight: 600;
  color: #202020;
  text-align: left;
  background: #fafafa;
}
.cutline-table .highlight-cell {
  font-weight: 700;
  color: #0891b2;
  font-size: 1.6rem;
}

/* 부가 정보 */
.sc-extra-info {
  display: flex;
  gap: 2.4rem;
  flex-wrap: wrap;
}
.sc-extra-item {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}
.sc-extra-item .extra-label {
  font-size: 1.3rem;
  color: #808080;
}
.sc-extra-item .extra-value {
  font-size: 1.6rem;
  font-weight: 700;
  color: #202020;
}

/* 성적 미입력 안내 */
.no-grade-notice {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.2rem;
  padding: 4rem 2rem;
  text-align: center;
}
.no-grade-notice .notice-icon {
  font-size: 4rem;
  color: #dadada;
}
.no-grade-notice .notice-text {
  font-size: 1.6rem;
  color: #505050;
}

/* ── 결과 리스트 (학과 카드 그리드) ── */
.sc-dept-results {
  margin-top: 2rem;
}
.dept-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(28rem, 1fr));
  gap: 1.2rem;
}
.dept-card {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  padding: 2rem 2.2rem;
  background: #fff;
  border: 1.5px solid #0891b2;
  border-radius: 1.2rem;
  cursor: pointer;
  transition: all 0.2s ease;
}
.dept-card.unavailable {
  border-color: #cbd5e1;
}
.dept-card:hover {
  border-color: #0e7490;
  box-shadow: 0 0.2rem 1.2rem rgba(8,145,178,0.18);
  transform: translateY(-0.1rem);
}
.dept-card.unavailable:hover { border-color: #94a3b8; }
.dept-card .card-dept {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.6rem 0.8rem;
  font-size: 1.6rem;
  font-weight: 700;
  color: #202020;
  letter-spacing: -0.03rem;
}
.dept-card .card-type {
  font-size: 1.3rem;
  color: #0891b2;
  font-weight: 500;
}
.dept-card .card-meta {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  flex-wrap: wrap;
  margin-top: 0.4rem;
}
.dept-card .card-meta span {
  font-size: 1.2rem;
  color: #808080;
  padding: 0.2rem 0.8rem;
  background: #f8f9fb;
  border-radius: 0.4rem;
}
/* 전형구분 + 모집인원 한 줄 배치 */
.dept-card .card-info-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.6rem;
  margin-top: 0.4rem;
}
.dept-card .card-info-row .card-type {
  flex: 0 0 auto;
}
.dept-card .card-info-row .card-meta-item {
  font-size: 1.2rem;
  color: #808080;
  padding: 0.2rem 0.8rem;
  background: #f8f9fb;
  border-radius: 0.4rem;
}
.dept-card-count {
  margin-top: 1rem;
  font-size: 1.2rem;
  color: #808080;
}

/* ── 상세 분석 모달 ── */
.detail-modal-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.45);
  z-index: 9999;
  align-items: center;
  justify-content: center;
  padding: 2rem;
}
.detail-modal-overlay.active {
  display: flex;
}
.detail-modal {
  display: flex;
  flex-direction: column;
  background: #fff;
  border-radius: 1.6rem;
  width: 100%;
  max-width: 108rem;
  max-height: 92vh;
  overflow-y: auto;
  box-shadow: 0 0.8rem 3.2rem rgba(0,0,0,0.2);
  animation: detailIn 0.2s ease;
}
@keyframes detailIn {
  from { opacity: 0; transform: scale(0.95) translateY(1rem); }
  to { opacity: 1; transform: scale(1) translateY(0); }
}
.detail-modal-header {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  padding: 1.4rem 2.4rem;
  border-bottom: none;
  background: #1a2740;
  position: sticky;
  top: 0;
  z-index: 10;
  flex-shrink: 0;
}
.detail-univ {
  font-size: 1.6rem;
  font-weight: 700;
  color: #fff;
  letter-spacing: -0.03rem;
  white-space: nowrap;
}
.detail-header-sep {
  color: rgba(255,255,255,0.2);
  font-size: 1.2rem;
  flex-shrink: 0;
  margin: 0 0.4rem;
}
.detail-type {
  font-size: 1.5rem;
  color: rgba(255,255,255,0.6);
  font-weight: 600;
  white-space: nowrap;
  flex-shrink: 0;
}
.detail-dept {
  font-size: 1.6rem;
  color: #fff;
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.detail-modal-close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3.2rem;
  height: 3.2rem;
  border: none;
  background: none;
  cursor: pointer;
  font-size: 2.2rem;
  color: rgba(255,255,255,0.6);
  border-radius: 0.6rem;
  transition: background 0.15s;
  flex-shrink: 0;
  margin-left: auto;
}
.detail-modal-close:hover {
  background: rgba(255,255,255,0.1);
}
.detail-tab-bar {
  display: flex;
  background: #f0f2f5;
  border-bottom: 1px solid #e0e3e8;
  position: sticky;
  top: 0;
  z-index: 9;
  flex-shrink: 0;
}
.detail-tab {
  flex: 1;
  padding: 1.2rem 1rem;
  font-size: 1.35rem;
  font-weight: 600;
  color: #808890;
  background: none;
  border: none;
  border-bottom: 3px solid transparent;
  cursor: pointer;
  transition: color 0.2s, border-color 0.2s, background 0.2s;
  white-space: nowrap;
}
.detail-tab:hover {
  color: #404040;
  background: #e8eaee;
}
.detail-tab.active {
  color: #0891b2;
  border-bottom-color: #0891b2;
  background: #fff;
}
.detail-modal-body {
  padding: 2.4rem;
  background: #fafbfc;
}
.detail-modal .detail-modal-body .detail-modal-footer {
  display: flex !important;
  justify-content: flex-end !important;
  width: 100%;
  margin-top: 2rem;
  padding-top: 1.6rem;
  border-top: 1px solid #ebebeb;
  text-align: right;
}
.detail-modal .detail-modal-body .detail-modal-close-btn {
  display: inline-flex !important;
  align-items: center;
  gap: 0.5rem;
  margin-left: auto !important;
  padding: 1rem 2.4rem;
  background: #202020;
  color: #fff;
  border: none;
  border-radius: 0.8rem;
  font-size: 1.4rem;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
  transition: background 0.15s;
}
.detail-modal .detail-modal-body .detail-modal-close-btn i { font-size: 1.8rem; }
.detail-modal .detail-modal-body .detail-modal-close-btn:hover { background: #000; }

/* ── 탭2: 대학발표 입결 ── */
.ea-intro {
  display: flex;
  align-items: flex-start;
  gap: 1.2rem;
  background: linear-gradient(135deg, #f0f7ff 0%, #e8f4fd 100%);
  border: 1px solid #c8ddf0;
  border-radius: 1.2rem;
  padding: 1.6rem;
  margin-bottom: 1.6rem;
}
.ea-intro-icon {
  font-size: 2.8rem;
  color: #3b82f6;
  line-height: 1;
  flex-shrink: 0;
}
.ea-intro-text strong {
  font-size: 1.4rem;
  color: #1a3a5c;
  display: block;
  margin-bottom: 0.3rem;
}
.ea-intro-text p {
  font-size: 1.25rem;
  color: #5a7a9a;
  margin: 0.4rem 0 0;
  line-height: 1.6;
}
.ea-intro-sub {
  font-size: 1.2rem !important;
  color: #6b8299 !important;
  margin-top: 0.5rem !important;
  padding-left: 0.2rem;
}
.ea-intro-sub i {
  color: #3b82f6;
  font-size: 1.2rem;
  vertical-align: middle;
  margin-right: 0.1rem;
}
.ea-intro-sub b {
  color: #2d5a80;
}
.ea-highlight-sample {
  display: inline-block;
  background: #e8f4fd;
  padding: 0.1rem 0.5rem;
  border-radius: 0.3rem;
  font-size: 1.1rem;
}
.ea-selectors {
  display: flex;
  gap: 1rem;
  margin-bottom: 1.6rem;
  background: #fff;
  border: 1px solid #e2e5ea;
  border-radius: 1.2rem;
  padding: 1.6rem;
  box-shadow: 0 0.2rem 1.2rem rgba(0,0,0,0.06);
}
.ea-select-group {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}
.ea-label {
  font-size: 1.2rem;
  font-weight: 600;
  color: #4a5568;
  display: flex;
  align-items: center;
  gap: 0.3rem;
}
.ea-label i {
  font-size: 1.3rem;
  color: #718096;
}
.ea-select {
  width: 100%;
  padding: 0.9rem 1rem;
  font-size: 1.3rem;
  border: 1px solid #d0d5dd;
  border-radius: 0.8rem;
  background: #fff;
  color: #1a202c;
  cursor: pointer;
  transition: border-color 0.2s, box-shadow 0.2s;
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23666' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 1rem center;
  padding-right: 2.5rem;
}
.ea-select:focus {
  outline: none;
  border-color: #3b82f6;
  box-shadow: 0 0 0 3px rgba(59,130,246,0.15);
}
.ea-select:disabled {
  background: #f5f6f8;
  color: #a0a8b4;
  cursor: not-allowed;
}
.ea-empty {
  text-align: center;
  padding: 3rem 2rem;
  color: #909090;
  font-size: 1.3rem;
}
.ea-empty i {
  font-size: 1.5rem;
  margin-right: 0.4rem;
  vertical-align: middle;
}

/* ─── 비슷한 학과 참고자료 섹션 (EA 매칭 실패 시 대체 UI) ─── */
.ea-similar-section {
  background: #fffbe6;
  border: 1px solid #fde68a;
  border-radius: 0.8rem;
  padding: 1.6rem;
  margin-top: 1rem;
}
.ea-similar-empty {
  background: #f7f7f7;
  border-color: #e2e5ea;
}
.ea-similar-empty .ea-empty {
  padding: 2rem 1rem;
}
.ea-similar-notice {
  font-size: 1.3rem;
  color: #78551a;
  line-height: 1.6;
  padding: 1rem 1.2rem;
  background: #fff8d6;
  border-left: 3px solid #f59e0b;
  border-radius: 0.4rem;
  margin-bottom: 1.2rem;
}
.ea-similar-notice i {
  margin-right: 0.4rem;
  color: #d97706;
  vertical-align: middle;
}
.ea-similar-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  margin-bottom: 1.2rem;
}
.ea-similar-btn {
  padding: 0.7rem 1.2rem;
  background: #fff;
  border: 1px solid #e2d8a8;
  border-radius: 0.5rem;
  font-size: 1.25rem;
  color: #505050;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s, color 0.15s;
}
.ea-similar-btn:hover {
  background: #fff8d6;
  border-color: #f59e0b;
}
.ea-similar-btn.active {
  background: #f59e0b;
  border-color: #f59e0b;
  color: #fff;
}
.ea-similar-content {
  background: #fff;
  border-radius: 0.6rem;
  padding: 0.8rem;
  min-height: 80px;
}
.ea-similar-placeholder {
  text-align: center;
  padding: 2.5rem 0;
  color: #a0a8b4;
  font-size: 1.3rem;
  margin: 0;
}
.ea-similar-footnote {
  margin: 1rem 0 0;
  padding: 0;
  font-size: 1.15rem;
  color: #92600a;
  text-align: right;
}
.ea-table-wrap {
  overflow-x: auto;
  border-radius: 0.8rem;
  border: 1px solid #e2e5ea;
}
.ea-year-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 1.25rem;
  background: #fff;
  border-radius: 0.6rem;
  overflow: hidden;
  box-shadow: 0 1px 4px rgba(0,0,0,0.08);
}
.ea-year-table thead th {
  background: #f8f9fb;
  padding: 0.8rem 0.6rem;
  font-weight: 600;
  color: #4a5568;
  border-bottom: 2px solid #e2e5ea;
  text-align: center;
  white-space: nowrap;
}
.ea-year-table tbody td {
  padding: 0.7rem 0.6rem;
  text-align: center;
  border-bottom: 1px solid #eef0f3;
  color: #2d3748;
}
.ea-year-table tbody tr:last-child td {
  border-bottom: none;
}
.ea-year-table tbody tr:hover {
  background: #f0f4ff;
}
.ea-year-table thead th,
.ea-year-table tbody th,
.ea-year-table tbody td {
  border: 1px solid #e2e5ea;
}
.ea-year-table tbody th {
  font-weight: 600;
  color: #374151;
  white-space: nowrap;
  text-align: center;
}
.ea-nodata {
  color: #bbb;
}
.ea-row-cut70 td {
  font-weight: 700;
  color: #22c55e;
}
.ea-row-verdict td {
  padding: 0.5rem;
}
.ea-my-grade-bar {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  margin-bottom: 1rem;
  padding: 0.8rem 1.2rem;
  background: #f0f7ff;
  border-radius: 0.6rem;
  border: 1px solid #dbeafe;
}
.ea-my-grade-label {
  font-size: 1.25rem;
  color: #475569;
}
.ea-my-grade-value {
  font-size: 1.6rem;
  color: #2563eb;
}
.verdict-badge-sm {
  display: inline-block;
  padding: 0.2rem 0.5rem;
  border-radius: 0.4rem;
  font-size: 1.1rem;
  font-weight: 600;
  white-space: nowrap;
}
.verdict-badge-sm.safe { background: #dcfce7; color: #166534; }
.verdict-badge-sm.challenge { background: #fef3c7; color: #92400e; }
.verdict-badge-sm.danger { background: #fee2e2; color: #991b1b; }
.verdict-badge-sm.unknown { background: #f1f5f9; color: #64748b; }

/* ── 요약 통계 박스 ── */
.detail-stat-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
  margin-bottom: 2.4rem;
}
.detail-stat-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.8rem;
  min-width: 0;
  padding: 1.6rem 1rem;
  background: #fff;
  border: 1px solid #e2e5ea;
  border-radius: 1rem;
  text-align: center;
  box-shadow: 0 2px 6px rgba(0,0,0,0.06);
}
.detail-stat-box .stat-label {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.4rem;
  font-size: 1.3rem;
  color: #475569;
  font-weight: 600;
  line-height: 1.35;
  word-break: keep-all;
  letter-spacing: -0.02em;
}
.detail-stat-box .stat-source-badge {
  display: inline-block;
  padding: 0.25rem 0.7rem;
  font-size: 1.15rem;
  font-weight: 500;
  letter-spacing: 0;
  background: #0891b2;
  color: #fff;
  border-radius: 0.4rem;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
.detail-stat-box .stat-value {
  font-size: 2.4rem;
  font-weight: 800;
  color: #0f172a;
  letter-spacing: -0.03em;
  line-height: 1.1;
}
.detail-stat-box .stat-value.accent { color: #0891b2; }
.detail-stat-box .stat-year {
  font-size: 1.15rem;
  font-style: normal;
  font-weight: 500;
  color: #64748b;
  letter-spacing: -0.02em;
}
.detail-stat-box.stat-verdict {
  border-color: #e0e7ef;
  background: #fff;
}
.detail-stat-box.stat-verdict .verdict-badge {
  font-size: 1.6rem;
  padding: 0.6rem 1.6rem;
  font-weight: 700;
}
/* "공개자료없음" 등 값 없음 표시는 수치보다 작고 흐린 색으로 */
.detail-stat-box .stat-value.no-data {
  font-size: 1.3rem;
  font-weight: 600;
  color: #94a3b8;
  letter-spacing: -0.02em;
}
.stat-value small {
  font-size: 1.3rem;
  font-weight: 500;
  color: #808080;
}
.stat-value.accent {
  color: #0891b2;
}

/* ── 중단 2컬럼 ── */
.detail-mid-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  margin-bottom: 1rem;
}
.detail-mid-left,
.detail-mid-right {
  min-width: 0;
  display: flex;
  flex-direction: column;
}
/* 2컬럼 안의 섹션은 높이 맞추기 */
.detail-mid-left .detail-section,
.detail-mid-right .detail-section {
  margin-bottom: 0;
  flex: 1;
  display: flex;
  flex-direction: column;
}
.detail-mid-left .detail-section > :last-child,
.detail-mid-right .detail-section > :last-child {
  flex: 1;
}

/* ── 하단 추천 2컬럼 ── */
.detail-rec-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  margin-bottom: 1rem;
}
.detail-rec-col {
  min-width: 0;
}
.detail-rec-col .detail-section {
  margin-bottom: 0;
  height: 100%;
}

/* 커트라인 비교 */
.detail-cutline {
  display: flex;
  flex-direction: column;
  gap: 1.4rem;
}
.cutline-row {
  display: flex;
  align-items: center;
  gap: 1.2rem;
}
.cutline-label {
  width: 5.6rem;
  font-size: 1.3rem;
  font-weight: 600;
  color: #505050;
  text-align: right;
  flex-shrink: 0;
}
.cutline-bar-wrap {
  flex: 1;
  height: 2.8rem;
  background: #f0f1f5;
  border-radius: 0.6rem;
  position: relative;
  overflow: hidden;
}
.cutline-bar-fill {
  height: 100%;
  border-radius: 0.6rem;
  transition: width 0.4s ease;
}
.cutline-bar-fill.cut { background: #dadada; }
.cutline-bar-fill.mine { background: #0891b2; }
.cutline-legend {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  font-size: 1.2rem;
  color: #808080;
  margin-top: 0.6rem;
}
.cutline-legend strong {
  color: #ff4444;
  font-weight: 700;
}
.legend-marker {
  display: inline-block;
  width: 1.2rem;
  height: 1.2rem;
  background: #ff4444;
  border-radius: 0.2rem;
}
.cutline-bar-marker {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 2px;
  background: #ff4444;
  z-index: 1;
}
.cutline-bar-marker::after {
  content: '▼';
  position: absolute;
  top: -1.6rem;
  left: 50%;
  transform: translateX(-50%);
  font-size: 1rem;
  color: #ff4444;
}
.cutline-value {
  width: 4.4rem;
  font-size: 1.4rem;
  font-weight: 700;
  color: #202020;
  text-align: left;
  flex-shrink: 0;
}
.cutline-value.na {
  color: #dadada;
  font-weight: 400;
}

/* ── 커트라인 섹션 내 평균등급 + 판정 ── */
.title-my-grade {
  margin-left: auto;
  font-size: 1.4rem;
  font-weight: 500;
  color: #505050;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.4rem 1.4rem;
  background: #fff0f0;
  border: 1px solid #fecaca;
  border-radius: 2rem;
}
.title-my-grade strong {
  font-size: 1.8rem;
  font-weight: 800;
  color: #ef4444;
}
.cutline-verdict {
  display: flex;
  justify-content: center;
  margin-top: 1.8rem;
  padding-top: 1.4rem;
  border-top: 1px dashed #ebebeb;
}

/* 합격 판정 뱃지 */
.verdict-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.8rem 2.4rem;
  border-radius: 2rem;
  font-size: 1.6rem;
  font-weight: 700;
  white-space: nowrap;
}
.verdict-badge.safe { background: #dcfce7; color: #166534; }
.verdict-badge.challenge { background: #fef9c3; color: #854d0e; }
.verdict-badge.danger { background: #fecaca; color: #991b1b; }
.verdict-badge.unknown { background: #f0f1f5; color: #808080; }

/* 부가 정보 (히어로 내 사용) */
.detail-extra-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.4rem;
}
.detail-extra-item .extra-label {
  font-size: 1.2rem;
  color: #808080;
}
.detail-extra-item .extra-value {
  font-size: 1.6rem;
  font-weight: 700;
  color: #202020;
}

/* ── 모달 섹션 공통 ── */
.detail-section {
  padding: 2.4rem;
  margin-bottom: 2.4rem;
  border: 1px solid #cbd2dc;
  border-radius: 1.2rem;
  background: #fff;
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}
#detailTab1,
#detailTab2 {
  margin-bottom: 2.4rem;
}
/* cutlineSection 은 래퍼라서 내부 detail-section 이 :last-child 로 판정돼 margin 사라짐 — 보정 */
#cutlineSection { margin-bottom: 2.4rem; }
#cutlineSection > .detail-section { margin-bottom: 0; }
.detail-section.ea-wrap {
  background: #fffbf2;
  border-color: #ede3c8;
}
.detail-section:last-child {
  margin-bottom: 0;
}
.detail-section-title {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  font-size: 1.5rem;
  font-weight: 700;
  color: #202020;
  margin-bottom: 2rem;
  letter-spacing: -0.03rem;
  padding-bottom: 1.2rem;
  border-bottom: 2px solid #0891b2;
}
/* 타이틀 바로 아래 첫 ac-subtitle 은 중복 가로선 제거 */
.detail-section-title + .ac-subtitle {
  margin-top: 0;
  padding-top: 0.4rem;
  border-top: 0;
}
.detail-section-title + .ac-subtitle::before {
  top: 0.4rem;
}
.detail-section-title i {
  font-size: 1.7rem;
  color: #0891b2;
}

.section-desc {
  font-size: 1.35rem;
  color: #5a6474;
  line-height: 1.7;
  margin: -0.6rem 0 1.4rem;
}

/* ── 등급컷·판정 안내 (접이식 안내 패널) ── */
.guide-section {
  background: #eff6ff;
  border-color: #bfdbfe !important;
  position: relative;
}
.guide-section .detail-section-title {
  cursor: pointer;
  user-select: none;
  border-bottom-color: #bfdbfe;
  color: #1e3a8a;
  margin-bottom: 0;
  padding-bottom: 1.2rem;
  transition: padding-bottom 0.2s;
}
.guide-section .detail-section-title i.ri-question-line {
  color: #2563eb;
}
.guide-section .detail-section-title::after {
  content: '−'; /* 펼친 상태: minus */
  margin-left: auto;
  width: 2.4rem;
  height: 2.4rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 2rem;
  font-weight: 600;
  line-height: 1;
  color: #2563eb;
  border: 1px solid #bfdbfe;
  border-radius: 0.4rem;
  background: #fff;
  animation: guideHintPulse 2s ease-in-out infinite;
}
@keyframes guideHintPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(249, 115, 22, 0); }
  50%      { box-shadow: 0 0 0 6px rgba(249, 115, 22, 0.35); }
}
.guide-section.collapsed .detail-section-title {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: 0;
}
.guide-section.collapsed .detail-section-title::after {
  content: '+'; /* 접힌 상태: plus */
}
.guide-section .guide-section-body {
  overflow: hidden;
  max-height: 1000px;
  transition: max-height 0.3s ease, margin-top 0.2s, opacity 0.2s;
  margin-top: 2rem;
  opacity: 1;
}
.guide-section.collapsed .guide-section-body {
  max-height: 0;
  margin-top: 0;
  opacity: 0;
}
.guide-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.2rem;
  align-items: stretch;
}
.guide-item {
  padding: 1.2rem 1.4rem;
  background: #fff;
  border: 1px solid #e8ecf0;
  border-radius: 0.8rem;
  display: flex;
  flex-direction: column;
}
.guide-item-header {
  font-size: 1.3rem;
  font-weight: 700;
  color: #202020;
  margin-bottom: 0.8rem;
}
.guide-item p {
  font-size: 1.25rem;
  color: #505050;
  line-height: 1.7;
}
.guide-item p strong {
  color: #0891b2;
}
.guide-example {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin: 1rem 0;
  flex: 1;
  justify-content: center;
}
.guide-ex-row {
  display: flex;
  align-items: center;
  gap: 0.8rem;
}
.guide-ex-label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.15rem;
  font-weight: 700;
  padding: 0.3rem 0.8rem;
  border-radius: 0.4rem;
  flex-shrink: 0;
  min-width: 5.4rem;
}
.guide-ex-label.safe { background: #dcfce7; color: #166534; }
.guide-ex-label.possible { background: #dbeafe; color: #1e40af; }
.guide-ex-label.challenge { background: #fef9c3; color: #854d0e; }
.guide-ex-text {
  font-size: 1.2rem;
  color: #505050;
  line-height: 1.5;
}
.guide-ex-text strong {
  color: #202020;
}
.guide-tip {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  margin-top: 0.8rem;
  padding: 0.8rem 1rem;
  background: none;
  border: 1px solid #e0e4ea;
  border-radius: 0.6rem;
  font-size: 1.15rem;
  color: #505050;
  line-height: 1.6;
  text-align: justify;
}
.guide-tip i {
  font-size: 1.4rem;
  flex-shrink: 0;
  margin-top: 0.1rem;
  color: #0891b2;
}
.guide-tip strong {
  color: #0891b2;
}
.guide-verdict-cards {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  flex: 1;
}
.guide-verdict-card {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  padding: 0.7rem 1rem;
  border-radius: 0.6rem;
  border-left: 4px solid;
  flex: 1;
}
.guide-verdict-card.safe { background: #f0fdf4; border-left-color: #22c55e; }
.guide-verdict-card.possible { background: #eff6ff; border-left-color: #3b82f6; }
.guide-verdict-card.challenge { background: #fefce8; border-left-color: #eab308; }
.guide-verdict-card.danger { background: #fef2f2; border-left-color: #ef4444; }
.gv-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.2rem 0.8rem;
  border-radius: 2rem;
  font-size: 1.1rem;
  font-weight: 700;
  white-space: nowrap;
}
.gv-badge.safe { background: #dcfce7; color: #166534; }
.gv-badge.possible { background: #dbeafe; color: #1e40af; }
.gv-badge.challenge { background: #fef9c3; color: #854d0e; }
.gv-badge.danger { background: #fecaca; color: #991b1b; }
.gv-condition {
  font-size: 1.05rem;
  font-weight: 600;
  color: #808080;
}
.gv-desc {
  font-size: 1.1rem;
  color: #808080;
  margin-left: auto;
  white-space: nowrap;
}

/* ── 대학 반영 방법 ── */
.ref-info-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.2rem;
}
.ref-info-item {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  padding: 1.2rem 1.4rem;
  background: #f8f9fb;
  border-radius: 0.8rem;
  border: 1px solid #f0f1f5;
}
.ref-info-item:first-child {
  grid-column: 1 / -1;
}
.ref-info-label {
  font-size: 1.2rem;
  font-weight: 700;
  color: #808080;
  letter-spacing: 0.02rem;
}
.ref-info-value {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.ref-tag {
  display: inline-block;
  padding: 0.3rem 1rem;
  background: #e8f0fe;
  color: #0891b2;
  font-size: 1.3rem;
  font-weight: 600;
  border-radius: 2rem;
}
.ref-text {
  font-size: 1.4rem;
  font-weight: 600;
  color: #202020;
  line-height: 1.5;
}
.ref-suneung {
  grid-column: 1 / -1;
  background: #fffbf0;
  border-color: #f0e6c8;
}
.ref-suneung .ref-info-label {
  color: #b8860b;
}

/* ── 교과별 바 차트 ── */
.category-chart {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.category-bar-row {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.cat-label {
  width: 4rem;
  font-size: 1.3rem;
  font-weight: 600;
  color: #505050;
  text-align: right;
  flex-shrink: 0;
}
.cat-bar-wrap {
  flex: 1;
  height: 2.2rem;
  background: #f0f1f5;
  border-radius: 0.4rem;
  overflow: hidden;
}
.cat-bar-fill {
  height: 100%;
  border-radius: 0.4rem;
  transition: width 0.4s ease;
  min-width: 0.4rem;
}
.cat-value {
  width: 3.2rem;
  font-size: 1.4rem;
  font-weight: 700;
  color: #202020;
  text-align: left;
  flex-shrink: 0;
}

/* ── 반영 과목 테이블 ── */
.subject-table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  max-height: 36rem;
  overflow-y: auto;
}
.subject-detail-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 1.3rem;
}
.subject-detail-table thead th {
  background: #f8f9fb;
  padding: 0.8rem 1rem;
  font-weight: 600;
  color: #505050;
  border-bottom: 2px solid #e0e0e0;
  text-align: center;
  position: sticky;
  top: 0;
  z-index: 1;
  white-space: nowrap;
}
.subject-detail-table tbody td {
  padding: 0.7rem 1rem;
  border-bottom: 1px solid #f0f1f5;
  text-align: center;
  vertical-align: middle;
  white-space: nowrap;
}
/* 교과/과목 컬럼은 줄바꿈 허용 */
.subject-detail-table tbody td:nth-child(1),
.subject-detail-table tbody td:nth-child(2) {
  white-space: normal;
  word-break: keep-all;
  text-align: left;
  min-width: 4rem;
}
/* 반영 과목 상세 — 데이터는 모두 검정으로 표시 (계산공식 소스 추가 전 기본) */
tr.subject-reflected td,
tr.subject-unreflected td {
  color: #202020;
  font-weight: 500;
}
.subject-detail-table .rank-cell {
  color: #202020;
  font-weight: 700;
  font-size: 1.4rem;
}
tr.subject-unreflected .rank-cell {
  color: #202020;
  font-weight: 700;
}
/* TODO: 계산공식 소스 완성 후 — 산출에 포함된 과목 행에 아래 스타일 활성화 */
/* tr.subject-reflected { background: #fef9c3; } */
.ref-yes {
  color: #0891b2;
  font-size: 1.2rem;
  font-weight: 700;
}
.ref-no {
  color: #d0d0d0;
  font-size: 1.2rem;
}

/* ── 학년 탭 + 학기 서브탭 ── */
.subj-grade-tabs {
  display: flex;
  gap: 0;
  margin-bottom: 0;
  border-bottom: 2px solid #ebebeb;
}
.subj-grade-tab {
  padding: 1rem 2.4rem;
  border: none;
  background: #f0f1f5;
  font-size: 1.4rem;
  font-weight: 600;
  color: #808080;
  cursor: pointer;
  transition: all 0.2s;
  font-family: inherit;
  border-radius: 0.8rem 0.8rem 0 0;
  margin-right: 0.2rem;
}
.subj-grade-tab:hover { color: #0891b2; }
.subj-grade-tab.active {
  background: #0891b2;
  color: #fff;
}
.subj-grade-panel {
  display: none;
}
.subj-grade-panel.active {
  display: block;
}
.subj-sem-tabs {
  display: flex;
  gap: 0;
  padding: 0.8rem 0;
  border-bottom: 1px solid #f0f1f5;
}
.subj-sem-tab {
  padding: 0.6rem 2rem;
  border: 1px solid #dadada;
  background: #fff;
  font-size: 1.3rem;
  font-weight: 600;
  color: #808080;
  cursor: pointer;
  transition: all 0.2s;
  font-family: inherit;
  border-radius: 2rem;
  margin-right: 0.6rem;
}
.subj-sem-tab:hover:not(:disabled) { color: #0891b2; border-color: #0891b2; }
.subj-sem-tab:disabled {
  color: #c8c8c8;
  border-color: #e8e8e8;
  background: #f5f5f5;
  cursor: default;
}
.subj-sem-tab.active {
  background: #e8f0fe;
  color: #0891b2;
  border-color: #0891b2;
}
.subj-sem-panel {
  display: none;
}
.subj-sem-panel.active {
  display: block;
}

/* 계산 과정 — 요약 카드 */
.calc-summary {
  border: 1px solid #e8ecf0;
  border-radius: 0.8rem;
  overflow: hidden;
  background: #fff;
}
.calc-summary-header {
  padding: 1rem 1.4rem;
  background: #f0f6ff;
  font-size: 1.3rem;
  font-weight: 700;
  color: #0891b2;
  border-bottom: 1px solid #e0e7ef;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
}
.calc-method-tag {
  font-size: 1.1rem;
  font-weight: 500;
  color: #606060;
  background: #fff;
  border: 1px solid #d0d8e0;
  border-radius: 0.4rem;
  padding: 0.2rem 0.8rem;
  white-space: nowrap;
}
.calc-breakdown-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 1.2rem;
}
.calc-breakdown-table thead th {
  padding: 0.6rem 1rem;
  background: #f8f9fb;
  font-weight: 600;
  color: #808080;
  font-size: 1.1rem;
  border-bottom: 1px solid #ebebeb;
  text-align: center;
}
.calc-breakdown-table tbody td,
.calc-breakdown-table tfoot td {
  padding: 0.5rem 1rem;
  border-bottom: 1px solid #f0f1f5;
  text-align: center;
  color: #505050;
}
.calc-breakdown-table .calc-subj {
  text-align: left;
  color: #202020;
}
.calc-breakdown-table .calc-mult {
  color: #0891b2;
  font-weight: 600;
}
.calc-breakdown-table tfoot td {
  border-top: 2px solid #e0e7ef;
  border-bottom: none;
  background: #fafbfc;
  font-weight: 600;
  padding: 0.6rem 1rem;
}

/* 학년 블록 */
.calc-grade-block { padding: 0; }
.calc-grade-label {
  padding: 1rem 1.4rem 0.6rem;
  font-size: 1.3rem;
  font-weight: 700;
  color: #202020;
  background: #fafbfc;
  border-bottom: 1px solid #f0f1f5;
  display: flex;
  align-items: center;
  gap: 0.6rem;
}
.calc-ratio-badge {
  font-size: 1.1rem;
  font-weight: 600;
  color: #0891b2;
  background: #e8f1ff;
  border: 1px solid #b8d4ff;
  border-radius: 0.3rem;
  padding: 0.1rem 0.6rem;
}
.calc-grade-avg-label {
  font-size: 1.15rem;
  font-weight: 700;
  color: #0891b2;
  display: flex;
  align-items: center;
  gap: 0.4rem;
}
.calc-grade-avg {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  margin: 0.6rem 1rem 1rem;
  padding: 0.7rem 1.4rem;
  background: #f0f6ff;
  border: 1px solid #d8e6f8;
  border-radius: 0.6rem;
  font-size: 1.2rem;
  color: #606060;
}
.calc-avg-formula {
  display: flex;
  align-items: center;
  gap: 0.4rem;
}
.calc-avg-text {
  font-size: 1.1rem;
  color: #909090;
  font-weight: 500;
}
.calc-avg-num {
  font-size: 1.35rem;
  font-weight: 800;
  color: #202020;
}
.calc-avg-op {
  font-size: 1.2rem;
  color: #b0b8c4;
  font-weight: 700;
  margin: 0 0.1rem;
}
.calc-grade-avg strong {
  color: #0891b2;
  font-weight: 800;
  font-size: 1.5rem;
}
.calc-divider { height: 1px; background: #e8ecf0; }

/* 진로변환 뱃지 */
.jinro-badge {
  display: inline-block;
  font-size: 1rem;
  font-weight: 700;
  color: #fff;
  background: #8b5cf6;
  border-radius: 0.3rem;
  padding: 0.1rem 0.5rem;
  margin-left: 0.3rem;
  vertical-align: middle;
  line-height: 1.3;
}
.jinro-orig {
  font-size: 1rem;
  color: #8b5cf6;
  margin-left: 0.2rem;
}

/* 최종 결과 footer */
.calc-footer {
  border-top: 2px solid #e0e7ef;
  background: #f8faff;
  padding: 1.6rem 1.4rem 1.4rem;
}
.calc-footer-label {
  text-align: center;
  font-size: 1.1rem;
  font-weight: 600;
  color: #909090;
  letter-spacing: 0.03em;
  margin-bottom: 1rem;
}
.formula-row {
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: 0.6rem;
  flex-wrap: wrap;
  margin-bottom: 1.2rem;
}
.formula-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: #fff;
  border: 1px solid #d8e2ee;
  border-radius: 0.8rem;
  padding: 0.6rem 1rem 0.5rem;
  min-width: 6.4rem;
}
.formula-card-grade {
  font-size: 1rem;
  font-weight: 600;
  color: #808080;
  margin-bottom: 0.1rem;
}
.formula-card-avg {
  font-size: 1.7rem;
  font-weight: 800;
  color: #202020;
  line-height: 1.2;
}
.formula-card-ratio {
  font-size: 1rem;
  font-weight: 700;
  color: #0891b2;
  margin-top: 0.1rem;
}
.formula-op {
  font-size: 1.5rem;
  font-weight: 700;
  color: #b0b8c4;
  align-self: center;
}
.formula-eq {
  font-size: 1.8rem;
  font-weight: 800;
  color: #b0b8c4;
  margin: 0 0.2rem;
  align-self: center;
}
.formula-result {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: #0891b2;
  border-radius: 1rem;
  padding: 0.6rem 1.6rem 0.5rem;
  min-width: 7rem;
}
.formula-result-label {
  font-size: 1rem;
  font-weight: 600;
  color: rgba(255,255,255,0.7);
}
.formula-result-value {
  font-size: 2rem;
  font-weight: 800;
  color: #fff;
  line-height: 1.2;
}
.formula-text {
  text-align: center;
  font-size: 1.1rem;
  color: #a0a8b4;
}
.formula-simple {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
}
.formula-simple-expr {
  font-size: 1.4rem;
  color: #808080;
  font-weight: 500;
}

/* ── 전체 평균 vs 산출등급 비교 ── */
.calc-compare {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  padding: 1.4rem 1.6rem;
  margin-top: 1.2rem;
  background: #f8f9fb;
  border: 1px solid #e8ecf0;
  border-radius: 0.8rem;
}
.calc-compare-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.2rem;
}
.calc-compare-label {
  font-size: 1.1rem;
  font-weight: 600;
  color: #808080;
}
.calc-compare-val {
  font-size: 1.8rem;
  font-weight: 800;
  color: #202020;
}
.calc-compare-val.accent {
  color: #0891b2;
}
.calc-compare-arrow {
  font-size: 1.6rem;
  color: #b0b8c4;
  font-weight: 700;
}
.calc-compare-diff {
  font-size: 1.3rem;
  font-weight: 700;
  padding: 0.4rem 1rem;
  border-radius: 2rem;
  white-space: nowrap;
}
.calc-compare-diff.better {
  background: #dcfce7;
  color: #166534;
}
.calc-compare-diff.worse {
  background: #fecaca;
  color: #991b1b;
}
.calc-compare-diff.same {
  background: #f0f1f5;
  color: #808080;
}

/* ── 진로선택 변환 요약 ── */
.calc-jinro-summary {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 1rem 1.4rem;
  margin-top: 0.8rem;
  background: #faf5ff;
  border: 1px solid #e9d5ff;
  border-radius: 0.8rem;
  font-size: 1.3rem;
  color: #6b21a8;
}
.calc-jinro-summary i {
  font-size: 1.5rem;
  flex-shrink: 0;
}
.calc-jinro-summary strong {
  font-weight: 700;
}

/* ── 분석 코멘트 (표 형식) ── */
.analysis-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 1.2rem;
  background: #fff;
  border: 1px solid #e2e5ea;
  border-radius: 0.6rem;
  overflow: hidden;
}
.analysis-table thead th {
  background: #f1f5f9;
  color: #0f172a;
  font-weight: 700;
  padding: 0.8rem 0.6rem;
  text-align: center;
  border-bottom: 1px solid #e2e5ea;
}
.analysis-table tbody td {
  padding: 0.6rem 0.6rem;
  text-align: center;
  color: #202020;
  border-bottom: 1px solid #eef1f5;
}
.analysis-table tbody td.ac-label {
  text-align: left;
  color: #475569;
  font-weight: 600;
}
.analysis-table tbody tr.ac-group td {
  background: #0891b2;
  color: #fff;
  font-weight: 700;
  font-size: 1.15rem;
  text-align: left;
  padding: 0.4rem 0.8rem;
}
.analysis-table tbody tr:last-child td { border-bottom: 0; }

/* 학년·학기 가로 배치 표 */
.analysis-table--grade { margin-bottom: 1rem; }
.analysis-table--grade thead th {
  border-left: 1px solid #e2e5ea;
}
.analysis-table--grade thead th.ac-corner {
  background: #e2e8f0;
  border-left: 0;
}
.analysis-table--grade thead th.ac-sub-th {
  background: #f8fafc;
  font-weight: 600;
  font-size: 1.1rem;
  color: #475569;
  padding: 0.4rem 0.3rem;
}
.analysis-table tbody td.ac-label {
  text-align: left;
  padding-left: 1rem;
  background: #f8fafc;
  color: #0f172a;
  font-weight: 700;
}
.analysis-table tbody tr.ac-grade-total td {
  background: #ecfeff;
  color: #0f172a;
  font-weight: 700;
}
.analysis-table tbody tr.ac-grade-total td.ac-label {
  background: #cffafe;
  color: #0891b2;
}
.analysis-table--cat thead th.ac-corner {
  background: #e2e8f0;
  text-align: center;
}
/* 산출등급 계산 — 내부 테두리 박스 */
.calc-section {
  margin-top: 0.8rem;
  padding: 1.6rem;
  background: #fafbfc;
  border: 1px solid #d6dbe2;
  border-radius: 0.8rem;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04);
}

/* 소제목 (학년·학기별 / 주요교과 / 반영 과목 상세) — 섹션 구분 강화 */
.ac-subtitle {
  position: relative;
  margin: 2.4rem 0 1rem;
  padding: 1.6rem 0.8rem 0.8rem;
  font-size: 1.35rem;
  font-weight: 700;
  color: #0f172a;
  border-top: 1px solid #e2e8f0;
  letter-spacing: -0.02em;
}
.ac-subtitle::before {
  content: '';
  position: absolute;
  left: 0;
  top: 1.6rem;
  width: 4px;
  height: 1.8rem;
  background: #0891b2;
  border-radius: 2px;
}
.ac-subtitle {
  padding-left: 1.4rem;
}
/* 첫 소제목은 상단 선·여백 없음 */
.ac-subtitle:first-child {
  margin-top: 0;
  padding-top: 0.4rem;
  border-top: 0;
}
.ac-subtitle:first-child::before {
  top: 0.4rem;
  height: 1.8rem;
}

/* ── 추천 리스트 (같은 학과/같은 대학) ── */
.recommend-list {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
}
.recommend-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.2rem 1.6rem;
  background: #f8f9fb;
  border: 1px solid #ebebeb;
  border-radius: 1rem;
  cursor: pointer;
  transition: all 0.2s ease;
}
.recommend-card:hover {
  border-color: #0891b2;
  background: #f0f6ff;
}
.rec-main {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  min-width: 0;
}
.rec-main strong {
  font-size: 1.4rem;
  font-weight: 700;
  color: #202020;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rec-type {
  font-size: 1.2rem;
  color: #808080;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rec-right {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  flex-shrink: 0;
}
.rec-cut {
  font-size: 1.2rem;
  font-weight: 600;
  color: #505050;
  white-space: nowrap;
}
.recommend-card .verdict-badge {
  font-size: 1.1rem;
  padding: 0.4rem 1rem;
}

/* ── 판정별 3컬럼 추천 ── */
.verdict-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
}
.verdict-col {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}
.verdict-col-header {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.8rem 1rem;
  border-radius: 0.8rem;
  font-size: 1.3rem;
  font-weight: 700;
}
.verdict-col-header.safe { background: #dcfce7; color: #166534; }
.verdict-col-header.possible { background: #dbeafe; color: #1e40af; }
.verdict-col-header.challenge { background: #fef9c3; color: #854d0e; }
.verdict-col-cut-label {
  font-size: 1.1rem;
  font-weight: 500;
  opacity: 0.6;
  margin-left: 0.2rem;
}
.verdict-col-count {
  font-size: 1.1rem;
  font-weight: 600;
  opacity: 0.6;
  margin-left: auto;
}
.verdict-col-card {
  display: flex;
  align-items: center;
  padding: 0.8rem 1rem;
  background: #f8f9fb;
  border: 1px solid #ebebeb;
  border-radius: 0.6rem;
  cursor: pointer;
  transition: all 0.15s;
}
.verdict-col-card:hover {
  border-color: #0891b2;
  background: #f0f6ff;
}
.verdict-col-card strong {
  font-size: 1.25rem;
  font-weight: 700;
  color: #202020;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.verdict-col-cut {
  font-size: 1.15rem;
  font-weight: 600;
  color: #808080;
  flex-shrink: 0;
}
.verdict-col-hidden {
  display: none;
}
.verdict-col-more {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.3rem;
  width: 100%;
  padding: 0.6rem;
  border: 1px dashed #c8c8c8;
  background: none;
  border-radius: 0.6rem;
  font-size: 1.2rem;
  font-weight: 600;
  color: #808080;
  cursor: pointer;
  font-family: inherit;
  transition: all 0.15s;
}
.verdict-col-more:hover {
  border-color: #0891b2;
  color: #0891b2;
}
.verdict-col-more i {
  font-size: 1.4rem;
}
.verdict-col-empty {
  padding: 1.6rem 1rem;
  text-align: center;
  font-size: 1.2rem;
  color: #b0b0b0;
  background: #fafafa;
  border-radius: 0.6rem;
}

/* ── 선택 경로 요약 ── */
.selection-breadcrumb {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  padding: 1.2rem 2rem;
  background: #f0f6ff;
  border-radius: 0.8rem;
  margin-bottom: 2rem;
  flex-wrap: wrap;
  font-size: 1.4rem;
  color: #505050;
}
.selection-breadcrumb .bc-item {
  font-weight: 600;
  color: #0891b2;
}
.selection-breadcrumb .bc-sep {
  color: #dadada;
}

/* ── 계열 탭 ── */
.faculty-toggle {
  display: flex;
  gap: 0.6rem;
  margin-bottom: 1.5rem;
}
.faculty-toggle .fac-btn {
  padding: 0.7rem 1.6rem;
  border: 1px solid #dadada;
  background: #fff;
  font-size: 1.3rem;
  font-weight: 600;
  color: #505050;
  cursor: pointer;
  border-radius: 20rem;
  transition: all 0.2s;
  font-family: inherit;
}
.faculty-toggle .fac-btn:hover { color: #0891b2; border-color: #0891b2; }
.faculty-toggle .fac-btn.active { background: #0891b2; color: #fff; border-color: #0891b2; }

/* ── 태블릿 (1200px 이하) ── */
@media (max-width: 1200px) {
  .detail-modal { max-width: 72rem; }
}

/* ── 모바일 (800px 이하) ── */
@media (max-width: 800px) {
  /* 필터 영역 */
  .sc-result-header { padding: 1.6rem; }
  .sc-result-body { padding: 1.6rem; }
  .my-grade-box { padding: 1.6rem; gap: 1rem; }
  .sc-extra-info { gap: 1.6rem; }
  .selection-breadcrumb { font-size: 1.3rem; }
  .dept-card-grid { grid-template-columns: 1fr; }
  .filter-step-top .step-tit { font-size: 1.4rem; }
  .chosung-bar { flex-wrap: wrap; }
  .chosung-btn { font-size: 1.1rem; padding: 0.3rem 0.6rem; }
  .univ-category-toggle .toggle-btn { font-size: 1.2rem; }
  .fac-btn { font-size: 1.15rem; }
  .type-tab-btn { font-size: 1.15rem; }

  /* 탭 메뉴 모바일 */
  .detail-tab { font-size: 1.15rem; padding: 1rem 0.6rem; }

  /* 모달 기본 */
  .detail-modal-overlay { padding: 1rem; }
  .detail-modal { max-width: 100%; max-height: 95vh; border-radius: 1.2rem; }
  .detail-modal-header { padding: 1.2rem 1.4rem; gap: 0.6rem; }
  .detail-header-sep { font-size: 1rem; }
  .detail-univ { font-size: 1.4rem; }
  .detail-type { font-size: 1.1rem; }
  .detail-dept { font-size: 1.3rem; }
  .detail-modal-body { padding: 1.2rem; }
  .detail-section { padding: 1.6rem; margin-bottom: 1.2rem; border-radius: 1rem; }
  .detail-section-title { font-size: 1.3rem; padding-bottom: 1rem; margin-bottom: 1.2rem; }
  .detail-section-title i { font-size: 1.5rem; }
  .section-desc { font-size: 1.2rem; margin: -0.4rem 0 1.2rem; }

  /* 통계 박스 3열 유지 */
  .detail-stat-row { grid-template-columns: repeat(2, 1fr); gap: 0.8rem; }
  .detail-stat-box { padding: 1.2rem 0.8rem; }
  .stat-label { font-size: 1.05rem; }
  .stat-value { font-size: 1.6rem; }

  /* 안내문 */
  .guide-grid { grid-template-columns: 1fr; }
  .guide-section { padding: 1.4rem !important; }
  .guide-item-header { font-size: 1.3rem; }
  .guide-example { gap: 0.6rem; }
  .guide-ex-label { font-size: 1.05rem; padding: 0.3rem 0.8rem; min-width: 5rem; }
  .guide-ex-text { font-size: 1.15rem; }
  .guide-tip { font-size: 1.15rem; padding: 1rem; }
  .guide-verdict-cards { gap: 0.6rem; }
  .guide-verdict-card { padding: 0.8rem 1rem; }
  .gv-badge { font-size: 1.05rem; padding: 0.25rem 0.7rem; }
  .gv-desc { font-size: 1.15rem; }

  /* 커트라인 비교 */
  .title-my-grade { font-size: 1.2rem; padding: 0.3rem 1rem; }
  .title-my-grade strong { font-size: 1.5rem; }
  .cutline-row { gap: 0.6rem; }
  .cutline-label { width: 4.4rem; font-size: 1.15rem; }
  .cutline-bar-wrap { height: 2.2rem; }
  .cutline-value { font-size: 1.2rem; width: 3.6rem; }

  /* 대학 반영 방법 */
  .ref-info-grid { grid-template-columns: 1fr; }
  .ref-info-item:first-child { grid-column: auto; }
  .ref-suneung { grid-column: auto; }
  .ref-suneung .ref-text { font-size: 1.2rem; }

  /* 중단 2컬럼 → 1컬럼 */
  .detail-mid-row { grid-template-columns: 1fr; gap: 1.2rem; }
  .detail-mid-left .detail-section,
  .detail-mid-right .detail-section { height: auto; flex: none; }

  /* 교과별 바 차트 */
  .cat-label { width: 3.4rem; font-size: 1.2rem; }
  .cat-value { font-size: 1.3rem; }

  /* 분석 코멘트 */
  .analysis-item { font-size: 1.15rem; }
  .analysis-item i { font-size: 1.15rem; }

  /* 반영 과목 테이블 */
  .subject-detail-table { font-size: 1.1rem; }
  .subject-detail-table thead th { padding: 0.5rem 0.4rem; font-size: 1rem; }
  .subject-detail-table tbody td { padding: 0.4rem 0.4rem; }
  .subject-detail-table tbody td:nth-child(1),
  .subject-detail-table tbody td:nth-child(2) { min-width: 3rem; }
  .subj-grade-tab { padding: 0.8rem 1.6rem; font-size: 1.3rem; }
  .subj-sem-tab { padding: 0.5rem 1.2rem; font-size: 1.2rem; }

  /* 산출등급 계산 */
  .calc-summary-header { flex-wrap: wrap; gap: 0.4rem; }
  .calc-method-tag { font-size: 1rem; }
  .calc-grade-label { padding: 0.8rem 1rem 0.5rem; font-size: 1.2rem; }
  .calc-ratio-badge { font-size: 1rem; padding: 0.1rem 0.5rem; }
  .calc-grade-avg { flex-wrap: wrap; gap: 0.5rem; padding: 0.5rem 0.8rem; margin: 0.4rem 0.6rem 0.8rem; }
  .calc-grade-avg-label { font-size: 1.05rem; }
  .calc-avg-text { font-size: 1rem; }
  .calc-avg-num { font-size: 1.2rem; }
  .calc-avg-op { font-size: 1.1rem; }
  .calc-grade-avg strong { font-size: 1.3rem; }
  .formula-row { flex-wrap: wrap; gap: 0.4rem; }
  .formula-card { min-width: 5.4rem; padding: 0.5rem 0.7rem 0.4rem; }
  .formula-card-avg { font-size: 1.5rem; }
  .formula-result { min-width: 6rem; padding: 0.5rem 1.2rem 0.4rem; }
  .formula-result-value { font-size: 1.7rem; }
  .formula-op { font-size: 1.3rem; }
  .formula-eq { font-size: 1.5rem; }
  .calc-compare { gap: 0.6rem; padding: 1rem 1.2rem; flex-wrap: wrap; justify-content: center; }
  .calc-compare-val { font-size: 1.5rem; }

  /* 추천 카드 */
  .detail-rec-row { grid-template-columns: 1fr; gap: 1.2rem; }
  .detail-rec-col .detail-section { height: auto; }
  .recommend-card { flex-wrap: wrap; padding: 1rem 1.2rem; }
  .rec-right { width: 100%; justify-content: flex-end; }

  /* 판정별 3컬럼 → 1컬럼 */
  .verdict-grid { grid-template-columns: 1fr; }
  .verdict-col-header { font-size: 1.2rem; padding: 0.8rem 1rem; }
  .verdict-col-card { padding: 0.7rem 1rem; }
  .verdict-col-card strong { font-size: 1.2rem; }
  .verdict-col-more { font-size: 1.15rem; }

  /* 탭2: 대학발표 입결 모바일 */
  .ea-intro { flex-direction: column; gap: 0.8rem; padding: 1.2rem; }
  .ea-intro-icon { font-size: 2.2rem; }
  .ea-intro-text strong { font-size: 1.25rem; }
  .ea-intro-text p { font-size: 1.15rem; }
  .ea-selectors { flex-direction: column; gap: 0.8rem; }
  .ea-select { font-size: 1.2rem; padding: 0.8rem; }
  .ea-label { font-size: 1.15rem; }
  .ea-year-table { font-size: 1.1rem; }
  .ea-year-table thead th { padding: 0.6rem 0.4rem; font-size: 1.05rem; }
  .ea-year-table tbody td { padding: 0.5rem 0.4rem; }
  .verdict-badge-sm { font-size: 1rem; padding: 0.15rem 0.4rem; }
}