html,body{
  width:100%;
  min-height:100%;
  background:#0B0B10;
  color:var(--text);
  font-family:var(--font-body);
}
html{background:#0B0B10;color-scheme:dark}
body{
  min-height:100vh;
  min-height:100dvh;
  overflow:hidden;
  background:
    radial-gradient(circle at 18% 12%,color-mix(in srgb,var(--accent) 11%,transparent),transparent 30%),
    radial-gradient(circle at 86% 82%,color-mix(in srgb,var(--accent-2) 8%,transparent),transparent 28%),
    linear-gradient(145deg,var(--grad-a),#0B0B10 48%,var(--grad-b));
  color:var(--text);
  isolation:isolate;
  transition:background var(--theme-speed) var(--ease),color var(--theme-speed) var(--ease);
}
body::before,
body::after{
  content:"";
  position:fixed;
  inset:-8%;
  pointer-events:none;
  z-index:-1;
}
body::before{
  background:
    radial-gradient(circle at 18% 24%,color-mix(in srgb,var(--accent-2) 32%,transparent) 0 1.3px,transparent 1.9px) 0 0/34px 34px,
    radial-gradient(circle at 78% 68%,color-mix(in srgb,var(--accent) 28%,transparent) 0 1px,transparent 1.7px) 0 0/48px 48px,
    linear-gradient(118deg,transparent 0 46%,color-mix(in srgb,var(--accent-2) 8%,transparent) 46% 47.2%,transparent 47.2% 100%) 0 0/148px 148px,
    linear-gradient(28deg,transparent 0 47%,color-mix(in srgb,var(--accent) 6%,transparent) 47% 48%,transparent 48% 100%) 0 0/184px 184px;
  opacity:.42;
  mix-blend-mode:screen;
  filter:drop-shadow(0 0 7px color-mix(in srgb,var(--glow) 44%,transparent));
  animation:mhouseNeonDrift 26s linear infinite alternate;
}
body::after{
  background:
    radial-gradient(circle at 12% 16%,color-mix(in srgb,var(--glow) 54%,transparent),transparent 24%),
    radial-gradient(circle at 84% 74%,color-mix(in srgb,var(--accent) 20%,transparent),transparent 23%),
    radial-gradient(circle at 52% 46%,color-mix(in srgb,var(--accent-2) 8%,transparent),transparent 30%);
  opacity:.40;
  filter:blur(28px);
  animation:mhouseNeonPulse 14s ease-in-out infinite alternate;
}
#app,.app-root{
  position:relative;
  z-index:0;
  min-height:100vh;
  min-height:100dvh;
  background:transparent;
}
.app-root::before,.app-root::after{content:none!important}
button{color:inherit}
@keyframes mhouseNeonDrift{
  from{transform:translate3d(0,0,0) scale(1) rotate(0deg)}
  to{transform:translate3d(-28px,20px,0) scale(1.045) rotate(.7deg)}
}
@keyframes mhouseNeonPulse{
  from{transform:scale(1);opacity:.28}
  to{transform:scale(1.07);opacity:.44}
}
@media (prefers-reduced-motion:reduce){
  body::before,body::after{animation:none!important}
}

/* v3.0 — standalone PWA full-bleed / safe-area fix */
html{
  height:100%;
  min-height:100%;
  min-height:-webkit-fill-available;
  background:#0B0B10 !important;
  overscroll-behavior:none;
}
body{
  width:100%;
  height:100%;
  min-height:100%;
  min-height:-webkit-fill-available;
  margin:0;
  padding:0;
  background-color:#0B0B10 !important;
  overscroll-behavior:none;
}
#app,.app-root{
  width:100%;
  height:100%;
  min-height:100%;
  background-color:#0B0B10;
}
@supports (height:100dvh){
  html,body,#app,.app-root{
    height:100dvh;
    min-height:100dvh;
  }
}
@media (display-mode: standalone){
  html,body,#app,.app-root{
    width:100%;
    height:100%;
    min-height:100%;
    background-color:#0B0B10 !important;
  }
  body{
    position:fixed;
    inset:0;
    overflow:hidden;
  }
  .shell{
    height:100% !important;
    min-height:0 !important;
  }
}
@supports (-webkit-touch-callout:none){
  html,body,#app,.app-root{
    min-height:-webkit-fill-available;
  }
}