:root{--bg-a: #eef7f3;--bg-b: #f8f2ff;--ink: #15213d;--ink-soft: #5a6786;--line: #d9dfec;--surface: #ffffff;--emerald: #0f8f58;--blue: #2a52d6;--amber: #a56b00;--danger: #b42318;--radius-lg: 8px;--radius-sm: 8px}*{box-sizing:border-box}body{margin:0;font-family:Manrope,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;color:var(--ink);background:linear-gradient(135deg,var(--bg-a) 0%,#fbfcff 48%,var(--bg-b) 100%)}.shell{min-height:100dvh;padding:28px 14px}.card{max-width:760px;margin:0 auto;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:22px;box-shadow:0 14px 38px #16255014}.masthead{margin-bottom:18px}.eyebrow{margin:0;text-transform:uppercase;letter-spacing:.09em;font-weight:700;font-size:12px;color:var(--blue)}.title{margin:8px 0 0;font-size:clamp(1.6rem,2.5vw,2rem)}.status-row{margin-bottom:14px}.badge{display:inline-flex;align-items:center;border-radius:999px;font-weight:700;font-size:12px;letter-spacing:.04em;text-transform:uppercase;border:1px solid #ccead8;color:var(--emerald);background:#eefcf4;padding:5px 11px}.badge.off{border-color:#f0d7ce;color:var(--danger);background:#fff5f3}.facts-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:16px}.fact{border:1px solid var(--line);border-radius:var(--radius-sm);background:#fbfcff;padding:11px 12px}.label{margin:0 0 4px;font-size:12px;color:var(--ink-soft)}.value{margin:0;font-weight:700;font-size:15px}.btn{border:0;border-radius:8px;color:#fff;background:linear-gradient(100deg,var(--emerald),var(--blue));font-weight:700;font-size:14px;padding:11px 14px;cursor:pointer}.btn[disabled]{opacity:.58;cursor:not-allowed}.btn.secondary{color:var(--ink);background:#f0f4ff;border:1px solid #d8e1ff}.panel{margin:10px 0;border-radius:8px;border:1px solid #d8e1ff;background:#f5f8ff;color:#25417c;font-size:13px;padding:10px 12px}.panel.error{border-color:#f3d4d0;background:#fff6f5;color:var(--danger)}.panel.loading{color:var(--ink-soft);border-color:var(--line);background:#fbfcff}.panel.info{border-color:#cfe3db;background:#f3faf7;color:#23483c}.document-wrap{display:grid;gap:14px}.document-heading{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;border-bottom:1px solid var(--line);padding-bottom:14px}.document-heading h2{margin:3px 0 0;font-size:1.45rem}.amount-due{min-width:180px;text-align:right}.amount-due strong{display:block;font-size:1.55rem}.line-items{display:grid;gap:8px}.line-item{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;border:1px solid var(--line);border-radius:var(--radius-sm);padding:12px;background:#fbfcff}.line-item strong,.line-item span{display:block}.line-item span{margin-top:3px;color:var(--ink-soft);font-size:13px}.line-item-numbers{text-align:right;white-space:nowrap}.totals{display:grid;gap:8px;margin:0 0 0 auto;width:min(100%,300px)}.totals div{display:flex;justify-content:space-between;gap:16px;border-bottom:1px solid var(--line);padding-bottom:8px}.totals div:last-child{border-bottom:0;padding-bottom:0}.totals dt{color:var(--ink-soft)}.totals dd{margin:0;font-weight:700}.actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}.recipient-note{margin:0;color:var(--ink-soft);font-size:13px}.build-stamp{position:fixed;left:12px;bottom:12px;z-index:20;max-width:calc(100vw - 24px);color:#d1d5db;font-size:11px;pointer-events:none}.build-stamp-trigger{pointer-events:auto;max-width:min(23rem,calc(100vw - 24px));overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border:1px solid rgba(21,33,61,.14);border-radius:6px;background:#15213ddb;color:inherit;padding:4px 7px;font:inherit;line-height:1.2;cursor:pointer;box-shadow:0 4px 14px #15213d29}.build-stamp-panel{pointer-events:auto;width:min(25rem,calc(100vw - 24px));margin-top:6px;padding:9px;border:1px solid rgba(255,255,255,.14);border-radius:8px;background:#15213df5;box-shadow:0 10px 26px #15213d3d}.build-stamp-row{display:grid;grid-template-columns:6rem minmax(0,1fr);gap:8px;align-items:baseline;padding:3px 0}.build-stamp-row span{color:#aeb8cc}.build-stamp-row strong{color:#fff;font-weight:600;overflow-wrap:anywhere}.build-stamp-row strong.muted{color:#aeb8cc;font-weight:400}@media(max-width:720px){.shell{padding:0}.card{border-left:0;border-right:0;border-radius:0;min-height:100dvh}.facts-grid,.line-item{grid-template-columns:1fr}.document-heading{display:grid}.amount-due,.line-item-numbers{min-width:0;text-align:left}.actions .btn{width:100%}}
