/* Tablevane design tokens: the only place a colour, type family, size step, radius or width is written.
   Brand v2 (founder, 2026-10-05): signage. Black, white, signage blue for open and links, orange only for New. */
:root{
  --font-display:"Inter Tight",ui-sans-serif,system-ui,sans-serif;
  --font-mono:"DM Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --bg:#FFFFFF;--soft:#F2F2EF;--ink:#0A0A0A;--ink2:#2A2A28;--dim:#66665F;--faint:#A3A39C;--line:#E2E2DD;
  --blue:#1450E6;--on-blue:#FFFFFF;--orange:#FF7A1A;--on-orange:#0A0A0A;
  --sign:#0A0A0A;--on-sign:#FFFFFF;
  --flap:#111111;--flap-cell:#222222;--flap-gap:#0A0A0A;--flap-ink:#F4F4EE;--flap-dim:#8F8F88;--flap-line:#2B2B2B;
  --shadow:rgba(10,10,10,.12);
  --r-s:10px;--r-m:14px;--r-pill:999px;
  --rule:3px;--hair:1px;
  --w-page:1240px;--gutter:40px;
  --t-label:11px;--t-small:13px;--t-body:16px;--t-lead:19px;--t-h3:24px;--t-h2:40px;--t-fact:44px;--t-h1:132px;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#0A0A0A;--soft:#171717;--ink:#F4F4F0;--ink2:#D4D4CE;--dim:#9C9C95;--faint:#5E5E59;--line:#272727;
  --blue:#5C8BFF;--on-blue:#0A0A0A;--orange:#FF8A3D;--on-orange:#0A0A0A;
  --sign:#F4F4F0;--on-sign:#0A0A0A;
  --flap:#161616;--flap-cell:#262626;--flap-gap:#0A0A0A;--flap-line:#303030;
  --shadow:rgba(0,0,0,.5);
  color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#0A0A0A;--soft:#171717;--ink:#F4F4F0;--ink2:#D4D4CE;--dim:#9C9C95;--faint:#5E5E59;--line:#272727;
  --blue:#5C8BFF;--on-blue:#0A0A0A;--orange:#FF8A3D;--on-orange:#0A0A0A;
  --sign:#F4F4F0;--on-sign:#0A0A0A;
  --flap:#161616;--flap-cell:#262626;--flap-gap:#0A0A0A;--flap-line:#303030;
  --shadow:rgba(0,0,0,.5);
  color-scheme:dark}
