.tools-main { padding-block: var(--space-16) var(--space-12); }
.tools-intro { display: grid; grid-template-columns: minmax(0, 1fr) minmax(220px, 320px); align-items: center; gap: var(--space-16); margin-bottom: var(--space-12); }
.tools-intro h1 { font-size: var(--text-hero); line-height: 1.05; margin-bottom: var(--space-6); }
.tools-intro h1 em { color: var(--venom); }
.tools-lede { font-size: var(--text-base); max-width: 42ch; margin-bottom: var(--space-6); }
.tools-status { font-size: var(--text-sm); color: var(--ink-soft); max-width: 48ch !important; margin-bottom: 0; }
.tools-portrait { width: 100%; height: auto; aspect-ratio: 1.2; object-fit: cover; object-position: center 35%; }
.tools-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--space-4) var(--space-8); }
.tool-button { width: 100%; min-height: 108px; display: grid; grid-template-columns: 48px minmax(0,1fr); column-gap: var(--space-5); row-gap: var(--space-1); align-content: center; padding: var(--space-5) var(--space-6); border: 1px solid var(--line-strong); background: var(--cream); color: var(--ink); font-family: var(--sans); text-align: left; border-radius: 0; }
.tool-button:disabled { opacity: 1; cursor: not-allowed; -webkit-text-fill-color: currentColor; }
.tool-icon { grid-row: span 2; align-self: center; width: 48px; height: 48px; display: grid; place-items: center; background: var(--ivory); }
.tool-icon img { width: 32px; height: 32px; object-fit: contain; }
.tool-name { font-size: var(--text-base); font-weight: 500; overflow-wrap: anywhere; }
.tool-status { font-size: var(--text-xs); color: var(--ink-soft); }
.tools-note { margin-block: var(--space-6) 0; }
.tools-footer { border-top: 1px solid var(--line); }
.tools-page [aria-current="page"] { color: var(--venom); }
@media (max-width: 900px) and (min-width: 721px) {
  .tools-page .site-nav { gap: var(--space-4); }
  .tools-page .mk-brand span { display: none; }
}
@media (max-width: 720px) {
  .tools-main { padding-block: var(--space-10); }
  .tools-intro { grid-template-columns: minmax(0,1fr); gap: var(--space-8); margin-bottom: var(--space-8); }
  .tools-portrait { max-width: 360px; aspect-ratio: 1.6; }
  .tools-list { grid-template-columns: minmax(0,1fr); gap: var(--space-4); }
  .tool-button { padding: var(--space-5); }
}
