/* Deep violet: one committed dark look (matches the lotus mark), whatever the system setting. */
:root:root:root{
  color-scheme:dark;
  --bg:#0a0614;
  --bg-2:#120b24;
  --tile:rgb(26 18 52 / .74);
  --tile-solid:#170f30;
  --tile-2:rgb(52 38 98 / .42);
  --line:rgb(150 120 255 / .14);
  --ink:#f3efff;
  --ink-2:#b9aee0;
  --ink-3:#8277ad;
  --accent:#a98bff;
  --accent-2:#7c4dff;
  --accent-soft:rgb(140 100 255 / .2);
  --on-accent:#ffffff;
  --good:#5ee0a0; --good-soft:rgb(70 210 140 / .14);
  --warn:#ffc46b; --warn-soft:rgb(255 190 90 / .14);
  --bad:#ff7a90;  --bad-soft:rgb(255 100 130 / .15);
  --info:#8cb8ff; --info-soft:rgb(120 160 255 / .15);
  --neutral-soft:rgb(160 140 230 / .12);
  --glow:rgb(150 110 255 / .45);
  /* glass bar */
  --glass-fill:rgb(34 22 70 / .5);
  --glass-edge:rgb(220 205 255 / .28);
  --glass-rim:rgb(170 140 255 / .18);
  --glass-shadow:0 18px 44px -10px rgb(5 0 20 / .85), 0 0 0 1px rgb(120 90 220 / .08), 0 8px 30px -12px rgb(124 77 255 / .35);
  --lens-fill:rgb(169 139 255 / .2);
  --tab-ink:#d9d0ff;
  --st-backlog:#8a80b3; --st-todo:#7aa2ff; --st-doing:#a98bff; --st-review:#ffc46b; --st-done:#5ee0a0;
}
html{background:var(--bg)}
body{background:transparent;color:var(--ink)}

