/* scan.css — what the Scanner, "Tonight" and the Market page share (common.css is the site's look; this file is only
   the pieces these three pages have in common: the filter chips, the wide table, the move grade, the ticker card). */
/* The page head of a tool page (2026-10-12): a title with its date beside it and two lines of what it is - not a poster.
   It was a 48 px title, an 18 px introduction and a pill stacked one under the other (about 290 px before the first control). */
.hero,.ma-hero{padding:14px 0 0}
.hero > .wrap,.ma-hero > .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:2px 14px}
.hero .eyebrow,.ma-hero .eyebrow{order:-1;flex:0 0 100%;font-size:.68rem;margin:0 0 1px}
.hero h1,.ma-hero h1{font-size:1.5rem;margin:0;letter-spacing:-.02em}
.hero .lead,.ma-hero .lead{order:2;flex:0 0 100%;font-size:.88rem;line-height:1.5;max-width:900px;margin:3px 0 0}
.pill{display:inline-block;border-radius:99px;padding:2px 10px;font-size:.74rem;font-weight:600;background:var(--surface);border:1px solid var(--line-2);color:var(--text-2)}
main{padding:0 0 64px}
.mu{color:var(--muted)}
.lab{font-size:.74rem;color:var(--muted);text-transform:uppercase;letter-spacing:.07em;margin-right:8px;font-weight:600}
.bar{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;margin:14px 0 8px}
.bar h2{font-size:1.1rem;margin:0}
.bar .seg button,.tabs .seg button{padding:.28rem .7rem;font-size:.82rem}
input.t.search{width:210px;padding:.34rem .7rem;font-size:.84rem}
select.t.sel{width:auto;padding:.32rem .6rem;font-size:.84rem}
/* a market the visitor's plan does not open */
.seg button .lk{font-size:.72em;margin-left:5px;opacity:.7}

/* filter chips: each one is a question; several can be on at once */
.fchips{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 10px}
.fchips button{display:inline-flex;align-items:center;gap:6px;background:transparent;border:1px solid var(--line);color:var(--text-2);border-radius:99px;padding:.22rem .65rem;font:inherit;font-size:.8rem;cursor:pointer;white-space:nowrap}
.fchips button:hover{border-color:var(--line-2);color:var(--text)}
.fchips button.on{background:var(--accent-soft);border-color:var(--accent-line);color:var(--text)}
.fchips button small{color:var(--muted);font-variant-numeric:tabular-nums;font-size:.74rem}
.fchips button.on small{color:var(--text-2)}
.fchips .clear{border-style:dashed}

/* the wide table */
.tw{overflow:auto;max-height:78vh;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface)}
.tw table{font-size:.82rem;font-variant-numeric:tabular-nums}
.tw th,.tw td{padding:5px 9px;text-align:right;white-space:nowrap}
.tw th{font-size:.66rem;letter-spacing:.04em;position:sticky;top:0;background:var(--surface);cursor:pointer;z-index:2}
.tw th:hover{color:var(--text)}
.tw th.l,.tw td.l{text-align:left}
.tw th:first-child,.tw td:first-child{text-align:left;position:sticky;left:0;background:var(--surface);z-index:1}
.tw th:first-child{z-index:3}
.tw tbody tr{cursor:pointer}
.tw tbody tr:hover td{background:var(--surface-2)}
.tw td.tk{min-width:150px;max-width:230px}
.tw td.tk b{font-family:var(--mono);font-size:.84rem}
.tw td.tk span{display:block;color:var(--muted);font-size:.72rem;overflow:hidden;text-overflow:ellipsis;max-width:200px}
.tw td.tk .st{float:right}
.tw .none td{text-align:center;color:var(--muted);padding:34px 10px;cursor:default}
.st{background:none;border:0;color:var(--line-2);font-size:1rem;line-height:1;cursor:pointer;padding:0 2px}
.st:hover{color:var(--text-2)} .st.on{color:var(--warn)}

