/* NailPilot V9 — native-feel navigation and planning motion. */

/* Keep the viewport geometry stable when pages/modes have different heights. */
html[data-nailpilot-version^="9"]{scrollbar-gutter:stable}

/* The chrome is an anchor. Avoid 50% + translateX centering on a blurred fixed layer:
 * sub-pixel rasterization and scrollbar changes made the bar move by a few pixels. */
.v9-chrome,
.v9-brand,
.v9-brand-mark,
.v9-brand-copy,
.v9-primary-nav,
.v9-chrome-actions{
  animation:none!important;
}
.v9-chrome{
  left:0!important;
  right:0!important;
  margin-inline:auto!important;
  transform:none!important;
  contain:none!important;
  will-change:auto;
}
.v9-brand{min-width:0}
.v9-brand-mark{flex:0 0 auto}

/* Top-level section switching: content moves, chrome stays mounted.
 * No blur: filtering the whole content produced transient raster/pixel shimmer. */
#np-content{
  transition:opacity 90ms ease;
  transform-origin:50% 22%;
}
#np-content.np-native-leave{opacity:.78}
#np-content.np-native-enter-forward,
#np-content.np-native-enter-back{animation:npNativeEnter 190ms cubic-bezier(.16,1,.3,1) both}
@keyframes npNativeEnter{
  from{opacity:.72}
  to{opacity:1}
}

/* Planning's own geometry remains fixed when switching Jour / Semaine / Mois. */
.v9-planner{animation:none!important}
.v9-planner-surface>.np-day-agenda,
.v9-planner-surface>.np-week,
.v9-planner-surface>.np-month{
  animation:none!important;
  transform:none!important;
}
.v9-planner-surface{
  overflow:hidden;
  transform:none!important;
}
.v9-planner-surface.np-planner-leave-forward,
.v9-planner-surface.np-planner-leave-back{animation:npPlannerFadeOut 70ms ease both}
.v9-planner-surface.np-planner-enter-forward,
.v9-planner-surface.np-planner-enter-back{animation:npPlannerFadeIn 150ms ease both}
@keyframes npPlannerFadeOut{to{opacity:.66}}
@keyframes npPlannerFadeIn{from{opacity:.66}to{opacity:1}}

/* The segmented control itself stays tactile and immediate. */
.v9-view-switch button{
  transition:color 160ms ease,background 160ms ease,box-shadow 160ms cubic-bezier(.16,1,.3,1),transform 90ms ease!important;
}
.v9-view-switch button:active{transform:scale(.975)}

@media(max-width:820px){
  .v9-chrome{left:0!important;right:0!important;margin-inline:auto!important;transform:none!important}
}

@media(prefers-reduced-motion:reduce){
  #np-content,
  #np-content.np-native-enter-forward,
  #np-content.np-native-enter-back,
  .v9-planner-surface.np-planner-leave-forward,
  .v9-planner-surface.np-planner-leave-back,
  .v9-planner-surface.np-planner-enter-forward,
  .v9-planner-surface.np-planner-enter-back{
    animation:none!important;
    transition:none!important;
    transform:none!important;
    filter:none!important;
    opacity:1!important;
  }
}