/* ── tokens: tema claro é a base ──────────────────────────── */
:root{
  --ground:#f5f4f4;
  --surface:#ffffff;
  --surface-2:#efedee;
  --ink:#202020;
  --ink-soft:#5c5257;
  --ink-faint:#8d8288;
  --line:#e6e2e3;
  --line-strong:#d3cccf;
  --accent:#650d47;
  --accent-quiet:#a35c86;
  --accent-wash:#f7ecf2;
  --in:#186c54;
  --in-wash:#e4f1ec;
  --out:#a8352c;
  --out-wash:#fbeae7;
  --warn:#8a5e0f;
  --warn-wash:#fbf0d9;
  --sombra:0 1px 2px rgba(32,32,32,.05), 0 8px 24px -18px rgba(32,32,32,.35);

  --display:"Fraunces",Georgia,serif;
  --corpo:"Karla",system-ui,-apple-system,sans-serif;
  --r:14px;
  --ease:cubic-bezier(.22,1,.36,1);
}

/* sistema em modo escuro (nenhum stamp no root) */
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --ground:#161114;
    --surface:#201a1e;
    --surface-2:#2a2227;
    --ink:#f4eff1;
    --ink-soft:#b6a8ae;
    --ink-faint:#8b7d83;
    --line:#332a2f;
    --line-strong:#453a40;
    --accent:#e39ec4;
    --accent-quiet:#8a3f68;
    --accent-wash:#2e1c27;
    --in:#5cc9a1;
    --in-wash:#16332a;
    --out:#f08a78;
    --out-wash:#3a221d;
    --warn:#e0a94e;
    --warn-wash:#392c17;
    --sombra:0 1px 2px rgba(0,0,0,.3), 0 8px 24px -18px rgba(0,0,0,.8);
  }
}
/* escolha explícita do leitor vence nos dois sentidos */
:root[data-theme="dark"]{
  --ground:#161114;
  --surface:#201a1e;
  --surface-2:#2a2227;
  --ink:#f4eff1;
  --ink-soft:#b6a8ae;
  --ink-faint:#8b7d83;
  --line:#332a2f;
  --line-strong:#453a40;
  --accent:#e39ec4;
  --accent-quiet:#8a3f68;
  --accent-wash:#2e1c27;
  --in:#5cc9a1;
  --in-wash:#16332a;
  --out:#f08a78;
  --out-wash:#3a221d;
  --warn:#e0a94e;
  --warn-wash:#392c17;
  --sombra:0 1px 2px rgba(0,0,0,.3), 0 8px 24px -18px rgba(0,0,0,.8);
}

/* o logo vive sobre um papel levemente texturizado; o mesmo grão
   entra aqui por cima do fundo, fraco o bastante para não sujar
   texto nem número. no tema escuro ele quase some. */
body::before{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22140%22%20height%3D%22140%22%3E%3Cfilter%20id%3D%22n%22%3E%3CfeTurbulence%20type%3D%22fractalNoise%22%20baseFrequency%3D%220.85%22%20numOctaves%3D%223%22%2F%3E%3CfeColorMatrix%20type%3D%22saturate%22%20values%3D%220%22%2F%3E%3C%2Ffilter%3E%3Crect%20width%3D%22140%22%20height%3D%22140%22%20filter%3D%22url%28%23n%29%22%20opacity%3D%220.5%22%2F%3E%3C%2Fsvg%3E");
  opacity:.05;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) body::before{opacity:.03;}
}
:root[data-theme="dark"] body::before{opacity:.03;}



/* ══════════════════════════════════════════════════════════
   Fora da Cesta 2.0 · pensado primeiro pro celular
   ══════════════════════════════════════════════════════════ */
