/* Overview below the first screen (rework step 6, decision 15), dark behind rw-s6-overview: every rule sits under
   html[data-flag-rw-s6-overview="on"], so with the flag off this file changes nothing. The feed lists show the rows
   that fit (views/overview.js hides the rest), each panel as tall as its rows; the boards panel is no longer fixed;
   the footer names the data sources (srcfoot.js); a phone's Technical Summary card is the Summary dial and two count
   lines (about 300px). */
html[data-flag-rw-s6-overview="on"] .ov-feed .list-row[hidden] { display: none; }
html[data-flag-rw-s6-overview="on"] .ov-feed { min-height: 0; }
html[data-flag-rw-s6-overview="on"] .ov-feed .pb.list { overflow: visible; max-height: none; }
@media (max-width: 699px) { html[data-flag-rw-s6-overview="on"] .ov-feed .list-row.r3 { display: none; } }

:is(html[data-flag-rw-s6-overview="on"], html[data-flag-rw-s6-crypto="on"]) .src-foot {
  display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 20px;
  margin-top: 28px; padding: 16px 4px 4px; border-top: 1px solid var(--line); color: var(--muted); font-size: 0.78rem;
}
:is(html[data-flag-rw-s6-overview="on"], html[data-flag-rw-s6-crypto="on"]) .src-foot .sf-links { display: flex; flex-wrap: wrap; gap: 6px 20px; }
:is(html[data-flag-rw-s6-overview="on"], html[data-flag-rw-s6-crypto="on"]) .src-foot a { display: inline-flex; align-items: center; min-height: 24px; color: var(--muted); } /* (a 24px target with a pointer, 44px on touch below) */
:is(html[data-flag-rw-s6-overview="on"], html[data-flag-rw-s6-crypto="on"]) .src-foot a:hover { color: var(--sky); }
@media (max-width: 699px) { :is(html[data-flag-rw-s6-overview="on"], html[data-flag-rw-s6-crypto="on"]) .src-foot { flex-direction: column; } }
@media (pointer: coarse) { :is(html[data-flag-rw-s6-overview="on"], html[data-flag-rw-s6-crypto="on"]) .src-foot a { display: inline-flex; align-items: center; min-height: 44px; margin-block: -12px; } }

/* The Technical Summary on a phone (about 300px): one head row (the title and the timeframes), the Summary dial and its
   reading, then Oscillators and Moving Averages as two lines each (name and reading, then the three counts, all 12px),
   and one link line. The kicker, the reading chip and Expand leave the card here ((i) stays); the page's Technical Summary
   opens from the link. */
@media (max-width: 699px) {
  html[data-flag-rw-s6-overview="on"] #o-trend .panel-head { flex-wrap: wrap; margin-bottom: 0; } /* (the title takes its own row where it and the timeframes do not fit: 390px and under at default text, and at large text) */
  html[data-flag-rw-s6-overview="on"] #o-trend .ph-t { flex: 1 1 auto; min-width: 6rem; }
  html[data-flag-rw-s6-overview="on"] #o-trend .panel-head .seg button { padding-inline: 7px; }
  @media (pointer: coarse) { html[data-flag-rw-s6-overview="on"] #o-trend .panel-head .seg button { min-height: 2.75rem; } } /* (44px touch targets) */
  html[data-flag-rw-s6-overview="on"] #o-trend .ph-t .kicker { display: none; }
  html[data-flag-rw-s6-overview="on"] #o-trend .ph-t h2 { font-size: 0.9rem; line-height: 1.2; }
  html[data-flag-rw-s6-overview="on"] #o-trend .panel-head .right { flex: none; width: auto; flex-wrap: nowrap; } /* (width: auto: portal.css gives a head with a seg width 100% on a phone, which pushed the page sideways) */
  html[data-flag-rw-s6-overview="on"] #o-trend .panel-head .right > :is(.vb, .ph-max) { display: none; }
  html[data-flag-rw-s6-overview="on"] #o-trend .ts-row { grid-template-columns: minmax(0, 1fr); gap: 0; padding: 0; }
  html[data-flag-rw-s6-overview="on"] #o-trend .ts-g.big { order: -1; gap: 0; padding-bottom: 4px; }
  html[data-flag-rw-s6-overview="on"] #o-trend .ts-g.big > .l, html[data-flag-rw-s6-overview="on"] #o-trend .ts-g.big .tq-counts { display: none; }
  html[data-flag-rw-s6-overview="on"] #o-trend .ts-g.big .tq-dial { margin-top: 4px; height: 4.25rem; width: auto; max-width: 100%; }
  html[data-flag-rw-s6-overview="on"] #o-trend .ts-g.big .tq-verdict { font-size: 1.05rem; }
  html[data-flag-rw-s6-overview="on"] #o-trend .ts-g:not(.big) { grid-template-columns: minmax(0, 1fr) auto; justify-items: stretch; align-items: baseline; gap: 2px 12px; padding: 6px 0; border-top: 1px solid var(--line); }
  html[data-flag-rw-s6-overview="on"] #o-trend .ts-g:not(.big) .tq-dial { display: none; }
  html[data-flag-rw-s6-overview="on"] #o-trend .ts-g:not(.big) > .l { grid-column: 1; grid-row: 1; font-size: 0.75rem; }
  html[data-flag-rw-s6-overview="on"] #o-trend .ts-g:not(.big) .tq-verdict { grid-column: 2; grid-row: 1; justify-self: end; font-size: 0.9375rem; }
  html[data-flag-rw-s6-overview="on"] #o-trend .ts-g:not(.big) .tq-counts { grid-column: 1 / -1; grid-row: 2; justify-content: space-between; gap: 8px; }
  html[data-flag-rw-s6-overview="on"] #o-trend .ts-g:not(.big) .tq-counts span { display: inline-flex; align-items: baseline; gap: 4px; }
  html[data-flag-rw-s6-overview="on"] #o-trend .ts-g:not(.big) .tq-counts small { font: 500 0.75rem/1.3 var(--font); letter-spacing: 0; text-transform: none; }
  html[data-flag-rw-s6-overview="on"] #o-trend .ts-g:not(.big) .tq-counts b { font-size: 0.9375rem; }
  /* (the line under the rows is only its link: the totals, the close time and the source are in the dial, the card's
     rows and the page footer) */
  html[data-flag-rw-s6-overview="on"] #o-trend .panel-foot { margin: -6px 0 -8px; max-width: none; } /* (max-width: none: rw-s5-window's 75ch cap would cut the link) */
  html[data-flag-rw-s6-overview="on"] #o-trend .panel-foot .pf-t { display: none; }
  html[data-flag-rw-s6-overview="on"] #o-trend .panel-foot a { display: inline-flex; align-items: center; min-height: 44px; font-size: 0.8125rem; }
}
