:root{color-scheme:light}*{box-sizing:border-box}body{margin:0;font-family:Segoe UI,Microsoft YaHei,sans-serif;background:#f5f6f8;color:#222}.wrap{max-width:520px;margin:0 auto;padding:24px 16px}h1{font-size:20px}h2{font-size:18px;margin:0 0 4px}p{margin:6px 0}.muted{color:#888;font-size:13px}.small{font-size:12px}.warn{color:#b45309;background:#fef3c7;border-radius:8px;padding:10px 12px;font-size:13px}button{padding:10px 18px;border:none;border-radius:8px;background:#3b82f6;color:#fff;font-size:14px;cursor:pointer;margin-top:12px}button:hover{filter:brightness(.96)}.zone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;border:2px dashed #c8ccd4;border-radius:14px;padding:40px 16px;margin:12px 0;cursor:pointer;background:#fff;text-align:center}.zone:hover{border-color:#93b4f8}.list{display:flex;flex-direction:column;gap:10px;margin:14px 0}.item{background:#fff;border-radius:10px;padding:10px 12px;box-shadow:0 1px 3px #0000000f}.item .row{display:flex;justify-content:space-between;gap:10px}.name{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bar{height:6px;background:#eef0f4;border-radius:3px;margin-top:8px;overflow:hidden}.fill{height:100%;border-radius:3px;transition:width .2s}