/* ==========================================================================
   Kairovane app: light-violet theme
   Pages and cards are light violet and white, text is deep ink, actions use one stronger violet,
   the footer is the only dark area. Every text/background pair is checked for WCAG AA (4.5:1, large text 3:1).
   Type: Anek Latin (headings) / Atkinson Hyperlegible Next (text) / Martian Mono (readouts). All served from this site.
   Mobile first. Logical properties throughout so right-to-left languages mirror correctly. No gradients, no glass, no emoji.
   ========================================================================== */
@font-face{font-family:"Anek Latin";src:url("../fonts/anek-latin.woff2") format("woff2");font-weight:100 800;font-stretch:75% 125%;font-style:normal;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Anek Latin";src:url("../fonts/anek-rupee.woff2") format("woff2");font-weight:100 800;font-stretch:75% 125%;font-style:normal;font-display:swap;unicode-range:U+20B9}
@font-face{font-family:"Atkinson Hyperlegible Next";src:url("../fonts/atkinson-next.woff2") format("woff2");font-weight:200 800;font-style:normal;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Atkinson Hyperlegible Next";src:url("../fonts/atkinson-next-italic.woff2") format("woff2");font-weight:200 800;font-style:italic;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Atkinson Hyperlegible Next";src:url("../fonts/atkinson-rupee.woff2") format("woff2");font-weight:200 800;font-style:normal;font-display:swap;unicode-range:U+20B9}
@font-face{font-family:"Martian Mono";src:url("../fonts/martian-mono.woff2") format("woff2");font-weight:100 800;font-stretch:75% 112.5%;font-style:normal;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* Script fallbacks for the language menu and translated labels (subsets, loaded only when a page uses the script). */
@font-face{font-family:NotoS;src:url(../fonts/noto-devanagari.woff2) format("woff2");unicode-range:U+0900-097F,U+A8E0-A8FF}
@font-face{font-family:NotoS;src:url(../fonts/noto-telugu.woff2) format("woff2");unicode-range:U+0C00-0C7F}
@font-face{font-family:NotoS;src:url(../fonts/noto-tamil.woff2) format("woff2");unicode-range:U+0B80-0BFF}
@font-face{font-family:NotoS;src:url(../fonts/noto-kannada.woff2) format("woff2");unicode-range:U+0C80-0CFF}
@font-face{font-family:NotoS;src:url(../fonts/noto-malayalam.woff2) format("woff2");unicode-range:U+0D00-0D7F}
@font-face{font-family:NotoS;src:url(../fonts/noto-bengali.woff2) format("woff2");unicode-range:U+0980-09FF}
@font-face{font-family:NotoS;src:url(../fonts/noto-gujarati.woff2) format("woff2");unicode-range:U+0A80-0AFF}
@font-face{font-family:NotoS;src:url(../fonts/noto-gurmukhi.woff2) format("woff2");unicode-range:U+0A00-0A7F}
@font-face{font-family:NotoS;src:url(../fonts/noto-oriya.woff2) format("woff2");unicode-range:U+0B00-0B7F}
@font-face{font-family:NotoS;src:url(../fonts/noto-sinhala.woff2) format("woff2");unicode-range:U+0D80-0DFF}
@font-face{font-family:NotoS;src:url(../fonts/noto-thai.woff2) format("woff2");unicode-range:U+0E00-0E7F}
@font-face{font-family:NotoS;src:url(../fonts/noto-ethiopic.woff2) format("woff2");unicode-range:U+1200-139F}
@font-face{font-family:NotoS;src:url(../fonts/noto-hebrew.woff2) format("woff2");unicode-range:U+0590-05FF}
@font-face{font-family:NotoS;src:url(../fonts/noto-arabic.woff2) format("woff2");unicode-range:U+0600-06FF,U+0750-077F,U+FB50-FDFF,U+FE70-FEFF}
@font-face{font-family:NotoU;src:url(../fonts/noto-urdu.woff2) format("woff2");unicode-range:U+0600-06FF,U+0750-077F,U+FB50-FDFF,U+FE70-FEFF}

:root{
  /* surfaces */
  --bg:#F3EEFF;          /* page: light violet */
  --band:#E9E1FF;        /* alternate section band */
  --card:#FFFFFF;        /* cards */
  --card-2:#FAF8FF;      /* very light violet: table heads, inset boxes */
  /* text */
  --ink:#1E1B3A;         /* deep ink */
  --ink-2:#4B4670;       /* secondary text */
  /* lines */
  --line:#D3C8F3;        /* decorative borders */
  --line-2:#7A6CB0;      /* borders of controls (3:1 or more against the surfaces they sit on) */
  /* action colour */
  --accent:#5B3FD0;      /* the one stronger violet */
  --accent-2:#4A30B5;    /* hover / pressed */
  --accent-soft:#E4DCFF; /* selected, tinted fills */
  --on-accent:#FFFFFF;
  --focus:#1E1B3A;
  /* state colours (text) and their tinted fills */
  --ok:#166534;   --ok-bg:#DDF5E5;
  --warn:#8A4A00; --warn-bg:#FFEFD0;
  --bad:#B01E1E;  --bad-bg:#FDE2E2;
  --info:#1E40AF; --info-bg:#E1E9FF;
  /* footer: the dark area */
  --card-hover:#EEE8FF;  /* a card turns this colour when the reader arrives at it */
  --edge:#BFB1EA;        /* the firm lower edge of a raised card */
  --foot-bg:#1E1B3A; --foot-ink:#F1EEFF; --foot-ink-2:#C9C2EE; --foot-line:#413C70;
  --wa:#157A3E;
  --vane:#EE5A22;        /* brand windsock orange: decoration only, never used for text */
  --f:"Atkinson Hyperlegible Next",NotoS,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --fd:"Anek Latin","Atkinson Hyperlegible Next",NotoS,system-ui,sans-serif;
  --fm:"Martian Mono",ui-monospace,Menlo,Consolas,monospace;
  --gut:16px; --r:14px; --tap:44px;
}
@media (min-width:40rem){:root{--gut:28px}}
@media (min-width:64rem){:root{--gut:40px}}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:400 1.0625rem/1.6 var(--f);min-height:100vh;display:flex;flex-direction:column;overflow-wrap:break-word}
html[lang="ur"] body{font-family:"Atkinson Hyperlegible Next",NotoU,NotoS,system-ui,sans-serif}
main{flex:1 0 auto;display:block}
img,svg{max-width:100%}
a{color:var(--accent);text-decoration-thickness:.08em;text-underline-offset:.18em}
a:hover{color:var(--accent-2)}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px;border-radius:4px}
[hidden]{display:none!important}
h1,h2,h3,h4{font-family:var(--fd);font-weight:700;line-height:1.18;margin:0 0 .5em;letter-spacing:-.005em;color:var(--ink)}
h1{font-size:clamp(1.75rem,1.25rem + 2.2vw,2.75rem)}
h2{font-size:clamp(1.4rem,1.1rem + 1.1vw,1.9rem)}
h3{font-size:1.2rem}
h4{font-size:1rem}
p{margin:0 0 1em}
ul,ol{margin:0 0 1em;padding-inline-start:1.3em}
small{font-size:.875rem}
hr{border:0;border-top:1px solid var(--line);margin:1.5em 0}
code,.mono,kbd{font-family:var(--fm);font-size:.875em}
code{background:var(--card-2);border:1px solid var(--line);border-radius:6px;padding:.05em .35em;overflow-wrap:anywhere}
.sr{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;inset-inline-start:8px;inset-block-start:-100px;background:var(--ink);color:#fff;padding:12px 16px;border-radius:8px;z-index:100;text-decoration:none}
.skip:focus{inset-block-start:8px}
.mut{color:var(--ink-2)}
.num{font-family:var(--fm);font-variant-numeric:tabular-nums}
.nowrap{white-space:nowrap}
.ic{width:1.15em;height:1.15em;flex:none;vertical-align:-.2em;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* ---- layout ---- */
.wrap{width:100%;max-width:72rem;margin-inline:auto;padding-inline:var(--gut)}
.wrap.narrow{max-width:46rem}
.wrap.wide{max-width:90rem}
.section{padding-block:clamp(2rem,5vw,4rem)}
.band{background:var(--band)}
.stack>*+*{margin-block-start:1rem}
.row{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}
.grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr))}
.grid2{display:grid;gap:1rem;grid-template-columns:1fr}
.grid3{display:grid;gap:1rem;grid-template-columns:1fr}
.grid4{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,13rem),1fr))}
@media (min-width:48rem){.grid2{grid-template-columns:1fr 1fr}.grid3{grid-template-columns:repeat(3,1fr)}}
.grid>*,.grid2>*,.grid3>*,.grid4>*,.split>*{min-width:0}
.split{display:grid;gap:2rem;grid-template-columns:1fr;align-items:start}
@media (min-width:60rem){.split{grid-template-columns:1.15fr .85fr}}

