/* ═══════════════════════════════════════════════════════════════
   MTL Reader Mode Bar — thin top bar for Math Translation Layer
   Easy / Standard / Academic / Proof reading levels
   ═══════════════════════════════════════════════════════════════ */

.mtl-reader-bar{
  width:100%;
  background:#0a0a0a;
  border-bottom:1px solid #222;
  padding:.45rem 1rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.75rem;
  flex-wrap:wrap;
}
.mtl-reader-label{
  font-family:'JetBrains Mono',ui-monospace,monospace;
  font-size:.55rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#5a5a5a;
  white-space:nowrap;
  text-decoration:none;
  transition:color .15s ease;
}
.mtl-reader-label:hover{
  color:#f59e0b;
}
.mtl-reader-tabs{
  display:flex;
  gap:.35rem;
  flex-wrap:wrap;
  flex:1;
  min-width:0;
}
.mtl-reader-tab{
  appearance:none;
  border:1px solid #333;
  background:#111;
  color:#9a9a9a;
  font-family:'JetBrains Mono',ui-monospace,monospace;
  font-size:.55rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  padding:.28rem .7rem;
  border-radius:999px;
  cursor:pointer;
  transition:all .15s ease;
  white-space:nowrap;
}
.mtl-reader-tab:hover:not(.active){
  border-color:#444;
  color:#e5e3df;
  background:#181818;
}
.mtl-reader-tab.active{
  color:#f59e0b;
  border-color:#f59e0b;
  background:rgba(245,158,11,.1);
}
.mtl-reader-tab.locked{
  opacity:.55;
  cursor:not-allowed;
}

@media(max-width:560px){
  .mtl-reader-bar{flex-direction:column;align-items:stretch;gap:.4rem;padding:.4rem .75rem}
  .mtl-reader-tabs{justify-content:flex-start}
}