/* BASE-00 · reset, tokens da marca OwnedTools (fonte: ../owned-tools/site/src/styles/base.css) e regras comuns */
:root {
  --violeta: #792AFF; --violeta-claro: #a578ff; --lilas: #e9e0ff; --papel: #F7F5FF;
  --tinta: #090910; --grafite: #171525; --painel: #120f20; --cinza: #a49ec0; --ok: #5ee6a8;
  --gutter: clamp(16px, 4vw, 56px);
}
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; }
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: hidden; }
body { min-height: 100vh; overflow-x: hidden; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
img, video, canvas { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }

/* palco 3D fixo atrás do conteúdo */
.palco { position: fixed; inset: 0; width: 100vw; height: 100vh; height: 100lvh; z-index: 0; pointer-events: none; }
main, header, footer, section { position: relative; z-index: 1; }

/* acessibilidade */
.so-leitor { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
:focus-visible { outline: 2px solid var(--violeta); outline-offset: 4px; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; } }

/* sem WebGL: some o palco, o conteúdo continua inteiro */
.sem-webgl .palco { display: none; }
.sem-webgl .so-3d { display: none; }

/* carregador */
.carregando { position: fixed; inset: 0; z-index: 50; display: grid; place-items: center; background: var(--papel); transition: opacity .8s, visibility .8s; }
.carregando.saiu { opacity: 0; visibility: hidden; }

/* aviso de compliance (docs/07-compliance.md) */
.aviso { font-size: 12px; opacity: .55; max-width: 70ch; line-height: 1.6; }
.fontes { margin: 14px 0 0 18px; font-size: 12px; line-height: 1.7; opacity: .7; max-width: 90ch; }
.fontes b { font-weight: 800; }
.fontes a { text-decoration: underline; text-underline-offset: 2px; }

/* MX-01 · logo: coroa + "Owned" na cor do texto + "Tools" em violeta */
.marca { display: inline-flex; align-items: center; gap: 10px; font-weight: 700; letter-spacing: -.01em; font-size: 17px; }
.marca img { width: 34px; height: auto; }
.marca b { color: var(--violeta); font-weight: 700; }