:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light only;color:#1a1f36;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;--accent:#635bff;--accent-dark:#4f46e5;--border:#e3e8ee;--ink-soft:#697386;--panel:#fff;--success:#00875a;background:#f8f9fa;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif}*{box-sizing:border-box}body{background-color:#f8f9fa;min-width:320px;min-height:100vh;margin:0}button,input,select,textarea{font:inherit}a{color:inherit;text-decoration:none}.page-shell{background-color:#f8f9fa;min-height:100vh;padding:40px 24px;transition:padding-right .3s cubic-bezier(.16,1,.3,1)}.topbar{justify-content:space-between;align-items:center;gap:20px;max-width:1100px;margin:0 auto 32px;display:flex}.brand-group{align-items:center;gap:10px;display:flex}.logo-circle{border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;font-size:15px;font-weight:700;display:flex}.logo-circle.font-initial{background:var(--accent);color:#fff}.brand{color:#1a1f36;margin:0;font-size:16px;font-weight:700}.topbar-right{align-items:center;display:flex}.payer-email-label{color:var(--ink-soft);font-size:13px;font-weight:500}.secure-badge{border:1px solid var(--border);color:#4f566b;white-space:nowrap;background:#fff;border-radius:999px;align-items:center;gap:6px;min-height:28px;padding:0 12px;font-size:12px;font-weight:600;display:inline-flex}.invoice-layout{max-width:1100px;margin:0 auto}.invoice-layout.unpaid-layout{flex-direction:column;gap:24px;max-width:580px;display:flex}.invoice-layout.paid-layout{justify-content:center;align-items:center;min-height:calc(100vh - 160px);display:flex}.invoice-layout.paid-layout.drawer-open{padding-right:0}.invoice-layout.paid-layout.drawer-open .receipt-container{transform:translate(-160px)}.receipt-container{flex:1;justify-content:center;width:100%;max-width:500px;transition:transform .45s cubic-bezier(.25,1,.5,1);display:flex;transform:translate(0)}.invoice-panel{border:1px solid var(--border);background:var(--panel);color:#1a1f36;border-radius:12px;box-shadow:0 4px 12px #00000008}.overview-card{padding:40px}.overview-header{text-align:center;flex-direction:column;align-items:center;margin-bottom:24px;display:flex}.overview-eyebrow{text-transform:uppercase;letter-spacing:.05em;color:var(--ink-soft);margin-bottom:12px;font-size:12px;font-weight:700}.overview-amount{color:#0a2540;margin:0 0 8px;font-size:40px;font-weight:800;line-height:1.15}.overview-duedate{color:var(--ink-soft);margin:0;font-size:13px}.overview-download-row{border-bottom:1px solid #e3e8ee;justify-content:center;margin-bottom:20px;padding-bottom:20px;display:flex}.download-link{color:var(--accent);align-items:center;gap:6px;font-size:13px;font-weight:700;text-decoration:none;display:inline-flex}.download-link:hover{color:var(--accent-dark);text-decoration:underline}.overview-details{flex-direction:column;gap:12px;margin-bottom:28px;display:flex}.detail-row{grid-template-columns:80px 1fr;font-size:13px;display:grid}.detail-label{color:var(--ink-soft)}.detail-value{color:#1a1f36;font-weight:600}.detail-value.italic-value{color:#4f566b;font-style:italic;font-weight:400}.overview-action{flex-direction:column;gap:12px;display:flex}.details-card{padding:32px}.card-header{border-bottom:1px solid #e3e8ee;margin-bottom:16px;padding-bottom:16px}.card-heading{color:#1a1f36;margin:0;font-size:15px;font-weight:700}.line-items-section{border-bottom:1px solid #e3e8ee;flex-direction:column;gap:16px;margin-bottom:20px;padding-bottom:20px;display:flex}.item-row{justify-content:space-between;align-items:flex-start;display:flex}.item-info{flex-direction:column;gap:4px;display:flex}.item-info strong{color:#1a1f36;font-size:14px}.item-date{color:var(--ink-soft);font-size:12px}.item-price{color:#1a1f36;font-size:14px;font-weight:700}.totals-section{border-bottom:1px solid #e3e8ee;flex-direction:column;gap:10px;margin-bottom:20px;padding-bottom:20px;display:flex}.totals-section .totals-row{color:#4f566b;justify-content:space-between;font-size:13px;display:flex}.totals-section .emphasized-row{color:#1a1f36;font-size:15px;font-weight:700}.offline-payment-section{flex-direction:column;gap:14px;display:flex}.paying-another-way-btn{color:var(--accent);cursor:pointer;background:0 0;border:0;align-self:flex-start;align-items:center;gap:6px;padding:0;font-size:13px;font-weight:700;display:inline-flex}.paying-another-way-btn:hover{color:var(--accent-dark);text-decoration:underline}.receipt-card{border:1px solid var(--border);text-align:center;background:#fff;border-radius:12px;flex-direction:column;align-items:center;width:100%;padding:40px 32px;display:flex;box-shadow:0 4px 12px #00000008}.receipt-status-icon{width:56px;height:56px;color:var(--success);background:#d4f7ee;border-radius:50%;justify-content:center;align-items:center;margin-bottom:20px;display:flex}.check-icon{stroke-width:3px}.receipt-heading{color:#1a1f36;margin:0 0 8px;font-size:24px;font-weight:700}.receipt-amount{color:#1a1f36;letter-spacing:-.02em;margin-bottom:8px;font-size:40px;font-weight:800}.drawer-toggle-btn{color:var(--accent);cursor:pointer;background:0 0;border:0;align-items:center;gap:6px;margin:8px 0 32px;padding:0;font-size:13px;font-weight:700;transition:color .15s;display:inline-flex}.drawer-toggle-btn:hover{color:var(--accent-dark);text-decoration:underline}.receipt-meta{border-top:1px solid #e3e8ee;border-bottom:1px solid #e3e8ee;flex-direction:column;gap:12px;width:100%;margin-bottom:32px;padding:20px 0;display:flex}.receipt-meta-row{justify-content:space-between;font-size:13px;display:flex}.receipt-meta-row span{color:var(--ink-soft)}.receipt-meta-row strong{color:#1a1f36;font-weight:600}.receipt-actions{gap:12px;width:100%;display:flex}.receipt-btn{flex:1}.details-drawer{border-left:1px solid var(--border);z-index:1000;background:#fff;flex-direction:column;width:440px;height:100vh;transition:transform .45s cubic-bezier(.25,1,.5,1);display:flex;position:fixed;top:0;right:0;transform:translate(100%);box-shadow:-4px 0 24px #0000000d}.details-drawer.open{transform:translate(0)}.drawer-header{border-bottom:1px solid var(--border);align-items:center;padding:18px 24px;display:flex}.drawer-close-btn{color:var(--ink-soft);cursor:pointer;background:0 0;border:0;align-items:center;gap:8px;padding:0;font-size:13px;font-weight:600;transition:color .15s;display:flex}.drawer-close-btn:hover{color:#1a1f36}.drawer-content{flex-direction:column;flex:1;gap:24px;padding:24px;display:flex;overflow-y:auto}.details-heading{color:#1a1f36;align-items:center;gap:8px;margin:0;font-size:20px;font-weight:700;display:flex}.green-checkmark-icon{color:var(--success);flex-shrink:0}.details-section{flex-direction:column;display:flex}.section-label{text-transform:uppercase;color:var(--ink-soft);letter-spacing:.05em;margin:0 0 10px;font-size:11px;font-weight:700}.details-summary-box{background:#fff;border:1px solid #e3e8ee;border-radius:8px;flex-direction:column;gap:12px;padding:18px;display:flex;box-shadow:0 1px 3px #00000005}.summary-row{grid-template-columns:80px 1fr;align-items:start;font-size:13px;display:grid}.summary-row span{color:var(--ink-soft)}.summary-row strong{color:#1a1f36;font-weight:600}.memo-paragraph{color:#4f566b;margin:0;font-style:italic}.details-items{flex-direction:column;gap:14px;display:flex}.details-item-row{border-bottom:1px solid #e3e8ee;justify-content:space-between;align-items:flex-start;padding-bottom:14px;display:flex}.item-description-block{flex-direction:column;gap:4px;display:flex}.item-description-block strong{color:#1a1f36;font-size:14px}.item-description-block span{color:var(--ink-soft);font-size:12px}.item-amount{color:#1a1f36;font-size:14px;font-weight:600}.details-totals{border-top:1px solid #e3e8ee;flex-direction:column;gap:10px;width:100%;padding-top:14px;display:flex}.totals-row{color:#4f566b;justify-content:space-between;font-size:13px;display:flex}.totals-row.divider-top{border-top:1px solid #e3e8ee;margin-top:4px;padding-top:8px}.totals-row.emphasized{color:#1a1f36;font-size:15px;font-weight:700}.payment-history-box{background:#fff;border:1px solid #e3e8ee;border-radius:8px;padding:16px;box-shadow:0 1px 3px #00000005}.history-row{justify-content:space-between;align-items:center;font-size:13px;display:flex}.history-info{flex-direction:column;gap:2px;display:flex}.history-info strong{color:#1a1f36}.history-info span,.history-date{color:var(--ink-soft)}.details-footer{color:var(--ink-soft);align-items:center;gap:8px;margin-top:10px;font-size:13px;display:flex}.primary-action,.secondary-action,.offline-form button{cursor:pointer;border:0;border-radius:4px;justify-content:center;align-items:center;gap:8px;width:100%;min-height:44px;font-size:14px;font-weight:700;transition:background-color .15s,border-color .15s;display:inline-flex}.primary-action{background:var(--accent);color:#fff}.primary-action:hover{background:var(--accent-dark)}.primary-action:disabled,.offline-form button:disabled{cursor:not-allowed;opacity:.6}.dark-btn{color:#fff;background:#0a2540}.dark-btn:hover{background:#1e3d59}.secondary-action{border:1px solid var(--border);color:#4f566b;background:#fff;box-shadow:0 1px 2px #0000000d}.secondary-action:hover{color:#1a1f36;background:#f7fafc;border-color:#c1c9d2}.status-notice{border-radius:8px;margin-bottom:20px;padding:14px 18px;font-size:13px;font-weight:600;line-height:1.4}.status-notice.success{color:var(--success);background:#eefbf7;border:1px solid #bae4d8}.status-notice.neutral{color:#4f566b;background:#f4f6f8;border:1px solid #e3e8ee}.offline-form{border:1px solid var(--border);background:#f7fafc;border-radius:8px;gap:12px;padding:18px;display:grid}.offline-form label{color:var(--ink-soft);gap:6px;font-size:13px;font-weight:600;display:grid}.offline-form select,.offline-form textarea{border:1px solid var(--border);color:#1a1f36;background:#fff;border-radius:4px;width:100%;padding:10px 12px}.offline-form textarea{resize:vertical;min-height:80px}.offline-form button{margin-top:6px}.quiet-note,.security-note{border-radius:8px;gap:12px;padding:16px;font-size:13px;line-height:1.4;display:flex}.quiet-note{color:var(--success);background:#eefbf7;border:1px solid #bae4d8}.quiet-note strong{color:#0e4f43}.security-note{color:#4f566b;background:#f4f6f8;border:1px solid #e3e8ee}.security-note p{margin:0}.form-error{color:#a32121;background:#fff1f1;border:1px solid #f8cdcd;border-radius:8px;margin:10px 0 0;padding:12px;font-size:13px;font-weight:600}.empty-state{text-align:center;border:1px solid var(--border);background:#fff;border-radius:8px;align-content:center;place-items:center;gap:16px;max-width:500px;min-height:280px;margin:12vh auto 0;padding:40px;display:grid;box-shadow:0 4px 12px #00000008}.empty-state svg{color:var(--accent)}.spin{animation:.9s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (width<=920px){.page-shell{padding:32px 16px}.topbar{margin-bottom:24px}.invoice-layout.paid-layout{min-height:calc(100vh - 120px)}.invoice-layout.paid-layout.drawer-open{padding-right:0}.invoice-layout.paid-layout.drawer-open .receipt-container{transform:translate(0)}.details-drawer{width:100%;max-width:440px}}@media (width<=560px){.receipt-card{padding:32px 20px}.receipt-actions{flex-direction:column;gap:10px}.receipt-btn{width:100%}.overview-card{padding:24px}.details-card{padding:20px}.summary-row{grid-template-columns:1fr;gap:4px}.details-drawer{max-width:100%}}