/* ── Popup Runtime ── */
/* popup = 全屏应用启动器 modal（不是卡片）。占满 #app-runtime，内部 flex column 撑高 */
/* §0.1 卡片规则不适用 popup（适用 signin / 抽奖 / VIP 等卡片类） */

.popup-overlay{
  position:absolute;inset:0;z-index:var(--z-popup);
  background:
    radial-gradient(ellipse 80% 50% at 15% 10%,rgba(40,60,120,0.08),transparent 70%),
    radial-gradient(ellipse 60% 40% at 85% 90%,rgba(80,40,100,0.06),transparent 70%),
    radial-gradient(circle at 50% 100%,rgba(60,40,80,0.05),transparent 50%),
    var(--L0);
  display:none;flex-direction:column;overflow:hidden;
}
.popup-overlay.open{display:flex;}

/* ── Carousel ── */
.popup-carousel{
  position:relative;
  margin: 14px 14px 4px;
  border-radius: 18px;
  height: 120px;             /* 150 → 120：降低 20%，主图利用率更高 */
  overflow: hidden;
  flex-shrink: 0;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.32),
              0 1px 0 rgba(255, 255, 255, 0.04) inset;
}
.popup-carousel-track{
  display:flex;height:100%;
  transition:transform 0.45s cubic-bezier(0.25,0.46,0.45,0.94);
}
.popup-slide{
  /* 容器：尺寸 + 圆角 + click，媒体展示由 V2Media 接管（.v2-media-runtime） */
  flex-shrink:0;width:100%;height:100%;
  position:relative;overflow:hidden;
  background:#000;cursor:pointer;
}

.popup-carousel-dots{
  position: absolute;
  bottom: 8px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 5px;
  z-index: 4;
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.32);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
.popup-dot{
  width: 5px;
  height: 5px;
  border-radius: 99px;
  background: rgba(255, 255, 255, 0.45);
  transition: width 0.3s ease, background 0.3s ease;
}
.popup-dot.active{
  width: 16px;
  background: #fff;
}

/* ── Content box ── */
/* popup 全屏 modal，popup-box flex:1 撑满 popup-overlay 高度 */
.popup-box{
  position:relative;
  width:100%;flex:1;
  display:flex;flex-direction:column;overflow:hidden;
}

/* ── Section header ── */
.popup-header{
  display:flex;align-items:center;gap:10px;
  padding:10px 18px 6px;flex-shrink:0;
}
.popup-header-line{
  flex:1;height:1px;
  background:linear-gradient(to right,rgba(212,168,67,0.5),transparent);
}
.popup-header-line:last-child{
  background:linear-gradient(to left,rgba(212,168,67,0.5),transparent);
}
.popup-header-title{
  font-size:13px;font-weight:700;letter-spacing:1.5px;
  white-space:nowrap;
  background:linear-gradient(90deg,#d4a843,#f5d27a,#d4a843);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
  background-clip:text;
}

/* ── App Grid ── */
/* popup 是全屏 modal，grid-wrap 撑满剩余空间（carousel/header/close 之外）*/
.popup-grid-wrap{
  flex:1;min-height:0;overflow:hidden;
}
.popup-grid{
  display:grid;grid-template-columns:repeat(4,1fr);
  grid-auto-flow:dense;
  gap:4px;padding:0 8px 8px;
  height:100%;overflow-y:auto;-webkit-overflow-scrolling:touch;
  scrollbar-width:none;align-content:start;
}
.popup-grid::-webkit-scrollbar{display:none;}

.popup-item{
  display:flex;flex-direction:column;align-items:center;
  cursor:pointer;padding:0 0 2px;
  -webkit-tap-highlight-color:transparent;
  border-radius:var(--r16);
}
.popup-item:active{transform:scale(0.93);}

.popup-ico{
  width:92%;padding-bottom:92%;height:0;
  border-radius:var(--r16);overflow:hidden;
  position:relative;display:block;
  box-shadow:0 4px 12px rgba(0,0,0,0.35);
  margin:0 auto;background:var(--L2);
}
.popup-ico img{
  position:absolute;top:0;left:0;
  width:100%;height:100%;object-fit:cover;
}

.popup-item.large{grid-column:span 2;grid-row:span 2;}
.popup-item.large .popup-ico{
  width:100%;padding-bottom:100%;
  border-radius:var(--r24);
}

.popup-name{
  font-size:11px;line-height:14px;height:14px;
  color:var(--t1);font-weight:500;letter-spacing:0.2px;
  margin-top:3px;text-align:center;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  width:100%;
}

/* ── Match flame close: "滑动立即观影" ── */
/* popup 全屏 modal，close-row 用 margin-top:auto 撑到底（这是 flex column 内底部固定的模式）*/
.popup-close-row{
  flex-shrink: 0;
  margin-top: auto;
  padding: 10px 20px calc(16px + env(safe-area-inset-bottom, 0px));
  display: flex;
  justify-content: center;
  -webkit-user-select: none;
  user-select: none;
}
.popup-match-stage{
  position: relative;
  width: 100%;
  max-width: 280px;            /* 300 → 280：略收紧 */
  height: 44px;                /* 56 → 44：降低 21% */
  touch-action: none;
  cursor: grab;
  overflow: visible;
}
.popup-match-stage:active{ cursor: grabbing; }

.popup-cat-handle{
  position: absolute;
  top: 50%;
  left: 0;
  width: 36px;
  height: 36px;
  margin-top: -18px;
  display: block;
  pointer-events: none;             /* drag 由 stage 接收 */
  user-select: none;
  -webkit-user-drag: none;
  -webkit-touch-callout: none;
  will-change: transform;
  filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.45));
}

.popup-match-chars{
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.popup-match-chars span{
  font-size: 14px;             /* 13 → 14：更易读 */
  font-weight: 400;            /* 300 → 400：更清晰 */
  letter-spacing: 2.5px;       /* 4.5 → 2.5：紧凑专业 */
  color: rgba(255, 250, 245, 0.32);  /* 0.10 → 0.32：看得见但不抢戏 */
  display: inline-block;
  font-family: var(--font);
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
}