/* =====================================================================================================================
   Chetana Books design system (docs/UX_DESIGN_SYSTEM.md)
   One file, token-first. Every colour, space, radius, shadow and type size below comes from a --cb-* token; the older
   short names (--navy, --accent, --muted …) are kept as aliases so existing pages and inline styles keep working.
   Themes: light (default), dark, system. <html data-theme="light|dark"> forces one; otherwise prefers-color-scheme decides.
   ===================================================================================================================== */

:root{
  /* type */
  --cb-font:"Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;
  --cb-font-num:var(--cb-font);
  --cb-text-display:28px;--cb-text-heading:20px;--cb-text-subheading:15px;--cb-text-body:14px;--cb-text-caption:12px;
  /* space */
  --cb-s1:4px;--cb-s2:8px;--cb-s3:12px;--cb-s4:16px;--cb-s5:24px;--cb-s6:32px;--cb-s7:48px;
  /* radius */
  --cb-r-sm:6px;--cb-r-md:10px;--cb-r-lg:14px;
  /* motion */
  --cb-ease:cubic-bezier(.2,.7,.2,1);--cb-fast:120ms;--cb-med:200ms;
  /* layout */
  --cb-side:248px;--cb-side-collapsed:64px;--cb-top:56px;
  /* light palette — ivory surfaces, deep emerald primary, warm gold accent (docs/CHETANA_DESIGN_SYSTEM_2.md) */
  --cb-background:#FAF9F5;--cb-surface:#ffffff;--cb-surface-elevated:#ffffff;--cb-surface-sunken:#F3F1EA;
  --cb-border:#E6E3DA;--cb-border-strong:#D2CEC0;
  --cb-text:#17201D;--cb-text-muted:#56615C;--cb-text-faint:#66706B;
  --cb-primary:#087F5B;--cb-primary-hover:#07563F;--cb-primary-soft:#E3F2EB;--cb-on-primary:#ffffff;
  --cb-accent:#D4A72C;--cb-gold:#D4A72C;--cb-gold-soft:#FBF3D8;--cb-gold-ink:#6F5200;
  --cb-success:#16855B;--cb-success-soft:#E4F3EB;--cb-success-ink:#0E6845;
  --cb-warning:#C98A17;--cb-warning-soft:#FCF0D6;--cb-warning-ink:#82540A;
  --cb-danger:#C2413A;--cb-danger-soft:#FBEAE8;--cb-danger-ink:#A12F29;
  --cb-info:#3F6A86;--cb-info-soft:#E8EFF3;--cb-info-ink:#2D5169;
  --cb-side-bg:#0F1A16;--cb-side-text:#C9D6D0;--cb-side-muted:#8CA096;--cb-side-active:rgba(8,127,91,.26);--cb-side-hover:rgba(255,255,255,.055);
  --cb-shadow-sm:0 1px 2px rgba(23,32,29,.06);--cb-shadow-md:0 6px 20px rgba(23,32,29,.10);--cb-shadow-lg:0 20px 50px rgba(23,32,29,.18);
  --cb-focus:0 0 0 3px rgba(8,127,91,.38);
  --cb-chart-1:#087F5B;--cb-chart-2:#D4A72C;--cb-chart-3:#3F6A86;--cb-chart-4:#C98A17;--cb-chart-neg:#C2413A;--cb-chart-grid:#E6E3DA;
  /* UX 3.0 semantic aliases (one system: these point at the theme tokens above) */
  --cb-bg:var(--cb-background);--cb-surface-raised:var(--cb-surface-elevated);--cb-surface-subtle:var(--cb-surface-sunken);--cb-surface-interactive:color-mix(in srgb,var(--cb-primary) 6%,var(--cb-surface));
  --cb-primary-dark:var(--cb-primary-hover);--cb-error:var(--cb-danger);
  --cb-font-display:"Palatino Linotype","Palatino","Book Antiqua","URW Palladio L",Georgia,serif;
  --cb-r-ctl:8px;--cb-r-card:12px;--cb-r-panel:14px;
  --cb-e1:0 0 0 1px var(--cb-border);--cb-e2:0 1px 2px rgba(23,32,29,.05),0 0 0 1px var(--cb-border);--cb-e3:0 12px 32px -8px rgba(23,32,29,.18),0 0 0 1px var(--cb-border);
  --cb-module:var(--cb-primary);
  color-scheme:light;
  /* legacy aliases (existing pages / inline styles) */
  --navy:var(--cb-primary);--accent:var(--cb-accent);--page:var(--cb-background);--border:var(--cb-border);--text:var(--cb-text);--muted:var(--cb-text-muted);
  --ok:var(--cb-success-ink);--warn:var(--cb-warning-ink);--err:var(--cb-danger-ink);--okbg:var(--cb-success-soft);--warnbg:var(--cb-warning-soft);--errbg:var(--cb-danger-soft);
}
:root[data-theme="dark"]{
  --cb-background:#0B1411;--cb-surface:#111C18;--cb-surface-elevated:#172520;--cb-surface-sunken:#0D1713;
  --cb-border:#23332D;--cb-border-strong:#33473F;
  --cb-text:#E9F0EC;--cb-text-muted:#A3B4AC;--cb-text-faint:#8EA198;
  --cb-primary:#3DBF92;--cb-primary-hover:#63D1AB;--cb-primary-soft:#12302A;--cb-on-primary:#04201A;
  --cb-accent:#E3B94A;--cb-gold:#E3B94A;--cb-gold-soft:#2C2610;--cb-gold-ink:#F0CE75;
  --cb-success:#4CCB98;--cb-success-soft:#0F2A20;--cb-success-ink:#6FDDB0;
  --cb-warning:#F2BE5A;--cb-warning-soft:#2B2209;--cb-warning-ink:#F5CB78;
  --cb-danger:#F08A82;--cb-danger-soft:#33141A;--cb-danger-ink:#F6A39C;
  --cb-info:#8FB6CF;--cb-info-soft:#15242E;--cb-info-ink:#A8C8DC;
  --cb-side-bg:#080F0C;--cb-side-text:#C0D0C8;--cb-side-muted:#869B90;--cb-side-active:rgba(61,191,146,.2);--cb-side-hover:rgba(255,255,255,.05);
  --cb-shadow-sm:0 1px 2px rgba(0,0,0,.4);--cb-shadow-md:0 8px 24px rgba(0,0,0,.45);--cb-shadow-lg:0 24px 60px rgba(0,0,0,.6);
  --cb-focus:0 0 0 3px rgba(61,191,146,.45);
  --cb-chart-1:#3DBF92;--cb-chart-2:#E3B94A;--cb-chart-3:#8FB6CF;--cb-chart-4:#F2BE5A;--cb-chart-neg:#F08A82;--cb-chart-grid:#23332D;
  color-scheme:dark;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
  --cb-background:#0B1411;--cb-surface:#111C18;--cb-surface-elevated:#172520;--cb-surface-sunken:#0D1713;
  --cb-border:#23332D;--cb-border-strong:#33473F;
  --cb-text:#E9F0EC;--cb-text-muted:#A3B4AC;--cb-text-faint:#8EA198;
  --cb-primary:#3DBF92;--cb-primary-hover:#63D1AB;--cb-primary-soft:#12302A;--cb-on-primary:#04201A;
  --cb-accent:#E3B94A;--cb-gold:#E3B94A;--cb-gold-soft:#2C2610;--cb-gold-ink:#F0CE75;
  --cb-success:#4CCB98;--cb-success-soft:#0F2A20;--cb-success-ink:#6FDDB0;
  --cb-warning:#F2BE5A;--cb-warning-soft:#2B2209;--cb-warning-ink:#F5CB78;
  --cb-danger:#F08A82;--cb-danger-soft:#33141A;--cb-danger-ink:#F6A39C;
  --cb-info:#8FB6CF;--cb-info-soft:#15242E;--cb-info-ink:#A8C8DC;
  --cb-side-bg:#080F0C;--cb-side-text:#C0D0C8;--cb-side-muted:#869B90;--cb-side-active:rgba(61,191,146,.2);--cb-side-hover:rgba(255,255,255,.05);
  --cb-shadow-sm:0 1px 2px rgba(0,0,0,.4);--cb-shadow-md:0 8px 24px rgba(0,0,0,.45);--cb-shadow-lg:0 24px 60px rgba(0,0,0,.6);
  --cb-focus:0 0 0 3px rgba(61,191,146,.45);
  --cb-chart-1:#3DBF92;--cb-chart-2:#E3B94A;--cb-chart-3:#8FB6CF;--cb-chart-4:#F2BE5A;--cb-chart-neg:#F08A82;--cb-chart-grid:#23332D;
  color-scheme:dark;
  }
}

