/* =====================================================================
   CDATA one-product layer — identical copy in every app + the console.
   Spec: DESIGN.md (CDATA admin, one product, Oct 17 2026).
   Each app sets <html data-cdata-app="guestsuite|fitness|connect|console">.
   The app is told apart ONLY by its two-tone palette (see TWO-TONE PALETTES at the end):
   side menu, active menu item, app name chip, tab underline. Everything else is shared.
   ===================================================================== */
:root{
  --cd-font:-apple-system,BlinkMacSystemFont,"SF Pro Text","Inter","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --cd-ink:#101828; --cd-ink-2:#475467; --cd-ink-3:#667085; --cd-ink-4:#98A2B3;
  --cd-line:#E4E7EC; --cd-line-strong:#D0D5DD; --cd-surface:#FFFFFF; --cd-sunken:#F8F9FB;
  --cd-primary:#152B55; --cd-primary-hover:#0F2042; --cd-focus:rgb(37 99 235 / .28);
  --cd-danger:#B42318;
  --cd-r-control:8px; --cd-r-card:12px;
  --cd-shadow:0 1px 2px rgb(16 24 40 / .05);
  --cd-sidebar-w:248px;
  /* default pastel = console soft blue */
  --cd-bg:#E8EFF9; --cd-soft:#D6E3F5; --cd-tint:#BCD0EE; --cd-deep:#2B5797;
}

/* ---------- Sidebar: white panel on the pastel page ---------- */
.cd-sidebar{background:var(--cd-surface);border-right:1px solid var(--cd-line)}

/* ---------- Sidebar brand block: community logo, then the app chip ---------- */
.cd-brand{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:6px 8px 4px;margin-bottom:20px;text-decoration:none;color:inherit}
.cd-brand-logo{display:flex;align-items:center;gap:10px;min-height:36px;max-width:100%}
.cd-brand-logo img{max-height:36px;max-width:200px;width:auto;height:auto;object-fit:contain}
.cd-brand-tile{width:36px;height:36px;border-radius:10px;background:var(--cd-soft);color:var(--cd-deep);display:grid;place-items:center;font:600 16px/1 var(--cd-font);flex:none}
.cd-brand-row{display:flex;align-items:center;gap:10px;min-width:0;max-width:100%}
.cd-brand-name{font:600 14px/18px var(--cd-font);color:var(--cd-ink);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;word-break:break-word;min-width:0}
.cd-app-chip{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px 0 8px;border-radius:999px;background:var(--cd-soft);color:var(--cd-deep);font:600 12px/1 var(--cd-font);letter-spacing:0;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.cd-app-chip::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--cd-deep);flex:none}
.cd-app-chip img,.cd-app-chip svg{display:none}

/* ---------- Sidebar menu items ---------- */
.cd-nav-item{display:flex;align-items:center;gap:12px;height:38px;padding:0 12px;border-radius:var(--cd-r-control);font:500 14px/1 var(--cd-font);color:var(--cd-ink-2);text-decoration:none;background:transparent;border:0;width:100%;text-align:left;cursor:pointer}
.cd-nav-item svg{width:18px;height:18px;color:var(--cd-ink-4);flex:none}
.cd-nav-item:hover{background:var(--cd-sunken);color:var(--cd-ink)}
.cd-nav-item[aria-current="page"],.cd-nav-item.is-active{background:var(--cd-soft);color:var(--cd-deep);font-weight:600}
.cd-nav-item[aria-current="page"] svg,.cd-nav-item.is-active svg{color:var(--cd-deep)}
@media (pointer:coarse){.cd-nav-item{height:44px}}

