/* ── Resume paper ─────────────────────────────────────────────────────
   Shared by the builder (/tools/resume-builder) and the public share page
   (/r/<id>). It lived inline in the builder until the share page needed the
   same rules — keeping one copy is what stops the two drifting apart. */

/* ── The resume paper (A4) ─────────────────────────────────────────── */
.rb-paper-shell { background:var(--bg); border:1px solid var(--border); border-radius:var(--radius); padding:18px; overflow:auto; }
#resumePaper {
  --ac: #2563EB;
  width:210mm; max-width:100%;
  min-height:297mm;
  margin-inline:auto;
  background:#fff; color:#1f2733;
  box-shadow:var(--shadow);
  font-family:'Inter', system-ui, sans-serif;
  font-size:10.5pt; line-height:1.5;
  transform-origin: top center;
  /* Keep backgrounds (skill chips, sidebar) when printing to PDF */
  -webkit-print-color-adjust: exact; print-color-adjust: exact;
  /* Break long words / emails / URLs so nothing overflows the page (inherited) */
  overflow-wrap: anywhere; word-break: break-word;
}
/* Scale the mm-wide paper down to fit narrow screens */
@media (max-width: 760px){ .rb-paper-shell { padding:10px; } }

#resumePaper .pg { padding:15mm 16mm; }
#resumePaper h1, #resumePaper h2, #resumePaper h3 { font-family:'Inter', sans-serif; }

