/* Résumé rails: desktop keeps the document; the wrappers vanish. */
.resume-rail,.resume-skills-track{display:contents}

@media(max-width:960px){
  .resume-rail{display:block;width:100vw;margin-left:calc(50% - 50vw)}
  .resume-rail[data-mobile-rail]{position:relative;height:var(--cap-scroll-height);overflow:visible;overflow-anchor:none;--cap-pin-top:calc(64px + env(safe-area-inset-top,0px));--cap-pin-height:calc(100svh - 160px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))}
  .resume-rail[data-mobile-rail]>.resume-rail-pin{position:sticky;top:var(--cap-pin-top);display:flex;flex-direction:column;gap:8px;width:100%;height:var(--cap-pin-height);min-height:300px;padding:6px 0 4px;box-sizing:border-box;background:var(--site-bg)}
  .resume-rail-pin>.capability-window{display:block;flex:1;min-height:0;width:100%;overflow:hidden;overflow:clip;touch-action:pan-y pinch-zoom}
  .resume-rail[data-mobile-rail] :is(.resume-pages,.resume-portfolio-grid,.resume-skills-track){position:relative;display:flex!important;flex-direction:row!important;align-items:stretch;gap:16px!important;width:var(--track-w)!important;max-width:none!important;height:100%;margin:0!important;padding:0 16px!important;box-sizing:border-box;grid-template-columns:none!important;will-change:transform}
  /* One page per slide. Long cards are divided into several pages by resume-rails.js;
     the original card is hidden on phones and shown again on desktop. */
  .resume-rail[data-mobile-rail] .resume-paper.is-paged-source{display:none!important}
  .resume-rail[data-mobile-rail] .resume-paper{position:relative!important;inset:auto!important;flex:0 0 var(--card-w)!important;width:var(--card-w)!important;max-width:var(--card-w)!important;height:100%!important;min-height:0!important;margin:0!important;overflow:hidden!important;rotate:0deg!important;transform:none!important}
  /* Clear space at the bottom so the standing figure never covers text. */

  .resume-page-cont{margin:0 0 14px!important;font:500 12px/1.3 var(--font-ui,'RagInter',sans-serif)!important;letter-spacing:.01em;color:var(--site-muted)!important}
  .resume-rail-pin>.capability-rail-controls{display:flex;align-items:center;gap:10px;flex:none;min-height:52px;padding:0 16px 0 calc(min(150px,38vw) + 14px);color:var(--site-muted);font:12px/1.3 var(--font-ui,'RagInter',sans-serif)}
  .resume-rail-pin .capability-rail-hint{display:none}
  .resume-rail-pin .capability-rail-meter{flex:1;height:2px;max-width:140px;overflow:hidden;background:var(--site-line)}
  .resume-rail-pin .capability-rail-meter i{display:block;width:100%;height:100%;background:var(--site-accent);transform-origin:left center;transform:scaleX(var(--cap-progress,0))}
  .resume-rail-pin .capability-rail-controls button{flex:none;width:44px;height:44px;display:grid;place-items:center;padding:0;border:1px solid var(--site-line);border-radius:4px;background:var(--site-surface);color:var(--site-ink);font:22px/1 var(--font-action,'Afacad',sans-serif);cursor:pointer}
  .resume-rail-pin .capability-rail-controls button:disabled{opacity:.35}
  /* The résumé has no bottom menu: the footer ends the page normally. */
  body.resume-page .site-footer#contact{margin-bottom:0!important;padding-bottom:calc(36px + env(safe-area-inset-bottom,0px))!important}
}

/* Inside a rail, a long card scrolls; the absolutely placed paper edge would stay put and cut
   through the text, so the card draws its own pencil edge instead. */
@media(max-width:960px){
  .resume-rail[data-mobile-rail] .resume-paper{border:1.4px solid var(--site-ink)!important;border-radius:6px 16px 8px 13px!important;background:var(--site-surface)!important;box-shadow:3px 4px 0 var(--site-line)!important;padding:24px 20px 18px!important}
  .resume-rail[data-mobile-rail] .resume-paper:nth-child(2n){border-radius:15px 7px 16px 8px!important}
}

/* Clear space at the bottom so the standing figure never covers text (beats the card padding rule). */
@media(max-width:960px){.resume-rail[data-mobile-rail] .resume-paper.resume-page-part{padding-bottom:calc(min(150px,38vw) * 1.5 - 62px)!important}.resume-page-part .is-split-cont{margin-top:0!important}}

/* Phone slides: a tighter type scale so a heading and its first lines share a page. */
@media(max-width:960px){
  .resume-rail[data-mobile-rail] .resume-page-part h2{font-size:clamp(24px,6.6vw,28px)!important;line-height:1.14!important;margin:4px 0 12px!important}
  .resume-rail[data-mobile-rail] .resume-page-part h3{font-size:clamp(19px,5.2vw,22px)!important;line-height:1.2!important;margin:0 0 8px!important}
  .resume-rail[data-mobile-rail] .resume-page-part :is(p,li){font-size:14.5px!important;line-height:1.55!important}
  .resume-rail[data-mobile-rail] .resume-page-part .resume-eyebrow{margin:0 0 8px!important}
  .resume-rail[data-mobile-rail] .resume-page-part .resume-job-meta{margin:0 0 10px!important}
  .resume-rail[data-mobile-rail] .resume-page-part .resume-highlights b{font-size:30px!important}
}

/* Phones: the shared header is fixed at the top; keep the résumé toolbar clear of it. */
@media(max-width:960px){body.resume-page .resume-main{padding-top:calc(72px + env(safe-area-inset-top,0px))!important}}



/* With the smaller peek, the slides only keep a little room at the bottom-left. */
@media(max-width:960px){
  .resume-rail[data-mobile-rail] .resume-paper.resume-page-part{padding-bottom:30px!important}
  .resume-rail-pin>.capability-rail-controls{padding-left:108px!important}
}

/* Without slides (desktop or very short windows) the rail controls are not shown. */
.resume-rail:not([data-mobile-rail]) .capability-rail-controls{display:none!important}
.resume-rail:not([data-mobile-rail]) .capability-window{overflow:visible!important}