*{box-sizing:border-box}body{margin:0;font-family:system-ui,"Noto Sans CJK SC","PingFang SC",sans-serif;background:#f4f1ea;color:#1f2937}
header{background:#7c2d12;color:#fff;padding:22px 28px 16px}h1{margin:0;font-size:28px}.sub{margin:6px 0 0;color:#fed7aa;font-size:15px}
nav{display:flex;gap:8px;padding:14px 28px 0;background:#7c2d12}nav button{border:0;padding:10px 18px;border-radius:10px 10px 0 0;background:#9a3412;color:#ffedd5;font-size:16px;cursor:pointer}
nav button.on{background:#f4f1ea;color:#7c2d12;font-weight:700}
main{max-width:860px;margin:0 auto;padding:22px 28px}.pane{display:none}.pane.on{display:block}
.drop{display:block;border:3px dashed #c2410c;border-radius:14px;padding:26px;text-align:center;background:#fff7ed;color:#9a3412;font-size:18px;cursor:pointer}
.drop input{display:none}
.files{list-style:none;padding:0;margin:16px 0}.files li{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #e7e5e4;border-radius:10px;padding:10px 14px;margin-bottom:8px;font-size:16px}
.files li .n{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.files li .meta{color:#78716c;font-size:14px}
.files li button{border:1px solid #d6d3d1;background:#fafaf9;border-radius:8px;width:34px;height:32px;cursor:pointer;font-size:15px}
.row{display:flex;align-items:center;gap:12px;margin:12px 0}.row label{width:90px;font-weight:600}.row input:not([type=range]){flex:1;font-size:17px;padding:9px 12px;border:1px solid #d6d3d1;border-radius:8px}
.row input[type=range]{flex:1}
.go{margin-top:8px;border:0;background:#c2410c;color:#fff;font-size:18px;font-weight:700;padding:12px 26px;border-radius:12px;cursor:pointer}.go:disabled{opacity:.5}
#msg{min-height:28px;margin:16px 0 0;font-size:17px}#msg.ok{color:#15803d;font-weight:700}#msg.err{color:#b91c1c;font-weight:700}
footer{text-align:center;color:#78716c;font-size:14px;padding:10px 0 30px}
@media (max-width:600px){nav{overflow-x:auto}nav button{padding:9px 12px;font-size:15px}main{padding:16px}.row{flex-wrap:wrap}.row label{width:auto}}