/* ==========================================================================
   S5 · THE LIVING CAREER DESK
   --------------------------------------------------------------------------
   One benchmark only: the populated Résumé Studio. Conxfolio's paper and ink
   remain; evidence, readiness and action hierarchy become visible. This layer
   is intentionally scoped so no other tool inherits an unfinished system.
   ========================================================================== */

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 {
  --s5-intel: var(--cx-ink);
  --s5-intel-soft: color-mix(in srgb, var(--s5-intel) 8%, var(--cx-paper));
  --s5-evidence: var(--cx-ok-fg);
  --s5-rule: color-mix(in srgb, var(--cx-ink) 14%, transparent);
}

.folio-v5 .resume-mobile-progress,
.folio-v5 .resume-mobile-evidence,
.folio-v5 .resume-mobile-dock { display: none; }
.folio-v5 .import-receipt-full { display: none; }
.folio-v5 .import-receipt-compact { display: inline; }

/* Preview and download are document actions, not discoveries hidden inside a
   later screen. The desktop top bar and the compact command shelf use the
   same real controls and the same download menu. */
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-primary-actions {
  display: flex;
  align-items: center;
  gap: var(--cx-s2);
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-primary-actions > .button,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-download-menu > summary {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  white-space: nowrap;
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-primary-actions [data-cx-icon],
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-download-menu > summary [data-cx-icon] {
  width: 17px;
  height: 17px;
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-download-menu > div {
  width: 224px;
  padding: 7px;
  border-radius: 9px;
  box-shadow: 0 18px 44px color-mix(in srgb, var(--cx-ink) 16%, transparent);
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-download-menu > div > button {
  min-height: 58px;
  display: grid;
  gap: 4px;
  align-content: center;
  border-radius: 6px;
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-download-menu > div > button b {
  font: 600 13px/1 var(--cx-font-ui);
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-download-menu > div > button small {
  color: var(--cx-ink60);
  font: 400 11px/1.25 var(--cx-font-ui);
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-preview-toolbar { display: none; }
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-demo-notice {
  min-height: 52px;
  display: flex;
  align-items: center;
  gap: var(--cx-s4);
  padding: var(--cx-s2) clamp(var(--cx-s5), 3vw, var(--cx-s8));
  color: var(--cx-ink);
  border-bottom: 1px solid color-mix(in srgb, var(--cx-ask-fg) 32%, var(--cx-line));
  background: color-mix(in srgb, var(--cx-ask-bg) 72%, var(--cx-paper));
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-demo-notice > span {
  flex: none;
  color: var(--cx-ask-fg);
  font: 600 10px/1 var(--cx-font-mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-demo-notice p {
  min-width: 0;
  flex: 1;
  margin: 0;
  font: 400 12px/1.4 var(--cx-font-ui);
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-demo-notice p b { font-weight: 600; }
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-demo-notice .button { flex: none; min-height: 36px; }

@media (min-width: 1180px) {
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5:has(.resume-editor-page) { --s4-nav-w: 188px; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5:has(.resume-editor-page) .studio-product-nav { width: var(--s4-nav-w); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5:has(.resume-editor-page) .tool-workflow-step { min-height: 70px; padding-inline: var(--cx-s4); }

  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page > .career-resume-header.s3-row2 {
    min-height: 64px;
    height: 64px;
    justify-content: flex-end;
    padding: 0 var(--cx-s6);
    background: var(--cx-paper);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .s3-row2-left { display: none; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-command-bar {
    width: 100%;
    justify-content: flex-end;
    gap: var(--cx-s4);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-command-bar > [data-s3-primary] { display: none; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-command-bar .v5-open { display: none; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-command-bar .button,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-version-menu > summary { min-height: 42px; }

  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-layout {
    display: grid;
    grid-template-columns: 150px minmax(430px, 1fr) 260px minmax(340px, 360px);
    gap: 0;
    padding: 0;
    background: var(--cx-paper);
    align-items: stretch;
  }

  /* S3 gave each studio column a standalone width. Inside the S5 grid those
     legacy minima must yield to the track, otherwise the evidence desk grows
     to ~550px and pushes the real document preview beyond the viewport. */
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-section-nav,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-canvas,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-evidence-desk,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-design-canvas,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-preview {
    width: auto;
    min-width: 0;
    max-width: none;
  }

  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-section-nav,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-evidence-desk,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-preview {
    position: sticky;
    top: calc(var(--s1-bar-h) + 64px);
    height: calc(100vh - var(--s1-bar-h) - 64px);
    overflow: auto;
  }

  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-section-nav {
    padding: var(--cx-s8) 0;
    border-right: 1px solid var(--s5-rule);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-section-nav > span {
    padding-inline: var(--cx-s5);
    color: var(--cx-ink60);
    font: 500 10px/1 var(--cx-font-mono);
    letter-spacing: .1em;
    text-transform: uppercase;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-section-nav button {
    position: relative;
    min-height: 60px;
    padding: var(--cx-s3) var(--cx-s5);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-section-nav button::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 2px;
    background: transparent;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-section-nav button.on {
    background: var(--cx-porcelain);
    color: var(--cx-ink);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-section-nav button.on::before { background: var(--cx-ink); }

  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-canvas {
    min-height: calc(100vh - var(--s1-bar-h) - 64px);
    padding: var(--cx-s10) clamp(var(--cx-s7), 3vw, var(--cx-s12));
    border-right: 1px solid var(--s5-rule);
    background: var(--cx-paper);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section { background: transparent; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section > header {
    margin: 0 0 var(--cx-s8);
    padding: 0 0 var(--cx-s7);
    border-bottom: 1px solid var(--cx-ink);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section > header h2 {
    font: 400 clamp(42px, 3.4vw, 58px)/.96 var(--cx-font-display);
    letter-spacing: -.035em;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section > header p {
    max-width: 42rem;
    margin-top: var(--cx-s4);
    color: var(--cx-ink60);
    font: 400 15px/1.5 var(--cx-font-ui);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section > .editor-body { padding: 0; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section .form-grid { gap: var(--cx-s7) var(--cx-s6); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section .field label {
    color: var(--cx-ink60);
    font: 400 12px/1.2 var(--cx-font-ui);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section .field input,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section .field textarea {
    border: 0;
    border-bottom: 1px solid var(--s5-rule);
    border-radius: 0;
    padding: 12px 2px;
    background: transparent;
    box-shadow: none;
    color: var(--cx-ink);
    font: 400 16px/1.45 var(--cx-font-ui);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section .field textarea { min-height: 116px; resize: vertical; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section .field input:focus,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section .field textarea:focus {
    outline: 0;
    border-bottom-color: var(--s5-intel);
    box-shadow: 0 1px 0 var(--s5-intel);
  }

  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-evidence-desk {
    padding: var(--cx-s7) var(--cx-s5);
    border-right: 1px solid var(--s5-rule);
    background: var(--cx-porcelain);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-evidence-desk > header,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-evidence-desk > section { padding: 0 0 var(--cx-s6); margin: 0 0 var(--cx-s6); border-bottom: 1px solid var(--s5-rule); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-evidence-desk > header { display: flex; align-items: baseline; justify-content: space-between; gap: var(--cx-s2); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-evidence-desk > header span,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-evidence-desk > section > span {
    color: var(--cx-ink60);
    font: 500 10px/1 var(--cx-font-mono);
    letter-spacing: .1em;
    text-transform: uppercase;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-evidence-desk > header small { color: var(--s5-evidence); font: 500 10px/1.2 var(--cx-font-ui); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-readiness-line { display: grid; grid-template-columns: repeat(3, 1fr); align-items: center; gap: 0; margin: var(--cx-s5) 0 var(--cx-s4); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-readiness-line::before { content: ""; grid-column: 1 / -1; grid-row: 1; height: 1px; background: var(--cx-line); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-readiness-line i { grid-row: 1; justify-self: center; z-index: 1; width: 10px; height: 10px; border: 1px solid var(--cx-ink60); border-radius: 50%; background: var(--cx-porcelain); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-readiness-line[data-ready="true"] i:nth-child(-n+2) { border-color: var(--s5-evidence); background: var(--s5-evidence); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-readiness > b { display: block; margin-bottom: 4px; font: 500 14px/1.2 var(--cx-font-ui); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-readiness > small { color: var(--cx-ink60); font: 400 11px/1.35 var(--cx-font-ui); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-smart-suggestion p { margin: var(--cx-s4) 0; color: var(--cx-ink60); font: 400 13px/1.5 var(--cx-font-ui); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-smart-suggestion blockquote {
    margin: 0;
    padding: var(--cx-s4);
    color: var(--s5-intel);
    background: var(--s5-intel-soft);
    border: 1px solid color-mix(in srgb, var(--s5-intel) 42%, transparent);
    font: 500 13px/1.45 var(--cx-font-ui);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-evidence-map svg { width: 100%; height: 86px; margin-top: var(--cx-s3); overflow: visible; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-evidence-map svg path { fill: none; stroke: var(--cx-line); stroke-width: 1; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-evidence-map svg circle { fill: var(--cx-porcelain); stroke: var(--s5-intel); stroke-width: 1.5; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-evidence-map svg circle:nth-of-type(2) { stroke: var(--cx-ink); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-evidence-map svg text { text-anchor: middle; fill: var(--cx-ink); font: 500 12px/1 var(--cx-font-mono); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-evidence-map > div { display: flex; justify-content: space-between; gap: var(--cx-s2); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-evidence-map > div small { color: var(--cx-ink60); font: 400 10px/1.2 var(--cx-font-ui); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-evidence-map > div b { color: var(--cx-ink); font-weight: 500; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-source-lineage > div { display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: var(--cx-s2); margin-top: var(--cx-s4); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-source-lineage > div > i { display: grid; place-items: center; width: 14px; height: 14px; border-radius: 50%; color: var(--cx-paper); background: var(--s5-evidence); font: 500 8px/1 var(--cx-font-ui); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-source-lineage p { margin: 0; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-source-lineage p b,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-source-lineage p small { display: block; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-source-lineage p b { font: 500 11px/1.3 var(--cx-font-ui); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-source-lineage p small,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-source-empty { color: var(--cx-ink60); font: 400 10px/1.35 var(--cx-font-ui); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-source-lineage > button { margin-top: var(--cx-s5); padding: 0; color: var(--cx-ink); background: none; border: 0; font: 500 11px/1.2 var(--cx-font-ui); }

  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-preview {
    padding: var(--cx-s5);
    background: var(--cx-porcelain);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-preview .document-frame,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-preview .document-frame iframe {
    width: 100%;
    min-height: 0;
    height: calc(100vh - var(--s1-bar-h) - 104px);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-preview .document-frame iframe {
    border: 1px solid var(--s5-rule);
    box-shadow: 0 18px 44px color-mix(in srgb, var(--cx-ink) 14%, transparent);
  }

  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page[data-studio-mode="design"] .resume-evidence-desk,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page[data-studio-mode="preview"] .resume-evidence-desk { display: none; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page[data-studio-mode="design"] .resume-editor-layout { grid-template-columns: minmax(0, 1fr) minmax(380px, 440px); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page[data-studio-mode="preview"] .resume-editor-preview { height: auto; overflow: visible; }
}

/* One paper, one viewport. Earlier layers gave the outer A4 frame a fixed
   990px height while sizing its iframe from 100vh (788px on desktop, 600px
   in the compact browser). The exposed remainder looked like a second,
   displaced page. Preview now derives both layers from the same A4 ratio. */
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page[data-studio-mode="preview"] .resume-editor-preview .document-frame {
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: 210 / 297;
  overflow: hidden;
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page[data-studio-mode="preview"] .resume-editor-preview .document-frame iframe {
  width: 100%;
  height: 100% !important;
  min-height: 0 !important;
  display: block;
}

@media (max-width: 700px) {
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-demo-notice {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 5px var(--cx-s3);
    padding: var(--cx-s3) var(--cx-s5);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-demo-notice > span,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-demo-notice p { grid-column: 1; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-demo-notice .button { grid-column: 2; grid-row: 1 / 3; }
}

/* Preview is a review room, not the right-hand live-preview column. Give the
   exported page the full workspace and keep its centre aligned to the space
   beside the workflow rail. The design receipt makes the 37 real choices
   discoverable at the exact moment a visitor judges the finished document. */
@media (min-width: 901px) {
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page[data-studio-mode="preview"] .resume-editor-layout {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page[data-studio-mode="preview"] .resume-editor-preview {
    grid-column: 1 !important;
    width: 100%;
    min-height: calc(100vh - var(--s1-bar-h));
    height: auto;
    position: static;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: var(--cx-s4);
    padding: var(--cx-s5) clamp(var(--cx-s5), 4vw, var(--cx-s10)) var(--cx-s10);
    overflow: visible;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page[data-studio-mode="preview"] .resume-preview-toolbar {
    width: min(700px, 100%);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--cx-s5);
    padding: 0 0 var(--cx-s4);
    border-bottom: 1px solid var(--s5-rule);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page[data-studio-mode="preview"] .resume-preview-toolbar > span {
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 4px 10px;
    align-items: baseline;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page[data-studio-mode="preview"] .resume-preview-toolbar small {
    grid-column: 1;
    color: var(--cx-ink60);
    font: 500 10px/1 var(--cx-font-mono);
    letter-spacing: .08em;
    text-transform: uppercase;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page[data-studio-mode="preview"] .resume-preview-toolbar b {
    grid-column: 2;
    font: 600 15px/1.2 var(--cx-font-ui);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page[data-studio-mode="preview"] .resume-preview-toolbar em {
    grid-column: 1 / -1;
    color: var(--cx-ink60);
    font: normal 400 12px/1.35 var(--cx-font-ui);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page[data-studio-mode="preview"] .resume-editor-preview .document-frame {
    width: min(700px, 100%);
    margin-inline: auto;
  }
}

@media (min-width: 1180px) {
  /* The workflow rail is part of the desktop screen, but it must not bias the
     visual centre of a final document. Let the preview stage span behind the
     rail; the 700px paper still clears it, while its midpoint matches 50vw. */
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page[data-studio-mode="preview"] .resume-editor-preview {
    width: calc(100% + var(--s4-nav-w));
    margin-left: calc(-1 * var(--s4-nav-w));
  }
}

@media (min-width: 1180px) and (max-width: 1359px) {
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-layout { grid-template-columns: minmax(0, 1fr) 360px; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-section-nav {
    grid-column: 1 / -1;
    position: static;
    height: auto;
    flex-direction: row;
    padding: 0;
    border-right: 0;
    border-bottom: 1px solid var(--s5-rule);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-section-nav > span { display: none; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-section-nav button { width: auto; min-width: 150px; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-evidence-desk { display: none; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-canvas { grid-column: 1; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-preview { grid-column: 2; }
}

@media (min-width: 901px) and (max-width: 1179px) {
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-layout { grid-template-columns: 150px minmax(0, 1fr) 360px; gap: 0; padding: 0; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-evidence-desk { display: none; }
}

@media (max-width: 900px) {
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5:has(.resume-editor-page) { background: var(--cx-paper); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5:has(.resume-editor-page) > .topbar [data-studio-primary] { display: none; }
  /* The legacy phone header declares its grid with !important. This is the
     deliberate replacement, so the duplicate row must leave the layout. */
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page > .career-resume-header.s3-row2 { display: none !important; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-progress {
    display: none;
    grid-template-columns: auto minmax(40px, 1fr) auto;
    align-items: center;
    gap: var(--cx-s4);
    min-height: 50px;
    padding: 0 clamp(var(--cx-s4), 5vw, var(--cx-s6));
    border-bottom: 1px solid var(--s5-rule);
    background: color-mix(in srgb, var(--cx-paper) 94%, var(--cx-porcelain));
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-progress span { color: var(--cx-ink60); font: 500 10px/1 var(--cx-font-mono); letter-spacing: .09em; text-transform: uppercase; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-progress i { height: 1px; background: var(--cx-line); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-progress i::before { content: ""; display: block; width: 8px; height: 8px; margin-top: -4px; border-radius: 50%; background: var(--s5-evidence); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-progress b { font: 550 13px/1 var(--cx-font-ui); }

  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-layout { display: block; padding: 0; background: var(--cx-paper); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-section-nav {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
    margin: 0;
    padding: var(--cx-s5);
    border-bottom: 1px solid var(--s5-rule);
    background: var(--cx-paper);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-section-nav > span { display: none; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-section-nav button {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
    min-height: 64px;
    padding: var(--cx-s3);
    border-right: 1px solid var(--s5-rule);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-section-nav button:last-child { border-right: 0; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-section-nav button.on { background: var(--cx-porcelain); color: var(--cx-ink); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-section-nav button small { margin-top: 5px; font-size: 12px; }
  /* The in-panel handoff card is useful on desktop but becomes a fourth,
     extremely narrow column beside the three section tabs on a phone. The
     same ATS destination remains in the global tool switcher. */
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-section-nav [data-strip] { display: none; }

  /* The import review is a full-width product surface. S1's later desktop
     gutter rule was winning at phone widths and leaving only 212px for the
     entire uploaded résumé review. */
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-import-page .resume-import-content {
    width: 100%;
    padding-inline: var(--cx-s5);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-import-page .s1-review-fold {
    width: 100%;
    min-height: 0;
    padding-top: var(--cx-s7);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-import-page .s1-review-copy {
    width: 100%;
    min-width: 0;
    padding-top: 0;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-import-page .s1-review-copy .resume-import-actions {
    align-items: stretch;
    flex-direction: column;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-import-page .resume-import-actions .button { width: 100%; }

  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .import-receipt-full { display: none; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .import-receipt-compact { display: inline; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5:has(.resume-editor-page) .toast {
    bottom: max(var(--cx-s4), env(safe-area-inset-bottom));
  }

  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-canvas { padding: 0 var(--cx-s5) var(--cx-s8); background: var(--cx-paper); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section { border: 0; box-shadow: none; background: transparent; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section > header {
    margin: 0;
    padding: var(--cx-s8) 0 var(--cx-s6);
    border-bottom: 1px solid var(--cx-ink);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section > header h2 { font: 400 clamp(42px, 13vw, 58px)/.96 var(--cx-font-display); letter-spacing: -.04em; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section > header p { margin-top: var(--cx-s4); font: 400 15px/1.5 var(--cx-font-ui); color: var(--cx-ink60); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section > .editor-body { padding: var(--cx-s7) 0; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section .form-grid { display: grid; grid-template-columns: 1fr; gap: var(--cx-s6); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section .field input,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section .field textarea {
    min-height: 52px;
    border: 1px solid var(--s5-rule);
    border-radius: 10px;
    background: var(--cx-paper);
    font-size: 17px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section .field textarea { min-height: 132px; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .next-step-band { margin-bottom: var(--cx-s8); }

  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-evidence {
    display: block;
    grid-column: 1 / -1;
    margin: var(--cx-s2) 0;
    padding-left: var(--cx-s5);
    border-left: 2px solid var(--s5-evidence);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-evidence > span { display: block; margin-bottom: var(--cx-s3); color: var(--s5-evidence); font: 500 11px/1 var(--cx-font-mono); letter-spacing: .08em; text-transform: uppercase; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-evidence > div { padding: var(--cx-s5); border: 1px solid color-mix(in srgb, var(--s5-evidence) 58%, var(--cx-line)); border-radius: 12px; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-evidence small { color: var(--s5-evidence); font: 500 12px/1.3 var(--cx-font-ui); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-evidence blockquote { margin: var(--cx-s4) 0; color: var(--cx-ink); font: 400 24px/1.15 var(--cx-font-display); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-evidence p { margin: 0 0 var(--cx-s4); color: var(--cx-ink60); font: 400 14px/1.5 var(--cx-font-ui); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-evidence button { padding: 0; color: var(--s5-evidence); background: none; border: 0; font: 500 14px/1.2 var(--cx-font-ui); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-evidence.is-empty { padding-block: var(--cx-s5); }

  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-evidence-desk { display: none; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-preview { display: none; padding: var(--cx-s5); background: var(--cx-porcelain); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page[data-resume-view="preview"] .resume-section-nav,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page[data-resume-view="preview"] .resume-mobile-progress,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page[data-resume-view="preview"] .resume-editor-canvas,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page[data-resume-view="preview"] .resume-design-canvas { display: none; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page[data-resume-view="preview"] .resume-editor-preview { display: block; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page[data-studio-mode="preview"] .resume-mobile-progress,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page[data-studio-mode="preview"] .resume-section-nav { display: none; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page[data-studio-mode="preview"] .resume-editor-preview { display: block; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-preview .document-frame,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-preview .document-frame iframe { min-height: 600px; height: calc(100vh - 190px); }

  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-dock {
    position: relative;
    z-index: 55;
    top: auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--cx-s4);
    min-height: 74px;
    padding: 10px clamp(var(--cx-s4), 5vw, var(--cx-s6));
    border-bottom: 1px solid var(--s5-rule);
    background: color-mix(in srgb, var(--cx-paper) 96%, transparent);
    box-shadow: 0 12px 32px color-mix(in srgb, var(--cx-ink) 8%, transparent);
    backdrop-filter: blur(18px);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-dock-context { min-width: 0; display: grid; gap: 5px; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-dock-context span { color: var(--cx-ink60); font: 550 10px/1 var(--cx-font-mono); letter-spacing: .09em; text-transform: uppercase; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-dock-context b { overflow: hidden; color: var(--cx-ink); font: 500 13px/1.2 var(--cx-font-ui); text-overflow: ellipsis; white-space: nowrap; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-dock-actions { display: flex; align-items: center; gap: var(--cx-s2); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-dock .button { min-width: 0; min-height: 46px; padding-inline: 14px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-dock .button [data-cx-icon] { width: 17px; height: 17px; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-dock .button-primary { background: var(--s5-intel); border-color: var(--s5-intel); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-download-menu-mobile { position: relative; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-download-menu-mobile > div { top: calc(100% + 8px); right: 0; }
}

@media (max-width: 520px) {
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-dock {
    grid-template-columns: 1fr;
    gap: 9px;
    min-height: 104px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-dock-context {
    grid-template-columns: auto minmax(0, 1fr);
    align-items: baseline;
    gap: var(--cx-s3);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-dock-actions { display: grid; grid-template-columns: .8fr 1.2fr; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-dock-actions > .button,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-dock-actions > details,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-dock-actions > details > summary { width: 100%; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-dock-actions > .resume-download-menu-mobile {
    grid-column: 1 / -1;
  }
}

@media (prefers-reduced-motion: no-preference) {
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-readiness-line i,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-dock .button { transition: transform var(--cx-dur-fast) var(--cx-ease), background-color var(--cx-dur-fast) var(--cx-ease); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-dock .button:active { transform: translateY(1px); }
}

/* ==========================================================================
   S5.2 · LAPTOP COMPOSITION
   --------------------------------------------------------------------------
   Visual correction from the founder's real 13-inch Mac screenshots. The
   previous benchmark kept workflow, sections, editor, evidence and preview
   visible at once. This revision has exactly three zones: one merged rail,
   one editor and one paper. Evidence lives with the field it supports.
   ========================================================================== */

@media (min-width: 1180px) {
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5:has(.resume-editor-page) {
    /* The document is the outcome, so it gets the stronger share of laptop
       space. The editor remains comfortably usable while the paper gains a
       further 40px at the widths used for visual review. */
    --s5-resume-preview-w: clamp(420px, calc(100vw - 780px), 540px);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5:has(.resume-editor-page) { --s4-nav-w: 220px; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5:has(.resume-editor-page) .tool-workflow-step {
    min-height: 58px;
    padding: var(--cx-s2) var(--cx-s5);
    border-bottom: 0;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5:has(.resume-editor-page) .tool-workflow-step small { font-size: 10.5px; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5:has(.resume-editor-page) .studio-product-nav-label {
    padding-top: var(--cx-s5);
  }

  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page > .career-resume-header.s3-row2 {
    display: none !important;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-layout {
    display: grid;
    grid-template-columns: minmax(520px, 1fr) var(--s5-resume-preview-w);
    gap: 0;
    padding: 0;
    background: var(--cx-paper);
    align-items: stretch;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-section-nav,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-evidence-desk {
    display: none !important;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-canvas {
    grid-column: 1;
    min-width: 0;
    min-height: calc(100vh - var(--s1-bar-h));
    padding: var(--cx-s8) clamp(var(--cx-s8), 4vw, var(--cx-s12)) var(--cx-s12);
    border-right: 1px solid var(--s5-rule);
    background: var(--cx-paper);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-preview {
    grid-column: 2;
    position: sticky;
    top: var(--s1-bar-h);
    width: auto;
    min-width: 0;
    height: calc(100vh - var(--s1-bar-h));
    padding: var(--cx-s3);
    overflow: auto;
    background: var(--cx-porcelain);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-preview .document-frame,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-preview .document-frame iframe {
    height: calc(100vh - var(--s1-bar-h) - 40px);
  }

  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page > .import-receipt {
    width: calc(100% - var(--s5-resume-preview-w));
    margin: 0;
    padding: var(--cx-s3) clamp(var(--cx-s8), 4vw, var(--cx-s12));
    border: 0;
    border-bottom: 1px solid var(--s5-rule);
    background: var(--cx-paper);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page > .import-receipt p {
    font-size: 12px;
    line-height: 1.4;
  }

  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section > header {
    margin-bottom: var(--cx-s7);
    padding-bottom: var(--cx-s6);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section > header h2 {
    font-size: clamp(44px, 4vw, 58px);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section .form-grid {
    gap: var(--cx-s6) var(--cx-s6);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section .field input,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section .field textarea {
    min-height: 48px;
    padding: 12px 14px;
    border: 1px solid var(--s5-rule);
    border-radius: 6px;
    background: var(--cx-paper);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section .field textarea {
    min-height: 120px;
  }

  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-evidence {
    display: block;
    grid-column: 1 / -1;
    margin: 0;
    padding: var(--cx-s5);
    border: 1px solid color-mix(in srgb, var(--s5-evidence) 36%, var(--cx-line));
    border-radius: 6px;
    background: color-mix(in srgb, var(--s5-evidence) 5%, var(--cx-paper));
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-evidence > span {
    display: block;
    margin-bottom: var(--cx-s3);
    color: var(--s5-evidence);
    font: 500 10px/1 var(--cx-font-mono);
    letter-spacing: .08em;
    text-transform: uppercase;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-evidence > div {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--cx-s2) var(--cx-s5);
    align-items: end;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-evidence small,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-evidence p { color: var(--s5-evidence); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-evidence blockquote {
    grid-column: 1;
    margin: var(--cx-s2) 0 0;
    color: var(--cx-ink);
    font: 400 20px/1.2 var(--cx-font-display);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-evidence p {
    grid-column: 1;
    margin: 0;
    font: 400 12px/1.45 var(--cx-font-ui);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-mobile-evidence button {
    grid-column: 2;
    grid-row: 1 / 4;
    align-self: center;
    padding: 0;
    color: var(--cx-ink);
    background: none;
    border: 0;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .next-step-band { display: none; }

  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page[data-studio-mode="design"] .resume-editor-layout {
    grid-template-columns: minmax(520px, 1fr) var(--s5-resume-preview-w);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page[data-studio-mode="design"] .resume-design-canvas {
    grid-column: 1;
    min-width: 0;
  }
}

@media (min-width: 901px) and (max-width: 1500px) {
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5:has(.resume-editor-page) .topbar .save-state {
    width: 32px;
    min-width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    overflow: visible;
    color: transparent;
    font-size: 0;
    text-decoration: none;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5:has(.resume-editor-page) .topbar .save-state::after {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--cx-line);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5:has(.resume-editor-page) .topbar .save-state[data-save-phase="saving"]::after { background: var(--cx-ask-fg); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5:has(.resume-editor-page) .topbar .save-state[data-save-phase="saved"]::after { background: var(--cx-ok-fg); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5:has(.resume-editor-page) .topbar .save-state[data-save-phase="failed"]::after { background: var(--cx-stop-fg); }
}

/* A four-product switcher and three document actions cannot truthfully share
   one laptop row. Keep Design beside Preview; move the product switcher into
   the already-established menu until the full desktop composition fits. */
@media (min-width: 901px) and (max-width: 1279px) {
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5:has(.resume-editor-page) .topbar .primary-nav {
    display: none !important;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5:has(.resume-editor-page) .cxpre-menu-btn {
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    gap: var(--cx-s2);
    padding: 0 var(--cx-s3);
    border: 1px solid var(--cx-line-strong);
    border-radius: var(--cx-r-pill);
    background: var(--cx-paper);
    color: var(--cx-ink);
    font: 550 var(--cx-t-sm)/1 var(--cx-font-ui);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5:has(.resume-editor-page) .cxpre-menu-bars {
    width: 16px;
    display: grid;
    gap: 4px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5:has(.resume-editor-page) .cxpre-menu-bars i {
    display: block;
    height: 1.5px;
    background: currentColor;
  }
}

@media (min-width: 901px) and (max-width: 1100px) {
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5:has(.resume-editor-page) .topbar .workspace-button {
    display: none;
  }
}

@media (min-width: 901px) and (max-width: 1179px) {
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page > .career-resume-header.s3-row2 { display: none !important; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-layout {
    grid-template-columns: minmax(0, 1fr) 350px;
    gap: 0;
    padding: 0;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-section-nav {
    grid-column: 1 / -1;
    position: static;
    width: auto;
    height: auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    padding: var(--cx-s3) var(--cx-s5);
    border-bottom: 1px solid var(--s5-rule);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-section-nav > span,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-section-nav [data-strip],
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-evidence-desk { display: none; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-canvas { grid-column: 1; min-width: 0; padding: var(--cx-s7); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-preview { grid-column: 2; min-width: 0; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .next-step-band { display: none; }
}

/* ==========================================================================
   S6 · EDITORIAL EDITOR + REFERENCE-MATCHED SECTION RAIL
   --------------------------------------------------------------------------
   The founder's supplied reference is the authority for the detailed résumé
   navigation. The generated editor study supplies the field language: warm
   paper, quiet depth, deliberate type and one restrained green focus system.
   ========================================================================== */

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5:has(.resume-editor-page) {
  --s6-field-border: color-mix(in srgb, var(--cx-ink) 17%, var(--cx-paper));
  --s6-field-hover: color-mix(in srgb, var(--cx-ink) 31%, var(--cx-paper));
  --s6-field-fill: color-mix(in srgb, var(--cx-paper) 97%, var(--cx-porcelain));
  --s6-field-shadow: 0 1px 2px color-mix(in srgb, var(--cx-ink) 6%, transparent), inset 0 1px 0 var(--cx-paper);
  --s6-focus-ring: color-mix(in srgb, var(--s5-evidence) 14%, transparent);
  --s6-editor-fill: color-mix(in srgb, var(--cx-paper) 95%, var(--cx-porcelain));
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-canvas {
  background: var(--s6-editor-fill);
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section > header {
  border-bottom: 0;
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section > header h2 {
  font-family: var(--cx-font-display);
  font-weight: 400;
  letter-spacing: -.045em;
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section > header p {
  color: var(--cx-ink60);
  font: 400 16px/1.5 var(--cx-font-ui);
  letter-spacing: -.01em;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .field label,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .cx-suggest-head,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .layout-page-control > label {
  margin-bottom: 8px;
  color: color-mix(in srgb, var(--cx-ink) 76%, var(--cx-paper));
  font: 550 12px/1.2 var(--cx-font-ui);
  letter-spacing: .01em;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .field input,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .field textarea,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .field select,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .cx-line textarea,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .cx-assist-entry input {
  width: 100%;
  min-height: 56px;
  padding: 15px 16px;
  color: var(--cx-ink);
  border: 1px solid var(--s6-field-border);
  border-radius: 10px;
  outline: 0;
  background: var(--s6-field-fill);
  box-shadow: var(--s6-field-shadow);
  font: 450 16px/1.45 var(--cx-font-ui);
  letter-spacing: -.012em;
  transition: border-color var(--cx-dur-fast) var(--cx-ease), box-shadow var(--cx-dur-fast) var(--cx-ease), background-color var(--cx-dur-fast) var(--cx-ease);
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .field textarea,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .cx-line textarea {
  min-height: 148px;
  line-height: 1.55;
  resize: vertical;
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .field input:hover,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .field textarea:hover,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .field select:hover,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .cx-line textarea:hover,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .cx-assist-entry input:hover {
  border-color: var(--s6-field-hover);
  background: var(--cx-paper);
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .field input:focus,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .field textarea:focus,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .field select:focus,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .cx-line textarea:focus,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .cx-assist-entry input:focus {
  border-color: var(--s5-evidence);
  background: var(--cx-paper);
  box-shadow: 0 0 0 4px var(--s6-focus-ring), 0 9px 28px color-mix(in srgb, var(--cx-ink) 10%, transparent), inset 0 1px 0 var(--cx-paper);
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .field input::placeholder,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .field textarea::placeholder {
  color: color-mix(in srgb, var(--cx-ink) 40%, var(--cx-paper));
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .field-help {
  margin-top: 8px;
  color: var(--cx-ink60);
  font: 400 11.5px/1.45 var(--cx-font-ui);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-mobile-evidence {
  position: relative;
  overflow: hidden;
  padding: 20px 22px 20px 26px;
  border: 0;
  border-radius: 10px;
  background: color-mix(in srgb, var(--s5-evidence) 6%, var(--cx-paper));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--s5-evidence) 16%, var(--cx-line)), 0 8px 28px color-mix(in srgb, var(--cx-ink) 5%, transparent);
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-mobile-evidence::before {
  content: "";
  position: absolute;
  inset: 10px auto 10px 0;
  width: 2px;
  background: var(--s5-evidence);
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-mobile-evidence blockquote {
  max-width: 36ch;
  font-size: 19px;
  line-height: 1.28;
  letter-spacing: -.018em;
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-mobile-evidence button {
  min-height: 40px;
  padding: 0 13px;
  border: 1px solid color-mix(in srgb, var(--s5-evidence) 55%, var(--cx-line));
  border-radius: 7px;
  background: color-mix(in srgb, var(--cx-paper) 88%, transparent);
  font: 500 12px/1 var(--cx-font-ui);
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-mobile-evidence button:hover {
  color: var(--cx-paper);
  border-color: var(--s5-evidence);
  background: var(--s5-evidence);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .experience-entry,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .education-entry {
  margin-bottom: var(--cx-s5);
  padding: var(--cx-s6);
  border: 1px solid var(--s6-field-border);
  border-radius: 12px;
  background: color-mix(in srgb, var(--cx-paper) 98%, var(--cx-porcelain));
  box-shadow: var(--s6-field-shadow);
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .experience-entry-head b {
  font: 500 17px/1.25 var(--cx-font-display);
  letter-spacing: -.012em;
}

/* The résumé's cross-tool handoff now lives at the end of the active editor
   section. It is a continuation surface in normal flow, never a floating or
   footer notice, and therefore cannot cover onboarding actions or disappear
   inside the legacy hidden section panel. */
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-next-tools {
  margin-top: clamp(36px, 5vw, 56px);
  padding-top: 26px;
  border-top: 1px solid var(--s6-field-border);
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-next-tools > header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px 24px;
  align-items: end;
  margin-bottom: 20px;
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-next-tools > header > span {
  grid-column: 1 / -1;
  color: var(--s5-evidence);
  font: 600 10px/1 var(--cx-font-mono);
  letter-spacing: .1em;
  text-transform: uppercase;
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-next-tools h3 {
  margin: 0;
  color: var(--cx-ink);
  font: 400 clamp(27px, 2.6vw, 36px)/1.04 var(--cx-font-display);
  letter-spacing: -.035em;
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-next-tools > header p {
  max-width: 31ch;
  margin: 0;
  color: var(--cx-ink60);
  font: 400 12px/1.45 var(--cx-font-ui);
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-next-tools nav {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-block: 1px solid var(--s6-field-border);
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-next-tools nav a {
  min-width: 0;
  min-height: 112px;
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
  padding: 18px 14px;
  color: var(--cx-ink);
  border-right: 1px solid var(--s6-field-border);
  text-decoration: none;
  transition: background-color var(--cx-dur-fast) var(--cx-ease), transform var(--cx-dur-fast) var(--cx-ease);
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-next-tools nav a:last-child { border-right: 0; }
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-next-tools nav a:hover,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-next-tools nav a:focus-visible {
  background: color-mix(in srgb, var(--s5-evidence) 6%, var(--cx-paper));
  outline: 0;
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-next-tools nav a:focus-visible {
  box-shadow: inset 0 0 0 2px var(--s5-evidence);
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-next-tools nav a > i {
  width: 23px;
  height: 23px;
  color: var(--s5-evidence);
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-next-tools nav a > i svg { width: 100%; height: 100%; }
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-next-tools nav a > span {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 7px;
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-next-tools nav b {
  font: 600 13px/1.2 var(--cx-font-ui);
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-next-tools nav small {
  color: var(--cx-ink60);
  font: 400 10.5px/1.35 var(--cx-font-ui);
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-next-tools nav em {
  color: var(--cx-ink60);
  font: normal 500 15px/1 var(--cx-font-ui);
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .icon-button,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .button-quiet {
  border-color: var(--s6-field-border);
  border-radius: 8px;
  background: var(--cx-paper);
  box-shadow: 0 1px 2px color-mix(in srgb, var(--cx-ink) 5%, transparent);
}

@media (min-width: 1180px) {
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5.resume-product-rail {
    --s4-nav-w: 220px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5.resume-product-rail .studio-product-nav-label {
    padding: 18px var(--cx-s5) 9px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5.resume-product-rail .tool-workflow-group {
    display: block;
    margin-top: 10px;
    padding: 17px var(--cx-s5) 8px;
    color: var(--cx-ink60);
    border-top: 1px solid var(--cx-line);
    font: 500 10px/1 var(--cx-font-mono);
    letter-spacing: .12em;
    text-transform: uppercase;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5.resume-product-rail .tool-workflow-step.has-icon {
    width: calc(100% - 8px);
    min-height: 51px;
    grid-template-columns: 22px minmax(0, 1fr) auto;
    column-gap: 10px;
    margin-right: 8px;
    padding: 7px 12px 7px var(--cx-s5);
    color: color-mix(in srgb, var(--cx-ink) 68%, var(--cx-paper));
    border: 0;
    border-radius: 0 8px 8px 0;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5.resume-product-rail .tool-workflow-step.has-icon::before {
    width: 3px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5.resume-product-rail .tool-workflow-step.has-icon > .tool-workflow-icon {
    width: 20px;
    height: 20px;
    display: grid;
    place-items: center;
    color: var(--cx-ink60);
    border: 0;
    border-radius: 0;
    background: none;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5.resume-product-rail .tool-workflow-step.has-icon > .tool-workflow-icon svg {
    width: 19px;
    height: 19px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5.resume-product-rail .tool-workflow-step.has-icon > span { gap: 3px; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5.resume-product-rail .tool-workflow-step.has-icon b {
    color: var(--cx-ink);
    font-size: 13.5px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5.resume-product-rail .tool-workflow-step.has-icon small {
    overflow: hidden;
    font-size: 10.5px;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5.resume-product-rail .tool-workflow-count {
    align-self: start;
    margin-top: 2px;
    color: var(--cx-ink60);
    font: normal 500 12px/1 var(--cx-font-ui);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5.resume-product-rail .tool-workflow-step.has-icon.on {
    color: var(--cx-ink);
    background: color-mix(in srgb, var(--s5-evidence) 6%, var(--cx-paper));
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5.resume-product-rail .tool-workflow-step.has-icon.on::before { background: var(--s5-evidence); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5.resume-product-rail .tool-workflow-step.has-icon.on > .tool-workflow-icon {
    color: var(--s5-evidence);
    border: 0;
    background: none;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5.resume-product-rail .tool-workflow-step.has-icon:hover {
    background: color-mix(in srgb, var(--cx-ink) 4%, var(--cx-paper));
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5.resume-product-rail .studio-product-nav-foot {
    padding-block: var(--cx-s4);
    background: var(--cx-porcelain);
  }

  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .rail-version-menu {
    position: absolute;
    left: calc(100% + 10px);
    width: 244px;
    margin: 0;
    padding: 7px;
    color: var(--cx-ink);
    border: 1px solid var(--s6-field-border);
    border-radius: 10px;
    background: var(--cx-paper);
    box-shadow: 0 18px 52px color-mix(in srgb, var(--cx-ink) 18%, transparent);
    z-index: 100;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .rail-version-menu > summary { display: none; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .rail-version-menu > div {
    display: grid !important;
    gap: 3px;
    position: static;
    width: auto;
    padding: 0;
    border: 0;
    background: none;
    box-shadow: none;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .rail-version-menu .resume-version-heading {
    margin: 0 3px 4px;
    padding: 8px 8px 12px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .rail-version-menu > div > button {
    min-height: 40px;
    padding: 0 11px;
    color: var(--cx-ink);
    border: 0;
    border-radius: 7px;
    background: transparent;
    text-align: left;
    font: 450 12px/1.2 var(--cx-font-ui);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .rail-version-menu > div > button:hover { background: var(--cx-mist); }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .rail-version-menu > div > button[aria-current="true"] {
    position: relative;
    padding-right: 34px;
    background: color-mix(in srgb, var(--s5-evidence) 7%, var(--cx-paper));
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .rail-version-menu > div > button[aria-current="true"]::after {
    content: "✓";
    position: absolute;
    top: 50%; right: 12px;
    color: var(--s5-evidence);
    transform: translateY(-50%);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .rail-version-menu > div > .resume-version-save,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .rail-version-menu > div > .resume-version-save:hover {
    margin-bottom: 4px;
    color: var(--cx-paper);
    background: var(--cx-ink);
    text-align: center;
    outline: 0;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .rail-version-menu > div > .resume-version-save:focus-visible {
    outline: 2px solid var(--s6-focus-ring);
    outline-offset: 2px;
  }
}

/* Match the specificity of the earlier S5 laptop field rules so this final
   component language wins as a system, including every border edge and the
   focus halo. */
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section .field label {
  margin-bottom: 8px;
  color: color-mix(in srgb, var(--cx-ink) 76%, var(--cx-paper));
  font: 550 12px/1.2 var(--cx-font-ui);
  letter-spacing: .01em;
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section .field input,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section .field textarea,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section .field select {
  width: 100%;
  min-height: 56px;
  padding: 15px 16px;
  color: var(--cx-ink);
  border: 1px solid var(--s6-field-border);
  border-radius: 10px;
  outline: 0;
  background: var(--s6-field-fill);
  box-shadow: var(--s6-field-shadow);
  font: 450 16px/1.45 var(--cx-font-ui);
  letter-spacing: -.012em;
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section .field textarea {
  min-height: 148px;
  line-height: 1.55;
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section .field input:hover,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section .field textarea:hover,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section .field select:hover {
  border-color: var(--s6-field-hover);
  background: var(--cx-paper);
}
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section .field input:focus,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section .field textarea:focus,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-editor-section .field select:focus {
  border-color: var(--s5-evidence);
  background: var(--cx-paper);
  box-shadow: 0 0 0 4px var(--s6-focus-ring), 0 9px 28px color-mix(in srgb, var(--cx-ink) 10%, transparent), inset 0 1px 0 var(--cx-paper);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .topbar .primary-nav a { white-space: nowrap; }

@media (max-width: 900px) {
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-next-tools > header {
    display: block;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-next-tools > header > span {
    display: block;
    margin-bottom: 9px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-next-tools > header p {
    margin-top: 10px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-next-tools nav {
    grid-template-columns: 1fr;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-next-tools nav a {
    min-height: 78px;
    align-items: center;
    padding-inline: 4px;
    border-right: 0;
    border-bottom: 1px solid var(--s6-field-border);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-next-tools nav a:last-child { border-bottom: 0; }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-editor-page .resume-mobile-evidence > div {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: none;
  }
}

/* ==========================================================================
   GUIDED RÉSUMÉ ONBOARDING
   --------------------------------------------------------------------------
   Onboarding owns one stable utility bar, one route-aware section rail and
   one focused writing sheet. Progress lives in the utility bar; actions stay
   available at the bottom of the viewport. There is no second status footer.
   ========================================================================== */

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-guided {
  --guided-border: color-mix(in srgb, var(--cx-ink) 16%, var(--cx-paper));
  --guided-field: color-mix(in srgb, var(--cx-paper) 97%, var(--cx-porcelain));
  --guided-focus: color-mix(in srgb, var(--s5-evidence) 14%, transparent);
  max-width: 100%;
  min-height: calc(100vh - var(--s1-bar-h));
  margin: 0;
  overflow-x: clip;
  background: color-mix(in srgb, var(--cx-porcelain) 94%, var(--cx-paper));
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-guided > .cx-backdrop {
  display: none;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .guided-head {
  position: sticky;
  z-index: 20;
  top: var(--s1-bar-h);
  min-height: 72px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--cx-s6);
  padding: 0 clamp(24px, 3vw, 44px);
  border-bottom: 1px solid var(--guided-border);
  background: var(--cx-paper);
  box-shadow: 0 5px 20px color-mix(in srgb, var(--cx-ink) 4%, transparent);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .guided-head-actions {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: var(--cx-s2);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .guided-head-actions button {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 0 13px;
  color: var(--cx-ink60);
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  cursor: pointer;
  font: 500 12px/1 var(--cx-font-ui);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .guided-head-actions .guided-home {
  color: var(--cx-ink);
  border-color: var(--guided-border);
  background: var(--cx-paper);
  box-shadow: 0 1px 2px color-mix(in srgb, var(--cx-ink) 6%, transparent);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .guided-head-actions .guided-home b {
  font-weight: 650;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .guided-head-actions button:hover,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .guided-head-actions button:focus-visible {
  color: var(--cx-ink);
  border-color: var(--s5-evidence);
  outline: 0;
  box-shadow: 0 0 0 3px var(--guided-focus);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .guided-progress {
  display: flex;
  align-items: center;
  gap: 12px;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .guided-progress > span {
  display: flex;
  align-items: baseline;
  gap: 4px;
  white-space: nowrap;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .guided-progress b {
  color: var(--cx-ink);
  font: 600 12px/1 var(--cx-font-ui);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .guided-progress small {
  color: var(--cx-ink60);
  font: 450 11px/1 var(--cx-font-ui);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .guided-progress > i {
  width: 112px;
  height: 3px;
  overflow: hidden;
  border-radius: 0;
  background: var(--cx-line);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .guided-progress > i > em {
  height: 100%;
  display: block;
  background: var(--s5-evidence);
  transition: width var(--cx-dur-base) var(--cx-ease);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .guided-layout {
  width: 100%;
  min-height: calc(100vh - var(--s1-bar-h) - 72px);
  display: block;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .guided-main {
  width: min(840px, 100%);
  min-height: calc(100vh - var(--s1-bar-h) - 72px);
  display: flex;
  flex-direction: column;
  margin: 0 auto;
  padding: clamp(44px, 5vw, 64px) clamp(42px, 5vw, 68px) 0;
  border-right: 1px solid var(--guided-border);
  border-left: 1px solid var(--guided-border);
  background: var(--cx-paper);
  box-shadow: 0 18px 58px color-mix(in srgb, var(--cx-ink) 7%, transparent);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .wizard-form > .eyebrow {
  color: var(--s5-evidence);
  font: 600 11px/1.2 var(--cx-font-ui);
  letter-spacing: .01em;
  text-transform: none;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .wizard-form h1,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .wizard-praise h2,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .wizard-finish h2 {
  max-width: 14ch;
  margin: 15px 0 13px;
  color: var(--cx-ink);
  font: 400 clamp(42px, 4vw, 54px)/.98 var(--cx-font-display);
  letter-spacing: -.035em;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .wizard-form > p,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .wizard-praise p,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .wizard-finish p {
  max-width: 56ch;
  margin: 0 0 34px;
  color: var(--cx-ink60);
  font: 400 15px/1.6 var(--cx-font-ui);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .wizard-form .form-grid {
  gap: 20px 18px;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-guided .field label {
  margin-bottom: 8px;
  color: color-mix(in srgb, var(--cx-ink) 76%, var(--cx-paper));
  font: 550 12px/1.2 var(--cx-font-ui);
  letter-spacing: .01em;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-guided .field input,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-guided .field textarea,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-guided .field select,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-guided .cx-line textarea,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-guided .cx-assist-entry input {
  width: 100%;
  min-height: 56px;
  padding: 15px 16px;
  color: var(--cx-ink);
  border: 1px solid var(--guided-border);
  border-radius: 10px;
  outline: 0;
  background: var(--guided-field);
  box-shadow: 0 1px 2px color-mix(in srgb, var(--cx-ink) 6%, transparent), inset 0 1px 0 var(--cx-paper);
  font: 450 15px/1.45 var(--cx-font-ui);
  letter-spacing: -.01em;
  transition: border-color var(--cx-dur-fast) var(--cx-ease), box-shadow var(--cx-dur-fast) var(--cx-ease), background-color var(--cx-dur-fast) var(--cx-ease);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-guided .field textarea,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-guided .cx-line textarea {
  min-height: 126px;
  line-height: 1.55;
  resize: vertical;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-guided .field input:hover,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-guided .field textarea:hover,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-guided .field select:hover,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-guided .cx-line textarea:hover,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-guided .cx-assist-entry input:hover {
  border-color: color-mix(in srgb, var(--cx-ink) 30%, var(--cx-paper));
  background: var(--cx-paper);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-guided .field input:focus,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-guided .field textarea:focus,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-guided .field select:focus,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-guided .cx-line textarea:focus,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-guided .cx-assist-entry input:focus {
  border-color: var(--s5-evidence);
  background: var(--cx-paper);
  box-shadow: 0 0 0 4px var(--guided-focus), 0 8px 24px color-mix(in srgb, var(--cx-ink) 8%, transparent), inset 0 1px 0 var(--cx-paper);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-guided .contact-link-heading {
  margin-top: 12px;
  padding-top: 26px;
  border-top-color: var(--guided-border);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-guided .contact-link-heading b {
  color: var(--cx-ink);
  font: 600 15px/1.2 var(--cx-font-ui);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-guided .wizard-entry {
  padding: 22px;
  border: 1px solid var(--guided-border);
  border-radius: 12px;
  background: color-mix(in srgb, var(--cx-paper) 98%, var(--cx-porcelain));
  box-shadow: 0 1px 2px color-mix(in srgb, var(--cx-ink) 5%, transparent);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-guided .cx-entry + .cx-entry {
  padding-top: 22px;
  border-top: 1px solid var(--guided-border);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-guided .cx-add {
  min-height: 42px;
  margin-top: 12px;
  padding: 0 14px;
  border: 1px solid var(--guided-border);
  border-radius: 8px;
  background: var(--cx-paper);
  box-shadow: 0 1px 2px color-mix(in srgb, var(--cx-ink) 5%, transparent);
  font: 550 12px/1 var(--cx-font-ui);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-guided .cx-add:hover,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-guided .cx-add:focus-visible {
  border-color: var(--s5-evidence);
  outline: 0;
  box-shadow: 0 0 0 3px var(--guided-focus);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .wizard-tip {
  position: relative;
  margin-top: 30px;
  padding: 18px 20px 18px 24px;
  overflow: hidden;
  color: var(--cx-ok-fg);
  border: 1px solid color-mix(in srgb, var(--s5-evidence) 16%, var(--cx-line));
  border-radius: 10px;
  background: color-mix(in srgb, var(--s5-evidence) 5%, var(--cx-paper));
  font: 400 12.5px/1.55 var(--cx-font-ui);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .wizard-tip::before {
  content: "";
  position: absolute;
  inset: 10px auto 10px 0;
  width: 2px;
  background: var(--s5-evidence);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .wizard-tip b {
  display: block;
  margin-bottom: 6px;
  color: var(--cx-ok-fg);
  font: 600 9px/1 var(--cx-font-mono);
  letter-spacing: .11em;
  text-transform: uppercase;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .guided-nav {
  position: static;
  min-height: 76px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--cx-s3);
  margin: 38px calc(clamp(42px, 5vw, 68px) * -1) 0;
  padding: 14px clamp(42px, 5vw, 68px);
  border-top: 1px solid var(--guided-border);
  background: var(--cx-paper);
  box-shadow: 0 -10px 30px color-mix(in srgb, var(--cx-ink) 5%, transparent);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .guided-nav .button {
  min-height: 48px;
  padding-inline: 20px;
  border-radius: 8px;
  font: 600 13px/1 var(--cx-font-ui);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .guided-nav .button-primary {
  color: var(--cx-paper);
  border-color: var(--cx-ink);
  background: var(--cx-ink);
  box-shadow: 0 4px 12px color-mix(in srgb, var(--cx-ink) 16%, transparent);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5:has(.resume-guided) .tool-workflow-step.done > .tool-workflow-icon::before {
  content: none;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5:has(.resume-guided) .tool-workflow-step.done > .tool-workflow-icon {
  color: var(--s5-evidence);
}

@media (max-width: 760px) {
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .guided-head {
    top: 64px;
    min-height: 76px;
    gap: 8px;
    padding: 9px 14px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .guided-head-actions {
    gap: 3px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .guided-head-actions button {
    min-height: 42px;
    gap: 5px;
    padding: 0 9px;
    font-size: 11px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .guided-progress {
    gap: 7px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .guided-progress > span {
    display: flex;
    gap: 4px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .guided-progress > i {
    width: 40px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .guided-main {
    width: 100%;
    min-height: calc(100vh - 140px);
    padding: 34px 18px 0;
    border: 0;
    box-shadow: none;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .wizard-form h1,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .wizard-praise h2,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .wizard-finish h2 {
    font-size: 42px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .resume-guided .wizard-entry {
    padding: 18px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .guided-nav {
    min-height: 72px;
    margin: 30px -18px 0;
    padding: 12px 18px max(12px, env(safe-area-inset-bottom));
  }
}

@media (max-width: 380px) {
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .guided-head-actions .guided-import span {
    display: none;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .guided-head-actions button {
    padding-inline: 7px;
    font-size: 10.5px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .guided-progress > i {
    display: none;
  }
}

/* ATS studio benchmark
   The résumé studio established the product's approved density: a detailed
   workflow rail, one calm work surface, and a document-like proof surface.
   ATS now uses that same system without duplicating the résumé editor. */
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-entry-premium {
  width: 100%;
  max-width: none;
  min-height: calc(100vh - var(--s1-bar-h) - var(--s3-row2-h));
  display: grid;
  grid-template-columns: minmax(420px, .86fr) minmax(600px, 1.14fr);
  gap: 0;
  align-items: stretch;
  margin: 0;
  padding: 0;
  background: var(--cx-porcelain);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-source-studio {
  min-width: 0;
  padding: clamp(44px, 4.4vw, 68px) clamp(34px, 4vw, 58px);
  border-right: 1px solid var(--guided-border, var(--cx-line));
  background: var(--cx-paper);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-entry-intro {
  max-width: 570px;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-entry-intro > .eyebrow {
  color: var(--s5-evidence, var(--cx-ok-fg));
  font: 600 11px/1.2 var(--cx-font-ui);
  letter-spacing: .01em;
  text-transform: none;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-entry-intro h1 {
  max-width: 10ch;
  margin: 15px 0 18px;
  color: var(--cx-ink);
  font: 400 clamp(48px, 4.5vw, 66px)/.94 var(--cx-font-display);
  letter-spacing: -.045em;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-entry-intro p {
  max-width: 54ch;
  margin: 0;
  color: var(--cx-ink60);
  font: 400 14px/1.65 var(--cx-font-ui);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-source-choices {
  max-width: 590px;
  display: grid;
  gap: 10px;
  margin-top: 36px;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-source-choice {
  position: relative;
  min-height: 86px;
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) auto;
  align-items: center;
  gap: 15px;
  width: 100%;
  padding: 16px 18px;
  color: var(--cx-ink60);
  border: 1px solid var(--guided-border, var(--cx-line));
  border-radius: 11px;
  background: var(--cx-paper);
  box-shadow: 0 1px 2px color-mix(in srgb, var(--cx-ink) 5%, transparent);
  text-align: left;
  cursor: pointer;
  transition: border-color var(--cx-dur-fast) var(--cx-ease), box-shadow var(--cx-dur-fast) var(--cx-ease), transform var(--cx-dur-fast) var(--cx-ease);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-source-choice::before {
  content: "";
  position: absolute;
  inset: 10px auto 10px 0;
  width: 2px;
  border-radius: 2px;
  background: transparent;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-source-choice:hover:not([disabled]),
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-source-choice:focus-visible {
  border-color: color-mix(in srgb, var(--cx-ink) 30%, var(--cx-paper));
  outline: 0;
  box-shadow: 0 0 0 3px var(--guided-focus, var(--cx-ok-fg-a10)), 0 10px 28px color-mix(in srgb, var(--cx-ink) 8%, transparent);
  transform: translateY(-1px);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-source-choice.on {
  color: var(--cx-ink);
  border-color: color-mix(in srgb, var(--s5-evidence, var(--cx-ok-fg)) 32%, var(--cx-line));
  background: var(--cx-porcelain);
  box-shadow: 0 8px 26px color-mix(in srgb, var(--cx-ink) 7%, transparent);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-source-choice.on::before {
  background: var(--s5-evidence, var(--cx-ok-fg));
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-source-choice[disabled] {
  color: var(--cx-ink60);
  border-color: var(--cx-line);
  background: var(--cx-porcelain);
  box-shadow: none;
  cursor: default;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-source-choice > i {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  color: var(--cx-ink60);
  border: 1px solid var(--guided-border, var(--cx-line));
  border-radius: 10px;
  background: var(--cx-paper);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-source-choice.on > i {
  color: var(--s5-evidence, var(--cx-ok-fg));
  border-color: color-mix(in srgb, var(--s5-evidence, var(--cx-ok-fg)) 24%, var(--cx-line));
  background: color-mix(in srgb, var(--s5-evidence, var(--cx-ok-fg)) 7%, var(--cx-paper));
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-source-choice > span {
  min-width: 0;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-source-choice b,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-source-choice small {
  display: block;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-source-choice b {
  color: inherit;
  font: 600 14px/1.25 var(--cx-font-ui);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-source-choice small {
  margin-top: 6px;
  color: var(--cx-ink60);
  font: 400 11px/1.35 var(--cx-font-ui);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-source-choice > em {
  color: var(--cx-ink60);
  font: normal 600 10px/1 var(--cx-font-ui);
  white-space: nowrap;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-source-choice.on > em {
  color: var(--s5-evidence, var(--cx-ok-fg));
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-entry-action {
  max-width: 590px;
  min-height: 70px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-top: 14px;
  padding: 14px 16px;
  border: 0;
  border-radius: 10px;
  background: var(--cx-porcelain);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--cx-ink) 5%, transparent);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-entry-action > div span,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-entry-action > div b {
  display: block;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-entry-action > div span {
  color: var(--cx-ink60);
  font: 500 10px/1 var(--cx-font-ui);
  letter-spacing: 0;
  text-transform: none;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-entry-action > div b {
  margin-top: 7px;
  color: var(--cx-ink);
  font: 600 13px/1.2 var(--cx-font-ui);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-entry-trust {
  max-width: 590px;
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  align-items: start;
  gap: 13px;
  margin-top: 28px;
  padding-top: 24px;
  border-top: 1px solid var(--guided-border, var(--cx-line));
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-entry-trust > i {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  color: var(--s5-evidence, var(--cx-ok-fg));
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-entry-trust b,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-entry-trust small {
  display: block;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-entry-trust b {
  color: var(--cx-ink);
  font: 600 12px/1.25 var(--cx-font-ui);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-entry-trust small {
  max-width: 52ch;
  margin-top: 5px;
  color: var(--cx-ink60);
  font: 400 11px/1.5 var(--cx-font-ui);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-source-studio > .inline-state {
  min-height: 20px;
  margin: 14px 0 0;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-entry-premium > .ats-report-stage {
  min-width: 0;
  min-height: 0;
  display: grid;
  place-items: center;
  padding: clamp(30px, 3.4vw, 50px);
  background: radial-gradient(circle at 48% 7%, var(--cx-paper-a92), transparent 42%), var(--cx-mist);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-report {
  width: min(740px, 100%);
  min-height: 630px;
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  gap: 0;
  padding: 0;
  overflow: hidden;
  color: var(--cx-ink);
  border: 1px solid color-mix(in srgb, var(--cx-ink) 12%, var(--cx-paper));
  background: var(--cx-paper);
  box-shadow: 0 2px 5px color-mix(in srgb, var(--cx-ink) 8%, transparent), 0 26px 76px color-mix(in srgb, var(--cx-ink) 14%, transparent);
  text-align: left;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-report > header {
  min-height: 62px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 16px;
  padding: 0 28px;
  color: var(--cx-paper);
  background: var(--cx-ink);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-report > header span,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-report > header em {
  color: var(--cx-paper);
  font: normal 600 9px/1 var(--cx-font-mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-report > header b {
  color: var(--cx-paper);
  font: 500 13px/1 var(--cx-font-ui);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-lead {
  display: grid;
  grid-template-columns: 132px minmax(0, 1fr);
  align-items: center;
  gap: 30px;
  padding: 42px 38px 34px;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-score {
  width: 124px;
  height: 124px;
  display: grid;
  place-content: center;
  border: 12px solid var(--cx-mist);
  border-top-color: var(--s5-evidence, var(--cx-ok-fg));
  border-radius: 50%;
  text-align: center;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-score strong {
  color: var(--cx-ink);
  font: 400 42px/.8 var(--cx-font-display);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-score small {
  margin-top: 8px;
  color: var(--cx-ink60);
  font: 600 9px/1 var(--cx-font-mono);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-lead .eyebrow {
  color: var(--s5-evidence, var(--cx-ok-fg));
  text-transform: none;
  letter-spacing: 0;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-lead h2 {
  max-width: 13ch;
  margin: 10px 0 12px;
  color: var(--cx-ink);
  font: 400 clamp(31px, 3vw, 43px)/1 var(--cx-font-display);
  letter-spacing: -.035em;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-lead p {
  max-width: 52ch;
  margin: 0;
  color: var(--cx-ink60);
  font: 400 12px/1.6 var(--cx-font-ui);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-dimensions {
  margin: 0 38px;
  border-top: 1px solid var(--guided-border, var(--cx-line));
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-dimensions article {
  min-height: 82px;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  border-bottom: 1px solid var(--guided-border, var(--cx-line));
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-dimensions article > i {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  color: var(--cx-ink60);
  border: 1px solid var(--guided-border, var(--cx-line));
  border-radius: 8px;
  background: var(--cx-porcelain);
  font: normal 600 9px/1 var(--cx-font-mono);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-dimensions b,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-dimensions small {
  display: block;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-dimensions b {
  color: var(--cx-ink);
  font: 600 13px/1.2 var(--cx-font-ui);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-dimensions small {
  margin-top: 5px;
  color: var(--cx-ink60);
  font: 400 11px/1.35 var(--cx-font-ui);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-report > footer {
  min-height: 76px;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  align-items: center;
  gap: 13px;
  margin: 24px 38px 30px;
  padding: 14px 16px;
  color: var(--cx-ok-fg);
  border: 1px solid color-mix(in srgb, var(--s5-evidence, var(--cx-ok-fg)) 18%, var(--cx-line));
  border-radius: 9px;
  background: color-mix(in srgb, var(--s5-evidence, var(--cx-ok-fg)) 5%, var(--cx-paper));
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-report > footer > i {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-report > footer b,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-report > footer small {
  display: block;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-report > footer b {
  font: 600 12px/1.25 var(--cx-font-ui);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-report > footer small {
  margin-top: 5px;
  color: var(--cx-ink60);
  font: 400 10.5px/1.4 var(--cx-font-ui);
}

/* ATS rail icons follow the approved detailed résumé navigation language. */
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5:has(.ats-product) .tool-workflow-step.has-icon {
  grid-template-columns: 34px minmax(0, 1fr) auto;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5:has(.ats-product) .tool-workflow-icon {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  color: var(--cx-ink60);
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5:has(.ats-product) .tool-workflow-step.on .tool-workflow-icon,
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5:has(.ats-product) .tool-workflow-step.done .tool-workflow-icon {
  color: var(--s5-evidence, var(--cx-ok-fg));
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5:has(.ats-product) .tool-workflow-group {
  display: block;
  margin-top: 10px;
  padding: 17px var(--cx-s5) 8px;
  color: var(--cx-ink60);
  border-top: 1px solid var(--cx-line);
  font: 500 11px/1 var(--cx-font-ui);
  letter-spacing: 0;
  text-transform: none;
}

body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5:has(.ats-product) .studio-product-nav-label {
  font-family: var(--cx-font-ui);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
}

@media (max-width: 1120px) {
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-entry-premium {
    grid-template-columns: minmax(380px, .9fr) minmax(470px, 1.1fr);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-source-studio {
    padding: 38px 30px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-entry-premium > .ats-report-stage {
    padding: 28px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-lead {
    grid-template-columns: 104px minmax(0, 1fr);
    gap: 22px;
    padding-inline: 28px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-score {
    width: 100px;
    height: 100px;
    border-width: 10px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-dimensions {
    margin-inline: 28px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-report > footer {
    margin-inline: 28px;
  }
}

@media (max-width: 900px) {
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-entry-premium {
    min-height: 0;
    display: block;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-source-studio {
    padding: 34px 18px 30px;
    border-right: 0;
    border-bottom: 1px solid var(--guided-border, var(--cx-line));
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-entry-intro,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-source-choices,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-entry-action,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-entry-trust {
    max-width: 680px;
    margin-right: auto;
    margin-left: auto;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-entry-intro h1 {
    max-width: 12ch;
    font-size: clamp(42px, 9vw, 60px);
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-entry-premium > .ats-report-stage {
    min-height: 0;
    padding: 24px 18px 42px;
  }
}

@media (max-width: 600px) {
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .s3-primary-slot .ats-run-primary,
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .s3-primary-slot .ats-upload-primary {
    min-width: 0;
    padding-inline: 11px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .s3-primary-slot .ats-primary-label {
    font-size: 0;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .s3-primary-slot .ats-run-primary .ats-primary-label::after {
    content: "Check";
    font-size: 11px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .s3-primary-slot .ats-upload-primary .ats-primary-label::after {
    content: "Upload";
    font-size: 11px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-source-choice {
    min-height: 82px;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 12px;
    padding: 14px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-source-choice > i {
    width: 42px;
    height: 42px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-source-choice > em {
    grid-column: 2;
    margin-top: -6px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-entry-action {
    align-items: flex-start;
    flex-direction: column;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-report {
    min-height: 0;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-report > header {
    min-height: 70px;
    grid-template-columns: 1fr auto;
    gap: 7px 12px;
    padding: 12px 16px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-report > header b {
    grid-column: 1 / -1;
    grid-row: 2;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-lead {
    grid-template-columns: 82px minmax(0, 1fr);
    gap: 16px;
    padding: 26px 16px 22px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-score {
    width: 78px;
    height: 78px;
    border-width: 8px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-score strong {
    font-size: 31px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-lead h2 {
    font-size: 27px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-lead p {
    grid-column: 1 / -1;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-dimensions {
    margin-inline: 16px;
  }
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-preview-report > footer {
    margin: 18px 16px 20px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .ats-source-choice {
    transition: none;
  }
}
