/* Finance Centre — ish stoli: tepada oy va foydalanuvchi, ostida 4 biznes zanjiri, keyin bo'limlar */
:root{
  --bg:#EEF1F4; --surface:#FFFFFF; --sunk:#F5F7F9; --line:#D9DEE5; --ink:#141C26; --muted:#5B6675;
  --accent:#1F4FC9; --accent-ink:#FFFFFF; --accent-soft:#E3EAFB;
  --ok:#17834F; --ok-soft:#DDF2E6; --warn:#A86200; --warn-soft:#FBEBD2; --bad:#B42828; --bad-soft:#F8DEDE; --info:#5B3FC4; --info-soft:#E9E3FA;
  --f-body:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; --f-num:ui-monospace,"Cascadia Mono",Consolas,Menlo,monospace;
  --r:10px; color-scheme:light;
}
@media (prefers-color-scheme: dark){:root{
  --bg:#0F141B; --surface:#161D27; --sunk:#1B2430; --line:#2A3544; --ink:#E6EBF1; --muted:#95A1B1;
  --accent:#7DA2FF; --accent-ink:#0B1322; --accent-soft:#1E2B48;
  --ok:#5FD39A; --ok-soft:#173326; --warn:#F2B35A; --warn-soft:#3A2A12; --bad:#FF8A8A; --bad-soft:#3D1D1F; --info:#B9A5FF; --info-soft:#2A2246;
  color-scheme:dark}}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--bg);color:var(--ink);font-family:var(--f-body);font-size:14px;line-height:1.45;padding-inline:16px;padding-block:16px 48px}
