.tools-hero { padding-block: 2rem 2.5rem; }
.tools-breadcrumb { display: flex; flex-wrap: wrap; gap: .6rem; color: var(--muted); font-size: .8rem; margin-bottom: 2.5rem; }
.tools-breadcrumb a:hover { text-decoration: underline; }
.tools-hero h1 { max-width: 920px; font-size: clamp(2.6rem, 6vw, 4.8rem); line-height: 1.05; letter-spacing: -.06em; margin: .8rem 0 1.4rem; }
.tools-hero .page-lead { max-width: 780px; color: var(--muted); }
.tools-promises { display: flex; flex-wrap: wrap; gap: .7rem 1.5rem; margin-top: 1.5rem; color: var(--green); font-size: .85rem; font-weight: 650; }
.tools-promises span::before { content: "\2713"; margin-right: .4rem; }
.tools-workspace { scroll-margin-top: 6rem; }
.tools-tabs { display: flex; overflow-x: auto; gap: .3rem; padding: .4rem; border: 1px solid var(--line); border-radius: 18px 18px 0 0; background: var(--night); }
.tools-tabs a { color: #d8ded7; white-space: nowrap; padding: .8rem 1.1rem; font-size: .9rem; font-weight: 700; border-radius: 12px; }
.tools-tabs a:hover { background: var(--night-2); }
.tools-tabs a[aria-current] { color: var(--night); background: var(--mint); }
.tools-panel { padding: clamp(1rem, 3vw, 2rem); border: 1px solid var(--line); border-top: 0; border-radius: 0 0 22px 22px; background: var(--surface); box-shadow: 0 16px 40px rgba(16, 32, 26, .06); }
.tools-form { display: grid; grid-template-columns: minmax(180px, 1fr) minmax(160px, .6fr) auto; gap: 1rem; align-items: start; }
.tools-field { min-width: 0; }
.tools-field label { display: block; font-size: .85rem; font-weight: 750; margin-bottom: .5rem; }
.tools-field input, .tools-field select { width: 100%; min-height: 52px; padding: .8rem; color: var(--ink); background: var(--paper); border: 1px solid var(--line); border-radius: 10px; font: inherit; font-size: 1rem; }
.tools-field small { color: var(--muted); font-size: .78rem; }
.tools-field input::placeholder { color: var(--muted); opacity: 1; }
.tools-selector { grid-column: 1 / 3; }
.tools-form > .button { grid-column: 3; grid-row: 1; margin-top: 1.85rem; cursor: pointer; }
.tools-form:has(.tools-selector:not([hidden])) > .button { grid-row: 2; margin-top: 1.85rem; }
.tools-input-help { grid-column: 1 / -1; font-size: .82rem; color: var(--muted); margin: 0; }
.tools-privacy { margin: 1rem 0 0; color: var(--muted); font-size: .78rem; max-width: 850px; }
.tools-privacy a { text-decoration: underline; text-underline-offset: 3px; }
.tools-notice { color: var(--ink); font-size: .9rem; }
.tools-notice:empty { margin: 0; }
.tools-notice[data-error] { background: #fff0eb; border-left: 3px solid #a1311b; padding: .85rem; }
.tools-result-heading { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; border-top: 1px solid var(--line); margin-top: 1.8rem; padding-top: 1.5rem; }
.tools-result-heading h2 { margin: .4rem 0; font-size: clamp(1.3rem, 4vw, 2rem); letter-spacing: -.04em; overflow-wrap: anywhere; }
.tools-result-heading p, .tools-query { font-size: .8rem; color: var(--muted); overflow-wrap: anywhere; }
.tools-badge { display: inline-flex; flex: 0 0 auto; align-items: center; border-radius: 999px; padding: .35rem .7rem; font-size: .75rem; font-weight: 750; }
.tools-badge-info { background: #e4f3ea; color: #145536; }
.tools-badge-warn { background: #fff1cf; color: #704700; }
.tools-badge-fail, .tools-badge-error { background: #ffe7e0; color: #962919; }
.tools-check { border: 1px solid var(--line); border-radius: 14px; padding: 1.2rem; margin-top: 1.2rem; min-width: 0; }
.tools-check header { display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between; gap: .7rem; }
.tools-check h3 { font-size: 1.1rem; margin: 0; }
.tools-table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 8px; }
.tools-table { border-collapse: collapse; width: 100%; font-size: .8rem; text-align: left; }
.tools-table caption { text-align: left; padding: .6rem .8rem; color: var(--muted); font-size: .75rem; }
.tools-table th { background: var(--paper); font-weight: 700; }
.tools-table td, .tools-table th { padding: .7rem .8rem; border-top: 1px solid var(--line); vertical-align: top; }
.tools-table td:nth-child(2) { min-width: 200px; max-width: 600px; }
.tools-table code { white-space: pre-wrap; overflow-wrap: anywhere; }
.tools-mx-detail { display: block; color: var(--muted); margin-top: .3rem; }
.tools-table td:first-child { min-width: 140px; max-width: 240px; overflow-wrap: anywhere; }
.tools-copy { border: 1px solid var(--line); background: var(--surface); border-radius: 8px; min-height: 40px; padding: .45rem .7rem; font-size: .8rem; cursor: pointer; font-weight: 650; }
.tools-copy:hover { background: var(--paper); }
.tools-findings { padding: 0; margin: 1rem 0 0; list-style: none; display: grid; gap: .75rem; }
.tools-findings li { padding: .8rem 1rem; border-left: 3px solid var(--green); background: #f6f9f5; border-radius: 0 8px 8px 0; }
.tools-findings li.tools-finding-warn { border-color: #b8770b; background: #fffaf0; }
.tools-findings li.tools-finding-fail, .tools-findings li.tools-finding-error { border-color: #a1311b; background: #fff4f0; }
.tools-findings strong { font-size: .9rem; }
.tools-findings p { margin: .3rem 0 0; color: var(--muted); font-size: .85rem; overflow-wrap: anywhere; }
.tools-scope { font-size: .82rem; color: var(--muted); margin: 1.2rem 0 0; }
.tools-result-actions { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 1.2rem; }
.tools-history { margin-top: 1.8rem; border-top: 1px solid var(--line); padding-top: 1rem; }
.tools-history > div { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.tools-history h3 { margin: 0; font-size: .95rem; }
.tools-history p { font-size: .78rem; color: var(--muted); margin-top: .5rem; }
.tools-history ol { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.tools-history button { overflow-wrap: anywhere; text-align: left; max-width: 100%; }
.tools-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; }
.tools-steps article > span { color: var(--green); font-weight: 750; font-size: .85rem; }
.tools-steps h3 { font-size: 1.1rem; letter-spacing: -.025em; }
.tools-steps p, .tools-card p { font-size: .9rem; color: var(--muted); }
.tools-card-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.tools-card { background: var(--surface); border: 1px solid var(--line); padding: 1.5rem; border-radius: 16px; transition: border-color 150ms; }
.tools-card:hover { border-color: var(--green); }
.tools-card h3 { display: flex; justify-content: space-between; gap: 1rem; margin: 0; font-size: 1.05rem; }
.tools-card .text-link { font-size: .8rem; }
.tools-faq { margin-block: 6rem; }
.tools-faq summary { font-size: 1rem; }
.tools-faq summary::after { content: "+"; font-size: 1.4rem; margin-left: .8rem; }
.tools-faq details[open] summary::after { content: "\2212"; }
.tools-workspace :focus-visible, .tools-card:focus-visible, .tools-breadcrumb a:focus-visible { outline: 3px solid var(--green); outline-offset: 3px; }
.tools-workspace button:disabled { opacity: .6; cursor: wait; transform: none; }
@media (max-width: 900px) {
  .tools-card-grid { grid-template-columns: repeat(2, 1fr); }
  .tools-steps { gap: 1.2rem; }
  .tools-form { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .tools-domain { grid-column: 1 / -1; }
  .tools-selector { grid-column: 1 / -1; }
  .tools-form > .button, .tools-form:has(.tools-selector:not([hidden])) > .button { grid-column: 1 / -1; grid-row: auto; margin-top: 0; }
}
@media (max-width: 560px) {
  .tools-hero { padding-top: 1.4rem; }
  .tools-breadcrumb { margin-bottom: 1.6rem; }
  .tools-tabs a { padding: .7rem .85rem; font-size: .85rem; }
  .tools-field { grid-column: 1 / -1; }
  .tools-card-grid, .tools-steps { grid-template-columns: 1fr; }
  .tools-check { padding: .9rem; }
  .tools-result-heading { align-items: flex-start; flex-direction: column; }
  .tools-faq { margin-block: 4rem; }
}
