/* FC27 · Stile C (Clean). Layout, dati e componenti originali restano invariati. */
:root {
  --navy:#12366d; --navy2:#1d4c90; --blue:#1369de; --yellow:#f8cf49;
  --ink:#152e52; --muted:#7185a3; --line:#dce8f6; --bg:#f3f8ff;
  --surface:#fff; --green:#18a77e; --red:#df6473; --radius:19px;
  --shadow:0 8px 27px rgba(30,83,145,.075);
  color-scheme:light;
}
html {scroll-behavior:smooth}
body {background:radial-gradient(ellipse 45% 28% at 96% 0%,#dcecff 0%,transparent 100%),var(--bg)}
.app.loading {background:#edf6ff}
.startup{color:#124f9c}
.startup span{color:#0b72dc}
.shell{background:transparent}
.sidebar {
 background:linear-gradient(180deg,#fff 0%,#f6faff 62%,#eaf4ff 100%);
 color:var(--ink);border-right:1px solid #dbe8f7;
 padding:26px 16px 19px;box-shadow:6px 0 25px rgba(21,84,160,.035)
}
.brand{color:#143566;padding:5px 9px 30px;gap:12px}
.brand-icon{
 background:linear-gradient(152deg,#1c7aec,#004fad);border:1px solid #74b3ff;
 box-shadow:0 6px 15px #1674d326;color:#fff;border-radius:13px;
 font-size:16px;letter-spacing:-1.7px
}
.brand b{font-size:20px;font-weight:900;letter-spacing:-1px}
.brand span{color:#257be9}
.brand small{color:#7296c7;font-size:9px;letter-spacing:1.5px}
.sidebar-label {color:#8ca2bd;letter-spacing:2px;font-size:9.5px;padding:6px 13px 12px}
.nav{gap:5px}
.nav button{color:#526b8f;border:1px solid transparent;font-weight:720;border-radius:11px;padding:13px 14px;font-size:12.5px}
.nav button svg{color:#6793c3;opacity:1}
.nav button:hover{background:#e9f3ff;color:#0a5abb;border-color:#d6e8ff}
.nav button.active{background:#176fe1;color:#fff;box-shadow:0 5px 14px #176fe12b;border-color:#176fe1}
.nav button.active svg{color:white}
.sidebar-foot{background:#eff7ff;border:1px solid #cfe3fa;border-radius:17px;padding:17px}
.sidebar-foot .mono{color:#2979d5}
.sidebar-foot h4{color:#153966}
.sidebar-foot p{color:#718cad}
.side-year{color:#91a8c4}
.main{padding-top:25px}
.topbar{border:1px solid #e0eaf7;background:rgba(255,255,255,.86);border-radius:15px;padding:10px 14px;margin-bottom:21px;box-shadow:0 6px 20px #2a69b30a;backdrop-filter:blur(8px)}
.breadcrumb{color:#8095b0}
.breadcrumb b{color:#18569e}
.season-select{border-color:#dbe8f8;box-shadow:0 3px 13px #287ad60b;color:#204a7b;background-color:#f8fbff;font-size:12px}
.user-circle{background:#e9f4ff;border:1px solid #c4ddfa;color:#1269c6}
.btn{border-radius:10px;transition:transform .18s,box-shadow .18s,background .18s}
.btn-primary{background:#1671e4;color:#fff;box-shadow:0 5px 12px rgba(24,109,219,.14)}
.btn-primary:hover{background:#0c5fc6;box-shadow:0 8px 15px rgba(24,109,219,.17)}
.btn-dark{background:#174d91;color:#fff}
.btn-dark:hover{background:#0c3974}
.btn-soft{background:#e9f3ff;color:#1265c5}
.btn-soft:hover{background:#dcecff}
.btn-white{background:#fff;color:#1757a4;border:1px solid #cbdff7}
.btn-white:hover{background:#f2f8ff}
.page-title h1{color:#15396c;font-weight:880;letter-spacing:-.9px}
.page-title p{color:#7088a7}
.eyebrow{color:#7b9abc}
/* Light stadium cover, deliberately lighter than the old navy hero. */
.hero{
 color:#183e72;min-height:242px;padding:29px 33px;border-radius:20px;
 border:1px solid #bed8f5;
 background:
   linear-gradient(90deg,rgba(255,255,255,.94) 0%,rgba(245,250,255,.94) 34%,rgba(222,240,255,.78) 66%,rgba(213,233,255,.75) 100%),
   url('./assets/stadium-clean.svg') right 15%/auto 118% no-repeat,
   linear-gradient(125deg,#fff,#c8e5ff);
 box-shadow:0 11px 28px rgba(53,121,200,.095);
}
.hero:before{content:"";border:0;border-radius:0;box-shadow:none;top:auto;left:auto;bottom:0;right:0;width:52%;height:60%;background:linear-gradient(180deg,transparent 0%,#bbdfff28 100%);pointer-events:none}
.hero:after{content:"";background:url('./assets/stadium-clean.svg') center/contain no-repeat;right:5%;top:7%;bottom:auto;width:50%;height:90%;opacity:.85;font-size:0;pointer-events:none}
.hero-copy{max-width:690px;z-index:1;padding-right:12px}
.hero-kicker{color:#247ac9;letter-spacing:1.65px;font-weight:850;font-size:10px}
.hero-kicker i{background:#2278db;box-shadow:0 0 0 4px #217ada19}
.hero h2{color:#133b75;letter-spacing:-1.2px;font-weight:950;margin:14px 0 9px;line-height:1.15;font-size:clamp(28px,2.9vw,41px)}
.hero h2 span{color:#1371db}
.hero h2 .team-name{color:#0d3167}
.hero p{color:#54779e;font-size:12px;line-height:1.75;max-width:510px}
.hero-actions{margin-top:23px;gap:9px}
.hero-stat{background:rgba(255,255,255,.86);color:#17477f;border:1px solid #bcd8fa;box-shadow:0 5px 18px #3c90d318;border-radius:13px;backdrop-filter:blur(8px);top:25px;right:26px}
.hero-stat strong{font-weight:900;color:#155fba}
.hero-stat span{color:#6c91b5}
.kpi-grid{gap:15px}
.kpi,.panel,.season-card{background:rgba(255,255,255,.99);border:1px solid #dfeaf8;box-shadow:var(--shadow)}
.kpi{border-radius:17px;padding:19px 19px 17px}
.kpi::before{content:"";position:absolute;left:0;top:0;height:4px;width:100%;background:linear-gradient(90deg,#2782e3,#d3e9ff)}
.kpi:nth-child(2)::before{background:linear-gradient(90deg,#7caef7,#e2f0ff)}
.kpi:nth-child(3)::before{background:linear-gradient(90deg,#36b99e,#e1f8f2)}
.kpi:nth-child(4)::before{background:linear-gradient(90deg,#6685cf,#e4eafa)}
.kpi label{color:#7085a4;font-size:11px}
.kpi strong{color:#153d78;font-size:29px}
.kpi footer{color:#8ca0b7}
.kpi .icon-box{background:#e9f4ff;color:#227ce0}
.kpi:nth-child(2) .icon-box{background:#edf4ff;color:#4d8ee0}
.kpi:nth-child(3) .icon-box{background:#eaf9f3;color:#169f79}
.kpi:nth-child(4) .icon-box{background:#edf2ff;color:#587bc1}
.panel{border-radius:18px;padding:22px 23px}
.panel-head h3{color:#153b74;font-weight:850}
.panel-head p{color:#849ab3}
.ghost-link{color:#126bd0}
.progress-bg,.bar-track{background:#eaf2ff}
.progress-bar,.bar-fill{background:linear-gradient(90deg,#1a75e2,#76b5ff)}
.chart-labels{color:#8ba2bd}
.donut-hole{background:white}
.legend-dot{background:#1875e5}
.tabs{background:#e8f2ff;border:1px solid #d8e8fb}
.tab{color:#6285b0}
.tab.active{color:#1565bc;background:white;box-shadow:0 2px 6px #2077cd16}
.search{border-color:#d9e6f5;background:white}
.search:focus{border-color:#6dacfa}
.table-wrap{border-color:#e2ecf8}
thead{background:#f2f8ff}
th{color:#7492b2}
td{color:#476489;border-color:#e9f1fa}
td b{color:#163d74}
tbody tr:hover{background:#f4f9ff}
.action-tiny{background:#eaf4ff;color:#1a6bc1}
.pill{background:#edf5ff;color:#4d78a4}
.pill.copa{background:#dff0ff;color:#1261bb}
.season-card{border-radius:18px}
.season-card.current{border:1px solid #82baf8;box-shadow:0 7px 27px #1c80e91c}
.season-card .year{color:#16447f}
.season-card .nums>div{background:#f0f7ff}
.season-card .nums small{color:#7b94b0}
.hint{background:#f5fbff;border-color:#dbeafb;color:#5e7b9e}
.notice{background:#edf6ff;border:1px solid #cce5ff;color:#446990}
.notice svg{color:#1266cc}
.settings-row{border-color:#e4edf9}
/* Dialogs, fields and app feedback */
#app-modal{border:1px solid #d5e7f9;box-shadow:0 26px 90px #14457728;border-radius:21px}
.modal-head{background:#f2f8ff;color:#183d72}
.field input,.field select,.field textarea{border-color:#d4e2f3;background:#fff;color:#27456b}
.field input:focus,.field select:focus,.field textarea:focus{border-color:#5aa4f5;box-shadow:0 0 0 3px #1680ec16}
.toast{background:#124b8e;color:#fff}
/* Dense but accessible, no sideways layout overflow on phones. */
@media (min-width:1450px){.hero{min-height:260px}.sidebar{border-right:1px solid #dbe8f7}}
@media (max-width:1150px){.hero-stat{display:none}.hero:after{opacity:.5}}
@media (max-width:760px){
 body{background:#f4f9ff}
 .sidebar{box-shadow:25px 0 75px #1d5da12a;border-right:1px solid #d0e5fd;background:linear-gradient(180deg,#fff,#edf6ff)}
 .main{padding:14px 13px calc(93px + env(safe-area-inset-bottom))}
 .topbar{padding:9px 10px;margin-bottom:14px;border-radius:12px;gap:7px}
 .menu-toggle{color:#185ca8;border-color:#dbeafa;background:#eff7ff}
 .breadcrumb{font-size:10px;white-space:nowrap}
 .top-actions{gap:6px}
 .season-select{background-color:#f7fbff;border-color:#deebfa;min-width:100px;max-width:115px;font-size:11px;padding:9px 25px 9px 10px}
 .hero{border-radius:16px;min-height:248px;padding:21px 20px;background:linear-gradient(104deg,rgba(255,255,255,.97),rgba(227,242,255,.89)),url('./assets/stadium-clean.svg') right bottom/auto 100% no-repeat}
 .hero:after{opacity:.24;right:-24%;width:110%;height:80%;top:12%}
 .hero-copy{max-width:100%;padding-right:0}
 .hero-kicker{font-size:9px;letter-spacing:1.15px}
 .hero h2{font-size:clamp(27px,8vw,35px);margin:12px 0 9px}
 .hero p{font-size:11px;max-width:320px;color:#5e789c}
 .hero-actions{margin-top:17px}
 .hero-actions .btn{font-size:11px;padding:11px 12px}
 .page-title{align-items:flex-start;gap:10px}
 .page-title h1{font-size:24px}
 .page-title p{font-size:11px}
 .kpi-grid{gap:10px;margin-bottom:16px}
 .kpi{padding:14px 13px;border-radius:14px}
 .kpi label{font-size:10px}
 .kpi strong{font-size:25px}
 .kpi footer{font-size:9px}
 .panel{padding:18px 16px;border-radius:14px}
 .dashboard-grid{gap:13px}
 .form-stats{gap:4px}
 .mobile-bottom{border-color:#dbeafd;background:rgba(255,255,255,.98);box-shadow:0 -6px 18px #2a78b41b}
 .mobile-bottom button{font-size:9.5px;color:#7895b7;padding:8px 2px}
 .mobile-bottom button.active{color:#0f71d7}
 .mobile-bottom button.active svg{background:#e9f4ff;border-radius:9px;padding:3px;box-sizing:content-box;margin:-3px}
}
@media(max-width:370px){.hero h2{font-size:26px}.hero-actions .btn{padding:10px 9px;font-size:10px}}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
