/* Landscape Signature Nails master welcome artwork: native 1536x1024 AVIF.
   Interactive controls remain independent, accessible HTML elements. */
body.welcome-mode .phone>.poster{
  clip-path:none!important;-webkit-clip-path:none!important;
  object-fit:contain!important;object-position:center!important;
}
@media (min-width:701px){
  body.welcome-mode .layout{
    display:flex!important;align-items:center!important;justify-content:center!important;
    height:100dvh!important;min-height:0!important;
    padding:35px 16px 8px!important;overflow:hidden!important;
    background:radial-gradient(ellipse at 50% 50%,#fff7f5 0%,#f1d5d5 76%,#ecd0d3);
  }
  body.welcome-mode .phone{
    position:relative!important;top:auto!important;margin:0 auto!important;
    width:min(calc((100dvh - 80px)*1.5),calc(100vw - 32px),1536px)!important;
    height:auto!important;min-height:0!important;
    aspect-ratio:3 / 2!important;overflow:hidden!important;
    border-radius:17px!important;
    box-shadow:0 18px 65px #753d4a35!important;
  }
  body.welcome-mode .phone>.poster{
    position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
    object-fit:contain!important;
  }
  body.welcome-mode .phone>.hotspot{
    position:absolute!important;z-index:6!important;
    border-radius:999px!important;min-width:0!important;
  }
  body.welcome-mode .phone>.book{left:26.7%!important;top:55.1%!important;width:46.1%!important;height:8.5%!important}
  body.welcome-mode .phone>.services{left:26.6%!important;top:65.4%!important;width:23.0%!important;height:7.3%!important}
  body.welcome-mode .phone>.gallery{left:50.6%!important;top:65.4%!important;width:22.9%!important;height:7.3%!important}
  body.welcome-mode .phone>.signin{left:26.6%!important;top:73.6%!important;width:23.0%!important;height:7.3%!important}
  body.welcome-mode .phone>.signup{left:50.6%!important;top:73.6%!important;width:22.9%!important;height:7.3%!important}
  body.welcome-mode .welcome-bottom-controls{
    position:absolute!important;z-index:6!important;
    left:26.6%!important;right:26.5%!important;top:82.0%!important;
    width:auto!important;height:7.4%!important;
    grid-template-columns:1fr 1fr!important;gap:2.1%!important;
  }
}
/* Mobile adaptation of the SAME 1536×1024 art: preserve its logo,
   printed buttons and original pixels. Transparent accessible HTML
   hit targets sit ON the seven printed controls, not underneath them. */
@media (max-width:700px){
  body.welcome-mode{
    min-height:100dvh!important;height:auto!important;overflow:auto!important;
    background:#f9e8e6!important;
  }
  body.welcome-mode .layout{
    display:flex!important;justify-content:center!important;align-items:center!important;
    width:100%!important;min-height:100dvh!important;height:auto!important;
    padding:calc(54px + env(safe-area-inset-top)) 10px calc(18px + env(safe-area-inset-bottom))!important;
    overflow:visible!important;
    background:
      radial-gradient(ellipse at 11% 20%,#fff6f5 0%,transparent 62%),
      radial-gradient(ellipse at 90% 88%,#f4d7db 0%,transparent 58%),
      linear-gradient(160deg,#fff1ee,#fae2e0)!important;
  }
  body.welcome-mode .phone{
    display:block!important;position:relative!important;top:auto!important;
    flex:none!important;width:min(100%,500px)!important;margin:0 auto!important;
    height:auto!important;min-height:0!important;
    /* 1.38 height/width crops only the OUTSIDE orchids/nails.
       The embedded logo and all seven printed controls remain visible. */
    aspect-ratio:100 / 138!important;padding:0!important;gap:0!important;
    border-radius:16px!important;overflow:hidden!important;
    background:#fbe6e6!important;
    box-shadow:0 14px 38px #86506336!important;
  }
  body.welcome-mode .phone>.poster{
    display:block!important;position:absolute!important;inset:0!important;
    width:100%!important;height:100%!important;max-width:none!important;
    aspect-ratio:auto!important;margin:0!important;padding:0!important;
    grid-column:auto!important;border-radius:0!important;
    object-fit:cover!important;object-position:center center!important;
  }
  body.welcome-mode .phone>.hotspot{
    display:block!important;position:absolute!important;inset:auto!important;
    z-index:6!important;width:auto;height:auto;
    padding:0!important;margin:0!important;min-height:0!important;
    border:1px solid transparent!important;border-radius:12px!important;
    background:transparent!important;box-shadow:none!important;
    color:transparent!important;font-size:0!important;
    text-indent:-9999px!important;overflow:hidden!important;
    cursor:pointer!important;
  }
  body.welcome-mode .phone>.hotspot::after{content:none!important}
  body.welcome-mode .phone>.book{
    left:1.8%!important;top:55.1%!important;width:95.4%!important;height:8.5%!important;
  }
  body.welcome-mode .phone>.services{
    left:1.5%!important;top:65.4%!important;width:47.7%!important;height:7.3%!important;
  }
  body.welcome-mode .phone>.gallery{
    left:51.2%!important;top:65.4%!important;width:47.4%!important;height:7.3%!important;
  }
  body.welcome-mode .phone>.signin{
    left:1.5%!important;top:73.6%!important;width:47.7%!important;height:7.3%!important;
  }
  body.welcome-mode .phone>.signup{
    left:51.2%!important;top:73.6%!important;width:47.4%!important;height:7.3%!important;
  }
  body.welcome-mode .welcome-bottom-controls{
    display:grid!important;position:absolute!important;z-index:6!important;
    top:82%!important;left:1.5%!important;right:1.4%!important;bottom:auto!important;
    width:auto!important;height:7.4%!important;
    padding:0!important;margin:0!important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    gap:2.1%!important;align-items:stretch!important;
  }
  body.welcome-mode .welcome-bottom-controls button,
  body.welcome-mode .welcome-bottom-controls #welcome-explore{
    display:block!important;position:relative!important;
    inset:auto!important;top:auto!important;left:auto!important;
    width:100%!important;height:100%!important;min-height:0!important;
    padding:0!important;margin:0!important;
    background:transparent!important;color:transparent!important;
    border:1px solid transparent!important;border-radius:12px!important;
    box-shadow:none!important;transform:none!important;
    text-indent:-9999px!important;overflow:hidden!important;
    font-size:0!important;cursor:pointer!important;
  }
  body.welcome-mode #legacy-owner-shortcut{display:none!important}
}
#site-shell .hero-art{aspect-ratio:3/2!important;border-radius:35px!important}
#site-shell .hero-brand-image{
  position:absolute!important;inset:0!important;top:0!important;left:0!important;
  width:100%!important;height:100%!important;
  object-fit:cover!important;object-position:center!important;transform:none!important;
}
#site-shell .brand-logo-image{
  position:absolute!important;inset:0!important;top:0!important;left:0!important;
  width:100%!important;height:100%!important;
  object-fit:cover!important;object-position:center 33%!important;transform:none!important;
}
@media(prefers-reduced-motion:reduce){
 body.welcome-mode .phone>.hotspot{transition:none!important}
}
