@charset "UTF-8";
:root{color-scheme:light;--paper:#f3f3ed;--ink:#292e26;--line:#c8cbbe;--muted:#7b8072;--accent:#ddeb8b}
*{box-sizing:border-box;border-radius:0}
body{margin:0;background:var(--paper);color:var(--ink);font:14px/1.6 Arial,'PingFang SC','Microsoft YaHei',sans-serif}
main{width:min(640px,calc(100% - 40px));margin:clamp(60px,17vh,160px) auto 40px}
header{display:flex;align-items:center;justify-content:space-between;margin-bottom:25px}
.logo{font:900 44px/1 Arial,sans-serif;letter-spacing:-4px;color:var(--ink);text-decoration:none}
header>span{font-size:11px;color:var(--muted)}
.desk{padding:30px;background:#fdfdf8;border:1px solid #aeb5a2;border-top:3px solid var(--ink);box-shadow:3px 3px 0 #e0e3d6}
h1{margin:0 0 21px;font-size:25px;line-height:1.3;letter-spacing:1px}
.input-row{display:flex;gap:9px}
input,button{font:inherit;color:inherit}
input{width:100%;min-width:0;border:1px solid #a3ad94;background:#fff;padding:12px;font-size:13px;box-shadow:inset 1px 1px 0 #eceee7}
button{cursor:pointer;border:1px solid #8a977a;background:#f5f6ec;padding:9px 15px;font-size:12px;white-space:nowrap}
#resolve-button,.download{border-color:#404b35;background:var(--accent);font-weight:700}
button:hover{filter:brightness(.97)}
button:disabled{opacity:.6;cursor:wait}
button:focus-visible,input:focus-visible,a:focus-visible{outline:2px solid #69834e;outline-offset:3px}
.hint{font-size:11px;color:var(--muted);margin:13px 0 0}
#status{font-size:12px;color:#526645;margin:0;overflow-wrap:anywhere}
#status:not(:empty){margin-top:15px}
#status.error{color:#9d452f}
#result{margin-top:25px;padding-top:22px;border-top:1px solid var(--line)}
.track{display:flex;gap:14px;align-items:center}
.art{width:54px;height:54px;object-fit:cover;background:#e6ebda;border:1px solid #bcc6aa;display:grid;place-items:center;font:26px Arial;flex-shrink:0}
.info{min-width:0}
.info h2{font-size:16px;line-height:1.4;margin:0 0 4px;overflow-wrap:anywhere}
.info p{font-size:11px;color:var(--muted);margin:0}
.actions{display:flex;gap:9px;align-items:center;flex-wrap:wrap;margin-top:18px}
.external{font-size:11px;color:#69785a;text-underline-offset:3px;margin-left:3px}
.source-note{font-size:10px;color:var(--muted);margin:14px 0 0}
.progress{display:flex;align-items:center;gap:10px;margin-top:15px}
.progress input{padding:0;height:3px;box-shadow:none;accent-color:#677e4b}
.progress span{font:10px 'Courier New',monospace;white-space:nowrap;color:var(--muted)}
.embed{margin-top:16px;line-height:0}
.embed iframe{width:100%;height:352px;border:0}
footer{display:flex;justify-content:space-between;gap:10px;margin-top:18px;font-size:10px;color:#8a8f81}
footer>span:first-child{font-family:'Courier New',monospace}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
[hidden]{display:none!important}
@media(max-width:480px){main{margin-top:60px;width:calc(100% - 32px)}.desk{padding:22px 17px}.logo{font-size:39px}h1{font-size:23px}input{font-size:12px;padding:12px 9px}.input-row{gap:7px}#resolve-button{padding:10px 12px}.hint{font-size:10px}.info h2{font-size:15px}footer{font-size:9px}}
