/* passive.investments — shared table fixes (Sept 25, 2026)
   Loaded after site.css / guide.css on every page that has a table.
   1. Words never break mid-letter (.wpc sets overflow-wrap:anywhere, which also crushed columns).
   2. Tidier header type on desktop.
   3. Phones: text-heavy tables (class t-stack) become one card per row, labelled from the header;
      numeric/short tables stay tables and scroll sideways inside .table-wrap if they must. */

:is(body.guide.guide,body) :is(.prose,.wpc) table th,
:is(body.guide.guide,body) :is(.prose,.wpc) table td{overflow-wrap:break-word;word-break:normal;hyphens:manual}

:is(body.guide.guide,body) .table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
:is(body.guide.guide,body) .comparison .table-wrap{margin:0;border-radius:0}

/* desktop header polish */
:is(body.guide.guide,body) :is(.prose,.wpc) thead th{letter-spacing:.1em;line-height:1.35;vertical-align:bottom}
:is(body.guide.guide,body) :is(.prose,.wpc) table.t-stack td:first-child{min-width:8.5em}

/* pre-existing: returns-table cells were #ccc on a light background (unreadable) */
:is(body.guide.guide,body) .wpc .returns-table td{color:var(--ink-soft,#333);border-bottom-color:var(--rule-soft,#eee)}

@media (max-width:640px){
  /* short / numeric tables: keep the grid, just make it fit */
  :is(body.guide.guide,body) :is(.prose,.wpc) table{font-size:13.5px;min-width:0!important}
  :is(body.guide.guide,body) :is(.prose,.wpc) table th{letter-spacing:.05em!important;font-size:11px!important;padding:11px 10px!important}
  :is(body.guide.guide,body) :is(.prose,.wpc) table td{padding:11px 10px!important}

  /* text-heavy tables: one card per row */
  :is(body.guide.guide,body) :is(.prose,.wpc) table.t-stack{display:block;width:100%;min-width:0!important;border:0;background:none;border-radius:0;overflow:visible;font-size:15px;margin:1.2em 0 1.8em}
  :is(body.guide.guide,body) :is(.prose,.wpc) table.t-stack thead,
  :is(body.guide.guide,body) :is(.prose,.wpc) table.t-stack tr.t-hrow{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  :is(body.guide.guide,body) :is(.prose,.wpc) table.t-stack colgroup{display:none}
  :is(body.guide.guide,body) :is(.prose,.wpc) table.t-stack tbody{display:block}
  :is(body.guide.guide,body) :is(.prose,.wpc) table.t-stack tr{display:block;background:var(--paper,#fff);border:1px solid var(--rule,#e6e1d6);border-top:3px solid var(--gold,#B8962E);border-radius:10px;padding:2px 0 8px;margin:0 0 14px;box-shadow:0 1px 2px rgba(0,0,0,.04)}
  :is(body.guide.guide,body) :is(.prose,.wpc) table.t-stack td,
  :is(body.guide.guide,body) :is(.prose,.wpc) table.t-stack tbody th{display:block;width:auto!important;min-width:0;border:0!important;padding:8px 16px!important;text-align:left!important;line-height:1.5;background:none}
  :is(body.guide.guide,body) :is(.prose,.wpc) table.t-stack td[data-label]::before,
  :is(body.guide.guide,body) :is(.prose,.wpc) table.t-stack tbody th[data-label]::before{content:attr(data-label);display:block;font-family:var(--sans,system-ui,-apple-system,sans-serif);font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#8A6F1F;margin:0 0 3px;font-style:normal}
  :is(body.guide.guide,body) :is(.prose,.wpc) table.t-stack tr > :first-child{font-family:var(--serif,Georgia,serif);font-size:18px;font-weight:600;color:var(--ink,#111);line-height:1.3;padding:14px 16px 10px!important;margin:0 0 4px;border-bottom:1px solid var(--rule-soft,#eee)!important}
  :is(body.guide.guide,body) :is(.prose,.wpc) table.t-stack tr > :first-child::before{display:none!important}
  :is(body.guide.guide,body) :is(.prose,.wpc) .table-wrap:has(> table.t-stack){overflow:visible;border:0;background:none}
}
