:root{--ctl-h:36px;--pad-x:14px;--radius:6px;--primary:#1f6feb;--primary-strong:#0969da}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;margin:0;background:#f6f7f9;color:#1f2328}
.container{max-width:1000px;margin:40px auto;padding:0 16px}
h1{font-size:22px;margin:0 0 16px}
.card{background:#fff;padding:16px;border-radius:8px;box-shadow:0 1px 2px rgba(0,0,0,.06);max-width:360px}
.field{margin-bottom:12px}
label{display:block;font-size:14px;margin-bottom:6px}
input[type=password],input[type=text]{width:100%;height:var(--ctl-h);padding:0 12px;border:1px solid #d0d7de;border-radius:var(--radius);outline:none;font-size:14px;line-height:var(--ctl-h);box-sizing:border-box;background:#fff}
button{height:var(--ctl-h);padding:0 var(--pad-x);border:1px solid var(--primary);background:var(--primary);color:#fff;border-radius:var(--radius);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-size:14px;line-height:var(--ctl-h)}
button:disabled{opacity:.6;cursor:not-allowed}
.btn,.btn-sec,.upload-btn{height:var(--ctl-h);padding:0 var(--pad-x);box-sizing:border-box;border-radius:var(--radius);display:inline-flex;align-items:center;justify-content:center;font-size:14px;line-height:1}
.btn{height:var(--ctl-h);padding:0 var(--pad-x);border:1px solid var(--primary);background:var(--primary);color:#fff;border-radius:var(--radius);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-size:14px;line-height:var(--ctl-h)}
.btn:hover{background:#1a6ad6;border-color:#1a6ad6}
.btn:active{background:#0f5cc0;border-color:#0f5cc0}
.btn:focus{outline:2px solid rgba(31,111,235,.35);outline-offset:1px}
.btn-sec{height:var(--ctl-h);padding:0 var(--pad-x);border:1px solid #d0d7de;background:#fff;color:#24292f;border-radius:var(--radius);display:inline-flex;align-items:center;justify-content:center}
.btn-sec:hover{background:#f6f8fa}
.btn-sec:active{background:#eef2f6}
.btn-sec:focus{outline:2px solid rgba(31,111,235,.25);outline-offset:1px}
.error{color:#d1242f;margin:8px 0}
.toolbar{display:flex;justify-content:space-between;align-items:center;margin:24px 0;flex-wrap:wrap;gap:10px}
.toolbar .left{display:flex;gap:10px;align-items:center}
.toolbar .right{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
#pathText{font-size:14px;color:#57606a}
.breadcrumb{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.breadcrumb .crumb{display:inline-flex;align-items:center;height:var(--ctl-h);padding:0 10px;border:1px solid #d0d7de;border-radius:999px;background:#fff;font-size:13px;color:#24292f;cursor:pointer}
.breadcrumb .sep{color:#8c959f}
.upload-btn{position:relative;gap:8px;border:1px solid #16a34a;background:linear-gradient(135deg,#22c55e 0%,#16a34a 100%);color:#fff;cursor:pointer;box-shadow:0 10px 30px -12px rgba(34,197,94,.5)}
.upload-btn input{position:absolute;inset:0;opacity:0;cursor:pointer}
.list{width:100%;border-collapse:collapse;background:#fff;border-radius:8px;overflow:hidden;box-shadow:0 1px 2px rgba(0,0,0,.06)}
.list th,.list td{text-align:left;padding:10px 14px;border-bottom:1px solid #d8dee4;font-size:14px;vertical-align:middle}
.list tbody tr{height:48px}
.list thead th{background:#f6f8fa;color:#24292f}
.list thead th.sortable{cursor:pointer;user-select:none}
.sort-indicator{display:inline-block;width:10px;margin-left:6px;color:#57606a}
.name-cell{display:flex;align-items:center;gap:8px}
.fi{width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center}
.list tbody tr:nth-child(even){background:#fcfcfd}
.list tbody tr:hover{background:#f6f8fa}
.item-name{cursor:pointer;color:#0969da}
.item-name:hover{text-decoration:underline}
.msg{margin:8px 0;color:#1f2328;font-size:14px;height:20px}
.tag{display:inline-block;padding:2px 6px;background:#ddf4ff;color:#0969da;border:1px solid #54aeff;border-radius:999px;font-size:12px}
.modal{position:fixed;inset:0;background:rgba(0,0,0,.3);display:flex;align-items:center;justify-content:center;z-index:30}
.hidden{display:none}
.modal .modal-content{background:#fff;padding:16px;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,.12);min-width:320px}
.modal input{width:100%;height:var(--ctl-h);padding:0 12px;border:1px solid #d0d7de;border-radius:var(--radius);margin:8px 0;box-sizing:border-box}
.modal .modal-actions{display:flex;gap:10px;justify-content:flex-end}
.uploads{margin-top:12px}
.upload-item{display:grid;grid-template-columns:214px 80px 260px 100px 78px 72px 140px;align-items:center;gap:10px;margin:6px 0}
.upload-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;color:#24292f}
.upload-size{width:80px;font-size:12px;color:#57606a}
.progress{height:8px;background:#eaeef2;border-radius:6px;overflow:hidden}
.progress>span{display:block;height:100%;background:#1f6feb;width:0%}
.speed{width:100px;font-size:12px;color:#57606a;text-align:right;white-space:nowrap}
.elapsed{width:78px;font-size:12px;color:#57606a;text-align:right;white-space:nowrap}
.status{width:72px;font-size:12px;color:#57606a;text-align:right;white-space:nowrap}
.status.ok{color:#1a7f37}
.status.fail{color:#d1242f}
.upload-actions{display:flex;justify-content:flex-end;gap:8px}
.upload-actions .btn-sec{height:28px;padding:0 12px;font-size:12px}
.upload-item.dim{opacity:.6}
.drop-overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(13,17,23,.4);z-index:20;pointer-events:none;opacity:0;transition:opacity .15s ease}
.drop-overlay.active{opacity:1}
.drop-overlay .drop-box{border:2px dashed #54aeff;color:#ddf4ff;padding:32px 48px;border-radius:12px;font-size:18px;background:rgba(13,17,23,.6)}
:root{--radius:8px;--primary:#3b82f6;--primary-strong:#2563eb;--bg0:#0b1220;--bg1:#0f172a;--panel:rgba(15,23,42,.6);--border:rgba(148,163,184,.2);--text:#e6edf5;--muted:#9aa4b2;--accent1:#3b82f6;--accent2:#8b5cf6}
body{background:radial-gradient(1200px circle at 20% 0%,#0b1220 0,#0a0f1e 50%,#0a0e1a 100%);color:var(--text)}
h1{color:var(--text)}
.card{background:var(--panel);border:1px solid var(--border);border-radius:12px;box-shadow:0 6px 24px rgba(16,24,40,.35);backdrop-filter:blur(8px)}
label{color:var(--muted)}
input[type=password],input[type=text]{border:1px solid var(--border);background:var(--bg1);color:var(--text);transition:border-color .15s ease,box-shadow .15s ease}
input[type=password]:focus,input[type=text]:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(59,130,246,.25)}
button{border:1px solid var(--primary-strong);background:linear-gradient(135deg,var(--primary) 0%,#4f46e5 100%);color:#fff;box-shadow:0 10px 30px -12px rgba(59,130,246,.6),inset 0 0 0 1px rgba(255,255,255,.05);transition:transform .08s ease,box-shadow .2s ease,filter .2s ease}
button:hover{filter:saturate(1.15) brightness(1.05)}
button:active{transform:translateY(1px)}
.btn,.btn-sec,.upload-btn{border-radius:10px;letter-spacing:.2px}
.btn{border:1px solid var(--primary-strong);background:linear-gradient(135deg,var(--primary) 0%,var(--accent2) 100%);color:#fff;box-shadow:0 10px 30px -12px rgba(59,130,246,.6),inset 0 0 0 1px rgba(255,255,255,.06)}
.btn-download{border-color:#0ea5e9;background:linear-gradient(135deg,#38bdf8 0%,#3b82f6 100%);box-shadow:0 10px 30px -12px rgba(14,165,233,.55)}
.btn-del{border-color:#ef4444;background:linear-gradient(135deg,#ef4444 0%,#dc2626 100%);box-shadow:0 10px 30px -12px rgba(239,68,68,.55)}
.btn:hover{filter:saturate(1.1) brightness(1.05)}
.btn:active{transform:translateY(1px)}
.btn:focus{outline:2px solid rgba(59,130,246,.35);outline-offset:1px}
.btn-sec{border:1px solid var(--border);background:rgba(255,255,255,.04);color:var(--text);box-shadow:inset 0 0 0 1px rgba(255,255,255,.03)}
.btn-sec:hover{background:rgba(255,255,255,.06)}
.btn-sec:active{transform:translateY(1px)}
.btn-sec:focus{outline:2px solid rgba(59,130,246,.25);outline-offset:1px}
#pathText{color:var(--muted)}
.breadcrumb .crumb{border:1px solid var(--border);background:rgba(255,255,255,.06);color:var(--text);backdrop-filter:blur(6px);padding:0 12px}
.sort-indicator{color:var(--muted)}
.list{background:rgba(255,255,255,.04);border-radius:12px;border:1px solid var(--border);box-shadow:0 10px 30px -18px rgba(16,24,40,.6);backdrop-filter:blur(6px)}
.list th,.list td{border-bottom:1px solid rgba(148,163,184,.15);color:var(--text);vertical-align:middle}
.list tbody tr{height:48px}
.list thead th{background:rgba(255,255,255,.06);color:var(--text)}
.list tbody tr:nth-child(even){background:rgba(255,255,255,.02)}
.list tbody tr:hover{background:rgba(59,130,246,.08)}
.item-name{color:#93c5fd}
.fi{color:#a3b8ff}
.msg{color:var(--muted)}
.modal{background:rgba(0,0,0,.45)}
.modal .modal-content{background:var(--panel);border:1px solid var(--border);border-radius:12px;box-shadow:0 10px 30px rgba(16,24,40,.5);backdrop-filter:blur(8px);color:var(--text)}
.modal input{border:1px solid var(--border);background:var(--bg1);color:var(--text)}
.progress{background:rgba(255,255,255,.08);border-radius:999px}
.progress>span{background:linear-gradient(90deg,#60a5fa,#8b5cf6)}
.status{color:var(--muted)}
.upload-name{color:var(--text)}
.upload-size{color:var(--muted)}
.elapsed{color:var(--muted)}
.upload-actions .btn-sec{background:rgba(255,255,255,.06);border:1px solid var(--border);color:var(--text)}
.drop-overlay{background:rgba(5,10,20,.55)}
.drop-overlay .drop-box{border-color:#60a5fa;color:#e6f0ff;background:rgba(10,15,30,.7);backdrop-filter:blur(8px)}
.upload-btn{border:1px solid var(--primary-strong);background:linear-gradient(135deg,var(--primary-strong) 0%,var(--accent2) 100%);color:#fff;box-shadow:0 10px 30px -12px rgba(59,130,246,.6)}
.container.auth{min-height:100vh;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:0 16px}
.card .card-title{font-size:18px;font-weight:600;text-align:center;margin-bottom:12px;letter-spacing:.3px;color:var(--text)}
.action-cell{display:flex;justify-content:flex-end;align-items:center;gap:8px;white-space:nowrap}
.action-cell .btn-copy{height:32px;padding:0 12px;font-size:12px;border:1px solid var(--border);background:rgba(255,255,255,.06);color:var(--text);border-radius:8px;display:inline-flex;align-items:center}
.action-cell .btn-copy:hover{background:rgba(255,255,255,.1)}
.action-cell .btn-copy + .btn-copy{margin-left:0}
.action-cell .btn-download{border-color:#0ea5e9;background:rgba(56,189,248,.12);color:#93c5fd}
.action-cell .btn-del{border-color:#b91c1c;background:rgba(244,63,94,.12);color:#fecaca}
.action-cell .btn-del:hover{background:rgba(244,63,94,.18)}
