/* report-business.css: act two of the subscriber's page, "your business" (report-business.js). Drawn in the
 * report's own tokens and components; this file only lays out what the act adds: the chapter head with its
 * plan words and clock, the reading line, the fifteen-reading sparkline, the plain tiles fallback, and the quiet
 * locked lines at the end of the act. Phone first: everything wraps at 375 px; a table scrolls sideways inside
 * .rep-table-wrap on a tablet, and below 560 px each of its rows is two stacked lines (the review of 27 Sep, rule 3). */
.yb-act::before{white-space:nowrap}
.yb-card h2{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px}
.yb-card h2 .yb-title{font:inherit;color:inherit}
.yb-card h2 .yb-sub{font:500 11px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink3)}
.yb-card h2 .yb-plan{font:600 11px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--gold)}
.yb-card h2 .mi-dbadge,.yb-card h2 .mi-unchanged{margin-left:0}
.yb-badge{cursor:default}
.yb-clock{margin-left:auto;font:500 10px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink3);white-space:nowrap}
.yb-clock.today{color:var(--mint)}
.yb-fresh{font:500 10px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--gold);margin:0 0 8px}
.yb-line{font-size:.92rem;line-height:1.55;color:var(--ink);margin:0 0 12px;max-width:72em}
.yb-more{font:500 11.5px var(--mono);letter-spacing:.02em;color:var(--ink3);margin:10px 0 0;max-width:72em}
.yb-tablewrap{margin-top:12px}
.yb-tablebox .yb-tablewrap{margin-top:0}
.yb-table td.yb-sparkcell{padding-top:4px;padding-bottom:4px;min-width:140px}
.yb-spark{display:block;width:132px;height:28px;overflow:visible}
.yb-spark polyline{fill:none;stroke:var(--mint);stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round}
.yb-spark circle{fill:var(--mint)}
.yb-spark-none{font:500 10px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink3);white-space:nowrap}
.yb-tiles{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));margin-top:12px}
.yb-tile{background:var(--surface2);border:1px solid var(--line);border-radius:10px;padding:12px 12px 10px;min-height:76px}
.yb-tile .v{font:700 26px/1 var(--disp);color:var(--gold)}
.yb-tile.mint .v{color:var(--mint)}.yb-tile.bad .v{color:var(--bad)}.yb-tile.ink .v{color:var(--ink)}
.yb-tile .l{font:11px/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink3);margin-top:6px}
.yb-card .rp-tiles{margin-top:12px}
.yb-head .rep-actline{max-width:72em}
.yb-locked{list-style:none;margin:8px 0 0;padding:0;border-top:1px solid var(--line2)}
.yb-lockedrow{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 16px;padding:9px 0;border-bottom:1px solid var(--line2);font-size:.86rem;color:var(--ink2)}
.yb-lockedsays{flex:1 1 22em;max-width:60em}
.yb-lockedon{font:600 10px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--gold);white-space:nowrap}

/* ── the review of 27 Sep: its display rules for act two ───────────────────────────────────────────────────── */
/* rule 1: the heading row never prints the title the kicker says; the heading keeps it for a screen reader alone */
.yb-card h2 .yb-vh{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
/* P1-3: what the brief above counted from this chapter, and since when */
.yb-letter{font-size:.86rem;line-height:1.5;color:var(--ink2);margin:-4px 0 12px;max-width:72em}
.yb-letter a,.yb-markets a{color:var(--mint);text-decoration:underline;text-underline-offset:2px}
/* every market of the plan, named, and linked */
.yb-markets{font-size:.86rem;line-height:1.55;color:var(--ink2);margin:0 0 12px;max-width:72em}
.yb-markets strong{color:var(--ink);font-weight:600}
/* rule 3: a long list shows eight rows and folds the rest behind one button; it never scrolls inside the page */
.yb-tablebox{margin-top:12px}
.yb-table tr[hidden]{display:none}
.yb-showall{margin-top:8px;min-height:44px;padding:8px 18px;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--ink);font:600 12.5px var(--body);cursor:pointer}
.yb-showall:hover,.yb-showall:focus-visible{border-color:var(--ink3);outline:none}
.yb-tablebox .mi-source{margin-top:8px}
/* rule 4: the AI answers, one row a question and a chip an assistant; a chip never wraps */
.yb-chips{display:flex;flex-wrap:wrap;gap:4px 6px}
.yb-chip{display:inline-block;white-space:nowrap;padding:2px 9px;border:1px solid var(--line);border-radius:999px;font:500 11px/1.6 var(--mono);color:var(--ink3)}
.yb-chip.named{border-color:rgba(67,213,151,.4);background:var(--mint-soft);color:var(--mint)}
.yb-chip.miss{border-color:rgba(236,118,99,.45);color:var(--bad)}
/* the ChatGPT sources and ads round (2 Oct 2026): the lists the AI leaned on, under the AI chapter's table; wraps on a phone */
.yb-src{margin:12px 0 0}
.yb-src-h{margin:0;font-size:.86rem;color:var(--ink2)}
.yb-src-k{margin:8px 0 2px;font:600 10px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--gold)}
.yb-src-list{list-style:none;margin:0;padding:0}
.yb-src-row{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;padding:4px 0;border-bottom:1px dashed var(--line2)}
.yb-src-row:last-child{border-bottom:0}
.yb-src-name{font-weight:600;color:var(--ink)}
.yb-src-n{font:500 11px var(--mono);color:var(--ink3)}
/* rule 7: the act's one last card, "Add to your plan", holding what a higher plan reads; outline buttons only */
.yb-endcard>h2{margin:0}
.yb-also{margin-top:18px;padding-top:14px;border-top:1px solid var(--line2)}
.yb-also:first-child,.yb-endcard h2+.yb-also{margin-top:0;padding-top:0;border-top:0}
.yb-also-h{font:700 1.05rem/1.3 var(--disp);letter-spacing:.02em;color:var(--ink);margin:0 0 4px}
.yb-also-l{font-size:.86rem;line-height:1.5;color:var(--ink2);margin:0 0 4px;max-width:60em}
.yb-plansbtn{display:inline-flex;align-items:center;min-height:44px;margin-top:14px;padding:10px 18px;border:1px solid var(--gold-line);border-radius:999px;background:transparent;color:var(--gold);font:600 13px var(--body);text-decoration:none;box-sizing:border-box}
.yb-plansbtn:hover,.yb-plansbtn:focus-visible{border-color:var(--gold);background:var(--gold-soft);outline:none}
@media (max-width:640px){
  .yb-clock{margin-left:0;flex-basis:100%;white-space:normal}
  .yb-card h2 .yb-sub{flex-basis:100%}
  .yb-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
}
/* rule 3 on a phone, or wherever the chapter is as narrow (a tablet's column beside the rail): each row two stacked lines,
   its first two cells (the name, and what moved or the key figure) on the first, the rest under them each with its heading;
   no sideways scroll, no pinned column. The table's own box decides (a container query), so the rule holds at any width */
