:root {
  --desktop-stage-width: 1920px;
  --desktop-stage-height: 1080px;
  --desktop-stage-background: #02060a;
}

html,
body {
  width: 100%;
  height: 100%;
  margin: 0;
  overflow: hidden;
  background: var(--desktop-stage-background);
}

.viewport-shell {
  position: fixed;
  inset: 0;
  overflow: hidden;
  background: var(--desktop-stage-background);
}

html.is-mobile-gesture-guarded,
html.is-mobile-gesture-guarded body,
html.is-mobile-gesture-guarded .viewport-shell {
  touch-action: pan-x pan-y;
  overscroll-behavior: none;
}

.desktop-stage {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  container-type: size;
  transform-origin: top left;
}

html.is-fixed-desktop-stage .viewport-shell {
  width: 100%;
  height: 100%;
}

html.is-fixed-desktop-stage .desktop-stage {
  inset: auto;
  width: var(--desktop-stage-width);
  height: var(--desktop-stage-height);
  overflow: hidden;
  will-change: transform;
}

html.is-fixed-desktop-stage .experience,
html.is-fixed-desktop-stage .scene,
html.is-fixed-desktop-stage .fortune-page,
html.is-fixed-desktop-stage .destiny-page,
html.is-fixed-desktop-stage .wendao-page,
html.is-fixed-desktop-stage .xunguang-page,
html.is-fixed-desktop-stage .rujing-page,
html.is-fixed-desktop-stage .initial-loading-overlay {
  width: var(--desktop-stage-width);
  height: var(--desktop-stage-height);
  min-height: 0;
}

html.is-fixed-desktop-stage .scene {
  inset: 0;
  transform: none;
}

html.is-fixed-desktop-stage .side-rail {
  display: flex;
}

html.is-fixed-desktop-stage .bazi-panel {
  overflow: visible;
  padding: 0;
}

html.is-fixed-desktop-stage .birth-form,
html.is-fixed-desktop-stage .bazi-result {
  position: absolute;
  top: 50%;
  margin: 0;
  transform: translateY(-43%);
}

html.is-fixed-desktop-stage .birth-form {
  left: clamp(48px, 4.5cqw, 108px);
  width: min(660px, 38cqw);
}

html.is-fixed-desktop-stage .bazi-result {
  right: clamp(82px, 11.8cqw, 190px);
  width: min(390px, 31cqw);
}

html.is-fixed-desktop-stage .birth-fields {
  grid-template-columns: 1.02fr 0.94fr 0.94fr 1.85fr;
}

html.is-fixed-desktop-stage .birth-meta-fields {
  grid-template-columns: 1.14fr 0.94fr 0.94fr 0.94fr;
}

html.is-fixed-desktop-stage .form-options-row {
  justify-content: space-between;
  flex-wrap: nowrap;
  margin: 0 12px 24px;
}

html.is-fixed-desktop-stage .fortune-page,
html.is-fixed-desktop-stage .destiny-page,
html.is-fixed-desktop-stage .wendao-page,
html.is-fixed-desktop-stage .xunguang-page,
html.is-fixed-desktop-stage .rujing-page {
  inset: 0;
}