/* Teleprompter de @axeljuca. Se apoya en /diagnostico/assets/base.css */
.opc{font-weight:400;color:var(--gris)}
.barra-menta{background:linear-gradient(transparent 60%,var(--mandarina) 60%);padding:0 .06em}

/* portada con muestra del teleprompter */
.tp-portada{display:grid;gap:36px;align-items:center}
@media(min-width:900px){.tp-portada{grid-template-columns:1.25fr .75fr}}
.tp-muestra{display:none}
@media(min-width:900px){.tp-muestra{display:block}}
.tp-muestra-pantalla{position:relative;aspect-ratio:9/16;max-height:440px;margin-left:auto;border-radius:30px;background:#0E0B1C;box-shadow:0 0 0 10px #2A2246,0 30px 60px rgba(0,0,0,.35);padding:64px 22px 22px;overflow:hidden;font:800 1.45rem/1.25 "Figtree",sans-serif}
.tp-muestra-pantalla p{margin:0 0 .55em}
.tp-muestra-pantalla .pasada{color:#5E5778}
.tp-muestra-pantalla .actual{color:#fff}
.tp-muestra-pantalla .siguiente{color:#8C86A6}
.tp-muestra-pantalla::after{content:"";position:absolute;left:6px;top:128px;border:7px solid transparent;border-left:10px solid var(--mandarina)}
.tp-marca{font:800 .78rem/1 "Figtree",sans-serif;letter-spacing:.02em;color:var(--menta);opacity:.9}
.tp-muestra-pantalla .tp-marca{position:absolute;top:24px;left:22px}

/* temas */
.temas{display:grid;gap:8px;margin:0 0 10px}
@media(min-width:720px){.temas{grid-template-columns:1fr 1fr}}
.tema{display:block;text-align:left;width:100%;border:1.5px solid #CFC9BD;border-radius:12px;padding:12px 14px;background:var(--papel);cursor:pointer;font:600 1rem/1.35 "Figtree",sans-serif;color:var(--tinta);transition:transform .15s ease,border-color .15s ease,background .15s ease}
.tema:hover{transform:translateY(-2px);border-color:var(--tinta)}
.tema:active{transform:translateY(0)}
.tema q{display:block;quotes:none;font-weight:400;color:var(--gris);font-size:.93rem;margin-top:4px}
.tema[aria-checked="true"]{background:var(--menta);border-color:var(--tinta)}
.tema[aria-checked="true"] q{color:var(--tinta)}

.tp-editor{min-height:260px;font:500 1.06rem/1.6 "Figtree",sans-serif}
.tp-medida{margin:8px 0 0;font-weight:700;color:var(--ciruela)}
.tp-medida.avisa{color:#B23A0E}
.tp-ok{min-height:1.4em;margin:12px 0 0;font-weight:700;color:var(--ciruela)}
.btn{transition:transform .12s ease,filter .12s ease}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:translateY(1px) scale(.98)}

/* teleprompter a pantalla completa */
.tp{position:fixed;inset:0;z-index:50;background:#0B0916;color:#fff;display:flex;flex-direction:column}
.tp[hidden]{display:none}
.tp-vista{flex:1;overflow:hidden;position:relative;cursor:pointer;-webkit-mask-image:linear-gradient(transparent,#000 9%,#000 82%,transparent);mask-image:linear-gradient(transparent,#000 9%,#000 82%,transparent)}
.tp-texto{position:absolute;left:0;right:0;top:0;padding:0 max(18px,6vw);font:800 var(--tam,2.6rem)/1.32 "Figtree",sans-serif;letter-spacing:-.01em;will-change:transform;max-width:1100px;margin:0 auto}
.tp-texto p{margin:0 0 .7em}
.tp-texto .hueco{color:var(--mandarina)}
.tp.espejo .tp-texto{transform-origin:center;scale:-1 1}
.tp-guia{position:absolute;left:2px;width:0;height:0;border:10px solid transparent;border-left:14px solid var(--mandarina);pointer-events:none;top:calc(var(--linea-y,22%) - 10px)}
#lienzo{display:none}
.tp-marca-fija{position:absolute;top:max(12px,env(safe-area-inset-top));right:16px;font-size:.8rem;opacity:.75;pointer-events:none}
.tp-cuenta{position:absolute;inset:0;display:grid;place-content:center;font:800 9rem/1 "Bricolage",sans-serif;color:var(--mandarina);pointer-events:none}
.tp-cuenta:empty{display:none}
.tp-fin{position:absolute;top:max(56px,14%);left:16px;right:16px;max-width:560px;margin:0 auto;background:var(--papel);color:var(--tinta);border-radius:var(--radio);padding:24px}
.tp-fin[hidden]{display:none}
.tp-fin p{margin:10px 0 16px}
.tp-mandos{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px 12px;padding:12px 12px max(12px,env(safe-area-inset-bottom));background:#15112A;border-top:1px solid #2A2246}
.tp-grupo{display:flex;align-items:center;gap:6px;font-size:.85rem;color:#B9B3CC}
.tp-grupo output{min-width:1.4em;text-align:center;font-weight:800;color:#fff}
.tp-b{min-width:44px;min-height:44px;border-radius:999px;border:1.5px solid #3D3463;background:transparent;color:#fff;font:700 .95rem "Figtree",sans-serif;padding:0 14px;cursor:pointer;transition:background .12s ease,transform .12s ease}
.tp-b:hover{background:#2A2246}
.tp-b:active{transform:scale(.96)}
.tp-b[aria-pressed="true"]{background:var(--menta);color:var(--tinta);border-color:var(--menta)}
.tp-b-main{background:var(--mandarina);border-color:var(--mandarina);color:var(--tinta);min-width:96px}
.tp-b-main:hover{background:var(--mandarina);filter:brightness(1.06)}
@media(max-width:480px){
  .tp-grupo{gap:4px}
  .tp-grupo span{font-size:.72rem}
  .tp-b{padding:0 12px}
  .temas .tema{padding:11px 12px}
}
@media(prefers-reduced-motion:reduce){.tema,.btn,.tp-b{transition:none}.tema:hover,.btn:hover{transform:none}}
