/* EmoPoke Work.105 iPhone compact layout correction.
   Portrait-phone-only presentation. PC, renderer, VMD and expression runtime
   remain identical to Work.105. */
@media (max-width: 759px) and (orientation: portrait) {
  body.work-mobile:not(.stage-fullscreen) {
    --ep-phone-handle: 18px;
    --ep-phone-tabs: 50px;
    /* iPhone home gesture area is preserved, without leaving the entire
       safe-area inset as an empty strip below the navigation buttons. */
    --ep-phone-bottom-gap: max(10px, calc(env(safe-area-inset-bottom) - 14px));
    --ep-phone-sheet: calc(1px + var(--ep-phone-handle) + var(--ep-phone-tabs) + var(--ep-phone-bottom-gap));
  }

  /* Identical bottom navigation height in expanded and collapsed modes.
     Earlier mobile styles reserved different safe-area padding in each mode. */
  body.work-mobile:not(.stage-fullscreen) #workspace {
    padding-bottom: var(--ep-phone-bottom-gap) !important;
    box-sizing: border-box;
  }
  /* When the sheet is collapsed, its dimensions now match its actual
     contents; no phantom empty region remains beneath the navigation. */
  body.work-mobile.panels-collapsed:not(.stage-fullscreen) #workspace {
    height: var(--ep-phone-sheet) !important;
    min-height: 0 !important;
    padding: 0 0 var(--ep-phone-bottom-gap) !important;
    overflow: hidden;
  }
  body.work-mobile.panels-collapsed:not(.stage-fullscreen) #stage {
    bottom: var(--ep-phone-sheet) !important;
    height: auto !important;
  }
  body.work-mobile:not(.stage-fullscreen) #workspace .panel-handle {
    height: var(--ep-phone-handle) !important;
    min-height: var(--ep-phone-handle) !important;
    flex: 0 0 var(--ep-phone-handle) !important;
    padding: 0 !important;
  }
  body.work-mobile:not(.stage-fullscreen) #workspace .panel-handle > span {
    height: 4px;
    width: 36px;
  }
  body.work-mobile:not(.stage-fullscreen) #workspace .tabs {
    flex: 0 0 var(--ep-phone-tabs) !important;
    height: var(--ep-phone-tabs) !important;
    min-height: 0 !important;
    padding: 3px 8px !important;
    border-top: 0 !important;
    border-bottom: 0 !important;
    gap: 4px;
  }
  body.work-mobile:not(.stage-fullscreen) #workspace .tabs button {
    height: 44px;
    min-height: 44px;
    padding: 2px 3px;
    line-height: 1.1;
    gap: 1px;
  }
  /* The view buttons previously had a 96px bottom offset *inside* a stage
     already shortened by the bottom sheet. This doubled the offset and
     stranded them over the model's thighs. Anchor near the stage bottom. */
  body.work-mobile.panels-collapsed:not(.stage-fullscreen) #stage #viewActions {
    top: auto !important;
    bottom: 32px !important;
    right: 10px;
    left: auto;
    gap: 5px;
  }
  body.work-mobile.panels-collapsed:not(.stage-fullscreen) #stage #stageHint {
    bottom: 6px !important;
  }
  /* Expanded editing sheet: controls must not float over the preview. */
  body.work-mobile:not(.panels-collapsed):not(.stage-fullscreen) #stage #viewActions,
  body.work-mobile.panel-dragging:not(.stage-fullscreen) #stage #viewActions {
    display: none !important;
  }
}