/* gamma: the dealers dampen (teal) or amplify (amber) — the Viewer's two colours; green and red stay for up / down */
.damp{color:#2dd4bf} .amp{color:#ffb547}
.hi{background:rgba(255,181,71,.14);border-radius:6px;padding:1px 6px;color:var(--warn)} .lo{background:var(--accent-soft);border-radius:6px;padding:1px 6px;color:var(--accent)}
.gr{font-size:.74rem;border-radius:5px;padding:1px 7px;color:var(--text-2);box-shadow:inset 0 0 0 1px var(--line-2)} .gr.gA{color:var(--text);box-shadow:inset 0 0 0 1px var(--muted)}

/* the move grade: five steps of one colour — a size, never a direction */
.mv{display:inline-flex;align-items:center;gap:8px}
.mv i{display:inline-flex;gap:2px}
.mv i b{width:5px;height:12px;border-radius:1.5px;background:var(--line-2)}
.mv.s1 i b:nth-child(-n+1),.mv.s2 i b:nth-child(-n+2),.mv.s3 i b:nth-child(-n+3),.mv.s4 i b:nth-child(-n+4),.mv.s5 i b:nth-child(-n+5){background:var(--accent)}
.mv.s1 i b:nth-child(1){background:var(--muted)}
.mv span{color:var(--text-2)} .mv.s4 span,.mv.s5 span{color:var(--text);font-weight:600}

/* what changed: one chip per change, a dot of the family's colour */
.evs{display:flex;flex-wrap:wrap;gap:5px;justify-content:flex-start}
.evc{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:6px;padding:0 7px;font-size:.74rem;color:var(--text-2);white-space:nowrap}
.un{display:inline-block;min-width:22px;text-align:center;border-radius:6px;padding:0 6px;color:var(--text-2);box-shadow:inset 0 0 0 1px var(--line)}
.un.u2{color:var(--text);box-shadow:inset 0 0 0 1px var(--line-2)} .un.u3{background:var(--accent-soft);color:var(--text);box-shadow:inset 0 0 0 1px var(--accent-line)}

/* the rows a plan does not open */
.lockc{margin:18px 0;padding:26px 28px;display:flex;flex-wrap:wrap;gap:16px 28px;align-items:center;justify-content:space-between;border-color:var(--accent-line);background:linear-gradient(0deg,var(--accent-soft),var(--accent-soft)),var(--surface)}
.lockc h3{margin:0 0 6px;font-size:1.15rem} .lockc p{margin:0;max-width:680px;font-size:.95rem}

/* the ticker card */
.modal .mbox.card-t{width:min(820px,100%);max-height:94vh;overflow:auto;padding:22px 24px;display:block}
.card-t .mhead{padding:0 0 4px;border:0}
.card-t h2{font-family:var(--mono);margin:0 0 2px;font-size:1.6rem}
.card-t .sub{margin:0;font-size:.9rem;color:var(--text-2)}
.kv{display:grid;grid-template-columns:repeat(7,1fr);gap:10px;margin:16px 0}
.kv .w2{grid-column:span 2}
@media(max-width:800px){.kv{grid-template-columns:repeat(3,1fr)}}
.kv div{background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.kv b{display:block;font-size:1.05rem;font-weight:650} .kv div > span{font-size:.76rem;color:var(--muted)}
.card-t h4{font-size:.74rem;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);font-weight:600;margin:20px 0 8px}
.card-t ul{list-style:none;margin:0;padding:0}
.card-t li{display:flex;gap:10px;align-items:baseline;padding:6px 0;border-top:1px solid var(--line);font-size:.93rem;color:var(--text-2)}
.card-t li:first-child{border-top:0}
.card-t li .dot{position:relative;top:-1px}
.card-t li .pts{flex:none;min-width:26px;font-family:var(--mono);font-size:.8rem;color:var(--muted)}
.lvls{width:100%;font-size:.9rem;font-variant-numeric:tabular-nums}
.lvls td{padding:6px 10px;border-bottom:1px solid var(--line)} .lvls tr:last-child td{border-bottom:0}
.lvls td:nth-child(n+2){text-align:right} .lvls tr.cl td{background:var(--bg);font-weight:650;color:var(--text)}
.lvls td.nt{color:var(--muted);font-size:.82rem;text-align:left}
.card-t .foot{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:20px}
.card-t .fine{font-size:.82rem;color:var(--muted);margin:14px 0 0}

/* common.css gives a <section> of the front page 84px of air; the sections of these pages sit closer */
section.sec{padding:0}