/* ---------- Sidebar user row ---------- */
.cd-user{display:flex;align-items:center;gap:12px;padding:16px 12px 8px;margin-top:8px;border-top:1px solid var(--cd-line)}
.cd-avatar{width:36px;height:36px;border-radius:50%;background:var(--cd-soft);color:var(--cd-deep);display:grid;place-items:center;font:600 14px/1 var(--cd-font);flex:none}
.cd-user-name{font:600 14px/18px var(--cd-font);color:var(--cd-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cd-user-role{font:400 12px/16px var(--cd-font);color:var(--cd-ink-2)}

/* ---------- Page header ---------- */
.cd-page-title{font:600 24px/32px var(--cd-font);letter-spacing:-.02em;color:var(--cd-ink);margin:0}
.cd-page-sub{font:400 14px/20px var(--cd-font);color:var(--cd-ink-2);margin:4px 0 0}

/* ---------- Settings tab strip: one row, scrolls sideways, never wraps ---------- */
.cd-tabs{display:flex;gap:4px;border-bottom:1px solid var(--cd-line);overflow-x:auto;overflow-y:hidden;scrollbar-width:none;margin:0 0 24px;padding:0;flex-wrap:nowrap;background:transparent;border-radius:0}
.cd-tabs::-webkit-scrollbar{display:none}
.cd-tab{flex:none;display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 12px;margin:0 0 -1px;border:0;border-bottom:2px solid transparent;border-radius:0;background:transparent;color:var(--cd-ink-3);font:500 14px/1 var(--cd-font);white-space:nowrap;cursor:pointer;box-shadow:none}
.cd-tab svg{width:16px;height:16px}
.cd-tab:hover{color:var(--cd-ink)}
.cd-tab[aria-selected="true"],.cd-tab.is-active{color:var(--cd-deep);border-bottom-color:var(--cd-deep);font-weight:600;background:transparent}
@media (pointer:coarse){.cd-tab{height:44px}}

/* ---------- Cards and fields ---------- */
.cd-card{background:var(--cd-surface);border:1px solid var(--cd-line);border-radius:var(--cd-r-card);box-shadow:var(--cd-shadow)}
.cd-card-head{padding:16px 20px 4px}
.cd-card-title{font:600 16px/24px var(--cd-font);color:var(--cd-ink);margin:0}
.cd-card-desc{font:400 13px/18px var(--cd-font);color:var(--cd-ink-3);margin:2px 0 0}
.cd-card-body{padding:16px 20px 20px}
.cd-card-foot{display:flex;align-items:center;justify-content:flex-end;gap:12px;padding:12px 20px;border-top:1px solid var(--cd-line);background:var(--cd-sunken);border-radius:0 0 var(--cd-r-card) var(--cd-r-card)}
.cd-label{display:block;font:500 13px/18px var(--cd-font);color:#344054;margin-bottom:6px}
.cd-hint{font:400 12px/16px var(--cd-font);color:var(--cd-ink-3);margin-top:6px}
.cd-empty{padding:32px 16px;text-align:center;color:var(--cd-ink-3);font:400 14px/20px var(--cd-font)}

/* =====================================================================
   SHELL v2 — IDENTICAL admin shell in all 4 (Oct 17 2026, 9:15 PM rule).
   Only the pastel (--cd-*) and each app's own menu items/content differ.
   Markup contract: /home/user/tab/tasks/ae957add-7e87-4caa-87f3-0afda050a3bd/SHELL.md
   Selectors are prefixed with html[data-cdata-app] so they beat each app's
   older CSS; sizes carry !important for the same reason.
   ===================================================================== */
html[data-cdata-app] body{font-family:var(--cd-font)}
/* ---- desktop sidebar (>=1024) ---- */
html[data-cdata-app] .cd-sidebar{position:fixed!important;left:0!important;top:0!important;bottom:0!important;width:248px!important;min-width:248px!important;max-width:248px!important;height:auto!important;box-sizing:border-box!important;display:flex!important;flex-direction:column!important;gap:0!important;padding:20px 12px 12px!important;margin:0!important;background:#fff!important;border-right:1px solid var(--cd-line)!important;border-radius:0!important;box-shadow:none!important;z-index:40;overflow:hidden!important;backdrop-filter:none!important}
html[data-cdata-app] .cd-sidebar .cd-brand{display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:10px!important;padding:0 8px!important;margin:0 0 20px!important;flex:none!important}
html[data-cdata-app] .cd-brand-row{display:flex!important;align-items:center!important;gap:10px!important;min-width:0!important;max-width:100%!important}
html[data-cdata-app] .cd-brand-tile{width:36px!important;height:36px!important;border-radius:10px!important;overflow:hidden!important;background:var(--cd-soft)!important;color:var(--cd-deep)!important;display:grid!important;place-items:center!important;font:600 16px/1 var(--cd-font)!important;flex:none!important;margin:0!important;padding:0!important}
html[data-cdata-app] .cd-brand-tile img{width:36px!important;height:36px!important;max-width:none!important;max-height:none!important;object-fit:cover!important;border-radius:10px!important;display:block!important}
html[data-cdata-app] .cd-brand-name{font:600 15px/20px var(--cd-font)!important;color:var(--cd-ink)!important;letter-spacing:-.01em!important;margin:0!important;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;word-break:break-word;min-width:0}
html[data-cdata-app] .cd-app-chip{display:inline-flex!important;align-items:center!important;gap:6px!important;height:24px!important;padding:0 10px 0 8px!important;border-radius:999px!important;background:var(--cd-soft)!important;color:var(--cd-deep)!important;font:600 12px/1 var(--cd-font)!important;white-space:nowrap!important;margin:0!important;border:0!important}
html[data-cdata-app] .cd-nav{display:flex!important;flex-direction:column!important;gap:2px!important;flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important;margin:0!important;padding:0!important}
html[data-cdata-app] .cd-nav-item{all:unset;box-sizing:border-box!important;display:flex!important;align-items:center!important;gap:12px!important;height:40px!important;min-height:40px!important;padding:0 12px!important;margin:0!important;border-radius:8px!important;font:500 14px/1 var(--cd-font)!important;color:var(--cd-ink-2)!important;background:transparent!important;border:0!important;box-shadow:none!important;width:100%!important;text-align:left!important;cursor:pointer!important;text-decoration:none!important;white-space:nowrap!important;flex:none!important}
html[data-cdata-app] .cd-nav-item svg{width:18px!important;height:18px!important;color:var(--cd-ink-4)!important;flex:none!important;stroke-width:1.75}
html[data-cdata-app] .cd-nav-item:hover{background:var(--cd-sunken)!important;color:var(--cd-ink)!important}
html[data-cdata-app] .cd-nav-item:focus-visible{outline:2px solid var(--cd-deep)!important;outline-offset:-2px}
html[data-cdata-app] .cd-nav-item[aria-current="page"],html[data-cdata-app] .cd-nav-item.is-active{background:var(--cd-soft)!important;color:var(--cd-deep)!important;font-weight:600!important}
html[data-cdata-app] .cd-nav-item[aria-current="page"] svg,html[data-cdata-app] .cd-nav-item.is-active svg{color:var(--cd-deep)!important}
html[data-cdata-app] .cd-count{margin-left:auto!important;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--cd-deep)!important;color:#fff!important;font:600 11px/20px var(--cd-font)!important;text-align:center;box-sizing:border-box}
html[data-cdata-app] .cd-side-foot{flex:none!important;display:flex!important;flex-direction:column!important;gap:2px!important;padding:12px 0 0!important;margin:12px 0 0!important;border-top:1px solid var(--cd-line)!important}
html[data-cdata-app] .cd-user{display:flex!important;align-items:center!important;gap:10px!important;padding:12px 4px 4px 8px!important;margin:8px 0 0!important;border-top:1px solid var(--cd-line)!important;min-width:0}
html[data-cdata-app] .cd-avatar{width:36px!important;height:36px!important;border-radius:50%!important;background:var(--cd-soft)!important;color:var(--cd-deep)!important;display:grid!important;place-items:center!important;font:600 13px/1 var(--cd-font)!important;flex:none!important;overflow:hidden;font-style:normal!important}
html[data-cdata-app] .cd-avatar img{width:100%;height:100%;object-fit:cover}
html[data-cdata-app] .cd-user-text{display:flex!important;flex-direction:column!important;min-width:0!important;flex:1 1 auto!important;gap:0!important}
html[data-cdata-app] .cd-user-name{font:600 14px/18px var(--cd-font)!important;color:var(--cd-ink)!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html[data-cdata-app] .cd-user-role{font:400 12px/16px var(--cd-font)!important;color:var(--cd-ink-3)!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html[data-cdata-app] .cd-signout,html[data-cdata-app] .cd-icon-btn{all:unset;box-sizing:border-box!important;width:36px!important;height:36px!important;border-radius:8px!important;display:grid!important;place-items:center!important;color:var(--cd-ink-3)!important;cursor:pointer!important;flex:none!important;background:transparent!important;border:0!important}
html[data-cdata-app] .cd-signout:hover,html[data-cdata-app] .cd-icon-btn:hover{background:var(--cd-sunken)!important;color:var(--cd-ink)!important}
html[data-cdata-app] .cd-signout svg,html[data-cdata-app] .cd-icon-btn svg{width:18px!important;height:18px!important}
/* ---- main area ---- */
html[data-cdata-app] .cd-main{box-sizing:border-box!important;margin:0 0 0 248px!important;padding:32px 40px 48px!important;min-height:100vh!important;background:var(--cd-bg)!important;width:auto!important;max-width:none!important;float:none!important}
html[data-cdata-app] .cd-main > .cd-wrap{max-width:1200px;margin:0}
/* ---- page header ---- */
html[data-cdata-app] .cd-page-head{display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:16px!important;margin:0 0 24px!important;padding:0!important;flex-wrap:wrap}
html[data-cdata-app] .cd-page-head-text{min-width:0;flex:1 1 320px}
html[data-cdata-app] .cd-page-title{font:600 28px/36px var(--cd-font)!important;letter-spacing:-.02em!important;color:var(--cd-ink)!important;margin:0!important;padding:0!important}
html[data-cdata-app] .cd-page-sub{font:400 14px/20px var(--cd-font)!important;color:var(--cd-ink-2)!important;margin:4px 0 0!important;padding:0!important}
html[data-cdata-app] .cd-page-actions:empty{display:none!important}
html[data-cdata-app] .cd-page-actions{display:flex!important;align-items:center!important;gap:8px!important;flex-wrap:wrap;flex:none}
/* ---- buttons ---- */
html[data-cdata-app] .cd-btn{all:unset;box-sizing:border-box!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;height:40px!important;padding:0 16px!important;border-radius:8px!important;font:600 14px/1 var(--cd-font)!important;cursor:pointer!important;white-space:nowrap!important;border:1px solid var(--cd-line-strong)!important;background:#fff!important;color:var(--cd-ink)!important;box-shadow:var(--cd-shadow)!important}
html[data-cdata-app] .cd-btn svg{width:16px!important;height:16px!important}
html[data-cdata-app] .cd-btn:hover{background:var(--cd-sunken)!important}
html[data-cdata-app] .cd-btn-primary{background:var(--cd-primary)!important;border-color:var(--cd-primary)!important;color:#fff!important}
html[data-cdata-app] .cd-btn-primary:hover{background:var(--cd-primary-hover)!important}
html[data-cdata-app] .cd-btn:focus-visible{outline:3px solid var(--cd-focus)!important}
/* ---- settings tab strip: no icons, same metrics everywhere ---- */
html[data-cdata-app] .cd-tabs{display:flex!important;gap:4px!important;border-bottom:1px solid var(--cd-line-strong)!important;overflow-x:auto!important;overflow-y:hidden!important;margin:0 0 24px!important;padding:0!important;flex-wrap:nowrap!important;background:transparent!important;border-radius:0!important;box-shadow:none!important}
html[data-cdata-app] .cd-tab{all:unset;box-sizing:border-box!important;flex:none!important;display:inline-flex!important;align-items:center!important;gap:6px!important;height:40px!important;padding:0 12px!important;margin:0 0 -1px!important;border-bottom:2px solid transparent!important;color:var(--cd-ink-3)!important;font:500 14px/1 var(--cd-font)!important;white-space:nowrap!important;cursor:pointer!important;background:transparent!important;border-radius:0!important}
html[data-cdata-app] .cd-tab svg,html[data-cdata-app] .cd-tab img{display:none!important}
html[data-cdata-app] .cd-tab:hover{color:var(--cd-ink)!important}
html[data-cdata-app] .cd-tab[aria-selected="true"],html[data-cdata-app] .cd-tab.is-active{color:var(--cd-deep)!important;border-bottom-color:var(--cd-deep)!important;font-weight:600!important}
/* ---- cards ---- */
html[data-cdata-app] .cd-card{background:#fff!important;border:1px solid var(--cd-line)!important;border-radius:12px!important;box-shadow:var(--cd-shadow)!important}
/* ---- phone parts hidden on desktop ---- */
html[data-cdata-app] .cd-topbar,html[data-cdata-app] .cd-bottombar{display:none!important}
html[data-cdata-app] .cd-sheet-backdrop{position:fixed;inset:0;z-index:90;background:rgb(16 24 40 / .4);display:flex;align-items:flex-end;justify-content:center}
html[data-cdata-app] .cd-sheet-backdrop[hidden]{display:none!important}
html[data-cdata-app] .cd-sheet{box-sizing:border-box;width:100%;max-width:520px;max-height:85vh;overflow-y:auto;background:#fff;border-radius:16px 16px 0 0;padding:8px 12px calc(16px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:2px;box-shadow:0 -8px 24px rgb(16 24 40 / .12)}
html[data-cdata-app] .cd-sheet-grab{width:36px;height:4px;border-radius:2px;background:var(--cd-line-strong);margin:4px auto 10px;flex:none}
html[data-cdata-app] .cd-sheet .cd-nav-item{height:48px!important;min-height:48px!important;font-size:15px!important}
html[data-cdata-app] .cd-sheet-sep{height:1px;background:var(--cd-line);margin:8px 0;flex:none}
/* ---- phone (<1024): top bar + bottom bar + More sheet ---- */
@media (max-width:1023px){
  html[data-cdata-app] .cd-sidebar{display:none!important}
  html[data-cdata-app] .cd-main{margin:0!important;padding:76px 16px calc(84px + env(safe-area-inset-bottom))!important}
  html[data-cdata-app] .cd-topbar{position:fixed!important;left:0!important;right:0!important;top:0!important;height:56px!important;box-sizing:border-box!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;padding:0 8px 0 12px!important;margin:0!important;background:#fff!important;border-bottom:1px solid var(--cd-line)!important;z-index:50!important;box-shadow:none!important;backdrop-filter:none!important}
  html[data-cdata-app] .cd-topbar .cd-brand-row{gap:10px!important;flex:1 1 auto;min-width:0}
  html[data-cdata-app] .cd-topbar .cd-brand-tile,html[data-cdata-app] .cd-topbar .cd-brand-tile img{width:32px!important;height:32px!important;border-radius:9px!important}
  html[data-cdata-app] .cd-topbar-text{display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:2px!important;min-width:0}
  html[data-cdata-app] .cd-topbar .cd-brand-name{font-size:14px!important;line-height:18px!important;-webkit-line-clamp:1;white-space:nowrap;text-overflow:ellipsis;display:block!important}
  html[data-cdata-app] .cd-topbar .cd-app-chip{height:18px!important;font-size:11px!important;padding:0 8px 0 6px!important}
  html[data-cdata-app] .cd-topbar .cd-app-chip::before{width:6px;height:6px}
  html[data-cdata-app] .cd-topbar-actions{display:flex!important;align-items:center!important;gap:2px!important;flex:none!important}
  html[data-cdata-app] .cd-topbar .cd-icon-btn{width:40px!important;height:40px!important}
  html[data-cdata-app] .cd-topbar .cd-avatar{width:32px!important;height:32px!important;font-size:12px!important}
  html[data-cdata-app] .cd-avatar-btn{all:unset;cursor:pointer;width:40px;height:40px;display:grid;place-items:center;border-radius:50%}
  html[data-cdata-app] .cd-bottombar{position:fixed!important;left:0!important;right:0!important;bottom:0!important;box-sizing:content-box!important;height:64px!important;padding:0 4px env(safe-area-inset-bottom)!important;margin:0!important;display:flex!important;align-items:stretch!important;justify-content:space-around!important;background:#fff!important;border-top:1px solid var(--cd-line)!important;z-index:50!important;box-shadow:none!important;border-radius:0!important;backdrop-filter:none!important}
  html[data-cdata-app] .cd-bottom-item{all:unset;box-sizing:border-box!important;flex:1 1 0!important;min-width:0!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:4px!important;cursor:pointer!important;color:var(--cd-ink-3)!important;font:500 11px/14px var(--cd-font)!important;text-decoration:none!important;position:relative}
  html[data-cdata-app] .cd-bottom-item svg{width:22px!important;height:22px!important;padding:3px 14px;border-radius:999px;box-sizing:content-box}
  html[data-cdata-app] .cd-bottom-item[aria-current="page"],html[data-cdata-app] .cd-bottom-item.is-active{color:var(--cd-deep)!important;font-weight:600!important}
  html[data-cdata-app] .cd-bottom-item[aria-current="page"] svg,html[data-cdata-app] .cd-bottom-item.is-active svg{background:var(--cd-soft)!important;color:var(--cd-deep)!important}
  html[data-cdata-app] .cd-bottom-item .cd-count{position:absolute;top:4px;left:calc(50% + 8px);margin:0!important;height:16px;min-width:16px;font-size:10px!important;line-height:16px!important;padding:0 4px}
  html[data-cdata-app] .cd-page-title{font-size:24px!important;line-height:32px!important}
  html[data-cdata-app] .cd-page-actions{width:100%}
  html[data-cdata-app] .cd-tab{height:44px!important}
}

/* =====================================================================
   TWO-TONE PALETTES (owner Sushant, Oct 18 2026 7:00 PM PT: a different two-tone
   palette per app, subtle gradient; replaces the lavender/mint/peach pastels).
   Fitness + console = Navy & Gold, Guest Suite = Teal & Sand, Connect = Forest & Cream.
   Each app: dark side menu / phone top bar / main buttons, light accent for the
   selected item, chip, avatar and badges. Status colours (red/amber/green) unchanged.
   The app's older navy tokens are remapped here so no old navy/light blue is left.
   ===================================================================== */
html[data-cdata-app="fitness"]{ /* Navy & Gold */ --pl-dark:#152B55; --pl-dark2:#2A4A80; --pl-accent:#D4AF5A; --pl-accent-strong:#B8902F; --pl-soft:#F6EED9; --pl-bg:#F5F6F8; }
html[data-cdata-app="console"]{ /* Navy & Gold */ --pl-dark:#152B55; --pl-dark2:#2A4A80; --pl-accent:#D4AF5A; --pl-accent-strong:#B8902F; --pl-soft:#F6EED9; --pl-bg:#F5F6F8; }
html[data-cdata-app="guestsuite"]{ /* Teal & Sand */ --pl-dark:#0E4D5A; --pl-dark2:#14606D; --pl-accent:#DCC7A1; --pl-accent-strong:#B89A66; --pl-soft:#F5EDDF; --pl-bg:#F7F6F3; }
html[data-cdata-app="connect"]{ /* Forest & Cream */ --pl-dark:#1E4636; --pl-dark2:#2A5C48; --pl-accent:#E6D9B5; --pl-accent-strong:#B8A266; --pl-soft:#F4EEDC; --pl-bg:#F7F6F1; }
html[data-cdata-app]{
  --cd-bg:var(--pl-bg); --cd-soft:var(--pl-soft); --cd-tint:var(--pl-accent); --cd-deep:var(--pl-dark);
  --cd-primary:var(--pl-dark); --cd-primary-hover:var(--pl-dark2);
  --pl-mid:color-mix(in srgb,var(--pl-accent) 45%,#fff); --pl-light:color-mix(in srgb,var(--pl-accent) 22%,#fff);
  /* older app tokens -> palette (Fitness/console/Connect --ds-*, Guest Suite --nh-*, Tailwind --color-*) */
  --ds-navy-950:var(--pl-dark); --ds-navy-900:var(--pl-dark); --ds-navy-800:var(--pl-dark); --ds-navy-700:var(--pl-dark2);
  --ds-navy-600:var(--pl-dark2); --ds-navy-500:var(--pl-dark2); --ds-navy-200:var(--pl-mid); --ds-navy-100:var(--pl-light); --ds-navy-50:var(--pl-soft);
  --nh-navy-950:var(--pl-dark); --nh-navy-900:var(--pl-dark); --nh-navy-800:var(--pl-dark); --nh-navy-700:var(--pl-dark2);
  --nh-navy-600:var(--pl-dark2); --nh-navy-500:var(--pl-dark2); --nh-navy-200:var(--pl-mid); --nh-navy-100:var(--pl-light); --nh-navy-50:var(--pl-soft);
  --color-navy:var(--pl-dark); --color-navy-soft:var(--pl-soft); --color-accent:var(--pl-dark); --color-accent-hover:var(--pl-dark2);
  --color-accent-300:var(--pl-mid); --color-accent-400:var(--pl-dark2); --color-accent-500:var(--pl-dark2); --color-accent-600:var(--pl-dark2);
  --color-accent-700:var(--pl-dark); --color-accent-800:var(--pl-dark); --color-accent-900:var(--pl-dark); --color-accent-950:var(--pl-dark);
  --sa-app-accent:var(--pl-dark2); --sa-app-accent-soft:var(--pl-soft);
}
html[data-cdata-app]:not(.dark){ --color-accent-50:var(--pl-soft); --color-accent-100:var(--pl-light); --color-accent-200:var(--pl-mid); }
html[data-cdata-app] #auth{--sa-app-accent:var(--pl-dark2);--sa-app-accent-soft:var(--pl-soft)}
html[data-cdata-app] .sa-btn:hover{background:var(--pl-soft)!important;border-color:var(--pl-dark2)!important}
/* page */
html[data-cdata-app] .cd-main{background:linear-gradient(180deg,var(--pl-soft) 0px,var(--pl-bg) 340px)!important;background-color:var(--pl-bg)!important}
html[data-cdata-app] .cd-app-bg{background:var(--pl-bg)!important}
/* dark side menu with a subtle top-to-bottom gradient */
html[data-cdata-app] .cd-sidebar{background:linear-gradient(180deg,var(--pl-dark) 0%,var(--pl-dark2) 100%)!important;border-right-color:transparent!important}
html[data-cdata-app] .cd-sidebar .cd-brand-name{color:#fff!important}
html[data-cdata-app] .cd-sidebar .cd-brand-tile{background:rgba(255,255,255,.14)!important;color:#fff!important}
/* a community logo in the square tile is shown whole on white (a wide wordmark was cut off by cover) */
html[data-cdata-app] .cd-brand-tile:has(img){background:#fff!important}
html[data-cdata-app] .cd-brand-tile img{object-fit:contain!important;background:#fff!important;padding:2px!important;box-sizing:border-box!important}
html[data-cdata-app] .cd-sidebar .cd-app-chip,html[data-cdata-app] .cd-topbar .cd-app-chip{background:var(--pl-accent)!important;color:var(--pl-dark)!important}
html[data-cdata-app] .cd-sidebar .cd-app-chip::before,html[data-cdata-app] .cd-topbar .cd-app-chip::before{background:var(--pl-dark)!important}
html[data-cdata-app] .cd-sidebar .cd-nav-item{color:rgba(255,255,255,.86)!important}
html[data-cdata-app] .cd-sidebar .cd-nav-item svg{color:rgba(255,255,255,.7)!important}
html[data-cdata-app] .cd-sidebar .cd-nav-item:hover{background:rgba(255,255,255,.08)!important;color:#fff!important}
html[data-cdata-app] .cd-sidebar .cd-nav-item[aria-current="page"],html[data-cdata-app] .cd-sidebar .cd-nav-item.is-active{background:var(--pl-accent)!important;color:var(--pl-dark)!important}
html[data-cdata-app] .cd-sidebar .cd-nav-item[aria-current="page"] svg,html[data-cdata-app] .cd-sidebar .cd-nav-item.is-active svg{color:var(--pl-dark)!important}
html[data-cdata-app] .cd-count{background:var(--pl-accent)!important;color:var(--pl-dark)!important}
html[data-cdata-app] .cd-sidebar .cd-nav-item.is-active .cd-count,html[data-cdata-app] .cd-sidebar .cd-nav-item[aria-current="page"] .cd-count{background:var(--pl-dark)!important;color:#fff!important}
html[data-cdata-app] .cd-side-foot,html[data-cdata-app] .cd-sidebar .cd-user{border-top-color:rgba(255,255,255,.16)!important}
html[data-cdata-app] .cd-sidebar .cd-user-name{color:#fff!important}
html[data-cdata-app] .cd-sidebar .cd-user-role{color:rgba(255,255,255,.78)!important}
html[data-cdata-app] .cd-sidebar .cd-avatar,html[data-cdata-app] .cd-topbar .cd-avatar{background:var(--pl-accent)!important;color:var(--pl-dark)!important}
html[data-cdata-app] .cd-sidebar .cd-signout,html[data-cdata-app] .cd-sidebar .cd-icon-btn{color:rgba(255,255,255,.8)!important}
html[data-cdata-app] .cd-sidebar .cd-signout:hover,html[data-cdata-app] .cd-sidebar .cd-icon-btn:hover{background:rgba(255,255,255,.08)!important;color:#fff!important}
html[data-cdata-app] .cd-tab[aria-selected="true"],html[data-cdata-app] .cd-tab.is-active{color:var(--pl-dark)!important;border-bottom-color:var(--pl-accent-strong)!important}
html[data-cdata-app] .cd-btn-primary{background:linear-gradient(135deg,var(--pl-dark) 0%,var(--pl-dark2) 100%)!important;border-color:var(--pl-dark)!important;color:#fff!important}
/* phone: dark top bar, accent behind the selected bottom-bar icon */
@media (max-width:1023px){
 html[data-cdata-app] .cd-topbar{background:linear-gradient(90deg,var(--pl-dark) 0%,var(--pl-dark2) 100%)!important;border-bottom-color:transparent!important}
 html[data-cdata-app] .cd-topbar .cd-brand-name{color:#fff!important}
 html[data-cdata-app] .cd-topbar .cd-brand-tile{background:rgba(255,255,255,.14)!important}
 html[data-cdata-app] .cd-topbar .cd-icon-btn{color:rgba(255,255,255,.88)!important}
 html[data-cdata-app] .cd-bottom-item[aria-current="page"],html[data-cdata-app] .cd-bottom-item.is-active{color:var(--pl-dark)!important}
 html[data-cdata-app] .cd-bottom-item[aria-current="page"] svg,html[data-cdata-app] .cd-bottom-item.is-active svg{background:var(--pl-soft)!important;color:var(--pl-dark)!important}
}
