/* =====================================================================
   COMPONENTES (7.64.0 — Etapa 2). Carregado por último: é a regra única de cada peça.
   Use SEMPRE estas classes em telas novas. Só tokens (css/tokens.css), nada de px solto.
   ───────────────────────────────────────────────────────────────────
   BOTÃO      .btn  [.sm|.lg] [.ghost|.line|.danger] [.block|.grow]   estados: :active :focus-visible :disabled .is-loading
   CARD       .card [.flat|.tight] [.click] [.st-ok|.st-warn|.st-err|.st-info]
   SEÇÃO      .sec-h  > h2 + .link/.btn   |  .eyebrow
   CAMPO      .f > label + input|select|textarea (+ .f-hint | .f-err)   .f.err
   SELO       .pill [.good|.warn|.err|.info|.brand|.muted]
   CHAVE/VALOR .kv [.stack|.click]
   LISTA      .list > .rowi [.click]
   CARD CLICÁVEL .card.click (ou .cp-click)
   MODAL      .sheet > .mhead + corpo + .mfoot > .btns
   UTILITÁRIOS .mt-0..9 .mb-0..9 .m-0 .flex-1 .minw-0 (espaços = --sp-*)
   ===================================================================== */

/* ---------- Botões ---------- */
.btn{min-height:44px;line-height:1.2;transition:transform .12s,opacity .15s,background .15s,box-shadow .15s;-webkit-tap-highlight-color:transparent}
.btn:active:not(:disabled){transform:scale(.98)}
.btn:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.btn:disabled,.btn[aria-disabled="true"]{opacity:.5;cursor:not-allowed}
.btn.sm{min-height:36px}
.btn.lg{min-height:52px;padding:14px 22px;font-size:var(--fs-lg)}
.btn.is-loading{position:relative;color:transparent!important;pointer-events:none}
.btn.is-loading::after{content:"";position:absolute;width:18px;height:18px;border-radius:50%;border:2px solid currentColor;border-color:var(--brand-fg) transparent var(--brand-fg) transparent;animation:cspin .8s linear infinite}
.btn.ghost.is-loading::after,.btn.line.is-loading::after,.btn.danger.is-loading::after{border-color:var(--brand) transparent var(--brand) transparent}
@keyframes cspin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.btn,.btn:active:not(:disabled){transition:none;transform:none}.btn.is-loading::after{animation-duration:2s}}
.link:focus-visible,.linkbtn:focus-visible,.iconbtn:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:var(--r-xs)}
.iconbtn{transition:transform .12s,background .15s}.iconbtn:active{transform:scale(.94)}

/* ---------- Cards ---------- */
.card.flat{box-shadow:none}
.card.tight{padding:14px}
.card.st-ok{border-left:4px solid var(--success)}.card.st-warn{border-left:4px solid var(--warning)}
.card.st-err{border-left:4px solid var(--danger)}.card.st-info{border-left:4px solid var(--info)}
/* card clicável: mesmo toque em todo o app */
.card.click,.accbtn.card,.pl-click{cursor:pointer;-webkit-tap-highlight-color:transparent;transition:transform .12s,box-shadow .15s,background .15s}
.card.click:active,.accbtn.card:active{transform:scale(.985)}
.card.click:focus-visible,.accbtn.card:focus-visible,.pl-click:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
@media(hover:hover){.card.click:hover,.accbtn.card:hover{box-shadow:0 6px 22px rgba(60,20,160,.14);transform:translateY(-1px)}}
@media(prefers-reduced-motion:reduce){.card.click,.accbtn.card{transition:none}.card.click:active,.card.click:hover,.accbtn.card:active,.accbtn.card:hover{transform:none}}

/* ---------- Cabeçalho de seção ---------- */
.sec-h{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);margin:0 0 var(--sp-5)}
.sec-h h2,.sec-h h3{font:var(--title-block);letter-spacing:var(--title-block-ls);margin:0}
.eyebrow{font-size:var(--eyebrow-size);font-weight:var(--fw-bold);letter-spacing:var(--eyebrow-ls);text-transform:uppercase;color:var(--muted)}