/* ---- base ---------------------------------------------------------------------------------------------------------- */
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font:var(--cb-text-body)/1.5 var(--cb-font);color:var(--cb-text);background:var(--cb-background);-webkit-font-smoothing:antialiased}
a{color:var(--cb-primary);text-decoration:none}a:hover{text-decoration:underline}
:focus-visible{outline:none;box-shadow:var(--cb-focus);border-radius:var(--cb-r-sm)}
.skip{position:absolute;left:-999px;top:8px;background:var(--cb-primary);color:var(--cb-on-primary);padding:8px 14px;border-radius:var(--cb-r-sm);z-index:100}
.skip:focus{left:8px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.devbanner{background:var(--cb-warning-soft);color:var(--cb-warning-ink);text-align:center;padding:3px 10px;font-size:11px;letter-spacing:.3px;border-bottom:1px solid var(--cb-border)}
.devbanner code{background:rgba(0,0,0,.06);padding:1px 5px;border-radius:4px}

/* ---- application shell --------------------------------------------------------------------------------------------- */
.shell{display:grid;grid-template-columns:var(--cb-side) minmax(0,1fr);min-height:calc(100vh - 24px);transition:grid-template-columns var(--cb-med) var(--cb-ease)}
.shell[data-collapsed="true"]{grid-template-columns:var(--cb-side-collapsed) minmax(0,1fr)}
.sidebar{position:sticky;top:0;align-self:start;height:100vh;overflow-y:auto;overflow-x:hidden;background:var(--cb-side-bg);color:var(--cb-side-text);padding:var(--cb-s3) var(--cb-s2) var(--cb-s5);scrollbar-width:thin}
.sidebar .brand{display:flex;align-items:center;gap:10px;padding:6px 8px 14px;color:#fff;min-height:56px}
.sidebar .brand img{border-radius:9px;flex:none;width:34px;height:34px}
.sidebar .brand .bt{display:flex;flex-direction:column;line-height:1.2;overflow:hidden}
.sidebar .brand strong{font-size:16px;font-weight:650;letter-spacing:-.01em}.sidebar .brand span{color:var(--cb-side-muted);font-size:10.5px;white-space:normal}
.sidebar .grp{margin:14px 0 4px;padding:0 10px;color:var(--cb-side-muted);font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;white-space:nowrap}
.sidebar a.nav{position:relative;display:flex;align-items:center;gap:10px;color:var(--cb-side-text);padding:7px 10px;margin:1px 0;border-radius:var(--cb-r-sm);white-space:nowrap;text-decoration:none;transition:background var(--cb-fast) var(--cb-ease)}
.sidebar a.nav .ic{width:18px;height:18px;flex:none;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;opacity:.85}
.sidebar a.nav .lb{overflow:hidden;text-overflow:ellipsis}
.sidebar a.nav:hover{background:var(--cb-side-hover);text-decoration:none}
.sidebar a.nav.active{background:var(--cb-side-active);color:#fff;font-weight:600}
.sidebar a.nav.active::before{content:"";position:absolute;left:-8px;top:8px;bottom:8px;width:3px;border-radius:0 3px 3px 0;background:var(--cb-accent)}
.sidebar a.nav:focus-visible{box-shadow:0 0 0 2px var(--cb-accent)}
.shell[data-collapsed="true"] .sidebar .lb,.shell[data-collapsed="true"] .sidebar .bt,.shell[data-collapsed="true"] .sidebar .grp{display:none}
.shell[data-collapsed="true"] .sidebar a.nav{justify-content:center;padding:9px 0}
.shell[data-collapsed="true"] .sidebar a.nav[data-tip]:hover::after{content:attr(data-tip);position:fixed;left:calc(var(--cb-side-collapsed) + 6px);background:var(--cb-surface-elevated);color:var(--cb-text);border:1px solid var(--cb-border);padding:4px 10px;border-radius:var(--cb-r-sm);box-shadow:var(--cb-shadow-md);font-size:12px;z-index:60;pointer-events:none}
.main{min-width:0;display:flex;flex-direction:column}
.topbar{position:sticky;top:0;z-index:30;display:flex;gap:var(--cb-s3);align-items:center;background:color-mix(in srgb,var(--cb-surface) 92%,transparent);backdrop-filter:saturate(1.4) blur(8px);border-bottom:1px solid var(--cb-border);padding:0 var(--cb-s5);min-height:var(--cb-top);flex-wrap:wrap}
.topbar .grow{flex:1}
.iconbtn{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;padding:0;margin:0;border:1px solid transparent;background:transparent;color:var(--cb-text-muted);border-radius:var(--cb-r-sm);cursor:pointer;transition:background var(--cb-fast) var(--cb-ease)}
.iconbtn:hover{background:var(--cb-surface-sunken);color:var(--cb-text);opacity:1}
.iconbtn .ic{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.iconbtn .dot{position:absolute;top:5px;right:5px;min-width:16px;height:16px;border-radius:8px;background:var(--cb-danger);color:#fff;font-size:10px;line-height:16px;text-align:center;padding:0 4px}
.iconbtn{position:relative}
.menu-toggle{display:none}
.searchbtn span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.searchbtn{display:flex;align-items:center;gap:8px;min-width:240px;max-width:420px;flex:1;height:34px;padding:0 10px;margin:0;border:1px solid var(--cb-border);background:var(--cb-surface-sunken);color:var(--cb-text-muted);border-radius:var(--cb-r-md);cursor:pointer;font:inherit;text-align:left}
.searchbtn:hover{border-color:var(--cb-border-strong);opacity:1}
.searchbtn .ic{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round}
.searchbtn kbd,.kbd{white-space:nowrap;margin-left:auto;font:11px var(--cb-font);border:1px solid var(--cb-border-strong);border-bottom-width:2px;border-radius:5px;padding:0 6px;color:var(--cb-text-muted);background:var(--cb-surface)}
.ctxbar{display:flex;align-items:center;gap:var(--cb-s2);flex-wrap:wrap}
.whoami{display:flex;align-items:center;gap:8px;color:var(--cb-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px;flex-wrap:wrap}
.whoami .sep{color:var(--cb-text-faint);margin:0 2px}.whoami a{color:var(--cb-text);font-weight:600;text-decoration:none}
.fy{color:var(--cb-text-muted);font-weight:600;white-space:nowrap;font-size:13px}
.pop{position:relative}.pop>summary{list-style:none;cursor:pointer}.pop>summary::-webkit-details-marker{display:none}
.pop .panel{position:absolute;right:0;top:calc(100% + 6px);min-width:280px;max-width:min(380px,92vw);background:var(--cb-surface-elevated);border:1px solid var(--cb-border);border-radius:var(--cb-r-md);box-shadow:var(--cb-shadow-md);z-index:50;padding:6px;animation:cb-pop var(--cb-med) var(--cb-ease)}
.pop .panel a,.pop .panel button.row{display:flex;gap:8px;align-items:center;width:100%;margin:0;padding:8px 10px;color:var(--cb-text);text-decoration:none;border-radius:var(--cb-r-sm);border:0;background:transparent;font:inherit;text-align:left;cursor:pointer}
.pop .panel a:hover,.pop .panel button.row:hover{background:var(--cb-surface-sunken);opacity:1}
.pop .panel .ph{padding:6px 10px;color:var(--cb-text-muted);font-size:11px;letter-spacing:.06em;text-transform:uppercase}
.pop .panel .empty{padding:14px 10px;color:var(--cb-text-muted)}
.quick>summary{background:var(--cb-primary);color:var(--cb-on-primary);padding:6px 12px;border-radius:var(--cb-r-sm);font-weight:600;font-size:13px;display:inline-block}
.quick .menu{position:absolute;right:0;top:calc(100% + 6px);min-width:200px;background:var(--cb-surface-elevated);border:1px solid var(--cb-border);border-radius:var(--cb-r-md);box-shadow:var(--cb-shadow-md);z-index:50;padding:6px;animation:cb-pop var(--cb-med) var(--cb-ease)}
.quick .menu a{display:block;padding:7px 10px;color:var(--cb-text);text-decoration:none;border-radius:var(--cb-r-sm)}.quick .menu a:hover{background:var(--cb-surface-sunken)}
.content{padding:var(--cb-s5) var(--cb-s6) 72px;width:100%;max-width:1440px;margin:0 auto}
.scrim{display:none}
.avatar{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:var(--cb-primary-soft);color:var(--cb-primary);font-weight:650;border:1px solid var(--cb-border)}
.usermenu .panel{min-width:220px}
.topbar{flex-wrap:nowrap}.topbar>*{flex:none}.topbar .grow{flex:1 1 0;min-width:0}.topbar .searchbtn{flex:1 1 240px;min-width:170px;max-width:380px}.whoami{flex:0 1 auto;min-width:0;overflow:hidden;flex-wrap:nowrap;white-space:nowrap}.whoami strong{overflow:hidden;text-overflow:ellipsis}.actas label{display:none}.actas select{max-width:150px}

/* ---- command palette ------------------------------------------------------------------------------------------------ */
.palette{position:fixed;inset:0;z-index:90;display:none;align-items:flex-start;justify-content:center;padding:12vh 16px 16px;background:rgba(8,12,20,.55);backdrop-filter:blur(3px)}
.palette[data-open="true"]{display:flex;animation:cb-fade var(--cb-fast) var(--cb-ease)}
.palette .box{width:min(640px,100%);max-height:70vh;display:flex;flex-direction:column;background:var(--cb-surface-elevated);border:1px solid var(--cb-border);border-radius:var(--cb-r-lg);box-shadow:var(--cb-shadow-lg);overflow:hidden;animation:cb-pop var(--cb-med) var(--cb-ease)}
.palette .qrow{display:flex;align-items:center;gap:10px;padding:0 14px;border-bottom:1px solid var(--cb-border)}
.palette .qrow .ic{width:18px;height:18px;stroke:var(--cb-text-muted);fill:none;stroke-width:1.8;stroke-linecap:round}
.palette input[type=search]{-webkit-appearance:none;appearance:none}.palette input::-webkit-search-cancel-button{display:none}.palette input{border:0;outline:0;box-shadow:none;background:transparent;color:var(--cb-text);font-size:16px;padding:14px 0;width:100%}
.palette input:focus{outline:none;box-shadow:none}
.palette .list{overflow-y:auto;padding:6px}
.palette .gh{padding:8px 10px 4px;color:var(--cb-text-muted);font-size:11px;letter-spacing:.07em;text-transform:uppercase}
.palette .it{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:var(--cb-r-sm);cursor:pointer;color:var(--cb-text);text-decoration:none}
.palette .it[aria-selected="true"]{background:var(--cb-primary-soft)}
.palette .it .t{flex:1;min-width:0}.palette .it .t b{font-weight:600}.palette .it .t small{display:block;color:var(--cb-text-muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.palette .it .ty{font-size:11px;color:var(--cb-text-muted);border:1px solid var(--cb-border);border-radius:10px;padding:0 8px;white-space:nowrap}
.palette .foot{display:flex;gap:14px;padding:8px 14px;border-top:1px solid var(--cb-border);color:var(--cb-text-muted);font-size:12px;flex-wrap:wrap}
.palette .none{padding:22px 14px;color:var(--cb-text-muted);text-align:center}

/* ---- typography / page header --------------------------------------------------------------------------------------- */
h1{font-size:var(--cb-text-display);line-height:1.2;font-weight:650;letter-spacing:-.02em;color:var(--cb-text);margin:0 0 var(--cb-s1)}
h2{font-size:var(--cb-text-subheading);font-weight:620;color:var(--cb-text);margin:var(--cb-s5) 0 var(--cb-s2);letter-spacing:-.005em}
h3{font-size:14px;font-weight:620;margin:0 0 4px}
.sub{color:var(--cb-text-muted);margin:0 0 var(--cb-s4);max-width:78ch}
.pagehead{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--cb-s4);flex-wrap:wrap;margin-bottom:var(--cb-s4)}
.pagehead h1{margin:0}.pagehead .sub{margin:4px 0 0}.pagehead .acts{display:flex;gap:var(--cb-s2);flex-wrap:wrap}
.eyebrow{color:var(--cb-text-muted);font-size:12px;letter-spacing:.06em;text-transform:uppercase;font-weight:600}
.hint{font-size:12px;color:var(--cb-text-muted)}
.num{font-family:var(--cb-font-num);font-variant-numeric:tabular-nums}

/* ---- surfaces ------------------------------------------------------------------------------------------------------- */
.card{background:var(--cb-surface);border:1px solid var(--cb-border);border-radius:var(--cb-r-md);padding:var(--cb-s4);margin-bottom:var(--cb-s4);box-shadow:var(--cb-shadow-sm)}
.card>h2:first-child,.card>h3:first-child{margin-top:0}
.two{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:var(--cb-s4);align-items:start}
.two>*,.three>*{min-width:0}
.three{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--cb-s4)}

/* summary cards used by several overview pages (.cards > .card with .sub label and .big figure) */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:var(--cb-s3);margin-bottom:var(--cb-s4)}
.cards .card{margin:0;display:flex;flex-direction:column;gap:2px}
.cards .card .sub{margin:0;font-size:12px;color:var(--cb-text-muted)}
.big{font-size:24px;font-weight:650;letter-spacing:-.01em;font-variant-numeric:tabular-nums;color:var(--cb-text)}

/* ---- stat tiles / KPIs ---------------------------------------------------------------------------------------------- */
.tiles,.kpis{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:var(--cb-s3);margin-bottom:var(--cb-s4)}
.tile{position:relative;background:var(--cb-surface);border:1px solid var(--cb-border);border-radius:var(--cb-r-md);padding:12px 14px;box-shadow:var(--cb-shadow-sm);transition:border-color var(--cb-fast) var(--cb-ease),transform var(--cb-fast) var(--cb-ease)}
.tile::before{content:"";position:absolute;left:0;top:12px;bottom:12px;width:3px;border-radius:0 3px 3px 0;background:var(--cb-border-strong)}
.tile.danger::before{background:var(--cb-danger)}.tile.warn::before{background:var(--cb-warning)}.tile.ok::before{background:var(--cb-success)}.tile.info::before{background:var(--cb-accent)}
.tile .l{color:var(--cb-text-muted);font-size:12px}
.tile .v{font-size:22px;font-weight:650;letter-spacing:-.01em;color:var(--cb-text);white-space:nowrap;font-variant-numeric:tabular-nums}
.tile .hint{font-size:12px;color:var(--cb-text-muted)}
.kpis .tile a{font-size:12px}
.stat{background:var(--cb-surface);border:1px solid var(--cb-border);border-radius:var(--cb-r-md);padding:var(--cb-s4);box-shadow:var(--cb-shadow-sm)}
.stat .k{color:var(--cb-text-muted);font-size:12px;font-weight:600;letter-spacing:.03em}
.stat .big{font-size:30px;font-weight:660;letter-spacing:-.02em;font-variant-numeric:tabular-nums;margin:2px 0}
.stat .delta{font-size:12px;color:var(--cb-text-muted)}
.stat .delta.up{color:var(--cb-success-ink)}.stat .delta.down{color:var(--cb-danger-ink)}
.stat svg.spark{display:block;width:100%;height:34px;margin-top:6px}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--cb-s3);margin-bottom:var(--cb-s4)}

/* ---- tables --------------------------------------------------------------------------------------------------------- */
.tablewrap{overflow:auto;border:1px solid var(--cb-border);border-radius:var(--cb-r-md);background:var(--cb-surface);max-height:none;box-shadow:var(--cb-shadow-sm)}
table{border-collapse:separate;border-spacing:0;width:100%;background:var(--cb-surface)}
.tablewrap table{margin:0}
th{position:sticky;top:0;z-index:2;background:var(--cb-surface-sunken);color:var(--cb-text-muted);text-align:left;padding:9px 12px;font-weight:600;font-size:12px;letter-spacing:.03em;text-transform:none;white-space:nowrap;border-bottom:1px solid var(--cb-border)}
td{padding:9px 12px;border-bottom:1px solid var(--cb-border);vertical-align:top}
tbody tr:last-child td{border-bottom:0}
tbody tr:hover td{background:color-mix(in srgb,var(--cb-primary-soft) 45%,transparent)}
tr.danger td{background:var(--cb-danger-soft)}tr.warn td{background:var(--cb-warning-soft)}tr.ok td{background:var(--cb-success-soft)}tr.muted td{color:var(--cb-text-muted)}
td.n,th.n{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
tfoot td,tfoot th{font-weight:620;background:var(--cb-surface-sunken);position:static;border-top:1px solid var(--cb-border-strong)}
.table-empty td{text-align:center;color:var(--cb-text-muted);padding:28px 12px}

/* ---- buttons / forms ------------------------------------------------------------------------------------------------ */
.btn,button{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border:1px solid var(--cb-border-strong);background:var(--cb-surface);color:var(--cb-text);border-radius:var(--cb-r-sm);text-decoration:none;cursor:pointer;font:inherit;font-weight:520;margin:0 6px 6px 0;transition:background var(--cb-fast) var(--cb-ease),border-color var(--cb-fast) var(--cb-ease),transform var(--cb-fast) var(--cb-ease)}
.btn:hover,button:hover{background:var(--cb-surface-sunken);text-decoration:none}
.btn:active,button:active{transform:translateY(1px)}
.btn.primary,button.primary{background:var(--cb-primary);border-color:var(--cb-primary);color:var(--cb-on-primary);font-weight:600}
.btn.primary:hover,button.primary:hover{background:var(--cb-primary-hover);opacity:1}
.btn.danger,button.danger{background:var(--cb-danger);border-color:var(--cb-danger);color:#fff}
.btn[disabled],button[disabled],button[aria-busy="true"]{opacity:.55;cursor:progress}
label{display:block;font-size:12px;font-weight:560;color:var(--cb-text-muted);margin:0 0 4px}
input,select,textarea{width:100%;padding:8px 10px;border:1px solid var(--cb-border-strong);border-radius:var(--cb-r-sm);font:inherit;color:var(--cb-text);background:var(--cb-surface);transition:border-color var(--cb-fast) var(--cb-ease),box-shadow var(--cb-fast) var(--cb-ease)}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--cb-primary);box-shadow:var(--cb-focus)}
input::placeholder{color:var(--cb-text-faint)}
input[type=checkbox],input[type=radio]{width:auto;accent-color:var(--cb-primary)}
input:invalid:not(:placeholder-shown){border-color:var(--cb-danger)}
.req::after{content:" *";color:var(--cb-danger-ink)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:var(--cb-s3) var(--cb-s4)}.grid .span2{grid-column:span 2}
.field{margin-bottom:2px}

/* ---- messages / badges ---------------------------------------------------------------------------------------------- */
.msg{display:flex;gap:10px;border-radius:var(--cb-r-md);padding:10px 14px;margin-bottom:var(--cb-s3);border:1px solid;animation:cb-pop var(--cb-med) var(--cb-ease)}
.msg ul{margin:0;padding-left:18px}
.msg.ok{background:var(--cb-success-soft);color:var(--cb-success-ink);border-color:color-mix(in srgb,var(--cb-success) 35%,transparent)}
.msg.err{background:var(--cb-danger-soft);color:var(--cb-danger-ink);border-color:color-mix(in srgb,var(--cb-danger) 35%,transparent)}
.msg.warn{background:var(--cb-warning-soft);color:var(--cb-warning-ink);border-color:color-mix(in srgb,var(--cb-warning) 35%,transparent)}
.msg.info{background:var(--cb-info-soft);color:var(--cb-info-ink);border-color:color-mix(in srgb,var(--cb-info) 35%,transparent)}
.badge{display:inline-flex;align-items:center;gap:4px;padding:1px 9px;border-radius:999px;font-size:12px;font-weight:560;background:var(--cb-surface-sunken);color:var(--cb-text-muted);border:1px solid var(--cb-border)}
.badge.danger{background:var(--cb-danger-soft);color:var(--cb-danger-ink);border-color:transparent}.badge.ok{background:var(--cb-success-soft);color:var(--cb-success-ink);border-color:transparent}
.badge.warn{background:var(--cb-warning-soft);color:var(--cb-warning-ink);border-color:transparent}.badge.info{background:var(--cb-info-soft);color:var(--cb-info-ink);border-color:transparent}

/* ---- empty / loading states ----------------------------------------------------------------------------------------- */
.empty-state{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;padding:var(--cb-s6) var(--cb-s4);color:var(--cb-text-muted);border:1px dashed var(--cb-border-strong);border-radius:var(--cb-r-md);background:var(--cb-surface)}
.empty-state strong{color:var(--cb-text);font-size:15px}
.skeleton{position:relative;overflow:hidden;background:var(--cb-surface-sunken);border-radius:var(--cb-r-sm);min-height:14px}
.skeleton::after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--cb-text) 8%,transparent),transparent);animation:cb-shimmer 1.4s infinite}
.spinner{width:14px;height:14px;border-radius:50%;border:2px solid var(--cb-border-strong);border-top-color:var(--cb-primary);animation:cb-spin .8s linear infinite;display:inline-block}

