* { box-sizing: border-box; }
:root {
  --paper: #fffefa;
  --ink: #181b17;
  --muted: #687068;
  --rule: #c9c5bb;
  --surface: #f1eee6;
  --accent: #b94b32;
  --display: "Noto Serif KR", serif;
  --body: "Noto Sans KR", sans-serif;
  --mono: "IBM Plex Mono", monospace;
}
html[data-variant="b"] {
  --paper: #ffffff;
  --ink: #102131;
  --muted: #61707b;
  --rule: #bbc8d0;
  --surface: #edf3f5;
  --accent: #2d6f71;
  --display: "IBM Plex Sans KR", sans-serif;
  --body: "IBM Plex Sans KR", sans-serif;
}
html[data-variant="c"] {
  --paper: #fffdf7;
  --ink: #21352b;
  --muted: #6c756d;
  --rule: #cbc4b7;
  --surface: #f0eadc;
  --accent: #176747;
  --display: "Gowun Batang", serif;
  --body: "Noto Sans KR", sans-serif;
}

html, body { margin: 0; min-width: 320px; }
body {
  color: var(--ink);
  background: #c9cdd0;
  font-family: var(--body);
  font-size: 9.4pt;
  line-height: 1.45;
  letter-spacing: -.018em;
  word-break: keep-all;
  -webkit-font-smoothing: antialiased;
}

