main {
  width: min(960px, calc(100% - 40px));
  min-height: calc(100vh - 78px);
  margin: 0 auto;
  padding: 38px 0 64px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.intro {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0;
  margin: 0 auto 26px;
}

.intro .kicker { justify-content: center; }
.intro h1 { font-size: clamp(52px, 7vw, 86px); line-height: .9; white-space: nowrap; }
.intro-copy { max-width: 620px; margin: 18px auto 0; padding: 0; border: 0; }
.workspace { width: 100%; min-height: 380px; }
.dropzone { min-height: 350px; }
footer { width: min(960px, calc(100% - 40px)); }

.progress-track i {
  width: 0;
  transform: none;
  animation: none;
  transition: width .35s ease;
}

.progress-head strong { color: var(--acid); }
.time-row { display: flex; justify-content: space-between; align-items: center; margin: -7px 0 20px; }
.time-row span { color: #5f665e; font-size: 8px; letter-spacing: 1.4px; }
.time-row strong { color: #dfe6dc; font: 700 16px 'Barlow Condensed'; letter-spacing: 1.2px; }
.scan-actions { display:flex; align-items:center; gap:12px; margin:-2px 0 22px; }
.cancel-scan { border:1px solid #ff5a5a; border-radius:999px; padding:9px 14px; background:rgba(255,70,70,.13); color:#ff7474; font:700 9px Inter; letter-spacing:1.3px; cursor:pointer; transition:.2s; box-shadow:0 0 18px rgba(255,70,70,.12); }
.cancel-scan:hover { background:#ff5353; color:#fff; border-color:#ff7777; box-shadow:0 0 28px rgba(255,70,70,.35); }
.cancel-scan:disabled { opacity:.5; cursor:wait; }
.scan-actions span { color:#6f766e; font-size:8px; letter-spacing:1.2px; }
.support-section { margin:48px auto 0; padding:32px; border:1px solid rgba(255,255,255,.15); background:rgba(8,9,8,.58); text-align:center; }
.support-section .kicker { justify-content:center; }
.support-section h2 { margin:0; font:800 30px 'Barlow Condensed'; letter-spacing:1px; }
.support-section p { color:#939993; font-size:12px; }
.support-section a { color:#fff; font:700 12px Inter; letter-spacing:.5px; }

@media (max-width: 800px) {
  main { width: min(100% - 28px, 960px); padding-top: 34px; }
  .intro { display: flex; }
  .intro-copy { margin-top: 16px; }
  .intro h1 { white-space: normal; }
}