:root{--vc-blue:#0B4C8C;--vc-red:#C4282A;--vc-gray:#f5f6f8;--ink:#1f2937;--card:#ffffff}
*{box-sizing:border-box}
body{margin:0;font-family:ui-sans-serif,system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:var(--ink);background:linear-gradient(180deg,var(--vc-gray),#fff 200px)}
.brandbar{height:6px;background:linear-gradient(90deg,var(--vc-blue),var(--vc-red))}
.header{display:flex;align-items:center;gap:16px;padding:16px 24px;background:#fff;border-bottom:1px solid #e5e7eb}
.header h1{margin:0;font-size:20px;font-weight:700;color:var(--vc-blue)}
.container{max-width:960px;margin:24px auto;padding:0 16px}
.card{background:var(--card);border:1px solid #e5e7eb;border-radius:16px;padding:24px;box-shadow:0 8px 30px rgb(0 0 0 / 5%)}
label{display:block;font-weight:600;margin:12px 0 6px}
input,button{width:100%;padding:12px 14px;border:1px solid #cfd8e3;border-radius:10px;font-size:16px}
button{background:var(--vc-blue);color:#fff;border:0;cursor:pointer;font-weight:700}
button.secondary{background:#fff;color:var(--vc-blue);border:1px solid var(--vc-blue)}
.grid{display:grid;gap:20px;grid-template-columns:1fr}
@media(min-width:900px){.grid{grid-template-columns:1fr 1fr}}
.small{font-size:12px;color:#6b7280}
.success{color:#0a7a28;font-weight:700}
.error{color:#b91c1c;font-weight:700}
.invoice-items{width:100%;border-collapse:collapse;margin-top:8px}
.invoice-items th,.invoice-items td{border-bottom:1px solid #e5e7eb;padding:8px}
.logo{height:72px}