/* Panel «Prácticas»: alternativa accesible al taller, solo cuando se abre. */
.practices {
  width: min(420px, calc(100vw - 32px)); padding: 0 0 14px; border: 1px solid var(--line); border-radius: 14px;
  background: var(--surface); color: var(--ink); box-shadow: 0 16px 40px rgb(var(--navy-rgb) / 28%);
}
.practices::backdrop { background: rgb(var(--navy-rgb) / 40%); }
.practices__head { display: flex; align-items: center; justify-content: space-between; padding: 12px 12px 12px 18px; background: var(--navy); color: var(--on-dark); }
.practices__head h2 { font-size: 17px; }
.practices__close { display: grid; place-items: center; width: 34px; height: 34px; border: 0; border-radius: 8px; background: transparent; color: var(--on-dark); cursor: pointer; }
.practices__close:hover { background: rgb(255 255 255 / 14%); }
.practices__group { margin: 14px 18px 6px; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.practices__list { margin: 0; padding: 0 12px; list-style: none; display: grid; gap: 4px; }
.practice-link {
  display: grid; grid-template-columns: 1fr auto; gap: 0 12px; align-items: center; padding: 10px 12px; border-radius: 10px;
  border: 1px solid var(--line); color: var(--ink); text-decoration: none;
}
.practice-link strong { color: var(--navy); }
.practice-link span { grid-column: 1; font-size: 14px; color: var(--muted); }
.practice-link .practice-link__go { grid-column: 2; grid-row: 1 / span 2; font-size: 20px; color: var(--blue); }
.practice-link:hover { border-color: var(--blue); background: var(--blue-soft); }
.practices__list--soon li { padding: 6px 12px; color: var(--muted); font-size: 14.5px; }
/* Práctica anunciada: la misma tarjeta, sin enlace y con la etiqueta en lugar de la flecha. */
.practice-link--soon { border-style: dashed; background: rgb(var(--navy-rgb) / 3%); cursor: default; }
.practice-link--soon strong { color: var(--ink); }
.practice-link .practice-link__badge { grid-column: 2; grid-row: 1 / span 2; padding: 3px 8px; border-radius: 999px; background: var(--blue-soft); color: var(--blue); font-size: 12px; font-weight: 700; letter-spacing: .02em; }

.practices{max-height:calc(100dvh - 32px);overflow-y:auto}
.practices :focus-visible{outline:3px solid var(--blue);outline-offset:3px}