/* ---- header ---- */
.top{background:var(--card);border-block-end:1px solid var(--line)}
.top .wrap{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"brand menu" "panel panel";align-items:center;column-gap:1rem}
.brand{grid-area:brand;justify-self:start;min-width:0;max-width:100%;flex-wrap:wrap;display:inline-flex;align-items:center;gap:0 .6rem;min-height:var(--tap);padding-block:6px;color:var(--ink);text-decoration:none;font-family:var(--fd);font-weight:700;font-size:1.2rem}
.brand img{height:26px;width:auto;display:block}
.brand>span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.brand .pw{font-family:var(--f);font-weight:400;font-size:.8125rem;color:var(--ink-2)}
.menu{grid-area:menu;min-height:var(--tap);min-width:var(--tap);padding:0 16px;border:2px solid var(--line-2);border-radius:10px;background:var(--card);color:var(--ink);font:600 1rem var(--f);cursor:pointer;display:inline-flex;align-items:center;gap:.5rem;text-decoration:none}
.menu:hover{background:var(--accent-soft);color:var(--ink)}
#panel{grid-area:panel;display:none;padding-block-end:12px}
#panel:target,body.navopen #panel{display:block}
#panel nav{display:flex;flex-direction:column;gap:2px;margin-block-end:10px}
#panel nav a{display:flex;align-items:center;min-height:var(--tap);padding:0 12px;border-radius:10px;color:var(--ink);text-decoration:none;font-weight:600}
#panel nav a:hover{background:var(--accent-soft)}
#panel nav a.on{background:var(--accent-soft);box-shadow:inset 3px 0 0 var(--accent)}
[dir=rtl] #panel nav a.on{box-shadow:inset -3px 0 0 var(--accent)}
.acct{display:flex;flex-wrap:wrap;gap:.5rem .75rem;align-items:center;padding-block-start:10px;border-block-start:1px solid var(--line)}
.who{font-size:.9375rem;color:var(--ink-2)}
.who em{font-style:normal;text-transform:capitalize}
.langf select{min-width:9rem;max-width:100%}
@media (min-width:64rem){
  .top .wrap{grid-template-columns:auto 1fr;grid-template-areas:"brand acct" "nav nav"}
  .menu{display:none}
  #panel{display:contents}
  #panel nav{grid-area:nav;flex-direction:row;flex-wrap:wrap;gap:2px 4px;margin:0;padding-block-end:8px}
  #panel nav a{padding:0 14px;font-size:.9375rem}
  .acct{grid-area:acct;justify-self:end;border:0;padding:0;flex-wrap:nowrap}
}

