*{box-sizing:border-box;margin:0;padding:0}
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@400;500;600;700&family=Inter:wght@400;500;600;700;800;900&display=swap');
:root{
  --crimson:#981E32;--crimson-dk:#6B1524;--gold:#FFD100;
  --gray:#5E6A71;--bg:#0a0a0a;--white:#161616;--card-bg:#161616;--text:#e8e8e8;
  --duel-bg:#0c0c0c;--duel-border:#1e1e1e;--duel-bar-bg:#1a1a1a;--duel-label:#3a3a3a;--duel-dim:#2a2a2a;--duel-rule:#1a1a1a;
  --muted:#888;--border:#2a2a2a;
  --green:#27ae60;--amber:#f39c12;--red:#e74c3c;--blue:#2461A7;--purple:#8e44ad;
}
body{font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;background:var(--bg);color:var(--text)}
h1,h2,h3,.brand-title,.card-title,.stat-tile .val,.seg-title,
.card-hdr .card-title,[class*="section-title"]{font-family:'Oswald','Impact','Arial Narrow',Arial,sans-serif;letter-spacing:.04em}
.topnav{background:var(--crimson);box-shadow:0 2px 10px rgba(0,0,0,.2);position:sticky;top:0;z-index:300}
.topnav-inner{max-width:1600px;margin:0 auto;padding:0 20px;display:flex;align-items:center;gap:16px;height:60px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:#fff}
.brand-text{display:flex;flex-direction:column}
.brand-title{font-size:14px;font-weight:800;color:#fff}
.brand-sub{font-size:10px;color:rgba(255,255,255,.7)}
.brand-wsu-logo{height:46px;width:auto;object-fit:contain;filter:brightness(0) invert(1);opacity:.92}
.brand-ee-logo{height:36px;width:auto;object-fit:contain;opacity:.88;margin-left:6px}
.brand-ee-svg{height:36px;width:auto;margin-left:6px}
.nav-links{display:flex;gap:2px;margin-left:auto;align-items:center}
.nav-link{padding:7px 13px;border-radius:7px;font-size:12px;font-weight:600;color:rgba(255,255,255,.85);text-decoration:none;transition:background .12s}
.nav-link:hover,.nav-link.active{background:rgba(255,255,255,.15);color:#fff}
.flash-wrap{max-width:1600px;margin:10px auto;padding:0 20px}
.flash{padding:10px 16px;border-radius:8px;font-size:13px;font-weight:600;margin-bottom:6px}
.flash-success{background:#0d2e1a;color:#4ade80;border:1px solid #1a4a2a}
.flash-error{background:#2e0d0d;color:#f87171;border:1px solid #4a1a1a}
.main{max-width:1600px;margin:0 auto;padding:20px 20px 50px}
/* Cards */
.card{background:var(--card-bg);border-radius:12px;box-shadow:0 2px 12px rgba(0,0,0,.07);overflow:hidden;margin-bottom:16px}
.card-hdr{padding:12px 18px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:10px}
.card-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.card-title{font-size:13.5px;font-weight:700}
.card-meta{font-size:11px;color:var(--muted);margin-left:auto}
.card-body{padding:16px}
/* Admin */
.admin-layout{display:grid;grid-template-columns:210px 1fr;gap:18px;align-items:start}
.admin-sidebar{background:#0f0f0f;border:1px solid var(--border);border-radius:12px;padding:12px 0;position:sticky;top:78px}
.sidebar-label{font-size:9.5px;font-weight:800;text-transform:uppercase;letter-spacing:1px;color:rgba(255,255,255,.5);padding:4px 16px 8px}
.sidebar-link{display:block;padding:9px 16px;font-size:12.5px;font-weight:600;color:rgba(255,255,255,.8);text-decoration:none;transition:background .12s}
.sidebar-link:hover,.sidebar-link.active{background:rgba(255,255,255,.1);color:#fff}
.admin-body{min-width:0}
.admin-body h1{font-size:20px;font-weight:800;margin-bottom:16px}
.admin-body h2{font-size:15px;font-weight:700;margin-bottom:10px}
/* Stat tiles */
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin-bottom:20px}
.stat-tile{background:#1a1a1a;border-radius:10px;padding:14px 16px;box-shadow:0 1px 8px rgba(0,0,0,.06);border-left:4px solid var(--crimson)}
.stat-tile .val{font-size:26px;font-weight:800;color:var(--crimson)}
.stat-tile .lbl{font-size:10px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin-top:2px}
/* Tables */
.tbl{width:100%;border-collapse:collapse;font-size:12.5px}
.tbl th{padding:8px 10px;background:#111;font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);text-align:left;white-space:nowrap;border-bottom:2px solid var(--border)}
.tbl td{padding:8px 10px;border-bottom:1px solid var(--border)}
.tbl tr:hover td{background:#1e1e1e}
/* Badges */
.pc-chip{display:inline-block;border-radius:4px;padding:1px 6px;font-size:9px;font-weight:800;color:#fff}
.badge{display:inline-block;padding:2px 8px;border-radius:8px;font-size:10.5px;font-weight:700}
.badge-ok{background:#0d2e1a;color:#4ade80}.badge-warn{background:#2e1e0d;color:#fbbf24}
.badge-risk{background:#2e0d0d;color:#f87171}.badge-lo{background:#0d1a2e;color:#60a5fa}
.badge-na{background:#222;color:#777}.badge-above{background:#d5f5e3;color:#1a6b3c}
.badge-below{background:#fdebd0;color:#784212}.badge-flag{background:#fde8e8;color:#922b21}
/* Forms */
.form-group{margin-bottom:14px}
.form-label{display:block;font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:5px}
.form-input{width:100%;padding:8px 11px;border:1.5px solid var(--border);border-radius:7px;font-size:13px;background:#1a1a1a;color:var(--text);outline:none;transition:border-color .12s}
.form-input:focus{border-color:var(--crimson);background:#222}
.form-input.sm{padding:5px 8px;font-size:11.5px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.form-row-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}
/* Buttons */
.btn{display:inline-flex;align-items:center;gap:6px;padding:8px 18px;border-radius:8px;font-size:12.5px;font-weight:700;cursor:pointer;border:none;text-decoration:none;transition:opacity .12s}
.btn:hover{opacity:.85}
.btn-crimson{background:var(--crimson);color:#fff}
.btn-blue{background:var(--blue);color:#fff}
.btn-gray{background:#e8e8ee;color:#111}
.btn-red{background:var(--red);color:#fff}
.btn-green{background:var(--green);color:#fff}
.btn-sm{padding:5px 12px;font-size:11px}
.btn-icon{padding:5px 8px;font-size:14px}
/* Roster cards */
.roster-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px}
.rcard{background:#1a1a1a;border-radius:14px;box-shadow:0 2px 12px rgba(0,0,0,.08);overflow:hidden;transition:transform .15s,box-shadow .15s}
.rcard:hover{transform:translateY(-3px);box-shadow:0 6px 24px rgba(0,0,0,.13)}
.rcard-photo{width:100%;height:180px;object-fit:cover;object-position:50% 15%;background:#f0f0f5;display:block}
.rcard-avatar{width:100%;height:180px;display:flex;align-items:center;justify-content:center;font-size:54px;font-weight:900;color:rgba(255,255,255,.9)}
.rcard-body{padding:11px 13px}
.rcard-name{font-size:13px;font-weight:800}
.rcard-pos{font-size:10px;font-weight:700;margin-top:2px}
.rcard-badges{display:flex;flex-direction:column;gap:3px;margin-top:8px}
.rcard-badge{display:flex;align-items:center;justify-content:space-between;font-size:10px}
.rcard-badge .lbl{color:var(--muted);font-weight:600}
.risk-bar{width:100%;height:4px;background:#2a2a2a;border-radius:2px;margin-top:8px;overflow:hidden}
.risk-fill{height:100%;border-radius:2px;transition:width .3s}
/* Headshots admin grid */
.hs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}
.hs-card{background:#1a1a1a;border-radius:10px;overflow:hidden;box-shadow:0 1px 8px rgba(0,0,0,.07);text-align:center}
.hs-img{width:100%;height:140px;object-fit:cover;object-position:50% 15%}
.hs-av{width:100%;height:140px;display:flex;align-items:center;justify-content:center;font-size:40px;font-weight:900;color:rgba(255,255,255,.9)}
.hs-body{padding:8px}
.hs-name{font-size:11px;font-weight:700}
.hs-upload{font-size:10px;color:var(--crimson);cursor:pointer;margin-top:4px;display:block}
/* Ctrl bar */
.ctrl-bar{background:transparent;border-radius:0;padding:0 20px;margin-bottom:0;display:flex;flex-wrap:wrap;align-items:center;gap:0;box-shadow:none}
#player-ctrl-bar{position:sticky;top:60px;z-index:200;background:var(--bg);padding-top:10px;padding-bottom:10px;}
.ctrl-lbl{font-size:10px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.7px;white-space:nowrap}
.seg{display:flex}
/* Generic seg-buttons (toggles inside cards) */
.seg-btn{padding:5px 12px;border:1.5px solid var(--border);background:#1a1a1a;color:#aaa;font-size:11px;font-weight:600;cursor:pointer;white-space:nowrap;transition:background .12s,color .12s}
.seg-btn:first-child{border-radius:7px 0 0 7px}
.seg-btn:last-child{border-radius:0 7px 7px 0}
.seg-btn:not(:first-child){margin-left:-1px}
.seg-btn:hover{background:#2a2a2a;color:#fff;z-index:1;position:relative}
.seg-btn.active{background:var(--crimson);border-color:var(--crimson);color:#fff;z-index:2;position:relative}
/* Main nav tab bar — underline style */
.tab-bar-wrap{background:rgba(8,8,8,.97);border-bottom:1px solid rgba(255,255,255,.07);position:sticky;top:60px;z-index:100;margin:0 -20px 14px;box-shadow:0 2px 12px rgba(0,0,0,.4)}
#main-nav{gap:0;overflow-x:auto;scrollbar-width:none;padding:0 20px}
#main-nav::-webkit-scrollbar{display:none}
#main-nav .seg-btn{background:transparent;border:none;border-bottom:3px solid transparent;border-radius:0;padding:11px 15px 10px;color:rgba(255,255,255,.45);font-size:11.5px;font-weight:600;letter-spacing:.02em;white-space:nowrap;margin:0;transition:color .15s,border-color .15s,background .15s}
#main-nav .seg-btn:first-child{border-radius:0}
#main-nav .seg-btn:last-child{border-radius:0}
#main-nav .seg-btn:not(:first-child){margin-left:0}
#main-nav .seg-btn:hover{color:rgba(255,255,255,.85);background:rgba(255,255,255,.04);border-bottom-color:rgba(152,30,50,.5)}
#main-nav .seg-btn.active{color:#fff;background:rgba(152,30,50,.12);border-bottom-color:var(--crimson)}
select.ctl{padding:5px 9px;border:1.5px solid var(--border);border-radius:7px;font-size:11.5px;font-weight:600;background:#1a1a1a;color:var(--text);cursor:pointer;outline:none}
.chart-wrap{position:relative;padding:12px 14px 8px}
.h260{height:260px}.h300{height:300px}.h340{height:340px}.h380{height:380px}.h420{height:420px}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.three-col{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px}
@media(max-width:900px){.two-col,.three-col{grid-template-columns:1fr}.admin-layout{grid-template-columns:1fr}}
.legend-row{display:flex;flex-wrap:wrap;gap:8px;padding:7px 14px 10px}
.ldot{width:9px;height:9px;border-radius:50%;flex-shrink:0;display:inline-block;margin-right:4px}
.tgl{font-size:10.5px;font-weight:600;padding:3px 9px;border-radius:9px;border:1.5px solid;cursor:pointer;background:transparent;display:inline-flex;align-items:center;gap:4px}
.tgl.off{opacity:.27}
.gap{margin-top:14px}
.fn{background:#111;border-radius:10px;padding:10px 16px;box-shadow:0 1px 6px rgba(0,0,0,.05);font-size:11px;color:#666;line-height:1.7}
.fn strong{color:var(--crimson)}
.acwr-chip{display:inline-block;padding:3px 8px;border-radius:9px;font-size:11px;font-weight:700}
.st-u{background:#0d1a2e;color:#60a5fa}.st-ok{background:#0d2e1a;color:#4ade80}
.st-ca{background:#2e1e0d;color:#fbbf24}.st-hi{background:#2e0d0d;color:#f87171}
.sort-link{cursor:pointer;text-decoration:underline dotted;color:var(--crimson)}

/* ── Dark theme overrides ───────────────────────────────────────────────── */
.card-bg{background:var(--card-bg)}
.card-hdr{background:#111;border-bottom-color:#222}
.card-title{font-family:'Oswald','Impact','Arial Narrow',Arial,sans-serif;font-size:15px;letter-spacing:.06em;color:var(--text)}
.brand-title{font-family:'Oswald','Impact','Arial Narrow',Arial,sans-serif;letter-spacing:.06em}
.stat-tile .lbl{color:var(--muted)}
.rcard-name{font-family:'Oswald','Impact','Arial Narrow',Arial,sans-serif;font-size:16px;letter-spacing:.05em}
.rcard-pos{color:var(--muted)}
.rcard:hover{box-shadow:0 6px 28px rgba(152,30,50,.25)}
select.ctl option{background:#1a1a1a;color:var(--text)}
input[type="text"],input[type="url"],input[type="password"],input[type="email"],textarea{background:#1a1a1a!important;color:var(--text)!important;border-color:#2a2a2a!important}
input[type="text"]::placeholder,input[type="url"]::placeholder{color:#555}
.tbl td{color:var(--text);border-color:#222}
.tbl th{color:#aaa;border-bottom-color:#333}
.admin-body h1,.admin-body h2{font-family:'Oswald','Impact','Arial Narrow',Arial,sans-serif;letter-spacing:.05em}
.topnav{background:#0f0f0f;border-bottom:2px solid var(--crimson)}

/* ── Overview 2.0 ─────────────────────────────────────────────────────────── */
.ov-summary-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;margin-bottom:16px}
.ov-sum-tile{background:#1a1a1a;border-radius:10px;padding:12px 14px;border-left:4px solid var(--crimson);text-align:center}
.ov-sum-val{font-family:'Oswald','Impact','Arial Narrow',Arial,sans-serif;font-size:26px;font-weight:800;color:var(--crimson);letter-spacing:.04em;line-height:1.1}
.ov-sum-lbl{font-size:9.5px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin-top:3px;line-height:1.35}
.ov-delta-up{color:#4ade80!important}
.ov-delta-dn{color:#f97316!important}
.ov-scroll-hint{display:flex;justify-content:center;align-items:center;gap:6px;font-size:10px;color:#555;padding:3px 0 7px;user-select:none;letter-spacing:.04em}
.ov-player-tile{border-radius:11px;border:2px solid;padding:11px 9px 8px;display:flex;flex-direction:column;align-items:center;gap:3px;cursor:pointer;transition:transform .12s,box-shadow .15s}
.ov-player-tile:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,.35)}
.ov-tile-photo-wrap{position:relative;width:62px;height:62px;margin-bottom:4px;flex-shrink:0}
.ov-tile-photo{width:62px;height:62px;border-radius:50%;object-fit:cover;object-position:50% 15%;display:block;border:2px solid rgba(255,255,255,.12)}
.ov-tile-initials{width:62px;height:62px;border-radius:50%;background:#2a2a2a;display:flex;align-items:center;justify-content:center;font-family:'Oswald','Impact','Arial Narrow',Arial,sans-serif;font-size:20px;font-weight:900;color:rgba(255,255,255,.55);border:2px solid rgba(255,255,255,.08)}
.ov-tile-status-dot{width:14px;height:14px;border-radius:50%;border:2.5px solid #0a0a0a;position:absolute;bottom:0;right:0}
.ov-tile-name{font-family:'Oswald','Impact','Arial Narrow',Arial,sans-serif;font-size:13px;font-weight:700;letter-spacing:.05em;line-height:1;color:var(--text);text-align:center;width:100%}
.ov-tile-pos{font-size:9px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.6px;margin-bottom:3px}
.ov-tile-row{display:flex;justify-content:space-between;width:100%;font-size:9.5px;padding:1px 2px;border-top:1px solid rgba(255,255,255,.05)}
.ov-tile-key{color:var(--muted);font-weight:600}
.ov-tile-val{font-weight:700;font-size:10px}
.ov-tile-status-lbl{font-size:8.5px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;margin-top:3px}

/* ── Light mode ─────────────────────────────────────────────────────────── */
body.light-mode{
  --bg:#f0f2f5;--white:#ffffff;--card-bg:#ffffff;
  --text:#1a1a1a;--muted:#555;--border:#dde1e8;
}
/* Nav */
body.light-mode .topnav{background:var(--crimson)}
body.light-mode .brand-title,body.light-mode .brand-sub,
body.light-mode .nav-link{color:#fff}
/* Cards */
body.light-mode .card{background:var(--card-bg);border:1px solid var(--border)}
body.light-mode .card-hdr{background:#eaedf2;border-bottom-color:#d5d8e0}
body.light-mode .card-title{color:#1a1a1a}
body.light-mode .card-meta{color:#555}
/* Segment buttons / controls */
body.light-mode .seg-btn{background:#e4e7ed;color:#333;border-color:#ccd0d8}
body.light-mode .seg-btn:hover{background:#d4d7df;color:#111}
body.light-mode .seg-btn.active{background:var(--crimson);border-color:var(--crimson);color:#fff}
body.light-mode .tab-bar-wrap{background:rgba(240,241,245,.97);border-bottom:1px solid rgba(0,0,0,.1);box-shadow:0 2px 8px rgba(0,0,0,.1)}
body.light-mode #main-nav .seg-btn{background:transparent;border:none;border-bottom:3px solid transparent;color:rgba(0,0,0,.45)}
body.light-mode #main-nav .seg-btn:hover{color:rgba(0,0,0,.75);background:rgba(0,0,0,.04);border-bottom-color:rgba(152,30,50,.4)}
body.light-mode #main-nav .seg-btn.active{color:#981E32;background:rgba(152,30,50,.07);border-bottom-color:var(--crimson)}
/* Forms */
body.light-mode .form-input{background:#fff;color:#1a1a1a;border-color:#ccc}
body.light-mode .form-label{color:#444}
body.light-mode input[type="text"],body.light-mode input[type="url"],
body.light-mode input[type="password"],body.light-mode input[type="email"],
body.light-mode textarea{background:#fff!important;color:#1a1a1a!important;border-color:#ccc!important}
body.light-mode select.ctl,body.light-mode .ctl{background:#fff;color:#1a1a1a;border-color:#ccc}
body.light-mode select.ctl option{background:#fff;color:#1a1a1a}
/* Tables */
body.light-mode .tbl th{background:#eaedf2;color:#333;border-color:#d5d8e0}
body.light-mode .tbl td{color:#1a1a1a;border-color:#e5e8ef}
body.light-mode .tbl tr:hover td{background:rgba(0,0,0,.03)}
body.light-mode .sort-link{color:var(--crimson)}
/* Flash messages */
body.light-mode .flash-success{background:#d1fae5;color:#065f46;border-color:#a7f3d0}
body.light-mode .flash-error{background:#fee2e2;color:#991b1b;border-color:#fca5a5}
/* Footnote boxes */
body.light-mode .fn{background:#eaedf2;color:#333}
/* Admin sidebar */
body.light-mode .topnav-wrap,body.light-mode .admin-sidebar{background:#f8f9fb}
body.light-mode .admin-sidebar{border-color:#d5d8e0}
body.light-mode .sidebar-label{color:#888}
body.light-mode{--duel-bg:#eaedf2;--duel-border:#cdd1dc;--duel-bar-bg:#d0d5e2;--duel-label:#999;--duel-dim:#bbb;--duel-rule:#cdd1dc;}
body.light-mode .rcard{background:#fff;border:1px solid var(--border);}
body.light-mode .rcard-name a{border-bottom-color:rgba(0,0,0,.25)!important;}
.home-nav-btn{display:flex;align-items:center;justify-content:center;gap:14px;padding:0 24px;height:160px;border-radius:16px;border:none;cursor:pointer;font-family:'Oswald',Impact,sans-serif;font-size:26px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;transition:transform .15s,box-shadow .2s;width:100%;}
.home-nav-btn:hover{transform:translateY(-4px);box-shadow:0 10px 30px rgba(0,0,0,.25);}
.home-btn-crimson{background:linear-gradient(135deg,#981E32,#5a0e1a);color:#fff;}
.home-btn-gold{background:linear-gradient(135deg,#c8a84b,#7a5d1f);color:#fff;}
body.light-mode .home-btn-crimson{box-shadow:0 4px 16px rgba(152,30,50,.3);}
body.light-mode .home-btn-gold{box-shadow:0 4px 16px rgba(200,168,75,.3);}
body.light-mode .sidebar-link{color:#333}
body.light-mode .sidebar-link:hover,body.light-mode .sidebar-link.active{background:rgba(152,30,50,.1);color:var(--crimson)}
/* Overview summary tiles */
body.light-mode .ov-sum-tile{background:#eaedf2;border-left-color:var(--crimson)}
body.light-mode .ov-sum-val{color:var(--crimson)}
body.light-mode .ov-sum-lbl{color:#555}
body.light-mode .ov-scroll-hint{color:#888}
/* Player tiles */
body.light-mode .ov-tile-name{color:#1a1a1a}
body.light-mode .ov-tile-pos{color:#555}
body.light-mode .ov-tile-row{border-top-color:rgba(0,0,0,.08)}
body.light-mode .ov-tile-key{color:#555}
body.light-mode .ov-tile-initials{background:#d0d4dc;color:#444;border-color:rgba(0,0,0,.1)}
body.light-mode .ov-tile-status-dot{border-color:#f0f2f5}
body.light-mode .ov-player-tile:hover{box-shadow:0 8px 24px rgba(0,0,0,.15)}
/* Stat tiles */
body.light-mode .stat-tile{background:#eaedf2}
body.light-mode .stat-tile .val{color:var(--crimson)}
body.light-mode .stat-tile .lbl{color:#555}
/* ctrl-lbl */
body.light-mode .ctrl-lbl{color:#555}

/* ============================================================
   VIDEO GAME PLAYER PROFILE CARD
   ============================================================ */
.profile-hero{display:flex;align-items:stretch;background:linear-gradient(135deg,#080002 0%,#3a0810 45%,#981E32 100%);border-radius:12px;overflow:hidden;margin-bottom:14px;border:1px solid rgba(200,168,75,.18);position:relative;min-height:160px}
.profile-hero::before{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.02'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");pointer-events:none}
.profile-hero-photo-wrap{width:150px;flex-shrink:0;position:relative;overflow:hidden}
.profile-hero-photo-wrap::after{content:'';position:absolute;right:0;top:0;bottom:0;width:40px;background:linear-gradient(90deg,transparent,rgba(60,4,16,.8))}
.profile-hero-photo{width:100%;height:100%;object-fit:cover;object-position:50% 15%;display:block}
.profile-hero-avatar{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:56px;font-weight:900;color:rgba(255,255,255,.25);font-family:'Oswald',sans-serif}
.profile-hero-body{flex:1;padding:18px 22px;display:flex;flex-direction:column;justify-content:center;gap:8px;position:relative;z-index:1}
.profile-hero-number{font-family:'Oswald',sans-serif;font-size:11px;font-weight:600;letter-spacing:.12em;color:rgba(255,255,255,.35);text-transform:uppercase;margin-bottom:2px}
.profile-hero-name{font-family:'Oswald',sans-serif;font-size:30px;font-weight:700;color:#fff;letter-spacing:.03em;line-height:1;text-shadow:0 2px 12px rgba(0,0,0,.4)}
.profile-hero-meta{font-size:11.5px;color:rgba(255,255,255,.55);font-weight:600;letter-spacing:.03em}
.profile-hero-chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:4px}
.profile-hero-chip{font-size:9.5px;font-weight:800;letter-spacing:.08em;padding:3px 8px;border-radius:20px;text-transform:uppercase}

/* EDGE Score badges */
.edge-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.edge-badge{display:flex;flex-direction:column;align-items:center;border-radius:8px;padding:8px 7px;width:76px;min-width:76px;max-width:76px;text-align:center;border:1.5px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);backdrop-filter:blur(4px)}
.edge-badge.s5{border-color:#c8a84b;background:rgba(200,168,75,.14);box-shadow:0 0 10px rgba(200,168,75,.2)}
.edge-badge.s4{border-color:#4ade80;background:rgba(74,222,128,.1)}
.edge-badge.s3{border-color:#facc15;background:rgba(250,204,21,.08)}
.edge-badge.s2{border-color:#f97316;background:rgba(249,115,22,.1)}
.edge-badge.s1{border-color:#ef4444;background:rgba(239,68,68,.1)}
.edge-badge-letter{font-family:'Oswald',sans-serif;font-size:13px;font-weight:700;color:rgba(255,255,255,.45);letter-spacing:.04em;line-height:1}
.edge-badge-score{font-family:'Oswald',sans-serif;font-size:26px;font-weight:700;line-height:1;margin:1px 0}
.edge-badge.s5 .edge-badge-score{color:#c8a84b}
.edge-badge.s4 .edge-badge-score{color:#4ade80}
.edge-badge.s3 .edge-badge-score{color:#facc15}
.edge-badge.s2 .edge-badge-score{color:#f97316}
.edge-badge.s1 .edge-badge-score{color:#ef4444}
.edge-badge-label{font-size:7px;font-weight:700;letter-spacing:0;color:rgba(255,255,255,.35);text-transform:uppercase;line-height:1.25;margin-top:2px;word-break:normal;overflow-wrap:normal}

/* Overall Rating Ring */
.profile-overall{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px 24px;border-left:1px solid rgba(255,255,255,.07);gap:6px;min-width:110px;position:relative;z-index:1}
.overall-ring{position:relative;width:72px;height:72px}
.overall-ring-svg{width:72px;height:72px;transform:rotate(-90deg)}
.overall-ring-bg{fill:none;stroke:rgba(255,255,255,.08);stroke-width:5}
.overall-ring-fill{fill:none;stroke-width:5;stroke-linecap:round;transition:stroke-dashoffset .6s ease}
.overall-ring-val{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:'Oswald',sans-serif;font-size:24px;font-weight:700;color:#fff;line-height:1}
.overall-label{font-size:8.5px;font-weight:800;letter-spacing:.12em;color:rgba(255,255,255,.4);text-transform:uppercase}
.overall-tier{font-size:9.5px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;padding:2px 8px;border-radius:20px}

/* Attribute bars */
.attr-card{background:var(--card-bg);border:1px solid var(--border);border-radius:10px;overflow:hidden}
.attr-card-hdr{padding:12px 14px 8px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border)}
.attr-body{padding:12px 14px}
.attr-group{font-size:9px;font-weight:800;letter-spacing:.1em;color:var(--muted);text-transform:uppercase;margin:10px 0 6px;display:flex;align-items:center;gap:6px}
.attr-group::after{content:'';flex:1;height:1px;background:var(--border)}
.attr-row{display:flex;align-items:center;gap:10px;margin-bottom:7px}
.attr-label{width:72px;font-size:10.5px;font-weight:600;color:var(--muted);flex-shrink:0}
.attr-value{width:60px;font-size:12px;font-weight:800;color:var(--text);text-align:right;flex-shrink:0;line-height:1.2}
.attr-date{display:block;font-size:8px;font-weight:600;color:var(--muted);letter-spacing:.02em;margin-top:1px}
.attr-bar-track{flex:1;height:7px;background:rgba(128,128,128,.12);border-radius:4px;position:relative;overflow:visible}
.attr-bar-fill{height:100%;border-radius:4px;transition:width .7s cubic-bezier(.4,0,.2,1);position:relative}
.attr-bar-fill.elite{box-shadow:0 0 8px currentColor}
.attr-nfl-marker{position:absolute;top:-3px;width:2px;height:13px;background:rgba(255,255,255,.55);border-radius:1px;z-index:2;transform:translateX(-50%)}
.attr-nfl-marker::after{content:'NFL';position:absolute;top:-12px;left:50%;transform:translateX(-50%);font-size:7px;font-weight:800;color:rgba(255,255,255,.45);white-space:nowrap;letter-spacing:.04em}
.attr-rank{width:38px;flex-shrink:0;font-size:10px;font-weight:800;text-align:right;color:var(--muted)}
.attr-rank.gold{color:#c8a84b}
.attr-rank.silver{color:#c0c0c0}
.attr-rank.bronze{color:#cd7f32}
.attr-rank.green{color:#4ade80}
.attr-rank.blue{color:#60a5fa}

/* Compare-mode toggle on attr card */
.compare-tabs{display:flex;gap:0}
.compare-tab{font-size:10px;font-weight:700;padding:3px 10px;border:1px solid var(--border);background:transparent;color:var(--muted);cursor:pointer;letter-spacing:.04em}
.compare-tab:first-child{border-radius:6px 0 0 6px}
.compare-tab:last-child{border-radius:0 6px 6px 0}
.compare-tab:not(:first-child){margin-left:-1px}
.compare-tab.active{background:var(--crimson);border-color:var(--crimson);color:#fff;z-index:1;position:relative}

/* Rank chips on hero */
.rank-medals{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.rank-medal{font-size:9.5px;font-weight:800;padding:2px 8px;border-radius:20px;letter-spacing:.04em;background:rgba(255,255,255,.08);color:rgba(255,255,255,.6);border:1px solid rgba(255,255,255,.1)}
.rank-medal.gold{background:rgba(200,168,75,.2);color:#c8a84b;border-color:rgba(200,168,75,.4)}
.rank-medal.silver{background:rgba(192,192,192,.15);color:#d4d4d4;border-color:rgba(192,192,192,.3)}
.rank-medal.bronze{background:rgba(205,127,50,.15);color:#cd7f32;border-color:rgba(205,127,50,.3)}

/* Profile chart grid */
.profile-charts-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px;margin-bottom:14px}
.profile-two-col{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}

/* light-mode overrides */
body.light-mode .profile-hero{background:linear-gradient(135deg,#2a0008 0%,#6a1020 45%,#981E32 100%)}
body.light-mode .attr-card{background:#fff}


/* ── Compare Players – video-game HUD ─────────────────────────────────── */
.cp-bar-fill{transition:width 0s}  /* JS sets transition after first paint */
.cp-pos-card:hover{box-shadow:0 0 22px rgba(200,168,75,.25)!important;transform:translateY(-2px)}
.cp-pos-card{transition:box-shadow .25s,transform .2s}
.cp-lb-row:nth-child(odd){background:rgba(255,255,255,.012)}

body.light-mode .attr-nfl-marker{background:rgba(0,0,0,.5)}
body.light-mode .attr-nfl-marker::after{color:rgba(0,0,0,.6)}

/* Attribute bar — team & position average markers */
.attr-team-marker{position:absolute;top:-3px;width:2px;height:13px;background:rgba(160,160,160,.65);border-radius:1px;z-index:2;transform:translateX(-50%)}
.attr-team-marker::after{content:'T';position:absolute;top:-11px;left:50%;transform:translateX(-50%);font-size:6.5px;font-weight:800;color:rgba(150,150,150,.7);letter-spacing:.02em}
.attr-pos-marker{position:absolute;top:-3px;width:2px;height:13px;background:#c8a84b;border-radius:1px;z-index:3;transform:translateX(-50%)}
.attr-pos-marker::after{content:'P';position:absolute;top:-11px;left:50%;transform:translateX(-50%);font-size:6.5px;font-weight:800;color:#c8a84b;letter-spacing:.02em}
body.light-mode .attr-team-marker{background:rgba(60,60,60,.55)}
body.light-mode .attr-team-marker::after{color:rgba(60,60,60,.65)}

/* Floating bar tooltip */
#attr-tooltip{
  position:fixed;pointer-events:none;display:none;z-index:9999;
  background:rgba(10,10,10,.93);color:#e8e8e8;
  font-size:11px;font-weight:700;letter-spacing:.04em;
  padding:5px 11px;border-radius:7px;
  border:1px solid #2a2a2a;
  white-space:nowrap;box-shadow:0 4px 16px rgba(0,0,0,.55);
  backdrop-filter:blur(4px);
}
body.light-mode #attr-tooltip{
  background:rgba(255,255,255,.96);color:#111;
  border-color:rgba(0,0,0,.12);box-shadow:0 4px 16px rgba(0,0,0,.18);
}
/* Make bar tracks cursor-friendly */
.attr-bar-track[data-tip]{cursor:default}

/* ── Fatigue History Panel ──────────────────────────────────────────────── */
/* keep .fh-badge / .fh-dot for both old inline use and new big panel */
.fh-badge{
  display:inline-flex;align-items:center;gap:4px;
  font-size:7.5px;font-weight:800;letter-spacing:.07em;
  padding:2px 8px;border-radius:10px;border:1px solid;
  text-transform:uppercase;
}
.fh-dot{width:5px;height:5px;border-radius:50%;flex-shrink:0;}

/* ── Big Fatigue History panel (full-width redesign) ─ */
.fh-big-panel{width:100%;}
.fh-big-header{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  margin-bottom:10px;
}
.fh-big-row{
  display:flex;flex-direction:column;gap:2px;
  margin-bottom:10px;
}
.fh-big-row:last-child{margin-bottom:0;}
.fh-big-meta{
  display:flex;align-items:center;gap:8px;
  padding:0 2px;
}
.fh-big-icon{font-size:13px;line-height:1;width:18px;text-align:center;flex-shrink:0;}
.fh-big-lbl{
  font-size:8.5px;font-weight:800;letter-spacing:.08em;
  text-transform:uppercase;color:var(--muted);
}
.fh-big-sub{font-size:7.5px;color:rgba(255,255,255,.22);margin-top:1px;}
.fh-big-val{
  font-size:14px;font-weight:900;margin-left:auto;
  white-space:nowrap;
}
.fh-big-spark{
  display:flex;align-items:stretch;height:52px;
  border-radius:6px;overflow:hidden;
  background:rgba(255,255,255,.025);
  padding:2px 0;
}
/* light mode */
body.light-mode .fh-big-sub{color:rgba(0,0,0,.3);}
body.light-mode .fh-big-spark{background:rgba(0,0,0,.03);}

/* ── Speed Tracker ──────────────────────────────────────────────────────── */
.speed-header{
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.07);
  border-radius:8px;padding:10px 14px;margin-bottom:12px;
}
.ov-speed-tile{
  border:1px solid #1e1e1e;border-radius:12px;
  background:#0e0e0e;
  padding:10px 8px 8px;text-align:center;
  cursor:pointer;position:relative;
  transition:transform .15s,box-shadow .15s;
  display:flex;flex-direction:column;align-items:center;
}
.ov-speed-tile:hover{transform:translateY(-2px);box-shadow:0 6px 18px rgba(0,0,0,.5);}
.ov-speed-days{
  font-family:'Oswald',sans-serif;font-size:26px;font-weight:700;
  line-height:1;margin-top:5px;letter-spacing:-.01em;
}
.ov-speed-label{
  font-size:6.5px;font-weight:800;letter-spacing:.1em;
  color:rgba(255,255,255,.35);text-transform:uppercase;margin-top:1px;
}
body.light-mode .ov-speed-tile{background:#f4f4f4;border-color:#ddd;}
body.light-mode .speed-header{background:rgba(0,0,0,.02);border-color:rgba(0,0,0,.08);}
body.light-mode .ov-speed-label{color:rgba(0,0,0,.35);}

/* ── Session History charts (Player Profile) ─────────────────────────────── */
.sh-section{margin-top:20px;}
.sh-full{margin-bottom:12px;}
.sh-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;margin-bottom:12px;}
@media(max-width:900px){.sh-row{grid-template-columns:1fr;}}
/* Timeline range slider */
.sh-slider{width:100%;accent-color:#981E32;cursor:pointer;height:4px;}


/* ── Player Profile Tab Bar ──────────────────────────────────────────────── */
.pp-tab-bar{
  display:flex;gap:0;margin:16px 0 0;
  border-bottom:2px solid var(--border);
}
.pp-tab{
  flex:1;padding:9px 14px;
  font-size:12px;font-weight:700;letter-spacing:.03em;
  background:none;border:none;border-bottom:3px solid transparent;
  color:var(--muted);cursor:pointer;
  transition:color .18s,border-color .18s;
  margin-bottom:-2px;
}
.pp-tab:hover{color:var(--text);}
.pp-tab.active{
  color:var(--crimson);
  border-bottom-color:var(--crimson);
}
body.light-mode .pp-tab.active{color:var(--crimson);border-bottom-color:var(--crimson);}

/* ─── Development Tab ──────────────────────────────────────────────────────── */
.dev-kpi-row{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
  margin-top:14px;
}
.dev-kpi-card{
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.08);
  border-radius:12px;
  padding:16px 14px 14px;
  text-align:center;
  transition:border-color .2s,background .2s;
}
.dev-kpi-card:hover{
  background:rgba(255,255,255,.055);
  border-color:rgba(255,255,255,.15);
}

.dev-section{ }

.dev-lift-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
  gap:10px;
}
.dev-lift-card{
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.08);
  border-radius:12px;
  padding:14px;
  transition:border-color .2s,background .2s;
}
.dev-lift-card:hover{
  background:rgba(255,255,255,.055);
  border-color:rgba(255,255,255,.16);
}

.dev-legend-row{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:9px;
  color:rgba(255,255,255,.4);
  flex-wrap:wrap;
}
.dev-legend-dot{
  display:inline-block;
  width:8px;height:8px;
  border-radius:50%;
  flex-shrink:0;
}
.dev-legend-dash{
  display:inline-block;
  width:16px;height:0;
  border-top:2px dashed;
  flex-shrink:0;
  margin-right:1px;
}

@media(max-width:700px){
  .dev-kpi-row{grid-template-columns:repeat(2,1fr);}
  .dev-lift-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));}
}

/* Progress photo cards in Dev tab */
.dev-photo-card{
  flex:0 0 140px;
  min-width:140px;
}
@media(max-width:500px){.dev-photo-card{flex:0 0 110px;min-width:110px;}}
/* Dev tab: keep dark in light mode (all inline styles use rgba(255,255,255,.) ) */
body.light-mode #pp-dev{background:#111827;border-radius:12px;padding:14px;margin-top:8px}
body.light-mode .dev-kpi-card{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.12)}
body.light-mode .dev-kpi-card:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.2)}
body.light-mode .dev-lift-card{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.12)}


