/* 囚人科技 V6 — 手机版：一屏一件器物，左右滑动探索 */
@media (max-width: 768px) {

  body {
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior-y: contain;
  }

  .scene {
    height: 100svh;
    min-height: 100svh;
  }

  /* 背景取景随项目切换（同一张横图按竖屏裁切，不拉伸） */
  .env-media img,
  .fore-media {
    object-position: var(--bgpos, 50% 50%);
    transition: transform 2.2s cubic-bezier(.2, .7, .2, 1), object-position .9s ease;
  }

  .scene.ready .env-media img,
  .scene.ready .fore-media {
    transform: scale(1.06);
  }

  .layer-atmos {
    background:
      radial-gradient(ellipse at 80% 1%, rgba(255, 214, 150, .2), transparent 46%),
      linear-gradient(180deg, rgba(4, 5, 5, .35) 0%, transparent 22%, transparent 62%, rgba(4, 5, 4, .78) 100%);
  }

  .hero,
  .artifacts,
  .layer-labels,
  .footer,
  .light-follow {
    display: none;
  }

  /* 顶部固定导航 */
  .header {
    position: fixed;
    z-index: 46;
    padding: calc(22px + env(safe-area-inset-top, 0px)) 6% 0;
    background: linear-gradient(180deg, rgba(5, 6, 6, .82), rgba(5, 6, 6, .34) 62%, transparent);
  }

  .brand {
    gap: 12px;
  }

  .brand-mark {
    width: 34px;
    height: 34px;
  }

  .brand-name {
    font-size: 18px;
    letter-spacing: .24em;
  }

  .brand-name small {
    margin-top: 6px;
    font-size: 10px;
    letter-spacing: .26em;
  }

  .navigation {
    display: none;
  }

  .menu-toggle {
    display: block;
  }

  body.menu-open .menu-toggle span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
  }

  body.menu-open .menu-toggle span:nth-child(2) {
    opacity: 0;
  }

  body.menu-open .menu-toggle span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
  }

  .mobile-menu {
    display: flex;
  }

  body.menu-open {
    overflow: hidden;
  }

  body.menu-open .mobile-menu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition: opacity .35s ease, visibility 0s linear 0s;
  }

  body.menu-open .slide-dots {
    opacity: 0;
    pointer-events: none;
  }

  /* 逐件探索 */
  .slides {
    display: block;
    position: absolute;
    z-index: 8;
    inset: 0;
    overflow: hidden;
    overscroll-behavior-x: none;
    touch-action: pan-y;
  }

  .slides.is-dragging {
    cursor: grabbing;
    -webkit-user-select: none;
    user-select: none;
  }

  .slide img {
    -webkit-user-drag: none;
    user-select: none;
  }

  .slide {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding:
      calc(14svh + env(safe-area-inset-top, 0px))
      7%
      calc(76px + env(safe-area-inset-bottom, 0px));
    opacity: 0;
    transform: translate3d(calc(var(--slide-dir, 1) * 46px), 0, 0) scale(.965);
    transition: opacity .45s ease, transform .6s cubic-bezier(.2, .7, .2, 1);
    pointer-events: none;
  }

  .slide.is-active {
    opacity: 1;
    transform: none;
    pointer-events: auto;
  }

  .slide-head {
    flex: none;
  }

  .slide-kicker {
    font: 9px/1.6 var(--sans);
    letter-spacing: .3em;
    color: #e2bd85;
    text-shadow: 0 2px 8px rgba(0, 0, 0, .95), 0 0 20px rgba(0, 0, 0, .8), 0 0 40px rgba(0, 0, 0, .5);
  }

  .slide h2 {
    display: flex;
    align-items: baseline;
    gap: 10px;
    margin: 9px 0 0;
    font-size: 30px;
    font-weight: 400;
    letter-spacing: .18em;
    text-shadow: 0 2px 18px rgba(0, 0, 0, .9), 0 0 44px rgba(0, 0, 0, .55);
  }

  .slide-status {
    padding: 2px 5px;
    border: 1px solid rgba(199, 164, 119, .4);
    font: 9px/1.4 var(--sans);
    letter-spacing: .14em;
    color: var(--gold);
  }

  .slide-sub {
    margin: 7px 0 0;
    font-size: 11px;
    letter-spacing: .12em;
    color: var(--muted);
  }

  .slide-media {
    position: relative;
    flex: 1;
    min-height: 0;
    margin: 6px 0 10px;
    padding: 0 5% 2%;
    display: flex;
    align-items: flex-end;
    justify-content: center;
  }

  .slide-media img {
    width: 80%;
    height: 100%;
    object-fit: contain;
    filter:
      brightness(1.01) saturate(1.03) contrast(.97) sepia(.06)
      drop-shadow(-2px -3px 8px rgba(255, 198, 128, .18))
      drop-shadow(8px 16px 22px rgba(12, 8, 5, .52));
    animation: relicFloat var(--float-dur, 8s) ease-in-out var(--float-delay, 0s) infinite alternate;
  }

  .slide-media::after {
    content: "";
    position: absolute;
    z-index: -1;
    left: 12%;
    right: 12%;
    bottom: 1.5%;
    height: 9%;
    border-radius: 50%;
    background: radial-gradient(ellipse at 50% 42%,
      rgba(0, 0, 0, .78) 0 20%,
      rgba(0, 0, 0, .44) 46%,
      rgba(0, 0, 0, .16) 66%,
      transparent 82%);
    filter: blur(9px);
    pointer-events: none;
  }

  /* 未明之核：悬浮的环状体，尺寸再缩半、居中悬浮，不画接地阴影 */
  .slide.is-core .slide-media img {
    width: 40%;
    height: 100%;
  }

  .slide.is-core .slide-media::after {
    display: none;
  }

  .core-badge {
    position: absolute;
    right: 0;
    top: 2%;
    width: 24%;
    opacity: .9;
    text-align: right;
    pointer-events: none;
    isolation: isolate;
  }

  .core-badge::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: -16% -12% -24% -12%;
    border-radius: 50%;
    background: radial-gradient(circle at 62% 38%, rgba(4, 5, 5, .58), transparent 68%);
    filter: blur(7px);
  }

  .core-badge img {
    width: 100%;
    height: auto;
    animation: corePulse 9s ease-in-out infinite alternate;
    filter: drop-shadow(0 0 14px rgba(255, 190, 110, .25));
  }

  .core-badge span {
    position: absolute;
    right: 0;
    top: 100%;
    margin-top: 4px;
    padding: 3px 6px;
    white-space: nowrap;
    font: 8px/1.5 var(--sans);
    letter-spacing: .18em;
    color: var(--gold-bright);
    background: linear-gradient(90deg, rgba(4, 5, 5, .12), rgba(4, 5, 5, .68));
    text-shadow: 0 1px 8px #000, 0 0 14px rgba(0, 0, 0, .9);
  }

  .slide-foot {
    flex: none;
    position: relative;
  }

  /* 底部文字压在岩壁上时补一层暗底，保证可读 */
  .slide-foot::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: -14% -9% -6%;
    background: linear-gradient(180deg, transparent 0%, rgba(5, 6, 6, .34) 32%, rgba(5, 6, 6, .58) 100%);
    filter: blur(2px);
    pointer-events: none;
  }

  .slide-desc {
    margin: 0;
    font-size: 12px;
    line-height: 1.9;
    letter-spacing: .1em;
    color: #cfc6b8;
    text-shadow: 0 1px 4px rgba(0, 0, 0, .95), 0 0 16px rgba(0, 0, 0, .75);
  }

  .enter-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-top: 13px;
    padding: 11px 18px;
    border: 1px solid var(--gold-soft);
    background: rgba(18, 16, 13, .55);
    color: var(--gold-bright);
    font: 11px/1 var(--sans);
    letter-spacing: .2em;
    text-decoration: none;
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
    transition: background .3s, border-color .3s;
  }

  .enter-btn:hover,
  .enter-btn:focus-visible {
    background: rgba(199, 164, 119, .16);
    border-color: var(--gold);
  }

  .slide-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 15px;
    padding-right: 3px;
    font: 9px/1.6 var(--sans);
    letter-spacing: .2em;
    color: #b0a799;
    text-shadow: 0 1px 5px rgba(0, 0, 0, .9), 0 0 14px rgba(0, 0, 0, .6);
  }

  .slide-count {
    color: var(--gold);
  }

  .slide-swipe {
    opacity: .75;
  }

  /* 页码指示 */
  .slide-dots {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    position: fixed;
    z-index: 44;
    left: 0;
    right: 0;
    bottom: calc(14px + env(safe-area-inset-bottom, 0px));
    transition: opacity .3s;
  }

  .slide-dot {
    width: 30px;
    height: 30px;
    padding: 0;
    border: 0;
    background: none;
    cursor: pointer;
    display: grid;
    place-items: center;
  }

  .slide-dot i {
    display: block;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: rgba(199, 164, 119, .32);
    transition: transform .35s, background .35s;
  }

  .slide-dot[aria-current="true"] i {
    background: var(--gold);
    transform: scale(1.7);
  }

  .panel {
    width: 100%;
    max-height: 80svh;
    padding: 34px 26px;
  }

  .panel h2 {
    font-size: 25px;
  }
}