/* One motion system, independent of light/dark palette and native business state. */
html[data-theme] { --site-motion-ease: cubic-bezier(.22,1,.36,1); }
html[data-theme] .site-segment-track { position: relative; isolation: isolate; }
html[data-theme] .site-selection-thumb {
  display: block; position: absolute; top: 0; left: 0; z-index: -1; pointer-events: none;
  transform-origin: 0 0;
}
html[data-theme] .site-selection-thumb[hidden] { display: none; }
html[data-theme] .site-segment-track .site-motion-option { position: relative; background: transparent; }
html[data-theme] .site-material .site-segment-track .submission-type-choice:has(input:checked),
html[data-theme] :is(.view-tabs,.release-filters).site-segment-track a.active { background: transparent; box-shadow: none; }
/* Restore each dark option's original idle fill below the moving selected fill. */
html[data-theme="dark"] .site-segment-track .site-motion-option::before {
  content: ""; position: absolute; inset: 0; z-index: -2; border-radius: inherit;
  background: var(--site-option-background); pointer-events: none;
}
html[data-theme][data-site-motion-ready] body :is(button,.button,.secondary,.guide-button,.quick-nav a,.submission-type-choice) {
  -webkit-tap-highlight-color: transparent;
  transition: transform 180ms var(--site-motion-ease),background-color 140ms ease-out,color 140ms ease-out;
}
html[data-theme][data-site-input="pointer"] body :is(button,.button,.secondary,.guide-button,.quick-nav a):not(:disabled):active { transform: scale(.975); transition-duration: 80ms; }
html[data-theme][data-site-motion-ready] body :is(input,select,textarea) { transition: border-color 140ms ease-out,box-shadow 140ms ease-out; }
html[data-theme] body dialog {
  opacity: 0; transform: translateY(10px) scale(.985);
  transition: opacity 170ms ease-out,transform 230ms var(--site-motion-ease),display 230ms allow-discrete,overlay 230ms allow-discrete;
}
html[data-theme] body dialog[open] { opacity: 1; transform: none; }
html[data-theme] body dialog::backdrop { opacity: 0; transition: opacity 170ms ease-out,display 230ms allow-discrete,overlay 230ms allow-discrete; }
html[data-theme] body dialog[open]::backdrop { opacity: 1; }
@starting-style {
  html[data-theme] body dialog[open] { opacity: 0; transform: translateY(10px) scale(.985); }
  html[data-theme] body dialog[open]::backdrop { opacity: 0; }
}
@supports(interpolate-size:allow-keywords) {
  html[data-theme] :is(.lyrics-example,.trend-numbers)::details-content {
    interpolate-size: allow-keywords; block-size: 0; overflow: hidden; opacity: 0;
    transition: block-size 220ms var(--site-motion-ease),opacity 160ms ease-out,content-visibility 220ms allow-discrete;
  }
  html[data-theme] :is(.lyrics-example,.trend-numbers)[open]::details-content { block-size: auto; opacity: 1; }
}
html[data-theme] :is(.lyrics-example,.trend-numbers) summary { -webkit-tap-highlight-color: transparent; }
@media(prefers-reduced-motion:reduce) {
  html[data-theme][data-site-motion-ready] body :is(button,.button,.secondary,.guide-button,.quick-nav a,.submission-type-choice) { transition: background-color 80ms ease-out,color 80ms ease-out; }
  html[data-theme][data-site-input="pointer"] body :is(button,.button,.secondary,.guide-button,.quick-nav a):not(:disabled):active { transform: none; }
  html[data-theme] body dialog { transform: none; transition: opacity 90ms ease-out,display 90ms allow-discrete,overlay 90ms allow-discrete; }
  html[data-theme] :is(.lyrics-example,.trend-numbers)::details-content { transition: opacity 80ms ease-out; }
  @starting-style { html[data-theme] body dialog[open] { transform: none; } }
}
html[data-theme][data-site-input="keyboard"] :is(.lyrics-example,.trend-numbers)::details-content { transition: none; }
html[data-theme][data-site-input="keyboard"] body dialog { transform: none; transition: opacity 90ms ease-out,display 90ms allow-discrete,overlay 90ms allow-discrete; }
