/* v6 UI — style bazowy przeniesiony 1:1 z makieta-obieg-faktur.html (źródło prawdy wyglądu).
   K2.1 szkielet. Widoki dokładają własne reguły w tym pliku wyłącznie przez Builder 2. */

  :root {
    --bg: #f4f7f5;
    --surface: #ffffff;
    --surface-2: #eaf0ed;
    --ink: #17221e;
    --ink-2: #4f5e58;
    --ink-3: #85928c;
    --line: #dde5e1;
    --line-strong: #c6d2cc;
    --accent: #0d7a6c;
    --accent-strong: #0a6357;
    --accent-ink: #ffffff;
    --accent-soft: #dcefeb;
    --amber: #9a5b07;
    --amber-bg: #fbf0dc;
    --green: #1d7a3d;
    --green-bg: #e2f2e6;
    --red: #b3362a;
    --red-bg: #f9e8e5;
    --violet: #6b3fb8;
    --violet-bg: #eee8f9;
    --blue: #2456b8;
    --blue-bg: #e6edfa;
    --shadow: 0 1px 2px rgba(23,34,30,.06), 0 6px 20px rgba(23,34,30,.07);
    --mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
    --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  }
  :root[data-theme="light"] {
    --bg: #f4f7f5; --surface: #ffffff; --surface-2: #eaf0ed;
    --ink: #17221e; --ink-2: #4f5e58; --ink-3: #85928c;
    --line: #dde5e1; --line-strong: #c6d2cc;
    --accent: #0d7a6c; --accent-strong: #0a6357; --accent-ink: #ffffff; --accent-soft: #dcefeb;
    --amber: #9a5b07; --amber-bg: #fbf0dc;
    --green: #1d7a3d; --green-bg: #e2f2e6;
    --red: #b3362a; --red-bg: #f9e8e5;
    --violet: #6b3fb8; --violet-bg: #eee8f9;
    --blue: #2456b8; --blue-bg: #e6edfa;
    --shadow: 0 1px 2px rgba(23,34,30,.06), 0 6px 20px rgba(23,34,30,.07);
  }
  :root[data-theme="dark"] {
    --bg: #101614; --surface: #192120; --surface-2: #202b28;
    --ink: #e6edea; --ink-2: #a3b2ab; --ink-3: #6e7d76;
    --line: #28332f; --line-strong: #35443e;
    --accent: #2cae9b; --accent-strong: #3dc4b0; --accent-ink: #08211d; --accent-soft: #14352f;
    --amber: #e3a44f; --amber-bg: #33270f;
    --green: #63c07f; --green-bg: #14301c;
    --red: #e58374; --red-bg: #3a1d18;
    --violet: #b596ea; --violet-bg: #291c40;
    --blue: #86a8ec; --blue-bg: #17233d;
    --shadow: 0 1px 2px rgba(0,0,0,.35), 0 6px 20px rgba(0,0,0,.3);
  }

  * { box-sizing: border-box; }
  html, body { margin: 0; }
  body {
    font-family: var(--sans);
    background: var(--bg);
    color: var(--ink);
    font-size: 14.5px;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
  }
  button { font: inherit; color: inherit; cursor: pointer; }
  button:focus-visible, a:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 6px; }
  .skip-link { position: fixed; top: 0; left: 12px; z-index: 1000; transform: translateY(-200%); padding: 8px 12px;
    border-radius: 0 0 8px 8px; background: var(--ink); color: var(--bg); font-weight: 700; }
  .skip-link:focus-visible { transform: translateY(0); }

  .app { display: flex; min-height: 100vh; }

  /* ── Sidebar ─────────────────────────── */
  .side {
    width: 218px; flex: none;
    background: var(--surface);
    border-right: 1px solid var(--line);
    padding: 18px 12px;
    display: flex; flex-direction: column; gap: 4px;
    position: sticky; top: 0; height: 100vh;
  }
  .brand { display: flex; align-items: center; gap: 10px; padding: 4px 8px 18px; }
  .brand-mark {
    width: 34px; height: 34px; border-radius: 9px; flex: none;
    background: var(--accent); color: var(--accent-ink);
    display: grid; place-items: center; font-weight: 800; font-size: 16px;
  }
  .brand b { display: block; font-size: 14px; letter-spacing: .01em; }
  .brand span { display: block; font-size: 10.5px; color: var(--ink-3); letter-spacing: .09em; text-transform: uppercase; }
  .nav-btn {
    display: flex; align-items: center; gap: 10px;
    width: 100%; text-align: left;
    background: none; border: none; border-radius: 9px;
    padding: 9px 10px; color: var(--ink-2); font-weight: 500;
  }
  .nav-btn:hover { background: var(--surface-2); }
  .nav-btn.active { background: var(--accent-soft); color: var(--accent); font-weight: 650; }
  .nav-btn .ico { width: 18px; text-align: center; flex: none; }
  .nav-badge {
    margin-left: auto; background: var(--accent); color: var(--accent-ink);
    border-radius: 99px; font-size: 11px; font-weight: 700; padding: 1px 8px;
    font-variant-numeric: tabular-nums;
  }
  .side-note {
    margin-top: auto; font-size: 11.5px; color: var(--ink-3);
    border-top: 1px solid var(--line); padding: 12px 8px 2px; line-height: 1.55;
  }
  .side-note b { color: var(--ink-2); }

  /* ── Main ────────────────────────────── */
  .main { flex: 1; min-width: 0; padding: 22px 26px 60px; }
  .mock-banner {
    display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
    font-size: 12px; color: var(--ink-2);
    background: var(--surface-2); border: 1px dashed var(--line-strong);
    border-radius: 9px; padding: 7px 12px; margin-bottom: 18px;
  }
  .mock-banner b { color: var(--ink); }
  .view { display: none; }
  .view.active { display: block; animation: fade .18s ease; }
  @keyframes fade { from { opacity: 0; transform: translateY(3px); } to { opacity: 1; transform: none; } }

  h1 { font-size: 21px; margin: 0 0 2px; letter-spacing: -.01em; }
  .sub { color: var(--ink-2); margin: 0 0 18px; font-size: 13.5px; }
  .eyebrow { font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-3); font-weight: 700; margin: 0 0 4px; }

  .card {
    background: var(--surface); border: 1px solid var(--line);
    border-radius: 13px; box-shadow: var(--shadow);
  }

  /* pills / chips */
  .pill {
    display: inline-flex; align-items: center; gap: 5px;
    font-size: 11.5px; font-weight: 650; border-radius: 99px; padding: 2px 9px;
    white-space: nowrap;
  }
  .pill.amber { color: var(--amber); background: var(--amber-bg); }
  .pill.green { color: var(--green); background: var(--green-bg); }
  .pill.red { color: var(--red); background: var(--red-bg); }
  .pill.violet { color: var(--violet); background: var(--violet-bg); }
  .pill.blue { color: var(--blue); background: var(--blue-bg); }
  .pill.grey { color: var(--ink-2); background: var(--surface-2); }

  /* ── Health strip ─────────────────────── */
  .health {
    display: flex; gap: 18px; flex-wrap: wrap; align-items: center;
    font-size: 12px; color: var(--ink-2); margin-bottom: 16px;
  }
  .health .dot { width: 7px; height: 7px; border-radius: 99px; background: var(--green); display: inline-block; margin-right: 6px; }
  .health .dot.warn { background: var(--amber); }
  .health b { color: var(--ink); font-weight: 600; }

  /* ── Inbox layout ────────────────────── */
  .inbox-grid { display: grid; grid-template-columns: 360px 1fr; gap: 16px; align-items: start; }
  @media (max-width: 980px) { .inbox-grid { grid-template-columns: 1fr; } }

  .msg-list { overflow: hidden; }
  .inbox-tools { display: flex; gap: 7px; margin-bottom: 10px; align-items: center; flex-wrap: wrap; }
  .inbox-search {
    flex: 1 1 100%; border: 1px solid var(--line-strong); border-radius: 9px;
    padding: 7px 12px; background: var(--surface); color: var(--ink); font: inherit; font-size: 13px;
  }
  .inbox-search::placeholder { color: var(--ink-3); }
  .qtab {
    border: 1px solid var(--line-strong); background: var(--surface); border-radius: 99px;
    padding: 4px 11px; font-size: 12px; font-weight: 650; color: var(--ink-2);
  }
  .qtab.sel { background: var(--ink); color: var(--bg); border-color: var(--ink); }
  .qtab .cnt { opacity: .6; margin-left: 3px; font-variant-numeric: tabular-nums; }
  .list-foot {
    display: flex; justify-content: space-between; align-items: center; gap: 8px;
    padding: 9px 14px; font-size: 12px; color: var(--ink-3); border-top: 1px solid var(--line);
  }
  .msg-item {
    display: block; width: 100%; text-align: left; background: none; border: none;
    border-bottom: 1px solid var(--line); padding: 10px 12px;
  }
  .msg-item:last-child { border-bottom: none; }
  .msg-item:hover { background: var(--surface-2); }
  .msg-item.sel { background: var(--accent-soft); box-shadow: inset 3px 0 0 var(--accent); }
  .msg-top { display: flex; justify-content: space-between; gap: 8px; align-items: baseline; }
  .msg-from { font-weight: 650; font-size: 13.5px; }
  .msg-date { font-size: 11.5px; color: var(--ink-3); flex: none; font-variant-numeric: tabular-nums; }
  .msg-subj { font-size: 13px; color: var(--ink-2); margin-top: 1px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .msg-meta { display: flex; gap: 6px; margin-top: 6px; flex-wrap: wrap; }
  .msg-item.done .msg-from, .msg-item.done .msg-subj { color: var(--ink-3); font-weight: 500; }

  .mail-head { padding: 18px 20px 14px; border-bottom: 1px solid var(--line); }
  .mail-head h2 { margin: 0 0 8px; font-size: 16.5px; }
  .mail-kv { display: grid; grid-template-columns: 64px 1fr; gap: 2px 10px; font-size: 13px; }
  .mail-kv dt { color: var(--ink-3); }
  .mail-kv dd { margin: 0; color: var(--ink-2); }
  .mail-kv dd b { color: var(--ink); font-weight: 600; }
  .mail-body { padding: 16px 20px; font-size: 13.5px; color: var(--ink-2); max-width: 62ch; white-space: pre-line; }
  .mail-attach { padding: 6px 20px 18px; }
  .attach-card {
    display: flex; align-items: center; gap: 12px;
    border: 1px solid var(--line); border-radius: 11px; padding: 11px 14px; margin-top: 10px;
    background: var(--bg);
  }
  .attach-ico {
    width: 38px; height: 44px; border-radius: 7px; flex: none;
    background: var(--surface); border: 1px solid var(--line-strong);
    display: grid; place-items: center; font-size: 10px; font-weight: 800; color: var(--ink-3);
    letter-spacing: .05em;
  }
  .attach-name { font-weight: 600; font-size: 13.5px; }
  .attach-sub { font-size: 12px; color: var(--ink-3); margin-top: 1px; }
  .attach-right { margin-left: auto; display: flex; align-items: center; gap: 10px; }
  .gmail-link { font-size: 12.5px; color: var(--accent); text-decoration: none; font-weight: 600; }

  .btn {
    border: 1px solid var(--line-strong); background: var(--surface);
    border-radius: 9px; padding: 8px 14px; font-weight: 600; font-size: 13.5px;
  }
  .btn:hover { border-color: var(--ink-3); }
  .btn.primary { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
  .btn.primary:hover { background: var(--accent-strong); border-color: var(--accent-strong); }
  .btn.danger { color: var(--red); border-color: var(--line); }
  .btn.small { padding: 5px 11px; font-size: 12.5px; border-radius: 8px; }

  /* ── Document view ───────────────────── */
  .doc-back {
    background: none; border: none; color: var(--accent); font-weight: 650;
    font-size: 13px; padding: 0; margin-bottom: 12px; display: inline-flex; gap: 6px;
  }
  .doc-grid { display: grid; grid-template-columns: minmax(0,1fr) 430px; gap: 16px; align-items: start; }
  @media (max-width: 1080px) { .doc-grid { grid-template-columns: 1fr; } }

  .preview { padding: 22px; display: grid; place-items: center; min-height: 540px; }
  .paper {
    width: min(430px, 100%); background: #fff; color: #23292f;
    border: 1px solid var(--line-strong); border-radius: 4px;
    padding: 26px 28px; font-size: 11.5px; line-height: 1.55;
    box-shadow: 0 10px 26px rgba(23,34,30,.13);
  }
  .paper .ph-top { display: flex; justify-content: space-between; margin-bottom: 18px; }
  .paper .ph-logo { font-weight: 800; font-size: 14px; color: #0d5c8c; }
  .paper h3 { margin: 0 0 2px; font-size: 15px; }
  .paper table { width: 100%; border-collapse: collapse; margin-top: 12px; font-size: 10.5px; }
  .paper th, .paper td { border: 1px solid #d7dce1; padding: 4px 6px; text-align: left; }
  .paper th { background: #eef2f5; }
  .paper .tot { text-align: right; margin-top: 10px; font-size: 12px; }
  .paper .muted { color: #7b858d; }

  .panel-sec { border-bottom: 1px solid var(--line); padding: 16px 18px; }
  .panel-sec:last-child { border-bottom: none; }
  .panel-sec h4 { margin: 0 0 10px; font-size: 13px; display: flex; align-items: center; gap: 8px; }

  .ctx-mail { font-size: 12.5px; color: var(--ink-2); display: grid; gap: 2px; }
  .ctx-mail b { color: var(--ink); }
  .ctx-snippet {
    border-left: 3px solid var(--line-strong); padding: 2px 0 2px 10px; margin-top: 7px;
    color: var(--ink-2); font-size: 12.5px; max-width: 56ch;
  }

  .ai-cta {
    width: 100%; display: flex; align-items: center; justify-content: center; gap: 9px;
    background: var(--accent); color: var(--accent-ink); border: none;
    border-radius: 10px; padding: 12px; font-size: 14.5px; font-weight: 700;
  }
  .ai-cta:hover { background: var(--accent-strong); }
  .ai-cta[disabled] { opacity: .75; cursor: progress; }
  .ai-note { font-size: 12px; color: var(--ink-3); margin-top: 8px; text-align: center; }
  .ai-result-note {
    display: none; margin-top: 10px; font-size: 12.5px;
    background: var(--green-bg); color: var(--green); border-radius: 8px; padding: 8px 11px; font-weight: 600;
  }
  .spin {
    width: 14px; height: 14px; border-radius: 99px; flex: none;
    border: 2px solid color-mix(in srgb, var(--accent-ink) 35%, transparent);
    border-top-color: var(--accent-ink);
    animation: rot .7s linear infinite; display: none;
  }
  @keyframes rot { to { transform: rotate(360deg); } }

  .type-row { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .type-pill {
    border: 1.5px solid var(--line); background: var(--surface);
    border-radius: 10px; padding: 9px 11px; text-align: left; font-size: 13px; font-weight: 600;
  }
  .type-pill small { display: block; font-weight: 400; color: var(--ink-3); font-size: 11.5px; margin-top: 1px; }
  .type-pill:hover { border-color: var(--ink-3); }
  .type-pill.sel { border-color: var(--accent); background: var(--accent-soft); color: var(--accent); }
  .type-pill.sel small { color: var(--accent); opacity: .8; }
  .ai-tag { display: none; font-size: 10.5px; font-weight: 700; color: var(--violet); background: var(--violet-bg); border-radius: 99px; padding: 1px 7px; margin-left: 6px; vertical-align: 1px; }

  .fields { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 12px; }
  .field label { display: block; font-size: 11.5px; color: var(--ink-3); font-weight: 650; margin-bottom: 3px; letter-spacing: .02em; }
  .field .val {
    border: 1px solid var(--line); border-radius: 8px; padding: 7px 10px;
    font-size: 13.5px; min-height: 34px; background: var(--bg); color: var(--ink-3);
    font-variant-numeric: tabular-nums;
  }
  .field.wide { grid-column: 1 / -1; }
  .field .val.filled { color: var(--ink); background: var(--surface); border-color: var(--line-strong); animation: fillIn .5s ease; font-weight: 550; }
  .field .val.check { border-color: var(--amber); background: var(--amber-bg); color: var(--amber); }
  @keyframes fillIn { 0% { background: var(--green-bg); } 100% { background: var(--surface); } }
  .field-hint { display: none; font-size: 11.5px; color: var(--amber); margin-top: 3px; }

  .decide { display: flex; flex-direction: column; gap: 10px; }
  .decide .row2 { display: flex; gap: 8px; flex-wrap: wrap; }
  .register-btn {
    width: 100%; border: none; border-radius: 10px; padding: 13px;
    background: var(--accent); color: var(--accent-ink); font-size: 14.5px; font-weight: 700;
  }
  .register-btn:hover { background: var(--accent-strong); }
  .register-btn[disabled] { background: var(--surface-2); color: var(--ink-3); cursor: not-allowed; }
  .register-note { font-size: 12px; color: var(--ink-3); text-align: center; }

  /* ── Documents list ──────────────────── */
  .chips { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
  .chip {
    border: 1px solid var(--line-strong); background: var(--surface);
    border-radius: 99px; padding: 5px 13px; font-size: 12.5px; font-weight: 600; color: var(--ink-2);
  }
  .chip:hover { border-color: var(--ink-3); }
  .chip.sel { background: var(--ink); color: var(--bg); border-color: var(--ink); }
  .chip .cnt { color: inherit; opacity: .6; font-variant-numeric: tabular-nums; margin-left: 4px; }

  .tbl-wrap { overflow-x: auto; }
  table.docs { width: 100%; border-collapse: collapse; table-layout: fixed; min-width: 1380px; }
  .docs .col-document { width: 180px; }
  .docs .col-stage { width: 270px; }
  .docs .col-contractor { width: 260px; }
  .docs .col-source { width: 90px; }
  .docs .col-issued, .docs .col-due, .docs .col-planned { width: 125px; }
  .docs .col-payment { width: 145px; }
  .docs .col-gross { width: 125px; }
  .docs .col-actions { width: 105px; }
  .docs th {
    text-align: left; font-size: 11px; letter-spacing: .07em; text-transform: uppercase;
    color: var(--ink-3); font-weight: 700; padding: 12px 14px; border-bottom: 1px solid var(--line);
    white-space: nowrap;
  }
  #doc-table { overflow-x: auto; background: var(--surface); border: 1px solid var(--line); border-radius: 13px; box-shadow: var(--shadow); }
  .docs td { padding: 14px 16px; border-bottom: 1px solid var(--line); vertical-align: middle; }
  .docs tr:last-child td { border-bottom: none; }
  .docs tbody tr:hover { background: var(--accent-soft); }
  .docs tbody tr.document-row { cursor: pointer; transition: background .12s ease; }
  .docs tbody tr.document-row:focus { outline: 2px solid var(--accent); outline-offset: -2px; background: var(--accent-soft); }
  .docs .num { font-weight: 650; overflow-wrap: anywhere; }
  .docs .num strong { display: block; line-height: 1.35; }
  .docs .knt { color: var(--ink-2); line-height: 1.35; overflow-wrap: anywhere; }
  .docs .amt { text-align: right; font-variant-numeric: tabular-nums; font-weight: 650; white-space: nowrap; }
  .docs .amt small { color: var(--ink-3); font-weight: 500; }
  .docs th.amt { text-align: right; }
  tr.flash { animation: rowFlash 2.2s ease; }
  @keyframes rowFlash { 0%, 35% { background: var(--accent-soft); } 100% { background: transparent; } }

  .docs .sub-id { display: block; margin-top: 5px; }
  .docs .sub-id .pill { font-size: 9px; padding: 2px 6px; }
  .docs .knt small { display: block; color: var(--ink-3); font-size: 11px; }
  .docs .stage-cell .stepper { flex-wrap: wrap; row-gap: 6px; }
  .stepper { display: flex; align-items: center; gap: 4px; }
  .step { width: 22px; height: 5px; border-radius: 3px; background: var(--surface-2); }
  .step.on { background: var(--accent); }
  .step-label { font-size: 12px; color: var(--ink-2); margin-left: 7px; white-space: nowrap; }

  /* ── Flow view ───────────────────────── */
  .lane { padding: 16px 18px; margin-bottom: 14px; }
  .lane h3 { margin: 0 0 3px; font-size: 14.5px; display: flex; align-items: center; gap: 9px; }
  .lane .lane-sub { font-size: 12.5px; color: var(--ink-3); margin: 0 0 13px; }
  .flow { display: flex; align-items: stretch; gap: 0; flex-wrap: wrap; row-gap: 12px; }
  .fstep {
    background: var(--surface-2); border: 1px solid var(--line);
    border-radius: 9px; padding: 8px 12px; font-size: 12.5px; font-weight: 600;
    display: flex; flex-direction: column; justify-content: center; min-width: 108px;
  }
  .fstep small { font-weight: 450; color: var(--ink-3); font-size: 11px; margin-top: 1px; }
  .fstep.src { background: var(--blue-bg); border-color: transparent; color: var(--blue); }
  .fstep.human { background: var(--amber-bg); border-color: transparent; color: var(--amber); }
  .fstep.human small { color: var(--amber); opacity: .8; }
  .fstep.auto { background: var(--accent-soft); border-color: transparent; color: var(--accent); }
  .fstep.auto small { color: var(--accent); opacity: .8; }
  .fstep.end { background: var(--green-bg); border-color: transparent; color: var(--green); }
  .fstep.end small { color: var(--green); opacity: .8; }
  .farrow { display: grid; place-items: center; color: var(--ink-3); padding: 0 8px; font-size: 14px; }
  .legend { display: flex; gap: 16px; flex-wrap: wrap; font-size: 12px; color: var(--ink-2); margin: 4px 0 18px; }
  .legend i { width: 11px; height: 11px; border-radius: 3px; display: inline-block; margin-right: 6px; vertical-align: -1px; font-style: normal; }

  .rules-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; margin-top: 4px; }
  .rule { padding: 14px 16px; }
  .rule h4 { margin: 0 0 5px; font-size: 13px; }
  .rule p { margin: 0; font-size: 12.5px; color: var(--ink-2); }

  /* payments */
  .payments-view { width: 100%; max-width: 1540px; }
  .payments-page-head {
    display: flex; align-items: flex-end; justify-content: space-between; gap: 24px;
    margin-bottom: 16px;
  }
  .payments-page-head .sub { max-width: 720px; margin-bottom: 0; }
  .payments-format-note {
    display: flex; align-items: center; gap: 7px; flex-wrap: wrap; justify-content: flex-end;
    color: var(--ink-2); font-size: 11.5px;
  }
  .payments-format-note > span {
    display: inline-flex; align-items: center; gap: 4px; padding: 4px 8px;
    border: 1px solid var(--line); border-radius: 7px; background: var(--surface);
    font-size: 10.5px; color: var(--ink-3);
  }
  .payments-format-note b { color: var(--ink-2); }
  .payments-format-note small { margin-left: 3px; color: var(--ink-3); font-size: 11px; }
  .payments-card { overflow: hidden; margin-bottom: 16px; }
  .payments-stage-tabs {
    display: flex; align-items: center; gap: 5px; padding: 10px 14px;
    overflow-x: auto; border-bottom: 1px solid var(--line); background: var(--surface);
  }
  .payments-stage-tab {
    flex: 0 0 auto; display: inline-flex; align-items: center; gap: 7px; min-height: 31px;
    padding: 6px 12px; border: 1px solid var(--line); border-radius: 8px;
    background: var(--surface); color: var(--ink-2); font: inherit; font-size: 12.5px; cursor: pointer;
  }
  .payments-stage-tab:hover { border-color: var(--line-strong); background: var(--surface-2); }
  .payments-stage-tab.active { border-color: var(--ink); background: var(--ink); color: var(--surface); font-weight: 700; }
  .payments-stage-tab.auxiliary { margin-left: auto; }
  .payments-stage-dot { width: 6px; height: 6px; flex: 0 0 auto; border-radius: 50%; }
  .payments-stage-dot.planned { background: var(--amber); }
  .payments-stage-dot.sent { background: var(--blue); }
  .payments-stage-count {
    min-width: 20px; padding: 1px 6px; border-radius: 5px; background: var(--surface-2);
    color: var(--ink-3); font-size: 10.5px; line-height: 1.45; text-align: center;
  }
  .payments-stage-tab.active .payments-stage-count { background: rgba(255, 255, 255, .12); color: rgba(255, 255, 255, .72); }
  .payments-stage-panel[hidden] { display: none !important; }
  /* Rachunek nadawcy (2026-09-07): przełącznik nad etapami — bieżący vs płac (zastrzeżone). */
  .payments-account-switch {
    display: flex; align-items: center; gap: 6px; padding: 10px 14px 0;
    overflow-x: auto; background: var(--surface);
  }
  .payments-account-switch[hidden] { display: none !important; }
  .payments-account-tab {
    position: relative; flex: 0 0 auto; display: inline-flex; align-items: center; gap: 7px; min-height: 34px;
    padding: 6px 14px; border: 1.5px solid var(--line); border-radius: 9px;
    background: var(--surface); color: var(--ink-2); font: inherit; font-size: 13px; cursor: pointer;
  }
  .payments-account-tab:hover { border-color: var(--line-strong); background: var(--surface-2); }
  .payments-account-tab.active { border-color: var(--ink); background: var(--ink); color: var(--surface); font-weight: 700; }
  .payments-account-tab.restricted { border-color: #8B6ACB; color: #6D4FA1; }
  .payments-account-tab.restricted:hover { background: var(--violet-bg); }
  .payments-account-tab.restricted.active { border-color: #6D4FA1; background: #6D4FA1; color: #fff; }
  .payments-account-lock { font-size: 12px; }
  .payments-account-number { font-variant-numeric: tabular-nums; opacity: .75; }
  .payments-account-count { font-weight: 700; font-variant-numeric: tabular-nums; }
  .payments-account-due {
    width: 8px; height: 8px; flex: 0 0 auto; border-radius: 50%; background: var(--red);
    box-shadow: 0 0 0 2px var(--surface);
  }
  .payments-account-tab.active .payments-account-due { box-shadow: 0 0 0 2px var(--ink); }
  .payments-account-tab.restricted.active .payments-account-due { box-shadow: 0 0 0 2px #6D4FA1; }
  /* Pozycja zastrzeżona w kolejce: ta sama fioletowa obwódka co .v7-row.restricted na liście dokumentów. */
  table.payments-table tr.is-restricted td { box-shadow: inset 0 1.5px 0 #8B6ACB, inset 0 -1.5px 0 #8B6ACB; }
  table.payments-table tr.is-restricted td:first-child { box-shadow: inset 1.5px 1.5px 0 #8B6ACB, inset 0 -1.5px 0 #8B6ACB; border-top-left-radius: 8px; border-bottom-left-radius: 8px; }
  table.payments-table tr.is-restricted td:last-child { box-shadow: inset -1.5px 1.5px 0 #8B6ACB, inset 0 -1.5px 0 #8B6ACB; border-top-right-radius: 8px; border-bottom-right-radius: 8px; }
  .pay-restricted-mark { font-size: 11px; cursor: help; }
  .pay-bar-account { color: var(--ink-3); font-size: 11.5px; }
  .pay-bar-account.is-restricted { color: #6D4FA1; font-weight: 700; }
  .v6-batch-sender { margin: 0 0 6px; padding: 6px 10px; border-radius: 7px; background: var(--surface-2); font-weight: 600; }
  .v6-batch-sender.is-restricted { background: var(--violet-bg); color: #6D4FA1; }
  .payments-section-head {
    display: flex; align-items: center; justify-content: space-between; gap: 18px;
    min-height: 58px; padding: 11px 15px; border-bottom: 1px solid var(--line);
  }
  .payments-section-head h2 { margin: 0; font-size: 15px; letter-spacing: -.01em; }
  .payments-section-head p { margin: 1px 0 0; color: var(--ink-3); font-size: 11.5px; }
  .payments-section-count {
    flex: none; padding: 3px 8px; border-radius: 99px; background: var(--surface-2);
    color: var(--ink-2); font-size: 10.5px; font-weight: 700; white-space: nowrap;
  }
  .payments-table-scroll { width: 100%; overflow-x: auto; }
  table.docs.payments-table { min-width: 960px; table-layout: fixed; background: var(--surface); }
  .payments-table th { padding: 8px 12px; font-size: 9.5px; letter-spacing: .08em; background: var(--bg); }
  .payments-table td { padding: 10px 12px; font-size: 12.5px; }
  .payments-table .pay-select-cell { width: 4%; padding-left: 15px; padding-right: 6px; }
  .payments-table .pay-document-cell { width: 14%; }
  .payments-table .pay-contractor-cell { width: 29%; }
  .payments-table .pay-amount-cell { width: 12%; }
  .payments-table .pay-date-cell { width: 13%; font-variant-numeric: tabular-nums; white-space: nowrap; }
  .payments-table .pay-status-cell { width: 15%; }
  .payments-queue-table .pay-contractor-cell { width: 26%; }
  .payments-table .pay-remove-cell { width: 3%; padding-left: 0; padding-right: 10px; text-align: right; }
  .pay-remove-btn {
    width: 24px; height: 24px; padding: 0; border: none; border-radius: 6px; background: none;
    color: var(--ink-3, var(--ink-2)); font-size: 13px; line-height: 1; cursor: pointer; opacity: .55;
  }
  tr:hover .pay-remove-btn, .pay-remove-btn:focus-visible { opacity: 1; }
  .pay-remove-btn:hover { background: color-mix(in srgb, #DC2626 12%, transparent); color: #B91C1C; }
  .payments-table .pay-contractor-cell strong {
    display: -webkit-box; overflow: hidden; color: var(--ink); font-weight: 600; line-height: 1.3;
    -webkit-box-orient: vertical; -webkit-line-clamp: 2;
  }
  .payments-table .pay-contractor-cell small { margin-top: 2px; font-size: 10.5px; }
  .payments-table .pill { font-size: 10.5px; padding: 2px 7px; }
  .payments-table tbody tr { transition: background .12s ease; }
  .payments-card .v6-empty { padding: 28px 20px; }
  .payments-card .v6-loading { padding: 28px 20px; }
  .docs input[type="checkbox"] { accent-color: var(--accent); width: 16px; height: 16px; margin: 0; display: block; }
  .date-btn {
    background: none; border: none; padding: 0; font: inherit; font-size: 13.5px;
    color: var(--accent); font-weight: 650; text-decoration: underline dotted;
    text-underline-offset: 3px; white-space: nowrap; font-variant-numeric: tabular-nums;
  }
  .pay-bar {
    display: flex; align-items: center; justify-content: space-between; gap: 14px;
    min-height: 54px; padding: 9px 14px; border-top: 1px solid var(--line);
    background: color-mix(in srgb, var(--accent-soft) 45%, var(--surface));
  }
  .pay-bar.is-empty { background: var(--surface); }
  .pay-bar .btn { flex: none; min-width: 190px; }
  .pay-bar .btn[disabled] { opacity: .45; cursor: not-allowed; }
  .pay-bar-summary { display: flex; align-items: baseline; gap: 10px; min-width: 0; }
  .pay-bar-summary strong { font-size: 12.5px; }
  .pay-bar-summary span { color: var(--accent-strong); font-size: 12.5px; font-weight: 700; font-variant-numeric: tabular-nums; }
  .pay-bar-hint { color: var(--ink-3); font-size: 11.5px; }
  /* „+N dni od wystawienia" — pole dni + przycisk w modalu edycji terminu i akcji masowej. */
  .pay-days-row { display: flex; align-items: center; gap: 8px; }
  .pay-days-row .btn { flex: none; }
  .pay-days-input { width: 90px; }
  table.docs.payments-sent-table { min-width: 900px; }
  .payments-sent-table th:nth-child(1) { width: 15%; }
  .payments-sent-table th:nth-child(2) { width: 27%; }
  .payments-sent-table th:nth-child(3) { width: 12%; }
  .payments-sent-table th:nth-child(4) { width: 14%; }
  .payments-sent-table th:nth-child(5) { width: 14%; }
  .payments-sent-table th:nth-child(6) { width: 18%; }
  .pay-batch-cell {
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    color: var(--ink-2); font-variant-numeric: tabular-nums;
  }
  .payments-sent-table tbody tr, .payments-queue-table tbody tr { cursor: pointer; }
  .payments-sent-table tbody tr:hover, .payments-queue-table tbody tr:hover { background: var(--surface-2); }
  .pay-doc-link {
    background: none; border: none; padding: 0; font: inherit; font-size: 12.5px; cursor: pointer;
    color: var(--accent); font-weight: 650; text-decoration: underline dotted; text-underline-offset: 3px;
  }
  .v6-modal.payments-preview-modal { width: min(1100px, 100%); height: calc(100vh - 36px); }
  .payments-preview-meta { margin: 0 0 10px; color: var(--ink-2); font-size: 12.5px; }
  .payments-preview-frame-wrap {
    height: calc(100% - 30px); min-height: 320px; overflow: hidden;
    border: 1px solid var(--line); border-radius: 8px; background: var(--surface-2);
  }
  .payments-preview-frame { display: block; width: 100%; height: 100%; border: 0; }
  .payments-preview-missing { margin: 24px 0; color: var(--ink-2); font-size: 13px; }
  /* Płatności cykliczne v7 w kolejce: znacznik ↻ i karta zobowiązania w modalu (bez iframe). */
  .pay-recurring-mark { color: var(--accent); font-weight: 700; cursor: help; }
  .pay-manual-mark { color: var(--accent); font-weight: 700; cursor: help; }
  .payments-recurring-facts { display: grid; gap: 7px; margin: 4px 0; }
  .payments-recurring-fact { display: flex; justify-content: space-between; gap: 14px; margin: 0; font-size: 13px; }
  .payments-recurring-fact-label { color: var(--ink-2); }
  table.docs.payments-history-table { min-width: 820px; }
  .payments-history-table th:nth-child(1) { width: 31%; }
  .payments-history-table th:nth-child(2) { width: 18%; }
  .payments-history-table th:nth-child(3) { width: 17%; }
  .payments-history-table th:nth-child(4) { width: 9%; }
  .payments-history-table th:nth-child(5) { width: 15%; }
  .payments-history-table th:nth-child(6) { width: 10%; }
  .pay-batch-file { display: flex; align-items: center; gap: 8px; min-width: 0; }
  .pay-batch-file strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .pay-history-date, .pay-history-amount { font-variant-numeric: tabular-nums; white-space: nowrap; }
  .pay-download-cell { text-align: right; }

  /* toast */
  .toast {
    position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%) translateY(80px);
    background: var(--ink); color: var(--bg); border-radius: 11px; padding: 11px 18px;
    font-size: 13.5px; font-weight: 600; box-shadow: var(--shadow);
    transition: transform .3s ease; z-index: 50; max-width: 90vw;
  }
  .toast.show { transform: translateX(-50%) translateY(0); }

  @media (max-width: 760px) {
    .app { flex-direction: column; }
    .side { width: 100%; height: auto; position: static; flex-direction: row; align-items: center; overflow-x: auto; padding: 10px 12px; }
    .brand { padding: 0 12px 0 0; } .brand span { display: none; }
    .side-note { display: none; }
    .main { padding: 16px 14px 50px; }
    .type-row, .fields { grid-template-columns: 1fr; }
    .payments-page-head { align-items: flex-start; flex-direction: column; gap: 10px; }
    .payments-format-note { justify-content: flex-start; }
    .payments-section-head { align-items: flex-start; }
    .payments-stage-tab.auxiliary { margin-left: 0; }
    .pay-bar { align-items: stretch; flex-direction: column; }
    .pay-bar-summary { justify-content: space-between; }
    .pay-bar .btn { width: 100%; }
  }
  @media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation: none !important; transition: none !important; }
  }

/* ── v6 szkielet (K2.1): dopełnienia do bazy z makiety ── */
.legend i.sw-src { background: var(--blue-bg); }
.legend i.sw-human { background: var(--amber-bg); }
.legend i.sw-auto { background: var(--accent-soft); }
.legend i.sw-end { background: var(--green-bg); }
.mt-26 { margin-top: 26px; }

.nav-badge.is-zero { opacity: .5; }
.toast.is-error { background: var(--red); }

/* stany puste / ładowania (§3.7) */
.v6-empty { padding: 48px 24px; text-align: center; color: var(--ink-2); }
.v6-empty-title { font-size: 15px; font-weight: 600; color: var(--ink); margin: 0 0 6px; }
.v6-empty-hint { font-size: 13px; color: var(--ink-3); margin: 0; }
.v6-loading { display: flex; align-items: center; gap: 10px; padding: 40px 24px; color: var(--ink-2); font-size: 14px; }
.v6-spinner { width: 16px; height: 16px; border: 2px solid var(--line-strong); border-top-color: var(--accent);
  border-radius: 50%; display: inline-block; animation: v6spin .7s linear infinite; }
@keyframes v6spin { to { transform: rotate(360deg); } }

/* baner utraty sesji (§3.7) */
.v6-session-banner { display: none; background: var(--amber-bg); color: var(--amber); border-bottom: 1px solid var(--line);
  padding: 8px 16px; font-size: 13px; }
.v6-session-banner.show { display: block; }

/* ── modal (skrzynka: powód pominięcia; §3.2 — modale zamiast window.prompt) ── */
.v6-modal-backdrop { position: fixed; inset: 0; background: rgba(23,34,30,.45); display: flex;
  align-items: center; justify-content: center; z-index: 50; padding: 16px; }
.v6-modal-card { background: var(--surface); border: 1px solid var(--line); border-radius: 12px;
  box-shadow: var(--shadow); max-width: 460px; width: 100%; padding: 20px; }
.v6-modal-card h3 { margin: 0 0 6px; font-size: 16px; }
.v6-modal-card p { margin: 0 0 12px; font-size: 13px; color: var(--ink-2); }
.v6-modal-card textarea { width: 100%; min-height: 72px; border: 1px solid var(--line-strong);
  border-radius: 8px; padding: 8px; font: inherit; resize: vertical; }
.v6-modal-actions { display: flex; gap: 8px; justify-content: flex-end; margin-top: 14px; }
.inbox-detail-empty { padding: 40px 20px; text-align: center; color: var(--ink-3); }
.msg-item.is-skipped { opacity: .62; }
.mail-head-actions { display: flex; gap: 8px; margin-top: 12px; flex-wrap: wrap; }

/* ── §3.3 panel: pola edytowalne (nadpisują makietowe .field .val, które było read-only) ── */
.field span { display: block; font-size: 11.5px; color: var(--ink-3); font-weight: 650; margin-bottom: 3px; letter-spacing: .02em; }
.field input { width: 100%; border: 1px solid var(--line-strong); border-radius: 8px; padding: 7px 9px;
  font: inherit; background: var(--surface); color: var(--ink); }
.field input:focus { outline: 2px solid var(--accent-soft); border-color: var(--accent); }
.field.amber input { border-color: var(--amber); background: var(--amber-bg); }
.field.amber .field-hint { display: block; }
.doc-back { background: none; border: 0; color: var(--accent); font: inherit; cursor: pointer; padding: 4px 0; margin-bottom: 10px; }

/* ── §3.3 podgląd pliku + picker duplikatu ── */
.card.preview { display: flex; flex-direction: column; min-height: 320px; padding: 0; overflow: hidden; }
.doc-preview-frame { width: 100%; flex: 1; min-height: 320px; border: 0; background: var(--surface-2); }
.doc-preview-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 8px 12px; border-top: 1px solid var(--line); }
.mail-document-context { display: flex; align-items: center; justify-content: space-between; gap: 16px;
  margin-bottom: 10px; color: var(--ink-2); }
.mail-document-context > div { min-width: 0; display: grid; gap: 1px; }
.mail-document-context strong { color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mail-document-context span { font-size: 12.5px; }
.direct-preview { min-height: clamp(560px, calc(100vh - 250px), 900px); }
.direct-preview .doc-preview-frame { min-height: clamp(510px, calc(100vh - 300px), 850px); }
.direct-actions { position: sticky; bottom: 12px; z-index: 5; display: flex; align-items: center; flex-wrap: wrap;
  justify-content: space-between; gap: 18px; margin-top: 12px; padding: 12px 14px;
  background: color-mix(in srgb, var(--surface) 94%, transparent); border: 1px solid var(--line-strong);
  border-radius: 12px; box-shadow: 0 10px 34px rgba(0,0,0,.16); backdrop-filter: blur(12px); }
.direct-document-type { display: flex; align-items: center; gap: 8px; }
.direct-document-type strong { margin-right: 4px; }
.direct-proforma-form { flex: 1 1 100%; padding: 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-2); }
.direct-actions-copy { display: grid; gap: 1px; min-width: 220px; }
.direct-actions-copy span { color: var(--ink-2); font-size: 12.5px; }
.direct-actions-buttons { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.direct-register { min-width: 210px; padding-block: 10px; }
@media (max-width: 760px) {
  .mail-document-context, .direct-actions { align-items: stretch; flex-direction: column; }
  .direct-actions-buttons { justify-content: stretch; }
  .direct-actions-buttons .btn { flex: 1; }
  .direct-register { min-width: 100%; }
}
.dup-candidates { display: flex; flex-direction: column; gap: 8px; max-height: 320px; overflow: auto; }
.dup-candidate { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; text-align: left;
  background: var(--surface-2); border: 1px solid var(--line); border-radius: 8px; padding: 8px 10px;
  font: inherit; cursor: pointer; }
.dup-candidate:hover { border-color: var(--accent); background: var(--accent-soft); }
.dup-candidate small { color: var(--ink-3); width: 100%; }
.dup-section-label { font-size: 11px; font-weight: 700; color: var(--ink-3); text-transform: uppercase;
  letter-spacing: .06em; margin: 12px 0 6px; }

/* ── Pełna karta dokumentu w obiegu ── */
.v6-modal-overlay { position: fixed; inset: 0; z-index: 60; display: grid; place-items: center;
  padding: 18px; background: rgba(5,12,10,.66); }
.v6-modal { width: min(760px, 100%); max-height: calc(100vh - 36px); display: flex; flex-direction: column;
  overflow: hidden; background: var(--surface); border: 1px solid var(--line-strong); border-radius: 14px;
  box-shadow: 0 24px 80px rgba(0,0,0,.35); }
.v6-modal.workspace { width: min(1540px, 100%); height: calc(100vh - 36px); }
.v6-modal-title { flex: none; margin: 0; padding: 12px 16px; border-bottom: 1px solid var(--line);
  font-size: 15px; }
.v6-modal-body { flex: 1; min-height: 0; overflow: auto; padding: 16px; }
.v6-modal > .v6-modal-actions { flex: none; margin: 0; padding: 10px 16px; border-top: 1px solid var(--line); }
.document-workspace-grid { min-height: 100%; display: grid; grid-template-columns: minmax(430px, 46%) minmax(0, 1fr);
  gap: 14px; align-items: stretch; }
.document-workspace-preview { min-height: 680px; display: flex; flex-direction: column; overflow: hidden;
  background: var(--surface-2); border: 1px solid var(--line); border-radius: 10px; }
.document-workspace-preview iframe { width: 100%; flex: 1; min-height: 620px; border: 0; background: white; }
.document-workspace-form { min-width: 0; overflow: auto; }
.v6-detail-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
.v6-detail-head strong { font-size: 16px; }
.v6-detail-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.v6-document-detail { animation: none; }
.v6-document-page-head { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center;
  gap: 16px; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.v6-document-page-head .doc-back { margin: 0; align-self: start; padding-top: 4px; }
.v6-document-title h1 { font-size: 22px; }
.v6-document-title .eyebrow { margin-bottom: 2px; }
.v6-document-title .sub { margin: 2px 0 0; }
.v6-document-page-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.v6-ksef-meta-bar { display: grid; grid-template-columns: minmax(130px, .65fr) minmax(180px, 1fr) minmax(250px, 1.45fr) minmax(170px, .85fr) minmax(140px, .7fr);
  gap: 1px; margin: 12px 0 0; overflow: hidden; border: 1px solid color-mix(in srgb, var(--violet) 32%, var(--line));
  border-radius: 10px; background: var(--violet-bg); color: var(--ink); }
.v6-ksef-meta-item { display: grid; align-content: center; gap: 2px; min-width: 0; padding: 10px 14px;
  background: color-mix(in srgb, var(--violet-bg) 88%, var(--surface)); }
.v6-ksef-meta-label { color: var(--violet); font-size: 9.5px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.v6-ksef-meta-value { min-width: 0; overflow-wrap: anywhere; font-size: 12.5px; line-height: 1.35; }
.v6-ksef-meta-number .v6-ksef-meta-value { font-family: var(--mono); font-size: 11.5px; }
.v6-readonly-banner { display: flex; align-items: center; gap: 8px; margin: 10px 0 0; padding: 9px 12px;
  border: 1px solid var(--line-strong); border-radius: 9px; background: var(--surface-2); color: var(--ink-2); font-size: 11.5px; }
.v6-readonly-banner::before { content: '🔒'; }
.v6-readonly-banner strong { color: var(--ink); }
.v6-optima-review-banner { display: flex; align-items: center; gap: 12px; margin: 10px 0 0; padding: 10px 14px;
  border: 1px solid #e4b341; border-radius: 9px; background: #fff7df; color: var(--ink-2); font-size: 11.5px; }
.v6-optima-review-banner strong { color: #8a5a00; white-space: nowrap; }
.v6-document-progress { position: sticky; top: 0; z-index: 18; margin: 0 -8px 14px; padding: 10px 8px;
  border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--bg) 94%, transparent); backdrop-filter: blur(10px); }
.v6-progress-track { display: flex; align-items: flex-start; margin: 0; padding: 0; list-style: none; }
.v6-progress-step { position: relative; display: flex; flex-direction: column; align-items: center; gap: 5px;
  flex: 1; min-width: 120px; color: var(--ink-3); text-align: center; }
.v6-progress-step:not(:last-child)::after { content: ''; position: absolute; top: 14px; left: calc(50% + 19px); right: calc(-50% + 19px);
  height: 3px; border-radius: 3px; background: var(--surface-2); }
.v6-progress-step.complete:not(:last-child)::after { background: var(--accent); }
.v6-progress-marker { position: relative; z-index: 1; display: grid; place-items: center; width: 30px; height: 30px;
  border: 2px solid var(--line-strong); border-radius: 50%; background: var(--surface); color: var(--ink-3); font-size: 11px; font-weight: 850; }
.v6-progress-step.complete .v6-progress-marker { border-color: var(--accent); background: var(--accent); color: var(--accent-ink); }
.v6-progress-step.current .v6-progress-marker { border-color: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft); color: var(--accent); }
.v6-progress-label { padding: 0 8px; color: inherit; font-size: 11px; font-weight: 700; line-height: 1.25; }
.v6-progress-step.complete, .v6-progress-step.current { color: var(--ink); }
.v6-document-layout { --v6-document-preview-width: 46vw; display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; align-items: start; }
.v6-document-layout .v6-document-preview { display: none; position: sticky; top: 72px; height: calc(100vh - 88px); min-height: 620px; }
.v6-document-layout.with-preview { grid-template-columns: minmax(480px, 1fr) var(--v6-document-preview-width); }
.v6-document-layout.with-preview .v6-document-preview { display: flex; }
.v6-document-layout > .v6-document-form { overflow: visible; }
.v6-document-form #booking-v4-panel { margin-top: 0; }
.v6-document-form .v6-optima-pilot-host { margin: 16px 0 0; scroll-margin-top: 82px; }
.v6-document-preview { position: relative; border-radius: 0; background: #fff; }
.v6-document-preview-head {
  flex: 0 0 50px; min-height: 50px; display: flex; align-items: center; justify-content: space-between;
  gap: 10px; padding: 8px 10px 8px 14px; border-bottom: 1px solid var(--ds-line); background: #fff;
}
.v6-document-preview-head > div { min-width: 0; }
.v6-document-preview-head small { display: block; color: var(--ds-accent); font-size: 8px; font-weight: 800; letter-spacing: .08em; }
.v6-document-preview-head strong { display: block; margin-top: 3px; overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.v6-document-preview iframe { min-height: 0; }
.v6-document-preview-close {
  width: 30px; height: 30px; flex: 0 0 30px; border: 1px solid var(--ds-line); border-radius: 6px;
  background: #fff; color: var(--ds-ink); font-size: 18px; line-height: 1;
}
.v6-document-preview-close:hover { background: var(--ds-accent-soft); }
.v6-preview-resize-handle { position: absolute; left: -5px; top: 0; bottom: 0; z-index: 4; width: 10px; cursor: col-resize; }
.v6-preview-resize-handle::after {
  content: ''; position: absolute; left: 4px; top: 45%; width: 2px; height: 54px;
  border-radius: 2px; background: #b8c3d0; opacity: .65;
}
.v6-preview-resize-handle:hover::after,
.v6-preview-resize-handle:focus-visible::after { background: var(--ds-accent); opacity: 1; }
.v6-preview-resize-handle:focus-visible { outline: 2px solid var(--ds-accent); outline-offset: 1px; }
.v6-preview-resizing,
.v6-preview-resizing * { cursor: col-resize !important; user-select: none !important; }

/* Tryb otwartego dokumentu: nagłówek z akcjami jest jedynym topbarem, a lewy panel
   pokazuje dokumenty z filtra/etapu, z którego operator otworzył kartę. */
.v6-document-mode .topbar { display: none; }
body.v6-document-mode .topbar { display: none !important; }
.v6-document-mode .v6-document-page-head {
  position: sticky; top: 0; z-index: 30; grid-template-columns: minmax(0, 1fr) auto;
  margin: -16px 0 12px; padding: 14px 0 12px; background: var(--ds-canvas);
}
.v6-document-mode .v6-document-page-head > .doc-back { display: none; }
.v6-document-mode .v6-document-progress { position: static; }
.v6-legacy-shell.v6-document-mode .app { grid-template-columns: 270px minmax(0, 1fr); }
.v6-legacy-shell.v6-document-mode .side {
  padding: 0; overflow: hidden; border-right: 1px solid var(--ds-line); background: #fff; color: var(--ds-ink);
}
.v6-document-mode .side > .brand,
.v6-document-mode .side > .side-note { display: none; }
.v6-legacy-shell.v6-document-mode #v6-nav.v6-document-context {
  display: flex; flex-direction: column; gap: 0; height: 100%; overflow: hidden;
}
.v6-document-context-head {
  flex: 0 0 66px; height: 66px; display: flex; align-items: center; gap: 10px;
  padding: 9px 11px; border-bottom: 1px solid var(--ds-line); background: #fff;
}
.v6-document-context-back {
  height: 32px; flex: none; padding: 0 9px; border: 1px solid var(--ds-line);
  border-radius: 7px; background: #fff; color: var(--ds-accent); font-size: 10px; font-weight: 700;
}
.v6-document-context-back:hover { background: var(--ds-accent-soft); }
.v6-document-context-heading-copy { min-width: 0; }
.v6-document-context-head strong,
.v6-document-context-head small { display: block; }
.v6-document-context-head strong { color: var(--ds-ink); font-size: 13px; }
.v6-document-context-head small { margin-top: 2px; color: var(--ds-muted); font-size: 9px; line-height: 1.25; white-space: normal; }
.v6-document-context-list { flex: 1; min-height: 0; padding: 6px; overflow-y: auto; }
.v6-document-context-item {
  position: relative; display: block; width: 100%; padding: 9px; overflow: hidden;
  border: 0; border-bottom: 1px solid #edf0f4; border-radius: 6px;
  background: transparent; color: var(--ds-ink); text-align: left; text-decoration: none;
}
.v6-document-context-item:hover { background: #f6f9fb; }
.v6-document-context-item.active { background: var(--ds-accent-soft); box-shadow: inset 3px 0 var(--ds-accent); }
.v6-document-context-title-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-width: 0; }
.v6-document-context-title,
.v6-document-context-seller { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.v6-document-context-title { display: block; min-width: 0; color: var(--ds-ink); font-size: 11px; font-weight: 700; }
.v6-document-context-seller { display: block; margin-top: 4px; color: #505a69; font-size: 10px; }
.v6-document-context-meta { display: block; margin-top: 4px; color: var(--ds-muted); font-size: 9px; font-variant-numeric: tabular-nums; }
.v6-document-context-dot { width: 7px; height: 7px; flex: 0 0 7px; margin-top: 3px; border-radius: 50%; background: #c48a20; }
.v6-document-context-dot.status-paid { background: var(--ds-success); }
.v6-document-context-dot.status-unpaid { background: var(--ds-danger); }
.v6-document-context-dot.status-sent-to-bank,
.v6-document-context-dot.status-payable { background: var(--ds-accent); }
.v6-document-context-empty { margin: 14px; color: var(--ds-muted); font-size: 11px; }
.manual-document-host { min-height: 100%; }
.manual-stage { padding: 18px; box-shadow: none; }
.manual-stage h3 { margin: 0 0 4px; }
.manual-stage .muted { color: var(--ink-2); margin: 0 0 16px; }
.manual-verify-form { display: grid; gap: 14px; }
.manual-verify-form .fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.manual-check { display: flex; align-items: flex-start; gap: 8px; color: var(--ink-2); font-size: 12.5px; }
.manual-check input { margin-top: 2px; accent-color: var(--accent); }
@media (max-width: 980px) {
  .v6-modal-overlay { padding: 0; }
  .v6-modal.workspace { width: 100%; height: 100vh; max-height: none; border-radius: 0; }
  .document-workspace-grid { grid-template-columns: 1fr; }
  .document-workspace-preview { min-height: 60vh; }
  .manual-verify-form .fields { grid-template-columns: 1fr; }
  .v6-document-page-head { grid-template-columns: 1fr; }
  .v6-document-page-actions { justify-content: flex-start; }
  .v6-ksef-meta-bar { grid-template-columns: 1fr; }
  .v6-document-progress { overflow-x: auto; }
  .v6-progress-track { min-width: 650px; }
  .v6-document-layout.with-preview { grid-template-columns: 1fr; }
  .v6-document-layout .v6-document-preview { position: static; height: 60vh; min-height: 420px; }
  .v6-preview-resize-handle { display: none; }
}
.optima-pilot{display:grid;gap:10px;margin:12px 0;padding:14px;border:1px solid #d7e3e8;border-radius:12px;background:#f8fbfc;color:#18252d}
.optima-pilot-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.optima-pilot-head>div{display:grid;gap:3px}.optima-pilot-head small{color:#087f8c;font-size:9px;font-weight:850;letter-spacing:.08em}.optima-pilot-head strong{font-size:14px}
.optima-pilot-badge{padding:4px 8px;border-radius:999px;background:#dff4ed;color:#176b4b;font-size:9px;font-weight:800;text-transform:uppercase}
.optima-pilot-step{display:grid;grid-template-columns:28px minmax(180px,1fr) auto;align-items:center;gap:10px;padding:10px;border:1px solid #e0e7eb;border-radius:9px;background:#fff}.optima-pilot-step.done{border-color:#b8ddc8;background:#f4fbf7}.optima-pilot-step.waiting{opacity:.67}
.optima-pilot-number{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#e8f4f7;color:#087f8c;font-size:11px;font-weight:900}.optima-pilot-step.done .optima-pilot-number{background:#caecd8;color:#176b4b}
.optima-pilot-copy{display:grid;gap:3px;min-width:0}.optima-pilot-copy strong{font-size:11px}.optima-pilot-copy small{color:#65737d;font-size:10px;line-height:1.4}
.optima-pilot-status{color:#176b4b;font-size:10px;font-weight:800}.optima-inline-confirm{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap}.optima-inline-confirm>span{max-width:250px;color:#475761;font-size:10px}
.optima-pilot-alert,.optima-pilot-message{margin:0;padding:9px 11px;border-radius:8px;font-size:10px;line-height:1.45}.optima-pilot-alert,.optima-pilot-message.error{border:1px solid #edc571;background:#fff8e8;color:#7a4d00}.optima-pilot-message.success{border:1px solid #a9d7bb;background:#edf8f1;color:#17663b}
.optima-verification-summary{display:grid;gap:14px;margin:2px 10px 8px 48px;padding:16px 18px;border:1px solid #d9ccef;border-left:4px solid #7d58bc;border-radius:10px;background:linear-gradient(135deg,#faf8ff 0%,var(--violet-bg) 100%)}
.optima-verification-summary>header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:12px;border-bottom:1px solid #ded5ee}.optima-verification-summary>header>div{display:grid;gap:3px}.optima-verification-summary header small{color:#6e4da8;font-size:9px;font-weight:800;letter-spacing:.08em}.optima-verification-summary header h3{margin:0;font-size:14px}.optima-verification-summary>header>span{padding:4px 8px;border-radius:999px;background:#fff;color:#6e4da8;font-size:9px;font-weight:800}
.optima-verification-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.optima-verification-group{padding:12px;border:1px solid #e2d9f1;border-radius:8px;background:rgba(255,255,255,.72)}.optima-verification-group h4{margin:0 0 8px;color:#52616b;font-size:10px;text-transform:uppercase;letter-spacing:.05em}.optima-verification-group ul{display:grid;gap:7px;margin:0;padding:0;list-style:none}.optima-verification-group li{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.optima-verification-group li strong{font-size:10px;overflow-wrap:anywhere}.optima-verification-group li span{flex:0 0 auto;color:var(--ink-2);font-size:10px;white-space:nowrap}
.optima-verification-summary>footer{display:grid;gap:3px;padding-top:2px}.optima-verification-summary>footer span{color:#65737d;font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.05em}.optima-verification-summary>footer strong{font-size:10px;font-weight:600}
.v6-optima-pilot-host{margin-top:12px}
@media(max-width:720px){.optima-pilot-step{grid-template-columns:28px 1fr}.optima-pilot-step>.secondary-button,.optima-pilot-step>.optima-pilot-status,.optima-inline-confirm{grid-column:2;justify-self:start}.optima-pilot-head{align-items:flex-start}.optima-verification-summary{margin-left:0}.optima-verification-grid{grid-template-columns:1fr}}

/* ── V6 na sprawdzonym systemie wizualnym legacy ────────────────────────── */
:root,
:root[data-theme="light"] {
  --bg: var(--ds-canvas);
  --surface: var(--ds-surface);
  --surface-2: #eef1f5;
  --ink: var(--ds-ink);
  --ink-2: var(--ds-muted);
  --ink-3: var(--ds-subtle);
  --line: var(--ds-line);
  --line-strong: var(--ds-line-strong);
  --accent: var(--ds-accent);
  --accent-strong: var(--ds-accent-hover);
  --accent-ink: #fff;
  --accent-soft: var(--ds-accent-soft);
  --green: var(--ds-success);
  --green-bg: var(--ds-success-soft);
  --amber: var(--ds-warning);
  --amber-bg: var(--ds-warning-soft);
  --red: var(--ds-danger);
  --red-bg: var(--ds-danger-soft);
  --blue: var(--ds-accent);
  --blue-bg: var(--ds-accent-soft);
  --shadow: var(--ds-shadow);
  --sans: var(--ds-font);
}

html { font-size: 13px; }
body.v6-legacy-shell { min-width: 320px; background: var(--ds-canvas); color: var(--ds-ink); font-size: 13px; line-height: 1.4; }
.v6-legacy-shell .app { min-height: 100vh; display: grid; grid-template-columns: var(--ds-sidebar-width) minmax(0, 1fr); }
.v6-legacy-shell .workspace { min-width: 0; }
.v6-legacy-shell .side {
  position: sticky; top: 0; width: 100%; height: 100vh; padding: 18px 12px;
  overflow: hidden; border: 0; background: var(--ds-nav); color: #fff;
}
.v6-legacy-shell .brand { gap: 10px; padding: 0 7px 18px; }
.v6-legacy-shell .brand-mark { width: 32px; height: 32px; border-radius: 9px; background: #2c91ad; color: #fff; font-size: 17px; }
.v6-legacy-shell .brand b { color: #fff; font-size: 13px; }
.v6-legacy-shell .brand span { margin-top: 2px; color: #92a4bc; font-size: 9px; letter-spacing: .05em; }
.v6-legacy-shell #v6-nav { display: grid; gap: 5px; width: 100%; }
.v6-legacy-shell .nav-btn {
  gap: 10px; min-width: 0; padding: 8px 10px; overflow: hidden; border-radius: 8px;
  color: var(--ds-nav-text); font-size: 13px; font-weight: 500; white-space: normal;
}
.v6-legacy-shell .nav-btn:hover { color: #fff; background: rgba(255, 255, 255, .05); }
.v6-legacy-shell .nav-btn.active,
.v6-legacy-shell .nav-btn[aria-current="page"] { color: #fff; background: var(--ds-nav-soft); box-shadow: inset 3px 0 #2c91ad; font-weight: 750; }
.v6-legacy-shell .nav-btn .ico { width: 20px; flex: 0 0 20px; color: #8194ad; font-size: 15px; }
.v6-legacy-shell .nav-btn .menu-label { min-width: 0; overflow: hidden; line-height: 1.25; text-overflow: ellipsis; }
.v6-legacy-shell .nav-badge { background: #2c91ad; color: #fff; font-size: 10px; padding: 1px 7px; }
.v6-legacy-shell .side-note {
  display: flex; align-items: center; gap: 7px; margin-top: auto; padding: 14px 7px 0;
  border-top: 1px solid #30415b; color: #a9b7c9; font-size: 10px;
}
.v6-legacy-shell .side-note b { color: #c6d2e2; }
.shell-status-dot { width: 8px; height: 8px; flex: 0 0 8px; border-radius: 50%; background: #2db57d; box-shadow: 0 0 0 3px rgba(45,181,125,.16); }

.v6-legacy-shell .topbar {
  min-height: var(--ds-topbar-height); display: flex; align-items: center; justify-content: space-between;
  gap: 18px; padding: 0 var(--ds-page-x); border-bottom: 1px solid var(--ds-line); background: #fff;
}
.v6-legacy-shell .topbar h1 { margin: 1px 0 0; font-size: 20px; line-height: 1.1; letter-spacing: -.025em; }
.v6-legacy-shell .topbar .eyebrow { margin: 0; color: var(--ds-accent); font-size: 9px; font-weight: 800; letter-spacing: .12em; }
.shell-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; color: var(--ds-muted); }
.shell-actions > strong { color: #354057; font-size: 12px; }
.shell-env { padding: 4px 8px; border-radius: 999px; background: var(--ds-success-soft); color: var(--ds-success); font-size: 9px; font-weight: 850; }
.shell-refresh { width: 34px; padding: 0; font-size: 19px; }
.v6-legacy-shell .main { width: 100%; max-width: 1680px; margin: 0 auto; padding: 16px var(--ds-page-x) 30px; }

.v6-legacy-shell .card { border-color: var(--ds-line); border-radius: var(--ds-radius); box-shadow: var(--ds-shadow); }
.v6-legacy-shell .btn {
  min-height: 34px; padding: 0 12px; border-color: var(--ds-line-strong); border-radius: var(--ds-radius-sm);
  background: #fff; color: #465064; font-size: 12px; font-weight: 700;
}
.v6-legacy-shell .btn:hover { border-color: #aebbc7; background: #f6f8fa; color: var(--ds-ink); }
.v6-legacy-shell .btn.primary { border-color: var(--ds-accent); background: var(--ds-accent); color: #fff; }
.v6-legacy-shell .btn.primary:hover { border-color: var(--ds-accent-hover); background: var(--ds-accent-hover); color: #fff; }
.v6-legacy-shell .btn.small { min-height: 30px; padding: 0 9px; border-radius: 6px; font-size: 11px; }
.v6-legacy-shell .pill { min-height: 20px; padding: 0 7px; border-radius: 999px; font-size: 9px; font-weight: 780; }

/* Nazwa widoku jest w topbarze — bez podwójnego nagłówka w treści. */
.v6-legacy-shell #v6-main > .eyebrow:first-child,
.v6-legacy-shell #v6-main > h1,
.v6-legacy-shell #v6-main > .sub,
.v6-legacy-shell .view > .eyebrow:first-child,
.v6-legacy-shell .view > h1,
.v6-legacy-shell .view > .sub,
.v6-legacy-shell .payments-page-head { display: none; }

/* Rejestr dokumentów: te same proporcje i gęstość co w legacy. */
.document-summary {
  display: grid; grid-template-columns: repeat(4, minmax(150px, 1fr));
  min-height: 66px; margin-bottom: 12px; padding: 5px 8px; overflow-x: auto; box-shadow: none;
}
.document-summary-item {
  position: relative; display: grid; grid-template-columns: 5px minmax(0, 1fr) auto; align-items: center;
  gap: 10px; min-width: 0; padding: 8px 12px; border-left: 1px solid var(--ds-line);
}
.document-summary-item:first-child { border-left: 0; background: #eef7fa; border-radius: 7px; }
.document-summary-mark { width: 3px; height: 30px; border-radius: 3px; background: #2c91ad; }
.document-summary-item.paid .document-summary-mark { background: var(--ds-success); }
.document-summary-item.planned .document-summary-mark { background: var(--ds-danger); }
.document-summary-item.review .document-summary-mark { background: #d69017; }
.document-summary-item strong,
.document-summary-item small { display: block; }
.document-summary-item strong { color: #5e687b; font-size: 10px; }
.document-summary-item small { margin-top: 2px; color: var(--ds-subtle); font-size: 9px; }
.document-summary-item b { color: var(--ds-ink); font-size: 22px; font-variant-numeric: tabular-nums; }

.document-filter-panel {
  display: grid; grid-template-columns: 90px minmax(0, 1fr); align-items: center; gap: 7px 12px;
  margin-bottom: 12px; padding: 10px 12px; box-shadow: none;
}
.document-filter-label { color: var(--ds-muted); font-size: 9px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.document-filter-divider { grid-column: 1 / -1; height: 1px; background: #edf0f4; }
.document-filter-panel .chips { gap: 6px; margin: 0; }
.document-filter-panel .chip {
  min-height: 30px; padding: 0 10px; border-color: var(--ds-line-strong); border-radius: 7px;
  color: #536071; font-size: 10.5px; background: #fff;
}
.document-filter-panel .chip:hover { border-color: #9fb0bf; background: #f8fafc; }
.document-filter-panel .chip.sel { border-color: var(--ds-accent); background: var(--ds-accent-soft); color: var(--ds-accent); }
.document-filter-panel .chip .cnt { margin-left: 3px; }

.documents-register { overflow: hidden; }
.documents-register-head {
  min-height: 52px; display: flex; align-items: center; justify-content: space-between;
  padding: 9px 14px; border-bottom: 1px solid var(--ds-line); background: #fff;
}
.documents-register-head h2 { margin: 0; font-size: 14px; }
.documents-register-head p { margin: 1px 0 0; color: var(--ds-muted); font-size: 10px; }
.v6-legacy-shell #doc-table { overflow-x: auto; border: 0; border-radius: 0; box-shadow: none; }
table.docs.documents-table { min-width: 1260px; table-layout: fixed; }
.documents-table .col-document { width: 155px; }
.documents-table .col-stage { width: 180px; }
.documents-table .col-contractor { width: 225px; }
.documents-table .col-source { width: 72px; }
.documents-table .col-issued,
.documents-table .col-due { width: 92px; }
.documents-table .col-planned { width: 105px; }
.documents-table .col-payment { width: 142px; }
.documents-table .col-gross { width: 105px; }
.documents-table .col-actions { width: 150px; }
.documents-table th { padding: 8px 10px; background: #f7f8fa; color: #657086; font-size: 9px; letter-spacing: .05em; }
.documents-table td { height: 54px; padding: 7px 10px; color: #354057; font-size: 11.5px; line-height: 1.25; }
.documents-table .num strong { font-size: 12px; }
.documents-table .knt { color: #263147; font-weight: 650; }
.documents-table .knt small { margin-top: 2px; color: #8a94a4; font-size: 9.5px; font-weight: 500; }
.documents-table .sub-id { margin-top: 4px; }
.documents-table .stepper { gap: 3px; flex-wrap: nowrap; }
.documents-table .step { width: 18px; height: 4px; }
.documents-table .step-label { margin-left: 4px; overflow: hidden; color: #647083; font-size: 9.5px; text-overflow: ellipsis; white-space: nowrap; }
.documents-table tbody tr:hover { background: #f7fafc; }
.document-actions { display: flex; align-items: center; justify-content: flex-end; gap: 5px; }
.document-actions .btn.primary { min-width: 62px; }
.document-actions .btn:last-child { min-width: 62px; color: var(--ds-accent); }

/* Pozostałe widoki korzystają z tych samych kompaktowych paneli. */
.v6-legacy-shell .health { margin: 0 0 10px; padding: 8px 10px; border: 1px solid var(--ds-line); border-radius: var(--ds-radius); background: #fff; }
.v6-legacy-shell .inbox-search { min-height: 34px; border-radius: 6px; font-size: 11.5px; }
.v6-legacy-shell .qtab { min-height: 30px; padding: 0 10px; border-radius: 7px; font-size: 10.5px; }
.v6-legacy-shell .qtab.sel { border-color: var(--ds-accent); background: var(--ds-accent-soft); color: var(--ds-accent); }
.v6-legacy-shell .lane { padding: 13px 14px; margin-bottom: 10px; box-shadow: none; }
.v6-legacy-shell .payments-card { margin-bottom: 12px; box-shadow: none; }

@media (max-width: 980px) {
  .document-summary { grid-template-columns: repeat(4, minmax(170px, 1fr)); }
  .document-filter-panel { grid-template-columns: 1fr; }
  .document-filter-divider { grid-column: 1; }
}

@media (max-width: 760px) {
  .v6-legacy-shell .app { display: block; }
  .v6-legacy-shell .side { position: static; width: 100%; height: auto; padding: 9px 12px; }
  .v6-legacy-shell .brand,
  .v6-legacy-shell .side-note { display: none; }
  .v6-legacy-shell #v6-nav { grid-auto-flow: column; grid-auto-columns: minmax(120px, 1fr); overflow-x: auto; }
  .v6-legacy-shell .nav-btn { justify-content: center; }
  .v6-legacy-shell .nav-btn .ico { display: none; }
  .v6-legacy-shell .topbar { min-height: 62px; align-items: flex-start; padding-top: 10px; padding-bottom: 10px; }
  .shell-actions > strong,
  .shell-env { display: none; }
  .v6-legacy-shell .main { padding: 14px; }
  .document-summary { grid-template-columns: repeat(4, 165px); }
  .document-filter-panel { padding: 9px; }
}

/* ── Planowane wypływy (v6-outflows) ───────────────────────────────────────────────────────────
   Sekcja dopisana przez buildera widoku outflows. Wyłącznie selektory .v6-outflows-*;
   kolory/typografia z tokenów --ds-* (design-system.css — brak wariantów dark, więc jeden motyw).
   Kolory stanów: PLANNED accent · DEFERRED bursztyn (--ds-warning) · OVERDUE czerwień (--ds-danger)
   · IN_REGISTRATION szary + wzór kreskowany · SENT_TO_BANK niebieski (--ds-nav-soft). */

.v6-outflows-view { position: relative; font-family: var(--ds-font); }

/* Pasek podsumowania */
.v6-outflows-summary { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 22px; margin: 0 0 14px; padding: 10px 14px; border: 1px solid var(--ds-line); border-radius: var(--ds-radius); background: var(--ds-surface); box-shadow: var(--ds-shadow); font-size: 12.5px; color: var(--ds-ink); }
.v6-outflows-summary-item { display: inline-flex; align-items: baseline; gap: 5px; white-space: nowrap; }
.v6-outflows-summary-total strong { font-size: 14px; }
.v6-outflows-summary-overdue { color: var(--ds-danger); font-weight: 700; }
.v6-outflows-summary-unknown { color: var(--ds-muted); }

/* Karty sekcji */
.v6-outflows-card { margin-bottom: 14px; padding: 12px 14px; }
.v6-outflows-card-title { margin: 0 0 8px; font-size: 14px; color: var(--ds-ink); }

/* Legenda stanów nad osią */
.v6-outflows-legend { display: flex; flex-wrap: wrap; gap: 5px 16px; margin: 0 0 10px; font-size: 11px; color: var(--ds-muted); }
.v6-outflows-legend-item { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.v6-outflows-sw { display: inline-block; width: 10px; height: 10px; border-radius: 3px; }
.v6-outflows-sw-planned { background: var(--ds-accent); }
.v6-outflows-sw-deferred { background: var(--ds-warning); }
.v6-outflows-sw-overdue { background: var(--ds-danger); }
.v6-outflows-sw-inreg { background: repeating-linear-gradient(135deg, var(--ds-line-strong) 0 3px, var(--ds-subtle) 3px 5px); }
.v6-outflows-sw-sent { background: var(--ds-nav-soft); }
/* FORECAST = prognoza płatności cyklicznych v7 (miękka, poza horyzontem materializacji). */
.v6-outflows-sw-forecast { background: var(--ds-accent-soft); border: 1px dashed var(--ds-accent); }

/* Oś czasu — inline SVG */
.v6-outflows-svg { display: block; width: 100%; user-select: none; -webkit-user-select: none; touch-action: none; }
.v6-outflows-day { cursor: pointer; outline: none; }
.v6-outflows-hit { fill: transparent; }
.v6-outflows-day.is-hover .v6-outflows-hit,
.v6-outflows-day:focus .v6-outflows-hit { fill: var(--ds-accent-soft); }
.v6-outflows-seg-planned { fill: var(--ds-accent); }
.v6-outflows-seg-deferred { fill: var(--ds-warning); }
.v6-outflows-seg-overdue { fill: var(--ds-danger); }
.v6-outflows-seg-sent { fill: var(--ds-nav-soft); }
.v6-outflows-seg-forecast { fill: var(--ds-accent); opacity: .28; stroke: var(--ds-accent); stroke-dasharray: 2 2; }
.v6-outflows-hatch-bg { fill: var(--ds-line-strong); }
.v6-outflows-hatch-line { fill: var(--ds-subtle); }
.v6-outflows-axis-line { stroke: var(--ds-line-strong); stroke-width: 1; }
.v6-outflows-axis-label { fill: var(--ds-muted); font-family: var(--ds-font); font-size: 10px; }
.v6-outflows-axis-label.is-today { fill: var(--ds-accent); font-weight: 700; }
.v6-outflows-select { fill: var(--ds-accent-soft); stroke: var(--ds-accent); stroke-width: 1; opacity: .55; pointer-events: none; }

/* Dymek (div absolutny, także na focus) */
.v6-outflows-tooltip { position: absolute; z-index: 40; display: none; min-width: 210px; max-width: 320px; padding: 9px 11px; border: 1px solid var(--ds-line-strong); border-radius: var(--ds-radius-sm); background: var(--ds-surface); box-shadow: var(--ds-shadow); color: var(--ds-ink); font-size: 11.5px; line-height: 1.45; pointer-events: none; transform: translate(-50%, -100%); }
.v6-outflows-tooltip.is-visible { display: block; }
.v6-outflows-tooltip-title { margin: 0 0 5px; font-weight: 750; }
.v6-outflows-tooltip-row { display: flex; justify-content: space-between; gap: 14px; }
.v6-outflows-tooltip-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.v6-outflows-tooltip-amt { white-space: nowrap; font-variant-numeric: tabular-nums; }
.v6-outflows-tooltip-more { margin-top: 3px; color: var(--ds-muted); }
.v6-outflows-tooltip-sum { margin-top: 6px; padding-top: 5px; border-top: 1px solid var(--ds-line); font-weight: 700; }
.v6-outflows-tooltip-cum { margin-top: 2px; color: var(--ds-muted); }

/* Przypięte podsumowanie zakresu */
.v6-outflows-range-card { margin-bottom: 14px; padding: 11px 14px; border-color: var(--ds-accent); }
.v6-outflows-range-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 5px; color: var(--ds-ink); }
.v6-outflows-range-sums { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 14px; font-size: 12.5px; color: var(--ds-muted); }
.v6-outflows-range-sums strong { color: var(--ds-ink); font-size: 14px; }
.v6-outflows-range-states { display: flex; flex-wrap: wrap; gap: 6px 18px; margin-top: 8px; font-size: 11.5px; color: var(--ds-muted); }
.v6-outflows-range-state { display: inline-flex; align-items: center; gap: 7px; }
.v6-outflows-close { width: 26px; height: 26px; flex: 0 0 26px; display: grid; place-items: center; border: 1px solid var(--ds-line); border-radius: var(--ds-radius-sm); background: var(--ds-surface); color: var(--ds-ink); font-size: 15px; line-height: 1; cursor: pointer; }
.v6-outflows-close:hover { background: var(--ds-accent-soft); }

/* Pigułki stanów */
.v6-outflows-st-pill { display: inline-flex; align-items: center; padding: 1px 8px; border-radius: 999px; font-size: 10.5px; font-weight: 700; white-space: nowrap; }
.v6-outflows-st-planned { color: var(--ds-accent); background: var(--ds-accent-soft); }
.v6-outflows-st-deferred { color: var(--ds-warning); background: var(--ds-warning-soft); }
.v6-outflows-st-overdue { color: var(--ds-danger); background: var(--ds-danger-soft); }
.v6-outflows-st-inreg { color: var(--ds-muted); background: var(--ds-canvas); border: 1px dashed var(--ds-subtle); }
.v6-outflows-st-sent { color: var(--ds-surface); background: var(--ds-nav-soft); }
.v6-outflows-st-forecast { color: var(--ds-accent); background: var(--ds-accent-soft); border: 1px dashed var(--ds-accent); }

/* Kalendarz miesiąca */
.v6-outflows-cal-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; color: var(--ds-ink); }
.v6-outflows-cal-title { font-size: 14px; min-width: 130px; text-align: center; }
.v6-outflows-cal-total { margin-left: auto; font-size: 12.5px; font-weight: 700; color: var(--ds-ink); }
.v6-outflows-cal-nav { width: 28px; height: 28px; display: grid; place-items: center; border: 1px solid var(--ds-line-strong); border-radius: var(--ds-radius-sm); background: var(--ds-surface); color: var(--ds-ink); font-size: 15px; line-height: 1; cursor: pointer; }
.v6-outflows-cal-nav:hover { background: var(--ds-accent-soft); }
.v6-outflows-cal-nav:disabled { opacity: .4; cursor: default; background: var(--ds-surface); }
.v6-outflows-cal-grid { display: grid; grid-template-columns: 40px repeat(7, minmax(0, 1fr)); gap: 4px; }
.v6-outflows-cal-dow { padding: 2px 4px; font-size: 10px; font-weight: 750; letter-spacing: .05em; text-transform: uppercase; color: var(--ds-subtle); text-align: center; }
.v6-outflows-cal-week { display: grid; place-items: center; border-radius: var(--ds-radius-sm); background: var(--ds-canvas); color: var(--ds-muted); font-size: 10.5px; font-weight: 700; cursor: help; }
.v6-outflows-cal-week:focus { outline: 2px solid var(--ds-accent); outline-offset: 1px; }
.v6-outflows-cal-cell { position: relative; min-height: 62px; padding: 5px 7px; border: 1px solid var(--ds-line); border-radius: var(--ds-radius-sm); background: var(--ds-surface); color: var(--ds-ink); font-size: 11px; cursor: pointer; }
.v6-outflows-cal-cell.is-out,
.v6-outflows-cal-cell.is-past { background: var(--ds-canvas); color: var(--ds-subtle); }
.v6-outflows-cal-cell.is-today { border-color: var(--ds-accent); box-shadow: inset 0 0 0 1px var(--ds-accent); }
.v6-outflows-cal-cell.is-hover,
.v6-outflows-cal-cell.is-selecting { background: var(--ds-accent-soft); }
.v6-outflows-cal-cell:focus { outline: 2px solid var(--ds-accent); outline-offset: 1px; }
.v6-outflows-cal-daynum { display: block; font-weight: 700; font-size: 11px; }
.v6-outflows-cal-amount { display: block; margin-top: 2px; font-size: 10.5px; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.v6-outflows-cal-minibar { display: flex; height: 4px; margin-top: 4px; border-radius: 2px; overflow: hidden; background: var(--ds-canvas); }
.v6-outflows-mini { display: block; height: 100%; }
.v6-outflows-mini-planned { background: var(--ds-accent); }
.v6-outflows-mini-deferred { background: var(--ds-warning); }
.v6-outflows-mini-overdue { background: var(--ds-danger); }
.v6-outflows-mini-inreg { background: repeating-linear-gradient(135deg, var(--ds-line-strong) 0 2px, var(--ds-subtle) 2px 3px); }
.v6-outflows-mini-sent { background: var(--ds-nav-soft); }

/* Pasek „Niedatowane" */
.v6-outflows-undated-card { margin-bottom: 14px; padding: 4px 8px; }
.v6-outflows-undated-toggle { display: flex; align-items: center; gap: 9px; width: 100%; padding: 8px 6px; border: 0; background: transparent; color: var(--ds-ink); font-size: 12.5px; text-align: left; cursor: pointer; }
.v6-outflows-undated-toggle strong { font-weight: 750; }
.v6-outflows-undated-toggle span { color: var(--ds-muted); }
.v6-outflows-undated-arrow { width: 14px; flex: 0 0 14px; color: var(--ds-subtle); text-align: center; }
.v6-outflows-undated-list { padding: 2px 6px 8px 29px; }
.v6-outflows-undated-row { display: flex; align-items: baseline; gap: 14px; padding: 4px 0; border-top: 1px solid var(--ds-line); font-size: 12px; color: var(--ds-ink); }
.v6-outflows-undated-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.v6-outflows-undated-type { color: var(--ds-muted); white-space: nowrap; }
.v6-outflows-undated-amt { font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }

/* Drill-down dnia */
.v6-outflows-drill-card { margin-bottom: 14px; }
.v6-outflows-drill-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.v6-outflows-drill-sum { margin: 2px 0 10px; font-size: 12px; color: var(--ds-muted); }
.v6-outflows-drill-empty { margin: 6px 0 4px; color: var(--ds-muted); font-size: 12.5px; }
.v6-outflows-table-scroll { overflow-x: auto; }
.v6-outflows-drill-table { width: 100%; border-collapse: collapse; font-size: 12px; color: var(--ds-ink); }
.v6-outflows-drill-table th { padding: 6px 10px 6px 0; border-bottom: 1px solid var(--ds-line-strong); color: var(--ds-muted); font-size: 10px; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; text-align: left; white-space: nowrap; }
.v6-outflows-drill-table td { padding: 7px 10px 7px 0; border-bottom: 1px solid var(--ds-line); vertical-align: middle; }
.v6-outflows-td-doc { white-space: nowrap; font-weight: 700; }
.v6-outflows-td-name { min-width: 160px; }
.v6-outflows-td-amt { font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.v6-outflows-td-action { text-align: right; white-space: nowrap; }
.v6-outflows-overdue-note { color: var(--ds-danger); font-weight: 700; white-space: nowrap; }
.v6-outflows-show-btn { min-height: 26px; padding: 2px 10px; border: 1px solid var(--ds-line-strong); border-radius: var(--ds-radius-sm); background: var(--ds-surface); color: var(--ds-ink); font-size: 11px; font-weight: 700; cursor: pointer; }
.v6-outflows-show-btn:hover { border-color: var(--ds-accent); background: var(--ds-accent-soft); color: var(--ds-accent); }

@media (max-width: 760px) {
  .v6-outflows-cal-grid { grid-template-columns: 30px repeat(7, minmax(0, 1fr)); }
  .v6-outflows-cal-cell { min-height: 48px; padding: 4px 5px; }
  .v6-outflows-cal-amount { display: none; }
  .v6-outflows-cal-total { flex-basis: 100%; margin-left: 0; }
}

/* Karta dokumentu zachowuje geometrię workspace legacy: sidebar nigdy nie jest
   wypychany przez szerokie tabele formularza, a przewija się wyłącznie prawa kolumna. */
body.v6-document-mode { overflow: hidden; }
body.v6-document-mode .app {
  display: grid; grid-template-columns: 270px minmax(0, 1fr);
  width: 100%; height: 100vh; min-height: 0; overflow: hidden;
  transition: width .18s ease;
}
body.v6-document-mode.v6-document-preview-open .app {
  width: calc(100% - var(--v6-document-preview-width, 46vw));
}
body.v6-preview-resizing .app { transition: none; }
body.v6-document-mode .side {
  position: sticky; top: 0; width: 270px; min-width: 270px; height: 100vh;
}
body.v6-document-mode #v6-nav.v6-document-context .v6-document-context-item {
  display: block; align-items: initial; gap: 0;
}
body.v6-document-mode #v6-nav.v6-document-context .v6-document-context-back {
  display: inline-flex; align-items: center; justify-content: center; gap: 0;
  width: auto; min-width: 0; border: 1px solid var(--ds-line);
  background: #fff; color: var(--ds-accent);
}
body.v6-document-mode .workspace {
  width: 100%; height: 100vh; min-width: 0; overflow-x: hidden; overflow-y: auto;
}
body.v6-document-mode .main {
  width: 100%; max-width: none; min-width: 0; overflow-x: hidden;
}
body.v6-document-mode #v6-document-detail,
body.v6-document-mode .v6-document-form,
body.v6-document-mode #booking-v4-panel { width: 100%; min-width: 0; max-width: 100%; }
body.v6-document-mode #v6-document-detail { animation: none; transform: none; }
body.v6-document-mode .v6-document-title { min-width: 0; }
body.v6-document-mode .v6-document-title .sub {
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
body.v6-document-mode .v6-ksef-meta-bar {
  grid-template-columns: repeat(auto-fit, minmax(min(190px, 100%), 1fr));
}
body.v6-document-mode .v6-progress-track { min-width: 0; }
body.v6-document-mode .v6-progress-step { min-width: 0; }
body.v6-document-mode .v6-progress-label { overflow-wrap: anywhere; }
body.v6-document-mode .v4-lines-scroll,
body.v6-document-mode .table-scroll { width: 100%; max-width: 100%; overflow-x: auto; }

/* Podgląd jest osobnym, pełnowysokościowym panelem po prawej — tak jak
   quick/workspace preview w legacy. Formularz nie jest już zgniatany w siatce. */
.v6-document-layout.with-preview { grid-template-columns: minmax(0, 1fr); }
.v6-document-layout.with-preview .v6-document-preview {
  position: fixed; top: 0; right: 0; bottom: 0; z-index: 50;
  width: var(--v6-document-preview-width, 46vw); height: 100vh; min-height: 0;
  border: 0; border-left: 1px solid var(--ds-line); border-radius: 0;
  box-shadow: -12px 0 30px rgba(19, 31, 50, .13);
}
.v6-document-layout.with-preview .v6-document-preview iframe {
  width: 100%; min-width: 0; height: calc(100vh - 50px); min-height: 0;
}

@media (max-width: 1050px) {
  body.v6-document-mode.v6-document-preview-open .app { width: 100%; }
  .v6-document-layout.with-preview .v6-document-preview {
    width: min(var(--v6-document-preview-width, 75vw), 90vw);
  }
}

/* SPEC v7 §11.2 — informacyjna żółta ikona możliwej podwójnej płatności na liście płatności. */
.pay-double-warning { color: #b58900; cursor: help; }

/* Pilna płatność (flaga ASAP przelewu ręcznego) — widoczna w kolejce, w sekcji „Przekazane do
   banku" i na pozycjach modala generowania paczki. Znacznik informacyjny, nic nie blokuje. */
.pay-asap-mark { display: inline-block; margin-left: 6px; padding: 1px 6px; border-radius: 999px;
  background: #b3261e; color: #fff; font-size: 10px; font-weight: 700; letter-spacing: .04em;
  vertical-align: 1px; cursor: help; }
.v6-batch-item.is-asap { border-left: 3px solid #b3261e; padding-left: 9px; }