.preview-toolbar {
  position: sticky;
  z-index: 20;
  top: 0;
  min-height: 54px;
  padding: 8px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  color: #e9eef2;
  background: #17212a;
  font-size: 12px;
}
.preview-toolbar div { display: flex; gap: 8px; }
.preview-toolbar a, .preview-toolbar button { color: inherit; text-decoration: none; }
.preview-toolbar div a { padding: 6px 10px; border: 1px solid #46535c; }
.preview-toolbar button { padding: 8px 12px; background: #2c704f; border: 0; cursor: pointer; }

.print-stage { padding: 32px 0 64px; display: grid; gap: 26px; justify-content: center; }
.sheet {
  position: relative;
  width: 210mm;
  height: 297mm;
  padding: 13mm 15mm 12mm;
  overflow: hidden;
  color: var(--ink);
  background: var(--paper);
  box-shadow: 0 18px 50px rgba(23, 30, 37, .22);
}

.resume-header { display: grid; grid-template-columns: 26mm minmax(0, 1fr) 48mm; gap: 7mm; align-items: start; }
.resume-photo { width: 26mm; height: 34mm; overflow: hidden; }
.resume-photo img { width: 100%; height: 100%; object-fit: cover; }
.kicker { margin: 0; color: var(--accent); font-family: var(--mono); font-size: 6.3pt; font-weight: 600; letter-spacing: .1em; }
.resume-title h1 { margin: 1.5mm 0 0; font-family: var(--display); font-size: 22pt; line-height: 1; letter-spacing: -.06em; }
.resume-title h2 { margin: 2.3mm 0 0; font-family: var(--display); font-size: 12.5pt; line-height: 1.36; letter-spacing: -.04em; }
.resume-title h2 em { color: var(--accent); font-style: normal; }
.resume-title > p:last-child { margin: 2.6mm 0 0; color: var(--muted); font-size: 7.7pt; line-height: 1.55; }
.contact-list { margin: 0; border-top: .35mm solid var(--ink); }
.contact-list div { padding: 2mm 0; display: grid; grid-template-columns: 5mm 1fr; border-bottom: .2mm solid var(--rule); }
.contact-list dt { color: var(--accent); font-family: var(--mono); font-size: 6.4pt; font-weight: 600; }
.contact-list dd { margin: 0; font-family: var(--mono); font-size: 6.6pt; }

.print-metrics { margin: 6mm 0 0; display: grid; grid-template-columns: repeat(4, 1fr); border-block: .28mm solid var(--ink); }
.print-metrics div { padding: 2.7mm 3mm; border-left: .2mm solid var(--rule); }
.print-metrics div:first-child { border-left: 0; }
.print-metrics dt { color: var(--accent); font-family: var(--display); font-size: 14pt; font-weight: 700; line-height: 1; }
.print-metrics dd { margin: 1mm 0 0; color: var(--muted); font-family: var(--mono); font-size: 6pt; }

.print-section { margin-top: 5mm; }
.print-section h3 { margin: 0 0 2.6mm; display: flex; align-items: center; gap: 3mm; font-family: var(--display); font-size: 11.5pt; line-height: 1.2; }
.print-section h3::after { height: .2mm; flex: 1; background: var(--rule); content: ""; }
.print-section h3 span { color: var(--accent); font-family: var(--mono); font-size: 6.4pt; }
.profile-section > p { margin: 0; color: var(--muted); font-size: 8.3pt; line-height: 1.6; }
.profile-section > p + p { margin-top: 1.2mm; }

.capability-grid { margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 2.1mm 5mm; list-style: none; }
.capability-grid li { padding-left: 3mm; border-left: .7mm solid var(--accent); }
.capability-grid b { font-size: 7.7pt; }
.capability-grid p { margin: .7mm 0 0; color: var(--muted); font-size: 7pt; line-height: 1.45; }

.print-job { padding: 2.8mm 0; border-top: .2mm solid var(--rule); }
.print-job header { display: grid; grid-template-columns: 1fr auto; gap: 5mm; align-items: start; }
.print-job header div { display: flex; align-items: baseline; gap: 2.4mm; }
.print-job header b { font-family: var(--display); font-size: 8.5pt; }
.print-job header strong { color: var(--accent); font-size: 7pt; }
.print-job time { color: var(--muted); font-family: var(--mono); font-size: 6.3pt; }
.print-job ul { margin: 1.7mm 0 0; padding-left: 4.5mm; color: var(--muted); font-size: 7.15pt; line-height: 1.48; }
.print-job li { margin-top: .5mm; }
.print-job li::marker { color: var(--accent); }
.print-job.compact { padding: 2.3mm 0; }

.print-subproject { margin-top: 1.6mm; }
.print-subproject > div {
  padding: 1.1mm 1.5mm;
  display: flex;
  align-items: baseline;
  gap: 2mm;
  background: var(--surface);
  border-left: .7mm solid var(--accent);
}
.print-subproject > div b { color: var(--accent); font-size: 6.8pt; }
.print-subproject > div strong { font-size: 6.2pt; }
.print-subproject > div time { margin-left: auto; color: var(--muted); font-family: var(--mono); font-size: 5.8pt; }
.print-subproject ul { margin-top: 1.1mm; }

.page-two-header { padding-bottom: 3mm; display: flex; justify-content: space-between; align-items: end; border-bottom: .35mm solid var(--ink); }
.page-two-header strong { font-family: var(--display); font-size: 9pt; }
.continued { margin-top: 4.5mm; }

.print-ai-loop { margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); list-style: none; border-block: .2mm solid var(--rule); }
.print-ai-loop li { padding: 2.3mm 2.5mm; border-left: .2mm solid var(--rule); }
.print-ai-loop li:first-child { border-left: 0; }
.print-ai-loop b { color: var(--accent); font-size: 7.2pt; }
.print-ai-loop p { margin: .8mm 0 0; color: var(--muted); font-size: 6.4pt; }
.ai-boundary { margin: 1.2mm 0 0; padding: 1.1mm 2mm; color: var(--muted); background: var(--surface); font-size: 6.2pt; line-height: 1.4; }

.print-projects { display: grid; grid-template-columns: 1fr 1fr; gap: 2.3mm 5mm; }
.print-projects article { padding: 2.2mm 0 2.2mm 3mm; border-left: .7mm solid var(--accent); }
.print-projects b { font-family: var(--display); font-size: 7.8pt; }
.print-projects p { margin: .8mm 0 0; color: var(--muted); font-size: 6.7pt; line-height: 1.42; }
.print-projects span { color: var(--accent); font-family: var(--mono); font-size: 5.7pt; }
.print-projects .catalog-print { grid-column: 1 / -1; }
.print-projects .project-method { font-size: 6.1pt; line-height: 1.35; }
.print-projects .project-method > span:first-child { margin-right: 1.2mm; font-weight: 700; letter-spacing: .06em; }

.bottom-grid { margin-top: 4.5mm; display: grid; grid-template-columns: 1.08fr .92fr; gap: 6mm; }
.bottom-grid .print-section { margin-top: 0; }
.bottom-grid dl { margin: 0; }
.bottom-grid dl div { padding: 1.25mm 0; display: grid; grid-template-columns: 18mm 1fr; gap: 2mm; border-top: .2mm solid var(--rule); }
.bottom-grid dt { color: var(--accent); font-size: 6.3pt; font-weight: 700; }
.bottom-grid dd { margin: 0; color: var(--muted); font-size: 6.3pt; line-height: 1.38; }

.page-footer { position: absolute; right: 15mm; bottom: 6mm; left: 15mm; padding-top: 2mm; display: flex; justify-content: space-between; color: var(--muted); font-family: var(--mono); font-size: 5.8pt; border-top: .2mm solid var(--rule); }

/* B — crisp operator print */
html[data-variant="b"] .sheet { padding-top: 0; }
html[data-variant="b"] .resume-header { margin-inline: -15mm; padding: 10mm 15mm 7mm; color: #f1f6f4; background: #102131; grid-template-columns: 25mm 1fr 49mm; }
html[data-variant="b"] .resume-title > p:last-child, html[data-variant="b"] .resume-header .contact-list dt, html[data-variant="b"] .resume-header .contact-list dd { color: #d2dde0; }
html[data-variant="b"] .resume-header .contact-list { border-top-color: #b9ff55; }
html[data-variant="b"] .resume-header .contact-list div { border-bottom-color: #395064; }
html[data-variant="b"] .resume-header .kicker, html[data-variant="b"] .resume-title h2 em { color: #b9ff55; }
html[data-variant="b"] .print-metrics dt, html[data-variant="b"] .print-section h3 span, html[data-variant="b"] .print-job header strong,
html[data-variant="b"] .print-ai-loop b, html[data-variant="b"] .bottom-grid dt { color: #2d6f71; }
html[data-variant="b"] .page-two-header { margin: -13mm -15mm 0; padding: 8mm 15mm 5mm; color: #f1f6f4; background: #102131; border-bottom: 1.8mm solid #b9ff55; }
html[data-variant="b"] .page-two-header .kicker { color: #b9ff55; }
html[data-variant="b"] .continued { margin-top: 5mm; }
html[data-variant="b"] .capability-grid li, html[data-variant="b"] .print-projects article { border-left-color: #2d6f71; }
html[data-variant="b"] .print-ai-loop { background: var(--surface); }

/* C — warm casebook print */
html[data-variant="c"] .sheet { border-top: 4mm solid var(--accent); }
html[data-variant="c"] .resume-photo { border-radius: 13mm 13mm 1mm 1mm; }
html[data-variant="c"] .resume-title h1 { font-size: 23pt; }
html[data-variant="c"] .print-metrics { border-color: var(--accent); background: var(--surface); }
html[data-variant="c"] .print-section h3 span { width: 6mm; height: 6mm; display: grid; place-items: center; color: #fff; background: var(--accent); border-radius: 50%; }
html[data-variant="c"] .capability-grid li { padding: 2mm 2.5mm; background: var(--surface); border-left: 0; border-radius: 0 4mm 0 0; }
html[data-variant="c"] .page-two-header { padding-bottom: 3mm; border-bottom: 1mm solid var(--accent); }
html[data-variant="c"] .print-projects article { padding: 2.2mm 2.6mm; background: var(--surface); border-left: 0; }
html[data-variant="c"] .greenputt-print { box-shadow: inset 1mm 0 0 var(--accent); }

/* Keep page one as dense and readable as the Word master without crowding page two. */
.page-one .print-section { margin-top: 6.3mm; }
.page-one .print-section h3 { margin-bottom: 3mm; }
.page-one .profile-section > p { font-size: 8.6pt; line-height: 1.66; }
.page-one .capability-grid { gap: 2.6mm 5mm; }
html[data-variant="c"] .page-one .capability-grid li { padding: 2.5mm 2.8mm; }
.page-one .print-job { padding: 3.7mm 0; }
.page-one .print-job ul { font-size: 7.85pt; line-height: 1.56; }
.page-one .print-job li { margin-top: 1mm; }

@page { size: A4; margin: 0; }
@media print {
  html, body { width: 210mm; background: #fff; }
  .preview-toolbar { display: none; }
  .print-stage { padding: 0; display: block; }
  .sheet { margin: 0; box-shadow: none; break-after: page; page-break-after: always; }
  .sheet:last-child { break-after: auto; page-break-after: auto; }
}

@media (max-width: 850px) {
  .preview-toolbar { position: relative; flex-wrap: wrap; }
  .preview-toolbar div { order: 3; width: 100%; overflow-x: auto; }
  .print-stage { padding-inline: 12px; justify-content: start; overflow-x: auto; }
  .sheet { transform-origin: top left; }
}