/* ==========================================================================
   보장분석표 만들기 (analysis.html)
   home/home.css 의 색·글꼴·머리글·바닥글 위에 이 페이지에 필요한 것만 더합니다.
   - .an-* : 입력 화면 (단계별 한 페이지씩)
   - .as-* : 보장분석표 모양 (화면 미리보기와 PDF 가 같은 모양을 씁니다)
   ========================================================================== */

:root {
  --an-y: #FDE047;
  --an-accent: #1D4ED8;
  --an-ok: #047857;
  --an-bad: #B91C1C;
}

.li { display: block; width: 1.25rem; height: 1.25rem; flex: none; }

/* ---------- 머리말 ---------- */
.an-hero {
  padding-block: clamp(2rem, 5vw, 3.5rem) 1rem;
  background: linear-gradient(180deg, var(--mist), var(--white));
}
.an-kicker {
  display: inline-block;
  padding: 0.25rem 0.75rem;
  border-radius: 999px;
  background: var(--navy-900);
  color: var(--white);
  font-size: 0.875rem;
  font-weight: 600;
}
.an-h1 {
  margin-top: 0.9rem;
  font-family: var(--serif);
  font-size: clamp(2rem, 1.4rem + 2.6vw, 3.25rem);
  font-weight: 700;
  line-height: 1.25;
  color: var(--navy-900);
}
.an-h1 .hl {
  background: linear-gradient(transparent 60%, var(--an-y) 60%);
  padding-inline: 0.08em;
}
.an-lead { max-width: 44em; margin-top: 0.9rem; font-size: var(--step-1); line-height: 1.75; color: var(--slate); }
.an-lead strong { color: var(--navy-900); }
.an-privacy {
  display: flex;
  gap: 0.6rem;
  align-items: flex-start;
  max-width: 44em;
  margin-top: 1rem;
  padding: 0.8rem 1rem;
  border: 1px solid #BBF7D0;
  border-radius: 12px;
  background: #F0FDF4;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #14532D;
}
.an-privacy .li { margin-top: 0.15rem; color: var(--an-ok); }

.an-wrap { padding-bottom: clamp(3rem, 7vw, 5rem); }