/* ---------- Campos ---------- */
.f input,.f select,.f textarea{min-height:44px;transition:border-color .15s,box-shadow .15s}
.f textarea{min-height:88px}
.f input:focus,.f select:focus,.f textarea:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 22%,transparent)}
.f input:disabled,.f select:disabled,.f textarea:disabled{opacity:.6;cursor:not-allowed}
.f .f-hint{display:block;margin-top:var(--sp-1);font-size:var(--fs-xs);color:var(--muted)}
.f .f-err{display:block;margin-top:var(--sp-1);font-size:var(--fs-xs);color:var(--danger);font-weight:var(--fw-semi)}
.f.err input,.f.err select,.f.err textarea{border-color:var(--danger)}
.f.err input:focus,.f.err select:focus,.f.err textarea:focus{box-shadow:0 0 0 3px color-mix(in srgb,var(--danger) 22%,transparent)}

/* ---------- Selos ---------- */
.pill.brand{background:var(--brand-soft);color:var(--brand)}
.pill.muted{background:var(--surface2);color:var(--muted)}

/* ---------- Chave e valor ---------- */
.kv.stack{flex-direction:column;align-items:flex-start;gap:var(--sp-0)}
.kv.click,.kvb{cursor:pointer;-webkit-tap-highlight-color:transparent}
.kv.click:focus-visible,.kvb:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:var(--r-xs)}
.kv.click:active,.kvb:active{background:var(--surface2)}

/* ---------- Listas ---------- */
.list{display:flex;flex-direction:column}
.rowi.click,button.rowi{cursor:pointer;-webkit-tap-highlight-color:transparent}
.rowi.click:active,button.rowi:active{background:var(--surface2)}
.rowi.click:focus-visible,button.rowi:focus-visible{outline:2px solid var(--brand);outline-offset:-2px;border-radius:var(--r-xs)}

/* ---------- Utilitários de espaço ---------- */
.m-0{margin:0!important}
.mt-0{margin-top:var(--sp-0)!important}.mt-1{margin-top:var(--sp-1)!important}.mt-2{margin-top:var(--sp-2)!important}.mt-3{margin-top:var(--sp-3)!important}.mt-4{margin-top:var(--sp-4)!important}.mt-5{margin-top:var(--sp-5)!important}.mt-6{margin-top:var(--sp-6)!important}.mt-7{margin-top:var(--sp-7)!important}.mt-8{margin-top:var(--sp-8)!important}.mt-9{margin-top:var(--sp-9)!important}
.mb-0{margin-bottom:var(--sp-0)!important}.mb-1{margin-bottom:var(--sp-1)!important}.mb-2{margin-bottom:var(--sp-2)!important}.mb-3{margin-bottom:var(--sp-3)!important}.mb-4{margin-bottom:var(--sp-4)!important}.mb-5{margin-bottom:var(--sp-5)!important}.mb-6{margin-bottom:var(--sp-6)!important}.mb-7{margin-bottom:var(--sp-7)!important}.mb-8{margin-bottom:var(--sp-8)!important}.mb-9{margin-bottom:var(--sp-9)!important}
.flex-1{flex:1!important}.minw-0{min-width:0!important}
.py-0{padding:var(--sp-0) 0!important}.py-1{padding:var(--sp-1) 0!important}.py-2{padding:var(--sp-2) 0!important}.py-3{padding:var(--sp-3) 0!important}.py-4{padding:var(--sp-4) 0!important}.py-5{padding:var(--sp-5) 0!important}.py-6{padding:var(--sp-6) 0!important}.py-7{padding:var(--sp-7) 0!important}
.pl-0{padding-left:var(--sp-0)!important}
.w-full{width:100%!important}.ta-c{text-align:center!important}

