/* 门户左侧 dock（资源站 / 整合包创作 等独立页面共用）
   取值与 portal/assets/app.css 同一套设计令牌（紫 #8865D6 / 侧栏 #F6F5F4） */
:root {
  --pd-bg: #FBFAF9;
  --pd-card: #FFFFFF;
  --pd-ink: #1A1A2E;
  --pd-sub: #6B6B76;
  --pd-faint: #9A9AA5;
  --pd-brand: #8865D6;
  --pd-brand-soft: #E9E9FF;
  --pd-side: #F6F5F4;
  --pd-line: #ECEAE8;
  --pd-r: 14px;
}
.pside {
  position: fixed; left: 0; top: 0; bottom: 0; z-index: 300;
  width: 208px; padding: 20px 12px;
  display: flex; flex-direction: column;
  background: var(--pd-side); border-right: 1px solid var(--pd-line);
  overflow-y: auto;
}
.pside-brand {
  display: flex; align-items: center; gap: 10px;
  padding: 4px 10px 18px; text-decoration: none; color: var(--pd-ink);
}
.pside-mark {
  width: 36px; height: 36px; flex: 0 0 auto; border-radius: 12px;
  background: var(--pd-brand); color: #fff;
  font: 800 14px/1 Consolas, "Courier New", monospace;
  display: flex; align-items: center; justify-content: center; letter-spacing: .5px;
}
.pside-name { font-size: 14px; font-weight: 700; letter-spacing: .3px; }
.pside-nav { display: flex; flex-direction: column; gap: 4px; }
.pside-item {
  display: flex; align-items: center; gap: 10px;
  height: 44px; padding: 0 12px; border-radius: var(--pd-r);
  color: var(--pd-sub); font-size: 13.5px; font-weight: 600;
  text-decoration: none; transition: background .12s, color .12s;
}
.pside-item:hover { background: var(--pd-card); color: var(--pd-ink); }
.pside-item.active { background: var(--pd-brand-soft); color: var(--pd-brand); }
.pside-ic {
  width: 16px; height: 16px; flex: 0 0 auto;
  border: 1.6px solid currentColor; border-radius: 5px; position: relative;
}
.pside-ic::after {
  content: ""; position: absolute; left: 3px; top: 3px;
  width: 7px; height: 7px; border-radius: 2.5px;
  background: currentColor; opacity: .35;
}
.pside-ic.home::after { border-radius: 50%; width: 6.4px; height: 6.4px; }
.pside-ic.res::after {
  left: 3px; top: 3px; width: 3.4px; height: 3.4px; border-radius: 1px; opacity: .55;
  box-shadow: 4.6px 0 0 currentColor, 0 4.6px 0 currentColor, 4.6px 4.6px 0 currentColor;
}
.pside-ic.pack::after {
  left: 3px; top: 3.4px; width: 6.4px; height: 1.6px; border-radius: 1px; opacity: .55;
  box-shadow: 0 3.4px 0 currentColor;
}
.pside-ic.rooms::after {
  left: 3px; right: 3px; width: auto; height: 1.6px; top: 6.5px; border-radius: 1px; opacity: .55;
}
.pside-ic.qq { border-radius: 8px 8px 8px 3px; }
.pside-ic.qq::after {
  left: 3.4px; top: 4.6px; width: 6.4px; height: 1.6px; border-radius: 1px; opacity: .55;
  box-shadow: 0 3.2px 0 currentColor;
}
/* ---------- 底部用户区（头像 + 昵称 → /profile/；未登录 → /login.html） ---------- */
.pside-user {
  display: flex; align-items: center; gap: 10px;
  margin-top: auto; padding: 10px;
  border: 1px solid var(--pd-line); border-radius: var(--pd-r);
  background: var(--pd-card); color: var(--pd-ink);
  text-decoration: none;
  transition: border-color .12s, background .12s;
}
.pside-user:hover { border-color: rgba(136, 101, 214, .42); }
.pside-user:focus-visible { outline: none; border-color: var(--pd-brand); box-shadow: 0 0 0 3px rgba(136, 101, 214, .16); }
.pside-user.current { background: var(--pd-brand-soft); border-color: transparent; color: var(--pd-brand); }
.pside-user-avatar {
  width: 30px; height: 30px; flex: 0 0 auto;
  border-radius: 50%; overflow: hidden;
  background: var(--pd-brand-soft); color: var(--pd-brand);
  display: flex; align-items: center; justify-content: center;
  font: 800 13px/1 Consolas, "Courier New", monospace;
}
.pside-user-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pside-user-txt { display: flex; flex-direction: column; min-width: 0; line-height: 1.35; }
.pside-user-name {
  font-size: 13px; font-weight: 700; font-style: normal;
  max-width: 150px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.pside-user-sub { font-size: 11px; font-style: normal; color: var(--pd-faint); }
.pside-user.current .pside-user-sub { color: var(--pd-brand); opacity: .8; }

.pside-foot {
  margin-top: 8px; padding: 10px 12px 2px;
  font-size: 11.5px; color: var(--pd-faint); line-height: 1.8;
}
body.has-dock { padding-left: 208px; }
@media (max-width: 900px) {
  .pside { display: none; }
  body.has-dock { padding-left: 0; }
}

/* ============================================================
   2026-10-24 · 视觉增强覆盖层（cache-bust v=20261024c）
   —— 只在文件末尾追加：不动上面的结构；颜色仍取同一套设计令牌
   —— 资源站 / 整合包创作 / 用户中心共用；res/pack 若引入 visual.css，极光背景会一并生效
   ============================================================ */
.pside {
  background: rgba(246, 245, 244, .72);
  -webkit-backdrop-filter: saturate(1.25) blur(16px);
  backdrop-filter: saturate(1.25) blur(16px);
  border-right: 1px solid rgba(255, 255, 255, .66);
  box-shadow: 1px 0 0 rgba(26, 26, 46, .035), 24px 0 60px -48px rgba(26, 26, 46, .28);
}
.pside-brand { position: relative; }
.pside-mark {
  background: linear-gradient(145deg, #8865D6, rgba(136, 101, 214, .74));
  box-shadow:
    0 1px 0 rgba(255, 255, 255, .38) inset,
    0 10px 22px -12px rgba(136, 101, 214, .9);
  color: #FFFFFF;
}
.pside-name {
  background: linear-gradient(120deg, #1A1A2E 10%, #8865D6 60%, #1A1A2E 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}
.pside-nav { gap: 6px; }
.pside-item {
  position: relative;
  border-radius: 13px;
  transition: background .26s cubic-bezier(.22, .61, .36, 1), color .26s cubic-bezier(.22, .61, .36, 1),
              transform .26s cubic-bezier(.22, .61, .36, 1), box-shadow .26s cubic-bezier(.22, .61, .36, 1);
}
.pside-item:hover {
  background: rgba(255, 255, 255, .7);
  box-shadow: 0 8px 20px -18px rgba(26, 26, 46, .5);
  transform: translateX(2px);
}
.pside-item.active {
  background: linear-gradient(115deg, rgba(136, 101, 214, .2), rgba(136, 101, 214, .06) 70%);
  color: var(--pd-brand);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, .7) inset,
    inset 0 0 0 1px rgba(136, 101, 214, .26),
    0 10px 24px -16px rgba(136, 101, 214, .85);
}
.pside-item.active::before {
  content: "";
  position: absolute; left: -12px; top: 50%;
  transform: translateY(-50%);
  width: 3px; height: 18px;
  border-radius: 0 3px 3px 0;
  background: linear-gradient(180deg, #8865D6, rgba(136, 101, 214, .35));
}
.pside-item.active .pside-ic { filter: drop-shadow(0 0 6px rgba(136, 101, 214, .55)); }
.pside-user {
  background: rgba(255, 255, 255, .8);
  -webkit-backdrop-filter: saturate(1.2) blur(10px);
  backdrop-filter: saturate(1.2) blur(10px);
  border-color: rgba(255, 255, 255, .74);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, .9) inset,
    0 12px 28px -20px rgba(26, 26, 46, .5);
  transition: border-color .28s, box-shadow .28s, transform .28s, background .28s;
}
.pside-user:hover {
  transform: translateY(-1px);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, .9) inset,
    0 16px 34px -20px rgba(136, 101, 214, .6);
}
.pside-user.current {
  background: linear-gradient(150deg, rgba(233, 233, 255, .95), rgba(255, 255, 255, .82));
  color: var(--pd-brand);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, .9) inset,
    inset 0 0 0 1px rgba(136, 101, 214, .2);
}
.pside-user-avatar {
  box-shadow:
    0 0 0 2px rgba(255, 255, 255, .95),
    0 0 0 4px rgba(136, 101, 214, .26);
}

@media (prefers-reduced-motion: reduce) {
  .pside-item:hover, .pside-user:hover { transform: none; }
  .pside-item, .pside-user { transition: none; }
}
@media (max-width: 900px) {
  .pside { background: rgba(246, 245, 244, .86); }
  .pside-item.active::before { display: none; }
}