:root {
  --mil-bg: #F3D7E8;
  --mil-surface: #FFFFFF;
  --mil-surface-soft: rgba(255,255,255,0.84);
  --mil-border: #F3D7E8;
  --mil-border-strong: #F3D7E8;
  --mil-text: #2D2730;
  --mil-muted: #5B515F;
  --mil-purple: #CF86FA;
  --mil-purple-dark: #5B515F;
  --mil-purple-soft: #CF86FA;
  --mil-pink: #FC61AA;
  --mil-pink-dark: #FC61AA;
  --mil-pink-soft: #F3D7E8;
  --mil-shadow: 0 26px 76px rgba(91,81,95,0.14);
  --mil-shadow-soft: 0 14px 34px rgba(91,81,95,0.12);
  --mil-radius-xl: 34px;
  --mil-radius-lg: 27px;
  --mil-radius-md: 18px;
  --mil-font: "Nunito", "Segoe UI", Arial, sans-serif;
}

* { box-sizing: border-box; }
html { min-width: 320px; background: var(--mil-bg); }
body { margin: 0; min-height: 100vh; font-family: var(--mil-font); color: var(--mil-text); }
button, input { font: inherit; }
button { color: inherit; }
button:focus-visible, input:focus-visible { outline: 3px solid rgba(207,134,250,.24); outline-offset: 3px; }


/* ===== MIL Experience — carregamento unificado e discreto ===== */
:where(.loading-cover,.story-loading,.episodes-loading,.wardrobe-loading,.bank-loading,.gallery-loading,.hypeline-loading,.characters-loading,.settings-loading){
  position:absolute !important;
  inset:0 !important;
  z-index:190 !important;
  display:grid !important;
  place-items:center !important;
  background:rgba(243,215,232,.92) !important;
  -webkit-backdrop-filter:blur(12px) !important;
  backdrop-filter:blur(12px) !important;
  transition:opacity .24s ease,visibility .24s ease !important;
}
:where(.loading-cover,.story-loading,.episodes-loading,.wardrobe-loading,.bank-loading,.gallery-loading,.hypeline-loading,.characters-loading,.settings-loading).hidden{
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
}
:where(.loading-cover,.story-loading,.episodes-loading,.wardrobe-loading,.bank-loading,.gallery-loading,.hypeline-loading,.characters-loading,.settings-loading) > div{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  color:#5B515F !important;
  font:900 10px/1.35 Nunito,sans-serif !important;
}
:where(.loading-cover,.story-loading,.episodes-loading,.wardrobe-loading,.bank-loading,.gallery-loading,.hypeline-loading,.characters-loading,.settings-loading) img{
  width:132px !important;
  height:68px !important;
  object-fit:contain !important;
}
:where(.loading-cover,.story-loading,.episodes-loading,.wardrobe-loading,.bank-loading,.gallery-loading,.hypeline-loading,.characters-loading,.settings-loading) i{
  position:relative !important;
  width:5px !important;
  height:5px !important;
  margin-top:4px !important;
  border-radius:50% !important;
  background:#CF86FA !important;
  box-shadow:13px 0 0 #FC61AA,26px 0 0 #FC61AA !important;
  animation:milLoadingDots 1.05s ease-in-out infinite !important;
  transform:translateX(-13px) !important;
}
:where(.loading-cover,.story-loading,.episodes-loading,.wardrobe-loading,.bank-loading,.gallery-loading,.hypeline-loading,.characters-loading,.settings-loading) i::before,
:where(.loading-cover,.story-loading,.episodes-loading,.wardrobe-loading,.bank-loading,.gallery-loading,.hypeline-loading,.characters-loading,.settings-loading) i::after{
  display:none !important;
  content:none !important;
}
@keyframes milLoadingDots{
  0%,100%{opacity:.35;filter:saturate(.8)}
  50%{opacity:1;filter:saturate(1.15)}
}
@media(prefers-reduced-motion:reduce){
  :where(.loading-cover,.story-loading,.episodes-loading,.wardrobe-loading,.bank-loading,.gallery-loading,.hypeline-loading,.characters-loading,.settings-loading) i{animation:none !important}
}
