/* ============================================================
   שור אנרגיה · design system — mobile-first, RTL, light + dark.
   ============================================================ */
:root{
  --bg-grad: linear-gradient(180deg,#eaf0f7 0%,#f5f8fc 60%);
  --bg-solid:#eef2f8;
  --surface:#ffffff;
  --surface-2:#f4f7fb;
  --line:#e4ebf3;
  --line-2:#eef2f7;
  --txt:#0d2036;
  --txt-2:#5b6b80;
  --txt-3:#94a3b5;
  --navy:#0a2540; --navy-2:#15558c;
  --brand:#16a34a; --brand-2:#15803d;
  --on-brand:#ffffff;
  --cyan:#0b8aa3;
  --solar:#d9810a; --solar-bg:#f7b13b;
  --green:#0a8f6b; --red:#d9415f; --amber:#d98a1f;
  --shadow:0 6px 20px -12px rgba(13,32,54,.30);
  --shadow-lg:0 22px 50px -22px rgba(13,32,54,.40);
  --radius:18px; --radius-sm:13px; --radius-lg:24px;
  --topbar-h:58px;
  --blur:saturate(1.1);
  --purple:#8a9690; --purple-2:#aab4ae; --mint:#16a34a; --lime:#65a30d; --teal:#0d9488; --orange:#ea7a1f;
  --card-grad: linear-gradient(155deg,#1f6b50,#134736);
  --hero-grad: linear-gradient(155deg,#b9ff5e,#86ee3c); --on-hero:#0a1808;
  --white-card:#ffffff; --on-white:#0d160f; --stat-card:#eef2f7;
}
:root[data-theme="dark"]{
  --bg-grad: radial-gradient(1000px 640px at 80% -16%, #16291c 0%, #0a0f0c 52%, #070a08 100%);
  --bg-solid:#080b09;
  --surface:rgba(20,26,22,.82);
  --surface-2:rgba(29,36,31,.72);
  --line:rgba(255,255,255,.06);
  --line-2:rgba(255,255,255,.04);
  --txt:#eef4ee; --txt-2:#98a89e; --txt-3:#5d6d63;
  --navy:#10301f; --navy-2:#18452d;
  --brand:#a6ff45; --brand-2:#7ae62f; --on-brand:#0a1808;
  --cyan:#3fdc9a; --solar:#a6ff45; --solar-bg:#a6ff45;
  --green:#65e84a; --mint:#9bff6a; --purple:#5e6e63; --purple-2:#82918690; --lime:#bef264; --teal:#3fdc9a;
  --red:#fb7185; --amber:#fbbf24; --orange:#fb923c;
  --shadow:0 20px 46px -26px rgba(0,0,0,.72);
  --shadow-lg:0 32px 66px -28px rgba(0,0,0,.8);
  --blur:blur(20px) saturate(1.15);
  --card-grad: linear-gradient(150deg,#1c3a26 0%,#122a1b 60%,#0c1d12 100%);
  --hero-grad: linear-gradient(155deg,#b9ff5e 0%,#8cef41 52%,#6ed92f 100%);
  --on-hero:#0a1808; --white-card:#eef2ec; --on-white:#0d160f; --stat-card:rgba(36,44,38,.72);
}

*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  font-family:'Heebo',system-ui,sans-serif;
  color:var(--txt);
  background:var(--bg-solid);
  background-image:var(--bg-grad);
  background-attachment:fixed;
  min-height:100vh;
  padding-bottom:84px;
  -webkit-tap-highlight-color:transparent;
}
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-thumb{background:rgba(120,140,170,.35);border-radius:9px}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
input,select,textarea{font-family:inherit}
.no-scroll{overflow:hidden}
svg.ic{width:20px;height:20px;flex:none}
svg.ic.big{width:30px;height:30px}
.muted{color:var(--txt-3)}
.shk{font-weight:800;font-size:1.15em;line-height:1}
.pos{color:var(--green)} .warn{color:var(--red)}

/* ---------- boot loader ---------- */
#boot{position:fixed;inset:0;z-index:200;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;
  background:radial-gradient(circle at 50% 42%,#0c1736,#050912 75%);transition:opacity .5s}
#boot.gone{opacity:0;pointer-events:none}
.boot-sun{width:74px;height:74px;border-radius:22px;display:grid;place-items:center;background:linear-gradient(145deg,#f7b13b,#ffc869);animation:breathe 1.7s ease-in-out infinite}
.boot-sun svg{width:42px;height:42px}
.boot-name{color:#eaf1fb;font-weight:800;letter-spacing:2px;font-size:1.2rem}
@keyframes breathe{0%,100%{transform:scale(1);box-shadow:0 0 22px -6px rgba(247,177,59,.5)}50%{transform:scale(1.06);box-shadow:0 0 44px -2px rgba(247,177,59,.55)}}

/* ============================================================
   CHROME
   ============================================================ */
.topbar{
  position:sticky;top:0;z-index:60;height:var(--topbar-h);
  display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 14px;
  background:color-mix(in srgb,var(--surface) 86%,transparent);
  backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);
  border-bottom:1px solid var(--line);
}
.logo-btn{display:flex;align-items:center;gap:10px}
.logo{width:38px;height:38px;border-radius:11px;flex:none;display:grid;place-items:center;background:linear-gradient(145deg,var(--solar-bg),#ffc869);box-shadow:0 6px 16px -8px rgba(247,177,59,.6)}
.logo svg{width:22px;height:22px;color:#3a2600}
.brand b{font-size:1.02rem;font-weight:800;letter-spacing:-.3px;display:block;line-height:1.1}
.brand small{font-size:.68rem;color:var(--txt-3)}
.top-actions{display:flex;align-items:center;gap:8px}
.icon-btn{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;color:var(--txt-2);border:1px solid var(--line);background:var(--surface-2)}
.icon-btn:active{transform:scale(.94)}
.user-chip{display:flex;align-items:center;gap:7px;padding:5px 10px 5px 6px;border-radius:999px;border:1px solid var(--line);background:var(--surface-2)}
.user-chip .uname{font-size:.84rem;font-weight:700}
.user-chip svg{width:15px;height:15px;color:var(--txt-3);transform:rotate(-90deg)}
.avatar{width:30px;height:30px;border-radius:50%;flex:none;display:grid;place-items:center;font-weight:800;font-size:.92rem;color:#fff;background:linear-gradient(145deg,var(--navy),var(--brand-2))}

.sidebar{display:none}

.botnav{
  position:fixed;left:0;right:0;bottom:0;z-index:70;
  display:flex;align-items:center;justify-content:space-around;gap:2px;
  padding:8px 6px calc(8px + env(safe-area-inset-bottom));
  background:color-mix(in srgb,var(--surface) 90%,transparent);
  backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);
  border-top:1px solid var(--line);
}
.bot-item{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;color:var(--txt-3);font-size:.66rem;font-weight:700;padding:4px 0}
.bot-item svg{width:23px;height:23px}
.bot-item.on{color:var(--brand)}
.bot-add{width:54px;height:54px;border-radius:50%;flex:none;display:grid;place-items:center;margin-top:-22px;
  background:linear-gradient(145deg,var(--navy),var(--brand-2));color:#fff;box-shadow:0 12px 24px -8px rgba(10,37,64,.55);border:3px solid var(--surface)}
.bot-add svg{width:26px;height:26px;stroke-width:2.6}
.bot-add:active{transform:scale(.93)}

/* ============================================================
   PRIMITIVES
   ============================================================ */
#content{min-height:60vh}
.pad{padding:16px 14px 26px;max-width:1160px;margin-inline:auto}
.screen{animation:fade .35s ease both}
@keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px;box-shadow:var(--shadow);
  backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);margin-bottom:14px}
.card-title{font-weight:800;font-size:.92rem;margin-bottom:10px;color:var(--txt-2)}
.msg-error{color:var(--red);border-color:color-mix(in srgb,var(--red) 40%,var(--line));font-weight:600}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;font-weight:700;font-size:.92rem;
  padding:12px 18px;border-radius:13px;transition:transform .12s, filter .15s;border:1px solid transparent}
.btn svg{width:18px;height:18px}
.btn:active{transform:scale(.97)}
.btn.sm{padding:8px 13px;font-size:.84rem;border-radius:11px}
.btn-primary{background:linear-gradient(145deg,var(--navy),var(--brand-2));color:#fff;box-shadow:0 10px 22px -12px rgba(10,37,64,.6)}
:root[data-theme="dark"] .btn-primary{background:linear-gradient(145deg,var(--brand),var(--brand-2));color:var(--on-brand)}
.btn-line{background:var(--surface);border-color:var(--line);color:var(--txt)}
.btn-ghost{background:var(--surface-2);color:var(--txt-2)}
.btn-danger{background:var(--red);color:#fff}
.btn-ghost.danger,.danger{color:var(--red)}
.link{color:var(--brand);font-weight:700;font-size:.85rem}
:root[data-theme="dark"] .link{color:var(--cyan)}

.badge{display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:999px;font-size:.76rem;font-weight:700;white-space:nowrap}
.badge i{width:7px;height:7px;border-radius:50%;flex:none}
.badge.lg{font-size:.82rem;padding:7px 13px}
.badge.sm{font-size:.7rem;padding:4px 9px}

.prog{height:7px;border-radius:99px;background:rgba(120,140,170,.18);overflow:hidden}
.prog i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--brand-2),var(--solar-bg));transition:width .8s cubic-bezier(.3,.8,.3,1)}

.empty{text-align:center;padding:30px 16px;color:var(--txt-3)}
.empty svg{width:38px;height:38px;margin-bottom:8px;opacity:.6}
.empty .et{font-weight:700;color:var(--txt-2)}
.empty .es{font-size:.85rem;margin-top:3px}

.sk-wrap{display:flex;flex-direction:column;gap:12px}
.sk-card{height:96px;border-radius:var(--radius);background:linear-gradient(100deg,var(--surface-2) 30%,var(--line-2) 50%,var(--surface-2) 70%);background-size:200% 100%;animation:shine 1.3s linear infinite}
.hero.sk{height:120px;border-radius:0 0 var(--radius-lg) var(--radius-lg);background:linear-gradient(100deg,#0a2540,#13355f);opacity:.5}
@keyframes shine{to{background-position:-200% 0}}

/* ---------- screen heads ---------- */
.screen-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 14px 6px;max-width:1160px;margin-inline:auto}
.sh-titles h2{font-size:1.4rem;font-weight:800;letter-spacing:-.5px}
.sh-sub{color:var(--txt-3);font-size:.82rem;margin-top:2px}
.block{margin-top:20px}
.block-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:11px}
.block-head h3{font-size:1.02rem;font-weight:800;display:flex;align-items:center;gap:7px}
.block-head h3 svg{width:18px;height:18px;color:var(--brand)}
.cards-col{display:flex;flex-direction:column;gap:12px}

/* ============================================================
   HOME
   ============================================================ */
.hero{background:linear-gradient(135deg,var(--navy),#13396a);color:#fff;padding:18px 16px 22px;border-radius:0 0 var(--radius-lg) var(--radius-lg);box-shadow:0 14px 30px -20px rgba(10,37,64,.6)}
.hero-row{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;max-width:1160px;margin-inline:auto}
.hero-greet{font-size:1.35rem;font-weight:800;letter-spacing:-.4px}
.hero-sub{font-size:.82rem;opacity:.82;margin-top:4px}
.hero-add{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:rgba(255,255,255,.16);color:#fff;flex:none}
.hero-add svg{width:22px;height:22px;stroke-width:2.5}

.kpi-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.kpi{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:14px;box-shadow:var(--shadow);backdrop-filter:var(--blur)}
.kpi-ic{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;margin-bottom:9px}
.kpi-ic svg{width:20px;height:20px}
.kpi-ic.cy{background:color-mix(in srgb,var(--cyan) 14%,transparent);color:var(--cyan)}
.kpi-ic.so{background:color-mix(in srgb,var(--solar-bg) 18%,transparent);color:var(--solar)}
.kpi-ic.gr{background:color-mix(in srgb,var(--green) 14%,transparent);color:var(--green)}
.kpi-ic.rd{background:color-mix(in srgb,var(--red) 14%,transparent);color:var(--red)}
.kpi-num{font-size:1.45rem;font-weight:800;letter-spacing:-.6px;line-height:1.1}
.kpi-label{color:var(--txt-2);font-size:.8rem;margin-top:3px;font-weight:600}
.kpi-sub{color:var(--txt-3);font-size:.72rem;margin-top:3px}

.upcoming{display:flex;flex-direction:column;gap:8px}
.up-row{display:flex;align-items:center;gap:12px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-sm);padding:12px 14px;box-shadow:var(--shadow);text-align:start}
.up-when{font-weight:800;font-size:.8rem;color:var(--brand);min-width:74px;flex:none}
.up-what{flex:1;display:flex;flex-direction:column}
.up-what b{font-size:.92rem} .up-what small{color:var(--txt-3);font-size:.78rem}
.up-chev svg{width:17px;height:17px;color:var(--txt-3);transform:rotate(180deg)}

/* ============================================================
   PROJECT CARD + KANBAN
   ============================================================ */
.pcard{display:block;text-align:start;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:15px;box-shadow:var(--shadow);backdrop-filter:var(--blur);transition:transform .12s,box-shadow .2s;width:100%}
.pcard:active{transform:scale(.99)}
.pcard-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}
.pcard-name{font-weight:800;font-size:1.02rem}
.pcard-sub{display:flex;align-items:center;gap:6px;color:var(--txt-2);font-size:.82rem;margin-bottom:11px}
.pcard-sub svg{width:15px;height:15px;color:var(--txt-3);flex:none}
.pcard-tags{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:12px}
.ptag{display:inline-flex;align-items:center;gap:5px;font-size:.76rem;font-weight:700;padding:5px 10px;border-radius:999px;background:var(--surface-2);color:var(--txt-2)}
.ptag svg{width:14px;height:14px}
.ptag.warn{background:color-mix(in srgb,var(--red) 12%,transparent);color:var(--red)}
.ptag.ok{background:color-mix(in srgb,var(--green) 13%,transparent);color:var(--green)}
.ptag.miss{background:color-mix(in srgb,var(--amber) 16%,transparent);color:var(--amber)}
.ptag.date{background:color-mix(in srgb,var(--brand) 11%,transparent);color:var(--brand)}
:root[data-theme="dark"] .ptag.date{color:var(--cyan)}

.proj-count{color:var(--txt-3);font-size:.82rem;font-weight:600;margin-bottom:10px}
.kanban{display:none}
.kan-col{flex:0 0 250px;display:flex;flex-direction:column;gap:10px}
.kan-head{display:flex;align-items:center;gap:8px;font-weight:800;font-size:.9rem;padding:9px 12px;background:var(--surface);border:1px solid var(--line);border-radius:12px}
.kan-dot{width:9px;height:9px;border-radius:50%;flex:none}
.kan-count{margin-inline-start:auto;background:var(--surface-2);color:var(--txt-3);font-size:.74rem;padding:2px 9px;border-radius:999px}
.kan-cards{display:flex;flex-direction:column;gap:9px}
.kcard{display:block;text-align:start;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:12px;box-shadow:var(--shadow);transition:transform .12s,border-color .15s}
.kcard:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--brand) 45%,var(--line))}
.kc-name{font-weight:800;font-size:.92rem;margin-bottom:4px}
.kc-meta{color:var(--txt-3);font-size:.76rem;margin-bottom:9px}
.kc-foot{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px}
.kc-amt{color:var(--solar);font-weight:800;font-size:.86rem}
.kc-miss{font-size:.7rem;font-weight:700;color:var(--amber);background:color-mix(in srgb,var(--amber) 15%,transparent);padding:2px 8px;border-radius:999px}

/* searchbar + chips */
.searchbar{display:flex;align-items:center;gap:9px;background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:10px 16px;box-shadow:var(--shadow);margin-bottom:12px}
.searchbar svg{width:18px;height:18px;color:var(--txt-3);flex:none}
.searchbar input{flex:1;border:none;background:none;color:var(--txt);font-size:.92rem;outline:none}
.chips{display:flex;gap:8px;overflow-x:auto;padding-bottom:8px;margin-bottom:6px;scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chip{flex:none;padding:8px 15px;border-radius:999px;font-size:.82rem;font-weight:700;color:var(--txt-2);background:var(--surface);border:1px solid var(--line);white-space:nowrap}
.chip.on{background:var(--navy);color:#fff;border-color:var(--navy)}
:root[data-theme="dark"] .chip.on{background:var(--brand);color:var(--on-brand);border-color:var(--brand)}
.sh-action span{display:inline}

/* ============================================================
   PROJECT DETAIL
   ============================================================ */
.pd-header{background:linear-gradient(135deg,var(--navy),#13396a);color:#fff;padding:14px 16px 18px;border-radius:0 0 var(--radius-lg) var(--radius-lg)}
.pd-header .back{display:inline-flex;align-items:center;gap:6px;color:rgba(255,255,255,.8);font-weight:700;font-size:.85rem;margin-bottom:12px}
.pd-header .back svg{width:16px;height:16px;transform:rotate(180deg)}
.pd-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}
.pd-name{font-size:1.4rem;font-weight:800;letter-spacing:-.4px}
.pd-num{font-size:.8rem;opacity:.78;margin-top:3px}
.pd-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:14px}
.pd-stat{background:rgba(255,255,255,.1);border-radius:12px;padding:9px 10px}
.pd-stat span{font-size:.68rem;opacity:.78;display:block}
.pd-stat b{font-size:.96rem;font-weight:800;display:block;margin-top:2px}
.pd-stat b.pos{color:#7ef0c8} .pd-stat b.warn{color:#ffb3bf}
.quick-actions{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
.quick-actions::-webkit-scrollbar{display:none}
.qa{flex:none;display:flex;flex-direction:column;align-items:center;gap:5px;min-width:64px;padding:10px 8px;border-radius:14px;background:rgba(255,255,255,.12);color:#fff;font-size:.72rem;font-weight:700}
.qa svg{width:20px;height:20px}
.qa:active{transform:scale(.95)}

.missing-card{background:color-mix(in srgb,var(--amber) 9%,var(--surface));border:1px solid color-mix(in srgb,var(--amber) 35%,var(--line));border-right:4px solid var(--amber);border-radius:var(--radius);padding:14px;box-shadow:var(--shadow)}
.missing-head{display:flex;align-items:center;gap:8px;font-size:.92rem;margin-bottom:10px;color:var(--txt)}
.missing-head svg{width:19px;height:19px;color:var(--amber)}
.missing-head span{color:var(--txt-3);font-size:.78rem;font-weight:500;margin-inline-start:auto}
.missing-list{display:flex;flex-direction:column;gap:7px}
.missing-item{display:flex;align-items:center;gap:10px;text-align:start;font-size:.9rem;font-weight:600;color:var(--txt);padding:4px 0}
.missing-item .ck{width:21px;height:21px;border-radius:7px;border:2px solid color-mix(in srgb,var(--amber) 60%,var(--line));flex:none}
.missing-item:active .ck{background:var(--amber)}
.missing-more{margin-top:8px;display:inline-block}

.tabs-bar{position:sticky;top:var(--topbar-h);z-index:30;background:color-mix(in srgb,var(--bg-solid) 90%,transparent);backdrop-filter:var(--blur);margin-top:14px}
.tabs{display:flex;gap:7px;overflow-x:auto;padding:10px 14px;max-width:1160px;margin-inline:auto;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tab{flex:none;display:flex;align-items:center;gap:6px;padding:9px 15px;border-radius:12px;font-weight:700;font-size:.86rem;color:var(--txt-2);background:var(--surface);border:1px solid var(--line)}
.tab.on{background:var(--navy);color:#fff;border-color:var(--navy)}
:root[data-theme="dark"] .tab.on{background:var(--brand);color:var(--on-brand);border-color:var(--brand)}
.tab-badge{font-style:normal;font-size:.7rem;background:color-mix(in srgb,var(--amber) 22%,transparent);color:var(--amber);padding:0 7px;border-radius:999px;font-weight:800}
.tab.on .tab-badge{background:rgba(255,255,255,.25);color:#fff}
.pane{display:none}
.pane.on{display:block;animation:fade .3s ease both}

.info-row{display:flex;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px dashed var(--line)}
.info-row:last-child{border-bottom:none}
.ir-k{color:var(--txt-2);font-size:.88rem}
.ir-v{font-weight:600;font-size:.9rem;text-align:end}
.ir-v a{color:var(--brand);font-weight:700}
.notes{color:var(--txt-2);line-height:1.7;font-size:.9rem;white-space:pre-wrap}
.row-actions{display:flex;gap:10px;margin-top:4px}
.row-actions .btn{flex:1}

/* stepper */
.stepper{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.step{flex:1;min-width:14px;height:8px}
.step i{display:block;height:8px;border-radius:99px;background:var(--line)}
.step.done i{background:var(--brand-2)}
.step.now i{background:var(--solar-bg);box-shadow:0 0 0 3px color-mix(in srgb,var(--solar-bg) 30%,transparent)}
.stepper-label{flex-basis:100%;margin-top:8px;font-size:.82rem;font-weight:700;color:var(--txt-2)}

/* checklist */
.ck-summary{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.ck-prog{flex:1}
.ck-prog-txt{font-size:.82rem;font-weight:700;color:var(--txt-2);white-space:nowrap}
.ck-group{margin-bottom:16px}
.ck-group-title{font-size:.8rem;font-weight:800;color:var(--txt-3);margin-bottom:8px}
.ck-item{display:flex;align-items:center;gap:11px;width:100%;text-align:start;background:var(--surface);border:1px solid var(--line);border-radius:13px;padding:12px 13px;margin-bottom:8px;box-shadow:var(--shadow);font-size:.9rem}
.ck-item .ck{width:23px;height:23px;border-radius:8px;border:2px solid var(--line);flex:none;display:grid;place-items:center;color:#fff}
.ck-item.done .ck{background:var(--green);border-color:var(--green)}
.ck-item.done .ck svg{width:14px;height:14px;stroke-width:3}
.ck-item.done .ck-title{color:var(--txt-3);text-decoration:line-through}
.ck-title{font-weight:600}
.ck-title .opt{color:var(--txt-3);font-style:normal;font-weight:500;font-size:.82em}

/* docs */
.docs-actions{display:flex;gap:9px;margin-bottom:14px}
.doc-group{margin-bottom:16px}
.doc-group-title{font-size:.82rem;font-weight:800;color:var(--txt-2);margin-bottom:9px}
.doc-group-title span{color:var(--txt-3);font-weight:600}
.doc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(108px,1fr));gap:10px}
.doc{position:relative;border-radius:13px;border:1px solid var(--line);background:var(--surface);overflow:hidden;box-shadow:var(--shadow)}
.doc.img{aspect-ratio:1}
.doc.img img{width:100%;height:100%;object-fit:cover;display:block}
.doc.img.noimg img{display:none}
.doc.img.noimg::after{content:"🖼";position:absolute;inset:0;display:grid;place-items:center;font-size:1.6rem;color:var(--txt-3);background:var(--surface-2)}
.doc.file{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:16px 8px;aspect-ratio:1;text-align:center;color:var(--brand)}
.doc.file svg{color:var(--brand)}
.doc-name{font-size:.74rem;color:var(--txt-2);font-weight:600;word-break:break-word;line-height:1.3}
.doc-del{position:absolute;top:6px;inset-inline-start:6px;width:26px;height:26px;border-radius:8px;display:grid;place-items:center;background:rgba(13,32,54,.6);color:#fff;opacity:0;transition:.15s}
.doc:hover .doc-del,.doc.img .doc-del{opacity:1}
.doc-del svg{width:14px;height:14px}

/* logs */
.log{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:14px;margin-bottom:10px;box-shadow:var(--shadow)}
.log-head{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.log-head b{font-size:.95rem}
.log-by{margin-inline-start:auto;font-size:.74rem;color:var(--txt-3);background:var(--surface-2);padding:2px 9px;border-radius:999px}
.log-workers{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
.wtag{display:inline-flex;align-items:center;gap:5px;background:color-mix(in srgb,var(--brand) 10%,transparent);color:var(--brand);font-size:.78rem;font-weight:700;padding:4px 10px;border-radius:999px}
:root[data-theme="dark"] .wtag{color:var(--cyan)}
.wtag.sm{font-size:.72rem;padding:3px 8px}
.wtag button{display:inline-grid;place-items:center}
.wtag button svg{width:12px;height:12px}
.log-sum{font-size:.9rem;line-height:1.6;margin-bottom:4px}
.log-line{display:flex;align-items:center;gap:7px;font-size:.84rem;color:var(--txt-2);margin-top:4px}
.log-line svg{width:15px;height:15px;color:var(--green);flex:none}
.log-line.issue{color:var(--red)} .log-line.issue svg{color:var(--red)}

/* payments */
.pay-summary{text-align:center}
.pay-bignums{display:flex;justify-content:space-around;gap:10px;margin-bottom:14px}
.pay-bignums span{font-size:.74rem;color:var(--txt-3);display:block}
.pay-bignums b{font-size:1.1rem;font-weight:800;display:block;margin-top:3px}
.pay-bar{margin-bottom:6px}
.pay-bar-txt{font-size:.8rem;color:var(--txt-2);font-weight:700;margin-bottom:14px}
.pay-row{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px dashed var(--line)}
.pay-row:last-child{border-bottom:none}
.pay-amt{font-weight:800;color:var(--green);font-size:.98rem;min-width:84px}
.pay-info{flex:1;display:flex;flex-direction:column}
.pay-info b{font-size:.88rem} .pay-info small{color:var(--txt-3);font-size:.78rem}
.pay-del{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;color:var(--txt-3)}
.pay-del svg{width:16px;height:16px}

/* timeline */
.timeline{position:relative;padding-inline-start:8px}
.tl-item{display:flex;gap:12px;padding-bottom:16px;position:relative}
.tl-item::before{content:"";position:absolute;inset-inline-start:18px;top:30px;bottom:-4px;width:2px;background:var(--line)}
.tl-item:last-child::before{display:none}
.tl-ic{width:38px;height:38px;border-radius:11px;flex:none;display:grid;place-items:center;background:color-mix(in srgb,var(--brand) 12%,transparent);color:var(--brand);z-index:1}
:root[data-theme="dark"] .tl-ic{color:var(--cyan)}
.tl-ic svg{width:18px;height:18px}
.tl-title{font-weight:700;font-size:.92rem}
.tl-meta{font-size:.78rem;color:var(--txt-3);margin-top:2px}

/* field + upload + picker */
.field-ctx .fc-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px}
.field-ctx .fc-top b{font-size:1.05rem}
.fc-sub{display:flex;align-items:center;gap:6px;color:var(--txt-2);font-size:.84rem}
.fc-sub svg{width:15px;height:15px;color:var(--txt-3)}
.field-actions{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin-top:14px}
.field-btn{display:flex;flex-direction:column;align-items:center;gap:9px;padding:20px 10px;border-radius:16px;background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow);font-weight:700;font-size:.86rem;color:var(--txt)}
.field-btn svg{width:26px;height:26px;color:var(--brand)}
.field-btn.prime{background:linear-gradient(145deg,var(--navy),var(--brand-2));color:#fff}
.field-btn.prime svg{color:#fff}
.field-btn:active{transform:scale(.97)}
.pick-row{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;text-align:start;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:14px;box-shadow:var(--shadow)}
.pick-row b{font-size:.96rem} .pick-row small{display:block;color:var(--txt-3);font-size:.8rem;margin-top:2px}
.big-upload{display:flex;flex-direction:column;align-items:center;gap:8px;width:100%;padding:34px 16px;border-radius:var(--radius);border:2px dashed color-mix(in srgb,var(--brand) 40%,var(--line));background:var(--surface);color:var(--brand);font-weight:700;box-shadow:var(--shadow)}
.big-upload b{font-size:1rem;color:var(--txt)} .big-upload span{font-size:.8rem;color:var(--txt-3);font-weight:500}
.big-upload svg{color:var(--brand)}

/* documents folders */
.folder-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.muted-grid{opacity:.6}
.folder{display:flex;flex-direction:column;align-items:flex-start;gap:6px;text-align:start;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px;box-shadow:var(--shadow)}
.folder svg{color:var(--solar)}
.folder b{font-size:.94rem} .folder span{font-size:.76rem;color:var(--txt-3)}
.folder.dim svg{color:var(--txt-3)}
.soon{font-size:.72rem;color:var(--txt-3);background:var(--surface-2);padding:3px 10px;border-radius:999px;font-weight:700}

/* payments list */
.collect-bar .cb-row{display:flex;justify-content:space-between;margin-bottom:8px;font-weight:700}
.pay-list{display:flex;flex-direction:column;gap:9px}
.pay-list-row{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;text-align:start;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:13px 15px;box-shadow:var(--shadow)}
.plr-main b{font-size:.94rem} .plr-main small{display:block;color:var(--txt-3);font-size:.78rem;margin-top:2px}
.plr-amt{font-weight:800;font-size:1rem}
.plr-amt svg{width:20px;height:20px;color:var(--green)}

/* ============================================================
   SHEETS / MODALS / TOAST / FORMS
   ============================================================ */
.sheet-ov{position:fixed;inset:0;z-index:120;background:rgba(8,15,32,.5);backdrop-filter:blur(2px);display:flex;align-items:flex-end;justify-content:center;opacity:0;transition:opacity .22s}
.sheet-ov.open{opacity:1}
.sheet{width:100%;max-width:560px;max-height:92vh;overflow-y:auto;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg) var(--radius-lg) 0 0;padding:8px 18px calc(20px + env(safe-area-inset-bottom));box-shadow:var(--shadow-lg);transform:translateY(100%);transition:transform .26s cubic-bezier(.22,.61,.36,1)}
.sheet-ov.open .sheet{transform:none}
.sheet-grab{width:42px;height:4px;border-radius:99px;background:var(--line);margin:6px auto 12px}
.sheet-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}
.sheet-title{font-size:1.15rem;font-weight:800}
.sheet-sub{font-size:.8rem;color:var(--txt-3);margin-top:2px}
.sheet-x{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;color:var(--txt-2);background:var(--surface-2)}
.sheet-x svg{width:18px;height:18px}
.sheet-actions{display:flex;gap:10px;margin-top:18px;position:sticky;bottom:0;background:var(--surface);padding-top:6px}
.sheet-actions .btn{flex:1}
.confirm-msg{font-size:.95rem;line-height:1.6;color:var(--txt-2)}

.fld{display:block;margin-bottom:13px}
.fld>span{display:block;font-size:.82rem;font-weight:700;color:var(--txt-2);margin-bottom:6px}
.fld input,.fld select,.fld textarea{width:100%;background:var(--surface-2);border:1.5px solid var(--line);border-radius:12px;padding:12px 13px;color:var(--txt);font-size:.95rem;outline:none;transition:border-color .15s}
.fld input:focus,.fld select:focus,.fld textarea:focus{border-color:var(--brand)}
.fld textarea{resize:vertical;min-height:62px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.hint{font-size:.82rem;color:var(--txt-3);background:var(--surface-2);border-radius:11px;padding:10px 13px;line-height:1.5;margin-top:4px}
.hint b{color:var(--txt)}
.chk{display:flex;align-items:center;gap:9px;font-size:.9rem;font-weight:600;margin-bottom:8px;cursor:pointer}
.chk input{width:20px;height:20px;accent-color:var(--brand)}

.stage-list{display:flex;flex-direction:column;gap:7px}
.stage-opt{display:flex;align-items:center;justify-content:space-between;width:100%;text-align:start;padding:13px 15px;border-radius:12px;background:var(--surface-2);border:1.5px solid var(--line);font-weight:700;font-size:.92rem}
.stage-opt.on{border-color:var(--brand);color:var(--brand);background:color-mix(in srgb,var(--brand) 8%,transparent)}
.stage-opt svg{width:18px;height:18px}

.wchips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:11px}
.wchip{padding:8px 13px;border-radius:999px;background:var(--surface-2);border:1.5px solid var(--line);font-size:.84rem;font-weight:700;color:var(--txt-2)}
.wchip.on{background:var(--brand);color:#fff;border-color:var(--brand)}
:root[data-theme="dark"] .wchip.on{color:var(--on-brand)}
.wchosen{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:11px}

.up-drop{display:flex;flex-direction:column;align-items:center;gap:6px;padding:26px 16px;border:2px dashed color-mix(in srgb,var(--brand) 40%,var(--line));border-radius:14px;color:var(--brand);text-align:center;margin-bottom:12px}
.up-label{font-weight:700;color:var(--txt)} .up-sub{font-size:.78rem;color:var(--txt-3)}
.up-thumb{display:flex;align-items:center;gap:11px;background:var(--surface-2);border-radius:12px;padding:10px;margin-bottom:12px}
.up-thumb img{width:54px;height:54px;border-radius:10px;object-fit:cover}
.up-thumb.file svg{width:34px;height:34px;color:var(--brand)}
.up-thumb span{font-size:.82rem;color:var(--txt-2);font-weight:600;word-break:break-all}

.add-grid{display:flex;flex-direction:column;gap:10px}
.add-row{display:flex;align-items:center;gap:13px;width:100%;text-align:start;padding:15px;border-radius:14px;background:var(--surface-2);border:1.5px solid var(--line)}
.add-row svg{width:24px;height:24px;color:var(--brand);flex:none}
.add-row b{font-size:.98rem;display:block} .add-row span{font-size:.8rem;color:var(--txt-3)}
.add-row.primary{background:linear-gradient(145deg,var(--navy),var(--brand-2));color:#fff}
.add-row.primary svg,.add-row.primary span{color:#fff}
.add-row.primary span{opacity:.85}
.add-row .avatar{width:42px;height:42px;font-size:1.1rem}

#toast{position:fixed;bottom:96px;left:50%;transform:translateX(-50%) translateY(20px);z-index:300;
  background:var(--navy);color:#fff;padding:12px 22px;border-radius:13px;font-weight:700;font-size:.9rem;
  box-shadow:var(--shadow-lg);opacity:0;pointer-events:none;transition:.28s;max-width:90vw;text-align:center}
#toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
#toast.err{background:var(--red)}
:root[data-theme="dark"] #toast{background:var(--brand);color:var(--on-brand)}
:root[data-theme="dark"] #toast.err{background:var(--red);color:#fff}

.only-desktop{display:none}

/* ============================================================
   DESKTOP
   ============================================================ */
@media (min-width:900px){
  body{padding-bottom:0;display:grid;grid-template-columns:92px 1fr;grid-template-areas:"sidebar topbar" "sidebar content";align-items:start}
  .topbar{grid-area:topbar;height:64px;--topbar-h:64px}
  .topbar .logo-btn{display:none}
  #content{grid-area:content;min-width:0}
  .botnav{display:none}
  .sidebar{grid-area:sidebar;display:flex;flex-direction:column;align-items:center;gap:12px;position:sticky;top:0;height:100vh;padding:18px 0;border-inline-end:1px solid var(--line);background:color-mix(in srgb,var(--surface) 60%,transparent);backdrop-filter:var(--blur)}
  .sidebar .logo-btn.big{margin-bottom:8px}
  .sidebar .logo-btn.big .brand{display:none}
  .sidebar .logo{width:46px;height:46px}
  .side-nav{display:flex;flex-direction:column;gap:9px;align-items:center}
  .side-item{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;color:var(--txt-2);background:transparent;transition:.18s}
  .side-item span{display:none}
  .side-item svg{width:21px;height:21px}
  .side-item:hover{background:var(--surface-2);color:var(--txt)}
  .side-item.on{background:linear-gradient(150deg,var(--brand),var(--brand-2));color:var(--on-brand);box-shadow:0 10px 22px -8px color-mix(in srgb,var(--brand) 55%,transparent)}
  .side-new{margin-top:auto;width:48px;height:48px;border-radius:50%;padding:0;gap:0;font-size:0}
  .side-new svg{width:22px;height:22px}
  .side-foot{display:none}

  .topbar{--topbar-h:64px}
  .tabs-bar{top:64px}
  .kpi-grid{grid-template-columns:repeat(4,1fr)}
  .hero{border-radius:var(--radius-lg);margin:16px 14px 0}
  .pd-header{border-radius:var(--radius-lg);margin:16px 14px 0}
  .only-mobile{display:none}
  .only-desktop{display:block}
  .kanban{display:flex;gap:14px;overflow-x:auto;padding-bottom:12px}
  .field-actions{grid-template-columns:repeat(4,1fr)}
  .sheet-ov{align-items:center}
  .sheet{border-radius:var(--radius-lg);max-height:88vh}
  .sheet-grab{display:none}
  #toast{bottom:30px}
  /* two-column detail panes on wide screens */
  .pane[data-pane="details"]{display:none}
  .pane[data-pane="details"].on{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:start}
  .pane[data-pane="details"].on .row-actions{grid-column:1/-1}
}
@media (min-width:1100px){
  .doc-grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr))}
}
/* ============================================================
   NEXUS DASHBOARD  (home redesign — fintech dark)
   ============================================================ */
.top-search{display:none;align-items:center;gap:9px;flex:1;max-width:440px;margin-inline:auto;padding:11px 18px;border-radius:999px;background:var(--surface-2);border:1px solid var(--line);color:var(--txt-3);font-size:.9rem;cursor:pointer}
.top-search svg{width:17px;height:17px}
.user-chip .greet{font-size:.7rem;color:var(--txt-3);display:block;line-height:1}

.dash-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}
.dash-head h1{font-size:1.55rem;font-weight:800;letter-spacing:-.6px}
.dash-pills{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none}
.dash-pills::-webkit-scrollbar{display:none}
.dpill{flex:none;padding:9px 17px;border-radius:999px;font-weight:700;font-size:.84rem;color:var(--txt-2);background:var(--surface);border:1px solid var(--line);transition:.15s}
.dpill.on{background:linear-gradient(150deg,var(--brand),var(--brand-2));color:var(--on-brand);border-color:transparent;box-shadow:0 8px 20px -10px color-mix(in srgb,var(--brand) 60%,transparent)}

.nx-grid{display:flex;flex-direction:column;gap:16px}
.nx-main,.nx-side,.nx-col2{display:flex;flex-direction:column;gap:16px}
.nx-row{display:flex;flex-direction:column;gap:16px}
.nx-card{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:18px;box-shadow:var(--shadow);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur)}
.nx-card-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.nx-card-h h3{font-size:1.02rem;font-weight:800}
.nx-viewall{display:inline-flex;align-items:center;gap:3px;color:var(--txt-3);font-size:.8rem;font-weight:700}
.nx-viewall:hover{color:var(--brand)}
.nx-viewall svg{width:14px;height:14px;transform:rotate(180deg)}

/* revenue bar chart */
.bar-chart svg{width:100%;height:auto;display:block;overflow:visible}
.bc-grid{stroke:var(--line);stroke-width:1}
.bc-ylbl{fill:var(--txt-3);font-size:10px}
.bc-xlbl{fill:var(--txt-3);font-size:11px;font-weight:600}
.bc-tiptxt{fill:#fff;font-size:12px;font-weight:800}

/* available donut */
.donut-row{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.donut-wrap{position:relative;width:148px;height:148px;flex:none}
.donut-wrap svg{width:148px;height:148px;display:block}
.donut-center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.donut-center b{font-size:1.15rem;font-weight:800;letter-spacing:-.5px}
.donut-center span{font-size:.68rem;color:var(--txt-3);margin-top:2px}
.donut-legend{flex:1;min-width:140px;display:flex;flex-direction:column;gap:12px}
.leg{display:flex;align-items:center;gap:9px;font-size:.85rem}
.leg i{width:11px;height:11px;border-radius:4px;flex:none}
.leg .lg-val{margin-inline-start:auto;font-weight:800}

/* income / expense mini cards */
.mini-kpi{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:16px;box-shadow:var(--shadow);backdrop-filter:var(--blur)}
.mk-top{display:flex;align-items:center;justify-content:space-between;color:var(--txt-2);font-size:.84rem;font-weight:600;margin-bottom:8px}
.mk-big{font-size:1.5rem;font-weight:800;letter-spacing:-.6px}
.mk-sub{font-size:.74rem;color:var(--txt-3);margin-top:6px}
.mk-badge{font-size:.72rem;font-weight:800;padding:3px 9px;border-radius:999px}
.mk-badge.up{color:var(--on-brand);background:var(--mint)}
.mk-badge.down{color:#fff;background:var(--purple)}

/* feature green card */
.feature-card{position:relative;overflow:hidden;border-radius:24px;padding:20px;color:#eafff6;background:var(--card-grad);box-shadow:0 24px 52px -24px rgba(8,44,30,.85)}
.feature-card::after{content:"";position:absolute;top:-45%;inset-inline-end:-12%;width:62%;height:130%;background:radial-gradient(circle,rgba(255,255,255,.18),transparent 70%);pointer-events:none}
.fc-h{display:flex;align-items:center;justify-content:space-between;position:relative;z-index:1}
.fc-h span{font-size:.86rem;opacity:.88;font-weight:600}
.fc-plus{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.2);color:#fff}
.fc-plus svg{width:18px;height:18px}
.fc-label{font-size:.78rem;opacity:.82;margin-top:20px}
.fc-balance{font-size:2.05rem;font-weight:800;letter-spacing:-1px;margin-top:2px}
.fc-divide{height:1px;background:rgba(255,255,255,.18);margin:16px 0 12px}
.fc-meta{display:flex;justify-content:space-between;font-size:.76rem;opacity:.85;position:relative;z-index:1}
.fc-meta b{display:block;font-size:.98rem;font-weight:800;opacity:1;margin-top:2px}

/* transactions / activity */
.tx-list{display:flex;flex-direction:column}
.tx-row{display:flex;align-items:center;gap:12px;padding:10px 4px;width:100%;text-align:start;border-bottom:1px solid var(--line-2)}
.tx-row:last-child{border-bottom:none}
.tx-ic{width:40px;height:40px;border-radius:13px;flex:none;display:grid;place-items:center}
.tx-ic svg{width:19px;height:19px}
.tx-main{flex:1;min-width:0}
.tx-main b{font-size:.9rem;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tx-main small{font-size:.75rem;color:var(--txt-3)}
.tx-amt{font-weight:800;font-size:.88rem;white-space:nowrap}
.tx-amt.neg{color:var(--purple-2)} .tx-amt.pos{color:var(--mint)}

/* sparkline + upcoming on dashboard */
.spark-card{display:flex;align-items:flex-end;justify-content:space-between;gap:12px}
.spark-card .sc-l b{font-size:1.2rem;font-weight:800;display:block}
.spark-card .sc-l span{font-size:.76rem;color:var(--txt-3)}
.spark-card svg{width:120px;height:48px;overflow:visible}
.dash-up{display:flex;flex-direction:column;gap:2px}
.dash-up .up-row{border:none;background:transparent;box-shadow:none;padding:9px 2px;border-bottom:1px solid var(--line-2);border-radius:0}
.dash-up .up-row:last-child{border-bottom:none}

@media (min-width:900px){
  .top-search{display:flex}
  .nx-grid{display:grid;grid-template-columns:1fr 358px;gap:18px;align-items:start}
  .nx-row{display:grid;grid-template-columns:1.25fr 1fr;gap:16px}
}

/* ============================================================
   SOLAR-TECH CONTROL CENTER  (dashboard v2 · "Empower")
   ============================================================ */
.dash2{display:flex;flex-direction:column;gap:16px}
.dash-row{display:flex;flex-direction:column;gap:14px}
.gauge-row{display:grid;grid-template-columns:1fr;gap:14px}
.combo-row{display:grid;grid-template-columns:1fr;gap:14px}
.stat-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.dash2-main,.dash2-bottom{display:flex;flex-direction:column;gap:16px}

/* roadmap / stage pipeline */
.roadmap{display:flex;align-items:flex-start;overflow-x:auto;scrollbar-width:none;padding:4px 0 2px}
.roadmap::-webkit-scrollbar{display:none}
.rm-node{flex:1 0 auto;min-width:104px;display:flex;flex-direction:column;align-items:center;text-align:center;position:relative}
.rm-node::before{content:"";position:absolute;top:13px;inset-inline-start:50%;width:100%;height:2px;background:var(--line)}
.rm-node:first-child::before{display:none}
.rm-node.done::before{background:var(--brand)}
.rm-dot{width:28px;height:28px;border-radius:50%;background:var(--surface-2);border:2px solid var(--line);display:grid;place-items:center;z-index:1;color:var(--txt-3);font-weight:800;font-size:.8rem}
.rm-node.done .rm-dot{background:var(--brand);border-color:var(--brand);color:var(--on-brand)}
.rm-node.cur .rm-dot{background:transparent;border-color:var(--brand);color:var(--brand);box-shadow:0 0 0 4px color-mix(in srgb,var(--brand) 22%,transparent)}
.rm-lbl{font-size:.72rem;color:var(--txt-2);margin-top:8px;font-weight:600;line-height:1.3;max-width:96px}
.rm-cnt b{color:var(--brand);font-weight:800}

/* gauge KPI cards */
.gauge-card{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:15px 16px;box-shadow:var(--shadow);backdrop-filter:var(--blur);display:flex;align-items:center;gap:14px}
.gauge-ring{position:relative;width:60px;height:60px;flex:none}
.gauge-ring svg{width:60px;height:60px;transform:rotate(-90deg)}
.gr-track{fill:none;stroke:var(--line);stroke-width:7}
.gr-prog{fill:none;stroke-width:7;stroke-linecap:round;transition:stroke-dashoffset 1.1s cubic-bezier(.3,.8,.3,1)}
.gr-ic{position:absolute;inset:0;display:grid;place-items:center}
.gr-ic svg{width:20px;height:20px;transform:none}
.gm-num{font-size:1.55rem;font-weight:800;letter-spacing:-.6px;line-height:1}
.gm-lbl{font-size:.8rem;color:var(--txt-2);margin-top:5px;font-weight:600}

/* area chart card */
.area-card{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:18px;box-shadow:var(--shadow);backdrop-filter:var(--blur);display:flex;flex-direction:column}
.area-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:8px}
.ah-lbl{font-size:.9rem;color:var(--txt-2);font-weight:600;max-width:160px;line-height:1.4}
.ah-big{font-size:1.9rem;font-weight:800;color:var(--brand);letter-spacing:-1px;white-space:nowrap}
.area-chart{margin-top:auto}
.area-chart svg{width:100%;height:auto;display:block;overflow:visible}
.ac-x{fill:var(--txt-3);font-size:10px;font-weight:600}
.area-line{stroke-dasharray:1400;stroke-dashoffset:1400;animation:drawLine 1.5s ease .25s forwards}

/* bright green hero card */
.hero-green{position:relative;overflow:hidden;border-radius:24px;padding:18px 20px;background:var(--hero-grad);color:var(--on-hero);box-shadow:0 22px 48px -24px rgba(122,230,47,.45);display:flex;flex-direction:column;min-height:172px}
.hg-top{display:flex;align-items:center;justify-content:space-between;font-weight:700;font-size:.85rem}
.hg-tag{background:rgba(10,24,8,.16);padding:3px 10px;border-radius:999px;font-size:.72rem;font-weight:800}
.hg-pct{font-size:2.6rem;font-weight:900;letter-spacing:-1.6px;margin-top:auto;line-height:1}
.hg-sub{font-size:.76rem;opacity:.72;font-weight:700;margin-top:2px}
.hg-bars{display:flex;gap:6px;align-items:flex-end;height:40px;margin-top:12px}
.hg-bar{flex:1;min-height:5px;background:rgba(8,22,6,.24);border-radius:6px 6px 4px 4px;transform-origin:bottom;animation:growBar .7s cubic-bezier(.2,.7,.2,1) both}
.hg-bar.on{background:rgba(8,22,6,.85)}

/* white contrast card */
.white-card{background:var(--white-card);color:var(--on-white);border-radius:24px;padding:18px;box-shadow:var(--shadow);display:flex;flex-direction:column;min-height:172px}
.wc-top{display:flex;align-items:center;justify-content:space-between;color:#5b6b62;font-size:.85rem;font-weight:600}
.wc-big{font-size:1.85rem;font-weight:800;letter-spacing:-1px;margin-top:auto}
.wc-sub{font-size:.76rem;color:#7a8a80;margin-top:2px}
.wc-badge{font-size:.74rem;font-weight:800;padding:3px 10px;border-radius:999px;background:#e7f8ea;color:#15803d}
.wc-badge.down{background:#fdeaea;color:#c0392b}
.ah-big.down{color:var(--txt-2)}
.wc-bars{display:flex;gap:5px;align-items:flex-end;height:34px;margin-top:12px}
.wc-bar{flex:1;min-height:5px;background:#dde6df;border-radius:5px;transform-origin:bottom;animation:growBar .7s cubic-bezier(.2,.7,.2,1) both}
.wc-bar.on{background:#15803d}

/* gray stat cards */
.stat-card{background:var(--stat-card);border:1px solid var(--line);border-radius:18px;padding:14px 15px;box-shadow:var(--shadow);backdrop-filter:var(--blur)}
.sc-top{display:flex;align-items:center;justify-content:space-between;color:var(--txt-2);font-size:.79rem;font-weight:600}
.sc-dot{width:9px;height:9px;border-radius:3px}
.sc-num{font-size:1.4rem;font-weight:800;margin-top:9px;letter-spacing:-.5px}
.sc-sub{font-size:.72rem;color:var(--txt-3);margin-top:3px}

/* recommendations / needs-attention */
.reco-list{display:flex;flex-direction:column;gap:9px}
.reco-row{display:flex;align-items:center;gap:12px;width:100%;text-align:start;background:var(--surface-2);border:1px solid var(--line);border-radius:14px;padding:11px 13px;transition:.15s}
.reco-row:hover{border-color:color-mix(in srgb,var(--brand) 40%,var(--line))}
.reco-ic{width:38px;height:38px;border-radius:11px;flex:none;display:grid;place-items:center}
.reco-ic svg{width:18px;height:18px}
.reco-main{flex:1;min-width:0}
.reco-main b{font-size:.9rem;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.reco-main small{font-size:.75rem;color:var(--txt-3)}
.reco-cta{font-size:.74rem;font-weight:800;color:var(--brand);white-space:nowrap;display:flex;align-items:center;gap:3px}
.reco-cta svg{width:13px;height:13px;transform:rotate(180deg)}

/* motion */
.rise{opacity:0;animation:riseIn .55s cubic-bezier(.2,.7,.2,1) forwards}
@keyframes riseIn{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:none}}
@keyframes growBar{from{transform:scaleY(.02)}to{transform:scaleY(1)}}
@keyframes drawLine{to{stroke-dashoffset:0}}
@keyframes glowPulse{0%,100%{box-shadow:0 10px 22px -10px rgba(166,255,69,.25)}50%{box-shadow:0 10px 30px -6px rgba(166,255,69,.6)}}
.bot-add,.side-new,.fc-plus{animation:glowPulse 3.4s ease-in-out infinite}

@media (min-width:900px){
  .gauge-row{grid-template-columns:repeat(3,1fr)}
  .combo-row{grid-template-columns:1fr 1fr}
  .stat-row{grid-template-columns:repeat(4,1fr)}
  .dash2-main{display:grid;grid-template-columns:1.5fr 1fr;align-items:stretch}
  .dash2-main>.area-card{height:100%}
  .dash2-bottom{display:grid;grid-template-columns:1.5fr 1fr;align-items:start}
}

@media (prefers-reduced-motion:reduce){*{animation-duration:.001s!important;transition-duration:.001s!important}}