/* Mobile composition and native scroll regions. Visibility belongs to motion-layout.css. */
.mobile-only { display: none; }
@media (max-width: 959px) {
  html.mobile-paged, .mobile-paged body, .mobile-paged.has-document-motion body { width:100%; height:100%; min-height:0; overflow:hidden; overscroll-behavior:none; }
  .mobile-paged .mobile-only { display:block; }
  .mobile-paged .mobile-deck[hidden], .mobile-paged .mobile-pager[hidden] { display:none; }

  .mobile-paged .page--profile {
    --profile-footer-height:160px;
    --profile-character-width:min(235vw, 1200px);
    --profile-character-top:12%;
    contain:layout paint;
  }
  .mobile-paged .profile-hero__title { inset:9% 5% auto; width:90%; height:15%; }
  .mobile-paged .profile-hero__translation, .mobile-paged .profile-hero__pronunciation { top:4.5%; font-size:13px; }
  .mobile-paged .profile-hero__date, .mobile-paged .profile-hero__credit, .mobile-paged .profile-masthead__edition,
  .mobile-paged .profile-masthead__stamp, .mobile-paged .profile-masthead__corner-arrow { display:none; }
  .mobile-paged .profile-footer__content { grid-template-columns:80px 1fr; grid-template-rows:72px 30px; gap:2px 16px; padding:12px 20px 38px; }
  .mobile-paged .profile-masthead__number { grid-column:1; grid-row:1; font-size:72px; }
  .mobile-paged .profile-masthead__word { grid-column:2; grid-row:1; font-size:clamp(40px,11vw,74px); }
  .mobile-paged .profile-masthead__statement { grid-column:1 / -1; grid-row:2; }
  .mobile-paged .profile-masthead__statement > p:not(.profile-masthead__pill) { display:none; }
  .mobile-paged .profile-masthead__pill { height:25px; width:max-content; margin:0 !important; padding:0 12px; border-width:1px; font-size:10px; }
  .mobile-paged .mobile-scroll-cue { position:absolute; z-index:7; bottom:0; left:0; width:100%; min-height:44px; padding:12px 16px max(12px,env(safe-area-inset-bottom)); border:0; background:#ba5c57; color:#fff; font:inherit; font-size:12px; letter-spacing:.1em; cursor:pointer; }

  .mobile-paged .catalog-screen { flex-direction:column; justify-content:center; padding:calc(28px + env(safe-area-inset-top)) 20px calc(100px + env(safe-area-inset-bottom)); overflow-y:auto; overscroll-behavior:contain; }
  .mobile-paged .catalog-screen__title { position:static; margin:0; font-size:26px; }
  .mobile-paged .mobile-catalog-intro { margin:10px 0 26px; color:#8b8581; font-size:12px; line-height:1.7; }
  .mobile-paged .catalog-screen__grid { width:100%; max-width:640px; margin:0 auto; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px 12px; perspective:none; }
  .mobile-paged .catalog-card { padding:16px 12px 12px; border:1px solid #ede9e6; border-radius:14px; opacity:1; transform:none; box-shadow:0 8px 20px #251c1406; }
  .mobile-paged .catalog-card__ghost { display:none; }
  .mobile-paged .catalog-card__heading { display:flex; align-items:baseline; gap:8px; margin-bottom:16px; }
  .mobile-paged .catalog-card__number { font-size:12px; font-weight:400; color:#ba5c57; }
  .mobile-paged .catalog-card__name { margin:0; font-size:16px; font-weight:600; }
  .mobile-paged .catalog-card__image { aspect-ratio:1.25; border-radius:6px; }
  .mobile-paged .mobile-catalog-meta { margin:12px 0 0; color:#8b8581; font-size:10px; line-height:1.6; }
  .mobile-paged [data-catalog-text] { clip-path:none !important; }
  .mobile-paged .catalog-screen__footer { display:none; }

  .mobile-paged .portfolio-app .work-reader { padding-bottom:calc(78px + env(safe-area-inset-bottom)); }
  .mobile-paged .work-reader__header { flex:none; position:relative; height:calc(56px + env(safe-area-inset-top)); padding:env(safe-area-inset-top) 16px 0; gap:12px; flex-wrap:nowrap; align-content:normal; background:#fff; }
  .mobile-paged .work-reader__back, .mobile-paged .work-reader__progress { display:none; }
  .mobile-paged .work-reader__catalog { display:block; order:-1; min-height:44px; padding:12px 0; font-size:12px !important; color:#ba5c57; }
  .mobile-paged .work-nav { flex:1; order:0; justify-content:space-between; gap:8px; min-width:0; }
  .mobile-paged .work-nav button { min-height:56px; padding:17px 0; gap:0; font-size:0; }
  .mobile-paged .work-nav button span { font-size:12px; }
  .mobile-paged .work-reader__scroll { position:relative; flex:1; min-height:0; overflow:hidden; scroll-behavior:auto; }
  .mobile-paged .work-reader__content { position:relative; width:100%; height:100%; margin:0 auto; }
  .mobile-paged .work-section, .mobile-paged .work-ending { position:absolute; inset:0; width:100%; height:100%; min-height:0; margin:0; padding:22px 20px 0; border:0; overflow:hidden; background-color:#fff; display:none; flex-direction:column; }
  .mobile-paged .work-scene__body { flex:1; position:relative; min-height:0; width:100%; max-width:680px; margin-inline:auto; padding:0 0 28px; overflow-x:hidden; overflow-y:auto; overscroll-behavior-y:contain; touch-action:pan-y; scrollbar-width:thin; scrollbar-color:#d8c9c5 transparent; }
  .mobile-paged .work-section__heading { flex:none; width:100%; max-width:680px; margin:0 auto 18px; align-items:start; flex-direction:column; gap:6px; }
  .mobile-paged .work-section__heading p { max-width:100%; font-size:10px; line-height:1.5; }
  .mobile-paged .work-section__heading h3 { font-size:22px; line-height:1.4; }
  .mobile-paged .work-reader .work-reveal { opacity:1; transform:none; transition:none; }
  .mobile-paged .work-image img { transition:none; }
  .mobile-paged .work-image__open:hover img { transform:none; }
  .mobile-paged .work-image__open { touch-action:pan-y; -webkit-tap-highlight-color:transparent; }
  .mobile-paged .work-image img { user-select:none; -webkit-user-drag:none; }
  .mobile-paged .work-chapter, .mobile-paged .work-project, .mobile-paged .work-ending { justify-content:center; padding:32px 24px; }
  .mobile-paged .work-chapter { background-size:40px 40px; }
  .mobile-paged .work-chapter__number { margin-bottom:28px; font-size:10px; }
  .mobile-paged .work-chapter h2 { font-size:clamp(44px,13vw,80px); }
  .mobile-paged .work-chapter > p:last-of-type { font-size:16px; }
  .mobile-paged .work-chapter__word { bottom:5%; left:20px; font-size:26vw; opacity:.55; }
  .mobile-paged .work-project { background:linear-gradient(90deg,transparent 49.8%,#f2eeeb 50%,transparent 50.2%); }
  .mobile-paged .work-project h2 { margin-top:24px; font-size:clamp(32px,9vw,62px); line-height:1.4; }
  .mobile-paged .work-project__arrow { right:24px; bottom:12%; font-size:56px; }
  .mobile-paged .work-label { font-size:10px; }

  /* The image itself scrolls, rather than remaining an inaccessible crop. */
  .mobile-paged .work-device, .mobile-paged .work-long { width:100%; margin:0; }
  .mobile-paged .work-device .work-long__crop, .mobile-paged .work-long .work-long__crop { width:100%; height:52svh; height:52dvh; max-height:560px; overflow-y:auto; overflow-x:hidden; overscroll-behavior-y:auto; touch-action:pan-y; scrollbar-width:thin; scrollbar-color:#ba5c57 #f0eeec; border:1px solid #efedeb; border-radius:8px; background:#f7f6f4; -webkit-overflow-scrolling:touch; }
  .mobile-paged .work-long__crop::after { display:none; }
  .mobile-paged .work-device__flight { width:100%; height:auto; }
  .mobile-paged .work-device__frame { padding:0; border:0; border-radius:0; box-shadow:none; background:none; }
  .mobile-paged .work-device__caption > span { display:none; }
  .mobile-paged .mobile-image-hint { margin:10px 0 0; color:var(--project-accent,#ba5c57); font-size:11px; line-height:1.6; }
  .mobile-paged .work-long + .mobile-image-hint { margin-top:12px; }
  .mobile-paged .work-expand, .mobile-paged .work-device__caption .work-expand { min-height:44px; padding:12px 0; border-bottom:1px solid #e5e2df; font-size:12px !important; }
  .mobile-paged .work-showcase { display:block; }
  .mobile-paged .work-system { grid-template-columns:1fr; gap:24px; padding-top:24px; }
  .mobile-paged .work-type { padding:22px; background:var(--project-paper,#f2f1ef); }
  .mobile-paged .work-type > h4 { margin:18px 0; padding-bottom:14px; font-size:26px; }
  .mobile-paged .work-type ul { gap:14px; }
  .mobile-paged .work-type li { gap:12px; }
  .mobile-paged .work-type li span:last-child { font-size:20px; }
  .mobile-paged .work-colour > .work-label { margin-bottom:14px; }
  .mobile-paged .work-swatch, .mobile-paged .work-swatch:first-child { grid-column:auto; min-height:120px; padding:16px; gap:20px; }
  .mobile-paged .work-swatch h4 { font-size:17px; }
  .mobile-paged .work-swatch p, .mobile-paged .work-swatch > span { font-size:10px; }
  .mobile-paged .work-concept { display:block; }
  .mobile-paged .work-concept > .work-image { width:65%; max-width:260px; margin:0 auto 28px; }
  .mobile-paged .work-concept__block h3 { font-size:20px; }
  .mobile-paged .work-concept__block p:last-child, .mobile-paged .work-copy { font-size:14px; line-height:1.9; }
  .mobile-paged .work-copy h3 { font-size:23px; }
  .mobile-paged .work-copy p { margin-bottom:20px; }
  .mobile-paged .work-copy section { padding:22px 0; }
  .mobile-paged .work-insight { grid-template-columns:1fr; gap:28px; }
  .mobile-paged .work-insight__copy > strong { font-size:86px; }
  .mobile-paged .work-insight__copy h4 { font-size:17px; margin:12px 0; }
  .mobile-paged .work-insight__row { grid-template-columns:minmax(110px,.9fr) minmax(0,1fr); gap:12px; }
  .mobile-paged .work-insight__row > span { font-size:11px; }
  .mobile-paged .work-insight__chart { gap:20px; padding-right:38px; }
  .mobile-paged .work-insight__bar { height:18px; }
  .mobile-paged .work-insight__track b { font-size:12px; }
  .mobile-paged .work-mood-board { width:100%; max-width:600px; margin:12px auto; }
  .mobile-paged .work-section:has(.work-mood-board) .work-scene__body { display:grid; align-items:safe center; }
  .mobile-paged .work-mood-notes { padding:6px 10px; }
  .mobile-paged .work-mood-notes li { font-size:10px; }
  .mobile-paged .work-mood-notes li span { font-size:9px; }
  .mobile-paged .work-goals { grid-template-columns:1fr; gap:24px; }
  .mobile-paged .work-grid, .mobile-paged .work-product-grid { gap:14px; }
  .mobile-paged .work-image figcaption { margin-top:8px; font-size:10px; }
  .mobile-paged .work-grid--process { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); overflow:visible; gap:18px 12px; padding-bottom:12px; }
  .mobile-paged .work-grid--process > .work-image:nth-child(3) { grid-column:1 / -1; order:-1; }
  .mobile-paged .work-section:has(.work-grid--process) .work-scene__body { display:flex; flex-direction:column; justify-content:safe center; }
  .mobile-paged .mobile-gallery-hint { margin:10px 0 0; font-size:11px; color:#8b8581; }
  .mobile-paged .work-render { display:flex; flex-direction:column; gap:24px; }
  .mobile-paged .work-render__copy { order:-1; align-self:start; }
  .mobile-paged .work-render__copy h2 { margin-bottom:12px; font-size:28px; }
  .mobile-paged .work-render__copy p { font-size:14px; line-height:1.9; }
  .mobile-paged .work-compare { width:100%; max-width:480px; margin-inline:auto; }
  .mobile-paged .work-compare__control { gap:12px; margin-top:12px; min-height:44px; }
  .mobile-paged .work-compare input { min-height:44px; }
  .mobile-paged .work-compare__line > span { width:34px; height:34px; font-size:14px; }
  .mobile-paged .work-ending h2 { margin:24px 0 14px; font-size:clamp(40px,12vw,76px); }
  .mobile-paged .work-ending > p:not(.work-label) { font-size:14px; }
  .mobile-paged .work-ending > div { gap:26px; margin-top:30px; }
  .mobile-paged .work-ending button { min-height:44px; }
  .mobile-paged .work-scene-controls { display:none; }
  .mobile-paged .mobile-pager { position:absolute; z-index:10; bottom:0; left:0; width:100%; padding:8px 20px max(8px,env(safe-area-inset-bottom)); background:#fff; border-top:1px solid #eeebe8; }
  .mobile-paged .mobile-pager__hint { margin:0 0 2px; font-size:10px; color:#9a928d; text-align:center; line-height:1.5; }
  .mobile-paged .mobile-pager__row { display:flex; justify-content:space-between; align-items:center; gap:10px; }
  .mobile-paged .mobile-pager button { min-height:44px; padding:8px 0; border:0; background:none; color:#ba5c57; font:inherit; font-size:12px; cursor:pointer; }
  .mobile-paged .mobile-pager button:disabled { color:#b9aaa5; }
  .mobile-paged .mobile-pager output { color:#a79e98; font-size:10px; letter-spacing:.1em; }
  .mobile-paged .mobile-deck h2:focus, .mobile-paged .mobile-deck h3:focus { outline:none; }
  .mobile-paged .work-lightbox { z-index:100; }
  .mobile-paged .work-lightbox__header { padding:env(safe-area-inset-top) 20px 4px; }
  .mobile-paged .work-lightbox__header button { min-height:48px; }
  .mobile-paged .work-lightbox__body { overscroll-behavior:contain; touch-action:pan-y pinch-zoom; -webkit-overflow-scrolling:touch; }
  @media (max-height:700px) {
    .mobile-paged .catalog-screen { justify-content:start; padding-top:24px; }
    .mobile-paged .mobile-catalog-intro { margin-bottom:18px; }
    .mobile-paged .catalog-card { padding-top:12px; }
    .mobile-paged .catalog-card__heading { margin-bottom:12px; }
    .mobile-paged .catalog-card__image { aspect-ratio:1.6; }
    .mobile-paged .mobile-catalog-meta { font-size:9px; margin-top:8px; }
  }
}