/* ===== Revisão visual (7.66.0) ===== */
/* faixas de filtro rolando: o 1º item respeita a margem da página (antes o "snap" escondia os 16px e colava na borda) */
.dre-per,.gfl{scroll-padding-inline:16px}
@media(min-width:900px){.dre-per{scroll-padding-inline:0}}
@media(min-width:600px){.gfl{scroll-padding-inline:0}}
/* botões longos quebram a linha em vez de passar da borda do card (ex.: "Usar modelo sugerido (50 · 10 · …)") */
.btns>.btn{max-width:100%}
.potpage .btns .btn,.potpage .btn.grow{white-space:normal;min-width:0}
/* área de toque mínima em celular (o visual não muda) */
@media(pointer:coarse){
  .link,.linkbtn,.potinfo,.swc.catsw{position:relative}
  .link::after,.linkbtn::after,.potinfo::after{content:"";position:absolute;inset:-10px -8px}
  .swc.catsw::after{content:"";position:absolute;inset:-9px}
}
/* cabeçalho de página igual em todas as telas (Potes tinha título menor e subtítulo quebrando) */
.ph.pph h1{font:800 var(--fs-3xl)/1.15 var(--font-display);letter-spacing:-.03em}
.pph .sub{font-size:var(--fs-md);margin-top:var(--sp-1);line-height:1.45}
@media(max-width:480px){.potedit-s .pl{display:none}.btn.potedit-s{width:44px;padding:0;justify-content:center}}
.btns>.btn.grow{white-space:normal;text-align:center;line-height:1.25}
/* categorias: o nome ganha a linha inteira e os botões descem (antes o nome virava "Funci…") */
@media(max-width:520px){
  .catrow .tx{flex:1 1 calc(100% - 44px)!important}
  .catrow .tx+.btn{margin-left:calc(26px + var(--sp-4))}
}
/* "Quando avisar": opções em uma linha só */
.chk label{white-space:nowrap}

