/* networth.com — DATA-REFERENCE pages (tpl-reference.php: tax brackets, mortgage rates, costs).
   Extends suite.css. Everything here is about making a table the primary content of a page rather
   than an appendix to it, because that is what the SERP for these terms actually rewards. */

.ref-body .reftable{overflow-x:auto;margin:14px 0 6px}
.ref-body .reftable table{width:100%;border-collapse:collapse;font-size:14.5px;min-width:520px}
.ref-body .reftable caption{text-align:left;font-size:12.5px;color:var(--muted);padding-bottom:8px}
.ref-body .reftable th,.ref-body .reftable td{padding:10px 13px;text-align:right;
  border-bottom:1px solid #f1f4fa;font-variant-numeric:tabular-nums}
.ref-body .reftable thead th{font-size:12px;text-transform:uppercase;letter-spacing:.04em;
  color:var(--muted);background:#fafcff;text-align:right;position:sticky;top:0}
.ref-body .reftable thead th:first-child,.ref-body .reftable tbody th{text-align:left}
.ref-body .reftable tbody th{color:var(--ink);font-weight:700;white-space:nowrap}
.ref-body .reftable tr.hi th,.ref-body .reftable tr.hi td{background:#f7faff}
.ref-body .reftable .rate{font-weight:800;color:var(--ink)}

/* filing-status tabs above a table — four schedules, one at a time, no JS framework */
.reftabs{display:flex;flex-wrap:wrap;gap:6px;margin:14px 0 2px}
.reftabs button{border:1px solid #d5dcea;background:#fff;border-radius:9px;padding:8px 13px;
  font:700 13.5px 'Inter',sans-serif;color:var(--body);cursor:pointer}
.reftabs button:hover{border-color:var(--blue);color:var(--blue)}
.reftabs button.on{background:var(--blue);border-color:var(--blue);color:#fff}
.refpane[hidden]{display:none}

/* the worked example — arithmetic shown line by line */
.refwork{background:var(--soft);border:1px solid #dbe6fb;border-radius:12px;padding:18px 22px;margin:14px 0}
.refwork ol{margin:0;padding-left:20px}
.refwork li{font-size:15.5px;line-height:1.6;color:var(--body);margin-bottom:6px}
.refwork b{color:var(--ink)}
.refwork .tot{margin-top:10px;padding-top:10px;border-top:1px solid #dbe6fb;font-size:16px;color:var(--ink);font-weight:700}

/* key-figure strip: a handful of headline numbers with their own source note */
.refkeys{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px;margin:14px 0 4px}
.refkey{border:1px solid var(--line);border-radius:12px;padding:14px 16px;background:#fff}
.refkey .k{font-size:12.5px;color:var(--muted);line-height:1.35}
.refkey .v{font:800 21px 'Plus Jakarta Sans',sans-serif;color:var(--ink);
  font-variant-numeric:tabular-nums;margin-top:3px}
.refkey .s{font-size:11.5px;color:var(--muted);margin-top:4px}

/* the sources rail — items breathe (operator ask 2026-08-06: "more space between each one") */
.rail-src ul{list-style:none;margin:0;padding:0}
.rail-src li{font-size:13px;line-height:1.5;padding:14px 0;border-bottom:1px solid #f1f4fa}
.rail-src li:first-child{padding-top:4px}
.rail-src li:last-child{border-bottom:0;padding-bottom:4px}
.rail-src a{color:var(--blue);font-weight:600}
.rail-src em{display:block;font-style:normal;color:var(--muted);font-size:12px;margin-top:4px}

/* the same breathing room for the rail's article lists on reference pages */
.refpage .rail-list li{padding:14px 0}
.refpage .rail-cards li{padding:13px 0}
.refpage .rail-m{margin-top:5px}
.refpage .calc-rail>*+*{margin-top:18px}

@media (max-width:860px){
  .ref-body .reftable table{min-width:480px}
  .refkeys{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
}

/* year-on-year and long-run deltas in the price tables */
.pdelta{font-weight:700;font-variant-numeric:tabular-nums}
.pdelta.up{color:#a8410f}
.pdelta.down{color:var(--green)}
.ref-body .reftable .tnote{display:block;font-size:.76rem;line-height:1.3;font-weight:400;color:var(--muted);margin-top:.15rem}
