/* DarkUGC motion vocabulary. No continuous decorative animation. */
:root {
  --motion-out:cubic-bezier(.16,1,.3,1);
  --motion-zoom:cubic-bezier(.22,.68,.16,1);
  --motion-spring:linear(0,.0526,.1707,.3126,.4536,.5807,.6884,.7754,.8431,.8941,.9314,.9577,.9758,.9878,.9953,.9997,1.0021,1.0032,1.0035,1.0033,1.0029,1.0024,1.0019,1.0015,1);
  --noir-spring:linear(0,.076,.2463,.4458,.6338,.7894,.9054,.9833,1.029,1.0505,1.0555,1.0506,1.0409,1.0298,1.0195,1.011,1.0048,1.0006,.9982,.9971,.9969,.9972,.9978,.9984,1);
}
/* Touch and keyboard receive the same quick, springy press response. */
body.noir :is(.button,.icon-button,.account-pill,.saved-filter,.tile-save,.scan-segments button,.live-chart-types>button,.live-intervals>button,.scan-chart-buttons button,.chart-filters button,.rank-pill) {
  transition:transform .26s var(--motion-spring),filter .15s ease,background-color .15s ease,box-shadow .3s ease,color .15s ease;
}
@media(hover:hover) and (pointer:fine) {
  body.noir :is(.button,.account-pill,.saved-filter):hover { transform:translateY(-1px); filter:brightness(1.05); }
}
body.noir :is(.button,.icon-button,.account-pill,.saved-filter,.tile-save,.scan-segments button,.live-chart-types>button,.live-intervals>button,.scan-chart-buttons button,.chart-filters button,.rank-pill):active { transform:scale(.98); transition-duration:.12s; }
body.noir :is(.button,.icon-button,.saved-filter):disabled { transform:none; filter:none; }
/* The same sliding selection used by the reference navigation, extended to app controls. */
body.noir .motion-pill-group { position:relative; isolation:isolate; }
body.noir .motion-pill-group>button { position:relative; z-index:1; }
body.noir .motion-pill-group>button.active { background:transparent; box-shadow:none; }
.motion-selection { position:absolute; left:0; top:0; z-index:0; pointer-events:none; border-radius:999px; background:var(--dg-selected); box-shadow:var(--dg-selected-shadow); transition:transform .52s var(--noir-spring),width .52s var(--noir-spring),height .52s var(--noir-spring); }
.motion-selection.motion-no-transition { transition:none; }
body.noir :is(.nav-slider,.sliding-pill) { transition:transform .52s var(--noir-spring),width .52s var(--noir-spring),height .52s var(--noir-spring); }
/* Small sequential reveals happen when content enters view, rather than below the fold. */
@keyframes motion-rise { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:translateY(0); } }
body.noir .motion-reveal-wait { opacity:0; transform:translateY(6px); }
body.noir .motion-reveal-enter { animation:motion-rise .22s var(--motion-out) both; animation-delay:calc(var(--motion-order,0)*20ms); }
body.noir .market-tile { animation:none; }
body.noir .market-tile.motion-reveal-enter { animation:motion-rise .22s var(--motion-out) both; animation-delay:calc(var(--motion-order,0)*20ms); }
body.noir :is(.featured-hero,.live-workspace,.page-heading,.settings-panel) { animation:surface-enter .22s var(--motion-out) both; }
@keyframes surface-enter { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:translateY(0); } }
body.noir .copy-enter { animation:copy-enter .22s var(--motion-out) both; }
@keyframes copy-enter { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:translateY(0); } }
/* Card media gently zooms; only its thin rim follows the pointer. */
body.noir .tile-art { transition:transform .26s var(--motion-spring),box-shadow .3s ease; }
body.noir .tile-art:after { content:''; position:absolute; inset:0; padding:1.5px; border-radius:inherit; background:radial-gradient(280px circle at var(--motion-x,-999px) var(--motion-y,-999px),#b1d6e559,transparent 72%); mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0); mask-composite:exclude; -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0); -webkit-mask-composite:xor; opacity:0; transition:opacity .3s ease; pointer-events:none; z-index:4; }
body.noir .tile-open>.market-artwork { transition:transform .7s var(--motion-zoom); }
@media(hover:hover) and (pointer:fine) {
  body.noir .market-tile:hover .tile-art { transform:translateY(-3px); }
  body.noir .market-tile:hover .tile-art:after { opacity:1; }
  body.noir .market-tile:hover .market-artwork { transform:scale(1.04); }
}
body.noir .tile-art:active { transform:scale(.985); transition-duration:.12s; }
body.noir .feature-card { transition:transform .55s cubic-bezier(.23,1,.32,1),filter .3s ease,border-color .3s ease,box-shadow .55s ease; }
body.noir .feature-card:hover { --lift:-6px; }
body.noir :is(.scan-detail-card,.scan-settings,.live-setup-panel,.live-signals-panel) { transition:box-shadow .3s ease; }
@media(hover:hover) and (pointer:fine) {
  body.noir :is(.scan-detail-card,.scan-settings,.live-setup-panel):hover { box-shadow:inset 0 0 0 1px #ffffff16,inset 0 1px 0 #ffffff0a; }
}
/* Clear, short modal and popover transitions, using the reference's 10px/0.97 entrance. */
body.noir dialog[open] { animation:modal-enter .25s var(--motion-out) both; }
body.noir dialog.is-closing { animation:modal-exit .15s cubic-bezier(.65,0,.35,1) both; }
@keyframes modal-enter { from { opacity:0; transform:translateY(10px) scale(.97); } to { opacity:1; transform:translateY(0) scale(1); } }
@keyframes modal-exit { to { opacity:0; transform:translateY(6px) scale(.98); } }
@keyframes motion-pop { from { opacity:0; transform:translateY(5px) scale(.985); } to { opacity:1; transform:translateY(0) scale(1); } }
body.noir .live-market-results:not([hidden]),body.noir .live-indicators:not([hidden]) { animation:motion-pop .16s var(--motion-out) both; transform-origin:top center; }
body.noir .scan-progress-track>span { transition:width .4s var(--motion-out); }
@media(prefers-reduced-motion:reduce) {
  body.noir *,body.noir *:before,body.noir *:after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
  body.noir :is(.motion-reveal-wait,.motion-reveal-enter) { opacity:1; transform:none; }
  body.noir .market-tile:hover .tile-art,body.noir .market-tile:active .tile-art,body.noir .tile-art:active,body.noir .market-tile:hover .market-artwork,body.noir .button:hover,body.noir .button:active,body.noir .icon-button:active { transform:none; }
  body.noir .tile-art:after { display:none; }
}

@media(prefers-reduced-motion:reduce) {
  body.noir :is(.account-pill,.saved-filter,.tile-save,.scan-segments button,.live-chart-types>button,.live-intervals>button,.scan-chart-buttons button,.chart-filters button,.rank-pill):active { transform:none; }
  body.noir .feature-card:hover { --lift:0px; }
}