@media (max-width:860px){:root{--gutter:16px;--t-h2:32px;--t-fact:36px;--t-h1:60px;--t-lead:16px}}
/* Tablevane components. Colours come only from variables.css (audit.py checks). One block per component. */
*{box-sizing:border-box}
html{background:var(--bg);-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 var(--t-body)/1.45 var(--font-display);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.wrap{max-width:var(--w-page);margin:0 auto;padding-inline:var(--gutter)}
.lab,.fl{font:500 var(--t-label)/1.3 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--dim)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Header: the wordmark, the theme switch */
.top{display:flex;align-items:center;justify-content:space-between;height:76px;border-bottom:var(--rule) solid var(--ink)}
.logo{display:block;color:var(--ink);line-height:0}
.wm{height:30px;width:auto;display:block;overflow:visible}
.home .wma,.logo:hover .wma{transform-box:fill-box;transform-origin:0 50%;animation:vane .8s cubic-bezier(.2,.9,.2,1) .2s both}
.logo:hover .wma{animation-name:vane2;animation-delay:0s}
@keyframes vane{from{transform:scaleX(0)}to{transform:none}}
@keyframes vane2{from{transform:scaleX(0)}to{transform:none}}
.theme{width:40px;height:40px;border-radius:50%;border:2px solid var(--ink);background:none;cursor:pointer;display:grid;place-items:center;padding:0}
.theme svg{width:18px;height:18px}

/* Pictograms: one weight, round ends (Expo 67 signage) */
.pic{flex:none;width:36px;height:36px;border-radius:50%;background:var(--sign);color:var(--on-sign);display:grid;place-items:center}
.pic svg{width:22px;height:22px}

/* Tags */
.tag{display:inline-block;padding:3px 8px;border-radius:var(--r-pill);background:var(--orange);color:var(--on-orange);font:500 10px/1.3 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;vertical-align:3px;margin-left:8px}

/* Split-flap boards (home): Arrivals, Departures */
.boards{display:grid;grid-template-columns:1fr 1fr;gap:28px;padding:36px 0 40px}
.board{background:var(--flap);color:var(--flap-ink);border-radius:var(--r-m);padding:18px 20px 12px;min-width:0}
.bh{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;gap:12px}
.bh h2{margin:0;font:800 20px/1.1 var(--font-display);letter-spacing:-.02em;display:flex;align-items:center;gap:10px}
.bh h2 i{width:14px;height:14px;border-radius:50%;border:3px solid var(--flap-dim);flex:none}
.bh h2 i.on{border-color:var(--blue);background:var(--blue)}
.bh .clk{font:500 12px var(--font-mono);color:var(--flap-dim);letter-spacing:.06em}
.fr{display:grid;grid-template-columns:auto minmax(0,1fr);gap:2px 12px;align-items:center;padding:7px 0;border-top:var(--hair) solid var(--flap-line)}
a.fr:hover .fn .fc{color:var(--on-blue);background:var(--blue)}
.fls{display:flex;gap:2px;overflow:hidden;white-space:nowrap}
.fc{display:inline-block;width:.7em;height:1.45em;line-height:1.45em;text-align:center;background:var(--flap-cell);border-radius:2px;font:500 15px var(--font-mono);color:var(--flap-ink);position:relative;flex:none}
.fc::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:var(--flap-gap)}
.fc.sp{opacity:.55}
.fc.flip{animation:flip .09s linear}
@keyframes flip{from{transform:scaleY(.15)}to{transform:none}}
.fs{grid-column:2;font:400 11px var(--font-mono);color:var(--flap-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fe{padding:14px 0 8px;border-top:var(--hair) solid var(--flap-line);font:500 15px var(--font-mono);color:var(--flap-dim)}

/* Finder: search, type pills, count (home) */
.finder{position:sticky;top:0;z-index:20;background:var(--bg);border-bottom:var(--hair) solid var(--line);padding:14px 0}
.finder .wrap{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.srch{flex:1 1 280px;min-width:0;display:flex;align-items:center;gap:10px;height:48px;border-radius:var(--r-pill);background:var(--soft);padding:0 18px;color:var(--dim)}
.srch svg{width:18px;height:18px;flex:none}
.srch input{flex:1;min-width:0;border:0;background:none;outline:none;font:500 17px var(--font-display);color:var(--ink)}
.srch input::placeholder{color:var(--dim)}
.srch:focus-within{outline:3px solid var(--blue);outline-offset:1px}
.pills{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;flex:0 1 auto;min-width:0}
.pills::-webkit-scrollbar{display:none}
.pill{flex:none;height:44px;border-radius:var(--r-pill);border:2px solid var(--line);background:none;padding:0 16px 0 5px;display:inline-flex;align-items:center;gap:8px;font:700 14px var(--font-display);cursor:pointer}
.pill .pic{width:32px;height:32px;background:var(--soft);color:var(--ink)}
.pill .pic svg{width:20px;height:20px}
.pill[aria-pressed=true]{border-color:var(--ink);background:var(--ink);color:var(--bg)}
.pill[aria-pressed=true] .pic{background:var(--bg);color:var(--ink)}
.pill.live .pic{background:var(--blue);color:var(--on-blue)}
.pill.nw .pic{background:var(--orange);color:var(--on-orange)}
.cnt{font:900 15px var(--font-display);margin-left:auto;min-width:2ch;text-align:right;color:var(--ink);flex:none}
.nomatch{font:500 var(--t-label) var(--font-mono);color:var(--dim);letter-spacing:.04em;text-transform:uppercase;padding:28px 0}

/* A-Z directory (home) */
.idx{display:grid;grid-template-columns:minmax(0,1fr) 28px;gap:28px;padding:12px 0 72px}
.letter{margin:0;display:flex;align-items:flex-end;gap:14px;padding:30px 0 10px;border-bottom:var(--rule) solid var(--ink);scroll-margin-top:96px}
.letter b{font:900 64px/.8 var(--font-display);letter-spacing:-.04em}
.rows{display:grid;grid-template-columns:1fr 1fr;column-gap:40px}
.row{display:grid;grid-template-columns:36px minmax(0,1fr) auto;gap:2px 14px;align-items:center;padding:12px 0;border-bottom:var(--hair) solid var(--line)}
.row .pic{grid-row:1/3}
.row .n{font:750 18px/1.15 var(--font-display);letter-spacing:-.015em;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.row .h{grid-column:2;font:400 12px var(--font-mono);color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row .rs{grid-column:3;grid-row:1;text-align:right;font:500 12px/1.3 var(--font-mono);color:var(--dim);white-space:nowrap}
.row .rs.on{color:var(--blue)}
.row .rs.on::before{content:"";display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--blue);margin-right:6px}
.row .dc{grid-column:3;grid-row:2;text-align:right;font:400 11px var(--font-mono);color:var(--dim);white-space:nowrap}
.row:hover .n{color:var(--blue)}
.row[hidden],.grp-l[hidden]{display:none}
.az{position:sticky;top:96px;align-self:start;display:flex;flex-direction:column;padding-top:30px}
.az a{font:500 12px/1.6 var(--font-mono);text-align:center;color:var(--dim);border-radius:4px}
.az a:hover{background:var(--ink);color:var(--bg)}
.az a.off{color:var(--line);pointer-events:none}

/* Place: crumb, sign, name box */
.ph{padding-top:26px}
.crumb{display:inline-flex;gap:10px;align-items:center;font:700 14px var(--font-display)}
.crumb .ar{width:30px;height:30px;border-radius:50%;background:var(--ink);color:var(--bg);display:grid;place-items:center}
.crumb .ar svg{width:16px;height:16px}
.crumb:hover{color:var(--blue)}
.sign{margin-top:22px;display:flex;align-items:center;gap:14px;background:var(--sign);color:var(--on-sign);border-radius:var(--r-m) var(--r-m) 0 0;padding:12px 18px;min-height:62px}
.sign .pic{width:38px;height:38px;background:var(--on-sign);color:var(--sign)}
.sign .pic svg{width:24px;height:24px}
.sign .k{font:800 17px var(--font-display);letter-spacing:-.01em}
.sign .tag{margin:0}
.tag.chg{margin:0;background:none;color:var(--ink);box-shadow:inset 0 0 0 2px var(--ink);padding:4px 10px;font-size:11px}
.sign .hd{margin-left:auto;font:500 13px var(--font-mono);opacity:.75;text-align:right}
.namebox{border:var(--rule) solid var(--sign);border-top:0;border-radius:0 0 var(--r-m) var(--r-m);padding:22px 24px 26px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:end}
/* the bottom padding holds the descenders (g, p, y) of the tight display line, so they never touch the line below */
h1{margin:0;padding-bottom:.18em;font:900 var(--t-h1)/.86 var(--font-display);letter-spacing:-.055em;text-wrap:balance;overflow-wrap:break-word;hyphens:manual}
h1.mid{font-size:min(var(--t-h1),96px)}
.ad{margin-top:6px;font:500 var(--t-lead)/1.35 var(--font-display);color:var(--ink2)}
.ad .sep{margin:0 3px;color:var(--faint)}
.ad .p{display:inline-block;max-width:100%}
.acts{display:flex;gap:8px;margin-top:18px;flex-wrap:wrap}
.act{height:44px;min-width:44px;border-radius:var(--r-pill);border:2px solid var(--ink);padding:0 16px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font:700 14px var(--font-display)}
.act.ic{padding:0}
.act svg{width:18px;height:18px;flex:none}
.act:hover{background:var(--ink);color:var(--bg)}
.act.pri{background:var(--blue);border-color:var(--blue);color:var(--on-blue)}
.act.pri:hover{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.live{display:flex;align-items:center;gap:12px;padding:10px 20px 10px 10px;border-radius:var(--r-pill);background:var(--soft);font:700 15px/1.2 var(--font-display);white-space:nowrap}
.live:empty{display:none}
.live i{width:28px;height:28px;border-radius:50%;border:4px solid var(--faint);flex:none}
.live.on i{border-color:var(--blue);background:var(--blue);box-shadow:0 0 0 3px var(--bg),0 0 0 5px var(--blue)}
.live small{display:block;font:500 12px var(--font-mono);color:var(--dim)}

/* FactStrip */
.facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:22px}
.fact{border-radius:var(--r-m);background:var(--soft);padding:16px 18px 18px;min-width:0}
.fv{margin-top:8px;font:900 var(--t-fact)/1 var(--font-display);letter-spacing:-.04em;font-variant-numeric:tabular-nums;display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.fv small{font-size:20px;color:var(--dim);letter-spacing:-.01em}
.fv.txt{font-size:var(--t-h3);letter-spacing:-.02em;line-height:1.1}
.fv.new{color:var(--orange)}
.fv.stack{flex-direction:column;align-items:flex-start;gap:4px;font-size:var(--t-h3);letter-spacing:-.02em}
.fv.nvv{font:500 13px var(--font-mono);color:var(--dim);letter-spacing:0;margin-top:14px}
.since{font:500 12px var(--font-mono);color:var(--dim);letter-spacing:0}
.dots{display:flex;gap:5px;margin-top:12px}
.dots i{width:12px;height:12px;border-radius:50%;border:2px solid var(--ink)}
.dots i.f{background:var(--ink)}
.hp{align-self:center;margin-left:6px}
.pvb.q{width:22px;height:22px;border:2px solid currentColor;color:var(--dim);font:500 12px/1 var(--font-mono);cursor:help}
.pvb.q:hover,.pvb.q:focus-visible,.pv.open .pvb.q{color:var(--ink)}
.hpt{display:block;max-width:300px;padding:2px 0 4px;font:500 14px/1.45 var(--font-display);letter-spacing:0}

/* Tabs */
.tabs{position:sticky;top:0;z-index:15;background:var(--bg);display:flex;gap:8px;padding:14px 0;margin-top:26px;border-bottom:var(--rule) solid var(--ink);overflow-x:auto;scrollbar-width:none}
.tabs button{flex:none;height:40px;border-radius:var(--r-pill);border:2px solid var(--line);background:none;padding:0 16px;font:700 14px var(--font-display);cursor:pointer;display:flex;gap:8px;align-items:center}
.tabs button b{font:500 12px var(--font-mono);color:var(--dim)}
.tabs button[aria-selected=true]{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.tabs button[aria-selected=true] b{color:var(--faint)}
.pane{min-width:0}

/* Sections */
section{padding:44px 0;border-bottom:var(--hair) solid var(--line);min-width:0}
section:last-child{border-bottom:0}
h2{margin:0 0 24px;font:900 var(--t-h2)/1 var(--font-display);letter-spacing:-.045em}
.nv{margin:0;font:500 13px/1.4 var(--font-mono);color:var(--dim)}

/* Provenance: one tick per block; it opens the block's sources (name, link, date) without moving the page */
.sh{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px;margin:0 0 24px}
.sh h2{margin:0}
.sh h2.sr+.pv{margin-left:auto}
.pv{position:relative;display:inline-flex;vertical-align:middle;line-height:0;text-transform:none;letter-spacing:0}
.fl .pv,.ad .pv{margin:-6px 0 -6px 2px}
.pvb{width:28px;height:28px;margin:0;padding:0;border:0;border-radius:50%;background:none;color:var(--faint);display:grid;place-items:center;cursor:pointer}
.pvb svg{width:15px;height:15px}
.sh .pvb svg{width:18px;height:18px}
.pvb:hover,.pv.open .pvb{color:var(--blue)}
.pvp{display:none;position:fixed;top:0;left:0;z-index:60;width:max-content;max-width:min(400px,calc(100vw - 2 * var(--gutter)));margin-top:6px;padding:10px 14px 8px;border-radius:var(--r-s);background:var(--ink);color:var(--bg);box-shadow:0 10px 28px var(--shadow);font:500 13px/1.35 var(--font-display);text-align:left;white-space:normal;animation:pv .12s ease-out}
.pvp::before{content:"";position:absolute;left:0;right:0;top:-8px;height:8px}
.pvp.up::before{top:auto;bottom:-8px}
.pv.open .pvp{display:block}
.pvh{display:flex;align-items:center;gap:6px;padding-bottom:6px;font:500 var(--t-label)/1.3 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--faint)}
.pvh svg{width:13px;height:13px}
.pvr{display:grid;grid-template-columns:minmax(64px,auto) minmax(0,1fr) auto;gap:0 14px;align-items:baseline;padding:5px 0;border-top:var(--hair) solid var(--ink2)}
.pvf{font:500 var(--t-label)/1.5 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--faint)}
.pvs{font-weight:700;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-decoration:underline;text-decoration-color:var(--dim);text-underline-offset:3px}
.pvs b{font:500 12px var(--font-mono);color:var(--faint)}
.pvs:hover{text-decoration-color:currentColor}
.pvd{font:500 12px/1.5 var(--font-mono);color:var(--faint);white-space:nowrap;font-variant-numeric:tabular-nums}
.gcr{font:500 12px var(--font-mono);color:var(--dim);letter-spacing:0}
@keyframes pv{from{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:none}}

/* Chips (menu services, nearby types) */
.chips,.subtabs{display:flex;gap:8px;margin-bottom:22px;flex-wrap:wrap}
.chip,.st{height:38px;border-radius:var(--r-pill);border:2px solid var(--line);background:none;padding:0 14px;font:700 13.5px var(--font-display);cursor:pointer}
.chip[aria-pressed=true],.st[aria-selected=true]{background:var(--ink);border-color:var(--ink);color:var(--bg)}

/* Hours & menu: the Open row, then one row per service; a service row opens onto its menu */
.hrow{display:grid;grid-template-columns:150px repeat(7,minmax(0,1fr)) 84px;gap:0 10px;align-items:start;padding:14px 0;border-top:var(--hair) solid var(--line)}
.hh{border-top:0;padding:0 0 10px}
.hh .hc{font:800 15px var(--font-display)}
.hh .hc.td{color:var(--blue)}
.hh .hc.td::after{content:"";display:block;width:24px;height:4px;border-radius:2px;background:var(--blue);margin-top:6px}
.hl{display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-width:0}
.op .hl{font:500 var(--t-label)/1.5 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink);padding-top:2px}
.op .tm{font-weight:500}
.sn{font:800 19px/1.1 var(--font-display);letter-spacing:-.02em}
.nw{display:none;padding:3px 8px;border-radius:var(--r-pill);background:var(--blue);color:var(--on-blue);font:500 10px/1.2 var(--font-mono);letter-spacing:.08em;text-transform:uppercase}
.svc.now .nw{display:inline-block}
.svc.now .sn{color:var(--blue)}
.hc{min-width:0}
.hcs{grid-column:span 7}
.tm{font:500 14px/1.5 var(--font-mono);font-variant-numeric:tabular-nums;white-space:nowrap}
.tm.ad{white-space:normal}
.sd{font:500 var(--t-label)/1.9 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--dim)}
.hc.td .tm{color:var(--blue)}
.hx{display:flex;align-items:center;justify-content:flex-end;gap:6px;color:var(--dim)}
.hx svg{width:18px;height:18px;flex:none;transition:transform .2s}
.mn{font:500 var(--t-label)/1.5 var(--font-mono);letter-spacing:.06em;text-transform:uppercase}
.hg{display:none}
.nvr .nv,.nvm .nv{grid-column:2/-1;padding-top:3px}
details.svc>summary{list-style:none;cursor:pointer}
details.svc>summary::-webkit-details-marker{display:none}
details.svc>summary:hover .hx,details.svc[open] .hx{color:var(--ink)}
details.svc[open] .hx svg{transform:rotate(180deg)}
details.svc>summary:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.hb{padding:4px 0 18px 160px}
.hb .subtabs{margin:6px 0 14px}

/* RangeRows: menu sections, median station on the range line */
.mh,.mr{display:grid;grid-template-columns:minmax(0,1fr) 120px minmax(0,1.6fr);gap:4px 28px;align-items:center}
.mh{padding-bottom:8px}
.mh span:first-child{grid-column:2;text-align:right}
.mh .rgl{margin:0 10px}
.mh.wine{margin-top:34px}
.mr{padding:16px 0;border-top:var(--hair) solid var(--line)}
/* a menu that prints no section headings: one block, its item count and price range, no median */
.mh.flat,.mr.flat{grid-template-columns:minmax(0,1fr) 210px minmax(0,1.6fr)}
.ml{font:800 19px/1.15 var(--font-display);letter-spacing:-.02em;display:flex;flex-direction:column}
.ml small{font:400 12px/1.6 var(--font-mono);color:var(--dim);letter-spacing:0}
.mv{font:900 30px/1 var(--font-display);letter-spacing:-.04em;text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.mv small{font-size:.6em;letter-spacing:0;margin-left:2px}
.ln{position:relative;height:40px;margin:0 10px}
.ln::before{content:"";position:absolute;left:-10px;right:-10px;top:24px;height:2px;background:var(--line)}
.ln .rg{position:absolute;top:19px;height:12px;border-radius:6px;background:var(--ink);margin-left:-6px;padding-right:12px;box-sizing:content-box}
.ln .md{position:absolute;top:15px;width:20px;height:20px;margin-left:-10px;border-radius:50%;background:var(--bg);border:4px solid var(--ink)}
.ln .lo,.ln .hi{position:absolute;top:0;font:500 11px var(--font-mono);color:var(--dim);white-space:nowrap}
.ln .hi{transform:translateX(-100%)}
.ln .lo.one{transform:translateX(-50%)}

/* Ownership & team */
.team2{display:grid;grid-template-columns:1fr 1fr;gap:28px 48px}
.tier{display:flex;flex-direction:column;gap:12px;min-width:0}
.grp{font:900 34px/1.05 var(--font-display);letter-spacing:-.04em;color:var(--blue)}
.grp:hover{text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:4px}
.owners{display:flex;flex-wrap:wrap;gap:10px}
.person{min-height:44px;border-radius:var(--r-pill);background:var(--soft);padding:6px 18px 6px 6px;display:inline-flex;align-items:center;gap:10px;font:700 16px/1.15 var(--font-display);color:var(--blue)}
.person i{width:32px;height:32px;border-radius:50%;background:var(--blue);color:var(--on-blue);display:grid;place-items:center;font:800 12px var(--font-display);font-style:normal;flex:none}
.person:hover{background:var(--blue);color:var(--on-blue)}
.person:hover i{background:var(--on-blue);color:var(--blue)}
.role{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:8px 0;border-bottom:var(--hair) solid var(--line)}

/* YearTable: distinctions */
.dwrap{overflow-x:auto;max-width:100%}
.dt{border-collapse:collapse;min-width:100%}
.dt th,.dt td{padding:12px 8px;border-top:var(--hair) solid var(--line);text-align:center;white-space:nowrap}
.dt thead th{border-top:0;font:500 12px var(--font-mono);color:var(--dim)}
.dt tbody th{text-align:left;font:750 17px/1.25 var(--font-display);letter-spacing:-.01em;white-space:normal;padding-left:0;min-width:220px}
/* the list names stay in place while the years scroll beside them (phones) */
.dt th:first-child{position:sticky;left:0;z-index:1;background:var(--bg)}
.dt tbody th small{display:block;font:500 var(--t-label) var(--font-mono);color:var(--dim);letter-spacing:.04em;text-transform:uppercase;margin-top:3px}
.dt td span{display:inline-grid;place-items:center;min-width:40px;height:40px;padding:0 8px;border-radius:var(--r-pill);background:var(--ink);color:var(--bg);font:800 14px var(--font-display)}
.dt td span.ck{background:var(--blue);color:var(--on-blue);font-size:18px}
.dt tr.past th{color:var(--dim)}
.dt tr.past td span{background:var(--soft);color:var(--dim)}
.dt td.na{background:repeating-linear-gradient(135deg,transparent 0 6px,var(--line) 6px 7px)}

/* Timeline: the address as a metro line (horizontal; vertical on phones) */
.atop{display:flex;flex-wrap:wrap;align-items:center;gap:12px 22px;margin-bottom:30px}
.atop:last-child{margin-bottom:0}
.tok{display:inline-flex;align-items:center;min-height:40px;padding:8px 16px;border-radius:var(--r-pill);border:2px solid var(--ink);font:500 14px/1.3 var(--font-mono);max-width:100%;overflow-wrap:anywhere}
.ent{display:flex;flex-wrap:wrap;gap:8px}
.metro{list-style:none;margin:0;padding:0 44px 0 0;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);position:relative}
.metro::after{content:"";position:absolute;right:0;top:34px;border-left:34px solid var(--ink);border-top:18px solid transparent;border-bottom:18px solid transparent}
/* each station is centred on its dot: the name above it, the date it began below it; the bar runs dot to arrow */
.stn{position:relative;padding:0 8px;min-width:0;display:grid;grid-template-rows:34px 36px auto;justify-items:center;text-align:center}
.stn::before{content:"";position:absolute;left:0;right:0;top:47px;height:10px;background:var(--ink)}
.stn:first-child::before{left:50%;border-radius:5px 0 0 5px}
.stn:last-child::before{right:-14px}
.stn .nm{max-width:100%;font:700 15px/1.2 var(--font-display);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;align-self:end;padding-bottom:4px}
.stn a.nm{color:var(--blue)}
.stn a.nm:hover{text-decoration:underline}
.stn .dot{position:relative;z-index:1;width:26px;height:26px;margin-top:5px;border-radius:50%;background:var(--bg);border:5px solid var(--ink)}
.stn.cur .nm{font:900 19px/1.15 var(--font-display);letter-spacing:-.02em}
.stn.cur .dot{width:34px;height:34px;margin-top:1px;background:var(--blue)}
.stn .dt2{max-width:100%;font:500 var(--t-label) var(--font-mono);letter-spacing:.06em;color:var(--dim);text-align:center;padding-top:8px}
.stn .dt2.new{color:var(--orange)}
.stn .tks{display:flex;flex-direction:column;align-items:center;gap:6px;padding-top:10px;max-width:100%}
.stn .tk{display:inline-flex;align-items:center;gap:8px;font:500 var(--t-label) var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink)}
.stn .tk::before{content:"";width:var(--rule);height:14px;background:currentColor;flex-shrink:0}
.stn .tk.new{color:var(--orange)}

/* Food safety */
.cvs{display:flex;flex-direction:column}
.cv{display:grid;grid-template-columns:repeat(3,120px) minmax(0,1fr);gap:8px 22px;padding:16px 0;border-top:var(--hair) solid var(--line);align-items:start}
.cvd{display:flex;flex-direction:column;gap:4px;font:800 18px var(--font-display);font-variant-numeric:tabular-nums}
.cvt{color:var(--ink2);font-size:15px;line-height:1.5}

/* RowList: Nearby, places of a person or group */
.near{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.near a{display:grid;grid-template-columns:36px minmax(0,1fr) auto;gap:0 12px;align-items:center;padding:12px 14px;border-radius:var(--r-m);background:var(--soft)}
.near a[hidden]{display:none}
.near a b{display:block;font:750 16px/1.15 var(--font-display);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.near a small{display:block;font:400 11px/1.5 var(--font-mono);color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.near .m{font:500 13px var(--font-mono);color:var(--dim)}
.near a:hover b{color:var(--blue)}

/* Dishes and Articles tabs */
.dl{list-style:none;margin:0;padding:0;columns:3 260px;column-gap:40px}
.dl li{break-inside:avoid;padding:12px 0;border-top:var(--hair) solid var(--line);font:700 18px var(--font-display)}
.dl li.ic{display:flex;justify-content:space-between;align-items:center;gap:12px;font-weight:900}
.dl li.ic em{font:500 var(--t-label) var(--font-mono);font-style:normal;letter-spacing:.06em;text-transform:uppercase;color:var(--dim);border:2px solid var(--line);border-radius:var(--r-pill);padding:4px 8px;white-space:nowrap}
.arts{display:flex;flex-direction:column}
.art{display:grid;grid-template-columns:220px minmax(0,1fr);gap:18px;padding:14px 0;border-top:var(--hair) solid var(--line)}
.ao{font:500 12.5px/1.7 var(--font-mono);color:var(--dim)}
.at{font:700 17px/1.35 var(--font-display);letter-spacing:-.01em}
.art:hover .at{color:var(--blue)}

/* Simple pages: closed place, person, group, credits */
.simple .namebox{grid-template-columns:minmax(0,1fr)}
.replaced{margin-top:18px;font:700 var(--t-lead) var(--font-display)}
.replaced a{color:var(--blue)}
.replaced a:hover{text-decoration:underline}
.credits{display:flex;flex-direction:column}
.credits div{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:6px 20px;padding:16px 0;border-top:var(--hair) solid var(--line)}
.credits .who{font:800 22px/1.2 var(--font-display);letter-spacing:-.02em}
.credits .ttl{font:500 13px var(--font-mono);color:var(--dim)}
h1.pg{font-size:min(var(--t-h1),96px);margin-top:34px}

/* Footer */
footer{border-top:var(--rule) solid var(--ink);margin-top:40px;padding:20px 0 56px;display:flex;justify-content:space-between;align-items:center}
footer a{font:700 14px var(--font-display)}
footer a:hover{color:var(--blue)}
footer .ico{width:28px;height:28px;color:var(--ink)}

@media (max-width:860px){
  .top{height:64px}.wm{height:24px}
  .boards{grid-template-columns:1fr;gap:14px;padding:18px 0 22px}
  .board{padding:14px 14px 8px;border-radius:12px}
  .fc{font-size:13px}
  .finder{padding:10px 0}.srch{height:44px;flex-basis:100%}
  .pills{margin:0 calc(-1 * var(--gutter));padding:0 var(--gutter);flex:1 1 auto}
  .idx{grid-template-columns:1fr;padding-top:0}
  .az{display:none}
  .rows{grid-template-columns:1fr}
  .row .dc{grid-column:2;grid-row:3;text-align:left;white-space:normal}
  .letter b{font-size:48px}
  .ph{padding-top:18px}
  .sign{padding:10px 14px;min-height:56px}.sign .hd{display:none}
  .namebox{grid-template-columns:minmax(0,1fr);padding:18px 16px 20px}
  .live{justify-self:start}
  .acts{gap:6px}.act{height:40px;min-width:40px;padding:0 12px;font-size:13px;gap:6px}.act.ic,.act.web{padding:0}.act.web span{display:none}
  .facts{grid-template-columns:1fr 1fr;gap:8px}
  .fv.txt{font-size:19px}
  .pvr{grid-template-columns:minmax(0,1fr) auto;padding:6px 0}
  .pvf{grid-column:1/-1}
  .pvf:empty{display:none}
  section{padding:34px 0}
  .hrow{grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;padding:14px 0}
  .hrow>.hl{grid-row:1;grid-column:1}.hrow>.hx{grid-row:1;grid-column:2}.hrow>.hg{grid-row:2}
  .hb{padding:0 0 26px}
  .hh,.hc,.hcs{display:none}
  .hg{display:flex;flex-direction:column;gap:4px;grid-column:1/-1}
  .gr{display:grid;grid-template-columns:76px minmax(0,1fr);gap:10px;align-items:baseline}
  .gd{font:800 14px var(--font-display)}
  .gt{display:flex;flex-wrap:wrap;gap:0 14px}
  .gr.td .gd,.gr.td .tm{color:var(--blue)}
  .nvr .nv,.nvm .nv{grid-column:1/-1}
  .sn{font-size:18px}
  .hl{flex-direction:row;align-items:center;gap:10px}
  .mh,.mr{grid-template-columns:minmax(0,1fr) auto;gap:2px 16px}
  .mh.flat,.mr.flat{grid-template-columns:minmax(0,1fr) auto}
  .mh .rgl{display:none}
  .mh span:first-child{grid-column:2}
  .ln{grid-column:1/-1;margin-top:4px}
  .mv{font-size:26px}
  .team2{grid-template-columns:1fr}
  .grp{font-size:28px}
  /* the year columns fit a phone (QA run 4: Gia's 2022 column was cut off at 390px); a longer history scrolls inside .dwrap */
  .dt th,.dt td{padding:10px 2px}.dt tbody th{min-width:112px;font-size:15px;padding-right:6px}.dt td span{min-width:34px;height:34px;padding:0 5px;font-size:12px}
  /* more years than fit (showroom.DT_PHONE_YEARS): each list is a row, its years wrap beneath it, nothing scrolls (QA run 5) */
  .dwrap.many{overflow:visible}
  .dwrap.many .dt,.dwrap.many .dt tbody,.dwrap.many .dt tr{display:block;min-width:0}
  .dwrap.many .dt thead{display:none}
  .dwrap.many .dt tbody th{display:block;position:static;min-width:0;padding:12px 0 8px;border-top:var(--hair) solid var(--line)}
  .dwrap.many .dt td{display:inline-flex;align-items:center;gap:6px;border-top:0;padding:0 12px 10px 0}
  .dwrap.many .dt td:empty{display:none}.dwrap.many .dt td.na{display:none}
  .dwrap.many .dt td::before{content:attr(data-y);font:500 12px var(--font-mono);color:var(--dim)}
  .metro{grid-auto-flow:row;grid-auto-columns:auto;padding:0 0 52px 0}
  .metro::before{content:"";position:absolute;left:12px;top:13px;bottom:30px;width:10px;border-radius:5px;background:var(--ink)}
  .stn::before{display:none}
  .metro::after{right:auto;left:-1px;top:auto;bottom:0;border-left:18px solid transparent;border-right:18px solid transparent;border-top:34px solid var(--ink)}
  .stn{grid-template-columns:34px minmax(0,1fr);grid-template-rows:auto auto;column-gap:16px;padding:0 0 22px 0;justify-items:start;text-align:left}
  .stn .dot{grid-row:1;grid-column:1;margin:0 0 0 4px}
  .stn.cur .dot{margin:0}
  .stn .nm{grid-row:1;grid-column:2;align-self:center;white-space:normal;padding:0}
  .stn .dt2{grid-row:2;grid-column:2;text-align:left;padding-top:10px}
  .stn .tks{grid-row:3;grid-column:2;align-items:flex-start}
  .cv{grid-template-columns:repeat(3,minmax(0,1fr))}.cvt{grid-column:1/-1}
  .near{grid-template-columns:1fr}
  .art{grid-template-columns:1fr;gap:2px}
  .credits .who{font-size:19px}
}
/* a single business on the line sits at its start, like the first of many; the bar runs from its dot to the arrow */
@media (min-width:861px){
  .metro:has(>.stn:only-child){grid-auto-columns:minmax(0,260px)}
  .metro:has(>.stn:only-child)::before{content:"";position:absolute;left:130px;right:30px;top:47px;height:10px;border-radius:5px 0 0 5px;background:var(--ink)}
  .stn:only-child::before{display:none}
}
@media (hover:hover) and (pointer:fine){.pv:hover .pvp{display:block}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}