/* Entre Linhas — base partilhada (fontes locais, tokens, botões). Segue os protótipos "Entre Linhas" e "Consola". */
@font-face { font-family: "Lexend"; font-weight: 200 300; font-display: swap; src: url("/fontes/lexend-latin-300-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Lexend"; font-weight: 200 300; font-display: swap; src: url("/fontes/lexend-latin-ext-300-normal.woff2") format("woff2"); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Lexend"; font-weight: 400 500; font-display: swap; src: url("/fontes/lexend-latin-400-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Lexend"; font-weight: 400 500; font-display: swap; src: url("/fontes/lexend-latin-ext-400-normal.woff2") format("woff2"); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Lexend"; font-weight: 600; font-display: swap; src: url("/fontes/lexend-latin-600-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Lexend"; font-weight: 600; font-display: swap; src: url("/fontes/lexend-latin-ext-600-normal.woff2") format("woff2"); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Lexend"; font-weight: 700; font-display: swap; src: url("/fontes/lexend-latin-700-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Lexend"; font-weight: 700; font-display: swap; src: url("/fontes/lexend-latin-ext-700-normal.woff2") format("woff2"); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }

:root {
  --rosa: #ffb2b2; --rosa-claro: #ffd7d5; --rosa-pele: #fff1ef;
  --vinho: #65203b; --branco: #ffffff;
  --bg: var(--rosa-pele); --fg: #4a1529; --muted: #7d4a5b;
  --hero: var(--rosa); --swirl: var(--rosa-claro);
  --card: #ffffff; --card-line: #f2cfcf; --chip: #ffe4e2;
  --accent: var(--vinho); --on-accent: #ffe9e9;
  --hl-bg: var(--vinho); --hl-fg: #ffffff;
  --ok: #2f7a55; --ok-bg: #e1f3e9; --warn: #8a5a00; --warn-bg: #fdf0d2; --busy: #4d3fb0; --busy-bg: #e9e6fb;
  --danger: #a3263f; --danger-bg: #fde6ea; --off: #8c7a80; --off-bg: #f1eaec;
  --shadow: 0 18px 50px -24px rgba(101, 32, 59, .45);
  --font: "Lexend", system-ui, -apple-system, "Segoe UI", sans-serif;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #2b0e1a; --fg: #ffe2e0; --muted: #e0a9b0;
    --hero: #4a1629; --swirl: #5b1d34;
    --card: #381222; --card-line: #5c2238; --chip: #4d1a2e;
    --accent: var(--rosa); --on-accent: #4a1529;
    --hl-bg: var(--rosa); --hl-fg: #4a1529;
    --ok: #7fd3a6; --ok-bg: #1f3a2c; --warn: #f2c46b; --warn-bg: #3e2e10; --busy: #b9b0ff; --busy-bg: #2e2650;
    --danger: #ff9fb0; --danger-bg: #4a1426; --off: #b8a3aa; --off-bg: #3a2029;
    --shadow: 0 18px 50px -24px rgba(0, 0, 0, .7);
    color-scheme: dark;
  }
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; background: var(--bg); color: var(--fg); font: 300 17px/1.6 var(--font); -webkit-text-size-adjust: 100%; }
h1, h2, h3 { font-family: var(--font); text-wrap: balance; margin: 0; line-height: 1.08; letter-spacing: -.01em; }
p { margin: 0; }
a { color: inherit; }
button, input, textarea, select { font: inherit; color: inherit; }
:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; border-radius: 6px; }
.num { font-variant-numeric: tabular-nums; }
.hl { background: var(--hl-bg); color: var(--hl-fg); font-weight: 600; padding: 0 .18em; box-decoration-break: clone; -webkit-box-decoration-break: clone; }
.wrap { max-width: 1120px; margin: 0 auto; padding-left: max(20px, env(safe-area-inset-left, 0px)); padding-right: max(20px, env(safe-area-inset-right, 0px)); }

/* Mascote: versão original no claro, branca no escuro */
.ic-d { display: none; }
@media (prefers-color-scheme: dark) { .ic-l { display: none; } .ic-d { display: inline-block; } }

/* Marca */
.brand { display: flex; align-items: center; gap: 14px; text-decoration: none; }
.brand img { height: 40px; width: auto; }
.word { display: flex; flex-direction: column; line-height: 1; }
.word b { font-size: 24px; font-weight: 200; letter-spacing: -.01em; }
.word b span { font-weight: 700; }
.word small { font-size: 10px; letter-spacing: .32em; margin-top: 5px; font-weight: 400; }

/* Botões */
.btn { appearance: none; border: 1.5px solid transparent; cursor: pointer; border-radius: 999px; padding: 16px 26px; font-weight: 600; font-size: 18px;
  display: inline-flex; align-items: center; justify-content: center; gap: 10px; background: var(--chip); color: var(--fg); transition: transform .15s, filter .15s, background .15s; text-decoration: none; }
.btn:active { transform: scale(.98); }
.btn:disabled { opacity: .45; cursor: not-allowed; }
.btn svg { width: 22px; height: 22px; flex: none; }
.btn.primary { background: var(--accent); color: var(--on-accent); }
.btn.primary:hover:not(:disabled) { filter: brightness(1.08); }
.btn.ghost { background: transparent; border-color: var(--card-line); font-weight: 500; }
.btn.ghost:hover { border-color: var(--accent); }
.btn.danger { background: var(--danger); color: #fff; }
.btn.sm { padding: 7px 14px; font-size: 14px; font-weight: 500; }

.pill { display: inline-flex; align-items: center; gap: 6px; border-radius: 999px; padding: 3px 10px 3px 8px; font-size: 13px; font-weight: 500; white-space: nowrap; }
.pill::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.p-ok { background: var(--ok-bg); color: var(--ok); }
.p-busy { background: var(--busy-bg); color: var(--busy); }
.p-warn { background: var(--warn-bg); color: var(--warn); }
.p-off { background: var(--off-bg); color: var(--off); }
.p-ring { background: var(--danger-bg); color: var(--danger); }

.mascot { height: 116px; display: flex; justify-content: center; align-items: flex-end; }
.mascot img { height: 104px; width: auto; }
.bob .mascot img { animation: bob 1.6s ease-in-out infinite; }
.ringing .mascot img { animation: shake .5s ease-in-out infinite; }
@keyframes bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
@keyframes shake { 0%, 100% { transform: rotate(0); } 25% { transform: rotate(-4deg); } 75% { transform: rotate(4deg); } }

.toast { position: fixed; left: 50%; bottom: calc(20px + env(safe-area-inset-bottom, 0px)); transform: translateX(-50%); background: var(--fg); color: var(--bg);
  padding: 10px 16px; border-radius: 999px; font-size: 14px; z-index: 20; box-shadow: var(--shadow); max-width: calc(100% - 32px); }

@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; } }
.sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.forte { font-weight: 600; }
