:root{--navy:#16324f;--gold:#b68b2c;--ink:#24313d;--muted:#68747f;--line:#e3e8ec;--bg:#f4f7f8;--good:#167349;--bad:#a53a3a}*{box-sizing:border-box}body{margin:0;background:linear-gradient(145deg,#eef3f5,#faf8f2);color:var(--ink);font:16px/1.55 Arial,"Noto Sans",sans-serif}.page{width:min(720px,calc(100% - 32px));margin:0 auto;padding:36px 0}.brand{display:flex;align-items:center;gap:16px;margin-bottom:26px}.brand img{width:70px;height:70px;object-fit:contain}.brand strong,.brand span{display:block}.brand strong{color:var(--navy);font-size:18px}.brand span{color:var(--muted);margin-top:3px}.card{background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 14px 38px rgba(26,47,65,.1);padding:32px}.eyebrow{text-transform:uppercase;letter-spacing:.12em;color:var(--gold);font-size:12px;font-weight:700}h1{margin:5px 0 8px;color:var(--navy);font-size:30px;line-height:1.2}.lead{color:var(--muted);margin:0 0 25px}dl{margin:0 0 28px;border-top:1px solid var(--line)}dl div{display:flex;justify-content:space-between;gap:20px;padding:15px 0;border-bottom:1px solid var(--line)}dt{color:var(--muted)}dd{margin:0;text-align:right;font-weight:700}.amount{font-size:22px;color:var(--navy)}button{width:100%;border:0;border-radius:10px;padding:15px 20px;background:var(--navy);color:#fff;font-size:16px;font-weight:700;cursor:pointer}button:hover{background:#214664}.fine,footer{color:var(--muted);font-size:13px}.fine{margin:14px 0 0}footer{text-align:center;margin:22px}.status{display:inline-block;border-radius:999px;padding:3px 10px;background:#edf1f3;font-size:12px}.status-paid{background:#e2f4eb;color:var(--good)}.status-failed,.status-expired,.status-cancelled{background:#f9e7e7;color:var(--bad)}.notice{border-radius:10px;padding:14px}.success{background:#e2f4eb;color:var(--good)}.error{background:#f9e7e7;color:var(--bad)}.center{text-align:center}.spinner{width:46px;height:46px;margin:0 auto 20px;border:4px solid #dce3e7;border-top-color:var(--gold);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:560px){.page{padding-top:22px}.brand{align-items:flex-start}.brand img{width:54px;height:54px}.brand strong{font-size:15px}.brand span{font-size:13px}.card{padding:23px}h1{font-size:25px}dl div{display:block}dd{text-align:left;margin-top:4px}}