/* ===== Central de Notificações (7.68) ===== */
.ncbar{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);margin:0 0 var(--sp-4)}
.ngrp{margin:0 0 var(--sp-6)}
.ngrp .eyebrow{margin:0 0 var(--sp-3) var(--sp-2)}
.ncard{padding:4px 0;overflow:hidden}
.nitem{display:flex;align-items:flex-start;gap:var(--sp-5);width:100%;padding:12px var(--sp-5);background:none;border:0;border-top:1px solid var(--line);text-align:left;color:inherit;font:inherit;cursor:pointer;position:relative;-webkit-tap-highlight-color:transparent}
.nitem:first-child{border-top:0}
.nitem:active{background:var(--surface2)}
.nitem:focus-visible{outline:2px solid var(--brand);outline-offset:-2px}
.nitem .nb{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.nitem .nt{display:flex;align-items:center;gap:var(--sp-3);flex-wrap:wrap}
.nitem .nt b{font-weight:600}
.nitem.unread .nt b{font-weight:800}
.nitem .nd{color:var(--text);overflow-wrap:anywhere}
.nitem .nw{color:var(--muted);font-size:var(--fs-sm,12.5px)}
.nitem .ndot{flex:none;width:9px;height:9px;border-radius:50%;background:var(--brand);margin-top:8px}
.nitem.late .ndot{background:var(--neg)}
.nitem:not(.unread) .ico{opacity:.7}
.ncs{margin:0 0 var(--sp-6)}
.ncs .sec-h{margin-bottom:var(--sp-4)}
.ncadv{border-top:1px solid var(--line);padding-top:var(--sp-4)}
.ncadv>summary{cursor:pointer;font-weight:700;color:var(--muted);display:flex;align-items:center;gap:var(--sp-3);list-style:none}
.ncadv>summary::-webkit-details-marker{display:none}
.ncadv-b{margin-top:var(--sp-4)}

/* ===== Extrato: card do lançamento (7.69) — só .rowi.xr, usado apenas no Extrato ===== */
.rowi.xr{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:var(--sp-5);row-gap:var(--sp-4);align-items:start;padding:14px 0}
.xr .main2{align-items:flex-start;min-width:0;grid-column:1;padding:0;background:none;border:0;color:inherit;font:inherit}
.xr .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.xr .xn{font-weight:700;font-size:var(--fs-base);line-height:1.25;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:break-word;word-break:normal}
.xr .xm,.xr .xd,.xr .xrec{font-size:var(--fs-sm);color:var(--muted);line-height:1.3}
.xr .xm{display:flex;align-items:center;gap:var(--sp-3);min-width:0}
.xr .xcat{flex:none;max-width:60%;display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.xr .xacc{flex:1 1 0;min-width:0;display:inline-flex;align-items:center;gap:6px}
.xr .xcat>span:last-child,.xr .xacc>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.xr .xsep{flex:none;font-style:normal;opacity:.7}
.xr .xd{display:flex;align-items:center;gap:var(--sp-3);flex-wrap:wrap}
.xr .xv{grid-column:2;grid-row:1;display:flex;flex-direction:column;align-items:flex-end;gap:var(--sp-2);text-align:right}
.xr .xv .v{font-size:var(--fs-lg)}
.xr .xa{display:flex;justify-content:flex-end}
.xr .xa .btn{width:auto;flex:none}
.xr .main2{gap:var(--sp-4)}
.xr .ico{width:36px;height:36px}
.xr .xd{flex-wrap:nowrap;white-space:nowrap}
.xr .xcat{max-width:70%}
.xr .xa .btn{align-self:flex-end}
/* 7.71: categoria, conta e data em linhas separadas */
.xr .xm{flex-direction:column;align-items:flex-start;gap:3px}
.xr .xm .xsep{display:none}
.xr .xcat,.xr .xacc{max-width:100%;min-width:0;flex:none;width:100%}
.xr .xcat>span:last-child,.xr .xacc>span:last-child{flex:1;min-width:0}
/* 7.73: contas a pagar/receber e "Próximas contas" usam o mesmo card (vencimento na linha da data) */
.xr .xd.late .xdue{color:var(--neg);font-weight:600}
.xr .xd .xsep{font-style:normal;opacity:.7}
.xr .xd{flex-wrap:wrap;white-space:normal;row-gap:0}
.xr .xd .xdue::after{content:" •";opacity:.7;white-space:pre}
@media (max-width:520px){.xr .xd{flex-direction:column;align-items:flex-start;gap:0}.xr .xd .xdue::after{content:""}}
/* 7.74: card mais compacto (mesma estrutura, menos folga vertical) */
.rowi.xr{padding:10px 0;row-gap:4px}
.xr .tx{gap:1px}
.xr .xn{line-height:1.2}
.xr .xm,.xr .xd,.xr .xrec{line-height:1.25}
.xr .xm{gap:1px}
.xr .xv{gap:3px}
.xr .xv .v{font-size:var(--fs-base);line-height:1.2}
.xr .xv .pill{font-size:11px;padding:1px 8px;line-height:1.35}
.xr .xa .btn{min-height:32px;padding:5px 12px}
.xr .xa .link{padding:2px 0}
/* 7.74: data/vencimento na mesma linha do botão (embaixo à esquerda) */
.xr .main2{grid-column:1;grid-row:1}
.xr .xdb{grid-column:1;grid-row:2;align-self:center;background:none;border:0;padding:0 0 0 46px;margin:0;text-align:left;color:inherit;font:inherit;cursor:pointer;min-width:0}
.xr .xv{grid-column:2;grid-row:1}
.xr .xa{grid-column:2;grid-row:2;align-self:center}
.xr .xdb .xd{margin:0}

/* ===== Insights compacto (7.75) ===== */
.ins-hero{padding:var(--sp-5)}
.ih-grid{margin-top:var(--sp-3);gap:var(--sp-4)}
.ih-c{padding:var(--sp-5)}
.ih-nm{font-size:var(--fs-sm);color:var(--muted)}
.ih-two{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-4);align-items:end;margin-top:var(--sp-2)}
.ih-v{font-size:clamp(24px,7vw,30px)}
.ih-v2{font:800 clamp(18px,5vw,22px) var(--font-display);letter-spacing:-.02em;white-space:nowrap}
.ih-v2.neg{color:var(--neg)}
.ih-7{margin-top:var(--sp-3);font-size:var(--fs-sm);color:var(--muted)}
.ih-7 span{font-weight:700;margin-right:var(--sp-2)}
.ih-7 b{color:var(--fg)}
.ih-c .ih-note{margin-top:var(--sp-3);font-size:var(--fs-xs);padding:6px 10px}
.insec{margin:0 0 var(--sp-6)}
.insh2{margin:0 2px var(--sp-3)}
.insl{display:grid;gap:var(--sp-3)}
.ial{display:flex;align-items:center;gap:var(--sp-4);padding:10px var(--sp-5);border-radius:var(--r-xl);background:var(--surface);border:1px solid var(--line);border-left:4px solid var(--line);cursor:pointer;-webkit-tap-highlight-color:transparent}
.ial.bad{border-left-color:var(--neg)}.ial.warn{border-left-color:var(--amber)}.ial.good{border-left-color:var(--pos)}.ial.info{border-left-color:var(--brand)}
.ial:active{background:var(--surface2)}
.ial:focus-visible,.iqt:focus-visible,.irw:focus-visible,.igl:focus-visible,.irc:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.ial-i{flex:none;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font-style:normal;background:var(--brand-soft);color:var(--brand)}
.ial.bad .ial-i{background:color-mix(in srgb,var(--neg) 14%,var(--surface));color:var(--neg)}
.ial.warn .ial-i{background:color-mix(in srgb,var(--amber) 20%,var(--surface));color:var(--amber-ink)}
.ial.good .ial-i{background:color-mix(in srgb,var(--pos) 14%,var(--surface));color:var(--pos)}
.ial-b{flex:1;min-width:0}
.ial-t{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap}
.ial-t b{font-size:var(--fs-md);line-height:1.25;overflow-wrap:anywhere}
.ial-b p{margin:1px 0 0;font-size:var(--fs-sm);color:var(--muted);line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ins-more,.ins-cta{margin:var(--sp-3) 0 0;font-size:var(--fs-sm);display:inline-flex;align-items:center;gap:4px}
.iqg{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3)}
.iqt{padding:var(--sp-4) var(--sp-5);border-radius:var(--r-xl);background:var(--surface);border:1px solid var(--line);cursor:pointer;display:flex;flex-direction:column;gap:2px;min-width:0}
.iqt:active{background:var(--surface2)}
.iqt-t{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap;font-size:var(--fs-xs);font-weight:700;color:var(--muted)}
.iqt-v{font:800 var(--fs-xl) var(--font-display);letter-spacing:-.02em;white-space:nowrap}
.iqt-v.neg{color:var(--neg)}.iqt-v.pos{color:var(--pos)}
.iqt small{font-size:var(--fs-xs);color:var(--muted);line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ihg{display:grid;gap:var(--sp-3)}
.ihl{padding:var(--sp-5)}
.ihl .hd{margin-bottom:var(--sp-3)}
.ihl .kv{padding:5px 0}
.igg{display:grid;gap:var(--sp-3)}
.igl{padding:var(--sp-4) var(--sp-5);border-radius:var(--r-xl);background:var(--surface);border:1px solid var(--line);cursor:pointer;display:grid;gap:6px}
.igl:active{background:var(--surface2)}
.igl-h{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3)}
.igl-h b{min-width:0;overflow-wrap:anywhere}
.igl-p{height:6px;border-radius:99px;background:var(--surface2);overflow:hidden}
.igl-p i{display:block;height:100%;background:var(--brand);border-radius:99px}
.igl small{font-size:var(--fs-sm);color:var(--muted);line-height:1.35}
.irl{display:grid;border-radius:var(--r-xl);background:var(--surface);border:1px solid var(--line);overflow:hidden}
.irw,.irc{display:flex;align-items:center;gap:var(--sp-4);padding:10px var(--sp-5);cursor:pointer}
.irw+.irw,.irc+.irc,.irw+.irc,.irc+.irw{border-top:1px solid var(--line)}
.irw:active,.irc:active{background:var(--surface2)}
.irw-b,.irc-b{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.irw-t,.irc-t{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap;font-size:var(--fs-md);font-weight:600}
.irw small,.irc small{font-size:var(--fs-sm);color:var(--muted);line-height:1.3}
.irw-v{flex:none;font:800 var(--fs-base) var(--font-display);white-space:nowrap}
.irw-v.neg{color:var(--neg)}.irw-v.pos{color:var(--pos)}
.irc-c{flex:none;color:var(--brand);font-size:var(--fs-sm);font-weight:700;display:inline-flex;align-items:center;gap:3px;white-space:nowrap}
.ipv{padding:var(--sp-4) var(--sp-5);border-radius:var(--r-xl);background:var(--surface);border:1px solid var(--line)}
.ipv-h{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);margin-bottom:var(--sp-3)}
.ipv-h small{color:var(--muted);font-size:var(--fs-xs)}
.ipv-g{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3) var(--sp-5)}
.ipv-g span{display:flex;flex-direction:column;font-size:var(--fs-xs);color:var(--muted)}
.ipv-g b{font:700 var(--fs-md) var(--font-display);color:var(--fg)}
.ipv-g b.neg{color:var(--neg)}.ipv-g b.pos{color:var(--pos)}
@media (min-width:700px){
  .iqg{grid-template-columns:repeat(3,1fr)}
  .ihg{grid-template-columns:1fr 1fr}
  .igg{grid-template-columns:1fr 1fr}
}
@media (min-width:1100px){
  .ins-cols{display:grid;grid-template-columns:1fr 1fr;column-gap:var(--sp-7);align-items:start}
  .ins-cols>.insec:first-child{grid-column:1/-1}
  .ins-cols .ihg{grid-template-columns:1fr}
}
.ih-7{display:flex;flex-direction:column;gap:1px}
.ih-7 span{margin:0;font-size:var(--fs-xs)}

