@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600&family=Newsreader:ital,opsz,wght@1,6..72,400&display=swap');

:root { --ink:#171812; --paper:#f3f0e8; --acid:#d9ff47; --muted:#717367; --line:#d3d0c6; --white:#fff; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:Manrope, sans-serif; min-height:100vh; }
body::before { content:""; position:fixed; inset:0; pointer-events:none; opacity:.2; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.08'/%3E%3C/svg%3E"); }
main { width:min(1120px, calc(100% - 40px)); margin:auto; padding:28px 0 80px; }
.hidden { display:none !important; }
.mark { display:grid; place-items:center; width:48px; height:48px; background:var(--acid); border:1px solid var(--ink); border-radius:50%; font-family:"DM Mono"; font-weight:500; }
.mark.small { display:inline-grid; width:32px; height:32px; margin-right:10px; }
.eyebrow { margin:0 0 12px; font:500 11px/1 "DM Mono", monospace; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); }
h1,h2,p { margin-top:0; }
h1 { margin-bottom:22px; font-size:clamp(52px,8vw,104px); line-height:.87; letter-spacing:-.06em; font-weight:500; }
h1 em { font-family:Newsreader,serif; font-weight:400; }
header { display:flex; align-items:center; justify-content:space-between; padding-bottom:26px; border-bottom:1px solid var(--line); }
header > div { display:flex; align-items:center; }
.archive-link { color:var(--ink); text-decoration:none; font-size:13px; border-bottom:1px solid; padding-bottom:3px; }
.archive-link span { margin-left:7px; }
.hero { padding:88px 0 58px; display:grid; grid-template-columns:1fr minmax(220px,340px); align-items:end; }
.hero .eyebrow { grid-column:1/-1; }
.hero h1 { margin:0; }
.intro { color:var(--muted); font-size:15px; line-height:1.7; margin:0 0 5px; }
.drop-zone { position:relative; min-height:330px; border:1px dashed #96998a; display:flex; flex-direction:column; align-items:center; justify-content:center; transition:.2s; background:rgba(255,255,255,.22); }
.drop-zone.dragging { background:var(--acid); border-color:var(--ink); transform:scale(.995); }
.drop-zone input { display:none; }
.drop-icon { font:400 36px/1 "DM Mono"; margin-bottom:24px; }
.drop-zone h2 { font-size:24px; margin-bottom:7px; }
.drop-zone > p { color:var(--muted); font-size:13px; }
.resume-notice { margin-top:14px; padding:14px 18px; border:1px solid #b7c873; background:rgba(217,255,71,.18); font-size:12px; line-height:1.5; }
button { border:0; font:600 13px Manrope; cursor:pointer; }
.actions { display:flex; gap:8px; margin-top:16px; }
.actions button { padding:13px 20px; }
.primary { background:var(--ink); color:white; }
.secondary { background:transparent; border:1px solid var(--ink); }
.queue-section,.library { margin-top:70px; }
.section-title { display:flex; align-items:end; justify-content:space-between; gap:20px; border-bottom:1px solid var(--ink); padding-bottom:14px; }
.section-title h2 { margin:0; font-size:26px; }
.queue-controls { display:flex; gap:8px; }
.queue-controls button { padding:7px 10px; border:1px solid var(--line); background:transparent; font-size:11px; }
.queue-controls button:hover { border-color:var(--ink); }
.queue-controls button:disabled { opacity:.35; cursor:default; }
.upload-summary { display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:24px; padding:34px 0 28px; }
.upload-percentage,.upload-metric { display:flex; flex-direction:column; gap:8px; }
.upload-percentage strong { font:500 clamp(50px,7vw,84px)/.9 "DM Mono"; letter-spacing:-.08em; }
.upload-percentage span,.upload-metric span { color:var(--muted); font:10px "DM Mono"; text-transform:uppercase; letter-spacing:.09em; }
.upload-metric { justify-content:flex-end; border-left:1px solid var(--line); padding-left:24px; }
.upload-metric strong { font:500 17px "DM Mono"; }
.aggregate-progress { height:5px; background:var(--line); }
.aggregate-progress > div { width:0; height:100%; background:var(--ink); transition:width .2s; }
.file-row { display:grid; grid-template-columns:minmax(0,1fr) 100px 110px; gap:18px; align-items:center; min-height:58px; border-bottom:1px solid var(--line); font-size:13px; }
.file-name { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.file-size { color:var(--muted); font:11px "DM Mono"; text-align:right; }
.download { color:var(--ink); text-decoration:none; text-align:right; font-size:12px; }
.folder { border-bottom:1px solid var(--line); }
.folder summary { display:grid; grid-template-columns:25px minmax(0,1fr) auto 126px; gap:12px; align-items:center; min-height:62px; cursor:pointer; list-style:none; font-size:14px; font-weight:600; }
.folder summary::-webkit-details-marker { display:none; }
.folder-icon { font:19px "DM Mono"; transform:rotate(0); transition:transform .15s; }
.folder[open] > summary .folder-icon { transform:rotate(90deg); }
.folder-meta { color:var(--muted); font:10px "DM Mono"; font-weight:400; }
.folder-download { color:var(--ink); text-decoration:none; text-align:right; font-size:11px; font-weight:500; }
.folder-download:hover { text-decoration:underline; }
.folder-children { padding-left:25px; border-top:1px solid var(--line); }
.folder-children > .folder:last-child,.folder-children > .file-row:last-child { border-bottom:0; }
.load-more { width:100%; padding:16px; background:transparent; border-bottom:1px solid var(--line); color:var(--muted); font:11px "DM Mono"; }
.load-more:hover { color:var(--ink); background:rgba(255,255,255,.24); }
.empty { color:var(--muted); padding:40px 0; border-bottom:1px solid var(--line); }
.icon-button { background:transparent; font-size:24px; padding:2px 8px; }
.login { width:min(640px,100%); margin:12vh auto; padding:48px; border:1px solid var(--line); background:rgba(255,255,255,.4); }
.login .eyebrow { margin-top:52px; }
.login h1 { font-size:clamp(48px,7vw,76px); }
.login label { display:block; font:11px "DM Mono"; text-transform:uppercase; margin-bottom:10px; }
.password-row { display:flex; }
.password-row input { flex:1; min-width:0; border:1px solid var(--ink); background:var(--white); padding:15px; font-size:16px; outline:none; }
.password-row button { background:var(--ink); color:white; padding:0 25px; }
.error { color:#9e261d; font-size:13px; margin-top:10px; min-height:18px; }
@media (max-width:700px) {
  main { width:min(100% - 24px,1120px); }
  .hero { padding-top:65px; grid-template-columns:1fr; gap:28px; }
  .hero h1 { font-size:59px; }
  .drop-zone { min-height:300px; }
  .queue-title { align-items:flex-start; }
  .upload-summary { grid-template-columns:1fr 1fr; gap:24px 10px; }
  .upload-percentage { grid-column:1/-1; }
  .upload-metric { padding-left:12px; }
  .upload-metric strong { font-size:13px; }
  .file-row { grid-template-columns:minmax(0,1fr) 65px; }
  .file-row .file-size { display:none; }
  .folder-children { padding-left:14px; }
  .folder-meta { display:none; }
  .folder summary { grid-template-columns:20px minmax(0,1fr) 30px; gap:5px; }
  .folder-download { width:30px; overflow:hidden; white-space:nowrap; font-size:0; }
  .folder-download::after { content:"↘"; font-size:15px; }
  .login { padding:28px; }
  .archive-link { font-size:0; }
  .archive-link::before { content:"Download all"; font-size:12px; }
}