/* resume page — Direction 3: white paper page, softly tinted panels with hairlines,
   no colour bands, no shadows. Loaded after styles.css and app-d3.css.
   Layout, copy, chips and every control stay exactly as they were. */

/* Panels: .hj-card already gives the tinted panel + hairline in app-d3.css; the
   resume-in-use card and the "What we took from it" panel just get their padding. */
.hj-resume-card{padding:20px 20px 20px 24px}
.hj-resume-card__sub{margin-top:4px;font-size:14px}
.hj-takeaways{padding:26px 28px;gap:22px}

/* Section labels in the side panel: display-font 15px 700 sentence case in the
   amber emphasis colour, instead of the tiny uppercase sans eyebrow in styles.css. */
.hj-takeaways .hj-eyebrow{
  font-family:var(--hj-font-display);font-weight:700;font-size:15px;
  line-height:1.3;letter-spacing:0;text-transform:none;color:var(--hj-gold);
}
.hj-takeaways .hj-h2{font-size:22px;line-height:1.2}
.hj-takeaways .hj-help{margin-top:4px}
.hj-takeaways .hj-chiprow{margin-top:10px}
.hj-takeaways__value{font-family:var(--hj-font-body)}

/* Section titles on this page (edit panel, earlier uploads): the .hj-h2 size,
   set here instead of inline at the markup. */
.hj-resume .hj-h2{font-family:var(--hj-font-display);font-weight:700;font-size:22px;line-height:1.2}
.hj-resume .hj-section-head{margin-bottom:6px}
.hj-resume__main{gap:24px}

/* The resume preview is paper on the page, not a floating card: flat, hairline, 2px. */
.hj-resume .hj-paper{background:var(--hj-card);border:1px solid var(--hj-hair);border-radius:2px;box-shadow:none}

/* Empty state: the drop zone is a soft tinted panel with a dashed hairline, 2px corners. */
.hj-resume-empty .hj-drop{border:2px dashed var(--hj-edge);border-radius:2px;background:var(--hj-hover)}
.hj-resume-empty .hj-drop:hover,.hj-resume-empty .hj-drop.is-dragging{border-color:var(--hj-gold);background:var(--hj-gold-soft)}
.hj-resume-empty .hj-drop__icon{border-radius:2px}
.hj-resume-empty .hj-drop:hover .hj-drop__icon,.hj-resume-empty .hj-drop.is-dragging .hj-drop__icon{background:var(--hj-card)}
.hj-drop__pick{margin-top:6px}

/* Notices and editor notes: spacing that used to sit inline in the markup. */
.hj-resume__notice{margin-bottom:16px}
.hj-editor__note{margin:0}

@media (max-width: 760px) {
  .hj-takeaways{padding:20px 18px}
  .hj-takeaways .hj-eyebrow{font-size:14px}
  .hj-resume-card{padding:16px}
}