/* Footy Analyzer WebApp v6.0 - dark football workspace reference theme.
   Presentation only: existing data, routes, permissions and i18n remain unchanged. */
:root{
  --ref-bg:#070b17;
  --ref-sidebar:#0c1830;
  --ref-panel:#0c1526;
  --ref-panel-2:#0f1a2f;
  --ref-table-head:#131f39;
  --ref-line:#17253d;
  --ref-line-soft:#111d31;
  --ref-text:#e4e8f2;
  --ref-muted:#8592aa;
  --ref-muted-2:#66758f;
  --ref-blue:#187cf2;
  --ref-blue-soft:#1d98e8;
  --ref-gold:#f5b942;
  --ref-gold-soft:#f3c45d;
  --ref-green:#64d6a3;
  --ref-red:#ef6a81;
  --ref-sidebar-w:174px;
  --ref-top-h:62px;
  --sidebar:var(--ref-sidebar-w);
  --top:var(--ref-top-h);
  --bg:var(--ref-bg);
  --panel:var(--ref-panel);
  --panel2:var(--ref-panel-2);
  --panel3:var(--ref-table-head);
  --line:var(--ref-line);
  --line2:#263756;
  --text:var(--ref-text);
  --muted:var(--ref-muted);
  --blue:var(--ref-blue);
  --gold:var(--ref-gold);
  --green:var(--ref-green);
  --bad:var(--ref-red);
}
html,body{background:var(--ref-bg);color:var(--ref-text);font-family:"Segoe UI",Inter,Arial,sans-serif;font-size:13px}
body{background:var(--ref-bg);}
.app-shell{background:var(--ref-bg);min-height:100vh}

