* { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--tt-bg, #f5f7fb);
  color: var(--tt-text, #172033);
  font-family: var(--tt-font, Arial, sans-serif);
}
.page-shell {
  width: min(100% - 32px, var(--tt-maxw, 1080px));
  margin: 0 auto;
  padding: 24px 0 48px;
}
.hero-card, .notice, .results, .content-slot {
  background: var(--tt-surface, #ffffff);
  border: 1px solid var(--tt-line, #d9e1ef);
  border-radius: var(--tt-radius, 12px);
  box-shadow: var(--tt-shadow, 0 10px 30px rgba(23, 32, 51, 0.08));
  padding: 22px;
  margin-bottom: 18px;
}
.eyebrow {
  margin: 0 0 6px;
  color: var(--tt-primary, #2563eb);
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  font-size: .78rem;
}
h1 { margin: 0 0 8px; font-size: clamp(2rem, 4vw, 3.3rem); }
.promise { font-size: 1.12rem; margin: 0 0 18px; color: var(--tt-text, #172033); }
.tool-grid { display: grid; grid-template-columns: 1.4fr .8fr; gap: var(--tt-gap, 16px); }
.drop-zone {
  min-height: 178px;
  border: 2px dashed var(--tt-primary, #2563eb);
  background: var(--tt-primary-soft, #e9f1ff);
  border-radius: var(--tt-radius, 12px);
  display: grid;
  place-items: center;
  text-align: center;
  padding: 18px;
}
.drop-zone.dragging { outline: 4px solid var(--tt-primary-soft, #e9f1ff); }
#file-input { max-width: 100%; }
.file-label {
  display: block;
  font-weight: 800;
  margin: 10px 0 6px;
}
.action-panel {
  background: var(--tt-surface-soft, #fbfdff);
  border: 1px solid var(--tt-line, #d9e1ef);
  border-radius: var(--tt-radius, 12px);
  padding: 18px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 12px;
}
button, .download-link {
  border: 0;
  border-radius: var(--tt-radius, 12px);
  background: var(--tt-primary, #2563eb);
  color: var(--tt-surface, #ffffff);
  font-weight: 800;
  padding: 12px 16px;
  cursor: pointer;
  text-decoration: none;
  display: inline-block;
  text-align: center;
}
button:hover, .download-link:hover { background: var(--tt-primary-dark, #1d4ed8); }
button:disabled { opacity: .55; cursor: not-allowed; }
.status, .muted, .file-meta { color: var(--tt-muted, #5d6b82); }
.notice { background: var(--tt-surface-soft, #fbfdff); }
.error-card {
  border: 1px solid var(--tt-danger, #b42318);
  color: var(--tt-danger, #b42318);
  background: var(--tt-surface, #ffffff);
  border-radius: var(--tt-radius, 12px);
  padding: 12px;
  margin-bottom: 12px;
}
.file-card {
  border: 1px solid var(--tt-line, #d9e1ef);
  border-radius: var(--tt-radius, 12px);
  padding: 16px;
  margin-bottom: 14px;
  background: var(--tt-surface-soft, #fbfdff);
}
.warning {
  color: var(--tt-danger, #b42318);
  font-weight: 800;
  margin: 8px 0;
}
.group-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 12px; }
.meta-group {
  background: var(--tt-surface, #ffffff);
  border: 1px solid var(--tt-line, #d9e1ef);
  border-radius: var(--tt-radius, 12px);
  padding: 12px;
}
.meta-group h4 { margin: 0 0 8px; }
dl { margin: 0; }
dt { font-weight: 800; }
dd { margin: 0 0 8px; overflow-wrap: anywhere; }
.downloads { display: flex; flex-wrap: wrap; gap: 10px; margin: 12px 0; }
.report-table { width: 100%; border-collapse: collapse; margin-top: 10px; }
.report-table th, .report-table td { border-bottom: 1px solid var(--tt-line, #d9e1ef); padding: 8px; text-align: left; vertical-align: top; }
.success { color: var(--tt-success, #087443); font-weight: 800; }
progress { width: 100%; accent-color: var(--tt-primary, #2563eb); }
@media (max-width: 720px) {
  .tool-grid { grid-template-columns: 1fr; }
  .page-shell { width: min(100% - 20px, var(--tt-maxw, 1080px)); padding-top: 12px; }
}