.yb-tablebox{container:ybt/inline-size}
@container ybt (max-width:560px){
  .yb-tablewrap{overflow:visible;padding:0 10px}
  .yb-tablewrap .yb-table,.yb-tablewrap .yb-table tbody{display:block;width:100%}
  .yb-tablewrap .yb-table thead{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
  .yb-tablewrap .yb-table tr{display:flex;flex-wrap:wrap;align-items:baseline;gap:3px 10px;padding:9px 0;border-bottom:1px solid var(--line2)}
  .yb-tablewrap .yb-table tr:last-child{border-bottom:0}
  .yb-tablewrap .yb-table tr[hidden]{display:none}
  .yb-tablewrap .yb-table tr::after{content:"";flex-basis:100%;height:0;order:2}
  .yb-tablewrap .yb-table td{display:block;position:static;padding:0;border:0;background:none;font-size:.8rem}
  .yb-tablewrap .yb-table td:nth-child(1){order:1;flex:1 1 auto;min-width:45%;max-width:100%;color:var(--ink);font-size:.88rem;overflow-wrap:anywhere}
  .yb-tablewrap .yb-table td:nth-child(2){order:1;flex:0 0 auto;margin-left:auto;text-align:right;white-space:nowrap}
  .yb-tablewrap .yb-table td.nil{display:none}
  .yb-tablewrap .yb-table td:nth-child(n+3){order:3;flex:0 1 auto;color:var(--ink2)}
  .yb-tablewrap .yb-table td[data-label]::before{content:attr(data-label) " ";font:500 9.5px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink3)}
  .yb-tablewrap .yb-table tr.you{background:var(--gold-soft);margin:0 -10px;padding-left:10px;padding-right:10px}
  .yb-tablewrap .yb-table tr.you td{background:none}
  .yb-tablewrap .yb-table td.yb-sparkcell,.yb-tablewrap .yb-table td.yb-chipcell{flex-basis:100%;min-width:0}
}
@media print{
  .yb-clock{color:#555}
  .yb-spark polyline{stroke:#222}.yb-spark circle{fill:#222}
  .yb-plansbtn,.yb-showall{display:none}
  .yb-table tr[hidden]{display:table-row}
}

/* Angi-HomeAdvisor's tip (the owner's ruling of 2 Oct): a small button, its words a tooltip on hover, focus or a tap; off paper */
.yb-ah{position:relative;display:inline-flex;align-items:center;margin-left:6px;vertical-align:1px}
.yb-ah-btn{width:18px;height:18px;border-radius:999px;border:1px solid var(--line);background:transparent;color:var(--ink3);font:600 11px/1 var(--mono);cursor:help;padding:0}
.yb-ah-btn:hover,.yb-ah-btn:focus-visible{color:var(--gold);border-color:var(--gold)}
.yb-ah-btn:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.yb-ah-tipbox{display:none;position:absolute;left:0;top:calc(100% + 6px);z-index:30;width:260px;max-width:72vw;padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:var(--surface2,#151b18);color:var(--ink2);font:400 12px/1.45 var(--body);white-space:normal}
.yb-ah:hover .yb-ah-tipbox,.yb-ah-btn:focus-visible + .yb-ah-tipbox,.yb-ah.open .yb-ah-tipbox{display:block}
.yb-ah-line{margin:6px 0 0;font-size:.82rem;color:var(--ink3)}
@media print{.yb-ah,.yb-ah-line{display:none !important}}