.menu-user-box .nav-user-box {
  background: radial-gradient(
      190% 120% at 2% 0,
      #fff5eb 0,
      rgba(255, 247, 232, 0) 100%
    ),
    linear-gradient(180deg, #fff1eb, #fffaf7 120%, #fcf9f7 156%) !important;
  box-shadow: 0 10px 28px rgba(17, 17, 17, 0.08), 0 2px 10px rgba(242, 60, 19, 0.06) !important;
}

html.io-black-mode .menu-user-box .nav-user-box,
body.io-black-mode .menu-user-box .nav-user-box {
  background: #2d2e2f !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.55) !important;
}

.menu-user-box .uuriza-user-name-wrap {
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
}

.menu-user-box .uuriza-user-name-row {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  min-width: 0;
}

.menu-user-box .uuriza-user-vip-icon {
  width: 22px;
  height: 22px;
  object-fit: contain;
  flex: 0 0 auto;
}

.menu-user-box .uuriza-user-name-row > b {
  color: #111;
}

html.io-black-mode .menu-user-box .uuriza-user-name-row > b,
body.io-black-mode .menu-user-box .uuriza-user-name-row > b {
  color: rgba(255, 255, 255, 0.92);
}

/* Not-logged-in state uses theme's original <b> node. */
.menu-user-box .nav-user-box .user-right > b{
  color:#111;
}
html.io-black-mode .menu-user-box .nav-user-box .user-right > b,
body.io-black-mode .menu-user-box .nav-user-box .user-right > b{
  color:rgba(255,255,255,.92);
}

.menu-user-box .uuriza-user-vip-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.menu-user-box .uuriza-user-vip-name,
.menu-user-box .uuriza-user-vip-expire {
  font-size: 0.75rem;
  line-height: 1.125rem;
  color: rgba(17, 17, 17, 0.72);
  white-space: nowrap;
}

.menu-user-box .uuriza-user-vip-name.uuriza-user-vip-badge{
  display:inline-flex;
  align-items:center;
  padding:2px 8px;
  border-radius:999px;
  font-weight:650;
  letter-spacing:.02em;
  color:#1f2937;
  background: rgba(17, 24, 39, 0.08);
}

.menu-user-box .uuriza-user-vip-name.uuriza-user-vip-badge--member{
  color: rgba(17, 17, 17, 0.78);
  background: rgba(17, 24, 39, 0.06);
}

.menu-user-box .uuriza-user-vip-name.uuriza-user-vip-badge--day{
  color:#0f3d2e;
  background: linear-gradient(135deg, rgba(34,197,94,.22), rgba(16,185,129,.14));
}

.menu-user-box .uuriza-user-vip-name.uuriza-user-vip-badge--month{
  color:#0f2f4a;
  background: linear-gradient(135deg, rgba(59,130,246,.22), rgba(14,165,233,.14));
}

.menu-user-box .uuriza-user-vip-name.uuriza-user-vip-badge--quarter{
  color:#3b1d5a;
  background: linear-gradient(135deg, rgba(168,85,247,.22), rgba(236,72,153,.14));
}

.menu-user-box .uuriza-user-vip-name.uuriza-user-vip-badge--year{
  color:#4a1f00;
  background: linear-gradient(135deg, rgba(245,158,11,.26), rgba(249,115,22,.16));
}

.menu-user-box .uuriza-user-vip-name.uuriza-user-vip-badge--life{
  color:#3a2600;
  background: linear-gradient(135deg, rgba(255,215,0,.24), rgba(255,140,0,.14), rgba(255,59,48,.12));
  background-size: 200% 200%;
  animation: uurizaVipGlow 3.5s ease-in-out infinite;
}

@keyframes uurizaVipGlow{
  0%{ background-position: 0% 50%; }
  50%{ background-position: 100% 50%; }
  100%{ background-position: 0% 50%; }
}

@media (prefers-reduced-motion: reduce){
  .menu-user-box .uuriza-user-vip-name.uuriza-user-vip-badge--life{
    animation: none;
  }
}

html.io-black-mode .menu-user-box .uuriza-user-vip-name,
html.io-black-mode .menu-user-box .uuriza-user-vip-expire,
body.io-black-mode .menu-user-box .uuriza-user-vip-name,
body.io-black-mode .menu-user-box .uuriza-user-vip-expire {
  color: rgba(255, 255, 255, 0.72);
}

html.io-black-mode .menu-user-box .uuriza-user-vip-name.uuriza-user-vip-badge,
body.io-black-mode .menu-user-box .uuriza-user-vip-name.uuriza-user-vip-badge{
  color: rgba(255,255,255,.92);
  background: rgba(255,255,255,.10);
}

html.io-black-mode .menu-user-box .uuriza-user-vip-name.uuriza-user-vip-badge--day,
body.io-black-mode .menu-user-box .uuriza-user-vip-name.uuriza-user-vip-badge--day{
  background: linear-gradient(135deg, rgba(34,197,94,.28), rgba(16,185,129,.18));
}

html.io-black-mode .menu-user-box .uuriza-user-vip-name.uuriza-user-vip-badge--month,
body.io-black-mode .menu-user-box .uuriza-user-vip-name.uuriza-user-vip-badge--month{
  background: linear-gradient(135deg, rgba(59,130,246,.30), rgba(14,165,233,.18));
}

html.io-black-mode .menu-user-box .uuriza-user-vip-name.uuriza-user-vip-badge--quarter,
body.io-black-mode .menu-user-box .uuriza-user-vip-name.uuriza-user-vip-badge--quarter{
  background: linear-gradient(135deg, rgba(168,85,247,.32), rgba(236,72,153,.20));
}

html.io-black-mode .menu-user-box .uuriza-user-vip-name.uuriza-user-vip-badge--year,
body.io-black-mode .menu-user-box .uuriza-user-vip-name.uuriza-user-vip-badge--year{
  background: linear-gradient(135deg, rgba(245,158,11,.34), rgba(249,115,22,.22));
}

html.io-black-mode .menu-user-box .uuriza-user-vip-name.uuriza-user-vip-badge--life,
body.io-black-mode .menu-user-box .uuriza-user-vip-name.uuriza-user-vip-badge--life{
  background: linear-gradient(135deg, rgba(255,215,0,.28), rgba(255,140,0,.18), rgba(255,59,48,.16));
  background-size: 200% 200%;
}

.menu-user-box .uuriza-user-traffic,
.menu-user-box .uuriza-user-times {
  padding: 0.75rem;
  border-radius: var(--radius, 0.75rem);
  background: rgba(0, 0, 0, 0.03);
}

html.io-black-mode .menu-user-box .uuriza-user-traffic,
body.io-black-mode .menu-user-box .uuriza-user-traffic,
html.io-black-mode .menu-user-box .uuriza-user-times,
body.io-black-mode .menu-user-box .uuriza-user-times {
  background: rgba(255, 255, 255, 0.06);
}

.menu-user-box .uuriza-user-balance {
  padding: 0.75rem;
  border-radius: var(--radius, 0.75rem);
  background: rgba(0, 0, 0, 0.03);
}
html.io-black-mode .menu-user-box .uuriza-user-balance,
body.io-black-mode .menu-user-box .uuriza-user-balance {
  background: rgba(255, 255, 255, 0.06);
}

.menu-user-box .uuriza-user-quick-links{
  display:flex;
  gap:10px;
}
.menu-user-box .uuriza-user-quick-link{
  flex:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:10px 12px;
  border-radius:12px;
  text-decoration:none;
  background: rgba(0, 0, 0, 0.03);
  color: var(--main-color, #484b4f);
}
.menu-user-box .uuriza-user-quick-link i{
  font-size:14px;
  line-height:1;
}
.menu-user-box .uuriza-user-quick-link:hover{
  background: rgba(0, 0, 0, 0.06);
}
html.io-black-mode .menu-user-box .uuriza-user-quick-link,
body.io-black-mode .menu-user-box .uuriza-user-quick-link{
  background: rgba(255, 255, 255, 0.06);
  color: rgba(255, 255, 255, 0.88);
}
html.io-black-mode .menu-user-box .uuriza-user-quick-link:hover,
body.io-black-mode .menu-user-box .uuriza-user-quick-link:hover{
  background: rgba(255, 255, 255, 0.10);
}

.menu-user-box .uuriza-user-traffic-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.75rem;
}

.menu-user-box .uuriza-user-traffic-label {
  font-size: 0.8125rem;
  color: var(--muted-color, #93959a);
}

.menu-user-box .uuriza-user-traffic-value {
  font-size: 0.8125rem;
  font-weight: 400;
  color: var(--main-color, #484b4f);
}

html.io-black-mode .menu-user-box .uuriza-user-traffic-value,
body.io-black-mode .menu-user-box .uuriza-user-traffic-value {
  color: rgba(255, 255, 255, 0.88);
}

.menu-user-box .uuriza-user-traffic-bar {
  height: 6px;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.08);
  overflow: hidden;
  margin-top: 0.5rem;
}

html.io-black-mode .menu-user-box .uuriza-user-traffic-bar,
body.io-black-mode .menu-user-box .uuriza-user-traffic-bar {
  background: rgba(255, 255, 255, 0.12);
}

.menu-user-box .uuriza-user-traffic-bar > span {
  display: block;
  height: 100%;
  background: #22c55e;
  border-radius: 999px;
}
