/* BA Workstation motion layer (Ardito skin phase 3c, 29 Oct 2026). Loaded with ba-dark.css.
   Rules: transform and opacity only (no layout shift, nothing that delays input); every
   animation sits under prefers-reduced-motion: no-preference AND outside calm mode
   (html.ard-calm: Save-Data, 2G/3G, reduced motion; set by ardito-skin.js). Content above the
   fold is never hidden: only blocks that START below the fold are revealed on scroll, and
   ba-motion.js marks them (.bk-rv) only after first paint. Hover effects only where hover
   exists, so a tap on a phone never leaves a card stuck mid-effect. */

/* ── interaction feedback that is not motion (always on) ── */
.ba-dk :is(a,button,summary,[role=button]){-webkit-tap-highlight-color:rgba(91,141,255,.18)}
.ba-dk :is(button,[role=button],.ba-act,.ba-choice,.qa-club-pill,.source-filter-link):focus-visible{outline:2px solid #7DA6FF;outline-offset:2px}

@media (prefers-reduced-motion:no-preference){
  /* below-the-fold reveal (ba-motion.js adds .bk-rv, then .bk-in when it scrolls into view) */
  /* starts at .3, not 0: a block that scrolls in is readable at once and only settles (never "delay content") */
  html:not(.ard-calm) .ba-dk .bk-rv{opacity:.3;transform:translateY(14px) scale(.99)}
  html:not(.ard-calm) .ba-dk .bk-rv.bk-in{opacity:1;transform:none;
    transition:opacity .38s cubic-bezier(.2,.8,.2,1),transform .5s cubic-bezier(.16,1,.3,1)}

  /* the page kicker's rule draws in; the title's charge bar is ardito-body's */
  html:not(.ard-calm) .ba-dk .ba-kicker:not(.ba-kicker--plain)::before{transform-origin:0 50%;animation:bk-draw .7s .1s cubic-bezier(.2,.8,.2,1) both}

  /* buttons: a light sheen crosses a primary action on hover; press = scale */
  html:not(.ard-calm) .ba-dk :is(.ba-act--call,.ba-act--primary,.ld-act--call,.qa-primary-btn,.ba-act--wa,.ld-act--wa){position:relative;overflow:hidden;isolation:isolate}
  html:not(.ard-calm) .ba-dk :is(.ba-act--call,.ba-act--primary,.ld-act--call,.qa-primary-btn,.ba-act--wa,.ld-act--wa)::after{
    content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
    background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.28) 48%,transparent 66%);
    transform:translateX(-120%)}
  html:not(.ard-calm) .ba-dk :is(button,.ba-act,.ba-choice,a.ba-pill,.qa-club-pill,.source-filter-link,.ba-nav-link):not(:disabled):active{transform:scale(.97)}
  html:not(.ard-calm) .ba-dk :is(button,.ba-act,.ba-choice,.qa-club-pill,.source-filter-link){transition:transform .14s cubic-bezier(.25,1,.5,1),background-color .16s ease,border-color .16s ease,box-shadow .2s ease,filter .2s ease,color .16s ease}

  /* urgent pills breathe: a ring that scales out and fades (no box-shadow animation) */
  html:not(.ard-calm) .ba-dk :is(.ba-pill--overdue,.ba-pill--hot){position:relative}
  html:not(.ard-calm) .ba-dk .ba-pill--overdue::after{content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;
    border:1px solid rgba(248,113,113,.9);animation:bk-ping 2.4s cubic-bezier(0,0,.2,1) infinite}

  /* live dots */
  html:not(.ard-calm) .ba-dk .bk-live::before{animation:bk-blink 1.8s ease-in-out infinite}

  /* details / disclosure panels: the body slides in when opened */
  html:not(.ard-calm) .ba-dk details[open]>:not(summary){animation:bk-open .32s cubic-bezier(.2,.8,.2,1) both}
  html:not(.ard-calm) .ba-dk details>summary .bk-chev{transition:transform .25s cubic-bezier(.2,.8,.2,1)}
  html:not(.ard-calm) .ba-dk details[open]>summary .bk-chev{transform:rotate(180deg)}

  /* htmx: the element whose request is in flight dims (its own loading signal) */
  html:not(.ard-calm) .ba-dk .htmx-request{opacity:.6;transition:opacity .2s ease}

  /* progress bars and meters fill from zero (transform, not width) */
  html:not(.ard-calm) .ba-dk .bk-fill{transform-origin:0 50%;animation:bk-grow 1s .15s cubic-bezier(.2,.8,.2,1) both}
  html:not(.ard-calm) .ba-dk .bk-rise{transform-origin:50% 100%;animation:bk-up .9s cubic-bezier(.2,.8,.2,1) both}

  /* skeleton shimmer for anything marked loading */
  html:not(.ard-calm) .ba-dk .bk-skel{position:relative;overflow:hidden}
  html:not(.ard-calm) .ba-dk .bk-skel::after{content:"";position:absolute;inset:0;pointer-events:none;
    background:linear-gradient(90deg,transparent,rgba(125,166,255,.14),transparent);transform:translateX(-100%);
    animation:bk-shimmer 1.4s ease-in-out infinite}
}

@media (prefers-reduced-motion:no-preference) and (hover:hover){
  html:not(.ard-calm) .ba-dk :is(.ba-act--call,.ba-act--primary,.ld-act--call,.qa-primary-btn,.ba-act--wa,.ld-act--wa):hover::after{
    transform:translateX(120%);transition:transform .7s cubic-bezier(.2,.8,.2,1)}
  /* cards lift and catch the light under the pointer (ba-motion.js feeds --bk-mx/--bk-my) */
  /* .bk-spot is only given to cards that are already positioned (ba-motion.js), so no containing block changes */
  html:not(.ard-calm) .ba-dk .bk-spot::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:0;
    opacity:0;transition:opacity .3s ease;
    background:radial-gradient(420px circle at var(--bk-mx,50%) var(--bk-my,0%),rgba(125,166,255,.10),transparent 60%)}
  html:not(.ard-calm) .ba-dk .bk-spot:hover::before{opacity:1}
  html:not(.ard-calm) .ba-dk :is(.queue-card,.qa-source-card,.v2-platform-card){transition:transform .28s cubic-bezier(.2,.8,.2,1),border-color .2s ease,box-shadow .28s ease}
  html:not(.ard-calm) .ba-dk :is(.queue-card,.qa-source-card,.v2-platform-card):hover{transform:translateY(-2px)}
  html:not(.ard-calm) .ba-dk .ba-nav-link .ba-icon{transition:transform .25s cubic-bezier(.2,.8,.2,1)}
  html:not(.ard-calm) .ba-dk .ba-nav-link:hover .ba-icon{transform:translateY(-1px) scale(1.08)}
}

@keyframes bk-draw{from{transform:scaleX(0)}}
@keyframes bk-ping{0%{transform:scale(1);opacity:.9}80%,100%{transform:scale(1.35,1.6);opacity:0}}
@keyframes bk-blink{0%,100%{opacity:1}50%{opacity:.35}}
@keyframes bk-open{from{opacity:0;transform:translateY(-6px)}}
@keyframes bk-grow{from{transform:scaleX(0)}}
@keyframes bk-up{from{transform:scaleY(0)}}
@keyframes bk-shimmer{to{transform:translateX(100%)}}

@media print{.ba-dk .bk-rv{opacity:1!important;transform:none!important}}
