/* ============================================================================
   Rishi ERP design system
   Rishi red with a calm, cool operational palette. Every colour below is
   selected for clear hierarchy and accessible text contrast:
   - ordinal red ramp passes monotone-L, step-gap and light-end contrast checks
   - all text pairs meet WCAG AA (4.5:1) unless marked decorative
   Re-theming is this file only. Change the --brand-* and --ink-* ramps and
   everything downstream follows.
   ========================================================================= */

:root {
  /* --- Ink ramp (black) --- */
  --ink-950:#0A0A0B;  --ink-900:#141417;  --ink-800:#1F1F24;  --ink-700:#2E2E36;
  --ink-600:#52525C;  --ink-500:#6E6E7A;  --ink-400:#9A9AA5;  --ink-300:#C7C7CF;
  --ink-200:#E4E4E9;  --ink-100:#F1F1F4;

  /* --- Brand ramp (red) --- */
  --brand-700:#96131A; --brand-600:#B4161D; --brand-500:#D42027;
  --brand-400:#E4666D; --brand-300:#F0989C; --brand-100:#FBE0E1; --brand-50:#FEF3F3;

  /* --- Supporting accents: navigation and data categories, not status --- */
  --blue-600:#315FCE; --blue-100:#DCE7FF; --blue-50:#F1F5FF;
  --teal-600:#087D70; --teal-100:#D3F0EB; --teal-50:#EFFAF8;
  --violet-600:#7052B8; --violet-100:#E9E0FA; --violet-50:#F7F3FD;
  --amber-600:#9A6500; --amber-100:#F7E4B5; --amber-50:#FFF9EA;

  /* --- Ordinal ramp for funnel/composition marks (validated light->dark) --- */
  --ord-1:#F0989C; --ord-2:#E4666D; --ord-3:#D42027; --ord-4:#A81A20; --ord-5:#741216;

  /* --- Status: reserved meaning, always shipped with an icon + label --- */
  --st-good:#0CA30C;    --st-good-ink:#05702F;    --st-good-bg:#E8F6EC;
  --st-warn:#FAB219;    --st-warn-ink:#8A5200;    --st-warn-bg:#FEF5E1;
  --st-serious:#EC835A; --st-serious-ink:#9A3F12; --st-serious-bg:#FDEEE6;
  --st-crit:#D03B3B;    --st-crit-ink:#B0201F;    --st-crit-bg:#FCEBEB;

  /* --- Surfaces --- */
  --canvas:#DCE6F2; --surface:#EDF3FA; --surface-2:#E1EAF5;
  --line:#C7D3E2; --line-soft:#D8E2EE;

  /* --- Type --- */
  --font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
          "Helvetica Neue", Arial, sans-serif;
  --mono: ui-monospace, "Cascadia Mono", "SF Mono", Consolas, monospace;

  /* --- Space (8px scale) --- */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px; --s7:48px;

  --r-sm:5px; --r:8px; --r-lg:14px; --r-full:999px;

  --shadow-1:0 1px 2px rgba(31,47,71,.04),0 5px 16px rgba(31,47,71,.035);
  --shadow-2:0 2px 5px rgba(31,47,71,.06),0 12px 30px rgba(31,47,71,.07);
  --shadow-3:0 18px 48px rgba(31,47,71,.14);

  --nav-w:244px; --top-h:62px;
}

