/* ============================================================================
   LearnNote desk motion law (operator, 2026-08-20)

   Addition / appear / open  = fade-in --nb-enter-ms (1500ms).
   Removal / dismiss / close = instant (--nb-exit-ms: 0ms). No fade-out,
   no slide-away, no frost linger.

   prefers-reduced-motion + e-ink: instant both ways (UDL). Do not use 1500ms.
   Cascades LAST so it wins over notebook2.css, cover, mobile satellite, tips.
   Tokens only, no Glass Canon color restyle.
   ============================================================================ */

:root {
  --nb-enter-ms: 1500ms;
  --nb-exit-ms: 0ms;
  --nb-enter-ease: ease;
}

@keyframes nb-enter-fade {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* ── Cover frost: arriving ice fades in; leaving ice is gone immediately. ── */
#nb-hero-glass.nb-hero-glass--unturn .nb-hero-page {
  animation: nb-enter-fade var(--nb-enter-ms) var(--nb-enter-ease) both;
  transform: none;
}
#nb-hero-glass.nb-hero-glass--turn .nb-hero-page {
  animation: none;
  opacity: 0;
  transform: none;
}

/* ── Appear: panels, menus, dock, tooltips, pointer, toasts, dialogs, chips. ── */
#nb2-more-menu:not([hidden]),
#nb2-more-menu:not([hidden]) .nb2-more-group,
#nb-simple-dock:not([hidden]),
#nb-drawbridge:not([hidden]),
#nb-glass-tip.is-in,
#nb-pointer-helper:not([hidden]), /* host enter only; caret/label glow is in nb_pointer_helper.css */
#nb-main.nb-main--enter,
.nb2-toast,
.nb2-synth-invite,
.nb-dialog[open],
dialog[open],
.nb-cstep.is-now,
.nb-simple-c.is-now,
.nb-simple-c.is-mode,
.nb-surface-hint,
.nb2-cal-profile-paths,
.nb2-mind-card[open] .nb2-mind-card-body,
.nb-vr-dialog[open] .nb-vr-stage,
.nb-question-drift[data-enter="1"],
.nb2-intake-dialog[open] .nb2-intake-body,
body.nb-mode-shifting--learn .nb-grid,
body.nb-mode-shifting--capture .nb-grid,
#nb2-editor.nb-notes--flick-fwd .ProseMirror,
#nb2-editor.nb-notes--flick-back .ProseMirror,
body.nb2-watching .nb2-src-head,
body.nb2-watching #nb2-src-video,
body.nb2-watching #nb2-src-transcript {
  animation: nb-enter-fade var(--nb-enter-ms) var(--nb-enter-ease) both;
}

.nb2-more-group:nth-child(2),
.nb2-more-group:nth-child(3),
.nb2-more-group:nth-child(4),
.nb2-more-group:nth-child(5) {
  animation-delay: 0ms;
}

/* ── Open transitions (enter only). Closed / default = instant. ── */
.nb-kicker-extra,
.nb-identity-slot,
.nb-kicker-extra-inner,
.nb-identity-slot-inner,
.nb-kicker-extra-chevron,
.nb-desk-tools-panel,
body.nb-ui-simple:not(.nb-hero-open):not(.nb-cover-closed) .nb-rail-actions,
body.nb-ui-simple:not(.nb-hero-open):not(.nb-cover-closed) #nb-flow,
.nb2-toast.is-out,
.nb2-gloss-pop.nb2-gloss-pop--armed,
.nb-cstep:not(.is-now) {
  transition: none !important;
}

.nb-kicker[data-extra="open"] .nb-kicker-extra,
.nb-kicker[data-extra="open"] .nb-identity-slot {
  transition:
    opacity var(--nb-enter-ms) var(--nb-enter-ease),
    grid-template-rows var(--nb-enter-ms) var(--nb-enter-ease),
    visibility 0s linear 0s !important;
}
.nb-kicker[data-extra="open"] .nb-kicker-extra-inner,
.nb-kicker[data-extra="open"] .nb-identity-slot-inner {
  transition: padding var(--nb-enter-ms) var(--nb-enter-ease) !important;
}
.nb-desk-tools[open] .nb-desk-tools-panel {
  transition:
    grid-template-rows var(--nb-enter-ms) var(--nb-enter-ease),
    opacity var(--nb-enter-ms) var(--nb-enter-ease) !important;
}
body.nb-ui-full:not(.nb-hero-open) .nb-rail-actions,
body.nb-ui-full:not(.nb-hero-open) #nb-flow {
  transition: opacity var(--nb-enter-ms) var(--nb-enter-ease) !important;
  transition-delay: 0s !important;
}
.nb-cstep.is-now,
.nb-simple-c.is-now,
.nb-simple-c.is-mode {
  transition:
    opacity var(--nb-enter-ms) var(--nb-enter-ease),
    border-color var(--nb-enter-ms) var(--nb-enter-ease),
    background-color var(--nb-enter-ms) var(--nb-enter-ease),
    box-shadow var(--nb-enter-ms) var(--nb-enter-ease),
    color var(--nb-enter-ms) var(--nb-enter-ease) !important;
}
.nb2-gloss-pop.nb2-gloss-pop--in {
  transition: opacity var(--nb-enter-ms) var(--nb-enter-ease) !important;
  transform: none;
}