/* ===== Potes: card "Resumo do mês" compacto (7.77) ===== */
.potmonth{padding:var(--sp-5) var(--sp-6)}
.potmonth .hd{display:flex;align-items:center;justify-content:flex-start;gap:var(--sp-3);margin:0 0 var(--sp-4)}
.potmonth .hd h2{margin:0}
.potmonth .hd .pill{font-size:var(--fs-xs)}
.potmonth .potsum{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin:0 0 var(--sp-4)}
.potmonth .potsum>div{padding:0 var(--sp-4);border-left:1px solid var(--line);min-width:0}
.potmonth .potsum>div:first-child{padding-left:0;border-left:0}
.potmonth .potsum>div:last-child{padding-right:0}
.potmonth .potsum .note{display:block;font-size:var(--fs-xs);margin:0}
.potmonth .potsum b{font-size:clamp(13px,3.9vw,17px);margin-top:2px;white-space:nowrap}
.potmonth .potsum-full{grid-column:auto}
.potmonth .bar2{height:8px;margin:0}
.potmonth .potleg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-3) var(--sp-6);margin-top:var(--sp-4)}
.potmonth .potleg .lg{display:flex;align-items:flex-start;gap:var(--sp-3);min-width:0;line-height:1.25}
.potmonth .potleg .lg .potdot{margin-top:3px}
.potmonth .potleg .lgt{flex:1;min-width:0;overflow-wrap:normal;word-break:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.potmonth .potleg .lgp{flex:none;margin-left:auto;padding-left:var(--sp-2);font-weight:700;color:var(--fg);white-space:nowrap}
.potmonth .potfoot{margin-top:var(--sp-4);padding-top:var(--sp-3)}
@media (min-width:560px){.potmonth .potleg{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1000px){.potmonth{max-width:none}.potmonth .potleg{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-3) var(--sp-8,40px)}.potmonth .potsum b{font-size:20px}}
.potmonth .potsum.two{grid-template-columns:repeat(2,minmax(0,1fr))}

/* Potes: cartões individuais compactos (7.79.0) */
.potc{padding:12px 16px 14px}
.potc::before{width:28px;height:3px;margin:0 0 8px}
.potc .potacc{min-height:0;margin-top:0;font-size:var(--fs-xs)}
.potc .potacc:empty{display:none}
.potc .potbal{font-size:clamp(22px,6.4vw,26px);margin-top:6px;line-height:1.1}
.potc .potsl{margin-top:0;font-size:var(--fs-xs)}
.potc .potst{margin-top:8px;padding:8px 10px}
.potc .potst.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.potc .potbar{margin:8px 0 6px}
.potc .potrow{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);margin-top:auto}
.potc .potrow .potbl{margin:0;min-width:0;flex:1}
.potc .potrow [data-potspend]{margin:0!important;align-self:auto;flex:none;min-height:32px;padding:4px 12px}
.potgrid{gap:var(--sp-5)}
@media(max-width:559px){.potgrid{gap:var(--sp-4)}}

/* Dicas de uso (7.85.0) */
.tour{text-align:center;padding:4px 0 0}
.tourico{width:60px;height:60px;border-radius:var(--r-2xl,20px);background:var(--surface2);color:var(--brand);display:grid;place-items:center;margin:0 auto 12px}
.tour h3{margin:0 0 8px}
.tourx{margin:0 auto;max-width:34ch;color:var(--muted);line-height:1.5;font-size:var(--fs-md)}
.tourdots{display:flex;justify-content:center;gap:6px;margin-top:16px}
.tourdots i{width:7px;height:7px;border-radius:50%;background:var(--line)}
.tourdots i.on{background:var(--brand);width:20px;border-radius:99px}