@layer motion {
  ::view-transition-old(root),
  ::view-transition-new(root) { animation:none; mix-blend-mode:normal; }
  ::view-transition-old(root) { z-index:1; }
  ::view-transition-new(root) { z-index:2; }

  .desktop.is-theme-transitioning { animation:theme-settle 360ms var(--ease-out) both; }
  @keyframes theme-settle { 0% { filter:brightness(.78) saturate(.8); } 52% { filter:brightness(1.08) saturate(.96); } 100% { filter:none; } }

  .workspace-pill,
  .workspace-pill::before,
  .toolbar-button,
  .quick-tile,
  .switch,
  .switch i,
  .folder-card,
  .photo-card,
  .launcher-grid > button,
  .theme-choice,
  .accent-swatch,
  .music-play,
  .widget-play,
  .focus-copy button {
    transition:
      transform var(--normal) var(--spring),
      color var(--fast) ease,
      background var(--normal) ease,
      border-color var(--normal) ease,
      box-shadow var(--normal) ease,
      opacity var(--normal) ease;
  }

  button:active { transform: scale(.975); transition-duration: 65ms; }
  .dock-app:active { transform: translateY(-4px) scale(.94) !important; }

  .app-window {
    transition:
      left 260ms var(--ease-out),
      top 260ms var(--ease-out),
      width 260ms var(--ease-out),
      height 260ms var(--ease-out),
      opacity 190ms ease,
      transform 260ms var(--spring-soft),
      filter 180ms ease,
      box-shadow 200ms ease,
      border-radius 260ms var(--ease-out);
  }

  .app-window.is-opening { animation: window-open 310ms var(--spring-soft) both; }
  .app-window.is-closing { pointer-events:none; animation: window-close 200ms cubic-bezier(.6,0,.8,.4) both; }
  .app-window.is-minimizing { pointer-events:none; animation: window-minimize 330ms cubic-bezier(.36,.02,.55,.96) both; }
  .app-window.is-restoring { animation: window-restore 330ms var(--spring-soft) both; }
  .app-window.is-dragging {
    transition:box-shadow 140ms ease, filter 140ms ease;
    will-change:transform;
  }
  .app-window.is-resizing { transition:none; }
  .app-window.is-scene-restoring { transition:none !important; }

  @keyframes window-open {
    0% { opacity:0; transform:translateY(18px) scale(.955); filter:blur(7px) saturate(.7); }
    58% { opacity:1; transform:translateY(-2px) scale(1.006); filter:blur(0) saturate(1); }
    100% { opacity:1; transform:none; filter:none; }
  }
  @keyframes window-close {
    to { opacity:0; transform:translateY(10px) scale(.97); filter:blur(5px) saturate(.7); }
  }
  @keyframes window-minimize {
    0% { opacity:1; transform:none; clip-path:inset(0 round var(--radius-window)); }
    62% { opacity:.84; transform:translateY(12vh) scale(.72); clip-path:inset(6% 4% 3% round 24px); }
    100% { opacity:0; transform:translateY(45vh) scale(.18); clip-path:inset(35% 4% 0 round 38px); }
  }
  @keyframes window-restore {
    0% { opacity:0; transform:translateY(38vh) scale(.18); filter:blur(6px); }
    62% { opacity:1; transform:translateY(-3px) scale(1.008); filter:blur(0); }
    100% { opacity:1; transform:none; }
  }

  .popover:not([hidden]) { animation:popover-in 190ms var(--spring-soft) both; transform-origin:var(--origin, 90% 0); }
  .system-menu:not([hidden]) { --origin:15% 0; }
  @keyframes popover-in { from { opacity:0; transform:translateY(-7px) scale(.97); filter:blur(4px); } to { opacity:1; transform:none; filter:none; } }

  .overlay:not([hidden]) .command-backdrop,
  .overlay:not([hidden]) .launcher-backdrop { animation:overlay-backdrop-in 200ms ease both; }
  .command-overlay:not([hidden]) .command-center { animation:command-in 250ms var(--spring-soft) both; }
  .launcher-overlay:not([hidden]) .launcher-shell { animation:launcher-in 280ms var(--spring-soft) both; }
  @keyframes overlay-backdrop-in { from { opacity:0; } }
  @keyframes command-in { from { opacity:0; transform:translateY(-16px) scale(.965); filter:blur(8px); } 65% { transform:translateY(2px) scale(1.003); filter:blur(0); } }
  @keyframes launcher-in { from { opacity:0; transform:translateY(18px) scale(.96); filter:blur(8px); } 60% { opacity:1; filter:blur(0); } to { transform:translateY(-1vh) scale(1); } }

  .launcher-grid > button { animation:launcher-item-in 300ms var(--spring-soft) both; animation-delay:calc(var(--item-index,0) * 22ms + 70ms); }
  @keyframes launcher-item-in { from { opacity:0; transform:translateY(16px) scale(.92); } }

  .desktop-context:not([hidden]) { animation:context-in 150ms var(--spring-soft) both; transform-origin:0 0; }
  @keyframes context-in { from { opacity:0; transform:scale(.94); filter:blur(3px); } }

  .snap-preview.is-visible { animation:snap-in 140ms var(--ease-out) both; }
  @keyframes snap-in { from { opacity:0; transform:scale(.98); } }

  .toast { animation:toast-in 330ms var(--spring-soft) both; }
  .toast.is-leaving { animation:toast-out 190ms ease both; }
  @keyframes toast-in { from { opacity:0; transform:translateY(14px) scale(.94); filter:blur(4px); } 70% { transform:translateY(-2px) scale(1.005); filter:blur(0); } }
  @keyframes toast-out { to { opacity:0; transform:translateY(7px) scale(.97); filter:blur(3px); } }

  .boot-mark { animation:boot-mark 1.7s var(--ease-in-out) infinite alternate; }
  .boot-aura { animation:boot-aura 2.4s ease-in-out infinite alternate; }
  .boot-track span { animation:boot-progress 1.75s var(--ease-in-out) forwards; }
  .boot-skip { animation:boot-skip 400ms 1.25s ease forwards; }
  .boot-screen.is-ready { pointer-events:none; animation:boot-away 720ms var(--ease-out) forwards; }
  @keyframes boot-mark { from { transform:translateY(2px) scale(.98); box-shadow:0 18px 55px rgba(56,149,205,.23),inset 0 1px 0 rgba(255,255,255,.55); } to { transform:translateY(-2px) scale(1.015); box-shadow:0 29px 84px rgba(56,149,205,.38),inset 0 1px 0 rgba(255,255,255,.55); } }
  @keyframes boot-aura { from { opacity:.55; transform:scale(.92); } to { opacity:1; transform:scale(1.08); } }
  @keyframes boot-progress { 0% { width:0; } 40% { width:38%; } 75% { width:72%; } 100% { width:100%; } }
  @keyframes boot-skip { to { opacity:1; } }
  @keyframes boot-away { 0% { opacity:1; } 55% { opacity:1; filter:blur(0); } 100% { opacity:0; visibility:hidden; filter:blur(16px); transform:scale(1.025); } }

  .wallpaper { transition:filter 750ms var(--ease-out), transform 850ms var(--ease-out); }
  .desktop.is-space-shifting .wallpaper { transform:scale(1.035); }

  .focus-ring { transition:background 500ms ease, opacity 250ms ease; }
  .widget-focus.is-paused .focus-ring { background:conic-gradient(rgba(255,255,255,.22) calc(var(--progress) * 1%),rgba(255,255,255,.055) 0); opacity:.72; }
  .widget-focus:not(.is-paused) .focus-live::before { animation:live-pulse 1.8s ease-in-out infinite; }
  @keyframes live-pulse { 50% { box-shadow:0 0 12px rgba(117,240,199,.9); transform:scale(1.18); } }

  .waveform.is-playing i { animation:wave 650ms ease-in-out infinite alternate; animation-delay:calc(var(--wave-index,0) * -55ms); }
  @keyframes wave { to { height:calc(var(--h,5px) * .4 + 2px); opacity:.55; } }
  .music-art.is-playing { animation:album-float 4s ease-in-out infinite; }
  @keyframes album-float { 50% { transform:translateY(-4px) rotate(.4deg); box-shadow:0 34px 64px rgba(47,15,66,.4),0 12px 24px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.3); } }

  .health-graph i { animation:health-drift 1.8s ease-in-out infinite alternate; animation-delay:calc(var(--bar-index,0) * -90ms); }
  @keyframes health-drift { to { height:calc(var(--h,30%) * .62 + 8%); opacity:.58; } }

  .cursor-aura { transition:opacity 180ms ease, width 150ms ease, height 150ms ease, border-color 150ms ease; }
  .cursor-aura.is-interactive { width:38px; height:38px; border-color:rgba(var(--accent-rgb),.55); }

  .lock-screen:not([hidden]) { animation:lock-in 480ms var(--ease-out) both; }
  .lock-screen:not([hidden]) .lock-content { animation:lock-content-in 520ms 80ms var(--spring-soft) both; }
  .lock-screen.is-unlocking { animation:lock-out 450ms var(--ease-in-out) forwards; }
  @keyframes lock-in { from { opacity:0; -webkit-backdrop-filter:blur(0); backdrop-filter:blur(0); } }
  @keyframes lock-content-in { from { opacity:0; transform:translateY(25px) scale(.97); filter:blur(7px); } }
  @keyframes lock-out { to { opacity:0; filter:blur(10px); transform:scale(1.035); } }

  .desktop.overview-mode .desktop-widgets,
  .desktop.overview-mode .stage-rail { opacity:.16; filter:blur(4px); pointer-events:none; transition:opacity 220ms ease,filter 220ms ease; }
  .desktop.overview-mode .app-window { box-shadow:0 22px 60px rgba(0,3,12,.4); cursor:pointer; }
  .desktop.overview-mode .app-window:not(.overview-selected) { opacity:.66; filter:saturate(.52) brightness(.68); }
  .desktop.overview-mode .app-window.overview-selected { z-index:90 !important; border-color:rgba(var(--accent-rgb),.92); box-shadow:0 0 0 3px rgba(var(--accent-rgb),.22),0 0 44px rgba(var(--accent-rgb),.15),0 32px 82px rgba(0,3,12,.58); transform:translateY(-5px) scale(1.018); filter:saturate(1.06) brightness(1.04); }
  .desktop.overview-mode .app-window:not(.overview-selected) .overview-caption { opacity:0; transform:translate(-50%,8px) scale(.96); }
  .desktop.overview-mode .app-window:hover { transform:translateY(-5px) scale(1.012); border-color:rgba(var(--accent-rgb),.35); }
  .desktop.overview-mode .overview-hud { animation:popover-in 190ms var(--spring-soft) both; }

  @media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
      scroll-behavior: auto !important;
      animation-duration: .01ms !important;
      animation-iteration-count: 1 !important;
      transition-duration: 90ms !important;
      transition-timing-function: linear !important;
    }
    #ambientCanvas, .cursor-aura { display:none !important; }
    .app-window.is-opening, .app-window.is-closing, .app-window.is-minimizing, .app-window.is-restoring { animation-name:fade-only; }
    @keyframes fade-only { from { opacity:0; } }
  }
}