:root{
  --bg:#0a0f15; --card:#101a24; --card2:#17222e; --line:#23323f;
  --text:#eef4fa; --muted:#8597a8; --good:#4f9fe2;
  --disp:'Oswald',-apple-system,BlinkMacSystemFont,sans-serif;
  --ui:'Inter',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  font-family:var(--ui);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html,body{overflow-x:hidden;}
body{margin:0;background:radial-gradient(130% 90% at 50% 0%,#10202e,#05080c);
  color:var(--text);font-family:var(--ui);
  padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom);}
a{color:inherit;text-decoration:none;}
.shell{width:100%;max-width:400px;margin:0 auto;padding:13px;}

/* ============ player card ============ */
.mcard{width:100%;background:linear-gradient(180deg,#13212e,#0c1620);
  border:1px solid var(--line);border-radius:18px;overflow:hidden;
  box-shadow:0 22px 60px rgba(0,0,0,.62);font-variant-numeric:tabular-nums;}

.header{display:flex;align-items:center;gap:11px;padding:13px 14px 12px;border-bottom:3px solid var(--c1);
  background:linear-gradient(115deg,color-mix(in srgb,var(--c1) 24%,transparent),transparent 62%);}
.photo{width:52px;height:52px;border-radius:11px;object-fit:cover;object-position:top center;
  border:2px solid var(--c1);flex:0 0 auto;background:var(--card2);}
.hnamewrap{flex:1;min-width:0;}
.nrow{display:flex;align-items:center;gap:9px;}
.nname{font-family:var(--disp);font-weight:700;font-size:23px;text-transform:uppercase;
  letter-spacing:.005em;line-height:.95;overflow-wrap:anywhere;}
.nsub{margin-top:3px;font-size:11px;font-weight:600;color:var(--muted);letter-spacing:.02em;}
/* subtle in-card season picker: looks like the sub-line text, with a tiny caret */
.yearsel{appearance:none;-webkit-appearance:none;background:transparent;border:0;margin:0;
  font:inherit;letter-spacing:inherit;color:var(--good);cursor:pointer;line-height:1;
  vertical-align:baseline;padding:0 12px 0 1px;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6' fill='none' stroke='%234f9fe2' stroke-width='1.6'><path d='M1 1l4 4 4-4'/></svg>");
  background-repeat:no-repeat;background-position:right 1px center;background-size:7px 5px;}
.yearsel:hover,.yearsel:focus{outline:none;color:#9cd0f5;}
.yearsel option{color:#06141f;font-weight:600;}
.hlogo{width:42px;height:42px;object-fit:contain;flex:0 0 auto;filter:drop-shadow(0 2px 4px rgba(0,0,0,.4));}
.nbrand{flex:0 0 auto;align-self:flex-start;margin-left:8px;cursor:pointer;white-space:nowrap;
  font-family:var(--disp);font-weight:700;font-size:11.5px;letter-spacing:.1em;color:var(--good);}
.nbrand:active{opacity:.7;}

.hero{display:flex;align-items:center;gap:16px;padding:13px 16px 5px;}
.ovcol{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:2px;}
.ovlbl{font-size:9px;font-weight:800;letter-spacing:.13em;color:var(--muted);}
.ring{width:90px;height:90px;border-radius:50%;position:relative;display:grid;place-items:center;
  background:conic-gradient(var(--oc) calc(var(--ovp)*1%), #1d2b38 0);
  box-shadow:0 0 22px -3px color-mix(in srgb,var(--c1) 75%,transparent);}
.ring::before{content:"";position:absolute;inset:8px;border-radius:50%;
  background:radial-gradient(circle at 50% 38%,#1a2835,#0f1b25);}
.ring-num{position:relative;z-index:1;font-family:var(--disp);font-weight:700;font-size:31px;
  color:#fff;line-height:1;}
.ring-num span{font-size:14px;opacity:.8;}
.ovword{font-family:var(--disp);font-weight:600;font-size:12px;letter-spacing:.05em;
  color:#cfe1f1;text-transform:uppercase;}
.ovrank{font-size:10px;font-weight:700;color:var(--muted);letter-spacing:.02em;margin-top:1px;}
.info{flex:1;min-width:0;}
.irow{display:flex;justify-content:space-between;gap:8px;padding:3px 0;border-bottom:1px solid rgba(255,255,255,.05);}
.irow:last-child{border-bottom:0;}
.il{font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);}
.iv{font-size:13px;font-weight:800;}

/* headline raw counting stats (G / A / PTS) */
.rawstats{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;padding:11px 14px 2px;}
.rawcell{background:var(--card2);border:1px solid var(--line);border-radius:11px;padding:9px 6px 8px;text-align:center;}
.rawn{font-family:var(--disp);font-weight:700;font-size:27px;color:#fff;line-height:1;}
.rawl{font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-top:3px;}
.rawr{font-size:10px;font-weight:700;color:var(--good);margin-top:2px;}

/* EV pillar tiles (tier 2 — enlarged, individually flippable) */
.ev{display:grid;grid-template-columns:1fr 1fr;gap:7px;padding:10px 14px 0;}
.evtile{min-width:0;cursor:pointer;perspective:900px;}
.evfront{border-radius:13px;padding:11px 13px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.11);}
.evl{font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:rgba(255,255,255,.92);}
.evn{font-family:var(--disp);font-weight:700;font-size:40px;color:#fff;line-height:.92;margin-top:5px;}
.evn span{font-size:18px;opacity:.82;}
.evrk{font-size:11px;font-weight:700;color:rgba(255,255,255,.78);margin-top:4px;}

/* detail grid (tier 3 — individually flippable) */
.tiles{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;padding:7px 14px 3px;}
.tile{flex:0 0 calc((100% - 12px)/3);min-width:0;cursor:pointer;perspective:700px;}
.tfront{border-radius:10px;padding:7px 5px 8px;text-align:center;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);}
.tl{font-size:9.5px;font-weight:700;letter-spacing:.02em;text-transform:uppercase;color:rgba(255,255,255,.84);
  min-height:21px;display:flex;align-items:center;justify-content:center;line-height:1.05;}
.tn{font-family:var(--disp);font-weight:700;font-size:23px;color:#fff;line-height:1;margin-top:2px;}
.tn span{font-size:12px;opacity:.8;}
.trk{font-size:10px;font-weight:700;color:rgba(255,255,255,.72);margin-top:2px;}

/* per-tile flip */
.tflip-in{position:relative;transform-style:preserve-3d;transition:transform .5s cubic-bezier(.4,.15,.2,1);}
.tflip.f .tflip-in{transform:rotateY(180deg);}
.face{backface-visibility:hidden;-webkit-backface-visibility:hidden;}
.back{position:absolute;inset:0;transform:rotateY(180deg);background:var(--card2);
  border:1px solid var(--line);border-radius:11px;display:flex;align-items:center;justify-content:center;
  text-align:center;padding:8px;}
.bktxt{font-size:11px;line-height:1.34;color:#cfdcea;font-weight:600;}
.bktxt.sm{font-size:9px;line-height:1.22;}

/* ============ fantasy section (OFF by default; toggled on per card) ============ */
.fantogglewrap{padding:9px 14px 2px;}
.fantoggle{width:100%;display:flex;align-items:center;justify-content:center;gap:7px;
  background:var(--card2);border:1px solid var(--line);border-radius:11px;cursor:pointer;
  color:var(--muted);font-family:var(--disp);font-weight:600;font-size:12px;letter-spacing:.09em;
  text-transform:uppercase;padding:9px 12px;}
.fantoggle .fticon{font-size:15px;font-weight:800;line-height:1;color:var(--good);}
.fantoggle.on{color:var(--text);border-color:color-mix(in srgb,var(--good) 55%,var(--line));}
.fantoggle:active{transform:translateY(1px);}
.fansec{display:none;margin:8px 14px 2px;padding:11px 12px 12px;border:1px solid var(--line);
  border-radius:14px;background:linear-gradient(180deg,#14222f,#0d1822);}
.mcard.fan-on .fansec{display:block;}
.print .fantogglewrap{display:none;}   /* share image is the clean analytics card */
.fanhead{display:flex;align-items:center;gap:10px;}
.fanttl{font-family:var(--disp);font-weight:700;font-size:12px;letter-spacing:.13em;color:var(--good);}
.fanval{flex:1;display:flex;flex-direction:column;line-height:1.05;}
.fanval .fvn{font-family:var(--disp);font-weight:700;font-size:19px;color:#eef4fa;}
.fanval .fvl{font-size:9.5px;font-weight:600;letter-spacing:.02em;color:var(--muted);}
.fanflag{font-size:10px;font-weight:800;letter-spacing:.06em;padding:3px 8px;border-radius:7px;}
.fanflag.hot{background:rgba(255,90,70,.18);color:#ff8b7c;}
.fanflag.cold{background:rgba(60,140,255,.18);color:#7ab6ff;}
.fannote{font-size:10.5px;color:#aebccb;margin-top:7px;line-height:1.45;}
.fantiles{display:flex;flex-wrap:wrap;gap:5px;margin-top:9px;}
.fantile{flex:0 0 calc((100% - 15px)/4);border-radius:9px;padding:6px 4px 5px;text-align:center;color:#fff;}
.ftn{font-family:var(--disp);font-weight:700;font-size:16px;line-height:1;}
.ftn span{font-size:9px;opacity:.8;}
.ftl{font-size:8.5px;font-weight:700;letter-spacing:.02em;opacity:.92;margin-top:2px;text-transform:uppercase;}
.ftv{font-size:9px;font-weight:600;opacity:.8;margin-top:1px;}

.meta{padding:10px 15px 13px;margin-top:7px;border-top:1px solid var(--line);
  font-size:9px;color:var(--muted);text-align:center;}
.sharebar{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-top:11px;}
.sb{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;
  padding:11px 3px;border-radius:13px;cursor:pointer;text-decoration:none;border:1px solid var(--line);
  font-family:var(--ui);font-size:10.5px;font-weight:700;color:#fff;background:var(--card2);}
.sb .ic{font-size:17px;line-height:1;font-weight:800;}
.sb:active{transform:translateY(1px);}
.sbtext{background:#2f7fe0;border-color:#3a8ae8;}
.sbx{background:#0d1217;border-color:#2a3340;}
.sbfb{background:#1877F2;border-color:#1877F2;}
.sbbs{background:#1185fe;border-color:#1185fe;}
.sbdl{background:var(--good);border-color:var(--good);color:#06141f;}
.print .sharebar,.print .sitefoot,.print .carddrawer{display:none;} /* hidden in the rendered share image */

/* "search another player" drawer at the bottom of a card page */
.carddrawer{margin-top:30px;padding:15px 13px 14px;background:linear-gradient(180deg,var(--card),#0c151d);
  border:1px solid var(--line);border-radius:16px;}
.cd-label{text-align:center;font-family:var(--disp);font-weight:600;font-size:13px;
  letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:10px;}

/* ============ search-first index ============ */
.search-wrap{min-height:64vh;display:flex;flex-direction:column;justify-content:center;}
.brandbig{font-family:var(--disp);font-size:34px;font-weight:700;letter-spacing:.08em;text-align:center;
  background:linear-gradient(90deg,var(--good),#9cd0f5);-webkit-background-clip:text;background-clip:text;color:transparent;}
.tagline{text-align:center;color:var(--muted);font-size:13px;margin:5px 0 16px;}
.seasonsw{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin:4px 0 20px;}
.seasonsw a{padding:7px 12px;border-radius:9px;font-size:13px;font-weight:700;color:var(--muted);
  background:var(--card);border:1px solid var(--line);}
.seasonsw a.on{background:var(--good);color:#06141f;border-color:var(--good);}
.seasonsw a.win{border-color:color-mix(in srgb,var(--good) 55%,var(--line));color:#bcd7ef;}
.seasonsw a.win.on{background:var(--good);color:#06141f;border-color:var(--good);}
.potog{display:flex;justify-content:center;margin:9px 14px 1px;}
.potog a{padding:6px 15px;font-size:10.5px;font-weight:800;letter-spacing:.04em;text-decoration:none;
  color:var(--muted);background:var(--card2);border:1px solid var(--line);}
.potog a:first-child{border-radius:9px 0 0 9px;border-right:0;}
.potog a:last-child{border-radius:0 9px 9px 0;}
.potog a.on{background:var(--good);color:#06141f;border-color:var(--good);}
.potog.idx{margin:2px 0 18px;}
.potog.idx a{padding:8px 16px;font-size:12px;}
.searchbox{position:relative;}
.search{width:100%;background:var(--card);border:1px solid var(--line);color:var(--text);
  padding:15px 18px;border-radius:14px;font-size:17px;box-shadow:0 10px 30px rgba(0,0,0,.4);}
.search:focus{outline:none;border-color:var(--good);}
.results{position:absolute;left:0;right:0;top:60px;background:var(--card);border:1px solid var(--line);
  border-radius:14px;overflow:hidden;max-height:54vh;overflow-y:auto;display:none;z-index:5;box-shadow:0 18px 50px rgba(0,0,0,.5);}
.results.on{display:block;}
/* in the bottom drawer the list flows in place (pushes the footer down) instead of
   floating up over the share bar above it */
.carddrawer .results{position:static;margin-top:10px;max-height:60vh;box-shadow:none;}
.ritem{display:flex;align-items:center;gap:11px;padding:11px 14px;border-bottom:1px solid var(--line);}
.ritem:last-child{border-bottom:0;} .ritem:active{background:var(--card2);}
.rov{width:34px;height:30px;border-radius:8px;display:grid;place-items:center;color:#fff;font-weight:800;font-size:13px;flex:0 0 auto;font-family:var(--disp);}
.rname{font-weight:700;font-size:15px;} .rsub{color:var(--muted);font-size:12px;}
.hint{text-align:center;color:var(--muted);font-size:12px;margin-top:14px;}
.navlink{display:block;text-align:center;margin-top:16px;font-size:13px;font-weight:700;
  letter-spacing:.01em;color:var(--good);}
.navlink:active{opacity:.7;}
.sitefoot{text-align:center;color:var(--muted);font-size:12px;padding:18px 13px 24px;opacity:.7;}
.sitefoot a{color:inherit;text-decoration:underline;}

/* ============ landing page ============ */
.lp-hero{padding:34px 0 8px;}
.lp-sub{text-align:center;color:var(--muted);font-size:13.5px;margin:6px 0 22px;letter-spacing:.01em;}
.lp-explain{margin-top:30px;}
.lp-h2{font-family:var(--disp);font-weight:600;font-size:13px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--muted);text-align:center;margin:0 0 16px;}
.lp-feat{display:flex;gap:12px;align-items:flex-start;padding:13px 15px;margin-bottom:9px;
  background:linear-gradient(180deg,var(--card),var(--card2));border:1px solid var(--line);border-radius:14px;}
.lp-dot{flex:0 0 auto;width:9px;height:9px;border-radius:50%;margin-top:5px;background:var(--good);
  box-shadow:0 0 12px -1px var(--good);}
.lp-ft{font-family:var(--disp);font-weight:600;font-size:15px;letter-spacing:.04em;text-transform:uppercase;color:var(--text);}
.lp-fd{font-size:12.5px;line-height:1.5;color:var(--muted);margin-top:3px;}
.lp-fd b{color:#cfe1f1;font-weight:700;}
.lp-note{font-size:12px;line-height:1.55;color:var(--muted);text-align:center;margin:16px 6px 22px;}
.lp-note b{color:#cfe1f1;}
.lp-cta{display:block;text-align:center;padding:14px;border-radius:13px;font-weight:800;font-size:14px;
  letter-spacing:.02em;color:#06141f;background:var(--good);box-shadow:0 12px 30px -8px var(--good);}
.lp-cta:active{transform:translateY(1px);}
.lp-cta2{margin-top:10px;background:transparent;color:var(--good);
  box-shadow:inset 0 0 0 1px var(--line);}

/* ============ trade card ============ */
.tcard{width:100%;background:linear-gradient(180deg,#13212e,#0c1620);border:1px solid var(--line);
  border-radius:18px;overflow:hidden;box-shadow:0 22px 60px rgba(0,0,0,.62);font-variant-numeric:tabular-nums;}
.thead{display:grid;grid-template-columns:1fr auto 1fr;align-items:start;padding:15px 14px;gap:10px;}
.tp{min-width:0;border-top:3px solid var(--c1);padding-top:8px;}
.tside{font-size:9px;text-transform:uppercase;letter-spacing:.08em;color:var(--good);margin-bottom:4px;font-weight:800;}
.tphead{display:flex;align-items:center;gap:9px;} .tphead-r{justify-content:flex-end;}
.tn2{font-family:var(--disp);font-size:16px;font-weight:700;text-transform:uppercase;line-height:1.05;}
.tm{font-size:11px;color:var(--muted);margin-top:3px;display:flex;align-items:center;gap:4px;}
.tpb,.tpb .tm{text-align:right;justify-content:flex-end;}
.tshot{width:40px;height:40px;border-radius:9px;object-fit:cover;object-position:top;border:1px solid var(--line);flex:0 0 auto;background:var(--card2);}
.tlogo{width:15px;height:15px;object-fit:contain;}
.tvs{font-size:17px;color:var(--muted);padding-top:14px;}
.tov{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:11px 14px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.tov .n{font-family:var(--disp);font-size:27px;font-weight:700;} .tov .nb{text-align:right;}
.tov .lbl{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.07em;text-align:center;}
.win{color:var(--good);} .lose{color:var(--muted);}
.trow{padding:9px 14px;border-bottom:1px solid var(--line);} .trow:last-of-type{border-bottom:0;}
.tlabel{text-align:center;font-size:12px;color:var(--muted);margin-bottom:5px;}
.tbars{display:grid;grid-template-columns:1fr 1fr;gap:4px;}
.tA,.tB{height:16px;background:#0a141d;border-radius:5px;overflow:hidden;position:relative;}
.tA>span{position:absolute;right:0;height:100%;border-radius:5px;} .tB>span{position:absolute;left:0;height:100%;border-radius:5px;}
.tnum{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin-top:3px;}
.tnum span{font-size:13px;font-weight:800;font-family:var(--disp);} .tnum .nb{text-align:right;}
.edgeA .na{color:var(--good);} .edgeB .nb{color:var(--good);}
.foot{padding:12px 15px;color:var(--muted);font-size:10px;text-align:center;}