.starshards-page .fullscreen-toggle-btn.is-active {
  color: #eefbff;
  border-color: rgba(125, 240, 255, 0.5);
  background: rgba(125, 240, 255, 0.16);
}

body.starshards-app-mode .wrap {
  min-height: 100dvh;
  padding: 0;
}

body.starshards-app-mode .site-header {
  display: none;
}

body.starshards-app-mode .shell {
  max-width: none;
  min-height: 100dvh;
  margin: 0;
  padding-top: max(0.8rem, env(safe-area-inset-top, 0px));
  padding-right: max(0.9rem, env(safe-area-inset-right, 0px));
  padding-bottom: max(0.9rem, env(safe-area-inset-bottom, 0px));
  padding-left: max(0.9rem, env(safe-area-inset-left, 0px));
  overflow: auto;
}

body.starshards-app-mode .hero {
  grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
  gap: 0.8rem;
  margin-bottom: 0.75rem;
}

body.starshards-app-mode .game-surface-card {
  max-width: min(100%, 1100px);
}

body.starshards-app-mode .floating-controls {
  right: max(0.85rem, env(safe-area-inset-right, 0px));
  bottom: max(0.85rem, env(safe-area-inset-bottom, 0px));
}

@media (max-width: 900px) {
  body.starshards-app-mode .hero {
    grid-template-columns: 1fr;
  }

  body.starshards-app-mode .floating-controls {
    position: static;
    margin: 0.9rem auto 0;
    width: min(100%, 30rem);
    align-items: stretch;
  }

  body.starshards-app-mode .floating-game-actions {
    width: 100%;
  }

  body.starshards-app-mode .floating-action,
  body.starshards-app-mode .help-panel {
    width: 100%;
    min-width: 0;
  }
}
