/* ==========================================================================
   PF-WORKSPACE — the shelves of copies, the Next band
   V5-C §D · 2026-09-11 · worker WORKSPACE

   Additive and last for the workspace surfaces: remove this one link and the
   dashboard is exactly the approved row grammar again — the shelves lose
   their shelf, never their markup.

   Tokens only from tokens.css. No new hue: paper, hair, char, red ink.
   ========================================================================== */

/* ---------------------------------------------------------- the Next band --
   One sentence and one door, above the work. It is a line of type on the
   page's own ground with a rule under it, not a fifth card. */
body.folio-v5 .pf-ws-next {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 14px 28px;
  margin: 0 0 26px;
  padding: 0 0 18px;
  border-bottom: 1px solid var(--cx-cons-hair);
}
body.folio-v5 .pf-ws-next p {
  margin: 0;
  max-width: 62ch;
  font: 400 19px/1.5 var(--cx-font-display, var(--cx-font-ui));
  color: var(--cx-ink);
}
body.folio-v5 .pf-ws-next .button {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
}

/* V5-C CONSOLIDATION 2026-09-11 — the dashboard card's fact table exists there
   ONLY to carry the Versions/Reports receipt (pf-resume.css hides Design and
   Saved on .cxm-dashcards). A row that carries a shelf drops that receipt — the
   shelf is the versions — so the table has nothing left to show and would
   otherwise leave its own gap above the shelf. */
/* the selector MATCHES pf-resume.css's own body chain plus one class, because
   that file sets `display: flex` on the same table at five body classes — a
   short `body.folio-v5` rule here would lose on specificity and fail silently
   (the law that has recurred three times in this estate). */
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .cxm-dashcards .cxm-facts.is-shelved { display: none; }
body.career-canvas-v3.folio-v4c.folio-v4d.folio-v5 .cxm-dashcards .cxm-facts.is-shelved > .cxm-fact-versions { display: none; }

/* ------------------------------------------------------------- the shelf --
   Inside a row, under its actions. A hairline above it says it belongs to the
   row and is not another row. */
body.folio-v5 .pf-ws-shelf {
  margin: 4px 0 0;
  padding: 16px 0 0;
  border-top: 1px solid var(--cx-cons-hair);
  min-width: 0;
}
body.folio-v5 .pf-ws-shelf-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 14px;
  margin: 0 0 12px;
}
body.folio-v5 .pf-ws-shelf-head b {
  font: 500 11px/1.5 var(--cx-font-ui);
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--cx-ink);
}
body.folio-v5 .pf-ws-shelf-head span {
  font: 400 13px/1.5 var(--cx-font-ui);
  color: var(--cx-ink60);
}
body.folio-v5 .pf-ws-shelf-head .pf-ws-act { margin-left: auto; }

/* the rail of copies. On a desk it WRAPS — the point of the shelf is that the
   copies are visible, and a row has the height to give them. On a phone it
   scrolls INSIDE the row, never the page (the tier at the foot of this file). */
body.folio-v5 .pf-ws-rail {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  padding-bottom: 6px;
  scroll-snap-type: x proximity;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}
body.folio-v5 .pf-ws-rail::-webkit-scrollbar { height: 6px; }
body.folio-v5 .pf-ws-rail::-webkit-scrollbar-thumb {
  background: var(--cx-cons-hair);
  border-radius: 999px;
}

/* V5-C CONSOLIDATION 2026-09-11 — the thin rule between the active target's
   letters and the rest. The filter ORDERS the shelf; it never hides a letter,
   so the shelf needs one mark to say where the target's copies end. On a desk
   the rail wraps, so the rule takes the whole line; on the phone the rail
   side-scrolls, so it becomes a vertical hair between two cards. */
body.folio-v5 .pf-ws-split {
  flex: 1 0 100%;
  width: 100%;
  height: 0;
  margin: 2px 0;
  border: 0;
  border-top: 1px solid var(--cx-cons-hair);
}

/* one copy — a small sheet with square corners, the way the product draws
   paper everywhere else. */
