/* MartialPro — design system (docs/DESIGN-SYSTEM.md). Tema claro e escuro; prefixo ab-. */
/* Fontes locais (OFL): o sistema é local-first e o PWA abre sem internet. */
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 100 900; font-display: swap; src: url('../lib/fonts/inter-latin-wght-normal.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 100 900; font-display: swap; src: url('../lib/fonts/inter-latin-ext-wght-normal.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Bebas Neue'; font-style: normal; font-weight: 400; font-display: swap; src: url('../lib/fonts/bebas-neue-latin-400-normal.woff2') format('woff2'); }

/* Tema: segue o sistema; <html data-tema="claro|escuro"> (cookie AcadBjj.Tema) força um dos dois.
   Cada cor é light-dark(claro, escuro), então não há bloco de tema duplicado. */
:root { color-scheme: light dark; }
:root[data-tema="claro"] { color-scheme: light; }
:root[data-tema="escuro"] { color-scheme: dark; }
:root {
  --color-primary: #C1121F;
  --color-primary-dark: #8B0E18;
  --color-black: #111111;
  --color-black-soft: #1E1E1E;
  --color-white: light-dark(#FFFFFF, #181818);
  --color-bg: light-dark(#F5F5F5, #0D0D0D);
  --color-border: light-dark(#D9D9D9, #3A3A3A);
  --color-border-soft: light-dark(#EAEAEA, #2A2A2A);
  --color-text: light-dark(#111111, #EDEDED);
  --color-text-muted: light-dark(#555555, #A6A6A6);
  --color-link: light-dark(#8B0E18, #FF7A83);
  --color-forte: light-dark(#111111, #2E2E2E);
  --color-hover: light-dark(#F1F1F1, #222222);
  --color-zebra: light-dark(#FAFAFA, #1C1C1C);
  --ok-bg: light-dark(#E8F5EE, #10261A); --ok-bd: light-dark(#A8D5BB, #23583A); --ok-tx: light-dark(#0F5132, #9BE3BB);
  --erro-bg: light-dark(#FDECEE, #2B1215); --erro-bd: light-dark(#F3B8BE, #6A222B); --erro-tx: light-dark(#7A0C15, #FFB3BA);
  --aviso-bg: light-dark(#FFF8E1, #2A2205); --aviso-bd: light-dark(#F5D77A, #6B5612); --aviso-tx: light-dark(#4D3B00, #FFE08A);
  --info-bg: light-dark(#E7F0FF, #0F1E38); --info-bd: light-dark(#B6CFFB, #26457A); --info-tx: light-dark(#0A3D91, #9CC2FF);
  --neutro-bg: light-dark(#EEEEEE, #2A2A2A); --neutro-bd: light-dark(#DDDDDD, #3A3A3A); --neutro-tx: light-dark(#444444, #CFCFCF);
  --color-sidebar-text: #C9C9C9;
  --color-success: #198754;
  --color-warning: #FFC107;
  --color-danger: #DC3545;
  --color-info: #0D6EFD;

  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --shadow-sm: 0 2px 8px light-dark(rgba(0,0,0,0.06), rgba(0,0,0,0.4));
  --shadow-md: 0 6px 18px light-dark(rgba(0,0,0,0.10), rgba(0,0,0,0.5));
  --ease-mola: cubic-bezier(.34, 1.56, .64, 1);

  --font-base: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  --font-display: 'Bebas Neue', 'Oswald', 'Arial Narrow', Impact, sans-serif;
  --sidebar-w: 248px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
/* Classes com display (botões, formulários) não podem anular o atributo hidden usado pelos scripts. */
[hidden] { display: none !important; }
body { margin: 0; font-family: var(--font-base); font-size: 15px; line-height: 1.5; color: var(--color-text); background: var(--color-bg); }
a { color: var(--color-link); }
h1, h2, h3 { line-height: 1.2; margin: 0 0 .5rem; }
h1 { font-size: 1.6rem; }
h2 { font-size: 1.15rem; }
:focus-visible { outline: 3px solid var(--color-primary); outline-offset: 2px; }
.ab-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ab-ico { width: 20px; height: 20px; flex: none; }
.ab-muted { color: var(--color-text-muted); }
.ab-display { font-family: var(--font-display); letter-spacing: .03em; font-weight: 400; }
.ab-pular { position: absolute; left: -999px; top: 0; background: var(--color-black); color: #fff; padding: .5rem 1rem; z-index: 99; }
.ab-pular:focus { left: 0; }

/* ---------- Layout administrativo ---------- */
.ab-shell { display: grid; grid-template-columns: var(--sidebar-w) 1fr; min-height: 100vh; }
.ab-sidebar { border-right: 1px solid var(--color-border-soft); background: var(--color-black); color: var(--color-sidebar-text); display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh; }
.ab-sidebar__marca { padding: 1.25rem 1rem; border-bottom: 1px solid #262626; }
.ab-sidebar__marca img { width: 100%; max-width: 200px; height: auto; display: block; }
.ab-sidebar__academia { font-size: .8rem; color: #9a9a9a; margin-top: .5rem; }
/* O <nav> rola dentro da barra (marca e rodapé fixos); sem isso, menus longos vazam para fora do fundo preto. */
.ab-sidebar > nav { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #3A3A3A transparent; }
.ab-nav { list-style: none; margin: 0; padding: .75rem .5rem; }
.ab-nav a { display: flex; align-items: center; gap: .75rem; padding: .65rem .85rem; color: var(--color-sidebar-text); text-decoration: none; border-radius: var(--radius-sm); border-left: 3px solid transparent; font-weight: 500; }
.ab-nav a:hover { background: var(--color-black-soft); color: #fff; }
.ab-nav a[aria-current="page"] { background: var(--color-black-soft); color: #fff; border-left-color: var(--color-primary); }
.ab-nav a[aria-current="page"] .ab-ico { color: var(--color-primary); }
.ab-nav__titulo { font-size: .7rem; text-transform: uppercase; letter-spacing: .1em; color: #7a7a7a; padding: 1rem .85rem .25rem; }
.ab-sidebar__rodape { padding: .75rem; border-top: 1px solid #262626; }
.ab-sidebar__rodape button { width: 100%; background: transparent; color: var(--color-sidebar-text); border: 1px solid #333; border-radius: var(--radius-sm); padding: .55rem; display: flex; gap: .5rem; align-items: center; justify-content: center; cursor: pointer; font: inherit; }
.ab-sidebar__rodape button:hover { background: var(--color-black-soft); color: #fff; }

.ab-main { min-width: 0; display: flex; flex-direction: column; }
.ab-topbar { background: var(--color-white); border-bottom: 1px solid var(--color-border-soft); padding: .75rem 1.5rem; display: flex; align-items: center; gap: 1rem; justify-content: space-between; position: sticky; top: 0; z-index: 5; }
.ab-topbar__usuario { font-size: .9rem; color: var(--color-text-muted); }
.ab-topbar__menu { display: none; background: none; border: 0; padding: .25rem; cursor: pointer; color: var(--color-text); }
.ab-conteudo { padding: 1.5rem; max-width: 1280px; width: 100%; }
.ab-cabecalho { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 1rem; margin-bottom: 1.25rem; }
.ab-cabecalho p { margin: 0; }

/* ---------- Componentes ---------- */
.ab-card { background: var(--color-white); border: 1px solid var(--color-border-soft); border-radius: var(--radius-md); box-shadow: var(--shadow-sm); padding: 1.25rem; margin-bottom: 1.25rem; }
.ab-card > h2:first-child { display: flex; align-items: center; gap: .5rem; }
.ab-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 1rem; margin-bottom: 1.25rem; }
.ab-kpi { background: var(--color-white); border: 1px solid var(--color-border-soft); border-radius: var(--radius-md); box-shadow: var(--shadow-sm); padding: 1rem 1.25rem; border-top: 3px solid var(--color-primary); }
.ab-kpi__rotulo { color: var(--color-text-muted); font-size: .85rem; }
.ab-kpi__valor { font-family: var(--font-display); font-size: 2.6rem; line-height: 1; margin-top: .25rem; }
.ab-kpi__valor--dinheiro { font-size: 1.9rem; white-space: nowrap; }
.ab-kpi--alerta { border-top-color: var(--color-forte); }
.ab-gerar { margin-top: 1rem; }
.ab-recibo { max-width: 720px; }
.ab-recibo p { line-height: 1.6; }

.ab-btn { display: inline-flex; align-items: center; justify-content: center; gap: .45rem; min-height: 40px; padding: .5rem 1rem; border-radius: var(--radius-sm); border: 1px solid transparent; font: inherit; font-weight: 600; text-decoration: none; cursor: pointer; white-space: nowrap; }
.ab-btn--primario { background: var(--color-primary); color: #fff; }
.ab-btn--primario:hover { background: var(--color-primary-dark); }
.ab-btn--secundario { background: var(--color-forte); color: #fff; }
.ab-btn--secundario:hover { background: light-dark(#1E1E1E, #3A3A3A); }
.ab-btn--neutro { background: var(--color-white); color: var(--color-text); border-color: var(--color-border); }
.ab-btn--neutro:hover { background: var(--color-bg); }
.ab-btn--perigo { background: var(--color-danger); color: #fff; }
.ab-btn--perigo:hover { background: #B02A37; }
.ab-btn--pequeno { min-height: 32px; padding: .25rem .65rem; font-size: .85rem; }
.ab-btn--bloco { width: 100%; }
.ab-acoes { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }

.ab-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem 1.25rem; }
.ab-form--1 { grid-template-columns: 1fr; }
.ab-campo { display: flex; flex-direction: column; gap: .3rem; }
.ab-campo--largo { grid-column: 1 / -1; }
.ab-campo--fim { justify-content: flex-end; }
.ab-campo label, .ab-rotulo { font-weight: 600; font-size: .88rem; color: var(--color-text); }
.ab-campo small { color: var(--color-text-muted); font-size: .8rem; }
.ab-input, .ab-select, .ab-textarea { width: 100%; min-height: 42px; padding: .55rem .75rem; border: 1px solid var(--color-border); border-radius: var(--radius-sm); background: var(--color-white); font: inherit; color: var(--color-text); }
.ab-textarea { min-height: 84px; resize: vertical; }
.ab-input:focus, .ab-select:focus, .ab-textarea:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(193,18,31,.18); }
.ab-check { display: flex; gap: .5rem; align-items: center; font-size: .92rem; }
.ab-check input { width: 18px; height: 18px; accent-color: var(--color-primary); }
.ab-fieldset { border: 1px solid var(--color-border-soft); border-radius: var(--radius-md); padding: 1rem; margin: 0; }
.ab-fieldset legend { font-weight: 700; padding: 0 .4rem; }

.ab-alerta { border-radius: var(--radius-sm); padding: .75rem 1rem; margin-bottom: 1rem; display: flex; gap: .6rem; align-items: flex-start; border: 1px solid; }
.ab-alerta ul { margin: 0; padding-left: 1.1rem; }
.ab-alerta--erro { background: var(--erro-bg); border-color: var(--erro-bd); color: var(--erro-tx); }
.ab-alerta--ok { background: var(--ok-bg); border-color: var(--ok-bd); color: var(--ok-tx); }
.ab-alerta--aviso { background: var(--aviso-bg); border-color: var(--aviso-bd); color: var(--aviso-tx); }

.ab-tabela-wrap { overflow-x: auto; }
.ab-tabela { width: 100%; border-collapse: collapse; font-size: .92rem; }
.ab-tabela th { text-align: left; background: var(--color-black); color: #fff; font-weight: 600; padding: .6rem .75rem; white-space: nowrap; }
.ab-tabela th:first-child { border-top-left-radius: var(--radius-sm); }
.ab-tabela th:last-child { border-top-right-radius: var(--radius-sm); }
.ab-tabela td { padding: .6rem .75rem; border-bottom: 1px solid var(--color-border-soft); vertical-align: middle; }
.ab-tabela tbody tr:nth-child(even) { background: var(--color-zebra); }
.ab-tabela tbody tr:hover { background: var(--color-hover); }
.ab-vazio { text-align: center; padding: 2rem 1rem; color: var(--color-text-muted); }

.ab-badge { display: inline-block; padding: .15rem .55rem; border-radius: 999px; font-size: .78rem; font-weight: 600; border: 1px solid transparent; white-space: nowrap; }
.ab-badge--sucesso { background: var(--ok-bg); color: var(--ok-tx); border-color: var(--ok-bd); }
.ab-badge--perigo { background: var(--erro-bg); color: var(--erro-tx); border-color: var(--erro-bd); }
.ab-badge--aviso { background: var(--color-warning); color: #111; }
.ab-badge--info { background: var(--info-bg); color: var(--info-tx); border-color: var(--info-bd); }
.ab-badge--neutro { background: var(--neutro-bg); color: var(--neutro-tx); border-color: var(--neutro-bd); }

.ab-abas { display: flex; gap: .25rem; border-bottom: 2px solid var(--color-border-soft); margin-bottom: 1rem; overflow-x: auto; }
.ab-abas a { padding: .6rem 1rem; text-decoration: none; color: var(--color-text-muted); font-weight: 600; border-bottom: 3px solid transparent; margin-bottom: -2px; white-space: nowrap; }
.ab-abas a:hover { color: var(--color-text); }
.ab-abas a.ativa { color: var(--color-text); border-bottom-color: var(--color-primary); }
.ab-secao { scroll-margin-top: 80px; }
.ab-grid-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 1.25rem; }
.ab-dl { display: grid; grid-template-columns: max-content 1fr; gap: .4rem 1rem; margin: 0; }
.ab-dl dt { color: var(--color-text-muted); }
.ab-dl dd { margin: 0; font-weight: 500; }
.ab-detalhes summary { cursor: pointer; font-weight: 600; color: var(--color-primary-dark); padding: .25rem 0; }

/* Perfis de acesso: um bloco por módulo, recursos em linhas e ações como caixas. */
.ab-perm-form > .ab-card { margin-bottom: .75rem; }
.ab-perm-modulo { margin-bottom: .75rem; }
.ab-perm-modulo > summary { cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 1rem; font-weight: 700; }
.ab-perm-todos { margin: .75rem 0 .25rem; }
.ab-perm-tabela th[scope="row"] { background: none; color: var(--color-text); font-weight: 600; width: 35%; border-bottom: 1px solid var(--color-border-soft); border-radius: 0; white-space: normal; }
.ab-perm-acoes { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; }
.ab-perm-acoes .ab-check:has(input:disabled) { color: var(--color-text-muted); }

.ab-semana { display: grid; grid-template-columns: repeat(7, minmax(150px, 1fr)); gap: .75rem; overflow-x: auto; }
.ab-dia { background: var(--color-white); border: 1px solid var(--color-border-soft); border-radius: var(--radius-md); min-height: 140px; }
.ab-dia__titulo { padding: .5rem .75rem; font-weight: 700; border-bottom: 1px solid var(--color-border-soft); display: flex; justify-content: space-between; }
.ab-dia--hoje { border-color: var(--color-primary); }
.ab-dia--hoje .ab-dia__titulo { background: var(--color-primary); color: #fff; border-radius: var(--radius-md) var(--radius-md) 0 0; }
.ab-aula { display: block; margin: .5rem; padding: .5rem .6rem; border-radius: var(--radius-sm); background: var(--color-bg); border-left: 3px solid var(--color-forte); text-decoration: none; color: var(--color-text); font-size: .85rem; }
.ab-aula:hover { background: var(--color-hover); }
.ab-aula--cancelada { opacity: .55; text-decoration: line-through; border-left-color: var(--color-border); }
.ab-aula strong { display: block; }

.ab-chamada { list-style: none; margin: 0; padding: 0; }
.ab-chamada li { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .65rem .25rem; border-bottom: 1px solid var(--color-border-soft); flex-wrap: wrap; }
.ab-segmento { display: inline-flex; border: 1px solid var(--color-border); border-radius: var(--radius-sm); overflow: hidden; }
.ab-segmento label { padding: .45rem .9rem; cursor: pointer; font-weight: 600; font-size: .88rem; display: flex; align-items: center; gap: .35rem; min-height: 40px; }
.ab-segmento input { position: absolute; opacity: 0; }
.ab-segmento label + label { border-left: 1px solid var(--color-border); }
.ab-segmento input:focus-visible + span { outline: 3px solid var(--color-primary); outline-offset: 2px; }
.ab-segmento label:has(input[value="Presente"]:checked) { background: var(--color-success); color: #fff; }
.ab-segmento label:has(input[value="Ausente"]:checked) { background: #6c6c6c; color: #fff; }
.ab-senha { font-family: ui-monospace, Consolas, monospace; font-size: 1.5rem; letter-spacing: .1em; background: var(--color-bg); border: 2px dashed var(--color-primary); padding: .75rem 1rem; border-radius: var(--radius-sm); display: inline-block; user-select: all; }

/* ---------- Login / páginas públicas ---------- */
.ab-publico { min-height: 100vh; display: grid; place-items: center; padding: 1.5rem 1rem;
  background: var(--color-bg) repeating-linear-gradient(135deg, transparent 0 22px, rgba(17,17,17,.025) 22px 24px); }
.ab-login { width: 100%; max-width: 420px; background: var(--color-white); border-radius: var(--radius-lg); box-shadow: var(--shadow-md); padding: 2rem 1.75rem; border-top: 4px solid var(--color-primary); }
.ab-login__logo { display: block; width: 100%; max-width: 300px; height: auto; margin: 0 auto 1.25rem; }
.ab-login h1 { font-family: var(--font-display); font-weight: 400; font-size: 2rem; letter-spacing: .04em; text-align: center; margin-bottom: .25rem; }
.ab-login p.ab-muted { text-align: center; margin-top: 0; }
.ab-login .ab-form { margin-top: 1.25rem; }
.ab-login__logo--produto { max-width: 220px; margin: 1rem auto 1.25rem; padding-top: 1rem; border-top: 1px solid var(--color-border-soft); }

/* Espaço da marca da academia cliente (login e painel) */
.ab-academia-slot { display: flex; flex-direction: column; align-items: center; gap: .5rem; text-align: center; }
.ab-academia-slot__img { max-width: 220px; max-height: 110px; width: auto; height: auto; object-fit: contain; }
.ab-academia-slot__iniciais { width: 84px; height: 84px; border-radius: var(--radius-lg); background: var(--color-black); color: #fff;
  display: grid; place-items: center; font-family: var(--font-display); font-size: 2.4rem; letter-spacing: .04em; border-bottom: 4px solid var(--color-primary); }
.ab-academia-slot__nome { font-weight: 700; font-size: 1.05rem; }
.ab-ico--grande { width: 40px; height: 40px; }
.ab-painel-titulo { display: flex; align-items: center; gap: 1.25rem; }
.ab-painel-titulo .ab-academia-slot { flex-direction: row; text-align: left; padding-right: 1.25rem; border-right: 1px solid var(--color-border); }
.ab-painel-titulo .ab-academia-slot__img { max-height: 72px; max-width: 180px; }
.ab-painel-titulo .ab-academia-slot__iniciais { width: 64px; height: 64px; font-size: 1.9rem; }
.ab-logo-preview { display: grid; place-items: center; min-height: 160px; background: var(--color-bg); border: 1px dashed var(--color-border); border-radius: var(--radius-md); padding: 1rem; }
.ab-logo-preview img { max-width: 100%; max-height: 160px; }
@media (max-width: 600px) {
  .ab-painel-titulo { flex-direction: column; align-items: flex-start; }
  .ab-painel-titulo .ab-academia-slot { border-right: 0; padding-right: 0; }
}
/* Avatar do aluno */
.ab-avatar { display: inline-grid; place-items: center; border-radius: 50%; object-fit: cover; flex: none; background: var(--color-bg); border: 2px solid var(--color-border-soft); vertical-align: middle; }
.ab-avatar--p { width: 36px; height: 36px; font-size: .8rem; }
.ab-avatar--m { width: 48px; height: 48px; font-size: 1rem; }
.ab-avatar--g { width: 112px; height: 112px; font-size: 2.2rem; border-width: 3px; border-color: var(--color-primary); }
.ab-avatar--iniciais { background: var(--color-forte); color: #fff; font-weight: 700; border-color: var(--color-forte); }
.ab-camera { background: var(--color-black); border-radius: var(--radius-md); padding: .75rem; }
.ab-camera video { display: block; width: 100%; max-width: 420px; aspect-ratio: 1; object-fit: cover; margin: 0 auto .75rem; border-radius: var(--radius-sm); background: #000; }
.ab-camera .ab-acoes { justify-content: center; }
.ab-pessoa { display: inline-flex; align-items: center; gap: .65rem; }
.ab-ficha-topo { display: flex; align-items: center; gap: 1.25rem; flex-wrap: wrap; }
.ab-login__rodape { text-align: center; margin-top: 1rem; font-size: .85rem; color: var(--color-text-muted); }

/* ---------- PWA do aluno ---------- */
.ab-app { max-width: 560px; margin: 0 auto; min-height: 100vh; background: var(--color-white); display: flex; flex-direction: column; }
.ab-app__topo { background: var(--color-black); color: #fff; padding: .85rem 1rem; display: flex; align-items: center; justify-content: space-between; gap: .75rem; position: sticky; top: 0; z-index: 5; }
.ab-app__topo img { height: 30px; width: auto; }
.ab-app__topo button { background: none; border: 1px solid #444; color: #fff; border-radius: var(--radius-sm); cursor: pointer; font: inherit; display: flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; }
.ab-app__corpo { padding: 1rem; flex: 1; }
.ab-app__bloqueio { position: sticky; top: 0; z-index: 5; }
.ab-saudacao { font-family: var(--font-display); font-size: 2rem; font-weight: 400; letter-spacing: .03em; margin: .25rem 0 1rem; }
.ab-cartao-aula { background: var(--color-black); border: 1px solid var(--color-border-soft); color: #fff; border-radius: var(--radius-lg); padding: 1.25rem; margin-bottom: 1rem; position: relative; overflow: hidden; }
.ab-cartao-aula::after { content: ""; position: absolute; right: -40px; top: -40px; width: 140px; height: 140px; border-radius: 50%; border: 18px solid var(--color-primary); opacity: .9; }
.ab-cartao-aula__rotulo { font-size: .8rem; text-transform: uppercase; letter-spacing: .1em; color: #bbb; }
.ab-cartao-aula__turma { font-size: 1.3rem; font-weight: 700; margin: .25rem 0; position: relative; z-index: 1; }
.ab-cartao-aula__quando { display: flex; align-items: center; gap: .4rem; color: #ddd; position: relative; z-index: 1; }
.ab-dependentes { display: flex; gap: .5rem; overflow-x: auto; margin-bottom: 1rem; padding-bottom: .25rem; }
.ab-dependentes a { padding: .45rem .9rem; border-radius: 999px; border: 1px solid var(--color-border); text-decoration: none; color: var(--color-text); white-space: nowrap; font-weight: 600; font-size: .88rem; }
.ab-dependentes a[aria-current="true"] { background: var(--color-primary); color: #fff; border-color: var(--color-primary); }

/* ---------- Responsivo ---------- */
@media (max-width: 900px) {
  .ab-shell { grid-template-columns: 1fr; }
  .ab-sidebar { position: fixed; inset: 0 auto 0 0; width: min(280px, 85vw); transform: translateX(-100%); transition: transform .2s ease; z-index: 50; }
  .ab-sidebar.aberta { transform: none; box-shadow: var(--shadow-md); }
  .ab-sidebar ~ .ab-main::before { content: ""; position: fixed; inset: 0; z-index: 45; background: rgba(0,0,0,.55); opacity: 0; pointer-events: none; transition: opacity .2s ease; }
  .ab-sidebar.aberta ~ .ab-main::before { opacity: 1; pointer-events: auto; }
  .ab-topbar__menu { display: inline-flex; }
  .ab-conteudo { padding: 1rem; }
  .ab-semana { grid-template-columns: 1fr; }
  .ab-tabela--cards thead { display: none; }
  .ab-tabela--cards tr { display: block; border: 1px solid var(--color-border-soft); border-radius: var(--radius-sm); margin-bottom: .75rem; background: var(--color-white) !important; }
  .ab-tabela--cards td { display: flex; justify-content: space-between; gap: 1rem; border-bottom: 1px solid var(--color-border-soft); overflow-wrap: anywhere; }
  .ab-tabela--cards td::before { content: attr(data-rotulo); font-weight: 600; color: var(--color-text-muted); flex-shrink: 0; white-space: nowrap; }
  .ab-btn { min-height: 44px; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; } }
@media print { .ab-sidebar, .ab-topbar, .ab-acoes, form button { display: none !important; } .ab-shell { display: block; } }

/* PWA do aluno (padrão Força de Vendas): toque ≥ 44px, barra inferior fixa, cards e indicadores 2×2. */
.ab-app-body { background: var(--color-bg, #f5f5f5); }
.ab-app__topo { padding-top: calc(.85rem + env(safe-area-inset-top)); }
.ab-app__quem { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.2; }
.ab-app__quem strong { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ab-app__quem span { font-size: .78rem; color: #bbb; }
.ab-app__dependentes { padding: .75rem 1rem 0; margin: 0; }
.ab-app__corpo { padding-bottom: calc(5.5rem + env(safe-area-inset-bottom)); }
.ab-app__nav { position: fixed; left: 0; right: 0; bottom: 0; z-index: 6; max-width: 560px; margin: 0 auto; background: var(--color-white); border-top: 1px solid var(--color-border-soft); display: grid; grid-template-columns: repeat(5, 1fr); padding-bottom: env(safe-area-inset-bottom); }
.ab-app__nav a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .2rem; min-height: 60px; font-size: .74rem; text-decoration: none; color: var(--color-text-muted); }
.ab-app__nav a[aria-current="page"] { color: var(--color-primary); font-weight: 700; box-shadow: inset 0 3px 0 var(--color-primary); }
.ab-app-titulo { font-family: var(--font-display); font-size: 1.9rem; font-weight: 400; letter-spacing: .03em; margin: .25rem 0 .75rem; }
.ab-app-secao { margin-top: 1.25rem; }
.ab-app-secao h2 { font-size: 1rem; text-transform: uppercase; letter-spacing: .06em; color: var(--color-text-muted); margin: 0 0 .6rem; }
.ab-app-kpis { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; margin-bottom: 1rem; }
.ab-app-kpi { background: var(--color-white); border: 1px solid var(--color-border-soft); border-radius: var(--radius-md); padding: .85rem; display: flex; flex-direction: column; gap: .3rem; min-height: 92px; }
.ab-app-kpi > span { font-size: .8rem; color: var(--color-text-muted); }
.ab-app-kpi strong { font-family: var(--font-display); font-size: 2rem; font-weight: 400; line-height: 1; }
.ab-app-kpi em { font-style: normal; align-self: flex-start; }
.ab-app-kpi small { color: var(--color-text-muted); font-size: .78rem; }
.ab-app-kpi--moeda strong { font-size: 1.45rem; font-family: inherit; font-weight: 800; }
.ab-app-kpi--largo { grid-column: 1 / -1; }
.ab-app-kpi__data { color: var(--color-text); }
.ab-tiles { display: grid; gap: .6rem; }
.ab-tile { display: flex; align-items: center; gap: .85rem; background: var(--color-white); border: 1px solid var(--color-border-soft); border-radius: var(--radius-md); padding: .9rem 1rem; min-height: 64px; text-decoration: none; color: var(--color-text); }
.ab-tile > .ab-ico:first-child { color: var(--color-primary); width: 26px; height: 26px; flex: none; }
.ab-tile > span { flex: 1; display: flex; flex-direction: column; }
.ab-tile small { color: var(--color-text-muted); }
.ab-app-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.ab-app-lista li { display: flex; align-items: center; gap: .85rem; background: var(--color-white); border: 1px solid var(--color-border-soft); border-radius: var(--radius-md); padding: .75rem .9rem; min-height: 60px; }
.ab-app-lista__item--off { opacity: .6; }
.ab-app-lista__corpo { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.ab-app-lista__corpo small { color: var(--color-text-muted); }
.ab-app-data { flex: none; width: 46px; text-align: center; border-right: 1px solid var(--color-border-soft); padding-right: .6rem; display: flex; flex-direction: column; }
.ab-app-data strong { font-family: var(--font-display); font-size: 1.6rem; font-weight: 400; line-height: 1; }
.ab-app-data span { font-size: .72rem; text-transform: uppercase; color: var(--color-primary); font-weight: 700; }
.ab-app-valor { display: flex; flex-direction: column; align-items: flex-end; gap: .25rem; font-weight: 800; white-space: nowrap; }
.ab-app-vazio { background: var(--color-white); border: 1px dashed var(--color-border); border-radius: var(--radius-md); padding: 1rem; color: var(--color-text-muted); display: flex; gap: .5rem; align-items: center; }
.ab-app-dados { margin: 0; background: var(--color-white); border: 1px solid var(--color-border-soft); border-radius: var(--radius-md); }
.ab-app-dados > div { display: flex; justify-content: space-between; gap: 1rem; padding: .7rem .9rem; border-bottom: 1px solid var(--color-border-soft); }
.ab-app-dados > div:last-child { border-bottom: 0; }
.ab-app-dados dt { color: var(--color-text-muted); }
.ab-app-dados dd { margin: 0; font-weight: 600; text-align: right; overflow-wrap: anywhere; }
.ab-app-botoes { display: grid; gap: .6rem; }
.ab-app-botoes .ab-btn { min-height: 48px; width: 100%; }
.ab-app-dica { margin: 0; }

/* Tela de QR de check-in (tablet/PC da academia) e marcações da chamada */
.ab-qr { max-width: 640px; margin: 0 auto; text-align: center; padding: 1rem; }
.ab-qr__academia { text-transform: uppercase; letter-spacing: .1em; color: var(--color-text-muted); margin: 0; }
.ab-qr__turma { font-family: var(--font-display); font-weight: 400; font-size: 2.6rem; margin: .25rem 0; }
.ab-qr__quando { font-weight: 600; margin: 0 0 1rem; }
.ab-qr__codigo { background: #fff; border: 6px solid var(--color-black); border-radius: var(--radius-lg); padding: 1rem; display: inline-flex; min-width: 300px; min-height: 300px; align-items: center; justify-content: center; }
.ab-qr__codigo img { width: min(70vw, 360px); height: auto; image-rendering: pixelated; }
.ab-qr__instrucao { font-size: 1.15rem; font-weight: 600; margin-top: 1rem; }
.ab-tags { display: inline-flex; flex-wrap: wrap; gap: .25rem; margin-left: .35rem; vertical-align: middle; }
.ab-app-aulas li { flex-direction: column; align-items: stretch; }
.ab-app-aula__linha { display: flex; align-items: center; gap: .85rem; }
.ab-app-acoes { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.ab-app-acoes:empty { display: none; }
.ab-app-acoes .ab-btn { min-height: 44px; }
.ab-app-acoes .ab-app-dica { margin: 0; font-size: .85rem; color: var(--color-text-muted); display: flex; gap: .35rem; align-items: center; }
.ab-checkin { text-align: center; }
.ab-checkin .ab-btn { min-height: 52px; width: 100%; margin-top: .5rem; }

/* Graduação: faixa desenhada em SVG, critérios com barra de progresso, histórico corrigido riscado */
.ab-faixa { display: block; height: auto; }
.ab-faixa--g { width: min(100%, 360px); margin: .25rem 0 .75rem; }
.ab-faixa--p { display: inline-block; width: 90px; vertical-align: middle; margin-right: .4rem; }
.ab-faixa-item > summary { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.ab-criterios { list-style: none; padding: 0; margin: .5rem 0; display: grid; gap: .5rem; }
.ab-criterios li { display: grid; grid-template-columns: 1fr auto; gap: .2rem .6rem; align-items: center; }
.ab-criterios li > span:first-child { grid-column: 1 / -1; font-size: .9rem; }
.ab-criterios progress { width: 100%; height: 10px; accent-color: var(--color-primary); }
.ab-criterios__ok { color: var(--ok-tx); font-weight: 700; }
.ab-linha-corrigida td { text-decoration: line-through; color: var(--color-text-muted); }
.ab-linha-corrigida .ab-badge, .ab-linha-corrigida svg { text-decoration: none; }
.ab-niveis { list-style: none; padding: 0; margin: .5rem 0; display: grid; gap: .4rem; }
.ab-niveis li { display: flex; justify-content: space-between; gap: 1rem; align-items: center; border-bottom: 1px solid var(--color-border-soft); padding-bottom: .35rem; }
.ab-app-faixa { background: var(--color-white); border: 1px solid var(--color-border-soft); border-radius: var(--radius-md); padding: 1rem; margin-bottom: 1rem; }
.ab-app-faixa .ab-faixa { width: 100%; }
.ab-app-linha { list-style: none; margin: 0; padding: 0 0 0 1rem; border-left: 3px solid var(--color-primary); display: grid; gap: .75rem; }
.ab-app-linha li { display: flex; flex-direction: column; gap: .25rem; }
.ab-app-linha .ab-faixa { width: 120px; }

/* Configurações › WhatsApp */
.ab-whats__estado { display: flex; gap: .5rem; align-items: center; font-weight: 600; }
.ab-whats__qr { display: block; width: min(280px, 100%); height: auto; border: 1px solid var(--color-border-soft); border-radius: var(--radius-md); margin: .5rem 0 1rem; image-rendering: pixelated; }


/* ---------- Botão de tema (claro/escuro) ---------- */
.ab-tema { display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: var(--radius-sm); border: 1px solid var(--color-border); background: var(--color-white); color: var(--color-text); cursor: pointer; flex: none; }
.ab-tema:hover { background: var(--color-hover); }
.ab-tema .ab-ico { transition: transform .4s var(--ease-mola); }
.ab-tema:active .ab-ico { transform: rotate(-30deg) scale(.85); }
.ab-tema__sol { display: none; }
:root[data-tema="escuro"] .ab-tema__sol { display: block; }
:root[data-tema="escuro"] .ab-tema__lua { display: none; }
@media (prefers-color-scheme: dark) {
  :root:not([data-tema="claro"]) .ab-tema__sol { display: block; }
  :root:not([data-tema="claro"]) .ab-tema__lua { display: none; }
}
.ab-tema--escuro { background: transparent; border-color: #444; color: #fff; }
.ab-tema--escuro:hover { background: #1E1E1E; }
/* Troca suave de cores só durante a alternância (não a cada carregamento). */
.ab-trocando-tema, .ab-trocando-tema * { transition: background-color .3s ease, color .3s ease, border-color .3s ease !important; }
.ab-topbar__direita { display: flex; align-items: center; gap: .75rem; }

/* ---------- Avisos rápidos (toast) ---------- */
.ab-toasts { position: fixed; z-index: 1000; top: calc(1rem + env(safe-area-inset-top)); right: 1rem; width: min(380px, calc(100vw - 2rem)); display: grid; gap: .6rem; pointer-events: none; }
.ab-toast { --cor: var(--color-info); --tx: var(--info-tx); --fundo: var(--info-bg);
  pointer-events: auto; position: relative; display: flex; gap: .75rem; align-items: flex-start; padding: .85rem 2.6rem 1rem .9rem;
  background: var(--color-white); color: var(--color-text); border: 1px solid var(--color-border-soft); border-left: 4px solid var(--cor);
  border-radius: var(--radius-md); box-shadow: 0 12px 32px light-dark(rgba(0,0,0,.14), rgba(0,0,0,.55)); overflow: hidden;
  animation: ab-toast-entra .45s var(--ease-mola) both; }
.ab-toast--ok { --cor: var(--color-success); --tx: var(--ok-tx); --fundo: var(--ok-bg); }
.ab-toast--erro { --cor: var(--color-danger); --tx: var(--erro-tx); --fundo: var(--erro-bg); }
.ab-toast--aviso { --cor: #D39E00; --tx: var(--aviso-tx); --fundo: var(--aviso-bg); }
.ab-toast__icone { width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; flex: none; background: var(--fundo); color: var(--tx); }
.ab-toast__icone .ab-ico { width: 18px; height: 18px; }
.ab-toast__corpo { min-width: 0; font-size: .92rem; padding-top: .25rem; }
.ab-toast__corpo strong { display: block; }
.ab-toast__corpo ul { margin: .25rem 0 0; padding-left: 1.1rem; color: var(--color-text-muted); }
.ab-toast__fechar { position: absolute; top: .4rem; right: .4rem; width: 32px; height: 32px; display: grid; place-items: center; border: 0; border-radius: var(--radius-sm); background: none; color: var(--color-text-muted); cursor: pointer; }
.ab-toast__fechar:hover { background: var(--color-hover); color: var(--color-text); }
.ab-toast__fechar .ab-ico { width: 16px; height: 16px; }
.ab-toast__tempo { position: absolute; left: 0; bottom: 0; height: 3px; width: 100%; background: var(--cor); opacity: .55; transform-origin: left; animation: ab-toast-tempo var(--ab-tempo, 4.5s) linear forwards; }
.ab-toast:hover .ab-toast__tempo, .ab-toast:focus-within .ab-toast__tempo { animation-play-state: paused; }
.ab-toast--saindo { animation: ab-toast-sai .25s ease-in forwards; }
@keyframes ab-toast-entra { from { opacity: 0; transform: translateX(110%) scale(.96); } }
@keyframes ab-toast-sai { to { opacity: 0; transform: translateX(40%) scale(.96); } }
@keyframes ab-toast-tempo { to { transform: scaleX(0); } }
@keyframes ab-toast-desce { from { opacity: 0; transform: translateY(-120%) scale(.96); } }
@keyframes ab-toast-sobe { to { opacity: 0; transform: translateY(-60%) scale(.96); } }
@media (max-width: 600px) {
  .ab-toasts { right: auto; left: 50%; transform: translateX(-50%); }
  .ab-toast { animation-name: ab-toast-desce; }
  .ab-toast--saindo { animation-name: ab-toast-sobe; }
}

/* ---------- Confirmação (SweetAlert2 com a identidade do sistema) ---------- */
.swal2-container.swal2-backdrop-show { background: rgba(10, 10, 10, .6); }
.ab-swal.swal2-popup { background: var(--color-white); color: var(--color-text); border-radius: var(--radius-lg); font-family: var(--font-base); padding: 1.75rem 1.5rem 1.5rem; width: min(30rem, calc(100vw - 2rem)); border: 1px solid var(--color-border-soft); }
.ab-swal .swal2-title { color: var(--color-text); font-size: 1.3rem; padding: .25rem 0 0; }
.ab-swal .swal2-html-container { color: var(--color-text-muted); font-size: .97rem; margin: .5rem 0 0; }
.ab-swal .swal2-icon { margin: .25rem auto .75rem; }
.ab-swal__acoes.swal2-actions { gap: .6rem; margin-top: 1.5rem; width: 100%; flex-wrap: nowrap; }
.ab-swal__acoes .ab-btn { margin: 0; min-height: 46px; flex: 1; }
@media (max-width: 600px) {
  .swal2-container.swal2-center { padding: 0; }
  .swal2-container.swal2-center > .ab-swal.swal2-popup { grid-row: 3; grid-column: 1 / -1; align-self: end; }
  .ab-swal.swal2-popup { width: 100%; border-radius: var(--radius-lg) var(--radius-lg) 0 0; padding-bottom: calc(1.25rem + env(safe-area-inset-bottom)); }
  .ab-swal__acoes.swal2-actions { flex-direction: column-reverse; }
  .ab-swal__acoes .ab-btn { width: 100%; flex: none; }
}

/* ---------- Faixa preta com ponteira vermelha e graus (elemento de marca) ---------- */
.ab-faixa-marca { display: flex; height: 18px; border-radius: 3px; overflow: hidden; box-shadow: inset 0 -3px 0 rgba(0,0,0,.35); }
.ab-faixa-marca__corpo { flex: 1; background: #000; }
.ab-faixa-marca__ponta { width: 32%; background: var(--color-primary); display: flex; gap: 8%; padding: 0 6%; }
.ab-faixa-marca__grau { flex: 0 0 7%; background: #fff; transform: scaleY(0); transform-origin: bottom; animation: ab-grau .35s var(--ease-mola) forwards; }
.ab-faixa-marca__grau:nth-child(1) { animation-delay: .35s; }
.ab-faixa-marca__grau:nth-child(2) { animation-delay: .5s; }
.ab-faixa-marca__grau:nth-child(3) { animation-delay: .65s; }
.ab-faixa-marca__grau:nth-child(4) { animation-delay: .8s; }
@keyframes ab-grau { to { transform: scaleY(1); } }

/* ---------- Login: painel dividido ---------- */
.ab-pagina-entrar { min-height: 100vh; min-height: 100dvh; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); background: var(--color-white); }
.ab-entrar__marca { position: relative; overflow: hidden; background: radial-gradient(110% 80% at 100% 0%, #2B0A0E 0%, #111 55%); color: #fff;
  padding: clamp(1.5rem, 4vw, 3.5rem); display: flex; flex-direction: column; justify-content: space-between; gap: 2rem; }
.ab-entrar__produto { width: 190px; height: auto; display: block; }
.ab-entrar__academia { display: flex; flex-direction: column; gap: 1rem; }
.ab-entrar__academia img { max-width: 160px; max-height: 96px; width: auto; height: auto; object-fit: contain; align-self: flex-start; }
.ab-entrar__nome { font-family: var(--font-display); font-weight: 400; font-size: clamp(3.25rem, 7.5vw, 7rem); line-height: .9; letter-spacing: .01em; margin: 0; overflow-wrap: anywhere; }
.ab-entrar__frase { margin: 0; max-width: 34ch; color: #C9C9C9; font-size: 1.02rem; }
.ab-entrar__faixa { height: 22px; max-width: 420px; outline: 1px solid #2E2E2E; }
.ab-entrar__lado { display: grid; place-items: center; padding: 2rem 1.25rem; position: relative; }
.ab-entrar__lado > .ab-tema { position: absolute; top: 1rem; right: 1rem; }
.ab-entrar__form { width: 100%; max-width: 380px; }
.ab-entrar__form h1 { font-family: var(--font-display); font-weight: 400; font-size: 2.6rem; letter-spacing: .02em; line-height: 1; margin: 0 0 .25rem; }
.ab-entrar__form > p { margin: 0 0 1.5rem; color: var(--color-text-muted); }
.ab-entrar__form .ab-form { gap: 1rem; }
.ab-entrar__form .ab-input { min-height: 48px; font-size: 1rem; border-radius: 10px; border-width: 1.5px; }
.ab-entrar__form .ab-input:focus { border-color: var(--color-text); box-shadow: 0 0 0 3px light-dark(rgba(17,17,17,.1), rgba(255,255,255,.12)); }
.ab-academia-fixa { display: flex; align-items: center; gap: .75rem; padding: .6rem .75rem .6rem .6rem; border: 1.5px solid var(--color-border); border-radius: 12px; background: var(--color-bg); }
.ab-academia-fixa img, .ab-academia-fixa__iniciais { width: 40px; height: 40px; border-radius: 9px; object-fit: contain; flex: none; background: #111; }
.ab-academia-fixa__iniciais { display: grid; place-items: center; color: #fff; font-family: var(--font-display); font-size: 1.3rem; border-bottom: 3px solid var(--color-primary); }
.ab-academia-fixa__texto { min-width: 0; flex: 1; display: flex; flex-direction: column; line-height: 1.25; }
.ab-academia-fixa__texto strong { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ab-academia-fixa__texto small { color: var(--color-text-muted); }
.ab-academia-fixa a { font-weight: 600; font-size: .9rem; color: var(--color-link); padding: .6rem .25rem; }
.ab-senha-campo { position: relative; }
.ab-senha-campo .ab-input { padding-right: 3rem; }
.ab-senha-campo button { position: absolute; right: 2px; top: 50%; transform: translateY(-50%); width: 44px; height: 44px; display: grid; place-items: center; border: 0; background: none; color: var(--color-text-muted); cursor: pointer; border-radius: var(--radius-sm); }
.ab-senha-campo button:hover { color: var(--color-text); }
.ab-senha-campo button[aria-pressed="true"] .ab-senha__ver, .ab-senha-campo button[aria-pressed="false"] .ab-senha__esconder { display: none; }
.ab-campo--erro .ab-input { border-color: var(--color-danger); animation: ab-tremor .4s; }
@keyframes ab-tremor { 20%, 60% { transform: translateX(-6px); } 40%, 80% { transform: translateX(6px); } }
.ab-chaves { display: grid; gap: .35rem; }
.ab-chave { display: flex; align-items: center; gap: .75rem; min-height: 40px; cursor: pointer; font-size: .95rem; user-select: none; }
.ab-chave input { appearance: none; flex: none; width: 42px; height: 24px; margin: 0; border-radius: 24px; background: var(--color-border); position: relative; cursor: pointer; transition: background .2s; }
.ab-chave input::after { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.3); transition: transform .3s var(--ease-mola); }
.ab-chave input:checked { background: var(--color-primary); }
.ab-chave input:checked::after { transform: translateX(18px); }
.ab-chave input:focus-visible { outline: 3px solid var(--color-primary); outline-offset: 2px; }
.ab-btn-entrar { position: relative; overflow: hidden; min-height: 52px; font-size: 1.02rem; border-radius: 10px; transition: background .15s, transform .1s; }
.ab-btn-entrar:active { transform: scale(.98); }
.ab-btn-entrar .ab-faixa-marca { position: absolute; left: 0; right: 0; bottom: 0; height: 5px; border-radius: 0; opacity: 0; box-shadow: none; transition: opacity .2s; }
.ab-btn-entrar .ab-faixa-marca__corpo { background: var(--color-primary-dark); }
.ab-btn-entrar .ab-faixa-marca__ponta { background: #000; width: 30%; }
.ab-btn-entrar[aria-busy="true"] .ab-faixa-marca { opacity: 1; }
.ab-btn-entrar[aria-busy="true"] .ab-faixa-marca__ponta { animation: ab-faixa-corre .9s ease-in-out infinite alternate; }
@keyframes ab-faixa-corre { to { transform: translateX(233%); } }
.ab-entrar__rodape { margin: 1.25rem 0 0; font-size: .88rem; color: var(--color-text-muted); }
@media (max-width: 860px) {
  .ab-pagina-entrar { grid-template-columns: 1fr; grid-template-rows: auto 1fr; }
  .ab-entrar__marca { padding: calc(1.25rem + env(safe-area-inset-top)) 1.25rem 1.25rem; gap: 1rem; }
  .ab-entrar__produto { width: 150px; }
  .ab-entrar__academia { flex-direction: row; align-items: center; }
  .ab-entrar__academia img { max-height: 56px; max-width: 96px; }
  .ab-entrar__nome { font-size: clamp(2.4rem, 11vw, 3.6rem); }
  .ab-entrar__frase { display: none; }
  .ab-entrar__faixa { height: 12px; max-width: none; }
  .ab-entrar__lado { place-items: start center; padding: 1rem 1.25rem calc(2rem + env(safe-area-inset-bottom)); }
  .ab-pagina-entrar { position: relative; }
  .ab-entrar__lado { position: static; }
  .ab-entrar__lado > .ab-tema { top: calc(1rem + env(safe-area-inset-top)); right: 1rem; background: transparent; border-color: #444; color: #fff; }
}

/* ---------- Painel no celular (revisão responsiva) ---------- */
.ab-sidebar__senha { display: none; }
/* Faixa branca/cinza não some sobre card branco. */
.ab-faixa { filter: drop-shadow(0 0 1px light-dark(rgba(0,0,0,.45), rgba(255,255,255,.25))); }
@media (max-width: 600px) {
  .ab-topbar { padding: .5rem 1rem; gap: .5rem; }
  .ab-topbar__usuario { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .ab-topbar__senha { display: none; }
  .ab-sidebar__senha { display: flex; align-items: center; justify-content: center; gap: .5rem; min-height: 44px; margin-bottom: .5rem; color: var(--color-sidebar-text); text-decoration: none; border: 1px solid #333; border-radius: var(--radius-sm); }
  .ab-cabecalho { align-items: flex-start; gap: .75rem; }
  .ab-cabecalho h1 { font-size: 1.45rem; }
  /* Indicadores 2 por linha; o último sobra inteiro quando a contagem é ímpar. */
  .ab-kpis { grid-template-columns: 1fr 1fr; gap: .6rem; }
  .ab-kpis > :last-child:nth-child(odd) { grid-column: 1 / -1; }
  .ab-kpi { padding: .75rem .85rem; }
  .ab-kpi__rotulo { font-size: .78rem; line-height: 1.3; }
  .ab-kpi__valor { font-size: 2.1rem; }
  .ab-kpi__valor--dinheiro { font-size: 1.35rem; }
  /* Filtros compactos: busca e botão na largura toda, demais campos em 2 colunas. */
  .ab-filtros { grid-template-columns: 1fr 1fr; gap: .6rem .75rem; }
  .ab-filtros .ab-campo:has(> input[name="busca"]), .ab-filtros .ab-campo--fim { grid-column: 1 / -1; }
  .ab-filtros .ab-campo--fim .ab-btn { width: 100%; }
  .ab-filtros .ab-campo label { font-size: .8rem; }
  /* Campo de data tem largura mínima própria: sem isto estoura a coluna e a tela em 375 px. */
  .ab-filtros > .ab-campo { min-width: 0; }
  .ab-filtros .ab-input, .ab-filtros .ab-select { min-width: 0; width: 100%; }
}
@media (max-width: 420px) {
  .ab-app__topo { gap: .5rem; padding-left: .75rem; padding-right: .75rem; }
  .ab-app__topo > img { height: 22px; }
  .ab-app__quem span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
}

/* Configuração do check-in: opções grandes, fáceis de tocar */
.ab-opcoes-checkin { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: .6rem; }
.ab-opcao-checkin { display: flex; gap: .65rem; align-items: flex-start; padding: .8rem .9rem; border: 1.5px solid var(--color-border); border-radius: var(--radius-md); cursor: pointer; background: var(--color-white); }
.ab-opcao-checkin:has(input:checked) { border-color: var(--color-primary); box-shadow: 0 0 0 3px light-dark(rgba(193,18,31,.12), rgba(193,18,31,.3)); }
.ab-opcao-checkin input { margin-top: .2rem; accent-color: var(--color-primary); width: 18px; height: 18px; flex: none; }
.ab-opcao-checkin span { display: flex; flex-direction: column; gap: .15rem; }
.ab-opcao-checkin small { color: var(--color-text-muted); }

/* ---------- Gráficos (RF-12): HTML/CSS no servidor, sem style="" (CSP). Paleta validada (docs/DECISOES ADR-036). ---------- */
:root {
  --graf-1: light-dark(#2a78d6, #3987e5);   /* série 1 (azul) */
  --graf-2: light-dark(#eb6834, #d95926);   /* série 2 (laranja) */
  --graf-u: light-dark(#C1121F, #E5484D);   /* série única (vermelho da marca) */
  --graf-grade: light-dark(#ECECEC, #2A2A2A);
}
.ab-p0{--p:0%} .ab-p1{--p:1%} .ab-p2{--p:2%} .ab-p3{--p:3%} .ab-p4{--p:4%} .ab-p5{--p:5%} .ab-p6{--p:6%} .ab-p7{--p:7%} .ab-p8{--p:8%} .ab-p9{--p:9%} .ab-p10{--p:10%} .ab-p11{--p:11%} .ab-p12{--p:12%} .ab-p13{--p:13%} .ab-p14{--p:14%} .ab-p15{--p:15%} .ab-p16{--p:16%} .ab-p17{--p:17%} .ab-p18{--p:18%} .ab-p19{--p:19%} .ab-p20{--p:20%} .ab-p21{--p:21%} .ab-p22{--p:22%} .ab-p23{--p:23%} .ab-p24{--p:24%} .ab-p25{--p:25%} .ab-p26{--p:26%} .ab-p27{--p:27%} .ab-p28{--p:28%} .ab-p29{--p:29%} .ab-p30{--p:30%} .ab-p31{--p:31%} .ab-p32{--p:32%} .ab-p33{--p:33%} .ab-p34{--p:34%} .ab-p35{--p:35%} .ab-p36{--p:36%} .ab-p37{--p:37%} .ab-p38{--p:38%} .ab-p39{--p:39%} .ab-p40{--p:40%} .ab-p41{--p:41%} .ab-p42{--p:42%} .ab-p43{--p:43%} .ab-p44{--p:44%} .ab-p45{--p:45%} .ab-p46{--p:46%} .ab-p47{--p:47%} .ab-p48{--p:48%} .ab-p49{--p:49%} .ab-p50{--p:50%} .ab-p51{--p:51%} .ab-p52{--p:52%} .ab-p53{--p:53%} .ab-p54{--p:54%} .ab-p55{--p:55%} .ab-p56{--p:56%} .ab-p57{--p:57%} .ab-p58{--p:58%} .ab-p59{--p:59%} .ab-p60{--p:60%} .ab-p61{--p:61%} .ab-p62{--p:62%} .ab-p63{--p:63%} .ab-p64{--p:64%} .ab-p65{--p:65%} .ab-p66{--p:66%} .ab-p67{--p:67%} .ab-p68{--p:68%} .ab-p69{--p:69%} .ab-p70{--p:70%} .ab-p71{--p:71%} .ab-p72{--p:72%} .ab-p73{--p:73%} .ab-p74{--p:74%} .ab-p75{--p:75%} .ab-p76{--p:76%} .ab-p77{--p:77%} .ab-p78{--p:78%} .ab-p79{--p:79%} .ab-p80{--p:80%} .ab-p81{--p:81%} .ab-p82{--p:82%} .ab-p83{--p:83%} .ab-p84{--p:84%} .ab-p85{--p:85%} .ab-p86{--p:86%} .ab-p87{--p:87%} .ab-p88{--p:88%} .ab-p89{--p:89%} .ab-p90{--p:90%} .ab-p91{--p:91%} .ab-p92{--p:92%} .ab-p93{--p:93%} .ab-p94{--p:94%} .ab-p95{--p:95%} .ab-p96{--p:96%} .ab-p97{--p:97%} .ab-p98{--p:98%} .ab-p99{--p:99%} .ab-p100{--p:100%}
.ab-graf { margin: 0; }
.ab-graf__cab { margin-bottom: .75rem; }
.ab-graf__cab h3 { margin: 0 0 .15rem; font-size: 1.02rem; }
.ab-graf__cab p { margin: 0; font-size: .85rem; }
.ab-graf__legenda { list-style: none; display: flex; flex-wrap: wrap; gap: .35rem 1rem; margin: .5rem 0 0; padding: 0; font-size: .85rem; color: var(--color-text-muted); }
.ab-graf__legenda li { display: inline-flex; align-items: center; gap: .4rem; }
.ab-graf__chave { width: 12px; height: 12px; border-radius: 3px; display: inline-block; }
.ab-graf--s1 { background: var(--graf-1); }
.ab-graf--s2 { background: var(--graf-2); }
.ab-graf--u { background: var(--graf-u); }
.ab-graf__corpo { display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-rows: 200px auto; column-gap: .5rem; }
.ab-graf__y { display: flex; flex-direction: column; justify-content: space-between; align-items: flex-end; font-size: .75rem; color: var(--color-text-muted); font-variant-numeric: tabular-nums; margin: -.5em 0; }
/* Grade recessiva: linhas no topo, no meio e na base (mesmas posições dos rótulos do eixo). */
.ab-graf__plot { display: flex; align-items: flex-end; gap: 2px; border-bottom: 1px solid var(--color-border);
  background: linear-gradient(var(--graf-grade), var(--graf-grade)) 0 0 / 100% 1px no-repeat, linear-gradient(var(--graf-grade), var(--graf-grade)) 0 50% / 100% 1px no-repeat; }
.ab-graf__grupo { flex: 1; min-width: 0; height: 100%; display: flex; align-items: flex-end; justify-content: center; gap: 2px; }
.ab-graf__barra { flex: 1; max-width: 24px; height: var(--p); border-radius: 4px 4px 0 0; cursor: default; }
.ab-graf__barra:hover, .ab-graf__barra:focus-visible { filter: brightness(1.15); outline-offset: 1px; }
.ab-graf__x { grid-column: 2; display: flex; gap: 2px; font-size: .72rem; color: var(--color-text-muted); padding-top: .3rem; }
.ab-graf__x span { flex: 1; min-width: 0; text-align: center; white-space: nowrap; overflow: visible; }
.ab-graf__tabela { margin-top: .75rem; }
.ab-graf__tabela summary { cursor: pointer; font-weight: 600; font-size: .88rem; color: var(--color-link); min-height: 32px; display: inline-flex; align-items: center; }
.ab-graf__linhas { list-style: none; margin: 0; padding: 0; display: grid; gap: .55rem; }
.ab-graf__linhas li { display: grid; grid-template-columns: minmax(90px, 32%) 1fr auto; align-items: center; gap: .6rem; font-size: .9rem; }
.ab-graf__rotulo { overflow-wrap: anywhere; line-height: 1.25; }
.ab-graf__trilho { height: 14px; display: flex; }
.ab-graf__barra-h { width: var(--p); height: 100%; border-radius: 0 4px 4px 0; }
.ab-graf__valor { font-variant-numeric: tabular-nums; font-weight: 600; white-space: nowrap; }
.ab-dica { position: fixed; z-index: 1100; pointer-events: none; background: var(--color-text); color: var(--color-white); font-size: .82rem; font-weight: 600;
  padding: .35rem .6rem; border-radius: var(--radius-sm); box-shadow: var(--shadow-md); max-width: 260px; }
.ab-lista-simples { list-style: none; margin: 0; padding: 0; display: grid; gap: .1rem; }
.ab-lista-simples li { display: flex; align-items: center; gap: .65rem; min-height: 44px; border-bottom: 1px solid var(--color-border-soft); flex-wrap: wrap; }
.ab-lista-simples li small { margin-left: auto; }
.ab-lista-simples__dia { font-family: var(--font-display); font-size: 1.4rem; color: var(--color-primary); width: 2ch; }
.ab-filtros--relatorio { align-items: end; }
.ab-filtros--relatorio .ab-campo--fim { align-items: flex-start; }
/* Abas com margem negativa geravam rolagem vertical (setinhas) dentro da barra. */
.ab-abas { overflow-y: hidden; }
@media (max-width: 600px) {
  .ab-graf__corpo { grid-template-rows: 160px auto; }
  .ab-filtros--relatorio .ab-campo:has(> #meses) { grid-column: 1 / -1; }
  .ab-graf__linhas li { grid-template-columns: minmax(80px, 38%) 1fr auto; font-size: .85rem; }
}

/* Eventos: medalhas sempre com texto; cores por light-dark() para os dois temas. */
.ab-medalha { display: inline-flex; align-items: center; gap: .25rem; padding: .15rem .6rem; border-radius: 999px; font-size: .8rem; font-weight: 700; border: 1px solid; }
.ab-medalha--ouro { background: light-dark(#FFF3C4, #4A3B00); color: light-dark(#6B5200, #FFE27A); border-color: light-dark(#E0B72E, #8A6D00); }
.ab-medalha--prata { background: light-dark(#ECEFF2, #3A3F45); color: light-dark(#40464D, #DDE2E7); border-color: light-dark(#A9B2BB, #6B737C); }
.ab-medalha--bronze { background: light-dark(#F8E3D2, #4A2C17); color: light-dark(#7A4113, #F2BE95); border-color: light-dark(#CD8B55, #8A5A35); }

.ab-app-evento-form { display: flex; flex-direction: column; gap: .4rem; width: 100%; }
.ab-app-evento-form .ab-btn { min-height: 44px; }

/* Altura real da tela no celular (barra de endereço dinâmica). */
@supports (height: 100dvh) { .ab-sidebar { height: 100dvh; } }

/* Loja: foto ou ilustração sempre sobre fundo neutro claro (nos dois temas), nunca área vazia. */
.ab-loja-img { aspect-ratio: 1; background: #ECECEC; border-radius: var(--radius-md); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.ab-loja-img img { width: 100%; height: 100%; object-fit: cover; }
.ab-loja-ilu { width: 82%; height: 82%; }
.ab-loja-cores { display: grid; grid-template-columns: repeat(2, 1fr); gap: .35rem; padding: .5rem; }
.ab-loja-cores .ab-loja-ilu { width: 100%; height: auto; aspect-ratio: 1; }
.ab-loja-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 1rem; }
.ab-loja-grade figure { margin: 0; display: flex; flex-direction: column; gap: .4rem; }
.ab-loja-grade figcaption { font-weight: 600; }
.ab-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.ab-loja-previa { display: grid; grid-template-columns: minmax(120px, 220px) 1fr; gap: 1.25rem; align-items: start; }
.ab-grade-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1rem; }
.ab-cor-seletor { width: 56px; height: 42px; padding: 2px; border: 1px solid var(--color-border); border-radius: var(--radius-sm); background: var(--color-white); }
@media (max-width: 560px) { .ab-loja-previa { grid-template-columns: 1fr; } }

/* Loja: linhas de item e de pagamento da venda no balcão. */
.ab-venda-linha, .ab-venda-pag { display: grid; gap: .5rem .75rem; align-items: end; padding: .5rem 0; border-bottom: 1px solid var(--color-border-soft); }
.ab-venda-linha { grid-template-columns: minmax(180px, 1fr) 120px; }
.ab-venda-pag { grid-template-columns: minmax(160px, 1fr) 140px 100px; }
.ab-venda-linha__aviso { grid-column: 1 / -1; margin: 0; }
.ab-venda-totais { margin-top: .75rem; }
@media (max-width: 560px) { .ab-venda-linha, .ab-venda-pag { grid-template-columns: 1fr; } }

/* ---------- Central de mensagens (app e sistema): conversas estilo mensageiro ---------- */
.ab-msg-sino { position: relative; display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: var(--radius-sm); border: 1px solid var(--color-border); background: var(--color-white); color: var(--color-text); flex: none; }
.ab-msg-sino:hover, .ab-msg-sino[aria-current="page"] { background: var(--color-hover); }
.ab-msg-sino--escuro { background: transparent; border-color: #444; color: #fff; }
.ab-msg-sino--escuro:hover, .ab-msg-sino--escuro[aria-current="page"] { background: #1E1E1E; }
.ab-msg-sino__n { position: absolute; top: -7px; right: -7px; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 10px; background: var(--color-primary); color: #fff; font-size: .7rem; font-weight: 800; line-height: 20px; text-align: center; box-shadow: 0 0 0 2px var(--color-white); }
.ab-msg-sino--escuro .ab-msg-sino__n { box-shadow: 0 0 0 2px var(--color-black); }
@media (max-width: 400px) { .ab-app__topo img { height: 22px; } .ab-app__topo { gap: .5rem; } }

.ab-msg-cabecalho { display: flex; align-items: center; gap: .6rem; }
.ab-msg-cabecalho .ab-app-titulo { margin-bottom: .5rem; }
.ab-msg-titulo { font-size: 2.3rem; margin: 0; }
.ab-msg-pilula { background: var(--color-primary); color: #fff; font-family: var(--font-base); font-size: .74rem; font-weight: 700; letter-spacing: 0; border-radius: 999px; padding: .15rem .65rem; white-space: nowrap; }
.ab-msg-todas { display: flex; justify-content: center; margin-top: .9rem; }
.ab-msg-caixa { background: var(--color-white); border: 1px solid var(--color-border-soft); border-radius: var(--radius-md); box-shadow: var(--shadow-sm); overflow: hidden; }
.ab-msg-lista { list-style: none; margin: 0; padding: 0; }
.ab-msg-lista li + li { border-top: 1px solid var(--color-border-soft); }
.ab-msg-conv { display: flex; align-items: center; gap: .8rem; padding: .8rem 1rem; min-height: 72px; text-decoration: none; color: var(--color-text); }
.ab-msg-conv:hover { background: var(--color-hover); }
.ab-msg-conv[aria-current="page"] { background: var(--color-hover); box-shadow: inset 3px 0 0 var(--color-primary); }
.ab-msg-conv__corpo { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .15rem; }
.ab-msg-conv__topo { display: flex; justify-content: space-between; align-items: baseline; gap: .5rem; }
.ab-msg-conv__topo strong { font-size: .95rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ab-msg-conv__topo small { color: var(--color-text-muted); font-size: .74rem; flex: none; }
.ab-msg-conv__ultima { font-size: .86rem; color: var(--color-text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ab-msg-conv--nova .ab-msg-conv__topo small { color: var(--color-primary); font-weight: 700; }
.ab-msg-conv--nova .ab-msg-conv__ultima { color: var(--color-text); font-weight: 600; }
.ab-msg-badge { background: var(--color-primary); color: #fff; font-size: .72rem; font-weight: 800; min-width: 22px; height: 22px; line-height: 22px; border-radius: 11px; padding: 0 6px; text-align: center; flex: none; }
.ab-msg-av { width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center; flex: none; color: #fff; font-weight: 800; font-size: .95rem; letter-spacing: .02em; background: var(--color-forte); }
.ab-msg-av .ab-ico { width: 22px; height: 22px; }
.ab-msg-av--loja { background: var(--color-primary); }
.ab-msg-av--financeiro { background: #A87A0A; }
.ab-msg-av--aulas { background: #0D5BD7; }
.ab-msg-av--equipe { background: #157347; }

.ab-msg-conversa { --msg-balao: light-dark(#FFFFFF, #262626); display: flex; flex-direction: column; min-height: 62vh; border: 1px solid var(--color-border-soft); border-radius: var(--radius-md); overflow: hidden; box-shadow: var(--shadow-sm); }
.ab-msg-conversa__topo { display: flex; align-items: center; gap: .7rem; padding: .65rem 1rem; background: light-dark(#111111, #1E1E1E); border-bottom: 1px solid light-dark(#111111, #2E2E2E); color: #fff; }
.ab-msg-conversa__topo h1 { font-size: 1rem; font-weight: 700; margin: 0; line-height: 1.25; }
.ab-msg-conversa__topo small { display: block; font-size: .74rem; color: #BDBDBD; }
.ab-msg-conversa__topo .ab-msg-av { width: 40px; height: 40px; font-size: .82rem; box-shadow: 0 0 0 2px #2A2A2A; }
.ab-msg-conversa__voltar { display: grid; place-items: center; width: 44px; height: 44px; margin-left: -.6rem; border-radius: 50%; color: #fff; flex: none; }
.ab-msg-conversa__voltar:hover { background: #1E1E1E; }
.ab-msg-fio { flex: 1; display: flex; flex-direction: column; gap: .65rem; padding: 1rem .9rem .9rem; background: light-dark(#F2EEE9, #121110); }
.ab-msg-dia { align-self: center; margin: .3rem 0 0; }
.ab-msg-dia span { display: inline-block; font-size: .68rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--color-text-muted); background: var(--msg-balao); border-radius: 8px; padding: .2rem .7rem; box-shadow: 0 1px 2px light-dark(rgba(0,0,0,.08), rgba(0,0,0,.5)); }
.ab-msg-balao { position: relative; align-self: flex-start; max-width: min(88%, 520px); margin-left: 8px; padding: .6rem .8rem .4rem; background: var(--msg-balao); border-radius: 4px 16px 16px 16px; box-shadow: 0 1px 2px light-dark(rgba(0,0,0,.1), rgba(0,0,0,.55)); font-size: .93rem; line-height: 1.45; }
.ab-msg-balao::before { content: ""; position: absolute; left: -8px; top: 0; width: 10px; height: 12px; background: var(--msg-balao); clip-path: polygon(0 0, 100% 0, 100% 100%); }
.ab-msg-balao__texto { margin: 0; overflow-wrap: anywhere; }
.ab-msg-tag { display: inline-block; margin-bottom: .35rem; padding: .12rem .5rem; border-radius: 6px; font-size: .66rem; font-weight: 800; letter-spacing: .05em; background: var(--neutro-bg); color: var(--neutro-tx); }
.ab-msg-tag--loja { background: var(--erro-bg); color: var(--erro-tx); }
.ab-msg-tag--financeiro { background: var(--aviso-bg); color: var(--aviso-tx); }
.ab-msg-tag--aulas { background: var(--info-bg); color: var(--info-tx); }
.ab-msg-tag--equipe { background: var(--ok-bg); color: var(--ok-tx); }
.ab-msg-ouvir { display: flex; align-items: center; gap: .55rem; width: 100%; max-width: 270px; min-height: 44px; margin-top: .55rem; padding: .3rem .8rem .3rem .3rem; border: 0; border-radius: 999px; background: light-dark(#F4F4F4, #333333); color: var(--color-text-muted); font: inherit; cursor: pointer; text-align: left; }
.ab-msg-ouvir:hover { background: light-dark(#ECECEC, #3A3A3A); }
.ab-msg-ouvir__play { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--color-primary); color: #fff; flex: none; }
.ab-msg-ouvir__play .ab-ico { width: 14px; height: 14px; fill: currentColor; }
.ab-msg-ouvir__parar, .ab-msg-ouvir--tocando .ab-msg-ouvir__tocar { display: none; }
.ab-msg-ouvir--tocando .ab-msg-ouvir__parar { display: block; }
.ab-msg-ouvir small { flex: none; font-size: .74rem; }
.ab-msg-onda { flex: 1; display: flex; align-items: center; gap: 3px; height: 20px; overflow: hidden; }
.ab-msg-onda i { display: block; flex: none; width: 3px; height: 6px; border-radius: 2px; background: light-dark(#C4C4C4, #5A5A5A); transform-origin: center; }
.ab-msg-onda i:nth-child(7n+2) { height: 12px; }
.ab-msg-onda i:nth-child(7n+3) { height: 9px; }
.ab-msg-onda i:nth-child(7n+4) { height: 16px; }
.ab-msg-onda i:nth-child(7n+5) { height: 8px; }
.ab-msg-onda i:nth-child(7n+6) { height: 14px; }
.ab-msg-onda i:nth-child(7n) { height: 10px; }
.ab-msg-ouvir--tocando .ab-msg-onda i { background: var(--color-primary); animation: ab-msg-onda .9s ease-in-out infinite; }
.ab-msg-ouvir--tocando .ab-msg-onda i:nth-child(3n+2) { animation-delay: .15s; }
.ab-msg-ouvir--tocando .ab-msg-onda i:nth-child(3n) { animation-delay: .3s; }
@keyframes ab-msg-onda { 50% { transform: scaleY(.35); } }
.ab-msg-acao { display: block; margin-top: .55rem; padding: .55rem 0 .15rem; border-top: 1px solid var(--color-border-soft); text-align: center; font-weight: 700; font-size: .88rem; color: var(--color-link); text-decoration: none; }
.ab-msg-acao:hover { text-decoration: underline; }
.ab-msg-balao__rodape { display: flex; align-items: center; justify-content: flex-end; gap: .25rem; margin-top: .3rem; font-size: .7rem; color: var(--color-text-muted); }
.ab-msg-balao--nova .ab-msg-balao__rodape::before { content: ""; width: 7px; height: 7px; margin-right: auto; border-radius: 50%; background: var(--color-primary); }
.ab-msg-visto { width: 15px; height: 15px; }
.ab-msg-visto--lida { color: light-dark(#1A73E8, #6FB1FF); }
.ab-msg-anteriores { align-self: center; padding: .4rem 1rem; border-radius: 999px; background: var(--msg-balao); font-size: .82rem; font-weight: 600; text-decoration: none; box-shadow: 0 1px 2px light-dark(rgba(0,0,0,.08), rgba(0,0,0,.5)); }
.ab-msg-vazio { margin: auto 0; align-self: center; text-align: center; font-size: .9rem; color: var(--color-text-muted); }
.ab-msg-rodape { margin: 0; padding: .65rem 1rem .8rem; background: var(--color-white); border-top: 1px solid var(--color-border-soft); text-align: center; font-size: .76rem; color: var(--color-text-muted); }
/* App: a conversa ocupa a largura toda, sob o topo preto. */
.ab-app__corpo > .ab-msg-conversa { margin: -1rem -1rem 0; min-height: calc(100dvh - 10rem); border: 0; border-radius: 0; box-shadow: none; }
/* Sistema: lista e conversa lado a lado a partir de 1024 px; empilhado abaixo disso. */
.ab-msg-painel { display: grid; gap: 1rem; align-items: start; }
.ab-msg-painel__vazio { display: none; }
@media (min-width: 1024px) {
  .ab-msg-painel { grid-template-columns: minmax(300px, 360px) minmax(0, 1fr); }
  .ab-msg-painel .ab-msg-conversa { min-height: 70vh; }
  .ab-msg-painel .ab-msg-conversa__voltar { display: none; }
  .ab-msg-painel__vazio { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .6rem; min-height: 60vh; border: 1px dashed var(--color-border); border-radius: var(--radius-md); background: light-dark(#F2EEE9, #121110); color: var(--color-text-muted); }
  .ab-msg-painel__vazio .ab-ico { width: 40px; height: 40px; color: var(--color-primary); }
}
@media (max-width: 1023.98px) { .ab-msg-painel--aberta > .ab-msg-caixa { display: none; } }
/* Notificações push no celular (cartão e bloco do Perfil) */
.ab-push { display: grid; gap: .6rem; }
.ab-push__titulo { margin: 0; font-weight: 700; }
.ab-push__estado { margin: 0; font-weight: 600; }
.ab-push__ajuda, .ab-push__msg { margin: 0; font-size: .85rem; color: var(--color-text-muted); }
.ab-push__botoes { display: flex; flex-wrap: wrap; gap: .5rem; }

/* ---------- Loja no app do aluno: vitrine em grade, produto, reserva feita e minhas compras ---------- */
.ab-tile--destaque { border-color: var(--color-primary); box-shadow: inset 4px 0 0 var(--color-primary), var(--shadow-sm); }
.ab-loja-topo { display: flex; align-items: center; gap: .6rem; margin: .1rem 0 .75rem; }
.ab-loja-topo .ab-app-titulo { flex: 1; min-width: 0; margin: 0; font-size: 2.1rem; line-height: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ab-loja-sacola { position: relative; flex: none; width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: var(--color-white); border: 1px solid var(--color-border-soft); color: var(--color-text); }
.ab-loja-sacola__ponto { position: absolute; top: 1px; right: 1px; width: 12px; height: 12px; border-radius: 50%; background: var(--color-primary); box-shadow: 0 0 0 2px var(--color-bg); }
.ab-loja-busca { display: flex; align-items: center; gap: .55rem; height: 46px; padding: 0 .9rem; margin: 0 0 .75rem; background: var(--color-white); border: 1px solid var(--color-border-soft); border-radius: var(--radius-md); color: var(--color-text-muted); }
.ab-loja-busca:focus-within { border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(193,18,31,.18); }
.ab-loja-busca input { flex: 1; min-width: 0; height: 100%; border: 0; background: transparent; font: inherit; font-size: .95rem; color: var(--color-text); }
.ab-loja-busca input:focus { outline: none; }
.ab-loja-chips { display: flex; gap: .45rem; overflow-x: auto; margin: 0 -1rem .9rem; padding: 0 1rem .15rem; scrollbar-width: none; }
.ab-loja-chips::-webkit-scrollbar { display: none; }
.ab-loja-chips a { flex: none; display: inline-flex; align-items: center; min-height: 36px; padding: 0 .95rem; border-radius: 999px; background: var(--color-white); border: 1px solid var(--color-border-soft); color: var(--color-text); font-size: .85rem; font-weight: 600; text-decoration: none; }
.ab-loja-chips a[aria-current="true"] { background: var(--color-text); border-color: var(--color-text); color: var(--color-white); }

.ab-loja-reserva { display: flex; align-items: center; gap: .75rem; margin: 0 0 1rem; padding: .85rem 1rem; border-radius: var(--radius-lg); background: linear-gradient(120deg, var(--color-primary), var(--color-primary-dark)); color: #fff; text-decoration: none; box-shadow: var(--shadow-sm); }
.ab-loja-reserva__ico { flex: none; width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: rgba(255,255,255,.16); }
.ab-loja-reserva__txt { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.3; }
.ab-loja-reserva__txt strong { font-size: .95rem; }
.ab-loja-reserva__txt small { font-size: .8rem; opacity: .92; }
.ab-loja-reserva__bt { flex: none; padding: .4rem .8rem; border-radius: 9px; background: #fff; color: var(--color-primary-dark); font-size: .8rem; font-weight: 700; }

.ab-loja-destaque { position: relative; display: flex; min-height: 150px; margin: 0 0 1.25rem; border-radius: var(--radius-lg); background: #111; color: #fff; text-decoration: none; overflow: hidden; border: 1px solid var(--color-border-soft); }
.ab-loja-destaque::after { content: ""; position: absolute; right: -36px; top: -46px; width: 150px; height: 150px; border-radius: 50%; border: 20px solid var(--color-primary); opacity: .9; }
.ab-loja-destaque__txt { position: relative; z-index: 1; flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: .35rem; padding: 1rem 0 1rem 1.1rem; }
.ab-loja-destaque__txt small { font-size: .68rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #FF8A92; }
.ab-loja-destaque__txt strong { font-family: var(--font-display); font-size: 1.95rem; font-weight: 400; line-height: .95; letter-spacing: .02em; overflow-wrap: anywhere; }
.ab-loja-destaque__bt { margin-top: auto; padding: .4rem .8rem; border-radius: 9px; background: var(--color-primary); font-size: .8rem; font-weight: 700; }
.ab-loja-destaque__img { position: relative; z-index: 1; flex: none; width: 46%; display: flex; align-items: center; }
.ab-loja-destaque .ab-loja-img { width: 100%; background: transparent; transform: rotate(-8deg) translate(4%, 12%); }
.ab-loja-destaque .ab-loja-img:has(img) { transform: none; padding: .6rem; }
.ab-loja-destaque .ab-loja-img img { border-radius: var(--radius-md); }

.ab-loja-sec { display: flex; align-items: baseline; justify-content: space-between; gap: .5rem; margin: 0 0 .6rem; }
.ab-loja-sec h2 { margin: 0; font-size: 1.05rem; }
.ab-loja-sec span { flex: none; font-size: .8rem; color: var(--color-text-muted); }
.ab-loja-vitrine { list-style: none; margin: 0 0 1.25rem; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; }
.ab-loja-card { display: flex; flex-direction: column; height: 100%; background: var(--color-white); border: 1px solid var(--color-border-soft); border-radius: 14px; overflow: hidden; color: var(--color-text); text-decoration: none; transition: transform .15s, box-shadow .15s; }
.ab-loja-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
.ab-loja-card__foto { position: relative; display: block; }
.ab-loja-card .ab-loja-img { aspect-ratio: 1 / 1.05; border-radius: 0; }
.ab-loja-selo { position: absolute; left: .45rem; top: .45rem; max-width: calc(100% - .9rem); padding: .2rem .5rem; border-radius: 6px; font-size: .68rem; font-weight: 700; line-height: 1.3; }
.ab-loja-selo--ok { background: var(--ok-bg); color: var(--ok-tx); }
.ab-loja-selo--aviso { background: var(--aviso-bg); color: var(--aviso-tx); }
.ab-loja-selo--enc { background: var(--info-bg); color: var(--info-tx); }
.ab-loja-card__info { flex: 1; display: flex; flex-direction: column; gap: .1rem; padding: .55rem .7rem .75rem; }
.ab-loja-card__nome { font-size: .85rem; font-weight: 500; line-height: 1.3; min-height: 2.6em; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ab-loja-card__preco { margin-top: .25rem; font-size: 1rem; font-weight: 800; }
.ab-loja-card__preco small { font-size: .7rem; font-weight: 500; color: var(--color-text-muted); }
.ab-loja-card__credito { font-size: .7rem; color: var(--color-text-muted); }
.ab-loja-bolinhas { display: flex; align-items: center; gap: .25rem; margin-top: .4rem; font-size: .7rem; color: var(--color-text-muted); }
.ab-loja-bolinha { display: block; width: 14px; height: 14px; flex: none; }
.ab-loja-bolinha circle { stroke: light-dark(rgba(0,0,0,.25), rgba(255,255,255,.4)); stroke-width: 1.5; }

/* Página do produto: galeria de ponta a ponta, opções e botão fixo acima da barra. */
.ab-loja-produto { margin: -1rem -1rem 0; }
.ab-app__corpo:has(.ab-loja-produto) { padding-bottom: calc(10.5rem + env(safe-area-inset-bottom)); }
.ab-loja-galeria { position: relative; background: #ECECEC; }
.ab-loja-galeria .ab-loja-img { aspect-ratio: 1 / .85; max-height: 380px; border-radius: 0; }
.ab-loja-galeria .ab-loja-ilu { width: 66%; height: 66%; }
.ab-loja-voltar { position: absolute; z-index: 1; top: .75rem; left: .75rem; width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; background: #fff; color: #111; box-shadow: var(--shadow-sm); }
.ab-loja-ficha { padding: 1rem; }
.ab-loja-ficha__cat { margin: 0; font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--color-link); }
.ab-loja-ficha__nome { margin: .2rem 0 .35rem; font-size: 1.3rem; }
.ab-loja-ficha__preco { margin: 0; font-size: 1.6rem; font-weight: 800; line-height: 1.1; }
.ab-loja-ficha__formas { margin: .3rem 0 0; font-size: .82rem; color: var(--color-text-muted); }
.ab-loja-ficha__desc { margin: .75rem 0 0; font-size: .9rem; }
.ab-loja-opcao { min-width: 0; margin: 1.1rem 0 0; padding: 0; border: 0; }
.ab-loja-opcao legend { padding: 0; margin-bottom: .6rem; font-size: .9rem; font-weight: 700; }
.ab-loja-swatches { display: flex; flex-wrap: wrap; gap: .75rem; }
.ab-loja-swatch, .ab-loja-tam { position: relative; cursor: pointer; }
.ab-loja-swatch input, .ab-loja-tam input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.ab-loja-swatch { border-radius: 50%; }
.ab-loja-swatch .ab-loja-bolinha { width: 36px; height: 36px; }
.ab-loja-swatch:has(input:checked) { outline: 2px solid var(--color-text); outline-offset: 3px; }
.ab-loja-swatch:has(input:focus-visible) { outline: 3px solid var(--color-primary); outline-offset: 3px; }
.ab-loja-swatch--texto { border-radius: 999px; }
.ab-loja-swatch--texto span { display: inline-flex; align-items: center; min-height: 36px; padding: 0 .85rem; border: 1.5px solid var(--color-border); border-radius: 999px; font-size: .85rem; font-weight: 600; }
.ab-loja-tams { display: flex; flex-wrap: wrap; gap: .5rem; padding-bottom: 1rem; }
.ab-loja-tam > span { display: grid; place-items: center; min-width: 52px; height: 46px; padding: 0 .75rem; border: 1.5px solid var(--color-border); border-radius: 10px; background: var(--color-white); font-size: .92rem; font-weight: 700; }
.ab-loja-tam--enc > span { border-style: dashed; color: var(--color-text-muted); }
.ab-loja-tam small { position: absolute; left: 0; right: 0; bottom: -1.05rem; text-align: center; font-size: .62rem; font-weight: 600; color: var(--info-tx); }
.ab-loja-tam input:checked + span { background: var(--color-text); border-color: var(--color-text); color: var(--color-white); }
.ab-loja-tam input:focus-visible + span { outline: 3px solid var(--color-primary); outline-offset: 2px; }
.ab-loja-guia { font-size: .85rem; }
.ab-loja-guia summary { width: fit-content; cursor: pointer; color: var(--color-link); font-weight: 600; text-decoration: underline; }
.ab-loja-guia p { margin: .5rem 0 0; padding: .75rem; border-radius: var(--radius-sm); background: var(--color-bg); white-space: pre-line; }
.ab-loja-estoque { display: flex; align-items: center; gap: .45rem; margin: 1rem 0 0; font-size: .88rem; font-weight: 600; color: var(--ok-tx); }
.ab-loja-estoque::before { content: ""; flex: none; width: 9px; height: 9px; border-radius: 50%; background: var(--color-success); }
.ab-loja-estoque--aviso { color: var(--aviso-tx); }
.ab-loja-estoque--aviso::before { background: var(--color-warning); }
.ab-loja-estoque--enc { color: var(--info-tx); }
.ab-loja-estoque--enc::before { background: var(--color-info); }
.ab-loja-pedido { display: grid; gap: .45rem; margin-top: 1rem; }
.ab-loja-pedido label { margin-top: .3rem; font-size: .85rem; font-weight: 700; }
.ab-loja-aviso { margin: 0; padding: .75rem .9rem; border: 1px solid var(--info-bd); border-radius: var(--radius-md); background: var(--info-bg); color: var(--info-tx); font-size: .86rem; line-height: 1.45; }
.ab-loja-outro { margin: .2rem 0 0; font-size: .85rem; color: var(--color-text-muted); }
.ab-loja-outro a { font-weight: 700; }
.ab-loja-cta { position: fixed; left: 0; right: 0; bottom: calc(60px + env(safe-area-inset-bottom)); z-index: 6; max-width: 560px; margin: 0 auto; padding: .65rem 1rem; background: var(--color-white); border-top: 1px solid var(--color-border-soft); box-shadow: 0 -6px 18px light-dark(rgba(0,0,0,.06), rgba(0,0,0,.4)); }
.ab-loja-cta .ab-btn { width: 100%; min-height: 50px; border-radius: var(--radius-md); font-size: 1rem; }

/* Minhas compras e a folha "Reserva feita". */
.ab-loja-voltar-link { display: inline-flex; align-items: center; gap: .2rem; min-height: 36px; font-weight: 600; text-decoration: none; }
.ab-loja-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: .55rem; }
.ab-loja-linha { display: flex; align-items: flex-start; gap: .75rem; padding: .65rem; background: var(--color-white); border: 1px solid var(--color-border-soft); border-radius: var(--radius-md); }
.ab-loja-linha--nova { border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(193,18,31,.12); }
.ab-loja-linha--off { opacity: .7; }
.ab-loja-mini { flex: none; width: 58px; }
.ab-loja-mini .ab-loja-img { border-radius: 10px; }
.ab-loja-mini--p { width: 44px; }
.ab-loja-mini--vazio { height: 58px; display: grid; place-items: center; border-radius: 10px; background: var(--color-bg); color: var(--color-text-muted); }
.ab-loja-linha__corpo { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: .2rem; }
.ab-loja-linha__corpo strong { font-size: .92rem; line-height: 1.3; }
.ab-loja-linha__corpo small { font-size: .8rem; color: var(--color-text-muted); }
.ab-loja-linha__corpo .ab-badge { white-space: normal; border-radius: 10px; }
.ab-loja-linha__corpo form { margin-top: .3rem; }
.ab-loja-linha__valor { flex: none; font-size: .92rem; font-weight: 800; white-space: nowrap; }
.ab-loja-compra { padding: .75rem .85rem; background: var(--color-white); border: 1px solid var(--color-border-soft); border-radius: var(--radius-md); }
.ab-loja-compra ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .55rem; }
.ab-loja-compra li { display: flex; align-items: center; gap: .65rem; }
.ab-loja-compra__topo { display: flex; align-items: center; justify-content: space-between; gap: .5rem; margin-bottom: .5rem; font-size: .82rem; color: var(--color-text-muted); }
.ab-loja-compra__total { display: flex; justify-content: space-between; margin-top: .6rem; padding-top: .5rem; border-top: 1px solid var(--color-border-soft); font-weight: 800; }
.ab-loja-pedir-outro { display: grid; gap: .75rem; }
.ab-loja-pedir-outro p { margin: 0; font-size: .88rem; }
.ab-loja-folha { position: fixed; inset: 0; z-index: 20; max-width: 560px; margin: 0 auto; display: flex; flex-direction: column; justify-content: flex-end; }
.ab-loja-folha__veu { position: absolute; inset: 0; background: rgba(0,0,0,.55); }
.ab-loja-folha__corpo { position: relative; max-height: 92vh; overflow-y: auto; padding: .6rem 1.15rem calc(1.25rem + env(safe-area-inset-bottom)); border-radius: 22px 22px 0 0; background: var(--color-white); animation: ab-folha-sobe .3s var(--ease-mola); }
@keyframes ab-folha-sobe { from { transform: translateY(35%); opacity: .3; } }
.ab-loja-folha__alca { display: block; width: 40px; height: 4px; margin: 0 auto .9rem; border-radius: 2px; background: var(--color-border); }
.ab-loja-folha__check { width: 56px; height: 56px; margin: 0 auto .6rem; display: grid; place-items: center; border-radius: 50%; background: var(--ok-bg); color: var(--color-success); }
.ab-loja-folha__check .ab-ico { width: 28px; height: 28px; stroke-width: 3; }
.ab-loja-folha h2 { margin: 0 0 .25rem; font-family: var(--font-display); font-size: 2rem; font-weight: 400; letter-spacing: .03em; text-align: center; }
.ab-loja-folha__texto { margin: 0 0 1rem; font-size: .9rem; text-align: center; color: var(--color-text-muted); }
.ab-loja-folha .ab-loja-linha { align-items: center; border: 0; background: var(--color-bg); }
.ab-loja-folha__dados { margin: .5rem 0 1rem; }
.ab-loja-folha__dados div { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding: .55rem .1rem; border-bottom: 1px solid var(--color-border-soft); font-size: .88rem; }
.ab-loja-folha__dados dt { flex: none; color: var(--color-text-muted); }
.ab-loja-folha__dados dd { margin: 0; font-weight: 600; text-align: right; }
.ab-loja-formas { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .3rem; }
.ab-loja-formas em { padding: .2rem .5rem; border-radius: 6px; background: var(--color-bg); font-size: .72rem; font-style: normal; font-weight: 600; }
.ab-loja-folha__cancelar { display: block; width: 100%; margin-top: .4rem; padding: .75rem; border: 0; background: none; font: inherit; font-weight: 700; color: var(--color-link); cursor: pointer; }
@media (prefers-reduced-motion: reduce) { .ab-loja-folha__corpo { animation: none; } .ab-loja-card { transition: none; } }
