@font-face { font-family: "Roboto"; src: url("fontes/Roboto-Light.woff2") format("woff2"); font-weight: 300; font-display: swap; }
@font-face { font-family: "Roboto"; src: url("fontes/Roboto-Regular.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Roboto"; src: url("fontes/Roboto-Medium.woff2") format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "Roboto"; src: url("fontes/Roboto-Bold.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "Sora"; src: url("fontes/Sora-400-latin.woff2") format("woff2"); font-weight: 400; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Sora"; src: url("fontes/Sora-400-latin-ext.woff2") format("woff2"); font-weight: 400; font-display: swap; unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Sora"; src: url("fontes/Sora-600-latin.woff2") format("woff2"); font-weight: 600; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Sora"; src: url("fontes/Sora-600-latin-ext.woff2") format("woff2"); font-weight: 600; font-display: swap; unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Sora"; src: url("fontes/Sora-700-latin.woff2") format("woff2"); font-weight: 700; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Sora"; src: url("fontes/Sora-700-latin-ext.woff2") format("woff2"); font-weight: 700; font-display: swap; unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Inter"; src: url("fontes/Inter-400-latin.woff2") format("woff2"); font-weight: 400; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Inter"; src: url("fontes/Inter-400-latin-ext.woff2") format("woff2"); font-weight: 400; font-display: swap; unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Inter"; src: url("fontes/Inter-500-latin.woff2") format("woff2"); font-weight: 500; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Inter"; src: url("fontes/Inter-500-latin-ext.woff2") format("woff2"); font-weight: 500; font-display: swap; unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Inter"; src: url("fontes/Inter-600-latin.woff2") format("woff2"); font-weight: 600; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Inter"; src: url("fontes/Inter-600-latin-ext.woff2") format("woff2"); font-weight: 600; font-display: swap; unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "JetBrains Mono"; src: url("fontes/JetBrainsMono-400-latin.woff2") format("woff2"); font-weight: 400; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "JetBrains Mono"; src: url("fontes/JetBrainsMono-400-latin-ext.woff2") format("woff2"); font-weight: 400; font-display: swap; unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "JetBrains Mono"; src: url("fontes/JetBrainsMono-500-latin.woff2") format("woff2"); font-weight: 500; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "JetBrains Mono"; src: url("fontes/JetBrainsMono-500-latin-ext.woff2") format("woff2"); font-weight: 500; font-display: swap; unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }

:root {
  --fundo: #ffffff;
  --superficie: #faf8f2;
  --superficie-2: #f3efe5;
  --tinta: #141210;
  --tinta-secundaria: #595959;
  --tinta-decorativa: #9a9384;
  --filete: #e7e2d6;
  --filete-forte: #968f80;
  --dourado: #eedb8e;
  --dourado-medio: #b9932f;
  --dourado-escuro: #8a6d1e;
  --dourado-suave: #fbf4dd;
  --curso-verde: #8ae2c0;
  --curso-azul: #92c8fc;
  --curso-cinza: #b9d7dc;
  --estado-ok: #1f7a54;
  --estado-aviso: #7a5510;
  --estado-critico: #a5382e;
  --estado-info: #2c6f9e;
  --letra-texto: "Segoe UI", "Roboto", Arial, sans-serif;
  --letra-titulo: Georgia, "Times New Roman", serif;
  --letra-mono: ui-monospace, "Cascadia Mono", Consolas, monospace;
  --corpo: 15px;
  --raio: 6px;
  --foco: 3px solid #2c6f9e;
  --tinta-sobre-curso: #141210;
  --fundo-forte: #141210;
  --tinta-sobre-forte: #ffffff;
  --fundo-critico: #fbeceb;
  --fundo-ok: #e8f4ee;
  --fundo-aviso: #fbf1dc;
  --fundo-info: #e7f0f8;
  color-scheme: light;
}

:root[data-tema="escuro"] {
  --fundo: #141210;
  --superficie: #1d1b18;
  --superficie-2: #26231f;
  --tinta: #f3efe5;
  --tinta-secundaria: #c9c3b5;
  --tinta-decorativa: #9a9384;
  --filete: #3a362f;
  --filete-forte: #7d7566;
  --dourado-medio: #d9bd63;
  --dourado-escuro: #eedb8e;
  --dourado-suave: #2e2716;
  --estado-ok: #5cc995;
  --estado-aviso: #e3b55e;
  --estado-critico: #f0897d;
  --estado-info: #84b9e8;
  --fundo-critico: #3a1f1c;
  --fundo-ok: #17301f;
  --fundo-aviso: #33280f;
  --fundo-info: #16283a;
  --foco: 3px solid #84b9e8;
  --fundo-forte: #0b0a09;
  color-scheme: dark;
}
@media (prefers-color-scheme: dark) {
  :root[data-tema="automatico"] {
    --fundo: #141210;
    --superficie: #1d1b18;
    --superficie-2: #26231f;
    --tinta: #f3efe5;
    --tinta-secundaria: #c9c3b5;
    --tinta-decorativa: #9a9384;
    --filete: #3a362f;
    --filete-forte: #7d7566;
    --dourado-medio: #d9bd63;
    --dourado-escuro: #eedb8e;
    --dourado-suave: #2e2716;
    --estado-ok: #5cc995;
    --estado-aviso: #e3b55e;
    --estado-critico: #f0897d;
    --estado-info: #84b9e8;
    --fundo-critico: #3a1f1c;
    --fundo-ok: #17301f;
    --fundo-aviso: #33280f;
    --fundo-info: #16283a;
    --foco: 3px solid #84b9e8;
    --fundo-forte: #0b0a09;
  color-scheme: dark;
  }
}

*, *::before, *::after { box-sizing: border-box; }
html { font-size: var(--corpo); }
body { margin: 0; font-family: var(--letra-texto); color: var(--tinta); background: var(--fundo); line-height: 1.5; }
:focus-visible { outline: var(--foco); outline-offset: 2px; }
.saltar { position: absolute; left: -9999px; top: 0; }
.saltar:focus { left: 8px; top: 8px; z-index: 100; background: var(--fundo); padding: 8px 12px; }
.faixa-maqueta { background: var(--fundo-forte); color: var(--tinta-sobre-forte); font-size: 13px; padding: 6px 16px; display: flex; gap: 16px; justify-content: space-between; }
.faixa-maqueta a { color: var(--dourado); }