/* ---- tabs / misc ---------------------------------------------------------------------------------------------------- */
.tabs{display:flex;gap:4px;flex-wrap:wrap;margin:var(--cb-s3) 0 var(--cb-s3);border-bottom:1px solid var(--cb-border);padding-bottom:0}
.tabs a{padding:7px 12px;border-radius:var(--cb-r-sm) var(--cb-r-sm) 0 0;border:1px solid transparent;border-bottom:0;text-decoration:none;color:var(--cb-text-muted);font-weight:540;margin-bottom:-1px}
.tabs a:hover{color:var(--cb-text);background:var(--cb-surface-sunken)}
.tabs a.active{color:var(--cb-primary);background:var(--cb-surface);border-color:var(--cb-border);border-bottom:1px solid var(--cb-surface);font-weight:620}
.totals{max-width:360px;margin-left:auto}.totals div{display:flex;justify-content:space-between;padding:3px 0}.totals .grand{border-top:1px solid var(--cb-border);margin-top:6px;padding-top:8px;font-size:18px;font-weight:700;color:var(--cb-text)}
.words{color:var(--cb-text-muted);font-size:12px;text-align:right}
.items input{padding:6px 8px}.items td{padding:4px}
.demo{border:2px dashed var(--cb-warning);background:var(--cb-warning-soft);color:var(--cb-warning-ink);padding:10px 14px;border-radius:var(--cb-r-md);font-weight:600;margin-bottom:12px}
details.help{background:var(--cb-surface);border:1px solid var(--cb-border);border-radius:var(--cb-r-md);padding:8px 14px;margin:10px 0}details.help summary{cursor:pointer;color:var(--cb-primary);font-weight:600}
.actas{display:flex;align-items:center;margin:0;gap:6px}.actas select{padding:5px 8px;width:auto}
.permgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:6px 18px}.permgrid label{display:flex;gap:6px;align-items:flex-start;color:var(--cb-text);font-size:13px;margin:0}.permgrid input{width:auto;margin-top:3px}
.changes td.before{background:var(--cb-danger-soft)}.changes td.after{background:var(--cb-success-soft)}
.signout{margin:0;display:flex;gap:6px;align-items:center}.signout .btn,.signout button{margin:0;padding:5px 10px}
.loginbox{max-width:420px;margin:60px auto}.loginbox .card{padding:24px}
.checklist{list-style:none;padding:0;margin:0}.checklist li{display:flex;gap:10px;padding:8px 10px;border-bottom:1px solid var(--cb-border)}.checklist .mark{font-weight:700;width:22px;text-align:center}
.checklist li.ok .mark{color:var(--cb-success-ink)}.checklist li.bad .mark{color:var(--cb-danger-ink)}.checklist .detail{color:var(--cb-text-muted);font-size:13px}
.brandstory{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:28px;align-items:center;background:var(--cb-surface);color:var(--cb-text);border:1px solid var(--cb-border);border-radius:var(--cb-r-lg);padding:28px 28px 28px 36px;margin-bottom:16px;max-width:1100px}
.brandstory h1{font-size:34px;margin:0 0 6px;color:var(--cb-primary-hover)}.brandstory h2{margin-top:26px;color:var(--cb-primary-hover)}
.brandstory .tagline{font-size:18px;color:var(--cb-primary-hover);margin:0 0 14px}.brandstory .byline{color:var(--cb-text-muted)}
.brandart{margin:0}.brandart img{display:block;width:100%;height:auto;border-radius:6px}
@media (max-width:900px){.brandstory{grid-template-columns:minmax(0,1fr) minmax(0,1fr);padding:20px}.brandstory h1{font-size:28px}}
@media (max-width:760px){.brandstory{grid-template-columns:minmax(0,1fr);padding:16px}.brandart{max-width:520px;margin:0 auto}}

/* ---- workflow strip (sales / purchase chains) ----------------------------------------------------------------------- */
.flow{display:flex;gap:0;align-items:stretch;margin:0 0 var(--cb-s4);overflow-x:auto;padding-bottom:2px}
.flow .st{flex:1 0 150px;position:relative;background:var(--cb-surface);border:1px solid var(--cb-border);padding:10px 14px 10px 22px;margin-left:-1px;color:var(--cb-text);text-decoration:none}
.flow .st:first-child{border-radius:var(--cb-r-md) 0 0 var(--cb-r-md);margin-left:0;padding-left:14px}.flow .st:last-child{border-radius:0 var(--cb-r-md) var(--cb-r-md) 0}
.flow .st .nm{font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:var(--cb-text-muted);font-weight:600}
.flow .st .vl{font-weight:620;margin-top:2px}.flow .st .dt{font-size:12px;color:var(--cb-text-muted)}
.flow a.st:hover{background:var(--cb-surface-sunken);text-decoration:none}
.flow .st.done{border-color:color-mix(in srgb,var(--cb-success) 40%,var(--cb-border))}.flow .st.done .nm::before{content:"✓ ";color:var(--cb-success-ink)}
.flow .st.warn{background:var(--cb-warning-soft);border-color:color-mix(in srgb,var(--cb-warning) 40%,var(--cb-border))}
.flow .st.todo{border-style:dashed;color:var(--cb-text-muted)}
.flow .st.here{box-shadow:inset 0 -3px 0 var(--cb-primary)}
.tri{width:100%}.tri th,.tri td{text-align:right}.tri th:first-child,.tri td:first-child{text-align:left}
.tri .diff{color:var(--cb-danger-ink);font-weight:620}

/* ---- dashboard ------------------------------------------------------------------------------------------------------ */
.hero{display:flex;justify-content:space-between;gap:var(--cb-s4);flex-wrap:wrap;align-items:flex-end;margin-bottom:var(--cb-s4)}
.hero h1{font-size:26px}.hero .asof{color:var(--cb-text-muted);font-size:13px}
.attn{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.attn li a{display:flex;gap:12px;align-items:center;padding:10px 12px;border:1px solid var(--cb-border);border-radius:var(--cb-r-md);background:var(--cb-surface);color:var(--cb-text);text-decoration:none;transition:border-color var(--cb-fast) var(--cb-ease),background var(--cb-fast) var(--cb-ease)}
.attn li a:hover{border-color:var(--cb-border-strong);background:var(--cb-surface-sunken)}
.attn .sev{width:8px;height:8px;border-radius:50%;flex:none;background:var(--cb-text-faint)}.attn .sev.danger{background:var(--cb-danger)}.attn .sev.warn{background:var(--cb-warning)}.attn .sev.info{background:var(--cb-accent)}
.attn .tx{flex:1}.attn .tx small{display:block;color:var(--cb-text-muted)}.attn .go{color:var(--cb-text-faint)}
.pulse{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--cb-s2)}
.pulse>div{background:var(--cb-surface);padding:12px 14px;border:1px solid var(--cb-border);border-radius:var(--cb-r-md);box-shadow:var(--cb-shadow-sm)}.pulse .k{color:var(--cb-text-muted);font-size:12px}.pulse .v{font-weight:640;font-size:17px;font-variant-numeric:tabular-nums}
.askbar{display:flex;gap:10px;align-items:center;border:1px solid var(--cb-border);background:linear-gradient(135deg,var(--cb-primary-soft),var(--cb-surface));border-radius:var(--cb-r-md);padding:12px 14px;color:var(--cb-text);text-decoration:none;margin-bottom:var(--cb-s4)}
.askbar:hover{border-color:var(--cb-primary);text-decoration:none}.askbar .sp{color:var(--cb-primary);font-size:18px}
.askbar small{color:var(--cb-text-muted);display:block}

/* ---- analytics ------------------------------------------------------------------------------------------------------ */
.chart{background:var(--cb-surface);border:1px solid var(--cb-border);border-radius:var(--cb-r-md);padding:12px 14px;margin-bottom:var(--cb-s4);box-shadow:var(--cb-shadow-sm)}
.chart h3{margin:0 0 2px;font-size:14px;color:var(--cb-text)}.chart .meta{color:var(--cb-text-muted);font-size:12px;margin-bottom:6px}
.chart svg{width:100%;height:auto;display:block}.chart .bar{fill:var(--cb-chart-1);transition:opacity var(--cb-fast)}.chart .bar:hover{opacity:.8}.chart .bar.neg{fill:var(--cb-chart-neg)}.chart .axis{stroke:var(--cb-chart-grid)}.chart text{font-size:10px;fill:var(--cb-text-muted)}
.chart .empty{color:var(--cb-text-muted);padding:18px 0}
.attention{list-style:none;margin:0;padding:0}.attention li{padding:7px 0;border-bottom:1px solid var(--cb-border)}.attention li:last-child{border-bottom:0}
.attention .src{color:var(--cb-text-muted);font-size:12px;margin-left:6px}
.mgmt{border-left:3px solid var(--cb-primary);background:var(--cb-surface);border-radius:var(--cb-r-sm);padding:8px 12px;margin:0 0 14px;color:var(--cb-text-muted);font-size:12px;font-weight:600;letter-spacing:.2px;border-top:1px solid var(--cb-border);border-right:1px solid var(--cb-border);border-bottom:1px solid var(--cb-border)}

.busybar{position:fixed;left:50%;top:10px;transform:translateX(-50%);z-index:95;display:flex;gap:8px;align-items:center;background:var(--cb-surface-elevated);border:1px solid var(--cb-border);border-radius:999px;padding:6px 14px;box-shadow:var(--cb-shadow-md);color:var(--cb-text-muted);font-size:13px}
.busybar[hidden]{display:none}
/* any "No …" row that is the only row of a table reads as an empty state */
tbody tr:only-child>td[colspan]{text-align:center;color:var(--cb-text-muted);padding:28px 12px}

/* ---- motion --------------------------------------------------------------------------------------------------------- */
@keyframes cb-pop{from{opacity:0;transform:translateY(-4px) scale(.985)}to{opacity:1;transform:none}}
@keyframes cb-fade{from{opacity:0}to{opacity:1}}
@keyframes cb-spin{to{transform:rotate(360deg)}}
@keyframes cb-shimmer{to{transform:translateX(100%)}}
.content{animation:cb-fade var(--cb-med) var(--cb-ease)}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}

