:root{--primary:#A01236;--primary-hover:#87102D;--primary-soft:#FBE9EE;--reject:#C62828;--reject-hover:#B71C1C;--reject-soft:#FDECEA;--bg:#F9F9F9;--card:#FFFFFF;--text:#212529;--muted:#6B7280;--border:#E5E7EB}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif}.appbar{display:flex;justify-content:space-between;align-items:center;background:var(--primary);color:#fff;padding:12px 16px}.appbar .brand{font-weight:700}.appbar .brand-logo{height:28px;width:auto;display:block}.appbar .avatar{width:32px;height:32px;border-radius:50%;background:var(--primary-hover);display:flex;align-items:center;justify-content:center;font-size:12px}.wrap{max-width:480px;margin:0 auto;padding:12px 12px 88px}.card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:16px;margin:12px 0}.card.narrow{max-width:360px;text-align:center}.eyebrow{font-size:12px;letter-spacing:.04em;color:var(--muted);text-transform:uppercase;margin-bottom:6px}.code{font-size:22px;margin:4px 0}.pill{display:inline-block;border-radius:999px;padding:2px 10px;font-size:12px;text-transform:capitalize}.pill-pending{background:#fff4e5;color:#b26a00}.pill-approved{background:var(--primary-soft);color:var(--primary-hover)}.pill-rejected{background:var(--reject-soft);color:var(--reject-hover)}.amount-block{margin:12px 0;padding:12px;background:var(--bg);border-radius:8px}.amount{font-size:24px;font-weight:700}.rows{display:flex;flex-direction:column;gap:8px;margin-top:8px}.row{display:flex;justify-content:space-between;gap:12px;font-size:14px}.row-label{color:var(--muted)}.row-value{text-align:right;font-weight:500}.link{color:var(--primary)}.toggle{margin-top:12px;background:none;border:none;color:var(--primary);font-weight:600;cursor:pointer;padding:0}.timeline{list-style:none;margin:8px 0 0;padding:0}.tl-item{display:flex;gap:10px;border-left:2px solid var(--border);margin-left:10px;padding:10px 0 10px 14px;position:relative}.tl-dot{position:absolute;left:-11px;width:20px;height:20px;border-radius:50%;background:#fff;border:2px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:11px}.tl-approved .tl-dot{border-color:var(--primary);color:var(--primary)}.tl-rejected .tl-dot{border-color:var(--reject);color:var(--reject)}.tl-current{background:var(--primary-soft);border-radius:8px}.tl-current .tl-dot{border-color:var(--primary-hover);color:var(--primary-hover)}.tl-title{font-weight:600;font-size:14px;text-transform:capitalize}.tl-name,.tl-time,.tl-msg{font-size:12px;color:var(--muted)}.actionbar{position:sticky;bottom:0;display:flex;gap:12px;padding:12px;background:#fffffff5;border-top:1px solid var(--border);max-width:480px;margin:0 auto}.btn{flex:1;border:none;border-radius:10px;padding:14px;font-size:15px;font-weight:700;cursor:pointer}.btn-approve{background:var(--primary);color:#fff}.btn-approve:hover{background:var(--primary-hover)}.btn-reject{background:#fff;color:var(--reject);border:1px solid var(--reject)}.btn-reject:hover{background:var(--reject-soft)}.btn:disabled{opacity:.6;cursor:not-allowed}.centered{min-height:70vh;display:flex;align-items:center;justify-content:center;padding:16px}.big-check{font-size:48px;color:var(--primary)}.muted{color:var(--muted)}.spinner{width:36px;height:36px;border:3px solid var(--border);border-top-color:var(--primary);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.remark{width:100%;border:1px solid var(--border);border-radius:8px;padding:10px;font:inherit;resize:vertical}.notice{background:#fff4e5;color:#8a5a00;border-color:#f0d9a8}.readonly-banner{background:#fff8ee}@media (min-width:768px){.wrap{max-width:960px;display:grid;grid-template-columns:1.2fr 1fr;gap:16px;align-items:start;padding-bottom:24px}.actionbar{position:static;max-width:960px;margin:8px auto 24px;border-top:none;background:transparent}}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#21252959;display:flex;align-items:center;justify-content:center;z-index:50}.popup-card{background:var(--card);border-radius:14px;padding:28px 32px;text-align:center;box-shadow:0 10px 40px #0003;min-width:240px}.popup-card h2{margin:8px 0 4px}.popup-close{margin-top:18px;background:var(--primary);color:#fff;border:none;border-radius:8px;padding:10px 22px;font-size:15px;font-weight:600;cursor:pointer}.popup-close:hover{background:var(--primary-hover)}.popup-close:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.big-cross{font-size:48px;color:var(--reject)}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--border);border:1px solid var(--border);border-radius:8px;overflow:hidden;margin-top:10px}.detail-cell{background:var(--card);padding:10px 12px;display:flex;flex-direction:column;gap:3px;min-width:0}.detail-label{font-size:11px;letter-spacing:.04em;color:var(--muted);text-transform:uppercase}.detail-value{font-size:14px;font-weight:600;word-break:break-word}@media (max-width:400px){.detail-grid{grid-template-columns:1fr}}.banner{font-weight:600;font-size:14px}.banner-approved{background:var(--primary-soft);color:var(--primary-hover);border-color:var(--primary)}.banner-rejected{background:var(--reject-soft);color:var(--reject-hover);border-color:var(--reject)}.banner-waiting{background:#fff8ee;color:#8a5a00;border-color:#f0d9a8}
