/* ==========================================================================
   STACK FALL — Design System (branco & azul premium)  [FONTE ÚNICA DE ESTILO]
   Importe em todas as páginas: <link rel="stylesheet" href="/theme.css">
   Tema claro premium (fintech/Pix), azul + branco, mobile-first.
   ========================================================================== */
:root{
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --bg:#eaf1fb; --card:#ffffff; --card2:#f6faff; --line:#e4ecf6; --line2:#d2ddec;
  --text:#0f2136; --muted:#5b6b82; --soft:#93a2b6;
  --blue:#2680ff; --blue-d:#1563e0; --blue-2:#5aa0ff; --blue-bg:rgba(38,128,255,.10); --blue-ink:#0b3a8c;
  /* aliases legados (roxo/dourado do tema antigo agora apontam pro azul) */
  --purple:#2680ff; --purple-d:#1563e0; --pink:#5aa0ff;
  --yellow:#2680ff; --amber:#1563e0; --amber-t:#ffffff;
  --green:#12b76a; --green-d:#0a9355; --green-bg:rgba(18,183,106,.12);
  --red:#ef4444;
  --shadow:0 20px 46px rgba(23,64,120,.16); --shadow-s:0 8px 22px rgba(23,64,120,.10);
  --safe-b:env(safe-area-inset-bottom,0px);
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html{scroll-behavior:smooth;}
body{font-family:var(--font); color:var(--text); line-height:1.55; overflow-x:hidden; background:var(--bg);
  background-image:radial-gradient(72% 55% at 88% -10%,rgba(38,128,255,.14),transparent 60%),radial-gradient(55% 45% at -8% 10%,rgba(90,160,255,.10),transparent 55%),radial-gradient(60% 45% at 50% 112%,rgba(18,183,106,.06),transparent 60%);
  background-attachment:fixed;}
svg{display:block;} a{color:var(--blue); text-decoration:none;}
.wrap{max-width:520px; margin:0 auto; padding:0 16px;}

/* Botões */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; font-family:inherit; font-weight:900; cursor:pointer; border:none; border-radius:15px; font-size:15px; padding:14px 22px; letter-spacing:.2px; transition:transform .08s,box-shadow .2s,filter .2s;}
.btn.primary{background:linear-gradient(135deg,var(--blue),var(--blue-d)); color:#fff; box-shadow:0 0 0 1px rgba(38,128,255,.25),0 12px 28px rgba(38,128,255,.42);}
.btn.primary:hover{filter:brightness(1.05);}
.btn.green{background:linear-gradient(135deg,var(--green),var(--green-d)); color:#fff; box-shadow:0 0 0 1px rgba(18,183,106,.25),0 12px 26px rgba(18,183,106,.4);}
.btn.purple{background:linear-gradient(135deg,var(--blue),var(--blue-d)); color:#fff; box-shadow:0 0 0 1px rgba(38,128,255,.25),0 12px 26px rgba(38,128,255,.42);}
.btn.ghost{background:#fff; color:var(--text); border:1.5px solid var(--line2);}
.btn.big{font-size:18px; padding:18px 28px; width:100%;}
.btn.block{width:100%;}
.btn:active{transform:translateY(1px);} .btn:disabled{opacity:.5; cursor:not-allowed; filter:grayscale(.3);}

/* Header */
header{position:sticky; top:0; z-index:40; background:rgba(255,255,255,.85); backdrop-filter:blur(14px); border-bottom:1px solid var(--line);}
.hd{display:flex; align-items:center; justify-content:space-between; height:60px;}
.logo{display:flex; align-items:center; gap:9px; font-weight:900; font-size:20px; letter-spacing:-.6px; color:var(--text);}
.logo .ball{width:16px; height:16px; border-radius:50%; background:radial-gradient(circle at 35% 30%,#ff8a7a,var(--red)); box-shadow:0 0 12px rgba(255,77,61,.55);}
.logo em{font-style:normal; background:linear-gradient(120deg,var(--blue),var(--blue-d)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;}
.hdRight{display:flex; align-items:center; gap:7px;}
.saldoPill{display:inline-flex; align-items:center; gap:4px; background:var(--green-bg); border:1px solid rgba(18,183,106,.4); color:var(--green-d); font-weight:900; font-size:13.5px; padding:8px 12px; border-radius:99px; white-space:nowrap; cursor:pointer;}
.hdBtn{font-family:inherit; font-weight:800; font-size:13px; padding:9px 13px; border-radius:12px; cursor:pointer; border:1.5px solid var(--line2); background:#fff; color:var(--text); white-space:nowrap;}
.hdBtn.y{background:linear-gradient(135deg,var(--blue),var(--blue-d)); color:#fff; border:none; box-shadow:0 6px 16px rgba(38,128,255,.4);}
.hdBack{display:inline-flex;align-items:center;gap:5px;font-weight:800;font-size:14px;color:var(--muted);cursor:pointer;background:none;border:none;font-family:inherit;}

/* Cards / superfícies */
.card{background:#fff; border:1px solid var(--line); border-radius:20px; padding:20px; box-shadow:var(--shadow-s);}
.panel{background:#fff; border:1px solid var(--line); border-radius:22px; padding:20px; box-shadow:var(--shadow-s);}
.badge{display:inline-flex; align-items:center; gap:7px; background:var(--blue-bg); color:var(--blue-d); border:1px solid rgba(38,128,255,.35); font-weight:900; font-size:12px; letter-spacing:.4px; padding:7px 13px; border-radius:99px; text-transform:uppercase;}
.tpill{display:inline-flex; align-items:center; gap:6px; background:#fff; border:1px solid var(--line2); padding:8px 13px; border-radius:99px; font-size:12.5px; font-weight:700; color:var(--muted);} .tpill b{color:var(--text);} .tpill svg{color:var(--green);}

/* Títulos de seção */
.sec-h{display:flex; align-items:center; gap:9px; margin-bottom:4px;}
.sec-h .bar{width:5px; height:24px; border-radius:3px; background:linear-gradient(var(--blue),var(--blue-2));}
.sec-t{font-size:22px; font-weight:900; letter-spacing:-.6px;}
.sec-s{color:var(--muted); font-size:14px; margin:0 0 16px 14px;}

/* Formulários */
.field{margin-bottom:14px;} .field label{display:block; font-size:12.5px; font-weight:800; color:var(--muted); margin-bottom:6px; letter-spacing:.3px;}
.input{width:100%; font-family:inherit; font-size:16px; font-weight:600; color:var(--text); background:#f4f8fd; border:1.5px solid var(--line2); border-radius:14px; padding:14px 15px; transition:border-color .15s,box-shadow .15s; outline:none;}
.input::placeholder{color:var(--soft);} .input:focus{border-color:var(--blue); box-shadow:0 0 0 3px rgba(38,128,255,.18); background:#fff;}
.formErr{color:var(--red); font-size:13px; font-weight:700; margin-top:4px; min-height:1px;}

/* Abas */
.tabs{display:flex; gap:6px; background:#eef3fa; border:1px solid var(--line); border-radius:16px; padding:5px;}
.tabs button{flex:1; font-family:inherit; font-weight:900; font-size:14px; color:var(--muted); background:none; border:none; padding:11px; border-radius:12px; cursor:pointer;}
.tabs button.on{background:linear-gradient(135deg,var(--blue),var(--blue-d)); color:#fff; box-shadow:0 4px 14px rgba(38,128,255,.4);}

/* Bottom-sheet (modais que sobem de baixo, grudados, largura total) */
.sheetBack{position:fixed; inset:0; z-index:80; background:rgba(15,32,60,.42); backdrop-filter:blur(3px); opacity:0; visibility:hidden; transition:opacity .28s,visibility .28s;}
.sheetBack.on{opacity:1; visibility:visible;}
.sheet{position:fixed; left:0; right:0; bottom:0; z-index:81; max-width:520px; margin:0 auto;
  background:#fff; border:1px solid var(--line); border-bottom:none;
  border-radius:26px 26px 0 0; padding:10px 20px calc(24px + var(--safe-b)); box-shadow:0 -18px 50px rgba(23,64,120,.28);
  transform:translateY(101%); transition:transform .34s cubic-bezier(.2,.9,.25,1); max-height:92vh; overflow-y:auto;}
.sheet.on{transform:translateY(0);}
.sheet .grip{width:42px; height:5px; border-radius:99px; background:var(--line2); margin:2px auto 14px;}
.sheet h2{font-size:21px; font-weight:900; letter-spacing:-.4px; margin-bottom:4px;}
.sheet .sub{color:var(--muted); font-size:13.5px; margin-bottom:16px;}

/* Utilidades */
.muted{color:var(--muted);} .green{color:var(--green-d);} .row{display:flex; gap:10px;} .stack{display:flex; flex-direction:column; gap:12px;}
.spin{width:20px;height:20px;border:2.5px solid rgba(38,128,255,.25);border-top-color:var(--blue);border-radius:50%;animation:spin .7s linear infinite;display:inline-block;}
@keyframes spin{to{transform:rotate(360deg)}}
.chipRow{display:flex; gap:8px; flex-wrap:wrap;}
.valChip{flex:1; min-width:70px; text-align:center; font-weight:900; font-size:15px; padding:13px 8px; border-radius:14px; background:#f4f8fd; border:1.5px solid var(--line2); color:var(--text); cursor:pointer; transition:.12s;}
.valChip.on{border-color:var(--blue); background:var(--blue-bg); color:var(--blue-d); box-shadow:0 6px 16px rgba(38,128,255,.22);}

/* Menu inferior (bottom nav do app) */
.bnav{position:fixed; left:0; right:0; bottom:0; z-index:50; max-width:520px; margin:0 auto; display:flex; background:rgba(255,255,255,.92); backdrop-filter:blur(14px); border-top:1px solid var(--line); padding:8px 6px calc(8px + var(--safe-b));}
.bnav a{flex:1; display:flex; flex-direction:column; align-items:center; gap:3px; font-size:10.5px; font-weight:800; color:var(--soft); padding:4px 0;}
.bnav a.on{color:var(--blue);} .bnav a.on svg{filter:drop-shadow(0 0 6px rgba(38,128,255,.5));}
.bnav svg{width:22px; height:22px;}