:root{
  --bl-bg-canvas:#f5f8f7;--bl-bg-surface:#fff;--bl-bg-brand:#0a7c66;--bl-bg-brand-soft:#ddf4ed;
  --bl-text-primary:#17233c;--bl-text-secondary:#687386;--bl-border:#e1e8e5;--bl-accent:#f4b942;
  --bl-positive:#12805c;--bl-danger:#c7484a;--bl-shadow:0 8px 28px rgba(23,35,60,.10);
  --bl-radius-card:20px;--bl-radius-action:16px;--bl-radius-pill:999px
}
body{background:var(--bl-bg-canvas);color:var(--bl-text-primary)}
.topbar{background:rgba(255,255,255,.94);border-bottom:1px solid rgba(225,232,229,.95);box-shadow:0 4px 18px rgba(23,35,60,.035);min-height:68px}
.topbar>div:first-child strong{color:var(--bl-text-primary);font-size:15px;letter-spacing:-.01em}.topbar>div:first-child small{font-size:11px}
.topActions{gap:8px}.topActions .ghost{display:none}.statusChip{background:#e5f5ef;color:#0b664f}
.card,.metric,.productCard{border-color:var(--bl-border);box-shadow:0 7px 24px rgba(23,35,60,.055)}
.hero{background:linear-gradient(135deg,#17233c 0%,#0f4e55 58%,#0a7c66 100%);box-shadow:0 14px 34px rgba(23,35,60,.19);position:relative;overflow:hidden}
.hero::after{content:"";position:absolute;width:170px;height:170px;border-radius:50%;background:rgba(244,185,66,.13);right:-55px;top:-75px}.hero>*{position:relative;z-index:1}
.primary{background:var(--bl-bg-brand);color:white;box-shadow:0 5px 14px rgba(10,124,102,.18)}.primary:active{transform:translateY(1px)}
.secondary{background:var(--bl-bg-brand-soft);color:#075f50}.ghost{background:#edf2f0;color:var(--bl-text-primary)}
.bottomNav{border-top-color:var(--bl-border);box-shadow:0 -8px 28px rgba(23,35,60,.08)}.bottomNav button.active{color:#075f50;background:var(--bl-bg-brand-soft)}

.shellProfileControls{display:flex;align-items:center;gap:7px}.activeRolePill{display:none;font-size:10px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:#075f50;background:var(--bl-bg-brand-soft);padding:6px 9px;border-radius:var(--bl-radius-pill)}
.accountAvatarButton{border:0;background:transparent;padding:0;display:grid;place-items:center;cursor:pointer;border-radius:50%;outline-offset:3px}.accountAvatarButton:focus-visible{outline:3px solid rgba(10,124,102,.28)}
.accountAvatar{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;overflow:hidden;background:linear-gradient(145deg,#0a7c66,#17233c);color:#fff;font-weight:900;font-size:15px;border:2px solid #fff;box-shadow:0 5px 15px rgba(23,35,60,.18)}.accountAvatarLoading{background:linear-gradient(110deg,#dce7e3 8%,#f2f6f4 18%,#dce7e3 33%);background-size:200% 100%;animation:accountAvatarHydrate 1.1s linear infinite;color:transparent}.accountAvatar img{width:100%;height:100%;object-fit:cover}@keyframes accountAvatarHydrate{to{background-position-x:-200%}}

.profileDrawerBackdrop{position:fixed;inset:0;z-index:100;background:rgba(9,18,33,.46);backdrop-filter:blur(4px);display:flex;align-items:flex-end;justify-content:center;padding:0}.profileDrawerBackdrop.hidden{display:none!important}
.profileDrawerPanel{width:min(100%,560px);max-height:91dvh;overflow:auto;background:#f8fbfa;border-radius:28px 28px 0 0;box-shadow:0 -20px 80px rgba(9,18,33,.28);padding:10px 16px calc(24px + env(safe-area-inset-bottom));animation:drawerUp .22s ease-out}
@keyframes drawerUp{from{transform:translateY(28px);opacity:.55}to{transform:translateY(0);opacity:1}}
.drawerHandle{width:44px;height:5px;border-radius:999px;background:#cfd9d6;margin:2px auto 14px}.drawerHeader{display:flex;align-items:center;gap:13px;padding:4px 2px 16px}.drawerHeader .accountAvatar{width:58px;height:58px;font-size:18px}.drawerIdentity{min-width:0;flex:1}.drawerIdentity h2{font-size:19px;margin:0 0 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.drawerIdentity p{margin:0;color:var(--bl-text-secondary);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.drawerClose{border:0;background:#eaf0ee;border-radius:50%;width:38px;height:38px;font-size:20px;color:var(--bl-text-primary)}
.drawerSection{background:#fff;border:1px solid var(--bl-border);border-radius:var(--bl-radius-card);padding:15px;margin-bottom:12px;box-shadow:0 6px 20px rgba(23,35,60,.04)}.drawerSection h3{font-size:14px;margin:0 0 12px}.profileRoleList{display:grid;gap:9px}.profileRole{display:flex;align-items:center;gap:11px;border:1px solid #e7edeb;border-radius:16px;padding:11px;background:#fff}.profileRole.active{border-color:#83c9b8;background:#f1fbf7}.roleIcon{width:38px;height:38px;border-radius:13px;background:#edf5f2;display:grid;place-items:center;font-size:18px}.profileRole.active .roleIcon{background:#d9f2e9}.roleCopy{display:grid;gap:1px;min-width:0;flex:1}.roleCopy strong{font-size:13px}.roleCopy small{color:var(--bl-text-secondary);font-size:11px}.roleAction{border:0;border-radius:12px;padding:9px 11px;font-weight:800;font-size:11px;background:#e4f4ee;color:#075f50}.roleAction.enable{background:#eef1f5;color:#374151}.roleAction.active{background:#17233c;color:#fff}
.profileForm{display:grid;gap:10px}.profileForm label{font-size:11px}.profileForm input,.profileForm textarea{border-color:#d9e2df;background:#fcfefd}.profileForm .formActions{display:flex;gap:8px}.profileForm .formActions button{flex:1}
.avatarEdit{display:flex;gap:9px;align-items:center}.avatarEdit input{font-size:11px;padding:9px}.avatarHint{font-size:10px;color:var(--bl-text-secondary)}

.growthDrawerSection{background:linear-gradient(145deg,#f0f9ff,#f4fbf8);border-color:#b9ddd5}.growthDrawerCopy{display:grid;gap:4px}.growthDrawerEyebrow{font-size:9px;font-weight:900;letter-spacing:.11em;color:#087361}.growthDrawerCopy h3{margin:0;font-size:17px}.growthDrawerCopy p{margin:0 0 12px;color:var(--bl-text-secondary);font-size:11px;line-height:1.45}.growthDrawerButton{width:100%;border:0;border-radius:14px;background:linear-gradient(135deg,#0a7c66,#0f5960);color:#fff;padding:12px 14px;font-weight:900;box-shadow:0 6px 16px rgba(10,124,102,.18);cursor:pointer}.growthDrawerButton:active{transform:translateY(1px)}

.roleHub{padding:18px 18px 110px;max-width:760px;margin:auto}.roleHub.hidden{display:none!important}.hubHero{position:relative;overflow:hidden;background:linear-gradient(135deg,#17233c 0%,#0d5960 60%,#0a7c66 100%);color:#fff;border-radius:28px;padding:23px 21px;margin-bottom:17px;box-shadow:0 15px 38px rgba(23,35,60,.19)}.hubHero::before{content:"";position:absolute;width:210px;height:210px;border:1px solid rgba(255,255,255,.10);border-radius:50%;right:-95px;top:-105px}.hubHero::after{content:"";position:absolute;width:98px;height:98px;background:rgba(244,185,66,.18);border-radius:50%;right:21px;bottom:-52px}.hubHero>*{position:relative;z-index:1}.hubEyebrow{font-size:10px;text-transform:uppercase;letter-spacing:.13em;font-weight:800;color:#b9e4d8}.hubHero h1{font-size:27px;line-height:1.07;margin:6px 0 8px;letter-spacing:-.035em}.hubHero p{font-size:13px;line-height:1.5;color:#d5e5e3;margin:0;max-width:510px}.hubStatus{display:inline-flex;align-items:center;gap:6px;margin-top:15px;padding:7px 10px;border-radius:999px;background:rgba(255,255,255,.11);font-size:10px;font-weight:800}.hubStatus::before{content:"";width:7px;height:7px;border-radius:50%;background:#69deb5;box-shadow:0 0 0 4px rgba(105,222,181,.12)}
.hubSectionTitle{display:flex;justify-content:space-between;align-items:end;margin:19px 2px 10px}.hubSectionTitle h2{font-size:15px;margin:0}.hubSectionTitle span{font-size:10px;color:var(--bl-text-secondary)}.hubGrid{display:grid;grid-template-columns:1fr 1fr;gap:11px}.hubTile{border:1px solid var(--bl-border);background:#fff;border-radius:19px;padding:15px;min-height:128px;display:flex;flex-direction:column;gap:7px;text-align:left;box-shadow:0 6px 20px rgba(23,35,60,.045);cursor:pointer;color:var(--bl-text-primary)}.hubTile:active{transform:scale(.992)}.hubTileIcon{width:42px;height:42px;border-radius:14px;background:#e7f6f1;display:grid;place-items:center;font-size:20px}.hubTile.accent .hubTileIcon{background:#fff2ce}.hubTile strong{font-size:14px}.hubTile small{font-size:11px;color:var(--bl-text-secondary);line-height:1.4}.hubTile .miniBadge{align-self:flex-start;font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:#075f50;background:#e6f6f0;padding:4px 7px;border-radius:999px}.hubTile .miniBadge.pending{color:#8b5e00;background:#fff4d8}
.roleToast{position:fixed;left:50%;bottom:92px;z-index:120;transform:translateX(-50%) translateY(12px);background:#17233c;color:#fff;padding:11px 14px;border-radius:14px;box-shadow:0 10px 35px rgba(23,35,60,.28);font-size:12px;font-weight:700;max-width:min(92vw,440px);opacity:0;pointer-events:none;transition:.18s}.roleToast.show{opacity:1;transform:translateX(-50%) translateY(0)}

@media(min-width:650px){.activeRolePill{display:inline-flex}.profileDrawerBackdrop{align-items:stretch;justify-content:flex-end}.profileDrawerPanel{width:430px;max-height:100dvh;height:100dvh;border-radius:28px 0 0 28px;padding:18px 18px 30px;animation:drawerSide .22s ease-out}.drawerHandle{display:none}@keyframes drawerSide{from{transform:translateX(26px);opacity:.6}to{transform:translateX(0);opacity:1}}.hubGrid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:420px){.topbar{padding:11px 12px}.accountAvatar{width:39px;height:39px}.roleHub{padding-inline:14px}.hubHero{border-radius:24px;padding:20px 18px}.hubHero h1{font-size:24px}.hubTile{padding:13px;min-height:122px}.profileDrawerPanel{padding-inline:13px}}


/* Mobile topbar regression guard: injected action buttons must never widen the document. */
.topbar{width:100%;max-width:100%;min-width:0;gap:10px;overflow:hidden}
.topbar>div:first-child{min-width:0;flex:1 1 auto}
.topbar>div:first-child strong,.topbar>div:first-child small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.topActions{min-width:0;flex:0 1 auto;max-width:min(72vw,560px);overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.topActions::-webkit-scrollbar{display:none}
.topActions>*{flex:0 0 auto}
.shellProfileControls{flex:0 0 auto}

@media(max-width:640px){
  .topbar{display:grid;grid-template-columns:minmax(0,1fr);gap:7px;padding:10px 12px}
  .topbar>div:first-child{display:none}
  .topActions{width:100%;max-width:100%;justify-content:flex-start;padding:1px 0 2px}
}
