:root{--bg:#0f1222;--card:#171a2b;--muted:#a5adcb;--text:#e8ecff;--primary:#7c9cff;--primary-2:#8ef1ff;--danger:#ff6767}*{box-sizing:border-box}html,body,#root{height:100%}body{color:var(--text);background:linear-gradient(135deg,#0e101f 0%,#111329 60%,#0d1428 100%);margin:0;font-family:ui-sans-serif,system-ui,Segoe UI,Roboto,Helvetica,Arial,Apple Color Emoji,Segoe UI Emoji}.app{flex-direction:column;min-height:100%;display:flex}.header{text-align:center;padding:32px 16px}.header h1{letter-spacing:.02em;margin:0 0 6px;font-size:28px}.header p{color:var(--muted);margin:0}.container{grid-template-columns:2fr 1fr;gap:20px;width:min(1100px,92vw);margin:0 auto 56px;display:grid}@media (width<=960px){.container{grid-template-columns:1fr}}.panel{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#171a2bb3;border:1px solid #ffffff0f;border-radius:16px;padding:20px}.tips{background:#171a2b80;border:1px solid #ffffff0f;border-radius:16px;height:max-content;padding:16px}.tips h3{margin:0 0 8px}.tips ul{color:var(--muted);margin:0 0 0 18px}.mode{gap:10px;margin-bottom:16px;display:flex}.mode-item{cursor:pointer;color:var(--muted);background:#0f1220;border:1px solid #ffffff14;border-radius:999px;align-items:center;gap:8px;padding:8px 12px;display:flex}.mode-item.active{color:var(--text);border-color:#7c9cff80;box-shadow:0 0 0 3px #7c9cff1a}.mode-item input{display:none}.dropzone{cursor:pointer;background:#ffffff05;border:2px dashed #ffffff1f;border-radius:14px;padding:22px;transition:all .2s}.dropzone:hover{background:#7c9cff0f;border-color:#7c9cff80}.dropzone-inner{min-height:120px;color:var(--muted);justify-content:center;align-items:center;gap:16px;display:flex}.dropzone .icon{font-size:24px}.dropzone .sub{color:var(--muted);margin-top:6px;font-size:12px}.list{flex-direction:column;gap:10px;max-height:380px;margin:16px 0 0;padding:0;list-style:none;display:flex;overflow:auto}.list-item{background:#0e1120;border:1px solid #ffffff0f;border-radius:12px;grid-template-columns:72px minmax(0,1fr) auto;align-items:center;gap:12px;padding:8px;display:grid}.thumb{object-fit:cover;border:1px solid #ffffff12;border-radius:8px;width:72px;height:72px}.meta{min-width:0}.meta .name{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.meta .sub{color:var(--muted);margin-top:4px;font-size:12px}.actions{flex-wrap:nowrap;gap:8px;display:flex}.btn{background:linear-gradient(90deg,var(--primary),var(--primary-2));color:#0a0d1a;cursor:pointer;border:none;border-radius:10px;padding:10px 14px;font-weight:700}.btn:disabled{opacity:.6;cursor:not-allowed}.btn.ghost{color:var(--text);background:0 0;border:1px solid #ffffff24}.btn.ghost.danger{color:#ffb3b3;border-color:#ff676780}.toolbar{justify-content:flex-end;gap:10px;margin-top:14px;display:flex}.footer{text-align:center;color:var(--muted);margin-top:auto;padding:20px}html[data-theme=light]{--bg:#f6f7fb;--card:#fff;--muted:#62718a;--text:#0a0d1a;--primary:#7c9cff;--primary-2:#36c3ff;--danger:#ff4d4d}html[data-theme=light] body{color:var(--text);background:linear-gradient(135deg,#f7f9fc 0%,#f3f6fb 60%,#f0f4fb 100%)}html[data-theme=light] .panel{background:#ffffffdb;border:1px solid #0000000f}html[data-theme=light] .tips{background:#ffffffc7;border:1px solid #0000000f}html[data-theme=light] .mode-item{color:var(--muted);background:#eef2fb;border:1px solid #00000014}html[data-theme=light] .mode-item.active{color:var(--text);border-color:#7c9cff80;box-shadow:0 0 0 3px #7c9cff26}html[data-theme=light] .dropzone{background:#00000005;border-color:#0000001f}html[data-theme=light] .dropzone:hover{background:#7c9cff1f;border-color:#7c9cff80}html[data-theme=light] .list-item{background:#fff;border:1px solid #00000014}html[data-theme=light] .thumb{border:1px solid #0000001a}html[data-theme=light] .btn.ghost{color:var(--text);border:1px solid #00000029}html[data-theme=light] .btn.ghost.danger{color:#c14949;border-color:#ff67678c}