/* Ver como o aluno: faixa laranja fixa no topo enquanto o mentor olha o
   painel de um aluno. Laranja porque não existe em nenhuma outra tela:
   não dá para confundir com o painel do mentor nem com o do próprio aluno. */
:root{ --vc-faixa:#C2410C; --vc-alt:0px }
:root[data-tema="escuro"]{ --vc-faixa:#EA580C }
.vc-faixa{position:fixed;top:0;left:0;right:0;z-index:60;height:var(--vc-alt);
  background:var(--vc-faixa);color:#fff;display:flex;align-items:center;gap:10px;
  padding:0 16px;box-shadow:0 2px 10px rgba(0,0,0,.18)}
.vc-faixa p{margin:0;flex:1;min-width:0;line-height:1.3}
.vc-faixa b{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vc-faixa span{display:block;font-size:12.5px;opacity:.95;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vc-faixa button{flex:none;background:#fff;color:#9A3412;border:0;border-radius:9px;
  padding:9px 16px;font:inherit;font-weight:700;cursor:pointer;min-height:40px}
.vc-faixa button:focus-visible{outline:2px solid #fff;outline-offset:2px}
html.vendo-como body{padding-top:var(--vc-alt)}
html.vendo-como .topo{top:var(--vc-alt)}
html.vendo-como .menu{top:var(--vc-alt);height:calc(100dvh - var(--vc-alt))}
html.vendo-como body::before{display:none}

.vc-aviso{position:fixed;left:50%;transform:translateX(-50%) translateY(14px);
  bottom:calc(92px + env(safe-area-inset-bottom,0px));z-index:61;width:calc(100% - 32px);max-width:460px;
  background:var(--texto);color:var(--bg);border-radius:14px;padding:13px 15px;font-size:14px;
  box-shadow:var(--sombra);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s}
.vc-aviso.visivel{opacity:1;pointer-events:auto;transform:translateX(-50%) translateY(0)}
.vc-aviso p{margin:0 0 9px}
.vc-aviso .btn{width:100%;background:var(--bg);color:var(--texto);border:0;font-weight:700}
@media (min-width:900px){ .vc-aviso{bottom:28px} }

.vc-ficha{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin-top:14px;
  padding:13px 15px;border:1px solid var(--linha);border-radius:12px;background:var(--superficie)}
.vc-ficha div{flex:1 1 220px}
.vc-ficha b{display:block;font-size:14.5px}
.vc-ficha span{display:block;font-size:13px;color:var(--suave)}
.vc-ficha .btn{flex:1 1 180px}
.vc-dlg ul{margin:12px 0 0;padding-left:20px;font-size:14px}
.vc-dlg li{margin:6px 0}