*,*::before,*::after{box-sizing:border-box;}
[hidden]{display:none !important;}
:root{
  --nav-h:64px;
  --topo-h:60px;
  --seguro-baixo:env(safe-area-inset-bottom, 0px);
}
html{scroll-padding-top:calc(var(--topo-h) + 8px);}
body{
  margin:0;min-height:100dvh;
  background:var(--ground);color:var(--ink);
  font-family:var(--corpo);font-size:16px;line-height:1.5;
  -webkit-text-size-adjust:100%;
  -webkit-tap-highlight-color:transparent;
}
h1,h2,h3,p{margin:0;}
h1,h2,h3{text-wrap:balance;}
button,input,select,textarea{font:inherit;color:inherit;}
a{color:inherit;}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:8px;}
.ico{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.v-in{color:var(--in);} .v-out{color:var(--out);} .v-atencao{color:var(--warn);}

/* ── marca ────────────────────────────────────────────────── */
.marca{display:flex;align-items:center;gap:.55rem;min-width:0;text-decoration:none;}
.marca__laco{flex:none;width:32px;height:auto;color:var(--accent);fill:none;stroke:currentColor;stroke-width:1.1;stroke-linecap:round;stroke-linejoin:round;}
.marca__texto{min-width:0;display:flex;flex-direction:column;}
.marca__nome{display:flex;align-items:baseline;gap:.32rem;}
.marca__nome-cima{font-size:.66rem;font-weight:700;letter-spacing:.19em;text-transform:uppercase;color:var(--accent);}
.marca__nome-baixo{font-family:var(--display);font-variation-settings:"opsz" 144,"SOFT" 0,"WONK" 1;font-weight:700;font-size:1.34rem;line-height:1.05;letter-spacing:-.02em;}
.marca__sub{font-size:.72rem;color:var(--ink-faint);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:46vw;}

/* ── topo ─────────────────────────────────────────────────── */
.topo{
  position:sticky;top:0;z-index:20;
  background:color-mix(in srgb,var(--ground) 90%,transparent);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
  padding-top:env(safe-area-inset-top,0px);
}
.topo__linha{
  max-width:1120px;margin:0 auto;min-height:var(--topo-h);
  padding:.5rem clamp(.9rem,3vw,1.5rem);
  display:flex;align-items:center;gap:.75rem;
}
.topo .marca{margin-right:auto;}
.nav-topo{display:none;}
.icone-btn{
  flex:none;width:40px;height:40px;border-radius:50%;
  border:1px solid var(--line);background:var(--surface);color:var(--ink-soft);
  display:grid;place-items:center;cursor:pointer;padding:0;
}
.icone-btn:hover{background:var(--accent-wash);color:var(--accent);}
.so-computador{display:none !important;}

/* ── navegação de baixo (celular) ─────────────────────────── */
.nav-baixo{
  position:fixed;left:0;right:0;bottom:0;z-index:25;
  display:grid;grid-template-columns:repeat(5,1fr);align-items:center;
  height:calc(var(--nav-h) + var(--seguro-baixo));
  padding:0 .4rem var(--seguro-baixo);
  background:color-mix(in srgb,var(--surface) 94%,transparent);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border-top:1px solid var(--line);
}
.nav-baixo a{
  display:flex;flex-direction:column;align-items:center;gap:.15rem;
  text-decoration:none;font-size:.7rem;font-weight:700;color:var(--ink-faint);
  padding:.35rem 0;
}
.nav-baixo a .ico{width:22px;height:22px;}
.nav-baixo a[aria-current="page"]{color:var(--accent);}
.nav-baixo__novo{
  justify-self:center;width:52px;height:52px;border-radius:50%;
  border:0;background:var(--accent);color:#fff;cursor:pointer;
  display:grid;place-items:center;
  box-shadow:0 6px 16px -6px color-mix(in srgb,var(--accent) 70%,transparent);
  transform:translateY(-10px);
}
:root[data-theme="dark"] .nav-baixo__novo{color:var(--ground);}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .nav-baixo__novo{color:var(--ground);}}
.nav-baixo__novo .ico{width:24px;height:24px;stroke-width:2.2;}