/* ---- responsive ----------------------------------------------------------------------------------------------------- */
@media (max-width:1100px){.two,.three{grid-template-columns:minmax(0,1fr)}.content{padding:var(--cb-s4) var(--cb-s4) 64px}}
@media (max-width:900px){
  .shell,.shell[data-collapsed="true"]{grid-template-columns:minmax(0,1fr)}
  .sidebar{position:fixed;left:0;top:0;bottom:0;z-index:80;width:min(86vw,300px);transform:translateX(-102%);transition:transform var(--cb-med) var(--cb-ease);box-shadow:var(--cb-shadow-lg)}
  .shell[data-drawer="open"] .sidebar{transform:none}
  .shell[data-drawer="open"] .scrim{display:block;position:fixed;inset:0;z-index:70;background:rgba(8,12,20,.5)}
  .shell[data-collapsed="true"] .sidebar .lb,.shell[data-collapsed="true"] .sidebar .bt,.shell[data-collapsed="true"] .sidebar .grp{display:revert}
  .shell[data-collapsed="true"] .sidebar a.nav{justify-content:flex-start;padding:7px 10px}
  .menu-toggle{display:inline-flex}.collapse-toggle{display:none}
  .topbar{padding:6px var(--cb-s3);flex-wrap:wrap}.topbar .searchbtn{order:5;flex:1 1 100%;min-width:0;max-width:none}.topbar .grow{display:none}.whoami{max-width:55vw}
  .whoami{font-size:12px}
}
@media (max-width:560px){.grid .span2{grid-column:span 1}.content{padding:var(--cb-s3) var(--cb-s3) 56px}h1{font-size:22px}.tile .v{font-size:19px}.stat .big{font-size:24px}.pagehead{align-items:flex-start}}
@media print{.sidebar,.topbar,.devbanner,.palette,.btn,button,.scrim,.skip{display:none!important}.shell{display:block}.content{padding:0;max-width:none;animation:none}body{background:#fff;color:#000}}

/* ---- Chetana Capture ------------------------------------------------------------------------------------------------ */
.cap-zone{border:2px dashed var(--cb-border-strong);border-radius:var(--cb-r-lg);padding:28px 16px;text-align:center;background:var(--cb-surface-sunken);color:var(--cb-text-muted);transition:border-color var(--cb-fast) var(--cb-ease),background var(--cb-fast) var(--cb-ease)}
.cap-zone.over,.cap-zone:focus-visible{border-color:var(--cb-primary);background:var(--cb-primary-soft)}
.cap-zone-title{font-size:var(--cb-text-heading);font-weight:620;color:var(--cb-text);margin:6px 0 2px}
.cap-picked{list-style:none;margin:10px 0 0;padding:0}.cap-picked li{display:flex;justify-content:space-between;gap:8px;padding:4px 0;border-bottom:1px solid var(--cb-border);font-size:13px}
.cap-head{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:10px 14px}
.cap-review{display:grid;grid-template-columns:minmax(0,55fr) minmax(0,45fr);gap:var(--cb-s4);align-items:start}
.cap-review>*{min-width:0}
.cap-viewer{position:sticky;top:calc(var(--cb-top) + 8px)}
.cap-tools{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-bottom:8px}
.cap-pdf{width:100%;height:calc(100vh - 240px);min-height:420px;border:1px solid var(--cb-border);border-radius:var(--cb-r-md);background:var(--cb-surface-sunken)}
.cap-stage{overflow:auto;max-height:calc(100vh - 260px);border:1px solid var(--cb-border);border-radius:var(--cb-r-md);background:var(--cb-surface-sunken)}
.cap-img-wrap{position:relative;display:inline-block;transform-origin:top left;line-height:0}
.cap-img-wrap img{max-width:100%;display:block}
.cap-box{position:absolute;border:2px solid var(--cb-accent);background:color-mix(in srgb,var(--cb-accent) 18%,transparent);border-radius:3px;pointer-events:none}
.cap-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--cb-s3)}
.cap-summary .l,.cap-group .l{font-size:11px;letter-spacing:.06em;color:var(--cb-text-muted);font-weight:600}
.cap-fields{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:var(--cb-s3)}
.cap-field label{display:inline-block;font-size:12px;color:var(--cb-text-muted);margin-right:6px}
.cap-field input{width:100%}
input.lowconf{border-color:var(--cb-warning);background:var(--cb-warning-soft)}
.cap-lc{font-size:11px;color:var(--cb-warning-ink);margin-top:2px}
.cap-lines input{font-size:13px;padding:4px 6px}
.cap-checks{list-style:none;margin:4px 0 12px;padding:0}.cap-checks li{display:flex;gap:8px;align-items:flex-start;padding:3px 0;font-size:13px}
.cap-chain{margin:8px 0 0;padding-left:20px}
.cap-timeline{list-style:none;margin:0;padding:0}.cap-timeline li{padding:4px 0;border-bottom:1px solid var(--cb-border);font-size:13px}.cap-timeline time{color:var(--cb-text-muted);margin-right:8px;font-variant-numeric:tabular-nums}
.cap-tech{display:grid;grid-template-columns:max-content 1fr;gap:4px 14px;margin:0}.cap-tech dt{color:var(--cb-text-muted)}.cap-tech dd{margin:0;word-break:break-all}
@media (max-width:980px){.cap-review{grid-template-columns:minmax(0,1fr)}.cap-viewer{position:static}.cap-pdf{height:60vh}.cap-summary{grid-template-columns:1fr}}


/* ======================================================================================================================
   Chetana UX 2.0 — bold fintech experience (docs/CHETANA_DESIGN_SYSTEM_2.md). Everything below uses the --cb-* tokens above.
   ====================================================================================================================== */
body{font-feature-settings:"cv11","ss01","tnum" 0}
h1{font-weight:700;letter-spacing:-.025em}
.content{max-width:1480px}

/* ---- sidebar: workflow groups ---- */
.sidebar .brand strong{font-size:18px;font-weight:700;letter-spacing:-.02em}
.sidebar .brand span{color:var(--cb-side-muted)}
.sidebar details.navgrp{margin:2px 0}
.sidebar summary.grp{display:flex;align-items:center;justify-content:space-between;gap:8px;list-style:none;cursor:pointer;margin:10px 0 2px;padding:6px 10px;border-radius:var(--cb-r-sm);color:var(--cb-side-muted);font-size:11px;font-weight:650;letter-spacing:.08em;text-transform:uppercase;user-select:none}
.sidebar summary.grp::-webkit-details-marker{display:none}
.sidebar summary.grp:hover{color:#fff;background:var(--cb-side-hover)}
.sidebar summary.grp:focus-visible{box-shadow:0 0 0 2px var(--cb-accent)}
.sidebar summary.grp .chev{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform var(--cb-fast) var(--cb-ease)}
.sidebar details.navgrp:not([open]) summary.grp .chev{transform:rotate(-90deg)}
.sidebar details.navgrp[open]>summary.grp{color:var(--cb-side-text)}
.sidebar a.nav.active{background:var(--cb-side-active);box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}
.sidebar a.nav.active::before{background:var(--cb-gold)}
.shell[data-collapsed="true"] .sidebar summary.grp{display:none}
@media (max-width:900px){.shell[data-collapsed="true"] .sidebar summary.grp{display:flex}}

/* ---- primary action, page header ---- */
.btn.primary,button.primary{box-shadow:0 1px 0 rgba(255,255,255,.14) inset,0 1px 2px rgba(7,86,63,.25)}
.btn.primary:hover,button.primary:hover{background:var(--cb-primary-hover)}
.btn.sm{padding:4px 10px;font-size:12.5px}
.pagehead{align-items:flex-end;padding-bottom:var(--cb-s3);border-bottom:1px solid var(--cb-border);margin-bottom:var(--cb-s4)}
.pagehead .crumbs{font-size:12px;color:var(--cb-text-muted);margin-bottom:2px}.pagehead .crumbs a{color:var(--cb-text-muted)}
.pagehead .acts .btn.primary{padding:8px 16px}
.pagehead .titlerow{display:flex;gap:10px;align-items:center;flex-wrap:wrap}

/* ---- money ---- */
.money{font-variant-numeric:tabular-nums;white-space:nowrap}
.money .cur{font-size:.72em;font-weight:560;color:var(--cb-text-muted);margin-right:1px;vertical-align:.08em}
.money .dec{font-size:.72em;color:var(--cb-text-muted)}
.money.neg{color:var(--cb-danger-ink)}
.money.lg{font-size:28px;font-weight:700;letter-spacing:-.02em}

/* ---- status badges (one visual style per meaning; colour is never the only signal: symbol + text) ---- */
.badge{gap:5px;font-weight:600}
.badge .sym{font-size:11px;line-height:1}
.badge.gold{background:var(--cb-gold-soft);color:var(--cb-gold-ink);border-color:transparent}

/* ---- attention cards (dashboard) ---- */
.attn-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:var(--cb-s3);margin-bottom:var(--cb-s4)}
.attn-card{display:flex;flex-direction:column;gap:6px;background:var(--cb-surface);border:1px solid var(--cb-border);border-left:4px solid var(--cb-border-strong);border-radius:var(--cb-r-md);padding:12px 14px;box-shadow:var(--cb-shadow-sm)}
.attn-card.danger{border-left-color:var(--cb-danger)}.attn-card.warn{border-left-color:var(--cb-warning)}.attn-card.info{border-left-color:var(--cb-info)}.attn-card.gold{border-left-color:var(--cb-gold)}
.attn-card .t{font-weight:640;color:var(--cb-text)}.attn-card .d{font-size:12.5px;color:var(--cb-text-muted);flex:1}
.attn-card .a{align-self:flex-start}
.insight{background:var(--cb-gold-soft);border:1px solid color-mix(in srgb,var(--cb-gold) 45%,transparent);border-radius:var(--cb-r-md);padding:12px 14px;color:var(--cb-text)}
.insight .eyebrow{color:var(--cb-gold-ink)}

/* ---- snapshot / stat cards ---- */
.snap{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:var(--cb-s3);margin-bottom:var(--cb-s4)}
.snap .stat{padding:12px 14px}.snap .stat .big{font-size:24px}
.stat.accent{border-top:3px solid var(--cb-primary)}
.quickrow{display:flex;flex-wrap:wrap;gap:var(--cb-s2);margin-bottom:var(--cb-s4)}
.quickrow .btn{background:var(--cb-surface)}

/* ---- summary strip on detail pages (amount, status, due) ---- */
.sumstrip{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1px;background:var(--cb-border);border:1px solid var(--cb-border);border-radius:var(--cb-r-md);overflow:hidden;margin:0 0 var(--cb-s4)}
.sumstrip>div{background:var(--cb-surface);padding:12px 14px}
.sumstrip .k{font-size:11.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--cb-text-muted);font-weight:600}
.sumstrip .v{font-size:22px;font-weight:700;letter-spacing:-.015em;font-variant-numeric:tabular-nums;margin-top:2px}
.sumstrip .v.danger{color:var(--cb-danger-ink)}.sumstrip .v.ok{color:var(--cb-success-ink)}
.sumstrip .h{font-size:12px;color:var(--cb-text-muted)}

/* ---- action bar ---- */
.actionbar{display:flex;flex-wrap:wrap;gap:var(--cb-s2);align-items:center;margin:0 0 var(--cb-s4)}
.actionbar form{display:inline;margin:0}
.actionbar .sep{flex:1}
details.more{position:relative;display:inline-block}
details.more>summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border:1px solid var(--cb-border-strong);background:var(--cb-surface);border-radius:var(--cb-r-sm);font-weight:560}
details.more>summary::-webkit-details-marker{display:none}
details.more[open]>summary{background:var(--cb-surface-sunken)}
details.more .menu{position:absolute;left:0;top:calc(100% + 6px);z-index:25;min-width:210px;background:var(--cb-surface-elevated);border:1px solid var(--cb-border);border-radius:var(--cb-r-md);box-shadow:var(--cb-shadow-md);padding:6px;display:flex;flex-direction:column;gap:2px}
details.more .menu a,details.more .menu button{display:block;width:100%;text-align:left;border:0;background:transparent;padding:7px 10px;border-radius:var(--cb-r-sm);color:var(--cb-text);font-weight:500}
details.more .menu a:hover,details.more .menu button:hover{background:var(--cb-surface-sunken);text-decoration:none}
details.more .menu .danger{color:var(--cb-danger-ink)}
details.more .menu form{display:block}

/* ---- filter bar ---- */
.filterbar{display:flex;flex-wrap:wrap;gap:var(--cb-s2);align-items:flex-end;margin:0 0 var(--cb-s3)}
.filterbar .field{margin:0;min-width:140px}.filterbar .field.grow{flex:1 1 220px}
.filterbar label{margin-bottom:2px}

/* ---- tables ---- */
.tablewrap{border-radius:var(--cb-r-md)}
th{background:var(--cb-surface-sunken);border-bottom:1px solid var(--cb-border-strong)}
tbody tr:hover td{background:color-mix(in srgb,var(--cb-primary-soft) 55%,transparent)}
td.n,th.n{font-feature-settings:"tnum"}
.rowacts{display:flex;gap:6px;justify-content:flex-end;flex-wrap:nowrap;white-space:nowrap}
.rowacts a,.rowacts button{font-size:12.5px;padding:3px 9px}
td a:not(.btn){font-weight:560}
.tablewrap:focus-within{box-shadow:var(--cb-focus)}

/* ---- empty states ---- */
.empty-state{background:var(--cb-surface);border:1px dashed var(--cb-border-strong);border-radius:var(--cb-r-lg)}
.empty-state .ic-wrap{width:44px;height:44px;border-radius:50%;background:var(--cb-primary-soft);color:var(--cb-primary);display:flex;align-items:center;justify-content:center;margin-bottom:4px}
.empty-state .ic-wrap svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.empty-state .btn{margin-top:6px}

