/* 台风应急救援服务查询 - 样式 */
*{margin:0;padding:0;box-sizing:border-box}

/* 日间模式（默认） */
:root{
  --bg:#f0f4f8;
  --card:#fff;
  --t:#2c3e50;
  --t2:#7f8c8d;
  --p:#1a5276;
  --pl:#2980b9;
  --ac:#e74c3c;
  --ok:#27ae60;
  --bd:#e0e6ed;
  --sh:0 2px 12px rgba(0,0,0,.08);
  --hd-bg:linear-gradient(135deg,#1a5276,#2980b9);
  --loc-bg:linear-gradient(135deg,#eaf2f8,#d4e6f1);
  --weather-bg:linear-gradient(135deg,#fff9e6,#fff3cd)
}

/* 夜间模式 */
[data-theme="dark"]{
  --bg:#1a1a2e;
  --card:#16213e;
  --t:#eaeaea;
  --t2:#a0a0a0;
  --p:#4da6ff;
  --pl:#66b3ff;
  --ac:#ff6b6b;
  --ok:#2ecc71;
  --bd:#2a3f5f;
  --sh:0 2px 12px rgba(0,0,0,.3);
  --hd-bg:linear-gradient(135deg,#0f0f23,#1a1a3e);
  --loc-bg:linear-gradient(135deg,#1e3a5f,#152238);
  --weather-bg:linear-gradient(135deg,#2d3748,#1a202c)
}

html{font-size:14px;-webkit-text-size-adjust:100%}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  background:var(--bg);
  color:var(--t);
  min-height:100vh;
  padding-bottom:60px;
  transition:background .3s,color .3s
}

/* 顶部导航 */
.hd{
  background:var(--hd-bg);
  color:#fff;
  padding:14px 14px 10px;
  position:sticky;
  top:0;
  z-index:100;
  box-shadow:0 2px 8px rgba(0,0,0,.15)
}
.hd h1{
  font-size:1.15rem;
  font-weight:700;
  margin-bottom:8px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:5px
}
.theme-btn{
  background:rgba(255,255,255,.2);
  border:none;
  /* border-radius:8px;
  padding:6px 10px;
  color:#fff; */
  font-size:1rem;
  cursor:pointer;
  transition:.2s
}
.theme-btn:active{transform:scale(.95)}
.sb{display:flex;gap:6px}
.sb input{
  flex:1;
  height:36px;
  border:none;
  border-radius:8px;
  padding:0 12px;
  font-size:.9rem;
  background:rgba(255,255,255,.92);
  color:var(--t);
  outline:none
}
[data-theme="dark"] .sb input{background:#2d3748;color:#eaeaea}
.sb input::placeholder{color:#95a5a6}
.sb .xb{
  width:36px;
  height:36px;
  border:none;
  border-radius:8px;
  background:rgba(255,255,255,.2);
  color:#fff;
  font-size:1rem;
  cursor:pointer;
  display:none;
  align-items:center;
  justify-content:center
}
.sb .xb.show{display:flex}

/* 分类标签 */
.tb{
  display:flex;
  background:var(--card);
  border-bottom:1px solid var(--bd);
  position:sticky;
  top:64px;
  z-index:99
}
.tb div{
  flex:1;
  text-align:center;
  padding:11px 0;
  font-size:.9rem;
  font-weight:600;
  color:var(--t2);
  cursor:pointer;
  border-bottom:3px solid transparent;
  transition:.2s
}
.tb div.on{
  color:var(--p);
  border-bottom-color:var(--p)
}

/* 定位栏 */
.lb{
  margin:10px 10px 0;
  padding:10px 12px;
  background:var(--loc-bg);
  border-radius:10px;
  display:none;
  align-items:center;
  gap:8px;
  font-size:.85rem
}
.lb .li{font-size:1.2rem}
.lb .lt{flex:1}
.lb .lc{font-weight:700;color:var(--p)}
.lb .lh{color:var(--t2);font-size:.75rem;margin-top:1px}
.lb .lr{
  font-size:.75rem;
  color:var(--pl);
  cursor:pointer;
  text-decoration:underline
}

/* 天气栏 */
.weather{
  margin:0 10px 10px;
  padding:10px 12px;
  background:var(--weather-bg);
  border-radius:10px;
  display:none;
  align-items:center;
  justify-content:space-between;
  font-size:.85rem
}
.weather .w-left{display:flex;align-items:center;gap:8px}
.weather .w-icon{font-size:1.8rem}
.weather .w-temp{font-size:1.5rem;font-weight:700;color:#e67e22}
[data-theme="dark"] .weather .w-temp{color:#ffa500}
.weather .w-right{text-align:right}
.weather .w-desc{display:block;font-weight:600;color:#d68910}
[data-theme="dark"] .weather .w-desc{color:#ffa500}
.weather .w-detail{display:block;font-size:.75rem;color:#b7950b;margin-top:2px}
[data-theme="dark"] .weather .w-detail{color:#a0a0a0}

/* 推荐区块 */
.rs{
  margin:10px;
  background:var(--card);
  border-radius:12px;
  box-shadow:var(--sh);
  overflow:hidden;
  display:none
}
.rh{
  padding:10px 12px 6px;
  font-size:.9rem;
  font-weight:700;
  color:var(--p);
  display:flex;
  align-items:center;
  gap:5px
}
.rh .bg{
  background:var(--ac);
  color:#fff;
  font-size:.65rem;
  padding:2px 7px;
  border-radius:10px;
  font-weight:600
}
.rl{
  padding:0 0 10px;
  display:flex;
  gap:10px;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  padding-left:12px;
  padding-right:12px
}
.rl::-webkit-scrollbar{display:none}
.ri{
  flex:0 0 85%;
  min-width:260px;
  padding:10px 12px;
  border-radius:8px;
  background:var(--bg);
  border:1px solid var(--bd);
  scroll-snap-align:start;
  display:flex;
  flex-direction:column;
  gap:6px
}
.ri .ri-top{display:flex;align-items:center;gap:8px}
.ri .rk{
  width:24px;
  height:24px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:.75rem;
  font-weight:700;
  flex-shrink:0
}
.ri .r1{background:#e74c3c;color:#fff}
.ri .r2{background:#f39c12;color:#fff}
.ri .r3{background:#27ae60;color:#fff}
.ri .rn{background:#bdc3c7;color:#fff}
.ri .nm{
  font-weight:600;
  font-size:.9rem;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  flex:1
}
.ri .ad{font-size:.8rem;color:var(--t2);display:flex;align-items:center;gap:3px}
.ri .cb{
  width:100%;
  height:36px;
  border:none;
  border-radius:6px;
  background:var(--ok);
  color:#fff;
  font-size:.85rem;
  font-weight:600;
  cursor:pointer
}
.rl-hint{
  text-align:center;
  font-size:.75rem;
  color:var(--t2);
  padding:0 0 8px
}

/* 区块标题 */
.st{
  padding:14px 10px 6px;
  font-size:.85rem;
  font-weight:700;
  color:var(--t2);
  display:flex;
  align-items:center;
  gap:5px
}

/* 地市卡片网格 - APP端3列 */
.cg{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:8px;
  padding:0 10px 10px
}
.cc{
  background:var(--card);
  border-radius:10px;
  padding:12px 8px;
  text-align:center;
  box-shadow:var(--sh);
  cursor:pointer;
  transition:.2s;
  border:2px solid transparent
}
.cc:active{transform:scale(.96)}
.cc.on{
  border-color:var(--p);
  background:var(--loc-bg)
}
.cc .cn{font-size:.85rem;font-weight:700;margin-bottom:4px}
.cc .ct{font-size:1.4rem;font-weight:800;color:var(--p)}
.cc .cl{font-size:.65rem;color:var(--t2);margin-top:1px}
.cc .cb2{
  height:3px;
  border-radius:2px;
  background:var(--bd);
  margin-top:6px;
  overflow:hidden
}
.cc .cb2 div{
  height:100%;
  border-radius:2px;
  background:linear-gradient(90deg,#2980b9,#1a5276)
}

/* 队伍列表 */
.tl{padding:0 10px 10px}
.ti{
  background:var(--card);
  border-radius:10px;
  padding:10px 12px;
  margin-bottom:6px;
  box-shadow:var(--sh)
}
.tt{display:flex;align-items:flex-start;justify-content:space-between;gap:6px}
.tt .tn{font-weight:700;font-size:.85rem;flex:1}
.tt .tp{font-weight:700;color:var(--ac);font-size:.8rem;white-space:nowrap}
.tt .tp a{color:inherit;text-decoration:none}
.tm{display:flex;gap:10px;margin-top:4px;font-size:.75rem;color:var(--t2)}
.tm span{display:flex;align-items:center;gap:2px}
.tp2{
  margin-top:6px;
  width:100%;
  height:34px;
  border:none;
  border-radius:6px;
  background:var(--ok);
  color:#fff;
  font-size:.8rem;
  font-weight:600;
  cursor:pointer
}

/* 空状态 */
.em{text-align:center;padding:40px 20px;color:var(--t2)}
.em .ei{font-size:3rem;margin-bottom:10px}
.em p{font-size:.85rem}

/* 底部统计栏 */
.tb2{
  position:fixed;
  bottom:0;
  left:0;
  right:0;
  background:var(--card);
  border-top:1px solid var(--bd);
  padding:8px 14px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:.8rem;
  color:var(--t2);
  z-index:100
}
.tb2 .tn2{font-weight:800;color:var(--p);font-size:1rem}

/* 隐藏滚动条 */
::-webkit-scrollbar{width:0;height:0}

/* PC端响应式优化 */
@media(min-width:769px){
  html{font-size:16px}
  body{padding-bottom:70px}
  
  /* 顶部导航 */
  .hd{padding:16px 20px 12px}
  .hd h1{font-size:1.25rem}
  .sb input{height:40px;font-size:1rem}
  .sb .xb{width:40px;height:40px}
  
  /* 分类标签 */
  .tb{top:72px}
  .tb div{font-size:.95rem;padding:12px 0}
  
  /* 定位和天气 */
  .lb,.weather{
    max-width:800px;
    margin-left:auto;
    margin-right:auto;
    padding:12px 16px
  }
  
  /* 推荐区块 - PC端显示3个卡片 */
  .rs{
    max-width:800px;
    margin:12px auto;
    padding:0 0 12px
  }
  .rh{padding:12px 16px 8px;font-size:.95rem}
  .rl{
    padding:0 16px 0;
    gap:12px;
    flex-wrap:wrap;
    justify-content:center
  }
  .ri{
    flex:0 0 calc(33.33% - 8px);
    min-width:200px;
    transition:transform .2s,box-shadow .2s
  }
  .ri:hover{
    transform:translateY(-2px);
    box-shadow:0 4px 16px rgba(0,0,0,.12)
  }
  .ri:hover .cb{background:#2ecc71}
  .rl-hint{display:none}
  
  /* 地市卡片 - PC端5列 */
  .cg{
    grid-template-columns:repeat(5,1fr);
    max-width:800px;
    margin:0 auto;
    gap:10px;
    padding:0
  }
  .cc{padding:14px 10px;transition:transform .2s,box-shadow .2s}
  .cc:hover{
    transform:translateY(-2px);
    box-shadow:0 4px 16px rgba(0,0,0,.12)
  }
  .cc .cn{font-size:.9rem}
  .cc .ct{font-size:1.5rem}
  
  /* 队伍列表 */
  .st{max-width:800px;margin:0 auto;padding:16px 0 8px}
  .tl{max-width:800px;margin:0 auto;padding:0 0 12px}
  .ti{
    padding:12px 16px;
    margin-bottom:8px;
    transition:box-shadow .2s
  }
  .ti:hover{box-shadow:0 4px 16px rgba(0,0,0,.1)}
  
  /* 底部统计栏 */
  .tb2{justify-content:center;gap:40px}
}


.pt2{
    margin: 10px 10px 0;
    /* padding: 10px 12px; */
    /* background: var(--loc-bg); */
    /* border-radius: 10px; */
    display: none;
    align-items: center;
    gap: 8px;
    font-size: .85rem;
    color: #666;

}
.tiplist{
    width: 100%;
    height: 75px;
    padding: 10px 0;
    background: #fff;
    padding: 10px 12px;
    background: var(--loc-bg);
    border-radius: 10px;
    display: flex;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: flex-start;
    position: relative;
    background: #fff;
    margin: 0 auto 10px;
}
.tiplist img{
    width: 100px;
    height: 55px;
}
.tiplist p{
width: 233px;
    top: 50%;
    position: absolute;
    transform: translate(0, -50%);
    /* height: 100%; */
    left: 126px;
    color: #666;
}
.logobox{
      height: 30px;
    line-height: 28px;
}
.logo{
    background-image: url(../images/logo1.png);
    background-size: contain;
    background-repeat: no-repeat;
    /* position: absolute; */
    /* left: 1.53rem; */
    /* top: 3.11rem; */
    width: 77.4px;
    height: 30px;
    display: block;
    float: left;
    margin: 0 5px 0 0;
}
#rc{
  opacity: 0;
}
/* 
#tips{
  display: none;
} */

.tpicon{
    background-image: url(../images/tp1.png);
    background-size: contain;
    background-repeat: no-repeat;
    width: 25px;
    height: 25px;
    display: block;
}
.tpicon.dark{
        background-image: url(../images/tp2.png);
    background-size: contain;
    background-repeat: no-repeat;
}

/* GPS 定位时隐藏天气块（盖过任何 inline display，确保 tab 切换也不会再显示） */
.weather.hidden{
  display:none !important;
}

/* 电话复制弹窗（端内环境：不让 App 直接拨号，改为复制号码自行拨打） */
.dm-mask{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.5);
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:9999;
  padding:24px
}
.dm-card{
  width:100%;
  max-width:340px;
  background:var(--card);
  border-radius:14px;
  box-shadow:var(--sh);
  padding:20px 18px 16px;
  text-align:center
}
.dm-title{
  font-size:1rem;
  font-weight:600;
  color:var(--t);
  margin-bottom:14px
}
.dm-num{
  font-size:1.5rem;
  font-weight:700;
  color:var(--ok);
  letter-spacing:.5px;
  padding:10px 6px;
  margin-bottom:10px;
  -webkit-user-select:text;
  user-select:text;
  word-break:break-all
}
.dm-hint{
  font-size:.78rem;
  color:var(--t2);
  line-height:1.5;
  margin-bottom:16px
}
.dm-btns{
  display:flex;
  gap:10px
}
.dm-btn{
  flex:1;
  height:40px;
  border:none;
  border-radius:8px;
  font-size:.9rem;
  font-weight:600;
  cursor:pointer
}
.dm-copy{
  background:var(--ok);
  color:#fff
}
.dm-close{
  background:var(--bd);
  color:var(--t)
}

.tfljbtn{
    background-image: url(../images/icon.png);
    background-size: contain;
    background-repeat: no-repeat;
    width: 75px;
    height: 75px;
    display: block;
    position: fixed;
    bottom: 51px;
    right: 18px;
    z-index: 99999;
}