/* Neuronautas dentro de la web: la barra de MyPrompTribe arriba y el juego ocupando todo lo demás. */
html, body.nn-shell { height: 100%; }
body.nn-shell { margin: 0; display: flex; flex-direction: column; height: 100dvh; overflow: hidden; background: #070b1f; }
body.nn-shell .tool-shell { display: contents; }
.nn-shell__header { flex: none; position: relative; z-index: 5; }
.nn-shell__full { display: inline-flex; align-items: center; gap: 8px; margin-left: auto; padding: 8px 14px; border-radius: 999px; border: 1px solid rgba(160, 200, 255, .35); background: rgba(98, 230, 255, .1); color: inherit; font: inherit; font-size: .9rem; font-weight: 600; cursor: pointer; white-space: nowrap; }
.nn-shell__full:hover { background: rgba(98, 230, 255, .2); border-color: rgba(98, 230, 255, .7); }
.nn-shell__main { flex: 1; min-height: 0; display: flex; }
#nn-game { flex: 1; width: 100%; height: 100%; border: 0; display: block; background: #070b1f; }
/* en el móvil en horizontal, la barra se compacta para dejar sitio al juego */
@media (max-height: 520px) {
  .nn-shell__header { padding-top: 4px !important; padding-bottom: 4px !important; min-height: 0 !important; }
  .nn-shell__header .brand-lockup__name { display: none; }
  .nn-shell__full span { display: none; }
  .nn-shell__full { padding: 6px 10px; }
}
@media (max-width: 560px) {
  .nn-shell__full span { display: none; }
  .nn-shell__full { padding: 7px 10px; }
}
/* el juego a todo el ancho (sin los márgenes de las páginas de herramientas) */
body.nn-shell main.nn-shell__main { max-width: none; width: 100%; margin: 0; padding: 0; }
body.nn-shell { padding: 0 !important; }
body.nn-shell .nn-shell__header { padding: 10px 20px; margin: 0; }
/* barra en una sola fila (las páginas de herramientas la parten en dos en pantallas estrechas) */
body.nn-shell .nn-shell__header { display: flex; flex-direction: row; align-items: center; flex-wrap: nowrap !important; gap: 10px; min-height: 0; }
body.nn-shell .nn-shell__header .tool-header__nav { flex: 1 1 auto; width: auto !important; min-width: 0; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
body.nn-shell .nn-shell__header .tool-header__nav::-webkit-scrollbar { display: none; }
body.nn-shell .nn-shell__header .tool-header__nav a { white-space: nowrap; }
body.nn-shell .nn-shell__full { flex: none; margin-left: 0; }
@media (max-height: 520px), (max-width: 720px) {
  body.nn-shell .nn-shell__header { padding: 4px 10px; gap: 6px; }
  body.nn-shell .nn-shell__header .brand-lockup__name { display: none; }
  body.nn-shell .nn-shell__header .brand-lockup__mark { width: 26px; height: 26px; }
  body.nn-shell .nn-shell__header .tool-header__nav { gap: 2px; }
  body.nn-shell .nn-shell__header .tool-header__nav a:not(.brand-lockup) { min-height: 32px; padding: 6px 8px; font-size: .76rem; }
  body.nn-shell .nn-shell__header select { padding-top: 4px; padding-bottom: 4px; font-size: .76rem; }
}