:root{--bg:#0f1115;--fg:#e8eaed;--muted:#9aa0a6;--card:#181b21;--line:#2a2f38;--accent:#4f8cff;--danger:#e5484d;--warn:#f5a524}
@media (prefers-color-scheme: light){:root{--bg:#f6f7f9;--fg:#15171a;--muted:#5f6670;--card:#fff;--line:#d9dde3}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font:16px/1.5 system-ui,sans-serif}
.top{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--line)}
nav{display:flex;flex-wrap:wrap;gap:6px}
main{max-width:760px;margin:0 auto;padding:16px}
h1{font-size:1.4rem;margin:.2em 0 .6em}
button{background:var(--accent);color:#fff;border:0;border-radius:6px;padding:10px 14px;font:inherit;cursor:pointer;min-height:44px}
button.ghost{background:transparent;color:var(--fg);border:1px solid var(--line)}
button.danger{background:var(--danger)}
button:disabled{opacity:.5;cursor:not-allowed}
nav button{padding:6px 10px;min-height:36px}
input,select{display:block;width:100%;margin-top:4px;padding:10px;font:inherit;color:inherit;background:var(--card);border:1px solid var(--line);border-radius:6px;min-height:44px}
label{display:block;margin:12px 0}
form{margin:12px 0}
a{color:var(--accent)}
.muted{color:var(--muted)}
.warn{color:var(--warn)}
.state{font-size:1.15rem;font-weight:600}
.row{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end}
.row label{flex:1 1 140px;margin:0}
#notice{padding:10px 14px;border-radius:6px;background:var(--card);border:1px solid var(--line);margin-bottom:12px}
#notice.error{border-color:var(--danger)}
ul.plain{list-style:none;padding:0}
ul.cards{list-style:none;padding:0;display:grid;gap:10px}
ul.cards li{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:12px}
.badge{display:inline-block;padding:1px 8px;border-radius:99px;font-size:.8rem;border:1px solid var(--line)}
.badge.verified{border-color:#30a46c;color:#30a46c}
.badge.playable{border-color:var(--warn);color:var(--warn)}
dl{display:grid;grid-template-columns:max-content 1fr;gap:4px 14px}
dt{color:var(--muted)} dd{margin:0}
code{background:var(--card);padding:2px 6px;border-radius:4px;border:1px solid var(--line)}
.scroll{overflow-x:auto}
table{border-collapse:collapse;width:100%}
th,td{padding:8px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}
[hidden]{display:none!important}