/* Dismissed toast: already gone, no fade-out linger. */
.nb2-toast.is-out {
  opacity: 0;
  animation: none !important;
}

/* ── UDL: reduced-motion + e-ink are instant both ways. ── */
@media (prefers-reduced-motion: reduce) {
  :root { --nb-enter-ms: 0ms; --nb-exit-ms: 0ms; }
  #nb-hero-glass.nb-hero-glass--unturn .nb-hero-page,
  #nb-hero-glass.nb-hero-glass--turn .nb-hero-page,
  #nb2-more-menu:not([hidden]),
  #nb2-more-menu:not([hidden]) .nb2-more-group,
  #nb-simple-dock:not([hidden]),
  #nb-drawbridge:not([hidden]),
  #nb-glass-tip.is-in,
  #nb-pointer-helper:not([hidden]),
  #nb-main.nb-main--enter,
  .nb2-toast,
  .nb2-synth-invite,
  .nb-dialog[open],
  dialog[open],
  .nb-cstep.is-now,
  .nb-simple-c.is-now,
  .nb-surface-hint,
  .nb2-mind-card[open] .nb2-mind-card-body,
  .nb-vr-dialog[open] .nb-vr-stage,
  .nb-question-drift[data-enter="1"],
  .nb2-intake-dialog[open] .nb2-intake-body,
  body.nb-mode-shifting--learn .nb-grid,
  body.nb-mode-shifting--capture .nb-grid,
  #nb2-editor.nb-notes--flick-fwd .ProseMirror,
  #nb2-editor.nb-notes--flick-back .ProseMirror,
  body.nb2-watching .nb2-src-head,
  body.nb2-watching #nb2-src-video,
  body.nb2-watching #nb2-src-transcript,
  .nb-kicker[data-extra="open"] .nb-kicker-extra,
  .nb-kicker[data-extra="open"] .nb-identity-slot,
  .nb-kicker[data-extra="open"] .nb-kicker-extra-inner,
  .nb-kicker[data-extra="open"] .nb-identity-slot-inner,
  .nb-desk-tools[open] .nb-desk-tools-panel,
  body.nb-ui-full:not(.nb-hero-open) .nb-rail-actions,
  body.nb-ui-full:not(.nb-hero-open) #nb-flow,
  .nb2-gloss-pop.nb2-gloss-pop--in,
  /* Cover & recite: the cover hides the answer. It must appear at once for a
     learner who asked for no motion, and it must never depend on an animation
     finishing to become opaque. */
  .nb2-cue-cover {
    animation: none !important;
    transition: none !important;
    transform: none !important;
  }
}

body.eink,
body.nb2-eink {
  --nb-enter-ms: 0ms;
  --nb-exit-ms: 0ms;
}
body.eink #nb-hero-glass.nb-hero-glass--unturn .nb-hero-page,
body.eink #nb-hero-glass.nb-hero-glass--turn .nb-hero-page,
body.nb2-eink #nb-hero-glass.nb-hero-glass--unturn .nb-hero-page,
body.nb2-eink #nb-hero-glass.nb-hero-glass--turn .nb-hero-page,
body.eink #nb2-more-menu:not([hidden]),
body.eink #nb-simple-dock:not([hidden]),
body.eink #nb-drawbridge:not([hidden]),
body.eink #nb-glass-tip.is-in,
body.eink #nb-pointer-helper:not([hidden]),
body.eink .nb2-toast,
body.eink .nb-dialog[open],
body.eink dialog[open],
body.eink .nb-cstep.is-now,
body.eink .nb-simple-c.is-now,
body.eink.nb2-watching .nb2-src-head,
body.eink.nb2-watching #nb2-src-video,
body.eink.nb2-watching #nb2-src-transcript,
body.nb2-eink.nb2-watching .nb2-src-head,
body.nb2-eink.nb2-watching #nb2-src-video,
body.nb2-eink.nb2-watching #nb2-src-transcript,
body.nb2-eink #nb2-more-menu:not([hidden]),
body.nb2-eink #nb-simple-dock:not([hidden]),
body.nb2-eink #nb-drawbridge:not([hidden]),
body.nb2-eink #nb-glass-tip.is-in,
body.nb2-eink #nb-pointer-helper:not([hidden]),
body.nb2-eink .nb2-toast,
body.nb2-eink .nb-dialog[open],
body.nb2-eink dialog[open],
body.nb2-eink .nb-cstep.is-now,
body.nb2-eink .nb-simple-c.is-now {
  animation: none !important;
  transition: none !important;
}