:root {
  --tool-status-fail-fg: oklch(0.45 0.16 25);
  --tool-status-fail-bg: oklch(0.95 0.03 25);
}
.tool-panel {
  background: var(--color-surface);
  border: var(--border-1);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-panel);
  padding: var(--space-lg);
}
@media (max-width: 639px) {
  .tool-panel { padding: var(--space-md); }
}
.tool-form {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: var(--space-md);
  padding-block-end: var(--space-md);
  border-block-end: var(--border-1);
}
.tool-field { display: flex; flex-direction: column; gap: var(--space-xs); min-width: 0; }
.tool-field label {
  font-size: var(--fs-small);
  font-weight: var(--fw-medium);
  color: var(--color-text);
}
.tool-field__unit { font-weight: var(--fw-regular); color: var(--color-text-muted); }
.tool-field input,
.tool-field select {
  inline-size: 100%;
  padding: var(--space-sm) var(--space-sm);
  font: inherit;
  font-size: var(--fs-small);
  color: var(--color-text);
  background: var(--color-surface);
  border: var(--border-1);
  border-radius: var(--radius-xs);
}
.tool-field__pair { display: flex; gap: var(--space-xs); min-width: 0; }
.tool-field__pair input { flex: 1 1 auto; min-width: 0; }
.tool-field__pair select { flex: 0 0 auto; inline-size: auto; }
.tool-field input:focus-visible,
.tool-field select:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 1px;
}
.tool-results { margin-block-start: var(--space-lg); }
.tool-table { inline-size: 100%; }
.tool-table td { min-inline-size: 0; overflow-wrap: anywhere; }
.tool-sub { margin-block-start: var(--space-xl); }
.tool-sub h3 {
  font-size: var(--fs-title);
  margin: 0 0 var(--space-md);
}
.tool-sub .tool-form { border-block-end: 0; padding-block-end: 0; }
.tool-status {
  font-size: var(--fs-small);
  font-weight: var(--fw-medium);
}
.tool-status--meets { color: var(--color-status-verified-fg); background: var(--color-status-verified-bg); }
.tool-status--confirm { color: var(--color-status-pending-fg); background: var(--color-status-pending-bg); }
.tool-status--fail { color: var(--tool-status-fail-fg); background: var(--tool-status-fail-bg); }
.tool-status--unknown { color: var(--color-text-muted); }
.tool-ranking {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
}
.tool-ranking__item {
  padding: var(--space-md);
  border: var(--border-1);
  border-radius: var(--radius-sm);
}
.tool-ranking__name {
  margin: 0 0 var(--space-xs);
  font-size: var(--fs-body);
  font-weight: var(--fw-semibold);
  color: var(--color-text);
}
.tool-ranking__best {
  display: inline-block;
  margin-inline-start: var(--space-sm);
  padding: 2px var(--space-sm);
  border-radius: var(--radius-pill, 999px);
  font-size: var(--fs-eyebrow);
  font-weight: var(--fw-medium);
  color: var(--color-primary);
  background: var(--color-primary-soft);
}
.tool-ranking__reason {
  margin: 0 0 var(--space-sm);
  font-size: var(--fs-small);
  color: var(--color-text-muted);
}
.tool-ranking__link { font-size: var(--fs-small); font-weight: var(--fw-medium); }
.tool-ranking__lead { margin: 0 0 var(--space-md); }
.tool-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm);
  margin-block-start: var(--space-lg);
}
.tool-note {
  margin-block-start: var(--space-md);
  font-size: var(--fs-small);
  color: var(--color-text-muted);
}
@media print {
  .site-header,
  .site-footer,
  .article-aside,
  .tool-actions,
  .tool-faq,
  .ready-cta,
  .breadcrumb,
  .site-header__menu-toggle {
    display: none !important;
  }
  .tool-panel {
    border: 0;
    box-shadow: none;
    padding: 0;
  }
  .prose { margin-block-start: var(--space-lg) !important; }
  body { background: #fff; }
}