/* ─────────────────────────────────────────────────────────────
   인쇄 · PDF
   ─────────────────────────────────────────────────────────────
   브라우저의 「인쇄 → PDF로 저장」이 곧 PDF 내보내기입니다. 서버에서
   PDF 를 만들어 주는 라이브러리를 따로 붙이지 않았습니다 — 이 사이트의
   의존성은 Flask 와 waitress 둘뿐이고, 인쇄 스타일시트를 제대로
   쓰면 결과가 같기 때문입니다. 서버 렌더링이라 글꼴도 그대로 나옵니다.

   화면을 종이로 옮기는 일에서 조용히 틀어지는 것들
   ────────────────────────────────────────────────
   **하나 — 배경색이 사라집니다.** 브라우저는 잉크를 아끼려고 배경을
   빼고 인쇄합니다. 이 사이트의 게이지·막대·레이더는 전부 배경색으로
   그려져 있어서, 그대로 두면 **점수를 나타내던 그림이 통째로 빈칸이
   됩니다.** 숫자만 남고 「어디쯤인가」가 사라지는 것이라, 결과지로서는
   반쯤 망가진 것입니다. print-color-adjust 로 되살립니다.

   **둘 — 어두운 화면.** 어둡게 보던 사람이 인쇄하면 검은 종이가
   나옵니다. 인쇄에서는 밝은 쪽 색으로 되돌립니다.

   **셋 — 접힌 것.** <details> 로 접어 둔 문항 되짚어보기는 접힌 채로
   인쇄되면 아예 없는 것이 됩니다. base.html 의 beforeprint 가 펴 줍니다.

   **넷 — 잘리는 자리.** 게이지 한가운데가 쪽 경계에 걸리면 읽을 수
   없습니다. 카드마다 break-inside 를 막습니다.
   ───────────────────────────────────────────────────────────── */

@page {
  size: A4;
  margin: 15mm 13mm 16mm;
}

/* ── 색을 되살린다 ──────────────────────────────────────── */
/* 이 사이트의 그림은 전부 배경색입니다. 빼고 인쇄하면 숫자만 남습니다. */
* {
  -webkit-print-color-adjust: exact !important;
  print-color-adjust: exact !important;
}

/* 어둡게 보던 사람도 종이는 하얗게 */
:root,
:root[data-bs-theme="dark"] {
  --brand: #3b3190;
  --brand-soft: #eceafb;
  --brand-ink: #2f2670;
  --lvl-mid: #37705f;
  --lvl-near: #4f60a8;
  --lvl-far: #6f4b98;
  --lvl-edge: #8c3d72;
  --line: rgba(0, 0, 0, .22);
  --line-soft: rgba(0, 0, 0, .12);
  --paper: #fff;
  --paper-2: #f4f4f8;
  --ink-soft: #4a4e5c;
}

html, body {
  background: #fff !important;
  color: #16171d !important;
  font-size: 10.5pt;
  line-height: 1.6;
}

/* ── 종이에 필요 없는 것 ────────────────────────────────── */
.app-navbar,
.app-footer,
.timer,
.form-tail,
.ms-quit,
.ms-foot,
.skip-link,
.nb-actions,
.st-actions,
.peer-ask,
/* 공유·타인평가 절 통째로 — 인쇄물은 기록이지 조작판이 아니고,
   살아 있는 코드가 종이에 찍히면 그 종이를 건네는 순간 코드도
   함께 갑니다. */
#share,
#peer,
.pr-drop,
.del-form,
.own-box,
.peer-invite,
.worried-link,
.exam-grid,
.term-chips,
.btn,
.q-clear,
.q-conf,
.tabs-line,
.hero-facts,
.read-list,
#memStage,
#memIntro .start-box {
  display: none !important;
}

/* 인쇄할 때만 보이는 것 (화면에서 숨기는 일은 store.css 가 합니다 —
   이 파일은 media="print" 라 화면에는 실리지 않습니다) */
.print-only { display: block !important; }

/* ── 인쇄용 머리글 ──────────────────────────────────────── */
/* 종이에는 주소창이 없습니다. 어디서 나온 무엇인지, 누구의 것인지,
   언제 찍었는지를 적어 두지 않으면 몇 장 쌓인 뒤 알아볼 수 없습니다. */
