@import url("https://fonts.googleapis.com/css2?family=Archivo:wght@400;500;600;700&family=Archivo+Expanded:wght@600;700&family=Anek+Tamil:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap");
:root{--ink-900:#0D0D0F;--ink-800:#17171A;--ink-700:#2B2B30;--ink-600:#4A4A52;--ink-500:#6E6E78;--ink-400:#9A9AA3;--ink-300:#C7C6CC;--ink-200:#E3E1DD;--ink-100:#F1EFEB;--ink-050:#F8F6F3;--paper:#FAF9F7;--white:#fff;--red-700:#7E0A1D;--red-600:#A20D25;--red-500:#C8102E;--red-100:#FBE7EA;--verified-600:#15654A;--verified-100:#E3F0EA;--context-600:#8A5A00;--context-100:#F7EEDA;--chrome-900:#1B2A47;--chrome-800:#243759;--chrome-line:rgba(251,247,238,.16);--chrome-text:#FBF7EE;--chrome-text-muted:rgba(251,247,238,.62);--font-display:"Archivo Expanded","Archivo",Arial,sans-serif;--font-sans:"Archivo",Arial,sans-serif;--font-tamil:"Anek Tamil","Archivo",sans-serif;--font-mono:"IBM Plex Mono",monospace;--link:var(--red-600)}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink-700);font-family:var(--font-sans);font-size:16px;line-height:1.55;text-wrap:pretty}
[data-lang=en] .ta,[data-lang=ta] .en{display:none}
[data-lang=ta] body,[data-lang=ta] .ta{font-family:var(--font-tamil)}
a{color:var(--link);text-decoration:none}a:hover{color:var(--ink-900);text-decoration:underline}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px}
.eyebrow{font-family:var(--font-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-500)}
/* nav */
.nav{background:var(--chrome-900);color:var(--chrome-text);border-bottom:1px solid var(--chrome-line);position:sticky;top:0;z-index:40}
.nav-in{max-width:1120px;margin:0 auto;padding:12px 24px;display:flex;align-items:center;gap:20px;justify-content:space-between}
.brand{display:flex;align-items:baseline;gap:10px;color:var(--chrome-text);font-family:var(--font-display);font-weight:700;letter-spacing:-.02em;font-size:19px}
.brand:hover{text-decoration:none;color:#fff}.brand .dot{color:var(--red-500)}
.brand-tag{font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--chrome-text-muted)}
.nlinks{display:flex;gap:2px;align-items:center;flex-wrap:wrap}
.nlink{color:var(--chrome-text-muted);font-size:13px;font-weight:600;padding:8px 11px;border-radius:999px;transition:background .15s ease,color .15s ease}
.nlink:hover{color:var(--chrome-text);background:var(--chrome-800);text-decoration:none}
.nlink.on{color:#fff;background:var(--red-500);text-decoration:none}
.tn-disc-bar{display:flex;align-items:center;justify-content:center;gap:6px;padding:6px 10px;background:var(--paper);color:var(--chrome-900);font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;border-bottom:1px solid var(--ink-200)}
.tn-disc-bar svg{flex-shrink:0}
.tn-new-banner{display:flex;align-items:center;justify-content:center;gap:10px;padding:8px 14px;background:var(--red-600);color:#fff;font-family:var(--font-sans);font-size:13px;flex-wrap:wrap;text-align:center}
.tn-new-banner .tag{font-family:var(--font-mono);font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:2px 7px;border-radius:999px;background:rgba(255,255,255,.2)}
.tn-new-banner button{background:none;border:0;color:#fff;cursor:pointer;font-size:16px;line-height:1;padding:0 2px;opacity:.85}
.lang{display:flex;border:1px solid var(--chrome-line);border-radius:2px;overflow:hidden}
.lang button{background:none;border:0;color:var(--chrome-text-muted);font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;padding:5px 9px;cursor:pointer}
.lang button.on{background:var(--red-500);color:#fff}
/* breadcrumb + hero */
.bc{font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-500);padding:16px 0 0}
.bc a{color:var(--ink-500)}.bc a:hover{color:var(--red-600)}.bc i{padding:0 8px;color:var(--ink-300);font-style:normal}
.hero{padding:22px 0 30px;border-bottom:1px solid var(--ink-200)}
h1{font-family:var(--font-display);font-weight:700;font-size:clamp(32px,5vw,56px);line-height:1.06;letter-spacing:-.03em;color:var(--chrome-900);margin:10px 0 0}
h1 em{font-style:normal;color:var(--red-600)}
.hsub{margin-top:12px;font-size:18px;color:var(--ink-600);max-width:68ch}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
.chip{font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--ink-300);color:var(--ink-600);padding:5px 9px;background:var(--white)}
.chip.acc{border-color:var(--red-500);color:var(--red-600);background:var(--red-100)}
.chip.warn{border-color:var(--context-600);color:var(--context-600);background:var(--context-100)}
.chip.ok{border-color:var(--verified-600);color:var(--verified-600);background:var(--verified-100)}
/* buttons */
.btn{transition:background .18s ease,border-color .18s ease,color .18s ease,transform .18s ease;display:inline-flex;align-items:center;gap:8px;font-family:var(--font-sans);font-size:14px;font-weight:600;padding:10px 16px;border:1px solid var(--red-500);background:var(--red-500);color:#fff;border-radius:2px;cursor:pointer}
.btn:hover{background:var(--red-600);border-color:var(--red-600);color:#fff;text-decoration:none}
.btn.out{background:transparent;color:var(--chrome-900);border-color:var(--ink-300)}.btn.out:hover{background:var(--ink-100);border-color:var(--chrome-900);color:var(--chrome-900)}
.btn.sm{font-size:13px;padding:7px 12px}
.btn:active{transform:translateY(1px)}
.chip{transition:border-color .2s ease,color .2s ease}
.card{transition:box-shadow .25s ease}.card:hover{box-shadow:0 4px 18px rgba(13,13,15,.05)}
table.booths tbody tr{transition:background .12s ease}
details.faq summary{transition:color .18s ease}details.faq summary:hover{color:var(--red-600)}
.mphoto{transition:transform .3s ease}.mcard:hover .mphoto{transform:scale(1.015)}
.btnrow{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}
/* sections */
main{padding:0 0 48px}
section{padding:40px 0 0}
.sh{display:flex;align-items:baseline;gap:12px;border-bottom:1px solid var(--ink-300);padding-bottom:8px;margin-bottom:20px}
.sh h2{font-family:var(--font-display);font-weight:700;font-size:22px;letter-spacing:-.02em;color:var(--chrome-900);margin:0}
.sh .n{font-family:var(--font-mono);font-size:12px;color:var(--ink-400);letter-spacing:.08em}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:1px;background:var(--ink-200);border:1px solid var(--ink-200);margin-top:28px}
.stat{background:var(--white);padding:18px;transition:background .2s ease,transform .2s ease}
.stat:hover{background:var(--ink-050);transform:translateY(-2px)}
.stat .l{font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--red-600)}
.stat .v{font-family:var(--font-display);font-weight:700;font-size:34px;letter-spacing:-.03em;color:var(--chrome-900);line-height:1.1;font-variant-numeric:tabular-nums;margin-top:6px}
.stat .s{font-size:13px;color:var(--ink-500)}
.card{background:var(--white);border:1px solid var(--ink-200);padding:22px}
.callout{border-left:3px solid var(--context-600);background:var(--context-100);padding:16px 18px;font-size:15px;color:var(--ink-700)}
.callout.ok{border-left-color:var(--verified-600);background:var(--verified-100)}
.callout strong{color:var(--ink-900)}
.winner{display:flex;gap:20px;align-items:flex-start;flex-wrap:wrap;justify-content:space-between}
.winner .nm,.mcard .nm{font-family:var(--font-display);font-weight:700;font-size:26px;letter-spacing:-.02em;color:var(--chrome-900);margin:4px 0 2px}
.wg{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:18px;margin-top:18px;width:100%}
.wg .l{font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--red-600)}
.wg .v{font-family:var(--font-display);font-weight:700;font-size:20px;color:var(--chrome-900);font-variant-numeric:tabular-nums}
/* booth table */
.tbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:14px}
.tbar input{font-family:var(--font-sans);font-size:14px;padding:10px 12px;border:1px solid var(--ink-300);background:var(--white);color:var(--chrome-900);min-width:280px;flex:1;border-radius:2px}
.tbar input:focus{outline:2px solid var(--red-500);outline-offset:1px;border-color:var(--red-500)}
.tcount{font-family:var(--font-mono);font-size:12px;color:var(--ink-500);letter-spacing:.06em}
/* overflow-x:auto here only below ~700px, where the 6-column table is actually
   wider than its box (measured: overflows up to ~640px, fits from ~768px up).
   Setting it unconditionally silently forces overflow-y to "auto" too (a CSS
   rule: an axis left at "visible" gets promoted to "auto" the moment the other
   axis isn't "visible") — that turns .tscroll into its OWN scroll container,
   which becomes the sticky positioning context for the table header inside it
   instead of the page/viewport. Since .tscroll itself never scrolls internally
   (the page does), the header could only "stick" for the sliver of page-scroll
   where .tscroll's own box was still crossing the sticky offset, then behaved
   like a normal static row for the rest of the table — which is what showed up
   as a header-sized band of stale/ghosted row content sitting where the sticky
   header should have been. Scoping the horizontal scroll to only the widths
   that need it keeps the sticky header working (viewport-relative) everywhere
   else.
*/
.tscroll{border:1px solid var(--ink-200);background:var(--white);max-width:100%}
@media(max-width:700px){.tscroll{overflow-x:auto;-webkit-overflow-scrolling:touch}}
.tsentinel{height:1px}
.tmore{text-align:center;padding:16px;font-family:var(--font-mono);font-size:12px;letter-spacing:.08em;color:var(--ink-500);border-top:1px solid var(--ink-100)}
table.booths{width:100%;border-collapse:separate;border-spacing:0;font-size:14px}
table.booths thead th{position:sticky;top:var(--hdr-h,62px);background:var(--chrome-900);color:#fff;font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;text-align:left;padding:10px 14px;font-weight:500}
table.booths td{padding:9px 14px;border-top:1px solid var(--ink-100);vertical-align:top}
table.booths tbody tr:nth-child(2n){background:var(--ink-050)}
table.booths tbody tr:hover{background:var(--red-100)}
td.bn{font-family:var(--font-mono);font-size:13px;color:var(--red-600);width:76px;white-space:nowrap}
td.tv{font-family:var(--font-mono);font-variant-numeric:tabular-nums;text-align:right;width:110px;color:var(--chrome-900)}
.tnote{font-size:13px;color:var(--ink-500);margin-top:10px}
.empty{padding:26px;text-align:center;color:var(--ink-500);font-size:14px}
/* faq */
details.faq{border-top:1px solid var(--ink-200);padding:0}
details.faq:last-of-type{border-bottom:1px solid var(--ink-200)}
details.faq summary{cursor:pointer;list-style:none;padding:16px 34px 16px 0;font-weight:600;color:var(--chrome-900);font-size:16px;position:relative}
details.faq summary::-webkit-details-marker{display:none}
details.faq summary:after{content:"+";position:absolute;right:6px;top:14px;font-family:var(--font-mono);font-size:19px;color:var(--red-600)}
details.faq[open] summary:after{content:"\2013"}
details.faq .a{padding:0 34px 18px 0;color:var(--ink-600);font-size:15px;max-width:80ch}
/* nearby */
.ng{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:1px;background:var(--ink-200);border:1px solid var(--ink-200)}
.nc{background:var(--white);padding:16px;display:block;color:inherit;transition:background .2s ease,transform .2s ease}
.nc:hover{background:var(--ink-050);text-decoration:none;transform:translateY(-2px)}
.nc .ac{font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;color:var(--ink-400)}
.nc .nn{font-family:var(--font-display);font-weight:700;font-size:17px;color:var(--chrome-900);letter-spacing:-.02em;margin:4px 0 2px}
.nc:hover .nn{color:var(--red-600)}
.nc .mt{font-family:var(--font-mono);font-size:11px;color:var(--ink-500);letter-spacing:.06em;text-transform:uppercase}
.pnav{display:flex;justify-content:space-between;gap:14px;margin-top:28px;flex-wrap:wrap}
.disc{margin-top:36px;border-top:1px solid var(--ink-200);padding-top:16px;font-size:13px;color:var(--ink-500);max-width:80ch}
footer.ft{background:var(--chrome-900);color:var(--chrome-text-muted);margin-top:48px;padding:34px 0}
footer.ft a{color:var(--chrome-text)}footer.ft .cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:26px;font-size:14px}
footer.ft .h{font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--chrome-text-muted);margin-bottom:10px}
footer.ft ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:7px}
footer.ft .btm{border-top:1px solid var(--chrome-line);margin-top:26px;padding-top:16px;font-size:12px;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap}
/* .nlinks used to be display:none here — a leftover from before the "v3
   shared" nav below switched every booths page to a horizontally-scrolling
   nav bar (overflow-x:auto, see ~line 137) instead of collapsing/hiding it.
   That switch never removed this older rule, so display:none still won
   (nothing later re-set display), and the nav menu was invisible on every
   viewport under 820px — every booths page had literally no way to
   navigate the site on mobile, just the logo. */
