:root{--bg:#0f0f12;--card:#1c1c22;--card2:#26262e;--text:#f2f2f5;--muted:#a4a4b2;--red:#d62828;--red2:#9d1c1c;--ok:#2e9e5b;--warn:#d6a028;--r:14px}
@media(prefers-color-scheme:light){:root{--bg:#f6f6f8;--card:#fff;--card2:#eceef2;--text:#17171c;--muted:#5c5c6a}}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.5 system-ui,-apple-system,"Segoe UI",Tahoma,sans-serif;padding-bottom:110px}
a{color:inherit}
header.top{display:flex;align-items:center;gap:12px;padding:14px 16px;max-width:1000px;margin:0 auto}
.logo{width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,var(--red2),var(--red));display:grid;place-items:center;color:#fff;font-weight:800}
h1{font-size:20px;margin:0}h1 small{display:block;font-size:12px;font-weight:400;color:var(--muted)}
main{max-width:1000px;margin:0 auto;padding:0 16px}
.bar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:8px 0 14px}
input,select,textarea,button{font:inherit;color:inherit}
input[type=search],input[type=text],input[type=url],input[type=password],input[type=date],select,textarea{width:100%;background:var(--card);border:1px solid var(--card2);border-radius:10px;padding:10px 12px;outline:none}
input:focus,select:focus,textarea:focus{border-color:var(--red)}
.chips{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;margin-bottom:12px}
.chip{background:var(--card);border:1px solid var(--card2);padding:6px 14px;border-radius:999px;cursor:pointer;white-space:nowrap}
.chip[aria-pressed=true]{background:var(--red);border-color:var(--red);color:#fff}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.card{background:var(--card);border-radius:var(--r);padding:12px;text-align:center;cursor:pointer;border:2px solid transparent;position:relative}
.card:hover{background:var(--card2)}.card.on{border-color:var(--red)}
.card .name{font-weight:700;margin-top:8px}.card .sub{font-size:12px;color:var(--muted)}
.cover{width:72px;height:72px;border-radius:16px;margin:0 auto;background:linear-gradient(135deg,var(--red2),var(--red));display:grid;place-items:center;color:#fff;font-weight:800;font-size:22px;overflow:hidden}
.cover img{width:100%;height:100%;object-fit:contain;background:#fff}
.fav{position:absolute;top:6px;inset-inline-start:8px;background:none;border:0;font-size:20px;cursor:pointer;color:var(--muted)}
.fav.on{color:#f5c518}
.player{position:fixed;bottom:0;inset-inline:0;background:var(--card);border-top:1px solid var(--card2);padding:10px 16px;display:flex;align-items:center;gap:12px;z-index:5}
.player .meta{flex:1;min-width:0}.player .t{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player .s{font-size:12px;color:var(--muted)}
.btn{background:var(--red);border:0;color:#fff;border-radius:10px;padding:9px 16px;cursor:pointer;font-weight:600}
.btn.sec{background:var(--card2);color:var(--text)}.btn.danger{background:#7a1111}.btn.sm{padding:5px 10px;font-size:13px}
.btn:disabled{opacity:.5;cursor:default}
.round{width:48px;height:48px;border-radius:50%;padding:0;font-size:20px}
.player select{width:auto;padding:6px}.player input[type=range]{width:90px}
.msg{background:var(--card);border-radius:10px;padding:12px;margin:10px 0}
.msg.err{border:1px solid var(--red)}
footer{max-width:1000px;margin:24px auto;padding:0 16px;color:var(--muted);font-size:13px}
/* admin */
table{width:100%;border-collapse:collapse;background:var(--card);border-radius:var(--r);overflow:hidden}
th,td{padding:8px 10px;text-align:start;border-bottom:1px solid var(--card2);font-size:14px;vertical-align:middle}
th{background:var(--card2);font-size:12px;color:var(--muted)}
.tw{overflow-x:auto}.row-actions{display:flex;gap:4px;flex-wrap:wrap}
.dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-inline-end:6px;background:var(--muted)}
.dot.verified{background:var(--ok)}.dot.pending{background:var(--warn)}.dot.unavailable{background:var(--red)}
.thumb{width:36px;height:36px;border-radius:8px;object-fit:contain;background:#fff;display:block}
dialog{background:var(--bg);color:var(--text);border:1px solid var(--card2);border-radius:var(--r);padding:16px;width:min(560px,94vw);max-height:92vh;overflow:auto}
dialog::backdrop{background:rgba(0,0,0,.6)}
label{display:block;font-size:13px;color:var(--muted);margin:10px 0 4px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.login{max-width:360px;margin:60px auto}
.toast{position:fixed;top:14px;inset-inline:14px;margin:auto;max-width:420px;background:var(--card);border:1px solid var(--card2);border-radius:10px;padding:10px 14px;z-index:20}
@media(max-width:520px){.two{grid-template-columns:1fr}.player input[type=range]{display:none}}
[hidden]{display:none!important}