*{box-sizing:border-box}
:root{color-scheme:dark}
html,body{margin:0;min-height:100%;background:#02050c;color:#fff;font-family:Arial,Helvetica,sans-serif}
body{background:radial-gradient(circle at 50% -10%,#063b88 0,#06172f 28%,#02050c 63%)}
a{color:inherit;text-decoration:none}
.page-shell{width:min(100%,720px);min-height:100vh;margin:auto;padding:18px 16px 36px}
.topbar{display:flex;align-items:center;gap:14px;padding:8px 0 18px}
.back{display:grid;place-items:center;width:46px;height:46px;border:1px solid rgba(56,181,255,.55);border-radius:15px;background:rgba(4,20,47,.82);box-shadow:0 0 18px rgba(0,126,255,.22);font-size:36px;line-height:1}
.eyebrow{display:block;color:#29b8ff;font-size:12px;font-weight:800;letter-spacing:.24em}
h1{margin:4px 0 0;font-size:27px;line-height:1.1}
.intro{padding:16px 18px;margin-bottom:15px;border:1px solid rgba(42,175,255,.28);border-radius:18px;background:rgba(4,17,38,.78)}
.intro p{margin:0;color:#cfeaff;line-height:1.5}
.bank-list{display:grid;gap:12px}
.bank-card{display:grid;grid-template-columns:60px 1fr 28px;align-items:center;gap:13px;min-height:84px;padding:11px 15px;border:1px solid rgba(43,180,255,.58);border-radius:22px;background:linear-gradient(100deg,rgba(2,8,19,.98),rgba(5,48,111,.86));box-shadow:inset 0 0 22px rgba(0,128,255,.16),0 0 18px rgba(0,93,255,.12)}
.bank-card:active{transform:scale(.985)}
.bank-icon{display:grid;place-items:center;width:56px;height:56px;border:2px solid #0ea5ff;border-radius:50%;background:#02060d;box-shadow:0 0 16px #006aff;color:#fff;font-size:22px;font-weight:900}
.bank-copy strong,.bank-copy small{display:block}
.bank-copy strong{font-size:19px}
.bank-copy small{margin-top:5px;color:#95d9ff;font-size:13px}
.arrow{font-size:38px;color:#42bfff;text-shadow:0 0 12px #007cff}
.featured{display:grid;grid-template-columns:36px 1fr 24px;align-items:center;gap:10px;margin-top:20px;padding:17px 18px;border:1px solid #32bfff;border-radius:20px;background:linear-gradient(95deg,#041126,#0750b1);box-shadow:0 0 24px rgba(0,114,255,.3)}
.featured strong{font-size:17px}
.notice{margin:18px 8px 0;text-align:center;color:#7891ae;font-size:12px;line-height:1.45}


/* Versão 18 — efeitos visuais */
.back,.bank-card,.featured{position:relative;overflow:hidden;transition:transform .18s ease,box-shadow .22s ease,filter .18s ease}
.back:hover,.bank-card:hover,.featured:hover{transform:translateY(-2px);filter:brightness(1.06);box-shadow:0 10px 26px rgba(0,136,255,.18),0 0 16px rgba(50,191,255,.14)}
.back:active,.bank-card:active,.featured:active{transform:scale(.988)}
.back::after,.bank-card::after,.featured::after{content:"";position:absolute;top:0;bottom:0;left:-30%;width:20%;background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.20),rgba(255,255,255,0));transform:skewX(-20deg);opacity:0}
.back:hover::after,.bank-card:hover::after,.featured:hover::after{opacity:1;animation:bankSheen .9s ease}
@keyframes bankSheen{0%{left:-30%;opacity:0}18%{opacity:1}100%{left:110%;opacity:0}}