/* QuanticData — page fixes of 04/10/2026, linked last in <head> on the blog, best, docs, tools and
   pricing pages. No text or order changes. Two parts:
   1. phones without horizontal page scroll (max-width:640px, the singles-light.css breakpoint: nothing
      changes on tablets and desktops), only how long tokens break and how tables fit;
   2. contrast: the outlined button of the dark closing band on the /best/ pages.
   1. What widened the pages at 390/360px:
   - long unbroken tokens in the copy: URLs, exception names, JSON in inline <code>, a post title such as
     "ERR_TUNNEL_CONNECTION_FAILED" (post headings and the blog cards that repeat it);
   - tables of up to 3 columns that singles-light.css turns into one card per row on phones: the wrapper
     is left overflow:visible on purpose, but the <table> box stayed sized by its widest content
     (pricing, tools) or by .bp-table{min-width:560px} (best), and row headers kept white-space:nowrap;
   - tables placed straight in .wrap with no scrolling wrapper (DE/ES/FR lead posts). */
@media (max-width:640px){
  main :is(p,li,dt,dd,h1,h2,h3,h4,figcaption,blockquote,caption,td,th),main .bcard b{overflow-wrap:break-word}
  html.qd-sgl main :is(.tbl,.table-wrap table,.cmp-scroll table):not(:has(tr>:nth-child(4))){display:block;width:auto;min-width:0;max-width:100%}
  html.qd-sgl main :is(.tbl,.table-wrap table,.cmp-scroll table):not(:has(tr>:nth-child(4))) :is(th,td){white-space:normal}
  html.qd-sgl main .wrap>table{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
}
/* 2. /best/ closing band: a dark island (gradient #222039 -> #0B1020) whose outlined button kept the light
   pages' ink (.btn-outline{color:var(--text)}, 1.04:1). Same rule as the mobile family (mob-for.css). */
html.qd-sgl-best main .final-band .btn-outline{color:#F3F5FB;border-color:rgba(255,255,255,.4);background:transparent}
