/* Shared motion layer, loaded before the first paint. No navigation interception. */
@media (min-width: 1101px) { html { scrollbar-gutter: stable; } }

/* Remove legacy staggered entrances; one shared arrival is defined below. */
.workspace :is(.overview-heading,.notes-heading,.collection-intro,.overview-charts,
    .overview-operations,.record-summary,.record-body,.pilot-metrics,.pilot-main,
    .pilot-aging,.pilot-work,.bank-overview,.bank-ledger,.bank-setup,.settings-layout,
    .mail-workspace,.bank-control-card,.client-billing-layout,.metric,.director-reveal),
.workspace .main-content > .card { animation: none; }

@media (prefers-reduced-motion: no-preference) {
    @view-transition { navigation: auto; }
    /* Keep the outgoing surface opaque: two fading layers expose the background. */
    ::view-transition-old(root) { animation: none; opacity: 1; }
    ::view-transition-new(root) { animation:none; mix-blend-mode:normal; }
    ::view-transition-group(root) { animation: none; }
    .workspace .header { view-transition-name: workspace-header; }
    .workspace .mobile-dock { view-transition-name: workspace-dock; }
    ::view-transition-group(workspace-header),
    ::view-transition-group(workspace-dock) { animation: none; }
    ::view-transition-old(workspace-header),
    ::view-transition-old(workspace-dock) { animation: none; opacity: 0; }
    ::view-transition-new(workspace-header),
    ::view-transition-new(workspace-dock) { animation: none; mix-blend-mode: normal; }

    /* Native dialogs keep their focus, Escape and form semantics on close. */
    dialog { opacity: 0; transform: translateY(6px); }
    dialog[open] { opacity: 1; transform: none; animation: none !important; }
    @supports (transition-behavior: allow-discrete) {
        dialog {
            transition: opacity 160ms ease-out, transform 180ms var(--motion-ease),
                display 180ms allow-discrete, overlay 180ms allow-discrete;
        }
        dialog::backdrop {
            opacity: 0;
            transition: opacity 180ms, display 180ms allow-discrete, overlay 180ms allow-discrete;
        }
        dialog[open]::backdrop { opacity: 1; }
        @starting-style {
            dialog[open] { opacity: 0; transform: translateY(6px); }
            dialog[open]::backdrop { opacity: 0; }
        }
    }
    .app-select-button, .app-select-option {
        transition: background-color 140ms, border-color 140ms, box-shadow 140ms, color 140ms;
    }
    .app-select-chevron { transition: transform 160ms var(--motion-ease); }
    .app-select-menu { animation: surface-crossfade 140ms ease-out; }
    .tab-content:not(.hidden) { animation: surface-crossfade 160ms ease-out; }
}
@keyframes surface-crossfade { from { opacity: 0; } to { opacity: 1; } }

