/* ── Reset + Base ── */
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Inter',system-ui,sans-serif;background:var(--bg);color:var(--t1);min-height:100vh;line-height:1.5;transition:background .2s,color .2s}

/* ── UPLOAD ── */
#upload-screen{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem;background:var(--up-bg);transition:background .2s;position:relative}
.app-logo{display:flex;align-items:center;gap:14px;margin-bottom:2.5rem}
.logo-icon{width:52px;height:52px;background:linear-gradient(135deg,var(--card),var(--bg2));border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:26px;box-shadow:0 0 24px rgba(58,68,120,.35);flex-shrink:0}
.app-logo h1{font-family:'Oswald',sans-serif;font-size:1.3rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--t1)}
.subtitle{font-size:.72rem;color:var(--t3);letter-spacing:2px;text-transform:uppercase;margin-top:2px}
.upload-tr{position:absolute;top:1.5rem;right:1.5rem}
.upload-card{
  border:2px dashed var(--bdr);border-radius:var(--r);
  padding:48px 24px;text-align:center;cursor:pointer;
  max-width:520px;width:100%;transition:all .25s ease;
  background:var(--card);position:relative;overflow:hidden;
}
.upload-card::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse at center,rgba(232,96,28,.06) 0%,transparent 70%);
  opacity:0;transition:opacity .3s;
}
.upload-card:hover::before,.upload-card.drag-over::before{opacity:1}
.upload-card:hover,.upload-card.drag-over{border-color:var(--accent);background:rgba(232,96,28,.04)}
.up-icon{font-size:48px;margin-bottom:12px;display:block}
.upload-card h2{font-family:'Oswald',sans-serif;font-size:18px;font-weight:600;color:var(--t1);margin-bottom:6px}
.upload-card p{color:var(--t2);font-size:13px;margin-bottom:1.75rem}
.btn-primary{
  background:linear-gradient(135deg,var(--accent),var(--accent-hover));color:#fff;border:none;
  padding:10px 24px;border-radius:var(--r);
  font-family:'Oswald',sans-serif;font-size:14px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  cursor:pointer;transition:all .2s;box-shadow:0 4px 15px rgba(232,96,28,.3);
}
.btn-primary:hover{transform:translateY(-1px);box-shadow:0 6px 22px rgba(232,96,28,.4)}
#file-input{display:none}
.upload-formats{margin-top:16px;font-size:.78rem;color:var(--t3);display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px}
.upload-formats span{font-family:var(--font-mono);font-size:11px;background:var(--bg);color:var(--t2);padding:4px 10px;border-radius:20px;border:1px solid var(--bdr)}

/* ── LOADING ── */
#loading-overlay{display:none;position:fixed;inset:0;background:rgba(8,12,24,.92);z-index:9999;flex-direction:column;align-items:center;justify-content:center;gap:1.25rem}
[data-theme=light] #loading-overlay{background:rgba(240,244,248,.92)}
#loading-overlay.active{display:flex}
.spinner{width:52px;height:52px;border:3px solid var(--bdr);border-top-color:var(--t2);border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.load-txt{color:var(--t2);font-size:.95rem}

/* ── THEME TOGGLE ── */
.theme-btn{background:transparent;border:1px solid var(--bdr);color:var(--t2);width:34px;height:34px;border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:16px;transition:all .2s;flex-shrink:0}
.theme-btn:hover{border-color:var(--t2);color:var(--t1)}