.print-head {
  display: flex !important;
  justify-content: space-between;
  align-items: baseline;
  gap: 1rem;
  padding-bottom: 6pt;
  margin-bottom: 12pt;
  border-bottom: 1.5pt solid var(--brand);
  font-size: 9pt;
}
.ph-brand { font-weight: 700; color: var(--brand); font-size: 11pt; }
.ph-meta { color: var(--ink-soft); text-align: right; }
.ph-meta strong { color: #16171d; }

/* 마지막에 붙는 알림 — 종이만 떠도는 일이 가장 잦습니다 */
.print-foot {
  display: block !important;
  margin-top: 14pt;
  padding-top: 6pt;
  border-top: .75pt solid var(--line);
  font-size: 8.5pt;
  color: var(--ink-soft);
  break-inside: avoid;
}

/* ── 짜임새 ─────────────────────────────────────────────── */
.container { max-width: none !important; padding: 0 !important; }
.section { padding: 0 0 10pt !important; }
main { display: block; }

.result-head, .exam-head, .hero {
  background: none !important;
  padding: 0 0 8pt !important;
}
.rh-title, .eh-title { font-size: 17pt; margin: 2pt 0 4pt; }
.rh-kicker, .eh-kicker { font-size: 9pt; }
.rh-lead { font-size: 10pt; }
.sec-title {
  font-size: 12pt;
  margin: 10pt 0 4pt;
  padding-bottom: 2pt;
  border-bottom: .75pt solid var(--line);
  break-after: avoid;
}

a { text-decoration: none !important; color: inherit !important; }

/* ── 잘리면 안 되는 것 ──────────────────────────────────── */
.score-gauge,
.deep-card,
.rep-row,
.part-row,
.notice,
.says,
.cmp,
.pc-row,
.mark-box,
.src-card,
.spread-box,
.norm-badge,
.selfreport,
.sugg-card,
.rv-item,
.hist-row,
.gen,
.closing,
.nototal,
.headline-box,
.privacy-box,
.help-box {
  break-inside: avoid;
  page-break-inside: avoid;
}

/* ── 게이지와 막대 ──────────────────────────────────────── */
.score-gauge { border: .75pt solid var(--line); padding: 8pt 10pt; }
.gauge-score .num { font-size: 26pt; }
.gauge-track { height: 12pt; }
.gauge-pin { box-shadow: none; width: 3pt; }
.part-bar { height: 5pt; }
.part-list { display: block; }
.part-row { padding: 5pt 0 3pt; }
.part-explain { padding-bottom: 5pt; font-size: 9pt; }

/* 레이더는 SVG 라 그대로 나오지만 종이에서는 작게 두는 편이 낫습니다 */
.radar { max-width: 62mm; }

/* ── 표 ─────────────────────────────────────────────────── */
.table-wrap { overflow: visible !important; }
.hist-table { font-size: 9pt; }
.hist-table th, .hist-table td { padding: 3pt 5pt; }
.hist-table thead { display: table-header-group; }   /* 쪽마다 머리줄 */
.hist-table tr { break-inside: avoid; }

/* ── 접힌 것을 편다 ─────────────────────────────────────── */
/* open 속성은 base.html 의 beforeprint 가 붙입니다. 여기서는
   펴진 뒤의 모양만 손봅니다. */
details > summary { list-style: none; font-weight: 700; }
details > summary::-webkit-details-marker { display: none; }
.review-group { border: .75pt solid var(--line); margin-bottom: 6pt; }
.review-group > summary { padding: 5pt 8pt; }
.review-body { padding: 0 8pt 6pt; }
.explain > summary { padding: 4pt 6pt; }

/* ── 문항 화면을 인쇄할 때 ──────────────────────────────── */
/* 검사지를 종이로 뽑아 미리 보려는 경우가 있습니다. 보기와 도형이
   함께 나오게 두되, 한 문항이 두 쪽에 걸치지 않게 합니다. */
.q-item { break-inside: avoid; page-break-inside: avoid; }
.q-group { break-before: auto; }
.lk-opt, .ch-opt { break-inside: avoid; }

/* ── 마지막 손질 ────────────────────────────────────────── */
.notice-stack { display: block; }
.notice { margin-bottom: 5pt; padding: 6pt 8pt; }
.dc-grid { display: flex; gap: 10pt; }
.learn-rounds { height: 26mm; }
.fig { max-width: 40mm; height: auto; }
.fig-matrix { max-width: 62mm; }