:root {
  --bg:#0d1117;
  --card:#161b22;
  --text:#e6edf3;
  --sub:#8b949e;
  --green:#00c087;
  --red:#f6465d;
  --main:#f0b90b;
}
.watch-btn {
  width: 70px;
  /* height: 50px; */
  padding: 10px 0;
  margin: 5px;
  background: var(--main);
  border: none;
  border-radius: 25px;
  font-size: .4em;
  /* font-weight: 600; */
  color: #333;
}

*{box-sizing:border-box}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:-apple-system,BlinkMacSystemFont;
}

.header{
  position:fixed;
  top:0;
  width:100%;
  height:48px;
  background:var(--bg);
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:600;
  z-index:10;
  border-bottom:1px solid #222;
}

.header.back{
  justify-content:flex-start;
  padding-left:12px;
}

.container{
  padding:60px 12px 80px;
}

.card{
  background:var(--card);
  border-radius:14px;
  padding:12px;
  margin-bottom:12px;
}

.banner img{
  width:100%;
  border-radius:12px;
}

.search{
  width:100%;
  padding:10px;
  border:none;
  border-radius:10px;
  background:#0b0f14;
  color:var(--text);
}

.title{font-weight:600;margin-bottom:8px}

.hot span{
  display:inline-block;
  padding:6px 10px;
  background:#0b0f14;
  border-radius:20px;
  margin:4px;
}

.coin{
  display:flex;
  justify-content:space-between;
  align-items:center;
}

.price{font-size:18px;font-weight:600}

.up{color:var(--green)}
.down{color:var(--red)}

.chart{height:260px}

.tabbar{
  position:fixed;
  align-items: center;
  bottom:0;
  width:100%;
  height:56px;
  background:#010409;
  display:flex;
  border-top:1px solid #222;
}

.tabbar a{
  flex:1;
  text-align:center;
  /* padding-top:6px; */
  font-size:15px;
  color:var(--sub);
}

.tabbar .active{color:var(--main)}

.float-btn{
  position:fixed;
  bottom:80px;
  left:50%;
  transform:translateX(-50%);
  background:var(--main);
  color:#000;
  border:none;
  padding:12px 30px;
  border-radius:30px;
  font-weight:600;
  font-size: .9em;
}

.toast{
  position:fixed;
  bottom:100px;
  left:50%;
  transform:translateX(-50%);
  background:rgba(0,0,0,.8);
  padding:10px 18px;
  border-radius:20px;
}