/* ---------- aurora: soft light drifting behind everything ---------- */
.aurora{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:
  radial-gradient(120% 80% at 50% -10%, #1b0f3d 0%, transparent 60%), var(--bg)}
.aurora i{position:absolute;border-radius:50%;opacity:.55;will-change:transform}
.aurora i:nth-child(1){width:70vmax;height:70vmax;left:-20vmax;top:-30vmax;background:radial-gradient(closest-side, rgb(124 77 255 / .55), transparent);animation:drift1 38s ease-in-out infinite alternate}
.aurora i:nth-child(2){width:60vmax;height:60vmax;right:-25vmax;top:10vh;background:radial-gradient(closest-side, rgb(70 60 230 / .42), transparent);animation:drift2 46s ease-in-out infinite alternate}
.aurora i:nth-child(3){width:55vmax;height:55vmax;left:15vw;bottom:-35vmax;background:radial-gradient(closest-side, rgb(190 80 255 / .3), transparent);animation:drift3 52s ease-in-out infinite alternate}
.aurora::after{content:"";position:absolute;inset:0;background:radial-gradient(140% 100% at 50% 0%, transparent 40%, rgb(4 2 10 / .55));}
@keyframes drift1{to{transform:translate(18vmax,12vmax) scale(1.15)}}
@keyframes drift2{to{transform:translate(-16vmax,18vmax) scale(.9)}}
@keyframes drift3{to{transform:translate(-12vmax,-14vmax) scale(1.2)}}

/* ---------- surfaces ---------- */
.bar{background:rgb(10 6 20 / .55)!important;border-bottom-color:var(--line)!important}
.kpi,.panel,.card,.col,.task,.quick,.fchip,.col-chips button,.tools input,.tools select{border:1px solid var(--line)}
.kpi,.panel,.card{background:linear-gradient(180deg, rgb(255 255 255 / .045), rgb(255 255 255 / 0) 40%), var(--tile);box-shadow:inset 0 1px 0 rgb(255 255 255 / .05)}
.col{background:rgb(20 13 42 / .55)}
.task{background:linear-gradient(180deg, rgb(255 255 255 / .04), transparent 50%), rgb(32 22 64 / .8)}
.next,.stagelegend a{background:rgb(60 44 120 / .3)}
dialog{background:linear-gradient(180deg, rgb(255 255 255 / .04), transparent 30%), var(--tile-solid)!important;border:1px solid var(--line)!important;box-shadow:0 30px 80px -20px rgb(0 0 0 / .8), 0 0 60px -20px var(--glow)}
dialog::backdrop{background:rgb(6 2 16 / .62);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.me-menu{background:var(--tile-solid);box-shadow:0 24px 60px -18px rgb(0 0 0 / .8), 0 0 40px -18px var(--glow)}
.fld input,.fld select,.fld textarea,td select,.quick select{background:rgb(8 4 18 / .7);border-color:var(--line)}
.fld input:focus,.fld select:focus,.fld textarea:focus{border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft);outline:none}
.tabs,.seg{background:rgb(40 28 84 / .45);border:1px solid var(--line)}
.tab-ind,.seg-ind{background:linear-gradient(180deg, rgb(169 139 255 / .32), rgb(124 77 255 / .22));box-shadow:inset 0 1px 0 rgb(255 255 255 / .18), 0 4px 18px -6px var(--glow)}
.cur button[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.toast{background:var(--tile-solid);color:var(--ink);border:1px solid var(--line);box-shadow:0 12px 40px -10px rgb(0 0 0 / .8), 0 0 30px -10px var(--glow)}
.logo{box-shadow:inset 0 0 0 1px rgb(255 255 255 / .1), 0 6px 18px -8px rgb(0 0 0 / .6)}
.empty{border-color:var(--line);background:rgb(20 13 42 / .35)}
.prog,.track{background:rgb(120 90 220 / .16)}
.prog i,.track i{background:linear-gradient(90deg, var(--accent-2), var(--accent));box-shadow:0 0 12px -2px var(--glow)}
.stackbar i{box-shadow:0 0 14px -4px var(--st)}
.pill.accent{color:#cbb8ff}

/* gradient type for the big moments */
h1,.kpi .v{background:linear-gradient(180deg,#ffffff 30%,#c9b6ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.kpi .v .missing,.kpi .v small{-webkit-text-fill-color:currentColor}
.kpi .v small{color:var(--ink-3)}

/* primary buttons: violet gradient with a light sweep */
.btn:not(.ghost):not(.danger){background:linear-gradient(135deg,#9a74ff,#6c3cff);color:#fff;box-shadow:0 8px 24px -10px var(--glow), inset 0 1px 0 rgb(255 255 255 / .25);position:relative;overflow:hidden}
.btn:not(.ghost):not(.danger)::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg, transparent 30%, rgb(255 255 255 / .35) 50%, transparent 70%);transform:translateX(-120%);transition:transform .7s var(--ease-out)}
.btn:not(.ghost):not(.danger):hover::after{transform:translateX(120%)}
.btn.ghost{background:rgb(80 60 160 / .28);border:1px solid var(--line)}

/* ---------- motion ---------- */
/* lotus breathes */
.brand img{animation:lotus-breathe 5s ease-in-out infinite}
@keyframes lotus-breathe{0%,100%{filter:drop-shadow(0 0 0 rgb(150 110 255 / 0))}50%{filter:drop-shadow(0 0 10px rgb(150 110 255 / .65))}}

/* views settle in from a soft blur */
section.enter{animation:view-in .55s var(--ease-out)}
@keyframes view-in{from{filter:blur(8px);opacity:.35}}

/* cursor spotlight on cards and panels (position set from script) */
.card,.panel,.kpi{position:relative;isolation:isolate}
.card::after,.panel::after,.kpi::after{content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;z-index:-1;opacity:0;transition:opacity .35s;
  background:radial-gradient(360px circle at var(--mx,50%) var(--my,50%), rgb(169 139 255 / .16), transparent 60%)}
.card:hover::after,.panel:hover::after,.kpi:hover::after{opacity:1}
.card::before{content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;padding:1px;opacity:0;transition:opacity .35s;
  background:radial-gradient(260px circle at var(--mx,50%) var(--my,50%), rgb(190 165 255 / .7), transparent 60%);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.card:hover::before{opacity:1}
.card:hover{box-shadow:0 18px 40px -18px rgb(0 0 0 / .8), 0 0 40px -16px var(--glow)!important}

/* progress shimmer */
.prog i,.track i{position:relative;overflow:hidden}
.prog i::after,.track i::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgb(255 255 255 / .45),transparent);transform:translateX(-100%);animation:shimmer 3.6s ease-in-out infinite;animation-delay:calc(1.2s + var(--i,0) * .15s)}
@keyframes shimmer{0%{transform:translateX(-100%)}40%,100%{transform:translateX(100%)}}

/* online dots glow */
.pill.good .dot.pulse{box-shadow:0 0 8px var(--good)}

/* task advance: the chevron nudges forward */
.adv{background:rgb(120 90 220 / .22)}
.adv:hover svg{animation:nudge .6s var(--ease-out)}
@keyframes nudge{40%{transform:translateX(3px)}}
.adv:hover{background:linear-gradient(135deg,#9a74ff,#6c3cff);box-shadow:0 0 16px -4px var(--glow)}

/* stepper glow */
.stepper .now i{box-shadow:0 0 0 5px var(--accent-soft), 0 0 18px var(--glow)}

/* skeletons while the first data loads */
.skel{border-radius:var(--r);height:228px;background:linear-gradient(100deg, rgb(40 28 84 / .35) 30%, rgb(90 70 170 / .35) 50%, rgb(40 28 84 / .35) 70%);background-size:300% 100%;animation:skel 1.4s linear infinite;border:1px solid var(--line)}
@keyframes skel{to{background-position:-150% 0}}

/* glass bar picks up violet */
.gtabs button[aria-selected="true"]{color:#cdb9ff;text-shadow:0 0 14px var(--glow)}
.glens{background:linear-gradient(180deg, rgb(169 139 255 / .3), rgb(124 77 255 / .16))!important;box-shadow:inset 0 1px 0 rgb(255 255 255 / .25), 0 0 20px -6px var(--glow)!important}
.gplus{color:#fff!important;background:linear-gradient(135deg, rgb(154 116 255 / .75), rgb(108 60 255 / .7))!important}

@media (prefers-reduced-motion:reduce){
  .aurora i,.brand img,section.enter,.prog i::after,.track i::after,.skel,.adv:hover svg{animation:none!important}
  .btn::after{display:none}
}