/* Mesivta LV Hoops v2 — jersey theme: royal blue + white, sky-blue accent, smoky royal→sky→white fades. */
:root {
  --royal: #2448b8; --royal-d: #1e3fa0; --royal-dd: #16307f; --night: #071237; --night2: #0b1a4d;
  --sky: #6fb6f0; --sky-l: #bfe3fa; --white: #fff;
  --ink: #f3f7ff; --muted: #a9bde6; --line: rgba(191, 227, 250, .14);
  --card: linear-gradient(160deg, rgba(36, 72, 184, .30), rgba(14, 30, 92, .55));
  --card-solid: #0f2264;
  --green: #3ddc97; --red: #ff6b6b; --amber: #ffc94d; --gold: #ffd54a; --silver: #dfe8f5; --bronze: #e39a5b; --ball: #ff7a1a;
  --r: 18px; --font-d: "Anton", "Bebas Neue", Impact, "Arial Narrow", sans-serif; --font-n: "Bebas Neue", "Anton", Impact, sans-serif;
  --smoke: linear-gradient(200deg, #ffffff 0%, #e8f5fe 9%, #bfe3fa 20%, #6fb6f0 38%, #3a6ad2 58%, #2448b8 74%, #1e3fa0 100%);
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; background: var(--night); }
body { margin: 0; font: 15px/1.5 Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; color: var(--ink);
  background: radial-gradient(1200px 600px at 85% -10%, rgba(111, 182, 240, .22), transparent 60%), radial-gradient(900px 500px at -10% 20%, rgba(36, 72, 184, .35), transparent 60%), linear-gradient(180deg, var(--night2), var(--night) 60%);
  background-attachment: fixed; min-height: 100vh; }
a { color: var(--sky-l); text-decoration: none; transition: color .15s; }
a:hover { color: #fff; }
h1, h2, h3 { font-family: var(--font-d); font-weight: 400; letter-spacing: .02em; text-transform: uppercase; line-height: 1.05; }
h1 { font-size: 2.3rem; margin: .5rem 0 .7rem; }
h2 { font-size: 1.35rem; margin: 0 0 .7rem; }
h3 { font-size: 1.05rem; margin: 0 0 .5rem; }
.muted { color: var(--muted); } .small { font-size: .85rem; }
.ico { width: 1.15em; height: 1.15em; vertical-align: -.2em; flex: none; }
.wrap { max-width: 1120px; margin: 0 auto; padding: 14px 16px 48px; }
.sr-name { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.eyebrow { font-size: .72rem; font-weight: 800; letter-spacing: .22em; text-transform: uppercase; color: var(--sky); }
.page-head { margin: 6px 0 12px; } .page-head h1 { margin: .1rem 0 0; font-size: 2.6rem; }
.sec-title { margin: 22px 0 10px; display: flex; align-items: center; gap: 10px; }
.sec-title::after { content: ""; flex: 1; height: 2px; background: linear-gradient(90deg, var(--sky), transparent); opacity: .5; }
.sample-banner { background: repeating-linear-gradient(45deg, #ffcf4d, #ffcf4d 12px, #ffbf1f 12px, #ffbf1f 24px); color: #3a2500; text-align: center; font-weight: 800; font-size: .74rem; padding: 5px 10px; letter-spacing: .03em; position: relative; z-index: 30; }
.sample-banner a { color: #3a2500; text-decoration: underline; }

/* smoky jersey fade */
.smoke { position: relative; overflow: hidden; background: var(--smoke); color: #fff; isolation: isolate; }
.smoke::before { content: ""; position: absolute; inset: -20%; z-index: -1; opacity: .55; mix-blend-mode: soft-light; pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='400'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.008 .02' numOctaves='4' seed='7'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 1.4 -.45'/%3E%3C/filter%3E%3Crect width='600' height='400' filter='url(%23f)'/%3E%3C/svg%3E");
  background-size: cover; animation: drift 26s ease-in-out infinite alternate; }
.smoke::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: linear-gradient(0deg, rgba(14, 33, 110, .55), transparent 55%); }
@keyframes drift { from { transform: translate3d(-3%, -2%, 0) scale(1.05); } to { transform: translate3d(3%, 2%, 0) scale(1.12); } }
.court-deco { position: absolute; inset: 0; width: 100%; height: 100%; color: #fff; opacity: .16; z-index: -1; pointer-events: none; }

/* top bar + nav */
.topbar { position: sticky; top: 0; z-index: 25; display: flex; align-items: center; justify-content: space-between; padding: 10px 16px; padding-top: max(10px, env(safe-area-inset-top));
  background: linear-gradient(180deg, rgba(7, 18, 55, .96), rgba(11, 26, 77, .9)); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border-bottom: 1px solid var(--line); }
.brand { display: flex; gap: 10px; align-items: center; color: #fff; }
.brand-txt { display: flex; flex-direction: column; line-height: 1; } .brand-txt b { font-family: var(--font-d); font-weight: 400; font-size: 1.3rem; letter-spacing: .05em; text-transform: uppercase; }
.brand-txt small { font-size: .62rem; letter-spacing: .2em; text-transform: uppercase; color: var(--sky); margin-top: 3px; font-weight: 700; }
.crest { flex: none; filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .35)); }
.logout { margin: 0; }
.linkbtn { background: none; border: 0; color: inherit; font: inherit; cursor: pointer; padding: 6px 8px; display: inline-flex; gap: 6px; align-items: center; border-radius: 10px; color: var(--muted); font-weight: 600; font-size: .85rem; }
.linkbtn:hover { color: #fff; background: rgba(255, 255, 255, .08); }
.tabs { position: sticky; top: 61px; z-index: 24; display: flex; gap: 4px; overflow-x: auto; padding: 8px 14px; scrollbar-width: none; background: rgba(7, 18, 55, .82); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-bottom: 1px solid var(--line); }
.tabs::-webkit-scrollbar { display: none; }
.tabs a { display: inline-flex; gap: 7px; align-items: center; color: var(--muted); white-space: nowrap; padding: 8px 14px; border-radius: 999px; font-weight: 700; font-size: .88rem; transition: all .18s; }
.tabs a:hover { color: #fff; background: rgba(255, 255, 255, .08); }
.tabs a.on { color: var(--royal-dd); background: #fff; box-shadow: 0 4px 18px rgba(111, 182, 240, .45); }
.tabs a.yt { color: #fff; background: #d42a2a; margin-left: auto; }
.bottomnav { display: none; }
@media (max-width: 760px) {
  .brand-txt small { display: none; } .linkbtn span { display: none; }
  .tabs { top: 57px; padding: 6px 10px; } .tabs a.pri { display: none; } .tabs a { padding: 6px 12px; font-size: .82rem; }
  .bottomnav { display: flex; position: fixed; left: 10px; right: 10px; bottom: max(10px, env(safe-area-inset-bottom)); z-index: 40; justify-content: space-around; padding: 6px; border-radius: 22px;
    background: rgba(9, 22, 70, .9); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border: 1px solid rgba(191, 227, 250, .2); box-shadow: 0 12px 40px rgba(0, 0, 0, .5); }
  .bottomnav a { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 7px 2px 5px; border-radius: 16px; color: var(--muted); font-size: .66rem; font-weight: 700; letter-spacing: .02em; transition: all .18s; }
  .bottomnav a .ico { width: 23px; height: 23px; }
  .bottomnav a.on { color: var(--royal-dd); background: linear-gradient(180deg, #fff, var(--sky-l)); box-shadow: 0 4px 16px rgba(111, 182, 240, .5); }
  body.authed .wrap { padding-bottom: 110px; } body.authed .foot { padding-bottom: 100px; }
  h1 { font-size: 2rem; } .page-head h1 { font-size: 2.2rem; }
}

/* cards, buttons */
.card { background: var(--card); border: 1px solid var(--line); border-radius: var(--r); padding: 16px; margin-bottom: 14px; box-shadow: 0 10px 30px rgba(0, 0, 0, .25), inset 0 1px 0 rgba(255, 255, 255, .06); backdrop-filter: blur(6px); }
.card-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 6px; } .card-head a { font-size: .82rem; font-weight: 700; }
.flash { padding: 11px 14px; border-radius: 12px; margin: 8px 0 12px; font-weight: 700; }
.flash.ok { background: rgba(61, 220, 151, .15); color: #b8f5d9; border: 1px solid rgba(61, 220, 151, .35); } .flash.err { background: rgba(255, 107, 107, .14); color: #ffd0d0; border: 1px solid rgba(255, 107, 107, .4); }
.btn { display: inline-flex; gap: 7px; align-items: center; justify-content: center; border: 1px solid rgba(191, 227, 250, .28); background: rgba(255, 255, 255, .06); color: #fff; padding: 10px 16px; border-radius: 12px; font: inherit; font-weight: 700; cursor: pointer; text-align: center; transition: transform .15s, box-shadow .2s, background .2s; }
.btn:hover { color: #fff; background: rgba(255, 255, 255, .12); transform: translateY(-1px); }
.btn:active { transform: translateY(1px) scale(.98); }
.btn.primary { background: linear-gradient(180deg, #3d66dd, var(--royal)); border-color: rgba(255, 255, 255, .35); box-shadow: 0 6px 20px rgba(36, 72, 184, .55), inset 0 1px 0 rgba(255, 255, 255, .3); }
.btn.primary:hover { box-shadow: 0 8px 28px rgba(111, 182, 240, .55), inset 0 1px 0 rgba(255, 255, 255, .3); }
.btn.white { background: #fff; color: var(--royal-dd); border-color: #fff; } .btn.white:hover { color: var(--royal); background: var(--sky-l); }
.btn.danger { background: rgba(255, 107, 107, .1); color: #ffb3b3; border-color: rgba(255, 107, 107, .45); margin-top: 6px; }
.btn.ghost { background: transparent; }
.btn.small { padding: 6px 11px; font-size: .84rem; border-radius: 10px; }
.btn.block { display: flex; width: 100%; }
.btn.video, .yt-btn { background: linear-gradient(180deg, #ff4b4b, #d42a2a); border-color: rgba(255, 255, 255, .3); color: #fff; box-shadow: 0 6px 18px rgba(212, 42, 42, .35); }
.danger-text { color: var(--red); margin-top: 8px; }
.actions { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0 12px; }
.actions.tools .btn { flex: 1 1 140px; }
.h-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.grid2 { display: grid; grid-template-columns: 1fr; gap: 0 14px; }
@media (min-width: 820px) { .grid2 { grid-template-columns: 1fr 1fr; } }
code { background: rgba(255, 255, 255, .1); padding: 1px 5px; border-radius: 5px; font-size: .85em; }

/* reveal motion */
.js .reveal { opacity: 0; transform: translateY(18px); }
.js .reveal.in { opacity: 1; transform: none; transition: opacity .55s ease var(--d, 0ms), transform .55s cubic-bezier(.2, .8, .2, 1) var(--d, 0ms); }
@media (prefers-reduced-motion: reduce) { .js .reveal { opacity: 1; transform: none; } .smoke::before { animation: none; } * { animation-duration: .01ms !important; transition-duration: .01ms !important; } }

/* forms */
.form label { display: block; font-weight: 700; font-size: .84rem; margin-bottom: 12px; color: var(--sky-l); letter-spacing: .02em; }
.form input:not([type=checkbox]):not([type=file]), .form select, .form textarea { display: block; width: 100%; margin-top: 5px; padding: 11px 12px; border: 1px solid rgba(191, 227, 250, .25); border-radius: 12px; font: inherit; font-size: 16px; background: rgba(4, 12, 40, .55); color: #fff; transition: border-color .15s, box-shadow .15s; }
.form input:focus, .form select:focus, .form textarea:focus { outline: none; border-color: var(--sky); box-shadow: 0 0 0 3px rgba(111, 182, 240, .3); }
.form select option { background: var(--card-solid); }
input[type=checkbox] { accent-color: var(--sky); width: 18px; height: 18px; }
input[type=file] { color: var(--muted); }
.form .check { display: flex; gap: 8px; align-items: center; font-weight: 600; color: var(--ink); }
.form.inline { display: flex; gap: 8px; align-items: end; flex-wrap: wrap; } .form.inline label { flex: 1; margin: 0; min-width: 200px; }
.row2, .row3 { display: grid; gap: 10px; grid-template-columns: 1fr 1fr; } .row3 { grid-template-columns: 1fr 1fr 1fr; }
@media (max-width: 480px) { .row3 { grid-template-columns: 1fr 1fr; } .row3 > :first-child { grid-column: 1 / -1; } }
fieldset { border: 1px solid var(--line); border-radius: 12px; padding: 10px 12px; margin: 0 0 12px; } legend { font-weight: 800; padding: 0 4px; color: var(--sky); }
.mono { font-family: ui-monospace, Menlo, monospace; font-size: 12px !important; }
.err-text { color: var(--red); font-size: .85rem; }
.warn { background: rgba(255, 201, 77, .12); border: 1px solid rgba(255, 201, 77, .5); color: #ffe6a8; border-radius: 12px; padding: 10px 12px; margin-bottom: 12px; font-weight: 700; }
.warn .check { margin: 6px 0 0; }
.weight { display: flex !important; align-items: center; justify-content: space-between; gap: 10px; }
.weight input { width: 90px !important; display: inline-block !important; }
details summary { cursor: pointer; font-weight: 700; color: var(--sky-l); }

/* hero */
.hero { border-radius: 24px; padding: 22px; margin: 6px 0 16px; display: grid; gap: 18px; grid-template-columns: 1fr; box-shadow: 0 20px 50px rgba(0, 0, 0, .4), inset 0 0 0 1px rgba(255, 255, 255, .25); }
@media (min-width: 860px) { .hero { grid-template-columns: 1.3fr 1fr; align-items: end; padding: 28px; } }
.hero .eyebrow { color: var(--royal-dd); background: rgba(255, 255, 255, .85); display: inline-block; padding: 3px 10px; border-radius: 999px; letter-spacing: .18em; }
.hero-title { font-size: 3.2rem; margin: .5rem 0 .8rem; text-shadow: 0 3px 0 var(--royal-dd), 0 6px 22px rgba(10, 30, 110, .55); -webkit-text-stroke: 1px rgba(30, 63, 160, .5); }
@media (max-width: 600px) { .hero { padding: 18px; } .hero-title { font-size: 2.6rem; } }
.hero-rating { display: flex; gap: 18px; align-items: center; }
.hero-sub { color: #e7f2ff; margin: 6px 0 10px; font-size: .88rem; } .hero-sub a { color: #fff; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.rank { font-family: var(--font-n); font-size: 3rem; line-height: .9; letter-spacing: .02em; text-shadow: 0 3px 14px rgba(0, 0, 0, .3); }
.rank .of { font-family: Inter, sans-serif; font-size: .9rem; color: var(--sky-l); font-weight: 600; letter-spacing: 0; }
.hero-record { display: flex; gap: 10px; flex-wrap: wrap; }
.rec { background: rgba(7, 18, 55, .45); border: 1px solid rgba(255, 255, 255, .25); border-radius: 16px; padding: 10px 16px; min-width: 96px; backdrop-filter: blur(6px); }
.rec b { display: block; font-family: var(--font-n); font-size: 2.6rem; line-height: 1; font-weight: 400; } .rec span { font-size: .7rem; letter-spacing: .14em; text-transform: uppercase; color: var(--sky-l); font-weight: 700; }
.tier-chip { display: inline-flex; gap: 5px; align-items: center; font-size: .72rem; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; padding: 4px 10px; border-radius: 999px; background: rgba(255, 255, 255, .9); color: var(--royal-dd); margin-top: 6px; }
.tier-chip.tier-elite { background: linear-gradient(90deg, #fff3b0, var(--gold)); color: #4a3200; box-shadow: 0 0 18px rgba(255, 213, 74, .6); }
.tier-chip.tier-allstar { background: linear-gradient(90deg, #fff, var(--sky-l)); box-shadow: 0 0 16px rgba(191, 227, 250, .7); }

/* countdown */
.countdown { background: rgba(7, 18, 55, .62); border: 1px solid rgba(255, 255, 255, .28); border-radius: 20px; padding: 16px; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); box-shadow: 0 10px 30px rgba(0, 0, 0, .3); }
.cd-label { display: flex; align-items: center; gap: 8px; font-size: .72rem; font-weight: 900; letter-spacing: .2em; text-transform: uppercase; color: var(--sky); }
.live-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--sky); box-shadow: 0 0 0 0 rgba(111, 182, 240, .8); animation: pulse 1.6s infinite; }
@keyframes pulse { 70% { box-shadow: 0 0 0 10px rgba(111, 182, 240, 0); } 100% { box-shadow: 0 0 0 0 rgba(111, 182, 240, 0); } }
.cd-opp { font-family: var(--font-d); font-size: 1.9rem; text-transform: uppercase; line-height: 1.05; margin: 6px 0 2px; }
.cd-meta { color: var(--sky-l); font-size: .85rem; margin-bottom: 12px; }
.cd-boxes { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.cd-boxes div { background: linear-gradient(180deg, #fff, #dcefff); color: var(--royal-dd); border-radius: 12px; text-align: center; padding: 8px 2px 6px; box-shadow: inset 0 -3px 0 rgba(30, 63, 160, .25); }
.cd-boxes b { display: block; font-family: var(--font-n); font-size: 2.2rem; line-height: 1; font-weight: 400; font-variant-numeric: tabular-nums; }
.cd-boxes span { font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; font-weight: 800; color: var(--royal); }
.cd-boxes .gd { grid-column: 1 / -1; font-family: var(--font-d); font-size: 2rem; letter-spacing: .1em; animation: glow 1.4s ease-in-out infinite alternate; }
@keyframes glow { from { box-shadow: 0 0 6px rgba(111, 182, 240, .4); } to { box-shadow: 0 0 26px rgba(111, 182, 240, .9); } }

/* rating rings */
.ring { --size: 120px; position: relative; width: var(--size); height: var(--size); flex: none; display: grid; place-items: center; }
.ring svg { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); overflow: visible; }
.ring-bg { fill: rgba(7, 18, 55, .55); stroke: rgba(255, 255, 255, .16); stroke-width: 9; }
.ring-fg { fill: none; stroke: #fff; stroke-width: 9; stroke-linecap: round; filter: drop-shadow(0 0 6px rgba(191, 227, 250, .9)); }
.js .ring .ring-fg { stroke-dashoffset: var(--c); }
.js .ring.go .ring-fg { stroke-dashoffset: var(--off); transition: stroke-dashoffset 1.4s cubic-bezier(.2, .8, .2, 1) .15s; }
.ring.tier-elite .ring-fg { stroke: var(--gold); filter: drop-shadow(0 0 8px rgba(255, 213, 74, .9)); }
.ring.tier-allstar .ring-fg { stroke: #fff; }
.ring.tier-starter .ring-fg { stroke: var(--sky-l); }
.ring.tier-rotation .ring-fg, .ring.tier-rising .ring-fg { stroke: var(--sky); filter: drop-shadow(0 0 5px rgba(111, 182, 240, .8)); }
.ring-txt { position: relative; text-align: center; line-height: 1; }
.ring-txt b { display: block; font-family: var(--font-n); font-weight: 400; font-size: calc(var(--size) * .3); text-shadow: 0 0 14px rgba(191, 227, 250, .7); }
.ring-txt small { display: block; font-size: calc(var(--size) * .075); letter-spacing: .18em; font-weight: 800; color: var(--sky-l); margin-top: 2px; }
.ring.mini .ring-txt b { font-size: calc(var(--size) * .26); } .ring.mini .ring-txt small { letter-spacing: .06em; font-size: .6rem; }

/* stat cards */
.statcards { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin-bottom: 10px; }
@media (min-width: 760px) { .statcards { grid-template-columns: repeat(3, 1fr); } }
.stat { position: relative; overflow: hidden; background: var(--card); border: 1px solid var(--line); border-radius: 16px; padding: 14px; transition: transform .2s, box-shadow .2s, border-color .2s; }
.stat:hover { transform: translateY(-3px); border-color: rgba(191, 227, 250, .4); box-shadow: 0 14px 30px rgba(0, 0, 0, .35); }
.stat .ico { width: 26px; height: 26px; color: var(--sky); margin-bottom: 4px; display: block; }
.stat b { display: block; font-family: var(--font-n); font-weight: 400; font-size: 2.6rem; line-height: 1; letter-spacing: .01em; }
.stat b small { font-family: Inter, sans-serif; font-size: .85rem; color: var(--sky-l); font-weight: 700; }
.stat > span { color: var(--muted); font-size: .8rem; font-weight: 600; display: block; }
.stat em { display: block; font-style: normal; font-size: .74rem; color: var(--sky-l); margin-top: 4px; font-weight: 700; }
.stat.feature { background: var(--smoke); border-color: rgba(255, 255, 255, .5); box-shadow: 0 10px 28px rgba(36, 72, 184, .45); }
.stat.feature::after { content: "HUSTLE"; position: absolute; top: 10px; right: -26px; transform: rotate(35deg); background: #fff; color: var(--royal); font-size: .55rem; font-weight: 900; letter-spacing: .2em; padding: 2px 30px; }
.stat.feature .ico { color: #fff; } .stat.feature b { text-shadow: 0 2px 0 var(--royal-dd), 0 4px 16px rgba(10, 30, 110, .5); }
.stat.feature > span, .stat.feature em { color: #fff; position: relative; z-index: 1; } .stat.feature > span { text-shadow: 0 1px 3px rgba(10, 30, 110, .6); }
.statgrid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; text-align: center; }
@media (min-width: 700px) { .statgrid { grid-template-columns: repeat(6, 1fr); } }
.statgrid div { background: rgba(7, 18, 55, .5); border: 1px solid var(--line); border-radius: 12px; padding: 8px 4px; }
.statgrid b { display: block; font-family: var(--font-n); font-size: 1.7rem; font-weight: 400; line-height: 1.05; } .statgrid span { font-size: .68rem; color: var(--muted); font-weight: 800; letter-spacing: .1em; }

/* tables */
.table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 0 -4px; }
.tbl { border-collapse: collapse; width: 100%; font-size: .88rem; font-variant-numeric: tabular-nums; }
.tbl th, .tbl td { padding: 9px 7px; text-align: center; border-bottom: 1px solid var(--line); white-space: nowrap; }
.tbl th { font-size: .68rem; text-transform: uppercase; letter-spacing: .1em; color: var(--sky); font-weight: 800; }
.tbl .l { text-align: left; } .tbl td.opp { text-align: left; max-width: 140px; overflow: hidden; text-overflow: ellipsis; }
.tbl td.hl { background: rgba(111, 182, 240, .12); font-weight: 800; color: #fff; }
.tbl tr.total td { font-weight: 800; background: rgba(255, 255, 255, .06); }
.tbl tbody tr { transition: background .15s; } .tbl tbody tr:hover td { background: rgba(255, 255, 255, .05); }
.tbl tr.me td { background: rgba(111, 182, 240, .2); }
.tbl tr.inactive td { color: var(--muted); }
.lb td { padding: 7px; } .lb .rk { width: 54px; } .rk-n { font-family: var(--font-n); font-size: 1.5rem; display: block; line-height: 1; }
.lb tr.top1 .rk-n { color: var(--gold); text-shadow: 0 0 12px rgba(255, 213, 74, .6); } .lb tr.top2 .rk-n { color: var(--silver); } .lb tr.top3 .rk-n { color: var(--bronze); }
.who { display: flex; align-items: center; gap: 10px; } .who a, .who > div { font-weight: 800; color: #fff; } .who small { display: block; color: var(--muted); font-weight: 600; font-size: .74rem; }
.rating-chip { display: inline-block; min-width: 54px; font-family: var(--font-n); font-size: 1.3rem; line-height: 1; padding: 6px 10px 4px; border-radius: 10px; background: linear-gradient(180deg, #3d66dd, var(--royal)); color: #fff; box-shadow: 0 0 0 1px rgba(255, 255, 255, .25), 0 4px 14px rgba(36, 72, 184, .5); }
.rating-chip.tier-elite { background: linear-gradient(180deg, #fff1a6, var(--gold)); color: #3d2a00; box-shadow: 0 0 18px rgba(255, 213, 74, .55); }
.rating-chip.tier-allstar { background: linear-gradient(180deg, #fff, var(--sky-l)); color: var(--royal-dd); box-shadow: 0 0 16px rgba(191, 227, 250, .55); }
.mv { display: inline-flex; align-items: center; gap: 1px; font-size: .7rem; font-weight: 900; } .mv .ico { width: 14px; height: 14px; stroke-width: 3; }
.mv-up { color: var(--green); } .mv-down { color: var(--red); } .mv-same { color: var(--muted); } .mv-new { color: var(--royal-dd); background: var(--sky-l); padding: 1px 5px; border-radius: 5px; font-size: .58rem; letter-spacing: .08em; }
@media (max-width: 600px) { .hide-sm { display: none; } }
.bar { background: rgba(255, 255, 255, .12); border-radius: 6px; height: 8px; width: 80px; overflow: hidden; display: inline-block; vertical-align: middle; }
.bar span { display: block; height: 100%; background: linear-gradient(90deg, var(--sky), #fff); }
.tbl.entry input.num { width: 48px; padding: 6px; border: 1px solid rgba(191, 227, 250, .25); border-radius: 8px; text-align: center; font-size: 15px; background: rgba(4, 12, 40, .55); color: #fff; }
.formula .eq { background: rgba(4, 12, 40, .7); color: var(--sky-l); border: 1px solid var(--line); padding: 12px; border-radius: 12px; overflow-x: auto; font-size: .9rem; }

/* jersey avatars */
.jersey-av { flex: none; filter: drop-shadow(0 3px 6px rgba(0, 0, 0, .35)); }

/* podium */
.podium { display: grid; grid-template-columns: 1fr 1.15fr 1fr; align-items: end; gap: 10px; padding: 26px 14px 0; border-radius: 24px; margin-bottom: 16px; min-height: 330px; box-shadow: 0 20px 50px rgba(0, 0, 0, .4), inset 0 0 0 1px rgba(255, 255, 255, .25); }
.pod { text-align: center; display: flex; flex-direction: column; align-items: center; position: relative; animation: rise .8s cubic-bezier(.2, .9, .2, 1.1) both; }
.pod-2 { animation-delay: .15s; } .pod-3 { animation-delay: .3s; }
@keyframes rise { from { opacity: 0; transform: translateY(40px); } to { opacity: 1; transform: none; } }
.pod .jersey-av { transition: transform .25s; } .pod:hover .jersey-av { transform: translateY(-4px) rotate(-3deg); }
.pod-1 .jersey-av { animation: floaty 3.2s ease-in-out infinite; filter: drop-shadow(0 0 18px rgba(255, 213, 74, .55)) drop-shadow(0 6px 10px rgba(0, 0, 0, .35)); }
@keyframes floaty { 50% { transform: translateY(-6px); } }
.medal { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; font-family: var(--font-n); font-size: 1.3rem; color: #2a1d00; margin-bottom: -10px; z-index: 2; border: 2px solid #fff; box-shadow: 0 4px 12px rgba(0, 0, 0, .35); }
.medal.m1 { background: radial-gradient(circle at 35% 30%, #fff6c4, var(--gold) 55%, #b88a00); width: 42px; height: 42px; font-size: 1.6rem; box-shadow: 0 0 22px rgba(255, 213, 74, .8); }
.medal.m2 { background: radial-gradient(circle at 35% 30%, #fff, var(--silver) 55%, #8e9db3); }
.medal.m3 { background: radial-gradient(circle at 35% 30%, #ffe3c9, var(--bronze) 55%, #8a4f22); }
.pod-name { font-family: var(--font-d); font-size: 1.15rem; text-transform: uppercase; margin-top: 4px; line-height: 1.1; text-shadow: 0 2px 8px rgba(10, 30, 110, .7); }
.pod-name a { color: #fff; }
.pod-meta { font-size: .72rem; color: #fff; font-weight: 700; display: flex; gap: 6px; align-items: center; justify-content: center; text-shadow: 0 1px 4px rgba(10, 30, 110, .8); }
.pod-rating { margin: 6px 0 8px; line-height: 1; } .pod-rating b { font-family: var(--font-n); font-weight: 400; font-size: 2.2rem; display: block; text-shadow: 0 0 16px rgba(191, 227, 250, .9), 0 2px 0 var(--royal-dd); }
.pod-rating small { font-size: .58rem; letter-spacing: .2em; font-weight: 900; color: var(--sky-l); }
.pod-1 .pod-rating b { font-size: 2.8rem; color: #fff7d1; text-shadow: 0 0 22px rgba(255, 213, 74, .95), 0 2px 0 #8a6500; }
.pod-block { width: 100%; border-radius: 14px 14px 0 0; background: linear-gradient(180deg, rgba(255, 255, 255, .95), rgba(191, 227, 250, .85)); color: var(--royal-dd); font-family: var(--font-d); font-size: 1.4rem; display: grid; place-items: start center; padding-top: 8px; box-shadow: inset 0 2px 0 #fff, 0 -6px 20px rgba(10, 30, 110, .25); }
.pod-1 .pod-block { height: 92px; font-size: 1.8rem; } .pod-2 .pod-block { height: 64px; } .pod-3 .pod-block { height: 44px; }
.pod.me .pod-block { background: linear-gradient(180deg, #fff, var(--sky)); }
@media (max-width: 480px) { .podium { gap: 6px; padding: 20px 8px 0; min-height: 300px; } .pod-name { font-size: .95rem; } .pod-rating b { font-size: 1.8rem; } .pod-1 .pod-rating b { font-size: 2.3rem; } .pod-meta { font-size: .64rem; } }

/* category leaders */
.catgrid { display: grid; grid-template-columns: 1fr; gap: 0 12px; }
@media (min-width: 600px) { .catgrid { grid-template-columns: 1fr 1fr; } } @media (min-width: 950px) { .catgrid { grid-template-columns: repeat(3, 1fr); } }
.cat h3 { display: flex; gap: 8px; align-items: center; } .cat h3 .ico { color: var(--sky); }
.cat ol { list-style: none; padding: 0; margin: 0; }
.cat li { display: grid; grid-template-columns: 1fr 70px 44px; gap: 8px; align-items: center; padding: 6px 0; border-bottom: 1px dashed var(--line); }
.cat li .n { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .cat li .n i { font-style: normal; display: inline-block; width: 20px; color: var(--muted); font-weight: 800; }
.cat li b { text-align: right; font-family: var(--font-n); font-size: 1.2rem; font-weight: 400; }
.cat li:first-child b { color: var(--gold); } .cat li:first-child .n { font-weight: 800; }
.cbar { height: 6px; border-radius: 4px; background: rgba(255, 255, 255, .1); overflow: hidden; } .cbar span { display: block; height: 100%; background: linear-gradient(90deg, var(--royal), var(--sky), #fff); border-radius: 4px; }
.cat li.me { background: rgba(111, 182, 240, .18); border-radius: 8px; padding: 6px; }
.mini-lb { list-style: none; padding: 0; margin: 0 0 4px; }
.mini-lb li { display: flex; gap: 10px; align-items: center; padding: 7px 4px; border-bottom: 1px solid var(--line); border-radius: 10px; transition: background .15s; }
.mini-lb li:hover { background: rgba(255, 255, 255, .05); }
.mini-lb .r { width: 24px; font-family: var(--font-n); font-size: 1.4rem; color: var(--muted); text-align: center; }
.mini-lb .r1 .r { color: var(--gold); } .mini-lb .r2 .r { color: var(--silver); } .mini-lb .r3 .r { color: var(--bronze); }
.mini-lb .n { flex: 1; font-weight: 800; } .mini-lb .n small { display: block; color: var(--muted); font-weight: 600; font-size: .72rem; }
.mini-lb .s { font-family: var(--font-n); font-size: 1.5rem; } .mini-lb li.me { background: rgba(111, 182, 240, .18); }

/* trading card (player page) */
.tcard-wrap { display: grid; gap: 18px; grid-template-columns: 1fr; align-items: center; margin: 6px 0 10px; }
@media (min-width: 760px) { .tcard-wrap { grid-template-columns: 340px 1fr; } }
.tcard { position: relative; overflow: hidden; border-radius: 22px; padding: 14px; max-width: 360px; width: 100%; margin: 0 auto; aspect-ratio: 5 / 7; display: flex; flex-direction: column; isolation: isolate;
  background: var(--smoke); border: 3px solid #fff; box-shadow: 0 0 0 4px var(--royal), 0 0 0 5px rgba(255, 255, 255, .5), 0 26px 60px rgba(0, 0, 0, .55); transition: transform .4s; }
.tcard:hover { transform: perspective(900px) rotateY(-6deg) rotateX(3deg) translateY(-4px); }
.tcard.tier-elite { box-shadow: 0 0 0 4px var(--gold), 0 0 0 5px #fff, 0 0 40px rgba(255, 213, 74, .5), 0 26px 60px rgba(0, 0, 0, .55); }
.tc-shine { position: absolute; inset: 0; z-index: 3; pointer-events: none; background: linear-gradient(115deg, transparent 30%, rgba(255, 255, 255, .55) 45%, rgba(191, 227, 250, .2) 52%, transparent 62%); transform: translateX(-120%); animation: shine 4.5s ease-in-out 1s infinite; mix-blend-mode: overlay; }
@keyframes shine { 0%, 55% { transform: translateX(-120%); } 85%, 100% { transform: translateX(120%); } }
.tc-bgnum { position: absolute; right: -10px; bottom: 40px; font-family: var(--font-n); font-size: 15rem; line-height: .8; color: rgba(255, 255, 255, .14); z-index: -1; -webkit-text-stroke: 2px rgba(255, 255, 255, .25); }
.tc-top { display: flex; justify-content: space-between; align-items: center; } .tc-top .tier-chip { margin: 0; }
.tc-team { display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-d); letter-spacing: .12em; color: var(--royal-dd); background: rgba(255, 255, 255, .9); padding: 3px 10px 3px 4px; border-radius: 999px; font-size: .9rem; }
.tc-art { position: relative; flex: 1; display: grid; place-items: center; margin: 6px 0; border-radius: 14px; overflow: hidden; isolation: isolate; }
.tc-art .court-deco { opacity: .28; }
.tc-jersey { width: 66%; height: auto; filter: drop-shadow(0 12px 22px rgba(10, 30, 110, .55)); animation: floaty 4s ease-in-out infinite; }
.tc-name { font-family: var(--font-d); font-size: 2rem; text-transform: uppercase; text-align: center; line-height: 1; letter-spacing: .03em; text-shadow: 0 3px 0 var(--royal-dd), 0 6px 18px rgba(10, 30, 110, .6); }
.tc-meta { display: flex; justify-content: center; gap: 6px; margin: 6px 0 10px; } .tc-meta span { background: rgba(7, 18, 55, .55); border: 1px solid rgba(255, 255, 255, .3); border-radius: 999px; padding: 2px 10px; font-size: .74rem; font-weight: 800; letter-spacing: .06em; }
.tc-bottom { display: grid; grid-template-columns: repeat(4, 1fr); background: #fff; color: var(--royal-dd); border-radius: 12px; overflow: hidden; }
.tc-bottom div { text-align: center; padding: 6px 0 4px; border-left: 1px solid #d9e7fb; } .tc-bottom div:first-child { border-left: 0; }
.tc-bottom b { display: block; font-family: var(--font-n); font-size: 1.7rem; font-weight: 400; line-height: 1; } .tc-bottom small { font-size: .62rem; font-weight: 900; letter-spacing: .14em; color: var(--royal); }
.tc-side { display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; }
.tc-side .rank { display: flex; gap: 8px; align-items: baseline; }
.part-rings { display: grid; grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); gap: 12px; justify-items: center; margin: 4px 0 10px; }
.part { display: flex; flex-direction: column; align-items: center; gap: 4px; } .part > small { color: var(--sky-l); font-weight: 800; font-size: .74rem; }
details.more { margin-top: 6px; } details.more summary { padding: 6px 0; }

/* games */
.record-strip { display: flex; gap: 0; border-radius: 18px; margin-bottom: 12px; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .3); }
.record-strip div { text-shadow: 0 1px 6px rgba(10, 30, 110, .85); flex: 1; text-align: center; padding: 12px 6px; border-left: 1px solid rgba(255, 255, 255, .25); } .record-strip div:first-child { border-left: 0; }
.record-strip b { display: block; font-family: var(--font-n); font-size: 2.4rem; line-height: 1; font-weight: 400; text-shadow: 0 2px 0 var(--royal-dd); } .record-strip span { font-size: .68rem; letter-spacing: .18em; font-weight: 900; text-transform: uppercase; }
.gamelist { list-style: none; padding: 0; margin: 0 0 4px; } .gamelist li { display: flex; gap: 10px; align-items: center; padding: 9px 2px; border-bottom: 1px solid var(--line); }
.gamelist li > a:nth-child(2) { flex: 1; color: #fff; min-width: 0; } .gamelist li > a small { display: block; color: var(--muted); font-size: .75rem; }
.gamelist strong { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wl { display: inline-grid; place-items: center; min-width: 30px; height: 26px; padding: 0 7px; border-radius: 8px; font-weight: 900; font-size: .78rem; letter-spacing: .08em; background: rgba(255, 255, 255, .12); color: var(--muted); }
.wl-w { background: linear-gradient(180deg, #5ef0ae, #1fb874); color: #032a18; box-shadow: 0 0 14px rgba(61, 220, 151, .45); }
.wl-l { background: linear-gradient(180deg, #ff8a8a, #e04848); color: #3a0606; }
.wl-t { background: linear-gradient(180deg, #fff, var(--sky-l)); color: var(--royal-dd); }
.score { font-family: var(--font-n); font-size: 1.35rem; letter-spacing: .03em; } .score-w { color: var(--green); } .score-l { color: #ffb0b0; }
.vid { display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: #e33; color: #fff !important; box-shadow: 0 4px 12px rgba(227, 51, 51, .4); } .vid .ico { width: 15px; height: 15px; fill: #fff; }
.gamecards { list-style: none; padding: 0; margin: 0; display: grid; gap: 0 12px; grid-template-columns: 1fr; }
@media (min-width: 720px) { .gamecards { grid-template-columns: 1fr 1fr; } }
.gamecard { position: relative; overflow: hidden; transition: transform .2s, box-shadow .2s, border-color .2s; }
.gamecard:hover { transform: translateY(-3px); border-color: rgba(191, 227, 250, .45); box-shadow: 0 18px 40px rgba(0, 0, 0, .4); }
.gamecard::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 5px; background: var(--muted); }
.gc-w::before { background: var(--green); box-shadow: 0 0 16px var(--green); } .gc-l::before { background: var(--red); } .gc-t::before { background: var(--sky-l); }
.gc-main { display: block; color: #fff; } .gc-main:hover { color: #fff; }
.gc-top { display: flex; justify-content: space-between; align-items: center; gap: 8px; } .gc-date { font-size: .78rem; color: var(--muted); font-weight: 600; }
.gc-board { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 8px; margin: 12px 0 4px; }
.gc-board .team { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 8px; background: rgba(4, 12, 40, .45); border: 1px solid var(--line); border-radius: 12px; padding: 8px 10px; min-width: 0; }
.gc-board .team span { font-weight: 800; font-size: .82rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gc-board .team b { font-family: var(--font-n); font-size: 2rem; font-weight: 400; line-height: 1; }
.gc-board .them { grid-template-columns: auto 1fr auto; }
.gc-w .us b { color: var(--green); text-shadow: 0 0 12px rgba(61, 220, 151, .5); } .gc-l .them b { color: #fff; } .gc-l .us b { color: #ffb0b0; }
.gc-vs { font-family: var(--font-d); color: var(--muted); }
.opp-badge { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: linear-gradient(160deg, #3a4a7a, #1b2550); border: 1px solid rgba(255, 255, 255, .25); font-family: var(--font-d); font-size: .9rem; color: #dfe8ff; flex: none; }
.opp-badge.big { width: 56px; height: 56px; font-size: 1.4rem; border-radius: 16px; }
.gc-opp { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.gc-actions { display: flex; gap: 8px; align-items: center; margin-top: 12px; flex-wrap: wrap; }
.scoreboard { border-radius: 24px; padding: 18px; margin: 6px 0 14px; text-align: center; box-shadow: 0 20px 50px rgba(0, 0, 0, .4), inset 0 0 0 1px rgba(255, 255, 255, .25); }
.sb-meta { font-size: .82rem; font-weight: 700; color: var(--royal-dd); background: rgba(255, 255, 255, .85); display: inline-flex; gap: 8px; align-items: center; padding: 4px 12px; border-radius: 999px; }
.sb-row { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 10px; margin-top: 14px; }
.sb-team { display: flex; flex-direction: column; align-items: center; gap: 6px; font-family: var(--font-d); text-transform: uppercase; font-size: 1.05rem; text-shadow: 0 2px 8px rgba(10, 30, 110, .7); }
.sb-score { background: rgba(4, 12, 40, .75); border: 2px solid rgba(255, 255, 255, .35); border-radius: 18px; padding: 10px 16px 6px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; justify-content: center; box-shadow: 0 0 30px rgba(111, 182, 240, .35); }
.sb-score b { font-family: var(--font-n); font-size: 3.4rem; font-weight: 400; line-height: 1; color: #cfe0ff; } .sb-score b.win { color: #fff; text-shadow: 0 0 18px rgba(191, 227, 250, .9); } .sb-score i { color: var(--muted); font-style: normal; }
.sb-final { width: 100%; font-size: .62rem; letter-spacing: .3em; font-weight: 900; color: var(--sky); }
.notes { background: rgba(4, 12, 40, .5); border: 1px solid var(--line); padding: 10px 12px; border-radius: 12px; }

/* schedule */
.sched-legend { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; font-size: .74rem; font-weight: 800; }
.lg { display: inline-flex; align-items: center; gap: 5px; padding: 4px 10px; border-radius: 999px; background: rgba(255, 255, 255, .07); border: 1px solid var(--line); }
.lg::before { content: ""; width: 9px; height: 9px; border-radius: 50%; } .lg-game::before { background: #fff; box-shadow: 0 0 8px #fff; } .lg-practice::before { background: var(--sky); box-shadow: 0 0 8px var(--sky); } .lg-tournament::before { background: var(--gold); box-shadow: 0 0 8px var(--gold); }
.lg-shab { color: var(--sky-l); } .lg-shab::before { display: none; }
.seg-row { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-bottom: 12px; }
.seg { display: inline-flex; background: rgba(4, 12, 40, .55); border: 1px solid var(--line); border-radius: 12px; padding: 3px; }
.seg a { display: inline-flex; gap: 6px; align-items: center; padding: 7px 13px; border-radius: 9px; color: var(--muted); font-weight: 700; font-size: .88rem; transition: all .15s; }
.seg a:hover { color: #fff; } .seg a.on { background: #fff; color: var(--royal-dd); box-shadow: 0 2px 12px rgba(111, 182, 240, .45); }
.seg.big { margin-bottom: 14px; } .seg.big a { padding: 10px 20px; font-size: 1rem; }
.evlist { list-style: none; padding: 0; margin: 0 0 12px; }
.ev { position: relative; display: flex; gap: 12px; background: var(--card); border: 1px solid var(--line); border-radius: 16px; padding: 12px; margin-bottom: 9px; overflow: hidden; transition: transform .18s, border-color .18s; }
.ev:hover { transform: translateX(3px); border-color: rgba(191, 227, 250, .35); }
.ev::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 5px; background: var(--muted); }
.ev-game::before { background: #fff; box-shadow: 0 0 14px rgba(255, 255, 255, .8); } .ev-practice::before { background: var(--sky); box-shadow: 0 0 12px var(--sky); } .ev-tournament::before { background: var(--gold); box-shadow: 0 0 12px var(--gold); }
.ev-game { background: linear-gradient(100deg, rgba(36, 72, 184, .55), rgba(14, 30, 92, .5)); }
.ev.is-canceled { opacity: .6; } .ev.is-canceled .ev-title strong, .ev.is-canceled .ev-meta { text-decoration: line-through; }
.compact .ev { padding: 10px; }
.ev-date { width: 52px; flex: none; text-align: center; line-height: 1.05; background: rgba(4, 12, 40, .5); border-radius: 12px; padding: 6px 2px; border: 1px solid var(--line); align-self: flex-start; }
.ev-game .ev-date { background: #fff; color: var(--royal-dd); border-color: #fff; } .ev-game .ev-date .dow, .ev-game .ev-date .mon { color: var(--royal); }
.ev-date .dow, .ev-date .mon { display: block; font-size: .64rem; text-transform: uppercase; color: var(--sky); font-weight: 900; letter-spacing: .08em; }
.ev-date .dnum { display: block; font-family: var(--font-n); font-size: 1.9rem; line-height: 1; }
.ev-body { flex: 1; min-width: 0; } .ev-title { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; } .ev-title strong { font-size: 1rem; }
.ev-meta { color: var(--muted); font-size: .86rem; margin-top: 2px; }
.ev-change { font-size: .84rem; color: #ffe6a8; background: rgba(255, 201, 77, .12); border-radius: 8px; padding: 4px 8px; margin-top: 6px; } .is-canceled .ev-change { color: #ffd0d0; background: rgba(255, 107, 107, .14); }
.ev-change .was { text-decoration: line-through; opacity: .8; margin-left: 4px; }
.ev-notes { font-size: .84rem; margin-top: 4px; color: var(--sky-l); } .ev-links { font-size: .84rem; margin-top: 6px; display: flex; gap: 12px; flex-wrap: wrap; } .ev-links .muted { color: var(--muted); }
.ev-links .vid-link { color: #ff8a8a; font-weight: 800; }
.shab { display: inline-flex; gap: 5px; align-items: center; margin-top: 6px; font-size: .74rem; font-weight: 800; padding: 3px 9px; border-radius: 999px; }
.shab .ico { width: 14px; height: 14px; }
.shab-motzei { background: rgba(191, 227, 250, .16); color: var(--sky-l); border: 1px solid rgba(191, 227, 250, .35); }
.shab-erev { background: rgba(255, 201, 77, .12); color: #ffe6a8; border: 1px solid rgba(255, 201, 77, .35); }
.ev-warn { font-size: .84rem; color: #ffe6a8; background: rgba(255, 201, 77, .14); border: 1px solid rgba(255, 201, 77, .5); border-radius: 8px; padding: 4px 8px; margin-top: 6px; }
.pill { display: inline-block; font-size: .64rem; font-weight: 900; text-transform: uppercase; letter-spacing: .1em; padding: 3px 9px; border-radius: 999px; background: rgba(255, 255, 255, .12); color: var(--sky-l); }
.pill-game { background: #fff; color: var(--royal-dd); } .pill-practice { background: rgba(111, 182, 240, .25); color: #d6ecff; } .pill-tournament { background: rgba(255, 213, 74, .2); color: #ffe9a3; }
.pill-lvl-school { background: rgba(36, 72, 184, .6); color: #fff; border: 1px solid rgba(255, 255, 255, .25); } .pill-lvl-club { background: rgba(255, 255, 255, .08); color: var(--sky-l); border: 1px solid var(--line); }
.pill-offense { background: #fff; color: var(--royal-dd); } .pill-defense { background: var(--royal); color: #fff; }
.badge { display: inline-block; font-size: .64rem; font-weight: 900; text-transform: uppercase; padding: 3px 8px; border-radius: 6px; letter-spacing: .08em; }
.b-cancel { background: var(--red); color: #fff; } .b-upd { background: var(--amber); color: #3a2500; } .b-example { background: rgba(191, 227, 250, .18); color: var(--sky-l); } .b-past { background: rgba(255, 255, 255, .1); color: var(--muted); }
details.past summary { padding: 8px 0; }
.cal-head { display: flex; align-items: center; justify-content: center; gap: 20px; margin-bottom: 10px; font-family: var(--font-d); font-size: 1.5rem; text-transform: uppercase; }
.cal-head strong { font-weight: 400; } .cal-head a { font-size: 1.8rem; padding: 0 12px; border-radius: 10px; background: rgba(255, 255, 255, .07); }
.cal { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.cal-dow { text-align: center; font-size: .66rem; font-weight: 900; color: var(--sky); text-transform: uppercase; letter-spacing: .1em; padding-bottom: 2px; }
.cal-cell { background: rgba(15, 34, 100, .55); border: 1px solid var(--line); min-height: 78px; border-radius: 10px; padding: 3px; font-size: .7rem; overflow: hidden; position: relative; }
.cal-cell.empty { background: transparent; border: 0; } .cal-cell.today { outline: 2px solid #fff; box-shadow: 0 0 16px rgba(191, 227, 250, .7); }
.cal-cell.restricted { background: linear-gradient(180deg, rgba(15, 34, 100, .55) var(--sf), rgba(191, 227, 250, .2) var(--sf), rgba(191, 227, 250, .2) var(--st), rgba(15, 34, 100, .55) var(--st)); }
.cal-cell.past { opacity: .5; }
.shab-label { position: absolute; bottom: 3px; right: 4px; font-size: .6rem; color: var(--sky-l); white-space: nowrap; font-weight: 700; }
.cal-d { font-weight: 800; display: block; margin-bottom: 2px; }
.chip { display: block; border-radius: 6px; padding: 1px 5px; margin-bottom: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: 800; color: var(--royal-dd); }
.chip-game { background: #fff; box-shadow: 0 0 10px rgba(255, 255, 255, .45); } .chip-practice { background: var(--sky); color: #06204d; } .chip-other { background: rgba(255, 255, 255, .2); color: #fff; } .chip-tournament { background: var(--gold); color: #3a2a00; }
.chip-upd { box-shadow: inset 3px 0 0 var(--amber); } .chip-cancel { background: rgba(255, 107, 107, .25); text-decoration: line-through; color: #ffd0d0; }
.cal-legend .chip { display: inline-block; }
@media (min-width: 700px) { .cal-cell { min-height: 100px; font-size: .78rem; padding: 5px; } }
@media (max-width: 600px) { .cal-cell .chip .clbl { display: none; } }
.sl-short { display: none; }
@media (max-width: 600px) { .sl-full { display: none; } .sl-short { display: inline; } .shab-label { right: 2px; font-size: .6rem; } }

/* playbook */
.playcards { list-style: none; padding: 0; margin: 0; display: grid; gap: 0 14px; grid-template-columns: 1fr; }
@media (min-width: 720px) { .playcards { grid-template-columns: 1fr 1fr; } }
.playcard { display: block; color: #fff; transition: transform .2s, box-shadow .2s, border-color .2s; }
.playcard:hover { color: #fff; transform: translateY(-4px); border-color: rgba(191, 227, 250, .45); box-shadow: 0 18px 40px rgba(0, 0, 0, .45); }
.pc-court { width: 100%; height: auto; display: block; border-radius: 12px; margin-bottom: 10px; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .2); }
.pc-court .pcf { fill: #c98f55; } .pc-court .pcl { stroke: #fff; stroke-width: 3; opacity: .85; }
.pc-court .pco circle { fill: var(--royal); stroke: #fff; stroke-width: 3; } .pc-court .pcx circle { fill: #fff; stroke: #d63a3a; stroke-width: 3; }
.pc-court text { font: 800 15px Inter, sans-serif; fill: #fff; } .pc-court .pcx text { fill: #d63a3a; }
.pc-top { display: flex; gap: 6px; margin-bottom: 6px; } .pc-cta { color: var(--sky); font-weight: 800; font-size: .85rem; display: inline-flex; gap: 6px; align-items: center; } .pc-cta .ico { fill: currentColor; }
.playcard h3 { font-size: 1.3rem; }
.play-layout { display: grid; gap: 0 14px; grid-template-columns: 1fr; }
@media (min-width: 900px) { .play-layout { grid-template-columns: 1.2fr 1fr; } }
.steps { padding-left: 0; list-style: none; counter-reset: st; }
.steps li { counter-increment: st; position: relative; margin-bottom: 6px; padding: 8px 10px 8px 44px; border-radius: 12px; border: 1px solid transparent; transition: all .2s; }
.steps li::before { content: counter(st); position: absolute; left: 10px; top: 8px; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; background: rgba(255, 255, 255, .1); font-weight: 900; font-size: .8rem; }
.steps li.on { background: rgba(111, 182, 240, .16); border-color: rgba(191, 227, 250, .4); } .steps li.on::before { background: #fff; color: var(--royal-dd); box-shadow: 0 0 12px rgba(191, 227, 250, .8); }
.steps a { color: #fff; font-weight: 800; }
.pre { white-space: pre-wrap; }
.checks label { display: inline-flex !important; gap: 4px; margin-right: 8px; font-weight: 600; }

/* play viewer */
.court-card { padding: 12px; }
.pv-stage { border-radius: 14px; overflow: hidden; box-shadow: 0 14px 34px rgba(0, 0, 0, .45), 0 0 0 2px rgba(255, 255, 255, .3); }
.pv-svg { width: 100%; height: auto; display: block; touch-action: none; user-select: none; background: #6b3f1d; }
.pv .cl { stroke: #fff; stroke-width: 3; stroke-opacity: .92; } .pv .board { stroke-width: 5; } .pv .rim { fill: none; stroke: var(--ball); stroke-width: 3.5; }
.pv .paint { fill: url(#pv-paint); }
.pv .tok-o circle { fill: url(#pv-tok-o); stroke: #fff; stroke-width: 2.5; } .pv .tok-o text { fill: #fff; font: 800 16px Inter, sans-serif; }
.pv .tok-x circle { fill: #fff; stroke: #e03131; stroke-width: 3; } .pv .tok-x text { fill: #e03131; font: 900 13px Inter, sans-serif; }
.pv .tok-o { filter: url(#pv-glow-o); } .pv .tok-x { filter: url(#pv-glow-x); }
.pv .tok { cursor: default; } #editor-viewer .tok { cursor: grab; }
.pv .tok.has-ball circle { stroke: #ffd29b; stroke-width: 3.5; }
.pv .ball { fill: url(#pv-ball); stroke: #3b1505; stroke-width: 1.2; filter: url(#pv-glow-b); }
.pv .balltrail circle { fill: #ff9a4a; }
.pv .trail { stroke-width: 3.5; fill: none; opacity: .95; stroke-linecap: round; } .pv .tr-o { stroke: #fff; filter: url(#pv-glow-o); } .pv .tr-x { stroke: #ff6b6b; stroke-dasharray: 3 6; opacity: .7; }
.pv .tr-dribble { stroke: #fff; stroke-dasharray: 2 5; } .pv .tr-pass { stroke: #ffb066; stroke-dasharray: 10 7; filter: url(#pv-glow-b); }
.pv .trail.flow { animation: flow 0.9s linear infinite; } @keyframes flow { to { stroke-dashoffset: -34; } }
.pv .screen-bar { stroke: #fff; stroke-width: 7; stroke-linecap: round; filter: url(#pv-glow-o); }
.pv .pv-logo { font: 400 46px Anton, Impact, sans-serif; fill: rgba(255, 255, 255, .13); letter-spacing: 6px; }
.pv-caption { margin: 12px 2px 8px; min-height: 3.6em; } .pv-label { font-family: var(--font-d); font-weight: 400; font-size: 1.25rem; text-transform: uppercase; letter-spacing: .03em; }
.pv-caption p { margin: 4px 0 0; font-size: .9rem; color: var(--sky-l); } .pv-count { color: var(--muted); font-size: .85rem; }
.pv-controls { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.pv-controls button, .pv-controls select { border: 1px solid rgba(191, 227, 250, .3); background: rgba(255, 255, 255, .07); color: #fff; border-radius: 11px; padding: 9px 12px; font: inherit; font-weight: 800; cursor: pointer; transition: all .15s; }
.pv-controls button:hover { background: rgba(255, 255, 255, .15); } .pv-controls select option { background: var(--card-solid); }
.pv-controls .pv-play { background: linear-gradient(180deg, #fff, var(--sky-l)); color: var(--royal-dd); border-color: #fff; min-width: 104px; box-shadow: 0 4px 18px rgba(111, 182, 240, .5); }
.pv-trails { font-size: .85rem; display: inline-flex; gap: 6px; align-items: center; margin-left: auto; font-weight: 700; }
.pv-scrub { width: 100%; margin: 12px 0 6px; accent-color: var(--sky); }
.pv-legend { display: flex; gap: 10px; flex-wrap: wrap; font-size: .74rem; color: var(--muted); font-weight: 600; }
.lg-o { color: #9cc2ff; } .lg-x { color: #ff8a8a; } .lg-b { color: var(--ball); }
.errs { color: #ffd0d0; font-size: .85rem; }

/* login */
body.guest .wrap { position: relative; z-index: 1; }
.login-bg { position: fixed; inset: 0; z-index: 0; background: linear-gradient(205deg, #ffffff 0%, #e8f5fe 10%, #bfe3fa 24%, #6fb6f0 42%, #2f5fd0 62%, #1e3fa0 80%, #0f2470 100%); }
.login-bg .court-deco { opacity: .2; }
.login { max-width: 400px; margin: 4vh auto 0; text-align: center; position: relative; }
.login-crest { display: inline-block; animation: rise .7s cubic-bezier(.2, .9, .2, 1.1) both; } .login-crest .crest { filter: drop-shadow(0 10px 24px rgba(10, 30, 110, .6)); }
.wordmark { font-family: var(--font-d); font-size: 3.3rem; letter-spacing: .08em; line-height: 1; color: #fff; -webkit-text-stroke: 1.5px var(--royal); paint-order: stroke fill; text-shadow: 0 4px 0 var(--royal-dd), 0 10px 30px rgba(10, 30, 110, .5); margin-top: 6px; animation: rise .7s .1s cubic-bezier(.2, .9, .2, 1.1) both; }
.login h1 { margin: .3rem 0 0; font-size: 1.3rem; letter-spacing: .14em; color: #fff; text-shadow: 0 2px 8px rgba(10, 30, 110, .7); }
.login-sub { color: #fff; font-weight: 600; margin: 2px 0 0; font-size: .85rem; text-shadow: 0 1px 6px rgba(10, 30, 110, .8); }
.login-card { text-align: left; margin-top: 18px; background: rgba(7, 18, 55, .78); border-color: rgba(255, 255, 255, .3); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); animation: rise .7s .2s cubic-bezier(.2, .9, .2, 1.1) both; }
.login .muted { color: #fff; text-shadow: 0 1px 6px rgba(10, 30, 110, .8); }
.login-ball { position: absolute; right: -6px; top: -4px; width: 58px; height: 120px; pointer-events: none; }
.login-ball svg { width: 54px; height: 54px; animation: bounce 1.15s cubic-bezier(.5, 0, .5, 1) infinite alternate; filter: drop-shadow(0 6px 10px rgba(0, 0, 0, .35)); }
.ball-shadow { position: absolute; left: 10px; bottom: 0; width: 36px; height: 8px; border-radius: 50%; background: rgba(10, 30, 110, .45); animation: shadow 1.15s cubic-bezier(.5, 0, .5, 1) infinite alternate; }
@keyframes bounce { from { transform: translateY(0) rotate(0); } to { transform: translateY(58px) rotate(160deg); } }
@keyframes shadow { from { transform: scale(.55); opacity: .4; } to { transform: scale(1); opacity: .9; } }
@media (max-width: 480px) { .login-ball { right: 4px; } .wordmark { font-size: 2.8rem; } }
body.guest .foot { position: relative; z-index: 1; color: #fff; }

/* misc */
.yt-card { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; } .yt-card h2 { margin: 0; } .yt-card p { margin: 2px 0 0; }
.foot { text-align: center; color: var(--muted); font-size: .78rem; padding: 24px; display: flex; justify-content: center; align-items: center; gap: 8px; letter-spacing: .04em; }

/* school calendar / blackout + no-game nights */
.lg-school { color: #c9d3e6; } .lg-school::before { background: #8a94a8; border-radius: 3px; }
.lg-nogame { color: #c9d3e6; } .lg-nogame::before { border-radius: 3px; background: repeating-linear-gradient(135deg, rgba(201, 211, 230, .55) 0 2px, transparent 2px 5px); }
.rule-banner { display: flex; gap: 8px; align-items: center; background: linear-gradient(90deg, #fff, var(--sky-l)); color: var(--royal-dd); border-radius: 12px; padding: 8px 12px; margin-bottom: 12px; font-size: .88rem; box-shadow: 0 4px 16px rgba(111, 182, 240, .35); }
.rule-banner .ico { width: 18px; height: 18px; color: var(--royal); flex: none; }
.ev-school::before { background: #8a94a8; box-shadow: none; }
.ev.ev-school { background: rgba(120, 130, 150, .12); border-style: dashed; } .ev-school .ev-title strong { color: #d4dbe8; font-weight: 700; }
.ev-school .ev-date { background: rgba(120, 130, 150, .18); } .ev-school .ev-date .dow, .ev-school .ev-date .mon { color: #b6bfcf; }
.pill-school { background: rgba(160, 170, 190, .22); color: #d4dbe8; }
div.ev-schoolnote { font-size: .82rem; color: #d4dbe8; background: rgba(140, 150, 170, .16); border: 1px dashed rgba(180, 190, 210, .45); border-radius: 8px; padding: 3px 8px; margin-top: 6px; }
.chip-school { background: rgba(150, 160, 180, .35); color: #eef1f7; font-weight: 700; }
.cal-cell.schoolday { border-color: rgba(180, 190, 210, .45); }
.cal-cell.nogame-thu, .cal-cell.nogame-fri { background-image: repeating-linear-gradient(135deg, rgba(201, 211, 230, .13) 0 4px, transparent 4px 10px); }
.cal-cell.restricted.nogame-thu, .cal-cell.restricted.nogame-fri { background-image: repeating-linear-gradient(135deg, rgba(201, 211, 230, .13) 0 4px, transparent 4px 10px), linear-gradient(180deg, rgba(15, 34, 100, .55) var(--sf), rgba(191, 227, 250, .2) var(--sf), rgba(191, 227, 250, .2) var(--st), rgba(15, 34, 100, .55) var(--st)); }
.ng-label { display: block; font-size: .58rem; font-weight: 800; color: #c9d3e6; text-transform: uppercase; letter-spacing: .06em; margin-bottom: 2px; }
.nogame-swatch { display: inline-block; width: 14px; height: 10px; vertical-align: middle; border-radius: 3px; border: 1px solid var(--line); background: repeating-linear-gradient(135deg, rgba(201, 211, 230, .5) 0 2px, transparent 2px 5px); }
@media (max-width: 600px) { .ng-label { font-size: .5rem; letter-spacing: 0; } }