.tool{padding-bottom:3rem}.tool h2{font-size:1.15rem}.tool__note{max-width:46rem;color:var(--faint);margin:1rem 0;font-size:14px}.js .tool [data-nojs],html:not(.js) .tool [data-when=waiting]{display:none}.tool__hint{max-width:46rem;color:var(--muted);font-size:14px}.tool__form{gap:1rem;display:grid}.tool fieldset{border:0;min-width:0;margin:0;padding:0}.tool legend{margin-bottom:.45rem;padding:0;font-size:15px;font-weight:600}.tool-pair{flex-wrap:wrap;align-items:start;gap:.3rem .6rem;display:flex}.tool-pair[hidden]{display:none}.tool-pair legend{flex-basis:100%}.tool-pair__x{color:var(--muted);font-family:var(--mono);align-self:start;padding-top:2.2rem}.tool-field{align-content:start}.tool-field input,.tool-field select{width:8.5rem;max-width:100%}.tool-field select{border:1px solid var(--rule-strong);border-radius:var(--r-ctl);background:var(--bg);min-height:48px;color:var(--text);font:500 16px var(--mono);padding:0 .75rem}.tool-field .field-error:empty{display:none}.tool-field .field-error{max-width:14rem}.tool-radios{flex-wrap:wrap;gap:.25rem 1rem;display:flex}.tool-radios legend{color:var(--muted);flex-basis:100%;font-size:13px;font-weight:400}.tool-radios label,.tool-check{cursor:pointer;align-items:center;gap:.45rem;min-height:44px;display:inline-flex}.tool-radios input,.tool-check input{width:20px;height:20px;accent-color:var(--text);margin:0}.tool-check{color:var(--muted);flex-basis:100%;font-size:14px}.tool-row{flex-wrap:wrap;align-items:start;gap:1rem 2rem;display:flex}.tool-monitors{grid-template-columns:repeat(auto-fill,minmax(min(100%,19rem),1fr));gap:1.25rem;display:grid}.tool__results{margin-top:1.5rem}.tool-compare{grid-template-columns:repeat(auto-fit,minmax(min(100%,22rem),1fr));gap:1rem;margin-top:1rem;display:grid}.tool-card{border:1px solid var(--rule);border-radius:var(--r-media);background:var(--raise);align-content:start;gap:.9rem;padding:1.1rem;display:grid}.tool-card h2,.tool-card h3{font-size:1.05rem}.tool-manual{margin-top:1rem}.tool-facts{flex-wrap:wrap;gap:.6rem 2rem;margin:0;display:flex}.tool-facts div{gap:.1rem;display:grid}.tool-facts dt{color:var(--muted);font-size:13px}.tool-facts dd{overflow-wrap:anywhere;margin:0;font-weight:550}.tool-big{letter-spacing:-.01em;font-size:1.5rem}.tool-lines{color:var(--muted);gap:.35rem;margin:0;padding-left:1.1rem;font-size:15px;display:grid}.tool-lines .mono{color:var(--text)}.tool-lines [hidden]{display:none}.tool-sub{margin:1rem 0 .4rem;font-size:1rem}.tool .is-stale .tool-facts,.tool .is-stale .tool-lines,.tool .is-stale .tool-svg,.tool .is-stale.tool__results{opacity:.45}.tool-svg{width:100%;height:220px;display:block}.tool-svg--wide{height:180px;margin-top:1rem}.tool-svg__src{fill:var(--raise-2)}.tool-svg__keep{fill:#7cc4ff38;stroke:var(--focus);stroke-width:2px}.tool-svg__screen{fill:var(--bg);stroke:var(--rule-strong);stroke-width:1px;vector-effect:non-scaling-stroke}.tool-svg__img{fill:#7cc4ff38;stroke:var(--focus);stroke-width:2px}.tool-svg__canvas{fill:none;stroke:var(--rule-strong);stroke-width:1px;stroke-dasharray:4 4}.tool-svg__screen-on{fill:var(--raise-2);stroke:var(--focus);stroke-width:2px}.tool-svg__label{fill:var(--muted);font-family:var(--mono)}.tool__text{margin-top:2rem}.tool__text ol{padding-left:1.2rem}.tool__text li+li{margin-top:.35rem}.tool__links,.tool__more{margin-top:2rem}.tool__links h2,.tool__more h2{margin-bottom:.7rem}.tool__links ul{flex-wrap:wrap;gap:.5rem;margin:0 0 .7rem;padding:0;list-style:none;display:flex}.tool__links a{border:1px solid var(--rule-strong);border-radius:999px;align-items:center;gap:.5rem;min-height:44px;padding:0 1rem;text-decoration:none;display:inline-flex}.tool__links a:hover{background:var(--raise)}.tool__links .mono{color:var(--muted);font-size:13px}.tool-cards{grid-template-columns:repeat(auto-fill,minmax(min(100%,16rem),1fr));gap:.75rem;margin:0;padding:0;list-style:none;display:grid}.tool-cards a{border:1px solid var(--rule);border-radius:var(--r-media);background:var(--raise);height:100%;transition:border-color .2s var(--ease);gap:.3rem;padding:1rem 1.1rem;text-decoration:none;display:grid}.tool-cards a:hover{border-color:var(--rule-strong)}.tool-cards span{color:var(--muted);font-size:14px}.tool-cards--hub{margin-top:.5rem}@media (width<=479px){.tool-field input,.tool-field select{width:7.25rem}.tool-big{font-size:1.3rem}.tool-svg{height:180px}}
