/* Shared motion for collapsible surfaces; behaviour lives in ui-motion.js.
   Open ≈ 170–200 ms ease-out, close ≈ 160 ms. Everything here is declared only without
   prefers-reduced-motion: with it, surfaces open and close instantly.
   Individual `translate`/`scale` properties compose with each surface's own `transform`. */
@media (prefers-reduced-motion: no-preference) {
  @keyframes ui-pop-in { from { opacity: 0; translate: 0 4px; scale: .98; } to { opacity: 1; translate: none; scale: none; } }
  @keyframes ui-drop-in { from { opacity: 0; translate: 0 -6px; } to { opacity: 1; translate: none; } }
  @keyframes ui-slide-in-right { from { opacity: 0; translate: 28px 0; } to { opacity: 1; translate: none; } }
  @keyframes ui-fade-in { from { opacity: 0; } to { opacity: 1; } }

  /* Popovers and menus: appear from the trigger side. Those mounted only while open close at once. */
  :is(#skillpop, .skill-popup, #scopepanel, .scope-panel, .sbox.ses-menu, #account-menu, .dash-pop, .ni.settings-open .inside, .kepler-brainstorm:not([hidden]), .orbit-legend:not([hidden])) {
    animation: ui-pop-in 170ms cubic-bezier(.2, .8, .2, 1);
  }
  .dbmenu[open] > .dbmenu-pop { animation: ui-pop-in 170ms cubic-bezier(.2, .8, .2, 1); }

  /* The model picker toggles `hidden`: it fades in and, with allow-discrete, also out. */
  .model-popup { transition: opacity 160ms cubic-bezier(.4, 0, 1, 1), translate 160ms cubic-bezier(.4, 0, 1, 1), display 160ms allow-discrete; }
  .model-popup:not([hidden]) { transition-duration: 170ms; transition-timing-function: cubic-bezier(.2, .8, .2, 1); }
  .model-popup[hidden] { opacity: 0; translate: 0 4px; pointer-events: none; }
  @starting-style { .model-popup:not([hidden]) { opacity: 0; translate: 0 4px; } }

  /* Answer trace ("Ход ответа") steps drop in under their toggle. */
  .k-trace-steps { animation: ui-drop-in 180ms cubic-bezier(.2, .8, .2, 1); }
  /* Phones: the sessions column (a drawer there) slides in from the left and back, the shade fades. */
  @media (max-width: 640px) {
    .ui-redesign-a #lay > .tree { translate: -100% 0; transition: translate 160ms cubic-bezier(.4, 0, 1, 1), display 160ms allow-discrete; }
    .ui-redesign-a.ui-sidebar-open #lay > .tree { translate: none; transition-duration: 200ms; transition-timing-function: cubic-bezier(.2, .8, .2, 1); }
    @starting-style { .ui-redesign-a.ui-sidebar-open #lay > .tree { translate: -100% 0; } }
    .ui-redesign-a.ui-sidebar-open .ui-sidebar-shade { animation: ui-fade-in 200ms ease-out; }
  }

  /* Dashboard side chat: the chat column slides in beside the dashboard. */
  .work.pv.unified-dashboard.dashboard-chat > :is(.wbar, .msgs, .inbox) { animation: ui-slide-in-right 200ms cubic-bezier(.2, .8, .2, 1); }
}

/* Collapsed headers and tiles that open from a click anywhere on them say so on hover. */
.dashv3 .dblock[data-bid] { cursor: pointer; }
.dashv3 .dblock[data-bid] :is(table, p, dl) { cursor: auto; }
.dashv3 .dblock[data-bid] > .pvc { transition: border-color .15s ease-out; }
.dashv3 .dblock[data-bid]:hover > .pvc { border-color: color-mix(in srgb, var(--acc, #8b5cf6) 35%, var(--hair, #333)); }
.orbit-card.is-collapsed .orbit-card-head { cursor: pointer; }
.orbit-card.is-collapsed .orbit-card-head:hover .orbit-card-toggle { color: #e4e7f2; }
@media (prefers-reduced-motion: reduce) { .dashv3 .dblock[data-bid] > .pvc { transition: none; } }
