/* Mystic Data Lab — base visual e acessibilidade
   Layout: coluna central larga, seções em faixas; marca escura por padrão, versão clara em menta.
   Contraste: todo texto normal ≥ 4.5:1 (WCAG AA). O magenta da marca (#d73cbe) só aparece
   em texto grande, bordas e elementos decorativos; em texto normal usamos a versão clara (#f07fe0). */

:root{
  --roxo-noite:#2c1e4a; --branco:#ffffff; --menta:#eaf7f6; --magenta:#d73cbe; --violeta:#6422b8;
  --bg:#2c1e4a; --surface:#372659; --surface-2:#41306a; --line:#5a4886;
  --fg:#ffffff; --muted:#d9d1ee; --accent:#f07fe0; --accent-2:#c6a6ff; --link:#f07fe0;
  --btn-a:#6422b8; --btn-b:#a0268c; --btn-fg:#ffffff;
  --focus:#ffd84d;
  --high:#ff9a8f; --high-bg:#4a2231; --mid:#ffc46b; --mid-bg:#45331f; --low:#a9d4ff; --low-bg:#26325a; --ok:#7fe0c4;
  --display:"Michroma","Manrope",ui-sans-serif,system-ui,sans-serif;
  --body:"Manrope",ui-sans-serif,system-ui,sans-serif;
  --radius:14px;
  color-scheme:dark;
}
@media (prefers-color-scheme: light){:root:not([data-theme="dark"]){
  --bg:#eaf7f6; --surface:#ffffff; --surface-2:#f5fbfa; --line:#b9d6d2;
  --fg:#2c1e4a; --muted:#4a4064; --accent:#a0268c; --accent-2:#6422b8; --link:#5a1ea6;
  --focus:#6422b8;
  --high:#b42318; --high-bg:#fde8e6; --mid:#8a4b00; --mid-bg:#fdf1dc; --low:#2d4f73; --low-bg:#e4ecf3; --ok:#0f6b52;
  color-scheme:light}}
:root[data-theme="light"]{
  --bg:#eaf7f6; --surface:#ffffff; --surface-2:#f5fbfa; --line:#b9d6d2;
  --fg:#2c1e4a; --muted:#4a4064; --accent:#a0268c; --accent-2:#6422b8; --link:#5a1ea6;
  --focus:#6422b8;
  --high:#b42318; --high-bg:#fde8e6; --mid:#8a4b00; --mid-bg:#fdf1dc; --low:#2d4f73; --low-bg:#e4ecf3; --ok:#0f6b52;
  color-scheme:light}
/* Alto contraste: vence qualquer tema */
html:root[data-contrast="alto"]{
  --bg:#000000; --surface:#000000; --surface-2:#000000; --line:#ffffff;
  --fg:#ffffff; --muted:#ffffff; --accent:#ffff00; --accent-2:#ffff00; --link:#ffff00;
  --btn-a:#000000; --btn-b:#000000; --btn-fg:#ffff00; --focus:#00ffff;
  --high:#ffffff; --high-bg:#000000; --mid:#ffffff; --mid-bg:#000000; --low:#ffffff; --low-bg:#000000; --ok:#ffffff;
  color-scheme:dark}
html:root[data-contrast="alto"] .btn{border:2px solid #ffff00}
html:root[data-contrast="alto"] .deco{display:none!important}
html:root[data-fonte="legivel"]{--display:"Atkinson Hyperlegible",ui-sans-serif,sans-serif;--body:"Atkinson Hyperlegible",ui-sans-serif,sans-serif}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
[hidden]{display:none!important}
body{margin:0;background:var(--bg);color:var(--fg);font:400 1.0625rem/1.65 var(--body);padding-block:0}
img,svg,canvas{max-width:100%}
h1,h2,h3{text-wrap:balance;margin:0;line-height:1.2}
p{margin:0}
a{color:var(--link);text-underline-offset:.2em}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:4px}
.container{max-width:1120px;margin:0 auto;padding-inline:20px}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Pular links */
.skip{position:absolute;left:12px;top:-200px;z-index:1000;display:flex;flex-direction:column;gap:6px}
.skip:focus-within{top:calc(12px + env(safe-area-inset-top,0px))}
.skip a{background:var(--fg);color:var(--bg);padding:10px 14px;border-radius:8px;font-weight:700}

/* Cabeçalho */
.site-header{border-bottom:1px solid var(--line);background:var(--bg)}
.site-header .container{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;padding-block:16px}
.wordmark{font:400 1.05rem/1 var(--display);letter-spacing:.08em;color:var(--fg);text-decoration:none;text-transform:uppercase;white-space:nowrap}
.site-nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px 8px}
.site-nav a{display:inline-flex;align-items:center;min-height:44px;padding:0 10px;color:var(--fg);text-decoration:none;font-weight:600;border-radius:8px}
.site-nav a:hover{background:var(--surface)}
.site-nav a[aria-current="page"]{text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:3px}

/* Botões */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 26px;border-radius:999px;border:0;
  background:linear-gradient(90deg,var(--btn-a),var(--btn-b));color:var(--btn-fg);font:700 1rem/1.2 var(--body);letter-spacing:.02em;text-decoration:none;cursor:pointer}
