/* declutter.css — the 2026-08-31 client-feedback pass (Matt Slater).
   ===================================================================
   Loaded LAST, after app.css, live.css, redesign.css and disclose.css, and it
   only overrides. Same discipline mf-redesign used for redesign.css: a 46 KB
   app.css that three finished tasks all wrote into is not a good shared write
   surface, and keeping this pass in its own file means it can be reverted with
   one <link>.

   THE BRIEF WAS THREE REMOVALS, ALL PRESENTATION:
     1. the scrolling ticker tape across the top — deleted (markup + builder +
        the rules that styled it; there is nothing left here to override)
     2. the amber "READ THIS" banner — deleted; the disclosure sentence it
        carried is not deleted, it moved into .meta below the filter row
     3. the two paragraphs narrating the listing floor and the plausibility
        guard — replaced by the counts plus one control

   NOTHING BEHAVIOURAL MOVED. The listing floor and the plausibility guard are
   ingest-side and untouched. This file cannot switch a filter off; it only
   decides how much vertical space the page spends explaining them, which was
   the actual complaint.

   VERTICAL BUDGET, measured on the LIVE page before and after by
   tools/declutter-shots.mjs (offset of the first table row, in CSS px):

     1440x900   637 -> 511   the fold screenshot shows 6 rows, was 4
      390x844   506 -> 390   4 rows, was 3
      360x780   526 -> 390   4 rows, was 3

   Two thirds of that is the two removed bars; the rest is the four stacked
   blocks becoming one strip. The stat cards are the remaining cost above the
   table and they are mf-redesign's, already halved once — not touched here. */

/* ================================================================ the strip ==
   One compact block between the filter chips and the table header, holding
   everything that used to be four stacked blocks. It reads as a caption on the
   table rather than as a banner on the page: muted, small, no fill, no border
   except the hairline the .tools row already draws above it. */
.meta {
  padding: 8px 0 9px;
  border-bottom: 1px solid var(--line);
}

/* ------------------------------------------------------------- the counts ---
   Listed / excluded, and the control. Both numbers are always visible: a filter
   whose count is hidden is a silent filter, and "0 excluded as implausible" is
   the only way a reader can see the plausibility guard is running. */
.meta-line {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 14px;
  margin: 6px 0 0;
  font-size: 12px;
  line-height: 1.5;
  color: var(--faint);
}
.meta-line b { color: var(--text-2); font-weight: 700; }
.meta-guard { display: inline-flex; flex-wrap: wrap; gap: 4px 14px; }
/* Zero is the normal state and reads quietly. A non-zero count is a real event
   and is allowed to be louder — colour is reinforcement, the number carries the
   meaning on its own. */
.meta-hot b { color: var(--down); }
.meta-line button {
  display: inline; padding: 0;
  border: 0; background: none; font: inherit; font-weight: 600;
  color: var(--accent); text-decoration: underline; text-underline-offset: 2px;
  cursor: pointer;
}
.meta-line button:hover { color: var(--accent-2); }
.meta-line button:focus-visible { outline: 2px solid var(--accent-2); outline-offset: 2px; }

/* --------------------------------------------------------- the open panel ---
   Everything that used to be printed above the table, unchanged in wording and
   now one click away. Reuses .untraded's card and list styling so the excluded
   launches look the same as they always did. */
.meta-x { margin-top: 10px; font-size: 12.5px; line-height: 1.55; color: var(--muted); }
.meta-x section + section { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line); }
.meta-x h4 {
  margin: 0 0 6px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--text-2);
}
.meta-x p { margin: 0 0 8px; }
.meta-x p:last-child { margin-bottom: 0; }
.meta-x b { color: var(--text-2); font-weight: 700; }
.meta-x button {
  padding: 0; border: 0; background: none; font: inherit; font-weight: 600;
  color: var(--accent); text-decoration: underline; cursor: pointer;
}
/* THE ANOMALY LIST NEEDS ITS OWN GRID RESTATED HERE, and this is not tidying.
   The panel reuses app.css's `.untraded` card, and `.untraded ul` (0,1,1) beats
   `.anomaly-list` (0,1,0) on specificity regardless of source order — so the
   excluded-coin rows would silently inherit the untraded list's auto-fill grid
   and lose their four-column layout. It would not be visible today (the guard
   currently excludes 0 coins, so the list is empty) and would appear the first
   time the guard actually fires, which is exactly when it must be readable. */
.meta-x .anomaly-list {
  margin: 11px 0 0; padding: 11px 13px; list-style: none;
  border: 1px solid var(--line); border-radius: var(--r); background: var(--surface-2);
  display: block;
  max-height: 320px; overflow-y: auto;
  grid-template-columns: none;
  gap: 0;
}
.meta-x .anomaly-list li {
  display: grid; gap: 2px 10px; padding: 7px 0;
  grid-template-columns: minmax(90px, auto) minmax(48px, auto) auto 1fr;
  border-top: 1px solid var(--line);
  border-bottom: 0;
  font-size: 12px;
}
.meta-x .anomaly-list li:first-child { border-top: 0; padding-top: 0; }
.meta-x .anomaly-list li em { margin-left: 0; }
@media (max-width: 640px) {
  .meta-x .anomaly-list li { grid-template-columns: 1fr auto; }
  .meta-x .anomaly-list li em { grid-column: 1 / -1; }
}

