.zl_page {
  background: #fff;
  padding-bottom: 24px;
}
.zl_hud {
  margin: 12px 16px;
  padding: 10px 12px;
  background: linear-gradient(180deg, #eef3e6, #e3ead8);
  border: 1px solid #c5d2b4;
}
.zl_stat {
  display: inline-block;
  margin-right: 14px;
  color: #3d4a32;
  line-height: 22px;
}
.zl_stat b {
  color: #243018;
}
.zl_layout {
  margin: 0 16px 16px;
}
.zl_main {
  width: 430px;
}
.zl_side {
  width: 230px;
}
.zl_hero {
  margin-bottom: 12px;
}
.zl_face {
  float: left;
  width: 72px;
  height: 72px;
  margin-right: 12px;
  border-radius: 8px;
  background: #008000;
  box-shadow: inset 0 0 0 3px rgba(0, 0, 0, 0.18);
  position: relative;
}
.zl_face::before,
.zl_face::after {
  content: '';
  position: absolute;
  top: 26px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #1a1a1a;
}
.zl_face::before { left: 16px; }
.zl_face::after { right: 16px; }
.zl_place {
  font-size: 16px;
  font-weight: bold;
  color: #2b587a;
  line-height: 22px;
}
.zl_job,
.zl_skin {
  color: #555;
  line-height: 18px;
}
.zl_event {
  margin-bottom: 10px;
  padding: 8px 10px;
  background: #f7efe4;
  border: 1px solid #e0c8a4;
  color: #6a3b12;
}
.zl_event button,
.zl_actions button,
.zl_place_btn,
.zl_reset {
  margin: 0 6px 6px 0;
  padding: 4px 10px;
  border: 1px solid #b7c4d4;
  background: linear-gradient(180deg, #fff, #e7eef5);
  color: #2b587a;
  cursor: pointer;
}
.zl_actions button:hover,
.zl_place_btn:hover,
.zl_event button:hover,
.zl_reset:hover {
  border-color: #8eabc8;
}
.zl_job_btn.zl_mine {
  border-color: #7aa36a;
  background: #e7f3df;
}
.zl_place_btn {
  display: block;
  width: 100%;
  text-align: left;
}
.zl_place_btn.zl_here,
.zl_place_btn:disabled {
  color: #888;
  cursor: default;
}
.zl_panel {
  margin-bottom: 12px;
  padding: 8px 10px 10px;
  border: 1px solid #d7e1ea;
  background: #f7f9fb;
}
.zl_panel_title {
  margin-bottom: 6px;
  font-weight: bold;
  color: #45688e;
}
.zl_help ol {
  margin: 0 0 8px 18px;
  padding: 0;
  color: #444;
}
.zl_note,
.zl_muted,
.zl_owned {
  color: #666;
  line-height: 18px;
}
.zl_log {
  margin-top: 8px;
  max-height: 220px;
  overflow: auto;
}
.zl_line {
  padding: 3px 0;
  border-bottom: 1px solid #eef2f6;
  color: #333;
}
.zl_bad {
  color: #a33;
}
.zl_busy {
  opacity: 0.72;
}
.zl_reset {
  margin-top: 8px;
}