/* Public tools (packet PT1): calculators, interactive worksheets, journal, /tools hub. Uses the Learn tokens. */
.sq-tool { margin:0 0 26px; padding:27px; border:1px solid #e5e8e0; border-radius:17px; background:#fff; box-shadow:0 8px 24px rgba(30,39,31,.04); scroll-margin-top:90px; }
.sq-tool-head { display:flex; gap:16px; align-items:flex-start; }
.sq-tool-head h2 { margin:8px 0 6px; font-size:24px; letter-spacing:-.035em; }
.sq-tool-head p { max-width:720px; margin:0; color:#5f6a62; font-size:14px; line-height:1.7; }
.sq-calc-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:22px; margin-top:22px; align-items:start; }
.sq-calc-form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.sq-field { display:grid; align-content:start; gap:6px; color:#4b564e; font-size:12px; font-weight:620; }
.sq-field-wide { grid-column:1/-1; }
.sq-field small { color:#7a847c; font-weight:500; line-height:1.45; }
.sq-field input,.sq-field select,.sq-field textarea,.sq-ws-field textarea,.sq-ws-table input { width:100%; box-sizing:border-box; border:1px solid #dfe3db; border-radius:9px; background:#fcfcfa; color:#1f2a22; font:500 14px/1.45 inherit; }
.sq-field input,.sq-field select { min-height:44px; padding:0 12px; }
.sq-field textarea { padding:10px 12px; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:13px; resize:vertical; }
.sq-field input:focus,.sq-field select:focus,.sq-field textarea:focus,.sq-ws-field textarea:focus,.sq-ws-table input:focus { outline:2px solid #9fbf6d; outline-offset:1px; border-color:#9fbf6d; }
.sq-calc-result { display:grid; gap:10px; min-height:140px; padding:18px; border:1px solid #e7eadf; border-radius:13px; background:#f8f9f4; position:sticky; top:84px; }
.sq-calc-result[data-error] { border-color:#efd8c0; background:#fff8ed; }
.sq-calc-result .learn-kicker { font-size:9px; }
.sq-result-head { color:#2f3f28; font-size:21px; line-height:1.25; letter-spacing:-.03em; }
.sq-result-empty,.sq-muted { margin:0; color:#727c75; font-size:12px; line-height:1.55; }
.sq-error { margin:0; color:#8e4f1d; font-size:14px; line-height:1.55; }
.sq-pos { color:#2f6b3a!important; } .sq-neg { color:#a2402c!important; }
.sq-badge { justify-self:start; padding:4px 9px; border-radius:999px; background:#fff1df; color:#8a5a1f; font-size:11px; font-weight:650; }
.sq-kv { display:grid; gap:0; margin:0; }
.sq-kv>div { display:flex; justify-content:space-between; gap:14px; padding:7px 0; border-bottom:1px solid #eceee6; font-size:13px; }
.sq-kv dt { color:#5d675f; } .sq-kv dd { margin:0; color:#1f2a22; font-weight:650; text-align:right; font-variant-numeric:tabular-nums; }
.sq-warn { margin:4px 0 0; padding:10px 12px 10px 28px; border-radius:10px; background:#fff8ec; color:#7a5424; font-size:12px; line-height:1.5; }
.sq-disclaimer { margin:2px 0 0; color:#7b847d; font-size:11px; line-height:1.5; }
/* position:relative keeps visually hidden (absolute) header text inside the scroller on phones. */
.sq-table-wrap { position:relative; max-width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }
.sq-result-table { width:100%; border-collapse:collapse; font-size:12px; font-variant-numeric:tabular-nums; }
.sq-result-table th,.sq-result-table td { padding:6px 8px; border-bottom:1px solid #eceee6; text-align:right; white-space:nowrap; }
.sq-result-table th:first-child,.sq-result-table thead th:first-child { text-align:left; }
.sq-result-table thead th { color:#6a746c; font-size:11px; font-weight:650; }
.sq-chart { width:100%; height:auto; border-radius:10px; background:#fff; border:1px solid #edf0e8; }
.sq-chart-line { fill:none; stroke:#5f7f39; stroke-width:2.2; vector-effect:non-scaling-stroke; }
.sq-chart-zero { stroke:#c9cfc3; stroke-dasharray:4 4; vector-effect:non-scaling-stroke; }
.sq-tool-actions { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-top:18px; }
.sq-btn { min-height:40px; padding:0 14px; border:1px solid #dfe3db; border-radius:10px; background:#fff; color:#2c372f; font:650 13px/1 inherit; cursor:pointer; }
.sq-btn:hover { background:#f5f7f0; } .sq-btn:focus-visible { outline:2px solid #9fbf6d; outline-offset:2px; }
.sq-btn-primary { border-color:#1d2922; background:#1d2922; color:#fff; } .sq-btn-primary:hover { background:#27352a; }
.sq-btn-small { min-height:32px; padding:0 10px; font-size:12px; }
.sq-tool-status,.sq-save-note { color:#4d6a2b; font-size:12px; line-height:1.4; overflow-wrap:anywhere; }
.sq-calc-notes { margin-top:18px; padding:14px 16px; border-radius:12px; background:#f3f4ed; color:#4f5a52; font-size:13px; line-height:1.7; }
.sq-calc-notes p { margin:0; }
.sq-calc-notes code,.sq-ws-form code { overflow-wrap:anywhere; word-break:break-word; }
.sq-ws-table { position:relative; }
.sq-journal { margin-top:16px; }
/* Worksheet */
.sq-ws-progress { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-top:12px; color:#5f6a62; font-size:12px; }
.sq-ws-progress progress { width:min(260px,100%); height:8px; accent-color:#5f7f39; }
.sq-ws-form { margin-top:16px; color:#39453f; font-size:14px; line-height:1.7; }
.sq-ws-h { margin:26px 0 8px; padding-top:16px; border-top:1px solid #eceee6; font-size:18px; letter-spacing:-.02em; }
.sq-ws-h4 { margin:16px 0 6px; font-size:15px; }
.sq-ws-note { padding:12px 14px; border-left:3px solid #c4d99f; border-radius:8px; background:#f7f9f2; color:#4f5a52; font-size:13px; }
.sq-ws-field { display:grid; gap:6px; margin:12px 0; }
.sq-ws-field label { color:#2f3a32; font-weight:620; font-size:14px; }
.sq-ws-field textarea { padding:9px 12px; resize:vertical; }
.sq-ws-list { padding-left:20px; }
.sq-ws-check { list-style:none; margin-left:-20px; display:flex; gap:10px; align-items:flex-start; padding:4px 0; }
.sq-ws-check input { width:18px; height:18px; margin-top:4px; flex:none; accent-color:#5f7f39; }
.sq-ws-table { margin:12px 0; max-width:100%; overflow-x:auto; }
.sq-ws-table table { min-width:100%; border-collapse:collapse; font-size:12px; }
.sq-ws-table th,.sq-ws-table td { padding:6px; border:1px solid #e6e9e1; vertical-align:top; text-align:left; }
.sq-ws-table thead th { background:#f5f7f0; color:#4d584f; font-weight:650; min-width:110px; }
.sq-ws-table tbody th { background:#fbfbf8; font-weight:600; min-width:140px; }
.sq-ws-table input { min-width:110px; min-height:34px; padding:0 8px; font-size:13px; }
.sq-ws-table tfoot th,.sq-ws-table tfoot td { background:#f5f7f0; font-weight:650; }
.sq-ws-table .sq-btn { margin-top:8px; }
.sq-ws-code { padding:12px; border-radius:10px; background:#f3f4ed; overflow-x:auto; font-size:12px; }
/* Hub, CTA, recent strip */
.sq-recent { display:flex; flex-wrap:wrap; gap:8px 10px; align-items:center; width:min(1000px,calc(100% - 48px)); margin:18px auto; padding:12px 16px; border:1px solid #e3e8da; border-radius:14px; background:#f7f9f2; box-sizing:border-box; }
.resource-main .sq-recent { width:100%; margin:0 0 18px; }
.sq-recent [data-tools-recent-list] { display:flex; flex-wrap:wrap; gap:8px; }
.sq-recent a { padding:6px 11px; border:1px solid #dfe5d4; border-radius:999px; background:#fff; color:#2d3a2f; font-size:13px; font-weight:600; text-decoration:none; }
.sq-recent a:hover { border-color:#b8cc93; }
.sq-tools-cta { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); gap:20px; align-items:center; margin:26px 0; padding:24px; border-radius:17px; background:#1d2922; color:#e9efe3; }
.sq-tools-cta h2 { margin:6px 0; color:#fff; font-size:22px; letter-spacing:-.03em; }
.sq-tools-cta p { margin:0; color:#c5d0bf; font-size:14px; line-height:1.65; }
.sq-tools-cta .learn-kicker { color:#c4ec81; }
.sq-tools-cta-actions { display:flex; flex-wrap:wrap; gap:10px; justify-content:flex-end; }
.sq-tools-cta .learn-primary-button { background:#c4ec81; color:#17210f!important; } .sq-tools-cta .learn-primary-button span { color:#17210f; }
.sq-tools-cta .sq-btn { background:transparent; border-color:#4b5a4d; color:#e9efe3; } .sq-tools-cta .sq-btn:hover { background:#27352a; }
.sq-tools-cta .sq-save-note { flex-basis:100%; color:#d7e8bb; text-align:right; }
.sq-tools-jump { display:flex; flex-wrap:wrap; gap:8px; width:min(1000px,calc(100% - 48px)); margin:10px auto 0; }
.sq-tools-jump a { padding:7px 12px; border-radius:999px; background:#eef2e6; color:#33402f; font-size:13px; font-weight:620; text-decoration:none; }
.sq-tools-faq details { padding:12px 0; border-bottom:1px solid #e6e8e0; }
.sq-tools-faq summary { cursor:pointer; font-weight:650; }
.sq-tools-faq p { margin:8px 0 0; color:#5f6a62; font-size:14px; line-height:1.7; }
.sq-tool-callout { display:flex; flex-wrap:wrap; gap:12px; align-items:center; justify-content:space-between; margin:0 0 22px; padding:14px 18px; border:1px solid #e3e8da; border-radius:14px; background:#f7f9f2; font-size:14px; }
.sq-tool-callout a { font-weight:650; }
@media (max-width:860px) {
  .sq-calc-grid { grid-template-columns:1fr; }
  .sq-calc-result { position:static; }
  .sq-tools-cta { grid-template-columns:1fr; } .sq-tools-cta-actions { justify-content:flex-start; } .sq-tools-cta .sq-save-note { text-align:left; }
}
@media (max-width:560px) {
  .sq-tool { padding:18px 16px; border-radius:14px; }
  .sq-calc-form { grid-template-columns:1fr; }
  .sq-tool-head { gap:10px; } .sq-tool-head .tool-icon { display:none; }
  .sq-tool-head h2 { font-size:21px; }
  .sq-recent,.sq-tools-jump { width:calc(100% - 32px); }
  .sq-tool-actions .sq-btn { flex:1 1 auto; }
}
@media print {
  .learn-nav,.learn-footer,.sq-tool-actions,.sq-tools-cta,.sq-recent,.resource-hero .learn-primary-button,.explore-grid,.resource-related,.sq-calc-form,.sq-calc-notes { display:none!important; }
  .sq-tool { box-shadow:none; border:0; padding:0; }
  .sq-ws-field textarea,.sq-ws-table input { border:0; border-bottom:1px solid #999; resize:none; }
}
/* Landing page "Free tools" section */
.tools-promo-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin:22px 0 0; padding:0; list-style:none; }
.tools-promo-grid a { display:block; height:100%; box-sizing:border-box; padding:16px 18px; border:1px solid rgba(25,33,30,.12); border-radius:14px; background:rgba(255,255,255,.75); color:inherit; font-weight:650; text-decoration:none; }
.tools-promo-grid a::after { content:" →"; color:#5f7f39; }
.tools-promo-grid a:hover { border-color:#9fbf6d; }
.tools-promo-more { margin-top:20px; }
.tools-promo-section .sq-recent { width:100%; margin:18px 0 0; }
@media (max-width:860px) { .tools-promo-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:560px) { .tools-promo-grid { grid-template-columns:1fr; } }
