/* Reading tools and comparisons share the site's existing colors and type. */
.brand-caption{font-size:10px;font-weight:700;letter-spacing:1.5px}
.magazine-heading{gap:30px;align-items:end}.magazine-heading h1{font-size:clamp(29px,3.4vw,46px);line-height:1.12}.magazine-heading>p{max-width:340px;font-size:14px;line-height:1.6}
.browse-grid,.tool-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.browse-grid{padding-block:12px 42px}.browse-card,.tool-card{display:block;background:white;border:1px solid var(--line);border-radius:10px;text-decoration:none;overflow:hidden;padding:26px;transition:border-color .15s}
.browse-card:hover,.tool-card:hover{border-color:var(--green)}.browse-card h2{font:700 23px/1.25 var(--sans);letter-spacing:-.5px}.browse-card p,.tool-card p{color:var(--muted);font-size:14px}.browse-card .read-link,.tool-card>b{font-size:12px;color:var(--green)}
.tool-card .eyebrow{margin-bottom:10px}.tool-card h3{font-size:23px;letter-spacing:-.6px;margin-bottom:12px}.tool-drawing{display:flex;align-items:center;justify-content:center;min-height:90px;margin:-26px -26px 24px;background:#e8eee8;color:#173e35;font:600 29px/1.4 var(--sans);letter-spacing:6px}.ruler-drawing{background:#f0e9d8;gap:14px;font-size:24px;letter-spacing:0}.ruler-drawing i{height:24px;border-left:1px solid #b8ac8a}.wave-drawing{background:#e7ecef;font-size:26px;letter-spacing:2px}
.utility-banner{display:flex;align-items:center;justify-content:space-between;gap:35px;padding-block:35px 55px}.utility-banner h2{font-size:32px}.utility-banner p{max-width:650px;color:var(--muted)}.utility-banner .button{flex-shrink:0}
.practical-tool{border:1px solid #ccd8ce;border-radius:9px;background:#f0f4ee;padding:28px;margin:30px 0;min-width:0}.practical-tool h2{font-size:30px;margin-top:0!important}.practical-tool p,.practical-tool li{font-size:15px}.practical-tool ol,.practical-tool ul{padding-left:23px}.practical-tool .table-scroll{margin-block:22px}.practical-tool details{margin-top:20px;border-top:1px solid #cad7cb;padding-top:16px;font-size:13px}.practical-tool summary{cursor:pointer;font-weight:700}.practical-tool details p{font-size:13px;margin:12px 0 0}.tool-controls{display:flex;flex-wrap:wrap;gap:18px;margin:22px 0}.tool-controls label{display:flex;flex:1;min-width:150px;flex-direction:column;gap:7px;font-size:13px;font-weight:700}.tool-controls input,.tool-controls select{padding:10px;background:#fff;border:1px solid #a9b9aa;border-radius:5px;width:100%;min-width:0}.tool-status{font-size:13px!important;font-weight:700}.frame-bars{display:grid;gap:16px;margin:22px 0}.frame-bars>div{display:grid;grid-template-columns:44px minmax(0,1fr) 78px;align-items:center;gap:12px;font-size:13px}.frame-track{background:#dde5da;border-radius:5px;overflow:hidden;height:25px}.frame-track i{display:block;height:100%;background:#38674f;border-radius:5px}.frame-bars output{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.comparison-section{padding-block:20px 38px}.comparison-section h2{font-size:35px}.comparison-section>p{max-width:850px}.table-scroll{max-width:100%;overflow-x:auto}.table-scroll th{vertical-align:top}.table-scroll td{vertical-align:top}.disclosure-wrap{max-width:1200px;margin-inline:auto;padding-inline:32px}.prose-page .disclosure-wrap{padding:0}.source-note{overflow-wrap:anywhere}
@media(max-width:760px){.browse-grid,.tool-card-grid{grid-template-columns:1fr}.browse-card,.tool-card{padding:22px}.tool-drawing{margin:-22px -22px 20px}.utility-banner{display:block}.utility-banner .button{margin-top:10px}.practical-tool{padding:20px;margin-block:24px}.practical-tool h2{font-size:27px}.frame-bars>div{grid-template-columns:40px minmax(0,1fr) 68px;gap:8px;font-size:12px}.magazine-heading{display:block}.magazine-heading>p{margin-top:14px}.disclosure-wrap{padding-inline:22px}}
@media(prefers-reduced-motion:reduce){.browse-card,.tool-card{transition:none}}

.connection-paths{background:#fff;border:1px solid var(--line);border-radius:8px;padding:22px;margin:26px 0}.connection-paths figcaption{margin-bottom:18px}.connection-paths>div{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:14px 0}.connection-paths span{padding:9px 12px;background:#e8eee8;border-radius:5px;font-size:13px}.connection-paths p{font-size:13px;margin:18px 0 0;color:var(--muted)}.download-note{padding-block:0 35px}.download-note p{font-size:12px;margin-top:8px;color:var(--muted)}