/* ---- workflow stepper (purchase and sales flows) ---- */
.stepper{display:flex;gap:0;list-style:none;margin:0 0 var(--cb-s4);padding:0;overflow-x:auto}
.stepper li{flex:1 0 118px;position:relative;padding:8px 10px 8px 26px;border:1px solid var(--cb-border);background:var(--cb-surface);margin-left:-1px;font-size:12.5px;color:var(--cb-text-muted);display:flex;flex-direction:column;gap:1px}
.stepper li:first-child{margin-left:0;border-radius:var(--cb-r-md) 0 0 var(--cb-r-md);padding-left:12px}.stepper li:last-child{border-radius:0 var(--cb-r-md) var(--cb-r-md) 0}
.stepper li b{font-size:11px;letter-spacing:.07em;text-transform:uppercase;font-weight:650}
.stepper li.done{color:var(--cb-success-ink);border-color:color-mix(in srgb,var(--cb-success) 40%,var(--cb-border))}.stepper li.done b::before{content:"✓ "}
.stepper li.here{background:var(--cb-primary-soft);color:var(--cb-primary-hover);border-color:var(--cb-primary);z-index:1}.stepper li.here b::before{content:"● "}
.stepper li.next{border-style:dashed}
.stepper a{color:inherit;text-decoration:none}.stepper a:hover{text-decoration:underline}

/* ---- progress (ordered / received / billed) ---- */
.qtybar{display:flex;flex-direction:column;gap:4px}
.qtybar .bar{height:8px;border-radius:99px;background:var(--cb-surface-sunken);overflow:hidden;border:1px solid var(--cb-border)}
.qtybar .bar i{display:block;height:100%;background:var(--cb-primary)}
.qtybar .bar i.over{background:var(--cb-warning)}
.qtybar .legend{display:flex;gap:12px;flex-wrap:wrap;font-size:12px;color:var(--cb-text-muted);font-variant-numeric:tabular-nums}

/* ---- confidence ---- */
.conf{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600}
.conf .meter{width:44px;height:6px;border-radius:99px;background:var(--cb-surface-sunken);border:1px solid var(--cb-border);overflow:hidden}
.conf .meter i{display:block;height:100%;background:var(--cb-text-faint)}
.conf.High .meter i{background:var(--cb-success)}.conf.Review .meter i{background:var(--cb-warning)}.conf.Low .meter i{background:var(--cb-danger)}

/* ---- three-way match (PO / GRN / invoice) ---- */
.match3{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:var(--cb-s3);margin-bottom:var(--cb-s4)}
.match3 .m{background:var(--cb-surface);border:1px solid var(--cb-border);border-radius:var(--cb-r-md);padding:12px 14px}
.match3 .m h3{font-size:12px;letter-spacing:.07em;text-transform:uppercase;color:var(--cb-text-muted);margin:0 0 6px}
.match3 .row{display:flex;justify-content:space-between;gap:10px;padding:2px 0;font-variant-numeric:tabular-nums}
.match3 .res{margin-top:8px}

/* ---- settings hub ---- */
.hub{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:var(--cb-s3);margin-bottom:var(--cb-s5)}
.hub a{display:flex;flex-direction:column;gap:2px;padding:14px;border:1px solid var(--cb-border);border-radius:var(--cb-r-md);background:var(--cb-surface);color:var(--cb-text);text-decoration:none;box-shadow:var(--cb-shadow-sm)}
.hub a:hover{border-color:var(--cb-primary);background:var(--cb-primary-soft)}
.hub a b{font-size:15px}.hub a span{color:var(--cb-text-muted);font-size:12.5px}

/* ---- toasts / inline feedback ---- */
.msg{align-items:flex-start}
.msg .act{margin-left:auto;white-space:nowrap}

/* ---- palette polish ---- */
.palette .box{border-radius:var(--cb-r-lg)}
.palette .it .ty{background:var(--cb-surface-sunken)}
.palette .gh{font-weight:650}

/* ---- mobile: tables of record lists become cards (task, amount, status, action) ---- */
.mobile-actions{display:none}
@media (max-width:640px){
  .metrics.cap3{grid-template-columns:repeat(3,minmax(0,1fr))}.metrics.cap3>div{padding:8px 6px 8px 0}.metrics.cap3>div:nth-child(2n){padding-left:10px}.metrics.cap3 .v{font-size:22px}
  .metrics.m3>div,.metrics.m3>div:nth-child(3n+1){padding:14px 12px 14px 0;border-left:0;border-top:0;border-bottom:1px solid var(--cb-border)}.metrics.m3>div:nth-child(2n){padding-left:16px;border-left:1px solid var(--cb-border)}
  .metrics.m3{grid-template-columns:repeat(2,minmax(0,1fr))}.metrics.m3>div:nth-child(3n+1){padding-left:0}
  .tablewrap.stack{border:0;background:transparent;box-shadow:none;overflow:visible}
  .tablewrap.stack table,.tablewrap.stack tbody,.tablewrap.stack tr,.tablewrap.stack td{display:block;width:100%}
  .tablewrap.stack thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .tablewrap.stack tbody tr{background:var(--cb-surface);border:1px solid var(--cb-border);border-radius:var(--cb-r-md);margin:0 0 var(--cb-s3);padding:6px 4px;box-shadow:var(--cb-shadow-sm)}
  .tablewrap.stack td{display:flex;justify-content:space-between;gap:12px;border:0;padding:5px 10px;text-align:right}
  .tablewrap.stack td::before{content:attr(data-label);color:var(--cb-text-muted);font-size:12px;font-weight:600;text-align:left;flex:none;max-width:45%}
  .tablewrap.stack td:empty{display:none}
  .tablewrap.stack td[colspan]{display:block;text-align:center}.tablewrap.stack td[colspan]::before{content:none}
  .tablewrap.stack td.n{white-space:normal}
  .tablewrap.stack td:first-child{font-weight:650;font-size:15px}
  .mobile-actions{display:flex;position:sticky;bottom:0;z-index:20;gap:8px;padding:10px var(--cb-s3);margin:0 calc(-1 * var(--cb-s3));background:color-mix(in srgb,var(--cb-surface) 94%,transparent);backdrop-filter:blur(8px);border-top:1px solid var(--cb-border)}
  .mobile-actions .btn,.mobile-actions button{flex:1;justify-content:center}
  .sumstrip{grid-template-columns:repeat(2,1fr)}
  .attn-grid,.snap{grid-template-columns:repeat(2,minmax(0,1fr))}
  .filterbar .field{flex:1 1 100%}
}
@media (max-width:420px){.snap{grid-template-columns:minmax(0,1fr)}}

/* text on the soft emerald tint uses the darker emerald (contrast ≥ 7:1 light, ≥ 6:1 dark) */
.avatar,.askbar .sp,.empty-state .ic-wrap,.tabs a.active{color:var(--cb-primary-hover)}
.stepper li.here{color:var(--cb-primary-hover)}
@media (prefers-reduced-motion:no-preference){.sidebar summary.grp .chev{transition:transform var(--cb-fast) var(--cb-ease)}}

/* ---- forms (UX 2.0): grouped, readable, obvious primary/secondary actions ---- */
form.card>h2:first-child,form.card>h3:first-child{margin-top:0;padding-bottom:var(--cb-s2);border-bottom:1px solid var(--cb-border);margin-bottom:var(--cb-s3)}
.field>label{font-size:12.5px;color:var(--cb-text);font-weight:600}
.field .hint,.field small{display:block;margin-top:3px}
input,select,textarea{min-height:36px;background:var(--cb-surface)}
textarea{min-height:72px}
input[readonly]{background:var(--cb-surface-sunken)}
.card .grid+.grid{margin-top:var(--cb-s3)}
form p>button.primary:first-child,form p>.btn.primary:first-child{min-width:120px;justify-content:center}
@media (max-width:640px){form p>button,form p>.btn{width:100%;justify-content:center;margin:0 0 8px}}
.content>h1:first-child{margin-bottom:var(--cb-s2)}

/* topbar at tablet widths: let it wrap instead of overflowing (the context line, then search) */
@media (max-width:1180px) and (min-width:901px){
  .topbar{flex-wrap:wrap}.topbar .searchbtn{order:5;flex:1 1 100%;min-width:0;max-width:none}.topbar .grow{display:none}.whoami{max-width:40vw}
}
.snap{grid-template-columns:repeat(auto-fit,minmax(148px,1fr))}.snap .stat .big{font-size:22px}

/* ======================================================================================================================
   Chetana UX 3.0 — editorial fintech composition (docs/UX3_DESIGN_SYSTEM.md). Same --cb-* tokens; this layer recomposes the
   shell, page headers, metrics, tables and detail pages. Depth comes from tone, hairlines and spacing, not from shadows.
   ====================================================================================================================== */
body{background:var(--cb-bg);letter-spacing:-.003em}
.num,.money,td.n,th.n,.metrics .v,.sumstrip .v,.stat .big{font-family:var(--cb-font-num);font-variant-numeric:tabular-nums lining-nums;font-feature-settings:"tnum","lnum"}
.devbanner{padding:2px 10px;font-size:10.5px;letter-spacing:.04em;background:var(--cb-surface-subtle);color:var(--cb-text-muted);border-bottom:1px solid var(--cb-border)}
.devbanner code{background:transparent;padding:0}

