.local-audio-tool {
  margin: 28px 0 32px;
  padding: 26px 0 0;
  border-top: 1px solid #343c47;
  color: #edf0f4;
}
.local-audio-tool, .local-audio-tool * { box-sizing: border-box; }
.local-audio-tool [hidden] { display: none !important; }
.local-tool-upload { display: flex; align-items: center; gap: 12px 16px; flex-wrap: wrap; }
.local-audio-tool button, .local-audio-tool .local-tool-download {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 11px 20px;
  border: 1px solid #566171;
  border-radius: 6px;
  background: #252c35;
  color: #edf0f4;
  font: inherit;
  font-size: 15px;
  line-height: 1.4;
  white-space: nowrap;
  cursor: pointer;
  text-decoration: none;
}
.local-audio-tool .local-tool-choose { min-width: 136px; }
.local-audio-tool .local-tool-choose,
.local-audio-tool [data-tool-apply],
.info-page .local-audio-tool .local-tool-download {
  border-color: #9bb9ef;
  background: #9bb9ef;
  color: #17263d;
  font-weight: 600;
}
.local-audio-tool .local-tool-choose:hover,
.local-audio-tool [data-tool-apply]:hover,
.info-page .local-audio-tool .local-tool-download:hover,
.info-page .local-audio-tool .local-tool-download:focus-visible {
  background: #b0cafa;
  color: #17263d;
  text-decoration: none;
}
.local-audio-tool button:disabled { opacity: .48; cursor: default; }
.local-audio-tool button:focus-visible,
.local-audio-tool input:focus-visible,
.local-audio-tool .local-tool-download:focus-visible { outline: 2px solid #b4cdf8; outline-offset: 3px; }
.local-tool-upload [data-tool-cancel],
.local-tool-upload [data-tool-clear] { padding-inline: 13px; }
.local-tool-limits { flex: 1 1 240px; color: #aeb7c4; font-size: 13px; line-height: 1.6; }
.local-tool-status {
  margin: 18px 0 0 !important;
  color: #bfc9d6 !important;
  overflow-wrap: anywhere;
  font-size: 14px !important;
  line-height: 1.6 !important;
}
.local-tool-status:empty { display: none; }
.local-tool-status[data-error=true] { color: #ffb9a6 !important; }
.local-audio-tool [data-tool-ready] { display: grid; gap: 24px; margin-top: 24px; min-width: 0; }
.local-tool-results {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin: 0;
  padding: 22px 0;
  border-top: 1px solid #343c47;
  border-bottom: 1px solid #343c47;
}
.local-tool-results div { display: grid; min-width: 0; grid-template-rows: 1fr auto; gap: 7px; }
.local-tool-results dt { color: #aeb7c4; font-size: 13px; line-height: 1.5; }
.local-tool-results dd { margin: 0; font-size: 26px; line-height: 1.3; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.local-tool-controls { display: grid; align-items: end; gap: 18px 16px; margin: 0; min-width: 0; }
.local-tool-controls--tempo { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.local-tool-controls--pitch { grid-template-columns: minmax(0, 240px) auto; }
.local-tool-controls label { display: flex; min-width: 0; flex-direction: column; gap: 8px; color: #c6ccd5; font-size: 13px; line-height: 1.5; }
.local-tool-controls input {
  width: 100%;
  min-width: 0;
  min-height: 46px;
  padding: 10px 12px;
  border: 1px solid #586270;
  border-radius: 5px;
  background: #191e25;
  color: #eef2f7;
  font: inherit;
  font-size: 16px;
  font-variant-numeric: tabular-nums;
}
.local-tool-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.local-tool-controls--tempo .local-tool-actions { grid-column: 1 / -1; }
.local-tool-actions [data-tool-apply] { min-width: 136px; }
.local-audio-tool .local-tool-reset { background: transparent; border-color: #414b59; color: #c6ccd5; }
.local-tool-player { display: block; width: 100%; max-width: 100%; min-width: 0; height: 48px; margin: 0; color-scheme: dark; }
.local-tool-save-row { display: flex; align-items: center; justify-content: space-between; gap: 12px 20px; flex-wrap: wrap; }
.info-page .local-tool-save-row p { margin: 0; color: #aeb7c4; font-size: 13px; line-height: 1.6; overflow-wrap: anywhere; }
.local-tool-save-row:has([data-tool-download][hidden]):has([data-tool-preview-label]:empty) { display: none; }
.local-tool-links { display: flex; flex-wrap: wrap; gap: 10px 24px; margin: 0 0 16px; }
.local-tool-links a { display: inline-flex; align-items: center; min-height: 40px; font-size: 14px; }
@media (min-width: 900px) {
  .info-page:has(.local-audio-tool) { padding-top: 28px; padding-bottom: 32px; }
  .info-page:has(.local-audio-tool) .back-link { margin-bottom: 16px; }
  .info-page:has(.local-audio-tool) h1 { margin-bottom: 12px; }
  .local-audio-tool { margin-top: 20px; padding-top: 20px; }
  .local-tool-status { margin-top: 12px !important; }
  .local-audio-tool [data-tool-ready] { margin-top: 16px; gap: 18px; }
  .local-tool-results { padding-block: 16px; }
  .local-tool-controls--tempo { grid-template-columns: repeat(3, minmax(0, 1fr)) auto; gap: 12px; }
  .local-tool-controls--tempo .local-tool-actions { grid-column: auto; flex-wrap: nowrap; gap: 8px; }
  .local-tool-controls--tempo .local-tool-actions button { padding-inline: 14px; }
  .local-tool-controls--tempo .local-tool-actions [data-tool-apply] { min-width: 112px; }
}
@media (max-width: 560px) {
  .local-audio-tool { margin-top: 24px; padding-top: 22px; }
  .local-tool-upload { gap: 12px; }
  .local-tool-limits { flex-basis: calc(100% - 148px); font-size: 12px; }
  .local-audio-tool [data-tool-ready] { gap: 22px; margin-top: 22px; }
  .local-tool-results { gap: 10px; padding: 18px 0; }
  .local-tool-results dt { font-size: 12px; }
  .local-tool-results dd { font-size: 22px; }
  .local-tool-controls { gap: 16px 10px; }
  .local-tool-controls--pitch { grid-template-columns: minmax(0, 1fr); }
  .local-tool-controls label { font-size: 12px; }
  .local-tool-controls input { padding-inline: 10px; }
  .local-tool-actions { gap: 10px; }
  .local-tool-actions button { flex: 1; }
  .local-tool-save-row { align-items: stretch; flex-direction: column; }
  .local-tool-save-row .local-tool-download { width: 100%; }
  .local-tool-links { gap: 8px 20px; }
}
@media (max-width: 360px) {
  .local-tool-limits { flex-basis: 100%; }
  .local-tool-controls--tempo { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .local-tool-controls--tempo > label:first-child { grid-column: 1 / -1; }
}