/* A fast request must not dim an entire calendar for a single frame. */
.cal-board[aria-busy=true] { opacity: 1; cursor: progress; }
.cal-board { position: relative; }
.cal-board::after {
    content: ''; position: absolute; inset: 0 0 auto; height: 2px;
    background: var(--color-primary, #5067a5); opacity: 0; pointer-events: none;
    transition: opacity 140ms;
}
.cal-board[aria-busy=true]::after { opacity: 1; transition-delay: 180ms; }

@media (prefers-reduced-motion: reduce) {
    @view-transition { navigation: none; }
    *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

/* Move only the content, never the full viewport or its background. */
@keyframes page-arrive {
    from { opacity:.65; transform:translateY(8px); }
    to { opacity:1; transform:translateY(0); }
}
@media (prefers-reduced-motion:no-preference) {
    .workspace .main-content { view-transition-name:workspace-content; }
    .workspace .main-content > :not(script,style,link,dialog,.modal-overlay) {
        animation:page-arrive 380ms cubic-bezier(.25,.65,.25,1) backwards;
    }
    html.is-page-transition .workspace .main-content > *,
    html.is-page-transition .workspace .director-reveal { animation:none; }
    ::view-transition-group(workspace-content) { animation:none; }
    ::view-transition-old(workspace-content) { animation:none; opacity:0; }
    ::view-transition-new(workspace-content) {
        animation:page-arrive 380ms cubic-bezier(.25,.65,.25,1) both;
        mix-blend-mode:normal;
    }
}

/* Mobile keeps continuity between pages with a short, shallow crossfade. */
@keyframes mobile-page-arrive {
    from { opacity:.85; transform:translateY(3px); }
    to { opacity:1; transform:translateY(0); }
}
@keyframes mobile-page-out { to { opacity:0; } }
@keyframes mobile-page-in {
    from { opacity:0; transform:translateY(3px); }
    to { opacity:1; transform:translateY(0); }
}
@media (max-width:767px) and (prefers-reduced-motion:no-preference) {
    .workspace .main-content > :not(script,style,link,dialog,.modal-overlay) {
        animation:mobile-page-arrive 240ms cubic-bezier(.4,0,.2,1) backwards;
    }
    ::view-transition-old(workspace-content) {
        opacity:1;
        animation:mobile-page-out 300ms cubic-bezier(.4,0,.2,1) both;
        mix-blend-mode:plus-lighter;
    }
    ::view-transition-new(workspace-content) {
        animation:mobile-page-in 300ms cubic-bezier(.4,0,.2,1) both;
        mix-blend-mode:plus-lighter;
    }
}

/* Separate snapshots preserve the dock, labels and glass throughout navigation. */
@media (max-width:767px) {
    .mobile-dock-glass {
        position:absolute; z-index:0; pointer-events:none; border-radius:18px;
        border:1px solid #ffffffc9;
        background:linear-gradient(145deg,#e0e8ffeb,#ccd9f6b8);
        box-shadow:0 3px 10px #5067a524,inset 0 1px 0 #ffffffcc;
    }
    .mobile-dock-glass[hidden] { display:none; }
    .mobile-dock.has-glass > :is(a,button) { z-index:1; }
    .mobile-dock.has-glass > :is([aria-current=page],.is-current,[aria-expanded=true]) {
        background:transparent; border-color:transparent; box-shadow:none;
    }
}
@media (max-width:767px) and (prefers-reduced-motion:no-preference) {
    .mobile-dock-glass { view-transition-name:workspace-selection; }
    .mobile-dock > :is(a,button) { view-transition-name:var(--dock-item-name); }
    ::view-transition-group(workspace-selection) {
        animation-duration:320ms; animation-timing-function:cubic-bezier(.4,0,.2,1);
    }
    /* Move the same opaque glass snapshot for the entire journey. No cross-fade. */
    ::view-transition-old(workspace-selection) { animation:none; opacity:1; mix-blend-mode:normal; }
    ::view-transition-new(workspace-selection) {
        animation:none; opacity:0; mix-blend-mode:normal;
    }
    ::view-transition-new(workspace-selection):only-child { opacity:1; }
    ::view-transition-group(workspace-dock-item-0),
    ::view-transition-group(workspace-dock-item-1),
    ::view-transition-group(workspace-dock-item-2),
    ::view-transition-group(workspace-dock-item-3),
    ::view-transition-group(workspace-dock-item-4) { animation:none; z-index:2; }
    ::view-transition-group(workspace-selection) { z-index:1; }
    ::view-transition-old(workspace-dock-item-0),
    ::view-transition-old(workspace-dock-item-1),
    ::view-transition-old(workspace-dock-item-2),
    ::view-transition-old(workspace-dock-item-3),
    ::view-transition-old(workspace-dock-item-4) { animation:none; opacity:0; }
    ::view-transition-new(workspace-dock-item-0),
    ::view-transition-new(workspace-dock-item-1),
    ::view-transition-new(workspace-dock-item-2),
    ::view-transition-new(workspace-dock-item-3),
    ::view-transition-new(workspace-dock-item-4) { animation:none; mix-blend-mode:normal; }
}

/* Repeated phone navigation must expose the next page immediately. */
@media (max-width:767px) {
    @view-transition { navigation:none; }
    .workspace .main-content > :not(script,style,link,dialog,.modal-overlay) { animation:none; }
}

/* Native navigation displays the finished document, without a translated arrival
   or a snapshot that holds ready content behind an animation. */
@view-transition { navigation:none; }
.workspace .main-content > :not(script,style,link,dialog,.modal-overlay),
.workspace .director-reveal { animation:none; }