/* resume-to-pdf only: the form beside a sticky preview of the real PDF. */
.rs-layout { display: grid; gap: var(--matrix-space-16); }
.rs-form { display: grid; gap: var(--matrix-space-16); min-width: 0; }
.rs-section { display: grid; gap: var(--matrix-space-12); min-width: 0; }
/* each section folds to its title below 900 px (fb_f3c91b8b); the title names its fieldset, which has no border of its own */
.rs-fold { display: block; min-width: 0; }
.rs-fold > summary { cursor: pointer; font-weight: 600; min-height: var(--matrix-control-min-height); padding-block: var(--matrix-space-8); }
.rs-fold[open] > summary { margin-bottom: var(--matrix-space-8); }
.rs-fold > .rs-section { border: 0; margin: 0; padding: 0; }
.rs-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(12em, 1fr)); gap: var(--matrix-space-12); }
.rs-field { display: grid; gap: 4px; min-width: 0; align-content: start; }
.rs-field > label { font-weight: 600; }
.rs-field input, .rs-field select, .rs-field textarea { width: 100%; box-sizing: border-box; min-width: 0; }
.matrix-ui .rs-text { min-height: 6em; resize: vertical; font-family: inherit; line-height: 1.45; }
.rs-hint { margin: 0; font-size: var(--matrix-type-caption); }
.rs-entries { display: grid; gap: var(--matrix-space-12); }
.rs-entry { border: 1px solid var(--matrix-border); border-radius: var(--matrix-radius-control); padding: var(--matrix-space-12) var(--matrix-space-16); margin: 0; display: grid; gap: var(--matrix-space-12); background: var(--matrix-surface); min-width: 0; }
.rs-entry > legend { font-weight: 600; padding-inline: 4px; max-width: 100%; overflow-wrap: break-word; }
.rs-dates { display: grid; grid-template-columns: repeat(auto-fit, minmax(13em, 1fr)); gap: var(--matrix-space-12); }
.rs-date { border: 0; margin: 0; padding: 0; min-width: 0; display: grid; gap: 4px; }
.rs-date > legend { font-weight: 600; padding: 0; margin-bottom: 4px; }
.rs-date-row { display: flex; gap: var(--matrix-space-8); }
.rs-date-row select { flex: 1 1 auto; min-width: 0; }
.matrix-ui .rs-year { width: 5.5em; flex: 0 0 auto; }
.rs-now { margin-top: 4px; }
.rs-entry-tools { display: flex; flex-wrap: wrap; gap: var(--matrix-space-8); justify-content: flex-end; }
.rs-small { padding: 4px 12px; min-height: 32px; font-size: var(--matrix-type-caption); }
.rs-bar { display: grid; gap: var(--matrix-space-8); }
.rs-bar-row { display: flex; flex-wrap: wrap; gap: var(--matrix-space-8) var(--matrix-space-12); align-items: center; }
.rs-open-label { display: inline-flex; align-items: center; min-height: var(--matrix-control-min-height); cursor: pointer; }
#rs-open.visually-hidden { width: 1px; } /* tools.css widens every file input in the options to 100% */
#rs-open:focus-visible + .rs-open-label { outline: 2px solid var(--matrix-focus); outline-offset: 2px; }
.rs-order { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.rs-order-item { display: flex; align-items: center; justify-content: space-between; gap: var(--matrix-space-8); padding: 4px 4px 4px 12px; border: 1px solid var(--matrix-border); border-radius: var(--matrix-radius-control); background: var(--matrix-surface); min-width: 0; }
.rs-order-item > span:first-child { overflow-wrap: break-word; min-width: 0; }
.rs-order-tools { display: inline-flex; gap: 6px; flex: 0 0 auto; }
.rs-aside { display: grid; gap: var(--matrix-space-12); padding: var(--matrix-space-12); border: 1px solid var(--matrix-border); border-radius: var(--matrix-radius-panel); background: var(--matrix-surface-subtle); min-width: 0; align-content: start; }
.rs-preview-title { margin: 0; font-size: 1rem; }
.rs-preview-title:focus { outline: none; }
.rs-jump { justify-self: start; font-size: var(--matrix-type-caption); }
.rs-problems-box { border: 1px solid var(--matrix-border); border-radius: var(--matrix-radius-control); padding: var(--matrix-space-8) var(--matrix-space-12); background: var(--matrix-surface); }
.rs-problems-title { margin: 0 0 6px; font-size: 0.9375rem; }
.rs-problems { margin: 0; padding-left: 1.1em; display: grid; gap: 4px; font-size: var(--matrix-type-caption); overflow-wrap: break-word; }
.rs-go { background: none; border: 0; padding: 0; font: inherit; font-weight: 600; color: inherit; text-decoration: underline; cursor: pointer; }
.rs-download-row .matrix-primary { width: 100%; }
.rs-preview-note { margin: 0; font-size: var(--matrix-type-caption); }
.rs-pages { display: grid; gap: var(--matrix-space-12); }
.rs-page { display: block; width: 100%; height: auto; background: #fff; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.18); border-radius: 2px; }
.rs-stale .rs-pages { opacity: 0.45; }
/* below 900 px Download PDF and a link to the preview are pinned to the bottom of the screen while the form is in view, as the shell
   pins every other tool's main button (Lucy's round 1, resume-to-pdf-3); what the keyboard or a link brings into view stops above it */
.rs-dock { display: none; }
@media (max-width: 899.98px) {
  .rs-dock {
    display: flex; align-items: center; gap: var(--matrix-space-12); flex-wrap: wrap;
    position: sticky; bottom: 0; z-index: 5; min-width: 0;
    padding-block: var(--matrix-space-12);
    background: var(--matrix-surface); border-top: 1px solid var(--matrix-border);
  }
  .rs-dock .rs-download-row { flex: 1 1 12em; }
  .rs-dock-preview { flex: 0 0 auto; font-weight: 600; }
  html:has(.rs-dock .rs-download-row) { scroll-padding-bottom: 8rem; }
}
@media (min-width: 900px) {
  .rs-jump { display: none; }
  .rs-layout { grid-template-columns: minmax(0, 1fr) 300px; align-items: start; }
  .rs-aside { position: sticky; top: var(--matrix-space-12); max-height: calc(100vh - 24px); overflow: auto; }
}