.btn:hover{filter:brightness(1.1)}
.btn.ghost{background:transparent;color:var(--fg);box-shadow:inset 0 0 0 2px var(--line)}
.btn.ghost:hover{box-shadow:inset 0 0 0 2px var(--accent)}
.btn svg{width:20px;height:20px;flex:none}

.eyebrow{font:700 .8rem/1.2 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
.muted{color:var(--muted)}

.site-footer{border-top:1px solid var(--line);padding-block:40px 120px;color:var(--muted);font-size:.95rem}
.site-footer .container{display:flex;flex-direction:column;gap:14px}

/* ===== Preferências de acessibilidade ===== */
html[data-espaco="amplo"] body{line-height:1.9!important;letter-spacing:.12em!important;word-spacing:.16em!important}
html[data-espaco="amplo"] body p, html[data-espaco="amplo"] body li{margin-bottom:1em}
html[data-links="destaque"] a{text-decoration:underline!important;text-decoration-thickness:3px!important;outline:2px dashed var(--accent);outline-offset:2px}
html[data-animacao="pausada"] *, html[data-animacao="pausada"] *::before, html[data-animacao="pausada"] *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
html[data-cursor="grande"], html[data-cursor="grande"] *{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='44' viewBox='0 0 24 24'%3E%3Cpath d='M4 2l16 10-7 1.5 4 7.5-3 1.5-4-7.5L4 20z' fill='black' stroke='white' stroke-width='1.3'/%3E%3C/svg%3E") 4 2,auto!important}

/* Botão e painel */
.a11y-fab{position:fixed;left:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:900;display:inline-flex;align-items:center;gap:8px;min-height:52px;padding:0 18px 0 14px;border-radius:999px;border:2px solid var(--fg);
  background:var(--violeta);color:#fff;font:700 .95rem var(--body);cursor:pointer;box-shadow:0 6px 20px rgba(0,0,0,.35)}
html:root[data-contrast="alto"] .a11y-fab{background:#000;color:#ffff00;border-color:#ffff00}
.a11y-fab svg{width:26px;height:26px}
@media (max-width:520px){.a11y-fab .lbl{display:none}.a11y-fab{padding:0 12px}}
.a11y-panel{position:fixed;left:16px;bottom:calc(80px + env(safe-area-inset-bottom,0px));z-index:950;width:min(380px,calc(100vw - 32px));max-height:calc(100vh - 110px);overflow:auto;
  background:var(--surface);color:var(--fg);border:2px solid var(--line);border-radius:16px;box-shadow:0 20px 50px rgba(0,0,0,.45);padding:18px;display:flex;flex-direction:column;gap:16px;font-size:1rem;letter-spacing:normal;word-spacing:normal;line-height:1.5}
.a11y-panel h2{font:700 1.15rem/1.2 var(--body)}
.a11y-panel .row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.a11y-panel .grp{display:flex;flex-direction:column;gap:8px;border:0;margin:0;padding:0}
.a11y-panel legend,.a11y-panel .grp-t{font-weight:700;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);padding:0;margin-bottom:4px}
.a11y-panel .grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.a11y-opt{display:flex;align-items:center;gap:8px;min-height:48px;padding:8px 12px;border-radius:10px;border:2px solid var(--line);background:var(--surface-2);color:var(--fg);font:600 .92rem/1.25 var(--body);cursor:pointer;text-align:left}
.a11y-opt[aria-pressed="true"]{border-color:var(--accent);background:var(--bg)}
.a11y-opt[aria-pressed="true"]::after{content:"✓";margin-left:auto;color:var(--accent);font-weight:800}
.a11y-opt:disabled{opacity:.55;cursor:not-allowed}
.a11y-panel .close{margin-left:auto;min-width:44px;min-height:44px;border-radius:10px;border:2px solid var(--line);background:transparent;color:var(--fg);font-size:1.3rem;cursor:pointer}
.a11y-panel .head{display:flex;align-items:center;gap:10px}
.a11y-panel select{min-height:44px;border-radius:10px;border:2px solid var(--line);background:var(--surface-2);color:var(--fg);font:600 .95rem var(--body);padding:0 10px}
.a11y-panel .note{font-size:.85rem;color:var(--muted)}
.a11y-panel details summary{cursor:pointer;font-weight:700;min-height:44px;display:flex;align-items:center}
.a11y-panel ul{margin:6px 0 0;padding-left:18px;font-size:.9rem}
.voice-pill{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:960;max-width:calc(100vw - 180px);
  background:var(--fg);color:var(--bg);border-radius:999px;padding:10px 16px;font:700 .9rem/1.3 var(--body);display:flex;align-items:center;gap:8px;box-shadow:0 8px 24px rgba(0,0,0,.35)}
.voice-pill .dot{width:10px;height:10px;border-radius:50%;background:#e5484d;flex:none}
@media (prefers-reduced-motion:no-preference){html:not([data-animacao="pausada"]) .voice-pill .dot{animation:pulse 1.2s infinite}}
@keyframes pulse{50%{opacity:.3}}
.reading-guide{position:fixed;left:0;right:0;height:44px;pointer-events:none;z-index:890;border-block:3px solid var(--accent);background:rgba(255,255,255,.06)}
.speaking{outline:3px solid var(--accent)!important;outline-offset:4px;border-radius:6px}