body{margin:0;font-family:system-ui,Segoe UI,Arial;background:#0b0f1a;color:#fff}
.wrap{padding:14px;max-width:900px;margin:0 auto}

/* Header */

.header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:10px;
}

.headerRight{
  display:flex;
  align-items:center;
  gap:12px;
}

.title{font-size:22px;font-weight:900;margin:0}
.logo img{max-width:180px;height:auto}

/* switch lingua come index */
.lang{
  display:flex;
  align-items:center;
  gap:8px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.18);
  border-radius:999px;
  padding:6px;
}

.langBtn{
  display:flex;
  align-items:center;
  justify-content:center;
  width:48px;
  height:40px;
  border-radius:999px;
  border:1px solid transparent;
  text-decoration:none;
  user-select:none;
  -webkit-tap-highlight-color: transparent;
}

.langBtn.active{
  background:rgba(255,255,255,.18);
  border-color:rgba(255,255,255,.25);
}

.langBtn:focus{
  outline:4px solid #ffe066;
  outline-offset:2px;
}

.flagImg{
  width:28px;
  height:auto;
  display:block;
}
/* Buttons */
.btns{display:grid;grid-template-columns:1fr 1fr;gap:10px}
button{border:0;border-radius:14px;padding:18px 14px;font-size:20px;font-weight:900}
.ok{background:#2ee59d;color:#000}
.stop{background:#ff5c7a;color:#000}
.sec{background:#1b243b;color:#fff;border:1px solid rgba(255,255,255,.15)}

.out{
  margin-top:14px;background:#111a2b;border:1px solid rgba(255,255,255,.15);
  border-radius:14px;padding:14px;min-height:240px;max-height:45vh;
  overflow:auto;
  white-space:pre-wrap;word-break:break-word;
  font-size:20px;line-height:1.35
}

.status{margin:8px 0;color:rgba(255,255,255,.75);font-weight:800}

/* Fullscreen teleprompter */
.fs{position:fixed;inset:0;background:#000;display:none;flex-direction:column}
.fsTop{padding:10px;border-bottom:1px solid #222;display:flex;justify-content:space-between;align-items:center}
.fsTextWrap{flex:1;overflow:auto;}
.fsText{
  padding:18px;font-size:clamp(26px,4vw,54px);
  line-height:1.35;white-space:pre-wrap;word-break:break-word
}

/* Footer */
.footer{margin-top:16px;text-align:center;font-size:13px;color:rgba(255,255,255,.6)}

/* Mobile */
@media(max-width:640px){
  .header{flex-direction:row}
  .logo img{max-width:150px}
}
