@font-face {
    font-family: "NCAT Pixel Blog";
    src: url("/assets/fonts/ncat-pixel.woff2") format("woff2");
    font-display: swap;
}

html.blog-ncat-root {
    color-scheme: dark;
    background: #10190e;
    --scrollbar-track: #151a12;
    --scrollbar-track-end: #10190e;
    --scrollbar-thumb-start: #a9ee73;
    --scrollbar-thumb-end: #5fa83d;
    --scrollbar-thumb-hover-start: #cbffaa;
    --scrollbar-thumb-hover-end: #a9ee73;
    --scrollbar-thumb-border: #10190e;
    --scrollbar-thumb-glow: transparent;
    scrollbar-color: #a9ee73 #151a12;
}

.blog-body--ncat {
    --fundo: #10190e;
    --ciano: #a9ee73;
    --texto-suave: #dae3d3;
    --texto-fraco: #c1cdb9;
    --borda-forte: #a9ee73;
    --ncat-pixel: "NCAT Pixel Blog", "JetBrains Mono", monospace;
    background: #10190e;
    color: #f4f8ee;
    font-family: "Inter", sans-serif;
}

.blog-body--ncat ::selection { background: #a9ee73; color: #10220e; }
.blog-body--ncat :focus-visible { outline: 3px solid #a9ee73; outline-offset: 4px; }
.blog-body--ncat .grade-fundo,
.blog-body--ncat .scanlines,
.blog-body--ncat .brilho-global { display: none; }
.blog-body--ncat .blog-pagina { background: #10190e; }

.blog-body--ncat .cabecalho,
.blog-body--ncat .cabecalho.ativo {
    border-bottom: 3px solid #0b1109;
    background: linear-gradient(rgba(25, 32, 21, .96), rgba(25, 32, 21, .96)), url("/assets/images/ncat-minecraft/ui/dirt.png") 0 0 / 64px;
    box-shadow: inset 0 -2px #6b805a, 0 4px #080e06;
    backdrop-filter: none;
}

.blog-body--ncat .marca span {
    background: none;
    color: #f4f8ee;
    font-family: var(--ncat-pixel);
    font-size: 1.3rem;
    font-weight: 400;
    text-shadow: 2px 2px #172312;
}

.blog-body--ncat .menu a {
    min-height: 48px;
    border-radius: 0;
    color: #dbe8d0;
    box-shadow: none;
}
.blog-body--ncat .menu a::after { background: #a9ee73; }
.blog-body--ncat .menu a:hover,
.blog-body--ncat .menu a.link-ativo {
    border-color: #7cac58;
    background: #31452a;
    color: #d7ffb4;
    box-shadow: inset 2px 2px #516d3e, inset -2px -2px #182613;
}

.blog-body--ncat .blog-hero {
    min-height: auto;
    padding: clamp(60px, 7vw, 104px) 0 84px;
}
.blog-body--ncat .blog-hero::before {
    background: linear-gradient(90deg, rgba(8, 17, 7, .94), rgba(8, 17, 7, .72) 58%, rgba(8, 17, 7, .3)), linear-gradient(0deg, #10190e, transparent 65%);
}
.blog-body--ncat .blog-hero::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 18px;
    background: repeating-linear-gradient(90deg, #65a340 0 32px, #7cb24f 32px 64px, #527f34 64px 96px);
    box-shadow: 0 -5px #263e1c, inset 0 -5px #31471e;
    clip-path: polygon(0 25%, 8% 25%, 8% 0, 20% 0, 20% 25%, 40% 25%, 40% 0, 48% 0, 48% 25%, 68% 25%, 68% 0, 76% 0, 76% 25%, 92% 25%, 92% 0, 100% 0, 100% 100%, 0 100%);
}
.blog-body--ncat .blog-hero__fundo img { filter: saturate(1.06) contrast(1.02); opacity: .8; }
.blog-body--ncat .blog-hero .etiqueta {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #a9ee73;
    font-family: var(--ncat-pixel);
    font-weight: 400;
    font-size: 1rem;
    letter-spacing: .03em;
    line-height: 1.5;
    text-shadow: 2px 2px #10190e;
}
.blog-body--ncat .blog-hero .etiqueta::before {
    content: "";
    flex: 0 0 22px;
    width: 22px;
    height: 22px;
    background: #68a841;
    border-top: 6px solid #b1ea80;
    box-shadow: inset -4px -4px #355920, 3px 3px #0b1408;
}
.blog-body--ncat .blog-hero h1 {
    max-width: 900px;
    color: #f6f9ee;
    font-family: var(--ncat-pixel);
    font-size: clamp(1.9rem, 4.4vw, 3.5rem);
    font-weight: 400;
    line-height: 1.25;
    text-transform: none;
    text-shadow: 3px 3px #16230e;
    overflow-wrap: anywhere;
}
.blog-body--ncat .blog-hero p:not(.etiqueta) { max-width: 740px; color: #dce8d4; font-size: 1.05rem; }
.blog-body--ncat .blog-meta span {
    padding: 9px 12px;
    border: 2px solid #405134;
    border-radius: 0;
    background: #172313;
    color: #d7e9ca;
    box-shadow: inset 1px 1px #536941, 3px 3px #0a1207;
    letter-spacing: .05em;
}
.blog-body--ncat a.blog-ncat-projeto {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    max-width: 100%;
    min-height: 52px;
    margin-top: 26px;
    padding: 10px 16px;
    border: 2px solid #071005;
    background: #a9ee73;
    color: #172812;
    font-size: .9rem;
    font-weight: 800;
    text-decoration: none;
    box-shadow: inset 2px 2px #d1ffad, inset -2px -2px #5d9c36, 4px 4px #0b1408;
}
.blog-ncat-projeto img { flex: 0 0 28px; width: 28px; height: 28px; image-rendering: pixelated; }
.blog-body--ncat a.blog-ncat-projeto:hover { background: #c7ff95; color: #10220e; }

.blog-body--ncat .blog-artigo {
    background: linear-gradient(rgba(16, 25, 14, .96), rgba(16, 25, 14, .96)), url("/assets/images/ncat-minecraft/ui/dirt.png") 0 0 / 64px;
}
.blog-body--ncat .blog-artigo__conteudo { color: #dae3d3; font-size: 1.08rem; line-height: 1.9; }
.blog-body--ncat .blog-artigo__conteudo :is(h2, h3, h4) {
    color: #c4f597;
    font-family: var(--ncat-pixel);
    font-weight: 400;
    line-height: 1.5;
    text-shadow: 2px 2px #080e06;
}
.blog-body--ncat .blog-artigo__conteudo h2 { font-size: clamp(1.35rem, 2.2vw, 1.8rem); }
.blog-body--ncat .blog-artigo__conteudo h3 { font-size: clamp(1.15rem, 1.8vw, 1.45rem); }
.blog-body--ncat .blog-artigo__conteudo strong { color: #f4f8ee; }
.blog-body--ncat .blog-artigo__conteudo a { color: #b9f485; text-decoration: underline; text-underline-offset: 4px; }
.blog-body--ncat .blog-artigo__conteudo a:hover { color: #e0ffbd; }
.blog-body--ncat .blog-artigo__conteudo img { border: 3px solid #6e8a57; box-shadow: 5px 5px #081005; }
.blog-body--ncat .blog-artigo__conteudo > p:has(> em) { color: #b7c6ab; font-size: .9rem; }
.blog-body--ncat .blog-artigo__conteudo :not(pre) > code { padding: 2px 5px; border: 1px solid #415333; background: #1f2b1a; color: #d8f5c2; border-radius: 0; }
.blog-body--ncat .blog-artigo__conteudo blockquote { border-left-color: #a9ee73; background: #1c2a17; }
.blog-body--ncat .blog-callout,
.blog-body--ncat .blog-checklist { border: 2px solid #4c6b38; border-radius: 0; background: #1c2a17; box-shadow: inset 2px 2px #2c4120; }
.blog-body--ncat .blog-callout strong,
.blog-body--ncat .blog-checklist strong,
.blog-body--ncat .blog-list li::before,
.blog-body--ncat .blog-checklist li::before { color: #b7f484; border-color: #7bae56; }
.blog-body--ncat .blog-list li { color: #dae3d3; }
.blog-body--ncat .blog-special,
.blog-body--ncat .blog-table-wrap { border: 2px solid #586d49; border-radius: 0; background: #111b0d; box-shadow: 4px 4px #081005; }
.blog-body--ncat .blog-special figcaption { flex-wrap: wrap; padding-block: 8px; border-color: #546944; background: #2d3c25; }
.blog-body--ncat .blog-special figcaption span { color: #d1e8bf; }
.blog-body--ncat .blog-special button { min-height: 44px; border: 2px solid #0b1408; border-radius: 0; background: #a9ee73; color: #10220e; box-shadow: inset 2px 2px #d1ffad, inset -2px -2px #5d9c36; }
.blog-body--ncat .blog-special code,
.blog-body--ncat .blog-artigo__conteudo pre { color: #d8f5c2; background: #111b0d; }
.blog-body--ncat .blog-table-wrap { scrollbar-color: #8dd05b #111b0d; }
.blog-body--ncat .blog-table th,
.blog-body--ncat .blog-artigo__conteudo > table th { color: #d8f5c2; background: #283b20; }
.blog-body--ncat .blog-table td,
.blog-body--ncat .blog-artigo__conteudo > table td { color: #dae3d3; background: #14200f; }
.blog-body--ncat .blog-table :is(th, td),
.blog-body--ncat .blog-artigo__conteudo > table :is(th, td) { border-color: #3a4c2d; }

.blog-body--ncat .blog-author-card,
.blog-body--ncat .blog-share,
.blog-body--ncat .blog-artigo__lateral { border: 2px solid #586d49; border-radius: 0; background: #1b2715; box-shadow: inset 2px 2px #324627, 5px 5px #081005; }
.blog-body--ncat .blog-author-card__avatar { border-color: #7ea763; border-radius: 0; }
.blog-body--ncat .blog-author-card p,
.blog-body--ncat .blog-author-card a,
.blog-body--ncat .blog-artigo__lateral > strong { color: #dae3d3; }
.blog-body--ncat .blog-author-card__body > span,
.blog-body--ncat .blog-share span { color: #b7f484; }
.blog-body--ncat .blog-author-card__links a,
.blog-body--ncat .blog-share a { display: inline-flex; align-items: center; min-height: 48px; border: 2px solid #536744; border-radius: 0; background: #2b3b23; color: #e2f7d0; text-decoration: none; overflow-wrap: anywhere; }
.blog-body--ncat .blog-author-card__links a:hover,
.blog-body--ncat .blog-share a:hover { background: #405833; color: #fff; }
.blog-body--ncat .blog-artigo__lateral > a { color: #b9f485; border-color: #425536; }
.blog-body--ncat .rodape { color: #bcccaf; background: #10190e; border-top: 3px solid #54783c; }

a.blog-card.blog-card--ncat,
a.blog-related-card.blog-related-card--ncat {
    border: 2px solid #5e8e40;
    border-radius: 0;
    background: #192813;
    color: #f4f8ee;
    box-shadow: 5px 5px #081005;
}
a.blog-card.blog-card--ncat:hover,
a.blog-related-card.blog-related-card--ncat:hover { border-color: #a9ee73; background: #23351b; box-shadow: 7px 7px #081005; transform: translate(-2px, -2px); }
a.blog-card.blog-card--ncat .blog-card__media,
a.blog-related-card.blog-related-card--ncat .blog-related-card__media { border-color: #608944; border-radius: 0; }
a.blog-card.blog-card--ncat :is(span, small),
a.blog-related-card.blog-related-card--ncat .blog-related-card__body small { color: #b9f485; }
a.blog-card.blog-card--ncat h3,
a.blog-related-card.blog-related-card--ncat .blog-related-card__body strong { color: #f4f8ee; font-family: "NCAT Pixel Blog", "JetBrains Mono", monospace; font-size: 1.2rem; font-weight: 400; line-height: 1.5; }
a.blog-related-card.blog-related-card--ncat .blog-related-card__body strong { font-size: .85rem; }
a.blog-card.blog-card--ncat p { color: #c7d7ba; }
a.blog-card.blog-card--ncat footer { border-color: #3e572e; }
.blog-categorias a.blog-categorias__item--ncat { border: 2px solid #668e48; border-radius: 0; background: #24391b; color: #c5f5a2; box-shadow: 3px 3px #081005; }
.blog-categorias a.blog-categorias__item--ncat small { color: inherit; }
.blog-categorias a.blog-categorias__item--ncat:hover,
.blog-categorias a.blog-categorias__item--ncat.ativo { background: #a9ee73; color: #10220e; }
.blog-body--ncat .blog-filtros input { border-color: #668e48; border-radius: 0; background: #192813; color: #f4f8ee; }
.blog-body--ncat .blog-filtros label span { color: #b9f485; }
.blog-body--ncat .blog-filtros button { border-color: #668e48; border-radius: 0; }
.blog-body--ncat .botao { min-height: 48px; border: 2px solid #668e48; border-radius: 0; box-shadow: inset 2px 2px #527040, inset -2px -2px #172312; }
.blog-body--ncat .botao--primario { background: #a9ee73; color: #10220e; }
.blog-body--ncat .botao--contorno { background: #24391b; color: #dcf4cb; }
.blog-body--ncat .botao:hover { background: #c7ff95; color: #10220e; box-shadow: inset 2px 2px #d1ffad, inset -2px -2px #5d9c36; }

@media (max-width: 860px) {
    .blog-body--ncat .blog-hero { padding: 44px 0 58px; }
    .blog-body--ncat .blog-hero::before { background: linear-gradient(90deg, rgba(8, 17, 7, .93), rgba(8, 17, 7, .72)), linear-gradient(0deg, #10190e, transparent); }
    .blog-body--ncat .blog-hero h1 { max-width: 100%; font-size: clamp(1.55rem, 4.8vw, 2.4rem); line-height: 1.35; }
    .blog-body--ncat .blog-hero p:not(.etiqueta) { font-size: 1rem; }
    .blog-body--ncat .blog-hero .etiqueta { font-size: .8rem; }
    .blog-body--ncat .blog-artigo { padding-top: 40px; }
    .blog-body--ncat .blog-artigo__conteudo { font-size: 1rem; }
    .blog-body--ncat .blog-artigo__conteudo h2 { font-size: 1.25rem; }
    .blog-body--ncat .blog-artigo__conteudo h3 { font-size: 1.1rem; }
    .blog-body--ncat .blog-meta { gap: 8px; }
    .blog-body--ncat .menu { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2px; padding-inline: 3px; overflow: visible; border-radius: 0; background: #1b2715; border: 2px solid #607a4c; box-shadow: inset 2px 2px #344729, 0 -4px #080e06; backdrop-filter: none; }
    .blog-body--ncat .menu a { min-width: 0; padding-inline: 2px; font-size: .625rem; line-height: 1.35; letter-spacing: .01em; white-space: normal; overflow-wrap: anywhere; }
    .blog-body--ncat .blog-author-card,
    .blog-body--ncat .blog-share { padding: 18px 14px; }
    .blog-body--ncat .blog-author-card__links { gap: 8px; }
    .blog-body--ncat .blog-special,
    .blog-body--ncat .blog-table-wrap { box-shadow: 3px 3px #081005; }
}

@media (prefers-reduced-motion: reduce) {
    a.blog-card.blog-card--ncat,
    a.blog-related-card.blog-related-card--ncat { transition: none; }
    a.blog-card.blog-card--ncat:hover,
    a.blog-related-card.blog-related-card--ncat:hover { transform: none; }
}
