html{min-width:320px;min-height:100%}body{background:radial-gradient(circle at 0 0,#6d4aff 0%,#0000 35%),#10101a;min-width:320px;min-height:100vh;margin:0}:root{color:#f7f7fb;font-synthesis:none;text-rendering:optimizelegibility;background:#0f0f18;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{color:#f7f7fb;background:radial-gradient(circle at top,#8b5cf614,#0000 34rem),#0f0f18;min-width:320px;min-height:100vh;margin:0}button,input,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.5}.page{width:100%;min-height:100vh;padding:48px 20px}.card{background:#171722;border:1px solid #2c2d39;border-radius:22px;width:min(100%,780px);margin:0 auto;padding:38px}.brand{color:#9d7cff;letter-spacing:.14em;margin-bottom:10px;font-size:.82rem;font-weight:800;display:inline-block}h1{margin:0;font-size:clamp(2rem,5vw,3rem);line-height:1.05}.description{color:#b9bac8;max-width:620px;margin:14px 0 26px;line-height:1.6}.status{border:1px solid;border-radius:12px;margin-bottom:22px;padding:12px 14px;font-size:.94rem;font-weight:700}.statusSuccess{color:#a8f0c8;background:#3dbe781a;border-color:#3dbe784d}.statusError{color:#ffb4b4;background:#e74c3c1a;border-color:#e74c3c59}label{margin:18px 0 8px;font-size:.94rem;font-weight:700;display:block}input,textarea{color:#f7f7fb;background:#20212d;border:1px solid #353644;border-radius:12px;outline:none;width:100%;padding:13px 14px;transition:border-color .2s,box-shadow .2s}textarea{resize:vertical}input::placeholder,textarea::placeholder{color:#7f8190}input:focus,textarea:focus{border-color:#8f6cff;box-shadow:0 0 0 3px #8f6cff24}input:disabled,textarea:disabled{opacity:.62;cursor:not-allowed}.uploadArea{text-align:center;background:#1d1e29;border:1px dashed #555767;border-radius:18px;flex-direction:column;align-items:center;gap:10px;margin-top:28px;padding:34px 24px;display:flex}.uploadArea strong{font-size:1.08rem}.uploadArea span{color:#a9aabb;font-size:.92rem}.uploadArea button,.rowActions button,.historyButton,.clearHistoryButton{color:#fff;background:#8f6cff;border:1px solid #40346c;border-radius:10px;min-height:42px;padding:10px 15px;font-weight:800;transition:opacity .2s,transform .2s,border-color .2s,background .2s}.uploadArea button{margin-top:8px}.uploadArea button:hover,.rowActions button:hover,.historyButton:hover,.clearHistoryButton:hover{opacity:.9}.uploadArea button:active,.rowActions button:active,.historyButton:active,.clearHistoryButton:active{transform:translateY(1px)}.uploadQueue{margin-top:34px}.queueHeader{justify-content:space-between;align-items:flex-start;gap:18px;margin-bottom:16px;display:flex}.queueHeader>div{min-width:0}.queueHeader strong{font-size:1.12rem;display:block}.queueHeader span{color:#b8b9c7;margin-top:4px;font-size:.91rem;display:block}.uploadRows{flex-direction:column;gap:14px;display:flex}.uploadRow{background:#22232f;border:1px solid #3a3b49;border-radius:17px;justify-content:space-between;align-items:flex-start;gap:18px;padding:20px;transition:border-color .2s,background .2s;display:flex}.fileMain{flex:1;min-width:0}.fileTitle{justify-content:space-between;align-items:center;gap:16px;display:flex}.fileTitle strong{overflow-wrap:anywhere;min-width:0;font-size:1rem}.fileTitle span{color:#c0c1ce;flex:none;font-size:.9rem}.rowProgress{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:14px;margin-top:17px;display:grid}.progressBar{background:#343543;border-radius:999px;height:12px;overflow:hidden}.progressFill{border-radius:inherit;background:#8f6cff;width:0;height:100%;transition:width .25s}.percentage{text-align:right;min-width:58px;font-size:1.05rem}.fileMeta{color:#b9bac8;flex-wrap:wrap;gap:10px 22px;margin-top:14px;font-size:.9rem;display:flex}.rowActions{flex-wrap:wrap;flex:none;gap:8px;display:flex}.rowActions .dangerButton{color:#ffb1b1;background:#e74c3c1f;border-color:#e74c3c47}.uploadRow-queued,.uploadRow-uploading,.uploadRow-paused,.uploadRow-processing,.uploadRow-incoming{border-color:#3a3b49}.uploadRow-processing .progressFill,.uploadRow-incoming .progressFill{background:#d0a65a}.uploadRow-processing .fileMeta,.uploadRow-incoming .fileMeta{color:#f1d59a}.uploadRow-success,.uploadRow-completed{background:#32be6e13;border-color:#32be6e61}.uploadRow-success .progressFill,.uploadRow-completed .progressFill{background:#4ecb84}.uploadRow-success .fileMeta,.uploadRow-completed .fileMeta{color:#a8efc5}.uploadRow-deliveryError,.uploadRow-failed,.uploadRow-error{background:#e74c3c12;border-color:#e74c3c66}.uploadRow-deliveryError .progressFill,.uploadRow-failed .progressFill,.uploadRow-error .progressFill{background:#e35d5d}.uploadRow-deliveryError .fileMeta,.uploadRow-failed .fileMeta,.uploadRow-error .fileMeta{color:#ffb0b0}.historyToolbar{border-top:1px solid #2f303b;justify-content:center;margin-top:34px;padding-top:24px;display:flex}.historyButton{color:#efeff7;background:#252635;border-color:#444657;min-width:190px}.historyPanel{background:#1c1d28;border:1px solid #343643;border-radius:18px;margin-top:22px;padding:22px}.historyPanelHeader{justify-content:space-between;align-items:flex-start;gap:18px;display:flex}.historyPanelHeader>div{min-width:0}.historyPanelHeader strong{font-size:1.15rem;display:block}.historyPanelHeader span{color:#aaaebb;margin-top:4px;font-size:.9rem;display:block}.clearHistoryButton{color:#ffb7b7;background:#e74c3c1f;border-color:#e74c3c59;flex:none}.historyEmpty{color:#9fa1ae;text-align:center;border:1px dashed #3c3e4b;border-radius:14px;margin-top:20px;padding:24px}.historyGroup{margin-top:24px}.historyGroupTitle{justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;display:flex}.historyGroupTitle strong{font-size:1rem}.historyGroupTitle span{text-align:center;background:#2b2d39;border-radius:999px;min-width:30px;padding:4px 8px;font-size:.82rem;font-weight:800}.historyGroupTitleSuccess{color:#a8efc5}.historyGroupTitleError{color:#ffb0b0}@media (width<=720px){.page{padding:24px 12px}.card{border-radius:18px;padding:24px 18px}.queueHeader,.uploadRow,.historyPanelHeader{flex-direction:column}.queueHeader,.historyPanelHeader{align-items:stretch}.uploadRow{gap:14px}.rowActions{width:100%}.rowActions button{flex:1}.clearHistoryButton{width:100%}}@media (width<=480px){.fileTitle{flex-direction:column;align-items:flex-start;gap:6px}.rowProgress{grid-template-columns:1fr}.percentage{text-align:left;min-width:auto}.fileMeta{flex-direction:column;gap:6px}.historyButton{width:100%}}
