/* Favorite and My list on the anime page. Site tokens, so dark and light follow the theme. */
.mg-fav.is-on{color:#E5575F; background:color-mix(in srgb, #E5575F 12%, transparent);}
.mg-mylist.is-on{color:var(--blue-dark, var(--blue)); background:var(--blue-tint);}
.mg-fav:disabled{opacity:.7; cursor:default;}

.al-lock{overflow:hidden;}
.al-dlg{position:fixed; inset:0; z-index:100; display:grid; place-items:center; padding:16px; background:rgba(0,0,0,.55); overflow-y:auto;}
.al-dlg[hidden]{display:none;}
.al-box{width:min(440px,100%); display:grid; gap:16px; padding:20px; border-radius:18px; background:var(--paper); border:1px solid color-mix(in srgb, var(--navy) 12%, transparent); box-shadow:0 20px 60px rgba(0,0,0,.4); color:var(--navy);}
.al-h{margin:0; font:800 20px/1.25 'Sora','Inter',sans-serif;}
.al-f{border:0; margin:0; padding:0; min-width:0; display:grid; gap:8px;}
.al-l{font:600 12px/1.2 'Inter',sans-serif; color:var(--navy-soft); padding:0;}
.al-chips{display:flex; flex-wrap:wrap; gap:8px;}
.al-chip{position:relative; cursor:pointer;}
.al-chip input{position:absolute; opacity:0; inset:0; margin:0; cursor:pointer;}
.al-chip span{display:block; padding:8px 14px; border-radius:999px; border:1px solid color-mix(in srgb, var(--navy) 14%, transparent); font:600 13px/1.2 'Inter',sans-serif; color:var(--navy-soft); transition:background .15s, color .15s, border-color .15s;}
.al-chip:hover span{color:var(--navy);}
.al-chip input:checked + span{background:var(--blue-tint); border-color:var(--blue); color:var(--blue);}
.al-chip input:focus-visible + span{outline:2px solid var(--blue); outline-offset:2px;}
.al-row{display:grid; gap:12px;}
.al-dates{grid-template-columns:1fr 1fr;}
.al-g{display:grid; gap:6px; min-width:0;}
.al-g input{width:100%; min-width:0; padding:10px 12px; border-radius:12px; border:1px solid color-mix(in srgb, var(--navy) 14%, transparent); background:color-mix(in srgb, var(--navy) 4%, transparent); color:var(--navy); font:500 14px/1.2 'Inter',sans-serif; color-scheme:light dark;}
.al-g input:focus-visible{outline:2px solid var(--blue); outline-offset:1px;}
.al-num{display:flex; align-items:center; gap:10px;}
.al-num input{width:110px;}
.al-num small{color:var(--navy-soft); font:500 13px/1.2 'Inter',sans-serif;}
.al-err{margin:0; color:#E5575F; font:600 13px/1.4 'Inter',sans-serif;}
.al-acts{display:flex; flex-wrap:wrap; gap:8px; align-items:center;}
.al-rm{margin-inline-start:auto; padding:10px 12px; border:0; border-radius:10px; background:transparent; color:#E5575F; font:700 13px/1 'Inter',sans-serif; cursor:pointer;}
.al-rm:hover{background:color-mix(in srgb, #E5575F 12%, transparent);}
.al-rm[hidden]{display:none;}
html[lang="ar"] .al-box *,html[lang="ja"] .al-box *{font-family:inherit;}
.al-toast{position:fixed; inset-inline:16px; bottom:84px; margin-inline:auto; width:fit-content; max-width:min(420px,100% - 32px); padding:11px 18px; border-radius:999px; background:var(--navy); color:var(--paper); font:600 14px/1.3 'Inter',sans-serif; text-align:center; opacity:0; transform:translateY(8px); transition:opacity .25s, transform .25s; z-index:110; pointer-events:none;}
.al-toast.is-in{opacity:1; transform:none;}
@media (max-width:420px){ .al-dates{grid-template-columns:1fr;} }
.mg-tools{display:flex; flex-wrap:wrap; gap:8px;}
