/* OutKast Unleashed v4 — responsive design system; no changes to data */
:root{--bg:#080d16;--panel:#111b2a;--border:#26364c;--ink:#f3f7ff;--muted:#9cacc2;--blue:#49b9ff;--red:#e84b59;--surface:#0d1522;--shadow:0 18px 48px rgba(0,0,0,.22)}
html{scroll-behavior:smooth}body{background:radial-gradient(ellipse at 95% -10%,rgba(31,99,154,.17),transparent 45%),var(--bg);line-height:1.55;-webkit-font-smoothing:antialiased}button,input,select,textarea{font-family:inherit}button{transition:background .18s,border-color .18s,transform .18s}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--blue);outline-offset:3px}button:disabled{opacity:.45;cursor:not-allowed}a:hover{color:var(--blue)}.wrap{max-width:1400px;padding:0 clamp(16px,3vw,44px)}
header{background:rgba(7,13,24,.94);border-color:#253448}.nav{min-height:82px;gap:22px}.brand{font-size:clamp(18px,1.8vw,24px);line-height:1.05;white-space:nowrap}.brand small{margin-top:7px;letter-spacing:3.6px}nav{gap:3px}nav button{font-weight:650;font-size:13px;padding:10px 13px}nav button.active{background:rgba(73,185,255,.12);color:#91d7ff}.btn{background:linear-gradient(135deg,#56c4ff,#2299e6);box-shadow:0 6px 18px rgba(20,130,213,.13);border-radius:10px;min-height:42px}.btn:hover{filter:brightness(1.1);transform:translateY(-1px)}.btn.secondary{background:#213047;border:1px solid #344961}.btn.danger{background:#a52f42}.btn.mini{min-height:32px;padding:6px 11px}.actions{align-items:center;gap:10px}
.hero{padding:clamp(70px,9vw,125px) 0;position:relative;overflow:hidden;background:radial-gradient(ellipse at 78% 25%,rgba(35,131,202,.35),transparent 44%),linear-gradient(125deg,#14243b,#080d16 72%)}.hero:after{content:"";position:absolute;right:-7%;bottom:-35%;width:50%;height:90%;border:2px solid rgba(73,185,255,.07);border-radius:50%;pointer-events:none}.hero h1{font-size:clamp(55px,8.5vw,116px);line-height:.92;letter-spacing:-.065em;margin:22px 0 28px}.hero p{max-width:590px;font-size:clamp(16px,1.5vw,20px);margin-bottom:28px}.eyebrow{font-size:11px;letter-spacing:.28em}.section{padding:clamp(30px,4vw,58px) 0}.section h2{font-size:clamp(26px,2.8vw,37px);letter-spacing:-.035em}.sub{margin-bottom:24px}.grid{gap:18px}.card,.panel{background:linear-gradient(160deg,rgba(22,35,53,.96),rgba(15,25,40,.98));border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow)}.card{padding:clamp(18px,2vw,25px)}.card h3{font-size:17px;line-height:1.35}.card .stat{font-size:clamp(28px,3vw,40px);letter-spacing:-.05em;line-height:1.2;margin:10px 0}.card p{margin:8px 0}.tag{color:#6ccaff;font-size:10px;letter-spacing:.16em}.panel{padding:clamp(18px,2.5vw,30px);margin-bottom:20px}.panel h3{font-size:19px;letter-spacing:-.02em;margin:0 0 14px}.panel .bar{margin-bottom:18px}.panel .bar h3{margin:0}.muted{color:var(--muted)}
input,select,textarea{background:#0b1422;border:1px solid #344760;border-radius:9px;min-height:44px;padding:10px 13px}input:focus,select:focus,textarea:focus{border-color:var(--blue)}.formgrid{gap:16px;margin:15px 0}.formgrid label{font-size:12px;font-weight:700;letter-spacing:.01em;color:#b8c7dc;gap:7px}.panel form>p:last-child{margin-bottom:0}.tablewrap{border-radius:12px;border-color:#2c3e54;background:rgba(6,12,22,.25)}table{min-width:600px}th{background:#1a2b40;color:#bcd0e8;font-size:11px;letter-spacing:.06em;position:sticky;top:0}th,td{padding:13px 16px}tbody tr:nth-child(even){background:rgba(255,255,255,.018)}tbody tr:hover{background:rgba(73,185,255,.055)}.notice{border-radius:10px;background:rgba(48,124,173,.11);border:1px solid rgba(73,185,255,.22);border-left:3px solid var(--blue);line-height:1.55}.empty{padding:38px 20px;background:rgba(7,16,28,.22)}.avatar{height:195px;border-radius:12px;background:linear-gradient(140deg,#223a55,#101d2e)}.finance-metrics{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px}.finance-metrics .card{min-height:142px}.finance-metrics .stat{font-size:clamp(25px,2.3vw,34px);overflow-wrap:anywhere}
/* Dashboard navigation becomes a real left-hand workspace on desktop. */
.dashboard-heading{margin-bottom:26px;padding-bottom:20px;border-bottom:1px solid var(--border)}.dashboard-heading h2{margin-bottom:2px}.dashboard-heading .sub{margin:0}.dashboard-shell{display:grid;grid-template-columns:210px minmax(0,1fr);gap:25px;align-items:start}.dashboard-shell .tabs{display:flex;flex-direction:column;gap:5px;overflow:visible;position:sticky;top:106px;background:linear-gradient(160deg,#152238,#101a2a);border:1px solid var(--border);border-radius:15px;padding:12px;margin:0}.dashboard-shell .tabs button{text-align:left;background:transparent;border:1px solid transparent;border-radius:9px;color:#adbed4;padding:12px 14px;font-weight:650;font-size:13px}.dashboard-shell .tabs button:hover{background:#1e3149;color:white}.dashboard-shell .tabs button.active{background:linear-gradient(100deg,#278ac7,#1e689c);color:white;border-color:#399ad0;box-shadow:inset 3px 0 0 #a6e4ff}.dashboard-shell #dashcontent{min-width:0}.dashboard-shell #dashcontent>.panel:first-child{margin-top:0}.dashboard-shell .grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}footer{background:#0a111d;margin-top:45px}
@media(max-width:1080px){.nav{padding:12px 0;justify-content:center}.nav nav{width:100%;justify-content:center}.dashboard-shell{grid-template-columns:175px minmax(0,1fr);gap:16px}.dashboard-shell .tabs button{padding:10px 12px}}
@media(max-width:760px){.wrap{padding:0 16px}.nav{justify-content:space-between;gap:8px}.brand{font-size:18px}.nav nav{width:100%;justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto;padding-bottom:5px;scrollbar-width:thin}.nav nav button{white-space:nowrap;padding:9px 11px}.hero{padding:64px 0 72px}.hero h1{font-size:clamp(48px,13vw,75px);letter-spacing:-.055em}.section{padding:26px 0}.dashboard-heading{gap:12px;align-items:flex-start}.dashboard-shell{display:block}.dashboard-shell .tabs{position:static;flex-direction:row;overflow-x:auto;white-space:nowrap;gap:6px;padding:8px;margin-bottom:16px;scrollbar-width:thin}.dashboard-shell .tabs button{flex:0 0 auto;padding:9px 13px}.dashboard-shell .tabs button.active{box-shadow:inset 0 -3px 0 #a6e4ff}.finance-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.finance-metrics .card{padding:16px;min-height:126px}.finance-metrics .stat{font-size:clamp(21px,5vw,29px)}.panel{padding:17px}.panel .bar{align-items:flex-start}.formgrid{grid-template-columns:1fr}.grid{grid-template-columns:repeat(auto-fit,minmax(165px,1fr))}.card{padding:17px}.tablewrap{margin:0 -2px}th,td{padding:11px 12px}.avatar{height:155px}}
@media(max-width:410px){.finance-metrics{grid-template-columns:1fr}.dashboard-heading{flex-direction:column}.hero h1{font-size:48px}.grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}button{transition:none}}

/* v4.1 — compact, readable public roster profiles */
.roster-intro{margin-bottom:26px}.roster-kicker{display:block;color:#78caff;font-size:11px;letter-spacing:.19em;font-weight:800;margin-bottom:10px}.roster-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:20px}.roster-player{min-width:0;overflow:hidden;background:linear-gradient(160deg,#16263b,#0d1827);border:1px solid #2c4058;border-radius:16px;box-shadow:0 12px 32px rgba(0,0,0,.16)}.roster-photo{height:170px;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;background:radial-gradient(circle at 50% 30%,#294765,#0b1524 75%)}.roster-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 25%}.roster-photo-placeholder{display:flex;flex-direction:column;align-items:center;gap:10px;color:#7d9bb8;font-size:10px;letter-spacing:.2em;font-weight:800}.roster-initials{display:grid;place-items:center;width:82px;height:82px;border:2px solid rgba(128,200,255,.26);border-radius:50%;color:#e5f5ff;font-size:30px;letter-spacing:-.04em;background:rgba(255,255,255,.04)}.roster-number{position:absolute;right:12px;bottom:12px;display:inline-flex;align-items:center;justify-content:center;min-width:46px;height:36px;padding:0 10px;border-radius:9px;background:#2588c3;color:#fff;font-weight:900;font-size:19px;box-shadow:0 3px 12px #0006}.roster-info{padding:19px 20px 21px}.roster-label{font-size:10px;font-weight:800;letter-spacing:.16em;color:#69bde9}.roster-info h3{font-size:22px;line-height:1.2;margin:8px 0 18px;letter-spacing:-.025em;color:#fff}.roster-details{display:grid;grid-template-columns:1fr 1fr;gap:12px;border-top:1px solid #2b3e54;padding-top:14px}.roster-details span{font-size:13px;line-height:1.5;color:#dce8f7}.roster-details strong{display:block;color:#819cb9;font-size:10px;letter-spacing:.11em;margin-bottom:4px}.roster-section .sub{max-width:620px}
@media(max-width:600px){.roster-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.roster-photo{height:135px}.roster-info{padding:13px}.roster-info h3{font-size:17px;margin:7px 0 13px}.roster-details{grid-template-columns:1fr;gap:8px}.roster-number{right:8px;bottom:8px;min-width:38px;height:30px;font-size:16px}.roster-initials{width:65px;height:65px;font-size:24px}.roster-photo-placeholder{font-size:8px;text-align:center}}
@media(max-width:350px){.roster-grid{grid-template-columns:1fr}.roster-photo{height:170px}.roster-details{grid-template-columns:1fr 1fr}}

/* v4.2: jersey number alongside name; single-age roster */
.roster-name-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:8px 0 16px}
.roster-name-row h3{margin:0;min-width:0;overflow-wrap:anywhere}
.roster-name-row .roster-number{position:static;flex:none;min-width:0;height:auto;padding:5px 9px;font-size:15px;line-height:1.3;box-shadow:none;border-radius:7px}
.roster-details{grid-template-columns:1fr}
@media(max-width:600px){.roster-name-row{align-items:flex-start;gap:6px}.roster-name-row .roster-number{font-size:12px;padding:4px 6px}}
