.gs-sub-profile {
  position: fixed;
  top: 370px;
  left: 20px;
  width: 300px;

  /* 面板 = 永远暗色 */
  background-color: var(--panel-bg-medium);
  color: var(--panel-text-dark);

  border: 2px solid var(--panel-accent-medium);
  border-radius: 12px;

  box-shadow:
    0 0 0 1px var(--panel-accent-medium),
    0 10px 24px rgba(0,0,0,0.25);

  z-index: 99997;
  display: none;
  padding: 14px;
  font-family: 'Jost', sans-serif;
}

/* 子视图切换 */
.gs-sub-view {
  display: none;
}
.gs-sub-view.active {
  display: block;
}

/* Profile 按钮容器 */
.gs-profile-items {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

/* ===== 按钮基础 ===== */
.gs-profile-item {
  position: relative;
  flex: 0 0 calc(20% / 2);
  aspect-ratio: 1 / 1;
  border-radius: 8px;

  background-color: var(--button-bg-dark);
  color: var(--button-text-disabled);

  display: flex;
  align-items: center;
  justify-content: center;

  cursor: pointer;
  transition: all 0.3s ease;
}

/* ===== 启用状态 ===== */
.gs-profile-item.enabled {
  background-color: var(--button-bg-light);
  color: var(--button-text-enabled);

  box-shadow:
    0 0 0 2px var(--button-accent-light),
    0 0 14px color-mix(in srgb, var(--button-accent-light) 60%, transparent);

  filter: saturate(1.1) brightness(1.1);
}

/* ===== 已购买但未启用 ===== */
.gs-profile-item.disabled {
  filter: saturate(0.85) brightness(0.9);
}

/* ===== 图标 ===== */
.gs-profile-item img.gs-user-icon {
  max-width: 60%;
  max-height: 60%;
  transition: filter 0.3s ease;
}

/* 启用时图标反色 */
.gs-profile-item.enabled img.gs-user-icon {
  filter: invert(1) brightness(0);
}