/* ── conteúdo ─────────────────────────────────────────────── */
.conteudo{
  max-width:1120px;margin:0 auto;
  padding:1rem clamp(.9rem,3vw,1.5rem) calc(var(--nav-h) + var(--seguro-baixo) + 2rem);
}
.tela{display:flex;flex-direction:column;gap:1rem;}
.cabeca-tela{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding-top:.25rem;}
.titulo-tela{
  font-family:var(--display);font-variation-settings:"opsz" 72,"SOFT" 30;
  font-weight:600;font-size:1.75rem;line-height:1.1;letter-spacing:-.02em;
}
.subtitulo{font-size:.85rem;color:var(--ink-faint);margin-top:.2rem;}
.subtitulo::first-letter{text-transform:uppercase;}
.cabeca-secao{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-top:.75rem;}
.titulo-secao{font-family:var(--display);font-variation-settings:"opsz" 40,"SOFT" 30;font-weight:600;font-size:1.25rem;letter-spacing:-.01em;}
.duas{display:grid;gap:1rem;}

.cartao{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r);
  box-shadow:var(--sombra);padding:1rem 1.1rem;
}
.cartao--lista{padding:.25rem 1.1rem;}
.cartao__cabeca{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;margin-bottom:.5rem;}
.cartao__titulo{font-family:var(--display);font-variation-settings:"opsz" 30,"SOFT" 40;font-weight:600;font-size:1.05rem;letter-spacing:-.01em;}
.cartao__nota{font-size:.8rem;color:var(--ink-faint);font-weight:600;}
.rotulo{font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:var(--ink-faint);}

/* ── seletor de mês ───────────────────────────────────────── */
.mes{
  display:inline-flex;align-items:center;gap:.2rem;
  background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:.2rem;
}
.mes button{width:32px;height:32px;border:0;border-radius:50%;background:transparent;cursor:pointer;color:var(--ink-soft);font-size:1.15rem;line-height:1;}
.mes button:hover{background:var(--accent-wash);color:var(--accent);}
.mes__rotulo{min-width:8.6rem;text-align:center;font-size:.86rem;font-weight:700;}
.mes__rotulo::first-letter{text-transform:uppercase;}

/* ── busca e filtros ──────────────────────────────────────── */
.barra-ferramentas{display:flex;flex-direction:column;gap:.6rem;}
.busca{
  display:flex;align-items:center;gap:.5rem;
  background:var(--surface);border:1px solid var(--line-strong);border-radius:12px;
  padding:0 .8rem;color:var(--ink-faint);
}
.busca:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-wash);}
.busca input{flex:1;min-width:0;border:0;background:transparent;padding:.72rem 0;font-size:1rem;outline:none;}
.chips{display:flex;gap:.4rem;flex-wrap:wrap;}
.chip{
  border:1px solid var(--line-strong);background:var(--surface);
  border-radius:999px;padding:.38rem .85rem;font-size:.82rem;font-weight:700;color:var(--ink-soft);cursor:pointer;
}
.chip:hover{border-color:var(--accent-quiet);}
.chip[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:#fff;}
:root[data-theme="dark"] .chip[aria-pressed="true"]{color:var(--ground);}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .chip[aria-pressed="true"]{color:var(--ground);}}
.resumo-lista{font-size:.82rem;color:var(--ink-faint);font-weight:600;min-height:1.2em;margin:-.25rem 0;}

