/* ClearBooks Portal — theme v4.2 "Calm & Clean, with colour" (Oct 29 2026). Loaded last; style/layout only.
   One neutral palette, navy for primary actions + active nav, teal only for focus. Hairlines instead of shadows,
   8px spacing, radii 6/8/10, Inter 13/14/16/20/24 at 400/500/600. Motion: hover/focus colour only. */
:root{
  --navy:#1D4757;--navy-2:#173B49;--teal:#16AFB8;--teal-d:#1D4757;--teal-ink:#1D4757;--teal-t:#F3F4F6;--mint:#F6F7F9;--mint2:#E5E7EB;
  --bg:#FFFFFF;--subtle:#F9FAFB;--hover:#F5F6F8;--line:#ECEEF1;--line-2:#E3E6EA;--hair:#ECEEF1;--hair-2:#E3E6EA;
  --ink:#111827;--ink-2:#6B7280;--ink-3:#9CA3AF;
  --danger:#B42318;--danger-t:#FEF3F2;--warn:#93370D;--warn-t:#FFFAEB;--ok:#067647;--ok-t:#ECFDF3;
  --r:10px;--r-sm:8px;--r-xs:6px;
  --shadow:none;--shadow-lg:0 0 0 1px var(--line),0 12px 32px -12px rgba(17,24,39,.16);
  --sh-1:0 0 0 1px var(--line);--sh-2:0 0 0 1px var(--line);--sh-3:0 0 0 1px var(--line),0 16px 40px -16px rgba(17,24,39,.18);
  --c0:#6B7280;--c1:#6B7280;--c2:#6B7280;--c3:#6B7280;--c4:#6B7280;--c5:#6B7280;--c6:#6B7280;--c7:#6B7280;
}
html,body{background:#fff}
body,body.app,body.public{background:#fff!important;color:var(--ink);font-size:14px;line-height:1.5;font-feature-settings:"cv11";letter-spacing:-.003em}
a{color:var(--navy)}
b,strong{font-weight:600}
h1,.page-head h1,.task-h1,h1.display{font-size:24px;line-height:1.25;font-weight:600;letter-spacing:-.02em;color:var(--ink);background:none;-webkit-text-fill-color:currentColor;margin:0 0 4px}
h2{font-size:16px;font-weight:600;letter-spacing:-.01em;color:var(--ink)}
h3{font-size:14px;font-weight:600;color:var(--ink)}
.sec,h2.sec,summary.sec{font-size:14px;font-weight:600;letter-spacing:0;color:var(--ink);display:flex;align-items:center;gap:8px;margin:0 0 8px}
h2.sec>.ic,summary.sec>.ic{display:none}
.sub,.fine,.hero-sub,.sec-note{color:var(--ink-2)}
.fine,.small,small{font-size:13px}
.eyebrow,.kicker{font-size:13px;font-weight:500;letter-spacing:0;text-transform:none;color:var(--ink-2)}
.kicker::before,.eyebrow::before{display:none!important}
.kicker .ic{display:none}
:focus-visible{outline:2px solid var(--teal);outline-offset:2px}
::selection{background:rgba(22,175,184,.18)}
.ic{stroke-width:1.75}
kbd,.kbd-mod{font:500 11px/1 Inter,system-ui,sans-serif;color:var(--ink-3);background:#fff;border:1px solid var(--line-2);border-radius:4px;padding:2px 5px;box-shadow:none}
code{background:var(--subtle);border:1px solid var(--line)}
.num,.ds-num{font-variant-numeric:tabular-nums}
.muted{color:var(--ink-2)}
.ta-r{text-align:right;justify-content:flex-end}
.show-sm{display:none}

/* no entrance / decorative motion */
.content>*,.kpi,.task,.cat-sec>.tasks{animation:none!important}
*,*::before,*::after{transition-duration:.12s!important}
.aurora,.grid-bg,.tick-burst,.sidebar::before,.sidebar::after,.hero::after,.kpi::after,.client-hero::before,.notes-card::before,.empty::before,.auth-hero::after{display:none!important;content:none!important}

/* ---------- sidebar ---------- */
.sidebar{background:var(--subtle)!important;background-image:none!important;border-right:1px solid var(--line);box-shadow:none;color:var(--ink);padding:16px 12px;width:240px}
.sidebar .brand{display:flex;align-items:center;padding:4px 8px 16px;margin:0}
.sidebar .brand img{width:150px;height:auto;filter:none}
.sidebar .brand-tag{display:none}
.sidebar .new-task,.sidebar .btn-teal{background:var(--navy)!important;background-image:none!important;color:#fff!important;border:0;box-shadow:none!important;border-radius:var(--r-sm);height:34px;font-size:14px;font-weight:500;margin:0 0 8px;justify-content:center}
.sidebar .new-task:hover{background:var(--navy-2)!important}
.search-btn{background:#fff!important;border:1px solid var(--line-2)!important;color:var(--ink-2)!important;box-shadow:none!important;border-radius:var(--r-sm);height:34px;font-size:14px;margin:0 0 16px}
.search-btn:hover{border-color:#D1D5DB!important;color:var(--ink)!important}
.search-btn .ic{color:var(--ink-3)}
.sidebar nav{gap:2px}
.sidebar nav a{color:var(--ink-2)!important;background:none!important;box-shadow:none!important;border-radius:var(--r-xs);font-size:14px;font-weight:500;padding:7px 10px;gap:10px;height:auto}
.sidebar nav a .ic{width:16px;height:16px;color:var(--ink-3);opacity:1}
.sidebar nav a:hover{background:var(--hover)!important;color:var(--ink)!important}
.sidebar nav a.active{background:#EDF1F3!important;color:var(--navy)!important;font-weight:600}
.sidebar nav a.active .ic{color:var(--navy)}
.sidebar nav a.active::before,.sidebar nav a.active::after{display:none!important}
.nav-badge{background:#E5E7EB!important;color:var(--ink)!important;font-size:11px;font-weight:600;min-width:18px;height:18px;line-height:18px;border-radius:9px;padding:0 5px;box-shadow:none!important}
.nav-badge.chat-badge.mention{background:var(--navy)!important;color:#fff!important}
.sidebar .me{border-top:1px solid var(--line);background:none!important;padding:12px 4px 0;margin-top:auto}
.sidebar .me b{color:var(--ink);font-weight:500;font-size:14px}
.sidebar .me small{color:var(--ink-3)}
.sidebar .me .icon-btn{color:var(--ink-3)}
.sidebar .me .icon-btn:hover{color:var(--ink);background:var(--hover)}

/* ---------- avatars & client marks: monochrome initials ---------- */
.avatar,.avatar[class*="av-c"],.sidebar .avatar,.topbar .avatar{background:#F1F3F5!important;background-image:none!important;color:#4B5563!important;box-shadow:none!important;border:0;font-weight:600;letter-spacing:0}
.avatar.empty{background:#fff!important;border:1px dashed #D1D5DB;color:var(--ink-3)!important}
.cl-badge,.cl-badge[class*="cl-c"]{background:#F1F3F5!important;background-image:none!important;color:#4B5563!important;box-shadow:none!important;border:0!important;font-weight:600;letter-spacing:0;border-radius:6px}
.task-meta .cl-badge,.un-client .cl-badge{display:none}

/* ---------- content ---------- */
.content{padding:40px 48px 64px;max-width:1040px}
.content.wide{max-width:1240px}
.page-head{margin:0 0 24px;align-items:flex-end}
.page-head .sub{font-size:14px;margin-top:2px}
.backlink{color:var(--ink-2)!important;font-size:13px;font-weight:500;background:none!important;padding:0}
.backlink:hover{color:var(--ink)!important}
.card{background:#fff!important;background-image:none!important;border:1px solid var(--line)!important;box-shadow:none!important;border-radius:var(--r)!important}
.card:hover{box-shadow:none}

/* buttons */
.btn{height:34px;padding:0 12px;border-radius:var(--r-sm);font-size:14px;font-weight:500;background:#fff;color:var(--ink);border:1px solid var(--line-2);box-shadow:none!important;background-image:none!important;transform:none!important;gap:6px}
.btn:hover{background:var(--hover);border-color:#D1D5DB;color:var(--ink);text-decoration:none}
.btn .ic{width:16px;height:16px}
.btn-primary,.btn-teal{background:var(--navy)!important;background-image:none!important;color:#fff!important;border-color:var(--navy)!important}
.btn-primary:hover,.btn-teal:hover{background:var(--navy-2)!important;border-color:var(--navy-2)!important}
.btn-ghost,.btn-glass{background:transparent!important;border-color:transparent!important;color:var(--ink-2)!important;backdrop-filter:none}
.btn-ghost:hover,.btn-glass:hover{background:var(--hover)!important;color:var(--ink)!important}
.btn-danger{background:#fff!important;color:var(--danger)!important;border-color:#F3D1CD!important}
.btn-danger:hover{background:var(--danger-t)!important}
.btn-lg{height:40px;font-size:14px}
.icon-btn{border-radius:var(--r-xs);box-shadow:none!important;background:transparent}
.icon-btn:hover{background:var(--hover)}

/* inputs */
input,select,textarea{border:1px solid var(--line-2)!important;border-radius:var(--r-sm)!important;background:#fff!important;box-shadow:none!important;font-size:14px;color:var(--ink)}
input:focus,select:focus,textarea:focus{border-color:var(--teal)!important;box-shadow:0 0 0 3px rgba(22,175,184,.15)!important;outline:none}
label{font-size:13px;font-weight:500;color:var(--ink-2)}

/* chips → quiet text; badges → small muted pills */
.chip,.tag,.badge,.svc-pill,.pill{background:#F3F4F6!important;background-image:none!important;color:#4B5563!important;border:0!important;box-shadow:none!important;border-radius:999px;font-size:12px;font-weight:500;padding:2px 8px;line-height:18px;height:auto;gap:4px}
.chip .ic,.badge .ic{display:none}
.chip.danger,.badge-danger,.chip.due.danger{background:var(--danger-t)!important;color:var(--danger)!important}
.chip.ok,.badge-ok,.pill-ok{background:var(--ok-t)!important;color:var(--ok)!important}
.chip.warn,.badge-warn{background:var(--warn-t)!important;color:var(--warn)!important}
.badge-demo{background:#F3F4F6!important;color:#6B7280!important}
.badge-muted{color:var(--ink-3)!important}
.count-badge,.cat-count,.tab-count{background:none!important;color:var(--ink-3)!important;font-weight:500;font-size:13px;padding:0;box-shadow:none!important;border:0!important;min-width:0}
.dot-label,.qb-status{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:400;color:var(--ink-2);background:none!important;border:0!important;padding:0!important;box-shadow:none!important}
.dot-label i,.qb-status i{width:6px;height:6px;border-radius:50%;background:#D1D5DB!important;box-shadow:none!important;animation:none!important;display:inline-block}
.dot-label.on i,.qb-status.on i{background:#12B76A!important}
.dot-label.err i,.qb-status.err i{background:#F04438!important}
.dot-label.err,.qb-status.err{color:var(--danger)}
.dot-label.demo i,.qb-status.demo i{background:#9CA3AF!important}

/* flashes */
.flash{border:1px solid var(--line)!important;background:var(--subtle)!important;color:var(--ink)!important;border-radius:var(--r-sm);box-shadow:none!important;font-size:14px;padding:10px 14px}
.flash-error,.flash-danger{background:var(--danger-t)!important;border-color:#F8D7D3!important;color:var(--danger)!important}
.flash-warn{background:var(--warn-t)!important;border-color:#F5E3C0!important;color:var(--warn)!important}
.flash-ok{background:var(--ok-t)!important;border-color:#CDEFDB!important;color:var(--ok)!important}

/* ---------- task rows ---------- */
.tasks{margin:0;padding:0;list-style:none}
.task,.task.is-overdue,.task:hover{background:transparent!important;background-image:none!important;box-shadow:none!important;border:0!important;border-bottom:1px solid var(--line)!important;border-radius:0!important;padding:10px 4px;gap:12px;margin:0;transform:none!important}
.task:last-child{border-bottom:0!important}
.task:hover{background:var(--subtle)!important}
.task-title{font-size:14px;font-weight:500;color:var(--ink)!important;background:none!important;-webkit-text-fill-color:currentColor}
.task.is-done .task-title{color:var(--ink-3)!important;text-decoration:line-through}
.task-meta{gap:0;margin-top:2px;font-size:13px;color:var(--ink-2);flex-wrap:wrap}
.task-meta .chip{background:none!important;padding:0!important;border-radius:0;font-size:13px;font-weight:400;color:var(--ink-2)!important;line-height:1.4}
.task-meta .chip+.chip::before{content:"·";margin:0 7px;color:var(--ink-3)}
.task-meta .chip.due.danger{color:var(--danger)!important;font-weight:500}
.task-meta .chip.due.warn{color:var(--ink)!important;font-weight:500}
.task-meta .chip.due.soon,.task-meta .chip.client,.task-meta .chip.auto,.task-meta .chip.question{color:var(--ink-2)!important}
.task-meta .chip.prio-urgent{color:var(--danger)!important}
.task-meta .chip.prio-high{color:var(--warn)!important}
.task-meta .chip.client .cl-badge{display:none}
.task .avatar{width:24px;height:24px;font-size:10px}
.tick{width:18px;height:18px;border-radius:50%;border:1.5px solid #C9CED6!important;background:#fff!important;box-shadow:none!important}
.tick:hover{border-color:var(--navy)!important;background:#fff!important}
.tick .tick-path{stroke:var(--navy)}
.task.is-done .tick,.task.completing .tick{background:var(--navy)!important;border-color:var(--navy)!important;background-image:none!important}
.task.is-done .tick .tick-path,.task.completing .tick .tick-path{stroke:#fff}
.task .qb-ic,.task .qb-link{opacity:.6}

/* category filter → quiet text tabs */
.cat-chips{display:flex;flex-wrap:wrap;gap:4px;margin:0;padding:0;border:0}
.cat-chip{background:transparent!important;border:0!important;box-shadow:none!important;color:var(--ink-2)!important;font-size:13px;font-weight:500;padding:4px 8px;border-radius:var(--r-xs)}
.cat-chip:hover{background:var(--hover)!important;color:var(--ink)!important;text-decoration:none}
.cat-chip.on{background:#EDF1F3!important;color:var(--navy)!important}
.cat-chip b{font-weight:500;color:var(--ink-3);margin-left:2px}
.cat-chip.on b{color:var(--navy)}
.cat-sec{border:0!important;background:none!important;box-shadow:none!important;margin:0 0 8px;padding:0}
.cat-sec>summary{font-size:13px;font-weight:600;color:var(--ink-2);padding:12px 4px 6px;border-bottom:1px solid var(--line);gap:8px}
.cat-dot{display:none!important}
.cat-od{color:var(--danger);font-size:12px;font-weight:500;background:none!important;padding:0}
.cat-caret{color:var(--ink-3)}

/* ---------- My Day ---------- */
.day-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin:0 0 24px;padding:0;background:none!important;border:0!important;box-shadow:none!important;min-height:0}
.day-date{font-size:13px;color:var(--ink-2);margin:0 0 4px}
.day-head h1{margin:0 0 4px}
.day-head .hero-sub{font-size:14px;color:var(--ink-2);margin:0}
.day-head .hero-sub b{color:var(--ink);font-weight:600}
.hero-od{color:var(--danger);font-weight:500;background:none!important;padding:0}
.day-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));border:1px solid var(--line);border-radius:var(--r);margin:0 0 40px;overflow:hidden}
.ds{display:flex;flex-direction:column;gap:4px;padding:16px 20px;color:var(--ink)!important;text-decoration:none!important;border-left:1px solid var(--line);background:#fff}
.ds:first-child{border-left:0}
.ds:hover{background:var(--subtle)}
.ds-label{font-size:13px;color:var(--ink-2);font-weight:500}
.ds-num{font-size:24px;font-weight:600;letter-spacing:-.02em;line-height:1.2}
.ds-num small{font-size:14px;font-weight:500;color:var(--ink-3)}
.ds.is-danger .ds-num{color:var(--danger)}
.day-main{display:block}
.day-sec{margin:0 0 40px;padding:0;border:0;background:none}
.sec-row{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:0 0 8px}
.sec-row .sec{margin:0}
.tgroup{margin:0 0 24px}
.tgroup-h{font-size:13px;font-weight:600;color:var(--ink-2);margin:16px 0 0;padding:0 4px 8px;border-bottom:1px solid var(--line);display:flex;gap:6px}
.tgroup-h span{color:var(--ink-3);font-weight:500}
.tgroup-overdue .tgroup-h{color:var(--danger)}
.more{margin:8px 0 0;font-size:13px}
.more a{color:var(--ink-2)!important;font-weight:500;display:inline-flex;align-items:center;gap:4px}
.more a:hover{color:var(--ink)!important}
.more .ic{width:14px;height:14px}
.done-card>summary{cursor:pointer;color:var(--ink-2);list-style:none;padding:8px 4px;border-bottom:1px solid var(--line)}
.done-card>summary::-webkit-details-marker{display:none}
.done-card[open]>summary{margin-bottom:0}
/* questions / mentions: compact list */
.q-card,.mention-card{background:#fff!important;background-image:none!important}
.q-list{list-style:none;margin:0;padding:0;border:1px solid var(--line);border-radius:var(--r)}
.q-item{padding:16px;border:0!important;border-bottom:1px solid var(--line)!important;background:none!important;box-shadow:none!important;border-radius:0!important;margin:0}
.q-item:last-child{border-bottom:0!important}
.q-head{font-size:13px;color:var(--ink-2);gap:8px}
.q-head b{color:var(--ink);font-weight:500}
.q-task{font-weight:500;color:var(--ink)!important;font-size:14px}
.q-body{border-left:2px solid var(--line-2)!important;background:none!important;padding:2px 0 2px 12px;margin:8px 0;color:var(--ink);font-size:14px;border-radius:0}
.mention-link{color:inherit!important;text-decoration:none!important;display:block}
.asked-list{list-style:none;margin:0;padding:0}
.asked-list li{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 4px;border-bottom:1px solid var(--line);border-top:0;background:none}
.asked-list li:last-child{border-bottom:0}
.asked-list a{display:flex;flex-direction:column;color:var(--ink)!important;min-width:0}
.asked-list b{font-weight:500}

/* ---------- lists / tables ---------- */
.list{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:#fff}
.list-head,.list-row{display:grid;grid-template-columns:minmax(220px,2.2fr) 1.2fr 1.8fr 1.1fr 120px;gap:16px;align-items:center;padding:0 16px}
.list-head{height:36px;font-size:12px;font-weight:500;color:var(--ink-3);background:var(--subtle);border-bottom:1px solid var(--line)}
.list-row{min-height:52px;padding-top:8px;padding-bottom:8px;border-bottom:1px solid var(--line);color:var(--ink)!important;text-decoration:none!important;font-size:14px;border-radius:0!important;box-shadow:none!important;border-left:0!important;border-right:0!important;border-top:0!important;background:#fff!important;transform:none!important}
.list-row:last-child{border-bottom:0}
.list-row:hover{background:var(--subtle)!important}
.list-row>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lr-name{display:flex;align-items:center;gap:12px}
.lr-name b{font-weight:500;display:block;overflow:hidden;text-overflow:ellipsis}
.lr-name small{color:var(--ink-2)}
.lr-svc{font-size:13px}
.list-row .muted{font-size:13px}
.cl-badge.sm{width:28px;height:28px;font-size:11px;flex:none}
.table{border-collapse:collapse;width:100%;font-size:14px}
.table th{font-size:12px;font-weight:500;color:var(--ink-3);text-transform:none;letter-spacing:0;background:none!important;border-bottom:1px solid var(--line)!important;padding:8px 12px}
.table td{border-bottom:1px solid var(--line)!important;padding:10px 12px;background:none!important}
.table tbody tr:last-child td{border-bottom:0!important}
.table tbody tr:hover{background:var(--subtle)!important}

/* filters bar */
.filters.card{border:0!important;padding:0!important;background:none!important;margin:0 0 24px;gap:12px}
.filters label{font-size:12px;color:var(--ink-3)}
.filters select,.filters input{height:34px}

/* ---------- client page ---------- */
.client-hero,.client-hero.card{background:none!important;border:0!important;border-bottom:1px solid var(--line)!important;border-radius:0!important;padding:0!important;margin:0 0 32px;box-shadow:none!important}
.client-hero-main{gap:16px;align-items:center;padding:12px 0 16px}
.client-hero .cl-badge.xl{width:44px;height:44px;font-size:16px;border-radius:10px}
.client-hero h1{font-size:24px}
.client-hero-meta{gap:16px;font-size:13px;color:var(--ink-2)}
.client-hero-meta b{font-weight:500;color:var(--ink)}
.client-hero-meta .avatar.sm{display:none}
.svc-pills{gap:6px;margin-top:8px}
.svc-pill{font-size:12px}
.tabs{border:0;gap:24px;padding:0;margin:0;background:none!important}
.tabs a{color:var(--ink-2)!important;font-size:14px;font-weight:500;padding:10px 0;border-bottom:2px solid transparent;border-radius:0;background:none!important;gap:6px}
.tabs a .ic{display:none}
.tabs a:hover{color:var(--ink)!important;text-decoration:none}
.tabs a.on,.tabs:not(.ink-ready) a.on{color:var(--ink)!important;border-bottom-color:var(--navy)!important;background:none!important}
.tabs .tab-ink{display:none!important}

/* ---------- phone chrome ---------- */
.topbar{background:rgba(255,255,255,.96)!important;background-image:none!important;border-bottom:1px solid var(--line);box-shadow:none!important;color:var(--ink);backdrop-filter:saturate(1.2) blur(8px)}
.topbar .brand img{height:22px;width:auto;filter:none}
.topbar .icon-btn,.top-search{color:var(--ink-2)!important;background:none!important;border:0!important}
.bottomnav{background:rgba(255,255,255,.97)!important;background-image:none!important;border-top:1px solid var(--line)!important;box-shadow:none!important;backdrop-filter:blur(8px)}
.bottomnav a{color:var(--ink-3)!important;font-size:11px;font-weight:500}
.bottomnav a .ic{color:inherit}
.bottomnav a.active,.bottomnav a.active span,.bottomnav a.active .ic{color:var(--navy)!important}
.bottomnav a.active::after,.bottomnav a.active::before{display:none!important}
.bottomnav .fab{background:var(--navy)!important;background-image:none!important;box-shadow:0 4px 12px -4px rgba(29,71,87,.45)!important;color:#fff!important;border:0}

/* ---------- overlays ---------- */
.palette-backdrop{background:rgba(17,24,39,.24)!important;backdrop-filter:none!important}
.palette-box{border-radius:12px!important;box-shadow:var(--sh-3)!important;border:0}
.palette-list a.on,.palette-list a:hover{background:var(--hover)!important}
.palette-list a .p-ic{background:#F1F3F5!important;color:#4B5563!important;box-shadow:none!important}
.toast{background:#111827!important;color:#fff!important;border:0!important;border-radius:var(--r-sm)!important;box-shadow:0 8px 24px -8px rgba(17,24,39,.3)!important}
.toast a{color:#fff!important;text-decoration:underline}
.toast .t-ic{background:none!important;color:#6CE9A6!important}
.toggle input:checked+.sw{background:var(--navy)!important;background-image:none!important}
.empty{color:var(--ink-2);font-size:14px;background:none!important;border:0!important;padding:24px 4px;text-align:left}

/* ---------- login ---------- */
.auth-split{display:flex;min-height:100vh;min-height:100dvh;background:var(--subtle)!important;grid-template-columns:1fr}
.auth-hero{display:none!important}
.auth-panel{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:48px 24px;background:none!important;background-image:none!important}
.auth-card{width:100%;max-width:380px;background:#fff!important;border:1px solid var(--line);border-radius:12px;box-shadow:0 1px 2px rgba(17,24,39,.04)!important;padding:32px}
.auth-logo{display:block!important;width:170px;height:auto;margin:0 0 32px}
.auth-card h1{font-size:20px;margin:0 0 4px}
.auth-card .sub{font-size:14px;margin:0 0 24px}
.auth-card .stack{gap:16px}
.auth-card .fine{margin-top:16px;color:var(--ink-3)}
.auth-foot{font-size:13px;color:var(--ink-3);margin-top:24px}
.auth-foot a{color:var(--ink-2)}
.auth-wrap{background:var(--subtle)!important;background-image:none!important}

@media (max-width:900px){
  .content,.content.wide{padding:20px 16px 96px;max-width:none}
  h1,.page-head h1,.task-h1,h1.display{font-size:20px}
  .show-sm{display:block}
  .day-head{margin:0 0 16px}
  .day-stats{grid-template-columns:repeat(2,1fr);margin:0 0 32px}
  .ds{padding:12px 16px}
  .ds:nth-child(odd){border-left:0}
  .ds:nth-child(n+3){border-top:1px solid var(--line)}
  .ds-num{font-size:20px}
  .day-sec{margin:0 0 32px}
  .list-head{display:none}
  .list-head,.list-row{grid-template-columns:minmax(0,1fr) auto;padding:0 12px}
  .client-hero-main{padding:8px 0 12px}
  .auth-card{padding:24px;border:0;background:none!important;box-shadow:none!important}
  .auth-split{background:#fff!important}
}

.cat-chip::before,.cat-chip::after{display:none!important}
.tgroup-today .task-meta .chip.due{display:none}
.tgroup-today .task-meta .chip.due+.chip::before{content:none}
.chip-word{display:none}
.task-meta .chip-word{display:inline}
.task-meta .chip{gap:0!important}
.task-meta .chip+.chip::before{margin:0 6px!important}
.tgroup-nodate .task-meta .chip.due{display:none}
.tgroup-nodate .task-meta .chip.due+.chip::before{content:none}
.bottomnav a .ic,.bottomnav a.active .ic{background:none!important;box-shadow:none!important}

/* ---------- misc page fixes ---------- */
.auth-card{border:1px solid var(--line)!important}
.task-meta .chip-word{margin-left:3px}
.client-hero .tabs{margin:0!important;padding:0!important;overflow:visible}
.client-hero .tabs a:first-child{margin-left:0!important}
.qb-status,.qb-status.demo,.qb-status.on{color:var(--ink-2)!important}
.invoice-box{background:var(--subtle)!important;background-image:none!important;border:1px solid var(--line)!important;border-left:1px solid var(--line)!important;border-radius:var(--r-sm)!important;box-shadow:none!important}
.drop-zone{border:1px dashed #D1D5DB!important;background:var(--subtle)!important;border-radius:var(--r-sm)!important;color:var(--ink-2)}
.drop-zone.over{border-color:var(--teal)!important;background:#F3FBFB!important}
.drop-zone .ic{color:var(--ink-3)}
/* tasks page: compact one-line filter bar, list without a box */
.filters{display:flex!important;flex-wrap:wrap;align-items:flex-end;gap:8px 12px!important}
.filters label{flex:0 1 170px;display:flex;flex-direction:column;gap:4px;margin:0}
.filters label.grow{flex:1 1 200px}
.filters select,.filters input{height:32px!important;font-size:13px!important;padding-top:0;padding-bottom:0}
.filters .btn{height:32px;font-size:13px}
.filter-actions{display:flex;gap:4px}
.page-tasks .content>section.card{border:0!important;padding:0!important;background:none!important}

/* ---------- chat: tidy, muted ---------- */
.chat-app{box-shadow:none!important;border:1px solid var(--line);border-radius:var(--r)!important;background:#fff!important}
.chat-side{background:var(--subtle)!important;background-image:none!important;border-right:1px solid var(--line)!important}
.chat-side-head h1{font-size:20px!important}
.chat-filter{background:#fff!important;border:1px solid var(--line-2)!important;box-shadow:none!important;border-radius:var(--r-sm)!important}
.chat-filter input{border:0!important;box-shadow:none!important;background:transparent!important}
.ch-item{border-radius:var(--r-sm)!important}
.ch-item:hover{background:var(--hover)!important}
.ch-item.on{background:#EDF1F3!important;box-shadow:none!important}
.ch-hash{background:#F1F3F5!important;color:#4B5563!important;font-weight:600}
.ch-item.unread .ch-name{color:var(--ink)!important;font-weight:600}
.ch-item.unread .ch-meta time{color:var(--ink-2)!important}
.ch-badge{background:var(--navy)!important;font-weight:600}
.ch-badge.mention,.nav-badge.chat-badge.mention{background:var(--navy)!important}
.chat-main{background:#fff!important;background-image:none!important}
.chat-head{background:#fff!important;border-bottom:1px solid var(--line)!important;box-shadow:none!important}
.chat-head .ch-hash.big{background:#F1F3F5!important;color:#4B5563!important}
.bubble{background:#F3F4F6!important;box-shadow:none!important;color:var(--ink)}
.msg.mine .bubble{background:#E8EEF1!important;background-image:none!important;color:var(--ink)!important;box-shadow:none!important}
.msg.mine .bubble *{color:inherit}
.msg.mine .msg-time,.msg.mine .bubble time,.msg.mine .bubble small{color:var(--ink-3)!important}
.msg.at-me:not(.mine) .bubble{background:#FFF8EB!important;box-shadow:none!important}
.msg-text .mention{background:none!important;color:var(--navy)!important;font-weight:600;padding:0}
.msg-text .mention.me,.msg.mine .msg-text .mention{background:none!important;color:var(--navy)!important}
.msg.deleted .bubble,.msg.mine.deleted .bubble{background:transparent!important;box-shadow:inset 0 0 0 1px var(--line)!important;color:var(--ink-3)!important}
.msg.media-only .bubble,.msg.mine.media-only .bubble{background:transparent!important}
.v-play,.msg.mine .v-play{background:var(--navy)!important;background-image:none!important;color:#fff!important;box-shadow:none!important}
.v-wave i.on,.msg.mine .v-wave i.on{background:var(--navy)!important}
.seen-row .seen{color:var(--ink-2)!important}
.composer{background:#fff!important;backdrop-filter:none!important;border-top:1px solid var(--line)!important}
.comp-input textarea{background:#fff!important;border:1px solid var(--line-2)!important;border-radius:20px!important}
.comp-mic,.comp-send,.rec-send{background:var(--navy)!important;background-image:none!important;box-shadow:none!important}
.chat-main.drop::after{border:1px dashed var(--teal)!important;background:rgba(255,255,255,.9)!important}
.chat-head,.chat-head *{color:var(--ink)}
.chat-head .fine,.chat-head small,.chat-head .ch-sub{color:var(--ink-2)!important}
.chat-head .icon-btn{color:var(--ink-2)!important}
.chat-head .chat-title h2{color:var(--ink)!important}
.chat-head .chat-title p{color:var(--ink-2)!important}
.chat-head-actions .btn{background:transparent!important;color:var(--ink-2)!important;border-color:transparent!important}
.v-wave i,.msg.mine .v-wave i{background:#C3CDD2!important}
.v-wave i.on,.msg.mine .v-wave i.on{background:var(--navy)!important}
.msg-task{background:none!important;color:var(--ink-2)!important;font-weight:500;padding:2px 6px}
.chat-side-actions .icon-btn:hover,.chat-head .icon-btn:hover{background:var(--hover)!important;color:var(--ink)!important}
@media (max-width:900px){.chat-head{background:rgba(255,255,255,.97)!important;box-shadow:none!important;border-bottom:1px solid var(--line)!important}}
.folders a.on{background:#EDF1F3!important;color:var(--navy)!important;box-shadow:none!important}
.folders a:hover{background:var(--hover)}

/* =================== v4.1: canvas + floating content panel, fewer things in your face =================== */
:root{--canvas:#F6F7F9;--r:12px;--r-sm:8px}
@media (min-width:901px){
  html,body.app{background:var(--canvas)!important}
  .sidebar{background:transparent!important;border-right:0!important;width:232px;padding:20px 12px 12px}
  .content,.content.wide{margin:8px 8px 8px 232px;background:#fff;border:1px solid #E9EBEF;border-radius:14px;box-shadow:0 1px 2px rgba(16,24,40,.04),0 1px 3px rgba(16,24,40,.03);
    min-height:calc(100vh - 16px);min-height:calc(100dvh - 16px);max-width:none;padding:48px max(56px,calc((100vw - 248px - 960px) / 2)) 80px}
  .content.wide{padding-left:max(48px,calc((100vw - 248px - 1160px) / 2));padding-right:max(48px,calc((100vw - 248px - 1160px) / 2))}
  body.chat-body .content{padding:0!important;overflow:hidden}
  body.chat-body .chat-app{height:calc(100vh - 18px)!important;height:calc(100dvh - 18px)!important;border:0!important;border-radius:14px!important}
}
.sidebar .brand{padding:2px 8px 20px}
.sidebar .brand img{width:144px}
.sb-actions{display:flex;gap:6px;margin:0 0 20px}
.sb-actions .search-btn{flex:1;margin:0!important;height:32px;padding:0 8px;gap:6px;font-size:13px;display:flex;align-items:center;min-width:0}
.sb-actions .search-btn span{flex:1;text-align:left}
.sb-actions .search-btn .ic{width:15px;height:15px}
.new-btn{height:32px!important;padding:0 10px 0 8px!important;font-size:13px!important;gap:4px!important;list-style:none;cursor:pointer;display:inline-flex;align-items:center}
.new-btn .ic{width:15px;height:15px}
.sidebar nav a{padding:6px 10px;font-size:14px}
.sidebar nav a.active{background:#fff!important;color:var(--ink)!important;box-shadow:0 0 0 1px #E6E8EC,0 1px 2px rgba(16,24,40,.06)!important;font-weight:500}
.sidebar nav a.active .ic{color:var(--navy)}
.sidebar nav a:hover:not(.active){background:rgba(17,24,39,.04)!important}

/* dropdowns (details.dd) */
details.dd{position:relative}
details.dd>summary{list-style:none;cursor:pointer}
details.dd>summary::-webkit-details-marker{display:none}
.dd-menu{position:absolute;z-index:60;top:calc(100% + 6px);left:0;min-width:200px;background:#fff;border-radius:10px;padding:4px;
  box-shadow:0 0 0 1px rgba(17,24,39,.08),0 10px 30px -8px rgba(17,24,39,.20),0 2px 6px rgba(17,24,39,.05);display:flex;flex-direction:column}
.dd-menu.dd-right{left:auto;right:0}
.dd-menu.dd-up{top:auto;bottom:calc(100% + 6px);left:0;right:0}
.dd-menu a,.dd-menu button,.dd-menu .qb-link{display:flex!important;align-items:center;gap:10px;width:100%;padding:7px 10px!important;border-radius:6px!important;border:0!important;background:none!important;box-shadow:none!important;
  color:var(--ink)!important;font:500 13.5px/1.3 Inter,system-ui,sans-serif;text-align:left;cursor:pointer;text-decoration:none!important;height:auto!important;white-space:nowrap}
.dd-menu a:hover,.dd-menu button:hover,.dd-menu .qb-link:hover,.dd-menu a.on{background:var(--hover)!important}
.dd-menu .ic{width:15px;height:15px;color:var(--ink-3)}
.dd-menu .qb-link svg{width:15px;height:15px}
.dd-menu .qb-ext{margin-left:auto;color:var(--ink-3)}
.dd-menu .is-demo{color:var(--ink-3)!important;cursor:default}
.dd-menu form{margin:0}
.dd-sep{border-top:1px solid var(--line);margin-top:4px;padding-top:4px}
.me-dd{margin-top:auto;border-top:0}
.me-dd>summary{display:flex;align-items:center;gap:10px;padding:8px;border-radius:8px}
.me-dd>summary:hover,.me-dd[open]>summary{background:rgba(17,24,39,.04)}
.me-dd>summary span{display:flex;flex-direction:column;min-width:0;flex:1;line-height:1.3}
.me-dd>summary b{font-weight:500;font-size:13.5px;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.me-dd>summary small{font-size:12px;color:var(--ink-3)}
.me-dd>summary>.ic{width:14px;height:14px;color:var(--ink-3);transform:rotate(180deg)}
.me-dd.is-active>summary{background:#fff;box-shadow:0 0 0 1px #E6E8EC}
.me-dd .avatar{width:28px;height:28px;font-size:11px}
.me-dd-sm>summary .avatar{width:30px;height:30px;font-size:11px}
.topbar-actions{display:flex;align-items:center;gap:4px}

/* page heads */
.page-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin:0 0 32px}
.page-head h1{margin:0}
.page-head .sub{margin-top:4px;font-size:14px}
.head-actions{display:flex;align-items:center;gap:8px;flex:none}
.head-actions form{margin:0}
.btn.icon-only{width:34px;padding:0;justify-content:center}
.btn.icon-only .ic{width:18px;height:18px}
.task-head .backlink{display:inline-flex;margin:0 0 12px}
.task-head h1{font-size:24px;margin:0 0 8px}
.task-meta.big .chip{font-size:13px}
.task-meta.big{display:flex;gap:0;flex-wrap:wrap}
.task-meta.big .chip,.task-meta.big .chip.client{background:none!important;padding:0!important;color:var(--ink-2)!important;font-weight:400}
.task-meta.big .chip+.chip::before{content:"·";margin:0 8px;color:var(--ink-3)}
.task-meta.big .chip.due.danger{color:var(--danger)!important;font-weight:500}
.task-meta.big .chip .ic{display:none}
.task-side{background:var(--subtle)!important;border:0!important}
.task-side .btn-block{width:100%}

/* My Day polish */
.page-myday .content>*{max-width:820px;margin-left:auto;margin-right:auto}
.day-head{margin:0 0 32px}
.day-head h1{font-size:28px;letter-spacing:-.025em;line-height:1.2}
.day-date{font-size:13px;font-weight:500;color:var(--ink-3);margin:0 0 6px}
.day-stats{border:0;border-radius:0;gap:12px;margin:0 0 48px;overflow:visible;grid-template-columns:repeat(3,1fr)}
.ds{border:1px solid #ECEEF1!important;border-radius:12px;padding:16px 18px;background:#fff}
.ds:hover{border-color:#DDE1E6!important;background:#fff}
.ds-label{font-size:13px}
.ds-num{font-size:26px;margin-top:2px}
.tgroup-h{font-size:12px;font-weight:600;letter-spacing:.02em;text-transform:uppercase;color:var(--ink-3);border-bottom:0;padding:0 4px 4px;margin:24px 0 0}
.tgroup-h span{font-weight:500}
.tgroup-overdue .tgroup-h{color:#C4320A}
.tgroup .tasks{border-top:1px solid var(--line)}
.sec-row{margin:0 0 4px}
.day-sec>h2.sec,.sec-row h2.sec{font-size:16px}
.done-card>summary.sec{font-size:13px;font-weight:500;color:var(--ink-2);border-bottom:0;padding:6px 4px}
.done-card>summary.sec::before{content:"";width:6px;height:6px;border-right:1.5px solid var(--ink-3);border-bottom:1.5px solid var(--ink-3);transform:rotate(-45deg);margin-right:4px;transition:transform .12s}
.done-card[open]>summary.sec::before{transform:rotate(45deg)}
.day-sec.done-card{margin:0 0 8px}
.day-main>.done-card:first-of-type{margin-top:-16px}

/* empty states */
.empty-state{display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;padding:48px 16px;color:var(--ink-2)}
.empty-state .ic{width:20px;height:20px;padding:10px;box-sizing:content-box;border-radius:50%;background:#F2F4F6;color:var(--ink-3);margin-bottom:8px}
.empty-state b{font-size:14px;font-weight:600;color:var(--ink)}
.empty-state span{font-size:13px}
.empty{padding:32px 4px;text-align:center;color:var(--ink-3)}

/* client page */
.client-hero,.client-hero.card{margin:0 0 32px}
.client-hero .backlink{display:inline-flex;margin:0 0 12px}
.client-hero-main{padding:0 0 4px}
.client-hero .cl-badge.xl{width:48px;height:48px;font-size:17px;border-radius:12px}
.client-hero h1{font-size:26px;margin:0}
.client-hero-meta{margin-top:4px}
.client-hero-meta .who::after{content:"·";margin-left:16px;color:var(--ink-3)}
.client-hero-meta{gap:12px}
.client-sum{display:flex;gap:48px;margin:24px 0 24px;padding:0}
.client-sum div{display:flex;flex-direction:column;gap:2px}
.client-sum dt{font-size:12px;font-weight:500;color:var(--ink-3)}
.client-sum dd{margin:0;font-size:20px;font-weight:600;letter-spacing:-.015em;color:var(--ink)}
.client-hero .tabs{gap:24px;margin-top:8px!important}
.tabs a{font-size:13.5px;padding:10px 0 12px}
.tpanel[hidden]{display:none!important}
.tpanel>.card,.tpanels .card{border:0!important;padding:0!important;background:none!important;margin:0 0 32px}
.tpanel .sec{font-size:15px;margin:0 0 12px}
.tpanel .cat-sec>summary{padding-top:4px}
.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px}
.settings-grid .card{border-top:1px solid var(--line)!important;padding-top:24px!important}
.settings-grid>div>.card:first-child{border-top:0!important;padding-top:0!important}
.done-details>summary{font-size:13px;color:var(--ink-2);padding:12px 4px;cursor:pointer}
.rule{border:0!important;border-bottom:1px solid var(--line)!important;border-radius:0!important;background:none!important;padding:12px 0!important}
.rule p{color:var(--ink-2);font-size:13px;margin:2px 0}

/* lists */
.list{border-radius:12px}
.client-list .list-row{min-height:56px}

@media (max-width:900px){
  body.app{background:#fff!important}
  .dd-menu.dd-up{left:0;right:auto}
  .page-myday .content>*{max-width:none}
  .day-head h1{font-size:22px}
  .day-stats{grid-template-columns:repeat(3,1fr);gap:8px;margin:0 0 32px}
  .ds{padding:12px;border-radius:10px}
  .ds-num{font-size:20px}
  .ds-label{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .client-sum{gap:24px;margin:16px 0}
  .client-sum dd{font-size:17px}
  .client-hero .tabs{overflow-x:auto;scrollbar-width:none;gap:20px;white-space:nowrap}
  .client-hero-main{flex-wrap:wrap}
  .client-hero .head-actions{width:100%}
  .settings-grid{grid-template-columns:1fr;gap:24px}
  .page-head{flex-wrap:wrap;margin:0 0 24px}
  .task-head .head-actions{width:100%}
  .task-head .head-actions form{flex:1}
  .task-head .head-actions form .btn{width:100%;justify-content:center}
}
.sb-actions{align-items:center}
.sb-actions details.dd>summary.new-btn{height:32px!important;min-height:0!important;line-height:1}
.me-dd .avatar,.me-dd-sm .avatar{flex:none!important}
.client-hero-meta .who::after{content:none}

/* task page: fewer boxes */
.task-col>.card{border:0!important;padding:0!important;background:none!important;margin:0 0 40px}
.task-col>.card .sec{font-size:15px;margin:0 0 12px}
.task-col .desc{font-size:15px;line-height:1.6;color:var(--ink)}
.upload-box.compact .drop-zone{padding:12px!important;justify-content:flex-start;gap:8px 12px}
.upload-box.compact .drop-zone>.ic,.upload-box.compact .drop-zone>.fine{display:none}
.upload-box.compact .file-pick.btn-primary{background:#fff!important;color:var(--ink)!important;border-color:var(--line-2)!important}
.upload-box.compact .dz-title{margin:0;font-size:13px;color:var(--ink-2)}
input:not([type=checkbox]):not([type=radio]):not([type=file]),select{height:36px;padding-top:0;padding-bottom:0}
.task-side{padding:20px!important;border-radius:12px!important}
.task-side label{font-size:12px}
@media (max-width:900px){
  .sec-row{flex-direction:column;align-items:flex-start;gap:8px}
  .cat-chips{flex-wrap:nowrap;overflow-x:auto;max-width:100%;scrollbar-width:none}
  .q-reply{display:flex;gap:8px;align-items:flex-end}
  .q-reply textarea{flex:1}
  .q-reply .btn{width:auto!important;flex:none}
}
@media (max-width:900px){.client-hero .cl-badge.xl{display:none}.client-hero h1{font-size:22px}}
.ask-toggle{font-size:13px;color:var(--ink-2)}
.ask-toggle .sw{position:relative;display:inline-block;width:32px;height:18px;border-radius:999px;background:#D1D5DB;flex:none}
.ask-toggle .sw::after{top:2px;left:2px;width:14px;height:14px;box-shadow:0 1px 2px rgba(0,0,0,.15)}
.ask-toggle input:checked+.sw{background:var(--navy)}
.ask-toggle input:checked+.sw::after{left:16px}
.ask-toggle .ic{display:none}
.toggle .sw{background:#D1D5DB;box-shadow:none}
.head-actions .btn{height:34px!important}
.sb-actions{position:relative;z-index:30}
.sidebar nav{position:relative;z-index:1}
details.dd[open]{z-index:70}
.new-dd .dd-menu{left:auto;right:0;min-width:180px}
.sb-actions>details{margin:0;display:flex}
.sb-actions .new-btn{margin:0!important;vertical-align:top}

/* =================== v4.2: tasteful colour =================== */
:root{--teal-ink:#0E7F87;--navy-deep:#173F4D}
a{color:var(--teal-ink)}
.sidebar nav a,.dd-menu a,.list-row,.task-main,.q-task,.asked-list a,.mention-link,.stat,.ds{color:inherit}
@media (min-width:901px){
  html,body.app{background:var(--navy)!important}
  .content,.content.wide{border:0!important;box-shadow:0 1px 2px rgba(0,0,0,.08),0 12px 40px -12px rgba(0,0,0,.25)!important}
}
.sidebar{color:#fff}
.sidebar .brand img{width:148px;opacity:.97}
.sidebar .search-btn{background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.10)!important;color:rgba(255,255,255,.72)!important}
.sidebar .search-btn:hover{background:rgba(255,255,255,.12)!important;color:#fff!important}
.sidebar .search-btn .ic{color:rgba(255,255,255,.6)}
.sidebar .search-btn kbd{background:transparent;border-color:rgba(255,255,255,.2);color:rgba(255,255,255,.6)}
.sidebar .new-btn{background:var(--teal)!important;border-color:var(--teal)!important;color:#fff!important}
.sidebar .new-btn:hover{background:#13A0A8!important}
.sidebar nav a{color:rgba(255,255,255,.74)!important;position:relative}
.sidebar nav a .ic{color:rgba(255,255,255,.55)}
.sidebar nav a:hover:not(.active){background:rgba(255,255,255,.07)!important;color:#fff!important}
.sidebar nav a.active{background:rgba(255,255,255,.12)!important;color:#fff!important;box-shadow:none!important;font-weight:600}
.sidebar nav a.active .ic{color:var(--teal)}
.sidebar nav a.active::before{content:""!important;display:block!important;position:absolute;left:-12px;top:7px;bottom:7px;width:3px;border-radius:0 3px 3px 0;background:var(--teal)}
.sidebar .nav-badge{background:rgba(255,255,255,.16)!important;color:#fff!important}
.sidebar .nav-badge.chat-badge.mention{background:var(--teal)!important}
.me-dd>summary:hover,.me-dd[open]>summary{background:rgba(255,255,255,.08)}
.me-dd>summary b{color:#fff}
.me-dd>summary small{color:rgba(255,255,255,.55)}
.me-dd>summary>.ic{color:rgba(255,255,255,.55)}
.me-dd.is-active>summary{background:rgba(255,255,255,.12);box-shadow:none}
.sidebar .avatar{background:rgba(255,255,255,.14)!important;color:#fff!important}
/* phone chrome in brand navy */
.topbar{background:var(--navy)!important;border-bottom:0!important;backdrop-filter:none}
.topbar .icon-btn,.top-search{color:rgba(255,255,255,.8)!important}
.topbar .avatar{background:rgba(255,255,255,.16)!important;color:#fff!important}
.bottomnav a.active,.bottomnav a.active span,.bottomnav a.active .ic{color:var(--navy)!important}
.bottomnav a.active .ic{color:var(--teal)!important}
.bottomnav .fab{background:var(--teal)!important;box-shadow:0 6px 16px -6px rgba(22,175,184,.6)!important}

/* My Day: soft brand wash on the greeting, tinted numbers */
.page-myday .day-head{background:linear-gradient(115deg,#EEF3F5 0%,#E8F7F8 60%,#DDF3F4 100%)!important;border-radius:16px!important;padding:28px 32px!important;margin:0 auto 24px!important;position:relative;overflow:hidden}
.page-myday .day-head::before,.page-myday .day-head::after{content:none!important;display:none!important}
.page-myday .day-date{color:var(--teal-ink)}
.day-stats{margin:0 0 44px}
.ds{border:0!important;position:relative;padding:16px 18px 16px 18px;display:grid!important;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:12px;row-gap:0;align-items:center}
.ds-ic{grid-row:1 / span 2;width:36px;height:36px;border-radius:10px;display:grid;place-items:center}
.ds-ic .ic{width:18px;height:18px}
.ds-label{grid-column:2}
.ds-num{grid-column:2;margin:0}
.ds-ok{background:#EFFAF4!important}.ds-ok .ds-ic{background:#D3F3E1;color:#087443}
.ds-danger{background:#FEF3F1!important}.ds-danger .ds-ic{background:#FDDCD7;color:#C4320A}.ds-danger .ds-num{color:#B42318}
.ds-calm{background:#F4F6F8!important}.ds-calm .ds-ic{background:#E7EBEF;color:#667085}
.ds-amber{background:#FFF8EB!important}.ds-amber .ds-ic{background:#FEEBC8;color:#B54708}
.ds-teal{background:#EEFAFA!important}.ds-teal .ds-ic{background:#CDEFF1;color:#0E7F87}
.ds:hover{filter:brightness(.985)}
.ds-label{color:#475467}

/* pills: soft colour for due / status / priority */
.task-meta{gap:8px!important;align-items:center}
.task-meta .chip+.chip::before,.task-meta.big .chip+.chip::before{content:none!important}
.task-meta .chip.due.danger,.task-meta.big .chip.due.danger{background:#FEF3F2!important;color:#B42318!important;padding:1px 8px!important;border-radius:999px;font-size:12px;font-weight:500}
.task-meta .chip.due.warn,.task-meta.big .chip.due.warn{background:#FFF6E5!important;color:#B54708!important;padding:1px 8px!important;border-radius:999px;font-size:12px;font-weight:500}
.task-meta .chip.due.soon,.task-meta.big .chip.due.soon{background:#E9F8F9!important;color:#0E7F87!important;padding:1px 8px!important;border-radius:999px;font-size:12px;font-weight:500}
.task-meta .chip.prio-urgent,.task-meta.big .chip.prio-urgent{background:#FFF1EC!important;color:#C4320A!important;padding:1px 8px!important;border-radius:999px;font-size:12px;font-weight:500}
.task-meta.big .chip.status-done{background:#ECFDF3!important;color:#067647!important;padding:1px 8px!important;border-radius:999px}
.task-meta.big .chip.status-in_progress{background:#EFF4FF!important;color:#3538CD!important;padding:1px 8px!important;border-radius:999px}
.task-meta.big .chip.status-waiting{background:#FFF6E5!important;color:#B54708!important;padding:1px 8px!important;border-radius:999px}
.task-meta .chip.snooze{background:#F2F4F7!important;color:#475467!important;padding:1px 8px!important;border-radius:999px;font-size:12px}
.task-meta .chip.client{color:#475467!important}
.pill-ok{background:#ECFDF3!important;color:#067647!important}
.badge-ok{background:#ECFDF3!important;color:#067647!important}
.cat-od{color:#C4320A}

/* client initials: pastel, consistent per client */
.cl-badge,.cl-badge[class*="cl-c"]{border-radius:50%!important}
.cl-badge.cl-c0{background:#FDEAD7!important;color:#B93815!important}
.cl-badge.cl-c1{background:#D3F8DF!important;color:#087443!important}
.cl-badge.cl-c2{background:#EBE9FE!important;color:#5925DC!important}
.cl-badge.cl-c3{background:#D1E9FF!important;color:#175CD3!important}
.cl-badge.cl-c4{background:#FCE7F6!important;color:#C11574!important}
.cl-badge.cl-c5{background:#CCF5F5!important;color:#0E7F87!important}
.cl-badge.cl-c6{background:#FEF0C7!important;color:#B54708!important}
.cl-badge.cl-c7{background:#E0EAFF!important;color:#3538CD!important}
.client-hero .cl-badge.xl{border-radius:50%!important}
.ch-item .cl-badge,.chat-head .cl-badge{border-radius:50%!important}

/* accents: tabs, filters, ticks, focus */
.tabs a.on,.tabs:not(.ink-ready) a.on{border-bottom-color:var(--teal)!important}
.cat-chip.on{background:#E6F7F8!important;color:var(--teal-ink)!important}
.cat-chip.on b{color:var(--teal-ink)}
.tick:hover{border-color:var(--teal)!important}
.tick .tick-path{stroke:var(--teal)}
.task.is-done .tick,.task.completing .tick{background:var(--teal)!important;border-color:var(--teal)!important}
.tgroup-today .tgroup-h{color:#B54708}
.tgroup-upcoming .tgroup-h{color:var(--teal-ink)}
.dot-label.on i,.qb-status.on i{background:#17B26A!important}
.backlink{color:var(--ink-2)!important}
.more a{color:var(--teal-ink)!important}
.q-list{border-color:#F5D9A8;background:#FFFCF5}
.q-item{background:none!important}

/* login: navy → teal backdrop, white card */
.auth-split{background:linear-gradient(135deg,#173F4D 0%,#1D4757 45%,#13838B 100%)!important}
.auth-card{border:0!important;box-shadow:0 24px 60px -20px rgba(0,0,0,.45)!important}
.auth-foot,.auth-foot a{color:rgba(255,255,255,.7)!important}
@media (max-width:900px){
  .auth-split{background:linear-gradient(160deg,#173F4D 0%,#1D4757 55%,#13838B 100%)!important}
  .auth-card{background:#fff!important;border-radius:16px;margin:0 4px}
  .page-myday .day-head{padding:20px;border-radius:14px}
  .ds{grid-template-columns:1fr;padding:12px!important}
  .ds-ic{grid-row:auto;width:28px;height:28px;border-radius:8px;margin-bottom:8px}
  .ds-ic .ic{width:15px;height:15px}
  .ds-label,.ds-num{grid-column:1}
}
.client-sum dd.txt-danger{color:#B42318}
@media (max-width:900px){.ds-num{font-size:18px}.ds-label{font-size:11.5px}}
.auth-card{padding:36px 36px 28px!important;border-radius:16px!important}
@media (max-width:900px){.auth-card{padding:28px 24px 20px!important}}