/* ---------- 단계 표시 ---------- */
.an-steps {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 0.5rem;
  margin: 1.25rem 0 1.5rem;
  padding: 0;
  list-style: none;
}
.an-step {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  width: 100%;
  min-height: 3.25rem;
  padding: 0.5rem 0.7rem;
  border: 1.5px solid var(--line);
  border-radius: 12px;
  background: var(--white);
  color: var(--slate);
  font: inherit;
  font-size: 0.9375rem;
  font-weight: 600;
  text-align: left;
  cursor: pointer;
}
.an-step-no {
  display: grid;
  place-items: center;
  flex: none;
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 50%;
  background: var(--mist);
  color: var(--navy-900);
  font-size: 0.875rem;
  font-weight: 800;
}
.an-step.is-done { border-color: #A7F3D0; color: var(--an-ok); }
.an-step.is-done .an-step-no { background: var(--an-ok); color: var(--white); }
.an-step.is-current { border-color: var(--navy-900); background: var(--navy-900); color: var(--white); }
.an-step.is-current .an-step-no { background: var(--an-y); color: var(--navy-900); }

/* ---------- 한 단계 = 한 페이지 ---------- */
.an-form { display: block; }
.an-page {
  padding: clamp(1.25rem, 3vw, 2rem);
  border: 1px solid var(--line);
  border-radius: 20px;
  background: var(--white);
  box-shadow: 0 10px 30px -18px rgba(13, 27, 46, 0.25);
}
.an-page[hidden] { display: none; }
.an-page-title {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  font-family: var(--sans);
  font-size: clamp(1.4rem, 1.15rem + 1vw, 1.9rem);
  font-weight: 800;
  line-height: 1.3;
  color: var(--navy-900);
}
.an-page-title small { font-size: 0.6em; font-weight: 600; color: var(--slate); }
.an-page-title:focus { outline: none; }
.an-no {
  display: grid;
  place-items: center;
  flex: none;
  width: 2.4rem;
  height: 2.4rem;
  border-radius: 12px;
  background: var(--an-y);
  font-size: 1.1rem;
}
.an-page-lead { margin: 0.5rem 0 1.25rem; line-height: 1.7; color: var(--slate); }
.an-page-lead strong { color: var(--navy-900); }
.req { color: var(--an-bad); }

/* ---------- 입력 칸 ---------- */
fieldset.an-field { margin: 0; padding: 0; border: 0; min-width: 0; }
.an-field { display: flex; flex-direction: column; gap: 0.35rem; min-width: 0; }
.an-field > legend, .an-label { font-size: 0.9375rem; font-weight: 700; color: var(--navy-900); padding: 0; margin-bottom: 0.35rem; }
.an-input {
  width: 100%;
  min-height: 3rem;
  padding: 0.55rem 0.8rem;
  border: 1.5px solid var(--line);
  border-radius: 10px;
  background: var(--white);
  color: var(--ink);
  font: inherit;
  font-size: var(--step-0);
}
.an-input:focus-visible { outline: 3px solid #93C5FD; outline-offset: 1px; border-color: var(--an-accent); }
.an-input::placeholder { color: #94A3B8; }

.an-grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem 1.25rem; margin-bottom: 1rem; }
.an-grid-2.an-tight { gap: 0.75rem; margin: 0; }
.an-span-2 { grid-column: 1 / -1; }

.an-seg { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.an-seg label { flex: 1 1 6rem; }
.an-seg input { position: absolute; opacity: 0; pointer-events: none; }
.an-seg span {
  display: grid;
  place-items: center;
  min-height: 3rem;
  padding: 0.4rem 0.8rem;
  border: 1.5px solid var(--line);
  border-radius: 10px;
  background: var(--white);
  font-weight: 700;
  color: var(--slate);
  text-align: center;
  cursor: pointer;
}
.an-seg input:checked + span { border-color: var(--navy-900); background: var(--navy-900); color: var(--white); }
.an-seg input:focus-visible + span { outline: 3px solid #93C5FD; outline-offset: 2px; }

/* 상담 목적 카드 */
.an-choice-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.75rem; margin-bottom: 1.25rem; }
.an-choice {
  position: relative;
  display: grid;
  grid-template-columns: 2.5rem minmax(0, 1fr);
  grid-template-rows: auto auto;
  column-gap: 0.7rem;
  align-items: center;
  padding: 0.9rem 1rem;
  border: 1.5px solid var(--line);
  border-radius: 14px;
  background: var(--white);
  cursor: pointer;
}
.an-choice input { position: absolute; opacity: 0; pointer-events: none; }
.an-choice .li { grid-row: 1 / 3; width: 2.5rem; height: 2.5rem; padding: 0.5rem; border-radius: 10px; background: var(--mist); color: var(--navy-900); }
.an-choice strong { color: var(--navy-900); line-height: 1.35; }
.an-choice small { color: var(--slate); font-size: 0.875rem; line-height: 1.4; }
.an-choice:has(input:checked) { border-color: var(--navy-900); background: #F8FAFC; box-shadow: inset 0 0 0 1.5px var(--navy-900); }
.an-choice:has(input:checked) .li { background: var(--an-y); }
.an-choice:has(input:focus-visible) { outline: 3px solid #93C5FD; outline-offset: 2px; }
.an-choice::after {
  content: "";
  position: absolute;
  top: 0.6rem;
  right: 0.6rem;
  width: 1.1rem;
  height: 1.1rem;
  border: 1.5px solid var(--line);
  border-radius: 50%;
  background: var(--white);
}
.an-choice:has(input:checked)::after { border-color: var(--an-ok); background: var(--an-ok) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / 70% no-repeat; }

/* 안내·동의 */
.an-note {
  display: flex;
  gap: 0.6rem;
  align-items: flex-start;
  margin: 0.5rem 0 1rem;
  padding: 0.8rem 1rem;
  border-radius: 12px;
  background: #EFF6FF;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #1E3A8A;
}
.an-note .li { margin-top: 0.15rem; }
.an-note-soft { background: var(--mist); color: var(--slate); }
.an-consent, .an-check-big {
  display: flex;
  gap: 0.7rem;
  align-items: flex-start;
  margin-top: 0.75rem;
  padding: 0.9rem 1rem;
  border: 1.5px solid var(--line);
  border-radius: 12px;
  background: var(--white);
  line-height: 1.6;
  cursor: pointer;
}
.an-consent input, .an-check-big input { flex: none; width: 1.35rem; height: 1.35rem; margin-top: 0.15rem; accent-color: var(--navy-900); }
.an-consent strong { color: var(--navy-900); }
.an-consent:has(input:checked), .an-check-big:has(input:checked) { border-color: var(--an-ok); background: #F0FDF4; }
#an-consent-health { display: none; }
#an-consent-health.is-needed { display: flex; }

/* 반복 입력 (병원 치료, 가입한 보험) */
.an-repeat { display: grid; gap: 1rem; margin-top: 1rem; }
.an-item {
  padding: 1rem 1.1rem 0.25rem;
  border: 1.5px solid var(--line);
  border-radius: 14px;
  background: #FBFCFD;
}
.an-item-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.75rem; }
.an-item-head strong { font-size: 1.05rem; color: var(--navy-900); }
.an-remove {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  min-height: 2.5rem;
  padding: 0 0.75rem;
  border: 1px solid #FECACA;
  border-radius: 8px;
  background: #FEF2F2;
  color: var(--an-bad);
  font: inherit;
  font-size: 0.875rem;
  font-weight: 700;
  cursor: pointer;
}
.an-remove .li { width: 1rem; height: 1rem; }
.an-add {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  min-height: 3rem;
  margin-top: 1rem;
  padding: 0 1.1rem;
  border: 1.5px dashed var(--navy-900);
  border-radius: 12px;
  background: var(--white);
  color: var(--navy-900);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
.an-add[hidden] { display: none; }
.an-empty-note { margin-top: 0.75rem; color: var(--slate); font-size: 0.9375rem; }
.an-empty-note[hidden] { display: none; }

/* 보장 금액 */
.an-cov-box { margin: 0 0 1rem; border: 1px solid var(--line); border-radius: 12px; background: var(--white); }
.an-cov-box summary {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  min-height: 3rem;
  padding: 0 1rem;
  font-weight: 700;
  color: var(--navy-900);
  cursor: pointer;
  list-style: none;
}
.an-cov-box summary::-webkit-details-marker { display: none; }
.an-cov-box summary small { font-weight: 500; color: var(--slate); }
.an-cov-box summary .li { transition: transform 200ms ease; }
.an-cov-box[open] summary .li { transform: rotate(180deg); }
.an-cov-box .an-cov-grid { padding: 0 1rem 1rem; }

.an-cov-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.6rem 1rem; margin-bottom: 1rem; }
.an-cov {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 9.5rem;
  gap: 0.6rem;
  align-items: center;
  padding: 0.45rem 0.6rem 0.45rem 0.8rem;
  border-left: 4px solid var(--gc);
  border-radius: 8px;
  background: var(--mist);
}
.an-cov.is-wide { grid-column: 1 / -1; grid-template-columns: minmax(0, 12rem) minmax(0, 1fr); }
.an-cov-label { display: flex; flex-direction: column; line-height: 1.35; }
.an-cov-label strong { color: var(--gc); font-size: 0.9375rem; }
.an-cov-label small { font-size: 0.8125rem; color: var(--slate); }
.an-cov .an-input { min-height: 2.6rem; font-size: 1rem; }
.an-unit { position: relative; display: block; }
.an-unit .an-input { padding-right: 3.2rem; text-align: right; }
.an-unit em { position: absolute; right: 0.7rem; top: 50%; transform: translateY(-50%); font-style: normal; font-size: 0.875rem; color: var(--slate); pointer-events: none; }

.an-preset-bar { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 0.5rem; }
.an-preset {
  min-height: 2.75rem;
  padding: 0 1rem;
  border: 1.5px solid var(--navy-900);
  border-radius: 999px;
  background: var(--white);
  color: var(--navy-900);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
.an-preset.is-on { background: var(--navy-900); color: var(--white); }
.an-preset.is-ghost { border-color: var(--line); color: var(--slate); }

/* ---------- 이전 / 다음 ---------- */
.an-nav {
  position: sticky;
  bottom: 0;
  z-index: 5;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-top: 1rem;
  padding: 0.75rem 0;
  border-top: 1px solid var(--line-soft);
  background: var(--white);
  box-shadow: 0 -8px 16px -12px rgba(13, 27, 46, 0.25);
}
.an-btn {
  min-height: 3.25rem;
  min-width: 8rem;
  padding: 0 1.5rem;
  border: 0;
  border-radius: 12px;
  background: var(--navy-900);
  color: var(--white);
  font: inherit;
  font-size: var(--step-0);
  font-weight: 800;
  cursor: pointer;
}
#an-next { margin-left: auto; }
.an-btn.is-ghost { border: 1.5px solid var(--line); background: var(--white); color: var(--navy-900); }
.an-btn[hidden] { display: none; }
.an-error { flex: 1; min-width: 0; color: var(--an-bad); font-weight: 700; line-height: 1.5; }

/* ---------- 결과 · 지점장에게 보내기 ---------- */
.an-send {
  margin: 0 0 2rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  border: 2px solid var(--navy-900);
  border-radius: 18px;
  background: linear-gradient(180deg, #FFFDF0, var(--white) 60%);
}
.an-send-title { display: flex; align-items: center; gap: 0.6rem; margin: 0; font-size: 1.35rem; font-weight: 800; color: var(--navy-900); }
.an-send-title .icon { width: 1.6rem; height: 1.6rem; }
.an-send-lead { margin: 0.6rem 0 1rem; line-height: 1.7; color: var(--ink); }
.an-send-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.6rem; margin: 0 0 1rem; padding: 0; list-style: none; }
.an-send-steps li { display: flex; align-items: flex-start; gap: 0.55rem; padding: 0.7rem 0.8rem; border-radius: 12px; background: var(--mist); font-size: 0.92rem; line-height: 1.5; }
.an-send-no { display: inline-grid; place-items: center; flex: none; width: 1.6rem; height: 1.6rem; border-radius: 50%; background: var(--navy-900); color: var(--white); font-weight: 800; font-size: 0.85rem; }
.an-send-btns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; }
.an-send-btn {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  min-height: 4.75rem;
  padding: 0.8rem 1.1rem;
  border: 1.5px solid var(--line);
  border-radius: 14px;
  background: var(--white);
  color: var(--navy-900);
  font: inherit;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
  transition: transform 150ms ease, box-shadow 150ms ease;
}
.an-send-btn:hover { transform: translateY(-1px); box-shadow: 0 10px 20px -14px rgba(13, 27, 46, 0.5); }
.an-send-btn > .icon, .an-send-btn > .li { width: 2.2rem; height: 2.2rem; flex: none; }
.an-send-btn > span { display: flex; flex-direction: column; line-height: 1.35; }
.an-send-btn strong { font-size: 1.08rem; }
.an-send-btn small { font-size: 0.84rem; color: var(--slate); }
.an-send-btn.is-kakao { border-color: var(--kakao); background: var(--kakao); color: var(--kakao-ink); }
.an-send-btn.is-kakao small { color: #3F3A00; }
.an-send-btn.is-sms { border-color: var(--navy-900); background: var(--navy-900); color: var(--white); }
.an-send-btn.is-sms small { color: rgba(255, 255, 255, 0.78); }
.an-send-status { min-height: 1.6em; margin: 0.9rem 0 0.25rem; font-weight: 700; line-height: 1.6; color: var(--an-ok); }
.an-send-status:empty { margin: 0; min-height: 0; }
.an-send-preview { margin-top: 0.75rem; border: 1px solid var(--line); border-radius: 12px; background: var(--white); }
.an-send-preview summary { padding: 0.75rem 1rem; font-weight: 700; cursor: pointer; }
.an-send-preview pre {
  max-height: 22rem;
  margin: 0;
  padding: 0 1rem 1rem;
  overflow: auto;
  font: inherit;
  font-size: 0.9rem;
  line-height: 1.65;
  white-space: pre-wrap;
  word-break: keep-all;
  overflow-wrap: anywhere;
  color: var(--ink);
}
.an-send-note { display: flex; gap: 0.5rem; align-items: flex-start; margin: 0.9rem 0 0; font-size: 0.86rem; line-height: 1.6; color: var(--slate); }
.an-send-note .li { width: 1.1rem; height: 1.1rem; margin-top: 0.2rem; color: var(--an-ok); }
.an-sub-title { margin: 0 0 0.75rem; font-size: 1.1rem; font-weight: 800; color: var(--navy-900); }

/* ---------- 결과 · 내려받기 ---------- */
.an-download { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; }
.an-dl {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  min-height: 4.5rem;
  padding: 0.75rem 1rem;
  border: 1.5px solid var(--line);
  border-radius: 14px;
  background: var(--white);
  color: var(--navy-900);
  font: inherit;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}
.an-dl > .li, .an-dl > .icon { width: 2.2rem; height: 2.2rem; flex: none; }
.an-dl span { display: flex; flex-direction: column; line-height: 1.35; }
.an-dl small { color: var(--slate); font-size: 0.84rem; }
.an-dl.is-excel { border-color: #16A34A; }
.an-dl.is-excel > .li { color: #15803D; }
.an-dl.is-pdf { border-color: #DC2626; }
.an-dl.is-pdf > .li { color: #B91C1C; }
.an-dl.is-kakao { border-color: var(--kakao); background: var(--kakao); color: var(--kakao-ink); }
.an-dl.is-kakao small { color: #3F3A00; }
.an-dl:disabled { opacity: 0.6; cursor: progress; }
.an-dl.is-busy strong::after { content: " …"; }
.an-status { min-height: 1.6em; margin: 0.75rem 0; font-weight: 700; color: var(--an-ok); }

.an-tabs { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-bottom: 0.75rem; }
.an-tab {
  min-height: 2.75rem;
  padding: 0 1rem;
  border: 1.5px solid var(--line);
  border-radius: 999px;
  background: var(--white);
  color: var(--slate);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
.an-tab[aria-selected="true"] { border-color: var(--navy-900); background: var(--navy-900); color: var(--white); }
.an-swipe { display: none; margin-bottom: 0.4rem; font-size: 0.875rem; font-weight: 700; color: var(--slate); }
@media (max-width: 1100px) { .an-swipe { display: block; } }
.an-preview {
  overflow-x: auto;
  padding: 1rem;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #F8FAFC;
}

/* PDF 용 인쇄판 (화면 밖) */
.an-print { position: absolute; left: -30000px; top: 0; width: 1400px; }
.an-print .as-page { width: 1400px; padding: 28px 32px; background: #fff; }
/* ==========================================================================
   보장분석표 모양
   ========================================================================== */
.as-sheet { min-width: 980px; padding: 8px; background: #fff; color: #111; font-family: var(--sans); }
.as-sheet.as-cmp, .as-sheet.as-info { min-width: 720px; max-width: 1000px; margin: 0 auto; }
.as-top { display: grid; grid-template-columns: 1fr auto 1fr; align-items: end; gap: 1rem; margin-bottom: 10px; }
.as-brand { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; color: #F37321; }
.as-dot { width: 22px; height: 22px; border: 3px solid #F37321; border-radius: 50%; box-shadow: inset 0 0 0 3px #fff, inset 0 0 0 6px #FBB07A; }
.as-title { font-size: 30px; font-weight: 800; text-decoration: underline; text-underline-offset: 6px; color: #111; letter-spacing: 0.02em; font-family: var(--sans); }
.as-right { text-align: right; font-size: 13px; font-weight: 700; color: #333; }

.as-table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 13px; }
.as-table th, .as-table td { border: 1px solid #7F7F7F; padding: 6px 6px; text-align: center; vertical-align: middle; line-height: 1.35; word-break: keep-all; overflow-wrap: anywhere; }
.as-table th { font-weight: 700; }
.as-cov .c-g { width: 70px; }
.as-cov .c-s { width: 100px; }
.as-cov .c-t { width: 150px; }
.as-corner { background: #DCE6F1; }
.as-band { background: #D9D9D9; font-size: 15px; height: 44px; }
.as-cust { background: #DCE6F1; font-size: 11.5px; font-weight: 600 !important; line-height: 1.55 !important; }
.as-ph { background: #B4C6E7; height: 52px; }
.as-ph small { display: block; margin-top: 2px; font-size: 11px; font-weight: 500; color: #333; }
.as-ph.is-new { background: #FFE699; }
.as-g { font-size: 16px; background: #fff; }
.as-s, .as-single { font-size: 14px; background: #fff; }
.as-cov tbody td { height: 34px; font-weight: 600; }
.as-r-surgery td, .as-r-highChemo td { height: 52px; }
.as-tv { font-weight: 800 !important; }
.as-prem th, .as-prem td { background: #DCE6F1; font-weight: 800; height: 36px; }
.as-prem small { display: block; font-size: 10.5px; font-weight: 600; }
.as-red { color: #E00000; }
.as-payp th, .as-payp td { background: #DCE6F1; font-size: 12px; height: 40px; }
.as-note th { background: #EBF1DE; height: 72px; }
.as-note td { background: #E2EFDA; font-size: 12px; }
.as-pay th, .as-pay td { background: #F2DCDB; font-size: 12px; height: 28px; }
.as-pay td { text-align: right; }
.as-status th, .as-status td { background: #DCE6F1; height: 32px; }
.as-status td.is-new { background: #FFE699; font-weight: 800; }
.as-foot { margin-top: 6px; text-align: center; font-size: 13px; font-weight: 800; color: #111; }

.as-cmp .c-g { width: 90px; }
.as-cmp .c-s2 { width: 140px; }
.as-cmp thead th { background: #fff; font-size: 16px; height: 44px; }
.as-cmp tbody td { font-size: 18px; font-weight: 800; height: 42px; }
.as-cmp tbody td small { display: block; font-size: 12px; font-weight: 700; }
.as-cmp td.is-up small { color: #047857; }
.as-cmp td.is-down small { color: #B91C1C; }
.as-cmp .as-g { font-size: 18px; }
.as-cmp .as-s, .as-cmp .as-single { font-size: 16px; background: transparent; }
.as-black th, .as-black td { background: #000 !important; color: #fff !important; font-size: 18px; height: 44px; }
.as-diff th, .as-diff td { background: #FFF7CC; font-size: 15px; font-weight: 800; }

.as-kv th { width: 200px; background: #DCE6F1; text-align: left; padding-left: 12px; }
.as-kv td { text-align: left; padding-left: 12px; font-size: 14px; height: 34px; }
.as-sub { margin: 18px 0 8px; font-size: 16px; font-weight: 800; color: #111; font-family: var(--sans); }
.as-hist thead th { background: #B4C6E7; }
.as-hist td { font-size: 12.5px; }
.as-empty { padding: 12px; border: 1px dashed #999; text-align: center; font-weight: 700; }
.as-consent, .as-rrn { margin-top: 10px; font-size: 12.5px; color: #333; }

/* ---------- 화면 크기별 ---------- */
@media (max-width: 960px) {
  .an-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .an-choice-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .an-cov-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
  .an-steps { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0.3rem; }
  .an-step { justify-content: center; padding: 0.35rem; min-height: 2.75rem; }
  .an-step-name { display: none; }
  .an-step.is-current .an-step-name { display: none; }
  .an-grid-2, .an-choice-grid, .an-download, .an-send-btns, .an-send-steps { grid-template-columns: minmax(0, 1fr); }
  .an-cov { grid-template-columns: minmax(0, 1fr) 8.5rem; }
  .an-cov.is-wide { grid-template-columns: minmax(0, 1fr); }
  .an-nav { padding-bottom: calc(0.75rem + env(safe-area-inset-bottom)); }
  .an-btn { min-width: 6.5rem; }
  .an-error { order: -1; flex-basis: 100%; }
  .an-nav { flex-wrap: wrap; }
}