/* Glass · base da página do celular. Cores, fontes e movimento vêm de tokens.css (cópia de marca/).
   Geist no texto, Instrument Serif itálico nos títulos, Geist Mono nos dados. Tudo local: nada é buscado fora. */
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html { -webkit-text-size-adjust: 100%; }
html, body { margin: 0; background: var(--glass-fundo); color: var(--glass-texto-1); font-family: var(--glass-fonte-texto);
  font-size: 15px; line-height: 1.5; -webkit-font-smoothing: antialiased; }
h1, h2, h3, p, ol { margin: 0; }
[hidden] { display: none !important; }
::selection { background: #17324e; color: var(--glass-gelo); }
:focus-visible { outline: none; box-shadow: var(--glass-anel-foco); border-radius: 8px; }

.rotulo { font-family: var(--glass-fonte-mono); font-size: var(--glass-tipo-mini); letter-spacing: 0.14em; text-transform: uppercase; color: var(--glass-texto-3); }
.ponto { width: 8px; height: 8px; border-radius: 50%; background: var(--glass-ao-vivo); box-shadow: 0 0 10px rgba(120, 217, 176, 0.7); flex: none; }
.ponto.apagado { background: var(--glass-texto-3); box-shadow: none; }
.ponto.aviso { background: var(--glass-aviso); box-shadow: 0 0 10px rgba(242, 193, 78, 0.55); }
.ponto.erro { background: var(--glass-erro); box-shadow: 0 0 10px rgba(255, 138, 127, 0.55); }
.titulo { font-family: var(--glass-fonte-nome); font-style: italic; font-weight: 400; letter-spacing: -0.01em; line-height: 1.05; }
.mono { font-family: var(--glass-fonte-mono); font-variant-numeric: tabular-nums; }

.botao { appearance: none; -webkit-appearance: none; border: 0; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  font: 600 16px/1 var(--glass-fonte-texto); min-height: 48px; padding: 0 22px; border-radius: var(--glass-raio-pilula);
  background: var(--glass-botao); color: var(--glass-sobre-botao);
  transition: transform var(--glass-dur-instante) var(--glass-curva-saida), opacity var(--glass-dur-rapida) var(--glass-curva-saida), background var(--glass-dur-rapida) ease; }
.botao:active { transform: scale(0.97); }
.botao[disabled] { opacity: 0.45; cursor: default; }
.botao.sec { background: transparent; color: var(--glass-texto-1); border: 1px solid var(--glass-linha-forte); font-weight: 500; }
.botao.largo { width: 100%; }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }