/* Atlas table: full table ≥900px, scroll + sticky first column 600-899px, card stack <600px. */
.at{margin:2.5rem 0;--at-rule:var(--rule,#15161b26);--at-ink:var(--ink,#15161b);--at-mute:var(--mute,#6b6c75);--at-bg:var(--bg,#f3f3f0)}
.at-h{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:.75rem 1.5rem;margin:0 0 .9rem}
.at-h h3{margin:0;font:500 1.6rem/1.15 var(--f1,"Zen Old Mincho",serif)}
.at-n{margin:.35rem 0 0;font:500 .72rem/1.5 var(--f2,"IBM Plex Mono",monospace);letter-spacing:.08em;text-transform:uppercase;color:var(--at-mute)}
.at-f{display:flex;flex-wrap:wrap;gap:.4rem;margin:0;padding:0;list-style:none}
.at-f button{min-height:44px;padding:0 .9rem;border:1px solid var(--at-ink);background:var(--at-bg);color:var(--at-ink);font:500 .72rem var(--f2,"IBM Plex Mono",monospace);letter-spacing:.08em;cursor:pointer}
.at-f button[aria-pressed="true"]{background:var(--at-ink);color:var(--at-bg)}
.at-w{overflow-x:auto;border-top:1px solid var(--at-ink);border-bottom:1px solid var(--at-ink);overscroll-behavior-x:contain}
.at-w:focus-visible{outline:2px solid var(--acc,#bc002d);outline-offset:4px}
.at table{width:100%;border-collapse:collapse;font:400 .95rem/1.45 var(--f1,"Zen Old Mincho",serif)}
.at caption{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.at th,.at td{padding:.8rem .9rem;text-align:left;vertical-align:top;border-bottom:1px solid var(--at-rule)}
.at thead th{font:500 .7rem/1.4 var(--f2,"IBM Plex Mono",monospace);letter-spacing:.08em;text-transform:uppercase;color:var(--at-mute);white-space:nowrap;border-bottom:1px solid var(--at-ink)}
.at tbody th{font:500 1.05rem/1.3 var(--f1,"Zen Old Mincho",serif);white-space:nowrap}
.at tbody th i{display:inline-block;width:.55rem;height:.55rem;margin-right:.55rem;border-radius:50%;background:var(--dot,transparent);box-shadow:0 0 0 1px #15161b40;vertical-align:.08em}
.at tbody tr:hover>*{background:#15161b08}
.at tbody tr:last-child>*{border-bottom:0}
.at .num{font-variant-numeric:tabular-nums;min-width:9rem;max-width:15rem}
.at .bar b{white-space:nowrap}
.at .tv{color:var(--at-mute);font-style:italic}
.at .tv::after{content:" · to verify";font:500 .62rem var(--f2,"IBM Plex Mono",monospace);letter-spacing:.08em;text-transform:uppercase;font-style:normal}
.at .tag{display:inline-block;margin:0 .3rem .2rem 0;padding:.1rem .45rem;border:1px solid var(--at-ink);font:500 .66rem/1.5 var(--f2,"IBM Plex Mono",monospace);letter-spacing:.06em;white-space:nowrap}
.at .tag.ikon{background:#15161b;color:var(--at-bg)}
.at .tag.none{border-style:dashed;color:var(--at-mute)}
.at tr[hidden]{display:none}
/* Bars: time and odds */
.at .bar{display:flex;align-items:center;gap:.6rem}
.at .bar b{font-weight:400;min-width:5.5rem}
.at .bar span{flex:1 1 auto;min-width:3rem;height:6px;background:var(--at-rule);position:relative}
.at .bar span::after{content:"";position:absolute;inset:0 auto 0 0;width:var(--v);background:var(--dot,var(--at-ink))}
.at .odds{display:flex;height:10px;min-width:7rem;border:1px solid var(--at-ink)}
.at .odds i{display:block;height:100%}
.at .src{margin:.7rem 0 0;font:500 .68rem/1.6 var(--f2,"IBM Plex Mono",monospace);letter-spacing:.06em;text-transform:uppercase;color:var(--at-mute)}
.at-hint{display:none}

/* Tablet: scroll with sticky first column + edge hint */
@media(max-width:899px){
  .at table{min-width:760px}
  .at tbody th,.at thead th:first-child{position:sticky;left:0;z-index:1;background:var(--at-bg);box-shadow:1px 0 0 var(--at-rule)}
  .at tbody tr:hover>th{background:color-mix(in srgb,var(--at-bg) 96%,#15161b)}
  .at-hint{display:block;margin:.5rem 0 0;font:500 .66rem var(--f2,"IBM Plex Mono",monospace);letter-spacing:.08em;color:var(--at-mute)}
}
/* Phone: each row becomes a card; header labels come from data-label */
@media(max-width:599px){
  .at-w{overflow:visible;border:0}
  .at table{min-width:0}
  .at thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .at tbody,.at tr,.at th,.at td{display:block}
  .at tbody tr{border:1px solid var(--at-ink);background:var(--at-bg);margin:0 0 .75rem}
  .at tbody tr:hover>*{background:none}
  .at tbody th{position:static;box-shadow:none;white-space:normal;padding:.8rem .9rem .5rem;border-bottom:1px solid var(--at-ink);font-size:1.2rem}
  .at td{display:grid;grid-template-columns:7.5rem minmax(0,1fr);gap:.75rem;padding:.55rem .9rem;border-bottom:1px solid var(--at-rule)}
  .at td::before{content:attr(data-label);font:500 .64rem/1.6 var(--f2,"IBM Plex Mono",monospace);letter-spacing:.08em;text-transform:uppercase;color:var(--at-mute)}
  .at td.num{white-space:normal;max-width:none}
  .at td>*{justify-self:start;grid-column:2}
  .at td>br{display:none}
  .at td.tv::after{grid-column:2;margin-top:-.4rem}
  .at tbody tr>:last-child{border-bottom:0}
  .at-hint{display:none}
}
/* Two-column tables (name | note): no sideways scroll, and plain stacked rows on phones instead of cards */
@media(max-width:899px){
  .at--pair table{min-width:0}
  .at--pair tbody th,.at--pair thead th:first-child{position:static;box-shadow:none}
  .at--pair .at-hint{display:none}
}
@media(max-width:599px){
  .at--pair .at-w{border-top:1px solid var(--at-ink);border-bottom:1px solid var(--at-ink)}
  .at--pair tbody tr{border:0;border-bottom:1px solid var(--at-rule);margin:0;padding:.7rem 0}
  .at--pair tbody tr:last-child{border-bottom:0}
  .at--pair tbody th{border:0;padding:0 0 .25rem;font-size:1.05rem}
  .at--pair td{display:block;padding:0;border:0}
  .at--pair td::before{content:none}
}
/* Phone: cells of a sentence or more (Coder: about 8+ words) put the label above the value, full width */
@media(max-width:599px){
  .at td.long{grid-template-columns:minmax(0,1fr);gap:.2rem}
  .at td.long>*{grid-column:1}
}
@media(prefers-reduced-motion:reduce){.at *{transition:none!important}}