/* ── itens de lista (tocáveis) ────────────────────────────── */
.lista{display:flex;flex-direction:column;}
.item{
  display:flex;align-items:center;gap:.8rem;width:100%;
  padding:.8rem 0;border:0;border-bottom:1px solid var(--line);
  background:transparent;text-align:left;cursor:pointer;min-height:60px;
}
.lista > .item:last-child, .lista > .item:last-of-type{border-bottom:0;}
button.item:hover .item__titulo, .item__link:hover .item__titulo{color:var(--accent);}
.item__corpo{flex:1;min-width:0;display:flex;flex-direction:column;gap:.1rem;}
.item__link{border:0;background:transparent;padding:0;text-align:left;cursor:pointer;}
.item__titulo{font-weight:700;font-size:.95rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.item__meta{font-size:.78rem;color:var(--ink-faint);overflow:hidden;text-overflow:ellipsis;}
.item__lado{display:flex;flex-direction:column;align-items:flex-end;gap:.25rem;flex:none;}
.item--receber .item__lado{flex-direction:row;align-items:center;gap:.6rem;}
.item__valor{font-weight:700;font-size:.95rem;font-variant-numeric:tabular-nums;white-space:nowrap;}
.selo{font-size:.7rem;font-weight:700;padding:.12rem .5rem;border-radius:999px;white-space:nowrap;}
.selo--pago{background:var(--in-wash);color:var(--in);}
.selo--falta{background:var(--warn-wash);color:var(--warn);}
.dia{flex:none;width:4.6rem;display:flex;flex-direction:column;line-height:1.2;}
.dia b{font-size:.8rem;color:var(--ink-soft);text-transform:capitalize;}
.dia small{font-size:.72rem;color:var(--ink-faint);font-weight:600;}
.dia--hoje b{color:var(--accent);}
.avatar{
  flex:none;width:40px;height:40px;border-radius:50%;
  background:var(--accent-wash);color:var(--accent);
  display:grid;place-items:center;font-weight:700;font-size:.85rem;letter-spacing:.02em;
}
.avatar--grande{width:56px;height:56px;font-size:1.05rem;}
.nota-lista{font-size:.8rem;color:var(--ink-faint);padding:.8rem 0;text-align:center;}
.link-mais{display:block;text-align:center;padding:.7rem 0 .4rem;font-size:.85rem;font-weight:700;color:var(--accent);text-decoration:none;}

.vazio{text-align:center;padding:1.6rem .8rem;display:flex;flex-direction:column;align-items:center;gap:.4rem;}
.vazio strong{font-size:.95rem;}
.vazio p{font-size:.85rem;color:var(--ink-faint);max-width:34ch;}
.vazio .btn{margin-top:.5rem;}

/* ── figuras do mês ───────────────────────────────────────── */
.figuras{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem;}
.figura{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r);
  box-shadow:var(--sombra);padding:.85rem .9rem;display:flex;flex-direction:column;gap:.25rem;min-width:0;
}
.figura__valor{
  font-family:var(--display);font-variation-settings:"opsz" 60,"SOFT" 30;
  font-weight:600;font-size:1.4rem;line-height:1.05;letter-spacing:-.025em;font-variant-numeric:tabular-nums;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.figura__pe{font-size:.74rem;color:var(--ink-faint);}
.figura--destaque{background:var(--in-wash);border-color:color-mix(in srgb,var(--in) 25%,transparent);}

/* ── primeiros passos ─────────────────────────────────────── */
.passos{list-style:none;margin:.6rem 0 0;padding:0;display:flex;flex-direction:column;gap:.55rem;}
.passo{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;}
.passo__marca{
  flex:none;width:28px;height:28px;border-radius:50%;
  display:grid;place-items:center;font-size:.8rem;font-weight:700;
  border:1.5px solid var(--line-strong);color:var(--ink-soft);
}
.passo--feito .passo__marca{background:var(--in);border-color:var(--in);color:#fff;}
.passo--feito .passo__marca .ico{width:16px;height:16px;stroke-width:2.6;}
.passo--feito .passo__texto{color:var(--ink-faint);text-decoration:line-through;}
.passo__texto{flex:1;min-width:12rem;font-size:.9rem;font-weight:600;}

/* ── avisos, gráfico, rankings ────────────────────────────── */
.avisos{display:flex;flex-direction:column;gap:.6rem;}
.aviso{display:flex;gap:.7rem;align-items:flex-start;padding:.75rem .9rem;border-radius:11px;border:1px solid transparent;font-size:.86rem;margin:0;}
.aviso__marca{flex:none;width:8px;height:8px;border-radius:50%;margin-top:.45rem;}
.aviso strong{display:block;font-size:.88rem;}
.aviso p{margin:.15rem 0 0;color:var(--ink-soft);line-height:1.45;}
.aviso--critico{background:var(--out-wash);border-color:color-mix(in srgb,var(--out) 28%,transparent);}
.aviso--critico .aviso__marca{background:var(--out);}
.aviso--atencao{background:var(--warn-wash);border-color:color-mix(in srgb,var(--warn) 28%,transparent);}
.aviso--atencao .aviso__marca{background:var(--warn);}
.aviso--bom{background:var(--in-wash);border-color:color-mix(in srgb,var(--in) 26%,transparent);}
.aviso--bom .aviso__marca{background:var(--in);}
.aviso--calmo{background:var(--surface-2);border-color:var(--line);}
.aviso--calmo .aviso__marca{background:var(--accent-quiet);}
.grafico{width:100%;height:auto;display:block;overflow:visible;}
.grafico text{font-family:var(--corpo);font-size:12px;fill:var(--ink-faint);}
.grafico text.atual{fill:var(--accent);font-weight:700;}
.grafico .grade{stroke:var(--line);stroke-width:1;}
.legenda{display:flex;gap:1.1rem;font-size:.78rem;color:var(--ink-soft);margin-top:.6rem;}
.legenda span{display:flex;align-items:center;gap:.4rem;}
.legenda i{width:10px;height:10px;border-radius:3px;display:block;}
.ranking{display:flex;flex-direction:column;gap:.65rem;}
.barra-linha__topo{display:flex;justify-content:space-between;gap:1rem;font-size:.85rem;margin-bottom:.25rem;}
.barra-linha__topo small{color:var(--ink-faint);}
.barra-linha__topo b{font-variant-numeric:tabular-nums;white-space:nowrap;}
.barra{height:7px;border-radius:99px;background:var(--surface-2);overflow:hidden;}
.barra i{display:block;height:100%;border-radius:99px;background:var(--accent-quiet);}

/* ── cestas ───────────────────────────────────────────────── */
.grade-cestas{display:grid;gap:.75rem;grid-template-columns:1fr;}
.cesta-card{
  display:flex;flex-direction:column;gap:.25rem;text-align:left;cursor:pointer;
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r);
  box-shadow:var(--sombra);padding:.95rem 1rem;transition:border-color .2s;
}
.cesta-card:hover{border-color:var(--accent-quiet);}
.cesta-card__topo{display:flex;justify-content:space-between;align-items:flex-start;gap:.75rem;}
.cesta-card__nome{font-weight:700;font-size:.98rem;}
.cesta-card__preco{
  font-family:var(--display);font-variation-settings:"opsz" 60,"SOFT" 30;
  font-weight:600;font-size:1.45rem;letter-spacing:-.02em;font-variant-numeric:tabular-nums;
}
.cesta-card--inativa{opacity:.65;}
.margem{font-size:.74rem;font-weight:700;padding:.16rem .5rem;border-radius:999px;white-space:nowrap;}
.margem--boa{background:var(--in-wash);color:var(--in);}
.margem--media{background:var(--warn-wash);color:var(--warn);}
.margem--ruim{background:var(--out-wash);color:var(--out);}
.inativas summary{cursor:pointer;font-size:.88rem;font-weight:700;color:var(--ink-soft);padding:.5rem 0;}
.inativas .grade-cestas{margin-top:.5rem;}

/* ── formulários ──────────────────────────────────────────── */
.forma{display:grid;gap:.85rem;}
.forma--coluna{grid-template-columns:1fr;}
.grade2{display:grid;grid-template-columns:1fr 1fr;gap:.7rem;}
.campo{display:flex;flex-direction:column;gap:.3rem;min-width:0;}
.campo > span{font-size:.76rem;font-weight:700;color:var(--ink-soft);}
.campo input,.campo select,.campo textarea{
  width:100%;background:var(--surface);
  border:1px solid var(--line-strong);border-radius:10px;
  padding:.62rem .7rem;font-size:1rem; /* 16px evita o zoom automático do iPhone */
  transition:border-color .2s,box-shadow .2s;
}
.campo textarea{resize:vertical;min-height:2.8rem;}
.campo input:focus,.campo select:focus,.campo textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-wash);}
.grupo{border:1px solid var(--line);border-radius:12px;padding:.8rem .85rem .9rem;margin:0;display:grid;gap:.7rem;}
.grupo legend{font-size:.8rem;font-weight:700;color:var(--accent);padding:0 .35rem;}
.atalhos{display:flex;gap:.4rem;flex-wrap:wrap;}
.dica{font-size:.8rem;color:var(--ink-faint);line-height:1.45;}
.erro{font-size:.84rem;color:var(--out);min-height:1.2em;}
.erro:empty{min-height:0;display:none;}
.ok{font-size:.84rem;color:var(--in);}
.duvida{
  background:var(--warn-wash);border:1px solid color-mix(in srgb,var(--warn) 28%,transparent);
  border-radius:11px;padding:.8rem .95rem;font-size:.88rem;display:flex;flex-direction:column;gap:.6rem;
}
.resumo{display:flex;flex-wrap:wrap;gap:.35rem 1.1rem;font-size:.85rem;color:var(--ink-soft);font-variant-numeric:tabular-nums;}
.resumo:empty{display:none;}
.resumo b{color:var(--ink);}
.resultado{background:var(--surface-2);border:1px solid var(--line);border-radius:12px;padding:1rem;display:flex;flex-direction:column;gap:.5rem;}
.resultado__linha{display:flex;justify-content:space-between;gap:1rem;font-size:.88rem;color:var(--ink-soft);font-variant-numeric:tabular-nums;}
.resultado__linha b{color:var(--ink);}
.resultado__total{border-top:1px solid var(--line-strong);margin-top:.3rem;padding-top:.7rem;display:flex;justify-content:space-between;align-items:baseline;gap:1rem;font-size:.85rem;font-weight:700;color:var(--ink-soft);}
.resultado__preco{font-family:var(--display);font-variation-settings:"opsz" 72,"SOFT" 30;font-weight:600;font-size:1.8rem;line-height:1;letter-spacing:-.03em;color:var(--accent);font-variant-numeric:tabular-nums;}

