/* SmartPay Intelligence — Executive SaaS System v5
   Visual direction: Stripe / Linear / modern enterprise management software
   Purpose: unify Dashboard, Decision Center, Planning, Actions and AI into one premium product shell. */
:root{
  --sp-bg:#050d17;
  --sp-bg-soft:#07131f;
  --sp-surface:#0a1826;
  --sp-surface-2:#0d1d2d;
  --sp-surface-3:#102235;
  --sp-card:rgba(12,29,45,.92);
  --sp-line:rgba(128,164,193,.16);
  --sp-line-strong:rgba(128,176,211,.28);
  --sp-text:#f7fbff;
  --sp-text-2:#c8d7e4;
  --sp-muted:#8ca3b7;
  --sp-muted-2:#688196;
  --sp-accent:#22d9c7;
  --sp-accent-2:#65a8ff;
  --sp-green:#4bd99c;
  --sp-yellow:#ffc766;
  --sp-red:#ff7782;
  --sp-purple:#a38cff;
  --sp-radius:18px;
  --sp-radius-sm:12px;
  --sp-shadow:0 24px 64px rgba(0,0,0,.22);
  --sp-shadow-soft:0 10px 34px rgba(0,0,0,.14);
}

*{box-sizing:border-box}
html,body{background:radial-gradient(circle at 82% -8%,rgba(51,116,168,.18),transparent 32%),radial-gradient(circle at 18% 18%,rgba(34,217,199,.055),transparent 24%),linear-gradient(180deg,#050d17,#07131f 46%,#050f1b)!important;color:var(--sp-text)!important}
body{font-size:15px!important;letter-spacing:-.008em!important;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
button,input,select,textarea{font-family:inherit}

/* ===== Product shell ===== */
.shell{grid-template-columns:272px minmax(0,1fr)!important;background:transparent!important}
.main{min-width:0!important;background:transparent!important}
.sidebar{width:272px!important;padding:18px 14px 20px!important;background:linear-gradient(180deg,rgba(6,17,28,.985),rgba(7,20,32,.985))!important;border-right:1px solid var(--sp-line)!important;box-shadow:18px 0 55px rgba(0,0,0,.13)!important}
.sidebar .brand{min-height:58px!important;padding:2px 6px 14px!important;border-bottom:1px solid rgba(124,160,190,.10)!important;margin-bottom:8px!important}
.sidebar .smartpay-full-logo{height:37px!important;max-width:175px!important}
.client-side{font-size:11px!important;color:var(--sp-muted-2)!important;margin:10px 8px 13px!important;line-height:1.45!important}
.nav-group-title,.sp-final-nav-head{font-size:10px!important;letter-spacing:.115em!important;color:#5f7990!important;font-weight:800!important;text-transform:uppercase!important}
.sp-final-nav-head{width:100%!important;display:flex!important;align-items:center!important;justify-content:space-between!important;padding:10px 10px 6px!important;background:transparent!important;border:0!important;cursor:pointer!important}
.sp-final-nav-head i{font-style:normal!important;color:#526a7f!important;font-size:13px!important;transition:transform .18s ease!important}
.sp-final-nav-section.collapsed .sp-final-nav-head i{transform:rotate(-90deg)!important}
.sp-final-nav-section.collapsed .sp-final-nav-body{display:none!important}
.sp-final-nav-body{display:grid!important;gap:2px!important}
.nav-btn{position:relative!important;width:100%!important;min-height:44px!important;padding:10px 11px!important;margin:0!important;border:1px solid transparent!important;border-radius:11px!important;background:transparent!important;color:#8ea5b8!important;font-size:13px!important;font-weight:590!important;transition:background .16s ease,border-color .16s ease,color .16s ease,transform .16s ease!important}
.nav-btn:hover{background:rgba(17,42,62,.72)!important;color:#edf6fd!important;transform:translateX(1px)!important}
.nav-btn.active{background:linear-gradient(90deg,rgba(29,75,84,.52),rgba(21,42,68,.74))!important;color:#fff!important;border-color:rgba(45,194,187,.18)!important;box-shadow:inset 3px 0 0 var(--sp-accent)!important}
.nav-btn.active .nav-icon{color:#5ee6d8!important}
.nav-icon{width:24px!important;font-size:15px!important;color:#66869c!important}
.side-bottom{border-top:1px solid var(--sp-line)!important;margin-top:16px!important;padding-top:14px!important}

.topbar{height:72px!important;padding:0 24px!important;background:rgba(5,16,27,.80)!important;border-bottom:1px solid var(--sp-line)!important;backdrop-filter:blur(20px)!important;-webkit-backdrop-filter:blur(20px)!important;box-shadow:0 1px 0 rgba(255,255,255,.01)!important}
.top-left,.top-actions{gap:9px!important}
.pill{min-height:40px!important;border:1px solid var(--sp-line)!important;background:rgba(12,29,45,.72)!important;color:var(--sp-text-2)!important;border-radius:10px!important;padding:8px 11px!important;font-size:11px!important}
.search{min-width:300px!important}
.search input{min-height:42px!important;border-radius:11px!important;background:rgba(9,24,38,.84)!important;border:1px solid var(--sp-line)!important;color:#eaf4fb!important;font-size:12px!important;padding:10px 13px!important}
.avatar.smartpay-avatar,.avatar{border:1px solid var(--sp-line-strong)!important;background:linear-gradient(145deg,#10283d,#0d2133)!important;box-shadow:0 8px 22px rgba(0,0,0,.16)!important}

/* ===== Main workspace ===== */
.page{padding:28px 30px 42px!important;max-width:1760px!important;margin:0 auto!important}
.page-head{display:flex!important;align-items:flex-end!important;justify-content:space-between!important;gap:20px!important;margin:0 0 20px!important;padding:2px 1px!important}
.page-head h1{margin:0 0 6px!important;font-size:31px!important;line-height:1.08!important;letter-spacing:-1px!important;font-weight:760!important;color:#f8fcff!important}
.page-head p{margin:0!important;font-size:12px!important;line-height:1.55!important;color:var(--sp-muted)!important;max-width:720px!important}
.data-badge{display:inline-flex!important;align-items:center!important;min-height:30px!important;padding:7px 10px!important;border:1px solid rgba(51,198,189,.19)!important;background:rgba(19,63,68,.34)!important;color:#64dfd4!important;border-radius:999px!important;font-size:9px!important;font-weight:750!important;letter-spacing:.03em!important}

.grid{gap:12px!important}
.card{position:relative!important;padding:18px!important;border:1px solid var(--sp-line)!important;border-radius:var(--sp-radius)!important;background:linear-gradient(180deg,rgba(13,31,48,.93),rgba(9,24,38,.96))!important;box-shadow:var(--sp-shadow-soft)!important;overflow:hidden!important;transition:border-color .16s ease,transform .16s ease,box-shadow .16s ease!important}
.card:before{content:"";position:absolute;inset:0 0 auto 0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.035),transparent);pointer-events:none}
.card:hover{border-color:rgba(124,171,205,.23)!important;box-shadow:0 16px 44px rgba(0,0,0,.16)!important}
.card h2,.card h3,.card h4{color:#f4f9fd!important;letter-spacing:-.025em!important}
.card h2{font-size:20px!important}.card h3{font-size:16px!important}.card h4{font-size:13px!important}
.muted{color:var(--sp-muted)!important}

/* KPI language = executive snapshot */
.kpi{min-height:122px!important;padding:17px 18px!important;background:linear-gradient(165deg,rgba(13,32,50,.98),rgba(8,22,36,.98))!important}
.kpi:after{width:140px!important;height:140px!important;right:-64px!important;top:-72px!important;background:radial-gradient(circle,rgba(34,217,199,.09),transparent 67%)!important}
.klabel{font-size:9px!important;color:#7892a6!important;text-transform:uppercase!important;letter-spacing:.085em!important;font-weight:780!important}
.kvalue{font-size:27px!important;line-height:1!important;font-weight:770!important;letter-spacing:-1px!important;margin:9px 0 7px!important;color:#fff!important}
.ksub{font-size:10px!important;line-height:1.45!important;color:#7e98ac!important}

/* Charts & analytics */
.chart-title{margin-bottom:14px!important}
.chart-title h2,.chart-title h3{font-size:15px!important;font-weight:700!important}
.legend-note{font-size:9px!important;color:#728ca1!important}
.chart-box{height:280px!important}.chart-box.sm{height:218px!important}
canvas{filter:saturate(.92) contrast(1.02)}

/* Tables: enterprise-grade density */
.table-wrap{border:1px solid var(--sp-line)!important;border-radius:13px!important;background:rgba(6,19,31,.54)!important;overflow:auto!important}
table{border-collapse:separate!important;border-spacing:0!important}
th,td{font-size:10.5px!important;padding:11px 12px!important;border-bottom:1px solid rgba(121,158,188,.10)!important}
th{background:rgba(15,35,53,.96)!important;color:#9fb4c5!important;font-size:9px!important;text-transform:uppercase!important;letter-spacing:.06em!important;font-weight:760!important}
td{color:#c9d7e2!important}
tr:hover td{background:rgba(19,46,68,.30)!important}
.badge{font-size:8.5px!important;padding:5px 8px!important;border-radius:999px!important;font-weight:750!important}

/* Buttons and controls */
.primary,.action-btn,.ghost,.subtab{min-height:40px!important;border-radius:10px!important;font-size:11px!important;font-weight:700!important;transition:transform .16s ease,filter .16s ease,border-color .16s ease,background .16s ease!important}
.primary,.action-btn{background:linear-gradient(90deg,#25d7c6,#5ea8f4)!important;color:#04121c!important;border:0!important;box-shadow:0 9px 22px rgba(34,163,188,.14)!important}
.primary:hover,.action-btn:hover{transform:translateY(-1px)!important;filter:brightness(1.04)!important}
.ghost{background:rgba(10,27,42,.72)!important;border:1px solid var(--sp-line)!important;color:#a9bdcc!important}
.ghost:hover{border-color:var(--sp-line-strong)!important;color:#eef7fd!important;background:rgba(15,37,56,.85)!important}
.subtabs{gap:6px!important;margin-bottom:14px!important;padding:4px!important;background:rgba(7,20,32,.58)!important;border:1px solid var(--sp-line)!important;border-radius:12px!important;width:max-content!important;max-width:100%!important}
.subtab{min-height:34px!important;padding:7px 11px!important;background:transparent!important;border:0!important;color:#70899d!important}
.subtab.active{background:rgba(25,61,85,.82)!important;color:#f0f7fc!important;box-shadow:0 5px 16px rgba(0,0,0,.13)!important}
input,select,textarea{border:1px solid var(--sp-line)!important;background:rgba(6,19,31,.80)!important;color:#edf6fc!important;border-radius:10px!important}
input:focus,select:focus,textarea:focus{border-color:rgba(44,206,194,.50)!important;box-shadow:0 0 0 3px rgba(34,217,199,.055)!important}

/* ===== Decision center: one product, not a collection of widgets ===== */
.decision-shell{margin-bottom:14px!important}
.decision-hero{position:relative!important;overflow:hidden!important;display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:18px!important;align-items:center!important;padding:22px 23px!important;margin-bottom:12px!important;border:1px solid rgba(89,161,197,.20)!important;border-radius:20px!important;background:linear-gradient(120deg,rgba(17,46,66,.88),rgba(11,29,47,.94) 55%,rgba(21,58,70,.74))!important;box-shadow:var(--sp-shadow-soft)!important}
.decision-hero:after{content:"";position:absolute;width:360px;height:360px;right:-170px;top:-210px;border-radius:50%;background:radial-gradient(circle,rgba(34,217,199,.13),transparent 65%);pointer-events:none}
.decision-hero h2{font-size:24px!important;line-height:1.08!important;letter-spacing:-.7px!important;margin:5px 0 6px!important}
.decision-hero p{font-size:11px!important;line-height:1.55!important;color:#96adbf!important;max-width:720px!important}
.eyebrow,.decision-label{font-size:8.5px!important;letter-spacing:.12em!important;text-transform:uppercase!important;color:#51d9cf!important;font-weight:820!important}
.decision-score{width:82px!important;height:82px!important;border:1px solid rgba(69,205,195,.24)!important;background:rgba(6,25,37,.72)!important;box-shadow:inset 0 0 0 6px rgba(34,217,199,.045),0 12px 28px rgba(0,0,0,.15)!important}
.decision-score span{font-size:24px!important}.decision-score small{font-size:7px!important}
.decision-card{min-height:154px!important;gap:8px!important}
.decision-value{font-size:24px!important;letter-spacing:-.6px!important}
.decision-pill{font-size:8px!important;background:rgba(27,75,79,.48)!important;color:#5ce3d8!important;border:1px solid rgba(58,202,192,.12)!important}
.decision-metrics{gap:7px!important}
.decision-metrics div{background:rgba(6,20,32,.62)!important;border:1px solid rgba(111,154,185,.13)!important;border-radius:10px!important;padding:9px 10px!important}
.decision-metrics b{font-size:14px!important}.decision-metrics span{font-size:7.5px!important}

/* ===== Insights, opportunities and alerts ===== */
.insights{gap:9px!important}
.insight,.goal-card,.opportunity,.health-item,.report-kpi,.alert-row{background:rgba(7,22,35,.68)!important;border:1px solid rgba(118,158,187,.13)!important;border-radius:12px!important}
.insight{padding:13px!important}.insight h4{font-size:12px!important;margin-bottom:6px!important}.insight p{font-size:10px!important;line-height:1.52!important;color:#8fa7b8!important}
.alert-list{gap:7px!important}.alert-row{padding:11px!important}.alert-row h4{font-size:10.5px!important}.alert-row p{font-size:8.5px!important}.alert-ico{background:rgba(18,48,70,.70)!important;border:1px solid rgba(112,161,193,.10)!important}
.goal-card{padding:14px!important}.goal-card h4{font-size:8.5px!important;text-transform:uppercase!important;letter-spacing:.07em!important}.goal-val{font-size:21px!important}.goal-sub{font-size:8.5px!important}
.opportunity{min-height:136px!important}.opportunity .impact{font-size:7.5px!important}.opportunity h4{font-size:13px!important}.opportunity p{font-size:9.5px!important}.opportunity .value{font-size:17px!important}
.health-item{padding:11px!important}.health-top{font-size:9px!important}.progress{height:5px!important;background:#071521!important}.progress>span{background:linear-gradient(90deg,#2fd7c6,#5ba8f7)!important}
.report-kpi{padding:11px!important}.report-kpi b{font-size:17px!important}.report-kpi span{font-size:8.5px!important}

/* ===== Command Center / Management OS ===== */
.cc-hero,.os-hero,.d360-hero,.erp-hero,.wc-hero{border-radius:20px!important;border:1px solid rgba(104,161,195,.18)!important;background:linear-gradient(125deg,rgba(15,39,58,.93),rgba(9,26,41,.96) 58%,rgba(16,49,59,.74))!important;box-shadow:var(--sp-shadow-soft)!important;overflow:hidden!important}
.cc-hero h2,.os-hero h2,.d360-hero h2,.erp-hero h2,.wc-hero h2{font-size:27px!important;line-height:1.08!important;letter-spacing:-.8px!important}
.cc-hero p,.os-hero p,.d360-hero p,.erp-hero p,.wc-hero p{font-size:11px!important;line-height:1.55!important;color:#94aabd!important}
.cc-kicker,.os-kicker,.d360-hero>div>span,.erp-hero>div>span,.wc-kicker{font-size:8px!important;letter-spacing:.12em!important;text-transform:uppercase!important;color:#52d8ce!important;font-weight:820!important}
.cc-pulse-grid,.os-pulse,.d360-kpis,.erp-kpis,.wc-stat-grid{gap:8px!important}
.cc-pulse,.os-pulse-card,.d360-kpis>div,.erp-kpis>div,.wc-stat{background:rgba(7,22,35,.64)!important;border:1px solid rgba(112,158,190,.13)!important;border-radius:12px!important;box-shadow:none!important}
.cc-pulse>b,.os-pulse-card b,.erp-kpis b,.wc-stat b{font-size:21px!important;letter-spacing:-.5px!important}
.cc-panel,.os-panel,.d360-panel,.erp-panel,.wc-panel{border-color:var(--sp-line)!important;background:rgba(10,26,41,.72)!important;border-radius:16px!important}
.cc-panel-head h3,.os-panel-head h3,.d360-head h3{font-size:15px!important;letter-spacing:-.25px!important}
.cc-task,.os-action-card,.d360-decision{background:rgba(7,22,35,.60)!important;border:1px solid rgba(115,158,189,.12)!important;border-radius:12px!important}

/* Operating system specifics */
.os-pagebar{padding-bottom:14px!important;border-bottom:1px solid var(--sp-line)!important;margin-bottom:14px!important}
.os-pagebar h2{font-size:25px!important;letter-spacing:-.7px!important}.os-pagebar p{font-size:11px!important;color:var(--sp-muted)!important}
.os-filterbar{gap:7px!important}.os-filterbar select,.os-filterbar input{font-size:10px!important;min-height:38px!important}
.os-kanban-col{background:rgba(7,21,33,.54)!important;border:1px solid var(--sp-line)!important;border-radius:14px!important}
.os-kanban-col>header{border-bottom:1px solid var(--sp-line)!important}
.os-action-card{box-shadow:0 7px 18px rgba(0,0,0,.11)!important}
.os-decision-timeline>article{border-color:var(--sp-line)!important;background:rgba(8,23,36,.60)!important}

/* Decision 360 / simulations */
.d360-domain,.d360-sim-result,.d360-ai-log,.d360-root,.d360-forecast-mini,.d360-pipeline-kpi{background:rgba(7,22,35,.62)!important;border-color:rgba(112,157,189,.13)!important;border-radius:12px!important}
.d360-domain>b{font-size:22px!important}.d360-kpis span,.d360-kpis small{font-size:9px!important}
.d360-decision h4{font-size:13px!important}.d360-decision p{font-size:10px!important;line-height:1.5!important}.d360-decision small{font-size:9px!important}
.d360-ai-log .ai,.d360-ai-log .user{font-size:10px!important;line-height:1.55!important}.d360-ai-presets button{font-size:9px!important}

/* AI assistant surfaces should feel like an analyst cockpit */
[class*="ai-"] input,[class*="ai-"] textarea{background:rgba(5,18,29,.84)!important}
[class*="ai-"] .card,[class*="assistant"] .card{border-color:rgba(92,166,196,.16)!important}

/* Sidebar collapse */
.shell.sp-sidebar-collapsed{grid-template-columns:78px minmax(0,1fr)!important}.shell.sp-sidebar-collapsed .sidebar{width:78px!important}.shell.sp-sidebar-collapsed .nav-btn{justify-content:center!important}.shell.sp-sidebar-collapsed .nav-icon{margin:0!important}

/* Toasts and ephemeral UI */
.toast{background:rgba(9,27,41,.96)!important;border:1px solid rgba(106,164,195,.24)!important;color:#edf7fd!important;border-radius:12px!important;font-size:10px!important;box-shadow:0 20px 48px rgba(0,0,0,.32)!important}

/* ===== Mobile app shell ===== */
@media(max-width:980px){
  html,body{overflow-x:clip!important}
  .shell,.shell.sp-sidebar-collapsed{display:block!important;width:100%!important;max-width:100%!important;min-width:0!important}
  .sidebar,.shell.sp-sidebar-collapsed .sidebar{position:fixed!important;left:-350px!important;top:0!important;bottom:0!important;width:min(88vw,320px)!important;max-width:320px!important;height:100dvh!important;padding:17px 14px!important;z-index:2147483000!important;transition:left .2s ease!important}
  .sidebar.open,.shell.sp-sidebar-collapsed .sidebar.open{left:0!important}
  .sidebar .smartpay-full-logo{height:38px!important;max-width:178px!important}
  .nav-btn{min-height:49px!important;font-size:14px!important;padding:11px 12px!important}
  .main{width:100%!important;max-width:100%!important;min-width:0!important}
  .topbar{display:grid!important;grid-template-columns:42px minmax(84px,96px) minmax(0,1fr) 66px!important;gap:5px!important;height:60px!important;min-height:60px!important;padding:7px 8px!important;overflow:hidden!important}
  .top-left,.top-actions{display:contents!important}
  .search,.topbar .avatar.smartpay-avatar,.topbar .smartpay-pay-mark,.topbar .cc-command-btn,.topbar .cc-board-btn{display:none!important}
  .mobile-menu{display:grid!important;place-items:center!important;width:42px!important;height:44px!important;min-width:42px!important;border-radius:12px!important}
  .topbar .pill{height:44px!important;min-height:44px!important;padding:5px 7px!important;border-radius:12px!important;overflow:hidden!important}
  .topbar .pill:has(#dateRange){grid-column:2!important;justify-content:center!important}
  .topbar .pill:has(#topClient){grid-column:3!important;min-width:0!important}
  #dateRange{font-size:9.5px!important;text-align:center!important;white-space:normal!important;line-height:1.1!important}
  #topClient{font-size:10px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  #exportBtn{grid-column:4!important;width:66px!important;height:44px!important;min-height:44px!important;padding:0 6px!important;font-size:9.5px!important;border-radius:12px!important}
  input,select,textarea{font-size:16px!important}
  .page{width:100%!important;max-width:100%!important;padding:14px 12px calc(82px + env(safe-area-inset-bottom))!important;overflow-x:clip!important}
  .page-head{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:8px 10px!important;align-items:start!important;margin-bottom:13px!important}
  .page-head h1{font-size:23px!important;line-height:1.03!important;max-width:230px!important;margin-bottom:5px!important}.page-head p{font-size:10.5px!important;line-height:1.45!important;max-width:235px!important}.data-badge{font-size:7.8px!important;padding:6px 8px!important;min-height:26px!important}
  .grid{gap:9px!important}.c12,.c8,.c7,.c6,.c5,.c4,.c3{grid-column:span 12!important}
  .card{padding:13px!important;border-radius:14px!important;box-shadow:0 9px 28px rgba(0,0,0,.12)!important}
  .kpi{min-height:104px!important}.kvalue{font-size:23px!important}.klabel{font-size:8px!important}.ksub{font-size:9px!important}
  .chart-box{height:210px!important}.chart-box.sm{height:184px!important}
  .decision-hero,.cc-hero,.os-hero,.d360-hero,.erp-hero,.wc-hero{grid-template-columns:minmax(0,1fr)!important;flex-direction:column!important;align-items:flex-start!important;gap:11px!important;padding:14px!important;border-radius:15px!important}
  .decision-hero h2,.cc-hero h2,.os-hero h2,.d360-hero h2,.erp-hero h2,.wc-hero h2{font-size:20px!important;line-height:1.08!important}.decision-hero p,.cc-hero p,.os-hero p,.d360-hero p,.erp-hero p,.wc-hero p{font-size:10px!important;line-height:1.45!important}
  .decision-score{width:66px!important;height:66px!important}.decision-score span{font-size:19px!important}
  .decision-metrics,.report-kpis,.cc-pulse-grid,.os-pulse,.d360-kpis,.erp-kpis,.wc-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px!important}
  .goal-grid,.insights{grid-template-columns:1fr!important}.form-grid{grid-template-columns:1fr!important}
  .table-wrap{max-width:100%!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch!important}
  .subtabs{width:100%!important;overflow-x:auto!important;flex-wrap:nowrap!important}
  .subtab{white-space:nowrap!important}
  .sp-mobile-bottom{position:fixed!important;left:0!important;right:0!important;bottom:0!important;width:100%!important;height:68px!important;padding:6px 7px calc(6px + env(safe-area-inset-bottom))!important;display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:3px!important;background:rgba(5,17,28,.95)!important;border-top:1px solid rgba(117,160,191,.16)!important;box-shadow:0 -12px 32px rgba(0,0,0,.22)!important;backdrop-filter:blur(18px)!important;-webkit-backdrop-filter:blur(18px)!important;z-index:2147483646!important}
  .sp-mobile-bottom.is-auth-hidden{display:none!important}
  .sp-mobile-bottom button{width:100%!important;height:54px!important;margin:0!important;border:0!important;border-radius:11px!important;background:transparent!important;color:#6f899e!important;font-size:9px!important;font-weight:680!important;display:grid!important;grid-template-rows:23px 13px!important;place-items:center!important;align-content:center!important;gap:3px!important;touch-action:manipulation!important}
  .sp-mobile-bottom button span{display:grid!important;place-items:center!important;line-height:1!important}.sp-mobile-bottom button svg{width:19px!important;height:19px!important}.sp-mobile-bottom button.active{color:#55dfd5!important;background:linear-gradient(180deg,rgba(34,217,199,.075),transparent)!important}.sp-mobile-bottom button:active{transform:scale(.96)!important}
}

@media(max-width:430px){
  .topbar{grid-template-columns:40px 86px minmax(0,1fr) 62px!important;gap:4px!important;padding:6px 7px!important}.mobile-menu{width:40px!important;min-width:40px!important;height:42px!important}.topbar .pill,#exportBtn{height:42px!important;min-height:42px!important}#exportBtn{width:62px!important;font-size:9px!important}
  .page{padding:13px 11px calc(80px + env(safe-area-inset-bottom))!important}.page-head h1{font-size:22px!important;max-width:216px!important}.page-head p{font-size:10px!important;max-width:220px!important}.data-badge{font-size:7.5px!important}
}

@media(max-width:360px){
  .topbar{grid-template-columns:38px 78px minmax(0,1fr) 40px!important}.mobile-menu{width:38px!important;min-width:38px!important;height:40px!important}.topbar .pill,#exportBtn{height:40px!important;min-height:40px!important}#exportBtn{width:40px!important;font-size:0!important}#exportBtn:before{content:'⇩';font-size:14px!important}.page-head{grid-template-columns:1fr!important}.page-head h1,.page-head p{max-width:100%!important}.data-badge{justify-self:start!important}.decision-metrics,.report-kpis,.cc-pulse-grid,.os-pulse,.d360-kpis,.erp-kpis,.wc-stat-grid{grid-template-columns:1fr!important}
}