/* ════════════════════════════════════════════════════════════════════════
   MeTeach — ME-IA 2.0 · Sala holográfica de conversação
   css/meia-rt.css — TUDO aqui fica dentro de #meia-rt (não afeta o site).
   Interface enxuta: sala 3D + transcrição com legenda + microfone + timer.
   Identidade MeTeach: azul elétrico, ciano, laranja/amarelo, toques de roxo.
   ════════════════════════════════════════════════════════════════════════ */
body.meia-rt-open{overflow:hidden}

#meia-rt{
  --mrt-panel:rgba(6,16,38,.66); --mrt-line:rgba(86,170,255,.28);
  --mrt-cyan:#29d6ff; --mrt-blue:#2f8cff; --mrt-orange:#ff9f1c; --mrt-yellow:#ffc933;
  --mrt-violet:#a78bfa; --mrt-green:#2df5b4; --mrt-text:#eef5ff; --mrt-muted:#8ea3c4;
  --mrt-trw:0px; /* espaço da transcrição à direita (desktop) */
  position:fixed; inset:0; z-index:2147483000; isolation:isolate; overflow:hidden;
  background:#02060f; color:var(--mrt-text);
  font-family:Nunito,system-ui,-apple-system,"Segoe UI",sans-serif; -webkit-font-smoothing:antialiased;
}
#meia-rt[hidden]{display:none}
#meia-rt *{box-sizing:border-box}
#meia-rt button{font-family:inherit}
#meia-rt :focus-visible{outline:2px solid var(--mrt-yellow); outline-offset:3px}
.mrt-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ── Sala (3D em tela cheia; 2D como reserva) ─────────────────────── */
.mrt-room{position:absolute; inset:0; z-index:0; overflow:hidden}
.mrt-room-canvas{position:absolute; inset:0; width:100%!important; height:100%!important; display:block}
.mrt-bg{position:absolute; inset:0; overflow:hidden}
.mrt-bg-photo{position:absolute; inset:-4%;
  background:url('/images/brand/meia-fundo.webp') center center / cover no-repeat;
  animation:none; will-change:auto}
.mrt-bg-glow{position:absolute; inset:-20%;
  background:radial-gradient(40% 32% at 50% 44%, rgba(30,120,255,.30), transparent 70%),
    radial-gradient(28% 26% at 80% 16%, rgba(255,150,40,.16), transparent 70%),
    radial-gradient(30% 30% at 14% 80%, rgba(255,140,40,.12), transparent 70%),
    radial-gradient(26% 24% at 22% 18%, rgba(167,139,250,.12), transparent 70%);
  animation:mrt-bg-glow-move 30s ease-in-out infinite alternate; will-change:transform}
@keyframes mrt-bg-drift{
  0%{transform:scale(1.04) translate(0,0)}
  50%{transform:scale(1.09) translate(-1.2%,-1%)}
  100%{transform:scale(1.04) translate(0,0)}
}
@keyframes mrt-bg-glow-move{
  0%{transform:translate(0,0) scale(1)}
  50%{transform:translate(1.5%,-1%) scale(1.04)}
  100%{transform:translate(0,0) scale(1)}
}
@media (prefers-reduced-motion: reduce){
  .mrt-bg-photo, .mrt-bg-glow{animation:none}
}
.mrt-bg-floor{position:absolute; left:-30%; right:-30%; bottom:-8%; height:52%;
  background:repeating-linear-gradient(90deg, rgba(60,160,255,.12) 0 1px, transparent 1px 72px),
    repeating-linear-gradient(0deg, rgba(60,160,255,.10) 0 1px, transparent 1px 72px);
  transform:perspective(520px) rotateX(64deg); transform-origin:50% 100%;
  -webkit-mask-image:linear-gradient(to top, rgba(0,0,0,.9), transparent 85%); mask-image:linear-gradient(to top, rgba(0,0,0,.9), transparent 85%)}
#meia-rt.mrt-3d .mrt-bg-floor{display:none}
#mrtCore{position:absolute; top:0; left:0; width:calc(100% - var(--mrt-trw)); height:100%;
  -webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 46%, #000 62%, transparent 100%); mask-image:radial-gradient(ellipse 50% 50% at 50% 46%, #000 62%, transparent 100%)}
.mrt-room-vignette{position:absolute; inset:0; pointer-events:none; background:radial-gradient(120% 95% at 42% 45%, transparent 58%, rgba(0,0,0,.28))}