/* ====================================== the disclosure, now under the table ==
   SECOND PASS, 2026-08-31 (mf-declutter2). Matt asked again for the header
   disclosure line to go, naming the sentence. It is not gone from the site: the
   whole block moved from the strip above the table (#metaBar) to #dscFoot,
   directly below the pager. The .meta-dsc rules that used to live here — the
   ones that squashed the panel down to a 12.5px caption so it could sit above
   the table — went with it. They are DELETED rather than left dangling: nothing
   carries that class any more, and a stylesheet full of rules for elements that
   do not exist is how the next person loses an hour.

   Below the table the constraint is inverted. There is no vertical budget to
   defend down here, and the brief asks for "a clearly readable block", so this
   goes the other way: full reading size, a real card, and breathing room above
   it so it does not read as another row of the table. The base .dsc-panel card
   in disclose.css is exactly that already, so most of this is spacing plus the
   two places the base sizes need to grow. */
.dscfoot {
  display: block;
  margin: 26px 0 4px;
}
.dscfoot-panel {
  margin: 0;
  /* The reason this block exists is that we print real company logos and real
     company names beside memecoins. Give it a visible edge rather than letting
     it dissolve into the page furniture — the accent rail is the same device
     the coin-page disclosure block uses. */
  border-color: var(--line-2);
  border-left: 3px solid var(--accent-2);
  background: var(--surface-2);
  /* disclose.css reserves 44px for a closed panel. This one wraps to two lines
     at narrow widths, so let it measure itself rather than jumping on scroll. */
  content-visibility: visible;
  contain-intrinsic-size: auto;
}
.dscfoot-panel > summary {
  padding: 13px 15px;
  font-size: 14.5px;
  line-height: 1.55;
  align-items: baseline;
}
.dscfoot-panel .dsc-1 { display: inline; color: var(--text-2); }
.dscfoot-panel .dsc-1 strong { color: var(--text); font-weight: 680; }
.dscfoot-panel .dsc-more { font-size: 14px; margin-left: 4px; }
.dscfoot-panel > summary::after { margin-left: 10px; }
.dscfoot-panel > .dsc-body { padding: 2px 15px 14px; }

/* ============================================== a price we do not have =======
   The 68 coins with no dollar price (see priceCell() in app.js) say "Unknown"
   in the price column instead of showing a dash there. It is set in the same
   tabular figures as the prices around it and aligned the same way, so the
   column does not lose its shape — but it is muted, italic and dotted-underlined
   so it reads as a stated absence with an explanation behind it, not as a
   number and not as a blank cell. The dotted underline is the same affordance
   the [i] column tooltips use. */
.px-unk {
  color: var(--faint);
  font-style: italic;
  font-size: 12.5px;
  letter-spacing: .01em;
  border-bottom: 1px dotted var(--line-2);
  cursor: help;
}
/* The whole row is quietened one step, the same way a dead pool is. It is a
   real listed coin and it keeps every other figure it has — it just stops
   competing for the eye with the rows that have a price. */
.tbl tbody tr.is-nopx .c-mc,
.tbl tbody tr.is-nopx .c-vol { color: var(--faint); }

/* ================================================================== narrow ==
   The phone is where the removed blocks cost the most: the banner alone wrapped
   to ~100px there. Nothing needs to be hidden at this width — the strip is
   already three short lines — so every count and the control stay reachable on
   a phone, which they were not before (the excluded control was display:none
   under 760px). */
@media (max-width: 760px) {
  .meta { padding: 7px 0 8px; }

  /* DELIBERATE REVERSAL of redesign.css's `#showUntraded { display: none }`.
     That rule was right for the page it was written against: the control sat at
     the end of a paragraph of prose, wrapped the line onto a second row, and
     only opened a list of never-traded launches — a desktop research task.
     It is wrong for this page. The control is now the ONLY route on a phone to
     the listing rule, the plausibility guard's reasoning and the excluded rows,
     because that copy no longer sits on the page for anyone. Hiding it here
     would mean a phone reader can see "1 excluded as implausible" and has no
     way to find out which coin or why — a filter they can count but not audit.
     The line it wraps is now four words instead of a paragraph. */
  #showUntraded { display: inline; }
  .meta-line { font-size: 11.5px; gap: 3px 12px; margin-top: 5px; }
  .meta-x { font-size: 12px; }
  .meta-x .anomaly-list { max-height: 260px; }

  /* The foot block keeps its reading size on a phone — it is the last thing on
     the page and nothing is competing with it for space here. It only loses a
     little horizontal padding, and the "What am I looking at?" link is allowed
     to wrap onto its own line rather than forcing a horizontal scroll: .dsc-more
     is `white-space: nowrap` in disclose.css, which is right in a one-line strip
     and wrong in a two-line block at 360px. */
  .dscfoot { margin: 20px 0 4px; }
  .dscfoot-panel > summary { padding: 12px 13px; font-size: 14px; }
  .dscfoot-panel > .dsc-body { padding: 2px 13px 13px; }
  .dscfoot-panel .dsc-more { display: inline-block; margin-left: 0; }
}