/* m-bh-phone-nav.css — U24: phones/tablets (<900px). Menu moves from the bottom dock to ONE row UNDER the logo/actions bar (U27: no groups, no second row; each page has its own icon and colour):
   idle pages = 34px icon circles, the current page = navy pill with a Sand disc that expands to show its label (width animates).
   Loaded LAST. Tokens only. Desktop untouched. */
@media(max-width:899px){
  :root{--shell-h:100px;--nav-h:0px}
  html body header.top{flex-wrap:wrap;align-content:flex-start;align-items:center;height:calc(var(--shell-h) + env(safe-area-inset-top));padding-bottom:0;row-gap:0}
  html body header.top.sk-hide{top:0}
  html body header.top .brand{height:56px}
  html body header.top .hd-search,html body header.top .notif-bell,html body header.top .bh-i.bh-user{align-self:center}
  html body header.top nav.nv-all{display:none}
  html body header.top nav.nv-grp{order:20;flex:0 0 100%;position:static;inset:auto;display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:6px;width:100%;min-height:0;height:44px;margin:0;padding:0 0 2px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch;background:none;-webkit-backdrop-filter:none;backdrop-filter:none;border:0;border-top:1px solid rgba(var(--ink-rgb),.08);box-shadow:none;transform:none}
  html body header.top nav::-webkit-scrollbar{display:none}
  html body header.top.sk-hide nav{transform:none}
  html body header.top nav .nv-g{display:contents}
  html body header.top nav .nv-gl,html body header.top nav button.nv-more,html body header.top nav button[data-v=settings],html body header.top nav button.nv-sec[data-v=settings]{display:none}
  html body header.top nav button,html body header.top nav button.nv-sec{position:relative;flex:none;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:0;width:auto;max-width:none;min-width:34px;height:34px;min-height:0;padding:0 8.5px;border:1px solid rgba(var(--ink-rgb),.14);border-radius:var(--rd-pill);background:var(--bg-tint);color:var(--tx-strong);font:700 var(--fs-sm)/1 var(--font-body);letter-spacing:0;white-space:nowrap;transition:padding .35s var(--ease),gap .35s var(--ease),background .25s,border-color .25s,color .25s,transform .15s}
  html body header.top nav button::before{width:17px;height:17px;transition:transform .25s var(--ease)}
  html body header.top nav button .nv-l{display:block;max-width:0;overflow:hidden;opacity:0;white-space:nowrap;transition:max-width .4s var(--ease),opacity .2s}
  html body header.top nav button:active{transform:scale(.94)}
  html body header.top nav button.on{gap:7px;padding:0 14px 0 3px;background:var(--c-starlight);border-color:var(--c-starlight);color:var(--c-white);box-shadow:var(--sh-2)}
  html body header.top nav button.on .nv-l{max-width:120px;opacity:1}
  html body header.top nav button.on::after{content:"";display:block;position:absolute;inset:auto;left:3px;top:3px;width:26px;height:26px;margin:0;border-radius:50%;background:var(--c-sand);transform:none}
  html body header.top nav button.on::before{position:relative;z-index:1;flex:none;width:26px;height:26px;background:var(--c-starlight);-webkit-mask-size:15px;mask-size:15px}
  html body header.top nav button:focus-visible{outline:2px solid var(--c-sand);outline-offset:2px}
  html body main{padding-bottom:calc(var(--sp-6) + env(safe-area-inset-bottom))}
}
@media(max-width:899px) and (prefers-reduced-motion:reduce){html body header.top nav button,html body header.top nav button .nv-l,html body header.top nav button::before{transition:none}}
@media(max-width:899px){
  html body header.top nav button[data-v=home]{--g:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11.5 12 4l9 7.5'/%3E%3Cpath d='M5.5 10v9.5a.5.5 0 0 0 .5.5h3.5v-5.5h5V20H18a.5.5 0 0 0 .5-.5V10'/%3E%3C/svg%3E")}
  html body header.top nav button[data-v=today]{--g:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 15.5a5 5 0 0 1 10 0'/%3E%3Cpath d='M2.5 15.5h19M12 4.5v2.5M5.2 8.7l1.8 1.8M18.8 8.7l-1.8 1.8M7.5 19.5h9'/%3E%3C/svg%3E")}
  html body header.top nav button[data-v=leads]{--g:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4.5' width='18' height='15' rx='2.5'/%3E%3Ccircle cx='9' cy='11' r='2.2'/%3E%3Cpath d='M5.8 16.5a3.4 3.4 0 0 1 6.4 0M14.5 9.5h4M14.5 13h3'/%3E%3C/svg%3E")}
  html body header.top nav button[data-v=units]{--g:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='3' width='14' height='18' rx='1.5'/%3E%3Cpath d='M9 7.5h2M13 7.5h2M9 11.5h2M13 11.5h2M10 21v-4h4v4'/%3E%3C/svg%3E")}
  html body header.top nav button[data-v=team]{--g:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='8' r='3.2'/%3E%3Cpath d='M3 19.5a6 6 0 0 1 12 0'/%3E%3Ccircle cx='17.5' cy='9' r='2.4'/%3E%3Cpath d='M17 14.2a5 5 0 0 1 4.5 5'/%3E%3C/svg%3E")}
  html body header.top nav button[data-v=demand]{--g:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-6.5-5.6-6.5-11a6.5 6.5 0 0 1 13 0c0 5.4-6.5 11-6.5 11z'/%3E%3Ccircle cx='12' cy='10' r='2.3'/%3E%3C/svg%3E")}
  html body header.top nav button[data-v=insights]{--g:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21.2 15.9A10 10 0 1 1 8 2.8'/%3E%3Cpath d='M22 12A10 10 0 0 0 12 2v10z'/%3E%3C/svg%3E")}
}

@media(min-width:900px){html body header.top nav.nv-grp,html body header.top .nv-sub{display:none}}

/* U27 — one row, one colour per page. --a = the page's accent (r,g,b). Idle: soft tint + coloured icon. Open: navy pill, accent disc, white icon. */
@media(max-width:899px){
  html body header.top nav.nv-grp{padding-right:16px}
  html body header.top nav button[data-v=home]{--a:184,135,79}
  html body header.top nav button[data-v=today]{--a:74,115,172}
  html body header.top nav button[data-v=leads]{--a:23,138,86}
  html body header.top nav button[data-v=units]{--a:128,94,184}
  html body header.top nav button[data-v=team]{--a:196,84,124}
  html body header.top nav button[data-v=demand]{--a:214,120,32}
  html body header.top nav button[data-v=insights]{--a:30,148,160}
  html body header.top nav.nv-grp button{background:rgba(var(--a,184,135,79),.13);border-color:rgba(var(--a,184,135,79),.34);color:rgb(var(--a,184,135,79));color:color-mix(in srgb,rgb(var(--a,184,135,79)) 80%,var(--tx-strong))}
  html body header.top nav.nv-grp button.on{background:var(--c-starlight);border-color:var(--c-starlight);color:var(--c-white);box-shadow:var(--sh-2),0 7px 14px -7px rgba(var(--a,184,135,79),.85)}
  html body header.top nav.nv-grp button.on::after{background:rgb(var(--a,184,135,79))}
  html body header.top nav.nv-grp button.on::before{background:var(--c-white)}
}