@media(max-width:820px){.wrap{padding:0 16px}.nav-in{padding:10px 16px}}
/* hero + locator map */
.hgrid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:40px;align-items:stretch}
.locator{position:relative;border:1px solid var(--ink-200);background:var(--white) url("../assets/tn-map.svg") center 14px/auto calc(100% - 46px) no-repeat;height:100%;min-height:320px;margin:0;transition:border-color .25s ease,box-shadow .25s ease}
.locator:hover{border-color:var(--red-300);box-shadow:0 6px 22px rgba(13,13,15,.07)}
.locator svg path{transition:opacity .3s ease}
.locator:hover svg path{opacity:.82}
.locator svg{position:absolute;left:0;right:0;top:14px;bottom:32px;width:100%;height:calc(100% - 46px)}
.locator .cap{position:absolute;left:0;right:0;bottom:0;background:rgba(27,42,71,.92);color:var(--chrome-text);font-family:var(--font-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;padding:6px 8px;text-align:center}
/* sitting member with photo */
.mcard{display:grid;grid-template-columns:minmax(0,1fr) 168px;gap:26px;align-items:start}
.mphoto{border:1px solid var(--ink-200);background:var(--ink-100);aspect-ratio:3/4;object-fit:cover;object-position:top center;width:100%;display:block}
.mphoto-cap{font-family:var(--font-mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-400);margin-top:6px;text-align:center}
/* ads */
.ad{border:1px dashed var(--ink-300);background:var(--ink-050);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:4px;min-height:110px;margin:34px 0;text-align:center}
.ad .lb{font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-400)}
.ad .sz{font-family:var(--font-mono);font-size:11px;color:var(--ink-300)}
.ad.tall{min-height:250px}
@media(max-width:900px){.hgrid{grid-template-columns:1fr}.locator{max-width:300px;aspect-ratio:640/854;height:auto}.mcard{grid-template-columns:1fr}.mphoto{max-width:180px}}
/* Sticky table header offset must match the sticky nav's real rendered height,
   not an assumed constant — the nav is shorter once its padding shrinks at the
   820px nav-in breakpoint above (57px measured vs ~61px above it). Leaving this
   at a stale/guessed value (it used to just be "0") let the sticky header trigger
   while still partly behind the nav, so a sliver of the scrolled-past data row
   showed through above it — this is what was reported as a bar "overlapping the
   data". */
