[hidden]{display:none!important}
:root{--navy:#063b75;--navy-2:#082e59;--blue:#0a66b7;--cyan:#16c6cf;--ink:#102b46;--muted:#6f8498;--bg:#f2f7fa;--line:#dce8ee;--line-2:#e8f0f4;--white:#fff;--good:#0b8a68;--good-bg:#e9f8f3;--danger:#b4233c;--shadow:0 22px 70px rgba(10,55,92,.13)}
*{box-sizing:border-box}html{scroll-behavior:smooth}html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;background:var(--bg);color:var(--ink)}body{-webkit-font-smoothing:antialiased}button,input{font:inherit}button{touch-action:manipulation}svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.app-shell{min-height:100vh}.eyebrow,.micro-label{display:block;color:#168ca0;font-weight:850;letter-spacing:.12em;font-size:10px}
.auth-view{position:relative;min-height:100vh;overflow:hidden;padding:clamp(28px,6vh,72px) 18px 32px;background:radial-gradient(circle at 12% 10%,rgba(22,198,207,.18),transparent 34%),radial-gradient(circle at 92% 2%,rgba(39,183,241,.15),transparent 28%),linear-gradient(180deg,#fbfdff 0%,#eff7fa 100%)}.auth-orb{position:absolute;border-radius:50%;pointer-events:none;opacity:.6;animation:floatOrb 8s ease-in-out infinite}.orb-one{width:240px;height:240px;background:linear-gradient(135deg,rgba(22,198,207,.16),rgba(39,183,241,.05));left:-90px;bottom:9%}.orb-two{width:180px;height:180px;background:linear-gradient(135deg,rgba(6,59,117,.08),rgba(22,198,207,.12));right:-65px;top:18%;animation-delay:-3s}
.auth-brand{position:relative;z-index:1;width:min(520px,100%);margin:0 auto 22px;display:flex;align-items:flex-start;justify-content:space-between;gap:18px;animation:fadeUp .5s ease both}.auth-brand-copy h1{font-size:clamp(42px,8vw,64px);line-height:.96;letter-spacing:-.045em;color:var(--navy);margin:8px 0 10px}.auth-brand-copy p{max-width:390px;margin:0;color:var(--muted);line-height:1.55;font-size:14px}.auth-logo-wrap{width:78px;height:78px;border-radius:24px;display:grid;place-items:center;background:rgba(255,255,255,.74);border:1px solid rgba(255,255,255,.9);box-shadow:0 14px 38px rgba(6,59,117,.12);backdrop-filter:blur(14px);flex:0 0 auto;transform:rotate(3deg);animation:logoFloat 4.5s ease-in-out infinite}.auth-logo-wrap img{width:56px;height:56px;object-fit:contain}
.access-card{position:relative;z-index:1;width:min(520px,100%);margin:0 auto;background:rgba(255,255,255,.93);border:1px solid rgba(214,231,239,.92);border-radius:30px;box-shadow:var(--shadow);padding:28px;backdrop-filter:blur(20px);animation:fadeUp .55s .06s ease both}.access-card-head{display:flex;gap:15px;align-items:flex-start;margin-bottom:20px}.access-card-head h2{margin:5px 0 5px;font-size:25px;color:var(--navy);letter-spacing:-.02em}.access-card-head p{margin:0;color:var(--muted);line-height:1.5;font-size:13px}.step-icon{width:48px;height:48px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(145deg,#edfafd,#eaf3fb);color:var(--navy);flex:0 0 auto;box-shadow:inset 0 0 0 1px rgba(18,191,200,.14)}.step-icon svg{width:24px}.auth-step{animation:stepIn .28s ease both}
.field{display:grid;gap:8px;margin:15px 0}.field>span{font-size:12px;font-weight:850;color:var(--navy)}.input-shell{height:52px;border:1px solid #cddde6;border-radius:16px;background:#fff;display:flex;align-items:center;gap:10px;padding:0 14px;transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease}.input-shell:focus-within{border-color:var(--cyan);box-shadow:0 0 0 4px rgba(22,198,207,.11);transform:translateY(-1px)}.input-shell svg{width:20px;color:#6a88a2;flex:0 0 auto}.input-shell input{width:100%;height:100%;border:0;outline:0;background:transparent;color:var(--ink);font-weight:750;font-size:15px}.code-shell input{text-align:center;font-size:24px;letter-spacing:.34em;font-variant-numeric:tabular-nums}
.primary{width:100%;min-height:52px;border:0;border-radius:16px;padding:0 18px;background:linear-gradient(105deg,#063b75,#0869b2 70%,#0b83bd);color:#fff;font-weight:850;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;box-shadow:0 12px 28px rgba(6,59,117,.2);transition:transform .18s ease,box-shadow .18s ease,filter .18s ease;margin-top:10px}.primary svg{width:19px}.primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 16px 34px rgba(6,59,117,.25)}.primary:disabled{opacity:.56;cursor:wait}.text-action,.back-action{width:100%;border:0;background:transparent;cursor:pointer}.text-action{color:var(--blue);font-weight:800;padding:14px 8px 8px}.back-action{color:var(--muted);font-weight:720;font-size:12px;padding:10px 8px 0}
.message{margin:0 0 16px;padding:12px 14px;border-radius:14px;background:#eef9fb;color:#075d73;font-size:13px;line-height:1.45;border:1px solid #d7f0f3}.message.error{background:#fff3f4;color:var(--danger);border-color:#f6d7dc}.privacy-note{display:flex;align-items:flex-start;justify-content:center;gap:7px;margin:15px 0 0;color:var(--muted);font-size:11px;line-height:1.4}.privacy-note svg{width:15px;color:var(--good);flex:0 0 auto}.account-state,.mail-state{display:flex;align-items:center;gap:12px;border-radius:16px;padding:13px 14px;margin:6px 0 16px}.account-state{background:var(--good-bg);color:#09694f}.account-state .state-dot{width:10px;height:10px;border-radius:50%;background:#12ad82;box-shadow:0 0 0 5px rgba(18,173,130,.12)}.account-state div,.mail-state div{display:grid;gap:2px}.account-state strong,.mail-state strong{font-size:13px}.account-state small,.mail-state small{font-size:11px;color:var(--muted)}.mail-state{background:#eef8fb;color:var(--navy)}.mail-state svg{width:24px;color:#1495aa}.field-note{margin:-4px 0 12px;font-size:11px;line-height:1.45;color:var(--muted)}.auth-footer{position:relative;z-index:1;width:min(520px,100%);margin:18px auto 0;display:flex;align-items:center;justify-content:center;gap:10px;color:#8294a5;font-size:10px}.auth-footer i{width:3px;height:3px;border-radius:50%;background:#b7c5cf}
.portal-view{min-height:100vh;padding-bottom:96px;background:radial-gradient(circle at 85% -10%,rgba(22,198,207,.10),transparent 27%),linear-gradient(180deg,#f8fbfd 0,#f1f6f9 48%,#edf4f7 100%)}.portal-header{position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;padding:10px max(16px,calc((100vw - 1120px)/2));padding-top:max(10px,env(safe-area-inset-top));background:rgba(255,255,255,.88);backdrop-filter:blur(22px);border-bottom:1px solid rgba(218,231,238,.9)}.portal-brand{display:flex;align-items:center;gap:10px}.portal-logo{width:42px;height:42px;border-radius:14px;background:linear-gradient(145deg,#f5fcfd,#eaf7fa);display:grid;place-items:center;border:1px solid #dff1f3}.portal-logo img{width:31px;height:31px;object-fit:contain}.portal-brand-copy{display:grid;line-height:1.1}.portal-brand-copy strong{color:var(--navy);font-size:16px}.portal-brand-copy span{color:var(--muted);font-size:10px;margin-top:4px}.portal-header-actions{display:flex;align-items:center;gap:9px}.client-pill{display:none;background:#f2f7fa;border:1px solid var(--line);border-radius:14px;padding:7px 10px;line-height:1.1}.client-pill span{font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.client-pill strong{display:block;color:var(--navy);font-size:11px;margin-top:3px}.icon-button{width:42px;height:42px;border:1px solid var(--line);border-radius:14px;background:#fff;color:var(--navy);display:grid;place-items:center;cursor:pointer;transition:.18s ease}.icon-button:hover{transform:translateY(-1px);box-shadow:0 8px 22px rgba(7,54,93,.09)}.icon-button svg{width:20px}
.portal-alert{max-width:1120px;margin:14px auto 0;padding:12px 15px;border:1px solid #f0cfd5;border-radius:15px;background:#fff4f5;color:#a51f38;font-size:13px;line-height:1.45}.portal-alert.info{border-color:#cbe7ec;background:#f3fbfc;color:#0b5d68}.portal-content{max-width:1120px;margin:0 auto;padding:30px 16px 18px}.screen{display:none}.screen.active{display:block}.welcome-block{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin:0 2px 24px}.welcome-block h1,.screen-heading h1{color:var(--navy);letter-spacing:-.035em}.welcome-block h1{font-size:clamp(28px,4vw,42px);margin:6px 0}.welcome-block p{margin:0;color:var(--muted);font-size:13px}.status-chip{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:999px;background:var(--good-bg);color:var(--good);font-size:11px;font-weight:850;white-space:nowrap}.status-chip:before{content:"";width:7px;height:7px;border-radius:50%;background:#14aa82;box-shadow:0 0 0 4px rgba(20,170,130,.1)}
.overview-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:stretch;gap:14px}.balance-card{position:relative;overflow:hidden;min-height:300px;border-radius:30px;padding:25px;color:#fff;background:linear-gradient(135deg,#052f61 0%,#07569a 55%,#10aab8 105%);box-shadow:0 22px 55px rgba(5,47,97,.25)}.card-glow{position:absolute;width:240px;height:240px;border-radius:50%;right:-60px;top:-100px;background:rgba(74,229,226,.18)}.balance-top{position:relative;display:flex;align-items:center;gap:10px;font-size:13px;font-weight:720;color:rgba(255,255,255,.86)}.balance-icon{width:38px;height:38px;border-radius:13px;background:rgba(255,255,255,.12);display:grid;place-items:center;border:1px solid rgba(255,255,255,.13)}.balance-icon svg{width:20px}.balance-card>strong{position:relative;display:block;font-size:clamp(42px,7vw,60px);letter-spacing:-.045em;margin:22px 0 4px}.balance-card>p{position:relative;color:rgba(255,255,255,.68);font-size:11px;margin:0}.balance-meta{position:absolute;left:25px;right:25px;bottom:24px;display:grid;grid-template-columns:1fr 1fr;gap:10px;padding-top:18px;border-top:1px solid rgba(255,255,255,.17)}.balance-meta div{display:grid;gap:5px}.balance-meta small{color:rgba(255,255,255,.62);font-size:10px}.balance-meta b{font-size:16px}
.progress-panel{background:var(--white);border:1px solid var(--line);border-radius:30px;padding:24px;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:22px;box-shadow:0 14px 38px rgba(9,55,91,.07)}.progress-ring-wrap{position:relative;width:150px;height:150px;display:grid;place-items:center}.progress-ring{width:150px;height:150px;transform:rotate(-90deg)}.ring-track,.ring-value{fill:none;stroke-width:12}.ring-track{stroke:var(--line)}.ring-value{stroke:var(--cyan);stroke-linecap:round;stroke-dasharray:339.292;stroke-dashoffset:339.292;transition:stroke-dashoffset .9s cubic-bezier(.2,.8,.2,1);filter:drop-shadow(0 3px 6px rgba(22,198,207,.22))}.progress-center{position:absolute;text-align:center;display:grid;gap:1px}.progress-center strong{font-size:28px;color:var(--navy);letter-spacing:-.03em}.progress-center span{font-size:10px;color:var(--muted);font-weight:750}.progress-copy h2{margin:6px 0 4px;color:var(--navy);font-size:22px}.progress-copy>p{margin:0;color:var(--muted);font-size:12px}
.payment-cta{width:100%;border:1px solid #cfe7eb;background:linear-gradient(105deg,#f7fcfd,#eef9fb);border-radius:22px;padding:15px 16px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;text-align:left;margin:16px 0 22px;color:var(--navy)}.payment-cta-icon{width:46px;height:46px;border-radius:15px;background:#fff;display:grid;place-items:center;color:#0b8193;box-shadow:0 8px 20px rgba(12,93,112,.08)}.payment-cta-icon svg{width:23px}.payment-cta-copy{display:grid;gap:3px}.payment-cta-copy strong{font-size:15px}.payment-cta-copy small{font-size:10px;color:var(--muted)}.soon-badge{font-size:9px;text-transform:uppercase;letter-spacing:.07em;font-weight:850;color:#0b7b8d;background:#dff5f7;padding:7px 9px;border-radius:999px}
.quick-grid{display:grid;gap:10px;margin-bottom:28px}.quick-card{width:100%;border:1px solid var(--line);background:#fff;border-radius:20px;padding:15px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;text-align:left;cursor:pointer;color:var(--ink);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.quick-card:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(7,54,93,.08);border-color:#c6e4e8}.quick-icon{width:43px;height:43px;border-radius:14px;background:linear-gradient(145deg,#effafd,#edf4fb);color:var(--navy);display:grid;place-items:center}.quick-icon svg{width:21px}.quick-card>span:nth-child(2){display:grid;gap:3px}.quick-card strong{font-size:13px;color:var(--navy)}.quick-card small{font-size:10px;color:var(--muted)}.quick-arrow{width:17px;color:#98a9b6}
.section-block{margin-top:10px}.section-heading,.screen-heading{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:0 2px 13px}.section-heading h2{font-size:21px;color:var(--navy);margin:4px 0 0}.count-badge{min-width:28px;height:28px;padding:0 9px;border-radius:999px;background:#e8f4f7;color:#547488;display:grid;place-items:center;font-size:11px;font-weight:850}.list{display:grid;gap:11px}
.receipt-card,.creditor-card,.document-card{background:#fff;border:1px solid var(--line);border-radius:20px;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.receipt-card:hover,.creditor-card:hover,.document-card:hover{transform:translateY(-2px);box-shadow:0 14px 32px rgba(7,54,93,.07);border-color:#c9e4e8}.receipt-card{padding:15px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:13px}.item-icon{width:43px;height:43px;border-radius:14px;background:#edf9fb;color:#0c8da0;display:grid;place-items:center}.item-icon svg{width:21px}.item-copy{min-width:0;display:grid;gap:3px}.item-copy strong{color:var(--navy);font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.item-copy small{color:var(--muted);font-size:10px}.receipt-side{text-align:right;display:grid;justify-items:end;gap:5px}.receipt-side strong{color:var(--ink);font-size:14px}.inline-link{display:inline-flex;align-items:center;gap:4px;color:var(--blue);font-size:10px;font-weight:850;text-decoration:none}.inline-link svg{width:12px}.empty{padding:34px 24px;text-align:center;color:var(--muted);background:var(--white);border:1px dashed var(--line);border-radius:20px;font-size:14px;line-height:1.6;display:grid;justify-items:center;gap:14px}.empty-icon{width:58px;height:58px;display:grid;place-items:center;border-radius:18px;background:rgba(12,161,183,.12);color:var(--blue)}.empty-icon svg{width:28px;height:28px}
.screen-heading{align-items:flex-start;margin-bottom:20px}.screen-heading>div{flex:1}.screen-heading h1{font-size:clamp(30px,5vw,42px);margin:5px 0}.screen-heading p{margin:0;color:var(--muted);font-size:12px}.mobile-back{display:none;width:38px;height:38px;border:1px solid var(--line);border-radius:13px;background:var(--white);color:var(--navy);place-items:center}.mobile-back svg{width:19px}
.creditor-card{padding:18px;display:grid;gap:15px}.creditor-top{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.creditor-name{display:grid;gap:4px}.creditor-name strong{color:var(--navy);font-size:15px}.creditor-name small{color:var(--muted);font-size:10px}.creditor-amount{text-align:right}.creditor-amount small{display:block;color:var(--muted);font-size:9px;text-transform:uppercase;letter-spacing:.06em}.creditor-amount strong{display:block;color:var(--ink);font-size:18px;margin-top:3px}.creditor-foot{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;padding-top:14px;border-top:1px solid var(--line-2);font-size:12px;color:var(--muted)}.creditor-original small{display:block;color:var(--muted);font-size:12px}.creditor-original strong{display:block;color:var(--ink);font-size:15px;margin-top:4px}
.timeline{position:relative;display:grid;gap:0}.timeline:before{content:"";position:absolute;left:19px;top:18px;bottom:18px;width:2px;background:#dcebef}.movement-card{position:relative;display:grid;grid-template-columns:40px 1fr auto;gap:12px;align-items:center;padding:13px 0}.movement-dot{width:40px;height:40px;border-radius:14px;background:#fff;border:1px solid var(--line);display:grid;place-items:center;color:#0b8ea0;z-index:1;box-shadow:0 7px 18px rgba(7,54,93,.05)}.movement-dot svg{width:18px}.movement-copy{display:grid;gap:3px}.movement-copy strong{color:var(--navy);font-size:13px;text-transform:capitalize}.movement-copy small{color:var(--muted);font-size:10px}.movement-amount{font-size:14px;font-weight:850;color:var(--ink)}
.document-grid{display:grid;gap:11px}.document-card{padding:16px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px}.document-icon{width:45px;height:45px;border-radius:15px;background:#f0f5fb;color:#315e91;display:grid;place-items:center}.document-icon svg{width:22px}.document-copy{min-width:0;display:grid;gap:3px}.document-copy strong{font-size:13px;color:var(--navy);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.document-copy small{font-size:10px;color:var(--muted)}.open-doc{width:38px;height:38px;border-radius:13px;background:#eef8fb;color:#0d8092;display:grid;place-items:center;text-decoration:none;transition:.18s ease}.open-doc:hover{transform:translateY(-1px);background:#e2f4f7}.open-doc svg{width:18px}
.bottom-nav{position:fixed;z-index:35;left:10px;right:10px;bottom:max(10px,env(safe-area-inset-bottom));display:grid;grid-template-columns:repeat(4,1fr);gap:4px;padding:7px;background:rgba(255,255,255,.93);border:1px solid rgba(214,229,236,.95);border-radius:22px;box-shadow:0 18px 44px rgba(7,54,93,.16);backdrop-filter:blur(20px)}.nav{border:0;background:transparent;color:#8196a8;border-radius:15px;padding:7px 2px;display:grid;place-items:center;gap:4px;font-size:9px;font-weight:720;cursor:pointer;transition:.18s ease}.nav-icon{width:25px;height:25px;display:grid;place-items:center}.nav-icon svg{width:19px}.nav.active{color:var(--navy);background:#edf7f9;font-weight:850}
.reveal{animation:fadeUp .45s ease both}.overview-grid .reveal:nth-child(2){animation-delay:.06s}.quick-grid{animation-delay:.1s}.section-block{animation-delay:.14s}
.screen.active{animation:portalScreenIn .24s ease-out}.creditor-card,.receipt-card,.document-card{transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}.nav:active,.payment-cta:active,.payment-method-card:active,.open-doc:active{transform:scale(.98)}.nav:focus-visible,.open-doc:focus-visible,.payment-cta:focus-visible,.payment-method-card:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}@media(hover:hover) and (pointer:fine){.creditor-card:hover,.receipt-card:hover,.document-card:hover{transform:translateY(-2px);border-color:#4fa9be;box-shadow:0 8px 25px rgba(0,0,0,.08)}}@keyframes portalScreenIn{from{opacity:.25;transform:translateY(6px)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){.screen.active{animation:none}.creditor-card,.receipt-card,.document-card,.nav,.open-doc,.payment-cta,.payment-method-card{transition:none;transform:none!important}}
@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes stepIn{from{opacity:0;transform:translateX(8px)}to{opacity:1;transform:translateX(0)}}@keyframes logoFloat{0%,100%{transform:translateY(0) rotate(3deg)}50%{transform:translateY(-6px) rotate(1deg)}}@keyframes floatOrb{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-15px,0)}}
@media(min-width:650px){.client-pill{display:block}.quick-grid{grid-template-columns:repeat(3,1fr)}}@media(min-width:860px){.portal-view{padding-bottom:30px}.portal-content{padding:38px 24px 40px}.bottom-nav{position:sticky;top:72px;bottom:auto;left:auto;right:auto;max-width:620px;margin:14px auto 0;box-shadow:0 10px 26px rgba(7,54,93,.07)}.document-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.auth-view{padding-top:30px}.auth-brand{align-items:center}.auth-brand-copy h1{font-size:46px}.auth-brand-copy p{font-size:12px}.auth-logo-wrap{width:64px;height:64px;border-radius:20px}.auth-logo-wrap img{width:46px;height:46px}.access-card{padding:22px 18px;border-radius:25px}.access-card-head{gap:12px}.step-icon{width:43px;height:43px}.welcome-block{align-items:flex-start;flex-direction:column}.payment-cta{grid-template-columns:auto 1fr}.soon-badge{grid-column:2;justify-self:start}.receipt-card{grid-template-columns:auto 1fr}.receipt-side{grid-column:2;text-align:left;justify-items:start}.mobile-back{display:grid}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

.payment-cta-live{cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.payment-cta-live:hover{transform:translateY(-2px);box-shadow:0 15px 34px rgba(7,74,102,.11);border-color:#98d9df}
.pay-modal{position:fixed;inset:0;z-index:90;display:grid;place-items:end center;padding:14px}
.pay-backdrop{position:absolute;inset:0;border:0;background:rgba(4,24,45,.48);backdrop-filter:blur(7px);animation:fadeBackdrop .2s ease both}
.pay-sheet{position:relative;width:min(620px,100%);max-height:calc(100vh - 28px);overflow:auto;background:#fff;border:1px solid #d9e6ec;border-radius:28px;padding:23px;box-shadow:0 28px 90px rgba(3,35,65,.32);animation:sheetUp .3s cubic-bezier(.2,.8,.2,1) both}
.pay-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:17px}
.pay-head h2,.result-sheet h2{margin:5px 0 5px;color:var(--navy);font-size:26px;letter-spacing:-.025em}
.pay-head p{margin:0;color:var(--muted);font-size:11px;line-height:1.5;max-width:470px}
.pay-close{width:38px;height:38px;border:1px solid var(--line);border-radius:13px;background:#fff;color:var(--navy);display:grid;place-items:center;cursor:pointer;flex:0 0 auto}.pay-close svg{width:18px}
.pay-message{padding:11px 13px;border-radius:13px;background:#fff3f4;border:1px solid #f4d2d7;color:#a7263d;font-size:11px;line-height:1.45;margin-bottom:13px}
.pay-summary{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:12px 14px;border-radius:15px;background:#edf8fa;border:1px solid #d4edef;margin-bottom:15px}
.pay-summary span{font-size:11px;color:#547387;font-weight:760}.pay-summary strong{font-size:22px;color:var(--navy)}.pay-summary small{width:100%;color:#7890a0;font-size:9px}
.card-preview{position:relative;overflow:hidden;aspect-ratio:1.75/1;border-radius:23px;padding:20px;background:linear-gradient(135deg,#052f61 0%,#075999 58%,#0aa6b5 120%);color:#fff;box-shadow:0 20px 45px rgba(5,47,97,.22);margin-bottom:17px;transition:transform .25s ease}
.card-preview:focus-within,.card-preview.active{transform:perspective(900px) rotateX(1deg) rotateY(-2deg)}
.card-shine{position:absolute;width:220px;height:220px;border-radius:50%;right:-80px;top:-120px;background:rgba(72,227,223,.16)}
.card-top{position:relative;display:flex;align-items:center;justify-content:space-between}.card-top b{font-size:11px;letter-spacing:.08em;color:rgba(255,255,255,.85)}
.card-chip{width:38px;height:29px;border-radius:8px;background:linear-gradient(145deg,#f3d889,#b99842);box-shadow:inset 0 0 0 1px rgba(88,60,8,.15)}
.card-number{position:relative;margin:27px 0 24px;font-size:clamp(18px,5vw,27px);letter-spacing:.075em;font-weight:750;font-variant-numeric:tabular-nums}
.card-foot{position:relative;display:flex;justify-content:space-between;gap:14px}.card-foot div{display:grid;gap:4px}.card-foot small{font-size:8px;color:rgba(255,255,255,.6);letter-spacing:.08em}.card-foot strong{font-size:11px;max-width:260px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pay-field{display:grid;gap:7px;margin:11px 0}.pay-field>span{font-size:11px;color:var(--navy);font-weight:830}.pay-field input{height:49px;border:1px solid #ccdde6;border-radius:14px;padding:0 13px;outline:0;background:#fff;color:var(--ink);font-weight:730;transition:.18s ease}.pay-field input:focus{border-color:var(--cyan);box-shadow:0 0 0 4px rgba(22,198,207,.10)}.pay-field input.invalid{border-color:#d64d62;box-shadow:0 0 0 4px rgba(214,77,98,.08)}.pay-field input.valid{border-color:#61bea7}
.pay-field-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:9px}
.pay-security{display:flex;flex-wrap:wrap;gap:7px;margin:13px 0}.pay-security span{display:inline-flex;align-items:center;gap:5px;padding:7px 8px;border-radius:999px;background:#f2f8fa;color:#527287;font-size:8.5px;font-weight:780}.pay-security svg{width:13px;color:#0b8e7d}
.pay-consent{display:flex;gap:9px;align-items:flex-start;padding:12px;border-radius:14px;background:#f8fafb;border:1px solid #e6eef2;margin:13px 0;cursor:pointer}.pay-consent input{margin-top:1px;width:17px;height:17px;accent-color:#087db1}.pay-consent span{font-size:10px;color:#50697d;line-height:1.45}.pay-consent b{color:var(--navy)}
.pay-submit{width:100%;min-height:53px;border:0;border-radius:16px;background:linear-gradient(105deg,#063b75,#0871b5 70%,#0b9daa);color:#fff;font-weight:860;display:flex;align-items:center;justify-content:center;gap:9px;cursor:pointer;box-shadow:0 13px 30px rgba(6,59,117,.22);transition:.18s ease}.pay-submit:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 17px 36px rgba(6,59,117,.27)}.pay-submit:disabled{opacity:.58;cursor:wait}.pay-submit svg{width:18px}
.pay-processing{text-align:center;padding:25px 8px 9px}.secure-orbit{position:relative;width:82px;height:82px;border-radius:50%;margin:0 auto 17px;display:grid;place-items:center;background:#edf9fa;color:#087f90}.secure-orbit:before{content:"";position:absolute;inset:-5px;border:3px solid transparent;border-top-color:#11b9c4;border-right-color:#096daf;border-radius:50%;animation:spinSecure 1s linear infinite}.secure-orbit span{position:absolute;width:11px;height:11px;border-radius:50%;background:#15c5c9;top:-1px;left:35px;box-shadow:0 0 18px rgba(21,197,201,.55)}.secure-orbit svg{width:30px}.pay-processing h3{margin:0 0 6px;color:var(--navy)}.pay-processing p{margin:0;color:var(--muted);font-size:11px}.process-steps{display:flex;justify-content:center;gap:6px;flex-wrap:wrap;margin-top:16px}.process-steps span{font-size:9px;padding:6px 8px;border-radius:999px;background:#eef3f6;color:#80909d}.process-steps span.done{background:#e4f8f1;color:#08785e}
.result-modal{place-items:center}.result-sheet{text-align:center;width:min(430px,100%);padding:31px 25px}.result-icon{width:78px;height:78px;margin:0 auto 18px;border-radius:50%;display:grid;place-items:center;background:#eef6f8;color:#0a7287;position:relative}.result-icon.loading:before{content:"";position:absolute;inset:-5px;border:3px solid transparent;border-top-color:#13b7c3;border-radius:50%;animation:spinSecure 1s linear infinite}.result-icon.success{background:#e2f8ef;color:#08785e;animation:successPop .45s ease both}.result-icon.failed{background:#fff0f2;color:#b4233c}.result-icon svg{width:34px;stroke-width:2.2}.result-sheet p{color:var(--muted);font-size:12px;line-height:1.5}.result-link{display:inline-flex;margin-top:10px;color:#0865a8;font-weight:850;font-size:12px;text-decoration:none}.result-close{margin-top:18px}
@keyframes fadeBackdrop{from{opacity:0}to{opacity:1}}@keyframes sheetUp{from{opacity:0;transform:translateY(25px) scale(.985)}to{opacity:1;transform:none}}@keyframes spinSecure{to{transform:rotate(360deg)}}@keyframes successPop{0%{transform:scale(.6);opacity:0}70%{transform:scale(1.08)}100%{transform:scale(1);opacity:1}}
@media(min-width:720px){.pay-modal{place-items:center}.pay-sheet{max-height:min(870px,calc(100vh - 36px))}}
@media(max-width:480px){.pay-sheet{padding:19px 15px;border-radius:24px}.pay-field-row{grid-template-columns:1fr 1fr}.pay-field-row .pay-field:last-child{grid-column:1/-1}.card-preview{padding:17px}.card-number{margin:22px 0 18px}.pay-security{gap:5px}}
@media(prefers-reduced-motion:reduce){.pay-backdrop,.pay-sheet,.secure-orbit:before,.result-icon.loading:before,.result-icon.success{animation:none!important}.payment-cta-live,.card-preview,.pay-submit{transition:none!important}}


/* RC3.7 UI/UX overrides */
html,body{overflow-x:hidden}body{overflow-x:hidden}.portal-view{overflow-x:hidden}.balance-card>p{max-width:420px}.document-grid .empty{width:min(100%,560px);margin:0 auto;place-self:center}.screen-heading .count-badge{align-self:flex-start;margin-top:8px}.payment-cta{grid-template-columns:auto 1fr}.payment-cta-copy small{font-size:11px;color:#6d8798}.bottom-nav{gap:6px;padding:8px 9px}.nav{position:relative;overflow:hidden;padding:9px 4px;transition:transform .18s ease,box-shadow .18s ease,background .18s ease,color .18s ease}.nav:before{content:"";position:absolute;left:11px;right:11px;bottom:6px;height:3px;border-radius:999px;background:linear-gradient(90deg,var(--navy),var(--cyan));opacity:0;transform:scaleX(.35);transition:.22s ease}.nav:hover{transform:translateY(-1px);background:#f6fbfc;color:#587182}.nav.active{color:var(--navy);background:linear-gradient(180deg,#f4fbfc,#e8f6f8);font-weight:860;transform:translateY(-2px);box-shadow:0 10px 18px rgba(9,78,109,.10)}.nav.active:before{opacity:1;transform:scaleX(1)}.nav-icon{transition:transform .18s ease}.nav.active .nav-icon{transform:translateY(-1px) scale(1.06)}.portal-legal{max-width:1120px;margin:16px auto 0;padding:0 16px 10px;display:grid;gap:10px}.portal-legal-copy{display:grid;gap:4px;color:#607789;font-size:11px}.portal-legal-copy strong{color:var(--navy);font-size:12px}.portal-legal-links{display:flex;flex-wrap:wrap;gap:10px}.portal-legal-links a{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:0 14px;border-radius:999px;background:#fff;border:1px solid var(--line);color:var(--navy);font-size:11px;font-weight:800;text-decoration:none;transition:.18s ease}.portal-legal-links a:hover{transform:translateY(-1px);box-shadow:0 10px 22px rgba(7,54,93,.07);border-color:#c7e3e8}.pay-sheet{overflow-x:hidden}.card-preview,.pay-security{display:none!important}.pay-field input{min-width:0}.pay-field-row,.pay-field-row-compact{grid-template-columns:minmax(0,1.35fr) minmax(0,.75fr);gap:10px;align-items:start}.pay-field-row .pay-field,.pay-field-row-compact .pay-field{min-width:0}.pay-field-row-compact .pay-field:last-child{min-width:100px}.pay-head p{max-width:520px}.result-sheet .micro-label{display:block;margin-bottom:6px}@media(min-width:860px){.portal-legal{padding:0 24px 14px}}@media(max-width:480px){.portal-legal{padding:0 16px 14px}.pay-field-row,.pay-field-row-compact{grid-template-columns:minmax(0,1fr) 112px}.pay-field-row .pay-field:last-child,.pay-field-row-compact .pay-field:last-child{grid-column:auto}}

/* RC3.9 login/session/autofill/consent/navigation polish */
.portal-legal{text-align:center;justify-items:center}.portal-legal-copy{justify-items:center}.portal-legal-links{justify-content:center}.portal-legal[hidden]{display:none!important}.portal-legal-links a{background:transparent;border-color:transparent;padding:4px 9px;min-height:30px}.portal-legal-links a:hover{background:#fff;border-color:var(--line)}
.pay-consent{display:flex!important;margin:14px 0 12px;background:#f5fafb;border-color:#dcecef}.pay-consent input{flex:0 0 auto;margin-top:2px}.pay-consent span{font-size:11px}.pay-consent b{white-space:nowrap}
@media(max-width:859px){.bottom-nav{left:50%;right:auto;width:min(calc(100% - 20px),620px);transform:translateX(-50%)}}
@media(min-width:860px){.bottom-nav{width:min(100%,620px);margin-left:auto;margin-right:auto}}


/* ===== RC3.12 FINAL UX =====
   Navigation remains visible while history lists scroll independently. */
#portalShell{padding-bottom:112px}
.bottom-nav{
  position:fixed !important;
  left:50% !important;
  right:auto !important;
  bottom:max(14px,env(safe-area-inset-bottom)) !important;
  transform:translateX(-50%) !important;
  z-index:80 !important;
  width:min(720px,calc(100vw - 28px)) !important;
  margin:0 !important;
  box-shadow:0 18px 48px rgba(11,55,98,.18),0 4px 14px rgba(11,55,98,.10);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
#paymentsList,
#movementsList{
  max-height:min(54vh,520px);
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  padding-right:6px;
}
#paymentsList::-webkit-scrollbar,
#movementsList::-webkit-scrollbar{width:8px}
#paymentsList::-webkit-scrollbar-thumb,
#movementsList::-webkit-scrollbar-thumb{
  background:rgba(15,74,126,.20);
  border-radius:999px;
}
#paymentsList::-webkit-scrollbar-track,
#movementsList::-webkit-scrollbar-track{background:transparent}

@media (max-width:720px){
  #portalShell{padding-bottom:98px}
  .bottom-nav{
    bottom:max(8px,env(safe-area-inset-bottom)) !important;
    width:calc(100vw - 16px) !important;
  }
  #paymentsList,
  #movementsList{max-height:52vh}
}


/* ===== RC3.13 COMPACT BOTTOM NAV FIX =====
   RC3.12 changed desktop navigation to fixed but inherited top:72px
   from the original desktop sticky rule, stretching the dock vertically.
   Explicitly reset the vertical inset and keep a compact bottom dock. */
.bottom-nav{
  top:auto !important;
  bottom:max(14px,env(safe-area-inset-bottom)) !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  width:min(620px,calc(100vw - 28px)) !important;
  padding:7px !important;
  align-items:stretch !important;
}
.bottom-nav .nav{
  min-height:54px;
  padding:7px 4px !important;
}
.bottom-nav .nav-icon{
  width:24px;
  height:24px;
}
.bottom-nav .nav-icon svg{width:18px}

@media (max-width:720px){
  .bottom-nav{
    top:auto !important;
    bottom:max(8px,env(safe-area-inset-bottom)) !important;
    width:calc(100vw - 16px) !important;
    padding:6px !important;
  }
  .bottom-nav .nav{min-height:50px}
}


/* ===== RC3.15 FINAL POLISH ===== */
.creditor-status-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:2px}
.creditor-status{display:inline-flex;align-items:center;gap:6px;width:max-content;padding:5px 9px;border-radius:999px;font-size:10px;font-weight:850;letter-spacing:.01em}
.creditor-status i{width:7px;height:7px;border-radius:50%;display:block;box-shadow:0 0 0 3px rgba(255,255,255,.65)}
.status-active{background:#edf6ff;color:#17639a;border:1px solid #d7eaf8}
.status-active i{background:#2d8fcb}
.status-pending{background:#fff7df;color:#986711;border:1px solid #f3dfaa}
.status-pending i{background:#e2a52c}
.status-liquidated{background:#e9f9f0;color:#137245;border:1px solid #c7ead7}
.status-liquidated i{background:#24a46b}
.liquidated-inline{font-size:10px;color:#4f7461}
.liquidated-inline strong{color:#137245;font-size:11px}
.creditor-card.creditor-liquidated{border-color:#bfe5d0;background:linear-gradient(180deg,#fff 0%,#f5fcf8 100%);box-shadow:inset 4px 0 0 #39a876}
.creditor-card.creditor-pending{border-color:#f0dfb5;background:linear-gradient(180deg,#fff 0%,#fffaf0 100%)}
.creditor-card.creditor-liquidated .creditor-amount small{color:#4c8569}
.creditor-card.creditor-liquidated .creditor-amount strong{color:#137245}
.bottom-nav .nav:before{bottom:1px!important;height:3px}
.bottom-nav .nav{padding-bottom:10px!important}
#programStatus{text-transform:none}


/* ===== RC3.16 MOVEMENT TYPES + LEGAL LINKS ===== */
.movement-card{border-radius:16px;padding:12px 14px!important;margin:2px 0;border:1px solid transparent;transition:.18s ease}
.movement-copy{align-content:center}
.movement-type{display:inline-flex;align-items:center;width:max-content;min-height:24px;padding:4px 9px;border-radius:999px;font-size:11px;font-weight:850;line-height:1}
.movement-payment{background:linear-gradient(90deg,rgba(235,248,252,.72),rgba(255,255,255,0));border-color:rgba(190,225,235,.55)}
.movement-payment .movement-dot{background:#edf9fc;border-color:#cce9ef;color:#087f95}
.movement-payment .movement-type{background:#e8f7fb;color:#08788d}
.movement-payment .movement-amount{color:#0b5f7f}

.movement-liquidation{background:linear-gradient(90deg,rgba(235,250,242,.82),rgba(255,255,255,0));border-color:rgba(187,228,205,.65)}
.movement-liquidation .movement-dot{background:#eaf9f0;border-color:#c7ead6;color:#168153}
.movement-liquidation .movement-type{background:#e4f7ec;color:#137245}
.movement-liquidation .movement-amount{color:#137245}

.movement-overdue{background:linear-gradient(90deg,rgba(255,246,235,.88),rgba(255,255,255,0));border-color:rgba(242,211,171,.72)}
.movement-overdue .movement-dot{background:#fff2df;border-color:#f1d3a6;color:#a96812}
.movement-overdue .movement-type{background:#fff0d8;color:#955d0d}
.movement-overdue .movement-amount{color:#9a5a0b}

.movement-adjustment .movement-type,.movement-other .movement-type{background:#eef3f7;color:#5d7182}
.movement-adjustment .movement-dot,.movement-other .movement-dot{background:#f4f7fa;color:#657b8d}

/* Los enlaces legales estaban quedando detrás de la navegación fija. */
.portal-legal{
  margin-bottom:112px!important;
  padding-bottom:18px!important;
}
.portal-legal-links{
  position:relative;
  z-index:2;
}
.portal-legal-links a{
  display:inline-flex!important;
  visibility:visible!important;
  opacity:1!important;
  background:var(--white)!important;
  border:1px solid var(--line)!important;
  min-height:36px!important;
  padding:0 14px!important;
  box-shadow:0 7px 18px rgba(7,54,93,.05);
}
@media(max-width:720px){
  .portal-legal{margin-bottom:100px!important}
  .portal-legal-links{gap:7px}
  .portal-legal-links a{font-size:10px;padding:0 11px!important}
}


/* ===== RC3.17 CARD / STORE PAYNET ===== */
.payment-cta-single .payment-cta-copy{align-content:center}
.payment-method-grid{display:grid;gap:12px;margin-top:4px}
.payment-method-card{width:100%;border:1px solid var(--line);background:#fff;border-radius:18px;padding:15px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:13px;text-align:left;cursor:pointer;transition:.18s ease}
.payment-method-card:hover{transform:translateY(-1px);border-color:#bcdfe6;box-shadow:0 12px 28px rgba(7,54,93,.08)}
.payment-method-card.store-method{background:linear-gradient(135deg,#fff,#f4fbf8);border-color:#cfe9dc}
.payment-method-icon{width:46px;height:46px;border-radius:15px;background:#edf8fb;color:#087f95;display:grid;place-items:center}
.store-method .payment-method-icon{background:#e9f8ef;color:#1d8054}
.payment-method-icon svg{width:23px}.payment-method-card>span:nth-child(2){display:grid;gap:4px}
.payment-method-card strong{color:var(--navy);font-size:14px}.payment-method-card small{color:var(--muted);font-size:10px;line-height:1.45}
.payment-method-arrow{width:20px;color:#86a0b2}.store-warning{margin:14px 3px 0;color:#6a7f8e;font-size:10px;line-height:1.5}
.method-sheet{max-width:540px}.store-result-sheet{max-width:560px;text-align:center;position:relative}.store-close-x{position:absolute;right:16px;top:16px}
.store-reference-loading{min-height:190px;display:grid;place-items:center;align-content:center;gap:14px;color:var(--navy)}
.store-spinner{width:38px;height:38px;border-radius:50%;border:4px solid #dcecf1;border-top-color:#0a90a4;animation:storeSpin .8s linear infinite}
@keyframes storeSpin{to{transform:rotate(360deg)}}
#storeReferenceContent{display:grid;gap:12px;margin-top:18px}
.store-amount{padding:16px;border-radius:18px;background:linear-gradient(135deg,#0b3975,#0c99ad);color:#fff;display:grid;gap:5px}
.store-amount span{font-size:10px;opacity:.82}.store-amount strong{font-size:30px}
.store-reference-box{border:1px solid #cee2e8;background:#f8fcfd;border-radius:15px;padding:12px;display:grid;gap:5px}
.store-reference-box.secondary{background:#fbfcfd}.store-reference-box span{font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-weight:850}
.store-reference-box strong{font-size:14px;color:var(--navy);overflow-wrap:anywhere;letter-spacing:.035em}
.store-barcode-wrap{background:#fff;border:1px solid var(--line);border-radius:15px;padding:12px;min-height:74px}
.store-barcode-wrap img{display:block;max-width:100%;height:54px;object-fit:contain;margin:auto}
.store-due{font-size:11px;color:#61798a;margin:0}.store-due strong{color:var(--navy)}
.store-pdf-link{text-decoration:none}.store-footnote{font-size:9px;line-height:1.5;color:#738898}
.store-close{border:0;background:transparent;color:var(--navy);font-weight:850;padding:10px;cursor:pointer;margin-top:5px}
@media(max-width:560px){.payment-method-card{padding:13px}.store-result-sheet{max-height:92vh;overflow:auto}}


/* ===== RC3.18 LOCAL BRANDED PDF ===== */
.store-pdf-link{box-shadow:0 10px 24px rgba(5,47,97,.12)}
.store-pdf-link:hover{transform:translateY(-1px)}

/* RC3.23 · visor PDF interno en desktop */
.store-pdf-viewer-modal{z-index:120}
.store-pdf-viewer-sheet{position:relative;width:min(1180px,96vw);height:min(92vh,980px);margin:auto;background:#fff;border-radius:22px;box-shadow:0 28px 80px rgba(4,39,79,.25);overflow:hidden;display:grid;grid-template-rows:auto 1fr}
.store-pdf-viewer-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 16px;border-bottom:1px solid var(--line);background:#fff}
.store-pdf-viewer-head h2{margin:3px 0 0;font-size:18px;color:var(--navy)}
.store-pdf-viewer-actions{display:flex;align-items:center;gap:8px}.store-pdf-action{padding:10px 12px;border-radius:11px;text-decoration:none;font-size:12px;font-weight:850;color:var(--navy);background:var(--white);border:1px solid var(--line)}
.store-pdf-frame{width:100%;height:100%;border:0;background:#eef5f8}
@media(max-width:720px){.store-pdf-viewer-modal{display:none!important}}
/* RC9: balanced overview, straight movement rail and native light/dark theme. */

.timeline{position:relative;padding-left:0}
.timeline:before{left:38px!important;top:22px!important;bottom:22px!important}
.movement-card{position:relative;display:grid;grid-template-columns:48px minmax(0,1fr) auto;align-items:center;gap:12px}
.movement-dot{position:relative;left:auto!important;top:auto!important;justify-self:center;z-index:1}
[data-theme="dark"]{color-scheme:dark;--navy:#a9d6ff;--navy-2:#c7e4ff;--blue:#68baff;--ink:#e3effa;--muted:#a6b9ca;--bg:#0b1725;--line:#2c4358;--line-2:#263c50;--white:#132538;--good:#67ddbc;--good-bg:#12382f}
[data-theme="dark"] body,[data-theme="dark"] .portal-view,[data-theme="dark"] .auth-view{background:#0b1725;color:var(--ink)}
[data-theme="dark"] :is(.portal-header,.access-card,.progress-panel,.receipt-card,.creditor-card,.movement-card,.document-card,.input-shell,.icon-button,.mobile-nav,.bottom-nav,.payment-modal,.client-pill,.pay-sheet,.pay-close,.store-pdf-viewer-sheet,.store-pdf-viewer-head){background:#132538;color:var(--ink);border-color:var(--line)}
[data-theme="dark"] :is(.account-state,.mail-state,.movement-dot,.item-icon,.document-icon,.payment-cta,.nav.active,.payment-method-card,.store-reference-box,.pay-summary,.pay-consent){background:#1c354a;color:var(--ink);border-color:var(--line)}
[data-theme="dark"] :is(.pay-summary span,.pay-summary small,.pay-consent span,.store-warning,.store-due,.store-footnote){color:var(--muted)}
[data-theme="dark"] :is(input,select,textarea){color:var(--ink);background-color:#132538}
[data-theme="dark"] .pay-message{background:#361e2b;border-color:#6a354b;color:#ffc0cc}[data-theme="dark"] .pay-message.info{background:#133841;border-color:#265966;color:#b6e8ed}
.pay-message.info{background:#eef9fb;color:#075d73;border-color:#d7f0f3}
.receipt-side small{display:block;font-size:11px;color:var(--muted)}

/* Compact overview keeps the chart beside the balance at phone widths. */
@media(max-width:720px){
 .overview-grid{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:10px}
 .balance-card{min-height:244px;border-radius:22px;padding:16px;box-shadow:none}
 .balance-icon{display:none}.balance-top{font-size:12px;line-height:1.4}
 .balance-card>strong{font-size:clamp(22px,6vw,36px);margin:18px 0 8px;overflow-wrap:anywhere}
 .balance-card>p{display:none}.balance-meta{left:16px;right:16px;bottom:18px;grid-template-columns:1fr;gap:12px;padding-top:14px}
 .balance-meta small{font-size:11px;color:#d0e8f4}.balance-meta b{font-size:15px}
 .progress-panel{min-width:0;border-radius:22px;padding:16px 8px;grid-template-columns:1fr;align-content:center;gap:12px;text-align:center;box-shadow:none}
 .progress-ring-wrap,.progress-ring{width:100px;height:100px;max-width:100%;margin:auto}
 .progress-center strong{font-size:22px}.progress-center span{font-size:11px}
 .progress-copy .micro-label,.progress-copy h2{display:none}.progress-copy>p{font-size:12px;line-height:1.55;padding:0 4px}
}
[data-theme="dark"] .balance-card{background:linear-gradient(140deg,#15354f,#145165);border:1px solid #326072;box-shadow:none}
.contact-email-form{display:grid;gap:10px;margin:0 0 22px;padding-bottom:20px;border-bottom:1px solid var(--line)}
.contact-email-form .pay-field{margin:0}.contact-email-form input{font-size:16px}
.contact-email-save{justify-self:start;border:1px solid var(--line);border-radius:12px;padding:11px 16px;color:var(--navy);background:var(--white);font-weight:750;cursor:pointer}
.contact-email-message{margin:0;font-size:12px;line-height:1.5;color:var(--muted);min-height:18px}.contact-email-message.error{color:var(--danger)}
.payment-method-card:disabled,.contact-email-save:disabled{opacity:.55;cursor:default;transform:none;box-shadow:none}
[data-theme="dark"]{--danger:#ffbac8}
[data-theme="dark"] :is(.payment-cta-icon,.count-badge,.payment-method-icon){background:#1c354a;color:#9bdde7}

.receipt-view{width:min(100%,900px);margin:0 auto;padding:0 16px 104px}
.receipt-view-header{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:12px;min-height:76px;padding:12px 0;background:var(--bg);border-bottom:1px solid var(--line)}
.receipt-view-header h1{margin:3px 0 0;color:var(--ink);font-size:22px;letter-spacing:-.03em}
.receipt-back{display:grid;place-items:center;flex:none;width:44px;height:44px;border:0;background:transparent;color:var(--ink);border-radius:50%;cursor:pointer;transition:background .18s ease}
.receipt-back svg{width:24px;height:24px}.receipt-back:hover{background:var(--line)}.receipt-back:focus-visible{outline:3px solid var(--cyan);outline-offset:2px}
.receipt-view-status{padding:20px 4px;line-height:1.5;color:var(--muted)}
.receipt-frame{display:block;width:100%;border:0;border-radius:18px;background:#fff;min-height:320px}
@media(max-width:700px){.receipt-view{padding:0 0 96px}.receipt-view-header{padding:10px 12px;min-height:68px}.receipt-view-header h1{font-size:20px}.receipt-frame{border-radius:0}.receipt-view-status,.receipt-view>#receiptRetry{margin-left:20px;margin-right:20px}}
@media(prefers-reduced-motion:reduce){.receipt-back{transition:none}}