/* Readable dashboard layout and independently scrollable admin navigation. */
.sa-shell{--sa-header-height:72px;--sa-sidebar-width:248px;--sa-line:#29798180;font-size:14px;background:radial-gradient(ellipse at 65% 0,#093c45,#042630 68%)}
.sa-shell .sa-topbar{height:var(--sa-header-height);padding:0 22px;gap:20px;border-bottom-color:#2a727b;background:#02242cf5}
.sa-shell .sa-brand{width:202px;height:61px;padding:0}
.sa-shell .sa-console-title{min-width:0;flex:0 0 232px;padding-left:20px;gap:13px}
.sa-shell .sa-console-title strong{font-size:19px}.sa-shell .sa-console-title small{font-size:13px;color:#a7c8cf}.sa-shell .sa-console-title>svg{width:32px;height:32px}
.sa-shell .sa-top-nav{justify-content:flex-start;gap:6px;min-width:0}
.sa-shell .sa-top-nav a{padding:9px 11px;font-size:12px;gap:8px}.sa-shell .sa-top-nav svg{width:21px;height:21px}
.sa-shell .sa-account{min-width:0;max-width:280px;flex-shrink:1}.sa-shell .sa-account summary{gap:10px}.sa-shell .sa-account summary>span:not(.sa-avatar){min-width:0}.sa-shell .sa-account summary strong{display:block;max-width:210px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px}.sa-shell .sa-account summary small{font-size:12px}.sa-shell .sa-account summary>svg{width:17px;height:17px}.sa-shell .sa-account .sa-avatar{width:43px;height:43px}.sa-shell .sa-account>div{top:58px}
.sa-shell .sa-bell{padding:6px}.sa-shell .sa-bell>svg{width:25px;height:25px}
.sa-shell .sa-workspace{grid-template-columns:var(--sa-sidebar-width) minmax(0,1fr)}
.sa-shell .sa-sidebar{display:flex;flex-direction:column;position:sticky;top:var(--sa-header-height);height:calc(100dvh - var(--sa-header-height));min-height:0;padding:14px 9px 0;overflow:hidden;border-right-color:#28747c;background:linear-gradient(160deg,#052e37,#02232c)}
.sa-shell .sa-sidebar nav{position:relative;flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;gap:3px;padding:2px 3px 14px 0;scrollbar-width:thin;scrollbar-color:#2f858b #062c35;overscroll-behavior:contain;scroll-padding-block:12px}
.sa-shell .sa-sidebar nav::-webkit-scrollbar{width:5px}.sa-shell .sa-sidebar nav::-webkit-scrollbar-thumb{background:#2f858b;border-radius:8px}
.sa-shell .sa-sidebar a{flex-shrink:0;justify-content:flex-start;min-height:43px;gap:12px;padding:10px 12px;font-size:13px;line-height:1.5;border-radius:10px}
.sa-shell .sa-sidebar a>svg:first-child{width:23px;height:23px}.sa-shell .sa-sidebar a>span{display:block;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sa-shell .sa-sidebar a:hover>span,.sa-shell .sa-sidebar a:focus-visible>span{position:static;display:block;padding:0;background:none;border:0;color:inherit}
.sa-shell .sa-sidebar-art{position:relative;display:block;flex:0 0 112px;height:112px;left:auto;right:auto;bottom:auto;margin:0 -9px;border-top:1px solid #38778233;background-image:linear-gradient(#03252d,transparent 38%),url('assets/admin-login-stadium.png');background-size:100% 100%,580px 326px;background-position:center,left bottom;opacity:.8}
.sa-shell .sa-main{padding:0 24px 26px}
.sa-shell .sa-hero{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:5px;height:auto;min-height:128px;padding:22px 0}
.sa-shell .sa-hero h1{font-size:32px;line-height:1.25;letter-spacing:-.8px}.sa-shell .sa-hero>p{font-size:14px;line-height:1.7;margin:0;max-width:920px}.sa-shell .sa-hero>span{font-size:9px;line-height:1.5;margin:3px 0 0;padding:2px 7px;letter-spacing:.7px}.sa-shell .sa-hero:after{height:100px;max-width:480px;opacity:.65}
.sa-shell .sa-kpis{grid-template-columns:repeat(6,minmax(0,1fr));gap:16px;margin-bottom:20px}
.sa-shell .sa-kpi{min-height:104px;gap:12px;padding:16px;align-items:center;flex-wrap:nowrap;border-color:#286d7580;background:linear-gradient(135deg,#0b454a,#052f39);border-radius:15px}
.sa-shell .sa-kpi-icon{width:48px;height:48px}.sa-shell .sa-kpi-icon svg{width:31px;height:31px}.sa-shell .sa-kpi>div>span{display:block;font-size:12px;line-height:1.5;white-space:normal;color:#c1d9df}.sa-shell .sa-kpi>div>strong{font-size:28px;line-height:1.3;margin-top:3px;letter-spacing:-.5px;white-space:normal;overflow-wrap:anywhere}.sa-shell .sa-kpi:nth-child(5)>div>strong{font-size:23px}.sa-shell .sa-health-kpi>div>strong{font-size:21px;gap:7px}.sa-shell .sa-health-kpi strong i{width:11px;height:11px}
.sa-shell .sa-panel{padding:18px;border-color:#2c7b8280;background:linear-gradient(135deg,#0d404d,#062e39);border-radius:15px}
.sa-shell .sa-panel-heading{align-items:center;flex-wrap:wrap;gap:12px;min-height:30px;margin-bottom:15px}.sa-shell .sa-panel-heading h2{font-size:20px;line-height:1.4;letter-spacing:-.4px}.sa-shell .sa-panel-heading>select{font-size:12px;padding:6px 10px;max-width:175px}
.sa-shell .sa-chart-grid{grid-template-columns:1.25fr 1fr 1fr;gap:18px;margin-bottom:20px}.sa-shell .sa-chart-grid>.sa-panel{height:auto;min-height:262px}.sa-shell .sa-growth-panel .sa-panel-heading{margin-bottom:7px}.sa-shell .sa-growth{width:100%;height:190px;display:block}.sa-shell .sa-growth text{font-size:15px;fill:#bdd7de}.sa-shell .sa-growth .sa-growth-value{font-size:18px;fill:#133b26}
.sa-shell .sa-composition{gap:17px;margin:8px 0 0;min-height:185px}.sa-shell .sa-donut{width:148px;height:148px;padding:21px}.sa-shell .sa-donut strong{font-size:27px}.sa-shell .sa-donut small{font-size:12px;color:#b4cfd6}.sa-shell .sa-composition ul{gap:9px}.sa-shell .sa-composition li{font-size:12px;gap:8px;padding-bottom:7px}.sa-shell .sa-composition li span{min-width:0;overflow:hidden;text-overflow:ellipsis}.sa-shell .sa-composition li strong{font-size:12px}.sa-shell .sa-composition li i{width:10px;height:10px}
.sa-shell .sa-usage-panel{display:flex;flex-direction:column}.sa-shell .sa-usage{flex:1;justify-content:center;gap:16px;margin:4px 0 8px}.sa-shell .sa-usage>div{font-size:12px;gap:12px;padding-bottom:10px}.sa-shell .sa-usage>div>span{width:90px}.sa-shell .sa-usage strong{font-size:13px;width:34px}
.sa-shell .sa-dashboard-bottom{grid-template-columns:minmax(0,1.85fr) minmax(340px,1fr);gap:20px;align-items:stretch}.sa-shell .sa-dashboard-bottom>aside{gap:20px}.sa-shell .sa-users-panel{padding:18px;min-height:0}.sa-shell .sa-users-panel .sa-panel-heading{margin:0 0 16px;gap:14px}.sa-shell .sa-users-panel .sa-panel-heading h2{font-size:20px}
.sa-shell .sa-button{min-height:36px;padding:7px 12px;font-size:12px;gap:7px}.sa-shell .sa-button.small{min-height:31px;padding:5px 9px;font-size:11px}.sa-shell .sa-button-row{gap:9px}.sa-shell .sa-button svg{width:17px;height:17px}
.sa-shell .sa-user-tools{flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:14px}.sa-shell .sa-user-tabs{gap:18px;min-height:34px;max-width:100%}.sa-shell .sa-user-tabs button{font-size:12px;min-height:34px}.sa-shell .sa-user-search{min-height:37px;padding:7px 10px;min-width:200px;max-width:250px}.sa-shell .sa-user-search input{font-size:12px}
.sa-shell .sa-user-table{min-width:900px}.sa-shell .sa-user-table th,.sa-shell .sa-data-table th{font-size:12px;padding:11px 12px;line-height:1.5}.sa-shell .sa-user-table td,.sa-shell .sa-users-full .sa-user-table td{font-size:12px;padding:10px 12px;height:58px;line-height:1.5}.sa-shell .sa-user-cell strong{font-size:13px;max-width:220px;overflow:hidden;text-overflow:ellipsis}.sa-shell .sa-user-cell small{font-size:11px;line-height:1.5;margin-top:2px}.sa-shell .sa-avatar.small{width:34px;height:34px;font-size:10px}.sa-shell .sa-user-table .sa-user-cell{gap:10px}.sa-shell .sa-badge{font-size:11px;padding:4px 8px}.sa-shell .sa-badge.status{font-size:11px;padding:2px 0}.sa-shell .sa-icon-button{width:31px;height:31px}.sa-shell .sa-icon-button svg{width:18px;height:18px}.sa-shell .sa-row-actions{gap:7px}.sa-shell .sa-badge.outline{font-size:10px}.sa-shell .sa-data-table td{font-size:12px;line-height:1.6;padding:11px 12px}
.sa-shell .sa-pagination{padding:16px 0 0;gap:16px;flex-wrap:wrap;font-size:12px}.sa-shell .sa-pagination label{font-size:12px}.sa-shell .sa-pagination select{font-size:12px;padding:6px 8px}.sa-shell .sa-pagination>div{gap:9px}
.sa-shell .sa-shortcuts-panel,.sa-shell .sa-audit-panel{height:auto;min-height:0;padding:18px}.sa-shell .sa-setting-tiles{gap:9px}.sa-shell .sa-setting-tiles a{min-height:78px;font-size:11px;line-height:1.5;padding:10px 7px;gap:8px}.sa-shell .sa-setting-tiles svg{width:25px;height:25px}
.sa-shell .sa-audit-list button{display:grid;grid-template-columns:20px minmax(0,1fr);gap:3px 10px;padding:11px 0;font-size:12px}.sa-shell .sa-audit-list svg{grid-row:span 2;align-self:center;width:20px;height:20px}.sa-shell .sa-audit-list time{grid-column:2;font-size:11px;line-height:1.5;color:#9fbfc8}.sa-shell .sa-audit-list button>span{grid-column:2;white-space:normal;line-height:1.55;overflow-wrap:anywhere}.sa-shell .sa-text-link{font-size:12px}.sa-shell .sa-demo-footer{font-size:10px;line-height:1.8;margin-top:22px;color:#88b0ba}
.sa-shell .sa-page-heading{padding:24px 0;gap:18px}.sa-shell .sa-page-heading h1{font-size:30px;line-height:1.3}.sa-shell .sa-page-heading>div>span{font-size:13px;line-height:1.8}.sa-shell .sa-page-heading p{font-size:10px}.sa-shell .ad-table,.sa-shell .sms-table{font-size:13px}.sa-shell .ad-table td{padding:13px 12px}.sa-shell .ad-table th{font-size:12px}.sa-shell .ad-note{font-size:12px;line-height:1.8}
@media(max-height:760px) and (min-width:1101px){.sa-shell .sa-sidebar-art{display:none}}
@media(max-width:1740px){.sa-shell .sa-top-nav a:nth-child(n+3){display:none}.sa-shell .sa-dashboard-bottom{grid-template-columns:1fr}.sa-shell .sa-dashboard-bottom>aside{display:grid;grid-template-columns:1fr 1fr;align-items:start}.sa-shell .sa-account{max-width:245px}.sa-shell .sa-account summary strong{max-width:175px}}
@media(max-width:1600px){.sa-shell{--sa-sidebar-width:232px}.sa-shell .sa-top-nav a:nth-child(n+3){display:none}.sa-shell .sa-console-title{flex-basis:218px}.sa-shell .sa-brand{width:184px}.sa-shell .sa-topbar{gap:17px}.sa-shell .sa-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}.sa-shell .sa-kpi{min-height:94px}.sa-shell .sa-chart-grid{grid-template-columns:1.15fr 1fr}.sa-shell .sa-usage-panel{grid-column:1/-1;min-height:0!important}.sa-shell .sa-usage{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;padding:7px 0}.sa-shell .sa-usage>div{margin:0;gap:10px}.sa-shell .sa-usage>div>span{width:auto;min-width:55px}.sa-shell .sa-main{padding-left:20px;padding-right:20px}.sa-shell .sa-donut{width:145px;height:145px}}
@media(max-width:1250px){.sa-shell .sa-top-nav{display:none}.sa-shell .sa-console-title{flex:0 1 auto}.sa-shell .sa-bell{margin-left:auto}.sa-shell .sa-setting-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:1100px){.sa-shell .sa-workspace{display:block}.sa-shell .sa-sidebar{display:none}.sa-shell{padding-bottom:80px}.sa-shell .sa-account summary>span:not(.sa-avatar),.sa-shell .sa-account summary>svg{display:none}.sa-shell .sa-main{padding:0 22px 24px}.sa-shell .sa-hero h1{font-size:29px}.sa-shell .sa-hero>p{font-size:13px}.sa-shell .sa-mobile-menu{display:block;position:fixed;bottom:14px;right:20px;left:auto;width:190px;z-index:45;padding:0;border:1px solid #32858e;border-radius:13px;background:#04313df5;box-shadow:0 7px 28px #00182177}.sa-shell .sa-mobile-menu>summary{display:flex;align-items:center;justify-content:center;gap:10px;list-style:none;padding:13px 16px;color:#b9f34c;font-size:13px;font-weight:700;cursor:pointer}.sa-shell .sa-mobile-menu>summary:after{display:none}.sa-shell .sa-mobile-menu>nav{position:absolute;bottom:58px;right:0;left:auto;width:min(580px,calc(100vw - 40px));max-height:65dvh;overflow-y:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;padding:12px;border:1px solid #32858e;border-radius:15px;background:#04313dfc;box-shadow:0 -10px 35px #001b2680}.sa-shell .sa-mobile-menu>nav a{display:flex;align-items:center;gap:10px;min-width:0;padding:11px 12px;border-radius:8px;font-size:12px;line-height:1.6;color:#e5f4f5}.sa-shell .sa-mobile-menu>nav a.active{background:#b9f34c;color:#173424}.sa-shell .sa-mobile-menu>nav svg{width:21px;height:21px}}
@media(max-width:760px){.sa-shell{--sa-header-height:64px;padding-bottom:74px}.sa-shell .sa-topbar{gap:12px;padding:0 16px}.sa-shell .sa-brand{width:145px;height:54px}.sa-shell .sa-console-title{border:0;padding:0;gap:0}.sa-shell .sa-console-title>span{display:none}.sa-shell .sa-console-title>svg{width:25px;height:25px}.sa-shell .sa-account .sa-avatar{width:35px;height:35px}.sa-shell .sa-account>div{top:46px}.sa-shell .sa-bell>svg{width:23px;height:23px}.sa-shell .sa-main{padding:12px 16px 24px}.sa-shell .sa-hero{min-height:0;padding:10px 0 21px;gap:7px}.sa-shell .sa-hero h1{font-size:25px;line-height:1.35}.sa-shell .sa-hero>p{font-size:12px;max-width:100%}.sa-shell .sa-hero:after{opacity:.17}.sa-shell .sa-hero>span{font-size:8px}.sa-shell .sa-kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:16px}.sa-shell .sa-kpi{padding:13px 11px;min-height:94px;gap:9px;align-items:center}.sa-shell .sa-kpi-icon{width:35px;height:35px}.sa-shell .sa-kpi-icon svg{width:24px;height:24px}.sa-shell .sa-kpi>div>span{font-size:11px}.sa-shell .sa-kpi>div>strong{font-size:24px}.sa-shell .sa-kpi:nth-child(5)>div>strong{font-size:20px}.sa-shell .sa-health-kpi>div>strong{font-size:18px}.sa-shell .sa-chart-grid{grid-template-columns:1fr;gap:16px}.sa-shell .sa-chart-grid>.sa-panel{min-height:0;padding:17px}.sa-shell .sa-growth-panel{min-height:240px!important}.sa-shell .sa-growth{height:auto;aspect-ratio:auto;margin-top:14px}.sa-shell .sa-growth text{font-size:17px}.sa-shell .sa-panel-heading h2,.sa-shell .sa-users-panel .sa-panel-heading h2{font-size:19px}.sa-shell .sa-panel-heading{gap:12px;margin-bottom:14px}.sa-shell .sa-panel-heading>select{font-size:11px;max-width:160px}.sa-shell .sa-composition{gap:20px;min-height:180px}.sa-shell .sa-donut{width:145px;height:145px}.sa-shell .sa-composition li{font-size:11px}.sa-shell .sa-usage{display:flex;padding:4px 0;gap:14px}.sa-shell .sa-usage>div>span{width:110px}.sa-shell .sa-dashboard-bottom{gap:16px}.sa-shell .sa-dashboard-bottom>aside{grid-template-columns:1fr;gap:16px}.sa-shell .sa-users-panel{padding:17px}.sa-shell .sa-users-panel .sa-panel-heading{display:flex}.sa-shell .sa-users-panel .sa-panel-heading h2{margin-bottom:0}.sa-shell .sa-users-panel .sa-button{font-size:11px;min-height:35px;padding:7px 10px}.sa-shell .sa-user-tools{align-items:stretch;gap:12px}.sa-shell .sa-user-tabs{gap:17px}.sa-shell .sa-user-tabs button{font-size:12px}.sa-shell .sa-user-search{min-width:0;max-width:none;width:100%;min-height:42px}.sa-shell .sa-user-search input{font-size:14px}.sa-shell .sa-pagination{font-size:11px;gap:13px}.sa-shell .sa-shortcuts-panel,.sa-shell .sa-audit-panel{padding:17px}.sa-shell .sa-setting-tiles{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.sa-shell .sa-setting-tiles a{font-size:10px;min-height:82px;padding:9px 4px}.sa-shell .sa-setting-tiles svg{width:24px;height:24px}.sa-shell .sa-page-heading h1{font-size:26px}.sa-shell .sa-page-heading>div>span{font-size:12px}.sa-shell .sa-demo-footer{font-size:10px}.sa-shell .sa-mobile-menu{bottom:0;left:0;right:0;width:auto;border-radius:0;border-left:0;border-right:0;border-bottom:0}.sa-shell .sa-mobile-menu>summary{padding:14px 16px max(14px,env(safe-area-inset-bottom))}.sa-shell .sa-mobile-menu>nav{bottom:60px;left:12px;right:12px;width:auto;max-height:68dvh}}
@media(max-width:420px){.sa-shell .sa-setting-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}.sa-shell .sa-composition{gap:13px}.sa-shell .sa-donut{width:122px;height:122px;padding:18px}.sa-shell .sa-donut strong{font-size:24px}.sa-shell .sa-composition li{font-size:10px}.sa-shell .sa-composition li strong{font-size:11px}.sa-shell .sa-mobile-menu>nav{grid-template-columns:1fr}.sa-shell .sa-brand{width:132px}.sa-shell .sa-topbar{gap:10px;padding-left:12px;padding-right:12px}}