/* busca de cliente no pedido */
.combo{position:relative;}
.combo__caixa{position:relative;}
.combo__lupa{position:absolute;left:.7rem;top:50%;transform:translateY(-50%);color:var(--ink-faint);width:18px;height:18px;pointer-events:none;}
.combo__caixa input{padding-left:2.2rem;}
.combo__lista{
  list-style:none;margin:.3rem 0 0;padding:.3rem;
  background:var(--surface);border:1px solid var(--line-strong);border-radius:12px;box-shadow:var(--sombra);
  max-height:260px;overflow:auto;
}
.combo__op{display:flex;justify-content:space-between;align-items:center;gap:.6rem;padding:.6rem .7rem;border-radius:8px;cursor:pointer;font-size:.95rem;}
.combo__op small{color:var(--ink-faint);font-size:.75rem;}
.combo__op[aria-selected="true"],.combo__op:hover{background:var(--accent-wash);}
.combo__op--nova{color:var(--accent);font-weight:700;justify-content:flex-start;}
.combo__op--nova .ico{width:18px;height:18px;}
.bloco-inline{margin-top:.5rem;background:var(--accent-wash);border-radius:12px;padding:.85rem;display:grid;gap:.6rem;}
.bloco-inline__titulo{font-size:.82rem;font-weight:700;color:var(--accent);}

