/* Teoría ("apuntes"): lectura, cajas, tarjetas de ejercicio, widgets y SVG.
   Usa la paleta de dashboard.css (--bg-dark, --accent-*, --text-*). */

.teoria {
    --t-ancho: 46rem;
    --t-a: var(--accent-blue, #3b82f6);
    --t-b: var(--accent-orange, #f59e0b);
    --t-c: var(--accent-green, #10b981);
    --t-d: var(--accent-purple, #8b5cf6);
    --t-e: var(--accent-pink, #ec4899);
    --t-ink: var(--text-primary, #f0f0f5);
    --t-ink2: var(--text-secondary, #c8c8d6);
    --t-mute: var(--text-muted, #9a9ab0);
    --t-line: var(--border, #2a2a3a);
    --t-card: var(--bg-card, #12121a);
    --t-bg: var(--bg-dark, #0a0a0f);
    color: var(--t-ink2);
    font-family: var(--font-sans, Inter, system-ui, sans-serif);
    font-size: 1.0625rem;
    line-height: 1.7;
}
.teoria h1, .teoria h2, .teoria h3 { color: var(--t-ink); line-height: 1.25; }
.teoria h1 { font-size: clamp(1.7rem, 5vw, 2.4rem); font-weight: 800; margin: .2em 0 .4em; letter-spacing: -.02em; }
.teoria h2 { font-size: 1.45rem; font-weight: 750; margin: 2.6rem 0 1rem; scroll-margin-top: 4.5rem; }
.teoria h3 { font-size: 1.15rem; font-weight: 700; margin: 1.8rem 0 .6rem; }
.teoria p { margin: 0 0 1rem; }
.teoria .katex-html { white-space: normal; }
.teoria strong { color: var(--t-ink); }
.teoria a { color: var(--t-a); }
.teoria ul, .teoria ol { margin: 0 0 1rem 1.3rem; }
.teoria li { margin: .2rem 0; }
.teoria li > p { margin: 0; }
.teoria table { border-collapse: collapse; margin: 1rem 0 1.4rem; width: 100%; font-size: .95rem; display: block; overflow-x: auto; }
.teoria th, .teoria td { border: 1px solid var(--t-line); padding: .45rem .7rem; text-align: center; }
.teoria th { background: var(--t-card); color: var(--t-ink); font-weight: 650; }
.teoria .katex { font-size: 1.08em; }
.teoria .katex-display { margin: 1rem 0; overflow-x: auto; overflow-y: hidden; padding: .2rem 0; }
.teoria code { font-family: var(--font-mono, monospace); font-size: .9em; }

.t-intro { font-size: 1.15rem; color: var(--t-ink); }
.t-seccion { border-top: 1px solid var(--t-line); }
.t-seccion:first-of-type { border-top: 0; }

/* ---- SVG ilustraciones: colores por clase (ver docs/teoria/formato.md) ---- */
/* :not() excluye el ejercicio embebido (.t-ej-interactivo, ver más abajo):
   trae sus propios iconos pequeños (botonera, enviar...) con su propio
   tamaño en ejercicio.css; esta regla es solo para los diagramas de teoría.
   También excluye los svg internos de KaTeX (.katex svg: el símbolo de
   raíz y otros delimitadores estirables), que necesitan su propio
   posicionamiento absoluto — si no, desaparecen (p.ej. \sqrt[3]{64}). */
.teoria svg:not(.t-ej-interactivo svg):not(.katex svg) { width: 100%; max-width: 34rem; height: auto; display: block; margin: 1.2rem auto; overflow: visible; }
.teoria .t-widget svg.t-w-svg { max-width: 30rem; }
.teoria .t-ej-enunciado svg { max-width: 26rem; }
.teoria p > svg, .teoria figure svg { margin: 0 auto; }
.teoria svg text { fill: var(--t-ink); font-family: var(--font-sans, Inter, sans-serif); font-size: 15px; stroke: none; }
/* peq/grande/mid en un <g> se aplican a sus textos (antes de text.* para que gane la clase propia) */
.teoria svg g.peq text { font-size: 12px; } .teoria svg g.grande text { font-size: 20px; font-weight: 700; }
.teoria svg g.mid text { text-anchor: middle; }
.teoria svg text.peq { font-size: 12px; fill: var(--t-mute); }
.teoria svg text.grande { font-size: 20px; font-weight: 700; }
.teoria svg text.mid { text-anchor: middle; }
.teoria svg .tinta { stroke: var(--t-ink); fill: none; }
.teoria svg .tinta-f { fill: var(--t-ink); }
.teoria svg .suave { stroke: var(--t-line); fill: none; }
.teoria svg .suave-f { fill: var(--t-card); }
.teoria svg .fondo-f { fill: var(--t-bg); }
.teoria svg .a { stroke: var(--t-a); fill: none; } .teoria svg .a-f { fill: var(--t-a); } .teoria svg .a-t { fill: var(--t-a); fill-opacity: .22; }
.teoria svg .b { stroke: var(--t-b); fill: none; } .teoria svg .b-f { fill: var(--t-b); } .teoria svg .b-t { fill: var(--t-b); fill-opacity: .22; }
.teoria svg .c { stroke: var(--t-c); fill: none; } .teoria svg .c-f { fill: var(--t-c); } .teoria svg .c-t { fill: var(--t-c); fill-opacity: .22; }
.teoria svg .d { stroke: var(--t-d); fill: none; } .teoria svg .d-f { fill: var(--t-d); } .teoria svg .d-t { fill: var(--t-d); fill-opacity: .22; }
.teoria svg .e { stroke: var(--t-e); fill: none; } .teoria svg .e-f { fill: var(--t-e); } .teoria svg .e-t { fill: var(--t-e); fill-opacity: .22; }
.teoria svg text.a-f, .teoria svg text.b-f, .teoria svg text.c-f, .teoria svg text.d-f, .teoria svg text.e-f { stroke: none; }
.teoria svg text.a-f { fill: var(--t-a); } .teoria svg text.b-f { fill: var(--t-b); } .teoria svg text.c-f { fill: var(--t-c); }
.teoria svg text.d-f { fill: var(--t-d); } .teoria svg text.e-f { fill: var(--t-e); }
.teoria svg .grueso { stroke-width: 3; } .teoria svg .fino { stroke-width: 1; }
.teoria svg .discontinuo { stroke-dasharray: 6 5; }
.teoria svg .tenue { stroke-opacity: .3; }
.teoria svg [class~="a"], .teoria svg [class~="b"], .teoria svg [class~="c"], .teoria svg [class~="d"],
.teoria svg [class~="e"], .teoria svg .tinta { stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.teoria svg .grueso { stroke-width: 3.5; }
.teoria svg .fino { stroke-width: 1; }

/* ---- Cajas ---- */
.t-caja {
    --t-k: var(--t-a);
    margin: 1.4rem 0; padding: 1rem 1.15rem 1rem; border-radius: 14px;
    background: color-mix(in srgb, var(--t-k) 9%, var(--t-card));
    border: 1px solid color-mix(in srgb, var(--t-k) 35%, transparent);
    border-left: 5px solid var(--t-k);
}
.t-caja-cab { font-weight: 750; color: var(--t-k); font-size: .95rem; letter-spacing: .01em; margin-bottom: .45rem; overflow-wrap: anywhere; }
.t-caja-cab > i { margin-right: .4rem; }
.t-caja-cuerpo > :last-child { margin-bottom: 0; }
.t-definicion { --t-k: var(--t-a); }
.t-propiedad { --t-k: var(--t-c); }
.t-ejemplo { --t-k: var(--t-d); }
.t-cuidado { --t-k: var(--t-e); }
.t-truco { --t-k: var(--t-b); }
.t-sabias { --t-k: #22d3ee; }
.t-pregunta { --t-k: var(--t-b); }
.t-resumen { --t-k: var(--t-c); background: var(--t-card); }
.t-paso { animation: t-aparece .35s ease; }
.t-paso + .t-paso { border-top: 1px dashed var(--t-line); padding-top: .8rem; margin-top: .4rem; }
.t-oculto { display: none; }
@keyframes t-aparece { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.t-btn-paso, .t-w-btn {
    font: inherit; font-size: .92rem; font-weight: 650; cursor: pointer;
    border-radius: 999px; padding: .42rem 1rem; margin-top: .5rem;
    background: color-mix(in srgb, var(--t-k, var(--t-a)) 20%, transparent);
    color: var(--t-ink); border: 1px solid color-mix(in srgb, var(--t-k, var(--t-a)) 55%, transparent);
}
.t-btn-paso:hover, .t-w-btn:hover { background: color-mix(in srgb, var(--t-k, var(--t-a)) 35%, transparent); }
.t-cont { color: var(--t-mute); font-weight: 500; }
.t-sol { margin-top: .6rem; }
.t-sol summary { cursor: pointer; color: var(--t-k); font-weight: 650; }
.t-sol[open] summary { margin-bottom: .5rem; }

/* ---- Tarjetas de ejercicio ---- */
.t-ej {
    margin: 1rem 0; padding: .85rem 1rem; border-radius: 14px;
    background: var(--t-card); border: 1px solid var(--t-line);
    display: grid; grid-template-columns: 1fr auto; gap: .35rem .8rem; align-items: center;
}
.t-ej-cab { grid-column: 1 / -1; display: flex; gap: .6rem; align-items: center; font-size: .85rem; }
.t-ej-tag { color: var(--t-c); font-weight: 700; text-transform: uppercase; letter-spacing: .06em; font-size: .75rem; }
.t-ej-dif { color: var(--t-b); letter-spacing: .1em; }
/* Estado de resolución del alumno (teoria/render.py: icono_estado), arriba a
   la derecha de la tarjeta y de cada enlace de «¡A practicar!». */
.t-ej-estado { margin-left: auto; font-size: 1.15rem; line-height: 1; flex: none; }
.t-est-done { color: #10b981; }
.t-est-in-progress { color: #f59e0b; }
.t-est-pending { color: var(--t-mute); opacity: .55; }
.t-ej-cuerpo { min-width: 0; }
.t-ej-cuerpo summary { cursor: pointer; color: var(--t-ink2); font-size: .97rem; line-height: 1.5; list-style: none; }
.t-ej-cuerpo summary::-webkit-details-marker { display: none; }
.t-ej-cuerpo[open] summary { display: none; }
.t-ej-enunciado { font-size: .97rem; }
.t-ej-enunciado svg { max-height: 260px; }
.t-ej-btn {
    align-self: end; white-space: nowrap; text-decoration: none; font-weight: 700; font-size: .92rem;
    padding: .5rem 1rem; border-radius: 999px; background: var(--t-c); color: #04120c !important;
}
.t-ej-btn:hover { filter: brightness(1.1); }
.t-ej-btn .spinner-border { vertical-align: -.15em; }
.t-ej-falta { color: var(--t-e); }
@media (max-width: 560px) {
    .t-ej { grid-template-columns: minmax(0, 1fr); }
    .t-ej-btn { justify-self: start; }
}

/* Ejercicio resuelto dentro de la propia tarjeta (ver teoria/render.py y
   static/js/teoria/ejercicio-inline.js): solo uno abierto a la vez. */
.t-ej-interactivo { grid-column: 1 / -1; }
.t-ej-interactivo:empty { display: none; }
.t-ej.t-ej--abierto { grid-template-columns: minmax(0, 1fr); }
/* El ancho útil es el de la tarjeta (hay índice lateral), no el de la ventana:
   la fila de botones de respuesta se parte en líneas en vez de desbordar. */
.t-ej-interactivo { min-width: 0; }
.t-ej-interactivo .answer-section { padding-left: 0; padding-right: 0; }
.t-ej-interactivo .answer-actions,
.t-ej-interactivo .action-buttons-left,
.t-ej-interactivo .action-buttons-right { flex-wrap: wrap; gap: 10px; }
.t-ej.t-ej--abierto .t-ej-btn { display: none; }
/* El enunciado completo ya sale dentro de .t-ej-interactivo: el teaser
   colapsado (resumen + <details>) sobra y duplicaba el texto. */
.t-ej.t-ej--abierto .t-ej-cuerpo { display: none; }
.t-ej-interactivo .exercici-embebido { padding: 0; margin-top: .6rem; }
.t-ej-interactivo .enunciado { font-size: 1rem; }
.t-ej-cerrar { display: flex; justify-content: flex-end; margin: .2rem 0 .4rem; }
.t-ej-cerrar button {
    font: inherit; font-size: .85rem; color: var(--t-mute);
    background: none; border: 0; cursor: pointer; padding: .2rem .4rem;
}
.t-ej-cerrar button:hover { color: var(--t-ink); }
.t-practica {
    margin: 2rem 0 1rem; padding: 1.1rem 1.15rem; border-radius: 16px;
    background: linear-gradient(135deg, color-mix(in srgb, var(--t-c) 18%, var(--t-card)), var(--t-card));
    border: 1px solid color-mix(in srgb, var(--t-c) 40%, transparent);
}
.t-pr-cab { font-weight: 750; color: var(--t-ink); margin-bottom: .6rem; }
.t-pr-cab i { color: var(--t-b); }
.t-pr-lista { display: grid; gap: .4rem; }
.t-pr-item { display: flex; align-items: flex-start; gap: .6rem; padding: .5rem .75rem; border-radius: 10px; background: color-mix(in srgb, var(--t-bg) 60%, transparent); color: var(--t-ink2) !important; text-decoration: none; font-size: .93rem; line-height: 1.45; }
.t-pr-item .t-ej-estado { font-size: 1rem; margin-top: .15rem; }
.t-pr-item:hover { background: var(--t-bg); color: var(--t-ink) !important; }

/* ---- Widgets ---- */
.t-widget {
    margin: 1.5rem 0; padding: 1rem; border-radius: 16px;
    background: var(--t-card); border: 1px solid var(--t-line);
    position: relative;
}
.t-widget::before {
    content: "Interactivo"; position: absolute; top: -.7rem; left: 1rem;
    font-size: .7rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase;
    background: var(--t-d); color: #fff; padding: .1rem .55rem; border-radius: 999px;
}
.t-widget svg.t-w-svg { margin: .3rem auto .6rem; touch-action: none; user-select: none; -webkit-user-select: none; max-height: 420px; }
.t-w-ctrl { display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); gap: .5rem 1.2rem; }
.t-w-ctrl label { display: grid; grid-template-columns: auto 1fr auto; gap: .6rem; align-items: center; font-size: .92rem; color: var(--t-ink2); }
.t-w-ctrl label b { color: var(--t-ink); min-width: 2.6em; text-align: right; font-variant-numeric: tabular-nums; }
.t-w-ctrl input[type=range] { width: 100%; accent-color: var(--t-a); height: 1.6rem; }
.t-w-btns { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .3rem; }
.t-w-btns .t-w-btn { margin-top: 0; }
.t-w-btn.activo { background: var(--t-a); border-color: var(--t-a); }
.t-w-out { margin-top: .7rem; padding: .6rem .8rem; border-radius: 10px; background: var(--t-bg); color: var(--t-ink); font-size: 1rem; min-height: 2.6rem; overflow-x: auto; }
.t-w-out table { margin: 0; font-size: .9rem; }
.t-w-out .ok { color: var(--t-c); font-weight: 700; }
.t-w-out .ko { color: var(--t-e); font-weight: 700; }
.t-w-in { font: inherit; width: 100%; padding: .45rem .7rem; border-radius: 10px; border: 1px solid var(--t-line); background: var(--t-bg); color: var(--t-ink); margin-bottom: .5rem; }
.t-w-pista { font-size: .85rem; color: var(--t-mute); margin-top: .4rem; }
.t-w-svg .arrastra { cursor: grab; }
.t-w-svg .arrastra:active { cursor: grabbing; }
.t-w-svg .halo { fill: var(--t-a); fill-opacity: .18; }

/* ---- Página de apuntes: índice, contenido y "en este apartado" ---- */
.tl-cuerpo { display: grid; grid-template-columns: 17rem minmax(0, 1fr) 14rem; gap: 2.5rem; max-width: 86rem; margin: 0 auto; padding: 0 1.2rem; }
.tl-indice, .tl-aqui { position: sticky; top: var(--tl-top, 3.6rem); align-self: start; max-height: calc(100vh - var(--tl-top, 3.6rem) - .5rem); overflow-y: auto; padding: 1.5rem 0; font-size: .9rem; }
.tl-indice details { margin-bottom: .3rem; }
.tl-indice summary { cursor: pointer; color: var(--text-primary); font-weight: 650; padding: .25rem 0; }
.tl-indice .tl-tema { color: var(--text-muted); font-size: .75rem; text-transform: uppercase; letter-spacing: .06em; margin: .5rem 0 .2rem .4rem; }
.tl-indice a, .tl-indice .tl-sin, .tl-aqui a { display: block; padding: .28rem .6rem; border-radius: 8px; color: var(--text-secondary); text-decoration: none; line-height: 1.35; }
.tl-indice a:hover, .tl-aqui a:hover { background: var(--bg-card); color: var(--text-primary); }
.tl-indice a.actual { background: color-mix(in srgb, var(--accent-blue) 20%, transparent); color: var(--text-primary); }
.tl-indice .tl-sin { opacity: .45; }
.tl-aqui .tit { color: var(--text-muted); font-size: .75rem; text-transform: uppercase; letter-spacing: .06em; margin-bottom: .4rem; }
.tl-aqui a.activo { color: var(--accent-green); }
main.teoria { max-width: var(--t-ancho); width: 100%; padding: 1.5rem 0 4rem; justify-self: center; }
.tl-chips { display: none; gap: .4rem; overflow-x: auto; padding: .2rem 0 .8rem; margin-bottom: .5rem; scrollbar-width: none; }
.tl-chips a { flex: none; font-size: .85rem; padding: .3rem .8rem; border-radius: 999px; background: var(--bg-card); border: 1px solid var(--border); color: var(--text-secondary); text-decoration: none; }
.tl-curso-materia { color: var(--text-muted); font-size: .72rem; margin-bottom: .15rem; }
.tl-cap { color: var(--accent-green); font-weight: 700; font-size: .8rem; text-transform: uppercase; letter-spacing: .08em; }
.tl-estado { display: inline-block; font-size: .72rem; padding: .1rem .5rem; border-radius: 999px; border: 1px solid var(--border); color: var(--text-muted); margin-left: .5rem; vertical-align: middle; }
.tl-todos {
    display: flex; align-items: center; justify-content: center; gap: .5rem;
    margin-top: 3rem; padding: .8rem 1rem; border-radius: 14px;
    background: var(--bg-card); border: 1px solid var(--border);
    color: var(--text-primary) !important; text-decoration: none; font-weight: 650; font-size: .95rem;
}
.tl-todos:hover { border-color: var(--accent-green); color: var(--accent-green) !important; }
.tl-nav { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; margin-top: 1rem; }
.tl-nav a { padding: .9rem 1rem; border-radius: 14px; background: var(--bg-card); border: 1px solid var(--border); text-decoration: none; color: var(--text-primary); }
.tl-nav a small { display: block; color: var(--text-muted); }
.tl-nav a.sig { text-align: right; grid-column: 2; }
.tl-velo { display: none; }
@media (max-width: 1180px) { .tl-cuerpo { grid-template-columns: 16rem minmax(0, 1fr); } .tl-aqui { display: none; } .tl-chips { display: flex; } }
@media (max-width: 860px) {
    .tl-cuerpo { grid-template-columns: minmax(0, 1fr); padding: 0 1rem; }
    .tl-indice { position: fixed; top: 0; left: 0; bottom: 0; width: min(85vw, 22rem); max-height: none; z-index: 40;
       background: var(--bg-card); padding: 1rem; transform: translateX(-105%); transition: transform .25s ease; border-right: 1px solid var(--border); }
    body.tl-menu-abierto .tl-indice { transform: none; }
    body.tl-menu-abierto .tl-velo { display: block; position: fixed; inset: 0; background: #0008; z-index: 30; }
}
.tl-boton-indice { display: none; font: inherit; font-size: .9rem; font-weight: 650; margin: .2rem 0 .8rem;
    padding: .4rem .9rem; border-radius: 999px; border: 1px solid var(--border); background: var(--bg-card); color: var(--text-primary); cursor: pointer; }
.tl-volver { display: inline-flex; gap: .4rem; align-items: center; font-size: .9rem; margin-bottom: .6rem; color: var(--text-secondary) !important; text-decoration: none; }
.tl-origen { font-size: .85rem; color: var(--text-muted); margin: -.2rem 0 1rem; }
.tl-origen i { color: var(--accent-purple); }
@media (max-width: 860px) { .tl-boton-indice { display: inline-block; } }

/* Enlace "Apuntes" en el pie de las cajas de apartado (entreno/temas.py) */
.section-pie { margin-top: .9rem; padding-top: .8rem; border-top: 1px solid var(--border, #2a2a3a); display: flex; justify-content: flex-end; }
.section-apuntes { display: inline-flex; align-items: center; gap: .35rem; font-size: .9rem; font-weight: 650;
    color: var(--accent-purple, #8b5cf6) !important; text-decoration: none; padding: .3rem .8rem; border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--accent-purple, #8b5cf6) 45%, transparent); }
.section-apuntes:hover { background: color-mix(in srgb, var(--accent-purple, #8b5cf6) 18%, transparent); }

/* Título del apartado + enlace "Apuntes" en la cabecera del ejercicio (entreno/salida/ejercicio.py) */
.ejercicio-apartado { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .4rem .8rem; margin-bottom: .5rem; }
.ejercicio-apartado h5 { margin: 0; }
.ejercicio-apartado .section-apuntes { font-size: .8rem; padding: .2rem .7rem; }

/* Caja «Pregúntame algo» (paginas/teoria/pregunta.py): justo antes de ¡A practicar! */
.t-consulta { margin: 1.5rem 0 1rem; }
.t-cons-form {
    display: flex; align-items: center; gap: .55rem; margin: 0;
    padding: .3rem .35rem .3rem .9rem; border-radius: 999px;
    background: var(--t-card); border: 1px solid var(--t-line);
}
.t-cons-form:focus-within { border-color: color-mix(in srgb, var(--t-a) 70%, transparent); }
.t-cons-form > i { color: var(--t-a); }
.t-cons-form input {
    flex: 1; min-width: 0; margin: 0; padding: .35rem 0; height: auto;
    background: none; border: 0; box-shadow: none; outline: none;
    color: var(--t-ink); font: inherit; font-size: .95rem;
}
.t-cons-form input::placeholder { color: var(--t-mute); }
.t-cons-form button {
    flex: none; display: inline-flex; align-items: center; justify-content: center; gap: .3rem;
    width: auto; margin: 0; padding: .4rem .75rem; border-radius: 999px; border: 0;
    background: var(--t-a); color: #fff; cursor: pointer;
}
.t-cons-form button:disabled { opacity: .6; cursor: wait; }
.t-cons-form button .htmx-indicator { display: none; }
.t-cons-form.htmx-request button .htmx-indicator { display: inline-block; }
.t-cons-form.htmx-request button i { display: none; }
.t-cons-res:empty { display: none; }
.t-cons-res { display: grid; gap: .9rem; margin-top: .9rem; }
.t-cons-tuya {
    justify-self: end; max-width: 85%; padding: .45rem .85rem; border-radius: 14px 14px 4px 14px;
    background: color-mix(in srgb, var(--t-a) 22%, var(--t-card)); color: var(--t-ink); font-size: .95rem;
}
.t-cons-ia {
    margin-top: .5rem; padding: .8rem 1rem; border-radius: 14px;
    background: var(--t-card); border: 1px solid var(--t-line); font-size: .97rem;
}
.t-cons-ia > :last-child { margin-bottom: 0; }
.t-cons-aviso { color: var(--t-b); font-size: .92rem; }
/* «Mis dudas de este apartado»: plegado, privado del alumno */
.t-cons-hist { margin-top: .9rem; }
.t-cons-hist > summary { cursor: pointer; color: var(--t-mute); font-size: .92rem; font-weight: 650; }
.t-cons-hist > summary:hover { color: var(--t-ink); }
.t-cons-priv { color: var(--t-mute); font-size: .82rem; margin: .5rem 0 .2rem; }
.t-cons-hist-lista { display: grid; gap: .5rem; margin: .6rem 0; }
.t-duda { border: 1px solid var(--t-line); border-radius: 12px; padding: .5rem .8rem; background: var(--t-card); }
.t-duda > summary { cursor: pointer; color: var(--t-ink2); font-size: .95rem; }
.t-duda[open] > summary { margin-bottom: .4rem; color: var(--t-ink); }
.t-duda .t-cons-ia { margin-top: 0; border: 0; padding: .2rem 0; background: none; }
.t-duda-borrar {
    font: inherit; font-size: .8rem; color: var(--t-mute); background: none; border: 0;
    cursor: pointer; padding: .25rem 0; margin-top: .3rem; width: auto;
}
.t-duda-borrar:hover { color: var(--t-e, #f87171); }