:root{--bg:#f4f6fa;--card:#fff;--text:#1b2433;--muted:#6b7587;--line:#e3e8f0;--accent:#2563eb;--warn:#b45309;--warnbg:#fef3c7;--err:#b91c1c;--errbg:#fee2e2;--ok:#166534;--okbg:#dcfce7}
@media(prefers-color-scheme:dark){:root{--bg:#0f1520;--card:#182030;--text:#e8edf5;--muted:#93a0b5;--line:#2a3447;--accent:#60a5fa;--warn:#fcd34d;--warnbg:#3b2f0b;--err:#fca5a5;--errbg:#3f1515;--ok:#86efac;--okbg:#10301c}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.5 -apple-system,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif}
.wrap{max-width:1000px;margin:0 auto;padding:20px 14px 40px}
h1{margin:4px 0 0;font-size:22px}.sub{margin:0 0 10px;color:var(--muted);font-size:14px}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px;margin-bottom:14px}
input,select,button{font:inherit;color:var(--text);background:var(--card);border:1px solid var(--line);border-radius:10px;padding:10px 12px;min-width:0}
input:focus,select:focus{outline:2px solid var(--accent);outline-offset:-1px}
button{cursor:pointer;background:var(--accent);color:#fff;border-color:var(--accent)}
button.ghost{background:var(--card);color:var(--accent)}
button:disabled{opacity:.6;cursor:wait}
.status{font-size:13px;margin-bottom:14px;display:grid;gap:6px}
.status div{padding:8px 12px;border-radius:10px}
.status .info{background:var(--card);border:1px solid var(--line);color:var(--muted)}
.status .warn{background:var(--warnbg);color:var(--warn)}
.status .err{background:var(--errbg);color:var(--err)}
.toolbar{display:flex;gap:10px;margin-bottom:6px}#search{flex:1}
.list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;column-gap:28px}
.row{display:grid;grid-template-columns:minmax(0,1fr) minmax(110px,46%);gap:10px;align-items:center;padding:6px 4px;border-top:1px solid var(--line)}
.row:nth-child(-n+2){border-top:0}.row[hidden]{display:none}
.id{display:flex;align-items:center;gap:10px;min-width:0}
.flag{font-size:22px;line-height:1}
.code{font-weight:700}.name{color:var(--muted);font-size:13px}
.row.cur .code{color:var(--accent)}
.row input{width:100%;text-align:right;font-variant-numeric:tabular-nums}
.row input:disabled{background:transparent;border-style:dashed;color:var(--muted)}
.empty{text-align:center;color:var(--muted)}
footer{text-align:center;color:var(--muted);font-size:13px;margin-top:20px}

@media(max-width:700px){.list{grid-template-columns:1fr}.row:nth-child(2){border-top:1px solid var(--line)}}