/* Compartilhar trecho selecionado — botão flutuante e diálogo (novo desenho). */
.alem-article-content ::selection { background: color-mix(in srgb, var(--alem-ciano, #36aeb0) 24%, transparent); color: inherit; text-decoration: underline; text-decoration-color: var(--alem-ciano, #36aeb0); text-decoration-thickness: 2px; }

/* ---------- Botão ---------- */
.alem-tr-botao { position: fixed; z-index: 100003; display: flex; align-items: center; gap: 6px; padding: 5px; border-radius: 999px; background: var(--alem-botao-fundo, #0c0d0e); color: var(--alem-papel, #f6f3ee); box-shadow: 0 0 0 1px color-mix(in srgb, var(--alem-ciano, #36aeb0) 45%, transparent), 0 0 22px color-mix(in srgb, var(--alem-ciano, #36aeb0) 28%, transparent), 0 14px 34px color-mix(in srgb, var(--alem-botao-fundo, #0c0d0e) 30%, transparent); font-family: var(--alem-f-interface, "Source Sans 3", sans-serif); }
.alem-tr-botao[hidden] { display: none; }
.alem-tr-botao.is-entrando { animation: alem-tr-sobe .18s var(--alem-curva-entrada, cubic-bezier(.05,.7,.1,1)) both; }
@keyframes alem-tr-sobe { from { opacity: 0; transform: translateY(6px) scale(.96); } to { opacity: 1; transform: none; } }
.alem-tr-seta { position: absolute; left: 50%; bottom: -7px; width: 14px; height: 14px; margin-left: -7px; background: var(--alem-botao-fundo, #0c0d0e); transform: rotate(45deg); border-radius: 0 0 3px 0; box-shadow: 3px 3px 8px color-mix(in srgb, var(--alem-botao-fundo, #0c0d0e) 18%, transparent); }
.alem-tr-main { display: inline-flex; align-items: center; gap: 10px; height: 40px; padding: 0 18px 0 14px; border: 0; border-radius: 999px; background: var(--alem-papel, #f6f3ee); color: var(--alem-nanquim, #0c0d0e); font: 700 11.5px/1 var(--alem-f-interface, "Source Sans 3", sans-serif); letter-spacing: .12em; text-transform: uppercase; cursor: pointer; white-space: nowrap; }
.alem-tr-eclipse { position: relative; display: inline-block; width: 22px; height: 16px; flex: none; }
.alem-tr-eclipse i, .alem-tr-eclipse b { position: absolute; top: 0; width: 16px; height: 16px; border-radius: 50%; transition: transform .34s var(--alem-curva-entrada, cubic-bezier(.05,.7,.1,1)); }
.alem-tr-eclipse i { left: 6px; background: repeating-linear-gradient(180deg, var(--alem-verde, #067378) 0 2px, transparent 2px 4px); }
.alem-tr-eclipse b { left: 0; background: var(--alem-nanquim, #0c0d0e); }
.alem-tr-main:is(:hover, :focus-visible) .alem-tr-eclipse b { transform: translateX(-5px); }
.alem-tr-main:is(:hover, :focus-visible) .alem-tr-eclipse i { transform: translateX(3px); }
.alem-tr-sep { width: 1px; height: 22px; background: var(--alem-contorno-tela, #3a3b3c); }
.alem-tr-icone { display: inline-grid; place-items: center; width: 40px; height: 40px; border: 0; border-radius: 50%; background: transparent; color: var(--alem-papel, #f6f3ee); cursor: pointer; transition: box-shadow .24s var(--alem-curva, cubic-bezier(.2,0,0,1)); }
.alem-tr-icone:is(:hover, :focus-visible) { box-shadow: 0 0 0 1px var(--alem-ciano, #36aeb0), 0 0 14px color-mix(in srgb, var(--alem-ciano, #36aeb0) 45%, transparent); }
.alem-tr-botao.is-copiado .alem-tr-main { color: var(--alem-botao-fundo, #0c0d0e); box-shadow: 0 0 0 2px var(--alem-ciano, #36aeb0); }
.alem-tr-botao.is-barra { left: 12px; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom)); top: auto; border-radius: 22px; padding: 8px 8px 8px 16px; gap: 8px; }
.alem-tr-botao.is-barra .alem-tr-info { display: grid; flex: 1; min-width: 0; gap: 2px; }
.alem-tr-botao.is-barra .alem-tr-info b { font: 500 10px/1 var(--alem-f-mono, "IBM Plex Mono", monospace); letter-spacing: .14em; text-transform: uppercase; color: var(--alem-ciano-claro, #92e1dd); }
.alem-tr-botao.is-barra .alem-tr-previa-texto { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 400 14px/1.3 var(--alem-f-interface, "Source Sans 3", sans-serif); color: var(--alem-texto3-tela, #c9c4bb); }
.alem-tr-botao.is-barra .alem-tr-main { padding: 0 18px; }
@media (prefers-reduced-motion: reduce) { .alem-tr-botao.is-entrando { animation: none; } .alem-tr-eclipse b, .alem-tr-eclipse i { transition: none; } }

/* ---------- Diálogo ---------- */
html.alem-tr-aberto { overflow: hidden; }
.alem-tr-overlay { position: fixed; inset: 0; z-index: 100010; display: grid; place-items: center; padding: 20px; background: color-mix(in srgb, var(--alem-nanquim, #0c0d0e) 62%, transparent); }
.alem-tr-overlay[hidden] { display: none; }
.alem-tr-modal { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); width: min(1200px, 100%); max-height: min(820px, calc(100vh - 40px)); overflow: hidden; border-radius: var(--alem-raio-jornal, 28px 6px 6px 6px); background: var(--alem-campo, #fffdfa); border: var(--alem-contorno, 1.5px solid #111213); color: var(--alem-tinta, #111213); box-shadow: 0 30px 80px color-mix(in srgb, var(--alem-nanquim, #0c0d0e) 40%, transparent); }
.alem-tr-previa { display: grid; place-items: center; padding: 28px; background: var(--alem-papel-capa, #ece7de); min-height: 0; }
.alem-tr-canvas { display: block; max-width: 100%; max-height: calc(min(820px, 100vh - 40px) - 56px); width: auto; height: auto; box-shadow: 0 16px 40px color-mix(in srgb, var(--alem-nanquim, #0c0d0e) 22%, transparent); border-radius: 4px; background: var(--alem-branco, #ffffff); }
.alem-tr-painel { display: flex; flex-direction: column; gap: 18px; padding: 24px 28px 24px; overflow-y: auto; }
.alem-tr-topo { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }
.alem-tr-de { margin: 0 0 4px; color: var(--alem-verde, #067378); font: 500 10.5px/1.3 var(--alem-f-mono, "IBM Plex Mono", monospace); letter-spacing: .14em; text-transform: uppercase; }
.alem-tr-topo h2 { margin: 0; font: 620 34px/1.05 var(--alem-f-titulo, "Fraunces", serif); letter-spacing: -.02em; }
.alem-tr-fechar { flex: none; width: 44px; height: 44px; border: var(--alem-contorno, 1.5px solid #111213); border-radius: 50%; background: transparent; color: inherit; font-size: 24px; line-height: 1; cursor: pointer; transition: box-shadow .24s ease; }
.alem-tr-fechar:is(:hover, :focus-visible) { box-shadow: 0 0 0 1px var(--alem-ciano, #36aeb0), 0 0 14px color-mix(in srgb, var(--alem-ciano, #36aeb0) 35%, transparent); }
.alem-tr-rotulo2 { margin: 0 0 8px; font: 500 10.5px/1 var(--alem-f-mono, "IBM Plex Mono", monospace); letter-spacing: .16em; text-transform: uppercase; color: var(--alem-texto2, #5b5751); }
.alem-tr-estilos { display: grid; grid-template-columns: repeat(auto-fill, minmax(88px, 1fr)); gap: 10px; }
.alem-tr-estilo { display: grid; gap: 6px; padding: 0; border: 0; background: transparent; color: inherit; cursor: pointer; text-align: center; }
.alem-tr-mini { position: relative; display: block; border: 1.5px solid var(--alem-linha-forte, #c9c0b4); border-radius: 6px; overflow: hidden; line-height: 0; transition: box-shadow .24s ease, border-color .2s ease; }
.alem-tr-mini canvas { width: 100%; height: auto; display: block; background: var(--alem-papel-capa, #ece7de); }
.alem-tr-mini em { position: absolute; left: 5px; top: 5px; padding: 3px 5px; border-radius: 4px; background: var(--alem-nanquim, #0c0d0e); color: var(--alem-ciano-claro, #92e1dd); font: 600 8.5px/1 var(--alem-f-mono, "IBM Plex Mono", monospace); letter-spacing: .1em; text-transform: uppercase; font-style: normal; }
.alem-tr-nome { font: 600 12px/1.2 var(--alem-f-interface, "Source Sans 3", sans-serif); }
.alem-tr-estilo[aria-checked="true"] .alem-tr-mini { border-color: var(--alem-ciano, #36aeb0); box-shadow: 0 0 0 2px var(--alem-ciano, #36aeb0), 0 0 14px color-mix(in srgb, var(--alem-ciano, #36aeb0) 40%, transparent); }
.alem-tr-estilo:is(:hover, :focus-visible) .alem-tr-mini { border-color: var(--alem-tinta, #111213); }
.alem-tr-linha { display: flex; gap: 28px; flex-wrap: wrap; align-items: flex-start; }
.alem-tr-formatos { display: inline-flex; gap: 2px; padding: 4px; border-radius: 999px; background: var(--alem-areia, #e9e4db); }
.alem-tr-formatos button { height: 36px; padding: 0 16px; border: 1.5px solid transparent; border-radius: 999px; background: transparent; color: inherit; font: 700 11px/1 var(--alem-f-interface, "Source Sans 3", sans-serif); letter-spacing: .12em; text-transform: uppercase; cursor: pointer; }
.alem-tr-formatos button[aria-pressed="true"] { background: var(--alem-campo, #fffdfa); border-color: var(--alem-tinta, #111213); }
.alem-tr-opcoes { display: grid; gap: 8px; }
.alem-tr-opcoes label { display: flex; align-items: center; gap: 10px; font: 600 14px/1.2 var(--alem-f-interface, "Source Sans 3", sans-serif); cursor: pointer; }
.alem-tr-opcoes input { appearance: none; -webkit-appearance: none; position: relative; flex: none; width: 40px; height: 24px; margin: 0; border-radius: 999px; background: var(--alem-linha-forte, #c9c0b4); cursor: pointer; transition: background-color .2s ease; }
.alem-tr-opcoes input::after { content: ""; position: absolute; left: 3px; top: 3px; width: 18px; height: 18px; border-radius: 50%; background: var(--alem-branco, #ffffff); transition: transform .22s var(--alem-curva, cubic-bezier(.2,0,0,1)); }
.alem-tr-opcoes input:checked { background: var(--alem-nanquim, #0c0d0e); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--alem-ciano, #36aeb0) 60%, transparent); }
.alem-tr-opcoes input:checked::after { transform: translateX(16px); background: var(--alem-ciano-claro, #92e1dd); }
.alem-tr-opcoes input:focus-visible { outline: 2px solid var(--alem-verde, #067378); outline-offset: 2px; }
.alem-tr-acoes { display: flex; gap: 10px; flex-wrap: wrap; }
.alem-tr-principal, .alem-tr-sec { height: 48px; padding: 0 24px; border-radius: 999px; font: 700 12px/1 var(--alem-f-interface, "Source Sans 3", sans-serif); letter-spacing: .14em; text-transform: uppercase; cursor: pointer; transition: box-shadow .24s var(--alem-curva, cubic-bezier(.2,0,0,1)); }
.alem-tr-principal { border: 0; background: var(--alem-botao-fundo, #0c0d0e); color: var(--alem-papel, #f6f3ee); box-shadow: 0 0 0 1px var(--alem-botao-fundo, #0c0d0e); }
.alem-tr-principal:is(:hover, :focus-visible) { box-shadow: var(--alem-brilho-hover, 0 0 0 1px #36aeb0, 0 0 22px rgba(54,174,176,.45)); }
.alem-tr-sec { border: var(--alem-contorno, 1.5px solid #111213); background: transparent; color: inherit; }
.alem-tr-sec:is(:hover, :focus-visible) { box-shadow: 0 0 0 1px var(--alem-ciano, #36aeb0), 0 0 16px color-mix(in srgb, var(--alem-ciano, #36aeb0) 35%, transparent); }
.alem-tr-direto > div { display: flex; flex-wrap: wrap; gap: 8px; }
.alem-tr-direto :is(a, button) { display: inline-flex; align-items: center; height: 38px; padding: 0 16px; border: var(--alem-contorno, 1.5px solid #111213); border-radius: 999px; background: transparent; color: inherit; font: 700 11px/1 var(--alem-f-interface, "Source Sans 3", sans-serif); letter-spacing: .12em; text-transform: uppercase; text-decoration: none; cursor: pointer; transition: background-color .24s ease, color .2s ease, box-shadow .3s ease; }
.alem-tr-direto :is(a, button):is(:hover, :focus-visible) { background: var(--alem-botao-fundo, #0c0d0e); color: var(--alem-papel, #f6f3ee); box-shadow: 0 0 0 1px var(--alem-ciano, #36aeb0), 0 0 14px color-mix(in srgb, var(--alem-ciano, #36aeb0) 45%, transparent); }
.alem-tr-status { min-height: 18px; margin: 0; color: var(--alem-verde, #067378); font: 500 12px/1.4 var(--alem-f-mono, "IBM Plex Mono", monospace); }

@media (max-width: 900px) {
  .alem-tr-overlay { padding: 0; align-items: end; }
  .alem-tr-modal { grid-template-columns: 1fr; width: 100%; max-height: 94vh; border-radius: 22px 22px 0 0; overflow-y: auto; }
  .alem-tr-previa { padding: 18px; }
  .alem-tr-canvas { max-height: 38vh; }
  .alem-tr-painel { padding: 18px 18px calc(24px + env(safe-area-inset-bottom)); overflow: visible; }
  .alem-tr-estilos { grid-auto-flow: column; grid-auto-columns: 88px; grid-template-columns: none; overflow-x: auto; padding-bottom: 6px; }
  .alem-tr-topo h2 { font-size: 28px; }
  .alem-tr-acoes > * { flex: 1 1 auto; }
}