/* ============================================================================
   informativos.css: as paginas de informativos dos sites das medicas.

   Desenho: docs/frontend/informativos-direcoes-2026-11-03.md, direcao B
   ("leitura com a consulta ao lado"). Galeria:
   docs/frontend/mockups/informativos-direcoes.html.

   Folha PROPRIA e completa: estas paginas nao carregam app.min.css (o CSS do
   app trava `html { overflow: hidden }` acima de 760 px, e era por isso que o
   informativo nao rolava no computador, 03/11/2026) nem public-pages.css.

   Duas peles, mesmo conjunto de tokens:
   - `.inf-body`             site do perfil publico (neuropediatra), tokens de
                             public_profile_c.css (body[data-variant="c"]);
   - `.inf-body.inf-adulto`  site adulto, tokens do <style> de
                             medical_adult_profile.html.
   Prefixo `inf-`. Numero sempre na sans com tabular-nums (`.inf-num`).
   ========================================================================= */

@font-face {
    font-family: "Avie Fraunces";
    font-style: normal;
    font-weight: 300 900;
    font-display: swap;
    src: url("/static/fonts/avie/fraunces-latin.woff2?v=20260613-type") format("woff2");
    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: "Avie Fraunces";
    font-style: normal;
    font-weight: 300 900;
    font-display: swap;
    src: url("/static/fonts/avie/fraunces-latin-ext.woff2?v=20260613-type") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, 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: "Avie Instrument Sans";
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url("/static/fonts/avie/instrument-sans-latin.woff2?v=20260613-type") format("woff2");
    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: "Avie Instrument Sans";
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url("/static/fonts/avie/instrument-sans-latin-ext.woff2?v=20260613-type") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* ===== Tokens ===== */
.inf-body {
    --inf-bg: #fdf7f2;          /* --iec-cream */
    --inf-bg-2: #f3e6dc;        /* --iec-nude */
    --inf-surface: #ffffff;
    --inf-ink: #33212b;         /* --iec-ink */
    --inf-text: #6a5560;        /* --iec-text */
    --inf-muted: #75606b;       /* --iec-muted (AA no creme) */
    --inf-line: rgba(64, 36, 51, 0.12);
    --inf-accent: #8d5f76;      /* --iec-wine */
    --inf-accent-deep: #402433; /* --iec-bordo */
    --inf-accent-soft: #f8edf3; /* --ie-rose-wash */
    --inf-gold: #e2b96b;        /* fio e estrela, nunca texto */
    --inf-btn: linear-gradient(135deg, #8d5f76, #402433);
    --inf-btn-hover: linear-gradient(135deg, #7d5268, #351c2a);
    --inf-on-btn: #ffffff;
    --inf-wa: #128c4e;          /* marca de terceiro: so o icone */
    --inf-focus: #8d5f76;
    --inf-shadow: 0 18px 44px rgba(59, 33, 50, 0.08);
    --inf-shadow-bar: 0 -10px 24px rgba(59, 33, 50, 0.08);
    --inf-display: "Avie Fraunces", Georgia, "Times New Roman", serif;
    --inf-display-w: 560;
    --inf-display-w2: 560;
    --inf-sans: "Avie Instrument Sans", "Instrument Sans", "Helvetica Neue", Arial, sans-serif;
    --inf-r-sm: 8px;
    --inf-r-md: 12px;
    --inf-r-lg: 16px;
    --inf-nav-h: 68px;
}
.inf-body.inf-adulto {
    --inf-bg: #FCFAF6;          /* --paper */
    --inf-bg-2: #F6F1E7;        /* --paper-2 */
    --inf-surface: #ffffff;
    --inf-ink: #2C2721;         /* --ink */
    --inf-text: #2C2721;
    --inf-muted: #6E665B;       /* --muted */
    --inf-line: #E3D9C6;        /* --line */
    --inf-accent: #3F5D4E;      /* --moss */
    --inf-accent-deep: #2F4A3C; /* --moss-deep */
    --inf-accent-soft: #EEF2EB; /* --sage */
    --inf-gold: #B9985A;        /* --gold */
    --inf-btn: #3F5D4E;
    --inf-btn-hover: #2F4A3C;
    --inf-on-btn: #FBF8F1;
    --inf-focus: #806127;       /* --gold-deep */
    --inf-shadow: 0 10px 24px -12px rgba(47, 74, 60, 0.35);
    --inf-shadow-bar: 0 -10px 24px rgba(44, 39, 33, 0.08);
    --inf-display-w: 300;
    --inf-display-w2: 400;
}

/* ===== Base ===== */
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--inf-nav-h, 68px) + 16px); }
.inf-body {
    margin: 0;
    min-height: 100vh;
    background: var(--inf-bg);
    color: var(--inf-ink);
    font: 400 17px/1.7 var(--inf-sans);
    -webkit-font-smoothing: antialiased;
    overflow-x: clip;
}
.inf-body *, .inf-body *::before, .inf-body *::after { box-sizing: border-box; }
.inf-body h1, .inf-body h2, .inf-body h3, .inf-body p, .inf-body ul, .inf-body ol, .inf-body figure, .inf-body address { margin: 0; }
.inf-body img { display: block; max-width: 100%; height: auto; }
.inf-body a { color: inherit; }
.inf-body :focus-visible { outline: 2px solid var(--inf-focus); outline-offset: 3px; border-radius: 4px; }
.inf-num { font-family: var(--inf-sans); font-variant-numeric: tabular-nums; }
.inf-i { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.inf-skip { position: absolute; left: 16px; top: -60px; z-index: 60; padding: 8px 12px; border-radius: var(--inf-r-sm); background: var(--inf-ink); color: var(--inf-surface) !important; text-decoration: none; }
.inf-skip:focus { top: 12px; }

/* ===== Botoes ===== */
.inf-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    min-height: 48px; padding: 0 24px; border-radius: 999px; border: 0;
    background: var(--inf-btn); color: var(--inf-on-btn) !important;
    font: 600 15px/1.2 var(--inf-sans); text-decoration: none; white-space: nowrap;
    box-shadow: var(--inf-shadow); transition: transform .2s ease, background .2s ease;
}
.inf-btn:hover { background: var(--inf-btn-hover); transform: translateY(-1px); }
.inf-btn.inf-sm { min-height: 44px; padding: 0 18px; font-size: 14.5px; }
.inf-btn.inf-full, .inf-ghost.inf-full { width: 100%; }
.inf-short { display: none; }
.inf-ghost {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    min-height: 48px; padding: 0 20px; border-radius: 999px;
    border: 1px solid var(--inf-line); background: var(--inf-surface); color: var(--inf-ink) !important;
    font: 600 15px/1.2 var(--inf-sans); text-decoration: none; white-space: nowrap;
}
.inf-ghost:hover { border-color: var(--inf-accent); }
.inf-ghost .inf-wa { color: var(--inf-wa); }

