/* ==========================================================
   SEMANA — o aluno veio ver a semana, então a semana começa
   perto do topo. Números viram fichas, navegação vira cabeçalho,
   legenda vira consulta.
   ========================================================== */

.sm-acoes{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.sm-nav{display:inline-flex;border:1px solid var(--linha);border-radius:999px;overflow:hidden;
  background:var(--superficie)}
.sm-nav .btn-nav{border:0;border-right:1px solid var(--linha);border-radius:0;
  padding:7px 14px;background:none;font:inherit;font-size:14px;font-weight:600;
  color:var(--texto);cursor:pointer}
.sm-nav .btn-nav:last-child{border-right:0}
.sm-nav .btn-nav:hover:not(:disabled){background:var(--superficie2);color:var(--marca)}
.sm-nav .btn-nav:disabled{color:var(--suave);cursor:default}
.sm-nav .texto{font-size:13px}

.sm-resumo{display:grid;gap:10px;margin-top:16px;
  grid-template-columns:repeat(auto-fit,minmax(165px,1fr))}
.sm-chip{background:var(--superficie);border:1px solid var(--linha);border-radius:13px;
  padding:12px 14px;box-shadow:0 1px 2px rgba(15,23,42,.04)}
.sm-chip em{display:block;font-style:normal;font-size:11px;font-weight:600;letter-spacing:.06em;
  text-transform:uppercase;color:var(--suave)}
.sm-chip b{display:block;margin-top:2px;font-family:var(--display);font-size:19px;
  font-weight:800;letter-spacing:-.02em;line-height:1.2;color:var(--texto)}
.sm-selo{display:inline-block;margin-top:5px;font-style:normal;font-size:10.5px;font-weight:700;
  letter-spacing:.04em;text-transform:uppercase;padding:2px 8px;border-radius:999px;
  background:var(--marca-fraca);color:var(--ouro)}
.sm-tr{display:block;height:5px;border-radius:999px;background:var(--superficie3);
  overflow:hidden;margin-top:8px}
.sm-tr i{display:block;height:100%;border-radius:999px;background:var(--ok);
  transition:width .4s ease}

/* consulta fica a um toque, não na frente do conteúdo */
.sm-ref{margin-top:18px;border:1px solid var(--linha);border-radius:12px;
  background:var(--superficie);overflow:hidden}
.sm-ref summary{cursor:pointer;padding:12px 15px;font-size:13px;font-weight:600;
  color:var(--suave);list-style:none}
.sm-ref summary::-webkit-details-marker{display:none}
.sm-ref summary::after{content:"+";float:right;font-size:16px;line-height:1}
.sm-ref[open] summary::after{content:"\2212"}
.sm-ref summary:hover{color:var(--texto)}
.sm-ref .legenda,.sm-ref .dica-linha{padding:0 15px 14px}

/* ---- arrastar com o dedo ---- */
.arrasta-vaga{border:2px dashed var(--marca);border-radius:10px;background:var(--marca-fraca);
  margin:4px 0;opacity:.6}
.arrastando{opacity:.9;transform-origin:center;pointer-events:none;position:relative;z-index:50;
  box-shadow:0 10px 28px rgba(15,23,42,.22);cursor:grabbing}
body.arrastando-algo{user-select:none;-webkit-user-select:none}
body.arrastando-algo *{cursor:grabbing !important}

@media (max-width:560px){
  .sm-resumo{grid-template-columns:1fr 1fr}
  .sm-chip b{font-size:17px}
  .sm-acoes{width:100%}
  .sm-acoes .btn{flex:1}
}