/* ---- messages ---- */
.mtnote{background:var(--info-bg);color:var(--ink);border-block-end:1px solid var(--line);padding:10px var(--gut);font-size:.9375rem;text-align:center}
.mtnote p{margin:0}.mtnote p+p{margin-block-start:.15rem}
.flash{margin:12px 0 0;padding:12px 16px;border-radius:10px;border:1px solid var(--line-2);background:var(--card);font-weight:600;display:flex;gap:.6rem;align-items:flex-start}
.flash .ic{margin-block-start:.2em}
.flash.ok{background:var(--ok-bg);border-color:var(--ok);color:var(--ink)}
.flash.err{background:var(--bad-bg);border-color:var(--bad);color:var(--ink)}
.notice{display:flex;gap:.7rem;align-items:flex-start;background:var(--card);border:1px solid var(--line-2);border-inline-start:6px solid var(--accent);border-radius:10px;padding:12px 14px;margin-block:1rem}
.notice>div{min-width:0}
.notice p:last-child{margin:0}
.notice.warn{border-inline-start-color:var(--warn);background:var(--warn-bg)}
.notice.bad{border-inline-start-color:var(--bad);background:var(--bad-bg)}
.notice.ok{border-inline-start-color:var(--ok);background:var(--ok-bg)}
.notice .ic{margin-block-start:.2em;color:var(--accent)}
.notice.warn .ic{color:var(--warn)}.notice.bad .ic{color:var(--bad)}.notice.ok .ic{color:var(--ok)}

/* ---- page head, cards, stats ---- */
.phead{display:flex;flex-wrap:wrap;gap:1rem;align-items:flex-end;justify-content:space-between;padding-block:clamp(1.25rem,3vw,2rem) 1rem}
.phead h1{margin:0 0 .25em;font-size:clamp(1.6rem,1.2rem + 1.6vw,2.25rem)}
.phead p{margin:0;max-width:60ch}
.pact{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:1rem 1.1rem;box-shadow:0 1px 2px rgba(30,27,58,.06);min-width:0}
.card>h3:first-child,.card>h2:first-child{margin-block-end:.6em}
.card>:last-child,.panel>:last-child,.plan>:last-child{margin-block-end:0}
.card>.tblw{border:0;border-radius:0;background:transparent;margin-inline:-1.1rem}
.card.soft{background:var(--card-2)}
.card.fill{display:flex;flex-direction:column;align-items:flex-start}
.card.fill>h3{margin:0 0 .5rem}
.card.fill>p{margin:0 0 1rem}
.card.fill>.btn{margin-block-start:auto}
.card.edge{border-inline-start:6px solid var(--accent)}
.stat{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:.9rem 1rem;display:flex;flex-direction:column;gap:.15rem;min-width:0}
.stat .sl{font-size:.875rem;color:var(--ink-2);font-weight:600}
.stat b{font-family:var(--fm);font-size:1.6rem;font-weight:600;line-height:1.2;overflow-wrap:anywhere}
.stat small{color:var(--ink-2)}
.stat.hot{border-color:var(--accent);box-shadow:inset 0 3px 0 var(--accent)}