/* ===== Cabecalho do site ===== */
.inf-nav {
    position: sticky; top: 0; z-index: 40;
    display: flex; align-items: center; justify-content: space-between; gap: 16px;
    min-height: var(--inf-nav-h); padding: 10px max(20px, calc((100vw - 1180px) / 2));
    background: color-mix(in srgb, var(--inf-bg) 90%, transparent);
    -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
    border-bottom: 1px solid var(--inf-line);
}
.inf-brand { display: flex; align-items: center; gap: 10px; min-width: 0; min-height: 44px; text-decoration: none; }
.inf-mark { width: 40px; height: 40px; border-radius: var(--inf-r-sm); background: var(--inf-btn); display: grid; place-items: center; flex: none; overflow: hidden; }
.inf-mark img { width: 28px; height: 28px; object-fit: contain; }
.inf-brand b { display: block; font: var(--inf-display-w2) 19px/1.1 var(--inf-display); color: var(--inf-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.inf-brand small { display: block; font: 600 11px/1.3 var(--inf-sans); letter-spacing: .12em; text-transform: uppercase; color: var(--inf-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.inf-brand > span { min-width: 0; }
.inf-links { display: flex; gap: 24px; font: 500 14px/1 var(--inf-sans); }
.inf-links a { color: var(--inf-text); text-decoration: none; padding: 10px 0; }
.inf-links a:hover { color: var(--inf-ink); }
.inf-links a[aria-current] { color: var(--inf-ink); box-shadow: inset 0 -2px 0 var(--inf-gold); }

/* ===== Grade da pagina ===== */
.inf-wrap {
    display: grid; grid-template-columns: minmax(0, 1fr) 340px; column-gap: 64px; row-gap: 0;
    width: min(1100px, 100% - 64px); margin: 0 auto; padding: 36px 0 72px; align-items: start;
}
.inf-art { grid-column: 1; grid-row: 1; display: grid; gap: 20px; min-width: 0; max-width: 690px; }
.inf-aside { grid-column: 2; grid-row: 1 / span 2; position: sticky; top: calc(var(--inf-nav-h) + 24px); display: grid; gap: 12px; }
.inf-more { grid-column: 1; grid-row: 2; display: grid; gap: 10px; max-width: 690px; margin-top: 40px; }

.inf-crumb { display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: center; font: 400 14px/1.4 var(--inf-sans); color: var(--inf-muted); }
.inf-crumb a { display: inline-flex; align-items: center; min-height: 32px; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--inf-line); }
.inf-crumb a:hover { color: var(--inf-ink); text-decoration-color: currentColor; }
.inf-eyebrow { font: 600 12px/1.3 var(--inf-sans); letter-spacing: .14em; text-transform: uppercase; color: var(--inf-accent); }
.inf-art h1, .inf-head h1 {
    font: var(--inf-display-w) clamp(32px, 4.2vw, 48px)/1.08 var(--inf-display);
    letter-spacing: -.015em; color: var(--inf-ink); text-wrap: balance; overflow-wrap: break-word; hyphens: manual; max-width: 18ch;
}
.inf-lead { font: 400 clamp(18px, 1.7vw, 20px)/1.55 var(--inf-sans); color: var(--inf-text); max-width: 62ch; }
.inf-by { display: flex; align-items: center; gap: 10px; font: 400 14px/1.45 var(--inf-sans); color: var(--inf-muted); }
.inf-by b { color: var(--inf-ink); font-weight: 600; }
.inf-by a { color: var(--inf-ink); }
.inf-by > span { min-width: 0; }
.inf-by img { flex: none; width: 32px; height: 32px; border-radius: 50%; object-fit: cover; object-position: 50% 20%; border: 1px solid var(--inf-line); }

/* Sumario "Nesta pagina" */
.inf-toc { border-top: 1px solid var(--inf-line); border-bottom: 1px solid var(--inf-line); padding: 14px 0; display: grid; gap: 6px; }
.inf-toc p { font: 600 12px/1.3 var(--inf-sans); letter-spacing: .12em; text-transform: uppercase; color: var(--inf-muted); }
.inf-toc ol { list-style: none; padding: 0; display: grid; gap: 2px; }
.inf-toc a { display: flex; gap: 10px; min-height: 32px; align-items: center; font: 500 15px/1.4 var(--inf-sans); color: var(--inf-ink); text-decoration: none; }
.inf-toc a:hover { text-decoration: underline; text-underline-offset: 3px; }
.inf-toc a span { color: var(--inf-muted); min-width: 1.2em; font-variant-numeric: tabular-nums; }

/* Secoes */
.inf-sec { display: grid; gap: 10px; padding-top: 8px; }
.inf-sec h2, .inf-place h2, .inf-art .public-medical-note h2 {
    font: var(--inf-display-w2) clamp(23px, 2.4vw, 28px)/1.2 var(--inf-display); letter-spacing: -.01em; color: var(--inf-ink); text-wrap: balance;
}
.inf-sec p { color: var(--inf-text); max-width: 68ch; }
.inf-steps { list-style: none; padding: 0; display: grid; gap: 10px; counter-reset: inf-step; }
.inf-steps li { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 2px 12px; color: var(--inf-text); }
.inf-steps li::before { counter-increment: inf-step; content: counter(inf-step); grid-row: 1 / span 2; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: var(--inf-accent-soft); color: var(--inf-accent); font: 600 13px/1 var(--inf-sans); font-variant-numeric: tabular-nums; margin-top: 2px; }
.inf-steps b { color: var(--inf-ink); font-weight: 600; }
.inf-link-out { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; color: var(--inf-accent) !important; font-weight: 600; text-underline-offset: 3px; }

/* Bloco "Para marcar a consulta" no meio do texto */
.inf-callout { border-left: 3px solid var(--inf-accent); background: var(--inf-accent-soft); border-radius: 0 var(--inf-r-md) var(--inf-r-md) 0; padding: 18px 20px; display: grid; gap: 10px; }
.inf-callout h2 { font: 600 17px/1.35 var(--inf-sans); color: var(--inf-ink); }
.inf-callout p { font: 400 15.5px/1.6 var(--inf-sans); color: var(--inf-text); }
.inf-callout .inf-row { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: center; }

/* Endereco, fontes e nota */
.inf-place, .inf-art .public-medical-note { display: grid; gap: 10px; padding: 20px 22px; border: 1px solid var(--inf-line); border-radius: var(--inf-r-md); background: var(--inf-surface); }
.inf-place address, .inf-art .public-medical-note address { font-style: normal; color: var(--inf-ink); font-variant-numeric: tabular-nums; }
.inf-place p, .inf-art .public-medical-note p { color: var(--inf-text); font-size: 15.5px; line-height: 1.6; }
.inf-art .public-medical-note a { color: var(--inf-accent); font-weight: 600; text-underline-offset: 3px; }
.inf-place img { width: 100%; max-height: 420px; object-fit: cover; border-radius: var(--inf-r-sm); }
.inf-sources { list-style: none; padding: 0; display: grid; gap: 0; border-top: 1px solid var(--inf-line); }
.inf-sources li { display: grid; gap: 2px; padding: 12px 0; border-bottom: 1px solid var(--inf-line); }
.inf-sources a { color: var(--inf-accent); font-weight: 600; text-underline-offset: 3px; }
.inf-sources span { color: var(--inf-muted); font-size: 14.5px; line-height: 1.5; }
.inf-note { font: 400 14px/1.55 var(--inf-sans); color: var(--inf-muted); }
.inf-urgent { font: 400 15px/1.55 var(--inf-sans); color: var(--inf-muted); padding-top: 4px; }
.inf-urgent b { color: var(--inf-ink); font-weight: 600; }

/* ===== Cartao da consulta ===== */
.inf-card { background: var(--inf-surface); border: 1px solid var(--inf-line); border-radius: var(--inf-r-md); box-shadow: var(--inf-shadow); padding: 22px; display: grid; gap: 16px; }
.inf-who { display: flex; gap: 14px; align-items: center; min-width: 0; }
.inf-who img, .inf-who .inf-photo-empty { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; object-position: 50% 20%; border: 1px solid var(--inf-line); flex: none; background: var(--inf-accent-soft); }
.inf-who b { display: block; font: var(--inf-display-w2) 20px/1.2 var(--inf-display); color: var(--inf-ink); }
.inf-who small { display: block; font: 400 13px/1.45 var(--inf-sans); color: var(--inf-muted); }
.inf-who > span { min-width: 0; }
.inf-consult { font: 400 14.5px/1.6 var(--inf-sans); color: var(--inf-text); }
/* O diferencial da medica (informativos_editorial): primeira linha do cartao. */
.inf-highlight { display: flex; gap: 10px; align-items: center; padding: 10px 12px; border-radius: var(--inf-r-sm); border: 1px solid var(--inf-line); background: var(--inf-bg); font: 600 15px/1.35 var(--inf-sans); color: var(--inf-ink); }
.inf-highlight .inf-i { color: var(--inf-accent); }
.inf-strip-hl { display: flex !important; gap: 8px; align-items: center; }
.inf-strip-hl .inf-i { color: var(--inf-accent); width: 17px; height: 17px; }
.inf-facts { list-style: none; padding: 0; display: grid; gap: 8px; font: 400 14.5px/1.45 var(--inf-sans); color: var(--inf-text); }
.inf-facts li { display: flex; gap: 10px; align-items: flex-start; }
.inf-facts .inf-i { color: var(--inf-accent); margin-top: 1px; }
.inf-next { display: flex; gap: 10px; align-items: center; padding: 10px 12px; border-radius: var(--inf-r-sm); background: var(--inf-accent-soft); font: 500 14px/1.35 var(--inf-sans); color: var(--inf-ink); }
.inf-next .inf-i { color: var(--inf-accent); }
.inf-price { display: grid; gap: 2px; padding-top: 14px; border-top: 1px solid var(--inf-line); }
.inf-price strong { font: 600 26px/1.1 var(--inf-sans); font-variant-numeric: tabular-nums; color: var(--inf-ink); }
.inf-price span { font: 400 13px/1.4 var(--inf-sans); color: var(--inf-muted); }
.inf-rating { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; font: 400 13.5px/1.35 var(--inf-sans); color: var(--inf-muted); }
.inf-rating b { color: var(--inf-ink); font-weight: 600; font-variant-numeric: tabular-nums; }
.inf-stars { display: inline-flex; gap: 2px; color: var(--inf-gold); }
.inf-stars svg { width: 15px; height: 15px; fill: currentColor; }
.inf-actions { display: grid; gap: 8px; }
.inf-aside-note { font: 400 13px/1.5 var(--inf-sans); color: var(--inf-muted); padding: 0 6px; }

/* Faixa compacta (celular e tablet) e barra de baixo */
.inf-strip { display: none; grid-template-columns: minmax(0, 1fr) auto; gap: 12px 14px; align-items: center; padding: 14px 16px; border: 1px solid var(--inf-line); border-radius: var(--inf-r-md); background: var(--inf-surface); box-shadow: var(--inf-shadow); }
.inf-strip .inf-who img { width: 44px; height: 44px; }
.inf-strip .inf-who b { font: 600 16px/1.3 var(--inf-sans); font-variant-numeric: tabular-nums; }
.inf-bar { display: none; }

/* ===== Lista (indice) ===== */
.inf-head { display: grid; gap: 14px; }
.inf-group { display: grid; gap: 0; }
.inf-group > h2 { font: 600 12px/1.3 var(--inf-sans); letter-spacing: .14em; text-transform: uppercase; color: var(--inf-accent); padding: 22px 0 4px; }
.inf-rows { list-style: none; padding: 0; display: grid; border-top: 1px solid var(--inf-line); }
.inf-row-link { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 16px; padding: 16px 0; border-bottom: 1px solid var(--inf-line); align-items: center; text-decoration: none; }
.inf-row-link b { font: var(--inf-display-w2) 21px/1.25 var(--inf-display); color: var(--inf-ink); text-wrap: balance; }
.inf-row-link span { grid-column: 1; font: 400 14.5px/1.55 var(--inf-sans); color: var(--inf-muted); }
.inf-row-link .inf-i { grid-column: 2; grid-row: 1 / span 2; color: var(--inf-accent); transition: transform .2s ease; }
.inf-row-link:hover b { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
.inf-row-link:hover .inf-i { transform: translateX(3px); }
.inf-more > h2 { font: var(--inf-display-w2) 24px/1.2 var(--inf-display); color: var(--inf-ink); }

/* ===== Rodape ===== */
.inf-foot { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px 24px; padding: 24px max(20px, calc((100vw - 1180px) / 2)) 32px; border-top: 1px solid var(--inf-line); font: 400 14px/1.5 var(--inf-sans); color: var(--inf-muted); }
.inf-foot a { color: var(--inf-ink); text-underline-offset: 3px; }
.inf-body .public-avie-signature { display: flex; justify-content: center; padding: 0 20px 28px; }
.inf-body .public-avie-signature a { display: inline-flex; align-items: center; gap: 8px; color: var(--inf-muted); font: 500 13px/1.4 var(--inf-sans); text-decoration: none; }
.inf-body .public-avie-signature img { width: 20px; height: 20px; }

/* ===== Aviso de cookies (o mesmo da home, na pele da pagina) ===== */
.consent-banner{position:fixed;right:18px;bottom:18px;z-index:60;width:min(420px,calc(100vw - 36px));padding:16px 18px;background:var(--inf-surface);color:var(--inf-ink);border:1px solid var(--inf-line);border-radius:var(--inf-r-lg);box-shadow:var(--inf-shadow)}
.consent-banner[hidden]{display:none}
.consent-banner p{margin:0 0 12px;font:400 14.5px/1.5 var(--inf-sans);color:var(--inf-text)}
.consent-banner a{color:var(--inf-accent);text-underline-offset:3px}
.consent-actions{display:flex;gap:10px}
.consent-actions button{flex:1 1 auto;min-height:44px;padding:10px 16px;border-radius:999px;font:600 14px/1.2 var(--inf-sans);cursor:pointer}
.consent-actions button[data-consent="accept"]{border:0;background:var(--inf-btn);color:var(--inf-on-btn)}
.consent-actions button[data-consent="reject"]{border:1px solid var(--inf-line);background:transparent;color:var(--inf-ink)}

/* ===== Larguras ===== */
@media (max-width: 1080px) {
    .inf-links { gap: 18px; }
}
@media (max-width: 999px) {
    .inf-links { display: none; }
    .inf-wrap { grid-template-columns: minmax(0, 1fr); width: min(720px, 100% - 48px); padding-top: 24px; padding-bottom: 40px; }
    .inf-art, .inf-more { max-width: none; }
    .inf-aside { grid-column: 1; grid-row: auto; position: static; margin-top: 40px; }
    .inf-more { grid-row: auto; }
    .inf-strip { display: grid; }
    .inf-bar {
        position: fixed; left: 0; right: 0; bottom: 0; z-index: 45;
        display: flex; align-items: center; justify-content: space-between; gap: 12px;
        padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px));
        background: color-mix(in srgb, var(--inf-surface) 95%, transparent);
        -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
        border-top: 1px solid var(--inf-line); box-shadow: var(--inf-shadow-bar);
        transition: transform .22s ease, visibility .22s;
    }
    .inf-bar > div { min-width: 0; }
    .inf-bar b { display: block; font: 600 15px/1.25 var(--inf-sans); color: var(--inf-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .inf-bar small { display: block; font: 400 12.5px/1.35 var(--inf-sans); color: var(--inf-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-variant-numeric: tabular-nums; }
    .inf-js .inf-bar:not(.is-on) { transform: translateY(110%); visibility: hidden; }
    .inf-body { padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px)); }
    .consent-banner { bottom: calc(84px + env(safe-area-inset-bottom, 0px)); }
}
@media (max-width: 640px) {
    .inf-body { font-size: 16px; }
    .inf-nav { padding: 8px 16px; min-height: 60px; }
    .inf-brand b { font-size: 17px; }
    .inf-nav .inf-long { display: none; }
    .inf-nav .inf-short { display: inline; }
    .inf-wrap { width: calc(100% - 32px); padding-top: 18px; }
    .inf-art { gap: 16px; }
    .inf-crumb a { min-height: 44px; }
    .inf-toc a { min-height: 44px; }
    .inf-strip { grid-template-columns: minmax(0, 1fr); }
    .inf-strip .inf-btn { width: 100%; }
    .inf-row-link b { font-size: 19px; }
    .inf-card { padding: 18px; }
    .consent-banner { left: 12px; right: 12px; width: auto; }
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .inf-btn, .inf-bar, .inf-row-link .inf-i { transition: none; }
}
@media print {
    .inf-nav, .inf-strip, .inf-bar, .inf-aside, .consent-banner { display: none !important; }
    .inf-wrap { display: block; width: auto; }
}