/* ===========================================================
   Evensteer Desk — brand layer (Forest Light, same tokens as
   evensteer.com) + the simple, readable, animated finish.
   Loaded last; it only overrides.
   =========================================================== */

:root{
  --paper:#F2F5F1;
  --paper-2:#E8EEE7;
  --side:#FFFFFF;
  --card:#FFFFFF;
  --card-2:#F6F9F5;
  --ink:#0E1B15;
  --ink-soft:#3D4F45;
  --ink-dim:#56665C;
  --line:#E2E9E1;
  --line-strong:#CBD6CA;
  --pine:#0F4A36;
  --green:#1B6B4E;
  --green-2:#22835F;
  --green-wash:#E6F0EA;
  --mint:#47C795;
  --gold:#1B6B4E;            /* AI actions now use the brand green */
  --gold-wash:#FBF1DC;       /* "waiting" stays a soft amber, for meaning only */
  --amber:#8A5A0B;
  --red:#B4412B;
  --red-wash:#FBE9E4;
  --serif:'Space Grotesk',ui-sans-serif,system-ui,sans-serif;
  --r:14px;
  --r-lg:18px;
  --shadow:0 1px 2px rgba(14,27,21,.04),0 8px 24px rgba(27,107,78,.06);
  --shadow-lift:0 2px 4px rgba(14,27,21,.04),0 18px 40px rgba(27,107,78,.12);
  --ai-grad:linear-gradient(135deg,#1B6B4E 0%,#22835F 55%,#2E9C72 100%);
}

body{background:var(--paper);font-size:14.5px;letter-spacing:-.003em}
::selection{background:rgba(71,199,149,.3)}

/* ---------- readable labels: no tiny mono capitals ---------- */
.panel-head .eyebrow,.col-head,.stat .label,.field label,.f-label,.peek-section,.pop-head,.fg-head,.modal-section,
.briefing .k,.crumb,.node-kind,.agent .agent-kicker,.ai-out .ai-kicker,.log-day-label,.day .dow,.tl-item .when{
  font-family:var(--sans)!important;text-transform:none!important;letter-spacing:0!important;
}
.panel-head .eyebrow{font-size:14.5px;font-weight:600;color:var(--ink)}
.panel-head .eyebrow .accent{color:var(--green-2)}
.panel-head{background:transparent;padding:14px 20px;border-bottom-color:var(--line)}
.panel-head .hint{font-size:12px}
.stat .label{font-size:13.5px;font-weight:500;color:var(--ink-soft);margin-top:8px}
.field label,.f-label{font-size:12px;font-weight:500;color:var(--ink-soft)}
.col-head{font-size:13.5px;font-weight:600;color:var(--ink)}
.crumb{font-size:13.5px;color:var(--ink-dim)}
.crumb b{color:var(--ink);font-weight:600}
.node-kind,.pop-head,.peek-section,.fg-head{font-size:12px;font-weight:600;color:var(--ink-soft)}
.pill,.tag,.stage-pill,.fb,.tag-chip,.lead .fit,.lead .led-chip{font-family:var(--sans)!important;text-transform:none!important;letter-spacing:0!important;font-size:12px!important;font-weight:500}
.tag{min-width:0;border-radius:999px;padding:4px 10px}
.pill{padding:4px 10px}
.pill.draft,.pill.grey{background:#EDF1EC;color:#4A5A50}
.pill.wait,.tag{background:var(--gold-wash);color:var(--amber)}
.tag.summary{background:var(--green-wash);color:#185C43}
.tag.post{background:#EAF0FB;color:#2F4F8A}
.tag.email{background:#E8F2F2;color:#225B5B}
.tag.gold{background:var(--green-wash);color:#185C43}

/* ---------- headings ---------- */
.page-title{font-family:var(--sans);font-weight:600;letter-spacing:-.025em;font-size:clamp(1.8rem,2.4vw,2.25rem)}
.page-sub{font-size:14.5px;color:var(--ink-soft);line-height:1.55}
.stat .value,.money .value{font-family:var(--sans);font-weight:600;letter-spacing:-.02em}
.modal-head h3,.agent h3,.peek-title b,.flow-name{font-family:var(--sans);font-weight:600;letter-spacing:-.015em}

/* ---------- sidebar ---------- */
.side{background:var(--side);border-right:1px solid var(--line);padding:20px 14px 16px;gap:14px}
.nav{gap:1px}
.nav-group{font-size:12px;font-weight:600;color:var(--ink-dim);padding:14px 12px 6px;letter-spacing:.02em}
.nav a{position:relative;padding:9px 12px;border-radius:10px;font-size:14.5px;color:var(--ink-soft);transition:background .2s var(--ease),color .2s var(--ease),transform .2s var(--ease)}
.nav a:hover{background:var(--paper);color:var(--ink);transform:translateX(2px)}
.nav a.active{background:var(--green-wash);color:var(--pine);font-weight:600}
.nav a.active::before{content:"";position:absolute;left:-14px;top:8px;bottom:8px;width:3px;border-radius:0 3px 3px 0;background:var(--green);animation:barIn .35s var(--ease) both}
.nav a.active .ico{opacity:1;stroke:var(--green)}
.nav a.active .count{background:var(--green);color:#fff}
.nav .count{font-family:var(--sans);font-size:11.5px;background:var(--paper-2);border-radius:999px;padding:2px 8px}
.who{border-top:1px solid var(--line)}
.avatar{background:var(--pine);font-family:var(--sans);font-weight:600}
@keyframes barIn{from{transform:scaleY(0)}to{transform:scaleY(1)}}

/* ---------- top bar ---------- */
.topbar{background:rgba(242,245,241,.82);backdrop-filter:saturate(1.4) blur(12px);height:58px}
.btn-quiet.ai-btn{background:var(--ai-grad);color:#fff!important;border-radius:999px;padding:8px 14px;font-size:13.5px;font-weight:500;box-shadow:0 6px 18px rgba(27,107,78,.25);position:relative;overflow:hidden}
.btn-quiet.ai-btn:hover{background:var(--ai-grad);transform:translateY(-1px);box-shadow:0 10px 24px rgba(27,107,78,.32)}
.btn-quiet.ai-btn::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.35) 50%,transparent 70%);transform:translateX(-120%);animation:shine 4.5s ease-in-out infinite}
@keyframes shine{0%,70%{transform:translateX(-120%)}100%{transform:translateX(120%)}}

/* ---------- buttons ---------- */
.btn{border-radius:10px;padding:10px 16px;font-size:14.5px;background:var(--green);color:#fff;box-shadow:0 1px 0 rgba(255,255,255,.15) inset,0 4px 12px rgba(27,107,78,.18);transition:transform .18s var(--ease),box-shadow .18s var(--ease),background .18s var(--ease)}
.btn:hover{background:var(--pine);transform:translateY(-1px);box-shadow:0 8px 20px rgba(27,107,78,.24)}
.btn:active{transform:translateY(0) scale(.98)}
.btn:focus-visible,.btn-quiet:focus-visible,.icon-btn:focus-visible{outline:2px solid var(--mint);outline-offset:2px}
.btn-sm{padding:7px 12px;font-size:13.5px;border-radius:9px}
.btn-ai{background:var(--ai-grad);color:#fff}
.btn-ai:hover{background:var(--ai-grad);filter:brightness(1.06)}
.btn-ghost{background:var(--card);border-color:var(--line-strong);color:var(--ink);box-shadow:none}
.btn-ghost:hover{background:var(--card-2);border-color:var(--green);color:var(--green);box-shadow:0 4px 12px rgba(27,107,78,.08)}
.btn-quiet{font-size:13.5px;border-radius:8px}
.btn-lg{padding:14px 24px;font-size:16px;border-radius:12px}

/* ---------- surfaces ---------- */
.panel,.stat,.col,.wf,.person,.post{border-color:var(--line);border-radius:var(--r);box-shadow:var(--shadow)}
.panel{margin-bottom:20px}
.stat{padding:18px 20px;min-height:112px;position:relative;overflow:hidden}
.stat::after{content:"";position:absolute;right:-30px;top:-30px;width:110px;height:110px;border-radius:50%;background:radial-gradient(circle,rgba(71,199,149,.14),transparent 70%);transition:transform .5s var(--ease)}
.stat:hover{transform:translateY(-2px);box-shadow:var(--shadow-lift)}
.stat:hover::after{transform:scale(1.3)}
.stat .delta{color:var(--green-2)}
.lead{background:var(--card);border-color:var(--line);border-radius:12px;padding:12px 13px}
.lead:hover{background:var(--card);border-color:var(--green)}
.lead .fit{background:var(--green-wash);color:#185C43}
.lead .led-chip{background:var(--gold-wash);color:var(--amber)}
.col{background:var(--card-2);box-shadow:none}
.rows .row:hover,.crm-table tbody tr:hover{background:#F4F8F3}
.alert{background:#F4FAF6;border:1px solid #CFE3D6;color:var(--ink);border-radius:12px}
.alert .alert-ico{color:var(--green)}
.empty{font-size:14.5px;color:var(--ink-soft);padding:30px 18px}
textarea,.input,select{border-radius:10px;border-color:var(--line-strong);background:#fff;transition:border-color .16s,box-shadow .16s}
textarea:focus,.input:focus,select:focus{outline:0;border-color:var(--green);box-shadow:0 0 0 4px rgba(71,199,149,.18)}
.seg{border-radius:10px;border-color:var(--line-strong);background:#fff}
.seg button{padding:7px 12px;font-size:13.5px;transition:background .2s var(--ease),color .2s}
.seg button.active{background:var(--green);color:#fff}
.tabs button.active,.tab.on{border-bottom-color:var(--green)!important;color:var(--ink)}
.tabs button{font-size:14.5px}
.chip{border-radius:999px}
.chip.active,.chip.on{background:var(--green);border-color:var(--green)}
.toast{background:var(--pine);color:#fff;border-radius:12px;padding:12px 18px;box-shadow:0 18px 40px rgba(14,27,21,.25);font-size:14.5px}
.toast::before{content:"✓";display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--mint);color:var(--pine);font-size:12px;font-weight:700;margin-right:10px}
.modal{border-radius:var(--r-lg);border-color:var(--line);background:var(--card);box-shadow:0 40px 100px rgba(14,27,21,.3)}
.modal-foot,.peek-foot,.peek-head,.drawer-head,.drawer-input,.panel-foot{background:var(--card-2)}
.scrim,.drawer-scrim{background:rgba(14,27,21,.38);backdrop-filter:blur(3px)}
.drawer,.peek{background:var(--card)}
.preview{background:var(--card-2);border-color:var(--line);border-radius:12px}
.ai-out{background:#F2F8F4;border-color:#CFE3D6}
.ai-out .ai-kicker{color:var(--green)}
.agent .seal,.drawer-head .seal,.msg-seal{color:var(--green)!important}
.msg.user .bubble{background:var(--green)!important;color:#fff!important}
.stage-path .sp.now{background:var(--green)}
.stage-path .sp.done{background:var(--green-wash);color:#185C43}
.progress b,.bar-fill{background:var(--green)}
.bar-fill.gold{background:var(--mint)}
.chart-bar{background:linear-gradient(180deg,var(--green-2),var(--green))!important;border-radius:6px 6px 2px 2px}
.chart-bar.green{background:linear-gradient(180deg,var(--mint),var(--green-2))!important}
.node.sel{border-color:var(--green);box-shadow:0 0 0 4px rgba(71,199,149,.2)}
.fcard.on{border-color:var(--green);box-shadow:0 0 0 3px rgba(71,199,149,.2)}
.field-editor{border-color:var(--green);background:#F4FAF6}
.aside-admin{background:linear-gradient(180deg,#0F4A36,#0B3B2B)}
.flash{animation:glow2 1.2s var(--ease)}
@keyframes glow2{0%{box-shadow:0 0 0 0 rgba(71,199,149,.6);background:#E6F6EE}100%{box-shadow:0 0 0 12px rgba(71,199,149,0)}}

/* ---------- home: hero, start checklist, quick add ---------- */
.hero{position:relative;overflow:hidden;border-radius:var(--r-lg);padding:28px 30px;margin-bottom:22px;color:#EAF5EE;background:radial-gradient(120% 140% at 100% 0%,#22835F 0%,#1B6B4E 38%,#0F4A36 100%);box-shadow:0 24px 60px rgba(15,74,54,.25)}
.hero::before{content:"";position:absolute;inset:-40%;background:conic-gradient(from 0deg,transparent,rgba(71,199,149,.25),transparent 40%);animation:spin 18s linear infinite}
.hero > *{position:relative}
@keyframes spin{to{transform:rotate(360deg)}}
.hero h1{font-size:clamp(1.7rem,2.6vw,2.3rem);font-weight:600;letter-spacing:-.025em;color:#fff}
.hero p{margin-top:8px;color:#CFE6D9;font-size:14.5px;max-width:60ch}
.hero-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.hero .btn{background:#fff;color:var(--pine);box-shadow:0 6px 18px rgba(0,0,0,.15)}
.hero .btn:hover{background:#EAF5EE;color:var(--pine)}
.hero .btn-ghost{background:rgba(255,255,255,.1);color:#fff;border-color:rgba(255,255,255,.3)}
.hero .btn-ghost:hover{background:rgba(255,255,255,.18);color:#fff;border-color:#fff}
.hero-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:22px}
.hero-stat{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:12px 14px;backdrop-filter:blur(4px);transition:background .2s,transform .2s var(--ease)}
.hero-stat:hover{background:rgba(255,255,255,.14);transform:translateY(-2px)}
.hero-stat b{display:block;font-size:1.5rem;font-weight:600;color:#fff;letter-spacing:-.02em}
.hero-stat span{font-size:12px;color:#BFDCCB}

.start{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.start-step{display:flex;gap:12px;align-items:flex-start;text-align:left;border:1px solid var(--line);background:var(--card);border-radius:12px;padding:14px;cursor:pointer;transition:transform .2s var(--ease),box-shadow .2s var(--ease),border-color .2s}
.start-step:hover{transform:translateY(-2px);box-shadow:var(--shadow-lift);border-color:var(--green)}
.start-step .tick{width:26px;height:26px;border-radius:50%;border:2px solid var(--line-strong);display:grid;place-items:center;flex:none;font-size:13.5px;color:#fff;transition:all .3s var(--ease)}
.start-step.done .tick{background:var(--green);border-color:var(--green);animation:popIn .4s var(--ease)}
.start-step.done{background:#F6FAF7}
.start-step b{display:block;font-weight:600;font-size:14.5px}
.start-step span{font-size:12px;color:var(--ink-dim)}
.start-step.done b{color:var(--ink-dim);text-decoration:line-through;text-decoration-color:rgba(27,107,78,.4)}
.start-bar{height:8px;border-radius:999px;background:var(--paper-2);overflow:hidden;margin:2px 0 14px}
.start-bar b{display:block;height:100%;background:linear-gradient(90deg,var(--green),var(--mint));border-radius:999px;transform-origin:left;animation:grow .9s var(--ease) both}
@keyframes grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes popIn{0%{transform:scale(.6)}60%{transform:scale(1.15)}100%{transform:scale(1)}}

.help-banner{display:flex;gap:14px;align-items:flex-start;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;margin:-6px 0 18px;box-shadow:var(--shadow)}
.help-banner .hb-ico{width:34px;height:34px;border-radius:10px;background:var(--green-wash);color:var(--green);display:grid;place-items:center;flex:none;font-size:16px}
.help-banner p{font-size:14.5px;color:var(--ink-soft);line-height:1.5}
.help-banner b{color:var(--ink);font-weight:600}
.help-banner .hb-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}

.fab{position:fixed;right:26px;bottom:26px;z-index:45}
.fab-btn{width:56px;height:56px;border-radius:50%;border:0;background:var(--ai-grad);color:#fff;font-size:26px;cursor:pointer;box-shadow:0 16px 36px rgba(27,107,78,.38);transition:transform .25s var(--ease),box-shadow .25s}
.fab-btn:hover{transform:scale(1.06);box-shadow:0 20px 44px rgba(27,107,78,.45)}
.fab.open .fab-btn{transform:rotate(45deg)}
.fab-menu{position:absolute;right:0;bottom:68px;display:flex;flex-direction:column;gap:8px;align-items:flex-end}
.fab-menu button{display:flex;align-items:center;gap:10px;border:1px solid var(--line);background:#fff;border-radius:999px;padding:10px 16px;font-size:14.5px;font-weight:500;cursor:pointer;box-shadow:var(--shadow-lift);white-space:nowrap;animation:fabIn .28s var(--ease) both}
.fab-menu button:nth-child(2){animation-delay:.04s}.fab-menu button:nth-child(3){animation-delay:.08s}.fab-menu button:nth-child(4){animation-delay:.12s}.fab-menu button:nth-child(5){animation-delay:.16s}
.fab-menu button:hover{border-color:var(--green);color:var(--green)}
.fab-menu i{font-style:normal;width:26px;height:26px;border-radius:50%;background:var(--green-wash);color:var(--green);display:grid;place-items:center;font-size:13.5px}
@keyframes fabIn{from{opacity:0;transform:translateY(10px) scale(.95)}to{opacity:1;transform:none}}

/* count-up numbers settle in */
.countup{display:inline-block;animation:rise .5s var(--ease) both}

/* RTL */
[dir="rtl"] .nav a.active::before{left:auto;right:-14px;border-radius:3px 0 0 3px}
[dir="rtl"] .fab{right:auto;left:26px}
[dir="rtl"] .fab-menu{right:auto;left:0;align-items:flex-start}

@media (max-width:900px){
  .side{background:var(--card)}
  .nav-group{display:none}
  .nav a.active::before{display:none}
  .hero-stats,.start{grid-template-columns:1fr 1fr}
}
@media (max-width:620px){
  .hero{padding:22px 18px}
  .hero-stats{grid-template-columns:1fr 1fr}
  .start{grid-template-columns:1fr}
  .fab{right:16px;bottom:16px}
}
@media (prefers-reduced-motion:reduce){
  .hero::before,.btn-quiet.ai-btn::after{animation:none!important}
}

/* last small mono labels → brand sans */
.col-sum,.brand .brand-text span,.mini-avatar,.owner-chip i,.task-meta,.enr summary .t,.act .t,.notice .t,.log-time,.log-event,.actor,.chip i,.tabs .tab i,.tabs .n,.th-sort,.crm-table th,.cal-dow span,.mc-dow span,.day .dow{font-family:var(--sans)!important;letter-spacing:0!important;text-transform:none!important}
.crm-table th{font-size:12px;font-weight:600;color:var(--ink-soft);background:var(--card-2)}
.brand .brand-text span{font-size:12px;color:var(--ink-dim)}

/* phone: keep the top bar to the essentials */
@media (max-width:620px){
  .topbar{gap:8px;padding:0 14px;height:54px}
  .topbar .practice,.topbar a[href="#/admin"],.topbar [data-action="reset"],.crumb{display:none}
  .topbar .spacer{flex:1}
  .btn-quiet.ai-btn{white-space:nowrap;padding:8px 12px}
  .help-banner{padding:12px}
}

/* brand lockup: transparent Weave logo + a small product tag */
.brand{gap:10px;padding:2px 8px 6px;min-height:40px}
.brand img{height:30px;width:auto;display:block}
.brand-tag{font:600 12px/1 var(--sans);color:var(--green);background:var(--green-wash);border:1px solid #CFE3D6;border-radius:999px;padding:5px 9px;letter-spacing:.01em}
.aside-admin .brand-tag{color:#fff;background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.25)}
@media (max-width:900px){.brand img{height:24px}}

/* accounts */
.acc-id{font:600 12px/1 var(--mono);background:var(--green-wash);color:var(--pine);border:1px solid #CFE3D6;border-radius:6px;padding:3px 6px;white-space:nowrap}
.acc-big{font:600 13.5px/1 var(--mono);color:var(--green);margin-bottom:6px;letter-spacing:.02em}
.pager{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.sa-banner{position:sticky;top:0;z-index:25;display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 40px;background:#FBF1DC;border-bottom:1px solid #EBD9AE;color:#5A3D08;font-size:13.5px}
.sa-banner span{flex:1;min-width:220px}
.sa-banner .btn-ghost{background:transparent}
@media (max-width:620px){.sa-banner{padding:10px 14px}}
.brand-tag{white-space:nowrap}
.aside-admin .btn.btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.35);box-shadow:none}
.aside-admin .btn.btn-ghost:hover{background:rgba(255,255,255,.1);color:#fff;border-color:#fff}
.aside-admin .brand img{height:26px}
.aside-admin .nav .count{background:rgba(255,255,255,.16);color:#fff}
.aside-admin .nav a.active .count{background:#fff;color:var(--pine)}
.aside-admin .btn-quiet{color:rgba(255,255,255,.78)}
.aside-admin .btn-quiet:hover{color:#fff}