/* One coordinate system: all paper regions are fractions of the 9:16 artwork.
   Desktop wrappers have no layout box. No writing crosses the painted spine. */
.mobile-paper-body{display:contents}
@media(max-width:760px){
  #future{min-height:0!important}
  #future[data-journey=page][data-art-page=false] .future-main.world-planner-page{
    left:calc(var(--mobile-stage-x) + var(--mobile-stage-w)*.145)!important;
    top:calc(var(--mobile-stage-y) + var(--mobile-stage-h)*.335)!important;
    width:calc(var(--mobile-stage-w)*.71)!important;
    height:calc(var(--mobile-stage-h)*.335)!important;
    min-height:0!important;margin:0!important;padding:0!important;transform:none!important;overflow:hidden!important;
  }
  #future[data-journey=page][data-art-page=false] #futurePageTurns{
    position:absolute!important;left:0!important;top:0!important;width:43%!important;
    height:38px!important;margin:0!important;padding:0!important;gap:6px!important;
    overflow:auto!important;align-items:start!important;
  }
  #future[data-journey=page][data-art-page=false] #futurePageTurns button{min-height:32px!important;font-size:11px!important}
  #future[data-journey=page][data-art-page=false] .future-view.active{
    position:absolute!important;inset:0!important;width:100%!important;height:100%!important;overflow:hidden!important;pointer-events:none!important;
  }
  #future[data-journey=page][data-art-page=false] .future-view>.future-head{
    position:absolute!important;left:0!important;top:42px!important;bottom:0!important;width:43%!important;
    display:block!important;margin:0!important;padding:0 3px 10px!important;border:0!important;overflow:auto!important;pointer-events:auto!important;
  }
  #future[data-journey=page][data-art-page=false] .future-head h1{font-size:20px!important;line-height:1.12!important;overflow-wrap:normal!important}
  #future[data-journey=page][data-art-page=false] .future-head p{font-size:12px!important;line-height:1.45!important}
  #future[data-journey=page][data-art-page=false] .mobile-paper-body{
    display:block!important;position:absolute!important;left:57%!important;top:0!important;
    width:43%!important;height:100%!important;overflow:auto!important;padding:0 3px 14px!important;
    scrollbar-width:thin;overscroll-behavior:contain;pointer-events:auto!important;
  }
  #future[data-journey=page][data-art-page=false] .mobile-paper-body :is(.future-grid,.quick-line,.future-item-top,.metric-row,.promise-slots,.evidence-grid){display:flex!important;flex-direction:column!important;gap:8px!important}
  #future[data-journey=page][data-art-page=false] .mobile-paper-body :is(.fcard,.future-list,.future-item){width:100%!important;min-width:0!important;grid-column:auto!important}
  #future[data-journey=page][data-art-page=false] .mobile-paper-body :is(p,.empty-future,.future-note){font-size:12px!important;line-height:1.45!important;text-align:left!important}
  #future[data-journey=page][data-art-page=false] .mobile-paper-body :is(input,textarea,select){font-size:13px!important;line-height:1.4!important}
  #future[data-journey=page][data-art-page=false] .mobile-paper-body .eyebrow{font-size:10px!important;letter-spacing:.06em!important}

  #future.fs-artful .fs-art-scene *{box-sizing:border-box;min-width:0}
  #future.fs-artful :is(#fv-vision,#fv-yearly,#fv-monthly) .fs-heading{gap:8px!important;align-items:start!important}
  #future.fs-artful :is(#fv-vision,#fv-yearly,#fv-monthly) .fs-heading h1{font-size:21px!important;line-height:1.12!important;margin:0!important}
  #future.fs-artful :is(#fv-vision,#fv-yearly,#fv-monthly) .fs-heading>label{width:64px!important;margin:0!important;font-size:10px!important}
  #future.fs-artful :is(#fv-vision,#fv-yearly,#fv-monthly) .fs-title{font-size:14px!important;line-height:1.4!important;padding:3px 0!important;max-width:100%!important}
  #future.fs-artful #fv-vision .fs-heading{left:18%!important;top:19%!important;width:64%!important}
  #future.fs-artful #fsContent-vision{left:18%!important;top:27%!important;width:64%!important;height:47%!important}
  #future.fs-artful #fsContent-vision>.fs-title{height:27px!important;margin:0 0 7px!important}
  #future.fs-artful #fsContent-vision>.fs-leaf{height:calc(100% - 34px)!important;overflow:auto!important}
  #future.fs-artful #fsContent-vision .fs-collage{padding:4px!important;gap:8px!important;overflow:hidden!important}
  #future.fs-artful #fsContent-vision .fs-vision-tile{transform:none!important;margin:0!important;align-self:stretch!important;grid-template-rows:minmax(0,1fr) 24px!important}
  #future.fs-artful #fsContent-vision .fs-vision-tile>input{font-size:11px!important;height:24px!important;padding:3px 1px!important}
  #future.fs-artful #fsContent-vision .fs-upload{font-size:9px!important;left:2px!important;bottom:2px!important;padding:4px!important;max-width:calc(100% - 4px)!important}
  #future.fs-artful #fv-yearly .fs-heading{left:14%!important;top:34%!important;width:30%!important;height:36%!important;overflow:auto!important}
  #future.fs-artful #fv-yearly .fs-heading>label{margin:12px 0!important;width:100%!important}
  #future.fs-artful #fv-yearly .fs-heading>.fs-title{margin-top:12px!important}
  #future.fs-artful #fsContent-yearly{left:55%!important;top:34%!important;width:30%!important;height:38%!important;overflow:auto!important}
  #future.fs-artful :is(#fv-yearly,#fv-monthly,#fv-vision) .fs-field{font-size:12px!important;line-height:1.4!important;margin:8px 0!important}
  #future.fs-artful :is(#fv-yearly,#fv-monthly,#fv-vision) .fs-field textarea{font-size:14px!important;line-height:1.45!important;min-height:64px!important;max-height:130px!important;resize:vertical!important}
  #future.fs-artful :is(#fv-yearly,#fv-monthly,#fv-vision) .fs-leaf{overflow:auto!important}
  #future.fs-artful :is(#fv-yearly,#fv-monthly,#fv-vision) .fs-leaf[hidden]{display:none!important}

  /* Explicit tracks reset broad planner button rules and separate status copy. */
  #future.fs-artful :is(#fv-yearly,#fv-monthly,#fv-vision) .fs-footer{
    position:absolute!important;left:15%!important;right:15%!important;top:80%!important;bottom:auto!important;
    width:70%!important;height:auto!important;display:grid!important;grid-template-columns:1fr!important;
    justify-items:center!important;gap:5px!important;margin:0!important;padding:0!important;transform:none!important;
  }
  #future.fs-artful :is(#fv-yearly,#fv-monthly,#fv-vision) .fs-leaf-nav{
    display:grid!important;grid-template-columns:36px minmax(0,1fr) 36px!important;
    width:100%!important;max-width:none!important;height:36px!important;padding:0!important;margin:0!important;gap:4px!important;
  }
  #future.fs-artful :is(#fv-yearly,#fv-monthly,#fv-vision) .fs-leaf-nav button{
    display:block!important;position:static!important;inset:auto!important;transform:none!important;
    width:36px!important;min-width:36px!important;max-width:36px!important;height:36px!important;min-height:36px!important;
    padding:0!important;margin:0!important;font:22px/36px Georgia,serif!important;border:0!important;background:transparent!important;box-shadow:none!important;
  }
  #future.fs-artful :is(#fv-yearly,#fv-monthly,#fv-vision) .fs-leaf-nav span{font:11px/1.2 Georgia,serif!important;text-align:center!important;white-space:normal!important}
  #future.fs-artful :is(#fv-yearly,#fv-monthly,#fv-vision) .fs-footer>button{
    grid-row:2!important;position:static!important;transform:none!important;width:auto!important;max-width:100%!important;
    min-height:34px!important;margin:0!important;padding:6px 14px!important;font-size:12px!important;
  }
  #future.fs-artful :is(#fv-yearly,#fv-monthly,#fv-vision) .fs-footer>p{
    grid-row:3!important;position:static!important;inset:auto!important;width:100%!important;max-width:100%!important;
    margin:0!important;padding:3px 5px!important;font-size:10px!important;line-height:1.3!important;overflow-wrap:anywhere!important;
  }
}