/* ==========================================================================
   아빠수학 연산 노트 — A4 문제집 판형
   --------------------------------------------------------------------------
   두 곳에서 쓰인다.
     1) index.html 에서  media="print"  로  → 실제 인쇄
     2) 미리보기 iframe 에서  media 없이   → 화면에서 인쇄 결과를 그대로 확인
   그래서 @media print 로 감싸지 않는다. 이 파일 = 인쇄 판면 그 자체.
   ========================================================================== */

/* A4 297×210mm.  위아래 13mm, 좌우 14mm 를 빼면 본문은 182 × 271mm.
   지면은 262mm 로 고정 — 9mm 를 남겨 두어 글꼴이 조금 달라져도 쪽이 밀리지 않는다. */
@page {
  size: A4 portrait;
  margin: 13mm 14mm;
}

:root { --pad-x: 0; }

body {
  background: #fff;
  color: #000;
}

.toolbar, .dock, .dialog, .pad, .preview, .no-print { display: none !important; }

.book { padding: 0; }

.sheet {
  position: relative;
  max-width: none;
  width: auto;
  margin: 0;
  padding: 0 0 8mm;
  aspect-ratio: auto;
  height: 262mm;              /* 고정. 본문 271mm 안에서 9mm 여유 */
  background: #fff;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  break-after: page;
  page-break-after: always;
  break-inside: avoid;
}
.sheet:last-child { break-after: auto; page-break-after: auto; }
.sheet::before { display: none; }

/* 선택한 지면이 홀수일 때 양면 인쇄의 마지막 뒷면을 비워 둔다. */
.sheet.print-duplex-blank {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}
.print-duplex-blank__label { display: none; }

/* fixed 로 두면 브라우저마다 반복·누락이 갈리므로 지면 안에 붙인다 */
.sheet__foot {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  font-size: 8.5pt;
  padding-top: 2mm;
  border-top: .5pt solid #ccc;
}

/* 머리말 */
.head__unit { margin-bottom: 2.5mm; font-size: 8.5pt; }
.head__no { width: 15mm; height: 15mm; border-radius: 3mm; box-shadow: none; }
.head__no b { font-size: 15pt; }
.head__no small { font-size: 6pt; }
.head__title { font-size: 15pt; }
.head__sub { font-size: 9pt; }
.head__log { margin-top: 3.5mm; gap: 2mm; }
.logbox { padding: 1.4mm 2.5mm 1.8mm; border-radius: 1.5mm; }
.logbox span { font-size: 7pt; }
.logbox b { font-size: 10pt; min-height: 4mm; }

/* 원리 */
.guide { margin-top: 4mm; padding: 3mm 3.5mm; border-radius: 2.5mm; border-width: 1pt; }
.guide__tag { font-size: 7.5pt; padding: .6mm 2.4mm; top: -2.4mm; }
.guide__text { font-size: 9pt; line-height: 1.5; }
.guide__demo { margin-top: 2.5mm; gap: 6mm; }
.steps { font-size: 11pt; gap: 2mm; }

/* 수 가르기 도식은 px 로 그려져 있어 인쇄에서 안 줄어든다 — mm 로 맞춰 준다 */
.bond svg { width: 24mm; height: auto; }

/* 문제판 — 남는 높이를 행 사이에 나눠 20문항이 A4 한 장을 고르게 채우도록 */
.sheet[data-kind='round'] { display: flex; flex-direction: column; }
/* 단 사이 여백은 좌우가 절반씩 — column-gap 과 padding 을 겹쳐 주면
   오른쪽 단만 좁아져 긴 식이 거기서만 줄이 넘친다. */
.grid { flex: 1 1 auto; margin-top: 5mm; --gut: 4.5mm; column-gap: 0; grid-template-columns: 1fr 1fr; }
.grid__col { justify-content: space-between; padding-right: var(--gut); }
.grid__col + .grid__col { padding-left: var(--gut); padding-right: 0; border-left-width: 1pt; }
.grid--wide .grid__col { padding-right: 0; }

