/* HTML: <div class="breadcrumb"></div> */
.breadcrumb {
  --s: 20px; /* control the shape */
  
  line-height: 1.8; /* control the height */
  padding-inline: calc(var(--s) + .3em);
  clip-path: polygon(0 0,calc(100% - var(--s)) 0,100% 50%,calc(100% - var(--s)) 100%,0 100%,var(--s) 50%);
  background: #EAEAEA;
  width: fit-content;
}

/* Al exportar/imprimir, solo se muestra #panel-output (y no sus propios
   controles, marcados con .no-print), ocultando el resto de la página. */
@media print {
  body * {
    visibility: hidden;
  }

  #panel-output,
  #panel-output * {
    visibility: visible;
  }

  #panel-output .no-print {
    display: none;
  }

  #panel-output {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    border: none;
  }
}