/* El marco de una pieza de marca (un efecto, una transición, el desmontable): lo que la enseña, no la pieza.
   Abierta sola, sale con su ficha arriba; dentro del manual (en un iframe), sale solo la escena, sobre transparente.
   La pieza de verdad va en el propio archivo, entre «La pieza»; esto no se copia. */
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--papel);color:var(--tinta);font:400 16px/1.5 var(--letra,'Inter',system-ui,sans-serif);font-optical-sizing:auto;-webkit-font-smoothing:antialiased}
.pagina{max-width:760px;margin:0 auto;padding:clamp(24px,6vw,64px) 16px;display:grid;gap:20px}
.ficha .tipo{font-size:10.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--tinta-3)}
.ficha h1{font-size:clamp(28px,5vw,42px);line-height:1.04;letter-spacing:-.035em;font-weight:600;margin:6px 0 10px}
.ficha .sello{display:inline-flex;align-items:center;gap:8px;font:600 12px/1.2 var(--letra,'Inter',sans-serif);font-style:normal;color:var(--tinta-3);margin-bottom:14px}
.ficha .sello::before{content:"";width:16px;height:6px;border-radius:2.9px 1.2px 3.4px 1.2px;background:var(--apagado);transform:rotate(-2deg)}
.ficha .sello.fijo{color:var(--tinta)} .ficha .sello.fijo::before{background:var(--lima)}
.ficha dl{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;margin:0;font-size:15px}
.ficha dt{color:var(--tinta-3)} .ficha dd{margin:0}
.codigo{font-size:13.5px;color:var(--tinta-2);margin:0}
.escena{position:relative;overflow:hidden;height:min(62vh,420px);border-radius:18px;background:var(--carta);box-shadow:0 0 0 1px var(--linea);display:grid;place-items:center;padding:20px}
html.incrustada body{background:transparent}
html.incrustada .pagina{display:block;max-width:none;padding:0}
html.incrustada .ficha,html.incrustada .codigo{display:none}
html.incrustada .escena{height:100vh;border-radius:0;box-shadow:none;background:transparent;padding:12px}
/* para repetirla: sin transiciones un instante */
.reinicia,.reinicia *,.reinicia *::before,.reinicia *::after{transition:none!important;animation:none!important}