.q { min-height: 0; padding: 4.2mm 0; gap: 2.4mm; }
.q__no { width: 5.2mm; height: 5.2mm; font-size: 8pt; border-width: .8pt; }
/* 인쇄는 지면이 넉넉해 줄이 넘지 않는다 — 화면용 --fit 을 쓰지 않는다 */
.q__body { --xgap: 0; font-size: 13pt; gap: 0; }
.q__mark { width: 4mm; font-size: 11pt; }
.q__fix { display: none; }

/* 칸이 둘이거나 분수가 든 회차 — 줄이 높고 길어서 판면을 한 단계 조인다 */
/* 연산이 긴 회차 — 한 쪽에 12문제, 줄 사이는 그대로 풀이 자리 */
.sheet[data-work] .q { align-items: flex-start; padding: 3mm 0 0; }
.sheet[data-work] .q__no, .sheet[data-work] .q__mark { margin-top: .6mm; }
.sheet[data-work] .q + .q { border-top: .4pt dotted #ccc; }
/* 위로 몰지 않는다. 남는 높이를 문제 사이에 고르게 나눠 지면을 채운다 */
.sheet[data-work] .grid__col { justify-content: space-between; }

.head--cont .head__no { width: 12mm; height: 12mm; }
.head--cont .head__no b { font-size: 12pt; }
.head--cont .head__title { font-size: 13pt; }
.head__title s { font-size: 9pt; color: #777; margin-left: 2mm; }

/* 활용(서술형) 지면 */
.wgrid { margin-top: 4mm; --gut: 4mm; column-gap: 0; }
.wgrid__col { padding-right: var(--gut); }
.wgrid__col + .wgrid__col { padding-left: var(--gut); padding-right: 0; border-left-width: 1pt; }
.w { padding: 2.4mm 0 1.4mm; gap: 2mm; }
.w + .w { border-top: .4pt dotted #bbb; }
.w__no { width: 4.6mm; height: 4.6mm; font-size: 7.5pt; border-width: .8pt; }
.w__text { font-size: 9.5pt; line-height: 1.55; }
.w__work { min-height: 7mm; }
.w__ans { font-size: 8.5pt; }
.w__ans .box { width: 20mm; height: 6mm; border-width: 1pt; border-color: #333; }
.w__at { font-size: 9.5pt; }
.w__at .box { width: 9mm; height: 5mm; }
.w .q__mark { display: none; }
.w.is-ok .box, .w.is-bad .box { border-color: #333; background: #fff; }

/* 식이 긴 회차 — 한 단으로 편다 */
.grid--wide { grid-template-columns: minmax(0, 1fr); }
.sheet[data-wide] .q { padding: 2.4mm 0; }

/* 칸이 둘이거나 분수가 든 회차 — 줄이 높으므로 한 쪽에 16문제.
   글자는 거의 그대로 둔다. 자리가 모자라면 쪽을 넘긴다. */
.sheet[data-dense] .q { padding: 2.6mm 0; gap: 1.8mm; }
.sheet[data-dense] .q__body { font-size: 12pt; }
.sheet[data-dense] .q__no { width: 4.8mm; height: 4.8mm; font-size: 7.5pt; }
.sheet[data-dense] .box { width: 13mm; height: 7.2mm; }
.sheet[data-dense] .grid { --gut: 3.5mm; }

.box {
  border-width: 1pt;
  border-color: #333;
  border-radius: 1mm;
  width: 15mm;
  height: 8.6mm;
  background: #fff;
}
.box input { color: #000; }
/* 분수 답란 */
.ansfrac { border-width: 1pt; border-color: #333; border-radius: 1mm; padding: .4mm 1mm; }
.ansfrac input.ans { width: 7mm; height: 3.6mm; color: #000; font-size: 9pt; }
.ansfrac--mixed > input.ans { height: 7.6mm; font-size: 10pt; }
.ansfrac__stack input:first-child { border-bottom-width: .8pt; border-bottom-color: #333; }
.sheet[data-dense] .ansfrac input.ans { width: 6.6mm; height: 3.5mm; font-size: 8.5pt; }
.q.is-ok .ansfrac, .q.is-bad .ansfrac { border-color: #333; background: #fff; }
.q.is-ok .ansfrac input, .q.is-bad .ansfrac input { color: #000; }
.sheet.show-answers .ansfrac .box__answer { color: #000; }


/* 인쇄에서는 채점 색을 빼고 깨끗한 지면으로 */
.q.is-ok .box, .q.is-bad .box { border-color: #333; background: #fff; }
.q.is-ok .box input, .q.is-bad .box input { color: #000; }
.q__mark { opacity: 0 !important; }

/* 정답 포함 인쇄 */
.sheet.show-answers .box__answer { color: #000; }

/* 표지 · 차례 · 정답 */
.cover { padding-top: 55mm; }
.cover__title { font-size: 34pt; }
.cover__vol { font-size: 17pt; }
.cover__meta div { border-color: #999; }

.toc__title { font-size: 17pt; }
.toc__unit { margin-top: 5mm; }
.toc__row { font-size: 9.5pt; padding: 1.4mm 0; }
.toc__row em { display: none; }

.key__title { font-size: 17pt; margin-bottom: 4mm; }
.key__round { margin-bottom: 4.5mm; }
.key__round h4 { font-size: 9pt; margin-bottom: 1.5mm; }
.key__list { font-size: 8.5pt; grid-template-columns: repeat(var(--keycols, 10), minmax(0, 1fr)); gap: 1mm 2mm; }
.key__list span { padding: .5mm 0; }
.key__list .frac { font-size: .6em; }

.focus { display: none; }

/* 3단 풀이 · 점수 칩 */
.scorechip { padding: 1.2mm 2.4mm 1.4mm; border-radius: 1.5mm; border-width: .5pt; }
.scorechip span { font-size: 7pt; }
.scorechip b { font-size: 10pt; }
.ways { margin-top: 3mm; gap: 2mm; }
.way { padding: 1.6mm 2.4mm 1.8mm; border-radius: 1.5mm; border-width: .5pt; }
.way__tag { font-size: 7pt; }
.way__a { font-size: 8pt; margin-top: 1mm; }
.way__b { font-size: 8.5pt; margin-top: .6mm; }

/* ── 중학교 기호 ─────────────────────────────────────────── */
.var { font-family: "Times New Roman", serif; font-style: italic; font-weight: 600; }
.pw { display: inline-block; white-space: nowrap; line-height: 1; }
.pow {
  font-size: .58em; font-weight: 700; line-height: 1;
  vertical-align: baseline; position: relative; top: -.72em;
}
.pw--paren .pow { top: -1.5em; }
.nck { display: inline-block; white-space: nowrap; line-height: 1; }
.nck > b { font-family: "Times New Roman", serif; font-weight: 600; font-size: 1.02em; }
.mat { display: inline-flex; align-items: stretch; vertical-align: middle; margin: 0 .6mm; }
.mat::before, .mat::after { content: ''; flex: 0 0 1.1mm; border: .8pt solid #222; }
.mat::before { border-right: 0; border-radius: 2mm 0 0 2mm / 50% 0 0 50%; }
.mat::after  { border-left: 0;  border-radius: 0 2mm 2mm 0 / 0 50% 50% 0; }
.mat__g { display: inline-grid; column-gap: 2.6mm; row-gap: .5mm; padding: .6mm .5mm;
  justify-items: center; align-items: center; }
.mat__c { display: inline-flex; align-items: center; white-space: nowrap; }
/* 칸 맨 앞의 빼기표는 부호다 — 연산 기호처럼 양옆을 벌리면 「− 3」이 된다 */
.mat__c > .op:first-child { padding-left: 0; padding-right: .06em; }
.sb { display: inline-block; white-space: nowrap; line-height: 1; }
.sb sub { font-family: "Times New Roman", serif; font-style: italic; font-size: .62em; font-weight: 600;
  vertical-align: baseline; position: relative; top: .32em; margin-left: .2mm; }
.fact { font-weight: 700; }
.nck sub { font-size: .6em; font-weight: 700; vertical-align: baseline;
  position: relative; top: .28em; margin: 0 .1mm; }
.rel, .ratio { color: #333; padding: 0 .8mm; }

.box--wide { width: 30mm; }
.sheet[data-dense] .box--wide { width: 26mm; }
.box--wide input.ans--text {
  font-family: "Times New Roman", serif; font-style: italic; font-weight: 700; font-size: 10pt;
}
.dots { color: #333; padding: 0 .6mm; }

/* 쪽 번호 — 시중 문제집처럼 숫자만. 테두리도 배경도 없다. */
.pageno {
  flex: none;
  padding-left: 2.6mm;
  border-left: .4pt solid #bbb;
  font-size: 11pt;
  font-weight: 800;
  line-height: 1;
  color: #333;
}
.sheet__foot { display: flex; align-items: baseline; justify-content: space-between; gap: 3mm; }

/* 근호 — 인쇄에서는 덮는 줄을 실선 굵기로 고정한다 */
.sqrt__rad { border-top-width: .5pt; padding: .5mm .6mm 0 .2mm; }
.sqrt__sign { font-size: 1.14em; }

/* 좌표평면 그림 — 인쇄에서는 선을 얇게, 그림을 조금 작게 */
.q--graph { padding: 2.4mm 0; }
.graph { max-width: 34mm; }
.graph .gx { stroke: #ddd; stroke-width: .5; }
.graph .ax { stroke: #333; stroke-width: 1.3; fill: #333; }
.graph .gd { stroke: #888; stroke-width: .8; }
.graph .cv { stroke: #222; stroke-width: 1.9; }
.graph .pt { fill: #222; stroke: #fff; stroke-width: 1; }
.gchoices { gap: 1mm 1.5mm; margin: 1mm 0; }
.gchoice figcaption { font-size: 8.5pt; color: #222; }
.gchoice .graph { max-width: 100%; }
.graph .gf { fill: #000; fill-opacity: .08; stroke: none; }
.graph .gn--l { fill: #222; }
.graph .gl, .graph .gp { fill: #222; }
.graph .gn { fill: #555; }

/* 평면도형 그림 — 인쇄는 흑백으로 */
.fig .fg { stroke: #222; stroke-width: 1.4; }
.fig .fg--fill { fill: #000; fill-opacity: .08; }
.fig .fd { stroke: #888; stroke-width: 1; }
.fig .fm { stroke: #555; stroke-width: 1; }
.fig .fl { fill: #222; }
.w__work .fig { float: right; width: 24mm; max-width: 24mm; margin: .6mm 0 1mm 2mm; }
.w__work .fig--wide { float: none; width: 100%; max-width: 100%; margin: .6mm 0 1mm; }
.fig .fr { stroke: #222; }
.fig .fl--a { fill: #222; }
.fig .fdot { fill: #222; }

/* 선분도 — 인쇄는 흑백으로 */
.segd { max-width: 62mm; }
.segd__name, .segd__v, .segd__sum { font-size: 8pt; }
.segd__box { stroke: #333; stroke-width: 1pt; }
.segd__box--mark { fill: #000; fill-opacity: .08; stroke: #333; }
.segd__v--mark { fill: #000; }
.segd__cut { stroke: #888; }
.segd__brace { stroke: #666; }

.q--src .q__stack { gap: 1mm; }
.q__src { font-size: 7.5pt; padding: 0 1.4mm; border-width: .5pt; }

.abs { border-left-width: .9pt; height: 1em; margin: 0 .5mm; }