:root{--navy:#10264a;--violet:#6555d9;--cyan:#29b6d2;--ink:#172033;--muted:#667085;--line:#dde3ee;--soft:#f5f7fb;--ok:#1f8a55;--danger:#c13d57}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 90% 0,#e6f8fb 0,transparent 28%),radial-gradient(circle at 10% 15%,#eeeafd 0,transparent 32%),#f7f8fc;color:var(--ink);font:15px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif;min-height:100vh}.topbar{align-items:center;background:rgba(255,255,255,.92);border-bottom:1px solid var(--line);display:flex;justify-content:space-between;padding:14px max(20px,calc((100% - 1120px)/2));position:sticky;top:0;z-index:3;backdrop-filter:blur(16px)}.brand{align-items:center;color:var(--navy);display:flex;gap:10px;text-decoration:none}.brand span{align-items:center;background:linear-gradient(145deg,var(--violet),var(--cyan));border-radius:11px;color:#fff;display:flex;font-size:20px;font-weight:800;height:36px;justify-content:center;width:36px}.brand strong{font-size:18px}.topbar>div{color:var(--muted);font-size:13px}.shell{margin:0 auto;max-width:1120px;padding:36px 20px 80px}.hero{align-items:flex-start;background:linear-gradient(120deg,var(--navy),#263e70);border-radius:24px;color:#fff;display:flex;justify-content:space-between;min-height:210px;padding:38px;box-shadow:0 24px 60px rgba(16,38,74,.16)}.hero h1{font-size:clamp(28px,5vw,44px);letter-spacing:-.03em;margin:4px 0 10px;max-width:700px}.hero p{color:#dce6fa;margin:0;max-width:720px}.eyebrow{font-size:11px!important;font-weight:800;letter-spacing:.13em;text-transform:uppercase}.secure{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.24);border-radius:999px;font-size:12px;padding:8px 12px;white-space:nowrap}.actions{display:grid;gap:18px;grid-template-columns:repeat(2,minmax(0,1fr));margin:24px 0}.action-card{background:#fff;border:1px solid var(--line);border-radius:18px;color:var(--ink);cursor:pointer;display:grid;gap:6px;padding:24px;text-align:left;transition:.2s}.action-card:hover{border-color:var(--violet);box-shadow:0 12px 34px rgba(45,51,92,.12);transform:translateY(-2px)}.action-card:disabled{cursor:not-allowed;opacity:.5;transform:none}.action-card span{color:var(--violet);font-size:12px;font-weight:800}.action-card strong{font-size:19px}.action-card small{color:var(--muted);font-size:13px}.panel,.state-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px;box-shadow:0 14px 40px rgba(45,51,92,.08)}.panel-head{align-items:start;display:flex;justify-content:space-between}.panel h2{margin:2px 0 18px}.text-button{background:none;border:0;color:var(--violet);cursor:pointer;font-weight:700}.list{display:grid;gap:12px}.bill{align-items:center;border:1px solid var(--line);border-radius:15px;display:grid;gap:16px;grid-template-columns:1fr auto auto;padding:18px}.bill small,.bill span{color:var(--muted);display:block}.bill-value{font-size:19px;font-weight:800}.bill-actions{display:flex;gap:8px}.button{background:var(--violet);border:0;border-radius:11px;color:#fff;cursor:pointer;font-weight:750;padding:11px 16px}.button.secondary{background:#edf0f7;color:var(--navy)}.button:disabled{opacity:.55}.notice,.success-box{background:#fff7e8;border:1px solid #f1d392;border-radius:13px;padding:16px}.success-box{background:#ecf9f1;border-color:#b7e5c9}.chat-log{background:var(--soft);border-radius:14px;display:flex;flex-direction:column;gap:10px;min-height:260px;padding:18px}.message{border-radius:14px;max-width:78%;padding:11px 14px}.message.agent{align-self:flex-start;background:#fff;border:1px solid var(--line)}.message.customer{align-self:flex-end;background:var(--violet);color:#fff}.composer{display:flex;gap:10px;margin-top:14px}.composer textarea{border:1px solid var(--line);border-radius:12px;font:inherit;padding:11px;resize:vertical;width:100%}.state-card{margin:10vh auto;max-width:540px;text-align:center}.state-card h1{margin:12px 0 6px}.state-card p{color:var(--muted)}.spinner{animation:spin 1s linear infinite;border:4px solid #e5e7eb;border-top-color:var(--violet);border-radius:50%;height:42px;margin:auto;width:42px}.state-icon{align-items:center;background:#fdecef;border-radius:50%;color:var(--danger);display:inline-flex;font-size:24px;font-weight:800;height:48px;justify-content:center;width:48px}.hidden{display:none!important}.sr-only{height:1px;margin:-1px;overflow:hidden;position:absolute;width:1px;clip:rect(0,0,0,0)}footer{color:var(--muted);font-size:12px;padding:24px;text-align:center}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:720px){.shell{padding:20px 14px 60px}.hero{display:block;padding:26px}.secure{display:inline-block;margin-top:20px}.actions{grid-template-columns:1fr}.bill{grid-template-columns:1fr}.bill-actions{display:grid;grid-template-columns:1fr 1fr}.topbar{padding:12px 14px}.topbar>div{display:none}.composer{align-items:stretch;flex-direction:column}}

.actions{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:720px){.actions{grid-template-columns:1fr}}

/* Cobrança única originada por e-mail */
.email-charge-mode .shell{max-width:940px}.email-charge-mode .hero{background:linear-gradient(125deg,#0c2c64,#164495);min-height:178px}.email-charge-mode #debts-panel{margin-top:22px;padding:30px}.email-charge-mode #debts-content{gap:18px}.charge-summary{background:linear-gradient(140deg,#f7fbff,#f2f7ff);border:1px solid #cfe0f4;border-radius:18px;padding:22px}.charge-main{align-items:flex-start;display:flex;gap:24px;justify-content:space-between}.summary-label{color:#52647d;font-size:11px;font-weight:800;letter-spacing:.11em;text-transform:uppercase}.charge-main h3{color:var(--navy);font-size:21px;margin:5px 0 2px}.charge-main p{color:var(--muted);margin:0}.charge-total{display:grid;min-width:190px;text-align:right}.charge-total small,.charge-total span{color:var(--muted)}.charge-total strong{color:var(--navy);font-size:27px;letter-spacing:-.025em}.charge-items{border-top:1px solid #d9e5f3;margin-top:18px;padding-top:14px}.charge-items summary{color:#26496f;cursor:pointer;font-weight:750}.charge-items ul{list-style:none;margin:12px 0 0;padding:0}.charge-items li{display:flex;gap:16px;justify-content:space-between;padding:5px 0}.charge-items li span{color:#536176}.payment-choice{display:grid;gap:14px}.payment-primary{background:linear-gradient(135deg,#0f8c78,#15aa8e);border-radius:18px;color:#fff;padding:25px;position:relative}.payment-primary h3{font-size:24px;margin:6px 0}.payment-primary p{color:#dffbf4;margin:0 0 18px}.payment-tag{background:rgba(255,255,255,.17);border:1px solid rgba(255,255,255,.3);border-radius:999px;font-size:11px;font-weight:800;letter-spacing:.08em;padding:6px 9px;text-transform:uppercase}.pix-button{background:#fff;color:#0a6758;min-height:46px}.payment-result{background:#f2f7ff;border:1px solid #cddcf0;border-radius:15px;display:grid;gap:8px;padding:17px}.payment-result>span{color:#52647d;font-size:12px;font-weight:800;text-transform:uppercase}.payment-result code{background:#fff;border:1px solid var(--line);border-radius:10px;color:#17304f;font:600 13px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;overflow-wrap:anywhere;padding:12px;user-select:all}.payment-result .text-button{justify-self:start;padding:0}.barcode-option{align-items:center;background:#fff;border:1px solid #cad5e5;border-radius:14px;color:var(--navy);cursor:pointer;display:flex;justify-content:space-between;padding:16px 18px;text-align:left}.barcode-option:hover{border-color:#5b74a4}.barcode-option span{font-size:15px;font-weight:800}.barcode-option small{color:var(--muted)}.same-charge-note{color:var(--muted);font-size:12px;margin:0;text-align:center}.terminal-state{align-items:center;background:#fff5f3;border:1px solid #f2c5be;border-radius:16px;display:flex;gap:14px;padding:20px}.terminal-state>span{align-items:center;background:#f7d9d4;border-radius:50%;color:#a83225;display:flex;font-size:20px;font-weight:900;height:42px;justify-content:center;min-width:42px}.terminal-state strong{color:#7f291f;font-size:17px}.terminal-state p{color:#7f554e;margin:3px 0 0}.terminal-state.paid{background:#ecf9f1;border-color:#b7e5c9}.terminal-state.paid>span{background:#ccebd8;color:#17683f}.terminal-state.paid strong{color:#175f3b}.terminal-state.paid p{color:#3f6f57}
@media(max-width:720px){.email-charge-mode #debts-panel{padding:20px}.charge-main{display:grid}.charge-total{min-width:0;text-align:left}.charge-total strong{font-size:25px}.barcode-option{align-items:flex-start;flex-direction:column;gap:3px}.payment-primary{padding:21px}.email-charge-mode .hero{min-height:auto}}

.payment-layout{display:grid;grid-template-columns:minmax(220px,1fr) minmax(0,1.15fr);gap:16px;align-items:start}
.email-charge-mode .payment-primary{background:#faf8fb;border:1px solid #e3dbe7;color:#211c23}
.email-charge-mode .pix-button{background:#603778;color:#fff}
#email-pix{display:grid;gap:12px;justify-items:start;margin-top:14px}
#email-pix img{width:min(188px,100%);height:auto;aspect-ratio:1;image-rendering:pixelated;background:white}
.email-pix-code{overflow-wrap:anywhere;font-size:12px;color:#343035;user-select:all}
details.payment-choice{border:1px solid var(--line);border-radius:14px;padding:14px 16px}
details.payment-choice summary{cursor:pointer;color:var(--navy);font-weight:750}
details.payment-choice[open]>*+*{margin-top:12px}
@media(max-width:720px){.payment-layout{grid-template-columns:minmax(0,1fr)}}