:root{
  --bg:#0b0d12; --panel:#12151d; --line:#242a38; --text:#e7ecf5; --dim:#9aa6bd;
  --accent:#7c5cff; --accent2:#22d3a6; --danger:#ff5d6c; --radius:14px;
}
*{box-sizing:border-box}
body{margin:0;font:15px/1.5 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--text)}
a{color:var(--accent2);text-decoration:none}
h1,h2,h3{margin:0 0 .6em;line-height:1.2}
.hidden{display:none!important}
.k{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:9px;
   background:linear-gradient(135deg,var(--accent),var(--accent2));color:#0b0d12;font-weight:800;margin-right:8px}

/* auth */
body.auth{display:grid;place-items:center;min-height:100vh;padding:24px}
.card{width:100%;max-width:420px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:28px}
.card h1{font-size:22px;display:flex;align-items:center}
.sub{color:var(--dim);margin:.2em 0 1.2em;font-size:14px}
.tabs{display:flex;gap:6px;background:#0e1118;border:1px solid var(--line);border-radius:11px;padding:4px;margin-bottom:16px}
.tab{flex:1;background:none;border:0;color:var(--dim);padding:9px;border-radius:8px;cursor:pointer;font:inherit}
.tab.active{background:var(--accent);color:#fff}
.pane{display:flex;flex-direction:column;gap:12px}
label{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--dim)}
input{background:#0e1118;border:1px solid var(--line);color:var(--text);padding:11px 12px;border-radius:10px;font:inherit}
input:focus{outline:2px solid rgba(124,92,255,.45);border-color:var(--accent)}
button{font:inherit;cursor:pointer}
.primary{background:var(--accent);color:#fff;border:0;padding:12px;border-radius:10px;font-weight:600;text-align:center;display:block}
.primary:hover{filter:brightness(1.08)}
.ghost{background:#0e1118;border:1px solid var(--line);color:var(--text);padding:11px;border-radius:10px;text-align:center;display:block}
.ghost:hover{border-color:var(--accent)}
.small{padding:7px 12px;font-size:13px;display:inline-block}
.wide{width:100%;margin-bottom:8px}
.msg{min-height:20px;font-size:13px;color:var(--dim);margin-bottom:8px;word-break:break-word}
.msg.err{color:var(--danger)}
.msg.ok{color:var(--accent2)}
.fine{color:var(--dim);font-size:12px;margin:0}

/* app */
body.app{min-height:100vh}
.top{display:flex;align-items:center;gap:12px;padding:12px 18px;border-bottom:1px solid var(--line);background:var(--panel);position:sticky;top:0;z-index:5}
.brand{font-weight:700;display:flex;align-items:center}
.spacer{flex:1}
.credits{color:var(--accent2);font-size:14px;font-variant-numeric:tabular-nums}
.layout{display:grid;grid-template-columns:250px 1fr;min-height:calc(100vh - 57px)}
.side{border-right:1px solid var(--line);padding:14px;background:#0e1118}
.crumbs{font-size:13px;color:var(--dim);margin:12px 0 6px;display:flex;flex-wrap:wrap;gap:4px}
.crumbs a{color:var(--dim)}
.crumbs a:hover{color:var(--text)}
.folders{list-style:none;padding:0;margin:0}
.folders li{padding:8px 10px;border-radius:8px;cursor:pointer;color:var(--text);display:flex;gap:8px}
.folders li:hover{background:#171b26}
.main{padding:18px}
.quota{font-size:13px;color:var(--dim);margin-bottom:12px}
table.files{width:100%;border-collapse:collapse;font-size:14px}
table.files th{text-align:left;color:var(--dim);font-weight:500;font-size:12px;text-transform:uppercase;letter-spacing:.04em;padding:8px 10px;border-bottom:1px solid var(--line)}
table.files td{padding:10px;border-bottom:1px solid #1a1f2b;vertical-align:middle}
table.files tr:hover td{background:#12151d}
.tag{font-size:11px;padding:2px 7px;border-radius:99px;border:1px solid var(--line);color:var(--dim)}
.tag.clean{color:var(--accent2);border-color:rgba(34,211,166,.4)}
.tag.malicious{color:var(--danger);border-color:rgba(255,93,108,.5)}
.tag.unknown,.tag.unscanned,.tag.error{color:#ffb454;border-color:rgba(255,180,84,.4)}
.actions{display:flex;gap:6px;justify-content:flex-end}
.actions button{padding:5px 9px;font-size:12px;border-radius:7px;background:#171b26;border:1px solid var(--line);color:var(--text)}
.actions button:hover{border-color:var(--accent)}
.empty{color:var(--dim);text-align:center;padding:40px}
dialog{border:0;background:transparent;padding:0}
dialog::backdrop{background:rgba(0,0,0,.6)}
.dlg{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:22px;width:min(420px,92vw);display:flex;flex-direction:column;gap:12px}
.row{display:flex;gap:8px}
.row>*{flex:1}
.wrap{max-width:1100px;margin:0 auto;padding:24px}
pre{background:#0e1118;border:1px solid var(--line);padding:12px;border-radius:10px;overflow:auto;font-size:13px}
@media(max-width:760px){.layout{grid-template-columns:1fr}.side{border-right:0;border-bottom:1px solid var(--line)}}