/* ===== v96 · Competitor Watch — Visibility → Competitors → Watch (pages/lwatch.js). No new colours: every colour is a token (light and dark).
   The card system (W8): every Watch card is padded 22 px; the header's rule and each row's rule start at card + 15 (the rows' 8 px bleed), the
   leading icons at card + 23, the titles and row text at card + 56. ===== */

/* ---------- the card system ---------- */
.cps > .sec.panel.cw-card{padding-left:22px;padding-right:22px}
.cps > .sec.panel.cw-card > .sec-hd{margin-left:-8px;margin-right:-8px;padding-left:8px;padding-right:8px;margin-bottom:0}
@media (min-width:901px){.cw-card .sec-hd.pt-hd > .n{flex:1 1 auto}}
.cps > .cw-top + .pl-status{margin-top:14px}
.cw-card .sec-hd.pt-hd > .n a{color:var(--link-tint,var(--link))}
.cps > .sec.panel.cw-top{padding-top:16px;padding-bottom:14px}
.cps .cw-top .kp-strip{margin-bottom:0}
.cps .cw-top .mn-kp .kp-s{max-width:100%;text-wrap:pretty}

/* ---------- the digest line ---------- */
.cw-dg{display:flex;align-items:center;gap:9px;margin:14px -8px 0;padding:12px 8px 0;border-top:1px solid var(--ln-2);min-width:0}
.cw-dg > .sec-ic{flex:none}
.cw-dg-t{margin:0;min-width:0;font-size:var(--t-body);line-height:var(--lh-body);color:var(--fg);text-wrap:pretty}
.cw-dg-t b{font-weight:var(--w-semibold)}
.cw-dg-s{color:var(--fg-3)}
.cw-dg > .grow{flex:1 1 0;min-width:8px}
.cw-dg > .btn{flex:none}

/* the countdown chip (ui/meters.js countdown) — drawn here too, so it looks the same whether or not the meters stylesheet is linked */
.cps .m-cd{display:inline-flex;align-items:center;gap:5px;height:24px;padding:0 9px;border-radius:var(--r-full);background:var(--bg-4);color:var(--fg-2);font-size:var(--t-co);line-height:var(--lh-co);font-weight:var(--w-medium);white-space:nowrap;font-variant-numeric:tabular-nums;flex:none}
.cps .m-cd svg{color:var(--fg-3);flex:none}
.cps .m-cd.is-soon{color:var(--warn)}
/* a read schedule is not a deadline: "tomorrow" stays calm in What we watch */
.cw-wr-r .m-cd.is-soon{color:var(--fg-2)}
.cps .m-cd.is-late{color:var(--neg)}

