:root {
  --bg: #0a0b0c; --bg2: #101214; --bg3: #16191c; --linha: rgba(255, 255, 255, .09); --linha2: rgba(255, 255, 255, .18);
  --txt: #eceef0; --mudo: #949ba3; --latao: #c8a15a; --latao2: #e6c98b; --verde: #4fbf7a; --ambar: #e0a93b; --verm: #e05757; --azul: #6aa7e8;
  --raio: 14px; --barra: 62px;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--bg); color: var(--txt); font: 400 16px/1.5 system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
h1, h2, h3, p { margin: 0; }
h1 { font-size: 22px; line-height: 1.2; }
h2 { font-size: 18px; line-height: 1.25; }
h3 { font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: var(--latao); font-weight: 700; }
a { color: var(--latao2); }
button, input, textarea, select { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--latao); outline-offset: 2px; border-radius: 6px; }
[hidden] { display: none !important; }
.carga { padding: 40vh 20px 0; text-align: center; color: var(--mudo); }
.mudo { color: var(--mudo); font-size: 14px; }

/* entrada */
.porta { min-height: 100dvh; display: grid; place-items: center; padding: 24px 16px calc(24px + env(safe-area-inset-bottom)); }
.cartao { width: 100%; max-width: 420px; background: var(--bg2); border: 1px solid var(--linha); border-radius: var(--raio); padding: 26px 22px; display: grid; gap: 16px; }
.marca { display: flex; align-items: center; gap: 12px; }
.marca img { width: 38px; height: auto; }
.marca b { display: block; font-size: 15px; letter-spacing: .16em; text-transform: uppercase; }
.marca small { display: block; color: var(--latao); font-size: 11px; letter-spacing: .22em; text-transform: uppercase; }
form { display: grid; gap: 14px; }
label { display: grid; gap: 6px; font-size: 13px; color: var(--mudo); }
input, textarea, select { width: 100%; background: var(--bg); border: 1px solid var(--linha2); border-radius: 10px; padding: 12px 13px; color: var(--txt); font-size: 16px; }
textarea { resize: vertical; min-height: 76px; }
input:focus, textarea:focus { border-color: var(--latao); outline: none; }
.codigo { font-size: 24px; letter-spacing: .3em; text-align: center; font-variant-numeric: tabular-nums; }
.bt { border: 1px solid var(--linha2); background: var(--bg3); border-radius: 10px; padding: 12px 16px; font-weight: 700; cursor: pointer; text-align: center; text-decoration: none; color: var(--txt); display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px; }
.bt-1 { background: linear-gradient(180deg, var(--latao2), var(--latao)); color: #171208; border-color: transparent; }
.bt:disabled { opacity: .55; cursor: default; }
.bt-link { background: none; border: 0; color: var(--latao2); padding: 6px 0; cursor: pointer; text-decoration: underline; font-size: 14px; justify-self: start; }
.erro { color: #ffb4b4; background: rgba(224, 87, 87, .12); border: 1px solid rgba(224, 87, 87, .4); border-radius: 10px; padding: 10px 12px; font-size: 14px; }
.certo { color: #bff0d0; background: rgba(79, 191, 122, .12); border: 1px solid rgba(79, 191, 122, .4); border-radius: 10px; padding: 10px 12px; font-size: 14px; }
.passos { display: grid; gap: 8px; padding-left: 20px; margin: 0; font-size: 14px; color: var(--mudo); }
.qr { background: #fff; border-radius: 12px; padding: 12px; justify-self: center; }
.qr canvas { display: block; width: 196px; height: 196px; image-rendering: pixelated; }
.segredo { font: 600 14px/1.6 ui-monospace, Menlo, Consolas, monospace; background: var(--bg); border: 1px dashed var(--linha2); border-radius: 10px; padding: 10px 12px; text-align: center; word-spacing: .2em; user-select: all; -webkit-user-select: all; }
.reservas { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; font: 600 15px/1 ui-monospace, Menlo, Consolas, monospace; }
.reservas span { background: var(--bg); border: 1px solid var(--linha); border-radius: 8px; padding: 10px 6px; text-align: center; }

/* painel */
.topo { position: sticky; top: 0; z-index: 5; background: rgba(10, 11, 12, .92); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-bottom: 1px solid var(--linha); padding: 10px 16px; padding-top: calc(10px + env(safe-area-inset-top)); display: flex; align-items: center; gap: 12px; }
.topo .marca { flex: 1; min-width: 0; }
.topo .marca img { width: 28px; }
.topo .marca b { font-size: 13px; }
.topo .bt { min-height: 38px; padding: 6px 12px; font-size: 13px; }
.abas { position: fixed; left: 0; right: 0; bottom: 0; z-index: 6; display: flex; background: rgba(16, 18, 20, .97); border-top: 1px solid var(--linha); padding-bottom: env(safe-area-inset-bottom); }
.abas button { flex: 1; min-width: 0; background: none; border: 0; height: var(--barra); display: grid; place-items: center; align-content: center; gap: 4px; font-size: 11px; font-weight: 600; color: var(--mudo); cursor: pointer; position: relative; }
.abas button svg { width: 22px; height: 22px; }
.abas button[aria-current='page'] { color: var(--latao2); }
.abas button i { position: absolute; top: 8px; left: calc(50% + 6px); min-width: 18px; height: 18px; border-radius: 9px; background: var(--verm); color: #fff; font: 700 11px/18px system-ui; padding: 0 5px; }
main { max-width: 980px; margin: 0 auto; padding: 18px 16px calc(var(--barra) + 28px + env(safe-area-inset-bottom)); display: grid; gap: 18px; }
.grade { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.num { background: var(--bg2); border: 1px solid var(--linha); border-radius: var(--raio); padding: 14px; display: grid; gap: 2px; text-align: left; color: inherit; }
button.num { cursor: pointer; }
.num b { font-size: 28px; line-height: 1.1; font-variant-numeric: tabular-nums; }
.num span { font-size: 12.5px; color: var(--mudo); }
.num.alerta { border-color: var(--latao); }
.num.alerta b { color: var(--latao2); }
.caixa { background: var(--bg2); border: 1px solid var(--linha); border-radius: var(--raio); padding: 16px; display: grid; gap: 12px; min-width: 0; }
.barras { width: 100%; height: 90px; }
.barras rect { fill: var(--latao); }
.barras text { fill: var(--mudo); font-size: 9px; }
.linha { display: flex; gap: 10px; align-items: baseline; justify-content: space-between; padding: 10px 0; border-top: 1px solid var(--linha); min-width: 0; }
.linha:first-of-type { border-top: 0; }
.linha > div { min-width: 0; }
.linha b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.linha small { color: var(--mudo); font-size: 12.5px; display: block; }
.selo { font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; border-radius: 6px; padding: 3px 7px; white-space: nowrap; border: 1px solid var(--linha2); color: var(--mudo); }
.selo.novo { color: #171208; background: var(--latao); border-color: transparent; }
.selo.respondido { color: var(--azul); border-color: rgba(106, 167, 232, .5); }
.selo.aluno { color: var(--verde); border-color: rgba(79, 191, 122, .5); }
.filtros { display: flex; flex-wrap: wrap; gap: 8px; }
.filtros button { background: var(--bg2); border: 1px solid var(--linha2); border-radius: 20px; padding: 8px 13px; font-size: 13.5px; font-weight: 600; cursor: pointer; color: var(--mudo); }
.filtros button[aria-pressed='true'] { background: var(--latao); border-color: var(--latao); color: #171208; }
.recado { gap: 10px; }
.recado header { display: flex; gap: 10px; justify-content: space-between; align-items: flex-start; }
.recado header div { min-width: 0; }
.recado header b { font-size: 17px; overflow-wrap: anywhere; }
.recado .msg { white-space: pre-wrap; overflow-wrap: anywhere; background: var(--bg); border-radius: 10px; padding: 12px; font-size: 15px; }
.acoes { display: flex; flex-wrap: wrap; gap: 8px; }
.acoes .bt { flex: 1 1 130px; font-size: 14px; min-height: 42px; padding: 8px 10px; }
.breve { display: grid; gap: 6px; padding-left: 20px; margin: 0; color: var(--mudo); font-size: 14px; }
.hist { font-size: 13px; color: var(--mudo); display: grid; gap: 6px; }
.hist b { color: var(--txt); font-weight: 600; }
@media (min-width: 760px) {
  .grade { grid-template-columns: repeat(4, 1fr); }
  .abas { position: sticky; top: 59px; bottom: auto; border-top: 0; border-bottom: 1px solid var(--linha); justify-content: center; }
  .abas button { flex: 0 0 130px; height: 52px; grid-auto-flow: column; gap: 8px; font-size: 13.5px; }
  .abas button i { position: static; }
  main { padding-bottom: 40px; }
  .duas { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; align-items: start; }
}

/* fase 2: agenda e site */
html { color-scheme: dark; }
input, select, textarea { min-width: 0; }
input[type='date'], input[type='time'] { min-height: 48px; -webkit-appearance: none; appearance: none; text-align: left; }
input[type='checkbox'] { width: 22px; height: 22px; padding: 0; flex: none; accent-color: var(--latao); }
.marcar { display: flex; align-items: center; gap: 10px; color: var(--txt); font-size: 15px; }
.par { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; align-items: end; }
.par > * { min-width: 0; }
.selo.aberta { color: var(--verde); border-color: rgba(79, 191, 122, .5); }
.selo.lotada { color: var(--latao2); border-color: var(--latao); }
.selo.cancelada { color: #ffb4b4; border-color: rgba(224, 87, 87, .5); }
details.caixa summary { cursor: pointer; font-weight: 700; }

/* fase 3: alunos, pagamentos e calendario */
@media (max-width: 759px) {
  .abas button { flex: 1 1 auto; font-size: 10.5px; letter-spacing: -.02em; padding: 0 1px; }
  .abas button span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}
.topo .bt-ic { width: 40px; padding: 0; }
.topo .bt-ic svg { width: 20px; height: 20px; }
.pilha { display: grid; gap: 18px; min-width: 0; }
.pilha:empty, main > div:empty { display: none; }
.msg { white-space: pre-wrap; overflow-wrap: anywhere; background: var(--bg); border-radius: 10px; padding: 12px; font-size: 15px; }
.bloco { display: grid; gap: 8px; padding: 12px 0; border-top: 1px solid var(--linha); min-width: 0; }
.bloco .linha { padding: 0; border: 0; }
.acoes.curtas .bt { flex: 1 1 92px; font-size: 13.5px; min-height: 40px; padding: 6px 8px; }
.acoes .bt[aria-pressed='true'] { background: var(--latao); border-color: var(--latao); color: #171208; }
.linha > .bt { flex: none; min-height: 38px; padding: 6px 14px; font-size: 13.5px; align-self: center; }
.linha > .bt-link { flex: none; padding: 6px 0; }
.linha > b { white-space: nowrap; flex: none; }
button.linha.toque { width: 100%; background: none; border: 0; border-top: 1px solid var(--linha); text-align: left; cursor: pointer; color: inherit; align-items: center; }
button.linha.toque:first-child { border-top: 0; }
.seta { color: var(--mudo); font-size: 22px; line-height: 1; }
.selo.presente, .selo.pago { color: var(--verde); border-color: rgba(79, 191, 122, .5); }
.selo.inscrito { color: var(--azul); border-color: rgba(106, 167, 232, .5); }
.selo.faltou, .selo.cancelou { color: #ffb4b4; border-color: rgba(224, 87, 87, .5); }
.selo.falta { color: var(--latao2); border-color: var(--latao); }
.num b { overflow-wrap: anywhere; }
details > summary { cursor: pointer; font-weight: 600; padding: 6px 0; }
details > form { margin-top: 10px; }
input[type='search'] { -webkit-appearance: none; appearance: none; }
.cal-topo { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.cal-topo b { font-size: 17px; text-transform: capitalize; }
.cal-topo .bt { width: 48px; min-height: 44px; padding: 0; font-size: 22px; line-height: 1; }
.cal { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.cal .sem { font-size: 11px; color: var(--mudo); text-align: center; text-transform: uppercase; letter-spacing: .04em; }
.cal .dia { background: var(--bg); border: 1px solid var(--linha); border-radius: 9px; min-height: 62px; padding: 4px 3px; display: grid; align-content: start; gap: 3px; cursor: pointer; text-align: left; min-width: 0; color: inherit; }
.cal .dia > b { font-size: 13px; font-weight: 600; line-height: 1.2; padding-left: 2px; }
.cal .dia.passou > b { color: var(--mudo); }
.cal .dia.hoje { border-color: var(--latao); }
.cal .dia.hoje > b { color: var(--latao2); }
.cal .dia.sel { background: var(--bg3); border-color: var(--latao2); box-shadow: inset 0 0 0 1px var(--latao2); }
.cal .dia i { font: 700 9.5px/1.55 system-ui, sans-serif; font-style: normal; border-radius: 4px; padding: 0 3px; overflow: hidden; white-space: nowrap; min-width: 0; background: rgba(79, 191, 122, .2); color: #bff0d0; }
.cal .dia i.lotada { background: rgba(200, 161, 90, .26); color: var(--latao2); }
.cal .dia i.rascunho { background: rgba(255, 255, 255, .1); color: var(--mudo); }
.cal .dia i.cancelada { background: rgba(224, 87, 87, .16); color: #ffb4b4; text-decoration: line-through; }
.cal .dia i.mais { background: none; color: var(--mudo); }
@media (min-width: 760px) {
  .cal { gap: 6px; }
  .cal .dia { min-height: 88px; padding: 6px; }
  .cal .dia i { font-size: 11.5px; padding: 1px 5px; }
}

/* ficha completa e lista impressa */
h4.sub { margin: 10px 0 0; font-size: 13px; text-transform: uppercase; letter-spacing: .06em; color: var(--latao2); }
.folha { display: none; }
@media print {
  @page { margin: 14mm; }
  html, body { background: #fff !important; color: #000 !important; overflow: visible !important; }
  body > :not(.folha) { display: none !important; }
  .folha { display: block; font: 12pt/1.35 system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; color: #000; }
  .folha h1 { font-size: 16pt; margin: 0 0 4pt; color: #000; }
  .folha p { margin: 0 0 10pt; }
  .folha table { width: 100%; border-collapse: collapse; }
  .folha th, .folha td { border: 1px solid #000; padding: 7pt 5pt; text-align: left; vertical-align: top; font-size: 10.5pt; }
  .folha th { font-size: 9pt; text-transform: uppercase; }
  .folha td:first-child { width: 22pt; text-align: center; }
  .folha td.assina { width: 28%; height: 26pt; }
  .folha tr { break-inside: avoid; }
  .folha .rodape { margin-top: 10pt; font-size: 9pt; }
}

/* certificados */
.cert-img { display: block; width: 100%; height: auto; border-radius: 8px; border: 1px solid var(--linha); background: #f6efe2; }
.linha > .selo { align-self: center; flex: none; }
@page cert { size: landscape; margin: 6mm; }
@media print {
  .folha.cert { page: cert; }
  .folha.cert img { display: block; width: 100%; max-height: 100vh; object-fit: contain; }
}
/* conferência pública */
.confere dl { display: grid; gap: 10px; margin: 0; }
.confere dt { font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--mudo); }
.confere dd { margin: 2px 0 0; font-size: 17px; font-weight: 600; overflow-wrap: anywhere; }
.confere small { display: block; color: var(--mudo); font-weight: 400; font-size: 13px; }
.confere-cert { display: grid; gap: 12px; }
.confere-cert:empty { display: none; }
.confere-cert .bt { text-align: center; }
.chave { padding: 10px 0; border-bottom: 1px solid var(--linha, rgba(255,255,255,.08)); }
.chave .marcar { font-weight: 600; min-height: 44px; }
.linha > .bt { min-height: 44px; }
.chave p { margin: 2px 0 0 30px; font-size: 14px; }