/* ==========================================================
   MoMoTown · 响应式适配层
   断点：≤1024 iPad 竖屏 / ≤760 手机 / ≤400 小屏
   手机端设计原则：
     · 文字最小 11.5px（辅助文字）/ 13px（正文）
     · 一屏（844px）至少能看到一个完整语义块
     · 横向可滑区域必须有视觉暗示（右缘渐隐 + 提示）
     · 底栏 64px + 安全区，所有板块底部预留
   ========================================================== */

html,body{max-width:100%;overflow-x:hidden;}
.mnav{display:none;}
.town-hint{display:none;}

/* ============ iPad 竖屏 / 小笔记本 ≤1024 ============ */
@media (max-width:1024px){
  .nav{padding:12px 16px;}
  .nav .links{position:static;transform:none;margin-left:auto;gap:5px;}
  .nav .links a{font-size:12.5px;padding:5px 11px;}
  .section{padding:64px 22px 16px;}
  .fullbleed .fb-bg.fb-world-stack{max-height:520px;}
  .road{grid-template-columns:repeat(3,1fr);row-gap:28px;}
  .road::before{display:none;}
  .carousel{height:420px;}
  .cslide{width:min(560px,64%);}
  .cslide.side-l1{transform:translateX(-50%) translateX(-260px) translateZ(-190px) rotateY(17deg) scale(.7);}
  .cslide.side-r1{transform:translateX(-50%) translateX(260px) translateZ(-190px) rotateY(-17deg) scale(.7);}
  .cslide.side-l2,.cslide.side-r2{opacity:0;pointer-events:none;}
  .gallery{grid-template-columns:220px 1fr;gap:20px;}
  .tl-item{padding:12px 14px;}
  .tl-item .dot{width:38px;height:38px;}
  .tl-item b{font-size:16px;}
  .reserve-wrap{grid-template-columns:minmax(220px,320px) 1fr;gap:26px;}
}

/* ============ 手机 ≤760 ============ */
@media (max-width:760px){
  :root{--nav-h:64px;--safe-b:env(safe-area-inset-bottom,0px);}

  /* ---------- 顶栏 / 固定控件 ---------- */
  .nav{padding:10px 12px;}
  .nav .logo{padding:5px 12px 5px 8px;border-width:2.5px;}
  .nav .logo img{height:20px!important;}
  .nav .links{display:none;}
  .coin-rail{display:none;}
  .p-layer{display:none;}   /* 手机不跑飘落粒子，省电且不遮字 */

  .mnav{display:flex;position:fixed;left:10px;right:10px;bottom:calc(8px + var(--safe-b));z-index:96;height:var(--nav-h);
    background:rgba(255,249,240,.97);border:2.5px solid var(--ink);border-radius:20px;
    box-shadow:0 4px 0 rgba(92,61,46,.4),0 10px 24px rgba(92,61,46,.16);
    padding:5px;gap:0;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;backdrop-filter:blur(8px);
    /* 右缘渐隐提示可滑 */
    -webkit-mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 28px),rgba(0,0,0,.25) 100%);
    mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 28px),rgba(0,0,0,.25) 100%);}
  .mnav::-webkit-scrollbar{display:none;}
  .mnav a{flex:0 0 auto;min-width:66px;text-align:center;text-decoration:none;color:var(--ink);
    font-size:11.5px;font-weight:700;padding:6px 8px;border-radius:14px;white-space:nowrap;
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;line-height:1.1;}
  .mnav a.on{background:var(--gold-hi);box-shadow:inset 0 0 0 2px var(--ink);}
  .mnav a.cta{background:linear-gradient(180deg,var(--gold-hi),var(--gold-1));box-shadow:inset 0 0 0 2px var(--ink);}

  /* 所有板块为底栏预留 */
  .section{padding:40px 16px 8px;}
  #reserve{padding-bottom:calc(var(--nav-h) + 40px)!important;}
  footer{padding:28px 20px calc(var(--nav-h) + 40px + var(--safe-b));font-size:11.5px;line-height:1.9;}

  /* ---------- Hero ---------- */
  /* 首屏：不再占满整屏，高度 ≈ 内容 + 顶部留白，让下一板块露头 */
  .hero{min-height:0;height:auto;padding:150px 16px calc(var(--nav-h) + 22px);justify-content:flex-end;}
  .hero-bg{background-position:center 30%;}
  .hero-logo{width:min(66vw,320px);padding:4% 5%;}
  .hero .tagline{font-size:15px;margin-top:4px;}
  .hero .subline{font-size:12.5px;padding:7px 14px;margin-top:10px;line-height:1.5;white-space:normal;max-width:92vw;border-width:2.5px;}
  .hero-stats{gap:6px;margin-top:10px;}
  .hstat{padding:8px 6px;border-radius:14px;flex:1 1 0;min-width:0;border-width:2.5px;}
  .hstat b{font-size:20px;}
  .hstat span{font-size:11px;line-height:1.3;}
  .hero .press{margin-top:10px;font-size:11px;}

  /* ---------- 板块通用 ---------- */
  .sec-head{gap:8px;margin-bottom:8px;}
  .sec-num{font-size:12px;padding:3px 9px;border-width:2.5px;}
  .sec-title{font-size:21px;letter-spacing:1px;line-height:1.2;}
  .sec-title .en{display:block;margin:1px 0 0;font-size:10.5px;letter-spacing:2px;}
  .sec-lede{font-size:13px;line-height:1.75;margin-bottom:12px;}
  .wave-sep{margin:14px 0 0;height:26px;}
  .badge-row{gap:8px;}
  .plaque{padding:8px 16px;font-size:13px;letter-spacing:1.5px;border-width:2.5px;}
  .plaque::before,.plaque::after{top:-10px;height:10px;}
  .ur-tag{font-size:12px;padding:5px 12px;}

  /* ---------- 世界观：16:9 横图；三枚标签叠在图下缘，单行可滑 + 右缘渐隐 ---------- */
  .fullbleed{width:100vw;left:50%;transform:translateX(-50%);margin-top:6px;-webkit-mask-image:none;mask-image:none;}
  .fullbleed .fb-bg.fb-world-stack{position:relative;inset:auto;aspect-ratio:16/9;width:100%;max-height:none;}
  /* 三枚勋章：手机不再叠在图上横滑，改为图下方等宽三格（具体样式在 badge.css 手机块，最后加载才不会被盖） */
  .fullbleed .fb-inner{position:static;min-height:0;padding:0;}
  .wx-badge{left:10px;top:10px;bottom:auto;padding:4px 10px;font-size:11px;border-width:2px;}

  /* ---------- 神秘盲盒：卡片瘦身；稀有度 2×2 且压矮 ---------- */
  .card-grid{gap:14px;}
  .card{padding:10px 10px 12px;border-radius:18px;border-width:2.5px;}
  .card .badge-num{top:-11px;left:12px;font-size:12px;padding:2px 9px;border-width:2.5px;}
  .card .thumb{aspect-ratio:16/9;border-radius:13px;border-width:2.5px;}
  .card h3{font-size:16px;margin:10px 4px 3px;}
  .card p{font-size:12.5px;line-height:1.6;margin:0 4px;}
  .card .tag-row{margin-top:8px;gap:6px;}
  .mini-tag{font-size:10.5px;padding:2px 8px;}
  .openable .lid-note{top:8px;right:8px;font-size:11.5px;padding:4px 10px;border-width:2px;}
  .deal-toast{width:88%;padding:10px 12px;border-width:2.5px;}
  .deal-toast b{font-size:13.5px;}
  .deal-toast .worth{font-size:17px;}
  .rarity{grid-template-columns:1fr 1fr;gap:10px;margin-top:16px;}
  .rar{padding:11px 11px 12px;border-radius:14px;border-width:2.5px;}
  .rar .lv{font-size:15px;}
  .rar .cnt{font-size:11.5px;margin-top:2px;line-height:1.3;}
  .rar p{font-size:11.5px;line-height:1.55;margin-top:6px;
    display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;}

  /* ---------- 造镇经营：小镇图矮一点、可横滑；图鉴 3 列紧凑 ---------- */
  .town-stage{width:100vw;margin-left:calc(50% - 50vw);overflow-x:auto;overflow-y:hidden;
    -webkit-overflow-scrolling:touch;scrollbar-width:none;
    -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 20px,#000 calc(100% - 20px),transparent 100%);
    mask-image:linear-gradient(90deg,transparent 0,#000 20px,#000 calc(100% - 20px),transparent 100%);}
  .town-stage::-webkit-scrollbar{display:none;}
  .town-scroll{position:relative;width:150vw;min-width:560px;}
  .town-mapwrap{-webkit-mask-image:none;mask-image:none;}
  .town-hint{display:block;text-align:center;font-family:'Noto Sans SC';font-size:11.5px;opacity:.65;margin-top:6px;}
  .tcard{width:210px;padding:11px 13px;}
  .tcard h4{font-size:14.5px;}
  .tcard p{font-size:11.5px;}
  .sys-grid{grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px;}
  .sys{padding:10px 5px 9px;border-radius:14px;border-width:2.5px;}
  .sys b{font-size:12px;margin-top:5px;line-height:1.2;}
  .sys span{font-size:11px;margin-top:2px;line-height:1.3;}

  /* ---------- 悬赏创富：竖排，金币节点向下 ---------- */
  .path{grid-template-columns:1fr;gap:20px;margin-top:16px;}
  .pstep{padding:13px 14px 12px;border-radius:16px;border-width:2.5px;}
  .pstep h4{font-size:16px;}
  .pstep h4 .en{font-size:11px;}
  .pstep p{font-size:12.5px;line-height:1.6;margin-top:5px;}
  .pstep .coin-tag{font-size:12.5px;padding:3px 11px;margin-top:8px;}
  .pstep .arr{left:50%;right:auto;top:auto;bottom:-25px;width:28px;height:28px;transform:translateX(-50%);z-index:3;}
  .pstep .arr .ico{width:15px;height:15px;}

  /* ---------- 全国集市：时间轴改为紧凑「时间」胶囊，一屏 4 个 ---------- */
  .gallery{grid-template-columns:1fr;gap:10px;margin-top:14px;}
  .tl{flex-direction:row;overflow-x:auto;gap:6px;padding:2px 2px 6px;scrollbar-width:none;-webkit-overflow-scrolling:touch;
    -webkit-mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 30px),transparent 100%);
    mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 30px),transparent 100%);}
  .tl::-webkit-scrollbar{display:none;}
  .tl-item{flex:0 0 auto;padding:6px 10px 6px 6px;gap:6px;border-radius:999px;border-width:2px;box-shadow:0 3px 0 rgba(240,224,200,.8);}
  .tl-item.active{box-shadow:0 3px 0 rgba(92,61,46,.4);}
  .tl-item:hover{transform:none;}
  .tl-item .dot{width:26px;height:26px;border-width:2px;}
  .tl-item .dot .ico{width:14px;height:14px;}
  .tl-item b{font-size:12.5px;line-height:1;}
  .tl-item span{display:none;}           /* 手机只显示时间，说明进画布右上相位标签 */
  .canvas{border-width:2.5px;border-radius:16px;}
  .canvas .phase-tag{top:8px;right:8px;font-size:11px;padding:3px 10px;border-width:2px;}
  .canvas .hud-stat{left:8px;bottom:8px;padding:5px 10px;border-width:2px;border-radius:12px;}
  .canvas .hud-stat b{font-size:15px;}
  .canvas .hud-stat span{font-size:10.5px;}
  .rank-card{padding:18px 14px;border-radius:18px;border-width:3px;}
  .rank-title{font-size:16px;}
  .rank-sub{font-size:11px;}
  .rank-row{padding:9px 8px;gap:8px;margin-bottom:8px;}
  .rank-row .who b{font-size:13.5px;}
  .rank-row .who span{font-size:11px;}
  .rank-row .amt{font-size:14px;}
  .rank-foot{font-size:11px;}

  /* ---------- 预告片 ---------- */
  .trailer{border-width:2.5px;border-radius:16px;margin-top:12px;}
  .trailer .fsbtn{right:8px;bottom:52px;width:34px;height:34px;border-width:2px;}
  .trailer .fsbtn .ico{width:16px;height:16px;}

  /* ---------- 开镖计划：时间线 3×2；轮播改为常规相对定位单图 ---------- */
  .road{grid-template-columns:repeat(3,1fr);gap:14px 4px;margin-top:16px;}
  .rstep{padding:0 2px;}
  .rstep .moon{width:38px;height:38px;border-width:2.5px;}
  .rstep .moon .ico{width:19px;height:19px;}
  .rstep .m{font-size:11px;margin-top:6px;}
  .rstep b{font-size:12px;margin-top:2px;}
  .rstep span{font-size:11px;line-height:1.4;margin-top:3px;
    display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
  .carousel{height:auto;aspect-ratio:16/9;margin:12px auto 0;perspective:none;position:relative;overflow:hidden;border-radius:16px;}
  .cslide{position:absolute;inset:0;width:100%;left:0;top:0;transform:none;filter:none;
    transition:opacity .6s ease,transform .6s ease;}
  .cslide img{width:100%;height:100%;object-fit:cover;border-radius:16px;box-shadow:none;}
  .cslide.center{opacity:1;pointer-events:auto;transform:none;z-index:2;}
  .cslide.side-l1,.cslide.side-r1,.cslide.side-l2,.cslide.side-r2,.cslide.gone{opacity:0;pointer-events:none;transform:scale(1.03);z-index:1;}
  .cnav{width:34px;height:34px;top:50%;transform:translateY(-50%);border-width:2.5px;z-index:5;}
  .cnav:hover{transform:translateY(-50%);}
  .cnav .ico{width:18px;height:18px;}
  .cnav.prev{left:8px;}.cnav.next{right:8px;}
  .rstep.lit .moon{transform:translateY(-2px) scale(1.06);}

  /* ---------- 预约：小图 + 表单 ---------- */
  .reserve-wrap{grid-template-columns:1fr;gap:2px;margin-top:10px;}
  .reserve-img{display:block;width:150px;height:150px;object-fit:contain;margin:0 auto;
    -webkit-mask-image:radial-gradient(circle at 50% 50%,#000 45%,transparent 72%);
    mask-image:radial-gradient(circle at 50% 50%,#000 45%,transparent 72%);}
  .reserve-card{padding:16px 14px 14px;border-radius:18px;border-width:2.5px;}
  .reserve-card h3{font-size:17px;}
  .reserve-card .sub{font-size:12px;margin-top:5px;line-height:1.6;}
  .field{margin-top:11px;}
  .field label{font-size:12.5px;margin-bottom:5px;letter-spacing:.5px;}
  .field input,.field select{font-size:15px;padding:11px 12px;border-radius:13px;border-width:2.5px;}
  .btn-lg.reserve-btn{padding:12px 16px;font-size:15.5px;letter-spacing:.5px;margin-top:16px;border-width:2.5px;}
  .reserve-ok{padding:11px 12px;font-size:13px;margin-top:12px;border-width:2.5px;}
  .reserve-note{font-size:11px;margin-top:10px;line-height:1.6;}
}

/* ============ 小屏手机 ≤375（iPhone SE / mini / 老安卓） ============ */
@media (max-width:375px){
  .hero-logo{width:min(64vw,300px);}
  .hstat{padding:7px 4px;}
  .hstat b{font-size:18px;}
  .hstat span{font-size:10.5px;}
  .sec-title{font-size:20px;}
  .rar .lv{font-size:14px;}
  .rar p{-webkit-line-clamp:3;}
  .sys b{font-size:11.5px;}
  .sys span{font-size:10.5px;}
  .mnav a{min-width:58px;font-size:11px;padding:6px 6px;}
}

/* ============ 触屏设备：去掉依赖 hover 的效果 ============ */
@media (hover:none){
  .card:hover,.rar:hover,.hstat:hover,.sticker:hover,.sys:hover,.tl-item:hover,.rstep:hover .moon,.btn:hover,.abtn:hover{transform:none;}
  .card:hover .thumb img{transform:none;}
  .nav .links a:hover{transform:none;}
}