/* XYZ 3D Studio 0.18.96.233 — isolated Single Photo compact-layout pass. */

/* Narrow desktop stays a workstation: settings rail + usable stage.  The old <=920px
   one-column switch made the stage collapse and generated a resize/reflow storm. */
@media (min-width:761px) and (max-width:1100px){
  .xyz3d-photo-single-shell{
    grid-template-columns:minmax(225px,260px) minmax(0,1fr)!important;
    grid-template-rows:1fr!important;
    grid-template-areas:"single-settings single-stage"!important;
    gap:0!important;
    min-height:0!important;
  }
  .xyz3d-photo-single-settings{padding:8px 7px 76px!important}
  .xyz3d-photo-single-stage{padding:6px!important}
  .xyz3d-single-stage-toolbar{display:flex!important;flex-direction:row!important;align-items:center!important;gap:6px!important;margin-bottom:5px!important;min-width:0!important}
  .xyz3d-single-preview-tabs{flex-wrap:nowrap!important;gap:5px!important;overflow-x:auto!important;scrollbar-width:none!important}
  .xyz3d-single-preview-tabs::-webkit-scrollbar{display:none!important}
  .xyz3d-single-preview-tabs button{min-height:30px!important;padding:5px 9px!important;font-size:10px!important;white-space:nowrap!important}
  .xyz3d-single-stage-meta{display:none!important}
  .xyz3d-single-panel-section{margin-top:8px!important;padding-top:8px!important}
}

/* Phone: spend pixels on the artwork, not on stacked navigation/tool chrome. */
@media (max-width:760px){
  .xyz3d-app.xyz3d-layout-v96.xyz3d-photo-open > .xyz3d-photo-service-shell > .xyz3d-header{display:none!important;height:0!important;min-height:0!important;flex-basis:0!important}
  .xyz3d-app.xyz3d-layout-v96.xyz3d-photo-open > .xyz3d-photo-service-shell > .xyz3d-photo-service-nav{
    flex:0 0 34px!important;height:34px!important;min-height:34px!important;padding:0 3px!important
  }
  .xyz3d-app.xyz3d-layout-v96.xyz3d-photo-open > .xyz3d-photo-service-shell > .xyz3d-photo-service-nav > button{
    height:34px!important;min-height:34px!important;padding:4px 7px!important;font-size:10px!important
  }
  .xyz3d-app.xyz3d-layout-v96.xyz3d-photo-open > .xyz3d-photo-service-shell > .xyz3d-photo-service-nav .xyz3d-photo-fullscreen-btn{
    flex-basis:38px!important;width:38px!important;min-width:38px!important
  }
  .xyz3d-app.xyz3d-layout-v96.xyz3d-photo-open > .xyz3d-photo-service-shell > .xyz3d-photo-studio-modes{
    flex:0 0 36px!important;height:36px!important;min-height:36px!important;gap:3px!important;padding:3px 4px!important
  }
  .xyz3d-app.xyz3d-layout-v96.xyz3d-photo-open > .xyz3d-photo-service-shell > .xyz3d-photo-studio-modes button{
    height:30px!important;min-height:30px!important;padding:3px 5px!important;border-radius:8px!important
  }
  .xyz3d-app.xyz3d-layout-v96.xyz3d-photo-open > .xyz3d-photo-service-shell > .xyz3d-photo-studio-modes button strong{font-size:9px!important}
  .xyz3d-app.xyz3d-layout-v96.xyz3d-photo-open > .xyz3d-photo-service-shell > .xyz3d-photo-workspace:not([hidden]),
  .xyz3d-app.xyz3d-layout-v96.xyz3d-photo-open > .xyz3d-photo-service-shell > .xyz3d-photo-single-workspace:not([hidden]){
    flex:1 1 auto!important;width:100%!important;height:auto!important;min-height:0!important;max-height:none!important;overflow:hidden!important
  }

  .xyz3d-photo-single-shell{
    grid-template-columns:1fr!important;
    grid-template-rows:minmax(280px,50%) minmax(0,50%)!important;
    grid-template-areas:"single-stage" "single-settings"!important;
    gap:0!important;height:100%!important;min-height:0!important;overflow:hidden!important
  }
  .xyz3d-photo-single-stage{padding:3px!important;min-height:0!important;overflow:hidden!important}
  .xyz3d-photo-single-settings{padding:6px 6px 68px!important;min-height:0!important;overflow-y:auto!important}
  .xyz3d-photo-single-settings .xyz3d-photo-single-head{margin-bottom:5px!important}
  .xyz3d-photo-single-settings .xyz3d-photo-single-head h3{font-size:13px!important;margin:2px 0!important}
  .xyz3d-photo-single-settings .xyz3d-photo-single-head p{display:none!important}
  .xyz3d-single-panel-section{margin-top:7px!important;padding-top:7px!important}
  .xyz3d-single-panel-head{margin-bottom:5px!important;gap:6px!important}
  .xyz3d-single-panel-head strong{font-size:11px!important}.xyz3d-single-panel-head small{font-size:8px!important}

  .xyz3d-single-stage-toolbar{
    display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:flex-start!important;
    gap:4px!important;margin:0 0 4px!important;min-height:30px!important;overflow:hidden!important
  }
  .xyz3d-single-preview-tabs{display:flex!important;flex:1 1 auto!important;gap:3px!important;flex-wrap:nowrap!important;overflow-x:auto!important;scrollbar-width:none!important}
  .xyz3d-single-preview-tabs::-webkit-scrollbar{display:none!important}
  .xyz3d-single-preview-tabs button{min-height:28px!important;height:28px!important;padding:4px 8px!important;font-size:9px!important;white-space:nowrap!important}
  .xyz3d-single-stage-meta{display:none!important}
  .xyz3d-photo-single-stage .xyz3d-single-photo-dropzone-stage{min-height:0!important;height:calc(100% - 32px)!important;border-radius:9px!important}
  .xyz3d-single-photo-dropzone-stage canvas,.xyz3d-single-photo-dropzone-stage svg{max-height:100%!important;min-height:0!important}

  .xyz3d-layer142-toolbar{width:100%!important;margin:0!important;gap:3px!important;padding:3px 4px!important;border-radius:8px!important}
  .xyz3d-layer142-toolbar button{min-width:34px!important;width:34px!important;height:30px!important;padding:0 5px!important;border-radius:7px!important}
  .xyz3d-layer142-toolbar button span{display:none!important}
  .xyz3d-layer142-row{grid-template-columns:minmax(0,1fr) 29px 29px 78px!important;gap:4px!important}
  .xyz3d-layer142-row button{min-height:28px!important}
  .xyz3d-physical143{padding:7px!important;gap:6px!important}
  .xyz3d-physical143-grid{grid-template-columns:1fr 1fr!important;gap:6px!important}
  .xyz3d-physical143-grid input{min-height:32px!important;padding:5px 7px!important}

  /* Local Font Access is unavailable on most phones.  Exact TTF/OTF upload remains available;
     the separate browser-font fallback provides the immediate production vector. */
  .xyz3d-no-local-font-access [data-layer142-vector-font]{display:none!important}
}

@media (max-width:420px){
  .xyz3d-photo-single-shell{grid-template-rows:minmax(250px,48%) minmax(0,52%)!important}
  .xyz3d-single-preview-tabs button{padding-inline:6px!important}
}