body.folio-v5 .pf-ws-copy {
  /* it fills the row it wraps in rather than leaving a dead gutter; the phone
     tier below pins it back to a fixed width for the side-scroll. */
  flex: 1 1 186px;
  min-width: 186px;
  max-width: 280px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 14px 14px 12px;
  background: var(--cx-cons-paper);
  border: 1px solid var(--cx-cons-hair);
  border-radius: 4px;
  scroll-snap-align: start;
}
body.folio-v5 .pf-ws-copy[data-copy-kind="current"] {
  border-left: 3px solid var(--cx-cons-vermilion);
}
body.folio-v5 .pf-ws-copy-title {
  font: 500 15px/1.35 var(--cx-font-ui);
  color: var(--cx-ink);
  overflow-wrap: anywhere;
}
body.folio-v5 .pf-ws-copy[data-ws-copy="ats"] .pf-ws-copy-title {
  font-size: 22px;
  font-family: var(--cx-font-display, var(--cx-font-ui));
}
body.folio-v5 .pf-ws-copy-facts {
  font: 400 12.5px/1.5 var(--cx-font-ui);
  color: var(--cx-ink60);
  overflow-wrap: anywhere;
}
body.folio-v5 .pf-ws-marks {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}
body.folio-v5 .pf-ws-marks i {
  font: 500 9.5px/1.6 var(--cx-font-ui);
  letter-spacing: .09em;
  text-transform: uppercase;
  font-style: normal;
  padding: 2px 7px;
  border: 1px solid var(--cx-cons-hair);
  border-radius: 999px;
  color: var(--cx-ink60);
  white-space: nowrap;
}
body.folio-v5 .pf-ws-copy[data-copy-kind="current"] .pf-ws-marks i {
  color: var(--cx-cons-vermilion);
  border-color: var(--cx-cons-vermilion);
}

/* the actions. Each one does a real thing; none of them is a box. */
body.folio-v5 .pf-ws-copy-acts {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 14px;
  margin-top: auto;
  padding-top: 6px;
}
body.folio-v5 .pf-ws-act {
  appearance: none;
  background: none;
  border: 0;
  padding: 10px 0;
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  font: 400 13.5px/1.2 var(--cx-font-ui);
  color: var(--cx-ink60);
  cursor: pointer;
  text-decoration: none;
  border-bottom: 1.5px solid transparent;
}
body.folio-v5 .pf-ws-act:hover { color: var(--cx-ink); }
body.folio-v5 .pf-ws-act.is-ink {
  color: var(--cx-ink);
  border-bottom-color: var(--cx-cons-vermilion);
  padding-bottom: 8px;
}
body.folio-v5 .pf-ws-act.is-ink:hover { color: var(--cx-cons-vermilion); }
body.folio-v5 .pf-ws-act:focus-visible {
  outline: 2px solid var(--cx-cons-vermilion);
  outline-offset: 2px;
}

/* the confirm — restore is never silent, and the question is asked on the
   card it is about, not in a dialog somewhere else. */
body.folio-v5 .pf-ws-confirm {
  margin-top: auto;
  padding-top: 8px;
  border-top: 1px dashed var(--cx-cons-hair);
}
body.folio-v5 .pf-ws-confirm p {
  margin: 0 0 4px;
  font: 400 12.5px/1.45 var(--cx-font-ui);
  color: var(--cx-ink);
}

/* ------------------------------------------------------ /workspace/<tool> --
   The room shows the same shelf, full width, and lets it wrap rather than
   scroll: there is one row on the page and it has the whole column. */
body.folio-v5 .cxm-manage .pf-ws-copy { flex: 0 1 236px; min-width: 200px; }

/* ------------------------------------------------------------- the phone --
   390: one column, the shelf scrolls sideways inside its own row, targets
   stay at 40px, and nothing widens the page. */
@media (max-width: 760px) {
  body.folio-v5 .pf-ws-next {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }
  body.folio-v5 .pf-ws-next p { font-size: 17px; }
  /* pf-ats.css gives the phone's card list order:-1 to put the work above the
     old suggestion rail. The Next band is the first thing on the page at every
     width, so it takes the order in front of it rather than inheriting 0 and
     falling under the four rows. */
  body.folio-v5 .career-workspace .career-runway > .pf-ws-next { order: -2; }
  body.folio-v5 .pf-ws-shelf { padding-top: 14px; }
  body.folio-v5 .pf-ws-copy,
  body.folio-v5 .cxm-manage .pf-ws-copy { flex: 0 0 196px; width: 196px; min-width: 196px; max-width: 196px; }
  body.folio-v5 .pf-ws-rail { flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden; }
  body.folio-v5 .pf-ws-split {
    flex: 0 0 1px;
    width: 1px;
    height: auto;
    align-self: stretch;
    margin: 0 2px;
    border-top: 0;
    border-left: 1px solid var(--cx-cons-hair);
  }
  body.folio-v5 .pf-ws-shelf-head .pf-ws-act { margin-left: 0; }
}