.favorite-button { display:grid; width:42px; min-width:42px; height:42px; place-items:center; padding:0; border:1px solid rgba(72,125,208,.2); border-radius:50%; color:#52698f; background:rgba(255,255,255,.68); box-shadow:inset 0 0 14px rgba(255,255,255,.48); cursor:pointer; transition:color .18s ease,border-color .18s ease,background .18s ease,opacity .18s ease,transform .18s ease; }
.favorite-button:hover { color:#d89a23; border-color:rgba(224,167,54,.38); background:#fff; }
.favorite-button:focus-visible { outline:3px solid rgba(88,142,239,.42); outline-offset:3px; }
.favorite-button:disabled,.favorite-button.is-syncing { opacity:.58; cursor:wait; }
.favorite-button svg { width:21px; height:21px; fill:transparent; stroke:currentColor; stroke-width:1.65; stroke-linecap:round; stroke-linejoin:round; transition:fill .18s ease,transform .18s ease; }
.favorite-button[data-state="added"] { color:#d69a21; border-color:rgba(224,167,54,.4); background:rgba(255,248,218,.9); }
.favorite-button[data-state="added"] svg { fill:currentColor; }
.favorite-button.is-added-flash { animation:favoriteFlash .24s ease-out; }
.theme-night .favorite-button { color:#d6e6ff; border-color:rgba(125,167,238,.24); background:rgba(16,36,74,.62); box-shadow:inset 0 0 16px rgba(84,130,224,.08); }
.theme-night .favorite-button:hover { color:#ffd778; border-color:rgba(255,210,104,.38); background:rgba(33,63,121,.74); }
.theme-night .favorite-button[data-state="added"] { color:#ffd36d; border-color:rgba(255,208,91,.36); background:rgba(92,70,21,.55); }
.favorite-toast-root { position:fixed; z-index:80; right:18px; bottom:18px; display:flex; flex-direction:column; gap:8px; pointer-events:none; }
.favorite-toast { display:flex; align-items:center; gap:14px; max-width:min(420px,calc(100vw - 28px)); padding:12px 14px; border:1px solid rgba(91,138,214,.22); border-radius:14px; color:#33476d; background:rgba(255,255,255,.96); box-shadow:0 20px 52px rgba(35,62,120,.2); font-size:14px; opacity:0; transform:translateY(8px); pointer-events:auto; transition:opacity .2s ease,transform .2s ease; }
.favorite-toast.is-visible { opacity:1; transform:translateY(0); }
.favorite-toast button { min-height:34px; padding:0 11px; border:0; border-radius:10px; color:#33569a; background:rgba(69,116,196,.12); cursor:pointer; font:inherit; font-size:13px; font-weight:750; }
.theme-night .favorite-toast { color:#e5eeff; border-color:rgba(126,166,236,.22); background:rgba(12,29,62,.97); box-shadow:0 22px 58px rgba(0,9,32,.42); }
@keyframes favoriteFlash { 0% { transform:scale(1); } 55% { transform:scale(1.13) rotate(-5deg); } 100% { transform:scale(1); } }
@media(max-width:640px){.favorite-toast-root{right:14px;left:14px;bottom:14px}.favorite-toast{width:100%}}
@media(prefers-reduced-motion:reduce){.favorite-button,.favorite-toast{transition:none}.favorite-button.is-added-flash{animation:none}}