/* Tools section (CR-0153): shared by /tools/ pages, on top of /styles.css. */
.toolgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px 18px; margin: 18px 0 26px; }
.toolgrid label { display: flex; flex-direction: column; gap: 5px; font-size: 14px; color: var(--muted); justify-content: flex-end; }
.toolgrid input, .toolgrid select { font: inherit; font-size: 16px; color: var(--ink); padding: 9px 11px; border: 1px solid var(--line); border-radius: 8px; background: var(--bg); width: 100%; }
.presets { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 4px; font-size: 14px; }
.chip { font: inherit; font-size: 14px; color: var(--ink); background: var(--bg); border: 1px solid var(--line); border-radius: 999px; padding: 5px 12px; cursor: pointer; }
.chip:hover { border-color: var(--accent); }
.oddsrow { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 18px; }
.odd { border: 1px solid var(--line); border-radius: 12px; padding: 14px 16px; display: flex; flex-direction: column; gap: 4px; }
.odd span { font-size: 13px; color: var(--muted); }
.odd strong { font-size: 22px; letter-spacing: -0.01em; }
#odds-result h3, #lt-result h3 { margin-top: 26px; }
.linkbox { display: flex; gap: 10px; align-items: stretch; margin: 10px 0 6px; }
.linkbox input { flex: 1; min-width: 0; font: inherit; font-size: 15px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; padding: 9px 11px; border: 1px solid var(--line); border-radius: 8px; color: var(--ink); background: var(--soft); }
.ltsteps { padding-left: 22px; margin: 14px 0 18px; }
.ltsteps li { margin-bottom: 10px; }
.hits td { font-size: 14px; vertical-align: top; }
.hits td.ua { word-break: break-word; color: var(--muted); font-size: 13px; }
.who { display: inline-block; border-radius: 999px; padding: 1px 9px; font-size: 13px; font-weight: 600; white-space: nowrap; }
.who.you, .who.your_browser { background: #e3f4e8; color: #17663a; }
.who.automated { background: #fdecec; color: #a12626; }
.who.undecided { background: #fff4d9; color: #7a5200; }
.who.captured, .who.dropped { background: #e3f4e8; color: #17663a; }
.who.redirected { background: #fff4d9; color: #7a5200; }
.who.sent { background: #fdecec; color: #a12626; }
.fencecode { margin: 14px 0 26px; }
.fencecode pre { max-height: 560px; }
.tool-actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 12px 0; }
button.btn { font: inherit; cursor: pointer; }
@media (max-width: 640px) { .oddsrow { grid-template-columns: repeat(2, 1fr); } .linkbox { flex-direction: column; } }
