/* REKAP_MOBILE_FIRST_V1_2 */
html.rekap-mobile-first-v12,
body.rekap-mobile-first-v12{
  width:100%;
  max-width:100%;
  overflow-x:clip!important;
}
body.rekap-mobile-first-v12 main,
body.rekap-mobile-first-v12 main>*,
body.rekap-mobile-first-v12 section,
body.rekap-mobile-first-v12 article{
  min-width:0;
  max-width:100%;
}
body.rekap-mobile-first-v12 img,
body.rekap-mobile-first-v12 canvas{max-width:100%}

.rekap-route-transition-v12{
  position:fixed;inset:0;z-index:2147483500;pointer-events:none;overflow:hidden;
}
.rekap-route-transition-v12 .rrt-orb{
  position:absolute;left:var(--route-x);top:var(--route-y);
  width:32px;height:32px;border-radius:50%;
  transform:translate(-50%,-50%) scale(.1);
  background:radial-gradient(circle at 35% 28%,rgba(255,255,255,.35),transparent 22%),
             radial-gradient(circle,rgba(217,42,244,.98),rgba(111,63,255,.85) 45%,rgba(9,4,14,.97) 74%);
  box-shadow:0 0 38px rgba(210,42,244,.5),0 0 100px rgba(118,67,255,.3);
}
.rekap-route-transition-v12.show .rrt-orb{animation:rrt-expand .5s cubic-bezier(.18,.8,.24,1) forwards}
.rekap-route-transition-v12 .rrt-logo{
  position:absolute;left:50%;top:45%;width:72px;height:72px;border-radius:18px;
  transform:translate(-50%,-50%) scale(.72);opacity:0;
  background-position:center;background-repeat:no-repeat;background-size:contain;
  filter:drop-shadow(0 15px 35px rgba(0,0,0,.45));
}
.rekap-route-transition-v12.show .rrt-logo{animation:rrt-logo .3s .11s ease-out forwards}
.rekap-route-transition-v12>b{
  position:absolute;left:50%;top:calc(45% + 58px);transform:translate(-50%,8px);
  opacity:0;color:#fff;font-size:15px;font-weight:1000;letter-spacing:.05em;
  text-align:center;max-width:82vw;text-shadow:0 8px 24px rgba(0,0,0,.5)
}
.rekap-route-transition-v12.show>b{animation:rrt-copy .28s .15s ease-out forwards}
.rekap-route-transition-v12.out{opacity:0;transition:opacity .2s ease}
@keyframes rrt-expand{to{transform:translate(-50%,-50%) scale(72)}}
@keyframes rrt-logo{to{transform:translate(-50%,-50%) scale(1);opacity:1}}
@keyframes rrt-copy{to{transform:translate(-50%,0);opacity:1}}

@media(max-width:760px){
  body.rekap-mobile-first-v12 main{width:100%;max-width:100vw;overflow-x:hidden}

  #ftdv8-module,
  #multi-event-v1-module,
  #dynamic-task-dashboard,
  #dynamic-task-page,
  #trabar-v1-page,
  #unified-leave-v1-page,
  #payroll-finalization-v1-page,
  #owner-system-health-v1-page{
    width:100%;max-width:100%;min-width:0;overflow-x:hidden
  }

  #ftdv8-module .ftdv8-wrap{padding:10px}
  #ftdv8-module .ftdv8-kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  #ftdv8-module .ftdv8-kpi{min-width:0;padding:10px 9px}
  #ftdv8-module .ftdv8-kpi span{font-size:7.6px;line-height:1.35}
  #ftdv8-module .ftdv8-kpi b{font-size:clamp(20px,7vw,26px)}
  #ftdv8-module .ftdv8-kpi small{font-size:7.4px;line-height:1.35}
  #ftdv8-module .ftdv8-icon{width:36px;height:36px;flex:0 0 36px}

  #ftdv8-module .ftdv8-chart-card{padding:10px;overflow:hidden}
  #ftdv8-module .ftdv8-chart-head{display:block}
  #ftdv8-module .ftdv8-chart-head h3{font-size:17px}
  #ftdv8-module .ftdv8-chart-head p{font-size:9px;white-space:normal;line-height:1.45}

  #ftdv8-module .ftdv8-controls{
    display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:7px;width:100%;margin-top:9px
  }
  #ftdv8-module .ftdv8-metric{
    min-width:0;width:100%;min-height:42px;justify-content:center;
    padding:8px 6px;font-size:9px;white-space:nowrap;overflow:hidden
  }
  #ftdv8-module .ftdv8-metric input{width:16px;height:16px;flex:0 0 auto;margin:0}
  #ftdv8-module .ftdv8-control{grid-column:1/-1;width:100%;min-height:41px}

  #ftdv8-module .ftdv8-periods{
    display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;width:100%
  }
  #ftdv8-module .ftdv8-period{
    min-width:0;width:100%;padding:8px 3px;font-size:8.3px;text-align:center;white-space:nowrap
  }
  #ftdv8-module .ftdv8-custom.show{
    grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:6px
  }
  #ftdv8-module .ftdv8-custom input{min-width:0;width:100%}

  #ftdv8-module .ftdv8-chart-shell{
    width:100%;max-width:100%;overflow-x:auto;overflow-y:hidden;
    -webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;border-radius:10px
  }
  #ftdv8-module .ftdv8-chart{width:610px;min-width:610px;height:245px}
  #ftdv8-module .ftdv8-chart svg{
    width:610px!important;min-width:610px;max-width:none;overflow:hidden!important
  }
  #ftdv8-module .ftdv8-note{font-size:7.5px;line-height:1.4}
  #ftdv8-module .ftdv8-lower{grid-template-columns:minmax(0,1fr);min-width:0}
  #ftdv8-module .ftdv8-table-wrap{
    width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch
  }
  #ftdv8-module table{min-width:620px}

  #multi-event-v1-module .me-grid{grid-template-columns:minmax(0,1fr)!important}
  #multi-event-v1-module .me-event-card,
  #multi-event-v1-module .me-event-body{min-width:0}

  #dynamic-task-page .dt-table-wrap,
  #unified-leave-v1-page .ul-table-wrap,
  #payroll-finalization-v1-page .pf-table-wrap{
    width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch
  }

  .rekap-mobile-main-header{
    width:100%;max-width:100vw;min-width:0;padding-left:10px!important;padding-right:10px!important
  }
  .rekap-mobile-main-header>*{min-width:0}

  .rekap-mobile-input-live{
    position:fixed!important;
    right:max(12px,env(safe-area-inset-right))!important;
    bottom:max(18px,calc(env(safe-area-inset-bottom) + 12px))!important;
    z-index:2147482200!important;
    width:auto!important;max-width:126px!important;
    padding:10px 13px!important;border-radius:16px!important;
    font-size:14px!important;line-height:1.05!important;
    box-shadow:0 15px 35px rgba(0,0,0,.34),0 0 28px rgba(207,38,245,.18)!important
  }

  #rekapAppMenuButton,
  #rekapMenuList .rm-item{
    -webkit-tap-highlight-color:transparent;touch-action:manipulation
  }
}

@media(max-width:390px){
  #ftdv8-module .ftdv8-periods{grid-template-columns:repeat(2,minmax(0,1fr))}
  #multi-event-v1-module .me-head{display:grid!important;grid-template-columns:1fr!important}
  #multi-event-v1-module .me-head .me-btn{justify-self:start;margin-top:7px}
}

@media(prefers-reduced-motion:reduce){
  .rekap-route-transition-v12{display:none!important}
}