.payret{--pr-acc:var(--dk-acc,var(--b600,#1668f0));--pr-ok:#16a34a;--pr-bad:#dc2626;--pr-warn:#d97706;z-index:240;left:0;right:0;bottom:calc(20px + env(safe-area-inset-bottom,0px));background:color-mix(in srgb, var(--dk-surface,#fff) 92%, transparent);-webkit-backdrop-filter:blur(16px)saturate(1.4);backdrop-filter:blur(16px)saturate(1.4);width:min(380px,100vw - 32px);box-shadow:0 22px 48px -22px #0f172a73, inset 0 0 0 1px var(--line,#e3e8f2);color:var(--ink,#0b1b3a);border-radius:18px;grid-template-columns:auto minmax(0,1fr) auto;align-items:start;gap:12px;margin-inline:auto;padding:14px 12px 14px 14px;animation:.45s cubic-bezier(.2,.8,.2,1) both payret-in;display:grid;position:fixed}html[data-theme=dark] .payret{--pr-ok:#4ade80;--pr-bad:#f87171;--pr-warn:#fbbf24;box-shadow:0 22px 48px -22px #000c, inset 0 0 0 1px var(--line)}.payret:before{content:"";background:var(--pr-acc);border-radius:18px 0 0 18px;width:4px;position:absolute;inset:0 auto 0 0}.payret[data-state=paid]:before{background:var(--pr-ok)}.payret[data-state=failed]:before{background:var(--pr-bad)}.payret[data-state=late]:before{background:var(--pr-warn)}.payret__ic{background:color-mix(in srgb, var(--pr-acc) 12%, transparent);width:40px;height:40px;color:var(--pr-acc);border-radius:13px;place-items:center;display:grid}.payret[data-state=paid] .payret__ic{background:color-mix(in srgb, var(--pr-ok) 15%, transparent);color:var(--pr-ok);animation:.5s cubic-bezier(.2,1.6,.4,1) both payret-pop}.payret[data-state=failed] .payret__ic{background:color-mix(in srgb, var(--pr-bad) 14%, transparent);color:var(--pr-bad)}.payret[data-state=late] .payret__ic{background:color-mix(in srgb, var(--pr-warn) 16%, transparent);color:var(--pr-warn)}.payret__ic svg{width:20px;height:20px}.payret__spin{border:2.5px solid color-mix(in srgb, var(--pr-acc) 22%, transparent);border-top-color:var(--pr-acc);border-radius:50%;width:20px;height:20px;animation:.8s linear infinite payret-spin}.payret__m{gap:3px;min-width:0;padding-top:1px;display:grid}.payret__m b{font:800 .92rem/1.3 var(--fd)}.payret__m small{color:var(--gray,#64748b);font-size:.8rem;line-height:1.45}.payret__m em{background:var(--dk-surface-2,#f4f7fd);font:800 .76rem/1.4 var(--fb);font-variant-numeric:tabular-nums;border-radius:999px;justify-self:start;margin-top:3px;padding:2px 9px;font-style:normal}.payret__link{color:var(--pr-acc);font:800 .8rem/1.3 var(--fb);justify-self:start;margin-top:4px;text-decoration:none}.payret__link:hover{text-decoration:underline}.payret__x{width:30px;height:30px;color:var(--gray,#64748b);cursor:pointer;background:0 0;border:0;border-radius:9px;place-items:center;display:grid}.payret__x:hover{background:var(--dk-surface-2,#f4f7fd);color:var(--ink,#0b1b3a)}.payret__x svg{width:15px;height:15px}@keyframes payret-in{0%{opacity:0;transform:translateY(14px)scale(.98)}}@keyframes payret-spin{to{transform:rotate(360deg)}}@keyframes payret-pop{0%{transform:scale(.6)}}@media (max-width:760px){.payret{width:auto;left:16px;right:16px;bottom:calc(76px + env(safe-area-inset-bottom,0px));margin:0}}@media (prefers-reduced-motion:reduce){.payret,.payret[data-state=paid] .payret__ic{animation:none}.payret__spin{animation-duration:2s}}