/* ---- buttons and forms ---- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:var(--tap);padding:.55rem 1.2rem;border-radius:10px;border:2px solid var(--accent);background:var(--accent);color:var(--on-accent);font:600 1rem/1.2 var(--f);text-decoration:none;cursor:pointer;text-align:center;touch-action:manipulation}
.btn:hover{background:var(--accent-2);border-color:var(--accent-2);color:var(--on-accent)}
.btn.sm{padding:.4rem .9rem;font-size:.9375rem}
.btn.block{display:flex;width:100%}
.btn.ghost{background:transparent;color:var(--accent);border-color:var(--accent)}
.btn.ghost:hover{background:var(--accent-soft);color:var(--accent-2);border-color:var(--accent-2)}
.btn.ok{background:var(--ok);border-color:var(--ok);color:#fff}
.btn.ok:hover{background:#0f4d27;border-color:#0f4d27;color:#fff}
.btn.bad{background:var(--bad);border-color:var(--bad);color:#fff}
.btn.bad:hover{background:#8f1717;border-color:#8f1717;color:#fff}
.btn[disabled],.btn[aria-disabled=true]{opacity:.55;cursor:not-allowed}
.inl{display:inline-flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin:0}
label{display:block;font-weight:600;margin-block-end:.3rem}
input,select,textarea{width:100%;min-height:var(--tap);padding:.6rem .8rem;border:2px solid var(--line-2);border-radius:10px;background:#fff;color:var(--ink);font:400 1rem/1.4 var(--f)}
input[type=checkbox],input[type=radio]{width:1.3rem;height:1.3rem;min-height:0;padding:0;accent-color:var(--accent);flex:none;margin:0}
textarea{min-height:7rem;resize:vertical}
input:focus,select:focus,textarea:focus{outline:3px solid var(--focus);outline-offset:1px;border-color:var(--accent)}
::placeholder{color:#5F5A85;opacity:1}
fieldset{border:0;margin:0 0 1rem;padding:0;min-inline-size:0}
legend{padding:0;font-weight:600;margin-block-end:.4rem}
.field{margin-block-end:1rem}
.field>small,.hint{display:block;color:var(--ink-2);margin-block-start:.3rem;font-size:.875rem;font-weight:400}
.form-grid{display:grid;gap:0 1rem;grid-template-columns:1fr}
@media (min-width:44rem){.form-grid{grid-template-columns:1fr 1fr}.form-grid .full{grid-column:1/-1}}
.choice{display:grid;gap:.5rem;grid-template-columns:repeat(auto-fill,minmax(min(100%,15rem),1fr));margin-block-end:1rem}
.choice label{display:flex;gap:.7rem;align-items:flex-start;min-height:var(--tap);padding:.6rem .8rem;border:2px solid var(--line);border-radius:10px;background:var(--card);font-weight:400;margin:0;cursor:pointer}
.choice label:hover{border-color:var(--line-2)}
.choice label:has(input:checked){border-color:var(--accent);background:var(--accent-soft)}
.choice label:has(input:disabled){opacity:.6;cursor:not-allowed}
.choice b{display:block;font-weight:700}
.choice small{display:block;font-size:.875rem}
.acts{display:flex;flex-wrap:wrap;gap:.6rem;margin-block-start:.9rem;align-items:center}
form.card>*+*,form.stack>*+*{margin-block-start:1rem}
.tabs{display:flex;flex-wrap:wrap;gap:.4rem;margin-block-end:1rem}
.tabs a{display:inline-flex;align-items:center;min-height:var(--tap);padding:0 14px;border:2px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink);text-decoration:none;font-weight:600}
.tabs a:hover{border-color:var(--line-2)}
.tabs a.on{background:var(--accent);border-color:var(--accent);color:#fff}
.pager{display:flex;flex-wrap:wrap;gap:.4rem;margin-block:1rem}
.pager a,.pager span{display:inline-flex;align-items:center;justify-content:center;min-width:var(--tap);min-height:var(--tap);padding:0 10px;border:2px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink);text-decoration:none;font-weight:600}
.pager span{background:var(--accent);border-color:var(--accent);color:#fff}

/* ---- right-to-left pages still hold English text: each text block takes its direction from its own first letter, so an English sentence keeps its punctuation and its alignment ---- */
[dir=rtl] :is(p,h1,h2,h3,h4,li,dd,dt,th,td,summary,figcaption,blockquote,.cv,.body,.stat b,.kpi b,.price,.chip,.badge){unicode-bidi:plaintext}