/* ---------- the feed ---------- */
.cw-list{display:flex;flex-direction:column}
.cw-it{display:grid;grid-template-columns:24px minmax(0,1fr);column-gap:9px;padding:14px 8px 14px;margin:0 -8px;border-top:1px solid var(--ln-2);border-radius:0;scroll-margin:90px}
.cw-list > .cw-it:first-child{border-top:0}
.cw-it:focus-visible{border-radius:var(--r-8)}
.cw-it.is-hi{background:var(--accent-t);border-radius:var(--r-8)}
.cw-it.is-muted .cw-t,.cw-it.is-muted .cw-ba{opacity:.62}
.cw-ic{margin-top:1px}
.cw-body{display:flex;flex-direction:column;gap:6px;min-width:0}
.cw-meta{display:flex;flex-wrap:wrap;align-items:center;gap:0 6px;font-size:var(--t-co);line-height:var(--lh-co);color:var(--fg-3);font-variant-numeric:tabular-nums}
.cw-meta .lbl{height:20px;margin-left:4px;font-size:var(--t-sh);padding:0 8px}
.cw-dot{color:var(--fg-4)}
.cw-who{font-weight:var(--w-semibold);color:var(--fg)}
@media (hover:hover){.cw-who:hover{text-decoration:underline}}
.cw-t{margin:0;font-size:var(--t-hl);line-height:var(--lh-hl);font-weight:var(--w-semibold);color:var(--fg);text-wrap:pretty}
/* before → after */
.cw-ba{display:grid;grid-template-columns:minmax(0,1fr) 20px minmax(0,1fr);align-items:start;gap:8px;padding:9px 12px;border-radius:var(--r-12);background:var(--bg-2);border:1px solid var(--bd-tl)}
.cw-ba p{margin:2px 0 0;font-size:var(--t-body);line-height:var(--lh-body);color:var(--fg-2);text-wrap:pretty;overflow-wrap:anywhere}
.cw-a p{color:var(--fg)}
.cw-arr{display:grid;place-items:center;padding-top:16px;color:var(--fg-4)}
.cw-k{display:block;font-size:var(--t-sh);line-height:var(--lh-sh);font-weight:var(--w-semibold);letter-spacing:.02em;text-transform:uppercase;color:var(--fg-4)}
.cw-k2{font-weight:var(--w-semibold);color:var(--fg)}
/* where it touches you */
.cw-chips{display:flex;flex-wrap:wrap;align-items:center;gap:5px;font-size:var(--t-co);line-height:var(--lh-co)}
.cw-chips > .cw-k2{margin-right:3px}
.cw-chip{max-width:100%;min-width:0}
.cw-chip bdi{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
@media (hover:hover){a.cw-chip:hover{background:var(--bg-5);color:var(--fg)}}
.cw-pos{color:var(--fg-3);font-weight:var(--w-regular)}
/* night fix (Oct 8): on a phone the chip grows with its words — the position never hangs out of a 22px pill */
@media (max-width:600px){.chip.cw-chip,.chip.sm.cw-chip{height:auto;min-height:22px;border-radius:var(--r-12);flex-wrap:wrap;padding-top:2px;padding-bottom:2px}.cw-chip .cw-pos{white-space:nowrap}}
.cw-line{margin:0;font-size:var(--t-co);line-height:var(--lh-co);color:var(--fg-2);text-wrap:pretty;max-width:120ch}
.cw-line a{color:var(--link-tint,var(--link))}
.cw-how{display:flex;gap:6px;align-items:flex-start;color:var(--fg-3)}
.cw-how svg{flex:none;margin-top:2px;color:var(--fg-4)}
.cw-more{display:flex;flex-direction:column;gap:6px;padding-top:2px}
/* notes */
.cw-notes{display:flex;flex-direction:column;gap:4px}
.cw-note{display:flex;align-items:center;gap:8px;font-size:var(--t-co);line-height:var(--lh-co);color:var(--fg-2)}
.cw-note .pt-nc{display:inline-flex;align-items:center;gap:4px;height:20px;padding:0 7px;border-radius:var(--r-full);background:var(--bg-3);font-size:var(--t-sh);font-weight:var(--w-medium);color:var(--fg-2);flex:none}
.cw-note-t{min-width:0;text-wrap:pretty}
.cw-note-m{color:var(--fg-3)}
.cw-note-x{flex:none;margin-left:auto;font-size:var(--t-co)}
.cw-nform{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.cw-nform .tx-in{flex:1 1 320px;width:auto}
.cw-nhint{flex:1 0 100%;margin:0;font-size:var(--t-sh);line-height:var(--lh-sh);color:var(--fg-3)}
/* the actions row */
.cw-acts{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding-top:2px}
.cw-acts > .grow{flex:1 1 0;min-width:8px}
.cw-acts .btn.ghost{color:var(--fg-2)}
.cw-lnk{display:inline-flex;align-items:center;gap:3px;font-size:var(--t-co);line-height:var(--lh-co);font-weight:var(--w-medium);color:var(--fg-3);padding:3px 6px;border-radius:var(--r-full);white-space:nowrap}
@media (hover:hover){.cw-lnk:hover{background:var(--hover);color:var(--fg)}}
.cw-foot{display:flex;align-items:center;gap:6px;margin:4px -8px 0;padding:12px 8px 2px;border-top:1px solid var(--ln-2);font-size:var(--t-co);line-height:var(--lh-co);color:var(--fg-3)}
.cw-foot svg{color:var(--fg-4);flex:none}
.cw-foot a{color:var(--link-tint,var(--link))}
.cw-feed .empty{padding:28px 0}

/* ---------- what we watch ---------- */
.cw-wlist{display:flex;flex-direction:column}
.cw-wrow{margin:0 -8px;border-top:1px solid var(--ln-2)}
.cw-wlist > .cw-wrow:first-child{border-top:0}
.cw-wrow.is-open{background:var(--bg-2);border-radius:var(--r-8)}
.cw-wrow.is-open + .cw-wrow{border-top-color:transparent}
.cw-wr{display:grid;grid-template-columns:24px minmax(0,1fr) auto;align-items:center;column-gap:9px;padding:12px 8px}
.cw-av{width:24px;height:24px;border-radius:var(--r-full);display:grid;place-items:center;color:var(--on-fill);font-size:var(--t-sh);font-weight:var(--w-semibold);flex:none}
.cw-wr-b{min-width:0;display:flex;flex-direction:column;gap:2px}
.cw-wr-t{font-size:var(--t-body);line-height:var(--lh-body);color:var(--fg);min-width:0}
.cw-role{color:var(--fg-3)}
.cw-wr-s{margin:0;font-size:var(--t-co);line-height:var(--lh-co);color:var(--fg-3);text-wrap:pretty}
.cw-wr-r{display:flex;align-items:center;gap:12px;flex:none}
.cw-al-ro{font-size:var(--t-co);color:var(--fg-3)}
/* the watch sheet for one competitor */
.cw-ed{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px 24px;padding:4px 8px 14px 41px}
.cw-fs{margin:0;padding:0;border:0;min-width:0;display:flex;flex-direction:column;gap:6px}
.cw-fs legend{padding:0;margin-bottom:4px;font-size:var(--t-co);line-height:var(--lh-co);font-weight:var(--w-semibold);color:var(--fg)}
.cw-ck{display:grid;grid-template-columns:16px minmax(0,1fr);gap:8px;align-items:start;cursor:pointer}
.cw-ck input{margin:2px 0 0;width:14px;height:14px;accent-color:var(--accent)}
.cw-ck.is-off{cursor:default;opacity:.55}
.cw-ck-t{display:flex;flex-direction:column;min-width:0}
.cw-ck-t b{font-size:var(--t-co);line-height:var(--lh-co);font-weight:var(--w-medium);color:var(--fg);overflow-wrap:anywhere}
.cw-ck-t span{font-size:var(--t-sh);line-height:var(--lh-sh);color:var(--fg-3);text-wrap:pretty}
.cw-fs-n{margin:2px 0 0;font-size:var(--t-sh);line-height:var(--lh-sh);color:var(--fg-3)}
.cw-ed-b{grid-column:1 / -1;display:flex;align-items:center;gap:6px}
.cw-ed-b > .grow{flex:1 1 0}

/* ---------- the digest preview (a dialog) ---------- */
.cw-scrim{position:fixed;inset:0;z-index:950;display:grid;place-items:center;padding:24px 16px;background:var(--scrim);animation:dp-fade var(--dur-2) var(--ease-out)}
.cw-sheet{width:min(640px,100%);max-height:calc(100vh - 48px);overflow:auto;display:flex;flex-direction:column;gap:14px;padding:18px 22px 18px;border-radius:var(--r-card);background:var(--lvl-0);border:1px solid var(--bd-tl);box-shadow:var(--sh-high);outline:none;animation:dp-rise var(--dur-3) var(--ease-out)}
.cw-sheet-hd{display:flex;align-items:center;gap:9px}
.cw-sheet-hd h2{margin:0;font-size:var(--t-t3);line-height:var(--lh-t3);font-weight:var(--w-semibold);color:var(--fg)}
.cw-sheet-hd > .grow{flex:1 1 0}
.cw-mail{border:1px solid var(--ln-2);border-radius:var(--r-12);background:var(--bg-2);overflow:hidden}
.cw-mail-h{display:grid;grid-template-columns:64px minmax(0,1fr);gap:4px 10px;margin:0;padding:12px 16px;border-bottom:1px solid var(--ln-2);font-size:var(--t-co);line-height:var(--lh-co)}
.cw-mail-h dt{color:var(--fg-3)}
.cw-mail-h dd{margin:0;color:var(--fg-2);min-width:0;text-wrap:pretty}
.cw-mail-h dd b{color:var(--fg);font-weight:var(--w-semibold)}
.cw-mail-b{padding:14px 16px 16px;display:flex;flex-direction:column;gap:8px;background:var(--lvl-0);font-size:var(--t-body);line-height:var(--lh-body);color:var(--fg-2)}
.cw-mail-b h3{margin:8px 0 0;font-size:var(--t-co);line-height:var(--lh-co);font-weight:var(--w-semibold);letter-spacing:.02em;text-transform:uppercase;color:var(--fg-3)}
.cw-mail-b p{margin:0;text-wrap:pretty}
.cw-em-k{font-size:var(--t-co);color:var(--fg-3)}
.cw-em-l{margin:0;padding:0;list-style:none;display:flex;flex-direction:column}
.cw-em-i{display:grid;grid-template-columns:64px minmax(0,1fr);gap:10px;padding:8px 0;border-top:1px solid var(--ln-3)}
.cw-em-l > .cw-em-i:first-child{border-top:0;padding-top:2px}
.cw-em-d{font-size:var(--t-co);line-height:var(--lh-body);color:var(--fg-3);font-variant-numeric:tabular-nums}
.cw-em-i b{display:block;font-weight:var(--w-semibold);color:var(--fg)}
.cw-em-i p{font-size:var(--t-co);line-height:var(--lh-co);color:var(--fg-3)}
.cw-em-n{font-size:var(--t-co);color:var(--fg-3)}
.cw-em-f{margin-top:8px!important;padding-top:10px;border-top:1px solid var(--ln-3);font-size:var(--t-sh);line-height:var(--lh-sh);color:var(--fg-3)}
.cw-sheet-n{display:flex;gap:6px;align-items:flex-start;margin:0;font-size:var(--t-co);line-height:var(--lh-co);color:var(--fg-3)}
.cw-sheet-n svg{flex:none;margin-top:2px}
.cw-sheet-b{display:flex;align-items:center;gap:6px}
.cw-sheet-b > .grow{flex:1 1 0}

/* the section's tabs: seven since Watch joined — at narrower widths the gaps close and, at 960 px and under, the icons give way so every label shows */
@media (max-width:1320px){.cps .pl-tabs{gap:20px}}
@media (max-width:1200px){.cps .pl-tabs{gap:16px}.cps .pl-tabs .pl-tab > svg{display:none}}

/* Their changes: the "In Watch" link on a block that is a ledger row */
.cp-blk-f .cp-inw{display:inline-flex;align-items:center;gap:3px;margin-left:12px}

/* ---------- widths ---------- */
@media (max-width:1320px){.cw-ed{grid-template-columns:repeat(2,minmax(0,1fr))}.cw-ed > .cw-fs:nth-child(3){grid-column:1 / -1}}
@media (max-width:1100px){.cw-dg{flex-wrap:wrap;row-gap:8px}.cw-dg-t{flex:1 1 calc(100% - 40px)}.cw-dg > .grow{display:none}.cw-dg > .m-cd{margin-left:33px}}
@media (max-width:900px){
  .cps .cw-top .kp-strip{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cps .cw-top .kp-strip > .kp:nth-child(2n+1){border-left:0}
  .cps .cw-top .kp-strip > .kp:nth-child(n+3){border-top:1px solid var(--ln-2)}
  .cps .cw-top .kp-strip > .kp:nth-child(5){grid-column:1 / -1}
  .cw-ba{grid-template-columns:minmax(0,1fr)}.cw-arr{display:none}
  .cw-wr{grid-template-columns:24px minmax(0,1fr);row-gap:8px}.cw-wr-r{grid-column:2;flex-wrap:wrap;gap:8px 12px}
  .cw-ed{grid-template-columns:minmax(0,1fr);padding-left:41px}.cw-ed > .cw-fs:nth-child(3){grid-column:auto}
}
@media (prefers-reduced-motion:reduce){.cw-it{scroll-behavior:auto}}

/* ===== v101 (Visibility loop 2, V2-1 · V2-4 · V2-10) — Watch is the one feed of their moves ===== */
/* six tabs again (Their changes became Watch's "Rank moves" view): the narrow-width tab rules above still hold */
/* what it did to you — the block's line, once; a loss in a neutral colour (a competitor's move is evidence, not an alarm) */
.cw-eff{color:var(--fg-2)}
.cw-eff.is-hurt .cw-k2{color:var(--fg)}
.cw-did{color:var(--fg-2)}
.cw-it.is-rank .cw-t{font-weight:var(--w-semibold)}
.cw-rem{display:inline-flex;align-items:center;gap:4px;margin-left:4px;color:var(--fg-3);font-size:var(--t-sh)}
.cw-rem svg{color:var(--fg-4)}
/* the ⋯ menu on a row: a 28 px square, aligned with the row's last edge */
.cw-acts .cw-mb{width:28px;min-width:28px;height:28px;padding:0;display:inline-grid;place-items:center;color:var(--fg-2);border-radius:var(--r-8)}
.cw-acts .cw-mb.is-open{color:var(--fg);background:var(--hover)}@media (hover:hover){.cw-acts .cw-mb:hover{color:var(--fg);background:var(--hover)}}
.cw-acts .cw-mb svg{width:16px;height:16px}
.cw-pgs{display:flex;flex-wrap:wrap;gap:5px}
.cw-diff{margin-top:2px}
/* the folded "other moves" */
.cw-other{margin:6px -8px 0;padding:10px 8px 0;border-top:1px solid var(--ln-2)}
.cw-other > .cp-more{display:inline-flex;align-items:center;gap:4px;font-size:var(--t-co)}
.cw-list.is-other{margin-top:6px}
.cw-list.is-other > .cw-it:first-child{border-top:1px solid var(--ln-2)}
/* moves answered — the Mentions row grid (state · what · go) */
.cps > .sec.panel.cw-card#cw-ans .mn-gl{margin-top:4px}
.cw-ans-r{grid-template-columns:170px minmax(0,1fr) 120px}
.cw-ans-r .k{white-space:normal;text-wrap:pretty}
.cw-ans-go{display:flex;justify-content:flex-end;font-size:var(--t-co)}
.cw-ans-go .lk{display:inline-flex;align-items:center;gap:3px}
.cw-none{margin:6px 0 0;font-size:var(--t-co);line-height:var(--lh-co);color:var(--fg-3)}
@media (max-width:900px){.cw-ans-r{grid-template-columns:minmax(0,1fr);row-gap:4px}.cw-ans-go{justify-content:flex-start}}
.cw-all{display:inline-flex;margin-top:8px;font-size:var(--t-co)}
/* v101: the ⋯ menu stays on the row's line at every width — never alone on a line of its own */
.cw-acts > .cw-mb{margin-left:auto}
@media (max-width:900px){.cw-acts > .grow{flex-basis:100%;height:0;display:none}}