/* Shared visual language for the customer workspace. */
:root{--cx-bg:#f7f7fb;--cx-surface:#fff;--cx-ink:#21192b;--cx-muted:#756b7e;--cx-line:#e8e3eb;--cx-accent:#c52668;--cx-purple:#872fb2}
body{background:var(--cx-bg);color:var(--cx-ink);font-family:Inter,"Segoe UI",system-ui,sans-serif}
.app-shell{grid-template-columns:248px minmax(0,1fr)}
.sidebar{padding:27px 18px;background:#fff;border-color:var(--cx-line)}
.sidebar .brand{font-size:20px;letter-spacing:-.025em}.sidebar .brand-mark{width:43px;height:43px;filter:drop-shadow(0 8px 10px rgba(154,42,111,.18))}
.sidebar nav a{min-height:47px;padding:9px 10px;border-radius:12px;font-size:13px;font-weight:750}
.sidebar nav a span{background:transparent}.sidebar nav a:hover,.sidebar nav a.active{background:#fceaf2;border-color:#f2cedd;color:#a91f59}.sidebar nav a.active span{background:linear-gradient(145deg,#ee5d8d,#9b31aa);color:#fff;box-shadow:0 7px 16px rgba(174,40,105,.24)}
.topbar{min-height:94px;border-color:var(--cx-line);background:rgba(255,255,255,.94);backdrop-filter:blur(12px)}
.content{max-width:1380px;padding:28px clamp(20px,3.5vw,52px) 72px}
.welcome{min-height:220px;border-radius:24px;background:radial-gradient(circle at 79% 12%,rgba(213,91,192,.55),transparent 36%),linear-gradient(115deg,#9c2258,#d12b67 57%,#6f31a7)}
.summary{gap:12px}.summary .card,.card{border:1px solid var(--cx-line);border-radius:18px;background:#fff;box-shadow:0 14px 38px rgba(59,31,54,.06)}
.summary .card{min-height:142px}.summary strong{font-size:25px}.device{border-color:#eee7ed;border-radius:13px}.primary{border-radius:10px}
.account-downloads a{background:#fff;border-color:#e6dfe7}

@media(max-width:680px){
  body{padding-bottom:75px;background:#f8f8fb}
  .app-shell{display:block}
  .sidebar{position:sticky;top:0;z-index:40;height:67px;padding:11px 16px;display:flex;flex-wrap:nowrap;border-bottom:1px solid var(--cx-line);box-shadow:0 8px 24px rgba(48,28,43,.06)}
  .sidebar .brand{padding:0;font-size:16px}.sidebar .brand-mark{width:36px;height:36px}.sidebar .brand small{font-size:7px}
  .sidebar nav{position:fixed;z-index:70;left:10px;right:10px;bottom:9px;display:flex;order:initial;width:auto;margin:0;padding:7px;gap:3px;justify-content:space-around;overflow:visible;border:1px solid #e2dae3;border-radius:18px;background:rgba(255,255,255,.94);box-shadow:0 13px 38px rgba(37,20,36,.17);backdrop-filter:blur(15px)}
  .sidebar nav a{min-width:65px;min-height:50px;flex:1;padding:5px 4px;display:flex;flex-direction:column;justify-content:center;gap:3px;border:0;border-radius:12px;font-size:9px}
  .sidebar nav a span{width:auto;height:19px;font-size:17px;background:transparent!important;box-shadow:none!important}
  .sidebar nav a.active{background:#fceaf2}.sidebar nav a.active span{color:#c52668}
  .topbar{min-height:76px;padding:14px 16px}.topbar h1{font-size:23px}.top-actions a{display:none}.avatar{width:38px;height:38px;border-radius:50%}
  .content{padding:15px 14px 35px}.mobile-section-nav{display:none}
  .welcome{min-height:164px;padding:22px;border-radius:18px}.welcome h2{font-size:28px}.welcome p{font-size:12px}
  .summary{grid-template-columns:1fr 1fr;gap:9px}.summary .card{min-height:126px;padding:15px}.summary .card:last-child{grid-column:1/-1;min-height:108px}
  .summary strong{font-size:20px;line-height:1.15}
  .card{padding:17px;border-radius:16px}.columns{grid-template-columns:1fr}.device{padding:12px}
  section[id]{scroll-margin-top:82px}
}

@media(max-width:390px){.sidebar nav a{min-width:0}}
@media(max-width:340px){.summary{grid-template-columns:1fr}.summary .card:last-child{grid-column:auto}}