:root {
  --hv-bg: #050814;
  --hv-bg2: #09101f;
  --hv-panel: rgba(8, 16, 36, .78);
  --hv-line: rgba(80, 190, 255, .28);
  --hv-cyan: #3cf0ff;
  --hv-blue: #4e7cff;
  --hv-gold: #ffd36a;
  --hv-text: #eaf3ff;
  --hv-muted: #8aa0c4;
  --hv-danger: #ff5d7a;
  --hv-ok: #3dffb0;
  --hv-shadow: 0 0 24px rgba(60, 240, 255, .18), 0 18px 50px rgba(0, 0, 0, .45);
}
html, body, #app { height: 100%; width: 100%; }
html, body {
  margin: 0 !important;
  padding: 0 !important;
  background: var(--hv-bg) !important;
  color: var(--hv-text) !important;
  overflow: hidden;
  font-family: "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif !important;
}
body.hv-app { overflow: auto; }
#hv-canvas, .hv-grid, .hv-scan, .hv-glow {
  position: fixed; inset: 0; pointer-events: none; z-index: 0;
}
#hv-canvas { z-index: 0; }
.hv-grid {
  z-index: 1;
  background-image:
    linear-gradient(rgba(60,240,255,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(60,240,255,.06) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: radial-gradient(ellipse at center, #000 35%, transparent 80%);
  animation: hv-grid 18s linear infinite;
}
.hv-scan {
  z-index: 2;
  background: repeating-linear-gradient(
    to bottom,
    rgba(255,255,255,.03) 0 1px,
    transparent 1px 4px
  );
  mix-blend-mode: overlay;
  opacity: .35;
}
.hv-glow {
  z-index: 1;
  background:
    radial-gradient(900px 420px at 12% 18%, rgba(78,124,255,.28), transparent 60%),
    radial-gradient(700px 380px at 88% 82%, rgba(60,240,255,.16), transparent 60%),
    radial-gradient(500px 280px at 70% 12%, rgba(255,211,106,.08), transparent 70%);
  animation: hv-pulse 7s ease-in-out infinite;
}
@keyframes hv-grid { to { background-position: 48px 48px; } }
@keyframes hv-pulse {
  0%,100% { opacity: .85; filter: hue-rotate(0deg); }
  50% { opacity: 1; filter: hue-rotate(18deg); }
}
#app { position: relative; z-index: 3; }

/* LOGIN */
.container[data-v-27d599c8] {
  height: 100vh !important;
  background: transparent !important;
}
.container .left[data-v-27d599c8] {
  display: flex !important;
  background-image: none !important;
  color: #fff !important;
  position: relative !important;
}
.container .left[data-v-27d599c8]::before {
  content: "";
  position: absolute; inset: 12% 18%;
  border: 1px solid rgba(60,240,255,.18);
  border-radius: 28px;
  box-shadow: inset 0 0 80px rgba(78,124,255,.12), 0 0 40px rgba(60,240,255,.08);
  transform: skewX(-8deg);
  animation: hv-frame 4.5s ease-in-out infinite;
}
.container .left[data-v-27d599c8] > div {
  z-index: 2;
  gap: 16px;
}
.container .left[data-v-27d599c8] .logo {
  filter: drop-shadow(0 0 16px rgba(60,240,255,.8)) !important;
  animation: hv-spin 12s linear infinite;
}
.container .left[data-v-27d599c8] div[style*="font-size: 30px"],
.container .left[data-v-27d599c8] div[style*="font-size:30px"] {
  font-size: 42px !important;
  letter-spacing: 3px !important;
  background: linear-gradient(90deg, #fff, var(--hv-cyan), var(--hv-gold), #fff);
  background-size: 240% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  animation: hv-text 4s linear infinite;
  text-shadow: none !important;
}
.container .right[data-v-27d599c8] {
  background: transparent !important;
}
.container .right .login-form[data-v-27d599c8] {
  width: 420px !important;
  right: 0 !important;
  padding: 36px 34px 30px;
  border-radius: 20px;
  background: linear-gradient(180deg, rgba(12,22,48,.86), rgba(7,12,28,.78)) !important;
  border: 1px solid rgba(60,240,255,.28);
  box-shadow: var(--hv-shadow), inset 0 0 0 1px rgba(255,255,255,.04);
  backdrop-filter: blur(16px);
  position: relative;
  overflow: hidden;
}
.container .right .login-form[data-v-27d599c8]::before {
  content: "";
  position: absolute; inset: -2px;
  background: linear-gradient(120deg, transparent, rgba(60,240,255,.55), transparent 40%, rgba(255,211,106,.4), transparent 75%);
  background-size: 220% 220%;
  animation: hv-border 3.2s linear infinite;
  z-index: -1;
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  padding: 1px;
  border-radius: 20px;
}
.container .right .login-form[data-v-27d599c8] > div[style*="font-size"] {
  color: #f4fbff !important;
  font-size: 26px !important;
  letter-spacing: 1px;
  text-shadow: 0 0 18px rgba(60,240,255,.35);
}
.login-input .el-input__inner,
.el-form-item .el-input__inner {
  background: rgba(5,10,24,.72) !important;
  border: 1px solid rgba(80,190,255,.28) !important;
  color: var(--hv-text) !important;
  height: 46px !important;
  border-radius: 12px !important;
  box-shadow: inset 0 0 12px rgba(60,240,255,.06);
}
.login-input .el-input__inner:focus,
.el-form-item .el-input__inner:focus {
  border-color: var(--hv-cyan) !important;
  box-shadow: 0 0 0 1px rgba(60,240,255,.35), 0 0 18px rgba(60,240,255,.2) !important;
}
.login-input .el-input__icon,
.el-input__prefix, .el-input__suffix, .el-checkbox__label {
  color: var(--hv-cyan) !important;
}
.el-checkbox__inner {
  background: transparent !important;
  border-color: var(--hv-cyan) !important;
}
.login-button, .login-button.el-button--primary,
.container .right .login-form .login-button[data-v-27d599c8] {
  width: 100% !important;
  height: 46px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: linear-gradient(90deg, #2a5bff, #3cf0ff 55%, #7aa7ff) !important;
  color: #041018 !important;
  font-weight: 800 !important;
  letter-spacing: 4px !important;
  box-shadow: 0 8px 24px rgba(60,240,255,.28) !important;
  text-shadow: 0 0 8px rgba(255,255,255,.35);
}
.login-button:hover {
  filter: brightness(1.08);
}

@keyframes hv-text { to { background-position: 240% 0; } }
@keyframes hv-border { to { background-position: 220% 0; } }
@keyframes hv-frame {
  0%,100% { opacity: .55; }
  50% { opacity: 1; }
}
@keyframes hv-spin { to { filter: drop-shadow(0 0 22px rgba(255,211,106,.9)); } }

@media (max-width: 900px) {
  .container[data-v-27d599c8] { flex-direction: column !important; }
  .container .left[data-v-27d599c8] { min-height: 28vh; }
  .container .left[data-v-27d599c8]::before { inset: 8% 10%; }
  .container .right .login-form[data-v-27d599c8] { width: min(420px, 92vw) !important; }
}

/* HEADER / APP SHELL */
.header[data-v-d2d5f28e] {
  background: rgba(8,14,30,.86) !important;
  box-shadow: 0 8px 30px rgba(0,0,0,.35), 0 1px 0 rgba(60,240,255,.18) !important;
  backdrop-filter: blur(16px);
}
.header .header-content[data-v-d2d5f28e] { height: 68px !important; }
.header .logo-section .logo[data-v-d2d5f28e] {
  filter: drop-shadow(0 0 10px rgba(60,240,255,.7)) !important;
}
.header .logo-section .brand .brand-name[data-v-d2d5f28e] {
  color: #f3f8ff !important;
  letter-spacing: 1px;
  text-shadow: 0 0 12px rgba(60,240,255,.35);
}
.header .logo-section .brand .version[data-v-d2d5f28e] {
  color: var(--hv-cyan) !important;
}
.header .nav-menu .nav-link[data-v-d2d5f28e] {
  color: #c9dbf8 !important;
  background: transparent !important;
  border: 1px solid transparent !important;
}
.header .nav-menu .nav-link[data-v-d2d5f28e]:hover {
  color: var(--hv-cyan) !important;
  background: rgba(60,240,255,.08) !important;
  border-color: rgba(60,240,255,.25) !important;
}
.header .nav-menu .nav-link.router-link-active[data-v-d2d5f28e] {
  color: #041018 !important;
  background: linear-gradient(90deg, #4e7cff, #3cf0ff) !important;
  border-color: transparent !important;
  box-shadow: 0 6px 18px rgba(60,240,255,.28) !important;
}
.header .user-section .user-info .username[data-v-d2d5f28e],
.header .menu-toggle[data-v-d2d5f28e] { color: var(--hv-text) !important; }
.header .nav-menu[data-v-d2d5f28e] {
  background: rgba(8,14,30,.96) !important;
}

/* CONTENT */
.my-card, .el-card, .el-dialog, .el-message-box, .el-drawer,
.proxy-main .item[data-v-013c20c8],
.waf .waf-overview .overview-card[data-v-7235c419] {
  background: var(--hv-panel) !important;
  border: 1px solid var(--hv-line) !important;
  color: var(--hv-text) !important;
  box-shadow: var(--hv-shadow) !important;
  backdrop-filter: blur(10px);
}
.el-card__header, .el-dialog__header, .el-drawer__header {
  color: var(--hv-text) !important;
  border-bottom: 1px solid var(--hv-line) !important;
}
.el-table, .el-table th, .el-table tr, .el-table td,
.el-table--enable-row-hover .el-table__body tr:hover>td,
.el-table th.el-table__cell, .el-table tr {
  background: transparent !important;
  color: var(--hv-text) !important;
  border-color: rgba(80,190,255,.12) !important;
}
.el-table th.el-table__cell { color: var(--hv-muted) !important; }
.el-table::before, .el-table--group::after, .el-table--border::after { display: none !important; }
.el-pagination, .el-pagination button, .el-pager li, .el-pagination__jump, .el-pagination__total {
  background: transparent !important;
  color: var(--hv-text) !important;
}
.el-input__inner, .el-textarea__inner, .el-select .el-input__inner,
.el-input-number .el-input__inner {
  background: rgba(5,10,24,.72) !important;
  border: 1px solid rgba(80,190,255,.28) !important;
  color: var(--hv-text) !important;
}
.el-form-item__label, .el-descriptions__label, .desc[data-v-26005c85], .text[data-v-7d36ae1d] {
  color: var(--hv-muted) !important;
}
.el-button--primary {
  background: linear-gradient(90deg, #2a5bff, #3cf0ff) !important;
  border: 0 !important;
  color: #041018 !important;
  font-weight: 700 !important;
}
.el-button--success { background: #17c48a !important; border: 0 !important; color: #041018 !important; }
.el-button--danger { background: var(--hv-danger) !important; border: 0 !important; }
.el-button--default, .el-button--info, .el-button {
  background: rgba(20,32,64,.7) !important;
  border: 1px solid rgba(80,190,255,.22) !important;
  color: var(--hv-text) !important;
}
.el-dropdown-menu, .el-select-dropdown, .el-picker-panel, .el-popper {
  background: #0c1730 !important;
  border: 1px solid var(--hv-line) !important;
  color: var(--hv-text) !important;
}
.el-dropdown-menu__item, .el-select-dropdown__item { color: var(--hv-text) !important; }
.el-dropdown-menu__item:hover, .el-select-dropdown__item.hover,
.el-select-dropdown__item.selected {
  background: rgba(60,240,255,.12) !important;
  color: var(--hv-cyan) !important;
}
.el-menu, .el-menu--horizontal { background: transparent !important; border: 0 !important; }
.el-tabs__item { color: var(--hv-muted) !important; }
.el-tabs__item.is-active { color: var(--hv-cyan) !important; }
.el-tabs__active-bar { background: var(--hv-cyan) !important; }
.el-switch__core { background: #223 !important; }
.waf .header[data-v-7235c419] { background: transparent !important; }
.waf .waf-overview .overview-card .card-content .card-title[data-v-7235c419] { color: var(--hv-muted) !important; }
.waf .waf-overview .overview-card .card-content .card-value[data-v-7235c419] { color: var(--hv-text) !important; }
.el-message { background: #0c1730 !important; border-color: var(--hv-line) !important; }
.el-loading-mask { background: rgba(5,8,20,.55) !important; }

.main-content[data-v-d2d5f28e] { color: var(--hv-text) !important; }
.el-table__empty-block, .el-table__empty-text { color: var(--hv-muted) !important; background: transparent !important; }
.el-tag { border: 0 !important; }
.el-breadcrumb__inner, .el-breadcrumb__inner a { color: var(--hv-muted) !important; }
.el-page-header__content, .el-page-header__title { color: var(--hv-text) !important; }
.el-alert { background: rgba(60,240,255,.08) !important; border: 1px solid var(--hv-line) !important; color: var(--hv-text) !important; }
.el-progress-bar__outer { background: rgba(255,255,255,.08) !important; }
body.hv-login { overflow: hidden; }

img.logo, .header .logo-section .logo[data-v-d2d5f28e], .container .left[data-v-27d599c8] .logo {
  width: 52px !important;
  height: 52px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  border: 2px solid rgba(60,240,255,.65) !important;
  box-shadow: 0 0 16px rgba(60,240,255,.45) !important;
  background: #0b1224 !important;
  animation: none !important;
  filter: none !important;
}
.container .left[data-v-27d599c8] .logo {
  width: 96px !important;
  height: 96px !important;
}

body.hv-ink-list .el-table,
body.hv-ink-list .el-table__body,
body.hv-ink-list .el-table__header,
body.hv-ink-list .el-table tr,
body.hv-ink-list .el-table th,
body.hv-ink-list .el-table td,
body.hv-ink-list .el-table th.el-table__cell,
body.hv-ink-list .el-table td.el-table__cell {
  background: #eef6f1 !important;
  color: #0f3d2e !important;
  border-color: #b7d2c4 !important;
}
body.hv-ink-list .el-table th,
body.hv-ink-list .el-table th.el-table__cell,
body.hv-ink-list .el-table th .cell {
  background: #d7ebe1 !important;
  color: #0b3326 !important;
  font-weight: 700 !important;
}
body.hv-ink-list .el-table .cell,
body.hv-ink-list .el-table td,
body.hv-ink-list .el-table td span,
body.hv-ink-list .el-table td div {
  color: #0f3d2e !important;
}
body.hv-ink-list .el-table--enable-row-hover .el-table__body tr:hover>td {
  background: #d9efe4 !important;
  color: #0b3326 !important;
}
body.hv-ink-list .el-table .el-tag,
body.hv-ink-list .el-table .el-link,
body.hv-ink-list .el-table a {
  color: #0f3d2e !important;
}

.hv-logs {
  display: none;
  position: relative;
  z-index: 4;
  max-width: 1400px;
  margin: 24px auto 48px;
  padding: 0 24px;
  color: #eaf3ff;
}
body.hv-logs-on .hv-logs { display: block; }
.hv-logs-head { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; align-items: center; margin-bottom: 16px; }
.hv-logs-head h2 { margin: 0; letter-spacing: 2px; }
.hv-logs-filters { display: flex; gap: 8px; flex-wrap: wrap; }
.hv-logs-filters input, .hv-logs-filters select, .hv-logs-filters button {
  height: 36px; border-radius: 10px; border: 1px solid rgba(80,190,255,.28);
  background: rgba(5,10,24,.72); color: #eaf3ff; padding: 0 10px;
}
.hv-logs-filters button {
  background: linear-gradient(90deg, #2a5bff, #3cf0ff); color: #041018; font-weight: 800; border: 0; cursor: pointer;
}
.hv-rank-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-bottom: 18px; }
@media (max-width: 1100px) { .hv-rank-grid { grid-template-columns: 1fr; } }
.hv-rank-card {
  background: rgba(8,16,36,.78); border: 1px solid rgba(80,190,255,.28);
  border-radius: 14px; padding: 16px; min-height: 180px;
}
.hv-rank-card h3 { margin: 0 0 12px; font-size: 14px; color: #8aa0c4; letter-spacing: 1px; }
.hv-bar { display: grid; grid-template-columns: 110px 1fr 42px; gap: 8px; align-items: center; margin: 8px 0; font-size: 12px; }
.hv-bar .n { color: #0f3d2e; background: #eef6f1; border-radius: 6px; padding: 2px 6px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hv-bar i { display: block; height: 8px; background: linear-gradient(90deg, #145c45, #3cf0ff); border-radius: 99px; }
.hv-bar b { color: #c9ffe8; text-align: right; }
.hv-logs-table-wrap {
  background: #eef6f1; border: 1px solid #b7d2c4; border-radius: 14px; overflow: auto;
}
.hv-logs-table { width: 100%; border-collapse: collapse; color: #0f3d2e; }
.hv-logs-table th, .hv-logs-table td { text-align: left; padding: 10px 12px; border-bottom: 1px solid #b7d2c4; font-size: 13px; }
.hv-logs-table th { background: #d7ebe1; color: #0b3326; }
.hv-logs-table tr:hover td { background: #d9efe4; }
.hv-logs-pager { display: flex; gap: 12px; align-items: center; justify-content: flex-end; padding: 10px 12px; color: #0f3d2e; }
.hv-logs-pager button { height: 30px; border: 1px solid #b7d2c4; background: #fff; color: #0f3d2e; border-radius: 8px; cursor: pointer; }
.hv-empty { text-align: center; color: #4d6f62; padding: 16px 0; }

.header .nav-menu #hv-nav-logs {
  padding: 10px 16px !important;
  border-radius: 6px !important;
  text-decoration: none !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  text-align: center !important;
  color: #c9dbf8 !important;
  background: transparent !important;
  border: 1px solid transparent !important;
}
.header .nav-menu #hv-nav-logs:hover {
  color: var(--hv-cyan) !important;
  background: rgba(60,240,255,.08) !important;
  border-color: rgba(60,240,255,.25) !important;
}
.header .nav-menu #hv-nav-logs.router-link-active {
  color: #041018 !important;
  background: linear-gradient(90deg, #4e7cff, #3cf0ff) !important;
  border-color: transparent !important;
  box-shadow: 0 6px 18px rgba(60,240,255,.28) !important;
}