/* VEYRA, Direction A "One Thread": indigo cloth, one thread-yellow accent. Dashed = draft or still to do. Solid = confirmed. */
:root{
  --deep:#14204A;--pri:#2F4A9A;--soft:#E4E9F5;--soft0:#F1F4FA;--mist:#C7D1EC;--thread:#F4C20D;
  --bg:#F5F6F8;--card:#FFFFFF;--ink:#14204A;--t2:#46527A;--t3:#5A668C;--line:#D5DAE8;--ctl:#7882A6;
  --btn:#243A7A;--onbtn:#FFFFFF;--yb:#14204A;--yink:#14204A;--navbg:#14204A;--navt:#C7D1EC;--navon:#FFFFFF;
  --done:#14204A;--ondone:#FFFFFF;--dash:#243A7A;--confbg:#14204A;--confink:#FFFFFF;
  --ok:#0F6B3F;--okbg:#E2F3E9;--warn:#7A4300;--warnbg:#FFEECB;--bad:#B3261E;--badbg:#FDE7E5;
  --disp:'Bricolage Grotesque','Arial Narrow',Arial,sans-serif;
  --ui:'IBM Plex Sans',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --deep:#0C122B;--pri:#AFC0F5;--soft:#1D2754;--soft0:#151D40;--mist:#BCC6E4;
  --bg:#0C122B;--card:#151D40;--ink:#F1F4FA;--t2:#BCC6E4;--t3:#A3AED3;--line:#2B3768;--ctl:#8591C4;
  --btn:#AFC0F5;--onbtn:#0C122B;--yb:#F4C20D;--yink:#0C122B;--navbg:#151D40;--navt:#BCC6E4;--navon:#FFFFFF;
  --done:#AFC0F5;--ondone:#0C122B;--dash:#AFC0F5;--confbg:#F1F4FA;--confink:#0C122B;
  --ok:#7FDDA6;--okbg:#11382A;--warn:#FFD38A;--warnbg:#3D2C0A;--bad:#FFB4AB;--badbg:#4A1614;color-scheme:dark}}
:root[data-theme="dark"]{
  --deep:#0C122B;--pri:#AFC0F5;--soft:#1D2754;--soft0:#151D40;--mist:#BCC6E4;
  --bg:#0C122B;--card:#151D40;--ink:#F1F4FA;--t2:#BCC6E4;--t3:#A3AED3;--line:#2B3768;--ctl:#8591C4;
  --btn:#AFC0F5;--onbtn:#0C122B;--yb:#F4C20D;--yink:#0C122B;--navbg:#151D40;--navt:#BCC6E4;--navon:#FFFFFF;
  --done:#AFC0F5;--ondone:#0C122B;--dash:#AFC0F5;--confbg:#F1F4FA;--confink:#0C122B;
  --ok:#7FDDA6;--okbg:#11382A;--warn:#FFD38A;--warnbg:#3D2C0A;--bad:#FFB4AB;--badbg:#4A1614;color-scheme:dark}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink)}
body{font-family:var(--ui);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}
h1,h2,h3,p{margin:0}
button{font:inherit;color:inherit;cursor:pointer}
a{color:inherit}
:focus-visible{outline:3px solid var(--pri);outline-offset:2px}
svg.i{width:24px;height:24px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
svg.i.s{width:18px;height:18px}
.num{font-variant-numeric:tabular-nums}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* shell: phone first. From 960px a left sidebar replaces the bottom bar. */
#app{min-height:100dvh;display:flex;flex-direction:column}
#side{display:none}
#main{flex:1;display:flex;flex-direction:column;width:100%;max-width:640px;margin:0 auto;padding-bottom:84px}
#main.noNav{padding-bottom:0}
.nav{position:fixed;left:0;right:0;bottom:0;z-index:20;background:var(--navbg);display:grid;grid-auto-flow:column;grid-auto-columns:1fr;padding:6px 8px calc(10px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--line)}
.nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:56px;color:var(--navt);font-size:12px;font-weight:500;text-decoration:none;position:relative}
.nav a.on{color:var(--navon);font-weight:600}
.nav a.on::before{content:"";position:absolute;top:0;width:26px;height:4px;border-radius:4px;background:var(--thread)}
.top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:calc(20px + env(safe-area-inset-top,0px)) 20px 10px}
.biz{font-family:var(--disp);font-weight:650;font-size:20px;letter-spacing:-.01em;line-height:1.15}
.biz small{display:block;font-family:var(--ui);font-weight:400;font-size:14px;letter-spacing:0;color:var(--t2);margin-top:2px}
.scr{padding:8px 20px 28px;display:flex;flex-direction:column;gap:16px}
.h1{font-family:var(--disp);font-weight:700;font-size:34px;line-height:1.05;letter-spacing:-.025em;text-wrap:balance}
.h2{font-family:var(--disp);font-weight:650;font-size:20px;line-height:1.15;letter-spacing:-.015em}
.lead{font-size:16px;line-height:1.5;color:var(--t2)}
.cap{font-size:14px;line-height:1.4;color:var(--t2)}
.lbl{font-size:14px;font-weight:600;line-height:1.3}
.row{display:flex;align-items:center;gap:12px}
.between{display:flex;align-items:center;justify-content:space-between;gap:12px}
.col{display:flex;flex-direction:column}.g4{gap:4px}.g8{gap:8px}.g12{gap:12px}
.wrap{flex-wrap:wrap}
.back{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:var(--card);border:1.5px solid var(--ctl);color:var(--ink);flex:none}
.ttl{font-family:var(--disp);font-weight:700;font-size:24px;letter-spacing:-.02em;line-height:1.1}

/* buttons */
.btn{display:flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:0 20px;border-radius:14px;border:2px solid transparent;font-size:16px;font-weight:600;line-height:1.2;text-decoration:none;text-align:center;background:none;font-family:var(--ui)}
.btn.p{background:var(--btn);color:var(--onbtn)}
.btn.y{background:var(--thread);color:var(--yink);border-color:var(--yb)}
.btn.o{background:var(--card);color:var(--ink);border-color:var(--ctl)}
.btn.g{color:var(--pri);min-height:44px;padding:0 8px;text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:2px}
.btn.off,.btn[disabled]{background:var(--soft);color:var(--t3);border-color:var(--soft);cursor:not-allowed}
.btn.sm{min-height:44px;padding:0 16px;font-size:16px}
.btn.w{width:100%}
.btn.danger{background:var(--card);color:var(--bad);border-color:var(--bad)}

/* fields */
.field{display:flex;flex-direction:column;gap:6px}
.field .in,.field input[type=text],.field input[type=email],.field input[type=password],.field input[type=tel],.field input[type=number],.field input[type=date],.field input[type=time],.field input[type=search],.field textarea{width:100%;min-height:52px;display:flex;align-items:center;padding:0 14px;background:var(--card);border:1.5px solid var(--ctl);border-radius:12px;font:inherit;font-size:16px;color:var(--ink)}
.field input[type=date],.field input[type=time]{-webkit-appearance:none;appearance:none;min-width:0;max-width:100%;box-sizing:border-box;text-align:left;justify-content:flex-start;font:inherit;color:var(--ink,inherit)}
.field input[type=date]::-webkit-date-and-time-value,.field input[type=time]::-webkit-date-and-time-value{text-align:left;margin:0;min-height:1.2em}
.field input[type=date]::-webkit-calendar-picker-indicator,.field input[type=time]::-webkit-calendar-picker-indicator{opacity:.6}
.field{min-width:0}
.field textarea{padding:12px 14px;min-height:84px;resize:vertical;line-height:1.4}
.field input:focus,.field textarea:focus{border-color:var(--pri);outline:3px solid var(--pri);outline-offset:2px}
.field.err input,.field.err textarea{border-color:var(--bad);border-width:2px}
.field .hint{font-size:14px;color:var(--t2);line-height:1.35}
.errt{display:flex;gap:6px;align-items:flex-start;font-size:14px;line-height:1.35;color:var(--bad);font-weight:500}
.phonef{display:flex;gap:8px}
.phonef .cc{flex:0 0 84px;width:84px}
.phonef .nn{flex:1;min-width:0}
.pre{display:flex;align-items:center;gap:8px;background:var(--card);border:1.5px solid var(--ctl);border-radius:12px;padding:0 14px}
.pre span{font-weight:600}
.pre input{border:0!important;outline:0!important;padding:0!important;min-height:50px!important;background:none!important;flex:1;min-width:0;box-shadow:none!important}
.pre:focus-within{border-color:var(--pri);outline:3px solid var(--pri);outline-offset:2px}
.field.err .pre{border-color:var(--bad);border-width:2px}

/* chips: icon and words, never colour alone */
.chip{display:inline-flex;align-items:center;gap:6px;min-height:30px;padding:0 11px 0 9px;border-radius:999px;font-size:14px;font-weight:600;line-height:1;white-space:nowrap}
.chip svg.i{width:16px;height:16px;stroke-width:2.4}
.chip.draft{border:1.5px dashed var(--pri);color:var(--ink)}
.chip.saved{background:var(--okbg);color:var(--ok)}
.chip.conf{background:var(--confbg);color:var(--confink)}
.chip.warn{background:var(--warnbg);color:var(--warn)}
.chip.bad{background:var(--badbg);color:var(--bad)}
.chip.quiet{background:var(--soft);color:var(--ink)}
.chips{display:flex;gap:6px;flex-wrap:wrap}

/* cards: solid edge is a confirmed record, dashed edge is a draft on this device */
.card{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:16px}
.card.draft{background:transparent;border:2px dashed var(--pri)}
.card.ind{background:var(--deep);border-color:var(--deep);color:#fff}
a.card,button.card{display:block;width:100%;text-align:left;text-decoration:none;color:inherit}
.divider{height:0;border-top:1px solid var(--line)}
.divider.dash{border-top:2px dashed var(--mist)}
.kv{display:flex;justify-content:space-between;gap:16px;padding:10px 0;font-size:16px}
.kv+.kv{border-top:1px solid var(--line)}
.kv span:first-child{color:var(--t2)}.kv span:last-child{font-weight:600;text-align:right}

/* stage rail: done = solid stitch, to do = running stitch, current = thread-yellow knot */
.stages{display:grid;grid-auto-flow:column;grid-auto-columns:1fr}
.st{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;font-size:14px;line-height:1.25;color:var(--t2)}
.st .dot{position:relative;z-index:2;width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--card);border:2px dashed var(--dash)}
.st::before,.st::after{content:"";position:absolute;top:11px;height:0;width:50%;border-top:3px dashed var(--dash);z-index:1}
.st::before{left:0}.st::after{right:0}
.st:first-child::before,.st:last-child::after{display:none}
.st.done{color:var(--ink);font-weight:600}
.st.done .dot{background:var(--done);border:2px solid var(--done);color:var(--ondone)}
.st.done::before,.st.done::after{border-top-style:solid;border-color:var(--done)}
.st.cur{color:var(--ink);font-weight:700}
.st.cur .dot{background:var(--thread);border:3px solid var(--yb);width:28px;height:28px;margin-top:-2px}
.st.cur::before{border-top-style:solid;border-color:var(--done)}
.st .dot svg.i{width:14px;height:14px;stroke-width:3}
.on-ind .st{color:var(--mist)}
.on-ind .st .dot{background:var(--deep);border-color:var(--mist)}
.on-ind .st::before,.on-ind .st::after{border-color:var(--mist)}
.on-ind .st.done{color:#fff}
.on-ind .st.done .dot{background:#fff;color:#14204A;border-color:#fff}
.on-ind .st.done::before,.on-ind .st.done::after{border-color:#fff}
.on-ind .st.cur{color:#fff}
.on-ind .st.cur .dot{background:var(--thread);border-color:#fff}
.on-ind .st.cur::before{border-color:#fff}
.small-rail .st{font-size:12px}

/* lists */
.li{display:flex;align-items:center;gap:12px;min-height:64px;padding:10px 0;text-decoration:none;color:inherit;width:100%;background:none;border:0;text-align:left}
.li+.li,.li+a.li,a.li+.li{border-top:1px solid var(--line)}
.li .main{flex:1;min-width:0}
.li .t{font-size:16px;font-weight:600;line-height:1.3}
.li .s{font-size:14px;color:var(--t2);line-height:1.35}
.amt{font-size:16px;font-weight:600;font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.avatar{width:44px;height:44px;border-radius:50%;background:var(--soft);color:var(--ink);display:flex;align-items:center;justify-content:center;font-family:var(--disp);font-weight:700;font-size:16px;flex:none}
.seg{display:inline-flex;background:var(--soft);border-radius:14px;padding:4px;gap:4px}
.seg button{border:0;background:none;min-height:44px;padding:0 16px;border-radius:10px;font-size:16px;font-weight:600;color:var(--t2)}
.seg button.on{background:var(--card);color:var(--ink)}
.pills{display:flex;gap:8px;flex-wrap:wrap}
.pill{white-space:nowrap;display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 16px;border-radius:999px;border:1.5px solid var(--ctl);background:var(--card);font-size:16px;font-weight:500;color:var(--ink)}
.pill.on{background:var(--deep);color:#fff;border-color:var(--deep)}
:root[data-theme="dark"] .pill.on{background:var(--pri);color:#0C122B;border-color:var(--pri)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .pill.on{background:var(--pri);color:#0C122B;border-color:var(--pri)}}
.note{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:14px;background:var(--soft0);color:var(--ink);font-size:14px;line-height:1.4}
.note svg{margin-top:1px}
.note.warn{background:var(--warnbg);color:var(--warn)}.note.bad{background:var(--badbg);color:var(--bad)}.note.ok{background:var(--okbg);color:var(--ok)}
.foot{position:sticky;bottom:0;margin-top:auto;display:flex;gap:12px;padding:14px 20px calc(16px + env(safe-area-inset-bottom,0px));background:var(--card);border-top:1px solid var(--line)}
.foot .btn{flex:1}.foot .btn.o{flex:0 0 112px}
.bigcount{font-family:var(--disp);font-weight:700;font-size:34px;letter-spacing:-.03em;line-height:1}
.tile{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px 12px;display:flex;flex-direction:column;align-items:center;gap:2px;min-width:0}
.tile span{font-size:14px;color:var(--t2);text-align:center}
.grid{display:grid;gap:8px}
.ev{position:relative;border-left:3px solid var(--done);padding:0 0 14px 16px;margin-left:6px}
.ev:last-child{padding-bottom:0}
.ev::before{content:"";position:absolute;left:-8px;top:4px;width:13px;height:13px;border-radius:50%;background:var(--done)}
.ev b{display:block;font-size:16px}.ev span{font-size:14px;color:var(--t2)}
.bt{display:flex;flex-direction:column;align-items:flex-start;gap:8px;text-align:left;padding:16px;background:var(--card);border:1.5px solid var(--ctl);border-radius:20px;min-height:132px}
.bt .ic{width:44px;height:44px;border-radius:12px;background:var(--soft);display:flex;align-items:center;justify-content:center}
.bt .n{font-family:var(--disp);font-weight:650;font-size:20px;letter-spacing:-.01em}
.bt .d{font-size:14px;line-height:1.35;color:var(--t2)}
.bt[aria-pressed=true]{border-color:var(--pri);outline:3px solid var(--pri);outline-offset:2px;background:var(--soft0)}
.ink{background:var(--deep);color:#fff}
.signin{background:var(--deep);color:#fff;min-height:100dvh}
.signin .scr{padding-top:12px}
.signin .field .in,.signin .pre{background:#fff;color:#14204A}
.signin .pre input,.signin .pre span{color:#14204A}
.signin .field input{color:#14204A}
.signin .lead,.signin .cap,.signin .field .hint{color:var(--mist)}
.signin .lbl{color:#fff}
.signin .errt{color:#FFB4AB}
.signin .btn.o{background:transparent;color:#fff;border-color:var(--mist)}
.signin .btn.off{background:#1B2B63;color:var(--mist);border-color:#1B2B63}
.signin .bt{background:#1B2B63;border-color:#4A5FA3;color:#fff}
.signin .bt .ic{background:#243A7A;color:#fff}
.signin .bt .d{color:var(--mist)}
.signin .bt[aria-pressed=true]{background:#243A7A;border-color:var(--thread);outline-color:var(--thread)}
.signin .note{background:#1B2B63;color:#fff}
.receipt{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:24px 22px 20px;display:flex;flex-direction:column;gap:14px}
.receipt .r{display:flex;justify-content:space-between;gap:12px;font-size:16px;padding:4px 0}
.receipt .r span:first-child{color:var(--t2)}.receipt .r span:last-child{font-weight:600;text-align:right}
#toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(92px + env(safe-area-inset-bottom,0px));z-index:40;background:var(--deep);color:#fff;border:2px solid var(--thread);border-radius:14px;padding:12px 18px;font-weight:600;font-size:16px;max-width:calc(100% - 32px);opacity:0;pointer-events:none;transition:opacity .15s}
#toast.on{opacity:1}
@media (prefers-reduced-motion:reduce){#toast{transition:none}}

@media (min-width:960px){
  #app{flex-direction:row}
  #side{display:flex;flex-direction:column;gap:28px;flex:0 0 264px;background:var(--navbg);color:#fff;padding:28px 16px 24px;position:sticky;top:0;height:100dvh}
  #side nav{display:flex;flex-direction:column;gap:4px}
  #side a.it{position:relative;display:flex;align-items:center;gap:14px;min-height:48px;padding:0 16px;border-radius:12px;color:var(--navt);text-decoration:none;font-size:16px;font-weight:500}
  #side a.it.on{background:rgba(255,255,255,.1);color:#fff;font-weight:600}
  #side a.it.on::before{content:"";position:absolute;left:-16px;top:12px;width:6px;height:24px;border-radius:0 6px 6px 0;background:var(--thread)}
  #main{max-width:760px;padding-bottom:0;margin:0 auto}
  .nav{display:none}
  #toast{bottom:32px}
  .foot{position:static;border:0;background:none;padding:0 20px 28px}
}
.card.ind{background:#14204A;border-color:#14204A}
:root[data-theme="dark"] .card.ind{background:#1D2754;border-color:#2B3768}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .card.ind{background:#1D2754;border-color:#2B3768}}
.card.ind .cap{color:var(--mist)}
[hidden]{display:none!important}
html.si,html.si body{background:var(--deep)}

.receipt.rc{padding:0;gap:0;overflow:hidden;border-radius:14px}
.rc-band{background:#14204A;color:#fff;padding:18px 18px 16px;display:flex;align-items:center;gap:12px}
.rc-bar{height:5px;background:var(--thread)}
.rc-logo{flex:none;width:64px;height:64px;border-radius:12px;background:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden}
.rc-logo img{max-width:52px;max-height:52px;object-fit:contain}
.rc-name{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.rc-name b{font-size:20px;line-height:1.2;overflow-wrap:anywhere}
.rc-name small{font-size:14px;color:#C7D1EC;overflow-wrap:anywhere}
.rc-t{text-align:right;display:flex;flex-direction:column;gap:2px;flex:none}
.rc-t b{font-size:20px;color:var(--thread)}.rc-t span{font-size:14px;color:#fff}
.rc-body{padding:18px;display:flex;flex-direction:column;gap:14px}
.rc-sum{display:flex;justify-content:space-between;align-items:center;gap:10px}
.rc-stamp{font-weight:800;font-size:20px;border:3px solid;border-radius:10px;padding:6px 12px;transform:rotate(-4deg)}
.rc-stamp.paid{color:var(--ok)}.rc-stamp.owe{color:var(--warn)}
.rc-amt{text-align:right;display:flex;flex-direction:column}.rc-amt span{font-size:14px;color:var(--t2)}.rc-amt b{font-size:28px;color:var(--ink)}
.rc-h{display:flex;justify-content:space-between;background:var(--soft);color:var(--ink);font-weight:700;font-size:14px;padding:8px 12px;border-radius:8px;margin-bottom:4px}
.rc-bank{display:flex;flex-direction:column;gap:2px;border:2px solid var(--pri);background:var(--soft0);border-radius:12px;padding:12px 14px;color:var(--ink)}
.rc-bank b{font-size:24px;letter-spacing:.04em}
.rc-band{flex-wrap:wrap;row-gap:12px}
.rc-t{order:-1;flex:0 0 100%;flex-direction:row;justify-content:space-between;align-items:baseline;border-bottom:1px solid rgba(255,255,255,.22);padding-bottom:10px}
/* dashboard */
.db{gap:18px}
.db-hero{position:relative;background:#14204A;color:#fff;border-radius:22px;padding:22px 20px 34px;display:flex;flex-direction:column;gap:12px;overflow:hidden}
.db-date{font-size:14px;color:#C7D1EC}
.db-hi{font-family:var(--disp);font-size:28px;line-height:1.1;letter-spacing:-.02em;margin:0;font-weight:700;overflow-wrap:anywhere}
.db-lead{margin:0;font-size:16px;line-height:1.4;color:#E4E9F5;max-width:34ch}
.db-ghost{background:transparent;color:#fff;border:1.5px solid #8C9AD0}
.db-thread{position:absolute;left:0;right:0;bottom:14px;height:0;border-top:3px dashed var(--thread);opacity:.9}
.db-thread::after{content:"";position:absolute;right:20px;top:-8px;width:13px;height:13px;border-radius:50%;background:var(--thread)}
.db-big{font-family:var(--disp);font-size:40px;line-height:1;letter-spacing:-.03em;color:var(--ink)}
.db-chart{width:100%;height:auto;display:block}
.db-bp{fill:var(--mist)}.db-bt{fill:var(--thread)}.db-b0{fill:var(--line)}
.db-bv{font-size:12px;font-weight:700;fill:var(--ink)}
.db-bl{font-size:12px;fill:var(--t2)}.db-bl.on{font-weight:800;fill:var(--ink)}
.db-two{display:grid;grid-template-columns:1fr 1fr;gap:12px;border-top:1px solid var(--line);padding-top:12px}
.db-two div{display:flex;flex-direction:column;gap:2px}.db-two b{font-size:20px;color:var(--ink)}
.db-track{height:12px;border-radius:8px;background:var(--line);overflow:hidden}.db-track i{display:block;height:100%;background:var(--pri);border-radius:8px}
.db-track.thin{height:8px}
.db-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.db-tile{text-align:left;font:inherit;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px;display:flex;flex-direction:column;gap:2px;color:var(--ink);cursor:pointer;min-height:44px}
.db-tile b{font-family:var(--disp);font-size:34px;line-height:1;letter-spacing:-.03em}
.db-tile span{font-weight:600;font-size:16px;margin-top:4px}.db-tile small{font-size:14px;color:var(--t2)}
.db-tile.bad{border:2px solid var(--bad)}.db-tile.bad b{color:var(--bad)}
.db-tile.warn{border:2px solid var(--thread)}
.db-pipe{display:flex;gap:3px;height:22px}.db-pipe .p{display:block;background:var(--pri);border-radius:6px}.db-pipe .p.last{background:var(--thread)}
.db-leg{display:flex;flex-wrap:wrap;gap:8px 16px;font-size:14px;color:var(--t2)}.db-leg span{display:inline-flex;align-items:center;gap:6px}.db-leg b{color:var(--ink)}
.db-leg .sw{width:12px;height:12px;border-radius:4px;background:var(--pri);display:inline-block}.db-leg .sw.last{background:var(--thread)}
.db-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:12px}.db-stats div{display:flex;flex-direction:column;gap:2px}.db-stats b{font-family:var(--disp);font-size:28px;color:var(--ink);letter-spacing:-.02em}
.nav a{font-size:12px;letter-spacing:-.01em;min-width:0}.nav{padding-left:4px;padding-right:4px}

/* bell, notifications, switch */
.bell{position:relative;width:48px;height:48px;border-radius:50%;border:1.5px solid var(--ctl);background:var(--card);color:var(--ink);display:inline-flex;align-items:center;justify-content:center;flex:none;cursor:pointer}
.bell .bd{position:absolute;top:-4px;right:-4px;min-width:22px;height:22px;padding:0 5px;border-radius:11px;background:#B3261E;color:#fff;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;border:2px solid var(--bg)}
.db-bell{position:absolute;top:14px;right:14px;background:transparent;color:#fff;border-color:#8C9AD0}
.db-bell .bd{border-color:#14204A}
.db-hero .db-date{padding-right:60px}
.nt-ic{width:44px;height:44px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;flex:none;background:var(--soft);color:var(--ink)}
.nt-ic.bad{background:#FBE3E1;color:#9B1C12}.nt-ic.warn{background:#FFF1C2;color:#6B4A00}.nt-ic.ok{background:#DDF3E4;color:#1B6B3A}
.li.nt.rd .t{font-weight:500;color:var(--t2)}
.li .dot{width:10px;height:10px;border-radius:50%;background:var(--pri);flex:none}
.sw{position:relative;width:56px;height:34px;border-radius:17px;border:0;background:var(--ctl);flex:none;cursor:pointer;padding:0;transition:background .15s}
.sw i{position:absolute;top:3px;left:3px;width:28px;height:28px;border-radius:50%;background:#fff;transition:transform .15s}
.sw[aria-checked=true]{background:var(--btn)}.sw[aria-checked=true] i{transform:translateX(22px)}
.sw:focus-visible{outline:3px solid var(--pri);outline-offset:2px}
@media (prefers-reduced-motion:reduce){.sw,.sw i{transition:none}}
/* more */
.mo-prof{display:flex;align-items:center;gap:14px;width:100%;text-align:left;font:inherit;background:#14204A;color:#fff;border:0;border-radius:20px;padding:18px;cursor:pointer}
.mo-prof .main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.mo-prof b{font-family:var(--disp);font-size:20px;line-height:1.2;overflow-wrap:anywhere}.mo-prof .main span{font-size:14px;color:#C7D1EC}
.mo-av{width:60px;height:60px;border-radius:18px;background:var(--thread);color:#14204A;display:flex;align-items:center;justify-content:center;font-family:var(--disp);font-weight:800;font-size:24px;flex:none;overflow:hidden}
.mo-av.img{background:#fff}.mo-av img{max-width:48px;max-height:48px;object-fit:contain}
.mo-edit{font-size:14px;font-weight:700;color:var(--thread);flex:none}
.mo-gt{font-size:16px;font-weight:700;color:var(--t2);margin:0 4px}
.mo-card{padding:2px 16px}
.mo-ic{width:40px;height:40px;border-radius:12px;background:var(--soft);color:var(--ink);display:inline-flex;align-items:center;justify-content:center;flex:none}
.mo-seg{display:flex;align-items:center;gap:12px;padding:10px 0}
.mo-row.danger .t{color:var(--bad)}.mo-row.danger .mo-ic{background:#FBE3E1;color:var(--bad)}
.db-bell.db-more{right:70px}
.db-hero .db-date{padding-right:130px}

.nav a{font-size:12px}
.db-chart{max-height:176px}
.sw{width:64px;height:44px;border-radius:22px}
.sw i{top:4px;left:4px;width:36px;height:36px}
.sw[aria-checked=true] i{transform:translateX(20px)}
@media (max-width:359px){.nav a{font-size:11px;letter-spacing:-.02em}.nav{padding-left:2px;padding-right:2px}}

/* sign-in: navy top, light sheet */
.si-wrap{min-height:100dvh;display:flex;flex-direction:column;background:var(--deep);max-width:560px;margin:0 auto}
.signin.si-top{position:relative;min-height:0;display:flex;flex-direction:column;gap:22px;padding:calc(28px + env(safe-area-inset-top,0px)) 20px 44px}
.si-h{font-size:34px;color:#fff;line-height:1.08}
.signin .lead{margin:0;font-size:16px;line-height:1.45;color:var(--mist)}
.si-thread{position:absolute;left:0;right:0;bottom:22px;border-top:3px dashed var(--thread)}
.si-thread::after{content:"";position:absolute;right:24px;top:-8px;width:13px;height:13px;border-radius:50%;background:var(--thread)}
.si-sheet{flex:1;background:var(--bg);color:var(--ink);border-radius:28px 28px 0 0;margin-top:-12px;position:relative;padding:28px 20px calc(28px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:18px}
.si-sheet .btn.off{background:var(--soft);color:var(--t2);border-color:var(--soft)}
@media (min-width:700px){.si-wrap{margin-top:40px;min-height:auto;border-radius:28px;overflow:hidden}.si-sheet{margin-top:0;border-radius:0}}
/* dark mode: lift navy cards off the page */
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .db-hero,:root:not([data-theme="light"]) .mo-prof{background:#1B2A66;box-shadow:inset 0 0 0 1.5px #3D4E96}}
:root[data-theme="dark"] .db-hero,:root[data-theme="dark"] .mo-prof{background:#1B2A66;box-shadow:inset 0 0 0 1.5px #3D4E96}

/* In-app banner shown once a day when the app opens */
.nbanner{position:fixed;left:12px;right:12px;top:calc(10px + env(safe-area-inset-top,0px));max-width:520px;margin:0 auto;z-index:50;background:#14204A;color:#fff;border:1px solid rgba(255,255,255,.18);border-bottom:3px solid var(--thread);border-radius:18px;padding:14px 14px 12px;box-shadow:0 0 0 3px #fff,0 12px 32px rgba(8,12,40,.4);transform:translateY(-130%);opacity:0;transition:transform .25s ease,opacity .2s}
.nbanner.on{transform:none;opacity:1}
.nb-h{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:17px}
.nb-x{width:44px;height:44px;margin:-8px -8px -8px 0;border:0;background:transparent;color:#fff;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;cursor:pointer}
.nb-l{list-style:none;margin:2px 0 8px;padding:0;display:flex;flex-direction:column}
.nb-i{display:flex;gap:10px;align-items:flex-start;width:100%;min-height:48px;text-align:left;background:transparent;border:0;border-top:1px solid rgba(255,255,255,.14);color:#fff;padding:10px 0;font:inherit;cursor:pointer}
.nb-t{display:flex;flex-direction:column;gap:2px;min-width:0;overflow-wrap:anywhere}.nb-t b{font-weight:600}.nb-t span{font-size:14px;color:#C9D2F0}
.nb-d{flex:none;width:12px;height:12px;border-radius:50%;margin-top:5px;background:#9BE0B2}.nb-d.bad{background:#FF9A92}.nb-d.warn{background:var(--thread)}
.nb-f{display:flex;gap:8px;flex-wrap:wrap}.nb-f .btn{flex:1 1 auto}
.nbanner .nb-dis{color:#fff;border:1.5px solid rgba(255,255,255,.55);text-decoration:none;padding:0 18px}
:root[data-theme=dark] .nbanner{background:#1F2C6B}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .nbanner{background:#1F2C6B}}
@media (prefers-reduced-motion:reduce){.nbanner{transition:none}}
:root[data-theme=dark] .nbanner{box-shadow:0 12px 32px rgba(0,0,0,.5)}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .nbanner{box-shadow:0 12px 32px rgba(0,0,0,.5)}}

/* Sign-in: log in or create, accounts on this phone, restore */
.si-seg{display:flex;width:100%}.si-seg button{flex:1}
.si-acct{display:flex;align-items:center;gap:12px;width:100%;min-height:64px;padding:12px 14px;background:var(--card);border:1px solid var(--line);border-radius:16px;color:var(--ink);text-align:left;font:inherit;cursor:pointer}
.si-acct .ic{flex:none;width:40px;height:40px;border-radius:12px;background:var(--soft);display:inline-flex;align-items:center;justify-content:center;color:var(--pri)}
.si-acct b{font-size:17px;overflow-wrap:anywhere}.si-acct .num{font-size:14px;color:var(--t2)}
.si-rest{border-top:1px solid var(--line);padding-top:14px}.si-rest summary{min-height:44px;display:flex;align-items:center;font-weight:600;color:var(--pri);cursor:pointer}

/* Books: profit summary and expense breakdown */
.bk-three{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.bk-three>div{display:flex;flex-direction:column;gap:2px;min-width:0}
.bk-three b{font-size:18px;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.bk-three b.pos{color:var(--ok)}.bk-three b.neg{color:var(--bad)}
.bk-bar{height:8px;border-radius:99px;background:var(--soft);overflow:hidden}.bk-bar i{display:block;height:100%;background:var(--pri);border-radius:99px}

/* Dropdown matching the text inputs */
.sel{position:relative}
.sel select{width:100%;min-height:52px;padding:0 44px 0 14px;background:var(--card);border:1.5px solid var(--ctl);border-radius:12px;font:inherit;font-size:16px;color:var(--ink);-webkit-appearance:none;appearance:none;cursor:pointer}
.sel select:invalid,.sel select option[value=""]{color:var(--t2)}
.sel .i{position:absolute;right:14px;top:50%;transform:translateY(-50%) rotate(90deg);pointer-events:none;color:var(--t2)}
.sel select:focus{border-color:var(--pri);outline:3px solid var(--pri);outline-offset:2px}
.field.err .sel select{border-color:var(--bad)}

/* Expenses list: grouped by day, date and time visible on every row */
.bk-dh{display:flex;justify-content:space-between;align-items:baseline;gap:8px;padding:0 4px 6px;color:var(--t2);font-size:15px}
.bk-dh b{color:var(--ink)}
.bk-list{padding:0}
.bk-row{display:flex;gap:12px;align-items:flex-start;width:100%;padding:14px 16px;background:transparent;border:0;border-top:1px solid var(--line);text-align:left;font:inherit;color:var(--ink);cursor:pointer;min-height:64px}
.bk-list .bk-row:first-child{border-top:0}
.bk-ic{flex:none;width:36px;height:36px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;background:var(--soft);color:var(--pri)}
.bk-ic.m-pos{background:#FFF4CC;color:#6B5200}.bk-ic.m-transfer{background:#E3F2EA;color:#0F6B3F}
.bk-main{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.bk-top{display:flex;justify-content:space-between;gap:8px}.bk-top b:first-child{overflow-wrap:anywhere}
.bk-meta{font-size:14px;color:var(--t2)}
.bk-note{font-size:15px;color:var(--ink);background:var(--soft);border-radius:8px;padding:4px 8px;align-self:flex-start;overflow-wrap:anywhere}
:root[data-theme=dark] .bk-ic.m-pos{background:#3A3210;color:#F4C20D}:root[data-theme=dark] .bk-ic.m-transfer{background:#14321F;color:#7FD4A0}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .bk-ic.m-pos{background:#3A3210;color:#F4C20D}:root:not([data-theme=light]) .bk-ic.m-transfer{background:#14321F;color:#7FD4A0}}

/* Dashboard makeover: quick actions, set-up list, profit card, in/out week */
.db-quick{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.db-quick button{min-height:76px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;background:var(--card);border:1px solid var(--line);border-radius:16px;color:var(--ink);font:inherit;font-size:13px;font-weight:500;cursor:pointer;padding:6px 2px}
.db-quick button .i{color:var(--pri);width:22px;height:22px}
.db-quick button span{overflow-wrap:normal;word-break:normal;text-align:center}
.db-tile.hi{border:2px solid var(--thread);background:var(--hibg,#FFFBEA)}
.db-tile.owe small{color:var(--warn);font-weight:600}
.db-setup{gap:4px}.db-setup .h2{margin:0}
.db-step{display:flex;align-items:center;gap:12px;min-height:52px;width:100%;background:transparent;border:0;border-top:1px solid var(--line);font:inherit;color:var(--ink);text-align:left;cursor:pointer;padding:0}
.db-step .t{flex:1;font-size:15px}.db-step.done .t{color:var(--t2);text-decoration:line-through}
.db-ck{flex:none;width:26px;height:26px;border-radius:50%;border:2px dashed var(--mist);display:inline-flex;align-items:center;justify-content:center}
.db-step.done .db-ck{border:0;background:var(--ok);color:#fff}.db-step.done .db-ck .i{width:14px;height:14px}
.db-step.done .cap{margin:0;color:var(--ok);font-weight:600}
.db-pbig{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.db-pbig b{font-family:var(--disp);font-size:44px;line-height:1;letter-spacing:-.03em;color:var(--ink)}
.db-pbig b.pos{color:var(--ok)}.db-pbig b.neg{color:var(--bad)}
.db-io{height:12px;border-radius:99px;background:var(--soft);overflow:hidden}.db-io i{display:block;height:100%;border-radius:99px}
.db-io i.in,.db-legend i.in{background:var(--pri)}.db-io i.out,.db-legend i.out{background:var(--thread)}
.db-pfoot{border-top:1px solid var(--line);padding-top:10px;align-items:center}
.db-legend{display:flex;gap:16px;flex-wrap:wrap;font-size:14px;color:var(--t2)}.db-legend span{display:inline-flex;align-items:center;gap:6px}.db-legend i{width:10px;height:10px;border-radius:3px;display:inline-block}
.db-bin{fill:var(--pri)}.db-bout{fill:var(--thread)}
.db-tag{font-size:13px;color:var(--t2);background:var(--soft);border-radius:99px;padding:3px 10px;white-space:nowrap}
.db-dash{border:2px dashed var(--mist);border-radius:20px;padding:16px 18px}
.db-goal{display:flex;justify-content:space-between;align-items:center;gap:12px}
:root[data-theme=dark] .db-tile.hi{--hibg:#2E2A12}:root[data-theme=dark] .db-bin{fill:#8EA4F0}:root[data-theme=dark] .db-io i.in,:root[data-theme=dark] .db-legend i.in{background:#8EA4F0}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .db-tile.hi{--hibg:#2E2A12}:root:not([data-theme=light]) .db-bin{fill:#8EA4F0}:root:not([data-theme=light]) .db-io i.in,:root:not([data-theme=light]) .db-legend i.in{background:#8EA4F0}}
.db-goal .btn{white-space:nowrap;flex:none}
.db-pfoot .btn{white-space:nowrap;flex:none}.db-pfoot>span{min-width:0}

/* Payments that can be removed, edit flows */
.pay-row{align-items:center;gap:8px}.pay-row>span:first-child{flex:1;min-width:0}
.pay-x{flex:none;width:44px;height:44px;margin:-8px -10px -8px 0;border:0;background:transparent;color:var(--t2);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.pay-x:hover,.pay-x:focus-visible{color:var(--bad);background:var(--badbg)}

/* PIN lock */
.pin-wrap{min-height:100dvh;background:var(--deep);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;padding:32px 20px calc(24px + env(safe-area-inset-bottom,0px));box-sizing:border-box}
.pin-top{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center}
.pin-top h1{margin:8px 0 0;font-family:var(--disp);font-size:26px;overflow-wrap:anywhere}.pin-top p{margin:0;color:#C7D1EC}
.pin-dots{display:flex;gap:16px;justify-content:center;margin:8px 0}.pin-dots i{width:16px;height:16px;border-radius:50%;border:2px solid var(--thread)}.pin-dots i.on{background:var(--thread)}
.pin-err{min-height:22px;color:#FFB4AB;margin:0}
.pin-pad{display:grid;grid-template-columns:repeat(3,72px);gap:14px 22px;justify-content:center}
.pin-pad button{width:72px;height:72px;border-radius:50%;border:1.5px solid rgba(255,255,255,.3);background:rgba(255,255,255,.06);color:#fff;font:600 26px var(--disp);cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.pin-pad button:active{background:rgba(244,194,13,.25)}
.pin-forgot{max-width:340px;display:flex;flex-direction:column;gap:10px;color:#E4E9F5;font-size:15px}.pin-forgot p{margin:0}
.pin-card{align-items:center;text-align:center}
.pin-card .pin-dots i{border-color:var(--pri)}.pin-card .pin-dots i.on{background:var(--pri)}
.pin-card .pin-pad button{border-color:var(--line);background:var(--soft);color:var(--ink)}

/* Workspace work board */
.wb-tabs{display:flex;gap:8px;overflow-x:auto;padding:2px 2px 6px;scrollbar-width:none}.wb-tabs::-webkit-scrollbar{display:none}
.wb-tab{position:relative;flex:1 0 auto;min-width:72px;min-height:64px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:6px 10px;background:var(--card);border:1px solid var(--line);border-radius:14px;color:var(--ink);font:inherit;cursor:pointer}
.wb-tab b{font-family:var(--disp);font-size:24px;line-height:1}.wb-tab span{font-size:13px;color:var(--t2);white-space:nowrap}
.wb-tab.on{background:var(--deep);border-color:var(--deep);color:#fff}.wb-tab.on span{color:#C7D1EC}
.wb-tab.last.on{background:var(--thread);border-color:var(--thread);color:#14204A}.wb-tab.last.on span{color:#14204A}
.wb-late{position:absolute;top:6px;right:8px;width:9px;height:9px;border-radius:50%;background:var(--bad)}
.wb-cols{display:block}.wb-col{display:none;flex-direction:column;gap:10px}.wb-col.on{display:flex}
.wb-ch{display:none;margin:0;font-size:15px}
.wb-empty{margin:0;padding:16px;border:2px dashed var(--mist);border-radius:16px;text-align:center}
.wb-card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:4px 4px 12px;display:flex;flex-direction:column;gap:6px}
.wb-card.late{border:2px solid var(--bad)}
.wb-open{display:flex;flex-direction:column;gap:6px;width:100%;text-align:left;background:transparent;border:0;padding:10px 12px 0;font:inherit;color:var(--ink);cursor:pointer}
.wb-top{display:flex;justify-content:space-between;gap:8px}.wb-top b{font-size:17px;overflow-wrap:anywhere}
.wb-what{font-size:14px;color:var(--t2);overflow-wrap:anywhere}.wb-chips{display:flex;gap:6px;flex-wrap:wrap}
.wb-go{margin:0 12px;align-self:flex-start}
@media (min-width:1000px){
  .wb-tabs{display:none}.wb-cols{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(220px,1fr);gap:12px;overflow-x:auto;align-items:start}
  .wb-col,.wb-col.on{display:flex;background:var(--soft0);border-radius:18px;padding:12px}.wb-ch{display:flex;justify-content:space-between}
}
.wb-tabs{overflow:visible}
.wb-tab{flex:1 1 0;min-width:0;padding:6px 2px}
.wb-tab span{font-size:12px;max-width:100%;overflow:hidden;text-overflow:ellipsis}
@media (min-width:1000px){
  .scr.wb{max-width:1240px}
  .wb-cols{grid-auto-columns:minmax(200px,1fr)}
  .wb-go{align-self:stretch;justify-content:center}
}
@media (min-width:1000px){#main.wide{max-width:1240px}}
#main.wide{min-width:0}#main.wide .scr{min-width:0}
.wb-cols{min-width:0;max-width:100%}
.wb-top{flex-wrap:wrap;column-gap:8px;row-gap:2px}.wb-top b{overflow-wrap:break-word;word-break:normal}
@media (min-width:1000px){.wb-cols{grid-auto-columns:minmax(176px,1fr)}.wb-go{font-size:14px;padding-left:10px;padding-right:10px}}
.wb-chips .chip{white-space:normal;max-width:100%}

/* Discounts/refunds forms, order costs, materials */
.adj-box{margin-top:10px;padding:14px;border:2px solid var(--pri);border-radius:14px}
.bk-link{width:100%;background:transparent;border:0;font:inherit;color:inherit;text-align:left;cursor:pointer;min-height:48px;padding:6px 0}
.bk-link small,.kv small{display:block;font-size:13px;color:var(--t2)}
.mat-card{display:flex;flex-direction:column;gap:10px;padding:14px}
.mat-open{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;width:100%;background:transparent;border:0;padding:0;font:inherit;color:var(--ink);text-align:left;cursor:pointer;min-height:44px}
.mat-open b{font-size:17px}.mat-q{font-family:var(--disp);font-size:22px;font-weight:700}
.mat-step{display:flex;gap:8px;flex-wrap:wrap}

/* password field with show/hide */
.pwf{position:relative;display:flex}
.pwf input{flex:1;padding-right:76px}
.pw-eye{position:absolute;right:4px;top:50%;transform:translateY(-50%);min-height:44px;min-width:64px;border:0;background:transparent;color:var(--pri);font:600 15px var(--body,inherit);border-radius:10px;cursor:pointer}
.pw-eye:focus-visible{outline:2px solid var(--ring,var(--pri));outline-offset:2px}
.si-sheet .pw-eye{color:var(--pri)}
.cl-note{border-color:var(--pri)}
.btn[disabled]{opacity:.7;cursor:progress}
@media (max-width:374px){.db-quick button{font-size:12px}}

/* price list */
.pl-list{gap:0;padding-block:6px}
.pl-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,140px) 44px;gap:10px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line)}
.pl-row:last-child{border-bottom:0}
.pl-name{font-weight:600;font-size:17px;overflow-wrap:anywhere}
.pl-price input{text-align:right}
.pl-x{width:44px;height:44px;border:0;border-radius:12px;background:transparent;color:var(--t2);font-size:26px;line-height:1;cursor:pointer}
.pl-x:hover{background:var(--soft,rgba(0,0,0,.05))}
.pl-x:focus-visible{outline:2px solid var(--pri);outline-offset:2px}
.pl-add{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,150px);gap:12px}
@media (max-width:380px){.pl-add{grid-template-columns:minmax(0,1fr)}}
.pill-price{margin-left:6px;font-weight:500;opacity:.75;font-size:.9em}