/* projectplan · RAK — Desk-series theme layer (same themes, glass, depth, glass-sign sidebar and brand buttons as AE Desk / TL Desk / CEO Desk).
   Replaces theme-switcher.css, theme-plus.css and theme-sign.css. Loaded LAST (after theme-modern.css, ui-site.css, ui-budget.css, ui-ops.css).
   Themes = token sets on <html data-theme>: none = Indigo (plain), "slate" (default), "aurora", "sage", "ocean". Tokens are the AE Desk values
   (HSL triplets, shadcn names) mapped onto this app's --m-* / --sb-* vocabulary, so every existing rule follows the theme.
   Finishes: <html data-glass> Liquid Glass, <html data-sign> glass-sign sidebar, <html data-depth> sharper, deeper cards.
   Status colours (red / amber / green) are information and are never themed. */

/* =========================================================== tokens =========================================================== */
:root{
  /* Indigo (plain) — AE Desk :root */
  --background:226 33% 97%; --foreground:230 30% 14%; --card-c:0 0% 100%; --primary:243 75% 59%; --primary-foreground:0 0% 100%;
  --secondary:230 30% 95%; --muted:228 28% 95%; --muted-foreground:229 12% 44%; --accent:238 70% 96%; --accent-foreground:243 50% 35%;
  --border:228 24% 89%; --input:228 24% 86%; --ring:243 75% 59%; --radius:.625rem;
  --sb-bg:linear-gradient(180deg,#191731 0%,#1E1B4B 55%,#242060 100%); --sb-border-c:rgb(30 27 75 / .5);
  --sb-fg:#FFFFFF; --sb-fg-muted:rgb(224 231 255 / .72); --sb-section:rgb(199 210 254 / .62); --sb-divider:rgb(255 255 255 / .1);
  --sb-hover-bg:rgb(255 255 255 / .06); --sb-active-bg:rgb(255 255 255 / .12); --sb-active-fg:#FFFFFF; --sb-active-shadow:0 0 0 1px rgb(255 255 255 / .06);
  --sb-icon:rgb(199 210 254 / .55); --sb-icon-hover:#C7D2FE; --sb-icon-active:#A5B4FC; --sb-logo:linear-gradient(135deg,#818CF8,#4F46E5); --sb-logo-fg:#FFFFFF;
  --sb-count:#FF8A8A; --sb-glass:rgb(23 21 46 / .82);
  --cat-1:#4F46E5;--cat-2:#818CF8;--cat-3:#0D9488;--cat-4:#0284C7;--cat-5:#64748B;--cat-6:#A5B4FC;--cat-7:#312E81;--cat-8:#C7D2FE;
}
:root[data-theme="sage"]{
  --background:42 22% 92%; --foreground:150 14% 16%; --card-c:40 33% 98%; --primary:88 64% 22%; --primary-foreground:60 30% 97%;
  --secondary:147 23% 92%; --muted:44 20% 89%; --muted-foreground:206 8% 38%; --accent:147 23% 92%; --accent-foreground:88 64% 18%;
  --border:44 16% 85%; --input:44 16% 80%; --ring:88 64% 22%; --radius:.875rem;
  --sb-bg:#FFFFFF; --sb-border-c:#E6E1D6; --sb-fg:#2E3A33; --sb-fg-muted:#55625A; --sb-section:#7D6D4B; --sb-divider:#ECE7DC;
  --sb-hover-bg:#F3F1EA; --sb-active-bg:#E6EFEA; --sb-active-fg:#395917; --sb-active-shadow:none;
  --sb-icon:#8F9A92; --sb-icon-hover:#395917; --sb-icon-active:#395917; --sb-logo:linear-gradient(135deg,#6B8F2A,#395917);
  --sb-count:#B91C1C; --sb-glass:rgb(255 255 255 / .58);
  --cat-1:#395C14;--cat-2:#7FA24A;--cat-3:#C9B98C;--cat-4:#8C6D46;--cat-5:#4F7A6B;--cat-6:#A39170;--cat-7:#2C4810;--cat-8:#D8D2C2;
}
:root[data-theme="ocean"]{
  --background:204 55% 93%; --foreground:210 50% 12%; --card-c:204 60% 99%; --primary:201 90% 29%; --primary-foreground:0 0% 100%;
  --secondary:204 50% 90%; --muted:204 40% 90%; --muted-foreground:207 18% 38%; --accent:199 70% 90%; --accent-foreground:201 90% 22%;
  --border:205 40% 83%; --input:205 40% 78%; --ring:201 90% 35%; --radius:.75rem;
  --sb-bg:linear-gradient(180deg,#081E30 0%,#0A2540 55%,#0D3356 100%); --sb-border-c:rgb(8 30 48 / .6);
  --sb-active-bg:rgb(56 152 210 / .22); --sb-icon-active:#7CC4F0; --sb-icon-hover:#A9DBF7; --sb-logo:linear-gradient(135deg,#38BDF8,#0369A1);
  --sb-glass:rgb(8 30 48 / .82);
  --cat-1:#07618D;--cat-2:#38A3D8;--cat-3:#7CC4F0;--cat-4:#0E8A8A;--cat-5:#5B6CB5;--cat-6:#94A9BC;--cat-7:#0A2540;--cat-8:#C3D6E5;
}
:root[data-theme="slate"]{
  --background:220 9% 94%; --foreground:222 25% 11%; --card-c:0 0% 100%; --primary:222 25% 13%; --primary-foreground:0 0% 100%;
  --secondary:220 9% 90%; --muted:220 9% 91%; --muted-foreground:220 9% 40%; --accent:220 12% 90%; --accent-foreground:222 25% 13%;
  --border:220 9% 84%; --input:220 9% 78%; --ring:222 25% 30%; --radius:.375rem;
  --sb-bg:linear-gradient(180deg,#0B1220 0%,#0F172A 55%,#16213A 100%); --sb-border-c:rgb(15 23 42 / .7);
  --sb-active-bg:rgb(255 255 255 / .1); --sb-icon-active:#CBD5E1; --sb-icon-hover:#E2E8F0; --sb-logo:linear-gradient(135deg,#64748B,#0F172A);
  --sb-glass:rgb(11 18 32 / .84);
  --cat-1:#1A2133;--cat-2:#64748B;--cat-3:#0D9488;--cat-4:#0284C7;--cat-5:#94A3B8;--cat-6:#CBD5E1;--cat-7:#334155;--cat-8:#E2E8F0;
}
:root[data-theme="aurora"]{
  --background:248 60% 97%; --foreground:248 40% 13%; --card-c:0 0% 100%; --primary:256 80% 56%; --primary-foreground:0 0% 100%;
  --secondary:250 60% 95%; --muted:248 40% 95%; --muted-foreground:248 14% 42%; --accent:252 85% 96%; --accent-foreground:256 70% 38%;
  --border:248 30% 88%; --input:248 30% 84%; --ring:192 90% 42%; --radius:.9rem;
  --sb-bg:linear-gradient(180deg,#2A0F63 0%,#33237F 45%,#1D3F8F 100%); --sb-border-c:rgb(42 15 99 / .5);
  --sb-active-bg:linear-gradient(90deg,rgb(192 132 252 / .38),rgb(56 189 248 / .22)); --sb-active-shadow:inset 0 1px 0 rgb(255 255 255 / .18);
  --sb-icon:rgb(221 214 254 / .6); --sb-icon-hover:#E9D5FF; --sb-icon-active:#F0ABFC; --sb-section:rgb(221 214 254 / .62);
  --sb-logo:linear-gradient(135deg,#F472B6,#8B5CF6 50%,#22D3EE); --sb-fg-muted:rgb(237 233 254 / .78);
  --sb-glass:linear-gradient(180deg,rgb(42 15 99 / .86),rgb(51 35 127 / .84) 45%,rgb(29 63 143 / .84));
  --cat-1:#7C3AED;--cat-2:#22D3EE;--cat-3:#F472B6;--cat-4:#0EA5E9;--cat-5:#A78BFA;--cat-6:#FBBF24;--cat-7:#4C1D95;--cat-8:#DDD6FE;
}

/* map onto this app's vocabulary (theme-modern.css / app.css / ui-*.css read these) */
:root{
  --m-bg:hsl(var(--background)); --m-panel:hsl(var(--card-c)); --m-text:hsl(var(--foreground)); --m-muted:hsl(var(--muted-foreground));
  --m-subtle:hsl(var(--muted-foreground) / .75); --m-border:hsl(var(--border)); --m-border-soft:hsl(var(--border) / .6);
  --m-hover:hsl(var(--muted)); --m-active:hsl(var(--accent));
  --m-blue:hsl(var(--primary)); --m-blue-600:color-mix(in srgb,hsl(var(--primary)) 84%,#000); --m-blue-50:hsl(var(--accent)); --m-blue-200:color-mix(in srgb,hsl(var(--primary)) 28%,#fff);
  --m-radius:calc(var(--radius) + 6px); --m-radius-sm:calc(var(--radius) + 2px);
  --line:hsl(var(--border)); --muted:hsl(var(--muted-foreground)); --text:hsl(var(--foreground)); --card:hsl(var(--card-c)); --bg:hsl(var(--background)); --head:hsl(var(--muted));
  --navy:hsl(var(--foreground)); --blue:hsl(var(--primary));
  /* sidebar names used by the shell */
  --sb-item:var(--sb-fg-muted); --sb-muted:var(--sb-fg-muted); --sb-hover:var(--sb-hover-bg); --sb-border:var(--sb-divider);
  --sb-search-bg:rgb(255 255 255 / .06); --sb-search-border:rgb(255 255 255 / .14);
}
:root[data-theme="sage"]{--sb-search-bg:#FAF8F4; --sb-search-border:#E6E1D6}
html,body{overflow-x:clip}
body.modern{background:hsl(var(--background));color:hsl(var(--foreground))}
::selection{background:hsl(var(--primary) / .18)}

/* =========================================================== shell =========================================================== */
#main{background:hsl(var(--background));border-color:transparent}
#topbar{border-bottom-color:hsl(var(--border))}
.card,.ms-card,.plan-card,.modal{background:hsl(var(--card-c))}
.card,.ms-card,.plan-card{border-radius:var(--m-radius)}
.btn{border-radius:var(--m-radius-sm)}
.btn.primary{background:hsl(var(--primary));border-color:hsl(var(--primary));color:hsl(var(--primary-foreground))}
.btn.primary:hover{background:var(--m-blue-600);border-color:var(--m-blue-600)}

/* sidebar */
#sidebar{background:var(--sb-bg);color:var(--sb-fg)}
#sidebar .brand:hover,#sidebar .btn.user:hover{background:var(--sb-hover-bg)}
#sidebar .logo{background:var(--sb-logo);color:var(--sb-logo-fg)}
#sidebar .logo span{color:var(--sb-logo-fg)}
#sidebar .titles .t1{color:var(--sb-fg)}
#sidebar .titles .t2{color:var(--sb-fg-muted)}
.sb-search{background:var(--sb-search-bg);border-color:var(--sb-search-border);color:var(--sb-fg-muted)}
.sb-search:hover{color:var(--sb-fg);border-color:var(--sb-search-border)}
.sb-search kbd{background:transparent;border-color:var(--sb-search-border);color:var(--sb-fg-muted)}
.sb-search .pb-ai{color:var(--sb-fg)} .sb-search .pb-ask{color:var(--sb-fg-muted)} .sb-search .pb-ask b{color:var(--sb-fg)}
#tabs .nav-label,.sb-section .nav-label{color:var(--sb-section)}
#tabs button{color:var(--sb-fg-muted)}
#tabs button svg{color:var(--sb-icon)}
#tabs button:hover{background:var(--sb-hover-bg);color:var(--sb-fg)}
#tabs button:hover svg{color:var(--sb-icon-hover)}
#tabs button.active,#tabs button.active:hover{background:var(--sb-active-bg);color:var(--sb-active-fg);font-weight:500;box-shadow:var(--sb-active-shadow)}
#tabs button.active svg{color:var(--sb-icon-active)}
.ms-item{color:var(--sb-fg-muted)} .ms-item:hover{background:var(--sb-hover-bg)} .ms-item .when{color:var(--sb-fg-muted)}
.ms-item .lab{color:var(--sb-fg)}
.ms-item.late .when{color:var(--sb-count)}
.ms-item .ring circle:first-child{stroke:color-mix(in srgb,var(--sb-fg) 18%,transparent)}
.sb-section,.sb-foot{border-top-color:var(--sb-divider)}
#sidebar .btn.user{color:var(--sb-fg)}
#sidebar .btn.user .role{background:var(--sb-hover-bg);color:var(--sb-fg-muted)}
#sidebar .btn.user .avatar{background:var(--sb-logo);color:var(--sb-logo-fg)}
.sb-toggle{color:hsl(var(--muted-foreground))}

/* sidebar = still frame (ui-modern.js): nav list scrolls, milestones, user row and the credit stay pinned at the bottom, always visible */
#sidebar{overflow:hidden}
#sidebar>.sb-scroll{display:flex;flex-direction:column;gap:6px;flex:1 1 auto;min-height:0;overflow:hidden}   /* the nav list (#tabs) scrolls inside; milestones stay below it */
#tabs{scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--sb-fg) 22%,transparent) transparent}
#sidebar>.sb-foot{flex:none;margin-top:6px}

/* "Powered by PlusBrains" (rendered by ui-modern.js with [data-pb-credit], so nginx /pb-credit.js stands down) */
.pbc{display:flex;justify-content:center;align-items:center;gap:6px;font:400 10px/1.2 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:inherit;user-select:none;-webkit-user-select:none;box-sizing:border-box}
.pbc .pbc-by{opacity:.62}
.pbc .pbc-wm{display:inline-flex;align-items:center;gap:.35em;font-size:12px;line-height:1}
.pbc svg{width:1.15em;height:1.15em;flex:none;display:block}
.pbc b{font-weight:800;letter-spacing:-.02em}
.pbc i{font-family:"Instrument Serif",Georgia,"Times New Roman",serif;font-style:italic;font-weight:400;font-size:1.12em;color:#FF6A2B}
#sidebar>.pbc-sb{flex:none;width:100%;padding:8px 8px 4px;color:var(--sb-fg)}
.pbc-alt{display:none;width:100%;padding:14px 12px 20px;color:hsl(var(--foreground))}
body.sb-collapsed .pbc-alt{display:flex}
@media (max-width:900px){ .pbc-alt{display:flex;padding-bottom:84px} }   /* clear of the floating Ask button */
@media print{ .pbc-sb{display:none} }

/* =========================================================== theme menu =========================================================== */
.th-wrap{position:relative;flex-shrink:0}
#topbar,#topbar .hdr-right{overflow:visible}
.th-btn{display:inline-flex;align-items:center;gap:6px}
.th-btn svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.75}
.th-menu{position:absolute;right:0;top:calc(100% + 6px);z-index:80;width:264px;background:hsl(var(--card-c));border:1px solid hsl(var(--border));border-radius:12px;box-shadow:0 16px 40px rgb(0 0 0 / .16);padding:6px;display:none}
.th-menu.open{display:block}
.th-menu .th-h{font-size:11.5px;color:hsl(var(--muted-foreground));padding:6px 8px 4px;font-weight:500}
.th-item{display:flex;align-items:center;gap:10px;width:100%;border:0;background:transparent;border-radius:8px;padding:7px 8px;text-align:left;font-size:13px;color:hsl(var(--foreground));cursor:pointer}
.th-item:hover,.th-item:focus-visible{background:hsl(var(--accent));outline:none}
.th-item .dots{display:inline-flex;flex:none;width:36px}
.th-item .dots i{width:14px;height:14px;border-radius:50%;border:1px solid #fff;box-shadow:0 1px 2px rgb(0 0 0 / .18);display:block;margin-left:-4px}
.th-item .dots i:first-child{margin-left:0}
.th-item .lbl{flex:1;font-weight:500}.th-item .hint{display:block;font-size:11px;color:hsl(var(--muted-foreground));font-weight:400}
.th-item .ck{width:16px;height:16px;flex:none;color:hsl(var(--primary))}
.th-sep{height:1px;background:hsl(var(--border));margin:5px 2px}
.th-item .ic{width:16px;height:16px;flex:none;display:grid;place-items:center;color:hsl(var(--primary))}
.th-item .ic svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2}
.th-item .sw{width:28px;height:16px;flex:none;border-radius:9999px;padding:2px;background:hsl(var(--muted-foreground) / .3);transition:background .15s;box-sizing:border-box}
.th-item .sw i{display:block;width:12px;height:12px;border-radius:50%;background:#fff;transition:transform .15s;box-shadow:0 1px 2px rgb(0 0 0 / .2)}
.th-item[aria-checked="true"] .sw{background:hsl(var(--primary))}
.th-item[aria-checked="true"] .sw i{transform:translateX(12px)}
.th-sign-ic{position:relative;width:16px;height:16px;flex:none;border-radius:5px;background:#334155;box-shadow:2px 3px 0 rgb(116 192 198)}
.th-sign-ic i{position:absolute;width:4px;height:4px;border-radius:50%;background:#E2E8F0}
.th-sign-ic i:nth-child(1){left:2px;top:2px}.th-sign-ic i:nth-child(2){right:2px;top:2px}.th-sign-ic i:nth-child(3){left:2px;bottom:2px}.th-sign-ic i:nth-child(4){right:2px;bottom:2px}
@media (max-width:900px){ .th-btn span{display:none} #pill-rev,#pill-basis{display:none} #topbar .hdr-right .pill.plan{max-width:150px} #btn-undo{white-space:nowrap} }
@media (prefers-reduced-motion:reduce){ .th-item .sw,.th-item .sw i{transition:none} }

/* =========================================================== KPI tiles: separate cards, colour accents =========================================================== */
.site-kpis{gap:12px;background:transparent;border:0;border-radius:0;overflow:visible}
.site-kpis>div{background:hsl(var(--card-c));border:1px solid hsl(var(--border))!important;border-radius:var(--m-radius);padding:14px 16px;box-shadow:0 1px 2px rgb(0 0 0 / .04)}
@media (max-width:640px){
  .site-kpis,.site-kpis.fin-kpis,.site-kpis.fin-kpis.fin-5{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:10px;padding-bottom:4px;-webkit-overflow-scrolling:touch}
  .site-kpis>div{flex:0 0 76%;scroll-snap-align:start}
}
/* six accents that are not status colours */
:root{--acc-1:#2563EB;--acc-2:#0D9488;--acc-3:#D97706;--acc-4:#059669;--acc-5:#0284C7;--acc-6:#4F6D8F}
.site-kpis>div:nth-child(6n+1),.grid.g4>.card:nth-child(6n+1),.fin-dash-g>div:nth-child(6n+1),.fin-seed>div:nth-child(6n+1){--acc:var(--acc-1)}
.site-kpis>div:nth-child(6n+2),.grid.g4>.card:nth-child(6n+2),.fin-dash-g>div:nth-child(6n+2),.fin-seed>div:nth-child(6n+2){--acc:var(--acc-2)}
.site-kpis>div:nth-child(6n+3),.grid.g4>.card:nth-child(6n+3),.fin-dash-g>div:nth-child(6n+3),.fin-seed>div:nth-child(6n+3){--acc:var(--acc-3)}
.site-kpis>div:nth-child(6n+4),.grid.g4>.card:nth-child(6n+4),.fin-dash-g>div:nth-child(6n+4),.fin-seed>div:nth-child(6n+4){--acc:var(--acc-4)}
.site-kpis>div:nth-child(6n+5),.grid.g4>.card:nth-child(6n+5){--acc:var(--acc-5)}
.site-kpis>div:nth-child(6n+6),.grid.g4>.card:nth-child(6n+6){--acc:var(--acc-6)}
.card:not(.kpi):not(.ms-card):nth-child(6n+1){--acc:var(--acc-1)} .card:not(.kpi):not(.ms-card):nth-child(6n+2){--acc:var(--acc-2)} .card:not(.kpi):not(.ms-card):nth-child(6n+3){--acc:var(--acc-3)}
.card:not(.kpi):not(.ms-card):nth-child(6n+4){--acc:var(--acc-4)} .card:not(.kpi):not(.ms-card):nth-child(6n+5){--acc:var(--acc-5)} .card:not(.kpi):not(.ms-card):nth-child(6n+6){--acc:var(--acc-6)}
.site-kpis>div,.grid.g4>.card.kpi{position:relative;overflow:hidden;background:linear-gradient(180deg,color-mix(in srgb,var(--acc) 10%,hsl(var(--card-c))) 0%,hsl(var(--card-c)) 62%)}
.site-kpis>div::before,.grid.g4>.card.kpi::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,var(--acc),color-mix(in srgb,var(--acc) 45%,#fff))}
.site-kpis>div .l,.grid.g4>.card.kpi>h3{color:color-mix(in srgb,var(--acc) 78%,#111)}
.site-kpis .bar{background:color-mix(in srgb,var(--acc,#94A3B8) 14%,#fff)}
.site-kpis .bar i{background:var(--acc,hsl(var(--primary)))}
.fin-dash-g>div{border-left:3px solid var(--acc);padding-left:10px}
.fin-dash-g>div .l{color:color-mix(in srgb,var(--acc) 78%,#111)}
.fin-seed>div{background:linear-gradient(180deg,color-mix(in srgb,var(--acc,#94A3B8) 8%,#fff),#fff 70%)}
.card:not(.kpi):not(.ms-card)>h3:first-child{border-left:3px solid var(--acc,hsl(var(--primary)));padding-left:10px;margin-left:-2px}
.card:not(.kpi) .tb thead th{background:color-mix(in srgb,var(--acc,hsl(var(--primary))) 7%,#fff);color:color-mix(in srgb,var(--acc,hsl(var(--primary))) 60%,#333)}
.card .tb tr.tot td{background:color-mix(in srgb,var(--acc,hsl(var(--primary))) 6%,#FAFAFA)}
/* milestone status stripe: green OK, amber at risk, red late — in every theme */
.ms-card{border-left:4px solid var(--m-green)!important}
.ms-card.warn{border-left-color:var(--m-amber)!important}
.ms-card.late{border-left-color:var(--m-red)!important}
@media print{.site-kpis>div{box-shadow:none!important;background:#fff!important}}

/* =========================================================== Liquid Glass finish =========================================================== */
:root[data-glass] body.modern{background-color:hsl(var(--background));background-image:
    radial-gradient(1000px 650px at 10% -10%,hsl(var(--primary) / .4),transparent 58%),
    radial-gradient(820px 560px at 98% 8%,hsl(var(--ring) / .28),transparent 55%),
    radial-gradient(950px 760px at 60% 112%,hsl(var(--primary) / .3),transparent 62%),
    linear-gradient(165deg,hsl(var(--muted)),hsl(var(--background)) 45%,hsl(var(--muted)));background-attachment:fixed}
:root[data-glass][data-theme="slate"] body.modern{background-color:#ECEFF3;background-image:
    radial-gradient(900px 620px at 8% -10%,rgb(148 163 184 / .55),transparent 60%),radial-gradient(760px 540px at 96% 6%,rgb(125 211 252 / .28),transparent 58%),
    radial-gradient(820px 640px at 85% 100%,rgb(165 180 252 / .26),transparent 60%),radial-gradient(700px 560px at 15% 105%,rgb(203 213 225 / .6),transparent 60%),
    linear-gradient(160deg,#F1F4F8,#E8ECF2 50%,#F3F5F8)}
:root[data-glass][data-theme="aurora"] body.modern{background-color:#F3F1FD;background-image:
    radial-gradient(900px 620px at 6% -8%,rgb(167 139 250 / .55),transparent 60%),radial-gradient(760px 540px at 96% 4%,rgb(34 211 238 / .42),transparent 58%),
    radial-gradient(820px 640px at 88% 92%,rgb(244 114 182 / .38),transparent 60%),radial-gradient(760px 600px at 18% 104%,rgb(251 191 36 / .3),transparent 60%),
    linear-gradient(160deg,#F5F3FF,#EEF6FF 50%,#FDF2F8)}
:root[data-glass] #main{background:transparent;border-color:transparent;margin:0}
/* floating sidebar slab — dark sidebars stay dark glass */
:root[data-glass] #sidebar{top:12px;height:calc(100vh - 24px);margin:12px 0 12px 12px;border-radius:1.6rem;border:1px solid var(--sb-border-c);
  background:var(--sb-glass);-webkit-backdrop-filter:blur(26px) saturate(1.4);backdrop-filter:blur(26px) saturate(1.4);
  box-shadow:inset 0 1px 1px rgb(255 255 255 / .14),0 18px 40px -20px rgb(0 0 0 / .45)}
:root[data-glass][data-theme="sage"] #sidebar{border-color:rgb(255 255 255 / .85);-webkit-backdrop-filter:blur(26px) saturate(1.6);backdrop-filter:blur(26px) saturate(1.6);box-shadow:inset 0 1px 1px rgb(255 255 255 / .9),0 18px 40px -22px rgb(30 41 59 / .3)}
/* floating capsule top bar */
:root[data-glass] #topbar{position:sticky;top:10px;z-index:30;margin:10px 14px 4px;border-radius:9999px;border:1px solid rgb(255 255 255 / .6);height:52px;
  background:linear-gradient(135deg,rgb(255 255 255 / .66),rgb(255 255 255 / .40));-webkit-backdrop-filter:blur(22px) saturate(1.8);backdrop-filter:blur(22px) saturate(1.8);
  box-shadow:inset 0 1px 1px rgb(255 255 255 / .9),0 12px 30px -18px rgb(28 42 80 / .4)}
/* frosted panels with sheen + lensed edge */
:root[data-glass] .card,:root[data-glass] .ms-card,:root[data-glass] .plan-card,:root[data-glass] .modal,:root[data-glass] #chat-panel,:root[data-glass] .ops-site{
  background:linear-gradient(135deg,rgb(255 255 255 / .66),rgb(255 255 255 / .36) 45%,rgb(255 255 255 / .50));
  -webkit-backdrop-filter:blur(24px) saturate(1.8);backdrop-filter:blur(24px) saturate(1.8);border-color:rgb(255 255 255 / .65);border-radius:1.4rem;
  box-shadow:inset 0 1px 1px rgb(255 255 255 / .9),inset 1px 0 1px rgb(255 255 255 / .55),inset -1px -1px 1px rgb(255 255 255 / .12),inset 0 0 24px rgb(255 255 255 / .18),0 16px 36px -18px rgb(28 42 80 / .4)}
:root[data-glass] .site-kpis{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;border:0}
:root[data-glass] .site-kpis>div{background:linear-gradient(160deg,color-mix(in srgb,var(--acc) 16%,rgb(255 255 255 / .78)),rgb(255 255 255 / .55) 55%,rgb(255 255 255 / .70));
  -webkit-backdrop-filter:blur(18px) saturate(1.6);backdrop-filter:blur(18px) saturate(1.6);border-color:rgb(255 255 255 / .65)!important;border-radius:1.3rem;
  box-shadow:inset 0 1px 1px rgb(255 255 255 / .9),inset 1px 0 1px rgb(255 255 255 / .55),inset 0 0 18px rgb(255 255 255 / .18),0 12px 28px -18px rgb(28 42 80 / .4)}
/* menus stay readable: near-opaque even under glass */
:root[data-glass] .th-menu{background:rgb(255 255 255 / .97);-webkit-backdrop-filter:blur(30px) saturate(1.6);backdrop-filter:blur(30px) saturate(1.6);border-radius:1.1rem;border-color:rgb(255 255 255 / .8)}
:root[data-glass] .th-item{border-radius:.8rem}
/* capsules */
:root[data-glass] .btn,:root[data-glass] .pill,:root[data-glass] #tabs button,:root[data-glass] .sb-search,:root[data-glass] .ms-item,
:root[data-glass] input:not([type=checkbox]):not([type=radio]):not([type=range]),:root[data-glass] select,:root[data-glass] .tag{border-radius:9999px}
:root[data-glass] textarea{border-radius:1.1rem}
/* readable data — figures never sit on refraction */
:root[data-glass] table.tb,:root[data-glass] #gantt-wrap{background:rgb(255 255 255 / .86)}
:root[data-glass] .tb th,:root[data-glass] #gantt-left th{background:rgb(250 251 253 / .94)}
:root[data-glass] .card:not(.kpi) .tb thead th,:root[data-glass] .card:not(.kpi) .tb th{background:color-mix(in srgb,var(--acc,hsl(var(--primary))) 9%,rgb(250 251 253))}
:root[data-glass] #gantt-wrap{border-radius:1.1rem;border-color:rgb(255 255 255 / .7)}
:root[data-glass] .alert{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
:root[data-glass] #foot{border-top-color:transparent}
:root[data-glass] .btn.primary{box-shadow:inset 0 1px 0 rgb(255 255 255 / .35),0 8px 22px -10px color-mix(in srgb,hsl(var(--primary)) 60%,transparent)}
/* viscous motion */
:root[data-glass] .btn,:root[data-glass] #tabs button,:root[data-glass] .sb-search,:root[data-glass] .ms-item,:root[data-glass] .th-item{transition:background .2s cubic-bezier(.25,.9,.3,1),transform .2s cubic-bezier(.25,.9,.3,1),box-shadow .2s cubic-bezier(.25,.9,.3,1)}
:root[data-glass] .btn:active,:root[data-glass] #tabs button:active{transform:scale(.985)}
@media (max-width:900px){
  :root[data-glass] #sidebar{margin:0;top:0;height:100vh;border-radius:0 1.4rem 1.4rem 0}
  :root[data-glass] #topbar{border-radius:1.4rem;margin:8px;height:auto}
}
@media (prefers-reduced-motion:reduce){:root[data-glass] .btn,:root[data-glass] #tabs button,:root[data-glass] .sb-search,:root[data-glass] .ms-item,:root[data-glass] .th-item{transition:none}:root[data-glass] .btn:active,:root[data-glass] #tabs button:active{transform:none}}
@media print{:root[data-glass] body.modern{background:#fff}:root[data-glass] .card{background:#fff;box-shadow:none}}

/* =========================================================== depth: sharper, deeper cards (<html data-depth>) =========================================================== */
:root{
  --dp-hair:248 47% 14%;
  --dp-shadow:0 1px 2px rgb(30 20 80 / .10),0 4px 10px rgb(30 20 80 / .07),0 16px 30px -10px rgb(30 20 80 / .20),0 38px 64px -30px rgb(30 20 80 / .34);
  --dp-shadow-hover:0 2px 3px rgb(30 20 80 / .12),0 8px 16px rgb(30 20 80 / .09),0 22px 40px -12px rgb(30 20 80 / .26),0 46px 76px -30px rgb(30 20 80 / .40);
  --dp-hi:rgb(255 255 255 / .85);
}
:root[data-depth] .card:not(.ms-card),:root[data-depth] .site-kpis>div,:root[data-depth] .plan-card,:root[data-depth] .ops-site{border-color:hsl(var(--dp-hair) / .12)!important;
  box-shadow:inset 0 1px 0 var(--dp-hi),0 0 0 .5px hsl(var(--dp-hair) / .04),var(--dp-shadow)}
:root[data-depth] .ms-card{border-top-color:hsl(var(--dp-hair) / .12);border-right-color:hsl(var(--dp-hair) / .12);border-bottom-color:hsl(var(--dp-hair) / .12);
  box-shadow:inset 0 1px 0 var(--dp-hi),0 0 0 .5px hsl(var(--dp-hair) / .04),var(--dp-shadow)}
:root[data-depth] .site-kpis .l,:root[data-depth] .card h3 .sub{font-weight:500}
:root[data-depth] .card h3 .sub{color:hsl(var(--foreground) / .66)}
:root[data-depth] .site-kpis .v,:root[data-depth] .kpi .v{letter-spacing:-.015em}
:root[data-depth] .tb td{border-bottom-color:hsl(var(--dp-hair) / .07)}
:root[data-depth][data-glass] .card:not(.ms-card),:root[data-depth][data-glass] .ops-site{background:linear-gradient(160deg,rgb(255 255 255 / .90),rgb(255 255 255 / .72) 55%,rgb(255 255 255 / .82));border-color:rgb(255 255 255 / .95)!important;border-radius:1.4rem;
  box-shadow:inset 0 1px 1px rgb(255 255 255 / .95),inset 1px 0 1px rgb(255 255 255 / .6),inset 0 -1px 0 hsl(var(--dp-hair) / .05),0 0 0 .5px hsl(var(--dp-hair) / .08),var(--dp-shadow)}
:root[data-depth][data-glass] .site-kpis>div{background:linear-gradient(160deg,color-mix(in srgb,var(--acc) 16%,rgb(255 255 255 / .92)),rgb(255 255 255 / .78) 55%,rgb(255 255 255 / .88));border-color:rgb(255 255 255 / .95)!important;
  box-shadow:inset 0 1px 1px rgb(255 255 255 / .95),inset 1px 0 1px rgb(255 255 255 / .6),inset 0 -1px 0 hsl(var(--dp-hair) / .05),0 0 0 .5px hsl(var(--dp-hair) / .08),var(--dp-shadow)}
:root[data-depth][data-glass] .ms-card{background:linear-gradient(160deg,rgb(255 255 255 / .90),rgb(255 255 255 / .72) 55%,rgb(255 255 255 / .82));border-top-color:rgb(255 255 255 / .95);border-right-color:rgb(255 255 255 / .95);border-bottom-color:rgb(255 255 255 / .95)}
/* tiles and small cards lift on hover */
:root[data-depth] .site-kpis>div,:root[data-depth] .grid.g4>.card,:root[data-depth] .ms-card,:root[data-depth] .plan-card{transition:transform .25s cubic-bezier(.25,.9,.3,1),box-shadow .25s}
:root[data-depth] .site-kpis>div:hover,:root[data-depth] .grid.g4>.card:hover,:root[data-depth] .ms-card:hover,:root[data-depth] .plan-card:hover{transform:translateY(-3px);
  box-shadow:inset 0 1px 1px rgb(255 255 255 / .95),0 0 0 .5px hsl(var(--dp-hair) / .08),var(--dp-shadow-hover)}
@media (prefers-reduced-motion:reduce){:root[data-depth] .site-kpis>div,:root[data-depth] .grid.g4>.card,:root[data-depth] .ms-card,:root[data-depth] .plan-card{transition:none}
  :root[data-depth] .site-kpis>div:hover,:root[data-depth] .grid.g4>.card:hover,:root[data-depth] .ms-card:hover,:root[data-depth] .plan-card:hover{transform:none}}
@media print{:root[data-depth] .card,:root[data-depth] .site-kpis>div{box-shadow:none!important;background-image:none!important}}

/* =========================================================== glass-sign sidebar (<html data-sign>) =========================================================== */
:root{--sb-side:rgb(116 192 198);--sb-side2:rgb(74 152 162 / .88);--sb-lift:rgb(15 23 42 / .42);--sb-lift2:rgb(15 23 42 / .26)}
:root[data-theme="sage"]{--sb-side:rgb(132 204 208);--sb-side2:rgb(96 172 180 / .82);--sb-lift:rgb(30 41 59 / .26);--sb-lift2:rgb(30 41 59 / .16)}
.sb-screw{display:none}
@media (min-width:901px){   /* desktop only: the phone drawer stays plain so nothing peeks out when it is closed */
  :root[data-sign] #sidebar{top:12px;height:calc(100vh - 56px);margin:12px 0 12px 12px;border-radius:1.6rem;border:1px solid var(--sb-border-c);padding:30px 10px 26px;
    box-shadow:inset 0 0 0 1px rgb(140 214 220 / .32),inset 1px 1px 0 1px rgb(196 238 242 / .14),inset 0 -1px 0 rgb(0 0 0 / .3),inset 0 2px 18px rgb(255 255 255 / .05),
      1px 2px 0 0 var(--sb-side),2px 4px 0 0 var(--sb-side),3px 6px 0 -1px var(--sb-side2),
      6px 12px 16px -6px var(--sb-lift),16px 28px 36px -12px var(--sb-lift),28px 46px 64px -26px var(--sb-lift2)}
  :root[data-sign][data-theme="sage"] #sidebar{box-shadow:inset 0 0 0 1px rgb(116 192 198 / .38),inset 1px 1px 0 1px rgb(196 238 242 / .14),inset 0 -1px 0 rgb(0 0 0 / .06),inset 0 2px 18px rgb(255 255 255 / .05),
      1px 2px 0 0 var(--sb-side),2px 4px 0 0 var(--sb-side),3px 6px 0 -1px var(--sb-side2),
      6px 12px 16px -6px var(--sb-lift),16px 28px 36px -12px var(--sb-lift),28px 46px 64px -26px var(--sb-lift2)}
  :root[data-sign] #sidebar::before{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;z-index:0;background:linear-gradient(160deg,rgb(255 255 255 / .14),transparent 28%,transparent 70%,rgb(0 0 0 / .18))}
  :root[data-sign][data-theme="sage"] #sidebar::before{background:linear-gradient(160deg,rgb(255 255 255 / .16),transparent 28%,transparent 70%,rgb(0 0 0 / .05))}
  :root[data-sign] #sidebar>*{position:relative;z-index:1}
  :root[data-sign] #sidebar #tabs button{transition:transform .18s ease,box-shadow .18s ease,background .18s}
  :root[data-sign] #sidebar #tabs button:hover{transform:translateX(2px);box-shadow:0 6px 14px -8px rgb(0 0 0 / .55),inset 0 1px 0 rgb(255 255 255 / .1)}
  :root[data-sign] #sidebar #tabs button.active,:root[data-sign] #sidebar #tabs button.active:hover{box-shadow:inset 0 1px 0 rgb(255 255 255 / .25),inset 0 -2px 0 rgb(0 0 0 / .25),0 2px 0 rgb(0 0 0 / .35),0 10px 18px -8px rgb(0 0 0 / .6)}
  :root[data-sign][data-theme="sage"] #sidebar #tabs button:hover{box-shadow:0 6px 14px -9px rgb(15 23 42 / .3),inset 0 1px 0 rgb(255 255 255 / .6)}
  :root[data-sign][data-theme="sage"] #sidebar #tabs button.active,:root[data-sign][data-theme="sage"] #sidebar #tabs button.active:hover{box-shadow:inset 0 1px 0 #fff,inset 0 -2px 0 rgb(0 0 0 / .06),0 2px 0 rgb(0 0 0 / .08),0 10px 18px -10px rgb(0 0 0 / .3)}
  :root[data-sign] #sidebar .logo{box-shadow:inset 0 1px 0 rgb(255 255 255 / .35),inset 0 -2px 0 rgb(0 0 0 / .25),0 3px 0 rgb(0 0 0 / .35),0 8px 16px -6px rgb(0 0 0 / .55)}
  :root[data-sign] #sidebar .btn.user .avatar{box-shadow:inset 0 1px 0 rgb(255 255 255 / .3),0 2px 0 rgb(0 0 0 / .35),0 6px 12px -4px rgb(0 0 0 / .5)}
  :root[data-sign] #sidebar .sb-search{white-space:nowrap}
  /* standoff caps: brushed stainless */
  :root[data-sign] #sidebar>.sb-screw{display:block;position:absolute;z-index:3;width:18px;height:18px;border-radius:9999px;pointer-events:none;
    background:radial-gradient(circle at 36% 30%,rgb(255 255 255 / .95) 0,rgb(255 255 255 / 0) 42%),
      repeating-radial-gradient(circle at 50% 50%,rgb(255 255 255 / .16) 0 .6px,rgb(15 23 42 / .07) .6px 1.3px),
      linear-gradient(140deg,#F8FAFC 0%,#CBD5E1 35%,#8B97A6 62%,#D6DCE3 100%);
    box-shadow:inset 0 0 0 1.5px rgb(255 255 255 / .6),inset 0 -1.5px 2px rgb(15 23 42 / .35),0 0 0 1px rgb(15 23 42 / .75),0 0 0 2.5px rgb(203 213 225 / .28),2px 4px 6px rgb(0 0 0 / .55),1px 1px 1px rgb(0 0 0 / .4)}
  :root[data-sign][data-theme="sage"] #sidebar>.sb-screw{box-shadow:inset 0 0 0 1.5px rgb(255 255 255 / .7),inset 0 -1.5px 2px rgb(15 23 42 / .3),0 0 0 1px rgb(15 23 42 / .4),0 0 0 2.5px rgb(15 23 42 / .06),2px 4px 6px rgb(0 0 0 / .3)}
  :root[data-sign] #sidebar>.pbc-sb{padding:10px 8px 0}
}
@media (prefers-reduced-motion:reduce){ :root[data-sign] #sidebar #tabs button{transition:none} :root[data-sign] #sidebar #tabs button:hover{transform:none} }
@media print{ .sb-screw{display:none!important} }

/* =========================================================== raised 3D brand buttons =========================================================== */
/* "Powered by PlusBrains" wordmark: dark pill on dark sidebars, white pill on Sage */
.pbc a.pb-btn{display:inline-flex;align-items:center;gap:.35em;padding:4px 10px 4px 8px;border-radius:9999px;color:#fff;text-decoration:none;cursor:pointer;
  background:linear-gradient(180deg,#434B5C 0%,#2A303C 55%,#1D222C 100%);
  box-shadow:inset 0 1px 0 rgb(255 255 255 / .24),inset 0 -1px 0 rgb(0 0 0 / .35),0 2px 0 #0D1018,0 3px 0 rgb(13 16 24 / .55),0 7px 12px -3px rgb(0 0 0 / .6);
  transition:transform .12s ease,box-shadow .12s ease,filter .12s}
.pbc a.pb-btn:hover{filter:brightness(1.14)}
.pbc a.pb-btn:active{transform:translateY(2px);box-shadow:inset 0 1px 0 rgb(255 255 255 / .16),inset 0 -1px 0 rgb(0 0 0 / .3),0 0 0 #0D1018,0 2px 4px -1px rgb(0 0 0 / .55)}
.pbc a.pb-btn:focus-visible{outline:2px solid #FF6A2B;outline-offset:2px}
.pbc a.pb-btn svg{filter:drop-shadow(0 1px 0 rgb(0 0 0 / .45)) drop-shadow(0 1px 2px rgb(0 0 0 / .3))}
.pbc a.pb-btn b{text-shadow:0 1px 0 rgb(0 0 0 / .5)}
:root[data-theme="sage"] #sidebar .pbc a.pb-btn,.pbc-alt a.pb-btn{color:#1F2A24;background:linear-gradient(180deg,#FFFFFF 0%,#F1F4F2 60%,#E3E9E5 100%);
  box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 rgb(0 0 0 / .06),0 2px 0 #C5D0C8,0 3px 0 rgb(170 184 175 / .55),0 7px 12px -4px rgb(0 0 0 / .22)}
:root[data-theme="sage"] #sidebar .pbc a.pb-btn:active,.pbc-alt a.pb-btn:active{box-shadow:inset 0 1px 0 #fff,0 0 0 #C5D0C8,0 2px 4px -1px rgb(0 0 0 / .2)}
:root[data-theme="sage"] #sidebar .pbc a.pb-btn svg,.pbc-alt a.pb-btn svg{filter:drop-shadow(0 1px 0 rgb(255 255 255 / .8)) drop-shadow(0 1px 1px rgb(0 0 0 / .18))}
:root[data-theme="sage"] #sidebar .pbc a.pb-btn b,.pbc-alt a.pb-btn b{text-shadow:0 1px 0 #fff}
/* floating "Ask PlusBrains": raised dark pill that presses in */
#chat-fab{background:linear-gradient(180deg,#3D4452 0%,#22272F 55%,#16191F 100%)!important;border-color:#16191F!important;color:#fff;border-radius:9999px;
  box-shadow:inset 0 1px 0 rgb(255 255 255 / .24),inset 0 -1px 0 rgb(0 0 0 / .4),0 3px 0 #0A0C11,0 4px 0 rgb(10 12 17 / .55),0 10px 18px -4px rgb(0 0 0 / .5),0 18px 30px -12px rgb(0 0 0 / .35)!important;
  transition:transform .12s ease,box-shadow .12s ease,filter .12s}
#chat-fab:hover{background:linear-gradient(180deg,#3D4452 0%,#22272F 55%,#16191F 100%)!important;filter:brightness(1.15)}
#chat-fab:active{transform:translateY(3px);box-shadow:inset 0 1px 0 rgb(255 255 255 / .16),inset 0 -1px 0 rgb(0 0 0 / .35),0 0 0 #0A0C11,0 3px 6px -1px rgb(0 0 0 / .5)!important}
#chat-fab:focus-visible{outline:2px solid #FF6A2B;outline-offset:3px}
#chat-fab svg{filter:drop-shadow(0 1px 0 rgb(0 0 0 / .45)) drop-shadow(0 1px 2px rgb(0 0 0 / .3))}
#chat-fab .pb-ask b{text-shadow:0 1px 0 rgb(0 0 0 / .5)}
@media (prefers-reduced-motion:reduce){ .pbc a.pb-btn,#chat-fab{transition:none} .pbc a.pb-btn:active,#chat-fab:active{transform:none} }
@media print{ #chat-fab{display:none!important} }