:root{
  --cream:#FBF7EE; --cream-deep:#F3EDDF; --card:#FFFDF8;
  --forest:#2E4A3B; --forest-soft:#3E5D4C;
  --sage:#8FAE97; --sage-tint:#E4EDE4; --sage-line:#DCE5DA;
  --ink:#2A342C; --ink-soft:#5C6A5E; --ink-faint:#8A968B;
  --sun:#E9C46A; --amber:#C9913F; --amber-tint:#F7ECD8;
  --lav:#B9A0C9;
  --shadow:0 1px 2px rgba(46,74,59,.04),0 8px 24px -14px rgba(46,74,59,.12);
  --shadow-lift:0 2px 4px rgba(46,74,59,.05),0 16px 40px -16px rgba(46,74,59,.20);
  --r:20px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
/* the document itself never scrolls sideways; only designated inner rows (e.g.
   .flow) may scroll internally. This is a structural guard, not a mask: the
   elements below are also made shrinkable so nothing needs to overflow. */
html,body{overflow-x:hidden;max-width:100%}
body{font-family:'Instrument Sans',system-ui,sans-serif;background:var(--cream);color:var(--ink);font-size:15.5px;line-height:1.55;min-height:100vh}
h1,h2,h3,.serif{font-family:'Fraunces',Georgia,serif;font-weight:500;letter-spacing:-.01em}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit;font-size:inherit}
a{color:var(--forest)}
:focus-visible{outline:2.5px solid var(--sage);outline-offset:2px;border-radius:6px}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}

#app{display:none;min-height:100vh}
#app.on{display:block}
.shell{max-width:1140px;margin:0 auto;padding:0 18px 96px}
@media(min-width:900px){.shell{display:grid;grid-template-columns:222px 1fr;gap:38px;padding:0 32px 60px}}

.side{display:none}
@media(min-width:900px){
  .side{display:flex;flex-direction:column;gap:4px;position:sticky;top:0;align-self:start;height:100vh;padding:30px 0}
  .brand{display:flex;align-items:center;gap:10px;margin:0 10px 18px}
}
.leaf{width:34px;height:34px;border-radius:11px;background:var(--forest);display:grid;place-items:center;flex:none}
.leaf svg{width:19px;height:19px}
.brand b{font-family:'Fraunces',serif;font-weight:600;font-size:20px}
.navbtn{display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:12px;color:var(--ink-soft);font-weight:500;font-size:14.5px;transition:background .15s,color .15s;text-align:left;width:100%}
.navbtn svg{width:19px;height:19px;flex:none}
.navbtn:hover{background:var(--cream-deep)}
.navbtn.on{background:var(--sage-tint);color:var(--forest)}
.side .spacer{flex:1}
.side .quiet{font-size:12px;color:var(--ink-faint);padding:12px 14px;line-height:1.5}

.searchbar{display:flex;align-items:center;gap:9px;background:var(--card);border:1.5px solid var(--sage-line);border-radius:13px;padding:9px 13px;color:var(--ink-faint);font-size:13.5px;margin:0 0 14px;width:100%;transition:.15s;text-align:left}
.searchbar:hover{border-color:var(--sage)}
.searchbar svg{width:16px;height:16px;flex:none}
.searchbar kbd{margin-left:auto;font-family:inherit;font-size:11px;background:var(--cream-deep);border-radius:6px;padding:2px 6px;color:var(--ink-faint)}

.bnav{position:fixed;bottom:0;left:0;right:0;background:rgba(251,247,238,.92);backdrop-filter:blur(12px);border-top:1px solid var(--sage-line);display:flex;justify-content:space-around;padding:8px 4px calc(8px + env(safe-area-inset-bottom));z-index:40}
.bnav button{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:10.5px;color:var(--ink-faint);padding:4px 8px;border-radius:10px;font-weight:500}
.bnav button svg{width:21px;height:21px}
.bnav button.on{color:var(--forest)}
@media(min-width:900px){.bnav{display:none}}

.mtop{display:flex;align-items:center;gap:10px;padding:18px 2px 4px}
.mtop b{font-family:'Fraunces',serif;font-weight:600;font-size:19px}
.mtop .leaf{width:30px;height:30px;border-radius:9px}
.iconbtn{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:var(--card);border:1.5px solid var(--sage-line);color:var(--ink-soft)}
.iconbtn svg{width:17px;height:17px}
@media(min-width:900px){.mtop{display:none}}

.screen{display:none;padding-top:14px;animation:rise .35s ease both}
.screen.on{display:block}
@keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(min-width:900px){.screen{padding-top:30px}}

.eyebrow{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--sage);font-weight:600;margin-bottom:6px}
.h-page{font-size:27px;margin-bottom:4px}
.sub{color:var(--ink-soft);font-size:14.5px}
@media(min-width:900px){.h-page{font-size:32px}}

.card{background:var(--card);border:1px solid var(--sage-line);border-radius:var(--r);padding:20px;box-shadow:var(--shadow)}
.card+.card{margin-top:14px}
.grid2{display:grid;gap:14px}
/* (v0.9.6) grid items default to min-width:auto and refuse to shrink below their
   content's min-content width, which pushed Meeting cards wider than a 320/360px
   column (clipped by overflow-x:hidden). Letting the tracks and cards shrink lets
   inner content (which already carries min-width:0 / overflow-wrap) reflow. No
   visual change at normal widths. */
.grid2>*{min-width:0}
.card{min-width:0}
@media(min-width:720px){.grid2{grid-template-columns:1fr 1fr}}
.grid3{display:grid;gap:14px}
@media(min-width:720px){.grid3{grid-template-columns:repeat(3,1fr)}}

.pill{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;padding:5px 12px;border-radius:999px}
.pill.good{background:var(--sage-tint);color:var(--forest)}
.pill.warm{background:var(--amber-tint);color:var(--amber)}
.pill.soft{background:var(--cream-deep);color:var(--ink-soft)}
.dot{width:7px;height:7px;border-radius:50%;background:currentColor;flex:none}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:600;font-size:14.5px;padding:12px 20px;border-radius:14px;transition:transform .12s,box-shadow .15s,background .15s}
.btn:active{transform:scale(.98)}
.btn-primary{background:var(--forest);color:#FDFBF5;box-shadow:0 6px 16px -6px rgba(46,74,59,.45)}
.btn-primary:hover{background:var(--forest-soft)}
.btn-ghost{background:var(--sage-tint);color:var(--forest)}
.btn-ghost:hover{background:#d9e6d9}
.btn-line{border:1.5px solid var(--sage-line);color:var(--forest);background:var(--card)}
.btn-line:hover{background:var(--cream-deep)}
.btn-sm{padding:8px 14px;font-size:13.5px;border-radius:11px}

.seg{display:inline-flex;background:var(--cream-deep);border-radius:999px;padding:4px;gap:2px;max-width:100%;overflow-x:auto;scrollbar-width:none}
.seg::-webkit-scrollbar{display:none}
.seg button{padding:7px 14px;border-radius:999px;font-size:13px;font-weight:600;color:var(--ink-soft);white-space:nowrap;transition:.15s}
.seg button.on{background:var(--card);color:var(--forest);box-shadow:var(--shadow)}
.seg button:disabled{opacity:.55;cursor:default}

.prog{height:7px;border-radius:99px;background:var(--cream-deep);overflow:hidden}
.prog i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--sage),var(--forest-soft))}
.rowline{display:flex;align-items:center;gap:12px;padding:13px 2px;border-bottom:1px solid var(--cream-deep)}
.rowline:last-child{border-bottom:none}

.hero{border-radius:26px;padding:26px 22px;background:
  radial-gradient(120% 160% at 85% -20%,rgba(233,196,106,.26),transparent 55%),
  radial-gradient(130% 170% at 0% 110%,rgba(143,174,151,.28),transparent 60%),
  var(--card);
  border:1px solid var(--sage-line);box-shadow:var(--shadow);margin-bottom:16px;position:relative;overflow:hidden}
@media(min-width:900px){.hero{padding:32px 34px}}
.hero h1{font-size:28px;margin:2px 0 4px}
@media(min-width:900px){.hero h1{font-size:34px}}
.hero .calm{font-size:16px;color:var(--forest);font-family:'Fraunces',serif;font-style:italic}
.health{display:flex;align-items:center;gap:14px;margin-top:18px;flex-wrap:wrap}
.breath{width:52px;height:52px;border-radius:50%;background:var(--sage-tint);display:grid;place-items:center;position:relative;flex:none}
.breath::after{content:"";position:absolute;inset:-7px;border-radius:50%;border:1.5px solid var(--sage);opacity:.5;animation:breathe 4.5s ease-in-out infinite}
@keyframes breathe{0%,100%{transform:scale(.92);opacity:.25}50%{transform:scale(1.06);opacity:.55}}
.breath svg{width:24px;height:24px}

