/* The SBP badge sits in a circular cut-out of the bank tile. */
.bank-logo,.bank-logo.large{border-radius:29%;corner-shape:squircle}
.success-logo,.operation-bank,.operation-avatar{--bank-size:80px;width:var(--bank-size);height:var(--bank-size);isolation:isolate}
.operation-avatar{--bank-size:48px}
.success-logo>.bank-logo,.operation-bank>.bank-logo,.operation-avatar>.bank-logo{-webkit-mask-image:radial-gradient(circle calc(var(--bank-size)*.245) at 94% 94%,transparent 98%,#000 100%);mask-image:radial-gradient(circle calc(var(--bank-size)*.245) at 94% 94%,transparent 98%,#000 100%)}
.success-logo>span:last-child,.operation-bank>span:last-child,.operation-avatar>i{position:absolute;left:73%;top:73%;right:auto;bottom:auto;width:42%;height:42%;border:0;border-radius:50%;background:#f5f5ee;display:flex;align-items:center;justify-content:center}
.success-logo .sbp,.operation-bank .sbp,.operation-avatar .sbp{width:64%;height:76%;overflow:visible;stroke:none}
.sbp{stroke:none}.tile-icon>.sbp>path,.quick-transfers>button>span>.sbp>path{visibility:visible}.operation-bank{margin-bottom:22px}.operation-row{column-gap:16px}
.analytics-icon{border-radius:29%;corner-shape:squircle;background:#36c8ec}.analytics-icon>svg{width:30px;height:30px;color:#fff}
/* Banner lettering stays live at every pixel density. */
.promo{aspect-ratio:auto;min-height:90px;border-radius:17px;background:#daf39f;isolation:isolate}
.promo .utility-promo-link{position:relative;inset:auto;width:100%;height:auto;min-height:90px;padding:13px 16px;text-align:left;color:#142009;display:flex;align-items:flex-start;flex-direction:column;gap:5px}
.utility-promo-link strong{font-size:16px;font-weight:600;line-height:1.3;z-index:1}.utility-promo-link>span{font-size:14px;line-height:1.35;z-index:1}
.utility-promo-art{position:absolute;right:42px;top:0;width:104px;height:85px;background:url('assets/utility-reference.jpg') -231px -379px / 393px auto no-repeat;pointer-events:none;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.promo .utility-promo-close{position:absolute;right:4px;top:2px;width:36px;height:36px;display:flex;align-items:center;justify-content:center;z-index:2}.utility-promo-close .icon{width:20px;height:20px;padding:3px;background:#809850;color:#daf39c;border-radius:50%;stroke-width:3}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}input,select,textarea,.field input,.name-field input{font-size:16px}
.app{padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}.bottom-nav{padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}
.profile-name{overflow:hidden;text-overflow:ellipsis}.bill strong{font-weight:400}.operation-details h1,.balance-change,.account-preview>strong{font-variant-numeric:tabular-nums}
.operation-comment,.recipient-full,.success-card h2,.confirm-screen dd{overflow-wrap:anywhere}.operation-message{max-width:100%;overflow-wrap:anywhere}.operation-line>span:last-child{white-space:nowrap}
.chat-title{overflow:hidden;text-overflow:ellipsis}.chat-sheet form input{flex:1;min-width:0}.history-summary>button{min-width:0;height:auto;min-height:122px}.history-summary>button>span:not(.calendar-art){white-space:normal}
.benefit-hero strong{max-width:64%}.sheet{max-height:calc(100dvh - max(12px,env(safe-area-inset-top,0px)))}.recipient-sheet{height:calc(100dvh - max(20px,env(safe-area-inset-top,0px)))}
.self-employed>div strong{white-space:normal;max-width:100px}
@media(max-width:374px){
 .utility-promo-link strong{font-size:14px}.utility-promo-link>span{font-size:13px}.utility-promo-art{right:23px;transform:scale(.8);transform-origin:right center}.promo .utility-promo-link{padding-left:12px;min-height:82px}.promo{min-height:82px}
 .benefit-hero p{max-width:67%;font-size:13px}.benefit-hero .term{font-size:12px;padding:9px 10px}.benefit-grid .dark-offer strong{font-size:14px}.benefit-grid .dark-offer small{font-size:13px}
 .task-card>strong{font-size:23px}.task-card>b{font-size:13px;max-width:70%}.task-card>p{font-size:12px;max-width:67%}.task-card>.reference-art{right:0;transform:scale(.86);transform-origin:right top}
 .cashback-balance .primary{right:12px;width:100px}.cashback-accrual{font-size:12px;gap:3px}.rules-banner{gap:8px;padding:14px 12px;font-size:13px}.rules-banner>.icon{flex:none}
 .self-employed button{padding:14px 12px}.self-employed strong{font-size:14px}.self-employed>button>small{font-size:12px;left:12px}.privileges .offer-card{padding:14px 12px}.privileges .offer-card strong{font-size:14px}.privileges .offer-caption{font-size:12px;left:12px}
 .operation-row{gap:12px}.operation-line{gap:5px}.operation-copy>small{font-size:12px}.operation-actions button{font-size:16px}.analytics-row{gap:10px;font-size:14px}
 .chat-row{padding-left:12px;padding-right:12px;gap:10px}.chat-meta{font-size:12px}.chat-title{font-size:14px}.bottom-nav small{font-size:10px}.friend-pill{font-size:12px;padding:8px 10px}
}
@media(max-height:500px) and (orientation:landscape){.header{position:relative;top:auto}.benefit-tabs{top:0}.sheet{max-height:96dvh}.recipient-sheet{height:96dvh}.loading-screen{min-height:100dvh}.success-screen{padding-top:12px}}
@media print{.bottom-nav,#toast,.launch-splash{display:none!important}}