/* Pelengkap Tailwind: background, font, scrollbar, overlay, ikon. */
body{
  background:
    radial-gradient(1200px 600px at 110% -10%, #ffe1ec 0%, transparent 55%),
    radial-gradient(900px 500px at -10% 110%, #ffd9e6 0%, transparent 50%),
    #fff5f8;
  -webkit-font-smoothing:antialiased;
}
.bi{vertical-align:-.125em;line-height:1}

/* Modal overlay (di-toggle lewat class .show oleh app.js) */
.overlay{display:none}
.overlay.show{display:flex}

/* Sidebar off-canvas di mobile */
@media (max-width:767px){
  #sidebar{position:fixed;z-index:40;top:0;left:0;height:100vh;transform:translateX(-110%);transition:transform .25s ease}
  #sidebar.open{transform:none}
}

/* Scrollbar manis */
::-webkit-scrollbar{height:10px;width:10px}
::-webkit-scrollbar-thumb{background:#ffc2d6;border-radius:999px;border:2px solid #fff5f8}
::-webkit-scrollbar-thumb:hover{background:#ff9bbb}

/* animasi muncul */
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.animate-rise{animation:rise .4s cubic-bezier(.2,.8,.2,1) both}