.tasklist li{list-style:none;display:flex;gap:11px;align-items:flex-start;padding:10px 0;border-bottom:1px solid var(--cream-deep);font-size:14.5px}
.tasklist li:last-child{border-bottom:none}
.tick{width:20px;height:20px;border-radius:7px;border:1.7px solid var(--sage);flex:none;margin-top:1px;display:grid;place-items:center;color:transparent;transition:.15s;cursor:pointer}
.tick.done{background:var(--sage);color:#fff}
.tick.done+span{color:var(--ink-faint);text-decoration:line-through}

.money{font-family:'Fraunces',serif;font-weight:600;font-variant-numeric:tabular-nums}
.stat .money{font-size:24px}
.stat small{color:var(--ink-soft);font-size:12.5px;display:block;margin-top:2px}

.pcard{cursor:pointer;transition:transform .15s,box-shadow .18s}
.pcard:hover{transform:translateY(-3px);box-shadow:var(--shadow-lift)}
.ptop{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:8px}
.pemoji{font-size:26px;line-height:1}
.pmeta{display:flex;flex-wrap:wrap;gap:14px;margin:12px 0 4px;font-size:13px;color:var(--ink-soft)}
.pmeta b{color:var(--ink);font-weight:600}
.nextact{margin-top:12px;padding:10px 13px;border-radius:12px;background:var(--sage-tint);font-size:13.5px;color:var(--forest);display:flex;gap:8px;align-items:center}

.tabs{display:flex;gap:4px;overflow-x:auto;padding-bottom:2px;margin:16px 0 4px;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tab{padding:8px 15px;border-radius:999px;font-size:13.5px;font-weight:600;color:var(--ink-soft);white-space:nowrap;background:var(--cream-deep)}
.tab.on{background:var(--forest);color:#FDFBF5}
.tpane{display:none}.tpane.on{display:block;animation:rise .3s ease both}
.viewnote{font-size:12.5px;color:var(--ink-faint);margin:0 2px 12px}

/* Kanban */
.kb{display:grid;grid-template-columns:repeat(3,minmax(190px,1fr));gap:12px;overflow-x:auto;padding-bottom:6px}
@media(max-width:719px){.kb{grid-template-columns:repeat(3,72vw)}}
.kbcol{background:var(--cream-deep);border-radius:16px;padding:12px}
.kbcol h4{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);font-weight:600;margin:2px 4px 10px;display:flex;justify-content:space-between}
.kbcard{background:var(--card);border-radius:13px;padding:11px 13px;font-size:13.5px;box-shadow:var(--shadow);margin-bottom:9px;border:1px solid var(--sage-line)}
.kbcard small{display:block;color:var(--ink-faint);font-size:12px;margin-top:3px}

/* Timeline */
.tl{position:relative;padding-left:22px}
.tl::before{content:"";position:absolute;left:7px;top:6px;bottom:6px;width:2px;background:var(--sage-line);border-radius:2px}
.tl li{list-style:none;position:relative;padding:0 0 18px}
.tl li::before{content:"";position:absolute;left:-20px;top:5px;width:12px;height:12px;border-radius:50%;background:var(--sage);border:2.5px solid var(--card)}
.tl li.faded::before{background:var(--sage-line)}
.tl small{color:var(--ink-faint);font-size:12.5px}

/* Meeting flow */
.flow{display:flex;align-items:center;gap:6px;overflow-x:auto;padding:4px 2px 10px;scrollbar-width:none}
.flow::-webkit-scrollbar{display:none}
.fstep{display:flex;align-items:center;gap:7px;background:var(--card);border:1.5px solid var(--sage-line);border-radius:999px;padding:7px 13px;font-size:12.5px;font-weight:600;color:var(--ink-soft);white-space:nowrap;flex:none}
.fstep.done{background:var(--sage-tint);color:var(--forest);border-color:transparent}
.fstep.now{background:var(--forest);color:#FDFBF5;border-color:transparent}
.farrow{color:var(--sage);flex:none;font-size:13px}
.became{display:flex;align-items:center;gap:7px;margin-top:9px;font-size:12.5px;color:var(--forest);background:var(--sage-tint);border-radius:10px;padding:7px 11px;width:fit-content;max-width:100%;cursor:pointer;transition:.15s}
.became:hover{background:#d9e6d9}
.became-pending{cursor:default}
.became-pending:hover{background:var(--sage-tint)}
.dcard{border:1px solid var(--sage-line);border-radius:16px;padding:14px 15px;margin-top:11px;background:var(--card)}
.dcard b{font-size:14.5px}

.bar{display:flex;align-items:center;gap:12px;font-size:13.5px;padding:7px 0}
.bar .track{flex:1;height:9px;border-radius:99px;background:var(--cream-deep);overflow:hidden}
.bar .track i{display:block;height:100%;border-radius:99px;background:var(--sage)}
/* (v0.17.0 correction) 110px could not fit a single long Greek word, so the
   label broke mid-word ("Χριστουγεννιάτικ / ο Παζάρι"). Widened enough for a
   long compound word; the break rule below then wraps at the space instead. */
.bar .lab{width:152px;flex:none;color:var(--ink-soft)}
.bar .val{width:64px;text-align:right;font-weight:600;font-variant-numeric:tabular-nums;font-size:13px}

.tx{cursor:pointer}
.txicon{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;flex:none;font-size:16px}
.tx .in{background:var(--sage-tint)}
.tx .out{background:var(--cream-deep)}
.tx .amt{font-weight:600;font-variant-numeric:tabular-nums;margin-left:auto;white-space:nowrap}
.tx .amt.plus{color:var(--forest)}
.txdetail{display:none;background:var(--cream-deep);border-radius:14px;padding:14px;margin:4px 0 10px;font-size:13.5px}
.txdetail.on{display:block;animation:rise .25s ease both}
.audit{margin-top:10px;border-top:1px dashed var(--sage-line);padding-top:10px;color:var(--ink-soft);font-size:12.5px}
.audit li{list-style:none;padding:2px 0}
/* ---- v0.10.0 Finance ---- */
.txinfogrid{display:grid;grid-template-columns:1fr 1fr;gap:6px 18px;margin-top:12px}
@media(max-width:420px){.txinfogrid{grid-template-columns:1fr}}
.txinfo{display:flex;justify-content:space-between;gap:10px;font-size:13px;color:var(--ink-soft);padding:2px 0}
.txinfo b{color:var(--ink);font-weight:600;text-align:right;overflow-wrap:break-word;word-break:normal}
.txnotes{margin-top:12px;background:var(--card);border:1px solid var(--sage-line);border-radius:12px;padding:10px 12px;font-size:13px;color:var(--ink-soft);line-height:1.5;overflow-wrap:anywhere}
.txexcl{margin-top:10px;background:var(--amber-tint);color:var(--amber);border-radius:12px;padding:9px 12px;font-size:12.5px;overflow-wrap:anywhere}
.txacts{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:14px}
/* (v0.18.0 correction) per-account balances on the Finance card, and the
   per-account rows in the opening-balance dialog. Both wrap rather than scroll,
   so a long account name cannot push the page sideways at 390px. */
.finaccts{margin-top:14px;border-top:1px solid var(--line);padding-top:10px}
.finacct{display:flex;gap:10px;align-items:baseline;padding:3px 0;flex-wrap:wrap}
.finacct-n{font-size:13.5px;color:var(--ink-soft);min-width:0;overflow-wrap:anywhere}
.finacct-b{margin-left:auto;font-size:14px;white-space:nowrap}
.obal-acct{border:1px solid var(--line);border-radius:12px;padding:12px;margin-top:10px;background:var(--cream)}
.obal-acct-h{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:8px;overflow-wrap:anywhere}
.txmuted .txicon{opacity:.65}
.txmuted>b,.txmuted b{color:var(--ink-soft)}
/* ---- ER permission config (Settings) ---- */
.er-perms-head,.er-perms-row{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:8px;align-items:center}
.er-perms-head{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-faint);padding:8px 0 6px;border-bottom:1px solid var(--cream-deep)}
.er-perms-row{padding:9px 0;border-bottom:1px solid var(--cream-deep)}
.er-perms-name{min-width:0}
.er-perms-name b{display:block;font-size:13.5px;overflow-wrap:anywhere}
.er-perms-name small{color:var(--ink-faint);font-size:11.5px}
.er-perm-toggle{border:1px solid var(--sage-line);background:var(--card);border-radius:20px;padding:4px 12px;font-size:12px;cursor:pointer;position:relative;color:var(--ink-soft)}
.er-perm-toggle.on{background:var(--sage);color:#fff;border-color:var(--sage)}
.er-perm-toggle:focus-visible{outline:2px solid var(--forest);outline-offset:2px}
.er-perm-def{display:block;font-style:normal;font-size:9px;opacity:.7;margin-top:1px}
.er-perm-req{display:block;font-style:normal;font-size:9px;opacity:.85;margin-top:1px;color:#B4553F}
.er-perm-toggle.needsfin{opacity:.5;cursor:not-allowed;background:var(--card);color:var(--ink-faint);border-style:dashed}
.er-perm-toggle.needsfin.on{background:var(--cream-deep);color:var(--ink-soft)}
/* (v0.18.0) On desktop the column header already names each toggle, so this
   inner label stays hidden — the button's accessible name still carries it,
   via aria-label, at every width. Below 560px the header disappears (next
   rule) and this becomes the ONLY visible indication of what a given Off/On
   pill controls, so it is shown there instead of relying on position alone. */
.er-perm-label{display:none}
@media(max-width:560px){
  .er-perms-head{display:none}
  .er-perms-row{grid-template-columns:1fr 1fr 1fr;grid-template-areas:'name name name' 'a b c';gap:6px}
  .er-perms-name{grid-area:name;margin-bottom:4px}
  .er-perm-toggle{padding:7px 6px;width:100%}
  .er-perm-label{display:block;font-size:10px;font-weight:600;letter-spacing:.02em;line-height:1.25;margin-bottom:3px;white-space:normal;color:inherit}
}
/* ---- Meeting permission config (Settings, v0.19.0 pass 4) ----
   A deliberately SEPARATE rule set from the ER grid just above (spec E:
   visually distinct systems), even though the shapes/conventions mirror
   each other closely on purpose (same toggle look, same always-visible
   label, same mobile stacking). Two permission columns instead of three. */
.meet-perms-legend{font-size:12.5px;color:var(--ink-soft);line-height:1.5;margin-bottom:10px}
.meet-perms-legend div+div{margin-top:4px}
.meet-perms-head,.meet-perms-row{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:8px;align-items:center}
.meet-perms-head{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-faint);padding:8px 0 6px;border-bottom:1px solid var(--cream-deep)}
.meet-perms-row{padding:9px 0;border-bottom:1px solid var(--cream-deep)}
.meet-perms-name{min-width:0}
.meet-perms-name b{display:block;font-size:13.5px;overflow-wrap:anywhere}
.meet-perms-name small{color:var(--ink-faint);font-size:11.5px}
.meet-perm-toggle{border:1px solid var(--sage-line);background:var(--card);border-radius:20px;padding:4px 12px;font-size:12px;cursor:pointer;position:relative;color:var(--ink-soft)}
.meet-perm-toggle.on{background:var(--sage);color:#fff;border-color:var(--sage)}
.meet-perm-toggle:focus-visible{outline:2px solid var(--forest);outline-offset:2px}
.meet-perm-def{display:block;font-style:normal;font-size:9px;opacity:.7;margin-top:1px}
.meet-perm-label{display:none}
@media(max-width:560px){
  .meet-perms-head{display:none}
  .meet-perms-row{grid-template-columns:1fr 1fr;grid-template-areas:'name name' 'a b';gap:6px}
  .meet-perms-name{grid-area:name;margin-bottom:4px}
  .meet-perm-toggle{padding:7px 6px;width:100%}
  .meet-perm-label{display:block;font-size:10px;font-weight:600;letter-spacing:.02em;line-height:1.25;margin-bottom:3px;white-space:normal;color:inherit}
}
/* ---- Expense Requests: Finance view (v0.11.0) ---- */
.er-summary{margin-bottom:16px}
.er-summary-grid{display:flex;gap:26px;flex-wrap:wrap}
.er-summary .stat .money{font-size:24px}
.er-section{margin-bottom:20px}
.er-section-h{font-family:'Fraunces',serif;font-size:16px;color:var(--forest);display:flex;align-items:center;gap:8px}
.er-count{background:var(--sage);color:#fff;border-radius:20px;font-size:11px;padding:1px 8px;font-family:'Instrument Sans',sans-serif}
.er-section-blurb{font-size:12px;color:var(--ink-faint);margin:2px 0 10px}
.erfitem{border:1px solid var(--sage-line);border-radius:14px;margin-bottom:8px;background:var(--card);overflow:hidden}
.erfitem.on{border-color:var(--sage);box-shadow:var(--shadow)}
.erf-head{width:100%;display:flex;align-items:center;gap:12px;padding:12px 13px;text-align:left;flex-wrap:wrap}
.erf-head:hover{background:var(--cream-deep)}
.erf-head:focus-visible{outline:2px solid var(--sage);outline-offset:-2px}
.erf-ic{width:36px;height:36px;border-radius:11px;background:var(--cream-deep);display:grid;place-items:center;font-size:17px;flex:none}
.erf-main{min-width:0;flex:1 1 150px}
.erf-main b{display:block;font-size:14.5px;overflow-wrap:anywhere;font-weight:600}
.erf-meta{display:block;font-size:12px;color:var(--ink-soft);margin-top:2px;overflow-wrap:anywhere}
.erf-caret{color:var(--ink-faint);font-size:18px;flex:none}
.erf-panel{padding:4px 14px 15px;animation:rise .2s ease both}
.er-panel-status{display:flex;align-items:center;gap:9px;margin:6px 0 4px;flex-wrap:wrap}
.er-panel-statusmsg{font-size:12.5px;color:var(--ink-soft)}
.er-infogrid{margin:12px 0;border-top:1px solid var(--cream-deep)}
.er-inforow{display:flex;gap:12px;padding:7px 0;border-bottom:1px solid var(--cream-deep);font-size:13.5px}
.er-infolabel{color:var(--ink-faint);min-width:130px;flex:none}
.er-infoval{overflow-wrap:anywhere;min-width:0}
.er-noatt{font-size:12px;color:var(--ink-faint);font-style:italic;margin:8px 0}
.er-enrich{margin-top:12px;background:var(--cream-deep);border-radius:12px;padding:12px}
.er-enrich-h{font-size:12px;font-weight:600;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.04em;margin-bottom:8px}
.er-enrich-note{font-size:12px;color:var(--ink-faint);margin:-4px 0 10px;font-style:italic}
.er-facts-acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.er-projwrap{margin-top:4px}
.er-alloc{margin-top:6px}
.er-allocrow{display:flex;gap:8px;align-items:center;margin-bottom:7px}
.er-allocrow select{flex:1;min-width:0}
.er-allocamt{display:flex;align-items:center;gap:3px;position:relative}
.er-allocamt span{color:var(--ink-faint)}
.er-allocamt input{width:92px}
.er-alloc-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-top:4px}
.er-alloc-sum{font-size:12.5px;color:var(--ink-soft)}
.er-ok{color:var(--forest)}
.er-bad{color:#B4553F}
@media(max-width:380px){
  .erf-head .pill{order:3}
  .erf-caret{margin-left:auto}
  .er-allocrow{flex-wrap:wrap}
  .er-allocamt input{width:80px}
  .er-infolabel{min-width:100px}
}
/* ---- Expense Requests (v0.11.0) ---- */
.er-lede{font-size:13.5px;color:var(--ink-soft);margin:6px 0 14px;max-width:60ch}
.ercard{margin-bottom:12px}
.ercard-top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;flex-wrap:wrap}
.ercard-head{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;min-width:0}
.ercard-head b{font-size:16px;overflow-wrap:anywhere}
.ercard-amt{font-weight:600;color:var(--forest);font-size:15px;white-space:nowrap}
.ercard-meta{font-size:12px;color:var(--ink-faint);margin-top:3px}
.er-explain{font-size:13.5px;color:var(--ink-soft);margin:8px 0 0;line-height:1.5}
.er-callout{display:flex;gap:8px;align-items:flex-start;border-radius:12px;padding:9px 12px;font-size:13px;line-height:1.5;margin-top:9px}
.er-callout.warm{background:var(--amber-tint,#FBF1DC);color:#7A5A24}
.er-callout.soft{background:var(--cream-deep);color:var(--ink-soft)}
.er-callout.good{background:rgba(143,174,151,.18);color:var(--forest)}
.er-notes{font-size:13px;color:var(--ink-soft);margin-top:9px;background:var(--cream-deep);border-radius:10px;padding:8px 11px}
.er-attwrap{margin-top:10px;display:flex;flex-direction:column;gap:6px}
.er-att{display:flex;align-items:center;gap:9px;background:var(--cream-deep);border-radius:10px;padding:7px 10px;font-size:12.5px;flex-wrap:wrap}
.er-att-ic{flex:none}
.er-att-main{min-width:0;flex:1 1 140px}
.er-att-main b{display:block;overflow-wrap:anywhere;font-weight:600}
.er-att-main small{color:var(--ink-faint)}
.er-att-open{color:var(--forest);font-weight:600;text-decoration:none;white-space:nowrap}
.er-att-gone{color:var(--ink-faint);font-style:italic;font-size:11.5px}
.er-att-rm,.er-inlinebtn{background:none;border:none;color:var(--ink-faint);font-size:12px;cursor:pointer;text-decoration:underline;padding:2px 4px}
.er-inlinebtn{color:#7A5A24;font-weight:600}
.er-auditline{font-size:11.5px;color:var(--ink-faint);margin-top:11px;display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.er-histbtn{background:none;border:none;color:var(--forest);font-size:11.5px;cursor:pointer;text-decoration:underline;padding:0}
.ercard-acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.erf-files{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.erf-file{display:flex;align-items:center;gap:9px;background:var(--cream-deep);border-radius:10px;padding:7px 10px;font-size:12.5px}
.erf-file-main{min-width:0;flex:1}
.erf-file-main b{display:block;overflow-wrap:anywhere;font-weight:600}
.erf-file-main small{color:var(--ink-faint)}
.erh-list{display:flex;flex-direction:column;gap:2px;max-height:60vh;overflow:auto}
.erh-row{display:flex;gap:11px;padding:8px 2px}
.erh-dot{width:9px;height:9px;border-radius:50%;background:var(--sage);margin-top:5px;flex:none}
.erh-main{min-width:0}
.erh-text{font-size:13.5px;overflow-wrap:anywhere}
.erh-meta{font-size:11.5px;color:var(--ink-faint);margin-top:1px}
.xbtn{background:none;border:none;font-size:17px;color:var(--ink-faint);cursor:pointer;padding:4px 8px;border-radius:8px}
.xbtn:hover{background:var(--cream-deep)}
.fin-empty{text-align:center;padding:26px 16px 10px;display:flex;flex-direction:column;align-items:center;gap:6px}
.fin-empty-ic{width:52px;height:52px;border-radius:16px;background:var(--sage-tint);display:grid;place-items:center;font-size:24px;margin-bottom:4px}
.fin-empty b{font-family:'Fraunces',serif;font-size:18px;color:var(--ink)}
.fin-empty p{font-size:13.5px;color:var(--ink-soft);max-width:340px;line-height:1.5;margin:0 0 6px}
.excl-head{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;font-weight:600;font-size:14px;color:var(--ink-soft);padding:2px 0}
.excl-head:hover{color:var(--forest)}
.excl-body{display:none;margin-top:8px}
.excl-body.on{display:block;animation:rise .25s ease both}
.excl-note{font-size:12.5px;color:var(--ink-faint);margin:0 0 8px;line-height:1.5}
/* ---- v0.10.1 ---- */
.txe-note{font-size:12px;color:var(--ink-faint);margin:6px 0 0;line-height:1.45}
.catrow{border:1px solid var(--sage-line);border-radius:14px;padding:11px 13px;margin-bottom:8px;background:var(--card)}
.cattop{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.cattop b{display:block;font-size:14.5px;overflow-wrap:break-word;word-break:normal}
.catcount{display:block;font-size:12px;color:var(--ink-faint);margin-top:1px}
.catacts{display:flex;gap:6px;flex-wrap:wrap;margin-left:auto}
.catpanel{margin-top:11px;padding-top:11px;border-top:1px dashed var(--sage-line)}
.catpanel p{font-size:12.5px;color:var(--ink-soft);line-height:1.55;margin:8px 0 0}
.catpanel .catacts{margin-left:0;margin-top:11px}
/* ---- v0.10.2 receipt review accordion ---- */
.rcp-intro{font-size:12.5px;color:var(--ink-faint);line-height:1.55;margin:0 0 10px}
.rcpitem{border:1px solid var(--sage-line);border-radius:14px;margin-bottom:8px;background:var(--card);overflow:hidden}
.rcpitem.on{border-color:var(--sage);box-shadow:var(--shadow)}
.rcp-head{width:100%;display:flex;align-items:center;gap:12px;padding:12px 13px;text-align:left;flex-wrap:wrap}
.rcp-head:hover{background:var(--cream-deep)}
.rcp-head:focus-visible{outline:2px solid var(--sage);outline-offset:-2px}
.rcp-thumb{width:38px;height:38px;border-radius:12px;background:var(--cream-deep);display:grid;place-items:center;font-size:18px;flex:none}
.rcp-main{min-width:0;flex:1 1 160px;display:block}
.rcp-main b{display:block;font-size:14.5px;overflow-wrap:anywhere;font-weight:600}
.rcp-meta{display:block;font-size:12.5px;color:var(--ink-soft);margin-top:2px;overflow-wrap:anywhere}
.rcp-status{flex:none}
.rcp-caret{color:var(--ink-faint);font-size:18px;flex:none}
.rcp-panel{padding:2px 13px 14px;animation:rise .2s ease both}
.rcp-none{margin-top:12px;background:var(--cream-deep);border-radius:12px;padding:11px 13px;font-size:12.5px;
  color:var(--ink-soft);line-height:1.55;display:flex;gap:9px;align-items:flex-start}
.rcp-acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.rcp-foot{font-size:12px;color:var(--ink-faint);line-height:1.55;margin:10px 0 0}
@media(max-width:380px){
  .rcp-status{order:3}
  .rcp-caret{margin-left:auto}
}
.flashcard{animation:flashcard 1.5s ease both}
@keyframes flashcard{0%{box-shadow:0 0 0 3px var(--sage)}60%{box-shadow:0 0 0 3px var(--sage)}100%{box-shadow:var(--shadow)}}
select,input[type=text],input[type=number],textarea{font-family:inherit;font-size:14px;padding:9px 12px;border-radius:11px;border:1.5px solid var(--sage-line);background:var(--card);color:var(--ink);width:100%}
select:focus,input:focus,textarea:focus{outline:2px solid var(--sage);border-color:var(--sage)}
label.f{display:block;font-size:12.5px;font-weight:600;color:var(--ink-soft);margin:12px 0 5px}

.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;margin-top:10px}
.cal .dow{font-size:11px;font-weight:600;color:var(--ink-faint);text-align:center;text-transform:uppercase;letter-spacing:.08em;padding:4px 0}
.day{aspect-ratio:1/1.05;border-radius:12px;background:var(--card);border:1px solid var(--cream-deep);padding:5px 6px;font-size:12.5px;color:var(--ink-soft);display:flex;flex-direction:column;gap:3px}
.day.mute{opacity:.35}
.day.today{border-color:var(--forest);background:var(--sage-tint);color:var(--forest);font-weight:600}
.day .dots{display:flex;gap:3px;flex-wrap:wrap;margin-top:auto}
.day .dots i{width:6px;height:6px;border-radius:50%}
.d-meet{background:var(--forest)}.d-dead{background:var(--amber)}
.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:12.5px;color:var(--ink-soft);margin-top:14px}
.legend span{display:flex;align-items:center;gap:6px}
.legend i{width:8px;height:8px;border-radius:50%}
.agitem{display:flex;gap:14px;padding:12px 2px;border-bottom:1px solid var(--cream-deep)}
.agitem:last-child{border:none}
.agdate{width:52px;flex:none;text-align:center}
.agdate b{display:block;font-family:'Fraunces',serif;font-size:19px;line-height:1.1}
.agdate small{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-faint)}

.avatar{width:44px;height:44px;border-radius:50%;background:var(--sage-tint);color:var(--forest);display:grid;place-items:center;font-weight:600;font-family:'Fraunces',serif;font-size:16px;flex:none}
.chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.chip{font-size:11.5px;font-weight:600;padding:3px 10px;border-radius:999px;background:var(--cream-deep);color:var(--ink-soft)}
.chip.hi{background:var(--sage-tint);color:var(--forest)}

.resfilters{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0 14px}
.resfilters button{font-size:12.5px;padding:6px 11px;border-radius:99px;border:1.5px solid var(--sage-line);background:var(--card);color:var(--ink-soft);cursor:pointer;white-space:nowrap}
.resfilters button:hover{border-color:var(--sage)}
.resfilters button.on{background:var(--sage-tint);border-color:var(--sage);color:var(--forest);font-weight:600}
.rescard{cursor:pointer;transition:transform .15s,box-shadow .18s;display:flex;gap:14px;align-items:flex-start;width:100%;text-align:left}
.rescard:hover{transform:translateY(-2px);box-shadow:var(--shadow-lift)}
.rescard.archived{opacity:.7}
.resicon{width:44px;height:44px;border-radius:14px;background:var(--sage-tint);display:grid;place-items:center;font-size:20px;flex:none}

/* Setup */
#setup{position:fixed;inset:0;z-index:60;background:
  radial-gradient(110% 130% at 90% -10%,rgba(233,196,106,.24),transparent 55%),
  radial-gradient(120% 140% at -10% 110%,rgba(143,174,151,.30),transparent 60%),
  var(--cream);overflow-y:auto;display:flex;justify-content:center}
#setup.off{display:none}
.wiz{width:100%;max-width:530px;padding:44px 22px 60px}
.wstep{display:none;animation:rise .4s ease both}
.wstep.on{display:block}
.wiz h1{font-size:29px;margin:14px 0 8px}
@media(min-width:900px){.wiz h1{font-size:35px}}
.wdots{display:flex;gap:6px;margin-bottom:26px}
.wdots i{width:26px;height:5px;border-radius:99px;background:var(--sage-line);transition:background .3s}
.wdots i.on{background:var(--forest)}
.opt{display:flex;align-items:flex-start;gap:13px;width:100%;text-align:left;padding:15px 16px;border-radius:16px;border:1.5px solid var(--sage-line);background:var(--card);margin-top:10px;font-weight:500;transition:.15s;font-size:15px}
.opt:hover{border-color:var(--sage)}
.opt.sel{border-color:var(--forest);background:var(--sage-tint)}
.opt .flag{font-size:21px;line-height:1.2}
.opt small{display:block;color:var(--ink-soft);font-weight:400;font-size:13px;margin-top:1px;line-height:1.45}
.wnav{display:flex;gap:10px;margin-top:26px}
.tagrow{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.tag{padding:8px 14px;border-radius:999px;background:var(--card);border:1.5px solid var(--sage-line);font-size:13.5px;font-weight:600;color:var(--forest);cursor:pointer;transition:.15s}
.tag.sel{background:var(--forest);color:#FDFBF5;border-color:var(--forest)}
.hint{background:var(--sage-tint);border-radius:14px;padding:13px 15px;font-size:13.5px;color:var(--forest);margin-top:16px;display:flex;gap:9px;align-items:flex-start;line-height:1.5}
/* (v0.12.0) onboarding refinements */
.opt .flagsvg{width:30px;height:20px;border-radius:3px;flex:0 0 auto;box-shadow:0 0 0 1px rgba(42,52,44,.10);overflow:hidden;display:block}
.opt .flagsvg svg{display:block;width:100%;height:100%}
.langopt{align-items:center;min-height:52px}
.langname{font-weight:500;font-size:15px;font-family:system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif}
/* ---- Demo identity switcher (prototype control) ---- */
.demoswitch{display:flex;align-items:center;gap:8px;width:100%;text-align:left;padding:9px 11px;border-radius:12px;border:1px dashed var(--sage-line);background:transparent;margin-bottom:10px;color:var(--ink-soft);font-size:12.5px;transition:.15s;cursor:pointer}
.demoswitch:hover{background:var(--sage-tint);border-color:var(--sage)}
.demopill{font-size:10px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#fff;background:var(--sage);border-radius:6px;padding:2px 6px;flex:0 0 auto}
.demowho{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.demowho b{color:var(--forest);font-weight:600}
.demoicon{width:16px;height:16px;flex:0 0 auto;opacity:.5}
.demoswitch-m{align-items:center;gap:10px}
.demohead{font-size:17px;font-weight:600;margin-bottom:6px;display:flex;align-items:center;gap:8px}
.demosub{font-size:13px;color:var(--ink-soft);margin-bottom:14px;line-height:1.5}
.idlist{display:flex;flex-direction:column;gap:8px;max-height:60vh;overflow:auto}
.idrow{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:12px 14px;border-radius:14px;border:1.5px solid var(--sage-line);background:var(--card);transition:.15s;cursor:pointer}
.idrow:hover{border-color:var(--sage)}
.idrow.on{border-color:var(--forest);background:var(--sage-tint)}
.idcheck{width:15px;flex:0 0 auto;color:var(--forest);font-weight:700}
.idmain{min-width:0}
.idmain b{display:block;font-weight:600}
.idmain small{color:var(--ink-soft);font-size:12.5px}
.segrow{display:flex;gap:10px;margin-top:10px}
.segrow .opt{flex:1;margin-top:0}
.wmnote{display:flex;gap:10px;align-items:flex-start;background:var(--sage-tint);border-radius:14px;padding:13px 15px;margin-top:16px;font-size:13px;color:var(--forest);line-height:1.5}
.wmnote-ic{font-size:16px;line-height:1.3;flex:0 0 auto}
.fhint{font-size:12.5px;color:var(--ink-faint);margin-top:4px;line-height:1.45}
.sech{font-weight:600;font-size:14px;color:var(--ink-soft)}
.yeardisplay{margin-top:6px;padding:12px 14px;border-radius:14px;border:1.5px solid var(--sage-line);background:var(--sage-tint);font-size:15px;font-weight:600;color:var(--forest)}
.reqstar{color:#B4553F;font-weight:700}
.optlabel{color:var(--ink-faint);font-weight:400;font-size:12.5px}
.werr{color:#B4553F;font-size:12.5px;margin-top:5px;line-height:1.4}
#setup input.inerr{border-color:#B4553F}
.wselect{width:100%;margin-top:6px;padding:12px 14px;border-radius:14px;border:1.5px solid var(--sage-line);background:var(--card);font-size:15px;color:var(--ink);font-family:inherit;appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232E4A3B' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center}
.wselect:focus{outline:none;border-color:var(--forest)}
.prep-spin{width:52px;height:52px;margin:0 auto;border-radius:50%;border:4px solid var(--sage-line);border-top-color:var(--forest);animation:prepspin .9s linear infinite}
@keyframes prepspin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.prep-spin{animation-duration:2.4s}}
.welcome-card{position:relative;background:linear-gradient(135deg,var(--sage-tint),var(--card));border:1.5px solid var(--sage-line);border-radius:20px;padding:22px 22px 20px;margin-top:22px;animation:rise .4s ease both}
.welcome-h{font-family:'Fraunces',serif;font-weight:600;font-size:21px;color:var(--forest);line-height:1.2}
.welcome-sub{font-size:14px;color:var(--ink-soft);margin-top:6px}
.welcome-sugs{display:flex;flex-direction:column;gap:8px;margin-top:16px}
@media(min-width:640px){.welcome-sugs{flex-direction:row}}
.welcome-sug{flex:1;display:flex;align-items:center;gap:9px;text-align:left;padding:12px 14px;border-radius:14px;border:1.5px solid var(--sage-line);background:var(--card);font-weight:600;font-size:14px;color:var(--forest);cursor:pointer;transition:.15s}
.welcome-sug:hover{border-color:var(--forest);background:var(--sage-tint)}
.welcome-dismiss{margin-top:14px;background:none;border:none;color:var(--ink-faint);font-weight:600;font-size:13px;cursor:pointer;padding:4px 2px}
.welcome-dismiss:hover{color:var(--forest)}
.welcome-x{position:absolute;top:12px;right:14px;background:none;border:none;font-size:22px;line-height:1;color:var(--ink-faint);cursor:pointer;padding:2px 6px;border-radius:8px}
.welcome-x:hover{color:var(--forest);background:rgba(46,74,59,.08)}

.modal{position:fixed;inset:0;background:rgba(42,52,44,.38);backdrop-filter:blur(3px);z-index:70;display:none;align-items:flex-end;justify-content:center;padding:0}
@media(min-width:640px){.modal{align-items:center;padding:24px}}
.modal.on{display:flex}
.sheet{background:var(--card);border-radius:24px 24px 0 0;width:100%;max-width:490px;padding:24px 22px 34px;animation:up .3s ease both;max-height:92vh;overflow-y:auto}
@media(min-width:640px){.sheet{border-radius:24px;padding:28px}}
@keyframes up{from{transform:translateY(30px);opacity:0}to{transform:none;opacity:1}}
#toast{position:fixed;left:50%;bottom:88px;transform:translateX(-50%) translateY(20px);background:var(--forest);color:#FDFBF5;padding:11px 20px;border-radius:14px;font-size:14px;font-weight:500;opacity:0;pointer-events:none;transition:.3s;z-index:90;box-shadow:var(--shadow-lift);max-width:88vw;text-align:center}
#toast.on{opacity:1;transform:translateX(-50%) translateY(0)}
@media(min-width:900px){#toast{bottom:36px}}
.warnbox{background:var(--amber-tint);border:1.5px solid #E8D5B0;border-radius:14px;padding:14px 15px;font-size:14px;color:#7A5A24;display:flex;gap:10px;margin-top:14px}
.uploadzone{border:2px dashed var(--sage-line);border-radius:16px;padding:28px 16px;text-align:center;color:var(--ink-soft);font-size:14px;cursor:pointer;transition:.15s;margin-top:8px}
.uploadzone:hover{border-color:var(--sage);background:var(--sage-tint)}
.receiptthumb{background:var(--cream-deep);border-radius:14px;padding:14px;display:flex;gap:12px;align-items:center;margin-top:12px;font-size:13.5px}


/* ---- Home briefing (v3) ---- */
.statebar{display:flex;align-items:center;gap:10px;margin:2px 2px 14px;flex-wrap:wrap}
.statebar>span{font-size:12.5px;color:var(--ink-faint);font-weight:600;white-space:nowrap}
/* (v0.16.0 correction) Each reason is one coherent item: checkmark, then a
   single flowing text block (bold reason, then its explanation) that wraps
   using the full available width. Previously ".why span" matched BOTH the
   outer icon+text row AND the inner text span, so the inner span became a
   second flex row too -- splitting the bold reason and its explanation into
   two independently-wrapping narrow columns, which is exactly what broke at
   390px (every sentence fragmenting into several short lines). The item
   wrapper and the text span now have distinct classes so only the OUTER
   row is a flex container; the inner text stays plain inline flow. */
.why{margin-top:12px;display:flex;flex-direction:column;gap:8px}
.why-item{font-size:13px;color:var(--ink-soft);display:flex;gap:8px;align-items:flex-start}
.why-item i{font-style:normal;color:var(--sage);flex:none;line-height:1.5}
.why-item .why-text{flex:1;min-width:0;line-height:1.5}
.why-text b{color:var(--forest);font-weight:600}
.srcchip{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;font-weight:600;color:var(--ink-faint);background:var(--cream-deep);border-radius:999px;padding:4px 10px;white-space:nowrap;transition:.15s;flex:none;margin-left:auto}
.srcchip:hover{background:var(--sage-tint);color:var(--forest)}
.brief-li{list-style:none;display:flex;gap:11px;align-items:center;padding:11px 0;border-bottom:1px solid var(--cream-deep);font-size:14.5px}
.brief-li:last-child{border-bottom:none}
.brief-li .txt{flex:1;min-width:0}
.brief-li small{display:block;color:var(--ink-faint);font-size:12px;margin-top:1px}
.emptycard{text-align:center;padding:30px 20px 26px}
.emptycard .eic{font-size:32px;display:block;margin-bottom:10px}
.emptycard h3{font-size:17px;margin-bottom:5px}
.emptycard p{font-size:13.5px;color:var(--ink-soft);margin-bottom:14px}
.allquiet{text-align:center;padding:10px 0 2px;color:var(--ink-soft);font-size:14px}
.bigmoment{border-radius:26px;padding:30px 24px;text-align:center;background:
  radial-gradient(110% 150% at 50% -30%,rgba(233,196,106,.30),transparent 60%),var(--card);
  border:1px solid var(--sage-line);box-shadow:var(--shadow);margin-bottom:14px}
.bigmoment .money{font-size:34px}


.tag.sub{border-style:dashed;color:var(--ink-soft);font-weight:500}
.tag.sub.sel{background:var(--forest);color:#FDFBF5;border-color:var(--forest);border-style:solid}
.tag.addrole{border-style:dashed;color:var(--ink-faint)}
.tag.addrole:hover{color:var(--forest)}
.ctxline{display:flex;align-items:center;gap:8px;margin-top:10px;font-size:13px;color:var(--ink-soft);flex-wrap:wrap}
.wmbadge{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:600;padding:3px 9px;border-radius:999px;background:var(--amber-tint);color:var(--amber)}
.swatch{width:22px;height:22px;border-radius:8px;border:1.5px solid var(--sage-line);display:inline-block;vertical-align:middle}


/* ---- Working Meetings module ---- */
.titlein{font-family:'Fraunces',Georgia,serif;font-weight:500;font-size:26px;letter-spacing:-.01em;border:none;background:transparent;width:100%;padding:2px 0;border-radius:8px;color:var(--ink)}
.titlein:hover{background:var(--cream-deep)}
.titlein:focus{outline:2px solid var(--sage);background:var(--card)}
@media(min-width:900px){.titlein{font-size:30px}}
.metain{border:none;background:transparent;font-size:13.5px;color:var(--ink-soft);padding:3px 6px;border-radius:8px;width:auto;font-family:inherit;max-width:100%;min-width:0}
.metain:hover{background:var(--cream-deep)}
.metain:focus{outline:2px solid var(--sage);background:var(--card)}
.mrow{cursor:pointer;transition:background .12s;border-radius:12px;margin:0 -8px;padding:13px 8px!important}
.mrow:hover{background:var(--cream-deep)}
.agrow{display:flex;align-items:center;gap:8px;padding:9px 0;border-bottom:1px solid var(--cream-deep);font-size:14.5px}
.agrow:last-child{border-bottom:none}
.agrow .num{color:var(--sage);font-weight:600;width:16px;flex:none}
.agrow .txt{flex:1;min-width:0}
.agrow .projlink{font-size:11.5px;color:var(--forest);background:var(--sage-tint);border-radius:999px;padding:3px 9px;white-space:nowrap;flex:none}
.aghandle{display:flex;gap:2px;flex:none;opacity:.45}
.agrow:hover .aghandle{opacity:1}
.aghandle button,.agdel{width:24px;height:24px;border-radius:8px;display:grid;place-items:center;color:var(--ink-faint);font-size:13px}
.aghandle button:hover,.agdel:hover{background:var(--sage-tint);color:var(--forest)}
.agadd{display:flex;gap:8px;margin-top:10px}
.savedtag{font-size:12px;color:var(--sage);font-weight:600;opacity:0;transition:opacity .4s}
.savedtag.on{opacity:1}
#m-minutes{min-height:110px;resize:vertical;transition:min-height .3s;line-height:1.6}
.minutes-open #m-minutes{min-height:56vh}
.dtypegrid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}
.dtype{border:1.5px solid var(--sage-line);border-radius:14px;padding:13px 12px;text-align:left;transition:.15s;background:var(--card)}
.dtype:hover{border-color:var(--sage);background:var(--sage-tint)}
.dtype b{display:block;font-size:14px}
.dtype small{color:var(--ink-soft);font-size:12px;line-height:1.35;display:block;margin-top:2px}
.orgsteps{margin:14px 0 4px}
.orgstep{display:flex;align-items:center;gap:10px;padding:7px 0;font-size:14px;color:var(--ink-faint);opacity:.35;transition:.3s}
.orgstep.on{opacity:1;color:var(--ink)}
.orgstep .ok{width:20px;height:20px;border-radius:50%;background:var(--sage-tint);color:var(--forest);display:grid;place-items:center;font-size:11px;flex:none}
.aicard{background:var(--sage-tint);border-radius:14px;padding:14px 15px;font-size:13.5px;color:var(--forest);margin-top:14px}


.edpop{position:absolute;width:min(300px,calc(100% - 32px));max-height:210px;overflow-y:auto;background:var(--card);border:1.5px solid var(--sage-line);border-radius:14px;box-shadow:var(--shadow-lift);padding:6px;z-index:5}
.edpop button{display:flex;gap:9px;align-items:center;width:100%;text-align:left;padding:8px 10px;border-radius:10px;font-size:13.5px}
.edpop button:hover{background:var(--sage-tint)}
.edpop button.sel{background:var(--sage-tint);box-shadow:inset 0 0 0 1.5px var(--sage)}
.edpop .cap{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint);font-weight:600;padding:4px 10px 2px}
.orgstep .neutral{width:20px;height:20px;border-radius:50%;background:var(--cream-deep);color:var(--ink-faint);display:grid;place-items:center;font-size:11px;flex:none}


.dops{display:flex;gap:6px;margin-top:9px}
.dops button{font-size:12px;font-weight:600;color:var(--ink-faint);padding:4px 10px;border-radius:9px}
.dops button:hover{background:var(--cream-deep);color:var(--forest)}
.aiedit{display:grid;grid-template-columns:1fr;gap:6px;margin-top:8px;background:rgba(255,255,255,.55);border-radius:12px;padding:10px}
@media(min-width:640px){.aiedit{grid-template-columns:2fr 1fr 1fr}}
.aiedit input,.aiedit select{font-size:13px;padding:7px 10px}


.icon-trigger{display:flex;align-items:center;gap:8px;width:100%;padding:9px 12px;border:1.5px solid var(--sage-line);border-radius:12px;background:var(--card);cursor:pointer;text-align:left}
.icon-trigger:hover{border-color:var(--sage)}
.icon-picker{margin-top:10px;background:var(--cream);border:1.5px solid var(--sage-line);border-radius:16px;padding:14px;display:grid;grid-template-columns:repeat(6,1fr);gap:8px}
.icon-picker button{font-size:24px;aspect-ratio:1;display:grid;place-items:center;border-radius:12px;background:var(--card);border:1.5px solid transparent;cursor:pointer;line-height:1;transition:transform .08s ease}
.icon-picker button:hover{background:var(--cream-deep);transform:scale(1.06)}
.icon-picker button.sel{border-color:var(--sage);background:var(--sage-tint)}


.finfilters{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0 4px}
/* Finance is money + long project names: never let a row push the page sideways */
#screen-finance .tx>div:nth-child(2){min-width:0}
/* (v0.17.0 correction) same word-boundary rule as the chart labels below —
   a long Greek transaction title must wrap at spaces, not mid-word */
#screen-finance .tx b{overflow-wrap:break-word;word-break:normal}
#screen-finance .txdetail{overflow-wrap:anywhere}
#screen-finance .stat{min-width:0}
@media(max-width:400px){
  .bar .lab{width:124px}
  .bar .val{width:auto;min-width:56px}
  #screen-finance .stat .money{font-size:20px}
}
.finfilters button{font-size:12.5px;padding:6px 11px;border-radius:99px;border:1.5px solid var(--sage-line);background:var(--card);color:var(--ink-soft);cursor:pointer;white-space:nowrap}
.finfilters button:hover{border-color:var(--sage)}
.finfilters button.on{background:var(--sage-tint);border-color:var(--sage);color:var(--forest);font-weight:600}
/* (v0.17.0 correction) `anywhere` let the chart label break INSIDE a word.
   break-word wraps at spaces first and only splits a token that could never
   fit the column on its own, so a long Greek activity name reads
   "Χριστουγεννιάτικο / Παζάρι" and still cannot overflow the card.
   hyphens:none stops the engine adding hyphens of its own. */
.bar .lab{min-width:0;overflow-wrap:break-word;word-break:normal;hyphens:none}


.lprow{display:flex;gap:10px;align-items:center;width:100%;text-align:left;padding:9px 11px;border-radius:12px;font-size:14px;background:none;cursor:pointer;border:1.5px solid transparent}
.refwrap{display:flex;flex-wrap:wrap;gap:8px}
.refchip{display:inline-flex;align-items:center;gap:4px;padding:6px 12px;border-radius:99px;font-size:13px;background:var(--sage-tint);border:1.5px solid var(--sage-line);color:var(--forest);cursor:pointer;max-width:100%;overflow-wrap:anywhere;text-align:left}
.refchip:hover{border-color:var(--sage)}
.refchip:focus-visible{outline:2px solid var(--forest);outline-offset:2px}
.refchip.gone{background:var(--cream-deep);border-color:var(--sage-line);color:var(--ink-faint);cursor:default}
.refgone{color:var(--amber);font-size:12px}
.refarch{color:var(--ink-faint);font-size:12px}
.lprow:hover{background:var(--sage-tint)}
.lprow.sel{background:var(--sage-tint);border-color:var(--sage)}
.lprow.create{color:var(--forest)}

/* Search */
.smodal{align-items:flex-start!important;padding-top:8vh!important}
.ssheet{max-width:560px;border-radius:22px!important;padding:16px 16px 18px!important}
.sinput{display:flex;align-items:center;gap:10px;border:1.5px solid var(--sage-line);border-radius:14px;padding:11px 14px;background:var(--cream)}
.sinput input{border:none;background:none;padding:3px 0;font-size:15.5px;line-height:1.5;height:auto}
.sinput input:focus{outline:none}
.sgroup{margin-top:14px}
.sgroup h5{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint);font-weight:600;margin:0 4px 4px}
.sresult{display:flex;align-items:center;gap:11px;width:100%;text-align:left;padding:10px 10px;border-radius:12px;font-size:14px;transition:.12s}
.sresult:hover{background:var(--sage-tint)}
.sresult .sic{width:32px;height:32px;border-radius:10px;background:var(--cream-deep);display:grid;place-items:center;flex:none;font-size:14px}
.sresult small{display:block;color:var(--ink-faint);font-size:12px}
.sempty{text-align:center;color:var(--ink-faint);font-size:13.5px;padding:26px 10px}

/* ---- Meeting record (v0.17.0): on-screen preview + print/PDF layout ---- */
.rec-versions{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.rec-versions:empty{display:none}
.rec-options .rec-check{display:flex;align-items:center;gap:9px;font-size:14px;padding:6px 0;cursor:pointer}
.rec-options .rec-check input{width:16px;height:16px;flex:none}
/* (v0.19.0) Meeting attendance — same comfortable label-wraps-checkbox
   pattern as .rec-check above (the whole row is the tap target, not just the
   16x16 box), reused as its own class since it lives outside .rec-options. */
.att-row{display:flex;align-items:center;gap:9px;font-size:14px;padding:7px 0;cursor:pointer}
.att-row input{width:18px;height:18px;flex:none}
.att-row input:disabled{cursor:default}
.rec-opt-note{font-size:12px;color:var(--ink-faint);margin-top:6px}
.rec-guidance{font-size:13px;color:var(--ink-soft);margin:16px 0 10px;display:flex;gap:8px;align-items:flex-start}
/* (v0.17.0 correction) break-word, not anywhere: a printed record must wrap
   Greek names at word boundaries ("Χριστουγεννιάτικο / Παζάρι"), never inside
   the word. break-word still breaks a single token too long for the line — a
   pasted URL — so nothing can overflow. hyphens:none keeps it from inventing
   hyphens in either language. */
.rec-paper{background:#fff;color:#1c1c1c;border:1px solid var(--sage-line);border-radius:var(--r);box-shadow:var(--shadow);padding:36px 32px;max-width:760px;margin:0 auto;overflow-wrap:break-word;word-break:normal;hyphens:none}
.rec-eyebrow{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--sage);font-weight:600;margin-bottom:10px}
.rec-title{font-size:22px;margin-bottom:2px}
.rec-subtitle{font-size:16px;font-weight:500;color:#3a3a3a;margin-bottom:10px}
.rec-meta{font-size:13px;color:#555;display:flex;flex-wrap:wrap;gap:4px 10px;margin-bottom:6px}
.rec-status{font-size:13px;color:#555;margin-bottom:4px}
.rec-notice{font-size:13px;color:var(--amber);background:var(--amber-tint);border-radius:10px;padding:9px 12px;margin:10px 0}
.rec-section{margin-top:20px;break-inside:avoid;page-break-inside:avoid}
.rec-h{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--forest);font-weight:700;border-bottom:1px solid #e4e4e4;padding-bottom:5px;margin-bottom:8px}
.rec-list{list-style:none}
.rec-list li{font-size:14px;line-height:1.6;padding:3px 0;overflow-wrap:break-word;word-break:normal}
.rec-minutes{font-size:14px;line-height:1.7;white-space:normal;overflow-wrap:break-word;word-break:normal}
.rec-minutes+.rec-minutes,.rec-minutes-list+.rec-minutes,.rec-minutes+.rec-minutes-list,.rec-minutes-list+.rec-minutes-list{margin-top:8px}
.rec-minutes-list{padding-left:22px;margin:0}
.rec-minutes-list li{font-size:14px;line-height:1.6;padding:1px 0;overflow-wrap:break-word;word-break:normal}
/* ---- minutes formatting toolbar (v0.19.0 pass 2) ---- */
.mfmt-bar{display:flex;gap:6px;flex-wrap:wrap}
.mfmt-btn{min-width:36px;height:36px;padding:0 10px;border-radius:9px;border:1px solid var(--sage-line);background:var(--card);color:var(--ink);font-size:14px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:.12s}
.mfmt-btn:hover{background:var(--sage-tint)}
.mfmt-btn.on{background:var(--sage-tint);border-color:var(--sage);color:var(--forest)}
/* (v0.17.0 correction) Signatures use the full content width as two columns —
   President at the left edge, Secretary at the right, equal line widths, real
   space between them. The old flex+gap:34px left both blocks bunched at the
   left of an A4 page. On a narrow phone preview they stack (single column);
   the A4 print rule below restores two columns regardless of screen width. */
.rec-sig{margin-top:34px;display:grid;grid-template-columns:1fr;gap:28px 48px;break-inside:avoid;page-break-inside:avoid}
@media(min-width:520px){.rec-sig{grid-template-columns:1fr 1fr}}
.rec-sigline{display:flex;flex-direction:column;gap:6px;font-size:12.5px;color:#555;min-width:0}
.rec-sigblank{display:block;width:100%;height:1px;background:#999;margin-top:36px}
/* ---- pre-meeting agenda print (v0.19.0) — same paper/eyebrow/section/footer
   language as the Meeting Record above; only the item+notes shape is new. ---- */
.ag-item{margin-top:16px}
.ag-item:first-child{margin-top:0}
.ag-line{font-size:14px;line-height:1.6;overflow-wrap:break-word;word-break:normal}
.ag-projtag{font-size:12px;color:#777;margin-left:8px;white-space:nowrap}
.ag-notes{margin-top:6px}
.ag-notes .ag-ruled{display:block;height:24px;border-bottom:1px solid #ccc}
.ag-signrow{display:flex;align-items:flex-end;gap:14px;padding:10px 0;border-bottom:1px solid #e4e4e4;font-size:13px}
.ag-signrow .ag-signblank{flex:1;height:1px;background:#999;margin-bottom:2px}
/* discreet, but dark enough to survive printing (#999 on white is ~2.8:1 and
   prints faint on many drivers; #6b6b6b is ~5.3:1 and still visually quiet) */
.rec-footer{margin-top:34px;padding-top:12px;border-top:1px solid #e4e4e4;font-size:11px;color:#6b6b6b;break-inside:avoid;page-break-inside:avoid;break-before:avoid;page-break-before:avoid}

/* (v0.17.0 correction) The bottom nav is position:fixed, so on a phone it
   floated over the record preview and covered its last lines. It is withheld
   only while the record screen is the one showing, and returns on every other
   screen. Derived from the live DOM with :has() rather than a body class kept
   in sync by hand, so it cannot go stale on any of the several navigation
   paths that switch .screen. Where :has() is unsupported the nav simply stays
   put — the same behaviour as before this fix, never worse. */
body:has(#screen-meeting-record.on) .bnav{display:none}
body:has(#screen-meeting-record.on) .shell{padding-bottom:28px}
/* (v0.19.0) The printable pre-meeting agenda is a second, separate print
   screen — same reasoning as the Meeting Record above, just a different
   #id, so both get exactly the same fixed-bottom-nav treatment. */
body:has(#screen-meeting-agenda.on) .bnav{display:none}
body:has(#screen-meeting-agenda.on) .shell{padding-bottom:28px}

/* ===== FINANCIAL REPORTS (v0.20.0) =====
   Builder controls reuse the Meeting Record's .rec-check tap-target
   convention (whole row, label always visible at every width). The preview
   itself is a third .rec-paper screen and shares .rec-eyebrow/.rec-title/
   .rec-meta/.rec-section/.rec-h/.rec-sig with the two that came before it —
   only the table and scope styling below is genuinely new. */
.rep-group{margin-top:16px}
.rep-group:first-of-type{margin-top:4px}
.rep-grouph{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--forest);font-weight:700;margin-bottom:8px}
.rep-dates{display:flex;gap:10px;flex-wrap:wrap}
.rep-dates>div{flex:1 1 140px;min-width:0}
.rep-dates input{width:100%}
.rep-check{display:flex;align-items:flex-start;gap:9px;font-size:14px;padding:6px 0;cursor:pointer;line-height:1.35}
.rep-check input{width:16px;height:16px;flex:none;margin-top:2px}
.rep-modes{display:flex;gap:8px;flex-wrap:wrap}
.rep-modes .btn{flex:1 1 180px}
.rep-tag{display:inline-block;font-size:10.5px;letter-spacing:.04em;text-transform:uppercase;
  background:var(--sage-soft,#eef2ea);color:var(--forest);border-radius:999px;padding:1px 7px;vertical-align:middle}
.rep-accacts{display:flex;gap:8px;margin-top:6px;flex-wrap:wrap}
.rep-empty{font-size:13px;color:var(--ink-soft);font-style:italic;margin:6px 0}
/* (v0.20.0 QA pass) The printed record-block rendering of a wide section.
   It exists in the DOM at all times so print needs no JavaScript, and is
   hidden on screen, where the horizontally scrollable table is the better
   preview and stays exactly as it was. */
.rep-blocks{display:none}
/* (v0.20.0 QA pass) receipt attachment inside the transaction editor.
   The file row itself reuses the existing .er-att shapes so an attachment
   looks identical wherever it appears; only the action row is new. */
.txe-rcp{margin-top:6px}
.txe-rcp-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:6px}
.txe-rcp-hint{font-size:12px;color:var(--ink-faint);flex:1;min-width:160px}
/* the self-contradicting receipt claim: informative and calm, but it must
   not be possible to scroll past without noticing it */
.txe-rcp-warn{margin-top:8px;padding:9px 11px;border-left:3px solid #c9a227;background:rgba(201,162,39,.09);border-radius:8px;font-size:12.5px;color:#6b5b1e;line-height:1.45}

/* (v0.21.0) archived-term banner: calm, but impossible to miss or lose */
.term-banner{display:none}
.term-banner.on{display:flex;align-items:center;gap:12px;flex-wrap:wrap;position:sticky;top:0;z-index:60;
  background:#f3ead6;border-bottom:1px solid #e0d2ae;padding:9px 18px;font-size:13px;color:#6b5b1e}
.term-banner-main{flex:1;min-width:180px}
.term-banner-ro{color:#8a7a45}
.term-row{align-items:center;gap:8px;flex-wrap:wrap}
.term-person{align-items:center;gap:10px;flex-wrap:wrap}
/* (v0.21.0 pass 2) the paused-wizard bar and the checklist links */
.term-paused.on{background:#e7f0ea;border-bottom-color:#c6dccd;color:#2f5a44}
.term-pending-link,.term-archive-link{width:100%;background:none;border:0;padding:8px 2px;text-align:left;cursor:pointer;
  font:inherit;color:inherit;display:flex;align-items:center;gap:8px}
.term-pending-link:hover,.term-archive-link:hover{background:var(--cream-deep)}
.term-pending-go{color:var(--ink-faint);font-size:18px;line-height:1}
.term-review-item{display:flex;flex-direction:column;align-items:flex-start;gap:2px;width:100%;text-align:left;
  cursor:pointer;margin-bottom:8px;font:inherit;color:inherit}
.term-review-item small{color:var(--ink-soft)}
.term-er-evidence{margin:10px 0 4px;padding:10px 12px;border:1px solid var(--line,#e6e1d4);border-radius:12px;background:var(--cream,#fbf8f1)}
/* (v0.21.0 pass 2) A CLOSED TERM LOOKS LIKE A RECORD, NOT A WORKSPACE.
   These rules only HIDE controls that the guards would refuse anyway —
   protection never depends on them. */
body:not(.term-viewing) .term-only{display:none!important}
body.term-viewing .live-only,
body.term-viewing [data-nav="home"],body.term-viewing [data-nav="calendar"],
body.term-viewing [data-nav="resources"],body.term-viewing [data-nav="settings"],
body.term-viewing [data-nav="expenses"],body.term-viewing #more-expenses,
body.term-viewing #er-new-btn,body.term-viewing #m-newmeeting-btn,
body.term-viewing [onclick^="openProjectForm"],body.term-viewing [onclick^="openPersonForm"],
body.term-viewing [onclick^="askArchive"],body.term-viewing [onclick^="unarchivePerson"],
body.term-viewing #screen-people .card:has(#wm-list),
body.term-viewing [data-res],body.term-viewing [data-acct],
body.term-viewing [data-fin]:not([data-fin="filter"]):not([data-fin="obhistory"]):not([data-fin="rcptoggle"]):not([data-fin="rcpgoto"]):not([data-fin="findtx"]):not([data-fin="goreceipts"]):not([data-fin="goreimb"]):not([data-fin="goexpenses"]):not([data-fin="toggle"]):not([data-fin="togglexcl"]):not([data-fin="reports"]):not([data-fin="goer"]),
body.term-viewing [data-er]:not([data-er="history"]):not([data-er="findone"]):not([data-er="ftoggle"]),
body.term-viewing [data-pact]:not([data-pact="togglearchived"]):not([data-pact="reflectiontogglehistory"]){display:none!important}
@media(max-width:560px){.term-person select{margin-left:0!important;max-width:100%!important;width:100%}}

/* ---- the printable report itself ---- */
.rep-scope{font-family:'Fraunces',serif;font-size:18px;margin:26px 0 4px;padding-top:14px;border-top:2px solid #e4e4e4}
.rep-runhead{float:right;font-weight:500;letter-spacing:0;text-transform:none;color:#8a8a8a;font-size:10px;max-width:60%;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rep-subh{font-size:13px;font-weight:700;color:#333;margin:14px 0 6px}
/* Wide tables scroll inside their own container so the PAGE never scrolls
   sideways on a phone — the requirement, and the same containment the app
   uses elsewhere for wide content. */
.rep-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
.rep-table{width:100%;border-collapse:collapse;font-size:12px;min-width:520px}
.rep-table.rep-sum{min-width:0}
.rep-table th,.rep-table td{border-bottom:1px solid #e8e8e8;padding:5px 7px;text-align:left;vertical-align:top}
.rep-table thead th{background:#f6f6f3;font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;color:#555;white-space:nowrap}
.rep-table .num,.rep-table th.num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.rep-table tr.rep-strong td,.rep-table tr.rep-strong th{font-weight:700;border-top:1.5px solid #bbb;border-bottom:none;background:#fafaf7}
.rep-file{font-size:10.5px;color:#777;overflow-wrap:anywhere}
.rep-note{font-size:11.5px;color:#666;margin-top:7px;line-height:1.45}
.rep-limit{border-left:2px solid #d8d8d0;padding-left:9px}
/* the after-the-period notice: informative, never alarming — it reports a
   correctness improvement, not a problem with the books */
.rep-late{border-left:2px solid #c9b98a;padding-left:9px;color:#6b5b33}
.rep-nochange{font-size:12px;color:#5b6b55;margin-top:10px}
.rep-ok{font-size:12px;color:#3f6b43;margin-top:8px;font-weight:600}
.rep-warn{font-size:12px;color:#9a5b1e;margin-top:8px;font-weight:600}
.rep-actions{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:22px}
.rep-actions .btn{flex:1 1 200px}
/* The report deliberately keeps .rec-paper's existing 760px column, the
   same as the Meeting Record and the printed agenda. Widening it was tried
   and reverted: .shell is a 222px + 1fr grid, and a paper wide enough for a
   twelve-column ledger pushes that track past the viewport, so the WHOLE
   PAGE scrolls sideways instead of the table. A wide table therefore stays
   inside its own .rep-scroll container — which is where horizontal
   scrolling belongs, and what the brief asks for. None of this touches
   print: the printed ledger has its own page geometry below and scrolls
   nowhere. */
@media(max-width:520px){
  .rep-table{font-size:11px}
  .rep-runhead{display:none}
}
@media print{
  .side,.bnav,.mtop,.no-print{display:none!important}
  .shell{display:block!important;max-width:none!important;padding:0!important;margin:0!important}
  #main{padding:0!important}
  .screen{display:none!important}
  #screen-meeting-record.on{display:block!important;padding:0!important}
  #screen-meeting-agenda.on{display:block!important;padding:0!important}
  #screen-finreport.on{display:block!important;padding:0!important}
  /* (v0.20.0) A financial report is mostly tables. On paper they must keep
     their heading on every page they run onto, must not be cut mid-row, and
     must never be a scroll container — the container that keeps a wide table
     inside the page on a phone would otherwise clip its right-hand columns. */
  .rep-scroll{overflow:visible!important;max-width:none!important}
  /* On paper a table can never scroll, so it must genuinely FIT. The wide
     ledgers are twelve and eleven columns; at their on-screen sizing they
     measure ~950px against an A4 content box of 178mm (~673px) and would be
     clipped. Releasing the nowrap on headings and text, tightening the
     padding and dropping to a ledger point size lets auto table layout
     compress them to the page. Money cells keep their nowrap so an amount
     is never split across two lines. */
  .rep-table{min-width:0!important;width:100%;font-size:9pt}
  .rep-table th,.rep-table td{padding:3px 5px;white-space:normal!important;overflow-wrap:break-word}
  .rep-table td.num{white-space:nowrap!important;overflow-wrap:normal}
  .rep-table th.num{white-space:normal!important}
  /* The two wide ledgers carry a <colgroup>; a fixed layout is what makes it
     binding, so the page decides the proportions rather than the longest
     word in each column. break-word (never anywhere) keeps Greek words
     whole — only a stored filename, which has no word boundaries to find,
     is allowed to break mid-token. */
  .rep-table.rep-fixed{table-layout:fixed}
  /* the first column of every fixed table is a date — never split it */
  .rep-table.rep-fixed td:first-child{white-space:nowrap!important}
  /* A wide section prints as RECORD BLOCKS, not as a table: twelve and
     eleven columns cannot fit 178mm of portrait page at a readable size in
     either language, and shrinking, clipping or dropping columns would all
     lose an auditor's data. Each record instead becomes a small block whose
     fields wrap down the page, where there is plenty of room. Every field
     the table shows is present in the block — both are generated from the
     SAME cells array (repDual), so one cannot silently lose a column. */
  .rep-wide .rep-scroll{display:none!important}
  .rep-wide .rep-blocks{display:block}
  .rep-file{overflow-wrap:anywhere}
  .rep-table thead{display:table-header-group}
  .rep-table tfoot{display:table-footer-group}
  .rep-table tr{break-inside:avoid;page-break-inside:avoid}
  .rep-table thead th{background:#f2f2f2!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  /* A whole report section is far too tall to keep on one page, so the
     blanket .rec-section break-inside:avoid above is released for them —
     individual rows and the signature block still travel intact. */
  #screen-finreport .rec-section{break-inside:auto;page-break-inside:auto}
  #screen-finreport .rep-scope{break-before:page;page-break-before:always;break-after:avoid}
  #screen-finreport .rep-scope:first-of-type{break-before:auto;page-break-before:auto}
  .rep-block{break-inside:avoid;page-break-inside:avoid;border-bottom:1px solid #dcdcdc;
    padding:4px 0 5px;font-size:9pt;line-height:1.35}
  .rep-block-head{display:flex;gap:8px;align-items:baseline;font-weight:700}
  .rep-block-date{white-space:nowrap;font-variant-numeric:tabular-nums;color:#333}
  .rep-block-title{flex:1;min-width:0;overflow-wrap:break-word}
  /* three fluid columns of the full page width: ~59mm each, so even
     Δραστηριότητα and its value sit on one line unbroken */
  .rep-block-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0 14px;margin-top:2px}
  .rep-block-f{display:flex;gap:5px;font-size:8.6pt;overflow-wrap:break-word;min-width:0}
  .rep-block-l{color:#666;white-space:nowrap}
  .rep-block-v{font-weight:500;min-width:0;overflow-wrap:break-word}
  .rep-block-total{border-bottom:none;border-top:1.5px solid #bbb;font-weight:700}
  .rep-tag{background:none!important;padding:0!important;color:#666!important;display:inline}
  .rep-runhead{color:#777!important}
  .rep-note,.rep-file{color:#555!important}
  .rec-paper{max-width:none;margin:0;padding:0;border:none;box-shadow:none;border-radius:0;background:#fff;color:#000}
  .rec-section,.rec-sig{break-inside:avoid;page-break-inside:avoid}
  .rec-h{break-after:avoid;page-break-after:avoid}
  /* A4 always has room for two signature columns, whatever the screen width
     was when the print was started */
  .rec-sig{grid-template-columns:1fr 1fr!important;gap:28px 64px!important}
  .rec-footer{color:#555!important}
  /* (v0.19.0) Each agenda item + its optional notes space travels together —
     a short item must never be split from its own blank lines across a page
     break, and a run of blank ruled lines must never orphan onto the next
     page by itself. */
  .ag-item{break-inside:avoid;page-break-inside:avoid}
  @page{size:A4;margin:16mm}
  /* (v0.20.0 QA pass) The named landscape page that used to carry the two
     wide ledgers is GONE, and with it the mixed-orientation dependency.
     Manual QA showed it is not portable: Microsoft Print to PDF kept a
     portrait sheet and rotated the content sideways on it, and Android
     Chrome ignored the named page altogether and clipped the tables off the
     right edge. Both produce an unusable document, and neither can be
     detected or worked around from CSS. The report is now consistently
     portrait everywhere; the wide sections reflow into record blocks
     instead (see .rep-blocks below). Nothing is rotated by transform or
     writing-mode either — that trades one unreadable output for another. */
}