/* SinaU-Ilmu: gaya tambahan di luar kelas utilitas Tailwind (animasi karakter, scrollbar, cetak). */
[x-cloak] { display: none !important; }

body {
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  background-color: #F0F4F8;
  color: #1B2733;
  -webkit-font-smoothing: antialiased;
}

::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #CBD5E1; border-radius: 999px; }
::-webkit-scrollbar-thumb:hover { background: #94A3B8; }

/* Karakter: gerak diam (idle), gelisah, bayangan, partikel emosi, mulut bicara */
@keyframes chBob { 0%, 100% { transform: translateY(-3px); } 50% { transform: translateY(1px) rotate(0.5deg); } }
@keyframes chFidget { 0%, 100% { transform: translateY(-2px) rotate(-1deg); } 50% { transform: translateY(2px) rotate(1deg); } }
@keyframes chShadow { 0%, 100% { transform: scale(1); opacity: .35; } 50% { transform: scale(1.08); opacity: .25; } }
@keyframes fxFrustrated { 0%, 100% { transform: translateY(-4px) scale(1) rotate(-5deg); } 50% { transform: translateY(4px) scale(1.15) rotate(5deg); } }
@keyframes fxHesitant { 0%, 100% { transform: translateY(-2px); opacity: .6; } 50% { transform: translateY(6px); opacity: 1; } }
@keyframes fxCalm { 0%, 100% { transform: translateY(-3px) scale(.9); } 50% { transform: translateY(3px) scale(1.1); } }
@keyframes fxHappy { 0%, 100% { transform: translateY(-6px) rotate(-10deg); } 50% { transform: translateY(2px) rotate(10deg); } }
@keyframes chTalk { 0%, 100% { transform: scaleY(1); } 50% { transform: scaleY(.45); } }
@keyframes spinSwap { 0% { transform: rotate(0); } 50% { transform: rotate(180deg); } 100% { transform: rotate(360deg); } }
@keyframes popIn { from { opacity: 0; transform: translateY(12px) scale(.96); } to { opacity: 1; transform: none; } }
@keyframes slideInLeft { from { opacity: 0; transform: translateX(-60px) scale(.92); } to { opacity: 1; transform: none; } }
@keyframes bounceShort { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-4px); } }

.ch-bob { animation: chBob 3.2s ease-in-out infinite; }
.ch-fidget { animation: chFidget .8s ease-in-out infinite; }
.ch-shadow { animation: chShadow 3s ease-in-out infinite; }
.fx-frustrated { animation: fxFrustrated 1.5s ease-in-out infinite; }
.fx-hesitant { animation: fxHesitant 2s ease-in-out infinite; }
.fx-calm { animation: fxCalm 2.5s ease-in-out infinite; }
.fx-happy { animation: fxHappy 1.8s ease-in-out infinite; }
.ch-talk { animation: chTalk .28s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }
.spin-swap { animation: spinSwap 4s ease-in-out infinite; }
.pop-in { animation: popIn .3s ease-out both; }
.slide-in-left { animation: slideInLeft .45s cubic-bezier(.2, .9, .3, 1.2) both; }
.animate-bounce-short { animation: bounceShort .6s ease-in-out 2; }

/* Carousel 3D kartu skenario (coverflow, transisi pegas) */
.deck-stage { perspective: 1200px; touch-action: pan-y; cursor: grab; }
.deck-stage:active { cursor: grabbing; }
.deck-card { transform-style: preserve-3d; will-change: transform, opacity;
  transition: transform .75s cubic-bezier(.2, 1.15, .32, 1), opacity .55s ease, filter .55s ease; }
.deck-card a, .deck-card button { cursor: pointer; }
.deck-card .deck-clamp { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.deck-glow { position: absolute; left: 50%; top: 55%; width: 620px; max-width: 100%; height: 420px; transform: translate(-50%, -50%);
  background: radial-gradient(closest-side, rgba(13, 148, 136, .18), rgba(16, 185, 129, .08) 55%, transparent);
  filter: blur(10px); pointer-events: none; }
.deck-stage.is-dragging .deck-card { transition: none; }
.deck-only { display: none; }
.deck-card .deck-only { display: -webkit-box; }
@media (prefers-reduced-motion: reduce) { .deck-card { transition: none; } }

@media print {
  .no-print { display: none !important; }
  body { background: #fff; }
  main { box-shadow: none !important; border: 0 !important; }
}
