:root{
--bg:#070b14;--panel:#0e1524;--panel2:#111a2d;--text:#eef3ff;--muted:#8d9ab3;
--line:#202b41;--accent:#7c5cff;--accent2:#23d5ab;--danger:#ff5c73;--shadow:0 24px 80px #0008;
}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:radial-gradient(circle at 15% 0,#1b1940 0,transparent 35%),var(--bg);color:var(--text)}
button,input,textarea{font:inherit}button{cursor:pointer}.app{max-width:1180px;margin:auto;padding:34px 20px}
.topbar{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin-bottom:24px}.eyebrow{font-size:10px;letter-spacing:.18em;color:#8f7cff;font-weight:800}.topbar h1{font-size:36px;letter-spacing:-.04em;margin:7px 0}.topbar p{margin:0;color:var(--muted)}.top-actions{display:flex;gap:8px}.ghost,.secondary{border:1px solid var(--line);background:#ffffff06;color:var(--text);padding:10px 14px;border-radius:11px}.ghost:hover,.secondary:hover{background:#ffffff0d}.danger{color:#ff9aaa}
.grid{display:grid;grid-template-columns:1fr 1.35fr;gap:16px}.panel{background:linear-gradient(180deg,#ffffff04,#ffffff01),var(--panel);border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow);padding:20px}.upload-panel{grid-column:1}.editor-panel{grid-column:2;grid-row:1 / span 2}.list-panel{grid-column:1}.dropzone{border:1px dashed #394762;border-radius:16px;padding:38px 18px;text-align:center;background:#ffffff02;transition:.2s}.dropzone.active{border-color:var(--accent);background:#7c5cff12;transform:scale(1.01)}.drop-icon{width:54px;height:54px;display:grid;place-items:center;border-radius:16px;background:#7c5cff18;color:#a99bff;font-size:28px;margin:0 auto 14px}.dropzone h2{margin:0 0 7px;font-size:20px}.dropzone p,.dropzone small{color:var(--muted)}.dropzone small{display:block;margin-top:13px;font-size:11px}.file-label{display:inline-flex;margin-top:14px}
.primary{border:0;background:linear-gradient(135deg,var(--accent),#9b67ff);color:#fff;padding:11px 16px;border-radius:11px;font-weight:750;box-shadow:0 10px 30px #7c5cff33}.primary:hover{filter:brightness(1.08);transform:translateY(-1px)}.primary.small{padding:9px 12px;font-size:12px}
.file-label input{display:none}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}.stats div{background:#ffffff04;border:1px solid var(--line);border-radius:12px;padding:12px}.stats b{display:block;font-size:17px}.stats span{font-size:11px;color:var(--muted)}
.section-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.section-head h2{margin:5px 0 0;font-size:20px}.badge{font-size:10px;font-weight:800;padding:6px 9px;border:1px solid #ffffff14;border-radius:999px;color:#b8c4da;background:#ffffff05}.empty,.list-empty{color:var(--muted);padding:28px;text-align:center;border:1px dashed var(--line);border-radius:14px}
.preview-wrap{min-height:120px;display:grid;place-items:center;background:#070b14;border:1px solid var(--line);border-radius:15px;margin-bottom:16px;overflow:hidden}.preview-wrap img{max-width:100%;max-height:220px;object-fit:contain}.generic-preview{font-size:38px;font-weight:900;color:#303d57}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.form-grid label{font-size:11px;color:var(--muted);font-weight:700}.form-grid input,.form-grid textarea{display:block;width:100%;margin-top:6px;border:1px solid var(--line);background:#070c16;color:var(--text);border-radius:10px;padding:11px 12px;outline:none}.form-grid input:focus,.form-grid textarea:focus{border-color:#7661e9;box-shadow:0 0 0 3px #7c5cff18}.wide{grid-column:1/-1}.metadata-help{padding:12px;border:1px solid #25314a;background:#ffffff03;border-radius:12px;font-size:11px;color:var(--muted)}.metadata-help b{color:#dbe4f7}.metadata-help p{line-height:1.6;margin:6px 0 0}
.toolbar{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}.status{margin-top:12px;padding:10px;border-radius:10px;font-size:12px;display:none}.status.show{display:block}.status.ok{background:#23d5ab16;color:#72f0d2}.status.err{background:#ff5c7316;color:#ff9aaa}
.file-list{display:grid;gap:8px;max-height:390px;overflow:auto}.file-item{display:flex;align-items:center;gap:10px;padding:11px;border:1px solid var(--line);background:#ffffff02;border-radius:12px}.file-item.selected{border-color:#7661e9;background:#7c5cff0d}.file-main{min-width:0;flex:1}.file-main b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px}.file-main span{font-size:10px;color:var(--muted)}.file-item button{border:0;background:#ffffff08;color:#aeb9ce;border-radius:8px;padding:7px}.file-item button:hover{background:#ffffff12}
footer{display:flex;justify-content:space-between;color:#59677f;font-size:10px;padding:18px 2px}
@media(max-width:850px){.grid{grid-template-columns:1fr}.upload-panel,.editor-panel,.list-panel{grid-column:1;grid-row:auto}.topbar{flex-direction:column}.form-grid{grid-template-columns:1fr}.wide{grid-column:auto}}