/* ---- tables (stack as cards on narrow screens) ---- */
.tblw{background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow-x:auto;container:tblw/inline-size}
.tbl{width:100%;border-collapse:collapse;font-size:.9375rem}
.tbl thead{display:none}
.tbl tr{display:block;padding:.7rem 1rem;border-block-end:1px solid var(--line)}
.tbl tr:last-child{border-block-end:0}
.tbl td{display:flex;gap:.8rem;justify-content:space-between;align-items:baseline;padding:.2rem 0;text-align:end;overflow-wrap:anywhere}
.tbl td::before{content:attr(data-label);font-weight:700;color:var(--ink-2);text-align:start;flex:none;max-width:45%}
.tbl td:not([data-label])::before{content:none}
.tbl td.mut{text-align:start}
.tbl td>.cv{min-width:0}
/* a long text: the column name above it, the text under it, left aligned */
.tbl td.long{flex-direction:column;align-items:stretch;gap:.1rem;text-align:start;padding-block:.35rem}
.tbl td.long::before{max-width:none}
/* a cell with no column name holds buttons or links: they sit side by side from the start and wrap */
.tbl td:not([data-label]){display:block;text-align:start}
.tbl td:not([data-label])>.cv{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
/* a table turns into a real table when its own box is wide enough (34rem; 44rem with five columns, 64rem with six or more, so no column is squeezed); narrower it stacks as cards */
@container tblw (min-width:34rem){
  .tbl:not(.mid):not(.wide) thead{display:table-header-group}
  .tbl:not(.mid):not(.wide) tr{display:table-row;padding:0}
  .tbl:not(.mid):not(.wide) th,.tbl:not(.mid):not(.wide) td{display:table-cell;padding:.7rem 1rem;text-align:start;border-block-end:1px solid var(--line);vertical-align:top;overflow-wrap:break-word}
  .tbl:not(.mid):not(.wide) td::before{content:none}
  .tbl:not(.mid):not(.wide) td.nw{white-space:nowrap}
  .tbl:not(.mid):not(.wide) th{background:var(--card-2);font-size:.875rem;color:var(--ink);font-weight:700;white-space:nowrap}
  .tbl:not(.mid):not(.wide) tr:last-child td{border-block-end:0}
}
@container tblw (min-width:44rem){
  .tbl.mid thead{display:table-header-group}
  .tbl.mid tr{display:table-row;padding:0}
  .tbl.mid th,.tbl.mid td{display:table-cell;padding:.7rem 1rem;text-align:start;border-block-end:1px solid var(--line);vertical-align:top;overflow-wrap:break-word}
  .tbl.mid td::before{content:none}
  .tbl.mid td.nw{white-space:nowrap}
  .tbl.mid th{background:var(--card-2);font-size:.875rem;color:var(--ink);font-weight:700;white-space:nowrap}
  .tbl.mid tr:last-child td{border-block-end:0}
}
@container tblw (min-width:64rem){
  .tbl.wide thead{display:table-header-group}
  .tbl.wide tr{display:table-row;padding:0}
  .tbl.wide th,.tbl.wide td{display:table-cell;padding:.7rem .6rem;text-align:start;border-block-end:1px solid var(--line);vertical-align:top;overflow-wrap:break-word}
  .tbl.wide td::before{content:none}
  .tbl.wide th{background:var(--card-2);font-size:.875rem;color:var(--ink);font-weight:700}
  .tbl.wide tr:last-child td{border-block-end:0}
}
.tbl .btn,.tbl td .badge{white-space:nowrap}
.tbl .cv>a,.tbl .cv>details>summary,.tbl .cv>form>button{display:inline-flex;align-items:center;min-height:var(--tap);min-width:var(--tap)}
.tbl .cv>details>summary{display:list-item;padding-block:.65rem;cursor:pointer}

/* ---- badges ---- */
.badge{display:inline-flex;align-items:center;gap:.3em;padding:.12rem .6rem;border-radius:999px;font-size:.8125rem;font-weight:700;line-height:1.5;background:var(--accent-soft);color:var(--ink);border:1px solid var(--line-2);white-space:nowrap}
.badge.ok{background:var(--ok-bg);color:var(--ok);border-color:var(--ok)}
.badge.warn{background:var(--warn-bg);color:var(--warn);border-color:var(--warn)}
.badge.bad{background:var(--bad-bg);color:var(--bad);border-color:var(--bad)}
.badge.info{background:var(--info-bg);color:var(--info);border-color:var(--info)}
.badge.mute{background:var(--card);color:var(--ink-2);border-color:var(--line-2)}
.lock{display:inline-flex;align-items:center;gap:.3em;white-space:nowrap;font-size:.8125rem;font-weight:700;padding:.1rem .55rem;border-radius:6px;background:var(--ink);color:#fff}

/* ---- hero, steps, plans ---- */
.hero{padding-block:clamp(2.5rem,7vw,5.5rem)}
.hero h1{font-size:clamp(2rem,1.2rem + 3.6vw,3.6rem);max-width:20ch}
.hero h1 em{font-style:normal;color:var(--accent)}
.hero-art{display:none}
@media (min-width:64rem){
  .hero.has-art{display:grid;grid-template-columns:minmax(0,1fr) 19rem;column-gap:4rem;align-items:start}
  .hero.has-art>*{grid-column:1}
  .hero.has-art>.hero-art{display:block;grid-column:2;grid-row:1/span 4;align-self:center}
}
.hero-art svg{display:block;width:100%;height:auto}
.hero-art .a-ring{fill:var(--card);stroke:var(--line);stroke-width:2}
.hero-art .a-face{fill:var(--accent-soft)}
.hero-art .a-ticks line{stroke:var(--line-2);stroke-width:3;stroke-linecap:round}
.hero-art .a-arc{fill:none;stroke:var(--accent);stroke-width:10;stroke-linecap:round}
.hero-art .a-needle{fill:var(--ink)}
.hero-art .a-needle-tip{fill:var(--accent)}
.hero-art .a-hub{fill:var(--card);stroke:var(--ink);stroke-width:4}
.hero-art .a-dot{fill:var(--vane)}
.eyebrow{display:inline-block;font-family:var(--fm);font-size:.8125rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--accent-2);margin-block-end:.8rem}
.lede{font-size:clamp(1.0625rem,1rem + .4vw,1.25rem);max-width:56ch;color:var(--ink-2)}
.cta{display:flex;flex-wrap:wrap;gap:.7rem;margin-block-start:1.4rem}
.points{list-style:none;padding:0;margin:0 0 1em}
.points li{display:flex;gap:.6rem;align-items:flex-start;padding-block:.3rem}
.points .ic{color:var(--ok);margin-block-start:.25em}
.points .ic.no{color:var(--ink-2)}
.stepcards{display:grid;gap:1rem;grid-template-columns:1fr;counter-reset:s}
@media (min-width:40rem){.stepcards{grid-template-columns:repeat(2,1fr)}}
@media (min-width:64rem){.stepcards{grid-template-columns:repeat(4,1fr)}}
.stepcards>div{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:1rem 1.1rem;counter-increment:s}
.stepcards>div>:last-child{margin-block-end:0}
.stepcards>div::before{content:counter(s);display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;border-radius:50%;background:var(--accent);color:#fff;font-family:var(--fm);font-weight:700;margin-block-end:.6rem}
.steps{display:flex;flex-wrap:wrap;gap:.4rem;margin-block-end:1rem;padding:0;list-style:none}
.steps li,.steps span{display:inline-flex;align-items:center;min-height:36px;padding:0 12px;border-radius:999px;border:2px solid var(--line);background:var(--card);font-size:.9375rem;font-weight:600;color:var(--ink-2)}
.steps .on{border-color:var(--accent);background:var(--accent-soft);color:var(--ink)}
.steps .done{border-color:var(--ok);color:var(--ok);background:var(--ok-bg)}
.plans{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr))}
.plan{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:1.1rem;display:flex;flex-direction:column;gap:.5rem}
.plan.pick{border:2px solid var(--accent)}
.price{font-family:var(--fm);font-size:1.7rem;font-weight:600}
.price small{font-family:var(--f);font-weight:400;color:var(--ink-2)}
.price.txt{font-family:var(--f);font-size:1.35rem;font-weight:700}
.plan ul{list-style:none;padding:0;margin:.4rem 0 .8rem}
.plan>.btn{margin-block-start:auto}
.plan li{display:flex;gap:.5rem;padding-block:.2rem}
.plan li .ic{color:var(--ok);margin-block-start:.3em}
.faq details{background:var(--card);border:1px solid var(--line);border-radius:var(--r);margin-block-end:.6rem;padding:0 1rem}
.faq summary,.fold>summary{cursor:pointer;min-height:var(--tap);display:flex;align-items:center;font-weight:700;list-style:none}
.faq summary::-webkit-details-marker,.fold>summary::-webkit-details-marker{display:none}
.faq details[open] summary{border-block-end:1px solid var(--line);margin-block-end:.7rem}
.faq details>*:not(summary){margin-block-end:1rem}

