/* ============================================================
   PUBG选号平台 · UI 现代化覆盖样式  optimize-ui.css
   仅覆盖视觉表现，不改结构与功能；删除本文件引用即可回滚
   ============================================================ */

:root{
  --bg-0:#0a0916;
  --bg-1:#100e20;
  --panel:#17152f;
  --panel-2:#1d1a3a;
  --card:#1e1b3c;
  --card-hi:#252149;
  --line:rgba(255,255,255,.07);
  --line-strong:rgba(255,255,255,.12);
  --text:#ece9fb;
  --text-2:#c6c2e4;
  --muted:#948fb8;
  --accent:#ff7a1a;
  --accent-lt:#ff9d45;
  --accent-dk:#e85d00;
  --gold:#ffc53d;
  --accent-soft:rgba(255,122,26,.13);
  --r-card:14px;
  --r-panel:16px;
  --r-pill:999px;
}

/* ---------- 全局基底 ---------- */
uni-page-body, .home-page{
  background:
    radial-gradient(900px 420px at 50% -8%, rgba(255,122,26,.10), transparent 60%),
    radial-gradient(700px 500px at 85% 0%, rgba(110,80,220,.14), transparent 60%),
    linear-gradient(180deg,#121026 0%, #0c0a1a 100%) !important;
  color:var(--text);
}
body{ background:#0c0a1a; }

::selection{ background:rgba(255,122,26,.35); color:#fff; }

/* 滚动条 */
::-webkit-scrollbar{ width:10px; height:10px; }
::-webkit-scrollbar-thumb{ background:rgba(255,255,255,.12); border-radius:99px; border:2px solid transparent; background-clip:content-box; }
::-webkit-scrollbar-thumb:hover{ background:rgba(255,122,26,.4); background-clip:content-box; }
::-webkit-scrollbar-track{ background:transparent; }

/* ---------- 布局容器 ---------- */
.goodsbigBox{ max-width:1320px; margin:0 auto; padding:0 20px; box-sizing:border-box; }

/* ---------- 顶部导航 ---------- */
.headerBox{
  position:sticky; top:0; z-index:100;
  background:rgba(13,11,28,.82);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
}
.header{ height:64px; display:flex; align-items:center; justify-content:center; }
.header_menu{ display:flex; align-items:center; gap:6px; }
.header_menu_item{
  padding:9px 18px; border-radius:10px;
  color:var(--text-2); font-size:15px; font-weight:600; letter-spacing:.5px;
  cursor:pointer; transition:all .25s ease; white-space:nowrap;
}
.header_menu_item:hover{ color:#fff; background:rgba(255,255,255,.07); }
.header_menu_item.header_menu_itemSel{
  color:var(--accent-lt);
  background:var(--accent-soft);
  box-shadow:inset 0 0 0 1px rgba(255,122,26,.28);
}

/* ---------- 筛选面板 ---------- */
.middle_box{
  margin:22px 0 6px; padding:20px 22px 16px;
  background:linear-gradient(180deg,var(--panel-2),var(--panel));
  border:1px solid var(--line); border-radius:var(--r-panel);
  box-shadow:0 14px 40px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.04);
}
.middle_center_item{
  display:flex; align-items:flex-start; gap:14px;
  padding:11px 0; border-bottom:1px dashed rgba(255,255,255,.06) !important;
}
.middle_center_item:last-child{ border-bottom:none !important; }
/* 移动端筛选行同样去掉原站黄色虚线 */
.middle_center_itemh5{ border-bottom:1px dashed rgba(255,255,255,.06) !important; }
.middle_center_item_name{
  flex:0 0 84px; width:84px; padding-top:7px;
  color:var(--muted); font-size:13px; font-weight:600; text-align:right; white-space:nowrap;
}
.middle_center_item_right{ flex:1; display:flex; flex-wrap:wrap; gap:9px; align-items:center; }
.middle_center_item_right_item{
  padding:6px 15px; border-radius:var(--r-pill);
  background:rgba(255,255,255,.05); border:1px solid transparent;
  color:var(--text-2); font-size:13px; line-height:1.4;
  cursor:pointer; transition:all .2s ease; user-select:none;
}
.middle_center_item_right_item:hover{
  color:var(--accent-lt); background:var(--accent-soft);
  border-color:rgba(255,122,26,.35); transform:translateY(-1px);
}
.middle_center_item_right_item.middle_center_item_right_itemSel{
  color:#fff; border-color:transparent;
  background:linear-gradient(135deg,var(--accent-lt),var(--accent-dk));
  box-shadow:0 5px 14px rgba(232,93,0,.38), inset 0 1px 0 rgba(255,255,255,.22);
}

/* 输入框 */
.middle .el-input__inner{
  height:34px; line-height:34px; border-radius:8px;
  background:rgba(0,0,0,.28); border:1px solid var(--line-strong);
  color:var(--text); font-size:13px; padding:0 12px; transition:all .2s;
}
.middle .el-input__inner::placeholder{ color:#6f6a92; }
.middle .el-input__inner:focus{ border-color:var(--accent); box-shadow:0 0 0 3px rgba(255,122,26,.15); outline:none; }

/* 按钮 */
.middle .el-button{
  height:34px; padding:0 18px; border-radius:8px; font-size:13px; font-weight:600;
  transition:all .2s ease;
}
.middle .el-button--primary{
  background:linear-gradient(135deg,var(--accent-lt),var(--accent-dk));
  border-color:transparent; color:#fff;
  box-shadow:0 6px 16px rgba(232,93,0,.35);
}
.middle .el-button--primary:hover{ filter:brightness(1.08); transform:translateY(-1px); }
.middle .el-button--default{
  background:rgba(255,255,255,.06); border:1px solid var(--line-strong); color:var(--text-2);
}
.middle .el-button--default:hover{ color:var(--accent-lt); border-color:rgba(255,122,26,.4); background:var(--accent-soft); }
/* 展开按钮做成轻量描边按钮 */
.middle .middle_center_item_rightInp .el-button{
  background:transparent; border:1px solid var(--line-strong); color:var(--muted);
  height:30px; padding:0 14px; border-radius:8px;
}
.middle .middle_center_item_rightInp .el-button:hover{ color:var(--accent-lt); border-color:rgba(255,122,26,.4); }

/* ---------- 商品网格 ---------- */
.goodsBox{ margin-top:14px; }
.goods.goodsWeb{
  display:grid !important;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr)) !important;
  gap:20px !important;
}
.goods_item{
  width:100% !important; margin:0 !important;
  position:relative; display:flex; flex-direction:column;
  background:linear-gradient(180deg,var(--card-hi),var(--card));
  border:1px solid var(--line); border-radius:var(--r-card);
  overflow:hidden; transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.goods_item:hover{
  border-color:rgba(255,122,26,.45);
  box-shadow:0 14px 34px rgba(0,0,0,.45);
}
.goods_item_imgBox{
  position:relative; aspect-ratio:16/9; overflow:hidden;
  background:#0d0b1d;
}
.goods_item_img{
  width:100%; height:100%; object-fit:cover; display:block;
}
.goods_item_bpIcon{
  position:absolute; left:10px; bottom:10px; z-index:2;
  height:22px; width:auto;
  filter:drop-shadow(0 3px 6px rgba(0,0,0,.6));
}
.goods_item_name{
  padding:12px 14px 6px; margin:0;
  color:var(--text-2); font-size:13px; line-height:1.55; font-weight:500;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.goods_item_footer{
  margin-top:auto; padding:8px 14px 14px;
  display:flex; align-items:center; justify-content:space-between; gap:10px;
}
.goods_item_price{
  color:var(--accent-lt); font-size:19px; font-weight:800; letter-spacing:.4px;
  text-shadow:0 2px 10px rgba(255,122,26,.3);
}
.goods_item_footer_shuxing{
  flex-shrink:0; padding:4px 11px; border-radius:var(--r-pill);
  background:linear-gradient(135deg,#ffd868,#f2a91f);
  color:#412a02; font-size:11px; font-weight:700;
  box-shadow:0 3px 8px rgba(242,169,31,.3);
}

/* hover 查看详情（沿用原站 display 切换，仅去掉遮罩、美化按钮） */
.goods_item_fix{ background:transparent !important; }
.goods_item:hover .goods_item_fix{ display:block !important; }
.goods_item_fix_title{
  width:auto !important; height:auto !important;
  position:absolute !important; top:50% !important; left:50% !important;
  transform:translate(-50%,-50%) !important;
  padding:9px 22px; border-radius:var(--r-pill); white-space:nowrap;
  background:linear-gradient(135deg,var(--accent-lt),var(--accent-dk));
  color:#fff !important; font-size:13px !important; font-weight:700 !important;
  letter-spacing:1px; text-align:center;
  box-shadow:0 10px 24px rgba(232,93,0,.45), inset 0 1px 0 rgba(255,255,255,.25);
}

/* ---------- 分页 ---------- */
.webpaginationBox{ margin:34px 0 20px; display:flex; justify-content:center; }
.webpagination.el-pagination{
  padding:8px; border-radius:12px;
  background:rgba(255,255,255,.04); border:1px solid var(--line);
  font-weight:600;
}
.webpagination .el-pagination__total{ color:var(--muted); font-size:13px; margin-right:8px; }
.webpagination .btn-prev, .webpagination .btn-next,
.webpagination .el-pager li{
  min-width:34px; height:34px; line-height:34px; margin:0 3px;
  border-radius:8px; background:rgba(255,255,255,.05);
  color:var(--text-2); font-size:13px; font-weight:600;
  transition:all .2s ease;
}
.webpagination .btn-prev, .webpagination .btn-next{ padding:0 12px; }
.webpagination .btn-prev:hover, .webpagination .btn-next:hover,
.webpagination .el-pager li:hover{ color:var(--accent-lt); background:var(--accent-soft); }
.webpagination .el-pager li.number.active{
  background:linear-gradient(135deg,var(--accent-lt),var(--accent-dk));
  color:#fff; box-shadow:0 5px 14px rgba(232,93,0,.4);
}
.webpagination .el-pager li.more{ background:transparent; }

/* ---------- 移动端适配 ---------- */
@media (max-width: 900px){
  .goods.goodsWeb{ grid-template-columns:repeat(auto-fill,minmax(180px,1fr)) !important; gap:14px !important; }
}
@media (max-width: 768px){
  .goodsbigBox{ padding:0 12px; }
  .header{ height:54px; }
  .header_menu{ gap:2px; width:100%; justify-content:flex-start; padding:0 6px; overflow-x:auto; }
  .header_menu_item{ padding:7px 14px; font-size:14px; }
  .middle_box{ padding:14px 14px 10px; margin:14px 0 4px; border-radius:14px; }
  .middle_center_item{ gap:10px; padding:9px 0; }
  .middle_center_item_name{ flex-basis:68px; width:68px; font-size:12px; padding-top:6px; }
  .middle_center_item_right{ gap:7px; }
  .middle_center_item_right_item{ padding:5px 11px; font-size:12px; }
  .goods.goodsWeb{ grid-template-columns:repeat(auto-fill,minmax(150px,1fr)) !important; gap:12px !important; }
  .goods_item_name{ font-size:12px; padding:10px 10px 4px; }
  .goods_item_footer{ padding:6px 10px 10px; }
  .goods_item_price{ font-size:16px; }
  .goods_item_footer_shuxing{ font-size:10px; padding:3px 8px; }
  .goods_item_bpIcon{ height:18px; }
  .webpaginationBox{ margin:22px 0 14px; }
}
@media (max-width: 420px){
  .goods.goodsWeb{ grid-template-columns:repeat(2,1fr) !important; }
  .middle_center_item_name{ flex-basis:60px; width:60px; }
}

/* ============================================================
   首页落地页（app-enhance 注入）
   ============================================================ */
#enhance-home{ display:none; width:100%; box-sizing:border-box; }
body.eh-landing #enhance-home{ display:block; }
body.eh-landing .middle_box,
body.eh-landing .goodsBox{ display:none !important; }
/* 移动端筛选区块（含始终渲染的无冒号行）落地页隐藏 */
body.eh-landing .h5_middle_boxShow,
body.eh-landing .h5_middle_boxFix{ display:none !important; }
/* uni-app 框架容器默认撑满视口，落地页改为内容自然高度 */
body.eh-landing #app,
body.eh-landing uni-app,
body.eh-landing uni-page,
body.eh-landing uni-page-wrapper,
body.eh-landing uni-page-body{ min-height:0 !important; height:auto !important; }
body.eh-landing .home-page > .footer{ display:none !important; }

/* Hero */
.eh-hero{
  position:relative; max-width:1200px; margin:26px auto 8px; box-sizing:border-box;
  padding:62px 56px 52px; border-radius:22px; overflow:hidden;
  background:
    radial-gradient(720px 320px at 88% -25%, rgba(255,122,26,.30), transparent 62%),
    radial-gradient(620px 420px at -5% 115%, rgba(110,80,220,.32), transparent 62%),
    linear-gradient(160deg,#221e46,#14112c 72%);
  border:1px solid var(--line-strong);
  box-shadow:0 24px 60px rgba(0,0,0,.5);
}
.eh-hero::before{
  content:""; position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:38px 38px;
  -webkit-mask-image:radial-gradient(72% 92% at 28% 18%,#000,transparent);
  mask-image:radial-gradient(72% 92% at 28% 18%,#000,transparent);
}
.eh-hero-badge{
  position:relative; display:inline-flex; align-items:center; gap:8px;
  padding:6px 14px; border-radius:999px;
  background:rgba(255,122,26,.14); border:1px solid rgba(255,122,26,.35);
  color:var(--accent-lt); font-size:12px; font-weight:700; letter-spacing:1px;
}
.eh-hero-title{
  position:relative; margin:20px 0 12px;
  font-size:44px; line-height:1.22; font-weight:900; color:#fff; letter-spacing:1px;
}
.eh-sub{ position:relative; color:var(--text-2); font-size:16px; margin:0 0 30px; }
.eh-hero-actions{ position:relative; display:flex; gap:14px; flex-wrap:wrap; }
.eh-btn{
  height:46px; padding:0 30px; border-radius:12px;
  font-size:15px; font-weight:700; cursor:pointer;
  transition:all .25s ease; border:1px solid transparent;
}
.eh-btn-primary{
  background:linear-gradient(135deg,var(--accent-lt),var(--accent-dk));
  color:#fff; box-shadow:0 12px 26px rgba(232,93,0,.4);
}
.eh-btn-primary:hover{ transform:translateY(-2px); filter:brightness(1.08); }
.eh-btn-ghost{ background:rgba(255,255,255,.05); border-color:var(--line-strong); color:var(--text); }
.eh-btn-ghost:hover{ border-color:rgba(255,122,26,.5); color:var(--accent-lt); }
.eh-chips{ position:relative; display:flex; gap:10px; flex-wrap:wrap; margin-top:26px; }
.eh-chips span{
  padding:5px 13px; border-radius:999px; font-size:12px;
  color:var(--muted); background:rgba(255,255,255,.05); border:1px solid var(--line);
}

/* 区块标题 */
.eh-section{ max-width:1200px; margin:38px auto 0; box-sizing:border-box; }
.eh-sec-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; }
.eh-sec-title{
  display:flex; align-items:center; gap:10px;
  font-size:21px; font-weight:800; color:#fff; letter-spacing:.5px;
}
.eh-sec-title::before{
  content:""; width:5px; height:22px; border-radius:3px;
  background:linear-gradient(180deg,var(--accent-lt),var(--accent-dk));
}
.eh-more{ font-size:13px; color:var(--accent-lt); cursor:pointer; font-weight:600; }
.eh-more:hover{ color:#fff; }

/* 今日热门 */
.eh-hot-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:18px; }
.eh-hot-card{
  display:flex; flex-direction:column;
  background:linear-gradient(180deg,var(--card-hi),var(--card));
  border:1px solid var(--line); border-radius:14px; overflow:hidden;
  cursor:pointer; transition:all .28s ease;
}
.eh-hot-card:hover{
  transform:translateY(-5px); border-color:rgba(255,122,26,.5);
  box-shadow:0 18px 38px rgba(0,0,0,.5);
}
.eh-hot-imgbox{ position:relative; aspect-ratio:16/9; background:#0d0b1d; overflow:hidden; }
.eh-hot-imgbox img{ width:100%; height:100%; object-fit:cover; display:block; }
.eh-hot-bp{
  position:absolute; left:8px; bottom:8px; padding:3px 9px; border-radius:999px;
  background:rgba(10,8,20,.7); color:#ffd868; font-size:10px; font-weight:700;
  backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px);
}
.eh-hot-name{
  padding:10px 12px 6px; font-size:12.5px; line-height:1.5; color:var(--text-2);
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  min-height:45px;
}
.eh-hot-foot{
  margin-top:auto; padding:6px 12px 12px;
  display:flex; align-items:center; justify-content:space-between;
}
.eh-hot-price{ color:var(--accent-lt); font-size:16px; font-weight:800; }
.eh-hot-tag{
  padding:2px 9px; border-radius:999px;
  background:linear-gradient(135deg,#ffd868,#f2a91f);
  color:#412a02; font-size:10px; font-weight:700;
}

/* 最新公告 */
.eh-news-list{
  background:linear-gradient(180deg,var(--panel-2),var(--panel));
  border:1px solid var(--line); border-radius:16px; padding:6px 18px;
}
.eh-news-item{
  display:flex; align-items:center; gap:12px;
  padding:14px 4px; cursor:pointer; border-bottom:1px solid var(--line);
}
.eh-news-item:last-child{ border-bottom:none; }
.eh-news-item:hover .eh-news-title{ color:var(--accent-lt); }
.eh-news-dot{
  width:8px; height:8px; border-radius:50%; flex:none;
  background:var(--accent); box-shadow:0 0 10px rgba(255,122,26,.7);
}
.eh-news-title{ flex:1; font-size:14px; color:var(--text); font-weight:600; transition:color .2s; }
.eh-news-date{ font-size:12px; color:var(--muted); white-space:nowrap; }

.eh-footer{
  max-width:1200px; margin:44px auto 30px;
  text-align:center; color:var(--muted); font-size:12px; line-height:2;
}

/* 公告弹窗 */
#eh-modal{
  position:fixed; inset:0; z-index:9999; display:none;
  align-items:center; justify-content:center; padding:20px;
  background:rgba(5,4,12,.72);
  backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
}
#eh-modal.eh-show{ display:flex; }
.eh-modal-box{
  width:100%; max-width:720px; max-height:84vh;
  display:flex; flex-direction:column;
  background:#191633; border:1px solid var(--line-strong);
  border-radius:16px; overflow:hidden;
}
.eh-modal-head{
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 20px; border-bottom:1px solid var(--line);
}
#eh-modal-title{ font-size:16px; font-weight:800; color:#fff; }
#eh-modal-close{
  width:32px; height:32px; border-radius:8px;
  background:rgba(255,255,255,.07); border:none;
  color:#fff; font-size:18px; cursor:pointer; line-height:1;
}
#eh-modal-close:hover{ background:rgba(255,122,26,.4); }
.eh-modal-body{ padding:20px; overflow-y:auto; color:var(--text-2); font-size:14px; line-height:1.8; }
.eh-modal-body img{ max-width:100%; height:auto; border-radius:8px; }

/* 落地页响应式 */
@media (max-width:1000px){
  .eh-hot-grid{ grid-template-columns:repeat(3,1fr); }
}
@media (max-width:768px){
  .eh-hero{ padding:40px 24px 34px; margin-top:16px; }
  .eh-hero-title{ font-size:30px; }
  .eh-sub{ font-size:14px; margin-bottom:24px; }
  .eh-btn{ height:42px; padding:0 22px; font-size:14px; }
  .eh-hot-grid{ grid-template-columns:repeat(2,1fr); gap:12px; }
  .eh-section{ margin-top:28px; }
  .eh-sec-title{ font-size:18px; }
}