@media(max-width:820px){table.booths thead th{top:var(--hdr-h-sm,58px)}}
/* v3 shared */
.btn{border-radius:999px}
.chip{border-radius:999px}
.nav-in{flex-wrap:nowrap!important}
.brand-tag{white-space:nowrap}
.nlinks{flex:1;min-width:0;flex-wrap:nowrap!important;overflow-x:auto;scrollbar-width:none}
.nlink{white-space:nowrap;flex:none}.nlinks::-webkit-scrollbar{display:none}
.mphoto{border-width:5px;border-style:solid;border-color:var(--pc,var(--ink-200))}
.fmain{display:grid;grid-template-columns:1.5fr repeat(4,1fr);gap:32px;padding-bottom:30px}
@media(max-width:1080px){.fmain{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.fmain{grid-template-columns:1fr;gap:24px}}
.fbrand .fb span{font-family:var(--font-display);font-weight:700;font-size:20px;letter-spacing:-.03em;color:var(--chrome-text)}
.fbrand .fb em{font-style:normal;color:var(--red-500)}
.fbrand p{margin:10px 0 0;font-size:13px;line-height:1.6;max-width:34ch;color:var(--chrome-text-muted)}
.fsoc{margin-top:14px;display:flex;gap:8px;flex-wrap:wrap}
.fsoc a{font-family:var(--font-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;border:1px solid rgba(255,255,255,.16);border-radius:999px;padding:7px 13px;color:var(--chrome-text-muted);text-decoration:none}
.fsoc a:hover{color:var(--chrome-text);border-color:var(--chrome-text)}
.ft .h{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--chrome-text-muted);opacity:.7}
.ft ul{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}
.ft ul a{font-size:13px;color:var(--chrome-text-muted);text-decoration:none}
.ft ul a:hover{color:var(--chrome-text)}
.fnote{border-top:1px solid rgba(255,255,255,.14);padding:18px 0;font-size:12.5px;line-height:1.6;color:var(--chrome-text-muted)}
.fnote strong{color:var(--chrome-text)}
.ft .btm{border-top:1px solid rgba(255,255,255,.14);padding-top:16px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-family:var(--font-mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--chrome-text-muted);opacity:.75}
.flinks{display:flex;gap:14px}.flinks a{color:var(--chrome-text-muted);text-decoration:none}.flinks a:hover{color:var(--chrome-text)}