/* ---- module personality: one accent dot per area, never a new palette ---- */
body[data-module="sell"]{--cb-module:#087F5B}
body[data-module="buy"]{--cb-module:#3F6A86}
body[data-module="money"]{--cb-module:#0F5C47}
body[data-module="inventory"]{--cb-module:#0E7C86}
body[data-module="capture"]{--cb-module:#B8861B}
body[data-module="insights"]{--cb-module:#5B4B8A}
body[data-module="comms"]{--cb-module:#2B6CB0}
body[data-module="settings"]{--cb-module:#56615C}

/* ---- sidebar: deep neutral, tonal active state, a tiny gold indicator ---- */
/* sidebar width */
:root{--cb-side:248px}
.sidebar{padding:12px 10px 20px;border-right:1px solid rgba(255,255,255,.04)}
.sidebar .brand{padding:6px 8px 14px;min-height:60px}
.sidebar .brand strong{font-family:var(--cb-font-display);font-size:21px;font-weight:600;letter-spacing:-.01em}
.sidebar .brand span{font-size:10.5px;color:var(--cb-side-muted);letter-spacing:.01em}
.sidebar .ws{display:flex;align-items:center;gap:10px;margin:0 2px 10px;padding:9px 10px;border-radius:var(--cb-r-ctl);background:rgba(255,255,255,.045);color:var(--cb-side-text);text-decoration:none;font-size:12.5px}
.sidebar .ws:hover{background:rgba(255,255,255,.08);text-decoration:none}
.sidebar .ws b{display:block;color:#fff;font-weight:600;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:150px}
.sidebar .ws small{color:var(--cb-side-muted);font-size:11px}
.sidebar .ws .av{width:28px;height:28px;border-radius:7px;background:linear-gradient(135deg,#0B7A58,#07563F);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:12px;flex:none}
.sidebar a.nav{padding:6px 10px;margin:1px 0;border-radius:var(--cb-r-ctl);font-size:13.5px;font-weight:500;color:var(--cb-side-text);gap:11px}
.sidebar a.nav .ic{width:17px;height:17px;opacity:.7;stroke-width:1.6}
.sidebar a.nav:hover{background:var(--cb-side-hover);color:#fff}
.sidebar a.nav:hover .ic{opacity:1}
.sidebar a.nav.active{background:var(--cb-side-active);color:#fff;font-weight:600;box-shadow:none}
.sidebar a.nav.active .ic{opacity:1;color:#5BD1A6}
.sidebar a.nav.active::before{left:-10px;top:9px;bottom:9px;width:3px;border-radius:0 3px 3px 0;background:var(--cb-gold)}
.sidebar summary.grp{margin:14px 0 2px;padding:5px 10px;font-size:10.5px;font-weight:650;letter-spacing:.11em;color:var(--cb-side-muted)}
.sidebar summary.grp:hover{background:transparent;color:#fff}
.sidebar details.navgrp[open]>summary.grp{color:var(--cb-side-muted)}

/* ---- top bar: search takes the width, context and actions sit right ---- */
.topbar{height:56px;padding:0 var(--cb-s5);gap:10px;background:color-mix(in srgb,var(--cb-bg) 86%,transparent);border-bottom:1px solid var(--cb-border)}
.searchbtn{height:36px;max-width:560px;flex:1 1 360px;border-radius:var(--cb-r-ctl);background:var(--cb-surface);border:1px solid var(--cb-border);color:var(--cb-text-muted);padding:0 12px}
.searchbtn:hover{border-color:var(--cb-border-strong);background:var(--cb-surface)}
.topbar .fychip{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 10px;border-radius:var(--cb-r-ctl);border:1px solid var(--cb-border);background:var(--cb-surface);color:var(--cb-text);font-size:12.5px;font-weight:600;text-decoration:none;white-space:nowrap}
.topbar .fychip:hover{border-color:var(--cb-border-strong);text-decoration:none}
.topbar .btn-create{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 8px 0 14px;border:0;border-radius:var(--cb-r-ctl);background:var(--cb-primary);color:var(--cb-on-primary);font-weight:620;font-size:13.5px;cursor:pointer;margin:0}
.topbar .btn-create:hover{background:var(--cb-primary-dark)}
.topbar .btn-create kbd{font:600 11px var(--cb-font);padding:1px 6px;border-radius:5px;background:rgba(255,255,255,.18);color:inherit;border:0}
.topbar .grow{flex:1 1 0}
.pop .panel .actas{padding:6px 10px 10px;border-top:1px solid var(--cb-border);margin-top:6px;flex-wrap:wrap}
.content{padding:28px 40px 96px;max-width:1380px}

/* ---- page header: eyebrow · serif title · one-sentence purpose · one primary action ---- */
header.ph{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;padding:4px 0 22px}
.ph .eyebrow{display:flex;align-items:center;gap:8px;margin-bottom:8px;color:var(--cb-text-muted);font-size:11.5px;font-weight:650;letter-spacing:.12em;text-transform:uppercase}
.ph .eyebrow::before{content:"";width:7px;height:7px;border-radius:2px;background:var(--cb-module)}
.ph .titlerow{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.ph h1{font-family:var(--cb-font-display);font-weight:600;font-size:36px;line-height:1.08;letter-spacing:-.022em;margin:0}
.ph .purpose{margin:8px 0 0;max-width:64ch;font-size:15px;color:var(--cb-text-muted);line-height:1.5}
.ph .learn{margin-top:6px;font-size:12.5px}.ph .learn summary{cursor:pointer;color:var(--cb-text-muted);list-style:none}.ph .learn summary::before{content:"ⓘ ";}
.ph .learn p{margin:6px 0 0;max-width:70ch;color:var(--cb-text-muted)}
.ph .acts{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.ph .acts .btn{height:38px;padding:0 16px;border-radius:var(--cb-r-ctl);font-weight:600}
.ph .acts .btn:not(.primary){background:transparent;border-color:transparent;color:var(--cb-text-muted)}
.ph .acts .btn:not(.primary):hover{background:var(--cb-surface-subtle);color:var(--cb-text)}
.ph .acts .btn.primary{padding:0 18px}

/* ---- metrics: open band with hairline dividers (not boxes) ---- */
.metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));border-top:1px solid var(--cb-border);border-bottom:1px solid var(--cb-border);margin:0 0 28px}
.metrics>div{padding:16px 22px 16px 0;margin-left:22px;border-left:1px solid var(--cb-border);padding-left:22px;min-width:0}
.metrics>div:first-child{border-left:0;margin-left:0;padding-left:0}
.metrics .k{font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--cb-text-muted);font-weight:650}
.metrics .v{margin-top:6px;font-size:30px;font-weight:650;letter-spacing:-.025em;line-height:1.1;color:var(--cb-text);white-space:nowrap}
.metrics .v .cur{font-size:.62em;font-weight:560;color:var(--cb-text-muted);margin-right:2px}
.metrics .v.danger{color:var(--cb-danger-ink)}.metrics .v.ok{color:var(--cb-success-ink)}
.metrics .s{margin-top:4px;font-size:12.5px;color:var(--cb-text-muted)}
.metrics .s.up{color:var(--cb-success-ink)}.metrics .s.down{color:var(--cb-danger-ink)}

.metrics.m3,.metrics.cap3{grid-template-columns:repeat(3,minmax(0,1fr))}
.metrics.m3>div:nth-child(n+4){border-top:1px solid var(--cb-border)}
.metrics.m3>div{margin-left:0;padding-left:22px;padding-right:22px}.metrics.m3>div:nth-child(3n+1){border-left:0;padding-left:0}
/* ---- workspace panels (a surface that means something), segmented controls, toolbars ---- */
.panel{background:var(--cb-surface);border:1px solid var(--cb-border);border-radius:var(--cb-r-card);overflow:hidden}
.panel>.panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 18px;border-bottom:1px solid var(--cb-border);flex-wrap:wrap}
.panel>.panel-head h2{margin:0;font-size:14px;font-weight:650;letter-spacing:-.005em}
.panel .tablewrap{border:0;border-radius:0;box-shadow:none;background:transparent}
.panel>.panel-body{padding:18px}
.toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:0 0 14px}
.toolbar .search{position:relative;flex:1 1 280px;max-width:420px}
.toolbar .search input{padding-left:34px;height:36px;border-radius:var(--cb-r-ctl);background:var(--cb-surface)}
.toolbar .search svg{position:absolute;left:11px;top:50%;transform:translateY(-50%);width:15px;height:15px;stroke:var(--cb-text-faint);fill:none;stroke-width:1.8;pointer-events:none}
.toolbar select{height:36px;width:auto;min-width:150px;border-radius:var(--cb-r-ctl)}
.toolbar .grow{flex:1}
.seg{display:inline-flex;padding:3px;border-radius:var(--cb-r-ctl);background:var(--cb-surface-subtle);border:1px solid var(--cb-border)}
.seg button{margin:0;border:0;background:transparent;padding:5px 12px;border-radius:6px;font-size:12.5px;font-weight:600;color:var(--cb-text-muted);cursor:pointer}
.seg button[aria-pressed="true"]{background:var(--cb-surface);color:var(--cb-text);box-shadow:var(--cb-e2)}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chip{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 12px;border-radius:99px;border:1px solid var(--cb-border);background:var(--cb-surface);color:var(--cb-text-muted);font-size:12.5px;font-weight:600;text-decoration:none}
.chip:hover{border-color:var(--cb-border-strong);color:var(--cb-text);text-decoration:none}
.chip[aria-current="true"],.chip.on{background:var(--cb-text);border-color:var(--cb-text);color:var(--cb-bg)}
.chip .n{font-variant-numeric:tabular-nums}

/* ---- ledger tables: hierarchy, not a grid of equal cells ---- */
.tablewrap{border:1px solid var(--cb-border);border-radius:var(--cb-r-card);background:var(--cb-surface);box-shadow:none}
th{padding:11px 16px;font-size:10.5px;font-weight:650;letter-spacing:.09em;text-transform:uppercase;color:var(--cb-text-muted);background:var(--cb-surface-subtle);border-bottom:1px solid var(--cb-border)}
td{padding:15px 16px;border-bottom:1px solid color-mix(in srgb,var(--cb-border) 70%,transparent);vertical-align:middle;color:var(--cb-text)}
tbody tr{transition:background var(--cb-fast) var(--cb-ease)}
tbody tr:hover td{background:var(--cb-surface-interactive)}
td:not(.n):not(.lead){color:var(--cb-text-muted)}
td .t{display:block;font-weight:650;color:var(--cb-text);letter-spacing:-.005em}
td .t a{color:var(--cb-text);font-weight:650}td .t a:hover{color:var(--cb-primary);text-decoration:none}
td .s{display:block;font-size:12.5px;color:var(--cb-text-muted);margin-top:1px}
td.n{font-size:14.5px;font-weight:600;color:var(--cb-text)}
td.n.sm{font-weight:500;color:var(--cb-text-muted);font-size:13.5px}
td.nw,td:first-child{white-space:nowrap}
td.go{width:36px;text-align:right;color:var(--cb-text-faint)}
td.go a{opacity:0;transition:opacity var(--cb-fast) var(--cb-ease);font-size:18px;text-decoration:none}
tr:hover td.go a,td.go a:focus-visible{opacity:1}
tr.muted td .t,tr.muted td .t a{color:var(--cb-text-muted)}
.ledger-compact td{padding:9px 16px}.ledger-compact td .s{display:none}
.rowstate{display:inline-block;width:3px;align-self:stretch;border-radius:2px;margin-right:12px;background:transparent}

/* ---- pipeline (quotations): stages with counts, values and share ---- */
.pipe{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin:0 0 24px;border:1px solid var(--cb-border);border-radius:var(--cb-r-card);overflow:hidden;background:var(--cb-surface)}
.pipe .st{padding:16px 20px;position:relative;border-left:1px solid var(--cb-border);text-decoration:none;color:inherit;display:block}
.pipe .st:first-child{border-left:0}
.pipe .st:hover{background:var(--cb-surface-interactive);text-decoration:none}
.pipe .st[aria-current="true"]{background:var(--cb-surface-interactive);box-shadow:inset 0 -3px 0 var(--cb-primary)}
.pipe .st .k{font-size:11px;letter-spacing:.09em;text-transform:uppercase;font-weight:650;color:var(--cb-text-muted);display:flex;gap:8px;align-items:center}
.pipe .st .k::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--dot,var(--cb-border-strong))}
.pipe .st .c{font-size:26px;font-weight:650;letter-spacing:-.02em;margin-top:6px;font-variant-numeric:tabular-nums}
.pipe .st .val{font-size:13px;color:var(--cb-text-muted)}
.pipe .st .bar{height:4px;border-radius:2px;background:var(--cb-surface-subtle);margin-top:10px;overflow:hidden}.pipe .st .bar i{display:block;height:100%;background:var(--dot,var(--cb-primary))}
.pipe .st::after{content:"→";position:absolute;right:-8px;top:50%;transform:translateY(-50%);z-index:1;width:16px;height:16px;border-radius:50%;background:var(--cb-surface);border:1px solid var(--cb-border);font-size:10px;line-height:14px;text-align:center;color:var(--cb-text-faint)}
.pipe .st:last-child::after{display:none}
.kanban{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;align-items:start}
.kanban .col{background:var(--cb-surface-subtle);border-radius:var(--cb-r-card);padding:10px;min-height:120px}
.kanban .col h3{display:flex;justify-content:space-between;margin:2px 4px 10px;font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--cb-text-muted)}
.kanban .cardq{display:block;background:var(--cb-surface);border:1px solid var(--cb-border);border-radius:10px;padding:11px 12px;margin-bottom:8px;color:var(--cb-text);text-decoration:none}
.kanban .cardq:hover{border-color:var(--cb-border-strong);text-decoration:none;background:var(--cb-surface-interactive)}
.kanban .cardq b{display:block;font-size:13px}.kanban .cardq span{display:block;font-size:12px;color:var(--cb-text-muted)}.kanban .cardq .amt{font-size:15px;font-weight:650;color:var(--cb-text);margin-top:4px;font-variant-numeric:tabular-nums}
[data-view]{display:none}[data-view][data-on="true"]{display:block}

/* ---- detail pages: main document + right rail, tabs ---- */
.detail{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:36px;align-items:start}
.stackv .totals{max-width:380px;margin:18px 0 0 auto}
.rail{position:sticky;top:76px}
.rail section{padding:16px 0;border-bottom:1px solid var(--cb-border)}.rail section:first-child{padding-top:0}.rail section:last-child{border-bottom:0}
.rail h2,.rail h3{margin:0 0 8px;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--cb-text-muted);font-weight:650}
.rail .big{font-size:30px;font-weight:650;letter-spacing:-.025em;line-height:1.1}
.rail dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:6px 14px;font-size:13.5px}.rail dt{color:var(--cb-text-muted)}.rail dd{margin:0;text-align:right;font-variant-numeric:tabular-nums;font-weight:560}
.rail .next{background:var(--cb-gold-soft);border:1px solid color-mix(in srgb,var(--cb-gold) 40%,transparent);border-radius:var(--cb-r-card);padding:14px}
.rail .next b{display:block;color:var(--cb-text);margin-bottom:4px}.rail .next p{margin:0 0 10px;font-size:13px;color:var(--cb-text-muted)}
.tabs3{display:flex;gap:2px;border-bottom:1px solid var(--cb-border);margin:0 0 20px;overflow-x:auto}
.tabs3 button{margin:0 0 -1px;border:0;border-bottom:2px solid transparent;background:transparent;padding:10px 14px;font-weight:600;font-size:13.5px;color:var(--cb-text-muted);border-radius:0;cursor:pointer;white-space:nowrap}
.tabs3 button:hover{color:var(--cb-text);background:transparent}
.tabs3 button[aria-selected="true"]{color:var(--cb-text);border-bottom-color:var(--cb-primary)}
.js-tabs .tabpanel[hidden]{display:none}
.statusline{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.health{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:650}.health::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--cb-success)}
.health.attn{color:var(--cb-warning-ink)}.health.attn::before{background:var(--cb-warning)}
.health.risk{color:var(--cb-danger-ink)}.health.risk::before{background:var(--cb-danger)}

/* ---- dashboard ---- */
.alist{list-style:none;margin:0;padding:0;border-top:1px solid var(--cb-border)}
.alist li a{display:grid;grid-template-columns:10px minmax(0,1fr) auto;gap:14px;align-items:center;padding:14px 4px;border-bottom:1px solid var(--cb-border);color:var(--cb-text);text-decoration:none}
.alist li a:hover{background:var(--cb-surface-interactive);text-decoration:none}
.more-attn>summary{cursor:pointer;padding:10px 4px;font-size:13px;font-weight:600;color:var(--cb-primary);list-style:none}.more-attn>summary::before{content:"+ "}
.alist .dot{width:8px;height:8px;border-radius:50%;background:var(--cb-info)}.alist .dot.danger{background:var(--cb-danger)}.alist .dot.warn{background:var(--cb-warning)}
.alist b{font-weight:650}.alist small{display:block;color:var(--cb-text-muted);font-size:12.5px;margin-top:1px}
.alist .go{font-size:12.5px;font-weight:650;color:var(--cb-primary)}
.split2{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:40px;align-items:start}
.sect{margin:0 0 36px}.sect>h2{display:flex;justify-content:space-between;align-items:baseline;margin:0 0 12px;font-family:var(--cb-font);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--cb-text-muted);font-weight:650}
.sect>h2 a{font-size:12.5px;letter-spacing:0;text-transform:none;font-weight:600}
.trend{background:var(--cb-surface);border:1px solid var(--cb-border);border-radius:var(--cb-r-card);padding:16px 18px 10px}
.trend .legend{display:flex;gap:16px;font-size:12.5px;color:var(--cb-text-muted);margin-bottom:6px}.trend .legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.trend svg{width:100%;max-width:100%;height:auto;display:block}
.trend .grid line{stroke:var(--cb-chart-grid);stroke-width:1}.trend text{fill:var(--cb-text-muted);font:11px var(--cb-font)}
.trend .area{opacity:.12}.trend .line{fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.trend .dotp{stroke:var(--cb-surface);stroke-width:2}
.trend .hit{fill:transparent}.trend .hit:hover+.hov,.trend .hit:focus+.hov{opacity:1}
.trend-tip{position:fixed;z-index:60;pointer-events:none;background:var(--cb-text);color:var(--cb-bg);padding:8px 10px;border-radius:8px;font-size:12px;line-height:1.5;opacity:0;transition:opacity var(--cb-fast)}
.trend-tip.on{opacity:1}
.activity{list-style:none;margin:0;padding:0}
.activity li{display:grid;grid-template-columns:30px minmax(0,1fr) auto;gap:12px;align-items:center;padding:11px 0;border-bottom:1px solid var(--cb-border)}
.activity .ico{width:30px;height:30px;border-radius:8px;background:var(--cb-surface-subtle);display:flex;align-items:center;justify-content:center;color:var(--cb-text-muted)}
.activity .ico svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.7}
.activity b{font-weight:600;font-size:13.5px}.activity small{display:block;color:var(--cb-text-muted);font-size:12px}.activity .amt{font-weight:650;font-variant-numeric:tabular-nums;font-size:13.5px}
.cmdrow{display:flex;flex-wrap:wrap;gap:8px}
.cmd{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 12px;border:1px solid var(--cb-border);border-radius:var(--cb-r-ctl);background:var(--cb-surface);color:var(--cb-text);font-weight:600;font-size:13px;text-decoration:none}
.cmd:hover{border-color:var(--cb-primary);text-decoration:none;background:var(--cb-surface-interactive)}
.cmd svg{width:15px;height:15px;stroke:var(--cb-text-muted);fill:none;stroke-width:1.7}

/* ---- quick create + palette: command surfaces ---- */
.create{position:fixed;inset:0;z-index:92;display:none;align-items:flex-start;justify-content:center;padding:13vh 16px 16px;background:rgba(10,16,13,.5);backdrop-filter:blur(4px)}
.create[data-open="true"]{display:flex;animation:cb-fade var(--cb-fast) var(--cb-ease)}
.create .box{width:min(460px,100%);background:var(--cb-surface-raised);border-radius:var(--cb-r-panel);box-shadow:var(--cb-e3);overflow:hidden;animation:cb-pop var(--cb-med) var(--cb-ease)}
.create .hd{padding:14px 18px 6px;font-size:11px;font-weight:650;letter-spacing:.11em;text-transform:uppercase;color:var(--cb-text-muted)}
.create a.it{display:flex;align-items:center;gap:12px;padding:10px 18px;color:var(--cb-text);text-decoration:none;font-weight:560}
.create a.it .ic{width:30px;height:30px;border-radius:8px;background:var(--cb-surface-subtle);padding:7px;stroke:var(--cb-text-muted);fill:none;stroke-width:1.7}
.create a.it small{display:block;font-weight:400;color:var(--cb-text-muted);font-size:12px}
.create a.it kbd{margin-left:auto;font:600 11px var(--cb-font);padding:1px 7px;border-radius:5px;border:1px solid var(--cb-border-strong);border-bottom-width:2px;color:var(--cb-text-muted)}
.create a.it[aria-selected="true"]{background:var(--cb-primary-soft)}
.create a.it[aria-selected="true"] .ic{background:var(--cb-surface);stroke:var(--cb-primary)}
.create .ft{display:flex;gap:14px;padding:9px 18px;border-top:1px solid var(--cb-border);font-size:12px;color:var(--cb-text-muted)}
.palette{padding-top:11vh;background:rgba(10,16,13,.5);backdrop-filter:blur(4px)}
.palette .box{width:min(680px,100%);border-radius:var(--cb-r-panel);box-shadow:var(--cb-e3)}
.palette .qrow{padding:4px 18px}.palette input[type=search]{height:54px;font-size:16px}
.palette .it{padding:9px 12px;border-radius:9px}
.palette .it .ico{width:28px;height:28px;border-radius:7px;background:var(--cb-surface-subtle);display:flex;align-items:center;justify-content:center;flex:none}
.palette .it .ico svg{width:15px;height:15px;stroke:var(--cb-text-muted);fill:none;stroke-width:1.7}
.palette .it[aria-selected="true"] .ico{background:var(--cb-surface)}.palette .it[aria-selected="true"] .ico svg{stroke:var(--cb-primary)}
.palette .it[aria-selected="true"]::after{content:"↵";margin-left:6px;font-size:12px;color:var(--cb-text-faint)}
.palette .gh{padding:12px 12px 4px}

/* ---- capture / communications / customer compositions ---- */
.qrows{border-top:1px solid var(--cb-border)}
.qrow3{display:grid;grid-template-columns:44px minmax(0,1.6fr) minmax(0,1fr) 120px 150px 24px;gap:16px;align-items:center;padding:14px 6px;border-bottom:1px solid var(--cb-border);color:var(--cb-text);text-decoration:none}
.qrow3:hover{background:var(--cb-surface-interactive);text-decoration:none}
.qrow3 .doc{width:40px;height:48px;border-radius:5px;background:var(--cb-surface-subtle);border:1px solid var(--cb-border);display:flex;align-items:center;justify-content:center;color:var(--cb-text-faint);font-size:10px;font-weight:700}
.qrow3 .nm b{display:block;font-weight:650}.qrow3 .nm small{color:var(--cb-text-muted);font-size:12.5px}
.qrow3 .amt{font-weight:650;font-variant-numeric:tabular-nums;text-align:right}
.ring{--p:0;width:46px;height:46px;border-radius:50%;background:conic-gradient(var(--rc,var(--cb-primary)) calc(var(--p)*1%),var(--cb-surface-subtle) 0);display:grid;place-items:center;flex:none}
.ring::before{content:attr(data-v);width:36px;height:36px;border-radius:50%;background:var(--cb-surface);display:grid;place-items:center;font-size:11.5px;font-weight:700;font-variant-numeric:tabular-nums}
.ring.High{--rc:var(--cb-success)}.ring.Review{--rc:var(--cb-warning)}.ring.Low{--rc:var(--cb-danger)}
.verdict{display:flex;flex-wrap:wrap;gap:18px;align-items:center;padding:16px 20px;border:1px solid var(--cb-border);border-radius:var(--cb-r-card);background:var(--cb-surface);margin-bottom:16px}
.verdict{gap:18px;align-items:center}
.verdict .k{font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--cb-text-muted);font-weight:650}
.chan{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px;margin-bottom:28px}
.chan .c{border:1px solid var(--cb-border);border-radius:var(--cb-r-card);background:var(--cb-surface);padding:18px 20px}
.chan .c h2{display:flex;justify-content:space-between;align-items:center;margin:0 0 4px;font-size:15px;font-family:var(--cb-font)}
.chan .c .st{margin:8px 0 12px;color:var(--cb-text-muted);font-size:13px}
.chan .c .nums{display:flex;gap:18px;margin:12px 0;padding:12px 0;border-top:1px solid var(--cb-border);border-bottom:1px solid var(--cb-border)}
.chan .c .nums b{display:block;font-size:20px;font-variant-numeric:tabular-nums}.chan .c .nums small{font-size:11px;text-transform:uppercase;letter-spacing:.07em;color:var(--cb-text-muted)}

/* ---- KPI tiles everywhere (Analytics, Collections, ...): open figures on hairlines, not a wall of boxes ---- */
.tiles,.kpis{gap:0 32px;border-top:1px solid var(--cb-border);margin-bottom:30px;grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.tile{background:transparent;border:0;border-bottom:1px solid var(--cb-border);border-radius:0;box-shadow:none;padding:16px 0 15px}
.tile::before{display:none}
.tile .l{font-size:11px;letter-spacing:.09em;text-transform:uppercase;font-weight:650}
.tile .v{margin-top:6px;font-size:28px;font-weight:650;letter-spacing:-.022em;font-family:var(--cb-font-num);font-variant-numeric:tabular-nums lining-nums}
.tile.danger .v{color:var(--cb-danger-ink)}.tile.ok .v{color:var(--cb-success-ink)}.tile.warn .v{color:var(--cb-warning-ink)}
.tile .hint{margin-top:3px}
.content>h1{font-family:var(--cb-font-display);font-size:32px;font-weight:600;letter-spacing:-.02em;margin:0 0 6px}
.content>h2,.content>div>h2{letter-spacing:-.005em}
details.filters>summary{list-style:none}details.filters>summary::-webkit-details-marker{display:none}
details.filters[open]>summary{background:var(--cb-text);color:var(--cb-bg);border-color:var(--cb-text)}

/* ---- section tabs (GST, Analytics, Capture): one calm underlined row ---- */
.tabs{display:flex;gap:0;flex-wrap:nowrap;overflow-x:auto;margin:0 0 22px;border-bottom:1px solid var(--cb-border);padding:0;scrollbar-width:thin}
.tabs a{padding:10px 14px;border:0;border-bottom:2px solid transparent;border-radius:0;white-space:nowrap;font-size:13.5px;font-weight:600;color:var(--cb-text-muted);margin:0 0 -1px;background:transparent}
.tabs a:hover{background:transparent;color:var(--cb-text)}
.tabs a.active{background:transparent;border-color:transparent;border-bottom-color:var(--cb-primary);color:var(--cb-text)}
.tabs:has(.tabmore){overflow:visible;flex-wrap:wrap}
.tabmore{position:relative;margin:0 0 -1px}.tabmore>summary{list-style:none;padding:10px 14px;cursor:pointer;font-size:13.5px;font-weight:600;color:var(--cb-text-muted);white-space:nowrap}
.tabmore>summary::after{content:" ▾";font-size:11px}
.tabmore .menu{position:absolute;right:0;top:100%;z-index:30;min-width:220px;background:var(--cb-surface-raised);border:1px solid var(--cb-border);border-radius:var(--cb-r-card);box-shadow:var(--cb-e3);padding:6px;display:flex;flex-direction:column}
.tabmore .menu a{border:0;margin:0;padding:8px 10px;border-radius:7px}.tabmore .menu a:hover{background:var(--cb-surface-subtle)}
/* stat grids: the same open, hairline treatment as .metrics */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));border-top:1px solid var(--cb-border);border-bottom:1px solid var(--cb-border);margin:0 0 28px;gap:0}
.stats .stat{background:transparent;border:0;border-radius:0;box-shadow:none;border-left:1px solid var(--cb-border);padding:16px 20px}
.stats .stat:first-child{border-left:0;padding-left:0}
.stat .k{font-size:11px;letter-spacing:.09em;text-transform:uppercase;font-weight:650}
.stat .big{font-family:var(--cb-font-num);font-size:28px;font-weight:650;letter-spacing:-.022em;margin-top:6px}
.stat .delta{font-size:12.5px;color:var(--cb-text-muted);margin-top:3px}
.stat.accent{background:transparent}

/* ---- Ask Chetana entry: contextual and quiet ---- */
.askbar{background:var(--cb-surface);border-radius:var(--cb-r-ctl);padding:9px 14px;margin-bottom:20px;font-size:13px}
.askbar b,.askbar strong{font-weight:650}.askbar .sp{font-size:15px}

/* ---- document trail: a quiet breadcrumb of the workflow, not five boxes ---- */
.flow{gap:6px;margin:0 0 18px;flex-wrap:wrap;overflow:visible}
.flow .st{flex:0 1 auto;display:inline-flex;align-items:baseline;gap:6px;border:1px solid var(--cb-border);border-radius:99px;padding:5px 12px;margin:0;font-size:12.5px;background:var(--cb-surface)}
.flow .st:first-child,.flow .st:last-child{border-radius:99px;padding:5px 12px}
.flow .st .nm,.flow .st .vl,.flow .st .dt{display:inline;margin:0;font-size:12.5px;letter-spacing:0;text-transform:none}
.flow .st .nm{font-weight:650}.flow .st .vl{font-weight:500}.flow .st .dt{display:none}
.flow .st.todo{border-style:solid;opacity:.6}.flow .st.here{box-shadow:none;border-color:var(--cb-primary);background:var(--cb-primary-soft)}
.flow .st.warn{background:var(--cb-warning-soft)}

/* ---- empty states: designed, quiet ---- */
.empty-state{border:1px solid var(--cb-border);border-style:solid;background:linear-gradient(180deg,var(--cb-surface),var(--cb-surface-subtle));padding:56px 24px}
.empty-state strong{font-family:var(--cb-font-display);font-size:20px;font-weight:600}
.empty-state .ic-wrap{background:var(--cb-surface);border:1px solid var(--cb-border)}

/* ---- responsive recomposition ---- */
.main,.content,.split2>*,.detail>*,.two>*{min-width:0}
.cmdrow .cmd{max-width:100%}
@media (max-width:1180px){.detail{grid-template-columns:minmax(0,1fr)}.rail{position:static}.split2{grid-template-columns:minmax(0,1fr)}}
@media (max-width:900px){.content{padding:20px 18px 96px}.ph h1{font-size:30px}.pipe,.kanban{grid-template-columns:repeat(2,minmax(0,1fr))}.pipe .st::after{display:none}.qrow3{grid-template-columns:40px minmax(0,1fr) auto;row-gap:6px}.qrow3>:nth-child(3),.qrow3>:nth-child(4),.qrow3>:nth-child(6){display:none}}
@media (max-width:640px){
  .ph{flex-direction:column;align-items:stretch;padding-bottom:16px}.ph h1{font-size:28px}.ph .acts{width:100%}.ph .acts .btn.primary{flex:1;justify-content:center}
  .metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.metrics>div{margin-left:0;padding:14px 12px 14px 0;border-left:0;border-bottom:1px solid var(--cb-border)}.metrics>div:nth-child(2n){padding-left:16px;border-left:1px solid var(--cb-border)}.metrics .v{font-size:24px}
  .pipe{grid-template-columns:repeat(2,minmax(0,1fr))}.kanban{grid-template-columns:minmax(0,1fr)}
  .toolbar .search{max-width:none;flex-basis:100%}.toolbar select{flex:1}
  .topbar .fychip,.topbar .btn-create kbd{display:none}.topbar{height:auto;padding:8px 12px}
  .tablewrap.stack tbody tr{border-radius:var(--cb-r-card);box-shadow:none;padding:12px 6px}
  .tablewrap.stack td .t{font-size:15px}
  .tablewrap.stack{position:relative;overflow:hidden}
  .tablewrap.stack thead th{position:absolute;width:1px;padding:0;white-space:nowrap}
  .tablewrap.stack td.go{display:none}
  .tablewrap.stack td,.tablewrap.stack td:first-child{white-space:normal}
}
@media (prefers-reduced-motion:reduce){.create .box{animation:none}}


/* ======================================================================================================================
   Chetana UX 3.1 — product-wide finish. Same tokens and components as UX 3.0; this layer adds only what the operational
   pages need (progress trail, three-way match line, verdict chips, setting tiles, period state).
   ====================================================================================================================== */
/* ---- ordered → received → billed progress ---- */
.prog{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--cb-border);border-radius:var(--cb-r-card);background:var(--cb-surface);overflow:hidden;margin:0 0 22px}
.prog .st{padding:14px 18px;border-left:1px solid var(--cb-border);position:relative}
.prog .st:first-child{border-left:0}
.prog .k{font-size:11px;letter-spacing:.09em;text-transform:uppercase;font-weight:650;color:var(--cb-text-muted);display:flex;align-items:center;gap:8px}
.prog .k::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--dot,var(--cb-border-strong))}
.prog .v{font-size:24px;font-weight:650;letter-spacing:-.02em;margin-top:4px;font-variant-numeric:tabular-nums}
.prog .v small{font-size:13px;font-weight:500;color:var(--cb-text-muted);margin-left:4px}
.prog .bar{height:4px;border-radius:2px;background:var(--cb-surface-subtle);margin-top:8px;overflow:hidden}.prog .bar i{display:block;height:100%;background:var(--dot,var(--cb-primary))}
.prog .st.done .k{color:var(--cb-success-ink)}
/* ---- verdict chips: a word and a symbol, never colour alone ---- */
.vd{display:inline-flex;align-items:center;gap:5px;height:22px;padding:0 8px;border-radius:99px;font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;white-space:nowrap;background:var(--cb-surface-subtle);color:var(--cb-text-muted)}
.vd.ok{background:var(--cb-success-soft);color:var(--cb-success-ink)}.vd.bad{background:var(--cb-danger-soft);color:var(--cb-danger-ink)}.vd.warn{background:var(--cb-warning-soft);color:var(--cb-warning-ink)}.vd.info{background:var(--cb-primary-soft);color:var(--cb-primary)}
/* ---- three-way match line ---- */
.ml{border:1px solid var(--cb-border);border-radius:var(--cb-r-card);background:var(--cb-surface);margin:0 0 14px;overflow:hidden}
.ml.needs{border-color:color-mix(in srgb,var(--cb-danger) 35%,var(--cb-border))}
.ml>header{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 18px;border-bottom:1px solid var(--cb-border)}
.ml>header b{font-size:15px;letter-spacing:-.005em}.ml>header small{display:block;color:var(--cb-text-muted);font-size:12.5px}
.ml table{width:100%;border-collapse:collapse}
.ml th{background:transparent;padding:9px 18px;font-size:10.5px}.ml td{padding:11px 18px;border-top:1px solid color-mix(in srgb,var(--cb-border) 70%,transparent);vertical-align:top}
.ml td.n{text-align:right}.ml td.dim{color:var(--cb-text-faint)}
.ml .why{display:block;font-size:12.5px;color:var(--cb-text-muted);margin-top:4px}.ml .why.bad{color:var(--cb-danger-ink)}
.ml footer{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:12px 18px;border-top:1px solid var(--cb-border);background:var(--cb-surface-subtle)}
.ml footer form{display:flex;gap:8px;flex:1 1 320px}.ml footer input{flex:1;min-width:160px}
.ml details.accept>summary{cursor:pointer;font-weight:600;font-size:13px;list-style:none}
@media (max-width:640px){.ml th:nth-child(n+2),.ml td:nth-child(-n+4):not(:first-child){font-size:13px}.ml th,.ml td{padding:9px 10px}.prog{grid-template-columns:minmax(0,1fr)}.prog .st{border-left:0;border-top:1px solid var(--cb-border)}.prog .st:first-child{border-top:0}}
dl.kv{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 24px;margin:0;font-size:14px}dl.kv dt{color:var(--cb-text-muted)}dl.kv dd{margin:0;text-align:right;font-variant-numeric:tabular-nums}
.trail{margin:0 0 6px}
.tablewrap+.actionbar,.tablewrap+p{margin-top:16px}
.lvl{display:block;width:96px;height:5px;border-radius:3px;background:var(--cb-surface-subtle);overflow:hidden}.lvl i{display:block;height:100%;background:var(--cb-success)}
td .vd+.s{display:block}
details.setgrp{margin:0 0 12px}details.setgrp>summary{cursor:pointer;font-weight:650;font-size:14px;padding:10px 2px;list-style:none}details.setgrp>summary::before{content:"▸";display:inline-block;width:16px;color:var(--cb-text-muted);transition:transform var(--cb-fast)}details.setgrp[open]>summary::before{transform:rotate(90deg)}
ol.steps{margin:6px 0 0;padding-left:20px;display:grid;gap:6px}