[hidden]{display:none!important}
.wrap{max-width:1180px;margin:0 auto;display:flex;flex-direction:column;gap:18px}
h1,h2,h3{margin:0;text-wrap:balance}
h1{font-size:1.45rem;font-weight:700;letter-spacing:-.01em}
h2{font-size:1.08rem;font-weight:650}
h3{font-size:.95rem;font-weight:600}
.num{font-family:var(--f-num);font-variant-numeric:tabular-nums}
.muted{color:var(--muted)}
.small{font-size:.8rem}
.lbl{font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:600}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.btn{border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:7px 12px;border-radius:8px;font-weight:550;white-space:nowrap;text-decoration:none;display:inline-block}
.btn:hover{border-color:var(--muted)}
.btn.pri{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.btn.ok{background:var(--ok);color:var(--surface);border-color:var(--ok)}
.btn.bad{color:var(--bad);border-color:var(--bad)}
.btn.sm{padding:4px 9px;font-size:.82rem}
.btn:disabled{opacity:.45;cursor:not-allowed}
input,select{background:var(--surface);border:1px solid var(--line);border-radius:7px;padding:6px 8px;min-width:0}
input[type=number]{font-family:var(--f-num)}
.w64{width:64px}.w220{width:220px}
header.top{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;justify-content:space-between}
.topctl{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.chip{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:999px;font-size:.8rem;font-weight:600;background:var(--sunk);border:1px solid var(--line)}
.pill{display:inline-block;padding:2px 9px;border-radius:999px;font-size:.76rem;font-weight:650;white-space:nowrap}
.s-none{background:var(--sunk);color:var(--muted)} .s-draft{background:var(--accent-soft);color:var(--accent)}
.s-returned{background:var(--bad-soft);color:var(--bad)} .s-submitted{background:var(--warn-soft);color:var(--warn)}
.s-checked{background:var(--info-soft);color:var(--info)} .s-approved{background:var(--ok-soft);color:var(--ok)} .s-paid{background:var(--ok);color:var(--surface)}
.summary{display:flex;flex-wrap:wrap;gap:10px 28px;align-items:baseline;padding:14px 16px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r)}
.summary .big{font-size:1.35rem;font-weight:600}
.attn{color:var(--warn);font-weight:600}
.grid4{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:12px}
.biz{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px;display:flex;flex-direction:column;gap:10px;min-width:0}
.biz.mine{border-color:var(--warn);box-shadow:0 0 0 1px var(--warn) inset}
.biz-head{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:4px}
.step{display:flex;flex-direction:column;gap:4px;font-size:.7rem;color:var(--muted)}
.step i{display:block;height:5px;border-radius:3px;background:var(--line)}
.step.done i{background:var(--ok)} .step.cur i{background:var(--warn)} .step.ret i{background:var(--bad)}
.step.done,.step.cur{color:var(--ink)}
.kv{display:flex;justify-content:space-between;gap:8px;font-size:.86rem;align-items:center}
.tabs{display:flex;gap:2px;border-bottom:1px solid var(--line);overflow-x:auto}
.tab{border:0;background:none;padding:9px 14px;font-weight:600;color:var(--muted);border-bottom:2px solid transparent;white-space:nowrap}
.tab[aria-selected=true]{color:var(--ink);border-bottom-color:var(--accent)}
.panel{display:flex;flex-direction:column;gap:14px}
.bar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between}
.bar .l,.bar .r{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px;min-width:0}
.stack{display:flex;flex-direction:column;gap:10px}
.note{padding:10px 12px;border-radius:8px;font-size:.88rem}
.note.bad{background:var(--bad-soft);color:var(--bad)} .note.info{background:var(--accent-soft);color:var(--ink)} .note.warn{background:var(--warn-soft);color:var(--ink)} .note.ok{background:var(--ok-soft);color:var(--ink)}
.tblwrap{overflow-x:auto;background:var(--surface);border:1px solid var(--line);border-radius:var(--r)}
table{border-collapse:collapse;width:100%;font-size:.84rem}
th,td{padding:7px 9px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle;white-space:nowrap}
th{font-size:.7rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:600;background:var(--sunk)}
td.n,th.n{text-align:right}
td.wrapt{white-space:normal;min-width:220px}
tbody tr:hover td{background:var(--sunk)}
td.sticky,th.sticky{position:sticky;left:0;background:var(--surface);z-index:1}
th.sticky{background:var(--sunk);z-index:2}
tfoot td{font-weight:650;background:var(--sunk);border-bottom:0}
td input[type=number]{width:70px;padding:4px 6px;text-align:right}
td input.w{width:110px}
.ename{font-weight:600} .epos{font-size:.76rem;color:var(--muted)}
.tag{font-size:.68rem;padding:1px 6px;border-radius:5px;background:var(--sunk);color:var(--muted);border:1px solid var(--line);margin-left:6px;font-weight:600}
.tag.out{background:var(--bad-soft);color:var(--bad);border-color:transparent}
.tag.new{background:var(--ok-soft);color:var(--ok);border-color:transparent}
.hist{display:flex;flex-direction:column;gap:6px;font-size:.84rem}
.hist div,.moves div{display:flex;gap:10px;flex-wrap:wrap}
.form{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;align-items:end}
.form label,.fl{display:flex;flex-direction:column;gap:4px;font-size:.78rem;color:var(--muted);font-weight:550}
.moves{display:flex;flex-direction:column;gap:6px;font-size:.86rem}
.crit{display:grid;grid-template-columns:1fr 90px auto;gap:8px;align-items:center}
.ws-ok{color:var(--ok)} .ws-bad{color:var(--warn)}
.checks{display:flex;flex-wrap:wrap;gap:12px}
.checks label{display:flex;gap:6px;align-items:center}
.empty{padding:28px 16px;text-align:center;color:var(--muted)}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(18px + env(safe-area-inset-bottom,0px));background:var(--ink);color:var(--bg);padding:9px 16px;border-radius:8px;font-weight:550;z-index:9;max-width:calc(100% - 32px)}
.inline-confirm{display:inline-flex;gap:6px;align-items:center;flex-wrap:wrap}
.secret{font-family:var(--f-num);font-size:1.1rem;font-weight:600;padding:8px 12px;background:var(--sunk);border:1px dashed var(--line);border-radius:8px;user-select:all}
.auth{max-width:380px;margin:8vh auto 0;display:flex;flex-direction:column;gap:14px}
.auth form{display:flex;flex-direction:column;gap:12px}
.auth input{padding:10px 12px}
.auth .btn{padding:10px 14px}
@media (max-width:560px){h1{font-size:1.2rem}.summary .big{font-size:1.15rem}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
.qrbox{display:flex;justify-content:center;padding:8px;background:#fff;border-radius:8px}
.qrbox img{width:240px;height:240px;max-width:100%}
.secret{word-break:break-all}