.pay-root,.pay-dialog{
  --pay-ink:#233d32;--pay-line:#dce4da;--pay-soft:#f1f5ee;--pay-muted:#67746b;
  color:#29342e;font-family:inherit;font-size:14px;line-height:1.45;min-width:0;
}
.pay-root *,.pay-dialog *{box-sizing:border-box}
.pay-root svg,.pay-dialog svg{width:22px;height:22px;flex-shrink:0}
.pay-root button,.pay-dialog button{
  font:inherit;cursor:pointer;border:1px solid var(--pay-line);background:#fff;
  border-radius:12px;padding:10px 14px;color:var(--pay-ink);
}
.pay-root input,.pay-root select,.pay-dialog input,.pay-dialog select{
  font:inherit;caret-color:#000;color:var(--pay-ink);background:#fff;
  border:1px solid #d5dfd4;border-radius:12px;padding:11px 13px;min-width:0;width:100%;
}
.pay-root input:focus,.pay-root select:focus,.pay-dialog input:focus,.pay-dialog select:focus{
  outline:2px solid #5b7b65;outline-offset:2px;
}
.pay-root button:focus-visible,.pay-root a:focus-visible,.pay-root [tabindex]:focus-visible,.pay-dialog button:focus-visible{
  outline:2px solid #42674e;outline-offset:2px;
}
.pay-root button:disabled,.pay-dialog button:disabled{opacity:.55;cursor:wait}
.pay-horizontal{
  display:grid;grid-template-columns:230px minmax(0,1fr);border:1px solid var(--pay-line);
  border-radius:22px;background:#fff;overflow:hidden;min-height:65vh;
  box-shadow:0 8px 30px #283c3006;
}
.pay-sidebar{background:#f4f6f1;border-inline-end:1px solid var(--pay-line);padding:16px;max-height:85vh;overflow:auto}
.pay-main{padding:20px 24px;min-width:0}
.pay-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:14px;flex-shrink:0}
.pay-head>div:first-child{min-width:0;overflow-wrap:anywhere}
.pay-head h1{font-size:28px;line-height:1.15;margin:2px 0;letter-spacing:-.6px}
.pay-eyebrow{font-size:10px;letter-spacing:1.5px;color:var(--pay-muted);font-weight:750}
.pay-subtitle{font-size:12px;color:var(--pay-muted)}
.pay-tools,.pay-actions{display:flex;gap:8px;align-items:center}
.pay-root .pay-icon,.pay-dialog .pay-icon{
  height:42px;width:42px;display:inline-flex;align-items:center;justify-content:center;
  padding:10px;border:1px solid #e0e7dd;background:#f3f6f0;flex-shrink:0;
}
.pay-icon:hover{box-shadow:0 2px 8px #20352612}
.pay-tools .pay-icon:first-child{background:#233d32;color:#fff;border-color:#233d32}
.pay-root .pay-primary,.pay-dialog .pay-primary{
  background:#233d32;color:#fff;border-color:#233d32;font-weight:650;padding:12px 22px;
}
.pay-root .pay-primary:hover,.pay-dialog .pay-primary:hover{background:#315443}
.pay-all{display:flex;align-items:center;gap:10px;width:100%;margin-bottom:16px;text-align:start;font-weight:650!important}
.pay-all[aria-pressed=true]{background:#e4ede1!important;border-color:#bed0b9!important}
.pay-sidebar-label{display:block;padding:0 8px 8px;font-size:11px;font-weight:700;color:var(--pay-muted)}
.pay-object-list{min-width:0}
.pay-root .pay-object{
  width:100%;display:flex;align-items:center;gap:10px;text-align:start;margin:0 0 6px;
  padding:12px 10px;border-color:transparent;background:transparent;border-radius:14px;
}
.pay-root .pay-object:hover{background:#eaf0e6}
.pay-root .pay-object.selected{background:#e2edde;border-color:#bed0b9}
.pay-property-symbol{width:30px;height:34px;display:grid;place-items:center;color:#60765e;flex-shrink:0}
.pay-object-info{flex:1;min-width:0}
.pay-object strong{display:block;font-size:14px}
.pay-object small,.pay-member small{display:block;color:var(--pay-muted);font-size:11px;overflow-wrap:anywhere}
.pay-object>svg{width:14px;height:14px;color:#83917e}
.pay-object-balance{display:flex;align-items:center;gap:5px;font-size:12px;font-weight:650;margin-top:5px;font-variant-numeric:tabular-nums}
.pay-object-balance.unpaid{color:#975214}
.pay-object-balance.paid{color:#39734d}
.pay-object i{display:inline-flex;align-items:center;gap:3px;font-size:10px;font-style:normal;padding:2px 5px;background:#e0eaf7;color:#3f6399;border-radius:6px}
.pay-object i svg{width:12px;height:12px}
.pay-field{display:flex;flex-direction:column;gap:5px;margin-bottom:15px;font-size:13px}
.pay-field>span{font-weight:600;color:var(--pay-muted)}
.pay-field-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.pay-filters{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:12px;flex-shrink:0}
.pay-tabs{display:flex;gap:5px;flex-wrap:wrap}
.pay-root .pay-tabs button{
  display:inline-flex;align-items:center;justify-content:center;gap:7px;border:1px solid transparent;
  background:transparent;padding:9px 12px;color:var(--pay-muted);font-size:12px;font-weight:650;
}
.pay-tabs svg{width:17px;height:17px}
.pay-root .pay-tabs button[aria-pressed=true]{background:#e4ede0;border-color:#c6d5bf;color:#233d32}
.pay-section-tabs{padding:3px;background:#f4f6f0;border-radius:12px;margin-bottom:12px;flex-shrink:0;align-self:flex-start}
.pay-status-tabs{gap:6px}
.pay-root .pay-status-tabs button{background:#f5f7f3;border-color:#e5e9e1}
.pay-root .pay-status-tabs .pay-filter-unpaid{color:#9a571b;background:#fff4e5;border-color:#f0d4ae}
.pay-root .pay-status-tabs .pay-filter-paid{color:#29643e;background:#eaf6ed;border-color:#c6dfcc}
.pay-root .pay-status-tabs .pay-filter-review{color:#3c6096;background:#edf3fc;border-color:#cfddf1}
.pay-root .pay-status-tabs button[aria-pressed=true]{box-shadow:inset 0 0 0 1px currentColor}
.pay-search{display:flex;align-items:center;gap:7px;min-width:150px;max-width:300px;flex:1;border:1px solid var(--pay-line);border-radius:12px;background:#fafbf8;padding-inline-start:12px}
.pay-search>svg{width:17px;height:17px;color:#7c8779}
.pay-root .pay-search input{border:0;background:transparent;padding:10px 10px 10px 0;font-size:12px}
.pay-view{min-width:0}
.pay-invoices{display:flex;flex-direction:column}
.pay-bills{display:flex;flex-direction:column;gap:8px;min-width:0}
.pay-state-paid{--state-bg:#e2f2e6;--state-line:#b9d9c1;--state-accent:#3f965c;--state-ink:#245d38}
.pay-state-unpaid{--state-bg:#fff0db;--state-line:#ebc795;--state-accent:#d28a30;--state-ink:#89501b}
.pay-state-review{--state-bg:#e8effb;--state-line:#bfceea;--state-accent:#5b80ba;--state-ink:#375c92}
.pay-state-cancelled{--state-bg:#f1f2ef;--state-line:#d9ddd5;--state-accent:#9aa493;--state-ink:#697261}
.pay-cards{display:grid;gap:14px;align-content:start}
.pay-cards-horizontal{grid-template-columns:repeat(4,minmax(0,1fr))}
.pay-cards-vertical{grid-template-columns:minmax(0,1fr)}
.pay-cards>.pay-empty{grid-column:1/-1}
.pay-invoice-card{
  display:flex;flex-direction:column;min-width:0;padding:14px;border-radius:18px;
  border:1px solid var(--state-line);border-top:4px solid var(--state-accent);
  background:var(--state-bg);color:var(--pay-ink);
}
.pay-card-qr{padding:10px;margin-bottom:14px;background:#ffffffb8;border-radius:13px}
.pay-root .pay-qr-reveal{
  display:grid;place-items:center;position:relative;isolation:isolate;overflow:hidden;
  width:100%;max-width:232px;aspect-ratio:1;margin-inline:auto;padding:0;border:0;
  background:#fff;border-radius:8px;
}
.pay-qr-reveal img{display:block;width:100%;height:100%;object-fit:contain;background:#fff}
.pay-qr-reveal img[hidden]{display:none}
.pay-qr-fog{position:absolute;inset:12%;display:grid;place-items:center;pointer-events:none}
.pay-qr-fog svg{width:100%;height:100%;filter:blur(8px);opacity:.28;stroke-width:2.5}
.pay-qr-prompt{
  position:absolute;max-width:calc(100% - 20px);padding:10px 14px;border-radius:10px;
  background:#fffffff2;border:1px solid #d5dfd4;box-shadow:0 3px 14px #233d3212;
  color:#233d32;font-size:13px;font-weight:700;text-align:center;overflow-wrap:anywhere;
}
.pay-qr-reveal[data-qr-state=visible] .pay-qr-fog,.pay-qr-reveal[data-qr-state=visible] .pay-qr-prompt{display:none}
.pay-card-state{display:grid;place-items:center;min-height:110px;color:var(--state-accent)}
.pay-card-state svg{width:50px;height:50px;padding:11px;border-radius:50%;background:#ffffff8c}
.pay-card-heading{display:flex;align-items:center;gap:10px;margin-bottom:14px;min-width:0}
.pay-card-heading>div{min-width:0}
.pay-card-heading h2{font:inherit;font-weight:750;font-size:15px;line-height:1.3;margin:0;overflow-wrap:anywhere}
.pay-card-heading p{font-size:11px;margin:4px 0 0;color:var(--pay-muted);overflow-wrap:anywhere}
.pay-card-heading .pay-bill-mark{width:38px;height:40px;border-radius:11px}
.pay-card-heading .pay-bill-mark svg{width:23px;height:23px}
.pay-card-balance{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px}
.pay-card-balance>strong{font-size:21px;line-height:1.3;letter-spacing:-.4px;color:var(--state-ink);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.pay-card-due{font-size:11px;color:var(--pay-muted);margin:9px 0 16px;overflow-wrap:anywhere}
.pay-card-due strong{font-weight:600}
.pay-card-actions{display:grid;gap:7px;margin-top:auto}
.pay-qr-download,.pay-root .pay-card-details,.pay-root .pay-card-upload{display:flex;justify-content:center;align-items:center;gap:8px;min-height:42px;padding:10px;font:inherit;font-size:12px;font-weight:650;text-align:center;text-decoration:none;border-radius:10px;overflow-wrap:anywhere}
.pay-qr-download,.pay-root .pay-card-upload{color:#fff;background:#233d32;border:1px solid #233d32}
.pay-qr-download:hover,.pay-root .pay-card-upload:hover{background:#315443}
.pay-root .pay-card-details{background:#ffffff80;border-color:var(--state-line);color:var(--state-ink)}
.pay-receipt-summary{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-bottom:18px;padding:14px;background:#f3f6ef;border-radius:12px}
.pay-receipt-summary span{font-size:13px;overflow-wrap:anywhere}
.pay-receipt-summary strong{font-size:20px;font-variant-numeric:tabular-nums}
.pay-receipt-picker{position:relative;display:grid;grid-template-columns:42px minmax(0,1fr) 20px;align-items:center;gap:12px;width:100%;padding:16px;border:1px dashed #a9bba9;border-radius:16px;background:#f6f8f3;cursor:pointer;text-align:start}
.pay-receipt-picker:hover{background:#edf3e9;border-color:#6a886e}
.pay-receipt-picker:focus-within{outline:2px solid #42674e;outline-offset:3px}
.pay-receipt-picker.has-file{border-style:solid;border-color:#84a78a;background:#edf5ec}
.pay-root .pay-receipt-input,.pay-dialog .pay-receipt-input{position:absolute;inset:0;width:100%;height:100%;margin:0;padding:0;border:0;opacity:0;cursor:pointer}
.pay-receipt-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#233d32;color:#fff}
.pay-receipt-copy{min-width:0;display:grid;gap:4px}
.pay-receipt-copy strong{font-size:14px;color:var(--pay-ink)}
.pay-receipt-copy>span{font-size:12px;line-height:1.5;color:var(--pay-muted);overflow-wrap:anywhere}
.pay-receipt-indicator{display:flex;color:#59765c}
.pay-receipt-indicator svg{width:20px;height:20px}
.pay-receipt-picker.is-disabled{opacity:.5;cursor:default;pointer-events:none}
.pay-without-receipt{display:flex;align-items:center;gap:10px;margin:14px 0 20px;cursor:pointer;font-size:14px}
.pay-without-receipt input[type=checkbox]{width:20px;height:20px;flex:0 0 20px;margin:0;accent-color:#335e3d}
.pay-receipt-declaration{display:flex;align-items:center;gap:10px;padding:14px;background:#f3f6ef;border-radius:12px}
.pay-receipt-declaration svg{width:22px;height:22px;flex:0 0 22px}
.pay-card-actions svg{width:17px;height:17px}
.pay-invoice-card-vertical{padding:16px}
.pay-invoice-card-vertical .pay-card-heading h2{font-size:16px}
.pay-invoice-card-vertical .pay-card-balance>strong{font-size:24px}
.pay-invoice-card-vertical .pay-card-actions{grid-template-columns:minmax(0,1fr)}
@media(min-width:761px) and (max-width:1180px){.pay-cards-horizontal{grid-template-columns:repeat(2,minmax(0,1fr))}}
.pay-root .pay-bill{
  display:flex;gap:13px;align-items:center;text-align:start;flex-shrink:0;
  border:1px solid var(--state-line,var(--pay-line));border-inline-start:4px solid var(--state-accent,#a4b49b);
  border-radius:14px;padding:14px 16px;width:100%;min-height:84px;
  background:var(--state-bg,#f7f9f4);color:#29342e;
  transition:box-shadow .15s,border-color .15s;
}
.pay-root .pay-bill:hover{box-shadow:0 3px 10px #29422c13;border-color:var(--state-accent,#a4b49b)}
.pay-bill-mark{display:grid;place-items:center;background:#f5f7f2;width:44px;height:46px;border-radius:13px;color:#607755;flex-shrink:0}
.pay-bill-mark svg{width:24px;height:24px}
.pay-category-water{background:#e6f3fc;color:#2873a0}
.pay-category-electricity{background:#fff5cb;color:#a5780f}
.pay-category-residence{background:#e6efe1;color:#537344}
.pay-category-leasehold{background:#eee8f8;color:#7c5da4}
.pay-category-repair{background:#fce8dd;color:#a96538}
.pay-category-other{background:#e9ece9;color:#57675b}
.pay-bill-info{flex:1;min-width:0}
.pay-bill-info>strong{display:block;font-size:15px;line-height:1.35}
.pay-bill-meta{display:flex;flex-wrap:wrap;gap:3px 11px;color:#5d6c60;font-size:11px;margin-top:6px}
.pay-bill-meta>span{overflow-wrap:anywhere}
.pay-bill-sum{display:flex;flex-direction:column;align-items:flex-end;gap:7px;flex-shrink:0}
.pay-bill-sum>strong{font-size:16px;color:var(--state-ink,var(--pay-ink));font-variant-numeric:tabular-nums}
.pay-bill-open{display:flex;color:var(--state-accent,#7d8c73)}
.pay-bill-open svg{width:15px;height:15px}
.pay-status{display:inline-flex;align-items:center;justify-content:center;gap:5px;border-radius:8px;background:#e9ede5;color:#5f6e61;padding:4px 8px;font-size:11px;font-weight:650;line-height:1.25;white-space:nowrap}
.pay-status svg{width:13px;height:13px}
.pay-status.paid,.pay-status.approved,.pay-status.accepted{background:#c9e7d1;color:#245e38}
.pay-status.unpaid{background:#f8dcb4;color:#8b4b12}
.pay-status.review,.pay-status.pending{background:#d5e2f8;color:#355a91}
.pay-status.cancelled,.pay-status.expired{background:#e2e6df;color:#65715b}
.pay-status.rejected{background:#f4ded6;color:#934a3b}
.pay-card{background:#fff;border:1px solid var(--pay-line);border-radius:18px;padding:20px}
.pay-card header{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px}
.pay-card h2{display:flex;align-items:center;gap:9px;font-size:20px;margin:0;line-height:1.2}
.pay-card h2 svg{width:19px;height:19px;color:#698060}
.pay-card h3{font-size:15px;margin-top:24px;margin-bottom:12px}
.pay-empty{padding:32px 16px;text-align:center;color:#7b8875}
.pay-invoice{width:100%;max-width:1080px;margin:0 auto}
.pay-invoice-head{display:flex;gap:12px;align-items:center;padding-bottom:16px}
.pay-invoice-head>div{flex:1;min-width:0}
.pay-invoice-head>div>span{font-size:11px;color:var(--pay-muted)}
.pay-invoice-head h2{margin:3px 0 0;font-size:23px;line-height:1.2}
.pay-invoice-top{display:flex;align-items:stretch;gap:16px;margin-bottom:20px}
.pay-invoice-balance{flex:1;min-width:0;padding:20px;border-radius:17px;background:var(--state-bg,#f4f7ef);border:1px solid var(--state-line,var(--pay-line))}
.pay-invoice-balance h2{font-size:34px;margin:12px 0;letter-spacing:-1px;color:var(--state-ink,var(--pay-ink));font-variant-numeric:tabular-nums}
.pay-invoice-balance>strong{font-size:14px}
.pay-invoice-balance>p{font-size:11px;color:var(--pay-muted);margin-top:14px}
.pay-invoice-dates{display:flex;flex-wrap:wrap;gap:12px 28px;margin:14px 0 0;font-size:12px}
.pay-invoice-dates dt{font-size:11px;color:var(--pay-muted)}
.pay-invoice-dates dd{margin:3px 0 0;font-weight:650}
.pay-invoice-qr{display:grid;place-items:center;padding:12px;border:1px solid var(--pay-line);border-radius:17px}
.pay-invoice-qr .pay-photo img{width:180px;max-height:180px;border:0;border-radius:0}
.pay-photo{display:inline-flex;flex-direction:column;gap:7px;color:inherit;text-decoration:none;font-size:11px;max-width:100%}
.pay-photo img{max-width:220px;max-height:240px;object-fit:contain;border:1px solid #dce4d7;border-radius:12px;background:#fff}
.pay-photo>span{color:var(--pay-muted)}
.pay-lines{border-block:1px solid var(--pay-line);overflow-x:auto}
.pay-line{display:grid;grid-template-columns:minmax(120px,1fr) 85px 100px 120px;gap:12px;padding:14px 8px}
.pay-line>:not(:first-child){text-align:end;white-space:nowrap}
.pay-line-head{font-size:11px;color:var(--pay-muted);border-bottom:1px solid var(--pay-line);background:#f7f9f4}
.pay-reading{margin-top:20px}
.pay-reading p{margin:0 0 12px}
.pay-note{white-space:pre-wrap;margin:18px 0;color:var(--pay-muted)}
.pay-proof{margin-top:20px;padding-top:18px;border-top:1px solid var(--pay-line);display:grid;gap:18px}
.pay-proof:empty{display:none}
.pay-proof>div{display:flex;gap:14px;align-items:start;flex-wrap:wrap}
.pay-proof form{max-width:600px}
.pay-invitations{margin-top:16px}
.pay-member{display:grid;grid-template-columns:36px minmax(0,1fr) auto 42px;align-items:center;gap:12px;padding:14px 0;border-top:1px solid #e6ebe1}
.pay-member-info{min-width:0;overflow-wrap:anywhere}
.pay-member-info strong{display:block;font-size:13px}
.pay-member-info small{margin-top:4px}
.pay-email-setting{display:flex;align-items:flex-start;gap:8px;margin-top:10px;font-size:12px;line-height:1.5;color:var(--pay-muted);cursor:pointer}
.pay-email-setting input[type=checkbox]{width:18px;height:18px;min-width:18px;margin:0;accent-color:#335e3d;cursor:pointer}
.pay-email-setting:has(input:disabled){opacity:.65;cursor:wait}
.pay-email-properties{display:grid;gap:14px;margin-top:20px}
.pay-email-properties section{padding-top:14px;border-top:1px solid var(--pay-line)}
.pay-email-properties strong{font-size:13px;overflow-wrap:anywhere}
.pay-language-setting{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 14px;margin-block:22px;padding-block:20px;border-block:1px solid var(--pay-line)}
.pay-language-setting .pay-field{margin:0;grid-column:1;grid-row:1}
.pay-language-setting>.pay-primary{grid-column:2;grid-row:1;align-self:end}
.pay-language-setting>p{grid-column:1/-1;margin:0;color:var(--pay-muted);font-size:12px;line-height:1.5}
.pay-language-setting>.pay-form-error{color:#a5372e}
.pay-avatar{display:grid;place-items:center;width:36px;height:36px;border-radius:12px;background:#e7eee1;color:#506d44;font-size:12px;font-weight:750;flex-shrink:0}
.pay-invite-icon{background:#f0f3eb;color:#7c8971}
.pay-avatar svg{width:18px;height:18px}
.pay-role{font-size:11px;font-weight:600;padding:5px 8px;background:#f0f3eb;color:#65725c;border-radius:7px}
.pay-role.admin{background:#e5edf9;color:#45648e}
.pay-dialog{
  border:1px solid #dce4d7;border-radius:22px;padding:24px;width:min(690px,calc(100% - 24px));
  max-height:88dvh;background:#fff;box-shadow:0 24px 90px #17271b40;overflow:auto;
}
.pay-dialog::backdrop{background:#1a2a1d66;backdrop-filter:blur(5px)}
.pay-dialog>header{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:20px}
.pay-dialog h2{font-size:24px;margin:0}
.pay-radios{display:grid;grid-template-columns:1fr 1fr;gap:10px;border:0;margin:0;padding:8px 0 18px}
.pay-radios legend{color:var(--pay-muted);font-size:12px;font-weight:600}
.pay-radios label{display:flex;align-items:center;gap:8px;border:1px solid var(--pay-line);border-radius:12px;padding:14px 12px;font-size:13px;cursor:pointer}
.pay-radios label:has(input:checked){background:#edf4e8;border-color:#88a276}
.pay-radios input,.pay-dialog input[type=checkbox]{width:auto;accent-color:#335e3d}
.pay-dialog input[data-invite-link]{width:calc(100% - 54px);margin-inline-end:8px;margin-top:14px;font-size:12px}
.pay-manage{display:grid;gap:10px}
.pay-manage button{display:flex;align-items:center;gap:14px;text-align:start}
.pay-account-profile{display:flex;align-items:center;gap:12px;padding:16px;background:#f3f6ef;border-radius:14px;overflow-wrap:anywhere}
.pay-account-profile>div{min-width:0}
.pay-account-profile p{color:var(--pay-muted);font-size:12px;margin:4px 0 0}
.pay-form-error{color:#a23e31;font-size:13px;white-space:pre-line;margin-top:10px}
.pay-form-error:empty{display:none}
.pay-line-input{display:grid;grid-template-columns:1fr 90px 110px 35px;gap:10px;align-items:center}
.pay-years{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:18px}
.pay-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:14px 0}
.pay-metrics div{background:#f0f5ec;padding:16px;border-radius:14px}
.pay-metrics span,.pay-metrics strong{display:block}
.pay-metrics span{font-size:12px;color:var(--pay-muted)}
.pay-metrics strong{font-size:19px}
.pay-qr-list{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px}
.pay-qr-list figure{margin:0}
.pay-qr-list img{max-width:130px;max-height:140px}
.pay-qr-entry{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;margin-bottom:14px;border:1px solid var(--pay-line);border-radius:14px;background:#f7f9f4}
.pay-qr-entry strong,.pay-qr-entry>div,.pay-qr-entry button{display:flex;align-items:center;gap:8px}
.pay-qr-entry strong{font-size:13px}
.pay-qr-entry button{font-size:12px}
.pay-qr-entry svg{width:18px;height:18px}
.pay-qr-dialog{width:min(1100px,calc(100% - 24px))}
.pay-qr-hint{font-size:12px;color:var(--pay-muted);line-height:1.6}
.pay-qr-library{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px;margin-top:18px}
.pay-dialog .pay-qr-library button{display:flex;flex-direction:column;align-items:center;gap:10px;padding:16px;overflow-wrap:anywhere}
.pay-qr-library svg{width:28px;height:28px;color:var(--pay-muted)}
.pay-promptpay-number{max-width:380px}
.pay-promptpay-phone{font-size:15px;font-variant-numeric:tabular-nums;direction:ltr}
.pay-qr-library span{font-size:12px;color:var(--pay-muted)}
.pay-qr-upload{display:grid;grid-template-columns:120px minmax(0,1fr);gap:20px;align-items:center}
.pay-qr-upload>[data-qr-preview]{display:grid;place-items:center;min-height:120px;border:1px solid var(--pay-line);border-radius:12px;background:#fff}
.pay-qr-upload img{width:110px;height:110px;object-fit:contain}
.pay-qr-upload svg{width:36px;height:36px;color:var(--pay-muted)}
.pay-qr-upload .pay-field:last-child{margin-bottom:0}
.pay-qr-matrix{overflow:auto;max-height:50dvh;border:1px solid var(--pay-line);border-radius:12px;overscroll-behavior:contain}
.pay-qr-matrix table{border-collapse:separate;border-spacing:0;width:100%;min-width:760px;font-size:12px}
.pay-qr-matrix th,.pay-qr-matrix td{padding:5px;border-bottom:1px solid #e6ebe1;vertical-align:middle;text-align:start}
.pay-qr-matrix th:first-child{min-width:170px;position:sticky;inset-inline-start:0;background:#fff;z-index:1}
.pay-qr-matrix thead th{position:sticky;top:0;background:#eef3e9;z-index:2}
.pay-qr-matrix thead th:first-child{background:#eef3e9;z-index:3}
.pay-qr-matrix .pay-qr-project th,.pay-qr-matrix .pay-qr-project td{background:#f2f5ee;font-weight:650}
.pay-qr-toggle,.pay-qr-cell{display:flex;align-items:center;gap:8px;cursor:pointer;min-height:48px;padding:9px;border-radius:8px}
.pay-qr-toggle input,.pay-qr-cell input{flex:0 0 auto;width:17px!important;height:17px;cursor:pointer;accent-color:#335e3d}
.pay-qr-toggle span{overflow-wrap:anywhere}
.pay-qr-cell{border:1px solid transparent;background:#fafbf9;font-weight:400}
.pay-qr-cell-state{font-size:10px;line-height:1.4;max-width:125px;overflow-wrap:anywhere}
.pay-qr-cell.assigned,.pay-qr-legend .assigned{background:#fff2d9;border-color:#e3ce9d;color:#835b20}
.pay-qr-cell.selected{background:#e6f1e2;border-color:#b4cfaa;color:#356234}
.pay-qr-cell.replacing,.pay-qr-legend .replacing{background:#fce6e3;border-color:#e6a39d;color:#a6352b}
.pay-qr-cell.replacing input{accent-color:#bd4035}
.pay-qr-legend{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0;font-size:11px}
.pay-qr-legend span{padding:5px 10px;border:1px solid transparent;border-radius:7px}
.pay-qr-footer{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-top:16px}
.pay-qr-footer>p:first-child{flex:1;font-size:12px;color:var(--pay-muted)}
.pay-qr-footer .pay-form-error{flex-basis:100%;margin:0}
.pay-qr-footer .pay-qr-warning{color:#a6352b!important;font-weight:600}
.pay-qr-properties{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.pay-qr-property{display:flex;flex-direction:column;gap:12px;border:1px solid var(--pay-line);border-radius:12px;padding:12px;min-width:0}
.pay-qr-property>strong{display:flex;align-items:center;gap:7px;font-size:12px}
.pay-qr-property>div{flex:1;display:flex;flex-wrap:wrap;gap:8px;align-items:center;min-height:36px}
.pay-qr-property .pay-photo img{width:96px;height:96px;object-fit:contain;border:0;border-radius:0}
.pay-qr-property .pay-photo>span{display:none}
.pay-qr-property>button{font-size:12px}
.pay-qr-empty{color:var(--pay-muted);font-size:12px}
.pay-paging{display:flex;justify-content:center;gap:10px;padding-top:12px;flex-shrink:0}
.pay-paging button{display:flex;align-items:center;gap:8px;font-size:12px}
.pay-paging svg{width:16px;height:16px}
.pay-notice{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);max-width:90vw;background:#233d32;color:#fff;padding:12px 20px;border-radius:14px;box-shadow:0 8px 32px #13201730;z-index:9999;display:none}
.pay-notice.visible{display:block}
.pay-auth{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:65vh;padding:16px}
.pay-login{width:min(440px,100%);padding:32px;flex-shrink:0;box-shadow:0 12px 40px #293d2d09}
.pay-login h1{font-size:30px;letter-spacing:-.8px;margin:10px 0}
.pay-login>p{color:var(--pay-muted);font-size:13px;margin-bottom:22px}
.pay-login .pay-primary,.pay-login .pay-auth-submit{width:100%;min-height:48px;margin-top:8px}
.pay-login .pay-auth-submit{background:#f2f5ee;border-color:#ccd7c9;font-weight:600}
.pay-login .pay-auth-submit:hover{background:#e9eee5}
.pay-auth-divider{display:flex;align-items:center;gap:14px;margin:22px 0;color:var(--pay-muted);font-size:12px;text-align:center}
.pay-auth-divider::before,.pay-auth-divider::after{content:"";height:1px;background:var(--pay-line);flex:1}
.pay-auth-divider>span{max-width:75%}
.pay-login-actions{display:flex;justify-content:space-between;gap:8px;margin-top:12px}
.pay-root .pay-login-actions button{border:0;padding:6px 0;background:transparent;font-size:12px}
.pay-providers{display:grid;grid-template-columns:1fr;gap:10px;margin-top:18px}
.pay-login>.pay-providers{margin-top:0}
.pay-root .pay-provider,.pay-dialog .pay-provider{display:flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:12px;font-size:14px;font-weight:500;line-height:20px;letter-spacing:.25px}
.pay-root .pay-provider-google,.pay-dialog .pay-provider-google{background:#131314;border-color:#8e918f;color:#e3e3e3;font-family:Roboto,Arial,sans-serif}
.pay-root .pay-provider-google:hover,.pay-dialog .pay-provider-google:hover{background:#252526}
.pay-provider-logo{display:flex;align-items:center;justify-content:center;flex:0 0 20px}
.pay-provider-logo svg{display:block;width:20px;height:20px;stroke:none}
.pay-vertical{background:#fff;border:1px solid var(--pay-line);border-radius:18px;overflow:hidden}
.pay-mobile-select{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:12px;background:#f2f5ed;border-bottom:1px solid var(--pay-line)}
.pay-mobile-select.pay-single-project{grid-template-columns:1fr}
.pay-mobile-select .pay-field{margin:0;gap:4px}
.pay-mobile-select .pay-field>span{font-size:10px}
.pay-mobile-select select{padding:9px 11px}
.pay-mobile-main{padding:14px 12px;min-width:0}
.pay-vertical .pay-head h1{font-size:24px}
.pay-vertical .pay-head{gap:8px;margin-bottom:10px}
.pay-vertical .pay-filters{gap:8px}
.pay-vertical .pay-search{max-width:none;flex-basis:100%}
.pay-vertical .pay-bill{gap:9px;padding:12px 10px}
.pay-vertical .pay-bill-info>strong{font-size:13px}
.pay-vertical .pay-bill-meta{font-size:10px;gap:3px 7px}
.pay-vertical .pay-bill-sum>strong{font-size:14px}
.pay-vertical .pay-bill-sum{gap:6px}
.pay-vertical .pay-bill-open{display:none}
.pay-vertical .pay-bill-mark{width:34px;height:38px;border-radius:10px}
.pay-vertical .pay-bill-mark svg{width:21px;height:21px}
.pay-vertical .pay-status{font-size:10px;padding:4px 6px}
.pay-vertical .pay-status svg{width:12px;height:12px}
.pay-vertical .pay-status-tabs{width:100%;flex-wrap:nowrap;gap:4px}
.pay-vertical .pay-status-tabs button{padding:8px 7px;font-size:10px;flex:1 1 0;min-width:0;gap:4px}
.pay-vertical .pay-status-tabs button span{min-width:0;overflow-wrap:anywhere}
.pay-vertical .pay-status-tabs svg{width:14px;height:14px}
.pay-vertical .pay-section-tabs{margin-bottom:10px}
.pay-vertical .pay-invoice-top{flex-wrap:wrap}
.pay-vertical .pay-invoice-balance{padding:16px}
.pay-vertical .pay-invoice-qr{flex:1}
.pay-vertical .pay-invoice-head{gap:9px}
.pay-vertical .pay-invoice-head h2{font-size:20px}
.pay-vertical .pay-line{grid-template-columns:minmax(70px,1fr) 42px 64px 75px;font-size:11px;gap:6px;padding:12px 2px}
.pay-vertical .pay-metrics{grid-template-columns:1fr}
.pay-vertical .pay-card{padding:16px}
.pay-vertical .pay-photo img{max-width:180px}
.customer-page{height:100vh;height:100dvh;overflow:hidden;background:#f6f4ed;color:#233d32;font-family:Manrope,system-ui,sans-serif}
.customer-page>.h-site,.customer-page>.v-site{height:100%;display:flex;flex-direction:column;overflow:hidden}
.customer-page .customer-header{position:relative;top:auto;height:68px;flex:0 0 68px;padding:8px 20px;gap:18px;border-bottom:0}
.customer-header .h-brand,.customer-header .v-brand{width:124px}
.customer-header .h-brand img,.customer-header .v-brand img{width:124px;height:48px}
.customer-header-title{font-size:13px;font-weight:650;color:#67735f;letter-spacing:.2px;border-inline-start:1px solid #d5ddcc;padding-inline-start:18px}
.customer-header-controls{margin-inline-start:auto}
.customer-header summary{border-radius:10px}
.customer-main{display:flex;flex:1;min-height:0;min-width:0;width:100%;max-width:none;margin:0;padding:0 16px 16px;overflow:hidden}
.customer-main>[data-payments]{position:relative;display:flex;flex-direction:column;flex:1;min-height:0;min-width:0}
.customer-page .pay-root{display:flex;flex-direction:column;flex:1;min-height:0}
.customer-page .pay-horizontal{grid-template-columns:clamp(190px,18vw,240px) minmax(0,1fr);height:100%;min-height:0;flex:1}
.customer-page .pay-sidebar{display:flex;flex-direction:column;max-height:none;min-height:0;overflow:hidden}
.customer-page .pay-sidebar>.pay-field,.customer-page .pay-sidebar>.pay-all,.customer-page .pay-sidebar-label{flex-shrink:0}
.customer-page .pay-object-list{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain}
.customer-page .pay-main,.customer-page .pay-mobile-main{display:flex;flex-direction:column;min-height:0;overflow:hidden}
.customer-page .pay-view{flex:1;min-height:0}
.customer-page .pay-scroll{overflow:auto;overscroll-behavior:contain;padding:2px 6px 10px 2px;scrollbar-gutter:stable}
.customer-page .pay-bills{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:2px 6px 4px 2px;scrollbar-gutter:stable}
.customer-page .pay-vertical{display:flex;flex-direction:column;height:100%;min-height:0;flex:1}
.customer-page .pay-mobile-select{flex-shrink:0}
.customer-page .pay-mobile-main{flex:1}
.customer-page .pay-vertical .pay-invoice-top{flex-direction:column;flex-wrap:nowrap;gap:12px}
.customer-page .pay-vertical .pay-invoice-balance,.customer-page .pay-vertical .pay-invoice-qr{flex:none;width:100%}
.customer-page .pay-vertical .pay-invoice-qr{padding:20px;background:#fff}
.customer-page .pay-vertical .pay-invoice-qr .pay-photo{align-items:center;text-align:center}
.customer-page .pay-vertical .pay-invoice-qr .pay-photo img{width:240px;max-width:100%;height:auto;max-height:none}
.customer-page .pay-auth{overflow:auto;justify-content:flex-start;padding:18px}
.customer-page .pay-login{margin-block:auto}
@media(max-width:760px){
  .pay-qr-entry{align-items:stretch;flex-direction:column}
  .pay-qr-entry>div{flex-wrap:wrap}
  .pay-qr-entry button{flex:1;justify-content:center}
  .pay-qr-upload{grid-template-columns:85px minmax(0,1fr);gap:12px}
  .pay-qr-upload>[data-qr-preview]{min-height:85px}
  .pay-qr-upload img{width:80px;height:80px}
  .pay-qr-dialog{padding:14px}
  .customer-page .customer-header{height:60px;flex-basis:60px;padding:7px 12px;gap:12px}
  .customer-header .h-brand,.customer-header .v-brand{width:110px}
  .customer-header .h-brand img,.customer-header .v-brand img{width:110px;height:43px}
  .customer-header-title{font-size:11px;padding-inline-start:12px}
  .customer-main{padding:0 8px max(8px,env(safe-area-inset-bottom))}
  .pay-dialog{padding:18px}
  .pay-field-grid{grid-template-columns:1fr}
  .pay-years{grid-template-columns:repeat(2,1fr)}
  .pay-line-input{grid-template-columns:1fr 1fr 35px}
  .pay-line-input .pay-field:first-child{grid-column:1/-1}
  .pay-login{padding:24px}
  .pay-invoice-balance h2{font-size:29px}
  .pay-root input,.pay-root select,.pay-dialog input,.pay-dialog select{font-size:16px}
  .pay-root .pay-search input{font-size:16px;padding-block:9px}
  .pay-member{grid-template-columns:36px minmax(0,1fr) 42px;gap:7px 10px}
  .pay-member>.pay-avatar{grid-row:1 / span 2}
  .pay-member>.pay-role,.pay-member>.pay-status{grid-column:2;grid-row:2;justify-self:start}
  .pay-member>.pay-icon{grid-column:3;grid-row:1 / span 2}
}
@media(max-width:390px){
  .pay-vertical .pay-status-tabs svg{display:none}
  .pay-vertical .pay-bill{gap:7px;padding-inline:8px}
  .pay-vertical .pay-bill-sum>strong{font-size:13px}
  .pay-vertical .pay-head .pay-icon{width:38px;height:38px}
  .pay-vertical .pay-line{grid-template-columns:minmax(55px,1fr) 35px 60px 70px}
}
@media(prefers-reduced-motion:reduce){.pay-root .pay-bill{transition:none}}
@media print{
  body *{visibility:hidden}
  body.customer-page,body.customer-page>.h-site,body.customer-page>.v-site,.customer-main,.customer-main>[data-payments],.customer-page .pay-root,.customer-page .pay-horizontal,.customer-page .pay-vertical,.customer-page .pay-main,.customer-page .pay-mobile-main,.customer-page .pay-view{height:auto;overflow:visible;display:block;position:static}
  .customer-header,.pay-sidebar,.pay-mobile-select,.pay-head,.pay-section-tabs{display:none!important}
  .pay-invoice,.pay-invoice *{visibility:visible}
  .pay-invoice{position:absolute;inset:0;padding:25px;max-width:none}
  .pay-invoice button,.pay-proof{display:none!important}
  .pay-invoice .pay-photo img{max-height:150px}
  .pay-invoice-head .pay-icon{display:none}
  .pay-invoice-head{padding:0}
  .pay-invoice-top{margin-top:15px}
}