/* Main chrome */
.topbar{
  left:var(--ref-sidebar-w);right:0;top:0;height:var(--ref-top-h);
  padding:0 16px;gap:9px;background:#070b17;border:0;border-bottom:1px solid #111a2b;
  box-shadow:none;z-index:31;
}
.topbar .brand{display:none!important}
.chrome-arrow{width:31px;height:36px;display:grid;place-items:center;border:0;border-radius:5px;background:#0b1324;color:#68758d;font-size:20px;line-height:1;cursor:pointer}
.chrome-arrow:hover{background:#111c31;color:#d8dfec}
.chrome-arrow:disabled{opacity:.38}
.chrome-date{display:flex;align-items:center;gap:8px;margin-left:7px;color:#dce1eb;font-size:13px;font-weight:700;letter-spacing:.01em;white-space:nowrap}
.chrome-date svg{width:14px;height:14px;color:var(--ref-gold);stroke-width:1.8}
.top-spacer{flex:1}
.save-picker-label,.language-picker-label{gap:6px;font-size:9px;color:#65728a;letter-spacing:.06em}
.save-picker,.language-picker{height:34px;background:#0b1324;border:1px solid #111d32;color:#aeb8c9;border-radius:5px;font-size:11px;box-shadow:none}
.save-picker{min-width:175px;max-width:245px}
.language-picker{min-width:100px;max-width:130px}
.save-picker:focus,.language-picker:focus{border-color:#25466d;outline:none}
.ui-scale{height:34px;background:#0b1324;border:1px solid #111d32;border-radius:5px;padding:2px;gap:2px}
.ui-scale button{height:28px;min-width:29px;border:0;background:transparent;color:#6e7b91;border-radius:4px;font-size:10px}
.ui-scale button:hover{background:#111e34;color:#dfe5ef}
.account{border-left:0;padding-left:2px;gap:9px}.account>div{display:none}
.account .btn{height:39px;min-width:100px;border:0;border-radius:7px;background:var(--ref-gold);color:#17120a;font-size:11px;font-weight:900;letter-spacing:.04em;box-shadow:0 0 0 2px #6a5321,0 0 16px #f5b94222}
.account .btn:hover{background:#fac454;color:#111}
.mobile-only{display:none}

/* Sidebar - reference layout starts at the very top */
.sidebar{
  top:0;bottom:0;left:0;width:var(--ref-sidebar-w);padding:0 10px 12px;
  background:var(--ref-sidebar);border:0;border-right:1px solid #14223a;box-shadow:none;overflow-y:auto;z-index:35;
}
.sidebar-club{height:115px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:10px 10px 9px;border-bottom:1px solid #14233c;margin:0 -10px 8px;padding-left:20px}
.sidebar-crest{width:42px;height:46px;display:grid;place-items:center;margin:0 0 7px;background:linear-gradient(145deg,#2d70b8 0 48%,#163d72 49% 100%);clip-path:polygon(8% 0,92% 0,92% 58%,50% 100%,8% 58%);border:1px solid #5c8bc0;color:#d9ecff;font-size:9px;font-weight:900;overflow:hidden}
.sidebar-crest img{width:100%;height:100%;object-fit:contain;padding:3px;clip-path:inherit;background:#0c1830}
.sidebar-club strong{display:block;max-width:138px;color:#e5e9f2;font-size:12px;font-weight:750;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sidebar-club small{display:block;margin-top:3px;max-width:138px;color:#77859d;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sidebar nav{gap:1px;padding:0}
.nav-item{height:38px;padding:0 5px;border:0;border-radius:4px;background:transparent;color:#a7b2c8;gap:9px;font-size:11px;font-weight:700;letter-spacing:0;text-transform:none}
.nav-item i{width:16px;height:18px;border:0;background:transparent;color:#697b9b;border-radius:0;display:grid;place-items:center}
.nav-item i svg{width:13px;height:13px;stroke-width:1.6}
.nav-item:hover{background:#101d35;color:#e0e5ef}
.nav-item:hover i{color:#91a7c8}
.nav-item.active{background:#101d35;border:0;color:#f0f3f8;box-shadow:none}
.nav-item.active i{background:transparent;border:0;color:#93a8c9}
.nav-separator{height:1px;background:#14233b;margin:6px 4px}
.sidebar-note{margin-top:auto;border-top:1px solid #14233b;padding:10px 5px 0;color:#596880;font-size:8px;line-height:1.5;text-transform:none;letter-spacing:.03em}
.sidebar-note span{color:#7f8ea6}

.content{margin-left:var(--ref-sidebar-w);padding:calc(var(--ref-top-h) + 16px) 26px 34px;min-height:100vh;background:var(--ref-bg);font-size:13px}
#view,.detail-view{max-width:1480px;margin:0 auto;zoom:var(--fa-ui-scale)}
.breadcrumbs{min-height:22px;margin:0 0 10px;gap:8px;color:#5e6d84}
.breadcrumbs ol{gap:6px;font-size:10px}.breadcrumbs li{gap:6px}.breadcrumbs li+li:before{color:#36445b}
.breadcrumbs button{color:#687992;font-size:10px}.breadcrumbs [aria-current=page]{color:#8996aa;font-weight:600}
.breadcrumbs .page-back{padding:4px 7px;border:0;background:#0c1424;color:#738199;border-radius:4px;font-size:10px}

/* Generic page surfaces */
.page-head{margin:0 0 14px;align-items:flex-end}.page-title{font-size:23px;line-height:1.1;font-weight:750;letter-spacing:-.025em}.page-title .accent{color:var(--ref-blue)}
.page-sub{margin-top:4px;color:#6f7d93;font-size:10px}.sync-pill{border:0;background:#0c1424;color:#66758b;border-radius:4px;padding:6px 8px;font-size:8px;font-weight:700}
.grid-cards{gap:8px;margin-bottom:11px}.grid-cards.auto{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.card,.metric-card{background:var(--ref-panel);border:1px solid #111f35;border-radius:7px;box-shadow:none}
.card{padding:13px;margin-bottom:9px}.metric-card,.compact-metrics .metric-card{padding:11px 12px}.metric-card:after{left:12px;right:12px;height:1px;opacity:.55}
.metric-label{font-size:8px;color:#77849a;letter-spacing:.06em}.metric-value,.compact-metrics .metric-value{font-size:20px;margin:4px 0 1px;font-weight:750;letter-spacing:-.02em}.metric-note{font-size:8px;color:#596a82}
.card-title{margin-bottom:10px;font-size:9px;color:#b7c1d2;letter-spacing:.04em}.card-title span{font-size:8px;color:#5f6e85}
.two-col{gap:9px}.three-col{gap:8px}.section-title{margin:15px 0 8px;padding-left:8px;border-left:2px solid var(--ref-blue)}.section-title span{font-size:11px}.section-title small{font-size:9px;color:#65738b}
.toolbar{gap:7px;margin-bottom:8px}.search{height:34px;background:#0a1323;border:1px solid #14223a;border-radius:5px;color:#d7deea;font-size:11px}.search::placeholder{color:#58667d}.chip{padding:6px 8px;background:#0d1728;border:1px solid #17263e;border-radius:4px;color:#74829a;font-size:8px}
.empty{padding:24px;border:1px solid #17263e;background:var(--ref-panel);border-radius:7px;color:#76859c;font-size:11px}.empty strong{color:#bcc6d5;font-size:12px}
.async-strip{margin:8px 0;padding:8px 10px;border:1px solid #17263e;background:#0b1526;border-radius:5px}.async-strip strong{font-size:9px}.async-strip small{font-size:9px;color:#61718a}
.spinner{border-color:#17263d;border-top-color:var(--ref-blue)}.mini-spinner{border-color:#17263d;border-top-color:var(--ref-gold)}

/* Tables */
.table-wrap{border:0;background:var(--ref-panel);border-radius:7px;overflow:auto}
.data-table{border-collapse:separate;border-spacing:0}.data-table th{top:0;background:var(--ref-table-head);color:#8e99ad;font-size:9px;font-weight:650;text-transform:none;letter-spacing:.01em;padding:8px 10px;border:0;border-bottom:1px solid #172641}
.data-table td{font-size:10px;padding:10px;border:0;border-bottom:1px solid #111d31;color:#bdc6d4}.data-table tbody tr,.data-table tbody tr:nth-child(even){background:var(--ref-panel)}.data-table tbody tr:hover{background:#101b30}.data-table .strong{color:#eef1f6;font-weight:700}.data-table .good{color:var(--ref-green)}.data-table .gold{color:var(--ref-gold)}.data-table .bad{color:var(--ref-red)}
.profile-table th:first-child,.profile-table td:first-child{padding-left:11px}.profile-table th:last-child,.profile-table td:last-child{padding-right:11px}

/* Compact entity/player rows */
.player-list{border:0;border-radius:7px;background:var(--ref-panel);overflow:hidden}.player-list-head,.player-row{gap:9px}.player-list-head{padding:8px 10px;background:var(--ref-table-head);border:0;border-bottom:1px solid #172641;color:#8490a5;font-size:8px}.player-row,.player-row:nth-child(even){min-height:61px;padding:7px 10px;background:var(--ref-panel);border:0;border-bottom:1px solid #111e32}.player-row:hover{background:#101b30}.player-main{gap:7px}.player-face{width:42px;height:46px;border:0;border-radius:3px;background:#0a1220}.club-logo{width:20px;height:20px}.player-name strong{font-size:11px;color:#e3e7ee}.player-name small{font-size:9px;color:#6e7d93}.player-pos span{padding:4px 6px;background:#10203a;border:0;border-radius:4px;color:#9cb8db;font-size:9px}.player-pos small,.player-dev small,.player-money small,.player-season small{font-size:8px;color:#64738a}.player-dev b,.player-money b,.player-season b{font-size:10px}.ability-line{font-size:9px}.ability-bars{gap:2px}.ability-bars i{height:5px;background:#1a2940;border-radius:1px}.ability-bars i.on{background:var(--ref-gold);box-shadow:none}.ability-bars i.potential{background:#15233a;box-shadow:inset 0 0 0 1px #445066;opacity:1}
.rank-list{gap:2px}.rank-row,.ct-row,.power-row{border:0;border-bottom:1px solid #111e32;border-radius:0;background:var(--ref-panel);padding:8px}.rank-row:hover{background:#101b30}.rank-no{background:transparent;color:#56657c;font-size:9px}.rank-face{width:31px;height:34px;border:0;border-radius:3px}.rank-row strong{font-size:10px}.rank-row small{font-size:8px;color:#68778e}.rank-value{font-size:9px;color:var(--ref-gold)}

/* Player / entity profile: open header like reference screenshot */
.detail-body{padding-top:0}.player-profile-chrome{background:transparent}.profile-head,.player-profile-chrome .profile-head{position:relative;overflow:hidden;display:grid;grid-template-columns:145px minmax(260px,1fr) minmax(270px,auto);gap:18px;min-height:144px;margin:0 0 6px;padding:9px 18px 0;background:#070b17;border:0;border-radius:0;box-shadow:none;align-items:center}
.profile-head:after,.player-profile-chrome .profile-head:after{content:"";position:absolute;right:0;top:19px;width:39%;height:49px;border-radius:0 4px 4px 0;background:linear-gradient(90deg,transparent,#0b2b64 52%,#167cf3 100%);opacity:.95;z-index:0}
.profile-head>*{position:relative;z-index:1}.profile-photo{align-self:end;width:122px;height:132px;border:0;border-radius:0;background:transparent;object-fit:cover;object-position:top center;filter:drop-shadow(0 5px 8px #0008)}
.profile-name{font-size:31px;line-height:1.03;font-weight:760;letter-spacing:-.035em;color:#eef1f6;text-transform:uppercase}.profile-meta{margin-top:11px;color:#818da2;font-size:9px;line-height:1.55}
.profile-score,.ability-profile-score{min-width:0;padding:0;border:0;background:transparent;border-radius:0;text-align:left;display:grid;grid-template-columns:repeat(2,minmax(110px,1fr));gap:22px;align-items:center}
.ability-score-block{min-width:0}.ability-score-block span{display:block;margin-bottom:4px;color:#7e899e;font-size:9px;letter-spacing:0;text-transform:none}.ability-score-block b{display:block;color:var(--ref-gold);font-size:15px;line-height:1;letter-spacing:2px;white-space:nowrap}.ability-score-block small{display:block;margin-top:5px;color:#b5bdca;font-size:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ability-profile-score .ability-bars{grid-column:1/-1;margin-top:-4px;max-width:240px;min-width:0}.ability-profile-score .ability-bars i{height:4px}
.entity-profile-head,.wm-profile-head,.fixture-profile-head{padding:17px 19px;background:linear-gradient(90deg,#0b1424,#0c1729);border:0;border-radius:7px;margin-bottom:8px}.entity-profile-head h2,.wm-profile-head h2,.fixture-profile-head h2{font-size:24px;color:#eef1f6}.entity-profile-head p,.wm-profile-head p,.fixture-profile-head p{font-size:9px;color:#77859a}.entity-profile-head>div:last-child>span,.wm-profile-head>div>span,.fixture-profile-head>span{font-size:8px;color:var(--ref-gold)}.entity-logo{border:0;background:#0b1424;border-radius:3px}

/* Tabs */
.profile-tabs,.player-profile-chrome .desktop-parity-tabs,.parity-tabs,.wm-view-tabs{display:flex;gap:4px;flex-wrap:wrap;margin:0 0 9px;padding:0;background:transparent;border:0;border-radius:0;position:static!important}
.profile-tabs button,.player-profile-chrome .desktop-parity-tabs button,.parity-tabs button,.wm-view-tabs button{padding:5px 9px;border:0;border-radius:4px;background:#101a2e;color:#7e8ba2;font-size:9px;font-weight:650;letter-spacing:0}
.profile-tabs button:hover,.player-profile-chrome .desktop-parity-tabs button:hover,.parity-tabs button:hover,.wm-view-tabs button:hover{background:#14213a;color:#c5cedc}
.profile-tabs button.active,.player-profile-chrome .desktop-parity-tabs button.active,.parity-tabs button.active,.wm-view-tabs button.active{background:#121e35;color:var(--ref-gold);border:0;box-shadow:none}
.player-view-switch{margin-bottom:8px}.player-view-switch .parity-tabs{padding:0;border:0;background:transparent;box-shadow:none}.player-view-switch .parity-tabs button{min-width:98px}.player-view-switch .parity-tabs button.active{background:#121e35;color:var(--ref-gold);box-shadow:none}

/* Profile panels / facts */
.profile-panel{min-height:0}.profile-section{margin:0 0 8px}.profile-section-title{padding:8px 4px 6px;margin:0 0 6px;background:transparent;border:0;border-bottom:1px solid #15213a}.profile-section-title b{font-size:9px;color:#8a96aa;font-weight:600}.profile-section-title span{font-size:8px;color:#526178}
.fact-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.fact{padding:9px;background:var(--ref-panel);border:1px solid #111f35;border-radius:5px}.fact span{font-size:8px;color:#6d7a90}.fact b{margin-top:4px;font-size:11px;color:#e1e5ec}.fact small{margin-top:2px;font-size:8px;color:#58677e}
.profile-stat-groups{gap:6px}.profile-stat-groups>section,.attr-section{padding:10px;background:var(--ref-panel);border:1px solid #111f35;border-radius:6px}.profile-stat-groups h4,.attr-section h4{font-size:9px;color:#77849a}.attribute-sections{gap:7px}.attr-grid{gap:3px}.attr{padding:6px 7px;background:#0f1a2e;border:0;border-bottom:1px solid #17243b;border-radius:2px;font-size:9px}.attr span{color:#8390a5}.attr b{color:#d9dee7;font-size:10px}.attr.elite{background:#102a28}.attr.elite b{color:#6fdcb0}.attr.low b{color:#e47d8c}
.personality-grid{gap:5px}.personality-row{padding:8px;background:#0f1a2e;border:0;border-bottom:1px solid #17243b;font-size:9px}.personality-row>span{font-size:9px;color:#8a96aa}.personality-row>div{height:5px;border:0;background:#17253c}.personality-row i{background:linear-gradient(90deg,#1b5aa8,#1780ed)}.personality-row b{font-size:9px}
.position-rating-grid{gap:4px}.position-rating-grid>div{padding:7px;background:#0f1a2e;border:0;border-bottom:1px solid #17243b;border-radius:3px}.position-rating-grid span,.position-rating-grid b{font-size:9px}.position-rating-grid i{background:var(--ref-blue)}
.facility{padding:10px;background:#0f1a2e;border:1px solid #17243b}.facility span{font-size:8px}.facility b{font-size:18px}.facility>div{height:5px}
.moneyball-big{background:#0d1a2c;border:1px solid #172941;border-radius:6px}.moneyball-big .score{color:var(--ref-gold)}.meter{background:#15233b;border:0;height:6px}.meter i{background:linear-gradient(90deg,#1d62ba,#1780ed)}

/* Charts */
.modern-chart{min-height:220px}.modern-chart .chart-legend{gap:5px;margin-bottom:8px}.modern-chart .chart-legend button{padding:5px 7px;border:0;background:#0f1a2d;color:#7c8aa1;border-radius:4px;font-size:8px}.modern-chart .chart-legend strong{font-size:10px}.chart-readout{font-size:9px;border-top:1px solid #14223a;color:#718097}.profile-section>.card,.analyzer-player-charts .card{background:var(--ref-panel);border:1px solid #111f35;border-radius:7px}.profile-chart-grid .card:hover{transform:none;border-color:#1b2a45;box-shadow:none}
.leader-bar-row{padding:7px;border:0;border-bottom:1px solid #142139;border-radius:0;background:var(--ref-panel)}.leader-bar-row:hover{transform:none;background:#101b30}.leader-track{background:#17243a}.leader-track i{background:linear-gradient(90deg,#1a5eb7,#1780ed);box-shadow:none}.leader-bar-copy strong{font-size:9px}.leader-bar-copy small{font-size:8px}.leader-bar-row>b{font-size:9px}

/* Login keeps same visual language */
.login-shell{background:radial-gradient(circle at 65% 15%,#0c2450 0,#070b17 42%,#050812 100%)}.login-card{background:#0c1526;border:1px solid #182842;border-radius:8px;box-shadow:0 30px 90px #0008}.login-badge{background:#101b31;border:0;color:var(--ref-gold);border-radius:4px}.login-card .btn.primary{background:var(--ref-gold);border:0;color:#17120a;border-radius:6px}

@media(max-width:1200px){
  :root{--ref-sidebar-w:160px}.sidebar-club{padding-left:16px}.nav-item{font-size:10px}.save-picker{min-width:140px;max-width:180px}.profile-head,.player-profile-chrome .profile-head{grid-template-columns:115px minmax(220px,1fr) minmax(235px,auto)}.profile-photo{width:104px;height:119px}.profile-name{font-size:27px}.fact-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:900px){
  :root{--ref-sidebar-w:145px}.topbar{padding:0 9px}.sidebar{padding-left:7px;padding-right:7px}.sidebar-club{margin-left:-7px;margin-right:-7px;padding-left:13px}.nav-item{font-size:9px;padding:0 4px;gap:6px}.save-picker-label{font-size:0}.language-picker-label{font-size:0}.save-picker{min-width:110px;max-width:140px}.language-picker{min-width:84px;max-width:92px}.profile-head,.player-profile-chrome .profile-head{grid-template-columns:92px 1fr;min-height:132px}.profile-photo{width:82px;height:112px}.profile-score,.ability-profile-score{grid-column:1/-1;display:flex;gap:20px;padding:0 0 8px}.ability-profile-score .ability-bars{display:none}.fact-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  :root{--ref-sidebar-w:210px;--ref-top-h:58px}.topbar{left:0;padding:0 8px}.mobile-only{display:grid}.chrome-arrow{display:none}.chrome-date{display:none}.sidebar{width:var(--ref-sidebar-w);transform:translateX(-102%);transition:transform .18s ease;box-shadow:15px 0 40px #0009}.sidebar.open{transform:translateX(0)}.sidebar-club{height:105px}.content{margin-left:0;padding:calc(var(--ref-top-h) + 10px) 10px 25px}.save-picker-label{flex:1;min-width:0}.save-picker{width:100%;max-width:none;min-width:0}.language-picker-label{display:none!important}.ui-scale{display:none}.account .btn{min-width:72px;height:35px;font-size:9px}.page-title{font-size:20px}.grid-cards.auto,.grid-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.profile-head,.player-profile-chrome .profile-head{padding:7px 5px 0;grid-template-columns:82px 1fr;gap:10px}.profile-head:after,.player-profile-chrome .profile-head:after{top:13px;width:55%;height:39px}.profile-photo{width:74px;height:96px}.profile-name{font-size:22px}.profile-meta{font-size:8px;margin-top:5px}.profile-score,.ability-profile-score{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;padding:6px 3px 10px}.profile-tabs,.player-profile-chrome .desktop-parity-tabs,.parity-tabs{overflow-x:auto;flex-wrap:nowrap;padding-bottom:2px}.profile-tabs button,.player-profile-chrome .desktop-parity-tabs button,.parity-tabs button{flex:0 0 auto}.fact-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.card{padding:10px}.two-col,.three-col{grid-template-columns:1fr}.data-table td{font-size:9px;padding:9px 8px}.data-table th{font-size:8px;padding:7px 8px}
}
@media(max-width:430px){.grid-cards.auto,.grid-cards{grid-template-columns:1fr 1fr}.fact-grid{grid-template-columns:1fr 1fr}.account .btn{min-width:60px;padding:7px}.save-picker{font-size:9px}.player-profile-chrome .profile-head{grid-template-columns:72px 1fr}.profile-photo{width:66px;height:90px}.profile-name{font-size:19px}}
