/* Layout restoration for compare-files */
body.page-tool-compare-files #compare {
  max-width: 96rem;
  margin: 0 auto;
}
body.page-tool-compare-files #compare > .b-dark {
  background: linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01)), #121418;
  border: 1px solid rgba(160,0,0,.26);
  border-radius: 1.2rem;
  box-shadow: 0 18px 42px rgba(0,0,0,.28);
}
body.page-tool-compare-files #compare label {
  display: block;
  margin: .75rem 0 .35rem;
  color: var(--page-text-muted);
  font-size: .92rem;
}
body.page-tool-compare-files #compare select,
body.page-tool-compare-files #compare input[type=file] {
  width: 100%;
  margin-bottom: .7rem;
}
body.page-tool-compare-files #compare .row {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  align-items: center;
  margin: 1rem 0 0;
}
body.page-tool-compare-files #compare .col {
  flex: 1 1 18rem;
}
body.page-tool-compare-files #downloadLink {
  display: none;
  align-items: center;
  justify-content: center;
  min-height: 2.65rem;
  padding: .7rem 1rem;
  border-radius: .85rem;
  border: 1px solid var(--page-card-border);
  background: rgba(80, 0, 0, 0.10);
  color: var(--page-text);
  text-decoration: none;
}
body.page-tool-compare-files #output {
  margin-top: 1rem;
  min-height: 28rem;
  max-height: 60vh;
  overflow: auto;
  padding: 1rem;
  border-radius: 1rem;
  border: 1px solid var(--page-card-border);
  background: var(--page-card-surface-tint-soft), rgba(18, 10, 13, 0.48);
  color: var(--page-text);
  white-space: pre-wrap;
  word-break: break-word;
}

@media (max-width: 48rem) {
  body.page-tool-compare-files #compare > .b-dark {
    padding: 0.9rem;
  }

  body.page-tool-compare-files #compare .row {
    gap: 0.6rem;
  }

  body.page-tool-compare-files #compare .col {
    flex-basis: 100%;
  }

  body.page-tool-compare-files #downloadLink {
    inline-size: 100%;
  }

  body.page-tool-compare-files #output {
    min-height: 18rem;
    max-height: 50vh;
    padding: 0.85rem;
    font-size: 0.88rem;
  }
}
