/* The Chop base styles: tokens, page background, header bar, search dropdown, Teams popover, footer. Light glossy theme (D19). */
:root{--navy:#0c2340;--navy2:#1d3a63;--ink:#0f1c2e;--mut:#5d6b7e;--faint:#95a1b1;--hair:rgba(12,35,64,.10);
  --good:#16a34a;--goodk:#0d7a37;--bad:#b0583f;--badk:#9c4631;
  --card:linear-gradient(180deg,#ffffff 0%,#f7f9fc 100%);
  --sh:0 1px 0 #fff inset,0 18px 40px -22px rgba(12,35,64,.35),0 3px 10px -4px rgba(12,35,64,.12);}
*{box-sizing:border-box}
html,body{margin:0}
body{font-family:Manrope,system-ui,sans-serif;color:var(--ink);background:#eef2f7;-webkit-font-smoothing:antialiased;font-size:13px}
.num,td{font-variant-numeric:tabular-nums}
a{color:inherit;text-decoration:none}
#bg{position:fixed;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(1100px 600px at 30% 0%,rgba(255,255,255,.95),rgba(255,255,255,0) 70%),radial-gradient(1200px 700px at 80% 10%,rgba(29,58,99,.10),transparent 70%),linear-gradient(180deg,#f7f9fc 0%,#e9eef5 100%)}
#app{position:relative;z-index:1;max-width:1560px;margin:0 auto;padding:12px 20px 26px}
/* logo (D24): 84px tall on wide screens, the square icon at 820px and below */
.tclogo{display:inline-flex;align-items:center;flex:none;transition:transform .18s ease,filter .18s ease}
.tclogo:hover{transform:translateY(-2px);filter:drop-shadow(0 4px 6px rgba(12,35,64,.25))}
.tclogo img{height:84px;width:auto;display:block}
.tclogo .lg-icon{display:none}
/* top bar */
.bar{display:flex;align-items:center;gap:14px;position:relative;z-index:30}
.search{position:relative;flex:0 1 460px;margin-left:10px}
.search input{width:100%;font:600 14px Manrope;color:var(--ink);border:0;border-radius:99px;padding:11px 16px 11px 40px;outline:none;
  background:linear-gradient(180deg,#fff,#f3f6fa);box-shadow:0 1px 0 #fff inset,0 0 0 1px var(--hair),0 8px 20px -12px rgba(12,35,64,.35)}
.search input:focus{box-shadow:0 0 0 2px var(--navy2),0 8px 20px -12px rgba(12,35,64,.35)}
.search>svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:16px;height:16px;stroke:var(--faint);pointer-events:none}
.dd{position:absolute;left:0;right:0;top:calc(100% + 6px);border-radius:18px;padding:6px;background:rgba(255,255,255,.98);backdrop-filter:blur(10px);
  box-shadow:0 0 0 1px var(--hair),0 24px 50px -20px rgba(12,35,64,.45);max-height:430px;overflow:auto;z-index:40}
.dd[hidden]{display:none}
.dd a{display:grid;grid-template-columns:36px 1fr auto;align-items:center;gap:10px;padding:6px 8px;border-radius:12px}
.dd a:hover,.dd a.on{background:#eef2f7}
.dd img.hs{width:36px;height:36px;border-radius:50%;object-fit:cover;background:#e3e9f1}
.dd b{font-weight:800;color:var(--navy)}
.dd b mark{background:rgba(22,163,74,.16);color:inherit;border-radius:3px}
.dd small{display:flex;align-items:center;flex-wrap:wrap;gap:3px 6px;color:var(--mut);font-size:11.5px}
.dd small .tl{width:16px;height:16px}
.dd small .ab{font-weight:800;color:var(--navy2)}
.dd small .last{font-weight:700;color:var(--faint)}
.dd .yrs{font-size:11px;font-weight:700;color:var(--faint)}
.dd .none{padding:12px;color:var(--mut)}
.teams{margin-left:auto;position:relative}
.tbtn{display:flex;align-items:center;gap:8px;font:800 12.5px Manrope;color:var(--navy);border:0;border-radius:99px;padding:9px 16px;cursor:pointer;
  background:linear-gradient(180deg,#fff,#eef2f7);box-shadow:0 1px 0 #fff inset,0 0 0 1px var(--hair),0 6px 14px -8px rgba(12,35,64,.35)}
.tbtn img{width:26px;height:26px;margin:-6px 0 -6px -10px}
/* the Stats page link beside Teams: right-aligned with it */
.navlink{margin-left:auto;font:800 12.5px Manrope;color:var(--navy);border-radius:99px;padding:9px 14px;background:linear-gradient(180deg,#fff,#eef2f7);box-shadow:0 1px 0 #fff inset,0 0 0 1px var(--hair),0 6px 14px -8px rgba(12,35,64,.35)}
.navlink.on{background:linear-gradient(180deg,#2a4a78,var(--navy));color:#fff}
.navlink+.teams{margin-left:0}
.tbtn img[hidden]{display:none}
.tpop{position:absolute;right:0;top:calc(100% + 8px);width:min(640px,94vw);border-radius:22px;padding:14px 16px;background:rgba(255,255,255,.98);backdrop-filter:blur(10px);
  box-shadow:0 0 0 1px var(--hair),0 30px 60px -24px rgba(12,35,64,.5);display:grid;grid-template-columns:1fr 1fr;gap:16px;z-index:40}
.tpop[hidden]{display:none}
.tpop .none{padding:8px;color:var(--mut)}
.tpop h5{margin:0 0 6px;font:800 10.5px Manrope;letter-spacing:.14em;text-transform:uppercase;color:var(--navy2)}
.tpop .dv{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}
.tpop .dv i{font:800 9.5px Manrope;font-style:normal;letter-spacing:.12em;color:var(--faint);text-transform:uppercase;padding-left:4px}
.tpop .dv div{display:flex;flex-direction:column;gap:3px}
.tm{display:flex;align-items:center;gap:6px;padding:5px 6px;border-radius:10px;font:800 12px Manrope;color:var(--ink)}
.tm img{width:22px;height:22px}
.tm:hover{background:#eef2f7}
.tm.on{background:linear-gradient(180deg,#2a4a78,var(--navy));color:#fff}
/* footer: full logo beside source and as-of line */
.foot{display:flex;align-items:center;gap:18px;margin-top:30px;padding-top:18px;border-top:2px dashed rgba(200,16,46,.28);color:var(--mut);font-size:11.5px;line-height:1.5}
.foot .fl{height:84px;width:auto;flex:none}
@media (max-width:820px){
  #app{padding:10px 10px 20px}
  .tclogo img{height:42px}.tclogo .lg-full{display:none}.tclogo .lg-icon{display:block}
  .bar{flex-wrap:wrap;gap:8px}
  .search{order:3;flex:1 1 100%;margin:0}
  .tbtn{padding:9px 14px}
  .tpop{grid-template-columns:1fr;right:-4px;max-height:70vh;overflow:auto}
  .foot{flex-direction:column;align-items:flex-start;gap:8px}.foot .fl{height:72px}
}
/* home page */
.hero{text-align:center;padding:18px 0 22px}
.hero h1{margin:0;font:700 38px Fraunces,serif;color:var(--navy);letter-spacing:-.02em}
.hero p{margin:8px 0 18px;color:var(--mut);font-size:15px}
.search.big{flex:none;max-width:640px;margin:0 auto;position:relative;text-align:left}
.search.big input{font-size:17px;padding:15px 20px 15px 48px}
.search.big>svg{left:18px;width:19px;height:19px}
.card{background:var(--card);border-radius:22px;box-shadow:var(--sh);padding:16px 18px;margin-bottom:18px;position:relative}
.card h2,.listbar h2{margin:0 0 12px;font:800 11px Manrope;letter-spacing:.16em;text-transform:uppercase;color:var(--navy2)}
.tgrid{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.divs{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.dcol{display:flex;flex-direction:column;gap:4px;min-width:0}
.dcol i{font:800 9.5px Manrope;font-style:normal;letter-spacing:.12em;color:var(--faint);text-transform:uppercase;padding:0 6px 4px;border-bottom:1px solid var(--hair);margin-bottom:2px}
.trow{display:flex;align-items:center;gap:9px;height:46px;padding:0 8px;border-radius:12px;min-width:0;transition:background .12s}
.trow:hover{background:#eef2f7;box-shadow:0 0 0 1px var(--hair)}
.trow img{width:32px;height:32px;flex:none;object-fit:contain}
.trow span{display:flex;flex-direction:column;justify-content:center;min-width:0;line-height:1.15}
.trow small{font:600 10.5px Manrope;color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.trow b{font:800 13px Manrope;color:var(--navy);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tgrid h3{margin:0 0 8px;font:700 18px Fraunces,serif;color:var(--navy)}
.listbar{display:flex;align-items:center;justify-content:space-between;margin:6px 4px 10px}
.listbar h2{margin:0}
.listbar label,.ctl label{font:700 12px Manrope;color:var(--mut);display:flex;align-items:center;gap:6px}
select,.ctl input{font:700 13px Manrope;color:var(--navy);border:0;border-radius:99px;padding:7px 12px;background:linear-gradient(180deg,#fff,#eef2f7);box-shadow:0 0 0 1px var(--hair)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start}
.two .card{margin-bottom:0}
.lh{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.lh h3{margin:0;font:700 20px Fraunces,serif;color:var(--navy)}
.lh small{display:block;font:600 11.5px Manrope;color:var(--mut);margin-top:2px}
.ctl input{width:74px}
table.pl{width:100%;border-collapse:collapse}
table.pl th{font:800 9.5px Manrope;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);text-align:right;padding:4px 6px}
table.pl th:nth-child(2),table.pl td:nth-child(2){text-align:left}
table.pl td{padding:6px;border-top:1px solid var(--hair);text-align:right;white-space:nowrap}
table.pl td.rk{color:var(--faint);font-weight:700;width:28px}
table.pl td.nm{text-align:left;white-space:normal}
table.pl td.nm a{display:flex;align-items:center;gap:9px}
table.pl td.nm img.hs{width:30px;height:30px;border-radius:50%;background:#e3e9f1;object-fit:cover;flex:none}
table.pl td.nm b{font-weight:800;color:var(--navy)}
table.pl td.nm small{display:flex;align-items:center;gap:4px;color:var(--mut);font-size:11px}
table.pl td.nm small img{width:14px;height:14px}
table.pl tr:hover td{background:#f3f6fa}
.pill{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;min-width:62px;padding:4px 10px;border-radius:99px;
  background:linear-gradient(180deg,#fff,#f1f4f8);box-shadow:0 0 0 1px var(--hair);line-height:1.1}
.pill b{font-weight:800;font-size:13px;color:var(--navy)}
.pill em{font-style:normal;font-size:9.5px;font-weight:700;color:var(--faint)}
.pill.g{background:radial-gradient(circle at 36% 24%,#fff 0%,#fff 12%,color-mix(in oklab,var(--good) calc(var(--i)*14% + 3%),#f4f8f6) 38%,color-mix(in oklab,var(--good) calc(var(--i)*34% + 12%),#dfe9e4) 100%);
  box-shadow:inset 0 2px 2px #fff,0 0 0 calc(1px + var(--i)*1.5px) rgba(34,197,94,calc(.22 + var(--i)*.5)),0 0 calc(4px + var(--i)*14px) rgba(34,197,94,calc(.10 + var(--i)*.30))}
.pill.g b{color:color-mix(in oklab,var(--goodk) calc(55% + var(--i)*45%),var(--navy))}.pill.g em{color:var(--goodk)}
.pill.b{background:radial-gradient(circle at 36% 24%,#fff 0%,#fdf9f7 12%,color-mix(in oklab,var(--bad) calc(var(--i)*7% + 7%),#f7f1ee) 40%,color-mix(in oklab,var(--bad) calc(var(--i)*12% + 14%),#ebe4e1) 100%);
  box-shadow:inset 0 2px 2px #fff,0 0 0 1.5px rgba(176,88,63,calc(.32 + var(--i)*.2))}
.pill.b b,.pill.b em{color:var(--badk)}
.msg{padding:14px 4px;color:var(--mut)}
.more{display:block;margin:12px auto 0;font:800 12px Manrope;color:var(--navy);border:0;border-radius:99px;padding:8px 18px;cursor:pointer;background:linear-gradient(180deg,#fff,#eef2f7);box-shadow:0 0 0 1px var(--hair)}
.src{margin-top:10px;font-size:11px;color:var(--faint)}
@media (max-width:1100px){.two{grid-template-columns:1fr}.tgrid{grid-template-columns:1fr}}
@media (max-width:820px){
  .hero h1{font-size:27px}.hero p{font-size:13.5px}
  .tgrid{gap:18px}
    .card{padding:14px 12px;border-radius:18px}
  table.pl td.hide-s,table.pl th.hide-s{display:none}
}
.tog{display:inline-flex;border-radius:99px;padding:3px;background:#e6ecf3;box-shadow:0 0 0 1px var(--hair) inset}
.tog button{font:800 11.5px Manrope;color:var(--mut);border:0;background:none;border-radius:99px;padding:5px 12px;cursor:pointer}
.tog button.on{background:linear-gradient(180deg,#2a4a78,var(--navy));color:#fff}
@media (max-width:560px){.divs{grid-template-columns:1fr;gap:10px}.dcol{display:grid;grid-template-columns:1fr 1fr;column-gap:8px}.dcol>i{grid-column:1/-1}.trow{height:42px;gap:7px;padding:0 4px}.trow img{width:28px;height:28px}.trow b{font-size:12.5px}}
.ctl label[hidden]{display:none}
.ctl input[type=checkbox]{width:auto;padding:0;box-shadow:none;background:none;border-radius:0}
