/* Meu Lounge. Mesmas cores, fontes, raios e peças da área do aluno da plataforma de contas
   (juntou-viajou-contas/publico/estilo.css): azul e laranja da logo, Inter no texto, Fraunces em títulos e números,
   botão laranja em pílula, gaveta para formulários.
   Rodada 2 (14/10, caminho B): layout da "Sala VIP à noite", mas claro (a Évili não gostou do escuro): cores da
   área do aluno, laranja como destaque. O início é a carteira: um cartão grande por vez, miniaturas de todos embaixo, saldo em bilhetes.
   Da rodada 1 continuam: ícones duotone, salas em lista compacta, menu com botão + e histórico em linha do tempo. */

@font-face { font-family: 'Inter'; src: url('fontes/inter.woff2') format('woff2'); font-weight: 400 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'Fraunces'; src: url('fontes/fraunces.woff2') format('woff2'); font-weight: 600 700; font-style: normal; font-display: swap; }

/* Tema único, claro (Évili, 14/10: "deixe o app na versão clara"): os tokens são os da área do aluno da Contas. */
:root {
  --azul-900: #0a2547;
  --azul-800: #0d2f59;
  --azul-700: #174a86;
  --azul-100: #e8eef7;
  --laranja-400: #f6a53c;
  --laranja-600: #e0620f;
  --laranja-texto: #b9500b;
  --laranja-100: #fdeedd;

  --fundo: #f3f5fa;
  --cartao: #ffffff;
  --cartao-2: #f7f9fc;
  --texto: #0f1f38;
  --texto-leve: #55657e;
  --borda: #dde5f1;
  --borda-forte: #c9d5e6;

  --ok: #1f7a45;
  --ok-bg: #e5f4eb;
  --aviso: #9a5606;
  --aviso-bg: #fdf0db;
  --erro: #b23a3a;
  --erro-bg: #fbe9e9;

  --sombra: 0 18px 44px rgba(13, 47, 89, 0.12);
  --raio: 18px;
  --raio-p: 12px;

  --fonte-titulo: 'Fraunces', Georgia, 'Times New Roman', serif;
  --fonte: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  color-scheme: light;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; color: var(--texto);
  background: radial-gradient(120% 420px at 50% 0, rgba(246, 165, 60, 0.12), transparent 70%) no-repeat, var(--fundo);
  font-family: var(--fonte); font-size: 15px; line-height: 1.55; -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, h5 { margin: 0; line-height: 1.2; text-wrap: balance; }
h1 { font-family: var(--fonte-titulo); font-weight: 700; letter-spacing: -0.01em; }
p { margin: 0; }
img { max-width: 100%; height: auto; }
a { color: var(--azul-700); }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
:focus-visible { outline: 2px solid var(--laranja-400); outline-offset: 2px; }
.num { font-variant-numeric: tabular-nums; }
[hidden] { display: none !important; }

/* ===== Ícones (Phosphor duotone, MIT) ===== */
.ic { width: 1.3em; height: 1.3em; fill: currentColor; flex: none; vertical-align: -0.28em; }
.ic--plus path[opacity] { display: none; }
.tile { --tom: var(--azul-700); --soft: var(--azul-100); width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; flex: none; background: var(--soft); color: var(--tom); }
.tile .ic { width: 22px; height: 22px; }
.tile--laranja { --tom: var(--laranja-texto); --soft: var(--laranja-100); }
.tile--verde { --tom: var(--ok); --soft: var(--ok-bg); }
.tile--vinho { --tom: var(--erro); --soft: var(--erro-bg); }
.tile--ambar { --tom: var(--aviso); --soft: var(--aviso-bg); }
.tile--grafite { --tom: var(--texto-leve); --soft: var(--cartao-2); }
.tile--p { width: 34px; height: 34px; border-radius: 10px; }
.tile--p .ic { width: 19px; height: 19px; }
.tile--g { width: 56px; height: 56px; border-radius: 16px; }
.tile--g .ic { width: 30px; height: 30px; }

/* ===== Peças ===== */
.botao {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  border: 0; border-radius: 999px; padding: 13px 22px; min-height: 44px;
  font-weight: 700; font-size: 0.95rem; text-decoration: none;
  background: linear-gradient(90deg, var(--laranja-400), var(--laranja-600)); color: #fff;
  box-shadow: 0 8px 18px rgba(224, 98, 15, 0.22);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.botao:hover { transform: translateY(-1px); box-shadow: 0 12px 24px rgba(224, 98, 15, 0.28); }
.botao:disabled { opacity: 0.5; cursor: not-allowed; transform: none; }
.botao--linha { background: var(--cartao); color: var(--texto); border: 1px solid var(--borda-forte); box-shadow: none; }
.botao--linha:hover { border-color: var(--azul-700); color: var(--azul-700); box-shadow: none; }
.botao--perigo { background: var(--erro); box-shadow: none; }
.botao--linha.botao--perigo { background: var(--cartao); color: var(--erro); border-color: var(--erro); }
.botao--mini { padding: 7px 14px; font-size: 0.82rem; min-height: 36px; }
.link {
  background: none; border: 0; padding: 6px 0; color: var(--azul-700); min-height: 36px;
  font-weight: 600; font-size: 0.88rem; text-decoration: underline; text-underline-offset: 3px;
}
.link--erro { color: var(--erro); }
.selo {
  display: inline-flex; align-items: center; gap: 8px; align-self: flex-start;
  font-size: 11.5px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
  padding: 5px 11px; border-radius: 999px; background: var(--azul-100); color: var(--azul-700);
}
.pill { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; font-size: 0.75rem; font-weight: 700; padding: 4px 10px; border-radius: 999px; }
.pill--ok { background: var(--ok-bg); color: var(--ok); }
.pill--aviso { background: var(--aviso-bg); color: var(--aviso); }
.pill--erro { background: var(--erro-bg); color: var(--erro); }
.pill--mudo { background: var(--cartao-2); color: var(--texto-leve); border: 1px solid var(--borda); }
.alerta { border-radius: var(--raio-p); padding: 11px 14px; font-size: 0.9rem; display: flex; align-items: center; gap: 10px; }
.alerta .ic { width: 22px; height: 22px; }
.alerta--erro { background: var(--erro-bg); color: var(--erro); font-weight: 600; }
.alerta--ok { background: var(--ok-bg); color: var(--ok); font-weight: 600; }
.alerta--teste { background: var(--aviso-bg); color: var(--texto); border: 1px dashed var(--aviso); flex-wrap: wrap; justify-content: space-between; gap: 8px 14px; }
.alerta--teste strong { letter-spacing: 0.04em; }
.rotulo { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; color: var(--texto-leve); }
.cartao {
  background: var(--cartao); border: 1px solid var(--borda); border-radius: var(--raio);
  padding: 20px; display: flex; flex-direction: column; gap: 14px;
}
.cartao h2 { font-size: 1.02rem; }
.acoes-linha { display: flex; flex-wrap: wrap; gap: 8px; }
.nota { font-size: 0.82rem; color: var(--texto-leve); }
.mudo { color: var(--texto-leve); }

/* Campos */
.campo { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.campo label { font-weight: 600; font-size: 0.84rem; }
.campo input, .campo select, .campo textarea {
  width: 100%; border: 1px solid var(--borda-forte); border-radius: 10px; background: var(--cartao);
  padding: 10px 12px; font-size: 16px; /* 16px: abaixo disso o iPhone dá zoom ao tocar no campo */
}
.campo textarea { resize: vertical; line-height: 1.45; min-height: 80px; }
.campo input:focus, .campo select:focus, .campo textarea:focus { outline: none; border-color: var(--azul-700); box-shadow: 0 0 0 3px var(--azul-100); }
.campo.tem-erro input, .campo.tem-erro select, .campo.tem-erro textarea { border-color: var(--erro); }
.campo__erro { color: var(--erro); font-size: 0.8rem; font-weight: 600; }
.campo__ajuda { color: var(--texto-leve); font-size: 0.8rem; }
.grade-campos { display: grid; gap: 14px; }
.marcar { display: inline-flex; align-items: center; gap: 10px; font-size: 0.92rem; font-weight: 600; cursor: pointer; min-height: 36px; }
.marcar input { width: 20px; height: 20px; accent-color: var(--azul-700); }
.opcional { font-size: 0.7rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--texto-leve); margin-left: 6px; }

/* ===== Programas: peça de monograma (sem logo oficial) ===== */
.pt { width: 36px; height: 36px; flex: none; border-radius: 11px; display: grid; place-items: center; color: #fff; font-weight: 800; font-size: 0.72rem; letter-spacing: 0.03em; background: linear-gradient(145deg, var(--p1), var(--p2)); box-shadow: 0 5px 12px color-mix(in srgb, var(--p2) 30%, transparent); }
.pt--p { width: 26px; height: 26px; border-radius: 8px; font-size: 0.56rem; box-shadow: none; }
.pt--g { width: 52px; height: 52px; border-radius: 15px; font-size: 0.95rem; }
.p-pp { --p1: #2a68b3; --p2: #0a2547; }
.p-dp { --p1: #e0584a; --p2: #8f1d1d; }
.p-lk { --p1: #1bb0a6; --p2: #0b5e66; }
.p-va { --p1: #5b6ef0; --p2: #1e2a78; }
.p-ou { --p1: #75849a; --p2: #334155; }

/* ===== Cartão ilustrado (miniatura do cartão) ===== */
.cv { container-type: inline-size; isolation: isolate; --k: 1; position: relative; width: 100%; aspect-ratio: 1.586 / 1; border-radius: 16px; color: #fff; overflow: hidden; flex: none;
  background: linear-gradient(135deg, var(--c1), var(--c2)); box-shadow: 0 12px 26px rgba(10, 37, 71, 0.24), inset 0 0 0 1px rgba(255, 255, 255, 0.14); }
.cv::before { content: ''; position: absolute; inset: 0; background: radial-gradient(95% 75% at 100% 0%, rgba(255, 255, 255, 0.3), transparent 60%), radial-gradient(75% 75% at 0% 100%, rgba(0, 0, 0, 0.28), transparent 65%); }
.cv::after { content: ''; position: absolute; right: -20cqw; top: -34cqw; width: 78cqw; aspect-ratio: 1; border-radius: 50%; border: 9cqw solid rgba(255, 255, 255, 0.07); }
.cv__in { position: absolute; inset: 0; z-index: 1; padding: 6.5cqw 7cqw; display: flex; flex-direction: column; justify-content: space-between; }
.cv__top { display: flex; align-items: center; gap: 3cqw; }
.cv__chip { width: calc(var(--k) * 12.5cqw); height: calc(var(--k) * 9.4cqw); border-radius: calc(var(--k) * 1.8cqw); flex: none; position: relative;
  background: linear-gradient(135deg, #f6e3a6, #c99a3b 52%, #f0d58a); box-shadow: inset 0 0 0 0.4cqw rgba(110, 70, 0, 0.4); }
.cv__chip::before { content: ''; position: absolute; inset: 22% 0; background: linear-gradient(90deg, transparent 33%, rgba(110, 70, 0, 0.35) 33%, rgba(110, 70, 0, 0.35) 35%, transparent 35%, transparent 65%, rgba(110, 70, 0, 0.35) 65%, rgba(110, 70, 0, 0.35) 67%, transparent 67%); }
.cv__nfc { display: inline-flex; color: rgba(255, 255, 255, 0.85); }
.cv__nfc .ic { width: calc(var(--k) * 7cqw); height: calc(var(--k) * 7cqw); }
.cv__rede { margin-left: auto; font-weight: 800; font-size: calc(var(--k) * 7.4cqw); letter-spacing: 0.02em; line-height: 1; text-shadow: 0 1px 6px rgba(0, 0, 0, 0.25); }
.cv__rede--visa { font-style: italic; }
.cv__rede--mastercard { font-size: calc(var(--k) * 5.6cqw); font-weight: 700; letter-spacing: -0.01em; }
.cv__rede--amex { font-size: calc(var(--k) * 4.6cqw); letter-spacing: 0.12em; }
.cv__base { display: flex; flex-direction: column; gap: 1.2cqw; min-width: 0; }
.cv__nome { font-size: calc(var(--k) * 5.7cqw); font-weight: 650; line-height: 1.15; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cv__sub { font-size: calc(var(--k) * 3.7cqw); opacity: 0.82; font-variant-numeric: tabular-nums; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cv__pills { display: flex; gap: 2cqw; margin-top: 1.4cqw; }
.cv__pill { display: inline-flex; align-items: center; gap: 1.4cqw; background: rgba(255, 255, 255, 0.18); border: 1px solid rgba(255, 255, 255, 0.24); border-radius: 999px; padding: calc(var(--k) * 0.9cqw) calc(var(--k) * 2.6cqw); font-size: calc(var(--k) * 3.9cqw); font-weight: 700; line-height: 1.3; backdrop-filter: blur(4px); font-variant-numeric: tabular-nums; }
.cv .ic { color: #fff; }
.cv--m { --k: 1.45; border-radius: 13px; }
.cv--p { --k: 2.3; border-radius: 9px; box-shadow: 0 6px 12px rgba(10, 37, 71, 0.22), inset 0 0 0 1px rgba(255, 255, 255, 0.14); }
.cv--p .cv__base, .cv--p .cv__nfc { display: none; }
.cv--p .cv__in { padding: 9cqw; }
.cv--p::after { border-width: 12cqw; }
.cv--g { max-width: 340px; }
/* Cartão com imagem enviada pela pessoa: a imagem é o cartão; só o saldo e os dias ficam por cima, sobre um degradê */
/* A imagem inteira, na proporção dela: o contorno e o canto arredondado ficam na própria imagem */
.cv--img { aspect-ratio: auto; background: none; box-shadow: none; border-radius: 0; overflow: visible; }
.cv--img::before, .cv--img::after { display: none; }
.cv__foto { display: block; width: 100%; height: auto; border-radius: 5cqw; box-shadow: 0 0 0 1px var(--borda), 0 8px 18px rgba(13, 47, 89, 0.1); }
.cv--p .cv__foto { box-shadow: 0 0 0 1px var(--borda); }
.t-azul { --c1: #2268b8; --c2: #0a2547; }
.t-noite { --c1: #343f54; --c2: #07090e; }
.t-grafite { --c1: #8f9bad; --c2: #3b4556; }
.t-ouro { --c1: #e2b455; --c2: #8a5a12; }
.t-laranja { --c1: #f6a53c; --c2: #c2410c; }
.t-verde { --c1: #22b083; --c2: #08463a; }
.t-vinho { --c1: #bd3f62; --c2: #43102a; }
.t-turquesa { --c1: #18b3b3; --c2: #0b4160; }

/* ===== Saldo em anel ===== */
.ring { --p: 25; --cor: var(--azul-700); --d: 52px; width: var(--d); height: var(--d); flex: none; border-radius: 50%; display: grid; place-items: center; position: relative;
  background: conic-gradient(var(--cor) calc(var(--p) * 1%), var(--azul-100) 0); }
.ring::before { content: ''; position: absolute; inset: calc(var(--d) * 0.12); border-radius: 50%; background: var(--cartao); }
.ring b { position: relative; font-family: var(--fonte-titulo); font-size: calc(var(--d) * 0.36); line-height: 1; }
.ring--g { --d: 72px; }
.ring--aviso { --cor: var(--laranja-400); }
.ring--erro { --cor: var(--erro); }
.ring--ok { --cor: var(--ok); }
.ring--vazio { --cor: var(--borda-forte); }

/* ===== Estrutura: celular com logo no topo e menu embaixo; computador com menu na lateral ===== */
.tela-aluno { padding-bottom: calc(92px + env(safe-area-inset-bottom, 0px)); }
.shell-aluno { min-height: 100vh; }
.lateral-aluno { background: var(--cartao); border-bottom: 1px solid var(--borda); padding: 8px 16px; position: sticky; top: env(safe-area-inset-top, 0px); z-index: 20;
  display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.lateral-aluno__logo img { width: 110px; display: block; background: #fff; border-radius: 10px; padding: 2px 6px; margin-left: -6px; box-sizing: content-box; } /* fundo branco: o azul da logo some no tema escuro */
.lateral-aluno__pe { display: none; }
.barra-aluno {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 30;
  display: grid; grid-template-columns: 1fr 1fr 76px 1fr 1fr; align-items: end;
  background: var(--cartao); border-top: 1px solid var(--borda);
  padding: 6px 2px calc(8px + env(safe-area-inset-bottom, 0px));
}
.barra-aluno__item {
  display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 6px 4px; border-radius: 10px; min-height: 52px;
  font-size: 0.7rem; font-weight: 650; color: var(--texto-leve); background: none; border: 0;
}
.barra-aluno__item .ic { width: 26px; height: 26px; }
.barra-aluno__item.is-ativo { color: var(--azul-700); font-weight: 800; }
.barra-aluno__fab { background: none; border: 0; padding: 0; display: flex; justify-content: center; align-items: flex-end; min-height: 52px; }
.fab { width: 58px; height: 58px; border-radius: 50%; background: linear-gradient(135deg, var(--laranja-400), var(--laranja-600)); color: #fff; display: grid; place-items: center;
  transform: translateY(-18px); box-shadow: 0 10px 20px rgba(224, 98, 15, 0.38); border: 4px solid var(--cartao); }
.fab .ic { width: 28px; height: 28px; }
.fab__txt { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.conteudo { --gutter: 16px; padding-inline: var(--gutter); display: flex; flex-direction: column; gap: 16px; width: 100%; margin: 0 auto; max-width: 760px; padding-block: 20px 32px; }
.saudacao { font-size: clamp(1.6rem, 6vw, 2.1rem); }
.cabecalho { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 12px; }
.cabecalho p { color: var(--texto-leve); font-size: 0.9rem; flex-basis: 100%; }
@media (min-width: 900px) {
  .tela-aluno { padding-bottom: 0; }
  .shell-aluno { display: grid; grid-template-columns: 236px minmax(0, 1fr); }
  .lateral-aluno {
    display: flex; flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 18px; border-bottom: 0; border-right: 1px solid var(--borda);
    position: sticky; top: 0; height: 100vh; padding: 24px 18px;
  }
  .lateral-aluno__logo img { width: 130px; }
  .barra-aluno { position: static; display: flex; flex-direction: column; align-items: stretch; gap: 4px; border: 0; padding: 0; background: none; }
  .barra-aluno__item { flex-direction: row; gap: 12px; padding: 10px 12px; border-radius: 10px; font-size: 0.95rem; color: var(--texto); min-height: 0; text-align: left; justify-content: flex-start; align-items: center; }
  .barra-aluno__item .ic { width: 24px; height: 24px; color: var(--texto-leve); }
  .barra-aluno__item:hover { background: var(--cartao-2); }
  .barra-aluno__item.is-ativo { background: var(--azul-800); color: #fff; font-weight: 650; }
  .barra-aluno__item.is-ativo .ic { color: var(--laranja-400); }
  .barra-aluno__fab { order: -1; width: 100%; margin-bottom: 10px; min-height: 0; display: block; }
  .fab { width: 100%; height: auto; transform: none; border: 0; border-radius: 999px; padding: 12px 16px; display: flex; justify-content: center; align-items: center; gap: 8px; box-shadow: 0 8px 18px rgba(224, 98, 15, 0.22); }
  .fab .ic { width: 22px; height: 22px; }
  .fab__txt { position: static; width: auto; height: auto; clip: auto; font-weight: 700; font-size: 0.95rem; }
  .lateral-aluno__pe { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; margin-top: auto; border-top: 1px solid var(--borda); padding-top: 16px; font-size: 0.82rem; color: var(--texto-leve); }
  .lateral-aluno__pe strong { color: var(--texto); font-size: 0.9rem; }
  .conteudo { --gutter: 36px; padding-block: 32px 60px; }
}

/* ===== Listas de avisos e atalhos ===== */
.lista { list-style: none; margin: 0; padding: 0; }
.lista li + li { border-top: 1px solid var(--borda); }
.lista__item {
  display: flex; align-items: center; gap: 12px; padding: 11px 0; text-decoration: none; color: var(--texto); font-size: 0.92rem;
  width: 100%; background: none; border: 0; text-align: left; min-height: 48px;
}
button.lista__item:hover .lista__acao, a.lista__item:hover .lista__acao { color: var(--laranja-600); }
.lista__texto { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.lista__texto strong { display: block; }
.lista__texto small { display: block; color: var(--texto-leve); font-size: 0.82rem; }
.lista__acao { flex: none; font-size: 0.84rem; font-weight: 700; color: var(--azul-700); display: inline-flex; align-items: center; gap: 2px; }
.bloco { padding: 16px 18px; gap: 6px; }
.bloco__cab { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.bloco__cab h2 { display: flex; align-items: center; gap: 8px; font-size: 0.95rem; }
.bloco__n { font-size: 0.74rem; font-weight: 700; background: var(--cartao-2); border: 1px solid var(--borda); border-radius: 999px; padding: 0 8px; }
.atencao__vazio { display: flex; align-items: center; gap: 12px; padding: 8px 0 4px; font-size: 0.92rem; color: var(--texto-leve); }

/* ===== Início ===== */
.inicio-grade { display: grid; gap: 14px; align-items: start; }
@media (min-width: 900px) { .inicio-grade { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); } }
.inicio-grade > div { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.vazio-grande { align-items: center; text-align: center; padding: 28px 20px; color: var(--texto-leve); }
.vazio-grande h2 { font-family: var(--fonte-titulo); font-size: 1.25rem; color: var(--texto); }
.vazio-grande .acoes-linha { justify-content: center; }
.ilustra { position: relative; width: 230px; height: 136px; margin: 4px auto 6px; }
.ilustra .cv { position: absolute; width: 150px; }
.ilustra .cv:first-child { left: 6px; top: 14px; transform: rotate(-8deg); }
.ilustra .cv:nth-child(2) { right: 6px; top: 4px; transform: rotate(6deg); }
.ilustra .tile { position: absolute; right: 54px; bottom: 0; box-shadow: 0 8px 18px rgba(13, 47, 89, 0.18); border: 3px solid var(--cartao); width: 48px; height: 48px; border-radius: 50%; }
.ilustra--icone { width: 96px; height: 96px; border-radius: 50%; background: var(--azul-100); color: var(--azul-700); display: grid; place-items: center; }
.ilustra--icone .ic { width: 52px; height: 52px; }

/* ===== Cartões: lista com miniatura e anel ===== */
.lc {
  display: grid; grid-template-columns: 112px minmax(0, 1fr) auto; grid-template-areas: "img nome nome" "img prog ring" "img renova ring";
  column-gap: 12px; row-gap: 3px; align-items: center; width: 100%; text-align: left; padding: 10px 12px;
  background: var(--cartao); border: 1px solid var(--borda); border-radius: 14px;
}
button.lc:hover { border-color: var(--azul-700); }
.lc .cv { grid-area: img; width: 112px; align-self: center; }
.lc__nome { grid-area: nome; font-size: 0.95rem; line-height: 1.25; overflow-wrap: anywhere; align-self: end; }
.lc__prog { grid-area: prog; color: var(--texto-leve); font-size: 0.8rem; display: flex; align-items: center; gap: 6px; line-height: 1.3; min-width: 0; }
.lc__renova { grid-area: renova; color: var(--texto-leve); font-size: 0.78rem; line-height: 1.3; align-self: start; }
.lc .ring { grid-area: ring; --d: 46px; align-self: center; }
.lista-cartoes--compacta .lc { grid-template-columns: 92px minmax(0, 1fr) auto; padding: 8px 10px; }
.lista-cartoes--compacta .lc .cv { width: 92px; }
.lista-cartoes { display: flex; flex-direction: column; gap: 8px; }
.lc--destaque { border-color: var(--azul-700); box-shadow: 0 0 0 3px var(--azul-100); }

/* ===== Salas: lista compacta ===== */
.busca { display: flex; gap: 8px; align-items: center; width: 100%; max-width: 420px; }
.busca input { flex: 1; min-width: 0; border: 1px solid var(--borda-forte); border-radius: 10px; background: var(--cartao); padding: 10px 12px; font-size: 16px; }
.busca input:focus { outline: none; border-color: var(--azul-700); box-shadow: 0 0 0 3px var(--azul-100); }
.abas-salas { display: flex; gap: 2px; overflow-x: auto; scrollbar-width: none; border-bottom: 1px solid var(--borda); }
.abas-salas::-webkit-scrollbar { display: none; }
.aba-sala {
  display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; padding: 11px 11px; background: none; border: 0;
  font-weight: 600; font-size: 0.9rem; color: var(--texto-leve); border-bottom: 3px solid transparent; border-radius: 10px 10px 0 0;
}
.aba-sala.is-ativa { color: var(--azul-700); background: var(--azul-100); border-bottom-color: var(--azul-700); }
.aba-sala__n { font-size: 0.72rem; font-weight: 700; background: var(--laranja-100); color: var(--laranja-texto); border-radius: 6px; padding: 1px 7px; }
.cmp { display: flex; gap: 12px; align-items: center; padding: 10px 12px; background: var(--cartao); border: 1px solid var(--borda); border-radius: 14px; width: 100%; text-align: left; }
button.cmp:hover, div.cmp:hover { border-color: var(--azul-700); }
.cmp__main { display: flex; gap: 12px; align-items: center; flex: 1; min-width: 0; background: none; border: 0; padding: 0; text-align: left; }
.cmp__iata { width: 54px; height: 54px; border-radius: 15px; flex: none; background: linear-gradient(145deg, var(--p1), var(--p2)); color: #fff; display: grid; place-items: center; font-family: var(--fonte-titulo); font-weight: 700; font-size: 1.12rem; box-shadow: 0 6px 14px color-mix(in srgb, var(--p2) 28%, transparent); }
.cmp__txt { min-width: 0; flex: 1; display: flex; flex-direction: column; gap: 4px; }
.cmp__txt strong { font-size: 0.95rem; line-height: 1.25; overflow-wrap: anywhere; }
.cmp__txt small { color: var(--texto-leve); font-size: 0.78rem; line-height: 1.3; }
.lista-salas { display: flex; flex-direction: column; gap: 8px; }
.fav { color: var(--laranja-400); display: inline-flex; flex: none; background: none; border: 0; padding: 6px; min-width: 40px; min-height: 40px; align-items: center; justify-content: center; border-radius: 10px; margin: -6px -6px -6px 0; }
.fav .ic { width: 24px; height: 24px; }
.fav--off { color: var(--borda-forte); }
.am { display: flex; flex-wrap: wrap; gap: 6px; }
.am i { display: inline-flex; align-items: center; gap: 5px; font-style: normal; font-size: 0.74rem; font-weight: 650; color: var(--azul-700); background: var(--azul-100); border-radius: 999px; padding: 4px 10px 4px 8px; }
.am--so i { padding: 5px; }
.am--so .ic { width: 16px; height: 16px; }

/* ===== Histórico: linha do tempo ===== */
.hist-resumo { color: var(--texto-leve); font-size: 0.9rem; }
.hv { background: var(--cartao); border: 1px solid var(--borda); border-radius: 16px; padding: 4px 14px 6px; }
.tl__mes { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; color: var(--texto-leve); padding: 14px 0 8px; }
.tl { position: relative; padding: 2px 0 2px 46px; }
.tl::before { content: ''; position: absolute; left: 17px; top: 8px; bottom: 8px; width: 2px; background: repeating-linear-gradient(var(--borda-forte) 0 5px, transparent 5px 10px); }
.tl__it { position: relative; display: flex; gap: 8px; justify-content: space-between; align-items: flex-start; width: 100%; background: none; border: 0; padding: 6px 0 16px; text-align: left; }
.tl__it .tile { position: absolute; left: -46px; top: 4px; width: 36px; height: 36px; border-radius: 50%; border: 3px solid var(--cartao); }
.tl__txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.tl__txt strong { font-size: 0.92rem; line-height: 1.25; overflow-wrap: anywhere; }
.tl__txt small { color: var(--texto-leve); font-size: 0.78rem; }

/* ===== Detalhe (gaveta) ===== */
.det { display: flex; flex-direction: column; gap: 16px; }
.det__saldo { display: flex; align-items: center; gap: 14px; background: var(--cartao-2); border: 1px solid var(--borda); border-radius: 14px; padding: 12px 14px; }
.det__saldo strong { display: block; font-size: 0.95rem; }
.det__saldo small { color: var(--texto-leve); font-size: 0.82rem; display: block; }
.det__linhas { display: flex; flex-direction: column; gap: 12px; }
.det__lin { display: flex; align-items: center; gap: 12px; font-size: 0.9rem; }
.det__lin > span:not(.tile):not(.pt) { min-width: 0; flex: 1; overflow-wrap: anywhere; }
.det__lin small { display: block; color: var(--texto-leve); font-size: 0.8rem; }
.det__titulo { display: flex; align-items: center; gap: 12px; }
.det__titulo h3 { font-size: 1.05rem; overflow-wrap: anywhere; }
.det__titulo small { color: var(--texto-leve); font-size: 0.84rem; display: block; }
.det__acoes { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.det__sep { height: 1px; background: var(--borda); }

/* ===== Formulários: cor do cartão e escolha do cartão ===== */
.swatches { display: flex; gap: 10px; flex-wrap: wrap; }
.sw { width: 38px; height: 38px; border-radius: 50%; border: 3px solid var(--cartao); box-shadow: 0 0 0 1px var(--borda-forte); background: linear-gradient(135deg, var(--c1), var(--c2)); padding: 0; }
.sw.is-on { box-shadow: 0 0 0 3px var(--azul-700); }
.previa-cartao { display: flex; justify-content: center; padding: 6px 0 2px; }
.previa-cartao .cv { max-width: 300px; }
.escolha { display: flex; gap: 10px; overflow-x: auto; padding: 4px 2px 8px; scrollbar-width: none; }
.escolha::-webkit-scrollbar { display: none; }
.escolha button { flex: 0 0 108px; background: none; border: 2px solid transparent; border-radius: 14px; padding: 6px; display: flex; flex-direction: column; gap: 6px; text-align: left; }
.escolha button.is-on { border-color: var(--azul-700); background: var(--azul-100); }
.escolha small { font-size: 0.74rem; font-weight: 650; line-height: 1.2; overflow-wrap: anywhere; }
.chips-am { display: flex; flex-wrap: wrap; gap: 8px; }
.chip-am { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--borda-forte); background: var(--cartao); border-radius: 999px; padding: 7px 12px 7px 10px; font-size: 0.86rem; font-weight: 600; min-height: 40px; color: var(--texto); }
.chip-am.is-on { background: var(--azul-100); border-color: var(--azul-700); color: var(--azul-700); }

/* Imagem do cartão no formulário */
.imagem-cartao { display: flex; flex-direction: column; gap: 8px; }
.imagem-cartao__acoes { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.form--com-imagem .so-sem-imagem { display: none; }

/* Busca no catálogo de cartões (imagens de catalogo/catalogo.js) */
.catalogo { gap: 8px; }
.catalogo input[type=search] { font-size: 16px; }
.catalogo__res { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.catalogo__res:empty { display: none; }
.catalogo__it { background: var(--cartao); border: 1px solid var(--borda); border-radius: 14px; padding: 8px; display: flex; flex-direction: column; gap: 6px; text-align: left; min-height: 44px; }
.catalogo__it:hover, .catalogo__it:focus-visible { border-color: var(--azul-700); background: var(--azul-100); }
.catalogo__it img { width: 100%; aspect-ratio: 1.586; object-fit: contain; display: block; }
.catalogo__it small { font-size: 0.74rem; font-weight: 650; line-height: 1.25; overflow-wrap: anywhere; }
.catalogo__nada { grid-column: 1 / -1; color: var(--texto-leve); font-size: 0.84rem; }
@media (min-width: 560px) { .catalogo__res { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* ===== Meus dados ===== */
.conta { max-width: 640px; }
.conta .cartao { gap: 10px; }
.conta h2 { display: flex; align-items: center; gap: 10px; }
.conta p { font-size: 0.92rem; }
.conta textarea { width: 100%; min-height: 96px; border: 1px solid var(--borda-forte); border-radius: 10px; background: var(--cartao); padding: 10px 12px; font-size: 13px; font-family: ui-monospace, Menlo, monospace; }
.conta ul { margin: 0; padding-left: 18px; font-size: 0.9rem; display: grid; gap: 4px; }

/* ===== Gaveta (formulários e detalhes) e confirmação ===== */
.gaveta { display: none; position: fixed; inset: 0; z-index: 50; }
.gaveta.is-aberta { display: block; }
.gaveta__fundo { position: absolute; inset: 0; background: rgba(10, 37, 71, 0.38); }
.gaveta__painel {
  position: absolute; top: 0; right: 0; bottom: 0; width: min(500px, 100%);
  background: var(--cartao); box-shadow: -18px 0 44px rgba(13, 47, 89, 0.18);
  overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain;
  padding: 20px 20px calc(32px + env(safe-area-inset-bottom, 0px)); display: flex; flex-direction: column; gap: 16px;
  animation: gaveta-entra 0.18s ease-out;
}
.gaveta__topo { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.gaveta__topo h2 { font-family: var(--fonte-titulo); font-size: 1.3rem; }
.gaveta__fechar { font-size: 1.6rem; line-height: 1; background: none; border: 0; color: var(--texto-leve); padding: 2px 10px; min-height: 40px; border-radius: 8px; }
.gaveta__fechar:hover { background: var(--cartao-2); color: var(--texto); }
.gaveta__sub { color: var(--texto-leve); font-size: 0.9rem; margin-top: -8px; }
.form-acoes { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.dialogo { position: fixed; inset: 0; z-index: 60; display: none; align-items: center; justify-content: center; padding: 16px; background: rgba(10, 37, 71, 0.45); }
.dialogo.is-aberto { display: flex; }
.dialogo__caixa { width: min(420px, 100%); background: var(--cartao); border: 1px solid var(--borda); border-radius: 22px; box-shadow: var(--sombra); padding: 22px; display: flex; flex-direction: column; gap: 14px; }
.dialogo__caixa h2 { font-family: var(--fonte-titulo); font-size: 1.25rem; }
.dialogo__caixa p { color: var(--texto-leve); font-size: 0.92rem; }
@keyframes gaveta-entra { from { transform: translateX(24px); } to { transform: none; } }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }

/* ===== Rodada 2: Sala VIP à noite ===== */
.fab:active, .botao:active, .chip:active, .contador__b:active { transform: scale(0.96); }
@media (max-width: 899px) {
  .lateral-aluno { position: static; background: none; border: 0; padding: 0; }
  .lateral-aluno__logo { display: none; }
  .conteudo { padding-top: calc(18px + env(safe-area-inset-top, 0px)); }
  .barra-aluno { background: rgba(255, 255, 255, 0.9); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); }
  .barra-aluno__item.is-ativo { color: var(--laranja-texto); }
}

/* Saldo do cartão (no detalhe): anel, "1 de 4 acessos livres" ao lado e o botão de visita dentro do mesmo cartão */
@property --p { syntax: '<number>'; inherits: false; initial-value: 0; }
.saldo-b { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 16px 18px; min-width: 0;
  background: var(--cartao); border: 1px solid var(--borda); border-radius: 22px; padding: 18px; box-shadow: var(--sombra); }
.saldo-b .ring { --d: 84px; }
.saldo-b .ring b { font-size: 2.1rem; }
.saldo-b.troca { animation: saldo-troca 0.35s ease-out; }
.saldo-b.troca .ring { animation: anel-enche 0.7s cubic-bezier(0.2, 0.8, 0.2, 1); }
@keyframes saldo-troca { from { opacity: 0.25; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes anel-enche { from { --p: 0; } }
.saldo-b__txt { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; min-width: 0; }
.saldo-b__nome { color: var(--texto-leve); font-size: 0.78rem; overflow-wrap: anywhere; }
.saldo-b__titulo { font-size: 1.2rem; line-height: 1.25; }
.saldo-b__sub { color: var(--texto-leve); font-size: 0.9rem; line-height: 1.4; }
.saldo-b__txt .pill { margin-top: 5px; }
.saldo-b .botao--largo { grid-column: 1 / -1; }
.saldo-b--det { box-shadow: none; background: var(--cartao-2); }
.botao--largo { width: 100%; padding-block: 15px; font-size: 1rem; }

/* Gaveta: no celular, folha que sobe de baixo */
.gaveta__fundo { background: rgba(10, 37, 71, 0.4); }
@media (max-width: 899px) {
  .gaveta__painel { top: auto; left: 0; right: 0; bottom: 0; width: 100%; max-height: calc(100% - 24px - env(safe-area-inset-top, 0px));
    border-radius: 26px 26px 0 0; box-shadow: 0 -18px 44px rgba(13, 47, 89, 0.18); padding-top: 28px; animation: folha-sobe 0.3s cubic-bezier(0.2, 0.8, 0.2, 1); }
  .gaveta__painel::before { content: ''; position: absolute; top: 10px; left: 50%; width: 40px; height: 5px; border-radius: 3px; background: var(--borda-forte); transform: translateX(-50%); }
}
@keyframes folha-sobe { from { transform: translateY(35%); opacity: 0.5; } to { transform: none; opacity: 1; } }

/* Peças dos formulários novos: escolhas em pílula, contador, efeito no saldo, "mais detalhes" */
.rotulo-f { font-weight: 600; font-size: 0.84rem; }
.chips { display: flex; gap: 8px; flex-wrap: wrap; }
.chip { border: 1px solid var(--borda-forte); background: var(--cartao-2); color: var(--texto); border-radius: 999px; padding: 8px 15px; font-weight: 650; font-size: 0.9rem; min-height: 40px; transition: background 0.15s, color 0.15s, border-color 0.15s; }
.chip.is-on { background: var(--texto); border-color: var(--texto); color: var(--fundo); }
.contador { display: flex; align-items: center; gap: 12px; }
.contador__b { width: 44px; height: 44px; flex: none; border-radius: 50%; border: 1px solid var(--borda-forte); background: var(--cartao-2); color: var(--texto); font-size: 1.4rem; line-height: 1; display: grid; place-items: center; padding: 0; }
.campo .contador input { width: 64px; flex: none; text-align: center; font-family: var(--fonte-titulo); font-size: 2rem; font-weight: 700; background: none; border: 0; padding: 0; -moz-appearance: textfield; appearance: textfield; }
.campo .contador input:focus { box-shadow: none; text-decoration: underline; text-decoration-color: var(--laranja-400); }
.contador input::-webkit-outer-spin-button, .contador input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.contador small { color: var(--texto-leve); font-size: 0.86rem; }
.efeito { display: flex; gap: 10px; align-items: center; background: var(--cartao-2); border: 1px solid var(--borda); border-radius: 14px; padding: 10px 12px; font-size: 0.88rem; }
.efeito:empty { display: none; }
.efeito .ic { color: var(--laranja-400); width: 20px; height: 20px; }
.efeito--erro { border-color: var(--erro); color: var(--erro); }
.efeito--erro .ic { color: var(--erro); }
.mais-detalhes { border-top: 1px solid var(--borda); padding-top: 4px; }
.mais-detalhes summary { cursor: pointer; list-style: none; display: flex; flex-direction: column; justify-content: center; min-height: 48px; font-weight: 650; color: var(--azul-700); }
.mais-detalhes summary::-webkit-details-marker { display: none; }
.mais-detalhes summary small { color: var(--texto-leve); font-weight: 400; font-size: 0.8rem; }
.mais-detalhes[open] summary { margin-bottom: 10px; }
.linha-data { display: flex; align-items: center; gap: 8px; font-weight: 650; }
.linha-data .ic { color: var(--texto-leve); }
.linha-data .link { min-height: 0; padding: 0; }
.link--centro { align-self: center; }
#form[data-passo="1"] .form-acoes { display: none; }
.escolha button { color: var(--texto); }

/* Aviso flutuante, acima do menu */
#avisoTopo { position: fixed; z-index: 70; left: 16px; right: 16px; bottom: calc(100px + env(safe-area-inset-bottom, 0px)); max-width: 460px; margin: 0 auto; box-shadow: 0 14px 34px rgba(13, 47, 89, 0.2); animation: aviso-sobe 0.3s cubic-bezier(0.2, 0.8, 0.2, 1); }
@media (min-width: 900px) { #avisoTopo { bottom: 24px; left: 260px; } }
@keyframes aviso-sobe { from { transform: translateY(14px); opacity: 0.3; } to { transform: none; opacity: 1; } }
.cad__nome { text-align: center; display: flex; flex-direction: column; margin-top: -6px; }
.cad__nome:empty { display: none; }
.cad__nome small { color: var(--texto-leve); font-size: 0.82rem; }

/* Avisos (no sino da capa): uma linha curta cada, sem caixa */
.avisos { display: flex; flex-direction: column; gap: 2px; }
.avisos:empty { display: none; }
.aviso-l { display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; background: none; border: 0; border-radius: 12px; padding: 8px 6px; min-height: 44px; color: var(--texto-leve); font-size: 0.84rem; line-height: 1.35; }
.aviso-l:hover { background: var(--cartao); }
.aviso-l span { flex: 1; min-width: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.aviso-l strong { color: var(--texto); font-weight: 650; }
.aviso-l > .ic:first-child { width: 20px; height: 20px; }
.aviso-l > .ic:last-child { width: 16px; height: 16px; opacity: 0.6; }
.aviso-l--erro > .ic:first-child { color: var(--erro); }
.aviso-l--aviso > .ic:first-child { color: var(--aviso); }
.aviso-l--info > .ic:first-child { color: var(--azul-700); }

/* Salas como cartões: aeroporto grande, cor do programa ao fundo, comodidades e "entra com" */
.bloco-livre { display: flex; flex-direction: column; gap: 10px; }
.bloco-livre .bloco__cab h2 { font-size: 1rem; }
.lista-salas { display: grid; gap: 12px; }
@media (min-width: 700px) { .lista-salas { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.abas-salas { gap: 8px; border-bottom: 0; }
.aba-sala { border: 1px solid var(--borda-forte); border-radius: 999px; padding: 7px 14px; background: var(--cartao-2); color: var(--texto); min-height: 40px; }
.aba-sala.is-ativa { background: var(--texto); border-color: var(--texto); color: var(--fundo); }
.aba-sala.is-ativa .aba-sala__n { background: var(--fundo); color: var(--texto); }
.dica-site { display: flex; gap: 8px; align-items: flex-start; margin-top: 6px; font-size: 0.8rem; line-height: 1.4; color: var(--texto-leve); background: var(--cartao-2); border: 1px solid var(--borda); border-radius: 12px; padding: 8px 10px; }
.dica-site .ic { width: 16px; height: 16px; flex: none; margin-top: 1px; color: var(--azul-700); }

/* ===== Início do modelo com foto (Évili, 14/10): capa com a janela do avião, saudação, apps oficiais; lista em branco ===== */
body.em-inicio { background: var(--cartao); }
.capa { position: relative; isolation: isolate; overflow: hidden; color: var(--texto); display: flex; flex-direction: column;
  margin: calc(-18px - env(safe-area-inset-top, 0px)) calc(-1 * var(--gutter)) 0; padding: calc(12px + env(safe-area-inset-top, 0px)) var(--gutter) 78px; }
.capa__foto { position: absolute; top: calc(30px + env(safe-area-inset-top, 0px)); left: 0; width: 100%; height: calc(100% - 30px - env(safe-area-inset-top, 0px)); max-width: none; object-fit: cover; object-position: 50% 38%; z-index: -2; }
/* Topo em degradê branco (a marca fica no branco, sem caixa), a foto aparece embaixo e à direita, o texto à esquerda (15/10) */
.capa::before { content: ''; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(180deg, #fff 0, #fff calc(44px + env(safe-area-inset-top, 0px)), rgba(255, 255, 255, 0) calc(150px + env(safe-area-inset-top, 0px))),
    linear-gradient(90deg, rgba(255, 255, 255, 0.92) 0%, rgba(255, 255, 255, 0.6) 42%, rgba(255, 255, 255, 0) 60%),
    linear-gradient(0deg, #fff 0%, rgba(255, 255, 255, 0.9) 16%, rgba(255, 255, 255, 0) 48%); } /* a foto some no branco em degradê, sem borda (15/10) */
.capa__topo { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.capa__marca { display: inline-flex; }
.capa__marca img { display: block; height: 40px; width: auto; }
.capa__acoes { display: flex; align-items: center; gap: 10px; }
.capa__btn, .capa__avatar { position: relative; width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; padding: 0; color: var(--azul-800);
  background: rgba(255, 255, 255, 0.8); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-shadow: 0 4px 12px rgba(13, 47, 89, 0.12); }
.capa__btn { border: 1px solid var(--borda); }
.capa__btn .ic, .capa__avatar .ic { width: 22px; height: 22px; }
.capa__ponto { position: absolute; top: -3px; right: -3px; min-width: 19px; height: 19px; padding: 0 4px; border-radius: 10px; display: grid; place-items: center;
  font-style: normal; font-size: 0.68rem; font-weight: 800; background: var(--laranja-600); color: #fff; border: 2px solid #fff; }
.capa__avatar { border: 2px solid #fff; overflow: hidden; font-weight: 800; font-size: 0.85rem; background: var(--azul-100); }
.capa__avatar img { width: 100%; height: 100%; object-fit: cover; }
.capa__ola { margin-top: 12px; font-family: var(--fonte-titulo); font-weight: 600; font-size: 1.2rem; color: var(--laranja-texto); }
.capa .capa__titulo { margin-top: 4px; font-family: var(--fonte-titulo); font-weight: 600; font-size: clamp(1.5rem, 6.4vw, 2rem); line-height: 1.12; color: var(--azul-900);
  max-width: 12ch; text-shadow: 0 0 18px rgba(255, 255, 255, 0.9); }
.capa__apps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.capa__app { display: flex; flex-direction: column; align-items: center; gap: 7px; text-align: center; text-decoration: none; color: var(--azul-900); font-size: 0.76rem; font-weight: 700; line-height: 1.2;
  text-shadow: 0 0 10px #fff, 0 0 4px #fff; -webkit-tap-highlight-color: transparent; }
.capa__app img { width: 62px; height: 62px; border-radius: 16px; object-fit: cover; background: #fff; transition: transform 0.15s ease;
  box-shadow: 0 0 0 1px rgba(13, 47, 89, 0.08), 0 10px 22px rgba(13, 47, 89, 0.22); } /* quadrado de cantos arredondados, como no guia (15/10) */
.capa__app:active img { transform: scale(0.94); }
.meus { position: relative; display: flex; flex-direction: column; gap: 12px; margin-top: -58px; }
.progs { display: flex; flex-direction: column; gap: 12px; padding-top: 12px; }
.progs h2 { font-size: 1.15rem; }
.meus__cab { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.meus__cab h2 { font-size: 1.15rem; }
.meus__cab .link { display: inline-flex; align-items: center; gap: 2px; font-weight: 650; }
.meus__cab .link .ic { width: 16px; height: 16px; }
.meus__lista { display: grid; gap: 10px; }
.mc { display: grid; grid-template-columns: 88px minmax(0, 1fr) auto 18px; align-items: center; gap: 12px; width: 100%; text-align: left; color: var(--texto);
  background: var(--cartao); border: 1px solid var(--borda); border-radius: 18px; padding: 10px 10px 10px 12px; box-shadow: 0 6px 18px rgba(13, 47, 89, 0.06); }
button.mc:hover { border-color: var(--borda-forte); }
.mc .cv { width: 88px; }
.mc__txt { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.mc__txt strong { font-size: 0.95rem; line-height: 1.25; overflow-wrap: anywhere; }
.mc__txt small { color: var(--texto-leve); font-size: 0.84rem; letter-spacing: 0.04em; }
.mc__pill { display: inline-flex; align-items: baseline; gap: 4px; white-space: nowrap; border-radius: 999px; padding: 5px 11px; font-size: 0.78rem; font-weight: 650;
  color: var(--azul-700); background: var(--azul-100); border: 1px solid color-mix(in srgb, var(--azul-700) 25%, transparent); }
.mc__pill b { font-size: 1rem; font-weight: 800; }
.mc__pill--aviso { color: var(--aviso); background: var(--aviso-bg); border-color: color-mix(in srgb, var(--aviso) 25%, transparent); }
.mc__pill--erro { color: var(--erro); background: var(--erro-bg); border-color: color-mix(in srgb, var(--erro) 25%, transparent); }
.mc__pill--zero { color: var(--texto-leve); background: var(--cartao-2); border-color: var(--borda); }
.mc__seta { width: 18px; height: 18px; color: var(--texto-leve); }
.mc--novo { animation: mc-novo 1.8s ease-out; }
@keyframes mc-novo { 0%, 40% { box-shadow: 0 0 0 3px var(--laranja-400); } 100% { box-shadow: 0 6px 18px rgba(13, 47, 89, 0.06); } }
.meus__novo { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 52px; border: 1.5px dashed var(--borda-forte); border-radius: 18px; background: none;
  color: var(--texto-leve); font-weight: 650; }
.meus__novo .ic { width: 18px; height: 18px; }
.meus__vazio { display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; padding: 14px 6px; }
.meus__vazio p { color: var(--texto-leve); max-width: 34ch; }
@media (max-width: 380px) { .mc { grid-template-columns: 72px minmax(0, 1fr) auto 16px; gap: 10px; } .mc .cv { width: 72px; } }
@media (min-width: 900px) {
  body.em-inicio { background: var(--fundo); }
  .capa { margin: 0; border-radius: 26px; padding: 26px 32px 30px; }
  .capa__foto { top: 0; height: 100%; object-position: 50% 45%; }
  .capa__marca { display: none; }
  .capa__topo { justify-content: flex-end; }
  .capa__ola { margin-top: 6px; }
  .progs .capa__apps { max-width: 520px; }
  .meus { margin: 0; }
}
@media (prefers-reduced-motion: reduce) { .mc--novo { animation: none; } }

/* Perfil: foto e nome de quem usa o app (a saudação da capa usa o primeiro nome) */
.perfil__topo { display: flex; align-items: center; gap: 16px; }
.perfil__topo strong { display: block; font-size: 1.1rem; }
.perfil__topo small { color: var(--texto-leve); font-size: 0.84rem; }
.perfil__topo small .link { min-height: 0; padding: 0; font-size: 0.84rem; }
.perfil__foto { position: relative; flex: none; width: 76px; height: 76px; border-radius: 50%; border: 0; padding: 0; display: grid; place-items: center;
  background: var(--azul-100); color: var(--azul-700); font-size: 1.5rem; font-weight: 800; }
.perfil__foto > img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; }
.perfil__foto > .ic { width: 38px; height: 38px; }
.perfil__cam { position: absolute; right: -2px; bottom: -2px; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center;
  background: var(--laranja-600); color: #fff; border: 3px solid var(--cartao); }
.perfil__cam .ic { width: 14px; height: 14px; }
.perfil__form { display: flex; align-items: flex-end; gap: 10px; margin-top: 16px; }
.perfil__form .campo { flex: 1; min-width: 0; }

/* ===== Maço de cartões do início (15/10, modelo): o da frente desliza, dois parados atrás; soma dos acessos ===== */
.deck { position: relative; padding-top: 18px; width: 100%; max-width: 330px; margin-inline: auto; } /* um pouco menor que a tela (15/10) */
.deck__atras { position: absolute; inset: 0 0 auto 0; height: 100%; pointer-events: none; }
.deck__a { position: absolute; display: block; border-radius: 5%; overflow: hidden; opacity: 0.95; box-shadow: 0 10px 24px rgba(13, 47, 89, 0.16); }
.deck__a .cv { width: 100%; max-width: none; }
.deck__a .cv__foto { aspect-ratio: 1.586; object-fit: cover; box-shadow: none; }
.deck__a--0 { top: 0; left: 26px; width: calc(100% - 78px); transform: rotate(-2.5deg); }
.deck__a--1 { top: 10px; right: 0; width: calc(100% - 46px); transform: rotate(3.5deg); }
.deck__trilho { position: relative; display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-x: contain;
  margin: 0 -26px -14px; padding: 0 0 36px; scroll-behavior: smooth; } /* sobra dos lados para a sombra não ser cortada */
.deck__trilho::-webkit-scrollbar { display: none; }
.deck__slide { flex: 0 0 100%; scroll-snap-align: start; padding: 0 48px 0 26px; }
.deck__c { position: relative; display: block; width: 100%; padding: 0; border: 0; background: none; border-radius: 16px; text-align: left; color: #fff; -webkit-tap-highlight-color: transparent; }
.deck__c .cv { width: 100%; max-width: none; }
.deck__c .cv__foto { aspect-ratio: 1.586; object-fit: cover; box-shadow: 0 12px 22px rgba(13, 47, 89, 0.28); }
.deck__c .cv:not(.cv--img) { box-shadow: 0 12px 22px rgba(13, 47, 89, 0.28); }
.deck__sombra { position: absolute; inset: 0; border-radius: 5cqw; border-radius: 16px; background: linear-gradient(180deg, transparent 45%, rgba(4, 10, 22, 0.62) 100%); pointer-events: none; }
.deck__info { position: absolute; left: 6%; bottom: 8%; display: flex; flex-direction: column; gap: 2px; text-shadow: 0 1px 6px rgba(0, 0, 0, 0.5); }
.deck__info strong { font-size: 1rem; font-weight: 650; }
.deck__info span { font-size: 0.92rem; letter-spacing: 0.08em; opacity: 0.92; }
.deck__pill { position: absolute; top: 7%; right: 5%; display: inline-flex; align-items: center; gap: 7px; padding: 5px 12px 5px 10px; border-radius: 999px; color: #fff;
  background: rgba(10, 20, 38, 0.55); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border: 1px solid rgba(255, 255, 255, 0.28); line-height: 1.1; }
.deck__pill b { font-family: var(--fonte-titulo); font-size: 1.35rem; }
.deck__pill span { display: flex; flex-direction: column; font-size: 0.74rem; font-weight: 650; }
.deck__pill small { font-size: 0.66rem; font-weight: 500; opacity: 0.85; }
.deck__pill--aviso { border-color: rgba(246, 165, 60, 0.9); }
.deck__pill--erro { background: rgba(178, 58, 58, 0.78); border-color: rgba(255, 255, 255, 0.4); }
.deck__pill--zero { background: rgba(60, 66, 80, 0.6); }
.deck__novo { aspect-ratio: 1.586; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; border: 2px dashed var(--borda-forte); background: var(--cartao);
  color: var(--texto-leve); font-weight: 650; border-radius: 16px; }
.deck__novo .ic { width: 30px; height: 30px; }
.deck__c.is-novo .cv__foto, .deck__c.is-novo .cv { animation: mc-novo 1.8s ease-out; }
.deck__pontos { position: relative; z-index: 2; display: flex; justify-content: center; gap: 4px; margin-top: -10px; } /* acima da sobra do trilho: senão a bolinha não recebe o toque */
.deck__ponto { width: 22px; height: 22px; padding: 0; border: 0; background: none; display: grid; place-items: center; }
.deck__ponto::before { content: ''; width: 8px; height: 8px; border-radius: 4px; background: var(--borda-forte); transition: width 0.2s ease, background 0.2s ease; }
.deck__ponto[aria-current="true"]::before { width: 20px; background: var(--azul-800); }
.soma { display: flex; align-items: center; gap: 14px; width: 100%; text-align: left; color: var(--texto); padding: 14px 16px; border-radius: 20px;
  border: 1px solid color-mix(in srgb, #f08a2c 30%, var(--borda)); background: linear-gradient(135deg, #fff 0%, #fff7ee 100%); box-shadow: 0 8px 20px rgba(240, 138, 44, 0.12); }
.soma .tile { width: 48px; height: 48px; }
.soma .tile .ic { width: 26px; height: 26px; }
.soma__txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.soma__txt small { font-weight: 700; font-size: 0.8rem; color: var(--laranja-texto); }
.soma__txt strong { font-size: 1.05rem; }
.soma__txt strong b { font-family: var(--fonte-titulo); font-size: 1.3rem; }
.soma__txt > span { color: var(--texto-leve); font-size: 0.84rem; }
@media (min-width: 900px) { .deck { max-width: 380px; } }
.capa__nome { font: inherit; color: inherit; background: none; border: 0; padding: 0; text-decoration: underline; text-decoration-style: dashed; text-decoration-thickness: 1.5px; text-underline-offset: 4px; cursor: pointer; }

/* ===== Acabamento Private (Évili, 15/10, rodada 3 opção B, ícones da rodada 4 estilo 1): marinho profundo com fio
   dourado; ícones em traço fino, marinho, com contorno dourado no lugar do bloco de cor; títulos de seção em versalete
   espaçado; números em serifa. O laranja da marca fica só no logo: os tokens --laranja-* passaram a ser o ouro. ===== */
:root { --marinho: #0e1b34; --marinho-2: #1d2f55; --ouro: #c9a768; --ouro-claro: #e9d6a8; --ouro-txt: #9a7a3f; --ouro-fio: #e9d6a8;
  --laranja-400: var(--ouro); --laranja-600: #a8844f; --laranja-texto: var(--ouro-txt); --laranja-100: #f6efe0; }
.tile, .ilustra--icone { background: transparent; box-shadow: none; border: 1px solid var(--ouro-fio); color: var(--marinho); border-radius: 14px; }
.tile--p { border-radius: 11px; }
.tile--g { border-radius: 18px; }
.ic { stroke-width: 0; }
.am i { color: var(--marinho); background: transparent; border: 1px solid var(--ouro-fio); box-shadow: none; }
.ring { --cor: var(--marinho); }
.ring--aviso { --cor: var(--ouro); }
.botao:not(.botao--linha):not(.botao--perigo) { background: var(--marinho); color: var(--ouro-claro); box-shadow: 0 8px 18px rgba(14, 27, 52, 0.22); }
.botao:not(.botao--linha):not(.botao--perigo):hover { background: var(--marinho-2); }
.fab { background: radial-gradient(circle at 30% 25%, var(--marinho-2), var(--marinho)); color: var(--ouro-claro); box-shadow: 0 0 0 1.5px var(--ouro), 0 10px 22px rgba(14, 27, 52, 0.35); }
.meus__cab h2, .progs h2 { font-size: 0.74rem; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--marinho); }
.meus__cab .link { color: var(--marinho); font-size: 0.82rem; font-weight: 600; text-decoration-color: var(--ouro-fio); }
.capa__ola { color: var(--ouro-txt); font-style: italic; }
.capa .capa__titulo { color: var(--marinho); }
.capa__btn, .capa__avatar { border: 1px solid var(--ouro-fio); color: var(--marinho); box-shadow: none; }
.capa__ponto { background: var(--ouro); color: var(--marinho); }
.capa__app span { font-weight: 600; }
.capa__app img { border-radius: 18px; }
.deck__pill { background: rgba(14, 27, 52, 0.72); border-color: rgba(201, 167, 104, 0.8); }
.deck__pill b { color: var(--ouro-claro); }
.deck__ponto[aria-current="true"]::before { background: var(--marinho); }
.soma { background: radial-gradient(120% 140% at 100% 0%, var(--marinho-2), var(--marinho) 60%); border: 1px solid rgba(201, 167, 104, 0.55); color: #fff; box-shadow: 0 14px 30px rgba(14, 27, 52, 0.28); }
.soma .tile { border-color: rgba(201, 167, 104, 0.6); color: var(--ouro-claro); }
.soma__txt small { color: var(--ouro); letter-spacing: 0.18em; text-transform: uppercase; font-size: 0.7rem; }
.soma__txt strong { color: #fff; }
.soma__txt strong b { color: var(--ouro-claro); font-size: 1.6rem; }
.soma__txt > span { color: #b9c3d6; }
/* Menu de baixo: o item ativo vira o botão marinho com o ícone dourado; os outros ficam só no traço */
@media (max-width: 899px) {
  .barra-aluno__item .ic { width: 24px; height: 24px; padding: 0; transition: background 0.2s ease, color 0.2s ease; }
  .barra-aluno__item.is-ativo { color: var(--marinho); }
  .barra-aluno__item.is-ativo .ic { box-sizing: content-box; padding: 7px 12px; margin-block: -7px -2px; border-radius: 14px; color: var(--ouro-claro);
    background: var(--marinho); box-shadow: 0 6px 14px rgba(14, 27, 52, 0.25); }
}
@media (min-width: 900px) {
  .barra-aluno__item.is-ativo { background: var(--marinho); }
  .barra-aluno__item.is-ativo .ic { color: var(--ouro-claro); }
  .fab { border-radius: 999px; }
}
/* Bloco da soma (15/10): da largura do cartão, mais baixo e com tudo centralizado */
.soma { width: 100%; max-width: 330px; margin-inline: auto; justify-content: center; text-align: center; padding: 12px 18px 13px; border-radius: 18px; }
.soma__txt { align-items: center; gap: 0; }
.soma__txt small { display: inline-flex; align-items: center; gap: 6px; }
.soma__txt small .ic { width: 16px; height: 16px; color: var(--ouro-claro); }
.soma__txt strong { font-size: 1rem; line-height: 1.3; }
.soma__txt strong b { font-size: 1.45rem; }
.soma__txt > span { font-size: 0.8rem; }
@media (min-width: 900px) { .soma { max-width: 380px; } }
/* Títulos de seção em negrito; "Apps dos programas" centralizado e mais afastado do bloco da soma (15/10) */
.meus__cab h2, .progs h2 { font-weight: 700; font-size: 0.82rem; letter-spacing: 0.16em; }
.progs { padding-top: 34px; }
.progs h2 { text-align: center; }
/* Soma ainda mais baixa e um pouco mais larga que o maço; "Apps dos programas" sem título, só os ícones (15/10) */
.soma { max-width: 350px; padding: 9px 18px 10px; }
.soma__txt strong { line-height: 1.2; }
.soma__txt strong b { font-size: 1.35rem; }
.progs { padding-top: 38px; } /* um pouco mais abaixo da soma (15/10) */
/* Telas baixas (iPhone SE, 667 px de altura): o início inteiro cabe acima do menu de baixo (15/10). Os maiores não mudam. */
@media (max-width: 899px) and (max-height: 820px) { .progs { padding-top: 24px; } } /* iPhone mini: mais folga acima do menu */
@media (max-width: 899px) and (max-height: 760px) {
  .capa { padding-bottom: 62px; }
  .capa__marca img { height: 32px; }
  .capa__btn, .capa__avatar { width: 38px; height: 38px; }
  .capa__ola { margin-top: 4px; font-size: 1.05rem; }
  .capa .capa__titulo { font-size: 1.42rem; max-width: 14ch; }
  .meus { gap: 8px; margin-top: -52px; }
  .deck { max-width: 262px; padding-top: 12px; }
  .deck__trilho { padding-bottom: 28px; }
  .deck__pontos { margin-top: -14px; }
  .deck__ponto { height: 18px; }
  .soma { padding: 6px 14px 7px; }
  .soma__txt strong b { font-size: 1.2rem; }
  .soma__txt strong { font-size: 0.92rem; }
  .progs { padding-top: 16px; }
  .capa__app { font-size: 0.68rem; gap: 5px; }
  .capa__app img { width: 50px; height: 50px; border-radius: 14px; }
}

/* ===== Salas como cartão de embarque (Évili, 15/10, rodada 5 opção A): foto própria no topo, busca em pílula, bilhete
   com aeroporto, bandeira (maior, centralizada) e país à esquerda, picote, detalhes à direita e "Entra com" embaixo ===== */
body.em-salas { background: var(--cartao); }
.s-capa { position: relative; isolation: isolate; overflow: hidden; display: flex; flex-direction: column; gap: 2px;
  margin: calc(-18px - env(safe-area-inset-top, 0px)) calc(-1 * var(--gutter)) 0; padding: calc(22px + env(safe-area-inset-top, 0px)) var(--gutter) 30px; }
.s-capa__foto { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: 60% 45%; z-index: -2; }
.s-capa::before { content: ''; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.6) 58%, rgba(255, 255, 255, 0.18)), linear-gradient(0deg, #fff 0%, rgba(255, 255, 255, 0) 48%); }
.s-capa__rot { font-size: 0.74rem; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ouro-txt); }
.s-capa h1 { font-family: var(--fonte-titulo); font-weight: 600; font-size: clamp(1.6rem, 6.6vw, 2rem); line-height: 1.1; color: var(--marinho); max-width: 13ch; }
.s-capa p { margin-top: 6px; color: var(--texto-leve); font-size: 0.9rem; max-width: 26ch; }
.busca { display: flex; align-items: center; gap: 10px; max-width: none; border: 1px solid var(--ouro-fio); border-radius: 999px; padding: 4px 16px; background: var(--cartao); color: var(--marinho); }
.busca .ic { width: 20px; height: 20px; flex: none; }
.busca input { border: 0; padding: 9px 0; background: none; font: inherit; }
.busca input:focus { box-shadow: none; }
.busca:focus-within { box-shadow: 0 0 0 3px var(--laranja-100); }
.salas-filtros { display: flex; align-items: center; gap: 8px; }
.salas-filtros .abas-salas { flex: none; }
.aba-sala { white-space: nowrap; }
.aba-sala.is-ativa { background: var(--marinho); border-color: var(--marinho); color: var(--ouro-claro); }
.aba-sala.is-ativa .aba-sala__n { background: rgba(233, 214, 168, 0.18); color: var(--ouro-claro); }
.salvar-sala { margin-left: auto; display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; border: 1px solid var(--ouro-fio); border-radius: 999px;
  padding: 7px 12px; background: none; color: var(--ouro-txt); font-weight: 600; font-size: 0.86rem; min-height: 36px; }
.salvar-sala .ic { width: 16px; height: 16px; }
.lista-salas { display: grid; gap: 14px; grid-template-columns: 1fr; }
@media (min-width: 700px) { .lista-salas { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.sala-c { position: relative; min-width: 0; border: 1px solid #e6e9f0; border-radius: 18px; background: var(--cartao); box-shadow: 0 10px 26px rgba(14, 27, 52, 0.07); overflow: hidden; }
.sala-c__main { display: grid; grid-template-columns: 88px minmax(0, 1fr); width: 100%; padding: 0; border: 0; background: none; text-align: left; color: var(--texto); position: relative; }
.sala-c__main::before, .sala-c__main::after { content: ''; position: absolute; left: 80px; width: 16px; height: 16px; border-radius: 50%; background: var(--cartao); border: 1px solid #e6e9f0; }
.sala-c__main::before { top: -9px; } .sala-c__main::after { bottom: -9px; }
.sala-c__ap { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; padding: 14px 6px; border-right: 1.5px dashed #e3d6b8; text-align: center; }
.sala-c__iata { font-family: var(--fonte-titulo); font-weight: 600; font-size: 1.55rem; line-height: 1; letter-spacing: 0.02em; color: var(--marinho); }
.sala-c__bandeira { font-size: 1.75rem; line-height: 1.1; }
.sala-c__pais { font-size: 0.6rem; letter-spacing: 0.12em; text-transform: uppercase; font-weight: 700; color: var(--ouro-txt); line-height: 1.25; }
.sala-c__info { display: flex; flex-direction: column; gap: 6px; padding: 14px 44px 14px 14px; min-width: 0; }
.sala-c__nome { font-weight: 650; font-size: 1rem; line-height: 1.3; color: var(--marinho); overflow-wrap: anywhere; }
.sala-c__onde { display: flex; align-items: center; gap: 7px; color: var(--texto-leve); font-size: 0.82rem; line-height: 1.35; }
.sala-c__logo { width: 22px; height: 22px; border-radius: 6px; object-fit: cover; flex: none; box-shadow: 0 0 0 1px rgba(14, 27, 52, 0.08); }
.sala-c .am { margin-top: 2px; }
.sala-c .am i { padding: 5px; }
.sala-c__entra { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 10px 16px 12px; background: #f7f8fb; border-top: 1px solid #eef0f5; margin: 0; }
.sala-c__entra small { font-size: 0.64rem; letter-spacing: 0.16em; text-transform: uppercase; font-weight: 700; color: var(--texto-leve); margin-right: 2px; }
.sala-c__entra em { font-style: normal; font-size: 0.8rem; color: var(--texto-leve); }
.sala-c__cartao { position: relative; width: 46px; flex: none; }
.sala-c__cartao .cv { width: 100%; }
.sala-c__cartao b { position: absolute; right: -7px; top: -7px; min-width: 19px; height: 19px; padding: 0 5px; border-radius: 10px; display: grid; place-items: center; font-size: 0.66rem;
  background: var(--marinho); color: var(--ouro-claro); border: 1.5px solid #fff; }
.sala-c__cartao b.zero { background: var(--erro); color: #fff; }
.sala-c .fav { position: absolute; top: 8px; right: 8px; margin: 0; color: var(--ouro); }
.sala-c .fav--off { color: #d6dbe5; }
@media (min-width: 900px) { .s-capa { margin: 0; border-radius: 26px; padding: 26px 32px 30px; } body.em-salas { background: var(--fundo); } }
/* Detalhe da sala: o mesmo bilhete, sem o rodapé */
.sala-det { display: grid; grid-template-columns: 88px minmax(0, 1fr); border: 1px solid #e6e9f0; border-radius: 18px; overflow: hidden; }
.sala-det__txt { display: flex; flex-direction: column; gap: 6px; padding: 14px; min-width: 0; }
.sala-det__txt h3 { font-size: 1.05rem; color: var(--marinho); line-height: 1.3; }
.sala-det__txt small { color: var(--texto-leve); font-size: 0.82rem; }
.s-capa p { max-width: 30ch; }
/* Salas: o mesmo respiro entre busca, filtros e o primeiro bilhete que há entre um bilhete e outro (15/10) */
body.em-salas #app { display: flex; flex-direction: column; gap: 14px; }
body.em-salas .s-capa { margin-bottom: -6px; }

/* ===== Registrar visita "em um toque" (Évili, 15/10, rodada 6 opção D, com aeroporto, data e pessoas editáveis) ===== */
.vt__rot { font-size: 0.66rem; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ouro-txt); margin: 0; }
.vt { border-radius: 22px; padding: 16px; border: 1px solid var(--ouro-fio); background: linear-gradient(160deg, #fff, #fbf6ea); display: flex; flex-direction: column; gap: 14px;
  box-shadow: 0 12px 28px rgba(14, 27, 52, 0.08); }
.vt.troca { animation: saldo-troca 0.35s ease-out; }
.vt__cartao { display: grid; grid-template-columns: 96px minmax(0, 1fr); align-items: center; gap: 14px; }
.vt__cartao .cv { width: 96px; }
.vt__cartao .cv__foto { box-shadow: 0 8px 18px rgba(14, 27, 52, 0.2); }
.vt__cartao strong { display: block; font-family: var(--fonte-titulo); font-weight: 600; font-size: 1.3rem; line-height: 1.15; color: var(--marinho); }
.vt__cartao small { color: var(--texto-leve); font-size: 0.84rem; }
.vt__lin { display: flex; flex-direction: column; gap: 8px; padding-top: 12px; border-top: 1px solid #efe6d2; }
.vt__r { font-size: 0.62rem; letter-spacing: 0.16em; text-transform: uppercase; font-weight: 700; color: #8a93a4; display: flex; gap: 8px; align-items: baseline; }
.vt__r b { font-size: 0.8rem; letter-spacing: 0; text-transform: none; color: var(--marinho); font-weight: 650; }
.vt .chips { gap: 6px; }
.vt .chip { background: #fff; border-color: #e8dfcc; color: var(--marinho); padding: 7px 12px; font-weight: 700; display: inline-flex; align-items: center; gap: 5px; }
.vt .chip span { font-size: 1rem; line-height: 1; }
.vt .chip.is-on { background: var(--marinho); border-color: var(--marinho); color: var(--ouro-claro); }
.vt #f_airport, .vt #f_date { width: 100%; border: 1px solid #e8dfcc; border-radius: 12px; padding: 10px 12px; font: inherit; background: #fff; color: var(--texto); }
.vt .contador__b { background: #fff; border-color: var(--ouro-fio); color: var(--marinho); width: 40px; height: 40px; }
.vt .campo .contador input { font-size: 1.7rem; width: 52px; color: var(--marinho); }
.vt .efeito { background: rgba(255, 255, 255, 0.7); border-color: #efe6d2; }
.vt .efeito .ic { color: var(--ouro); }
.vt .botao--largo { width: 100%; }
.vt__outros { display: grid; gap: 8px; }
.vt__outro { display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 9px 12px; border-radius: 14px; border: 1px solid #e6e9f0;
  background: var(--cartao); text-align: left; color: var(--marinho); font-weight: 600; font-size: 0.9rem; }
.vt__outro .cv { width: 52px; }
.vt__outro em { font-style: normal; color: var(--texto-leve); font-weight: 500; font-size: 0.8rem; white-space: nowrap; }
.vt__outro:hover { border-color: var(--ouro-fio); }
.vt__pe { display: flex; justify-content: center; gap: 24px; margin-top: 14px; }
.vt__pe .link { font-weight: 600; color: var(--texto-leve); }
.vt__pe .link--erro { color: var(--erro); }

.mais-detalhes summary { color: var(--marinho); }

/* ===== Estatísticas "Seu ano em salas" (Évili, 15/10, rodada 7 opção C) ===== */
body.em-stats { background: var(--cartao); }
body.em-stats #app { display: flex; flex-direction: column; gap: 16px; }
.stats-cab { display: flex; flex-direction: column; gap: 2px; }
.stats-cab h1 { font-family: var(--fonte-titulo); font-weight: 600; font-size: clamp(1.6rem, 6.6vw, 2rem); line-height: 1.1; color: var(--marinho); }
.ano-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.stats-frase { font-family: var(--fonte-titulo); font-weight: 600; font-size: 1.45rem; line-height: 1.25; color: var(--marinho); text-wrap: balance; }
.stats-frase b { color: var(--ouro-txt); font-weight: 600; }
.stats-h2 { font-size: 0.8rem; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: var(--marinho); margin-bottom: -4px; }
.stats-graf { border: 1px solid #e6e9f0; border-radius: 20px; padding: 16px 14px 10px; }
.stats-graf .stats-h2 { margin-bottom: 0; }
.stats-barras { display: grid; align-items: end; gap: 6px; height: 120px; margin-top: 10px; }
.stats-barras div { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 4px; height: 100%; min-width: 0; }
.stats-barras i { width: 100%; max-width: 34px; border-radius: 5px 5px 2px 2px; background: #eef1f7; min-height: 4px; }
.stats-barras i.v { background: linear-gradient(180deg, var(--ouro), var(--marinho-2)); }
.stats-barras small { font-size: 0.64rem; color: #8a93a4; font-weight: 600; }
.stats-barras b { font-size: 0.7rem; color: var(--marinho); }
.stats-num { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.stats-num .st { border: 1px solid var(--ouro-fio); border-radius: 14px; padding: 10px 4px; display: flex; flex-direction: column-reverse; align-items: center; gap: 2px; }
.stats-num .st b { font-family: var(--fonte-titulo); font-size: 1.5rem; color: var(--marinho); line-height: 1.1; }
.stats-num .st small { font-size: 0.56rem; letter-spacing: 0.1em; text-transform: uppercase; font-weight: 700; color: #8a93a4; }
.top-p { display: flex; gap: 8px; flex-wrap: wrap; }
.top-p__it { display: inline-flex; align-items: baseline; gap: 6px; padding: 7px 12px; border-radius: 999px; background: #f7f8fb; border: 1px solid #eef0f5; }
.top-p__it > span { font-size: 1.05rem; align-self: center; }
.top-p__it strong { font-size: 0.88rem; color: var(--marinho); font-weight: 650; }
.top-p__it b { font-family: var(--fonte-titulo); color: var(--ouro-txt); font-size: 1rem; }
.top-p__it small { font-size: 0.74rem; color: #8a93a4; }
.vb-lista { display: flex; flex-direction: column; gap: 8px; }
.vb-lista .tl__mes { padding: 6px 2px 0; }
.vb { display: grid; grid-template-columns: 64px minmax(0, 1fr) 42px auto; align-items: center; gap: 12px; width: 100%; padding: 0 12px 0 0; border: 1px solid #e6e9f0; border-radius: 14px;
  background: var(--cartao); text-align: left; color: var(--texto); overflow: hidden; }
.vb:hover { border-color: var(--ouro-fio); }
.vb__ap { display: flex; flex-direction: column; align-items: center; padding: 10px 0; border-right: 1.5px dashed #e3d6b8; }
.vb__ap b { font-family: var(--fonte-titulo); font-weight: 600; font-size: 1.05rem; color: var(--marinho); }
.vb__ap span { font-size: 1.2rem; line-height: 1.1; }
.vb__txt { min-width: 0; }
.vb__txt strong { display: block; font-size: 0.9rem; color: var(--marinho); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vb__txt small { display: block; color: var(--texto-leve); font-size: 0.76rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vb .cv { width: 42px; }
.vb em { font-style: normal; font-size: 0.76rem; font-weight: 700; color: var(--marinho); background: var(--azul-100); border-radius: 999px; padding: 2px 8px; }
@media (min-width: 900px) { body.em-stats { background: var(--fundo); } }


/* ===== Conta e backup (15/10): tela de entrada e estado do backup no Perfil ===== */
body.sem-sessao .barra-aluno, body.sem-sessao .lateral-aluno { display: none; }
body.sem-sessao .tela-aluno { padding-bottom: 0; }
@media (min-width: 900px) { body.sem-sessao .shell-aluno { grid-template-columns: 1fr; } }
.entrar { width: 100%; max-width: 420px; margin: 0 auto; padding-block: 28px 40px; display: flex; flex-direction: column; gap: 14px; }
.entrar__marca { width: 150px; margin-bottom: 18px; }
.entrar h1 { font-family: var(--fonte-titulo); font-weight: 600; font-size: 2rem; line-height: 1.1; color: var(--marinho); }
.entrar__sub { color: var(--texto-leve); margin-top: -4px; }
.entrar .grade-campos { margin-top: 6px; }
.entrar input { border-radius: 14px; }
.entrar .link--centro { align-self: center; font-weight: 650; color: var(--marinho); }
.entrar .nota { text-align: center; }
.alerta--info { background: var(--azul-100); color: var(--marinho); border-radius: 12px; padding: 10px 14px; }
.conta__email { font-weight: 650; color: var(--marinho); margin-top: -4px; }
.nuvem { display: flex; gap: 10px; align-items: flex-start; border-radius: 14px; padding: 10px 12px; background: var(--cartao-2); border: 1px solid var(--borda); color: var(--texto); font-size: 0.88rem; line-height: 1.4; }
.nuvem .ic { width: 20px; height: 20px; flex: none; margin-top: 1px; }
.nuvem--ok { border-color: color-mix(in srgb, var(--ok) 30%, transparent); } .nuvem--ok .ic { color: var(--ok); }
.nuvem--offline, .nuvem--erro { border-color: var(--ouro-fio); background: #fbf6ea; } .nuvem--offline .ic, .nuvem--erro .ic { color: var(--ouro-txt); }
.nuvem--enviando .ic { color: var(--marinho); animation: girar 1s linear infinite; }
@keyframes girar { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .nuvem--enviando .ic { animation: none; } }

/* Convites pelo app (só para quem administra) */
.adm .botao--largo { margin-top: 4px; }
.adm__area { display: flex; flex-direction: column; gap: 8px; margin-top: 6px; }
.adm__h { font-size: 0.74rem; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: var(--marinho); margin-top: 8px; display: flex; gap: 8px; align-items: center; }
.adm__h span { font-size: 0.72rem; background: var(--laranja-100); color: var(--ouro-txt); border-radius: 6px; padding: 0 7px; letter-spacing: 0; }
.adm__lista { list-style: none; margin: 0; padding: 0; }
.adm__lista li { display: flex; align-items: center; gap: 10px; padding: 10px 0; border-top: 1px solid var(--borda); }
.adm__lista li > span { flex: 1; min-width: 0; }
.adm__lista strong { display: block; font-size: 0.92rem; color: var(--marinho); overflow-wrap: anywhere; }
.adm__lista small { display: block; color: var(--texto-leve); font-size: 0.78rem; overflow-wrap: anywhere; }
.adm__lista em { font-style: normal; font-size: 0.76rem; color: var(--ouro-txt); font-weight: 700; }
.adm__lista .link { min-height: 0; padding: 4px 0; font-weight: 650; }
.conv { display: flex; flex-direction: column; gap: 10px; }
.conv__cod { font-family: var(--fonte-titulo); font-weight: 600; font-size: 2.2rem; letter-spacing: 0.08em; color: var(--marinho); }
.conv__link { font-size: 0.8rem; color: var(--texto-leve); background: var(--cartao-2); border: 1px solid var(--borda); border-radius: 12px; padding: 10px 12px; overflow-wrap: anywhere; user-select: all; }

/* ===== iPhone de verdade (Évili, 15/10: "a página fica movimentando para os lados" e os apps abaixo do enquadramento) =====
   1) Campo com letra menor que 16 px faz o Safari dar zoom ao tocar, e a página passa a escorregar de lado: todos os campos
      com pelo menos 16 px. 2) A página nunca é mais larga que a tela. 3) Telas até 940 px de altura (16, 16 Pro, mini),
      contando a faixa da câmera e a da barra de gestos: peças do início um pouco mais compactas para tudo caber. */
input, select, textarea { font-size: max(16px, 1em); }
.busca input, .vt #f_airport, .vt #f_date, .entrar input, #f_emailConvite { font-size: 16px; }
html, body { overflow-x: clip; overscroll-behavior-x: none; }
@media (max-width: 899px) and (max-height: 940px) {
  .capa { padding-bottom: 70px; }
  .capa__ola { margin-top: 6px; }
  .capa .capa__titulo { font-size: clamp(1.45rem, 6vw, 1.7rem); max-width: 14ch; }
  .meus { margin-top: -54px; gap: 10px; }
  .deck { max-width: 286px; padding-top: 12px; }
  .deck__trilho { padding-bottom: 30px; }
  .soma { padding: 7px 16px 8px; }
  .soma__txt strong b { font-size: 1.25rem; }
  .progs { padding-top: 22px; }
  .capa__app { gap: 5px; font-size: 0.72rem; }
  .capa__app img { width: 54px; height: 54px; border-radius: 15px; }
}
@media (max-width: 899px) and (max-height: 830px) { /* iPhone mini e telas parecidas */
  .deck { max-width: 270px; }
  .capa .capa__titulo { font-size: 1.42rem; }
  .progs { padding-top: 18px; }
}
@media (max-width: 899px) and (max-height: 760px) { /* iPhone SE: vence as regras acima */
  .capa { padding-bottom: 62px; }
  .capa__ola { margin-top: 4px; font-size: 1.05rem; }
  .capa .capa__titulo { font-size: 1.36rem; max-width: 15ch; }
  .meus { gap: 8px; margin-top: -52px; }
  .deck { max-width: 240px; padding-top: 10px; }
  .deck__trilho { padding-bottom: 26px; }
  .soma { padding: 6px 14px 7px; }
  .progs { padding-top: 14px; }
  .capa__app { font-size: 0.66rem; gap: 4px; }
  .capa__app img { width: 46px; height: 46px; border-radius: 13px; }
}