/* ---- GST periods: state is visible, not implied ---- */
ul.periods{list-style:none;margin:0;padding:0;border-top:1px solid var(--cb-border)}
.per{display:grid;grid-template-columns:150px minmax(0,1.4fr) minmax(0,1.2fr);gap:10px 22px;align-items:center;padding:16px 4px;border-bottom:1px solid var(--cb-border)}
.per.locked{background:linear-gradient(90deg,var(--cb-surface-subtle),transparent 60%)}
.per .pm b{display:block;font-size:15px}.per .pm small{color:var(--cb-text-muted);font-size:12.5px}
.per .pa{display:flex;gap:8px;flex-wrap:wrap;align-items:center;justify-content:flex-end}.per .pa form{display:flex;gap:6px;flex-wrap:wrap}
.per .why{grid-column:2 / -1;margin:0;font-size:12.5px;color:var(--cb-text-muted)}
ol.track{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:4px}
ol.track li{font-size:11px;font-weight:650;letter-spacing:.05em;text-transform:uppercase;color:var(--cb-text-faint);padding-top:8px;border-top:3px solid var(--cb-border);display:block}
ol.track li.done{border-top-color:var(--cb-success);color:var(--cb-success-ink)}ol.track li.now{border-top-color:var(--cb-primary);color:var(--cb-text)}
ol.track li span{margin-right:4px}
@media (max-width:900px){.per{grid-template-columns:minmax(0,1fr)}.per .why{grid-column:1}.per .pa{justify-content:flex-start}}
ul.issues .vd{margin-right:6px;vertical-align:1px}

