.tool-page { max-width: 980px; margin: 0 auto; padding: 24px 16px; }
.tool-hero h1 { margin: 0 0 8px 0; font-size: 28px; }
.tool-hero p { margin: 0 0 18px 0; opacity: .85; }

.tool-card {
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 16px;
  padding: 16px;
  box-shadow: 0 6px 20px rgba(0,0,0,.06);
  margin-bottom: 16px;
}

.tool-actions { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.tool-actions input[type="file"] { max-width: 320px; }
.tool-actions input[type="text"] { min-width: 260px; flex: 1; padding: 10px 12px; border-radius: 10px; border: 1px solid rgba(0,0,0,.12); }

.btn-primary, .btn-secondary, .btn-danger {
  border: 0;
  border-radius: 12px;
  padding: 10px 14px;
  cursor: pointer;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.btn-primary { background: #111; color: #fff; }
.btn-secondary { background: rgba(0,0,0,.06); color: #111; }
.btn-danger { background: rgba(220, 0, 0, .10); color: #a30000; }

.tool-status { margin: 12px 0; font-size: 14px; }
.tool-status.is-error { color: #b00020; }

.file-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.file-item {
  display: grid;
  grid-template-columns: 32px 1fr 120px;
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
  border: 1px dashed rgba(0,0,0,.18);
  border-radius: 14px;
  background: rgba(0,0,0,.02);
}
.file-handle { cursor: grab; user-select: none; opacity: .7; font-size: 18px; text-align: center; }
.file-name { font-weight: 600; }
.file-sub { font-size: 12px; opacity: .7; }

.file-remove {
  border: 1px solid rgba(0,0,0,.12);
  background: #fff;
  border-radius: 12px;
  padding: 8px 10px;
  cursor: pointer;
}

.result-box {
  margin-top: 10px;
  padding: 12px;
  border-radius: 14px;
  background: rgba(0,0,0,.03);
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}

.archive-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 12px;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 14px;
  margin-bottom: 10px;
}
.archive-title { font-weight: 700; }
.archive-sub { font-size: 12px; opacity: .7; margin-top: 2px; }
.archive-right { display: flex; gap: 10px; align-items: center; }
.muted { opacity: .7; font-size: 14px; }