/* Estrutura dos acabamentos NK. As versões claras ajustam o material em temas-claros.css. */
.tema-fundo, .topo-monograma, .bento-monograma { display: none; }

/* Temas básicos na primeira linha; acabamentos em pares sem rolagem horizontal. */
.aj-tema { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; border-radius: 20px; padding: 6px; }
.aj-tema button { grid-column: span 2; height: auto; min-height: 42px; padding: 9px 6px; border-radius: 14px; }
.aj-tema button:is([data-tema="auto"], [data-tema="claro"], [data-tema="escuro"]) { padding-inline: 2px; font-size: 13px; }
.aj-tema button:has(.aj-tema-amostra) { grid-column: span 3; display: grid; justify-items: center; gap: 5px; padding: 10px 6px 12px; }
.aj-tema-nome { overflow-wrap: normal; }
.aj-tema button small { font-size: 11px; font-weight: 400; line-height: 1.4; color: var(--tinta-2); }
.aj-tema-amostra { display: grid; place-items: center; width: 100%; height: 72px; border-radius: 12px; background: linear-gradient(130deg, #111c, #07070999), url('../assets/brasao-imperial.webp') center 35% / 82px auto no-repeat, #080808; color: #edc46f; font: 26px/1 Georgia, serif; letter-spacing: -.1em; text-shadow: 0 2px 2px #000, 0 -1px 0 #ffeec47a; box-shadow: inset 0 1px 0 #fae2a45c, inset 0 0 0 1px #dbab4154; }
.aj-tema [data-tema="relevo"] .aj-tema-amostra { background: linear-gradient(130deg, #1115, #07070955), url('../assets/brasao-imperial.webp') center 35% / 104px auto no-repeat, #080808; box-shadow: inset 0 2px 1px #fae2a4b0, inset 0 0 0 2px #dbab418c, 0 3px 7px #0005; }
.aj-tema-movimento { margin: 18px 6px 0; }
.aj-tema-movimento[hidden] { display: none; }
html[data-acabamento] .aj-tema-movimento input[switch]:checked { background-color: var(--ouro); box-shadow: inset 0 1px 1px #fff3, 0 4px 12px -5px #e8b04a80; }

html[data-acabamento] {
  color-scheme: dark;
  --plano: #070707;
  --ouro: #e8b04a;
  --ouro-rgb: 232, 176, 74;
  --ouro-luz: #fff1bf;
  --ouro-2: #78400b;
  --ouro-texto: #efcb7b;
  --ouro-metal: linear-gradient(120deg, #fff1bf, #e8b04a 38%, #b07822 72%, #fff1bf);
  --imperial-metal: linear-gradient(135deg, #fff1bf, #e8b04a 12%, #78400b 28%, #f8d67f 43%, #fff4ca 48%, #e8b04a 55%, #7b410d 74%, #eabb60 88%, #fff0b3);
  --imperial-polimento: .7;
  --imperial-borda: 1px;
  --imperial-brasao: .25;
  --imperial-painel: linear-gradient(140deg, rgba(34, 30, 24, .55), rgba(8, 8, 8, .71));
  --tinta: #faf4e8;
  --tinta-forte: #fff6e5;
  --tinta-2: #ddcfb5;
  --tinta-mudo: #c2b7a3;
  --superficie: #13110f;
  --superficie-2: #1d1913;
  --superficie-3: #292218;
  --acento: #d7a43e;
  --acento-claro: #efcb7b;
  --acento-escuro: #78400b;
  --acento-tinto: rgba(232, 176, 74, .14);
  --borda: rgba(221, 188, 112, .18);
  --borda-forte: rgba(221, 188, 112, .4);
  --hairline: rgba(215, 184, 112, .2);
  --trilha: #31291c;
  --vidro-grad: var(--imperial-painel);
  --vidro: rgba(46, 39, 28, .2);
  --vidro-2: rgba(46, 39, 28, .3);
  --vidro-3: rgba(72, 58, 36, .4);
  --vidro-brilho: rgba(255, 239, 196, .17);
  --vidro-barra: linear-gradient(145deg, rgba(28, 24, 18, .55), rgba(10, 9, 8, .65));
  --janela-fundo: linear-gradient(145deg, rgba(46, 39, 28, .44), rgba(10, 9, 8, .56));
  --janela-barra: rgba(24, 20, 15, .5);
  --janela-material: blur(18px) saturate(1.65);
  --grupo-fundo: rgba(31, 28, 24, .25);
  --grupo-linha: rgba(215, 184, 112, .15);
}
html[data-acabamento="relevo"] {
  --imperial-polimento: .95;
  --imperial-borda: 1.4px;
  --imperial-brasao: .38;
  --imperial-painel: linear-gradient(140deg, rgba(34, 30, 24, .29), rgba(8, 8, 8, .45));
  --janela-fundo: linear-gradient(145deg, rgba(46, 39, 28, .27), rgba(10, 9, 8, .39));
  --janela-material: blur(12px) saturate(1.65);
}

html[data-acabamento] body::before {
  background: radial-gradient(ellipse at 85% 25%, #b77a252e, transparent 55%), radial-gradient(ellipse at 7% 80%, #7f561c26, transparent 55%);
  animation: imperial-luz 15s ease-in-out infinite alternate;
}
html[data-acabamento] .tema-fundo { display: block; position: fixed; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; user-select: none; }
html[data-acabamento] .tema-brasao { position: absolute; width: min(90vw, 530px); height: auto; left: 50%; top: clamp(120px, 21dvh, 210px); transform: translateX(-50%); opacity: var(--imperial-brasao); filter: drop-shadow(0 18px 16px #000b) drop-shadow(0 0 12px #cd963735); animation: imperial-brasao 13s ease-in-out infinite alternate; }
html[data-acabamento="relevo"] .tema-brasao { width: min(102vw, 610px); top: clamp(100px, 17dvh, 170px); }
html[data-acabamento] .tema-iniciais { position: absolute; top: min(72dvh, 700px); left: 0; right: 0; text-align: center; font: clamp(90px, 17vw, 150px)/1 Georgia, serif; letter-spacing: -.08em; color: #d6aa4620; text-shadow: 0 2px 0 #000, 0 -1px 0 #fce0a112; }

/* O monograma substitui visualmente o ícone nos acabamentos NK. */
html[data-acabamento] .topo-logo { display: none; }
html[data-acabamento] .topo-monograma { display: grid; place-items: center; position: relative; width: 43px; height: 43px; border-radius: 50%; background: linear-gradient(140deg, #25211a, #080807 55%, #16130e); color: #efcb7b; font: 25px/1 Georgia, serif; letter-spacing: -.12em; padding-right: 3px; text-shadow: 0 -1px 0 #fff1b84d, 0 1px 1px #000; box-shadow: 0 6px 18px #0008, inset 0 1px 1px #fff2; }
html[data-acabamento] .topo .botao-icone { background: #13120e9c; color: #e8c987; }
html[data-acabamento] .topo.topo-compacto { background: var(--vidro-barra); }

/* A borda é uma camada mascarada: o metal nunca preenche o vidro transparente. */
html[data-acabamento] :is(.bento-bloco, .nav-inferior, .topo-monograma) { position: relative; }
html[data-acabamento] .nav-inferior { position: fixed; }
html[data-acabamento] :is(.bento-bloco, .nav-inferior, .topo-monograma)::after {
  content: ''; position: absolute; inset: 0; z-index: 5; pointer-events: none; border-radius: inherit;
  padding: var(--imperial-borda); background: var(--imperial-metal); background-size: 140% 140%; background-position: 50% 50%; opacity: var(--imperial-polimento);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite: xor;
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); mask-composite: exclude;
}
html[data-acabamento] :is(.bento-destaque, .nav-inferior, .topo-monograma)::after { animation: imperial-metal 11s ease-in-out infinite alternate; animation-play-state: var(--imperial-animacao, running); }
html[data-acabamento][data-tema-movimento="parado"], html[data-acabamento][data-tema-pausado] { --imperial-animacao: paused; }
html[data-acabamento] :is(.bento-bloco, .cartao, .vidro) { background: var(--imperial-painel); -webkit-backdrop-filter: blur(4px) saturate(1.45); backdrop-filter: blur(4px) saturate(1.45); box-shadow: inset 0 1px 0 #fff1, inset 0 -1px 1px #000b, 0 12px 26px -16px #000; }
html[data-acabamento] .cartao { border: 1px solid var(--borda); }
html[data-acabamento] .bento-destaque { color: var(--tinta-forte); padding-right: 78px; }
html[data-acabamento] .bento-destaque :is(h2, p) { max-width: 100%; }
html[data-acabamento] .bento-destaque .bento-mini { color: #eed199; }
html[data-acabamento] .bento-destaque > p:not(.bento-mini) { color: var(--tinta-2); }
html[data-acabamento] .bento-destaque::before { content: ''; inset: 0; width: auto; height: auto; border: 0; border-radius: inherit; background: linear-gradient(115deg, transparent 20%, #fff4bf0d 44%, #fff4bf20 45%, transparent 65%); transform: translateX(-85%); animation: imperial-reflexo 15s ease-in-out infinite; opacity: var(--imperial-polimento); pointer-events: none; }
/* NK ocupa a coluna da ação, sem passar atrás da descrição em telas estreitas. */
html[data-acabamento] .bento-monograma { display: block; position: absolute; right: 22px; top: 22px; font: 36px/1 Georgia, serif; letter-spacing: -.13em; background: var(--imperial-metal); background-clip: text; -webkit-background-clip: text; color: transparent; opacity: .35; filter: drop-shadow(0 2px 0 #000); pointer-events: none; }
html[data-acabamento] .bento-ir { background: #11100ccc; color: var(--ouro-texto); box-shadow: inset 0 1px 0 #fae2a44d, 0 4px 12px #0008; }
html[data-acabamento="relevo"] .bento-destaque { --imperial-borda: 2.5px; background: linear-gradient(135deg, #2c221667, #08080780); box-shadow: inset 0 3px 4px #ffe5a343, inset 0 -3px 3px #000, 0 2px 0 #492a12, 0 16px 26px -17px #a66a2450; }
html[data-acabamento="relevo"] .bento-monograma { opacity: .45; font-size: 40px; }
html[data-acabamento="relevo"][data-aba-ativa="inicio"] .pagina-hero-texto { text-align: center; width: 100%; }
html[data-acabamento] :is(.bento-mini, .bento-sub) { color: var(--tinta-2); }
html[data-acabamento] .bento-icone { background: #2e271e55; color: #efd196; }
html[data-acabamento] .bento-icone-ouro { background: var(--ouro-metal); color: var(--ouro-tinta); }
html[data-acabamento] .botao:not(.botao-fantasma):not(.botao-perigo) { box-shadow: inset 0 1px 0 #fff6, inset 0 -2px 1px #78400b88, 0 8px 20px -12px #d7a43e8a; }
html[data-acabamento] :is(.nav-inferior, .chat-entrada, .leitor-topo, .leitor-ferramentas, .leitor-barra-extra, .leitor-lateral, .topo.topo-compacto) { -webkit-backdrop-filter: blur(18px) saturate(1.6); backdrop-filter: blur(18px) saturate(1.6); }
html[data-acabamento] .nav-marcador { background: #f1d79912; box-shadow: inset 0 1px 0 #fae2a424; }
/* A borda nativa acompanha a janela ao rolar; uma camada absoluta rolava com o conteúdo. */
html[data-acabamento] .modal.modal, html[data-acabamento] .modal.modal-lateral { background: var(--janela-fundo); border-color: #b9914b80; border-top-color: #e2c482a6; border-left-color: #d9b36c80; border-right-color: #9c6a2973; -webkit-backdrop-filter: var(--janela-material); backdrop-filter: var(--janela-material); box-shadow: 0 25px 48px #0009, inset 0 1px 1px #ffefc44d, inset 0 -1px 1px #78400b66; }
html[data-acabamento] #camada-modal:not(:empty) { background: #0000001a; -webkit-backdrop-filter: none; backdrop-filter: none; }
html[data-acabamento] .modal :is(.aj-grupo, .menu-acoes-lista, .aj-sobre, .notebook-fontes, .add-formato) { background: var(--grupo-fundo); }
html[data-acabamento] .toast { background: var(--janela-fundo); color: var(--tinta); }
html[data-acabamento] .aj-tema button[aria-checked="true"] { box-shadow: inset 0 0 0 1px #e6c17899, inset 0 1px 0 #fff1bf44; }

@keyframes imperial-brasao { from { transform: translate3d(calc(-50% - 4px), 5px, 0) rotate(-1deg) scale(.987); } to { transform: translate3d(calc(-50% + 4px), -6px, 0) rotate(1deg) scale(1.01); } }
@keyframes imperial-luz { from { transform: translate3d(-10px, 0, 0); opacity: .65; } to { transform: translate3d(10px, 14px, 0); opacity: 1; } }
@keyframes imperial-reflexo { 0%, 15% { transform: translateX(-85%); } 70%, 100% { transform: translateX(80%); } }
@keyframes imperial-metal { from { background-position: 0% 10%; } to { background-position: 100% 85%; } }
html[data-acabamento][data-tema-movimento="parado"] .tema-brasao,
html[data-acabamento][data-tema-pausado] .tema-brasao,
html[data-acabamento][data-tema-movimento="parado"] .bento-destaque::before,
html[data-acabamento][data-tema-pausado] .bento-destaque::before,
html[data-acabamento][data-tema-movimento="parado"] body::before,
html[data-acabamento][data-tema-pausado] body::before { animation-play-state: paused; }
@media (min-width: 768px) { html[data-acabamento] .tema-fundo { left: 80px; } }
@media (prefers-reduced-motion: reduce) { html[data-acabamento] .tema-brasao, html[data-acabamento] .bento-destaque::before, html[data-acabamento] body::before, html[data-acabamento] :is(.bento-destaque, .nav-inferior, .topo-monograma)::after { animation: none !important; } }
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  html[data-acabamento] :is(.cartao, .bento-bloco, .vidro, .nav-inferior, .modal.modal, .modal.modal-lateral, .toast) { background: #17140f; }
}
@media print { .tema-fundo, .topo-monograma, .bento-monograma { display: none !important; } }