/* Zistaz Desk — styles derived from the approved mockups (zistaz-panel/mock). */
@font-face{font-family:Vazirmatn;src:url(/static/Vazirmatn.woff2) format("woff2");font-weight:100 900;font-display:swap}
:root{--g:#53A725;--gd:#3d7f1a;--gdd:#2e5d14;--o:#F39200;--od:#c66900;--b:#1E6FB8;--r:#e53935;--bg:#f4f6f3;--line:#edf0ec;--mut:#78909c}
*{box-sizing:border-box}
body{margin:0;font-family:Vazirmatn,Tahoma,sans-serif;direction:rtl;background:var(--bg);color:#263238;font-size:14px}
a{color:var(--b);text-decoration:none}
input,select,textarea,button{font-family:inherit;font-size:inherit}
.top{display:flex;align-items:center;gap:14px;background:#fff;padding:10px 24px;box-shadow:0 1px 8px #0000000d;position:sticky;top:0;z-index:20}
.logo{width:36px;height:36px;border-radius:10px;background:var(--g);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-weight:700}
.brand b{font-size:16px;color:var(--gdd)} .brand div{font-size:11px;color:#90a4ae}
.tag{background:#fff3e0;color:#e67e00;border-radius:8px;padding:3px 10px;font-size:12px;font-weight:700}
.sv{color:var(--gd);background:#eef7e8;border-radius:20px;padding:3px 12px;font-size:12px;white-space:nowrap}
.top-l{margin-right:auto;display:flex;align-items:center;gap:12px}
.bell{position:relative;width:38px;height:38px;border-radius:50%;background:var(--bg);display:inline-flex;align-items:center;justify-content:center;font-size:17px;cursor:pointer;border:0}
.bell i{position:absolute;top:2px;right:2px;background:var(--r);color:#fff;border-radius:9px;font-size:10px;padding:0 5px;font-style:normal}
.dd{position:relative}.dd>.menu{display:none;position:absolute;left:0;top:44px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 8px 24px #0002;min-width:260px;padding:6px;z-index:30}
.dd.open>.menu{display:block}.menu a,.menu div{display:block;padding:8px 10px;border-radius:8px;color:#37474f;font-size:13px}.menu a:hover{background:var(--bg)}
.chipu{display:flex;align-items:center;gap:8px;border:1px solid #e3e8e0;border-radius:24px;padding:3px 4px 3px 12px;background:#fff;cursor:pointer}
.av{width:32px;height:32px;border-radius:50%;background:#e8f5e0;display:inline-flex;align-items:center;justify-content:center}
.wrap{display:flex;gap:20px;padding:20px 24px;align-items:flex-start}
.side{width:200px;flex:none;padding:12px;display:flex;flex-direction:column;position:sticky;top:78px;min-height:calc(100vh - 110px)}
.side a.it{display:block;padding:10px 14px;border-radius:12px;margin-bottom:2px;color:#455a64}
.side a.it.on{background:#eef7e8;color:var(--gd);font-weight:700}
.side .sub{padding:0 22px 6px;font-size:12px}.side .sub a{display:block;color:#78909c;padding:2px 0}.side .sub a.on{color:var(--gd);font-weight:700}
.soon{background:#eceff1;color:#90a4ae;border-radius:6px;padding:0 6px;font-size:10px;margin-right:4px}
.side .out{margin-top:auto;border-top:1px solid var(--line);padding:12px 14px;color:var(--r);font-size:13px}
main{flex:1;min-width:0}
.card{background:#fff;border-radius:16px;box-shadow:0 2px 12px #1a2e0f12;border:1px solid var(--line);padding:16px 18px;margin-bottom:16px}
.btn{background:var(--g);color:#fff;border-radius:10px;padding:9px 18px;font-weight:700;display:inline-block;border:0;cursor:pointer}
.btn.sm{padding:5px 12px;font-size:12px}.btn.blue{background:var(--b)}.btn.red{background:var(--r)}.btn:disabled,.btn.dis{background:#cfd8dc;cursor:not-allowed}
.ob{border:1.5px solid var(--b);color:var(--b);border-radius:10px;padding:8px 16px;font-weight:700;display:inline-block;background:#fff;cursor:pointer}
.ob.sm{padding:3px 10px;font-size:12px;border-radius:8px}.ob.g{border-color:var(--g);color:var(--gd)}.ob.o{border-color:var(--o);color:var(--od)}.ob.r{border-color:var(--r);color:var(--r)}
.crumb{font-size:12px;color:#90a4ae;margin-bottom:6px}.crumb a{color:var(--b)}
h1{font-size:19px;margin:4px 0 14px}
.grid{display:grid;gap:14px}.g4{grid-template-columns:repeat(4,1fr)}.g2{grid-template-columns:1fr 1fr}.g3{grid-template-columns:repeat(3,1fr)}
.kpi{border-top:4px solid var(--g)}.kpi .t{font-weight:700}.kpi .v{font-size:24px;font-weight:800;margin:6px 0}.kpi .s{font-size:12px;color:var(--mut)}
.kpi .rows{font-size:12px;color:#546e7a;display:grid;grid-template-columns:1fr auto;gap:2px 10px;margin-bottom:8px}
table{width:100%;border-collapse:separate;border-spacing:0}
th{font-size:12px;color:var(--mut);font-weight:700;padding:9px 8px;text-align:right;border-bottom:1px solid var(--line)}
td{padding:8px;border-bottom:1px solid #f3f5f2;vertical-align:middle}
tr.faded td{opacity:.55}tr.sum td{background:#f6fbf2;font-weight:700}
.num{width:56px;height:34px;border:1.5px solid #dfe5dc;border-radius:9px;text-align:center;font-weight:700;background:#fff}
.num:focus{border-color:var(--g);outline:0}.num:disabled{background:#fafbfa;color:#90a4ae;border-style:dashed}
.inp,select.inp{border:1.5px solid #dfe5dc;border-radius:10px;padding:8px 10px;background:#fff;min-width:0}
.pill{border-radius:20px;padding:3px 10px;font-size:12px;font-weight:700;white-space:nowrap;display:inline-block}
.st-draft{background:#eceff1;color:#607d8b}.st-appr{background:#fff3e0;color:var(--od)}.st-pay{background:#e8f1fb;color:var(--b)}
.st-part{background:#f3e5f5;color:#8e24aa}.st-paid{background:#eef7e8;color:var(--gd)}.st-over{background:#ffebee;color:var(--r)}
.paidb{background:#eef7e8;color:var(--gd);border-radius:12px;padding:1px 8px;font-size:11px;font-weight:700}
.bar{height:12px;border-radius:7px;background:#edf1ec;overflow:hidden;display:flex}.bar>span{display:block;height:100%}
.fc{background:linear-gradient(#f5fbf1,#eef8e8);border:1px solid #d9eccd;border-radius:18px;padding:16px 20px;box-shadow:0 3px 14px #53a7251a;margin-bottom:16px}
.fl{font-weight:700;font-size:13px;color:var(--gdd);margin-bottom:6px;display:block}
.dl{background:#fff;border:1px solid #ffcc80;color:var(--od);border-radius:20px;padding:4px 12px;font-size:12px;font-weight:700}
.ban{display:flex;align-items:center;gap:10px;background:#fff8ee;border:1px solid #ffe0b2;border-radius:14px;padding:10px 14px;color:#8a4b00;font-size:13px;margin-bottom:14px}
.seg{display:flex;gap:4px;background:#f1f4f0;border-radius:14px;padding:4px;overflow-x:auto}
.seg a{padding:7px 12px;border-radius:10px;color:#546e7a;font-size:13px;white-space:nowrap}
.seg a.on{background:#fff;color:var(--gd);font-weight:700;box-shadow:0 1px 4px #0002}
.ck{display:inline-flex;width:17px;height:17px;border-radius:50%;background:var(--g);color:#fff;font-size:10px;align-items:center;justify-content:center;margin-left:4px}
.ic{display:inline-flex;width:34px;height:34px;border-radius:10px;background:var(--bg);align-items:center;justify-content:center;border:0;cursor:pointer}
.chips{display:flex;gap:6px;flex-wrap:wrap}.chip{border:1px solid #dfe5dc;border-radius:20px;padding:4px 12px;font-size:12px;color:#546e7a;background:#fff}
.chip.on{background:var(--g);color:#fff;border-color:var(--g)}
.mut{color:var(--mut);font-size:12px}.warn{color:var(--r);font-size:12px}
.tl{display:flex;align-items:flex-start;justify-content:space-between;position:relative;padding:8px 30px}
.tl:before{content:"";position:absolute;top:24px;right:60px;left:60px;height:3px;background:#dfe5dc}
.tl .st{position:relative;text-align:center;flex:1;font-size:12px}.tl .dot{width:32px;height:32px;border-radius:50%;margin:0 auto 6px;display:flex;align-items:center;justify-content:center;background:#fff;border:3px solid #cfd8dc;color:#fff}
.tl .done .dot{background:var(--g);border-color:var(--g)}.tl .cur .dot{border-color:var(--o);background:#fff3e0;color:var(--o)}
.sel-bar{position:sticky;bottom:10px;background:#263238;color:#fff;border-radius:14px;padding:10px 16px;display:flex;align-items:center;gap:10px;margin-top:10px}
.qtabs{display:flex;border-bottom:2px solid #e3e8e0}.qtabs a{flex:1;padding:10px 14px;text-align:center;color:#546e7a}.qtabs a.on{background:#fff;margin-bottom:-2px}
.flash{background:#eef7e8;border:1px solid #cfe8bf;color:var(--gdd);border-radius:12px;padding:10px 14px;margin-bottom:12px}
.err{background:#ffebee;border:1px solid #ffcdd2;color:#b71c1c;border-radius:12px;padding:10px 14px;margin-bottom:12px}
dialog{border:0;border-radius:16px;padding:20px;box-shadow:0 10px 40px #0004;max-width:420px}
.hbar{display:grid;grid-template-columns:90px 1fr 70px 46px;align-items:center;gap:8px;margin:7px 0;font-size:13px}
.vbars{display:flex;align-items:flex-end;gap:18px;height:170px;padding:0 10px;border-bottom:1px solid var(--line)}
.vbars div{flex:1;text-align:center;font-size:12px}.vbars span{display:block;background:var(--b);border-radius:6px 6px 0 0;margin:4px auto 0;width:60%;max-width:90px}
.burger{display:none}
.filtergrid{grid-template-columns:repeat(4,1fr) auto;align-items:end}
@media (max-width:860px){
 .wrap{padding:10px;display:block}.side{display:none;position:fixed;top:60px;right:0;bottom:0;z-index:40;width:230px;min-height:0;border-radius:0}
 body.nav .side{display:flex}.burger{display:inline-flex}.g4{grid-template-columns:1fr 1fr}.g2,.g3{grid-template-columns:1fr}
 .filtergrid{grid-template-columns:1fr 1fr}.filtergrid .btn{grid-column:span 2}
 .tag,.brand div,.hide-m{display:none}.top{padding:8px 10px}.scroll{overflow-x:auto}
 .hbar{grid-template-columns:70px 1fr 60px}.hbar>:last-child{display:none}
}
@media print{.top,.side,.noprint{display:none!important}.wrap{padding:0}.card{box-shadow:none}}
/* exam page */
.exam-cols{grid-template-columns:1.45fr 1fr}
.rolebox{border:1px solid var(--line);border-radius:12px;padding:8px 10px;margin-top:10px}
.rolebox summary{cursor:pointer;display:flex;gap:8px;align-items:center;list-style:none}
.rolebox[open] summary .names{display:none}
.rchip{display:inline-block;border:1px solid;border-radius:8px;padding:0 6px;font-size:10px;margin:2px 0 0 3px;background:#fff}
.selbox{background:#f6fbf2;border:1px solid #d9eccd;border-radius:12px;padding:10px;margin:10px 0}
tr.picked td{background:#eef7e8!important}
.crumb{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.crumb>a:first-child{background:#e8f1fb;color:var(--b);font-weight:700;padding:7px 14px;border-radius:10px;font-size:13px;margin-left:8px}
@media (max-width:860px){.exam-cols{grid-template-columns:1fr}.rolebox .names{display:none}}

.budgetgrid{grid-template-columns:220px 1fr;gap:20px;align-items:center}
@media (max-width:860px){.budgetgrid{grid-template-columns:1fr}.hbar[style]{grid-template-columns:80px 1fr!important}.hbar[style]>:nth-child(n+3){grid-column:span 2}}
html{scroll-behavior:smooth;scroll-padding-top:80px}

/* entry page details (v12 mockup) */
.sheetsel{background:var(--b,#1E6FB8);color:#fff;border:0;border-radius:12px;padding:7px 14px;font:inherit;font-weight:700}
.sheetsel option{background:#fff;color:#263238}
.num:placeholder-shown{border-style:dashed;color:#cfd8dc}.num::placeholder{color:#cfd8dc}
tr.lk td{opacity:.62}
.dsw{display:flex;align-items:center;gap:4px;border:1px solid #e3e8e0;border-radius:9px;padding:2px 6px;background:#fff;min-width:150px}
.dsw .ds{border:0;padding:4px 2px;width:100%;min-width:90px;box-shadow:none}
.sp{background:#fff3e0;color:#b45f06;border-radius:6px;padding:1px 6px;font-size:10px;white-space:nowrap}
.addbox{display:flex;gap:8px;flex-wrap:wrap;align-items:center;background:#f5fbf1;border:1px solid #d9eccd;border-radius:12px;padding:10px 12px;margin-bottom:12px}
.filtergrid{grid-template-columns:repeat(4,1fr) 1.4fr}
@media(max-width:800px){.filtergrid{grid-template-columns:1fr 1fr}}

.addtab{position:relative;display:inline-block}.addtab summary{list-style:none;cursor:pointer;color:#53A725;font-weight:700;padding:7px 12px}
.addtab summary::-webkit-details-marker{display:none}
.addtab-menu{position:absolute;left:0;top:36px;z-index:20;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 6px 20px #0002;padding:10px;display:flex;flex-direction:column;gap:8px;min-width:260px}
.unitsel{background:#eef7e8;color:#3d7f1a;border:0;border-radius:20px;padding:3px 8px;font:inherit;font-size:12px}
.unitsel.pb{background:#e8f1fb;color:#1E6FB8}
.seg{overflow:visible;flex-wrap:wrap}

/* instant feedback: thin top progress bar during any htmx request + saving state on autosaved inputs */
.zbar{position:fixed;top:0;right:0;left:0;height:3px;z-index:99;pointer-events:none;opacity:0;background:linear-gradient(90deg,#53A725,#1E6FB8);transform-origin:right;transform:scaleX(0)}
.zbar.htmx-request{opacity:1;animation:zbar 1.2s ease-out forwards}
@keyframes zbar{from{transform:scaleX(0)}to{transform:scaleX(.9)}}
.num.htmx-request,.inp.htmx-request{border-color:#ffb74d!important;background:#fffaf2}
button.htmx-request,.btn.htmx-request{opacity:.7;pointer-events:none}
.num.saving,.inp.saving{border-color:#ffb74d!important;background:#fffaf2}
/* fidelity: completed timeline segments are green (mock), dot sits above the line */
.tl .st.done:not(:last-child):after{content:"";position:absolute;top:15px;right:50%;left:-50%;height:3px;background:var(--g)}
.tl .dot{position:relative;z-index:1}
.prow .warn{font-size:11px;white-space:nowrap}
.fchip{display:inline-flex;align-items:center;gap:4px;border:1px solid var(--line);border-radius:9px;padding:2px 4px 2px 8px;background:#fff;font-weight:600;color:#455a64}
.fchip .inp{border:0;padding:4px 2px;background:transparent;font-weight:700}
.segb a.on{background:var(--b)!important;color:#fff!important}
.wchip{background:#ffebee;border-radius:8px;padding:1px 7px;font-size:11px;white-space:nowrap}
.fst{display:inline-flex;flex-direction:column;gap:2px;font-weight:600;color:#455a64}
.lg{display:inline-block;width:10px;height:10px;border-radius:3px;vertical-align:middle}
/* fidelity: mock selects use a small ▾ chevron on the left instead of the native arrow */
select.inp{-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0h10L5 6z' fill='%23607d8b'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:left 9px center;padding-left:24px!important}
.xlimp{margin:0 0 10px;border:1px dashed var(--line);border-radius:10px;padding:8px 10px}.xlimp summary{cursor:pointer;font-weight:700;font-size:13px}
/* mobile (iPhone 390px): nothing may widen the page; wide tables scroll inside their card; tap-sized controls */
@media (max-width:860px){
 html,body{overflow-x:hidden}
 .wrap,main,.grid>*,.exam-cols>*,.card{min-width:0;max-width:100%}
 .card table,table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
 .btn,.ob,a.btn,a.ob,button.ic,select.inp,input.inp,.seg a{min-height:38px}
 .btn.sm,.ob.sm{min-height:36px;padding-top:7px;padding-bottom:7px}
 input.num{min-height:36px}
 .seg{overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch}
 .seg a{white-space:nowrap}
 h1{font-size:19px}
}
@media (max-width:860px){.unitsel,td select,td input{min-height:36px}}
@media (max-width:860px){
 table th,table td{white-space:nowrap}
 .top .brand small,.top .brand .mut,.top .who small,.top .who .mut{display:none}
 .top .brand b{font-size:14px}
}
@media (max-width:520px){.top .brand>div{display:none}.top .brand b{white-space:nowrap;font-size:13px}.top .user .nm,.top .user small{display:none}.top #saved .sv{font-size:10px;padding:3px 6px}}
@media (max-width:520px){.chipu>div{display:none}.top .tag{display:none}}
/* in-app modal (replaces native alert/confirm/prompt) */
.zm{position:fixed;inset:0;z-index:200;background:rgba(38,50,56,.42);display:flex;align-items:center;justify-content:center;padding:16px;animation:zmf .12s ease-out}
.zm[hidden]{display:none}
.zm-box{background:#fff;border-radius:18px;box-shadow:0 18px 50px rgba(0,0,0,.22);width:min(420px,100%);padding:22px 20px 16px;text-align:center;max-height:85vh;overflow:auto}
.zm-ic{width:46px;height:46px;border-radius:50%;margin:0 auto 10px;display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:800;background:#eef7e8;color:var(--gd)}
.zm[data-kind=err] .zm-ic{background:#fde7e7;color:#c62828}.zm[data-kind=info] .zm-ic{background:#e8f1fb;color:#1E6FB8}
.zm-t{white-space:pre-line;line-height:1.9;font-size:14px;color:#263238;text-align:right}.zm-t ul{text-align:right}.zm-t a{color:#1E6FB8;font-weight:700}
.zm-box .inp{width:100%;margin-top:12px;min-height:40px}
.zm-a{display:flex;gap:8px;margin-top:16px}.zm-a button{flex:1;min-height:42px;font-size:14px}.zm-a [hidden]{display:none}
@keyframes zmf{from{opacity:0}to{opacity:1}}
body.zmo{overflow:hidden}
/* mobile menu backdrop */
.navbg{display:none}
@media (max-width:860px){body.nav .navbg{display:block;position:fixed;inset:60px 0 0 0;background:rgba(38,50,56,.3);z-index:39}.side{box-shadow:-6px 0 24px rgba(0,0,0,.12);overflow:auto}.side a.it{min-height:42px;display:flex;align-items:center}.side .sub a{padding:7px 0}}
/* progress bar only for slow requests (>300ms) */
.zbar.htmx-request{opacity:1;animation:zbar2 1.2s ease-out .3s both}
@keyframes zbar2{0%{opacity:1;transform:scaleX(0)}100%{opacity:1;transform:scaleX(.9)}}
button.htmx-request,.btn.htmx-request{opacity:1;pointer-events:none}
/* add-colleague combobox */
.cbx{position:relative}.cbx-f{display:flex;gap:6px;flex-wrap:wrap;align-items:center;background:#f5fbf1;border:1px solid #d9eccd;border-radius:12px;padding:8px 10px;min-width:min(340px,100%)}
.cbx-f[hidden]{display:none}.cbx-f .inp{flex:1;min-width:180px;min-height:40px}
.cbx-l{width:100%;display:flex;flex-direction:column;max-height:260px;overflow:auto;background:#fff;border-radius:10px}
.cbx-o{all:unset;cursor:pointer;padding:10px 12px;border-bottom:1px solid var(--line);font-size:14px}.cbx-o:hover,.cbx-o:focus{background:#eef7e8}
.cbx-new{color:#1E6FB8;font-weight:700}
/* ---- phones: tables become stacked cards, filters collapse ---- */
.ftog{display:none}
@media (max-width:640px){
 .card table.mcard,table.mcard,table.mcard tbody{display:block;overflow:visible;width:100%;max-width:100%}
 table.mcard tr:has(>th){display:none}
 table.mcard tr{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;padding:10px 2px;border-bottom:1px solid var(--line)}
 table.mcard tr[hidden]{display:none}
 table.mcard td{display:block;border:0!important;padding:2px 0!important;white-space:normal!important;text-align:right!important;width:auto!important;min-width:0;max-width:100%;overflow-wrap:anywhere}
 table.mcard td:empty{display:none}
 table.mcard td[data-l]:not(:first-child):not(.act)::before{content:attr(data-l) ": ";color:#90a4ae;font-size:11px;font-weight:400}
 table.mcard td.nm{flex:1 1 60%;font-size:14px}
 table.mcard td.act,table.mcard td[colspan]{flex-basis:100%}
 table.mcard td.act{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
 table.mcard td.act>*{flex:0 0 auto}
 table.mcard td.act .btn,table.mcard td.act .ob,table.mcard td.act button{min-height:32px;display:inline-flex;align-items:center;justify-content:center;width:auto;padding:4px 12px;font-size:12px}
 table.mcard td.act form{display:inline-flex;flex:0 0 auto}
 table.mcard td.act button.ic,table.mcard td.act .ic{width:32px;height:32px;min-height:32px;padding:0;font-size:15px}
 table.mcard td.act .rowc,table.mcard td.act .rowok{border-radius:999px;min-height:28px;padding:3px 14px}
 table.mcard td.act .btn.wide{flex:1 1 100%}
 table.mcard td.chk{order:-1}
 table.mcard input.num{min-height:38px;width:64px}
 table.mcard tr.sum{background:#f5fbf1;border-radius:10px;font-weight:700}
 table.mcard td>table.mcard{margin-top:4px}
 .fbox .ftog{display:inline-flex}
 .fbox:not(.open)>label,.fbox:not(.open)>.flab,.fbox:not(.open)>button.ob:not(.ftog),.fbox:not(.open)>a.mut{display:none}
 .fbox.open>label{flex:1 1 45%}
 .qtabs{display:grid;grid-template-columns:repeat(4,1fr);gap:2px}.qtabs a{padding:8px 2px;font-size:11px;min-width:0}.qtabs a b{display:block;font-size:12px;white-space:nowrap}.qtabs .pill{font-size:10px;padding:1px 6px}.qtabs .mut{font-size:10px;overflow-wrap:anywhere}
 .sel-bar{flex-wrap:wrap;gap:6px}.sel-bar .btn{flex:1 1 100%;min-height:42px}
}
@media (max-width:640px){
 .seg{flex-wrap:wrap!important;overflow:visible!important}.seg a{flex:1 1 auto;text-align:center;padding:8px 8px;min-height:36px;display:inline-flex;align-items:center;justify-content:center}
}
.cbx-r{display:flex;align-items:center;gap:8px;padding:6px 10px;border-bottom:1px solid var(--line);cursor:pointer;min-height:44px}.cbx-r:hover{background:#eef7e8}
.cbx-r .cbx-o{flex:1;border:0;padding:0}.cbx-r .btn,.cbx-r .ob{min-height:36px}.cbx-new .cbx-o{color:#1E6FB8;font-weight:700}
table.mcard td.nm::before{content:none!important}
.bsum{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:10px;background:#f5fbf1;border:1px solid #d9eccd;border-radius:12px;padding:10px}
.bsum>div{display:flex;flex-direction:column;align-items:center;gap:2px}.bsum b{font-size:17px}.bsum .mut{font-size:11px}.bsum .warn b{color:#e67e00}
.btab tr.bdet>td{background:#fafcf9;border-right:3px solid #1E6FB8}
@media (max-width:640px){.bsum{grid-template-columns:repeat(2,1fr)}}

.ztw{position:fixed;top:12px;left:50%;transform:translateX(-50%);z-index:10000;display:flex;flex-direction:column;gap:6px;width:min(92vw,440px);pointer-events:none}
.zt{background:#2e7d32;color:#fff;padding:11px 14px;border-radius:12px;box-shadow:0 6px 20px #0003;font-size:14px;font-weight:600;text-align:center;transition:opacity .5s,transform .5s;pointer-events:auto}
.zt.err{background:#c62828}.zt.info{background:#1E6FB8}.zt.out{opacity:0;transform:translateY(-10px)}
.st-bank{background:#e0f2f1;color:#00796b}
.fstep{display:flex;gap:4px;flex-wrap:wrap;margin:8px 0;font-size:12px}.fstep span{flex:1;min-width:0;text-align:center;padding:5px 4px;border-radius:8px;background:#eceff1;color:#90a4ae;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fstep span.done{background:#eef7e8;color:#3d7f1a}.fstep span.cur{background:#1E6FB8;color:#fff;font-weight:700}
@media (max-width:640px){.fstep{font-size:10.5px}.fstep span{padding:5px 2px}}

.vabar{position:sticky;top:0;z-index:60;background:#6a1b9a;color:#fff;padding:8px 12px;text-align:center;font-size:13px}.vabar a{color:#fff;text-decoration:underline;margin-right:8px}
.acc td,.acc th{text-align:center}.acc td:first-child,.acc th:first-child{text-align:right}.acc input[type=checkbox]{width:20px;height:20px}
.acc select{font-size:12px;padding:3px}.acc .on{color:#3d7f1a;font-weight:700}.acc .off{color:#b0bec5}
/* entry: stage stepper, compact picker, inline custom rate, per-row confirm */
.estep{display:flex;align-items:center;gap:2px;flex-wrap:wrap;margin:10px 0 4px}.estep a{padding:7px 12px;border-radius:20px;background:#eef1f0;color:#546e7a;font-weight:600;font-size:13px;white-space:nowrap}
.estep a.dn{background:#eef7e8;color:#3d7f1a}.estep a.on{background:var(--g);color:#fff}.estep i{font-style:normal;color:#b0bec5;padding:0 2px}
.pickd>summary{cursor:pointer;font-weight:700;list-style:none;padding:6px 0}.pickd>summary::-webkit-details-marker{display:none}
.num.rt{display:block;margin:3px auto 0;width:84px;font-size:11px;padding:3px;border-color:#e0e0e0;background:#fffdf7}.num.rt.need{border-color:#ff9800;background:#fff3e0}
.spw{font-size:11px;color:#b45f06;font-weight:600;margin-top:2px;white-space:normal}
.rowok{white-space:nowrap}.btn.rowc{padding:4px 10px}
@media (max-width:640px){
 #pick .fl{font-size:10px;margin:0}#pick .inp{padding:4px 6px;font-size:12px;min-height:30px}#pick .filtergrid{grid-template-columns:repeat(3,1fr)!important;gap:6px}
 #pick>div:first-child b{font-size:13px}#pick{padding:8px 10px}
 .estep{gap:1px;flex-wrap:nowrap;overflow-x:auto}.estep a{padding:5px 8px;font-size:11.5px}.estep i{padding:0}
 main .card .ob,main .card .btn{padding:5px 10px;font-size:12px}main .card .ic{padding:2px 4px;font-size:14px}
 .unitsel{font-size:11px;padding:2px}.num{width:52px}.num.rt{width:64px}
}
.spw.bad{color:#c62828}
.tgl{position:relative;width:46px;height:26px;border-radius:13px;border:0;background:#cfd8dc;cursor:pointer;padding:0;flex:0 0 auto;transition:background .15s}
.tgl i{position:absolute;top:3px;right:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:right .15s}
.tgl.on{background:#53A725}.tgl.on i{right:23px}
table.mcard td.act .tgl,table.mcard td .tgl{min-height:26px!important;width:46px!important;padding:0!important}