*,*::before,*::after{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; background:
    radial-gradient(circle at 88% 2%,rgba(49,95,206,.23),transparent 31rem),
    radial-gradient(circle at 6% 92%,rgba(8,125,112,.18),transparent 34rem),
    linear-gradient(135deg,#D6E2F1 0%,#E9DADF 48%,#D7EAE6 100%);
  background-attachment:fixed;color:var(--ink-900);
  font-family:var(--font); font-size:14px; line-height:1.5;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{margin:0;font-weight:600;letter-spacing:-.011em}
::selection{background:var(--brand-100)}
:focus-visible{outline:2px solid var(--brand-500);outline-offset:2px;border-radius:var(--r-sm)}

/* ===== App shell ============================================================ */
.app{display:grid;grid-template-columns:var(--nav-w) 1fr;min-height:100vh}

/* ===== Sidebar ============================================================== */
.nav{
  background:linear-gradient(180deg,#EBDDE2 0%,#DEE8F5 52%,#D5E8E4 100%);
  color:var(--ink-700);border-right:1px solid var(--line);
  box-shadow:4px 0 22px rgba(31,47,71,.035);
  display:flex;flex-direction:column; position:sticky;top:0;height:100vh;
}
.nav__brand{
  display:flex;align-items:center;gap:10px;height:var(--top-h);
  padding:0 var(--s4);border-bottom:1px solid var(--line-soft);flex:none;
  background:linear-gradient(115deg,rgba(249,225,228,.90),rgba(220,231,247,.90));
}
.nav__mark{
  width:34px;height:34px;border-radius:9px;flex:none;padding:3px;
  display:block;object-fit:contain;background:#fff;border:1px solid var(--brand-100);
  box-shadow:0 5px 14px rgba(180,22,29,.10);
}
.nav__brandcopy{display:grid;gap:1px;line-height:1.15;min-width:0}
.nav__brandcopy small{font-size:10.5px;color:var(--ink-500);letter-spacing:.02em}
.nav__name{color:var(--ink-950);font-weight:700;font-size:14.5px;letter-spacing:-.01em}
.nav__scroll{overflow-y:auto;padding:var(--s3) var(--s2) var(--s5);flex:1;scrollbar-width:thin}
.nav__group{display:flex;align-items:center;gap:7px;padding:var(--s4) var(--s3) var(--s1)}
.nav__group::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--brand-400);box-shadow:0 0 0 3px var(--brand-50)}
.nav__grouplabel{
  font-size:10px;font-weight:700;letter-spacing:.095em;text-transform:uppercase;
  color:var(--ink-500);
}
.nav__item{
  display:flex;align-items:center;gap:10px;margin:2px 0;
  padding:8px 11px;border-radius:9px;
  color:var(--ink-700);font-size:13.5px;font-weight:500;
  border:1px solid transparent;
  transition:background .14s ease,color .14s ease,border-color .14s ease,transform .14s ease;
}
.nav__item:hover{background:var(--blue-50);color:var(--blue-600);border-color:var(--blue-100);transform:translateX(2px)}
.nav__item svg{width:16px;height:16px;flex:none;opacity:.75}
.nav__item.is-active{
  background:linear-gradient(90deg,var(--brand-50),#fff);color:var(--brand-700);font-weight:650;
  border-color:var(--brand-100);box-shadow:0 4px 12px rgba(180,22,29,.06);
}
.nav__item.is-active::before{content:"";width:3px;height:18px;border-radius:3px;background:var(--brand-500);margin-left:-5px}
.nav__item.is-active svg{opacity:1;color:var(--brand-500)}
.nav__count{
  margin-left:auto;font-size:11px;font-weight:600;
  background:var(--brand-500);color:#fff;
  padding:1px 6px;border-radius:var(--r-full);min-width:18px;text-align:center;
}
.nav__count--quiet{background:var(--blue-50);color:var(--blue-600);border:1px solid var(--blue-100)}
.nav__foot{
  padding:var(--s3) var(--s4);border-top:1px solid var(--line-soft);
  font-size:11px;color:var(--ink-600);flex:none;background:linear-gradient(100deg,#DCE6F3,#D9EAE6);
}

/* ===== Top bar ============================================================== */
.main{display:flex;flex-direction:column;min-width:0}
.top{
  height:var(--top-h);background:linear-gradient(90deg,rgba(236,220,226,.96),rgba(218,230,246,.96),rgba(214,235,230,.94));border-bottom:1px solid var(--line);
  display:flex;align-items:center;gap:var(--s4);padding:0 var(--s5);
  position:sticky;top:0;z-index:20;backdrop-filter:blur(14px);
}
.search{position:relative;flex:1;max-width:440px}
.search svg{position:absolute;left:10px;top:50%;transform:translateY(-50%);
  width:15px;height:15px;color:var(--ink-400)}
.search input{
  width:100%;height:34px;padding:0 var(--s3) 0 32px;
  border:1px solid var(--line);border-radius:var(--r);background:var(--surface-2);
  font:inherit;font-size:13px;color:var(--ink-900);
}
.search input::placeholder{color:var(--ink-500)}
.search input:focus{outline:none;border-color:var(--brand-400);background:#fff;
  box-shadow:0 0 0 3px var(--brand-50)}
.search kbd{
  position:absolute;right:8px;top:50%;transform:translateY(-50%);
  font:500 10px var(--mono);color:var(--ink-500);
  border:1px solid var(--line);border-radius:var(--r-sm);padding:2px 5px;background:#fff;
}
.top__spacer{flex:1}
.top__link{font-size:12px;font-weight:600;color:var(--ink-600);padding:6px 8px;border-radius:7px;transition:background .12s ease,color .12s ease}
.top__link:hover{background:var(--blue-50);color:var(--blue-600)}
.top__identity{display:inline-flex;align-items:center;gap:7px;max-width:180px;padding:6px 9px;border:1px solid var(--line);border-radius:var(--r-full);background:var(--surface-2);font-size:12px;font-weight:600;color:var(--ink-700);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.top__identity i{width:7px;height:7px;border-radius:50%;background:var(--teal-600);box-shadow:0 0 0 3px var(--teal-100);flex:none}
.top__signout{border:1px solid var(--line);border-radius:7px;background:#fff;color:var(--ink-700);padding:6px 9px;font:inherit;font-size:12px;font-weight:600;cursor:pointer}
.top__signout:hover{border-color:var(--brand-300);background:var(--brand-50);color:var(--brand-700)}
.top__btn{
  width:32px;height:32px;display:grid;place-items:center;border-radius:var(--r);
  color:var(--ink-600);position:relative;border:0;background:none;cursor:pointer;
}
.top__btn:hover{background:var(--ink-100);color:var(--ink-900)}
.top__btn svg{width:17px;height:17px}
.top__dot{position:absolute;top:6px;right:7px;width:6px;height:6px;border-radius:50%;
  background:var(--brand-500);border:1.5px solid #fff}
.avatar{
  width:30px;height:30px;border-radius:var(--r-full);background:var(--ink-900);color:#fff;
  display:grid;place-items:center;font-size:11.5px;font-weight:600;letter-spacing:.01em;
}

/* ===== Page ================================================================= */
.page{padding:28px clamp(18px,2.1vw,34px) 40px;max-width:1560px;width:100%}
.page__head{display:flex;align-items:flex-start;gap:var(--s4);margin-bottom:var(--s5);padding:20px 22px;border:1px solid rgba(180,22,29,.16);border-radius:16px;background:linear-gradient(118deg,#F1CDD2,#CEDCF6 55%,#CBE7E1);box-shadow:0 10px 28px rgba(44,63,91,.10)}
.crumb{font-size:12px;color:var(--ink-500);margin-bottom:3px}
.crumb b{color:var(--ink-600);font-weight:500}
.page__title{font-size:23px;line-height:1.22;font-weight:700;color:var(--ink-950)}
.page__sub{font-size:13px;color:var(--ink-500);margin-top:3px}
.page__actions{margin-left:auto;display:flex;gap:var(--s2);flex:none}

/* ===== Buttons ============================================================== */
.btn{
  display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 13px;
  border-radius:9px;border:1px solid var(--line);background:var(--surface);
  color:var(--ink-800);font:inherit;font-size:13px;font-weight:550;cursor:pointer;
  transition:background .12s ease,border-color .12s ease,box-shadow .12s ease;
  white-space:nowrap;
}
.btn svg{width:15px;height:15px}
.btn:hover{background:var(--blue-50);border-color:var(--blue-100);color:var(--blue-600)}
.btn--primary{background:linear-gradient(135deg,var(--brand-500),var(--brand-600));border-color:var(--brand-600);color:#fff;
  box-shadow:0 6px 15px rgba(180,22,29,.17)}
.btn--primary:hover,.btn--primary:focus-visible{background:var(--brand-700);border-color:var(--brand-700);color:#fff}
.btn--ghost{border-color:transparent;background:transparent;color:var(--ink-600)}
.btn--ghost:hover{background:var(--ink-100);border-color:transparent;color:var(--ink-900)}
/* Destructive is outlined, never filled: filled red is the primary action here. */
.btn--danger{color:var(--brand-700);border-color:var(--brand-300);background:var(--brand-50)}
.btn--danger:hover{background:var(--brand-100);border-color:var(--brand-400)}
.btn--sm{height:28px;padding:0 10px;font-size:12.5px}

/* ===== Cards ================================================================ */
.card{background:linear-gradient(145deg,#EDF3FA,#E8EDF6 58%,#F1E7EC);border:1px solid var(--line);border-radius:var(--r-lg);
  box-shadow:var(--shadow-1)}
.card__head{display:flex;align-items:center;gap:var(--s3);padding:14px var(--s4) 12px;background:linear-gradient(100deg,rgba(49,95,206,.12),rgba(180,22,29,.10),rgba(8,125,112,.10));border-bottom:1px solid rgba(125,145,173,.18);border-radius:var(--r-lg) var(--r-lg) 0 0}
.card__title{font-size:14px;font-weight:600}
.card__sub{font-size:12px;color:var(--ink-500);font-weight:400}
.card__actions{margin-left:auto;display:flex;gap:var(--s2)}
.card__body{padding:var(--s4)}
.card__foot{padding:10px var(--s4);border-top:1px solid var(--line-soft);
  font-size:12px;color:var(--ink-500)}

.grid{display:grid;gap:var(--s4)}
.grid--kpi{grid-template-columns:repeat(auto-fit,minmax(212px,1fr))}
.grid--2{grid-template-columns:repeat(auto-fit,minmax(400px,1fr))}
.grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid--32{grid-template-columns:minmax(0,1.55fr) minmax(320px,1fr);align-items:start}
@media(max-width:1600px){.grid--32{grid-template-columns:1fr}}
@media(max-width:1100px){.grid--3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.grid--2,.grid--3{grid-template-columns:1fr}}

/* ===== Stat tiles ===========================================================
   Contract: label - value - delta - trend.
   Value uses proportional figures (tabular-nums makes display sizes look loose). */
.stat{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:18px var(--s4) var(--s4);box-shadow:var(--shadow-1);position:relative;overflow:hidden}
.stat::before,.kpi::before{content:"";position:absolute;inset:0 0 auto;height:3px;background:var(--brand-500)}
.grid--kpi>.stat:nth-child(4n+2)::before,.kpi-grid>.kpi:nth-child(4n+2)::before{background:var(--blue-600)}
.grid--kpi>.stat:nth-child(4n+3)::before,.kpi-grid>.kpi:nth-child(4n+3)::before{background:var(--teal-600)}
.grid--kpi>.stat:nth-child(4n+4)::before,.kpi-grid>.kpi:nth-child(4n+4)::before{background:var(--violet-600)}
.grid--kpi>.stat:nth-child(4n+1),.kpi-grid>.kpi:nth-child(4n+1){background:linear-gradient(145deg,#F7E3E6,#EED5DA)}
.grid--kpi>.stat:nth-child(4n+2),.kpi-grid>.kpi:nth-child(4n+2){background:linear-gradient(145deg,#E3EBFA,#D7E2F7)}
.grid--kpi>.stat:nth-child(4n+3),.kpi-grid>.kpi:nth-child(4n+3){background:linear-gradient(145deg,#DDF0EC,#D1E9E4)}
.grid--kpi>.stat:nth-child(4n+4),.kpi-grid>.kpi:nth-child(4n+4){background:linear-gradient(145deg,#EBE4F6,#E1D8F0)}
.stat__label{font-size:12px;color:var(--ink-500);font-weight:500;
  display:flex;align-items:center;gap:5px}
.stat__value{font-size:27px;font-weight:650;letter-spacing:-.025em;margin-top:6px;
  line-height:1.15;color:var(--ink-900)}
.stat__value .unit{font-size:15px;font-weight:550;color:var(--ink-500);margin-left:2px}
.stat__meta{display:flex;align-items:center;gap:7px;margin-top:7px;font-size:12px;
  color:var(--ink-500)}
.delta{display:inline-flex;align-items:center;gap:3px;font-weight:600;font-size:12px}
.delta svg{width:12px;height:12px}
.delta--up{color:var(--st-good-ink)}
.delta--down{color:var(--st-crit-ink)}
.delta--flat{color:var(--ink-500)}

/* Hero figure: exactly one per view */
.hero{font-size:48px;font-weight:680;letter-spacing:-.035em;line-height:1.05;
  color:var(--ink-900)}
.hero .unit{font-size:22px;font-weight:550;color:var(--ink-500)}

/* Sparkline sits in the de-emphasis hue with the current period in accent */
.spark{display:block;width:100%;height:32px;margin-top:auto;padding-top:10px}
.stat{display:flex;flex-direction:column}

/* Legacy/manual KPI contract. Several operational screens build their tiles
   directly rather than through _KpiTiles; keep both structures visually
   identical so text never collapses into an unstyled inline run. */
.kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(212px,1fr));gap:var(--s4);margin-bottom:var(--s4)}
.kpi{display:flex;flex-direction:column;min-width:0;position:relative;overflow:hidden;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:18px var(--s4) var(--s4);box-shadow:var(--shadow-1)}
.kpi>span:first-child,.kpi__label{display:block;font-size:12px;line-height:1.35;color:var(--ink-500);font-weight:500}
.kpi>strong,.kpi__value{display:block;font-size:27px;line-height:1.15;font-weight:650;letter-spacing:-.025em;color:var(--ink-900);margin-top:6px;overflow-wrap:anywhere}
.kpi>small,.kpi__caption{display:block;font-size:12px;line-height:1.4;color:var(--ink-500);margin-top:7px}

/* ===== Meter ================================================================
   Fill carries severity; the track is a lighter step of the same ramp. */
.meter{height:7px;border-radius:var(--r-full);background:var(--ink-100);overflow:hidden}
.meter__fill{height:100%;border-radius:var(--r-full);background:var(--brand-500);
  transition:width .3s ease}
.meter--good .meter__fill{background:var(--st-good)}
.meter--good{background:var(--st-good-bg)}
.meter--warn .meter__fill{background:var(--st-warn)}
.meter--warn{background:var(--st-warn-bg)}
.meter--crit .meter__fill{background:var(--st-crit)}
.meter--crit{background:var(--st-crit-bg)}
/* Target notch: shows the role target on the same track */
.meter{position:relative}
.meter__target{position:absolute;top:-2px;bottom:-2px;width:2px;background:var(--ink-700);
  border-radius:1px;opacity:.55}

/* ===== Badges & pills ======================================================= */
.badge{
  display:inline-flex;align-items:center;gap:4px;
  padding:2px 8px;border-radius:var(--r-full);
  font-size:11.5px;font-weight:600;letter-spacing:.005em;white-space:nowrap;
  border:1px solid transparent;
}
.badge svg{width:11px;height:11px;flex:none}
.badge--neutral{background:var(--ink-100);color:var(--ink-600);border-color:var(--line)}
.badge--good{background:var(--st-good-bg);color:var(--st-good-ink);border-color:#BFE6C9}
.badge--warn{background:var(--st-warn-bg);color:var(--st-warn-ink);border-color:#F5DFAE}
.badge--serious{background:var(--st-serious-bg);color:var(--st-serious-ink);border-color:#F6CDB9}
.badge--crit{background:var(--st-crit-bg);color:var(--st-crit-ink);border-color:#F2C4C4}
.badge--brand{background:var(--brand-50);color:var(--brand-700);border-color:var(--brand-100)}
.badge--solid{background:var(--ink-900);color:#fff}
.hsn-picker{position:relative}
.hsn-results{position:absolute;z-index:30;left:0;right:0;top:calc(100% - .25rem);max-height:320px;overflow:auto;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 18px 45px rgba(32,39,62,.18);padding:.35rem}
.hsn-choice{display:grid;grid-template-columns:86px 1fr;gap:.15rem .65rem;width:100%;border:0;border-bottom:1px solid var(--line);background:transparent;text-align:left;padding:.65rem .7rem;color:var(--ink-800);cursor:pointer}
.hsn-choice:last-child{border-bottom:0}.hsn-choice:hover,.hsn-choice:focus{background:var(--brand-50);outline:none}.hsn-choice b{grid-row:1 / span 2;color:var(--brand-700);font-family:var(--font-mono)}.hsn-choice span{font-weight:650}.hsn-choice small{color:var(--ink-500)}
.hsn-result-empty{padding:.75rem;color:var(--ink-500)}

/* Stage chip: ordinal ramp, so position in the funnel reads from the colour */
.stage{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:550;
  color:var(--ink-700);white-space:nowrap}
.stage__dot{width:8px;height:8px;border-radius:50%;flex:none;
  box-shadow:0 0 0 2px var(--surface)}
.stage--1 .stage__dot{background:var(--ord-1)}
.stage--2 .stage__dot{background:var(--ord-2)}
.stage--3 .stage__dot{background:var(--ord-3)}
.stage--4 .stage__dot{background:var(--ord-4)}
.stage--5 .stage__dot{background:var(--ord-5)}

/* ===== Tables ===============================================================
   Dense but breathable. Numerics right aligned and tabular so columns line up. */
.tablewrap{overflow-x:auto;border-radius:var(--r-lg)}
table.data{width:100%;border-collapse:separate;border-spacing:0;font-size:13px}
table.data thead th{
  position:sticky;top:0;z-index:1;background:linear-gradient(90deg,#EEF3FB,#F8EEF2);
  text-align:left;font-size:11px;font-weight:600;letter-spacing:.055em;
  text-transform:uppercase;color:var(--ink-500);
  padding:9px var(--s3);border-bottom:1px solid var(--line);white-space:nowrap;
}
table.data tbody td{
  padding:11px var(--s3);border-bottom:1px solid var(--line-soft);
  color:var(--ink-800);vertical-align:middle;
}
table.data tbody tr:last-child td{border-bottom:0}
table.data tbody tr{transition:background .1s ease}
table.data tbody tr:nth-child(even){background:rgba(49,95,206,.045)}
table.data tbody tr:hover{background:rgba(49,95,206,.12)}
table.data .num{text-align:right;font-variant-numeric:tabular-nums;
  font-feature-settings:"tnum";white-space:nowrap}
table.data .strong{font-weight:600;color:var(--ink-900)}
table.data .muted{color:var(--ink-500)}
table.data .nowrap{white-space:nowrap}
.tick{color:var(--ink-400);font-size:12px}

/* Left urgency rail on a row: colour plus an icon in the cell, never colour alone */
tr.rail{position:relative}
tr.rail > td:first-child{border-left:3px solid transparent}
tr.rail--crit > td:first-child{border-left-color:var(--st-crit)}
tr.rail--warn > td:first-child{border-left-color:var(--st-warn)}
tr.rail--serious > td:first-child{border-left-color:var(--st-serious)}
tr.rail--good > td:first-child{border-left-color:var(--st-good)}

.cellstack{display:flex;flex-direction:column;gap:1px;min-width:0;
  max-width:clamp(190px,20vw,400px)}
.cellstack b{font-weight:600;color:var(--ink-900);font-size:13px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cellstack span{font-size:11.5px;color:var(--ink-500);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ===== Bar chart (horizontal) ==============================================
   Marks capped at 24px, 4px rounded data-end, 2px surface gap between bars. */
.bars{display:flex;flex-direction:column;gap:2px}
.bar{display:grid;grid-template-columns:150px 1fr 78px;align-items:center;gap:var(--s3);
  padding:5px 0}
.bar__label{font-size:12.5px;color:var(--ink-700);display:flex;align-items:center;gap:6px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bar__track{height:100%;min-height:20px;display:flex;align-items:center}
.bar__fill{height:18px;border-radius:0 4px 4px 0;background:var(--ord-3);min-width:2px}
.bar__val{text-align:right;font-size:12.5px;font-weight:600;
  font-variant-numeric:tabular-nums;color:var(--ink-800)}
.bar--1 .bar__fill{background:var(--ord-1)}
.bar--2 .bar__fill{background:var(--ord-2)}
.bar--3 .bar__fill{background:var(--ord-3)}
.bar--4 .bar__fill{background:var(--ord-4)}
.bar--5 .bar__fill{background:var(--ord-5)}

/* Stacked composition bar, 2px surface gaps do the separating */
.stackbar{display:flex;gap:2px;height:26px;border-radius:var(--r-sm);overflow:hidden;
  background:var(--ink-100)}
.stackbar__seg{height:100%}
.legend{display:flex;flex-wrap:wrap;gap:var(--s4);margin-top:var(--s3);font-size:12px;
  color:var(--ink-600)}
.legend__item{display:inline-flex;align-items:center;gap:6px}
.legend__key{width:9px;height:9px;border-radius:2px;flex:none}

/* ===== Timesheet grid ======================================================= */
.week{width:100%;border-collapse:separate;border-spacing:0;font-size:13px}
.week th{font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;
  color:var(--ink-500);padding:8px 6px;text-align:center;border-bottom:1px solid var(--line)}
.week th.rowhead{text-align:left;width:270px}
.week td{border-bottom:1px solid var(--line-soft);padding:0}
.week td.rowhead{padding:10px var(--s3)}
.cellinput{
  width:100%;height:42px;border:0;background:transparent;text-align:center;
  font:inherit;font-size:13px;font-variant-numeric:tabular-nums;color:var(--ink-800);
  border-left:1px solid var(--line-soft);
}
.cellinput:hover{background:var(--surface-2)}
.cellinput:focus{outline:none;background:#fff;box-shadow:inset 0 0 0 2px var(--brand-400)}
.cellinput.is-off{background:repeating-linear-gradient(135deg,
  var(--ink-100) 0 6px,transparent 6px 12px);color:var(--ink-400)}
.week tfoot td{padding:10px var(--s3);font-weight:600;
  font-variant-numeric:tabular-nums;background:var(--surface-2);text-align:center}
.week tfoot td.rowhead{text-align:left}

/* Day completeness strip */
.daystrip{display:flex;gap:3px;margin-top:6px}
.daystrip i{height:3px;flex:1;border-radius:2px;background:var(--ink-200)}
.daystrip i.full{background:var(--st-good)}
.daystrip i.part{background:var(--st-warn)}
.daystrip i.empty{background:var(--st-crit)}

/* ===== Misc ================================================================= */
.divider{height:1px;background:var(--line-soft);margin:var(--s4) 0}
.empty{text-align:center;padding:var(--s7) var(--s4);color:var(--ink-500)}
.empty svg{width:34px;height:34px;color:var(--ink-300);margin-bottom:var(--s3)}
.empty b{display:block;color:var(--ink-800);font-size:14px;margin-bottom:3px}
.tabs{display:flex;gap:2px;border-bottom:1px solid var(--line);margin-bottom:var(--s4)}
.tab{padding:9px 13px;font-size:13px;font-weight:550;color:var(--ink-500);
  border-bottom:2px solid transparent;margin-bottom:-1px;cursor:pointer}
.tab:hover{color:var(--ink-800)}
.tab.is-active{color:var(--brand-600);border-bottom-color:var(--brand-500)}
.rupee{font-variant-numeric:tabular-nums}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);
  white-space:nowrap}

/* ===== Man-hour costing ==================================================== */
.notice{margin-bottom:var(--s4);padding:10px var(--s4);border:1px solid var(--line);
  border-radius:var(--r);font-size:13px;font-weight:550}
.notice--good{color:var(--st-good-ink);background:var(--st-good-bg);border-color:#BFE6C9}
.notice--crit{color:var(--st-crit-ink);background:var(--st-crit-bg);border-color:#F2C4C4}
.field{height:36px;width:100%;padding:0 10px;border:1px solid var(--line);
  border-radius:8px;background:#fff;color:var(--ink-900);font:inherit;font-size:13px;transition:border-color .12s ease,box-shadow .12s ease}
.field:focus{outline:none;border-color:var(--blue-600);box-shadow:0 0 0 3px var(--blue-100)}
.field--money{width:132px;font-variant-numeric:tabular-nums}
.field--date{width:142px}
.cost-edit{display:flex;align-items:center;gap:6px;min-width:360px}
.employee-form{display:grid;grid-template-columns:150px minmax(220px,1.3fr) minmax(190px,1fr) 180px 170px auto;
  align-items:end;gap:var(--s3)}
.form-field{display:flex;flex-direction:column;gap:5px;min-width:0}
.form-field label{font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-500)}
.form-submit{display:flex;align-items:flex-end}
.cost-table td:last-child{min-width:380px}
@media(max-width:1250px){.employee-form{grid-template-columns:repeat(3,minmax(180px,1fr))}.form-submit{grid-column:auto}}
@media(max-width:700px){.employee-form{grid-template-columns:1fr}.cost-edit{min-width:330px}}

/* ===== Jira connection ===================================================== */
.jira-form{display:grid;grid-template-columns:2fr 1fr;gap:var(--s4)}
.jira-form__wide,.jira-form__actions{grid-column:1/-1}
.jira-form__actions{display:flex;gap:var(--s2);align-items:center}
.field[readonly]{background:var(--surface-2);color:var(--ink-600)}
.field-help{font-size:11.5px;color:var(--ink-500)}
.detail-list{margin:0;display:flex;flex-direction:column;gap:0}
.detail-list>div{display:grid;grid-template-columns:115px 1fr;gap:var(--s3);padding:9px 0;border-bottom:1px solid var(--line-soft)}
.detail-list>div:last-child{border-bottom:0}
.detail-list dt{font-size:12px;color:var(--ink-500)}
.detail-list dd{margin:0;font-size:13px;font-weight:550;color:var(--ink-800)}
.scope-list{display:flex;flex-direction:column;gap:var(--s3)}
.scope-list>div{display:grid;grid-template-columns:90px 1fr;align-items:start;gap:var(--s3);font-size:12.5px;color:var(--ink-700)}
@media(max-width:700px){.jira-form{grid-template-columns:1fr}.jira-form__wide,.jira-form__actions{grid-column:auto}.jira-form__actions{align-items:stretch;flex-direction:column}}

/* ===== Jira activity charts =============================================== */
.filterbar{display:flex;align-items:flex-end;gap:var(--s4);margin-bottom:var(--s4)}
.filterbar__form{display:flex;align-items:flex-end;gap:var(--s2)}
.filterbar__sync{margin-left:auto;font-size:12px;color:var(--ink-500)}
.chart-layout{display:grid;grid-template-columns:190px minmax(0,1fr);align-items:center;gap:var(--s5)}
.donut{width:176px;height:176px;border-radius:50%;display:grid;place-items:center;position:relative}
.donut::after{content:"";position:absolute;width:104px;height:104px;border-radius:50%;background:var(--surface);box-shadow:0 0 0 1px var(--line-soft)}
.donut>div{z-index:1;display:flex;flex-direction:column;align-items:center;max-width:90px;text-align:center}
.donut b{font-size:19px;line-height:1.15;color:var(--ink-900);font-variant-numeric:tabular-nums}
.donut span{font-size:11px;color:var(--ink-500)}
.chart-legend{display:flex;flex-direction:column;gap:9px}
.chart-legend>div{display:grid;grid-template-columns:10px minmax(0,1fr) auto;align-items:center;gap:8px;font-size:12.5px}
.chart-legend b{font-weight:600;font-variant-numeric:tabular-nums}
.chart-colour{width:9px;height:9px;border-radius:2px}
.chart-colour--1{background:var(--ord-5)}.chart-colour--2{background:var(--ord-4)}
.chart-colour--3{background:var(--ord-3)}.chart-colour--4{background:var(--ord-2)}
.chart-colour--5{background:var(--ord-1)}.chart-colour--6{background:var(--ink-600)}
.coverage-list{display:flex;flex-direction:column;gap:var(--s3)}
.coverage-row{display:grid;grid-template-columns:230px minmax(180px,1fr) 190px;align-items:center;gap:var(--s4)}
.coverage-row>div:first-child{display:flex;flex-direction:column}.coverage-row>div:first-child b{font-size:13px}.coverage-row>div:first-child span{font-size:11.5px;color:var(--ink-500)}
.coverage-row .num{text-align:right;font-variant-numeric:tabular-nums;font-size:12.5px}
.activity-copy{max-width:560px;max-height:58px;overflow:hidden;color:var(--ink-700);font-size:12.5px}
@media(max-width:800px){.filterbar{align-items:stretch;flex-direction:column}.filterbar__form{align-items:stretch;flex-wrap:wrap}.filterbar__sync{margin-left:0}.chart-layout{grid-template-columns:1fr}.donut{margin:auto}.coverage-row{grid-template-columns:1fr}.coverage-row .num{text-align:left}}

@media(max-width:900px){
  .app{grid-template-columns:1fr}
  .nav{position:fixed;left:-100%;z-index:60;width:var(--nav-w)}
  .page{padding:var(--s4)}
}
@media print{.nav,.top,.modbar,.print-hide{display:none!important}.app{display:block}.main{display:block}.page{padding:0}.card{border:0;box-shadow:none}.data{font-size:10px}.data th,.data td{padding:5px 6px}body{background:#fff}.report-page .page__head{margin-bottom:12px}}
.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(130px,1fr));gap:8px}.calendar-day{min-height:126px;padding:10px}.calendar-day__date{display:flex;align-items:baseline;gap:6px;margin-bottom:8px}.calendar-day__date b{font-size:18px}.calendar-day__date span{font-size:11px;color:var(--ink-500)}.calendar-event{display:flex;flex-direction:column;padding:7px;border-left:3px solid var(--brand-400);background:var(--brand-50);margin-bottom:6px;font-size:11px}.calendar-event b{font-size:11.5px}.calendar-event span{color:var(--ink-600)}@media(max-width:1100px){.calendar-grid{grid-template-columns:repeat(3,1fr)}}

/* ===== Operational entry forms =========================================== */
.ops-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s4);margin-bottom:var(--s4)}
.ops-action{overflow:visible}
.ops-action>summary{list-style:none;cursor:pointer;padding:14px var(--s4);font-size:14px;font-weight:650;color:var(--ink-900);display:flex;align-items:center;justify-content:space-between}
.ops-action>summary::-webkit-details-marker{display:none}
.ops-action>summary::after{content:"+";font-size:20px;color:var(--brand-500);font-weight:400}
.ops-action[open]>summary::after{content:"-"}
.ops-action[open]>summary{border-bottom:1px solid var(--line-soft)}
.ops-form{display:grid;grid-template-columns:repeat(2,minmax(160px,1fr));gap:var(--s3);padding:var(--s4)}
.ops-form--wide{grid-template-columns:repeat(3,minmax(160px,1fr))}
.ops-form .span-2{grid-column:span 2}.ops-form--wide .span-3{grid-column:span 3}
.ops-form textarea.field{height:76px;padding:9px 10px;resize:vertical}
.ops-form select.field{padding-right:28px}
.suggest-select{position:relative;min-width:0;width:100%}
.suggest-select__input{padding-right:30px;background:#fff}
.suggest-select::after{content:"⌄";position:absolute;right:10px;top:50%;transform:translateY(-54%);pointer-events:none;color:var(--ink-500);font-size:15px}
.suggest-select__native{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important;overflow:hidden!important;left:0;bottom:0}
.suggest-select__list{position:absolute;z-index:80;top:calc(100% + 4px);left:0;right:0;max-height:260px;overflow:auto;padding:4px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow-2)}
.suggest-select__list[hidden]{display:none}
.suggest-select__option{display:block;width:100%;border:0;border-radius:4px;background:transparent;color:var(--ink-800);font:inherit;font-size:12.5px;text-align:left;padding:8px 9px;cursor:pointer}
.suggest-select__option:hover,.suggest-select__option.is-active{background:var(--brand-50);color:var(--brand-700)}
.suggest-select__empty{padding:9px;color:var(--ink-500);font-size:12px}
.suggest-select__input:invalid{border-color:var(--st-crit)}
.ops-form__actions{display:flex;align-items:end;gap:var(--s2)}
.inline-edit{position:relative}
.inline-edit>summary{cursor:pointer;color:var(--brand-600);font-weight:600;white-space:nowrap}
.inline-edit__panel{min-width:520px;padding:var(--s3);margin-top:8px;background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow-2)}
.inline-form{display:grid;grid-template-columns:repeat(2,minmax(150px,1fr));gap:var(--s2)}
.inline-form .span-2{grid-column:span 2}
@media(max-width:850px){.ops-actions{grid-template-columns:1fr}.ops-form,.ops-form--wide{grid-template-columns:1fr}.ops-form .span-2,.ops-form--wide .span-3{grid-column:auto}.inline-edit__panel{min-width:320px}.inline-form{grid-template-columns:1fr}.inline-form .span-2{grid-column:auto}}

/* ===== Module bar =========================================================
   Horizontal module switcher in the header, under the top bar. The sidebar
   navigates within a module; this moves between them. */
.modbar{
  background:linear-gradient(90deg,rgba(214,226,243,.97),rgba(236,217,225,.96),rgba(211,233,228,.94));border-bottom:1px solid var(--line);
  display:flex;align-items:center;gap:2px;padding:0 var(--s5);
  position:sticky;top:var(--top-h);z-index:19;overflow-x:auto;
}
.modbar__item{
  display:inline-flex;align-items:center;gap:7px;
  padding:11px 14px;font-size:13.5px;font-weight:550;color:var(--ink-600);
  border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap;
  transition:color .12s ease,border-color .12s ease;
}
.modbar__item svg{width:16px;height:16px;opacity:.7}
.modbar__item:hover{color:var(--blue-600);background:var(--blue-50)}
.modbar__item:hover svg{opacity:1}
.modbar__item.is-active{color:var(--brand-600);border-bottom-color:var(--brand-500)}
.modbar__item.is-active svg{opacity:1;color:var(--brand-500)}
.modbar__item .pill{
  font-size:10.5px;font-weight:700;background:var(--ink-100);color:var(--ink-600);
  padding:1px 6px;border-radius:var(--r-full);
}
.modbar__item.is-active .pill{background:var(--brand-50);color:var(--brand-700)}
.modbar__spacer{flex:1}
.modbar__note{font-size:11.5px;color:var(--ink-500);padding-right:2px;white-space:nowrap}
.global-search{display:flex;align-items:center;width:min(520px,55vw);height:32px;border:1px solid var(--line);border-radius:var(--r);background:#fff;overflow:hidden}
.global-search input{border:0;outline:0;padding:0 10px;min-width:0;flex:1;font:inherit;font-size:12.5px;color:var(--ink-800)}
.global-search button{height:100%;border:0;border-left:1px solid var(--line);background:var(--surface-2);padding:0 12px;color:var(--brand-600);font:inherit;font-size:12px;font-weight:650;cursor:pointer}

/* Funnel: ordinal ramp, so the stage order reads from the colour itself */
.funnel{display:flex;flex-direction:column;gap:2px}
.funnel__row{display:grid;grid-template-columns:186px 1fr 128px;align-items:center;
  gap:var(--s3);padding:5px 0}
.funnel__label{font-size:12.5px;color:var(--ink-700);display:flex;align-items:center;gap:7px}
.funnel__count{font-size:11px;font-weight:700;color:var(--ink-500);
  background:var(--ink-100);border-radius:var(--r-full);padding:1px 6px}
.funnel__bar{height:18px;border-radius:0 4px 4px 0;min-width:2px}
.funnel__val{text-align:right;font-size:12.5px;font-weight:600;
  font-variant-numeric:tabular-nums;color:var(--ink-800)}

/* Dual progress: delivery percent over hours burn, on one track */
.dual{position:relative;height:7px;border-radius:var(--r-full);background:var(--ink-100)}
.dual__done{position:absolute;inset:0 auto 0 0;border-radius:var(--r-full);
  background:var(--ink-700);opacity:.28}
.dual__burn{position:absolute;top:0;bottom:0;left:0;border-radius:var(--r-full);height:3px;
  margin-top:2px}
.dual--good .dual__burn{background:var(--st-good)}
.dual--warn .dual__burn{background:var(--st-warn)}
.dual--crit .dual__burn{background:var(--st-crit)}

.mono{font-family:var(--mono);font-size:12px;letter-spacing:-.01em}

/* Not built yet. Rendered as a muted row, never as a link that goes nowhere. */
.nav__item--soon{color:var(--ink-400);cursor:default}
.nav__item--soon:hover{background:transparent;color:var(--ink-400);border-color:transparent;transform:none}
.nav__item--soon svg{opacity:.4}
.nav__soon{
  margin-left:auto;font-size:9.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:var(--ink-400);border:1px solid var(--line);background:var(--surface-2);border-radius:var(--r-full);padding:1px 6px;
}

/* Sub-nav rows carry no icon: the module icon is already in the header, and six
   copies of it down the sidebar is noise. Indent instead. */
.nav__scroll .nav__item{padding-left:14px}
.nav__scroll .nav__item.is-active{padding-left:12px}

/* When a card goes full width, an unconstrained bar reads as a stretched ribbon
   rather than a comparison. Cap the plot area; the labels and values stay put. */
.funnel,.bars{max-width:820px}

/* Authenticated access, mobile job cards and owned alert workflow */
.access-shell{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 18% 18%,rgba(180,22,29,.20),transparent 27rem),radial-gradient(circle at 82% 78%,rgba(8,125,112,.20),transparent 30rem),linear-gradient(135deg,#CCD9EB,#E6CDD6 52%,#CDE3DE)}
.access-card{width:min(460px,100%);background:linear-gradient(145deg,#EAF1FA,#EFE4EA 56%,#E2F0ED);border:1px solid rgba(124,143,169,.42);border-radius:18px;padding:28px;box-shadow:var(--shadow-3)}
.access-card--wide{width:min(720px,100%)}
.access-brand{display:flex;align-items:center;gap:14px;margin:0 0 24px}
.access-brand__logo{width:52px;height:52px;display:block;object-fit:contain;flex:none;background:#fff;border-radius:8px}
.access-brand__copy{display:grid;gap:2px;min-width:0;line-height:1.25}
.access-brand__copy b{display:block;color:var(--ink-950);font-size:17px;font-weight:700;letter-spacing:-.01em}
.access-brand__copy small{display:block;color:var(--ink-500);font-size:12.5px}
.access-card>h1{font-size:24px;line-height:1.2;margin:0 0 7px}
.access-card>p{margin:0 0 22px}
.access-card>.validation:not(:empty),.access-card>.notice{margin:0 0 16px}
.access-form{margin:0}
.access-card form,.form-grid{display:grid;gap:12px}.access-card input,.form-grid input,.form-grid select,.form-grid textarea,.filterbar select,.alert-actions input,.alert-actions select{width:100%;border:1px solid var(--line);border-radius:7px;padding:9px 10px;background:#fff}.access-card label,.form-grid label{display:grid;gap:5px;font-weight:600}.access-card .validation-summary-errors{color:var(--st-crit)}
.inline{display:inline}.link-button{border:0;background:transparent;color:var(--brand-600);cursor:pointer;padding:0;font:inherit}
.top>a,.top .link-button{font-size:12px;white-space:nowrap}
.field-page{max-width:1180px}.page-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:20px;padding:20px 22px;border:1px solid rgba(180,22,29,.10);border-radius:16px;background:linear-gradient(118deg,rgba(251,224,225,.82),rgba(220,231,255,.82) 55%,rgba(211,240,235,.78));box-shadow:0 10px 28px rgba(44,63,91,.07)}.page-head h1{font-size:24px;line-height:1.2}.page-head>div>p:not(.eyebrow){margin:6px 0 0;color:var(--ink-500);line-height:1.45}.eyebrow{margin:0 0 4px!important;font-size:10.5px;line-height:1.3;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--brand-600)}.head-actions{display:flex;gap:8px}.field-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px}.field-card{display:block;color:inherit;text-decoration:none;background:linear-gradient(145deg,#fff,var(--blue-50));border:1px solid var(--line);border-radius:12px;padding:16px;box-shadow:var(--shadow-1)}.field-card:hover{border-color:var(--brand-500);transform:translateY(-1px)}.field-card__top,.alert-card__head{display:flex;align-items:center;gap:10px;justify-content:space-between}.field-card h2,.alert-card h2{font-size:18px;margin:10px 0 5px}.field-card__metrics,.job-facts{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;font-size:12px;color:var(--ink-500)}.field-card__metrics span,.job-facts span{background:var(--ink-100);padding:4px 7px;border-radius:99px}.field-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:16px 0}.field-actions details,.panel{background:linear-gradient(145deg,#fff,var(--teal-50));border:1px solid var(--line);border-radius:10px;padding:14px}.field-actions summary,.panel>summary{font-weight:700;cursor:pointer;margin-bottom:10px}.two-col{display:grid;grid-template-columns:1.3fr 1fr;gap:14px}.timeline{border-left:3px solid var(--brand-300);padding:0 0 14px 12px;margin:12px 0}.timeline p{margin:4px 0}
/* Operational cards share the same lifted, colour-accented surface language. */
.field-card{border-radius:var(--r-lg);padding:18px;transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease;position:relative;overflow:hidden}
.field-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--blue-600)}
.field-card:hover{border-color:var(--blue-100);box-shadow:var(--shadow-2);transform:translateY(-2px)}
.field-actions details,.panel{border-radius:var(--r-lg);box-shadow:var(--shadow-1)}
.alert-list{display:grid;gap:12px;margin:16px 0}.alert-card{background:#fff;border:1px solid var(--line);border-left:5px solid var(--ink-400);border-radius:var(--r-lg);padding:16px;box-shadow:var(--shadow-1)}.alert-card--critical{border-left-color:var(--st-crit)}.alert-card--high{border-left-color:var(--st-warn)}.alert-card--medium{border-left-color:var(--blue-600)}.alert-actions{display:grid;grid-template-columns:130px 190px 170px 140px 1fr auto;gap:8px}.filterbar{display:flex;gap:8px}.role-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.check{display:flex!important;align-items:center;gap:6px!important}.check input{width:auto}
@media(max-width:800px){.page-head{display:block}.head-actions{margin-top:12px}.field-actions,.two-col{grid-template-columns:1fr}.alert-actions{grid-template-columns:1fr}.filterbar{flex-wrap:wrap}.top .global-search{display:none}.top{gap:10px;overflow:auto}.field-card{padding:14px}}
@media(max-width:560px){.access-shell{padding:12px}.access-card{padding:22px 18px}.access-brand{gap:12px;margin-bottom:20px}.access-brand__logo{width:46px;height:46px}.access-card>h1{font-size:21px}}

/* Server-paged registers and their single, on-demand editor. */
.register-filter{display:grid;grid-template-columns:minmax(210px,2fr) repeat(3,minmax(130px,1fr)) auto auto;gap:8px;align-items:end}
.register-filter .field{min-width:0}
.register-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.register-pager{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px;padding:12px 14px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r)}
.register-pager>span{font-size:12.5px;color:var(--ink-600)}
.register-pager>div{display:flex;gap:8px}
.lazy-editor{width:min(760px,calc(100vw - 32px));max-height:calc(100vh - 48px);overflow:auto;border:1px solid var(--line);border-radius:12px;padding:22px;background:var(--surface);color:var(--ink-900);box-shadow:var(--shadow-2)}
.lazy-editor--wide{width:min(920px,calc(100vw - 32px))}
.lazy-editor::backdrop{background:rgba(21,27,38,.52);backdrop-filter:blur(2px)}
.lazy-editor__close{display:flex;justify-content:flex-end;margin:-8px -8px 8px}
.party-queue{display:grid;gap:8px}
.party-row{display:grid;grid-template-columns:minmax(260px,2fr) minmax(190px,1fr) auto;align-items:center;gap:14px;padding:11px 12px;border:1px solid var(--line-soft);border-radius:var(--r);background:var(--surface)}
.party-row small{display:block;color:var(--ink-500);margin-top:3px}
@media(max-width:900px){.register-filter{grid-template-columns:1fr 1fr}.register-filter>input[type=search]{grid-column:1/-1}.register-pager{align-items:flex-start}.party-row{grid-template-columns:1fr}.party-row .btn{justify-self:start}}
@media(max-width:560px){.register-filter{grid-template-columns:1fr}.register-filter>input[type=search]{grid-column:auto}.register-pager{display:grid}.lazy-editor{padding:16px}}

/* Financial-year sales: historical imports stay visibly separate from live books. */
.fy-sales{margin:0 0 var(--s5);padding:20px;border:1px solid rgba(49,95,206,.30);border-radius:18px;background:linear-gradient(125deg,#C8D8F4,#DFD2EE 48%,#C5E4DE);box-shadow:var(--shadow-2);scroll-margin-top:calc(var(--top-h) + 56px)}
.fy-sales__head{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s5);margin-bottom:var(--s4)}
.fy-sales__head h2{font-size:20px;line-height:1.2;color:var(--ink-950)}
.fy-sales__head p{margin:5px 0 0;color:var(--ink-600);font-size:12.5px}
.fy-sales__eyebrow{display:block;margin-bottom:4px;color:var(--blue-600);font-size:10px;font-weight:750;letter-spacing:.10em;text-transform:uppercase}
.fy-picker{display:grid;grid-template-columns:minmax(150px,190px) auto;align-items:end;gap:8px;min-width:310px}
.fy-picker label{grid-column:1/-1;font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-600)}
.fy-sales__kpis{margin-bottom:var(--s4)}
.fy-sales__table{background:linear-gradient(145deg,rgba(224,234,248,.94),rgba(239,222,230,.92));backdrop-filter:blur(8px)}
.fy-sales__note{margin:11px 2px 0;color:var(--ink-600);font-size:11.5px}
@media(max-width:760px){.fy-sales{padding:14px}.fy-sales__head{display:grid}.fy-picker{min-width:0;width:100%}.fy-sales__table .card__head{align-items:flex-start;flex-direction:column}.fy-sales__table .card__actions{margin-left:0}}

/* Rich surface pass: colour is structural, while inputs retain clear contrast. */
.page-head{border-color:rgba(180,22,29,.16);background:linear-gradient(118deg,#F1CDD2,#CEDCF6 55%,#CBE7E1);box-shadow:0 10px 28px rgba(44,63,91,.10)}
.ops-action:nth-child(3n+1){background:linear-gradient(145deg,#E7EEF9,#EADDE4)}
.ops-action:nth-child(3n+2){background:linear-gradient(145deg,#DFECF7,#DCECE8)}
.ops-action:nth-child(3n+3){background:linear-gradient(145deg,#EEE2F3,#E5EAF6)}
.ops-action>summary{background:linear-gradient(100deg,rgba(49,95,206,.11),rgba(180,22,29,.10),rgba(8,125,112,.09));border-radius:var(--r-lg)}
.ops-action[open]>summary{border-radius:var(--r-lg) var(--r-lg) 0 0}
.field-card{background:linear-gradient(145deg,#DDE8F7,#E7DCE4 58%,#DCEDE9)}
.field-actions details,.panel{background:linear-gradient(145deg,#E2EAF7,#D9EBE7)}

/* Invoice composer: dense enough for accounts work, with clear visual separation between bill lines. */
.invoice-lines{display:grid;gap:14px}.invoice-line{padding:16px;border:1px solid var(--line);border-radius:12px;background:linear-gradient(145deg,rgba(255,255,255,.92),rgba(221,232,247,.76) 55%,rgba(220,237,233,.76));box-shadow:var(--shadow-1)}
.invoice-line__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.line-remove{color:var(--st-crit)}
.line-total{min-height:38px;display:flex;align-items:center;padding:0 12px;border-radius:8px;background:var(--ink-100);font-size:18px;font-weight:750;font-variant-numeric:tabular-nums}
.invoice-totalbar{display:flex;justify-content:flex-end;gap:30px;margin-top:16px;padding:16px 18px;border-radius:12px;background:linear-gradient(120deg,var(--blue-100),var(--teal-100));box-shadow:var(--shadow-1)}
.invoice-totalbar>div{display:grid;gap:3px;min-width:135px}.invoice-totalbar span{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-500)}.invoice-totalbar b{font-size:21px;font-variant-numeric:tabular-nums}.invoice-totalbar>div:last-child b{color:var(--brand-700)}
@media(max-width:800px){.invoice-totalbar{display:grid;grid-template-columns:1fr;gap:10px}.invoice-totalbar>div{display:flex;justify-content:space-between}}
.invoice-preview-card{overflow:hidden}.invoice-preview-card__body{padding:0}.invoice-preview-frame{display:block;width:100%;height:min(78vh,920px);min-height:620px;border:0;background:#d9e1ec}.invoice-preview-card .card__actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
@media(max-width:800px){.invoice-preview-frame{height:72vh;min-height:520px}.invoice-preview-card .card__head{align-items:flex-start;flex-direction:column}.invoice-preview-card .card__actions{margin-left:0}}
.alert-card{background:linear-gradient(120deg,#E6EDF8,#EFE1E7)}
.register-pager{background:linear-gradient(100deg,#DEE8F5,#E9DDE4,#DCEBE8)}
.party-row{background:linear-gradient(100deg,#E5EDF8,#E9E1E8)}
.calendar-day{background:linear-gradient(145deg,#E6EDF8,#EEE2E8)}