.px{--demo-h: 596px}.px__grid{display:grid;grid-template-columns:300px minmax(0,1fr) 300px;gap:12px;padding:12px;height:var(--demo-h)}.px__colA,.px__colC{display:flex;flex-direction:column;gap:12px;min-height:0}.px__inv{padding:14px;display:grid;gap:2px;transition:border-color var(--dur-base)}.px__inv.is-paid{border-color:#22c55e73}.px__invhead{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;margin-bottom:6px}.px__invhead div{display:grid;gap:2px}.px__invhead b{color:var(--ink);font-size:1rem}.px__line{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px solid var(--line);font-size:.8125rem;color:var(--ink);opacity:0;transform:translateY(4px);transition:opacity var(--dur-slow),transform var(--dur-slow) var(--ease-out)}.px__line.is-on{opacity:1;transform:none}.px__line--sub{font-size:.75rem;color:var(--muted);padding:4px 0}.px__line--sub em{font-style:normal;font-size:.6875rem;opacity:.8}.px__total{font-weight:700;font-size:1rem;border-bottom:0;padding-top:10px}.px__by{font-size:.6875rem;color:var(--muted)}.px__phone{flex:1;min-height:0;display:flex;flex-direction:column;gap:10px;padding:14px;border-radius:22px;background:#07080b;border:1px solid var(--line-strong);box-shadow:inset 0 0 0 4px #11141b}.px__sms{align-self:flex-start;max-width:92%;padding:10px 12px;border-radius:16px 16px 16px 4px;background:#1b2130;font-size:.8125rem;line-height:1.45;color:var(--ink);opacity:0;transform:translateY(6px);transition:opacity var(--dur-slow),transform var(--dur-slow) var(--ease-out-expo);overflow-wrap:anywhere}.px__sms.is-on{opacity:1;transform:none}.px__from{display:block;font-size:.6875rem;color:var(--muted);margin-bottom:3px}.px__sheet{margin-top:auto;display:grid;gap:8px;padding:14px;border-radius:16px;background:#f4f2ee;color:#111318;opacity:0;transform:translateY(16px);transition:opacity var(--dur-slow),transform var(--dur-slow) var(--ease-out-expo),background-color var(--dur-slow)}.px__sheet.is-on{opacity:1;transform:none}.px__sheet.is-paid{background:#22c55e;color:#0b0d12}.px__sheetT{font-size:.75rem;color:#5b616e}.px__sheet.is-paid .px__sheetT{color:#0b3d1d}.px__amt{font-size:1.75rem;letter-spacing:-.02em}.px__cardrow{display:flex;align-items:center;gap:6px;font-size:.8125rem;color:#3a3f4a}.px__paybtn{display:grid;place-items:center;height:40px;border-radius:10px;background:#111318;color:#fff;font-weight:650;font-size:.875rem}.px__paybtn.is-busy{opacity:.7}.px__done{display:grid;justify-items:center;gap:4px;padding:6px 0;text-align:center}.px__done b{font-size:1.125rem}.px__done span:last-child{font-size:.75rem}.px__check{display:grid;place-items:center;inline-size:36px;block-size:36px;border-radius:50%;background:#0b0d12;color:#22c55e}.px__cashsheet{background:#1b2130;color:var(--ink)}.px__cashsheet .px__sheetT,.px__cashsheet .px__cardrow{color:var(--muted)}.px__cashsheet .px__paybtn{background:#f5a524;color:#0b0d12}.px__cashsheet.is-paid{background:linear-gradient(180deg,#f5a52440,#f5a52414);color:var(--ink)}.px__cashok{display:flex;gap:6px;font-size:.75rem;line-height:1.4;color:#f5b54a}.px__ledger{display:flex;flex-direction:column;min-height:0;overflow:hidden}.px__lh{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;padding:14px 16px;border-bottom:1px solid var(--line);flex-wrap:wrap}.px__lh div{display:grid;gap:2px}.px__ticker{font-size:2rem;line-height:1;color:#4ade80;font-weight:500;letter-spacing:-.02em}.px__goal{font-size:.75rem;color:var(--muted)}.px__table{width:100%;font-size:.8125rem;border-collapse:collapse}.px__table th,.px__table td{padding:8px 12px;text-align:right;border-bottom:1px solid var(--line);white-space:nowrap}.px__table thead th{font:500 .625rem var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}.px__table th[scope=row],.px__table thead th:first-child{text-align:left}.px__table th[scope=row]{display:flex;align-items:center;gap:8px;font-weight:550;color:var(--ink)}.px__table tr{transition:background-color .6s var(--ease-out)}.px__table tr.is-flash{background:#22c55e1f}.px__av{display:grid;place-items:center;inline-size:22px;block-size:22px;border-radius:50%;background:var(--vc);color:#0b0d12;font:700 9px/1 var(--font-sans);flex:none}.px__amber,.px__neg{color:#f5b54a}.px__pos{color:#4ade80}.px__fine{margin-top:auto;padding:10px 16px;font-size:.6875rem;color:var(--muted);border-top:1px solid var(--line)}.px__batch{padding:14px;display:flex;flex-direction:column;gap:10px;flex:1;min-height:0;opacity:.5;transition:opacity var(--dur-slow),border-color var(--dur-base)}.px__batch.is-on{opacity:1}.px__batch.is-approved{border-color:#22c55e73}.px__bh{display:flex;justify-content:space-between;align-items:center;gap:8px}.px__bsum{display:grid;grid-template-columns:1fr 1fr;gap:8px}.px__bsum div{display:grid;gap:2px;padding:8px 10px;border-radius:10px;background:#ffffff0a}.px__bsum span{font-size:.6875rem;color:var(--muted)}.px__bsum b{font-size:1rem;color:var(--ink);font-weight:500}.px__blist{list-style:none;padding:0;margin:0;display:grid;gap:4px;align-content:start;overflow:auto;min-height:0;flex:1;font-size:.75rem;scrollbar-width:thin}.px__blist li{display:flex;justify-content:space-between;gap:8px;color:var(--ink-2)}.px__approve{height:36px;border-radius:9px;background:#f4f2ee;color:#0b0d12;font-weight:650;font-size:.8125rem}.px__approve[disabled]{opacity:.45}.px__batch.is-approved .px__approve{background:#22c55e;opacity:1}.px__approve:focus-visible{outline:none;box-shadow:0 0 0 2px #7aa2ff}.px__refund{padding:14px;display:grid;gap:10px;opacity:.45;transition:opacity var(--dur-slow),border-color var(--dur-base)}.px__refund.is-on{opacity:1;border-color:#f5a52473}.px__refund.is-done{border-color:#22c55e73}.px__ex{font:500 .625rem var(--font-mono);text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}.px__rsteps{list-style:none;padding:0;margin:0;display:grid;gap:7px;font-size:.75rem;line-height:1.4}.px__rsteps li{display:flex;gap:7px;color:var(--muted)}.px__rsteps li svg{flex:none;margin-top:1px}.px__rsteps li.is-on{color:var(--ink)}.px__rsteps li.is-on:nth-child(1) svg{color:#f5b54a}.px__rsteps li.is-on:nth-child(n+2) svg{color:#4ade80}@media(max-width:1150px){.px{--demo-h: auto}.px__grid{grid-template-columns:300px minmax(0,1fr);grid-template-rows:560px auto}.px__colC{grid-column:1 / -1;flex-direction:row}.px__colC>*{flex:1}.px__batch{min-height:260px}}@media(max-width:760px){.px__grid{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto;padding:8px}.px__colA{height:640px}.px__ledger{min-height:470px;overflow-x:auto}.px__colC{flex-direction:column}.px__table th,.px__table td{padding:7px 8px}.px__table{font-size:.75rem}}.px__cashsheet.is-paid .px__sheetT{color:#f5b54a}@media(max-width:480px){.px__table th:nth-child(2),.px__table td:nth-child(2){display:none}.px__table th,.px__table td{padding:7px 6px}.px__ticker{font-size:1.625rem}}