/* ---- reports landing ---- */
.rgroups{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:30px 36px}
.rg h2{font-family:var(--cb-font);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--cb-text-muted);margin:0 0 2px;font-weight:650}
.rg>p{margin:0 0 8px;color:var(--cb-text-muted);font-size:13px}
.rg ul{list-style:none;margin:0;padding:0;border-top:1px solid var(--cb-border)}
.rg li a{display:block;padding:11px 4px;border-bottom:1px solid var(--cb-border);color:var(--cb-text);text-decoration:none}
.rg li a:hover{background:var(--cb-surface-interactive);text-decoration:none}.rg li b{display:block;font-weight:600;font-size:14px}.rg li small{color:var(--cb-text-muted);font-size:12.5px}

/* ---- trial balance: strong financial hierarchy ---- */
.tb th[scope=colgroup]{background:var(--cb-surface-subtle);text-align:left;padding:8px 16px;font-size:11px}
.tb tr.sub td{font-weight:650;border-top:1px solid var(--cb-border-strong);background:transparent;color:var(--cb-text)}
.tb tfoot td{font-size:15px;font-weight:700;border-top:2px solid var(--cb-text);background:var(--cb-surface-subtle);padding:13px 16px}
.verdict .acts{display:flex;gap:8px;flex-wrap:wrap}.verdict .grow{flex:1}

/* ---- settings control centre ---- */
.hub{gap:12px;margin-bottom:6px}
.hub a{position:relative;padding:16px 16px 16px 58px;border-radius:var(--cb-r-card);box-shadow:none;min-height:78px;justify-content:center}
.hub a .ic{position:absolute;left:16px;top:16px;width:30px;height:30px;padding:6px;border-radius:8px;background:var(--cb-surface-subtle);stroke:var(--cb-text-muted);fill:none;stroke-width:1.7}
.hub a:hover .ic{background:var(--cb-surface);stroke:var(--cb-primary)}
.notebar{margin:0 0 20px;padding:9px 14px;border:1px solid var(--cb-border);border-left:3px solid var(--cb-gold);border-radius:var(--cb-r-ctl);background:var(--cb-surface);font-size:12.5px;color:var(--cb-text-muted)}.notebar strong{color:var(--cb-text)}
.ring.sm{width:36px;height:36px}.ring.sm::before{width:28px;height:28px;font-size:10.5px}
.hub a{justify-content:flex-start}
.tabs:has(a:nth-child(10)){flex-wrap:wrap;overflow:visible;row-gap:0}
.tb td{padding:10px 16px}.tb tr.sub td{padding:11px 16px}

/* ---- micro-detail: focus and mobile pipeline ---- */
.chip:focus-visible,.cmd:focus-visible,.alist li a:focus-visible,.rg li a:focus-visible,.hub a:focus-visible,.pipe .st:focus-visible,.cardq:focus-visible,.seg button:focus-visible,details.setgrp>summary:focus-visible,.tabmore>summary:focus-visible,.create a.it:focus-visible,.ml a:focus-visible{outline:2px solid var(--cb-primary);outline-offset:2px;border-radius:6px}
.alist li a:focus-visible,.rg li a:focus-visible{outline-offset:-2px}
@media (max-width:900px){
  .pipe .st{border-left:0;border-top:1px solid var(--cb-border)}
  .pipe .st:nth-child(-n+2){border-top:0}.pipe .st:nth-child(2n){border-left:1px solid var(--cb-border)}
}
td .vd{vertical-align:middle}
.empty-state .btn{margin-top:4px}

/* ---- accessibility fixes found by axe-core (UX 3.1) ---- */
tr.danger td a,tr.warn td a,tr.danger td .s a,tr.warn td .s a{color:var(--cb-primary-hover)}
.flow .st.todo{opacity:1;color:var(--cb-text-muted);border-style:dashed}
.flow .st.todo .nm{color:var(--cb-text-muted)}
p a:not(.btn),small a,.hint a,.s a,li small a,.sub a,dd a{text-decoration:underline;text-underline-offset:2px}
.rail h2{margin:0 0 8px;font-family:var(--cb-font);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--cb-text-muted);font-weight:650}
:root[data-theme="dark"] button.danger,:root[data-theme="dark"] .btn.danger{color:#1B0A09}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) button.danger,:root:not([data-theme="light"]) .btn.danger{color:#1B0A09}}

/* match card on a phone: each measure becomes a small labelled block instead of a clipped table */
@media (max-width:640px){
  .ml thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .ml table,.ml tbody,.ml tr,.ml td{display:block;width:100%}
  .ml tr{padding:10px 14px;border-top:1px solid var(--cb-border)}.ml tr:first-child{border-top:0}
  .ml td{display:flex;justify-content:space-between;align-items:baseline;gap:12px;border:0;padding:3px 0;text-align:right}
  .ml td:first-child{font-weight:650;font-size:14px;text-align:left;padding-bottom:4px}
  .ml td[data-label]::before{content:attr(data-label);color:var(--cb-text-muted);font-size:12px;font-weight:600;text-align:left;flex:none}
  .ml td[data-label="Result"]{flex-wrap:wrap}.ml td[data-label="Result"] .why{flex-basis:100%;text-align:left}
  .ml td.dim{display:none}
  .ml footer{flex-direction:column;align-items:stretch}.ml footer form{flex:none;flex-direction:column}
}
.trend .dotp{cursor:pointer;transition:r var(--cb-fast) var(--cb-ease)}.trend .dotp:hover,.trend .dotp:focus-visible{stroke-width:4;outline:none;paint-order:stroke}