/* Header */
.r-head { display:flex; gap:18px; align-items:center; margin-bottom:5mm; }
.r-photo { width:29mm; height:29mm; border-radius:50%; object-fit:cover; flex-shrink:0; box-shadow:0 0 0 1px rgba(15,23,42,.06); }
.r-name { font-size:23pt; font-weight:800; line-height:1.06; color:#111827; letter-spacing:-.025em; }
.r-title { font-size:12pt; font-weight:600; color:var(--ac); margin-top:3px; letter-spacing:.005em; }
.r-contact { margin-top:9px; display:flex; flex-direction:column; gap:3px; font-size:9.2pt; color:#67717f; }
.r-contact a { color:#5b6573; }
.r-contact span { display:inline-flex; align-items:center; }

/* Section heading */
.r-sec { margin-top:5.6mm; }
.r-sec:first-of-type { margin-top:0; }
/* One muted accent, not a heavy accent bar under every heading: the heading
   carries the colour, the rule stays a neutral hairline. Reads as editorial
   rather than as a stack of blue underlines. */
.r-h { font-size:9.4pt; font-weight:800; letter-spacing:.13em; text-transform:uppercase;
  color:var(--ac); padding-bottom:2mm; border-bottom:1px solid #e4e9f0;
  margin-bottom:2.8mm; break-after:avoid; }
.r-summary { font-size:9.8pt; color:#3b4452; line-height:1.55; }

.r-entry { margin-bottom:3.2mm; break-inside:avoid; }
.r-entry:last-child { margin-bottom:0; }
.r-entry-top { display:flex; justify-content:space-between; gap:12px; align-items:baseline; }
.r-role { font-weight:700; font-size:10.6pt; color:#1f2733; min-width:0; }
.r-period { font-size:8.8pt; color:#6b7280; white-space:nowrap; font-weight:500; letter-spacing:.01em; }
.r-org { font-size:9.6pt; color:var(--ac); font-weight:600; margin-top:1px; }
.r-org .r-loc { color:#6b7280; font-weight:500; }
.r-desc { font-size:9.4pt; color:#4b5563; margin-top:2px; }
/* list-style:none matters: without it the browser's own marker renders
   alongside the custom ::before dot below, giving every bullet two dots. */
.r-bullets { margin-top:3px; padding-left:0; list-style:none; }
.r-bullets li { position:relative; padding-left:14px; font-size:9.4pt; color:#4b5563; margin-bottom:1.5px; line-height:1.45; }
.r-bullets li::before { content:""; position:absolute; left:2px; top:6.5px; width:3.5px; height:3.5px; border-radius:50%; background:var(--ac); }

.r-chips { display:flex; flex-wrap:wrap; gap:5px 6px; }
.r-chip { font-size:8.8pt; background:#f2f5f9; color:#3a4557; padding:3.5px 11px; border-radius:999px; font-weight:500;
          -webkit-print-color-adjust:exact; print-color-adjust:exact; }
.r-two { display:grid; grid-template-columns:1fr 1fr; gap:2mm 8mm; }
.r-langrow { display:flex; justify-content:space-between; align-items:baseline; gap:10px; font-size:9.5pt; color:#5b6573; padding:1.5px 0; break-inside:avoid; }
.r-langrow + .r-langrow { border-top:1px solid #eef1f5; }
.r-langrow b { color:#1f2733; font-weight:600; min-width:0; }

/* Sidebar template variant */
#resumePaper.tpl-sidebar .pg { padding:0; display:grid; grid-template-columns:62mm 1fr; }
#resumePaper.tpl-sidebar .r-aside { background:#f8fafc; padding:14mm 9mm; }
#resumePaper.tpl-sidebar .r-main { padding:14mm 12mm 14mm 10mm; }
#resumePaper.tpl-sidebar .r-head { flex-direction:column; text-align:center; gap:10px; margin-bottom:0; }
#resumePaper.tpl-sidebar .r-name { font-size:19pt; }
#resumePaper.tpl-sidebar .r-contact { flex-direction:column; gap:6px; }
#resumePaper.tpl-sidebar .r-aside .r-h { font-size:9.5pt; }
/* Stop long emails / URLs / titles from overflowing the narrow sidebar */
#resumePaper.tpl-sidebar .r-aside { min-width:0; }
#resumePaper.tpl-sidebar .r-aside .r-name,
#resumePaper.tpl-sidebar .r-aside .r-title,
#resumePaper.tpl-sidebar .r-aside .r-contact span,
#resumePaper.tpl-sidebar .r-aside .r-chip,
#resumePaper.tpl-sidebar .r-aside .r-langrow { overflow-wrap:anywhere; word-break:break-word; }
#resumePaper.tpl-sidebar .r-aside .r-langrow { flex-wrap:wrap; }
#resumePaper.tpl-sidebar .r-aside .r-langrow b,
#resumePaper.tpl-sidebar .r-aside .r-langrow span { min-width:0; }

/* Modern template: full-width accent header band + left-bar section headings */
#resumePaper.tpl-modern .pg { padding-top:0; }
#resumePaper.tpl-modern .r-head { background:var(--ac); margin:0 -16mm 8mm; padding:15mm 16mm 11mm;
  align-items:center; -webkit-print-color-adjust:exact; print-color-adjust:exact; }
#resumePaper.tpl-modern .r-name { color:#fff; font-size:25pt; }
#resumePaper.tpl-modern .r-title { color:rgba(255,255,255,.9); }
#resumePaper.tpl-modern .r-contact { flex-direction:row; flex-wrap:wrap; gap:4px 16px; margin-top:10px; }
#resumePaper.tpl-modern .r-contact,
#resumePaper.tpl-modern .r-contact a,
#resumePaper.tpl-modern .r-contact span { color:rgba(255,255,255,.92); }
#resumePaper.tpl-modern .r-photo { box-shadow:0 0 0 2px rgba(255,255,255,.6); }
/* headings: accent left-bar instead of the classic full underline */
#resumePaper.tpl-modern .r-h { border-bottom:none; padding:0 0 0 11px; position:relative; color:var(--ac); }
#resumePaper.tpl-modern .r-h::before { content:""; position:absolute; left:0; top:1px; bottom:1px; width:4px;
  border-radius:2px; background:var(--ac); -webkit-print-color-adjust:exact; print-color-adjust:exact; }

/* Compact template: tighter spacing + smaller type — fits more on one page */
#resumePaper.tpl-compact .pg { padding:11mm 13mm; }
#resumePaper.tpl-compact .r-head { margin-bottom:3.5mm; }
#resumePaper.tpl-compact .r-name { font-size:19pt; }
#resumePaper.tpl-compact .r-title { font-size:10.5pt; }
#resumePaper.tpl-compact .r-sec { margin-top:4mm; }
#resumePaper.tpl-compact .r-h { font-size:9pt; margin-bottom:1.8mm; padding-bottom:1.5px; }
#resumePaper.tpl-compact .r-summary { font-size:9pt; line-height:1.45; }
#resumePaper.tpl-compact .r-entry { margin-bottom:2.3mm; }
#resumePaper.tpl-compact .r-role { font-size:9.8pt; }
#resumePaper.tpl-compact .r-org { font-size:9pt; }
#resumePaper.tpl-compact .r-bullets li { font-size:8.8pt; line-height:1.35; margin-bottom:1px; }
#resumePaper.tpl-compact .r-chip { font-size:8.4pt; padding:2px 8px; }
#resumePaper.tpl-compact .r-langrow { font-size:9pt; padding:1px 0; }

/* Elegant template: serif headings + centred editorial header */
#resumePaper.tpl-elegant .r-name,
#resumePaper.tpl-elegant .r-h { font-family:Georgia, 'Times New Roman', serif; }
#resumePaper.tpl-elegant .r-head { flex-direction:column; align-items:center; text-align:center; gap:7px; margin-bottom:6mm; }
#resumePaper.tpl-elegant .r-name { font-size:25pt; font-weight:700; letter-spacing:.005em; }
#resumePaper.tpl-elegant .r-title { color:#6b7280; font-weight:600; letter-spacing:.14em; text-transform:uppercase; font-size:9.5pt; margin-top:5px; }
#resumePaper.tpl-elegant .r-contact { flex-direction:row; flex-wrap:wrap; justify-content:center; gap:3px 16px; margin-top:9px; }
#resumePaper.tpl-elegant .r-h { text-transform:none; letter-spacing:.02em; font-size:13pt; font-weight:700; color:#1f2733;
  border-bottom:1px solid #d7dde5; padding-bottom:3px; margin-bottom:3mm; }

/* Timeline: entries hang off an accent rail with a dot per role */
#resumePaper.tpl-timeline .r-h { border-bottom:none; font-size:9.5pt; margin-bottom:3mm; }
#resumePaper.tpl-timeline .r-sec { margin-top:5.5mm; }
#resumePaper.tpl-timeline .r-entry { position:relative; padding-left:7mm; border-left:1.5px solid #e4e9f0;
  padding-bottom:1.4mm; margin-bottom:2.4mm; }
#resumePaper.tpl-timeline .r-entry::before { content:""; position:absolute; left:-4px; top:2.2mm;
  width:7.5px; height:7.5px; border-radius:50%; background:var(--ac); box-shadow:0 0 0 2px #fff;
  -webkit-print-color-adjust:exact; print-color-adjust:exact; }
#resumePaper.tpl-timeline .r-summary { padding-left:7mm; }

/* Bold: heavy name, section headings as filled accent chips */
#resumePaper.tpl-bold .r-head { border-bottom:3px solid var(--ac); padding-bottom:5mm; margin-bottom:5mm;
  -webkit-print-color-adjust:exact; print-color-adjust:exact; }
#resumePaper.tpl-bold .r-name { font-size:27pt; font-weight:900; letter-spacing:-.03em; }
#resumePaper.tpl-bold .r-title { font-size:10pt; font-weight:700; text-transform:uppercase; letter-spacing:.13em; margin-top:5px; }
#resumePaper.tpl-bold .r-h { display:inline-block; background:var(--ac); color:#fff; border-bottom:none;
  padding:2.5px 9px; border-radius:3px; letter-spacing:.08em; font-size:8.8pt;
  -webkit-print-color-adjust:exact; print-color-adjust:exact; }
#resumePaper.tpl-bold .r-role { font-size:11pt; font-weight:800; }

/* Executive: uppercase name over a double rule, headings trailed by a hairline */
#resumePaper.tpl-executive .r-head { border-bottom:3px double #2f3947; padding-bottom:4.5mm; margin-bottom:5mm; }
#resumePaper.tpl-executive .r-name { font-size:20pt; font-weight:700; text-transform:uppercase; letter-spacing:.06em; }
#resumePaper.tpl-executive .r-title { color:#5b6573; font-size:10.5pt; letter-spacing:.03em; }
#resumePaper.tpl-executive .r-contact { flex-direction:row; flex-wrap:wrap; gap:3px 14px; margin-top:7px; }
#resumePaper.tpl-executive .r-h { border-bottom:none; color:#1f2733; font-size:9.2pt;
  display:flex; align-items:center; gap:9px; }
/* 1.5px, not 1px — a hairline on a fractional device pixel renders half-grey
   on some rows and full accent on others, which reads as a bug on screen. */
#resumePaper.tpl-executive .r-h::after { content:""; flex:1; height:1.5px; background:var(--ac);
  -webkit-print-color-adjust:exact; print-color-adjust:exact; }

/* Minimal: no rules, wide margins, skills as a plain middot-separated list.
   The most conservative option — safest through older ATS parsers. */
#resumePaper.tpl-minimal .pg { padding:18mm; }
#resumePaper.tpl-minimal .r-name { font-size:20pt; font-weight:600; letter-spacing:-.01em; }
#resumePaper.tpl-minimal .r-title { color:#6b7280; font-weight:500; }
#resumePaper.tpl-minimal .r-sec { margin-top:6.5mm; }
#resumePaper.tpl-minimal .r-h { border-bottom:none; color:#9aa3b0; font-size:8.2pt; letter-spacing:.18em; margin-bottom:2.2mm; }
#resumePaper.tpl-minimal .r-chips { gap:2px 0; }
#resumePaper.tpl-minimal .r-chip { background:transparent; padding:0 11px 0 0; position:relative; color:#4b5563; }
#resumePaper.tpl-minimal .r-chip::after { content:"·"; position:absolute; right:2px; color:#c3cbd6; }
#resumePaper.tpl-minimal .r-chip:last-child::after { content:none; }
#resumePaper.tpl-minimal .r-langrow + .r-langrow { border-top:none; }