/* OposicionAI — small custom layer on top of Tailwind (MVP). */

html { -webkit-font-smoothing: antialiased; }

/* Reliable responsive app navigation.
 * The Tailwind Play CDN can emit `.hidden` after `.md:block`, so the `hidden
 * md:block` / `md:hidden` twin classes are unreliable. These rules own the
 * sidebar/bottom-nav visibility directly (until we swap the CDN for a build). */
.opoai-sidebar { display: none !important; }
.opoai-bottomnav { display: grid !important; }
@media (min-width: 768px) {
	.opoai-sidebar { display: flex !important; }
	.opoai-bottomnav { display: none !important; }
}

/* Fill available height for immersive study views (tests, flashcards). */
.opoai-stage { min-height: calc(100vh - 8rem); }
@media (min-width: 768px) { .opoai-stage { min-height: calc(100vh - 6rem); } }

/* Flashcard flip helper (used later by the flashcards view). */
.opoai-card { perspective: 1000px; }
.opoai-card__inner { transition: transform .5s; transform-style: preserve-3d; }
.opoai-card.is-flipped .opoai-card__inner { transform: rotateY(180deg); }
.opoai-card__face { backface-visibility: hidden; }
.opoai-card__face--back { transform: rotateY(180deg); }