/* ── botões ───────────────────────────────────────────────── */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.4rem;
  border:1px solid var(--accent);background:var(--accent);color:#fff;
  border-radius:999px;padding:.62rem 1.15rem;min-height:42px;
  font-size:.88rem;font-weight:700;cursor:pointer;white-space:nowrap;text-decoration:none;
  transition:filter .2s,transform .15s var(--ease);
}
:root[data-theme="dark"] .btn{color:var(--ground);}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .btn{color:var(--ground);}}
.btn:hover{filter:brightness(1.08);}
.btn:active{transform:translateY(1px);}
.btn:disabled{opacity:.6;cursor:wait;}
.btn .ico{width:18px;height:18px;stroke-width:2.2;}
html:root .btn.btn--linha{background:transparent;color:var(--accent);}
html:root .btn.btn--perigo{background:transparent;border-color:color-mix(in srgb,var(--out) 45%,transparent);color:var(--out);}
html:root .btn.btn--perigo-cheio{background:var(--out);border-color:var(--out);color:#fff;}
html:root .btn.btn--zap{background:#1f8f55;border-color:#1f8f55;color:#fff;}
.btn--mini{padding:.34rem .8rem;min-height:34px;font-size:.8rem;}
.btn--largo{width:100%;}
.acoes{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center;}
.acoes--fim{justify-content:flex-end;}
.acoes--rodape{padding-top:.25rem;}

/* ── gaveta (painel de formulários) ───────────────────────── */
.gaveta{
  border:0;padding:0;margin:auto 0 0;width:100%;max-width:100%;
  max-height:92dvh;border-radius:20px 20px 0 0;
  background:var(--surface);color:var(--ink);
  display:flex;flex-direction:column;box-shadow:0 -10px 40px -10px rgba(0,0,0,.35);
}
.gaveta:not([open]){display:none;}
.gaveta::backdrop{background:rgba(20,10,16,.45);}
.gaveta__cabeca{
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:.9rem 1.1rem .7rem;border-bottom:1px solid var(--line);
}
.gaveta__cabeca::before{
  content:"";position:absolute;left:50%;top:.4rem;transform:translateX(-50%);
  width:40px;height:4px;border-radius:9px;background:var(--line-strong);
}
.gaveta__titulo{font-family:var(--display);font-variation-settings:"opsz" 40,"SOFT" 30;font-weight:600;font-size:1.2rem;}
.gaveta__corpo{overflow:auto;padding:1rem 1.1rem calc(1.4rem + var(--seguro-baixo));overscroll-behavior:contain;}
@media (prefers-reduced-motion:no-preference){
  .gaveta[open]{animation:subir .28s var(--ease);}
  @keyframes subir{from{transform:translateY(24px);opacity:.4;}to{transform:none;opacity:1;}}
}
.subtitulo-gaveta{font-size:.8rem;font-weight:700;color:var(--ink-faint);text-transform:uppercase;letter-spacing:.1em;margin-top:.5rem;}

.ficha{display:flex;flex-direction:column;gap:1rem;}
.ficha__topo{display:flex;align-items:center;gap:.9rem;}
.ficha__nome{font-family:var(--display);font-variation-settings:"opsz" 40,"SOFT" 30;font-weight:600;font-size:1.3rem;}
.numeros{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;}
.numeros div{background:var(--surface-2);border-radius:11px;padding:.7rem .75rem;display:flex;flex-direction:column;gap:.2rem;min-width:0;}
.numeros b{font-size:1rem;font-variant-numeric:tabular-nums;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

.conta-linhas{margin-top:1.4rem;border-top:1px solid var(--line);}
.conta-linha{display:flex;align-items:center;gap:.7rem;padding:.9rem 0;border-bottom:1px solid var(--line);width:100%;font-size:.92rem;}
.conta-linha .rotulo{width:4.5rem;flex:none;}
.conta-linha--botao{border-left:0;border-right:0;border-top:0;background:transparent;cursor:pointer;text-align:left;font-weight:700;color:var(--ink-soft);}
.conta-linha--sair{color:var(--out);}
.versao{font-size:.72rem;color:var(--ink-faint);text-align:center;margin-top:1.2rem;}

/* confirmação */
.confirma{
  border:0;border-radius:16px;padding:1.2rem 1.2rem 1rem;width:min(92vw,380px);
  background:var(--surface);color:var(--ink);box-shadow:0 20px 50px -12px rgba(0,0,0,.45);
}
.confirma::backdrop{background:rgba(20,10,16,.5);}
.confirma__titulo{font-family:var(--display);font-weight:600;font-size:1.15rem;}
.confirma__texto{font-size:.9rem;color:var(--ink-soft);margin:.4rem 0 1rem;}

/* ── entrada ──────────────────────────────────────────────── */
.entrada{min-height:100dvh;display:grid;place-items:center;padding:1.5rem clamp(.9rem,4vw,2rem);}
.entrada__cartao{width:100%;max-width:410px;display:flex;flex-direction:column;gap:1.1rem;padding:1.4rem;}
.entrada__titulo{font-family:var(--display);font-variation-settings:"opsz" 72,"SOFT" 30;font-weight:600;font-size:1.7rem;line-height:1.1;letter-spacing:-.02em;}
.troca{display:grid;grid-template-columns:1fr 1fr;gap:.25rem;background:var(--surface-2);border:1px solid var(--line);border-radius:999px;padding:.22rem;}
.troca button{border:0;background:transparent;cursor:pointer;border-radius:999px;padding:.5rem .6rem;font-size:.88rem;font-weight:700;color:var(--ink-soft);}
.troca button[aria-pressed="true"]{background:var(--surface);color:var(--accent);box-shadow:var(--sombra);}

/* ── carregamento ─────────────────────────────────────────── */
.carregando{padding-top:1rem;}
.carregando:empty{display:none;}
.esqueleto{display:flex;flex-direction:column;gap:.8rem;}
.esqueleto span{display:block;height:72px;border-radius:var(--r);background:var(--surface-2);}
.esqueleto span:first-child{height:40px;width:55%;}
@media (prefers-reduced-motion:no-preference){
  .esqueleto span{animation:pulsar 1.2s ease-in-out infinite alternate;}
  @keyframes pulsar{from{opacity:1;}to{opacity:.45;}}
}

/* ── aviso rápido ─────────────────────────────────────────── */
.toast{
  position:fixed;left:50%;bottom:calc(var(--nav-h) + var(--seguro-baixo) + 1rem);transform:translateX(-50%);
  background:var(--ink);color:var(--ground);padding:.6rem 1rem;border-radius:999px;
  font-size:.86rem;font-weight:600;z-index:60;box-shadow:var(--sombra);white-space:nowrap;
}

/* ══ telas maiores ═══════════════════════════════════════════ */
@media (min-width:560px){
  .figuras{grid-template-columns:repeat(4,minmax(0,1fr));}
  .figura__valor{font-size:1.55rem;}
  .grade-cestas{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));}
  .barra-ferramentas{flex-direction:row;align-items:center;}
  .barra-ferramentas .busca{flex:1;}
}
@media (min-width:900px){
  :root{--nav-h:0px;}
  .nav-baixo{display:none;}
  .so-computador{display:inline-flex !important;}
  .nav-topo{display:flex;gap:.2rem;margin-right:.5rem;}
  .nav-topo a{
    text-decoration:none;font-size:.9rem;font-weight:700;color:var(--ink-faint);
    padding:.5rem .8rem;border-radius:999px;
  }
  .nav-topo a:hover{color:var(--ink-soft);background:var(--surface-2);}
  .nav-topo a[aria-current="page"]{color:var(--accent);background:var(--accent-wash);}
  .topo .marca{margin-right:1rem;}
  .nav-topo{margin-right:auto;}
  .marca__sub{max-width:16rem;}
  .conteudo{padding-bottom:3rem;}
  .duas{grid-template-columns:1fr 1fr;align-items:start;}
  .titulo-tela{font-size:2rem;}
  .toast{bottom:1.5rem;}
  /* no computador a gaveta vem da direita, em altura cheia */
  .gaveta{
    margin:0 0 0 auto;width:min(480px,100vw);height:100dvh;max-height:100dvh;
    border-radius:18px 0 0 18px;box-shadow:-10px 0 40px -10px rgba(0,0,0,.35);
  }
  .gaveta__cabeca::before{display:none;}
  @media (prefers-reduced-motion:no-preference){
    .gaveta[open]{animation:entrarLado .28s var(--ease);}
    @keyframes entrarLado{from{transform:translateX(30px);opacity:.4;}to{transform:none;opacity:1;}}
  }
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;transition-duration:.01ms !important;}
}

/* ── acesso pago ──────────────────────────────────────────── */
.faixa-acesso{margin-bottom:1rem;}
.faixa-acesso .link-mais{display:inline-block;margin-left:.4rem;}
a.conta-linha{text-decoration:none;}