/* ── Topo ─────────────────────────────────────────────────────────── */
.mrt-top{position:absolute; z-index:3; top:0; left:0; right:0; display:flex; align-items:center; justify-content:space-between; padding:20px 32px}
.mrt-brand{display:flex; align-items:center; gap:14px}
.mrt-brand img{height:48px; width:auto; filter:drop-shadow(0 0 14px rgba(47,140,255,.4))}
.mrt-brand-tag{font:800 11px/1 Nunito,sans-serif; letter-spacing:.22em; text-transform:uppercase; color:#b9c8e4; border-left:1px solid var(--mrt-line); padding-left:14px}
.mrt-top-right{display:flex; align-items:center; gap:14px}
.mrt-chip{display:flex; align-items:center; gap:12px; padding:10px 20px 10px 12px; border-radius:16px; background:var(--mrt-panel); border:1px solid rgba(255,170,60,.32); backdrop-filter:blur(14px); box-shadow:0 0 28px rgba(255,150,40,.12)}
.mrt-chip b{display:block; font:800 15px/1.2 Nunito,sans-serif}
.mrt-chip small{display:block; font:600 12px/1.3 Nunito,sans-serif; color:var(--mrt-muted); max-width:260px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.mrt-chip-mark{width:34px; height:34px; flex:0 0 34px; border-radius:10px; background:linear-gradient(135deg, rgba(255,159,28,.3), rgba(255,201,51,.08)); border:1px solid rgba(255,170,50,.5); position:relative}
.mrt-chip-mark::before,.mrt-chip-mark::after{content:""; position:absolute; top:9px; bottom:9px; width:7px; border:2px solid var(--mrt-yellow)}
.mrt-chip-mark::before{left:7px; border-radius:2px 0 0 2px} .mrt-chip-mark::after{right:7px; border-radius:0 2px 2px 0}
.mrt-exit{border:1px solid var(--mrt-line); background:rgba(6,16,38,.55); color:var(--mrt-text); font:800 14px Nunito,sans-serif; padding:12px 22px; border-radius:14px; cursor:pointer; transition:.2s; backdrop-filter:blur(10px)}
.mrt-exit:hover{border-color:rgba(255,120,80,.6); background:rgba(80,20,20,.4)}

/* ── Transcrição (a única área de texto) ──────────────────────────── */
.mrt-transcript{position:absolute; z-index:3; top:96px; right:32px; bottom:28px; width:380px; display:flex; flex-direction:column; border-radius:22px;
  background:linear-gradient(165deg, rgba(8,22,50,.74), rgba(5,12,30,.7)); backdrop-filter:blur(18px); border:1px solid rgba(86,170,255,.38);
  box-shadow:0 0 0 1px rgba(255,255,255,.03) inset, 0 0 40px rgba(47,160,255,.16), 0 24px 70px rgba(0,0,0,.45)}
.mrt-transcript::before{content:""; position:absolute; left:22px; right:22px; top:-1px; height:2px; border-radius:2px; background:linear-gradient(90deg, transparent, var(--mrt-cyan), var(--mrt-violet), var(--mrt-orange), transparent)}
.mrt-tr-head{display:flex; align-items:center; justify-content:space-between; padding:16px 20px; border-bottom:1px solid rgba(86,170,255,.16)}
.mrt-tr-head>span{font:900 13px Nunito,sans-serif; letter-spacing:.16em; color:var(--mrt-cyan)}
.mrt-tr-head em{font:900 10.5px Nunito,sans-serif; font-style:normal; letter-spacing:.14em; color:var(--mrt-green); display:flex; align-items:center; gap:6px}
.mrt-tr-head em i{width:7px; height:7px; border-radius:50%; background:var(--mrt-green); box-shadow:0 0 10px var(--mrt-green); animation:mrtBlink 1.6s infinite}
@keyframes mrtBlink{50%{opacity:.3}}
.mrt-tr-toggle{display:none}
.mrt-tr-list{flex:1; overflow-y:auto; padding:14px 14px 18px; scrollbar-width:thin; scrollbar-color:rgba(86,170,255,.3) transparent}
.mrt-tr-list:empty::after{content:"A conversa aparece aqui, em inglês, com a legenda em português."; display:block; padding:20px 10px; text-align:center; font:600 13px/1.5 Nunito,sans-serif; color:#6f86aa}
.mrt-row{position:relative; margin:0 0 10px; padding:11px 14px 11px 16px; border-radius:14px; background:rgba(12,32,68,.58); border:1px solid rgba(86,170,255,.16); animation:mrtIn .35s ease}
.mrt-row::before{content:""; position:absolute; left:0; top:12px; bottom:12px; width:2.5px; border-radius:2px; background:var(--mrt-cyan); box-shadow:0 0 8px var(--mrt-cyan)}
.mrt-you{background:rgba(48,32,10,.5); border-color:rgba(255,170,60,.22)}
.mrt-you::before{background:var(--mrt-orange); box-shadow:0 0 8px var(--mrt-orange)}
@keyframes mrtIn{from{opacity:0; transform:translateY(6px)}to{opacity:1; transform:none}}
.mrt-row-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:4px}
.mrt-row-who{font:900 10.5px Nunito,sans-serif; letter-spacing:.16em; color:var(--mrt-cyan)}
.mrt-you .mrt-row-who{color:var(--mrt-orange)}
.mrt-row-time{font:600 11px Nunito,sans-serif; color:#5f7396; font-variant-numeric:tabular-nums}
.mrt-row-en{font:700 15.5px/1.45 Nunito,sans-serif; color:#f4f8ff; word-wrap:break-word}
.mrt-row-pt{font:500 12.5px/1.4 Nunito,sans-serif; color:#8aa0c2; margin-top:4px; max-height:0; opacity:0; overflow:hidden; transition:opacity .4s, max-height .4s}
.mrt-row-pt.show{opacity:1; max-height:140px}
.mrt-live{border-style:dashed}
.mrt-live .mrt-row-who::after{content:" · ao vivo"; color:var(--mrt-green); letter-spacing:.1em}
.mrt-cut .mrt-row-who::after{content:" · interrompido"; color:var(--mrt-muted); letter-spacing:.1em}
.mrt-row-tip{margin-top:9px; padding:8px 11px; border-radius:10px; background:rgba(70,48,8,.55); border:1px solid rgba(255,190,60,.4); animation:mrtIn .4s ease}
.mrt-tip-k{display:block; font:900 9.5px Nunito,sans-serif; letter-spacing:.2em; color:var(--mrt-yellow); margin-bottom:2px}
.mrt-row-tip b{display:block; font:800 14.5px/1.35 Nunito,sans-serif; color:#fff}
.mrt-row-tip small{display:block; font:600 12px/1.35 Nunito,sans-serif; color:#f3d79a; margin-top:2px}

/* ── Microfone (centro, embaixo do núcleo) ────────────────────────── */
.mrt-dock{position:absolute; z-index:3; bottom:30px; left:calc((100% - var(--mrt-trw)) / 2); transform:translateX(-50%); width:min(560px, calc(100% - var(--mrt-trw) - 40px)); display:flex; flex-direction:column; align-items:center}
.mrt-wave{position:absolute; top:6px; left:50%; transform:translateX(-50%); width:100%; height:92px; pointer-events:none}
.mrt-dock-row{position:relative; display:flex; align-items:center; justify-content:center; gap:22px}
.mrt-speed{font-size:12px; font-weight:800; letter-spacing:.2px; font-family:inherit}
.mrt-mic{position:relative; width:104px; height:104px; border-radius:50%; border:0; cursor:pointer; display:grid; place-items:center; color:#fff;
  background:radial-gradient(circle at 35% 30%, #2d4f8f, #0b1838 62%, #060d22);
  box-shadow:0 0 0 1px rgba(120,190,255,.35) inset, 0 12px 30px rgba(0,0,0,.5), 0 0 40px rgba(47,140,255,.25);
  transition:transform .35s cubic-bezier(.2,1.2,.4,1), box-shadow .35s, filter .35s, opacity .35s}
.mrt-mic svg{width:38px; height:38px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; position:relative; z-index:1}
.mrt-mic-ring{position:absolute; inset:-7px; border-radius:50%; background:conic-gradient(from 200deg, var(--mrt-blue), var(--mrt-violet), var(--mrt-orange), var(--mrt-yellow), var(--mrt-blue)); -webkit-mask:radial-gradient(circle, transparent 56px, #000 57px); mask:radial-gradient(circle, transparent 56px, #000 57px); opacity:.8; transition:opacity .35s}
.mrt-mic:disabled{cursor:default}
#meia-rt[data-state="teacher"] .mrt-mic,#meia-rt[data-state="thinking"] .mrt-mic,#meia-rt[data-state="processing"] .mrt-mic,#meia-rt[data-state="connecting"] .mrt-mic,#meia-rt[data-state="ending"] .mrt-mic,#meia-rt[data-state="ready"] .mrt-mic{transform:scale(.88); filter:saturate(.55) brightness(.85); cursor:default}
#meia-rt[data-state="teacher"] .mrt-mic-ring{animation:mrtSpin 6s linear infinite}
#meia-rt[data-state="thinking"] .mrt-mic-ring,#meia-rt[data-state="processing"] .mrt-mic-ring{animation:mrtSpin 1.8s linear infinite; background:conic-gradient(var(--mrt-violet), transparent 40%, var(--mrt-orange), transparent 80%)}
#meia-rt[data-state="yourturn"] .mrt-mic{transform:scale(1.08); color:#eafffa; background:radial-gradient(circle at 35% 30%, #1fb897, #0a4a52 60%, #052530);
  box-shadow:0 0 0 1px rgba(45,245,180,.6) inset, 0 0 40px rgba(45,245,180,.45), 0 0 90px rgba(34,211,238,.25)}
#meia-rt[data-state="yourturn"] .mrt-mic-ring{background:conic-gradient(var(--mrt-green), var(--mrt-cyan), var(--mrt-green)); opacity:.95; animation:mrtSpin 3.5s linear infinite}
#meia-rt[data-state="yourturn"] .mrt-mic::before{content:""; position:absolute; inset:-14px; border-radius:50%; border:2px solid rgba(45,245,180,.55); animation:mrtPulse 1.8s ease-out infinite}
#meia-rt[data-state="student"] .mrt-mic{transform:scale(1.12); background:radial-gradient(circle at 35% 30%, #34f5a8, #0b6b55 60%, #033328);
  box-shadow:0 0 0 1px rgba(45,245,180,.8) inset, 0 0 55px rgba(45,245,180,.6), 0 0 120px rgba(45,245,180,.25)}
#meia-rt[data-state="student"] .mrt-mic-ring{background:conic-gradient(var(--mrt-green), #fff, var(--mrt-green)); opacity:1; animation:mrtSpin 1.4s linear infinite}
#meia-rt.mrt-muted .mrt-mic{transform:scale(.95); filter:none; background:radial-gradient(circle at 35% 30%, #5a2b3a, #2a0f19 62%); box-shadow:0 0 0 1px rgba(255,110,110,.5) inset}
#meia-rt.mrt-muted .mrt-mic::after{content:""; position:absolute; width:46px; height:2.5px; background:#ff8080; border-radius:2px; transform:rotate(-45deg); z-index:2}
@keyframes mrtSpin{to{transform:rotate(360deg)}}
@keyframes mrtPulse{from{transform:scale(.92); opacity:.9}to{transform:scale(1.35); opacity:0}}
.mrt-kb{width:44px; height:44px; border-radius:14px; border:1px solid var(--mrt-line); background:rgba(6,16,38,.6); color:#9fc4ff; cursor:pointer; display:grid; place-items:center; backdrop-filter:blur(10px); transition:.2s}
.mrt-kb svg{width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round}
.mrt-kb:hover:not(:disabled),.mrt-kb[aria-expanded="true"]{color:#fff; border-color:rgba(86,170,255,.6)}
.mrt-kb:disabled{opacity:.35; cursor:default}
.mrt-hint{margin-top:14px; font:900 clamp(17px,1.35vw,20px) Nunito,sans-serif; color:#fff; text-align:center; text-shadow:0 2px 18px rgba(0,0,0,.6); min-height:26px}
#meia-rt[data-state="yourturn"] .mrt-hint,#meia-rt[data-state="student"] .mrt-hint{color:#8ffbe0}
#meia-rt[data-state="ending"] .mrt-hint{color:var(--mrt-yellow)}
.mrt-input{display:flex; align-items:center; gap:8px; width:100%; margin-top:12px; padding:6px 6px 6px 18px; border-radius:16px; background:rgba(6,16,38,.75); border:1px solid rgba(86,170,255,.3); backdrop-filter:blur(12px)}
.mrt-input[hidden]{display:none}
.mrt-input input{flex:1; min-width:0; background:transparent; border:0; outline:0; color:#fff; font:600 16px Nunito,sans-serif; padding:11px 0}
.mrt-input input::placeholder{color:#7489ab}
.mrt-input button{width:42px; height:42px; flex:0 0 42px; border:0; border-radius:12px; cursor:pointer; display:grid; place-items:center; color:#fff; background:linear-gradient(135deg, #2f8cff, #1d5fd8)}
.mrt-input button:disabled{opacity:.4; cursor:default}
.mrt-input svg{width:19px; height:19px; fill:currentColor}

/* ── Timer ────────────────────────────────────────────────────────── */
.mrt-timer{position:absolute; z-index:3; left:36px; bottom:32px; width:128px; height:128px}
.mrt-timer svg{position:absolute; inset:0; transform:rotate(-90deg)}
.mrt-timer circle{fill:none; stroke-width:7}
.mrt-timer-track{stroke:rgba(86,170,255,.16)}
.mrt-timer-arc{stroke:var(--mrt-orange); stroke-linecap:round; transition:stroke-dashoffset .25s linear, stroke .5s; filter:drop-shadow(0 0 7px rgba(255,159,28,.75))}
.mrt-timer>div{position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; border-radius:50%; margin:14px; background:rgba(4,12,30,.8); backdrop-filter:blur(8px)}
.mrt-timer b{font:900 26px/1 Nunito,sans-serif; font-variant-numeric:tabular-nums}
.mrt-timer small{font:600 12px Nunito,sans-serif; color:var(--mrt-muted); margin-top:4px}
#meia-rt.mrt-late .mrt-timer-arc{stroke:#ff6b4a; animation:mrtBlink 1.2s infinite}

/* ── Telas (escolher lição, microfone, erro, resumo, histórico) ───── */
.mrt-overlay{position:absolute; inset:0; z-index:20; display:grid; place-items:center; padding:20px; background:radial-gradient(60% 60% at 50% 45%, rgba(10,30,70,.35), rgba(2,6,16,.82)); backdrop-filter:blur(3px)}
.mrt-overlay[hidden]{display:none}
.mrt-card{width:min(460px,100%); padding:32px 30px 26px; text-align:center; border-radius:26px; position:relative;
  background:linear-gradient(165deg, rgba(12,30,64,.9), rgba(6,14,32,.92)); border:1px solid rgba(86,170,255,.36); backdrop-filter:blur(16px);
  box-shadow:0 0 60px rgba(47,140,255,.22), 0 30px 80px rgba(0,0,0,.55)}
.mrt-card::before{content:""; position:absolute; left:30px; right:30px; top:-1px; height:2px; border-radius:2px; background:linear-gradient(90deg, transparent, var(--mrt-cyan), var(--mrt-violet), var(--mrt-orange), transparent)}
.mrt-card-wide{width:min(600px,100%); text-align:left; max-height:calc(100vh - 40px); overflow:auto; scrollbar-width:thin}
.mrt-card-start{width:min(560px,100%)}
.mrt-kicker{font:900 11.5px Nunito,sans-serif; letter-spacing:.24em; color:var(--mrt-cyan)}
.mrt-card h2{margin:10px 0 8px; font:900 28px/1.15 Nunito,sans-serif; color:#fff}
.mrt-card p{margin:0 0 16px; font:600 15px/1.55 Nunito,sans-serif; color:#c3d2ea}
.mrt-cta{display:inline-block; border:0; cursor:pointer; padding:17px 34px; border-radius:16px; font:900 15px Nunito,sans-serif; letter-spacing:.08em; color:#1b1200;
  background:linear-gradient(135deg, var(--mrt-yellow), var(--mrt-orange)); box-shadow:0 10px 30px rgba(255,159,28,.38), 0 0 0 1px rgba(255,255,255,.25) inset; transition:transform .2s, box-shadow .2s}
.mrt-cta:hover{transform:translateY(-2px); box-shadow:0 16px 40px rgba(255,159,28,.5)}
.mrt-cta[hidden]{display:none}
.mrt-link{display:block; margin:12px auto 0; border:0; background:none; color:#9fc4ff; font:700 14px Nunito,sans-serif; cursor:pointer; text-decoration:underline; text-underline-offset:3px}
.mrt-link[hidden]{display:none}
.mrt-start-sub{font-size:14.5px!important}
.mrt-lessons{max-height:min(42vh,380px); overflow-y:auto; margin:4px 0 20px; padding:4px; text-align:left; border-radius:16px; background:rgba(3,10,26,.55); border:1px solid rgba(86,170,255,.18); scrollbar-width:thin; scrollbar-color:rgba(86,170,255,.35) transparent}
.mrt-lesson-opt,.mrt-hist-item{display:flex; align-items:center; gap:12px; width:100%; padding:10px 12px; margin:0 0 4px; border-radius:12px; border:1px solid transparent; background:transparent; color:#e6eefc; cursor:pointer; text-align:left; transition:background .15s, border-color .15s}
.mrt-lesson-opt:hover,.mrt-hist-item:hover{background:rgba(47,140,255,.12)}
.mrt-lesson-opt.on{background:linear-gradient(90deg, rgba(255,159,28,.2), rgba(167,139,250,.1)); border-color:rgba(255,170,60,.55); box-shadow:0 0 22px rgba(255,150,40,.15)}
.mrt-lesson-n{flex:0 0 38px; height:38px; border-radius:11px; display:grid; place-items:center; font:900 14px Nunito,sans-serif; color:var(--mrt-cyan); background:rgba(41,214,255,.1); border:1px solid rgba(41,214,255,.3)}
.mrt-lesson-opt.on .mrt-lesson-n{color:#1b1200; background:linear-gradient(135deg, var(--mrt-yellow), var(--mrt-orange)); border-color:transparent}
.mrt-lesson-t{display:flex; flex-direction:column; min-width:0}
.mrt-lesson-t b{font:800 15px/1.25 Nunito,sans-serif; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.mrt-lesson-t small{font:600 12px Nunito,sans-serif; color:var(--mrt-muted); margin-top:2px}
.mrt-start-foot{display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:16px; font:600 12.5px Nunito,sans-serif; color:var(--mrt-muted)}
.mrt-start-foot .mrt-link{margin:0}

.mrt-sum-meta{color:var(--mrt-muted)!important; font-size:13.5px!important}
.mrt-sum-k{font:900 11px Nunito,sans-serif; letter-spacing:.2em; text-transform:uppercase; color:var(--mrt-cyan); margin:20px 0 8px}
.mrt-sum-list{margin:0; padding:0; list-style:none}
.mrt-sum-list li{position:relative; padding:5px 0 5px 20px; font:700 15px Nunito,sans-serif; color:#eef5ff}
.mrt-sum-list li::before{content:""; position:absolute; left:2px; top:13px; width:8px; height:8px; border-radius:50%; background:var(--mrt-green); box-shadow:0 0 8px var(--mrt-green)}
.mrt-sum-gram{padding:12px 14px; margin-bottom:8px; border-radius:14px; background:rgba(60,40,120,.28); border:1px solid rgba(167,139,250,.35)}
.mrt-sum-gram b{display:block; font:800 15px Nunito,sans-serif; color:#fff}
.mrt-sum-gram p{margin:4px 0 0!important; font:600 13.5px/1.5 Nunito,sans-serif!important; color:#d4dcf2!important}
.mrt-sum-gram em{display:block; margin-top:6px; font:700 14px Nunito,sans-serif; font-style:normal; color:var(--mrt-yellow)}
.mrt-sum-chips{display:flex; flex-wrap:wrap; gap:8px}
.mrt-sum-chip{padding:8px 12px; border-radius:12px; background:rgba(47,140,255,.14); border:1px solid rgba(86,170,255,.3)}
.mrt-sum-chip b{display:block; font:800 14px Nunito,sans-serif; color:#fff}
.mrt-sum-chip small{display:block; margin-top:2px; font:600 12px Nunito,sans-serif; color:var(--mrt-muted)}
.mrt-sum-fix{padding:9px 12px; margin-bottom:8px; border-radius:12px; background:rgba(60,40,8,.45); border:1px solid rgba(255,190,60,.28)}
.mrt-sum-fix s{display:block; font:600 13px Nunito,sans-serif; color:#d8c39a; text-decoration-color:rgba(255,120,80,.7)}
.mrt-sum-fix b{display:block; font:800 15px Nunito,sans-serif; color:#fff; margin-top:2px}
.mrt-sum-cheer{margin-top:18px!important; font:800 16px/1.5 Nunito,sans-serif!important; color:#ffe2a0!important}
.mrt-sum-saved{font-size:13px!important; color:#8ffbe0!important}
.mrt-sum-loading{color:var(--mrt-muted)!important; animation:mrtBlink 1.4s infinite}
.mrt-sum-actions{display:flex; flex-direction:column; align-items:center; margin-top:22px}
.mrt-sum-links{display:flex; gap:22px; justify-content:center}
.mrt-hist-head{display:flex; justify-content:flex-end; margin:-8px -6px 4px}
.mrt-hist-back{border:1px solid var(--mrt-line); background:transparent; color:#cfe0ff; font:800 13px Nunito,sans-serif; padding:8px 14px; border-radius:11px; cursor:pointer}
.mrt-hist-list{margin-top:12px}
.mrt-hist-tr{margin-top:6px}
.mrt-hist-tr .mrt-row,.mrt-hist-list .mrt-hist-item{animation:none}
.mrt-del{color:#ff9f9f!important; margin-top:18px!important}

/* ── Notebook / tablet ────────────────────────────────────────────── */
@media (min-width:1021px){ #meia-rt{--mrt-trw:444px} }
@media (max-width:1280px) and (min-width:1021px){ #meia-rt{--mrt-trw:400px} .mrt-transcript{width:340px; right:24px} .mrt-timer{left:24px} }
@media (max-width:1020px) and (min-width:721px){
  .mrt-transcript{top:auto; left:24px; right:24px; bottom:24px; width:auto; height:30vh}
  .mrt-dock{bottom:calc(30vh + 40px)}
  .mrt-timer{left:24px; top:96px; bottom:auto; width:96px; height:96px}
  .mrt-timer>div{margin:11px} .mrt-timer b{font-size:19px} .mrt-timer small{font-size:10.5px}
}

/* ── Celular: núcleo em cima, microfone, transcrição embaixo ──────── */
@media (max-width:720px){
  .mrt-top{padding:12px 14px}
  .mrt-brand img{height:32px} .mrt-brand-tag{display:none}
  .mrt-chip{padding:7px 12px 7px 8px; gap:8px; border-radius:12px} .mrt-chip-mark{display:none}
  .mrt-chip b{font-size:13px} .mrt-chip small{font-size:11px; max-width:140px}
  .mrt-exit{padding:9px 13px; font-size:13px; border-radius:12px}
  .mrt-transcript{top:auto; left:12px; right:12px; bottom:calc(10px + env(safe-area-inset-bottom)); width:auto; height:32vh; border-radius:18px; transition:height .35s ease}
  #meia-rt.mrt-tr-open .mrt-transcript{height:68vh}
  .mrt-tr-head{padding:10px 14px} .mrt-tr-head>span{font-size:11px} .mrt-tr-head em{display:none}
  .mrt-tr-toggle{display:block; border:1px solid var(--mrt-line); background:transparent; color:#9fc4ff; font:800 11.5px Nunito,sans-serif; padding:6px 10px; border-radius:10px; cursor:pointer}
  .mrt-tr-list{padding:10px 10px 12px}
  .mrt-row{padding:9px 12px 9px 14px; margin-bottom:8px} .mrt-row-en{font-size:14.5px}
  .mrt-dock{bottom:calc(32vh + 22px + env(safe-area-inset-bottom)); width:calc(100% - 28px)}
  #meia-rt.mrt-tr-open .mrt-dock{opacity:0; pointer-events:none}
  .mrt-mic{width:84px; height:84px} .mrt-mic svg{width:32px; height:32px}
  .mrt-mic-ring{-webkit-mask:radial-gradient(circle, transparent 46px, #000 47px); mask:radial-gradient(circle, transparent 46px, #000 47px)}
  .mrt-wave{height:70px}
  .mrt-hint{font-size:15.5px; margin-top:10px}
  .mrt-kb{width:40px; height:40px}
  .mrt-timer{left:14px; top:62px; bottom:auto; width:auto; height:34px; padding:0 14px; border-radius:12px; overflow:hidden; background:rgba(6,16,38,.75); border:1px solid var(--mrt-line)}
  .mrt-timer::after{content:""; position:absolute; left:0; bottom:0; height:2px; width:calc(var(--mrt-p,0) * 100%); background:linear-gradient(90deg,var(--mrt-orange),var(--mrt-yellow))}
  .mrt-timer svg{display:none}
  .mrt-timer>div{position:static; margin:0; height:100%; flex-direction:row; gap:6px; background:none; border-radius:0; backdrop-filter:none}
  .mrt-timer b{font-size:15px} .mrt-timer small{font-size:11.5px; margin:0}
  .mrt-card{padding:26px 18px 20px} .mrt-card h2{font-size:23px}
  .mrt-lessons{max-height:44vh}
  .mrt-start-foot{flex-direction:column; gap:8px}
}
@media (max-width:720px) and (max-height:680px){ .mrt-transcript{height:27vh} .mrt-dock{bottom:calc(27vh + 18px)} }

@media (prefers-reduced-motion:reduce){
  #meia-rt *, #meia-rt *::before, #meia-rt *::after{animation-duration:.001ms!important; animation-iteration-count:1!important; transition-duration:.001ms!important}
}

/* ════════════════════════════════════════════════════════════════════════
   ME-IA 3 — a conversa no centro da tela (painel grande), com o inglês e o
   português linha a linha. A sala 3D continua viva ao fundo.
   ════════════════════════════════════════════════════════════════════════ */
#meia-rt{--mrt-trw:0px!important}
.mrt-transcript{top:92px; bottom:214px; left:50%; right:auto; width:min(900px, calc(100% - 360px)); transform:translateX(-50%);
  background:linear-gradient(165deg, rgba(8,22,50,.80), rgba(5,12,30,.78))}
.mrt-tr-head{padding:12px 20px}
.mrt-tr-toggle{display:none!important}
.mrt-tr-list{display:flex; flex-direction:column; gap:10px; padding:18px 20px 22px}
.mrt-tr-list:empty::after{content:"A conversa aparece aqui: o inglês em destaque e o português logo embaixo de cada parte."; font-size:14px}
.mrt-row{margin:0; max-width:86%; align-self:flex-start; padding:12px 16px 12px 18px}
.mrt-you{align-self:flex-end}
.mrt-row-en{font-size:18px; line-height:1.45}
.mrt-has-il .mrt-row-en{display:none}
.mrt-has-il .mrt-row-pt{display:none}
.mrt-row-il{display:flex; flex-direction:column; gap:7px}
.mrt-il{display:flex; flex-direction:column}
.mrt-il-en{font:800 18px/1.35 Nunito,sans-serif; color:#f4f8ff}
.mrt-il-pt{font:500 14px/1.35 Nunito,sans-serif; font-style:italic; color:#9fb6d8; margin-top:1px}
.mrt-you .mrt-il-pt{color:#d9bf94}
.mrt-hist-tr{display:flex; flex-direction:column; gap:10px}
.mrt-hist-tr .mrt-row{max-width:92%}
/* início dentro da lição: só a lição atual */
.mrt-start-lesson{display:flex; align-items:center; gap:12px; margin:4px 0 20px; padding:12px 14px; border-radius:14px; text-align:left;
  background:linear-gradient(90deg, rgba(255,159,28,.18), rgba(167,139,250,.08)); border:1px solid rgba(255,170,60,.45)}
.mrt-start-lesson[hidden],.mrt-lessons[hidden]{display:none}
.mrt-start-lesson .mrt-lesson-n{color:#1b1200; background:linear-gradient(135deg, var(--mrt-yellow), var(--mrt-orange)); border-color:transparent}
.mrt-lesson-opt.mrt-locked{opacity:.55}
.mrt-lesson-opt.mrt-locked small{color:var(--mrt-yellow)}
/* resumo: Conversation complete */
.mrt-sum-oks{display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:8px}
.mrt-sum-ok{display:flex; flex-direction:column; align-items:center; padding:10px 6px; border-radius:12px; background:rgba(45,245,180,.08); border:1px solid rgba(45,245,180,.3); text-align:center}
.mrt-sum-ok b{font:800 13.5px Nunito,sans-serif; color:#8ffbe0}
.mrt-sum-ok small{font:600 11.5px Nunito,sans-serif; color:var(--mrt-muted); margin-top:2px}
.mrt-sum-exprs{display:flex; flex-direction:column; gap:8px}
.mrt-sum-expr{padding:10px 14px; border-radius:12px; background:rgba(12,32,68,.6); border:1px solid rgba(86,170,255,.2)}
.mrt-sum-expr b{display:block; font:800 15.5px/1.35 Nunito,sans-serif; color:#fff}
.mrt-sum-expr small{display:block; font:500 13px/1.35 Nunito,sans-serif; font-style:italic; color:#9fb6d8; margin-top:2px}
.mrt-sum-fix small{display:block; font:600 12.5px/1.4 Nunito,sans-serif; color:#f3d79a; margin-top:4px}

@media (max-width:1280px) and (min-width:1021px){ .mrt-transcript{right:auto; width:min(860px, calc(100% - 330px))} }
@media (max-width:1020px) and (min-width:721px){
  .mrt-transcript{top:92px; bottom:214px; left:24px; right:24px; width:auto; height:auto; transform:none}
  .mrt-dock{bottom:24px}
  .mrt-timer{left:auto; right:24px; top:auto; bottom:40px}
}
@media (max-width:720px){
  .mrt-transcript{top:104px; bottom:calc(150px + env(safe-area-inset-bottom)); left:10px; right:10px; width:auto; height:auto; transform:none}
  #meia-rt.mrt-tr-open .mrt-transcript{height:auto}
  .mrt-dock{bottom:calc(8px + env(safe-area-inset-bottom))}
  #meia-rt.mrt-tr-open .mrt-dock{opacity:1; pointer-events:auto}
  #meia-rt.mrt-typing .mrt-transcript{bottom:calc(214px + env(safe-area-inset-bottom))}
  .mrt-tr-list{padding:12px 10px 14px; gap:8px}
  .mrt-row{max-width:92%; padding:10px 12px 10px 14px}
  .mrt-row-en,.mrt-il-en{font-size:16px}
  .mrt-il-pt{font-size:13px}
  .mrt-wave{height:56px}
  .mrt-sum-oks{grid-template-columns:repeat(2, minmax(0,1fr))}
}
@media (max-width:720px) and (max-height:680px){ .mrt-transcript{height:auto; bottom:calc(140px + env(safe-area-inset-bottom))} .mrt-dock{bottom:6px} }

/* Foto de perfil da ME-IA (cabeça do dino MeTeach) */
.mrt-av{display:block; width:26px; height:26px; border-radius:50%; object-fit:cover; flex:0 0 auto;
  background:radial-gradient(circle at 50% 40%, #1d4f9a, #0a1d42); border:1.5px solid rgba(41,214,255,.7); box-shadow:0 0 10px rgba(41,214,255,.35)}
.mrt-row-whobox{display:inline-flex; align-items:center; gap:8px}
.mrt-tr-who{display:flex; align-items:center; gap:10px}
.mrt-tr-who b{display:block; font:900 14px Nunito,sans-serif; letter-spacing:.08em; color:var(--mrt-cyan)}
.mrt-tr-who small{display:flex; align-items:center; gap:4px; font:700 11.5px Nunito,sans-serif; color:var(--mrt-muted)}
.mrt-dino-mini{display:inline-block; width:14px; height:14px; object-fit:contain; border-radius:50%; flex:0 0 auto}
.mrt-av-head{width:38px; height:38px; border-width:2px}
.mrt-av-big{width:84px; height:84px; margin:0 auto 12px; border-width:2.5px; box-shadow:0 0 0 5px rgba(41,214,255,.12), 0 0 30px rgba(41,214,255,.45)}
#meia-rt[data-state="teacher"] .mrt-av-head{animation:mrtAvTalk 1.4s ease-in-out infinite}
@keyframes mrtAvTalk{50%{box-shadow:0 0 0 4px rgba(41,214,255,.3), 0 0 22px rgba(41,214,255,.85)}}
@media (max-width:720px){ .mrt-av-big{width:68px; height:68px} .mrt-av-head{width:32px; height:32px} .mrt-tr-who small{display:none} }

/* Botão para sair da tela inicial da ME-IA e voltar para o site */
.mrt-card-start{position:relative}
.mrt-voltar{position:absolute; top:14px; left:14px; display:inline-flex; align-items:center; gap:6px; border:1px solid var(--mrt-line); background:rgba(6,16,38,.55); color:var(--mrt-text); font:800 13px Nunito,sans-serif; padding:9px 14px; border-radius:12px; cursor:pointer; transition:.2s; z-index:2}
.mrt-voltar:hover{border-color:rgba(255,160,60,.7); background:rgba(40,30,10,.5)}
.mrt-card-start .mrt-av-big{margin-top:28px}
@media (max-width:560px){ .mrt-voltar{top:10px; left:10px; padding:8px 11px; font-size:12.5px} }