/* Brief interaction feedback; the layout and flat surfaces stay unchanged. */
.uya-page .song-search-clear {
    display: inline-grid;
    place-items: center;
    flex: 0 0 30px;
    width: 30px;
    height: 32px;
    padding: 0;
    border: 0;
    border-radius: 4px;
    background: transparent;
    color: #806b90;
    font: inherit;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
}
.uya-page .song-search-clear[hidden] { display: none; }
.uya-page .song-search-clear:hover { background: #f0eaf5; }
.uya-page #search::-webkit-search-cancel-button { -webkit-appearance: none; }
.uya-page .song-tools-status { min-height: 17px; }
.uya-page .song-tools-status.is-loading { color: #64438a; }
.uya-page .song-tools-status.is-loading::before {
    content: '';
    display: inline-block;
    width: 5px;
    height: 5px;
    margin-right: 6px;
    border-radius: 50%;
    background: currentColor;
    vertical-align: 2px;
}
.uya-page .song-tools-status .song-load-retry {
    min-height: 26px;
    padding: 2px 8px;
    margin-left: 8px;
    font-size: 11px;
}
.uya-page #songs_list.is-refreshing > .song-tools-item { opacity: .55; }
.uya-page #songs_list.is-stale > .song-tools-item { opacity: .72; }
.uya-page .song-tools-item { transition: opacity .15s ease, background-color .15s ease; }
.uya-page :is(.song-tool-button, .song-search-clear, .search_button, .bili-mobile-trigger, .bili-hub__close, #type_list button) {
    transition: background-color .15s ease, border-color .15s ease, color .15s ease, transform .12s ease;
}
.uya-page :is(.song-tool-button, .song-search-clear, .search_button, .bili-mobile-trigger, .bili-hub__close, #type_list button):active:not(:disabled) {
    transform: translateY(1px);
}
.uya-page .song-tool-button.is-feedback { animation: uya-button-feedback .24s ease-out; }
.uya-page .song-favorite[aria-pressed="true"] { background: #e9def3; color: #613887; border-color: #c6aedc; }
.uya-page:not(.uya-compact)[data-uya-effects="on"] .song-tools-item.song-result-enter {
    animation: uya-result-enter .2s ease-out backwards;
    animation-delay: var(--song-enter-delay, 0ms);
}
.uya-page .song-tools-toast:not([hidden]) { animation: uya-toast-enter .18s ease-out; }
.uya-page :is(.song-random-dialog, .vs-dialog, .bili-weekly-dialog)[open] { animation: uya-result-enter .18s ease-out; }
.uya-page .search_form:focus-within { border-color: #9271b7; }
.uya-page .song-tools-item { cursor: default; }
.uya-page #songs_list { overscroll-behavior: contain; }
.uya-page .song-tools-toast { box-shadow: none; }
@media (max-width:600px) {
    .uya-page .song-item-actions .song-tool-button { min-height: 40px; }
    .uya-page footer { padding-bottom: calc(7px + env(safe-area-inset-bottom, 0px)); }
}
/* Live status stays visible without a perpetual decorative pulse. */
.uya-page .bili-hub.is-live .bili-hub__dot,
.uya-page .bili-mobile-trigger.is-live .bili-mobile-trigger__dot { animation: none; }
@keyframes uya-result-enter {
    from { opacity: 0; transform: translateY(5px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes uya-button-feedback {
    0% { transform:scale(1); }
    35% { transform:scale(.94); }
    70% { transform:scale(1.035); }
    100% { transform:scale(1); }
}

/* Ripple and stagger ideas from Magic UI and Motion, implemented with native
   CSS/WAAPI so the existing PHP site needs no React or animation dependency. */
.uya-page :is(.song-copy,.song-more,.song-favorite,#type_list button) { position:relative; overflow:hidden; isolation:isolate; }
.uya-page .uya-tap-ripple { position:absolute; z-index:1; pointer-events:none; border-radius:50%; background:currentColor; }
.uya-page:not(.uya-compact) .song-quick-actions .song-copy { min-width:64px; }
.uya-page.uya-compact .song-quick-actions .song-copy { width:60px; }
.uya-page.uya-compact .song-quick-actions .song-copy.is-copied { background:#267367; border-color:#267367; color:#fff; }
.uya-page.uya-compact[data-uya-effects="on"] .song-tools-item.is-expanded .song-extra { animation:uya-extra-reveal .3s cubic-bezier(.22,1,.36,1); }
.uya-page.uya-compact[data-uya-effects="on"] .song-favorite[aria-pressed="true"].is-feedback { animation:uya-favorite-pop .38s ease-out; }
.uya-page.uya-compact[data-uya-effects="on"] .uya-brand-mark { animation:uya-note-dance 3.8s ease-in-out infinite; }
.uya-page.uya-compact .search_button { position:relative; overflow:hidden; }
.uya-page.uya-compact .search_button::after { content:""; position:absolute; inset:-20% auto -20% -70%; width:55%; background:linear-gradient(100deg,transparent,#ffffff7a,transparent); transform:translateX(0) skewX(-18deg); pointer-events:none; }
.uya-page.uya-compact[data-uya-effects="on"] .search_button::after { animation:uya-search-shimmer 6s ease-in-out infinite; }
.uya-page.uya-compact .song-tools-status::after { content:""; display:inline-block; width:9px; height:9px; margin-left:7px; background:#ad689c; vertical-align:0; clip-path:polygon(50% 0,62% 36%,100% 50%,62% 64%,50% 100%,38% 64%,0 50%,38% 36%); }
.uya-page.uya-compact[data-uya-effects="on"] .song-tools-status::after { animation:uya-status-star 2.8s ease-in-out infinite; }
.uya-page.uya-compact[data-uya-effects="on"] .song-tools-status.is-loading::after { animation:uya-status-star .9s ease-in-out infinite; }
@keyframes uya-extra-reveal { from { opacity:.3; transform:translateY(-6px); } to { opacity:1; transform:translateY(0); } }
@keyframes uya-favorite-pop { 0%,100% { transform:scale(1); } 35% { transform:scale(1.12) rotate(-3deg); } 65% { transform:scale(.97); } }
@keyframes uya-note-dance { 0%,100% { transform:rotate(-6deg) translateY(0); } 45% { transform:rotate(6deg) translateY(-2px); } 65% { transform:rotate(2deg) translateY(0); } }
@keyframes uya-search-shimmer { 0%,60% { transform:translateX(0) skewX(-18deg); } 90%,100% { transform:translateX(420%) skewX(-18deg); } }
@keyframes uya-status-star { 0%,100% { opacity:.4; transform:scale(.8) rotate(0); } 50% { opacity:1; transform:scale(1.25) rotate(35deg); } }
.uya-page[data-uya-effects="off"] :is(.song-tools-item,.song-tool-button,.song-extra,.song-tools-toast),
.uya-page[data-uya-effects="off"] :is(.song-random-dialog,.vs-dialog,.bili-weekly-dialog)[open] { animation:none !important; }
.uya-page[data-uya-effects-paused="true"] :is(.song-tools-item,.song-tool-button,.song-extra,.song-tools-toast),
.uya-page[data-uya-effects-paused="true"] .search_button::after,
.uya-page[data-uya-effects-paused="true"] .song-tools-status::after { animation-play-state:paused !important; }
@media (prefers-reduced-motion:reduce) {
    .uya-page.uya-compact .song-extra,
    .uya-page.uya-compact .uya-brand-mark,
    .uya-page.uya-compact .search_button::after,
    .uya-page.uya-compact .song-tools-status::after { animation:none !important; }
}
@keyframes uya-toast-enter {
    from { opacity: 0; transform: translate(-50%, -5px); }
    to { opacity: 1; transform: translate(-50%, 0); }
}
@media (prefers-reduced-motion: reduce) {
    .uya-page .song-tools-item,
    .uya-page .song-tool-button,
    .uya-page .song-tools-toast,
    .uya-page .song-random-dialog,
    .uya-page .vs-dialog,
    .uya-page .bili-weekly-dialog,
    .uya-page .song-search-clear,
    .uya-page .search_button,
    .uya-page .bili-hub--mobile,
    .uya-page .bili-hub-backdrop,
    .uya-page .bili-mobile-trigger,
    .uya-page .bili-hub__close,
    .uya-page #type_list button { animation: none !important; transition: none !important; }
    .uya-page #songs_list { scroll-behavior: auto !important; }
}
