@font-face{font-family:"Atkinson Hyperlegible";font-weight:400;font-style:normal;font-display:swap;src:url(fonts/atkinson-hyperlegible-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Atkinson Hyperlegible";font-weight:700;font-style:normal;font-display:swap;src:url(fonts/atkinson-hyperlegible-latin-700-normal.woff2) format("woff2")}
:root{color-scheme:light dark;
--bg:#faf8f5;--fg:#24282c;--mute:#575d65;--card:#fff;--sub:#f2efe9;--line:#e4e0d7;--line2:#c9c4b8;
--accent:#4b5868;--accent-fg:#fff;--link:#3b4858;--sage:#e3ece6;--sage-fg:#34493d;--lav:#ece7f6;--lav-fg:#4a425f;
--help:#8f3f39;--help-bg:#f8e9e5;--help-line:#c9766e;--warn-bg:#fbf0dc;--warn-line:#b7791f;--warn-fg:#5c3d0a;
--sh:0 4px 20px rgba(60,56,50,.05),0 1px 4px rgba(60,56,50,.03);--sh2:0 8px 28px rgba(60,56,50,.09),0 2px 8px rgba(60,56,50,.04);
--serif:Georgia,"Iowan Old Style","Times New Roman",serif;--sans:"Atkinson Hyperlegible",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
@media (prefers-color-scheme:dark){:root{--bg:#161a19;--fg:#e9e6df;--mute:#aab1b0;--card:#1f2527;--sub:#262d2f;--line:#333b3d;--line2:#4a5457;
--accent:#b9c8db;--accent-fg:#13202e;--link:#c3d1e3;--sage:#27342d;--sage-fg:#bfd8c8;--lav:#2d2938;--lav-fg:#d4cbe8;
--help:#f2b8af;--help-bg:#3a2523;--help-line:#a8635b;--warn-bg:#352c1b;--warn-line:#c8963e;--warn-fg:#f0d9a8;
--sh:0 4px 20px rgba(0,0,0,.25);--sh2:0 8px 28px rgba(0,0,0,.35)}}
*{box-sizing:border-box}
html{font-size:112.5%;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--sans);line-height:1.6;min-height:100vh;display:flex;flex-direction:column;overflow-wrap:anywhere}
header{position:sticky;top:0;z-index:5;display:flex;justify-content:space-between;align-items:center;gap:.75rem;padding:.6rem 1rem;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(6px);border-bottom:1px solid var(--line)}
.brand{font-family:var(--serif);font-weight:700;color:var(--fg);text-decoration:none;font-size:1.3rem;min-height:44px;display:inline-flex;align-items:center;gap:.5rem;white-space:nowrap}
.brand::before{content:"";width:1.1rem;height:1.1rem;border-radius:50% 50% 50% 8%;background:var(--accent);opacity:.85}
.help{color:var(--help);background:var(--help-bg);font-weight:700;border:2px solid var(--help-line);border-radius:999px;padding:.3rem .85rem;text-decoration:none;min-height:48px;display:inline-flex;align-items:center;text-align:center;line-height:1.2;font-size:.9rem}
.help:hover{border-color:var(--help)}
main{flex:1;width:100%;max-width:40rem;margin:0 auto;padding:1.5rem 1.25rem 2.5rem}
main:focus{outline:none}
h1{font-family:var(--serif);font-size:1.65rem;line-height:1.25;margin:.5rem 0 .75rem;font-weight:700;letter-spacing:-.01em}
h2{font-family:var(--serif);font-size:1.2rem;margin:2rem 0 .6rem}
p{margin:.6rem 0;max-width:58ch}
a{color:var(--link)}
.mute{color:var(--mute)}
ul.cards{list-style:none;margin:1rem 0;padding:0;display:grid;gap:.9rem}
.card{display:block;background:var(--card);border:1px solid var(--line);border-radius:1.5rem;padding:1.25rem;color:inherit;text-decoration:none;min-height:56px;box-shadow:var(--sh)}
a.card:hover,a.card:focus-visible{border-color:var(--accent);box-shadow:var(--sh2)}
.card strong{display:block;font-family:var(--serif);font-size:1.1rem;line-height:1.3;margin-bottom:.15rem}
.card span:not(.tag):not(.simbolo){color:var(--mute);font-size:.95rem}
.card strong{color:var(--fg)}
.card .tag,.card .simbolo{font-size:inherit}
.caminho{display:flex;align-items:center;gap:1rem}
.caminho>span:last-child{flex:1;min-width:0}
.simbolo{display:inline-flex;align-items:center;justify-content:center;width:3rem;height:3rem;flex:none;border-radius:1rem;background:var(--sub);font-size:1.5rem;line-height:1}
h1 .simbolo{width:2.6rem;height:2.6rem;font-size:1.35rem;vertical-align:middle;margin-right:.25rem}
li:nth-child(3n+2)>.caminho .simbolo{background:var(--lav)}
li:nth-child(3n+1)>.caminho .simbolo{background:var(--sage)}
li:nth-child(3n)>.caminho .simbolo{background:var(--sub)}
.caminho::after{content:"›";color:var(--mute);font-size:1.6rem;line-height:1;margin-left:auto}
.tag{display:inline-block;font-size:.8rem;border:1px solid var(--line2);border-radius:999px;padding:.05rem .7rem;color:var(--mute);margin:0 .35rem .35rem 0;background:var(--sub)}
.seg::before{margin-right:.35em;font-size:.85em}
.seg-low{background:var(--sage);color:var(--sage-fg);border-color:transparent}
.seg-low::before{content:"●" / ""}
.seg-low_with_caveats{background:var(--sage);color:var(--sage-fg);border:1.5px dashed var(--sage-fg)}
.seg-low_with_caveats::before{content:"◐" / ""}
.seg-moderate{background:var(--warn-bg);color:var(--warn-fg);border:1.5px solid var(--warn-line)}
.seg-moderate::before{content:"▲" / ""}
.seg-high{background:var(--warn-bg);color:var(--warn-fg);border:2.5px double var(--warn-line);font-weight:700}
.seg-high::before{content:"◆" / ""}
.seg-unknown{background:transparent;color:var(--mute);border:1.5px dotted var(--mute)}
.seg-unknown::before{content:"?" / ""}
.btn{display:inline-flex;align-items:center;justify-content:center;background:var(--accent);color:var(--accent-fg);border:2px solid var(--accent);border-radius:1rem;padding:.75rem 1.4rem;font:inherit;font-weight:700;min-height:56px;text-decoration:none;cursor:pointer;text-align:center;transition:box-shadow .25s ease-out,opacity .25s}
.btn:hover:not(:disabled){box-shadow:var(--sh2)}
.btn.sec{background:var(--sub);color:var(--fg);border:1.5px solid var(--line2);font-weight:400}
.btn:disabled{opacity:.5;cursor:not-allowed}
.row{display:flex;gap:.75rem;flex-wrap:wrap;margin:1.5rem 0}
.abas{display:flex;gap:.25rem;background:var(--sub);border-radius:1.2rem;padding:.3rem;margin:1.25rem 0}
.aba{flex:1;min-height:48px;border:0;border-radius:.95rem;background:transparent;color:var(--mute);font:inherit;font-size:.95rem;cursor:pointer;padding:.25rem .3rem}
.aba[aria-selected=true]{background:var(--card);color:var(--fg);font-weight:700;box-shadow:var(--sh)}
.grade-emocoes{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem}
.emocao{display:flex;align-items:center;gap:.7rem;min-height:64px;padding:.6rem .9rem;background:var(--card);color:var(--fg);border:1.5px solid var(--line);border-radius:1.2rem;font:inherit;text-align:left;cursor:pointer;box-shadow:var(--sh);transition:background .25s,border-color .25s}
.emocao .emoji{font-size:1.6rem;line-height:1}
.emocao[aria-pressed=true],.celula[aria-pressed=true]{background:var(--lav);border:2px solid var(--accent);color:var(--lav-fg);font-weight:700}
.emocao[aria-pressed=true]::after,.celula[aria-pressed=true]::after{content:"✓";position:absolute;top:.35rem;right:.6rem;font-weight:700;font-size:.9rem}.emocao,.celula{position:relative}
.mapa{display:grid;grid-template-columns:3.4rem repeat(3,minmax(0,1fr));gap:.4rem;align-items:stretch;margin:1rem 0}
.mapa-eixo{font-size:.78rem;color:var(--mute);display:flex;align-items:center;justify-content:center;text-align:center;line-height:1.2}
.celula{min-height:72px;padding:.4rem .3rem;background:var(--card);color:var(--fg);border:1.5px solid var(--line);border-radius:1rem;font:inherit;font-size:.85rem;line-height:1.25;cursor:pointer;display:flex;align-items:center;justify-content:center;text-align:center;hyphens:auto;overflow-wrap:normal}
.celula[aria-pressed=true]::after{margin:0 0 0 .2rem}
textarea{display:block;width:100%;font:inherit;color:var(--fg);background:var(--card);border:1.5px solid var(--line2);border-radius:1.2rem;padding:1rem;line-height:1.6;min-height:8rem;resize:vertical;box-shadow:var(--sh)}
textarea:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
label{display:block;margin-bottom:.5rem}
audio{width:100%;margin:.5rem 0}
ol.passos{list-style:none;counter-reset:p;padding:0}
ol.passos li{counter-increment:p;position:relative;margin:.8rem 0;padding:.9rem 1rem .9rem 3.4rem;background:var(--card);border:1px solid var(--line);border-radius:1.2rem;box-shadow:var(--sh)}
ol.passos li::before{content:counter(p);position:absolute;left:.9rem;top:.8rem;width:1.9rem;height:1.9rem;border-radius:50%;background:var(--sage);color:var(--sage-fg);font-weight:700;display:flex;align-items:center;justify-content:center;font-size:.95rem}
.tel{display:flex;justify-content:space-between;align-items:center;gap:1rem;background:var(--help-bg);border:2px solid var(--help-line);border-radius:1.5rem;padding:1.1rem 1.25rem;margin:.9rem 0;color:var(--fg);text-decoration:none;min-height:64px}
.tel:hover{border-color:var(--help)}
.tel b{font-family:var(--serif);font-size:2rem;line-height:1;color:var(--help)}
.tel .mute{color:var(--fg);opacity:.85;font-size:.95rem}
.back{display:inline-flex;align-items:center;min-height:44px;margin-bottom:.25rem;color:var(--mute);text-decoration:none}
.back:hover{text-decoration:underline}
.soft{background:var(--sage);color:var(--sage-fg);border-radius:1.2rem;padding:1rem 1.25rem;margin:1.25rem 0}
.soft p:first-child{margin-top:0}
.alerta{background:var(--warn-bg);color:var(--warn-fg);border:1.5px solid var(--warn-line);border-left:6px solid var(--warn-line);border-radius:1rem;padding:1rem 1.25rem;margin:1.25rem 0}
.alerta strong{display:block}
footer{border-top:1px solid var(--line);padding:1rem 1.25rem 1.5rem;font-size:.85rem;color:var(--mute);text-align:center}
footer p{margin:0 auto}
.skip{position:absolute;left:-999px}.skip:focus{left:.5rem;top:.5rem;background:var(--card);color:var(--fg);padding:.75rem 1rem;z-index:9;border-radius:.6rem}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:.4rem}
.help:focus-visible{outline-color:var(--help)}
@media (min-width:600px){main{padding-top:2.5rem}h1{font-size:2rem}}
@media (max-width:359px){.grade-emocoes{grid-template-columns:1fr}.mapa{grid-template-columns:2.8rem repeat(3,minmax(0,1fr))}.aba{font-size:.85rem}}
@media (prefers-reduced-motion:no-preference){main{animation:in .35s ease-out}@keyframes in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
