/* Waypoint v3 — load AFTER waypoint-v2.css.
   1. One palette (--p0..--p3 / --pr0..--pr2) that waypoint-v3.js derives from the chosen accent colour,
      so the whole dashboard follows Settings > Appearance.
   2. A complete light theme (every token defined, no forced dark surfaces with dark text).
   3. One toggle style everywhere.  4. Compact, Home-style density on every page.  5. High-contrast option. */

:root{--on-accent:#fff;--ink:var(--p0);--wash:255 255 255}

/* ---------- DARK tokens (tinted by the accent) ---------- */
html[data-theme=dark]{
  --accent:var(--p1);--accent2:var(--p0);
  --bg:color-mix(in srgb,var(--p0) 10%,#05060f);
  --card:color-mix(in srgb,var(--p0) 16%,rgba(9,11,30,.74));
  --card2:color-mix(in srgb,var(--p0) 24%,rgba(12,14,38,.94));
  --text:#f4f3ff;--muted:#aab0d8;
  --soft:rgb(var(--pr1) / .12);--field:rgba(5,6,20,.7);
  --ln:rgb(var(--pr1) / .26);--glow:0 0 28px rgb(var(--pr1) / .38);
  --shadow:0 18px 44px -20px rgba(2,2,20,.85);--wash:255 255 255;
}
/* ---------- LIGHT tokens (complete) ---------- */
html[data-theme=light],html[data-theme=light][data-oled]{
  --accent:var(--p1);--accent2:var(--p0);
  --bg:color-mix(in srgb,var(--p1) 8%,#f7f8ff);
  --card:rgba(255,255,255,.94);--card2:#fff;
  --text:#171c3a;--muted:#4f5985;
  --soft:rgb(var(--pr0) / .09);--field:#fff;
  --ln:rgb(var(--pr0) / .22);--glow:0 6px 20px -8px rgb(var(--pr0) / .5);
  --shadow:0 10px 28px -18px rgb(var(--pr0) / .45);--wash:var(--pr0);
}
html[data-theme=light] body,html[data-theme=light][data-oled] body,html[data-theme=light][data-eco] body{background:var(--bg);color:var(--text)}
html[data-theme=light] .bg,html[data-theme=light][data-oled] .bg{opacity:1;
  background:radial-gradient(900px 520px at 88% -8%,rgb(var(--pr0) / .16),transparent 62%),
  radial-gradient(800px 480px at -6% 104%,rgb(var(--pr1) / .1),transparent 62%)!important}
html[data-theme=light] .orb{opacity:.1}

/* ---------- accent follows the picker everywhere ---------- */
html .nav .on,html .nav .active,html .nav [aria-current],html .tabs .on,html .tabs .active,html .pill-btn.on,
html .pills .on,html .pills .pill.on,html .btn:not(.ghost):not(.soft):not(.danger),html .btn.primary,
html .day.today,html .day2.today,html .day.sel,html .aim.me,html .aim.user,html .wp-chips button.on,
html .wp-ctabs button.on,html .wp-seg button.on,html input[type=file]::file-selector-button{color:var(--on-accent)!important}
html .btn:not(.ghost):not(.soft):not(.danger) svg{color:inherit}
html .logo{background:linear-gradient(135deg,var(--p1),var(--p0))!important}
html .helphero{background:linear-gradient(120deg,var(--p0),var(--p1))!important;box-shadow:0 24px 60px -24px rgb(var(--pr0) / .8)}
html .meter i,html .bar i,html .qbar i,html .hbar i,html .sbar i,html .bars i{background:linear-gradient(90deg,var(--p0),var(--p1))!important}
html .wp-wl i{background:linear-gradient(180deg,var(--p1),var(--p0))}
html .wp-lad .past i{background:var(--p0)}
.hm.l1{background:color-mix(in srgb,var(--p1) 38%,transparent)}
.hm.l2{background:color-mix(in srgb,var(--p1) 68%,transparent)}
html[data-theme=light] .hm.l4{background:var(--p0);box-shadow:none}
html[data-theme=light] :is(.link,.card h3 a){color:var(--ink)}

/* cards that used fixed purple now use the palette */
html .card.proj{background:linear-gradient(160deg,color-mix(in srgb,var(--p0) 72%,#0a0b22),color-mix(in srgb,var(--p0) 24%,#0a0b22))!important}
html .wp-mission{background:linear-gradient(120deg,color-mix(in srgb,var(--p0) 80%,#0a0b22),color-mix(in srgb,var(--p0) 28%,#0a0b22))!important}
html[data-theme=dark] .side{background:linear-gradient(180deg,color-mix(in srgb,var(--p0) 24%,#0b0c28),color-mix(in srgb,var(--p0) 8%,#05060f))!important}
html[data-theme=dark] .aichat{background:linear-gradient(180deg,color-mix(in srgb,var(--p0) 18%,rgba(9,11,34,.88)),rgba(5,6,20,.94))!important}

/* ---------- LIGHT: places v2 forced dark/white ---------- */
html[data-theme=light] .side{background:var(--card)!important;color:var(--text)}
html[data-theme=light] .side::before{background:radial-gradient(circle at 0% 0%,rgb(var(--pr1) / .12),transparent 55%)}
html[data-theme=light] .brand b,html[data-theme=light] .stat b,html[data-theme=light] .big{
  background:linear-gradient(135deg,var(--text),var(--p0));-webkit-background-clip:text;background-clip:text;color:transparent!important}
html[data-theme=light] .nav button:not(.on):hover,html[data-theme=light] .nav a:hover{color:var(--text)!important}
html[data-theme=light] .stat{background:var(--card)!important;color:var(--text)}
html[data-theme=light] .stat span,html[data-theme=light] .stat small{color:var(--muted)}
html[data-theme=light] .mbox,html[data-theme=light] .aichat,html[data-theme=light] .modal{
  --text:#171c3a;--muted:#4f5985;--field:#fff;--soft:rgb(var(--pr0) / .09);color:var(--text)}
html[data-theme=light] .aichat{background:var(--card)!important}
html[data-theme=light] .mbox{background:#fff!important}
html[data-theme=light] .wp-aitabs button.on{color:var(--text)}
html[data-theme=light] :is(.wp-chips button:hover,.wp-cx:hover){color:var(--text)}
html[data-theme=light] .wp-cx.warn{color:#b91c1c}
html[data-theme=light] .wp-pro,html[data-theme=light] .wp-st{--text:#fff}
html[data-theme=light][data-surface=matte] :is(.card,.wp-card,.trow,.stat,.side){background:#fff!important}
html[data-theme=light][data-surface=matte] .proj{background:linear-gradient(160deg,color-mix(in srgb,var(--p0) 72%,#0a0b22),color-mix(in srgb,var(--p0) 24%,#0a0b22))!important}
html[data-theme=light][data-oled] :is(.side,.mbox){background:var(--card)!important}
html[data-theme=light] .wp-sw button{background:#fff;color:var(--text)}
html[data-theme=dark][data-surface=matte] :is(.card,.wp-card,.trow,.stat,.side){background:color-mix(in srgb,var(--p0) 14%,#0b0c24)!important}
html[data-theme=light][data-eco] .bg{display:none!important}

/* ---------- ONE toggle style (native Calm switch + all .wp-tg rows) ---------- */
.switch,.wp-tg{position:relative;display:flex!important;align-items:center;justify-content:space-between;gap:16px;
  max-width:720px;padding:12px 2px!important;margin:0;border:0;border-top:1px solid var(--ln);border-radius:0;background:none!important;cursor:pointer}
.switch:first-child,.wp-tg:first-child{border-top:0}
.switch div b,.wp-tg b{display:block;color:var(--text);font-size:.95rem}
.switch div small,.wp-tg small{display:block;color:var(--muted);font-size:.82rem;line-height:1.35}
.switch input,.wp-tg input{display:block!important;position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.switch .tg,.wp-tg i{position:relative;flex:none;display:block;width:46px;height:26px;border-radius:99px;box-sizing:border-box;
  background:rgb(var(--wash) / .16)!important;box-shadow:inset 0 0 0 1.5px var(--ln);opacity:1!important;transition:background .2s,box-shadow .2s}
.switch .tg::after,.wp-tg i::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;
  background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.35);transform:translateX(0);transition:transform .22s var(--ease,ease)}
html .switch input:checked+.tg,html .wp-tg input:checked+i{background:linear-gradient(135deg,var(--p1),var(--p0))!important;box-shadow:var(--glow)}
html .switch input:checked+.tg::after,html .wp-tg input:checked+i::after{left:3px;transform:translateX(20px)}
.switch input:focus-visible+.tg,.wp-tg input:focus-visible+i{outline:2px solid var(--p2);outline-offset:3px}
html[data-eco] .switch .tg::after,html[data-eco] .wp-tg i::after{transition:none}

/* ---------- accent swatches ---------- */
.picks .sw{width:32px;height:32px}
.sw.on{box-shadow:0 0 0 3px var(--bg),0 0 0 5px var(--c)}

/* ---------- compact, Home-style density on every page ---------- */
.hbar{background:none!important;border-radius:0!important;box-shadow:none!important}   /* removes the oval blob behind "By priority" */
.hbar .meter{background:rgb(var(--wash) / .14)!important}
.wp-svg{display:block;width:100%;height:auto;max-height:230px}
.wp-row{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}
.stats{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))!important}
.pgrid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))!important;gap:12px!important}
.wp-split{grid-template-columns:minmax(0,1fr) 270px}
.content{max-width:none}
@media (min-width:1100px){
  .setwrap>div:last-child:has(.wp-env){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
  .setwrap>div:last-child:has(.wp-env)>.card.form{max-width:none}
}
@media (max-width:900px){.wp-row,.wp-split{grid-template-columns:1fr}}

/* ---------- High-contrast text option (Settings > Appearance) ---------- */
html[data-contrast][data-theme=dark]{--text:#ffffff;--muted:#dfe2fb;--ln:rgb(var(--pr1) / .5)}
html[data-contrast][data-theme=light]{--text:#080c1e;--muted:#262e55;--ln:rgb(var(--pr0) / .45)}
html[data-contrast] .wp-sub,html[data-contrast] small,html[data-contrast] .sub{color:var(--muted)}

/* ---------- page banners + gradient cards follow the accent; keep white overlays white on coloured surfaces ---------- */
html .wp-scene{background:linear-gradient(115deg,var(--p0),var(--p1))!important;box-shadow:0 18px 50px -26px rgb(var(--pr0) / .8);--wash:255 255 255}
html .wp-st b,html .wp-st p{color:var(--on-accent)}
html .wp-scene .wp-stk{background:rgba(255,255,255,.22)}
html .card.proj,html .wp-mission,html .hero,html .helphero,html .qcard{--wash:255 255 255}
html[data-theme=light] .lvl{color:var(--text)}
html[data-theme=light] .lvl .lb{background:rgb(var(--pr0) / .18)}
html[data-theme=light] .lvl .lb i{background:var(--p1)}
html[data-theme=light] #logout{color:var(--text)}
.switch div small,.wp-tg small{font-weight:400}
.form>.switch,.form>.wp-tg{margin-top:-6px}

/* ---------- strips that ended in a fixed dark navy now follow the theme ---------- */
html[data-theme=dark] :is(.wp-port,.wp-winsc){background:linear-gradient(120deg,rgb(var(--pr1) / .22),color-mix(in srgb,var(--p0) 12%,rgba(9,11,30,.78)))}
html[data-theme=light] :is(.wp-port,.wp-winsc){background:linear-gradient(120deg,rgb(var(--pr1) / .16),var(--card));color:var(--text)}
html[data-theme=light] .wp-daybar{background:linear-gradient(120deg,rgba(251,191,36,.2),var(--card));border-color:rgba(202,138,4,.45)}
html[data-theme=light] .wp-huge{background:linear-gradient(135deg,var(--text),var(--p0));-webkit-background-clip:text;background-clip:text}
html[data-theme=light] .proj .wp-pct,html[data-theme=light] .card.proj .wp-huge{background:linear-gradient(135deg,#fff,var(--p3));-webkit-background-clip:text;background-clip:text}


/* ================= v3.1 additions =================
   A. Custom RGB accent picker (Settings > Appearance)
   B. Workload "candles": equal columns, no overlap with the text above, one colour system */

/* ---------- A. RGB picker ---------- */
.wp-rgb{margin:4px 0 14px;max-width:720px;display:grid;gap:10px}
.wp-rgb-h{display:block;font-weight:700;font-size:.9rem;color:var(--text)}
.wp-rgb-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.wp-rgb-hexw{flex:0 1 130px}
.wp-rgb-hexw .field{padding:9px 12px;font-family:ui-monospace,Consolas,monospace;text-transform:lowercase}
.wp-rgb-hexw .field.bad{border-color:#ef4444}
#wpRgbPick{width:46px;height:38px;padding:0;border:2px solid var(--ln);border-radius:12px;background:none;cursor:pointer}
#wpRgbPick::-webkit-color-swatch-wrapper{padding:3px}
#wpRgbPick::-webkit-color-swatch{border:0;border-radius:8px}
#wpRgbPick::-moz-color-swatch{border:0;border-radius:8px}
.wp-rgb-row{display:grid;grid-template-columns:18px minmax(0,1fr) 68px;align-items:center;gap:12px}
.wp-rgb-row b{color:var(--muted);font-size:.85rem;text-align:center}
.wp-rgb-row .field{padding:7px 8px;text-align:center;font-size:.88rem}
.wp-rgb-row input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:12px;border-radius:99px;background:var(--g,var(--ln));box-shadow:inset 0 0 0 1.5px var(--ln);outline:none;cursor:pointer}
.wp-rgb-row input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;border-radius:50%;background:#fff;border:3px solid var(--p1);box-shadow:0 1px 4px rgba(0,0,0,.4)}
.wp-rgb-row input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#fff;border:3px solid var(--p1);box-shadow:0 1px 4px rgba(0,0,0,.4)}
.wp-rgb-row input[type=range]:focus-visible{outline:2px solid var(--p2);outline-offset:3px}
.wp-rgb-note{color:var(--muted);font-size:.8rem;line-height:1.35}

/* ---------- B. Workload candles ---------- */
.wp-wl{height:auto!important;align-items:flex-end;gap:10px;margin-top:14px;padding-top:2px}
.wp-wl>div{grid-template-rows:84px auto auto;align-items:end;justify-items:center;min-width:0}
.wp-wl>div>i{align-self:end;width:100%;max-width:38px}
.wp-wl>div>b{line-height:1.2}
html .wp-wl i{background:linear-gradient(180deg,var(--p1),var(--p0))}
html .wp-wl i.hot{background:linear-gradient(180deg,var(--p3),var(--p1) 45%,var(--p0));box-shadow:0 0 16px rgb(var(--pr1) / .55)}
html .wp-wl i.zero{background:rgb(var(--wash) / .18);box-shadow:none;height:4px!important;max-width:24px;border-radius:99px}
html[data-theme=light] .wp-wl i.zero{background:rgb(var(--pr0) / .28)}