/* PC adaptive shell: keep WAP layout centered on desktop */
:root {
  --pc-shell-width: 430px;
  --pc-shell-half: 215px;
}

@media screen and (min-width: 500px) {
  html {
    background: #070d18;
  }

  body {
    min-height: 100%;
    background:
      radial-gradient(ellipse 70% 45% at 50% -10%, rgba(77, 166, 255, 0.16), transparent 60%),
      linear-gradient(180deg, #0a1224 0%, #070d18 50%, #0c1528 100%);
  }

  #app {
    width: var(--pc-shell-width);
    max-width: 100%;
    min-height: 100vh;
    margin: 0 auto;
    position: relative;
    overflow-x: hidden;
    background: #0c1528;
    box-shadow:
      0 0 0 1px rgba(255, 255, 255, 0.06),
      0 18px 56px rgba(0, 0, 0, 0.45);
  }

  /* Full-width fixed / teleported layers → phone shell */
  .van-nav-bar--fixed,
  .van-tabbar--fixed,
  .van-overlay,
  .van-number-keyboard,
  .van-submit-bar,
  .van-floating-panel,
  .van-image-preview,
  .van-popup--bottom,
  .van-popup--top,
  .van-popup--left,
  .van-popup--right,
  .van-action-sheet,
  .van-share-sheet,
  .van-notify {
    left: 50% !important;
    right: auto !important;
    width: var(--pc-shell-width) !important;
    max-width: var(--pc-shell-width) !important;
    margin-left: calc(var(--pc-shell-half) * -1) !important;
  }

  .van-tabbar--fixed {
    bottom: 0;
  }

  .van-nav-bar--fixed {
    top: 0;
  }

  /* Center popups: pin left/right to shell edges, keep Vant translateY */
  .van-popup--center,
  .van-dialog {
    left: calc(50% - var(--pc-shell-half)) !important;
    right: calc(50% - var(--pc-shell-half)) !important;
    width: fit-content !important;
    max-width: calc(var(--pc-shell-width) - 32px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .van-toast {
    max-width: calc(var(--pc-shell-width) - 48px) !important;
  }

  .van-floating-panel,
  .van-image-preview {
    width: var(--pc-shell-width) !important;
  }
}

@media screen and (min-width: 900px) {
  :root {
    --pc-shell-width: 460px;
    --pc-shell-half: 230px;
  }
}