/* ---- status vocabulary (shape + text + colour; never colour alone) ---- */
.s-running{--c:#166534;--cb:#DDF5E5}
.s-queued{--c:#1E40AF;--cb:#E1E9FF}
.s-waiting{--c:#8A4A00;--cb:#FFEFD0}
.s-needs_input{--c:#5B3FD0;--cb:#E4DCFF}
.s-error{--c:#B01E1E;--cb:#FDE2E2}
.s-paused{--c:#4B4670;--cb:#EAE6F7}
.s-recent{--c:#166534;--cb:#F0FAF3}
.s-ready{--c:#4B4670;--cb:#FFFFFF}
.s-builtin{--c:#4A30B5;--cb:#F3EEFF}
.s-planned{--c:#4B4670;--cb:#FAF8FF}
.chip{display:inline-flex;align-items:center;gap:.45rem;min-height:36px;padding:.2rem .7rem;border-radius:999px;border:1.5px solid var(--c,var(--line-2));background:var(--cb,var(--card));color:var(--ink);font-size:.9375rem;font-weight:600}
.chip .ic{color:var(--c)}
.chip b{font-family:var(--fm);font-weight:700}
.s-planned.chip{border-style:dashed}

/* ---- mission control ---- */
.wallbar{display:flex;gap:.8rem;align-items:flex-start;background:var(--card);border:1px solid var(--line-2);border-inline-start:6px solid var(--ok);border-radius:var(--r);padding:.9rem 1.1rem;margin-block-end:1rem}
.wallbar.warn{border-inline-start-color:var(--warn);background:var(--warn-bg)}
.wallbar.bad{border-inline-start-color:var(--bad);background:var(--bad-bg)}
.wallbar p{margin:0}
.wallbar .ic{margin-block-start:.2em;color:var(--ok)}
.wallbar.warn .ic{color:var(--warn)}.wallbar.bad .ic{color:var(--bad)}
.counts{display:flex;flex-wrap:wrap;gap:.5rem;margin-block-end:1rem}
.wall-cols{display:grid;gap:1rem;grid-template-columns:1fr}
@media (min-width:64rem){.wall-cols{grid-template-columns:repeat(3,1fr)}.wall-cols .span2{grid-column:span 2}}
.panel{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:1rem 1.1rem;min-width:0}
.panel h3{display:flex;justify-content:space-between;gap:.6rem;align-items:baseline;flex-wrap:wrap;font-size:1.05rem}
.panel h3 span{font-family:var(--f);font-size:.875rem;font-weight:400;color:var(--ink-2)}
.panel.need{border-color:var(--accent);box-shadow:inset 0 3px 0 var(--accent)}
.feed{list-style:none;margin:0;padding:0;max-height:22rem;overflow:auto}
.feed li{display:flex;flex-wrap:wrap;gap:.15rem .7rem;padding:.5rem 0;border-block-end:1px solid var(--line);align-items:baseline;font-size:.9375rem}
.feed li>span:last-child{flex:1 1 14rem;min-width:0;overflow-wrap:anywhere}
.feed:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.feed li:last-child{border:0}
.feed .t{font-family:var(--fm);font-size:.8125rem;color:var(--ink-2);flex:none}
.feed .a{font-family:var(--fm);font-size:.8125rem;font-weight:600;flex:0 0 9rem;max-width:9rem;overflow-wrap:anywhere}
.kpis{display:grid;gap:.6rem;grid-template-columns:repeat(auto-fit,minmax(7rem,1fr))}
.kpi{background:var(--card-2);border:1px solid var(--line);border-radius:10px;padding:.5rem .7rem;display:flex;flex-direction:column}
.kpi span{font-size:.8125rem;color:var(--ink-2);font-weight:600}
.kpi b{font-family:var(--fm);font-size:1.3rem}
.legend{display:flex;flex-wrap:wrap;gap:.4rem .9rem;margin:0 0 .8rem;padding:0;list-style:none;font-size:.875rem}
.legend li{display:inline-flex;gap:.35rem;align-items:center}
.legend .ic{color:var(--c)}
.depts{display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(min(100%,21rem),1fr))}
.dept{background:var(--card);border:1px solid var(--line);border-inline-start:6px solid var(--dc,var(--accent));border-radius:var(--r);padding:0 1rem;min-width:0}
.dept>summary{list-style:none;cursor:pointer;min-height:var(--tap);padding:.7rem 0}
.dept>summary::-webkit-details-marker{display:none}
.dept .dn{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.1rem .8rem;align-items:baseline;font-family:var(--fd);font-weight:700;font-size:1.05rem}
.dept .dn em{font-family:var(--f);font-style:normal;font-weight:400;font-size:.875rem;color:var(--ink-2);white-space:nowrap}
.dept .sub{display:block;font-size:.875rem;color:var(--ink-2);margin-block-start:.2rem}
.bar{display:block;height:10px;border-radius:999px;background:var(--accent-soft);border:1px solid var(--line-2);margin-block-start:.5rem;overflow:hidden}
.bar i{display:block;height:100%;background:var(--accent)}
.dept[open]>summary{border-block-end:1px solid var(--line)}
.agents{list-style:none;margin:.6rem 0 1rem;padding:0;display:grid;gap:.4rem}
.ag{display:flex;gap:.6rem;align-items:flex-start;padding:.45rem .6rem;border-radius:10px;border:1.5px solid var(--c,var(--line));background:var(--cb,var(--card));min-width:0}
.ag .ic{color:var(--c);margin-block-start:.2em}
.ag .nm{font-weight:700;font-size:.9375rem;line-height:1.3}
.ag .st{display:block;font-size:.8125rem;color:var(--ink-2)}
.ag.s-planned{border-style:dashed}
.ag .tx{min-width:0;overflow-wrap:anywhere}
.lanes{display:grid;gap:.5rem;grid-template-columns:repeat(auto-fit,minmax(8.5rem,1fr))}
.lane{background:var(--card-2);border:1px solid var(--line);border-radius:10px;padding:.5rem .7rem}
.lane b{display:block;font-family:var(--fm);font-size:1.4rem}
.lane span{font-size:.8125rem;color:var(--ink-2)}
.liveline{display:flex;flex-wrap:wrap;gap:.5rem 1rem;align-items:center;font-size:.875rem;color:var(--ink-2);margin-block:.5rem 1rem}

/* ---- virtual office ---- */
.floor{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(min(100%,17rem),1fr));padding:14px;background:var(--band);border:2px solid var(--line-2);border-radius:var(--r)}
.room{background:var(--card);border:2px solid var(--line-2);border-block-start:8px solid var(--dc,var(--accent));border-radius:10px;padding:0 .9rem;min-width:0}
.room>summary{list-style:none;cursor:pointer;min-height:var(--tap);padding:.6rem 0}
.room>summary::-webkit-details-marker{display:none}
.room h3{font-size:1rem;margin:0}
.room .sub{display:block;font-size:.8125rem;color:var(--ink-2)}
.desks{display:flex;flex-wrap:wrap;gap:6px;margin-block-start:.5rem}
.desk{display:inline-flex;width:26px;height:26px;align-items:center;justify-content:center;border-radius:6px;background:var(--cb,#fff);border:1.5px solid var(--c,var(--line-2));color:var(--c)}
.desk .ic{width:15px;height:15px}
.room[open]>summary{border-block-end:1px solid var(--line)}

/* ---- approval cards, items ---- */
.item{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:1rem 1.1rem;margin-block-end:.9rem}
.item .meta{display:flex;flex-wrap:wrap;gap:.4rem .6rem;align-items:center;font-size:.9375rem}
.item .body{white-space:pre-wrap;background:var(--card-2);border:1px solid var(--line);border-radius:10px;padding:.7rem .9rem;margin-block:.6rem}
.qa{font-family:var(--fm);font-weight:700;font-size:.8125rem;padding:.1rem .5rem;border-radius:6px;background:var(--ok-bg);color:var(--ok);border:1px solid var(--ok)}
.qa.low{background:var(--warn-bg);color:var(--warn);border-color:var(--warn)}
.pillrow{display:flex;flex-wrap:wrap;gap:.4rem}
.pillrow a{display:inline-flex;align-items:center;min-height:var(--tap);padding:0 14px;border:2px solid var(--line);border-radius:999px;background:var(--card);color:var(--ink);text-decoration:none;font-weight:600;font-size:.9375rem}
.pillrow a:hover{border-color:var(--line-2);background:var(--accent-soft)}

/* ---- footer (the dark area) ---- */
.foot{background:var(--foot-bg);color:var(--foot-ink);margin-block-start:3rem;padding-block:2.5rem 5.5rem}
.foot a{color:var(--foot-ink)}
.foot a:hover{color:#fff}
.foot :focus-visible{outline-color:#fff}
.foot img{height:26px;width:auto;display:block;margin-block-end:.8rem}
.foot h4{color:var(--foot-ink);font-size:.9375rem;letter-spacing:.02em;margin-block-end:.4rem}
.foot p{color:var(--foot-ink-2);margin-block-end:.6rem}
.fgrid{display:grid;gap:1.6rem;grid-template-columns:1fr}
@media (min-width:40rem){.fgrid{grid-template-columns:1fr 1fr}}
@media (min-width:64rem){.fgrid{grid-template-columns:1.6fr 1fr 1fr 1fr}}
.fgrid nav{display:flex;flex-direction:column}
.fgrid nav a{display:flex;align-items:center;min-height:var(--tap);text-decoration:none}
.fgrid nav a:hover{text-decoration:underline}
.foot address{font-style:normal;color:var(--foot-ink-2);line-height:1.7}
.foot address a{display:inline-flex;align-items:center;min-height:var(--tap)}
.legal{border-block-start:1px solid var(--foot-line);margin-block-start:2rem;padding-block-start:1.2rem;color:var(--foot-ink-2);font-size:.875rem}
.wa{position:fixed;inset-inline-end:16px;inset-block-end:16px;z-index:50;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-width:56px;min-height:56px;padding:0 16px;border-radius:999px;background:var(--wa);color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 8px rgba(30,27,58,.35)}
.wa:hover{background:#0F5E2F;color:#fff}
.wa .ic{width:24px;height:24px}
.wa span{display:none}
@media (min-width:40rem){.wa span{display:inline}}

/* ---- misc ---- */
.copybox{display:flex;flex-wrap:wrap;gap:.5rem;align-items:stretch}
.copybox input,.copybox textarea{flex:1 1 16rem;font-family:var(--fm);font-size:.8125rem}
.copybox textarea{min-height:0;resize:none;overflow-wrap:anywhere;word-break:break-all;field-sizing:content}
/* label above value on a phone; two columns (label 12 to 22rem wide, the value takes the rest) once there is room */
.kv{display:grid;grid-template-columns:minmax(0,1fr);gap:.1rem 1rem;margin:0}
.kv dt{font-weight:700;margin-block-start:.7rem}.kv dt:first-child{margin-block-start:0}
.kv dd{margin:0;overflow-wrap:anywhere}
@media (min-width:44rem){.kv{grid-template-columns:minmax(12rem,22rem) minmax(0,1fr);gap:.5rem 1.2rem}.kv dt{margin-block-start:0}}
.bigscore{font-family:var(--fm);font-size:3rem;font-weight:700;line-height:1}
.meter{height:12px;border-radius:999px;background:var(--accent-soft);border:1px solid var(--line-2);overflow:hidden}
.meter i{display:block;height:100%;background:var(--accent)}
.muted-box{background:var(--card-2);border:1px dashed var(--line-2);border-radius:var(--r);padding:1rem}
/* ---- raised (embossed) cards that change colour when the reader arrives at them ----
   A card sits on a firm lower edge and a soft shadow. The pointer over it, or keyboard focus inside it, tints it (--card-hover) and turns its edge violet.
   Tiles that carry a status colour (roles, chips, badges, banners) keep their own colour: a colour that means "working" or "needs you" never changes on hover. */
.card,.stat,.stepcards>div,.plan,.faq details,.panel,.item,.dept,.room,.tblw{box-shadow:0 2px 0 var(--edge),0 10px 16px -12px rgba(61,41,150,.55)}
.card>.tblw{box-shadow:none}
.stat.hot,.panel.need{box-shadow:inset 0 3px 0 var(--accent),0 2px 0 var(--edge),0 10px 16px -12px rgba(61,41,150,.55)}
@media (prefers-reduced-motion:no-preference){.card,.stat,.stepcards>div,.plan,.faq details,.panel,.item,.dept,.room{transition:background-color .15s ease,box-shadow .15s ease,border-color .15s ease}}
.card:hover,.stat:hover,.stepcards>div:hover,.plan:hover,.faq details:hover,.panel:hover,.item:hover,
.card:focus-within,.stat:focus-within,.stepcards>div:focus-within,.plan:focus-within,.faq details:focus-within,.panel:focus-within,.item:focus-within{background-color:var(--card-hover);border-color:var(--accent);box-shadow:0 3px 0 var(--accent),0 14px 20px -12px rgba(61,41,150,.6)}
.dept:hover,.room:hover,.dept:focus-within,.room:focus-within{background-color:var(--card-hover);box-shadow:0 3px 0 var(--accent),0 14px 20px -12px rgba(61,41,150,.6)}
.stat.hot:hover,.panel.need:hover,.stat.hot:focus-within,.panel.need:focus-within{box-shadow:inset 0 3px 0 var(--accent),0 3px 0 var(--accent),0 14px 20px -12px rgba(61,41,150,.6)}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media print{.top,.foot,.wa,.menu,.pact,.acts{display:none!important}body{background:#fff}.card,.panel,.stat,.plan,.item,.dept,.room,.tblw,.stepcards>div,.faq details{box-shadow:none}}
/* icons in headings, and the partner position grid (admin) */
.ic.accent{color:var(--accent)}
.map svg{display:block;width:100%;height:auto;max-width:56rem;margin-inline:auto;background:var(--card-2);border:1px solid var(--line);border-radius:.6rem}
.map .grid line{stroke:var(--line);stroke-width:1}
.map .pin circle{fill:var(--accent);stroke:var(--card);stroke-width:2}
.map .pin.master circle{fill:var(--ink)}
@media (max-width:40rem){.map .pin circle{r:13px}.map .pin.master circle{r:17px}}
.checks{list-style:none;margin:0 0 1rem;padding:0;display:grid;gap:.5rem}
.checks li{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.chk{display:inline-flex;align-items:center;gap:.5rem;min-height:44px;font-size:.9375rem}
.chk input{width:1.25rem;height:1.25rem;accent-color:var(--accent)}
.flashes{padding-block:.5rem 0}
.md{line-height:1.6;overflow-wrap:anywhere}
.more a,.tl,.stat small a,.item .meta>a,.foot .legal a,.foot p a{display:inline-flex;align-items:center;min-height:var(--tap);min-width:var(--tap)}
details>summary{padding-block:.65rem;cursor:pointer}