/* ==================== 十八中论坛 - 贴吧风格（UI 优化版） ==================== */

/* Bundled fonts keep the three display modes independent from device fonts. */
@font-face { font-family: ForumWenHei; src: url('/assets/fonts/HYWenHei-35W-6.woff2') format('woff2'); font-weight: 300; font-display: block; }
@font-face { font-family: ForumWenHei; src: url('/assets/fonts/HYWenHei-45W-5.woff2') format('woff2'); font-weight: 400; font-display: block; }
@font-face { font-family: ForumWenHei; src: url('/assets/fonts/HYWenHei-55W-4.woff2') format('woff2'); font-weight: 500; font-display: block; }
@font-face { font-family: ForumWenHei; src: url('/assets/fonts/HYWenHei-65W-3.woff2') format('woff2'); font-weight: 600; font-display: block; }
@font-face { font-family: ForumWenHei; src: url('/assets/fonts/HYWenHei-75W-2.woff2') format('woff2'); font-weight: 700; font-display: block; }
@font-face { font-family: ForumWenHei; src: url('/assets/fonts/HYWenHei-85W-1.woff2') format('woff2'); font-weight: 800; font-display: block; }
@font-face { font-family: ForumQiHei; src: url('/assets/fonts/HanYiQiHei-65Jian-Regular-2.woff2') format('woff2'); font-weight: 400; font-display: block; }
@font-face { font-family: ForumWenHei35; src: url('/assets/fonts/HYWenHei-35W-6.woff2') format('woff2'); font-display: block; }
@font-face { font-family: ForumWenHei45; src: url('/assets/fonts/HYWenHei-45W-5.woff2') format('woff2'); font-display: block; }
@font-face { font-family: ForumWenHei55; src: url('/assets/fonts/HYWenHei-55W-4.woff2') format('woff2'); font-display: block; }
@font-face { font-family: ForumWenHei65; src: url('/assets/fonts/HYWenHei-65W-3.woff2') format('woff2'); font-display: block; }
@font-face { font-family: ForumWenHei75; src: url('/assets/fonts/HYWenHei-75W-2.woff2') format('woff2'); font-display: block; }
@font-face { font-family: ForumWenHei85; src: url('/assets/fonts/HYWenHei-85W-1.woff2') format('woff2'); font-display: block; }
@font-face { font-family: ForumQiHei65; src: url('/assets/fonts/HanYiQiHei-65Jian-Regular-2.woff2') format('woff2'); font-display: block; }
@font-face { font-family: ForumYPHM; src: url('/assets/fonts/YinPinHongMengTi-1.woff2') format('woff2'); font-display: block; }



:root {
  /* ── 色彩：暖调青绿 ── */
  --primary:            #0d9488;
  --primary-hover:      #0f766e;
  --primary-light:      rgba(13, 148, 136, 0.08);
  --primary-ring:       rgba(13, 148, 136, 0.22);

  --bg:                 #f8f6f4;
  --card-bg:            #ffffff;
  --card-border:        #e7e3de;

  --text:               #1c1917;
  --text-secondary:     #57534e;
  --text-muted:         #a8a29e;

  --link:               #0d9488;
  --link-hover:         #0f766e;

  --danger:             #dc2626;
  --danger-light:       rgba(220, 38, 38, 0.06);
  --warning:            #d97706;
  --warning-light:      rgba(217, 119, 6, 0.08);
  --success:            #16a34a;
  --success-light:      rgba(22, 163, 74, 0.06);

  /* ── 表单 ── */
  --input-bg:           #fafaf9;
  --input-border:       #d6d3d1;
  --input-focus:        #0d9488;

  /* ── 阴影（2 级） ── */
  --shadow-sm:          0 1px 2px rgba(0,0,0,0.04);
  --shadow-md:          0 4px 16px rgba(0,0,0,0.08);

  /* ── 圆角（统一尺度） ── */
  --radius-sm:          6px;
  --radius-md:          8px;
  --radius-lg:          12px;
  --radius-full:        9999px;

  /* ── 布局 ── */
  --nav-height:         48px;

  /* ── 表面 ── */
  --nav-surface:        #ffffff;
  --topbar-border:      rgba(0,0,0,0.06);
  --footer-bg:          #f0eeec;
  --divider:            #e7e3de;
  --code-bg:            #f0eeec;

  /* ── 徽章 ── */
  --badge-admin-bg:     #fef3c7;
  --badge-admin-color:  #92400e;
  --badge-precept-bg:   #d1fae5;
  --badge-precept-color:#065f46;

  /* ── 过渡 ── */
  --ease:               cubic-bezier(0.25, 0.1, 0.25, 1);
  --ease-out:           cubic-bezier(0, 0, 0.2, 1);
}



/* ==================== 中性炭灰夜间模式 ==================== */
.night-mode {
  --bg:                 #111214;
  --card-bg:            #1b1d20;
  --card-border:        #303238;

  --text:               #f0f1f2;
  --text-secondary:     #b0b2b7;
  --text-muted:         #858890;

  --link:               #2dd4bf;
  --link-hover:         #5eead4;
  --primary:            #2dd4bf;
  --primary-hover:      #5eead4;
  --primary-light:      rgba(45, 212, 191, 0.1);
  --primary-ring:       rgba(45, 212, 191, 0.2);

  --input-bg:           #15171a;
  --input-border:       #3a3d43;
  --input-focus:        #2dd4bf;

  --shadow-sm:          0 1px 2px rgba(0,0,0,0.32);
  --shadow-md:          0 6px 20px rgba(0,0,0,0.38);

  --nav-surface:        #1b1d20;
  --topbar-border:      rgba(255,255,255,0.12);
  --footer-bg:          #0c0d0f;
  --divider:            #292b30;
  --code-bg:            #23262a;

  --badge-admin-bg:     #332200;
  --badge-admin-color:  #fcd34d;
  --badge-precept-bg:   #002211;
  --badge-precept-color:#34d399;
}



*,*::before,*::after { box-sizing:border-box;margin:0;padding:0 }
.sr-only { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important }



body {
  isolation: auto;

  font-family: "汉仪文黑 85W", "汉仪文黑-85W", "HYWenHei 85W", "HYWenHei-85W", "汉仪文黑", "汉仪旗黑 65W", "汉仪旗黑-65W", "HYQiHei 65W", "HYQiHei-65W", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", sans-serif;

  font-size: 15px;
  font-weight: 300;
  line-height: 1.65;
  color: var(--text);
  background: var(--bg);
  min-height: 100vh;
  padding-top: var(--nav-height);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  letter-spacing: 0;
}
body.font-mode-brand, body.font-mode-wenhei { --forum-font: ForumWenHei, ForumSerifFallback, sans-serif; }
body.font-mode-qihei { --forum-font: ForumQiHei, ForumWenHei, ForumSerifFallback, sans-serif; }
body.font-mode-system { --forum-font: ForumSystem, ForumSerifFallback, sans-serif; }
body.font-mode-serif { --forum-font: ForumSerifFallback, ForumWenHei, serif; }
body.font-mode-wenhei35 { --forum-font: ForumWenHei35; } body.font-mode-wenhei45 { --forum-font: ForumWenHei45; }
body.font-mode-wenhei55 { --forum-font: ForumWenHei55; } body.font-mode-wenhei65 { --forum-font: ForumWenHei65; }
body.font-mode-wenhei75 { --forum-font: ForumWenHei75; } body.font-mode-wenhei85 { --forum-font: ForumWenHei85; }
body.font-mode-qihei65 { --forum-font: ForumQiHei65; } body.font-mode-msyh { --forum-font: ForumMsyh; }
body.font-mode-device { --forum-font: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Segoe UI", "Microsoft YaHei", sans-serif; }
body.font-mode-mincho { --forum-font: ForumMincho, ForumSerifFallback, serif; }
body.font-mode-yphm { --forum-font: ForumYPHM, ForumSerifFallback, sans-serif; }
/* 印品鸿蒙体：信息与装饰文字改灰色（链接、提示、统计数字、查看全部、作业文件、好友徽章），
   按钮/进度条/签到高亮等功能主色保留；--text-secondary 自动适配日夜模式 */
body.font-mode-yphm { --link: var(--text-secondary); --link-hover: var(--text); }
body.font-mode-yphm .post-meta-hint,
body.font-mode-yphm .shared-files-balance strong,
body.font-mode-yphm .stat-card .stat-num,
body.font-mode-yphm .dashboard-section-header > a,
body.font-mode-yphm .homework-file a,
body.font-mode-yphm .profile-friend-badge { color: var(--text-secondary); }
body.font-mode-yphm .profile-friend-badge { border-color: var(--card-border); }
body.font-mode-serif_extralight { --forum-font: ForumSerifFallback; font-weight: 200; }
body.font-mode-serif_light { --forum-font: ForumSerifFallback; font-weight: 300; }
body.font-mode-serif_regular { --forum-font: ForumSerifFallback; font-weight: 400; }
body.font-mode-serif_medium { --forum-font: ForumSerifFallback; font-weight: 500; }
body.font-mode-serif_semibold { --forum-font: ForumSerifFallback; font-weight: 600; }
body.font-mode-serif_bold { --forum-font: ForumSerifFallback; font-weight: 700; }
body.font-mode-serif_heavy { --forum-font: ForumSerifFallback; font-weight: 900; }
body[class*="font-mode-"] { font-family: var(--forum-font); font-variant-numeric: lining-nums; text-rendering: optimizeLegibility; }
body[class*="font-mode-"] :where(input, textarea, button, select, code) { font-family: var(--forum-font); }
body[class*="font-mode-"] * { text-shadow: none !important; }
body[class*="font-mode-wenhei"], body.font-mode-qihei65, body.font-mode-yphm { font-synthesis: none; }



::selection { background: var(--primary-ring); color: var(--primary); }

/* ── 全局图标工具类 ── */
.icon { width: 1.125em; height: 1.125em; vertical-align: -0.15em; flex-shrink: 0; }
.icon--sm { width: 0.875em; height: 0.875em; }
.icon--lg { width: 1.5em;  height: 1.5em; }
.icon--xl { width: 2em; height: 2em; }
.icon--btn { vertical-align: middle; margin-right: 4px; }

a { color: var(--link); text-decoration: none; transition: color 0.15s var(--ease) }

a:hover { color: var(--link-hover); text-decoration: underline }

a:focus-visible { outline: 2px solid var(--primary-ring); outline-offset: 2px }





/* ==================== Navbar v4 — Apple.com.cn 精确匹配 ==================== */

/* CSS variables reused from global :root above */
.night-mode {
  --nav-link-color: rgba(255,255,255,0.55);
  --nav-link-hover: #fff;
}

.topbar {
  position: fixed; top: 0; left: 0; right: 0; height: var(--nav-height);
  background: var(--nav-surface);
  z-index: 10001;
  transition: background 0.3s ease, box-shadow 0.3s ease;
}
.topbar.scrolled {
  background: var(--nav-surface);
  box-shadow: none;
}
.night-mode .topbar {
  background: var(--nav-surface);
}
.night-mode .topbar.scrolled {
  background: var(--nav-surface);
  box-shadow: none;
}
.topbar.mega-open,
.topbar.scrolled.mega-open { box-shadow: none; }
.topbar-inner {
  max-width: 1024px; margin: 0 auto;
  width: 100%; height: 100%;
  display: flex; align-items: center; padding: 0 24px;
}

/* Logo */
.logo {
  flex-shrink: 0; z-index: 2;
  font-size: 21px; font-weight: 500; color: #1d1d1f !important;
  text-decoration: none !important; white-space: nowrap;
  letter-spacing: -0.3px; display: flex; align-items: center; gap: 0;
  opacity: 0.92; transition: opacity 0.2s;
}
.logo:hover { opacity: 1; color: #1d1d1f !important; }
.night-mode .logo { color: #f5f5f7 !important; }
.night-mode .logo:hover { color: #fff !important; }
.logo-img { width: 18px; height: 18px; display: block; object-fit: contain; }
.logo-img + * { display: none; }

/* Nav links — Apple.com.cn 精确：12px, rgba(0,0,0,0.8), 居中对齐，li 间距紧凑 */
.nav-links {
  list-style: none; margin: 0; padding: 0;
  flex: 1; display: flex; justify-content: center; align-items: center; gap: 0;
  z-index: 2; transform: none;
}
.topbar.is-guest .nav-links { transform: translateX(24px); }
.nav-links > li {
  display: flex; justify-content: center; align-items: center;
  padding: 0 16px;
}
.nav-links .nav-dropdown-label,
.nav-links > li > a {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 0 !important; border: none; border-radius: 0;
  color: rgba(0, 0, 0, 0.8);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0;
  transition: color 0.24s ease;
  text-decoration: none !important;
  background: none !important; cursor: pointer; font-family: inherit;
  line-height: var(--nav-height); height: var(--nav-height);
}

/* hover → 纯黑 */
.nav-links .nav-dropdown-label:hover,
.nav-links > li > a:hover {
  font-weight: 400;
  color: #000;
}
.nav-ucdn-link { position: relative; }
.nav-ucdn-link::before { content: ''; position: absolute; left: 12px; right: 12px; bottom: 3px; height: 2px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform .24s ease; opacity: .65; }
.nav-ucdn-link:hover::before, .nav-ucdn-link.active::before { transform: scaleX(1); }
.nav-ucdn-link.active { animation: ucdn-nav-pulse 2.4s ease-in-out infinite; }
.nav-new-feature { animation: ucdn-nav-pulse 2.8s ease-in-out infinite; }
@keyframes ucdn-nav-pulse { 0%,100% { text-shadow: 0 0 0 transparent; } 50% { text-shadow: 0 0 9px color-mix(in srgb, currentColor 45%, transparent); } }
@media (prefers-reduced-motion: reduce) { .nav-ucdn-link.active { animation: none; } }

/* JS 高亮 */
.nav-links .nav-dropdown-label.nav-hover,
.nav-links > li > a.nav-hover {
  font-weight: 400;
  color: #000;
}

/* active */
.nav-links > li > a.nav-active,
.nav-links .nav-dropdown-label.nav-active {
  opacity: 1;
  color: rgba(0,0,0,0.8);
}

/* Night mode — nav links turn white */
.night-mode .nav-links .nav-dropdown-label,
.night-mode .nav-links > li > a {
  color: rgba(255, 255, 255, 0.65);
}
.night-mode .nav-links .nav-dropdown-label:hover,
.night-mode .nav-links > li > a:hover {
  color: #fff;
}
.night-mode .nav-links .nav-dropdown-label.nav-hover,
.night-mode .nav-links > li > a.nav-hover {
  color: #fff;
}
.night-mode .nav-links .nav-dropdown-label.nav-active,
.night-mode .nav-links > li > a.nav-active {
  color: rgba(255, 255, 255, 0.65);
}

/* 下拉箭头 - Apple 风格隐藏 */
.nav-dropdown-label::after {
  display: none;
}

/* ==================== Mega Dropdown Panel — Apple.com.cn 精确 ==================== */
.nav-dropdown { position: static; }

/*
  模糊遮罩 — 仅模糊二级菜单下方的页面内容。
  top:var(--nav-height) 确保导航栏不被模糊
*/
.nav-mega-backdrop {
  position: fixed; top: var(--nav-height); left: 0; width: 100vw; height: calc(100vh - var(--nav-height));
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  z-index: 9997;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.32s cubic-bezier(0.16, 1, 0.3, 1),
              visibility 0.32s cubic-bezier(0.16, 1, 0.3, 1);
}

.nav-mega-backdrop.open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

#navMega {
  position: fixed; top: calc(var(--nav-height) - 1px); left: 0; right: 0;
  background: var(--nav-surface);
  z-index: 10000;
  padding: 32px 0 42px;
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  transform: translateY(-8px);
  clip-path: inset(0 0 100% 0);
  visibility: hidden;
  transition: opacity 0.24s cubic-bezier(0.4, 0, 1, 1),
              transform 0.28s cubic-bezier(0.4, 0, 1, 1),
              clip-path 0.28s cubic-bezier(0.4, 0, 1, 1),
              visibility 0s 0.28s;
}

#navMega.open {
  max-height: calc(100vh - var(--nav-height));
  max-height: calc(100dvh - var(--nav-height));
  overflow-x: hidden;
  overflow-y: auto;
  opacity: 1;
  transform: translateY(0);
  clip-path: inset(0);
  visibility: visible;
  transition: opacity 0.35s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.45s cubic-bezier(0.22, 0.61, 0.36, 1),
              clip-path 0.45s cubic-bezier(0.16, 1, 0.3, 1),
              visibility 0s 0s;
}

/* Close animation for the outer surface panel */
#navMega.open.closing {
  animation: megaBgOut 0.30s cubic-bezier(0.4, 0, 1, 1) forwards;
  transition: none;
}
#navMega.open.switching {
  overflow: hidden;
  transition: height 0.36s cubic-bezier(0.16, 1, 0.3, 1);
}
@keyframes megaBgOut {
  from { opacity: 1; transform: translateY(0); clip-path: inset(0); max-height: calc(100dvh - var(--nav-height)); overflow: hidden; }
  to   { opacity: 0; transform: translateY(-8px); clip-path: inset(0 0 100% 0); max-height: 0; overflow: hidden; }
}
/* overflow 由 open/closed 状态直接控制 */
.night-mode #navMega {
  background: var(--nav-surface);
}

@media (max-width: 834px) {
  #navMega {
    /* Keep full-size columns and wrap whole groups when the row is full. */
    padding: 16px 0 24px;
  }
  #navMega.open {
    max-height: calc(100vh - var(--nav-height));
    max-height: calc(100dvh - var(--nav-height));
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
  .nav-mega-inner.active,
  .nav-mega-inner.measuring {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-start;
    column-gap: clamp(16px, 4vw, 32px);
    row-gap: 24px;
    overflow: visible;
    padding-left: 12px;
    padding-right: 12px;
    padding-bottom: 14px;
  }
  .nav-mega-col {
    flex: 0 0 max-content;
    min-width: max-content;
  }
}

@media (max-width: 520px) {
  .nav-mega-inner.active,
  .nav-mega-inner.measuring {
    column-gap: 8px;
    row-gap: 24px;
  }
}

.nav-mega-inner {
  display: flex;
  gap: 48px;
  max-width: 1020px;
  margin: 0 auto;
  padding: 0 24px;
  opacity: 0;
  transform: translateY(12px);
  filter: blur(4px);
  visibility: hidden;
  pointer-events: none;
  position: absolute; top: 0; left: 0; right: 0;
}

.nav-mega-inner.active {
  display: flex;
  position: relative;
  opacity: 1;
  transform: translateY(0);
  filter: blur(0);
  visibility: visible;
  pointer-events: auto;
  /* open: CSS transition handles entrance */
  transition: opacity 0.35s cubic-bezier(0.16, 1, 0.3, 1) 0.04s,
              transform 0.45s cubic-bezier(0.22, 0.61, 0.36, 1) 0.04s,
              filter 0.35s cubic-bezier(0.16, 1, 0.3, 1) 0.04s;
}

.nav-mega-inner.measuring {
  display: flex;
  position: absolute;
  opacity: 0;
  transform: none;
  filter: none;
  visibility: hidden;
  pointer-events: none;
}

/* Close animation — must keep .active ON during closing so position stays relative and panel stays in-flow */
.nav-mega-inner.active.closing {
  animation: megaCloseOut 0.26s cubic-bezier(0.4, 0, 1, 1) forwards;
  pointer-events: none;
  /* Override open transition with animation */
  transition: none;
}
@keyframes megaCloseOut {
  from { opacity: 1; transform: translateY(0);  filter: blur(0); }
  to   { opacity: 0; transform: translateY(12px); filter: blur(4px); }
}

.nav-mega-inner.active.switching-out {
  animation: megaSwitchOut 0.18s cubic-bezier(0.4, 0, 1, 1) forwards;
  pointer-events: none;
  transition: none;
}
@keyframes megaSwitchOut {
  from { opacity: 1; transform: translateY(0); filter: blur(0); }
  to   { opacity: 0; transform: translateY(-10px); filter: blur(4px); }
}

/* Progressive stagger: each column fades in with delay */
.nav-mega-inner.active .nav-mega-col {
  opacity: 0;
  animation: megaColIn 0.45s cubic-bezier(0.22, 0.61, 0.36, 1) forwards;
}
.nav-mega-inner.active .nav-mega-col:nth-child(1) { animation-delay: 0.06s; }
.nav-mega-inner.active .nav-mega-col:nth-child(2) { animation-delay: 0.14s; }
.nav-mega-inner.active .nav-mega-col:nth-child(3) { animation-delay: 0.22s; }
.nav-mega-inner.active .nav-mega-col:nth-child(4) { animation-delay: 0.30s; }
.nav-mega-inner.active .nav-mega-col:nth-child(5) { animation-delay: 0.38s; }
.nav-mega-inner.active .nav-mega-col:nth-child(6) { animation-delay: 0.46s; }

/* Progressive stagger: each link within a column */
.nav-mega-inner.active .nav-mega-col a {
  opacity: 0;
  animation: megaLinkIn 0.38s cubic-bezier(0.22, 0.61, 0.36, 1) forwards;
}
.nav-mega-inner.active .nav-mega-col:nth-child(1) a:nth-child(2) { animation-delay: 0.10s; }
.nav-mega-inner.active .nav-mega-col:nth-child(1) a:nth-child(3) { animation-delay: 0.14s; }
.nav-mega-inner.active .nav-mega-col:nth-child(1) a:nth-child(4) { animation-delay: 0.18s; }
.nav-mega-inner.active .nav-mega-col:nth-child(1) a:nth-child(5) { animation-delay: 0.22s; }
.nav-mega-inner.active .nav-mega-col:nth-child(1) a[href="polls.php"] { animation-delay: 0.26s; }
.nav-mega-inner.active .nav-mega-col:nth-child(1) a[href="canvas.php"] { animation-delay: 0.30s; }
.nav-mega-inner.active .nav-mega-col:nth-child(1) a[href="canvas_view.php"] { animation-delay: 0.34s; }
.nav-mega-inner.active .nav-mega-col:nth-child(2) a:nth-child(2) { animation-delay: 0.18s; }
.nav-mega-inner.active .nav-mega-col:nth-child(2) a:nth-child(3) { animation-delay: 0.22s; }
.nav-mega-inner.active .nav-mega-col:nth-child(2) a:nth-child(4) { animation-delay: 0.26s; }
.nav-mega-inner.active .nav-mega-col:nth-child(2) a:nth-child(5) { animation-delay: 0.30s; }
.nav-mega-inner.active .nav-mega-col:nth-child(3) a:nth-child(2) { animation-delay: 0.26s; }
.nav-mega-inner.active .nav-mega-col:nth-child(3) a:nth-child(3) { animation-delay: 0.30s; }
.nav-mega-inner.active .nav-mega-col:nth-child(3) a:nth-child(4) { animation-delay: 0.34s; }
.nav-mega-inner.active .nav-mega-col:nth-child(3) a:nth-child(5) { animation-delay: 0.38s; }
.nav-mega-inner.active .nav-mega-col:nth-child(4) a:nth-child(2) { animation-delay: 0.34s; }
.nav-mega-inner.active .nav-mega-col:nth-child(4) a:nth-child(3) { animation-delay: 0.38s; }
.nav-mega-inner.active .nav-mega-col:nth-child(4) a:nth-child(4) { animation-delay: 0.42s; }
.nav-mega-inner.active .nav-mega-col:nth-child(4) a:nth-child(5) { animation-delay: 0.46s; }
.nav-mega-inner.active .nav-mega-col:nth-child(5) a:nth-child(2) { animation-delay: 0.42s; }
.nav-mega-inner.active .nav-mega-col:nth-child(5) a:nth-child(3) { animation-delay: 0.46s; }
.nav-mega-inner.active .nav-mega-col:nth-child(5) a:nth-child(4) { animation-delay: 0.50s; }
.nav-mega-inner.active .nav-mega-col:nth-child(6) a:nth-child(2) { animation-delay: 0.50s; }
.nav-mega-inner.active .nav-mega-col:nth-child(6) a:nth-child(3) { animation-delay: 0.54s; }
.nav-mega-inner.active .nav-mega-col:nth-child(6) a:nth-child(4) { animation-delay: 0.58s; }

/* New destinations continue the existing link stagger without changing panel motion. */
.nav-mega-inner[data-panel="home"].active .nav-mega-col:first-child a[href="courts.php"],
.nav-mega-inner[data-panel="community"].active .nav-mega-col:first-child a[href="courts.php"] { animation-delay: 0.30s; }
.nav-mega-inner[data-panel="home"].active .nav-mega-col:first-child a[href="announcements.php"],
.nav-mega-inner[data-panel="community"].active .nav-mega-col:first-child a[href="announcements.php"] { animation-delay: 0.34s; }
.nav-mega-inner[data-panel="home"].active .nav-mega-col:first-child a[href="canvas.php"],
.nav-mega-inner[data-panel="community"].active .nav-mega-col:first-child a[href="canvas.php"] { animation-delay: 0.38s; }
.nav-mega-inner[data-panel="home"].active .nav-mega-col:first-child a[href="canvas_view.php"],
.nav-mega-inner[data-panel="community"].active .nav-mega-col:first-child a[href="canvas_view.php"] { animation-delay: 0.42s; }
.nav-mega-inner[data-panel="home"].active .nav-mega-col:first-child a[href="go.php"],
.nav-mega-inner[data-panel="community"].active .nav-mega-col:first-child a[href="go.php"] { animation-delay: 0.44s; }
.nav-mega-inner[data-panel="home"].active .nav-mega-col:first-child a[href="shared_files.php"],
.nav-mega-inner[data-panel="community"].active .nav-mega-col:first-child a[href="shared_files.php"] { animation-delay: 0.46s; }
.nav-mega-inner[data-panel="community"].active .nav-mega-col:nth-child(3) a[href="invitation.php"] { animation-delay: 0.42s; }

@keyframes megaColIn {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes megaLinkIn {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* On close, reset child animations — but NOT while .closing is running */
.nav-mega-inner:not(.active):not(.closing) .nav-mega-col {
  animation: none;
  opacity: 0;
}
.nav-mega-inner:not(.active):not(.closing) .nav-mega-col a {
  animation: none;
  opacity: 0;
}

.nav-mega-col {
  display: flex;
  flex-direction: column;
  gap: 0;
  min-width: 0;
}

/* 分类标题 — Apple 灰色小字 */
.nav-mega-heading {
  font-size: 11px;
  font-weight: 600;
  color: #86868b;
  margin-bottom: 8px;
  text-transform: none;
  letter-spacing: -0.12px;
  line-height: 1.4;
}

/* 链接 — Apple 风格超大加粗 */
.nav-mega-col a {
  font-size: 28px;
  font-weight: 800;
  color: #1d1d1f;
  text-decoration: none;
  line-height: 1.2;
  padding: 7px 0;
  transition: color 0.15s;
  white-space: nowrap;
  letter-spacing: -0.5px;
}

.nav-mega-col a + .nav-mega-heading {
  margin-top: 28px;
}

.night-mode .nav-mega-heading {
  color: #86868b;
}

.night-mode .nav-mega-col a {
  color: #f5f5f7;
}

.nav-mega-col a:hover {
  color: #86868b;
  text-decoration: none;
}

.night-mode .nav-mega-col a:hover {
  color: #a1a1a6;
}
.nav-mega-underlay { display: none; }

/* Search — between nav and user */
.nav-search-btn {
  flex-shrink: 0; margin-right: 4px; z-index: 2;
  background: none; border: none; font-size: 15px; cursor: pointer;
  padding: 4px; opacity: 0.7; transition: opacity 0.15s; color: var(--text);
  line-height: 1;
}
.nav-search-btn:hover { opacity: 1 }

/* Search overlay panel — progressive animation matching mega menu */
.search-panel {
  position: fixed; top: var(--nav-height); left: 0; right: 0;
  background: var(--nav-surface);
  z-index: 9998; padding: 16px 0;
  border-bottom: 1px solid rgba(0,0,0,0.06);
  box-shadow: 0 4px 12px rgba(0,0,0,0.06);
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  transform: translateY(-8px);
  visibility: hidden;
  transition: opacity 0.28s cubic-bezier(0.4, 0, 1, 1),
              transform 0.32s cubic-bezier(0.4, 0, 1, 1),
              visibility 0s 0.32s,
              max-height 0s 0.32s;
}
.search-panel.open {
  max-height: 80px;
  overflow: visible;
  opacity: 1;
  transform: translateY(0);
  visibility: visible;
  transition: opacity 0.35s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.35s cubic-bezier(0.22, 0.61, 0.36, 1),
              visibility 0s 0s,
              max-height 0s 0s;
}
/* Progressive input entrance */
.search-panel.open .search-panel-input {
  opacity: 0;
  animation: searchInputIn 0.35s cubic-bezier(0.22, 0.61, 0.36, 1) 0.08s forwards;
}
@keyframes searchInputIn {
  from { opacity: 0; transform: translateY(4px); }
  to   { opacity: 1; transform: translateY(0); }
}
.night-mode .search-panel {
  background: var(--nav-surface);
  border-bottom-color: var(--card-border);
  box-shadow: var(--shadow-md);
}
.search-panel-inner { max-width: 1024px; margin: 0 auto; padding: 0 22px; }
.search-panel-form { display: flex; align-items: center; gap: 8px; }
.search-panel-input {
  flex: 1; padding: 12px 16px; border: none; border-radius: 0;
  background: rgba(128,128,128,0.08); color: var(--text);
  font-size: 17px; font-family: inherit; outline: none;
  transition: background 0.2s;
}
.search-panel-input:focus { background: rgba(128,128,128,0.14); }
.search-panel-input::placeholder { color: var(--text-muted); }
.search-panel-close {
  background: none; border: none; font-size: 18px; cursor: pointer;
  padding: 8px; opacity: 0.5; transition: opacity 0.15s; color: var(--text);
  line-height: 1;
}
.search-panel-close:hover { opacity: 0.8 }

/* Right side */
.nav-right {
  flex-shrink: 0; display: flex; align-items: center; gap: 16px; z-index: 10001;
  position: relative;
}
.nav-avatar {
  display: inline-flex; align-items: center; gap: 6px; cursor: pointer;
  font-size: 12px; color: rgba(0,0,0,0.8);
  transition: color 0.2s; position: relative;
  text-decoration: none !important;
  user-select: none; -webkit-user-select: none;
}
.nav-avatar:hover { color: #000 }
.nav-avatar.nav-hover { color: #000 }
.night-mode .nav-avatar { color: rgba(255,255,255,0.75); }
.night-mode .nav-avatar:hover { color: #fff; }
.night-mode .nav-avatar.nav-hover { color: #fff; }
.nav-avatar-img { width: 26px; height: 26px; border-radius: 50%; object-fit: cover; clip-path: circle(50%); }
.nav-avatar-default { font-size: 16px; width: 26px; height: 26px; display: flex; align-items: center; justify-content: center; border-radius: 50%; overflow: hidden; }
.nav-username { font-size: 12px; font-weight: 400; }
.nav-right .btn { font-size: 12px; padding: 4px 11px; border-radius: 0; }
.night-toggle-btn {
  background: none; border: none; font-size: 15px; cursor: pointer;
  padding: 0; opacity: 0.7; transition: opacity 0.15s; color: rgba(0,0,0,0.8);
}
.night-mode .night-toggle-btn { color: rgba(255,255,255,0.75); }
.night-toggle-btn:hover { opacity: 1 }

/* Nav mega 面板内的通知徽章 */
.nav-mega-col a .nav-user-badge {
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--danger); color: #fff;
  padding: 1px 7px; border-radius: 0;
  font-size: 11px; font-weight: 600;
  vertical-align: middle;
  min-width: 18px; text-align: center;
  line-height: 1.4;
}

/* Mobile — nav always visible but compact, mega hidden */
.mobile-menu-btn { display: none !important; }

/* 菜单展开时仅模糊下方页面内容，不变暗 */
main.container.blurred,
footer.footer.blurred {
  filter: blur(5px);
  transition: filter 0.35s cubic-bezier(0.25, 0.1, 0.25, 1);
}

/* 首页含 fixed 左栏时，分别模糊两栏，避免 filter 改变 fixed 的定位参照。 */
main.container.blurred:has(.home-sidebar) { filter: none }
main.container.blurred:has(.home-sidebar) .home-sidebar,
main.container.blurred:has(.home-sidebar) .dashboard-shell {
  filter: blur(5px);
  transition: filter 0.35s cubic-bezier(0.25, 0.1, 0.25, 1);
}

@media (max-width: 834px) {
  .topbar-inner { padding: 0 12px; }
  .logo { font-size: 17px; }
  .logo-img { width: 16px; height: 16px; }
  .nav-links { display: flex !important; flex-shrink: 0; gap: 0; transform: none; }
  .topbar.is-guest .nav-links { transform: none; }
  .nav-links > li { padding: 0 6px; }
  .nav-links .nav-dropdown-label,
  .nav-links > li > a { font-size: 11px; min-width: 40px; text-align: center; }
  .nav-search-btn { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: var(--nav-height); padding: 0; font-size: 13px; }
  .mobile-menu-btn { display: none !important; }
  .nav-right { gap: 0; flex-shrink: 0; }
  .night-toggle-btn { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: var(--nav-height); padding: 0; }
  .nav-right .btn { font-size: 10px; padding: 3px 7px; }
}

@media (max-width: 480px) {
  .topbar-inner { position: relative; padding: 0 12px; }
  .logo { flex: 0 0 18px; width: 18px; overflow: hidden; font-size: 0; }
  .logo-img { width: 18px; height: 18px; margin-right: 0; }
  .nav-links {
    position: absolute;
    left: 50%;
    flex: none;
    transform: translateX(-50%);
  }
  .nav-links > li { padding: 0; }
  .nav-links .nav-dropdown-label,
  .nav-links > li > a { font-size: 10px; min-width: 36px; }
  .nav-search-btn { margin-left: auto; }
  .nav-avatar { display: none; }
  .nav-right { gap: 0; }
  .nav-right .btn { font-size: 9px; padding: 2px 5px; }
  .topbar.is-guest .nav-links {
    position: static;
    flex: 1;
    justify-content: space-evenly;
    min-width: 0;
    transform: none;
  }
  .topbar.is-guest .nav-search-btn {
    width: 36px;
    margin-left: 0;
  }
  .topbar.is-guest .night-toggle-btn { width: 36px; }
}

/* ==================== 全服共享文件 ==================== */
.shared-files-page { max-width: 900px; margin: 0 auto 64px; }
.shared-files-header {
  display: flex;
  justify-content: space-between;
  gap: 24px;
  align-items: end;
  margin-bottom: 18px;
}
.shared-files-header h1 { margin-bottom: 6px; font-size: 26px; }
.shared-files-header p { color: var(--text-secondary); font-size: 14px; }
.shared-files-balance { flex: 0 0 auto; text-align: right; }
.shared-files-balance strong { display: block; color: var(--primary); font-size: 22px; }
.shared-files-balance span,
.shared-files-usage { color: var(--text-muted); font-size: 12px; }
.shared-files-meter { height: 8px; overflow: hidden; background: var(--divider); border-radius: 4px; }
.shared-files-meter span { display: block; height: 100%; background: var(--primary); }
.shared-files-usage { margin: 7px 0 24px; text-align: right; }
.shared-files-upload {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  margin-bottom: 32px;
  padding: 18px 0 22px;
  border-top: 1px solid var(--divider);
  border-bottom: 1px solid var(--divider);
}
.shared-files-upload .form-label { margin-top: 4px; }
.shared-files-upload-footer { display: flex; justify-content: space-between; gap: 16px; align-items: center; margin-top: 8px; }
.shared-files-upload-footer small { color: var(--text-muted); }
.shared-files-list { border-top: 1px solid var(--divider); }
.shared-file-row {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: center;
  min-height: 82px;
  padding: 15px 0;
  border-bottom: 1px solid var(--divider);
}
.shared-file-main { min-width: 0; }
.shared-file-main strong { display: block; overflow-wrap: anywhere; font-size: 15px; }
.shared-file-main p { margin: 5px 0; color: var(--text-secondary); font-size: 13px; white-space: pre-wrap; }
.shared-file-main span { color: var(--text-muted); font-size: 12px; }
.shared-file-row .btn { flex: 0 0 auto; }
@media (max-width: 600px) {
  .shared-files-header { align-items: start; flex-direction: column; gap: 12px; }
  .shared-files-balance { text-align: left; }
  .shared-files-upload-footer { align-items: stretch; flex-direction: column; }
  .shared-files-upload-footer .btn { width: 100%; }
  .shared-file-row { align-items: stretch; flex-direction: column; gap: 10px; }
  .shared-file-row .btn { align-self: start; }
}

@media (max-width: 389px) {
  .logo {
    flex: 0 0 18px;
    width: 18px;
    overflow: hidden;
    font-size: 0;
  }
  .logo-img { width: 18px; height: 18px; margin-right: 0; }
  .nav-links .nav-dropdown-label,
  .nav-links > li > a { min-width: 32px; }
  .nav-avatar { display: none; }
}



/* ==================== 主容器 ==================== */

.container { max-width: 1080px; margin: 0 auto; padding: 20px }




/* ==================== 首页内容 ==================== */

.home-layout { --home-dashboard-offset: max(0px, calc(var(--home-sidebar-width, max(264px, calc((100vw - 1080px) / 2 + 284px))) + 24px - max(20px, calc((100vw - 1080px) / 2 + 20px)))); display: block }
.home-layout .feed-shell { width: 100%; max-width: none; margin: 0 }
.home-sidebar-backdrop, .home-sidebar-edge, .home-sidebar-mobile-head { display: none }
.home-sidebar { position: fixed; top: var(--nav-height); bottom: 0; left: 0; z-index: 50; width: var(--home-sidebar-width, max(264px, calc((100vw - 1080px) / 2 + 284px))); padding: 28px 20px 32px; overflow-y: auto; box-sizing: border-box; background: var(--card-bg); border-right: 1px solid var(--divider); scrollbar-width: thin; scrollbar-color: var(--divider) transparent }
.home-sidebar-content { width: 244px; max-width: 100%; margin-left: auto }
.home-sidebar-resizer { position: fixed; top: var(--nav-height); bottom: 0; left: calc(var(--home-sidebar-width, max(264px, calc((100vw - 1080px) / 2 + 284px))) - 6px); z-index: 51; width: 12px; cursor: ew-resize; touch-action: none; user-select: none }
.home-sidebar-resizer::before { content: ''; position: absolute; top: 0; bottom: 0; left: 50%; width: 1px; background: transparent; transform: translateX(-50%) }
.home-sidebar-resizer:hover::before, .home-sidebar-resizer:focus-visible::before, .home-sidebar.dragging .home-sidebar-resizer::before { background: var(--primary) }
.home-sidebar-resizer:focus-visible { outline: 0 }
.home-sidebar.dragging, .home-sidebar.dragging * { cursor: ew-resize !important; user-select: none }
.sidebar-section { padding: 0 }
.sidebar-section + .sidebar-section { margin-top: 28px }
.sidebar-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px }
.sidebar-section-heading h2 { margin: 0; color: var(--text-muted); font-size: 12px; font-weight: 600; line-height: 1.4 }
.sidebar-section-heading span, .sidebar-section-heading a { color: var(--text-muted); font-size: 11px }
.sidebar-info-list { display: flex; flex-direction: column }
.sidebar-info-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 40px; padding: 0 10px; color: var(--text-secondary); font-size: 13px }
.sidebar-info-row.current { background: var(--primary-light); color: var(--primary); font-weight: 600 }
.sidebar-info-row > span { display: flex; align-items: center; min-width: 0 }
.sidebar-info-row strong { color: var(--text-muted); font-size: 11px; font-weight: 500; white-space: nowrap }
.sidebar-info-row.current strong { color: var(--primary) }
.sidebar-info-icon { display: inline-flex; align-items: center; justify-content: center; width: 18px; margin-right: 8px; color: currentColor; font-size: 12px; font-style: normal }
.checkin-table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 11px }
.checkin-table th, .checkin-table td { height: 29px; padding: 4px; border: 1px solid var(--divider); text-align: center; white-space: nowrap }
.checkin-table thead th { color: var(--text-muted); background: var(--bg); font-weight: 500 }
.checkin-table tbody th { color: var(--text-secondary); font-weight: 500 }
.checkin-table tbody td { color: var(--text-muted) }
.checkin-table tr.current th, .checkin-table tr.current td { background: var(--primary-light); color: var(--primary); font-weight: 700 }
.checkin-summary { display: flex; justify-content: space-between; gap: 8px; margin: 10px 0; color: var(--text-muted); font-size: 11px }
.checkin-summary strong { color: var(--text) }
.checkin-button { width: 100%; text-align: center }
.checkin-button:disabled { cursor: default; opacity: .6 }
.active-tag-list { display: flex; flex-direction: column }
.active-tag-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 36px; padding: 0 8px; color: var(--text-secondary); font-size: 12px; text-decoration: none }
.active-tag-row:hover, .active-tag-row:focus-visible { background: var(--primary-light); color: var(--primary) }
.active-tag-name { display: flex; align-items: center; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap }
.active-tag-name i { width: 7px; height: 7px; margin-right: 7px; flex: 0 0 auto }
.active-tag-row > span:last-child { color: var(--text-muted); font-size: 11px }
.sidebar-empty { margin: 0; color: var(--text-muted); font-size: 12px }
.dashboard-shell, .feed-shell.posts-directory { width: 100%; max-width: none; margin: 0 }
.home-layout .dashboard-shell { width: calc(100% - var(--home-dashboard-offset)); margin-left: var(--home-dashboard-offset) }
.dashboard-header { margin-bottom: 8px }
.home-carousel { position: relative; isolation: isolate; width: 100%; aspect-ratio: 16 / 9; margin: 14px 0 24px; overflow: hidden; border-radius: 0; background: #1c1917; box-shadow: var(--shadow-sm) }
.home-carousel-track { position: absolute; inset: 0 }
.home-carousel-slide { position: absolute; inset: 0; display: block; opacity: 0; pointer-events: none; transform: scale(1.015); transition: opacity .42s var(--ease-out), transform .8s var(--ease-out) }
.home-carousel-slide.is-active { z-index: 1; opacity: 1; pointer-events: auto; transform: scale(1) }
.home-carousel-slide img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center }
.home-carousel-slide:first-child img { object-position: center 48% }
.home-carousel-slide:nth-child(2) img { object-position: center }
.home-carousel-control { position: absolute; top: 50%; z-index: 3; display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; padding: 0; border: 1px solid rgba(255,255,255,.3); border-radius: 50%; background: rgba(20,20,20,.52); box-shadow: 0 3px 10px rgba(0,0,0,.18); color: #fff; font: 400 30px/1 sans-serif; cursor: pointer; opacity: .72; transform: translateY(-50%); transition: opacity .16s ease, background .16s ease, transform .16s ease }
.home-carousel-prev { left: 12px }
.home-carousel-next { right: 12px }
.home-carousel:hover .home-carousel-control, .home-carousel:focus-within .home-carousel-control { opacity: 1 }
.home-carousel-control:hover { background: rgba(20,20,20,.72) }
.home-carousel-control:active { transform: translateY(-50%) scale(.94) }
.home-carousel-control:focus-visible, .home-carousel-dot:focus-visible, .home-carousel:focus-visible { outline: 2px solid #fff; outline-offset: 2px }
.home-carousel-dots { position: absolute; right: 0; bottom: 13px; left: 0; z-index: 3; display: flex; justify-content: center; gap: 8px; pointer-events: none }
.home-carousel-dot { width: 8px; height: 8px; padding: 0; border: 1px solid rgba(255,255,255,.8); border-radius: 50%; background: rgba(20,20,20,.38); cursor: pointer; pointer-events: auto; transition: background .18s ease, transform .18s ease }
.home-carousel-dot.is-active { background: #fff; transform: scale(1.2) }
.dashboard-section { padding: 22px 0 0; margin-top: 22px; border-top: 1px solid var(--divider) }
.dashboard-section-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 8px }
.dashboard-section-header > div > span { display: block; margin-bottom: 3px; color: var(--text-muted); font-size: 11px }
.dashboard-section-header h2 { margin: 0; color: var(--text); font-size: 18px; line-height: 1.35 }
.dashboard-section-header > a { color: var(--primary); font-size: 12px; font-weight: 600; text-decoration: none; white-space: nowrap }
.dashboard-section-header > a:hover { text-decoration: underline }
.dashboard-list { border-top: 1px solid var(--divider) }
.dashboard-row { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 74px; padding: 12px 4px; border-bottom: 1px solid var(--divider); color: var(--text); text-decoration: none }
.dashboard-row:hover { background: rgba(128,128,128,.035) }
.dashboard-row > div { min-width: 0 }
.dashboard-row strong { display: block; overflow: hidden; color: var(--text); font-size: 15px; line-height: 1.4; text-overflow: ellipsis; white-space: nowrap }
.dashboard-post-meta { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 4px; color: var(--text-muted); font-size: 11px }
.dashboard-post-meta span + span::before { content: '·'; margin-right: 12px; color: var(--divider) }
.dashboard-row p { margin: 4px 0 0; overflow: hidden; color: var(--text-muted); font-size: 12px; line-height: 1.45; text-overflow: ellipsis; white-space: nowrap }
.dashboard-row > span { flex: 0 0 auto; color: var(--text-muted); font-size: 12px; white-space: nowrap }
.dashboard-empty { padding: 24px 4px; border-bottom: 1px solid var(--divider); color: var(--text-muted); font-size: 13px }

/* 首页宣传式内容带 */
body:has(.promo-home-layout) .container { max-width:none; padding:0 }
.promo-home-layout { display:block; background:#101314 }
.promo-home-layout .dashboard-shell { width:100%; margin:0 }
.home-hero-stage { width:100%; background:#101314 }
.promo-home-layout .home-carousel { width:100%; margin:0; box-shadow:none }
.promo-home-layout .home-carousel::before { content:''; position:absolute; inset:0; z-index:2; background:rgba(4,8,10,.25); pointer-events:none }
.home-hero-copy { position:absolute; right:8%; bottom:9%; left:8%; z-index:4; max-width:720px; color:#fff; pointer-events:none; text-shadow:0 2px 18px rgba(0,0,0,.5) }
.home-hero-kicker { display:block; margin-bottom:12px; font-size:12px; font-weight:700; line-height:1.3; letter-spacing:0 }
.home-hero-copy h1 { margin:0; font-size:56px; font-weight:800; line-height:1.05; letter-spacing:0 }
.home-hero-copy p { max-width:570px; margin:16px 0 0; font-size:19px; font-weight:600; line-height:1.55; letter-spacing:0 }
.home-hero-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:24px; pointer-events:auto }
.home-hero-actions a { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:10px 18px; border:1px solid #fff; border-radius:6px; font-size:14px; font-weight:750; line-height:1.2; letter-spacing:0; text-decoration:none }
.home-hero-primary { background:#fff; color:#161616 }
.home-hero-primary:hover { background:#f5c94a; border-color:#f5c94a; color:#161616 }
.home-hero-secondary { background:rgba(10,12,14,.35); color:#fff }
.home-hero-secondary:hover { background:#fff; color:#161616 }
.home-hero-register { background:#f5c94a; border-color:#f5c94a; color:#171713 }
.home-hero-register:hover { background:#fff; border-color:#fff; color:#161616 }
.home-hero-login { min-width:92px }
.promo-home-layout .home-carousel-control { z-index:5 }
.promo-home-layout .home-carousel-dots { z-index:5 }
.home-section-inner { width:min(100%,1180px); margin:0 auto }
.home-pulse { --home-band-text:#171713; background:#f5c94a; color:var(--home-band-text) }
.home-pulse-layout { display:grid; grid-template-columns:minmax(260px,1.2fr) minmax(420px,2fr) minmax(150px,.7fr); align-items:center; gap:40px; padding:48px 20px 42px }
.home-pulse-heading>span,.home-content-band .dashboard-section-header>div>span { display:block; margin-bottom:7px; color:inherit; font-size:11px; font-weight:800; line-height:1.2; letter-spacing:0; opacity:.66 }
.home-pulse-heading h2 { margin:0; max-width:420px; font-size:36px; font-weight:800; line-height:1.08; letter-spacing:0 }
.home-pulse-stats { display:grid; grid-template-columns:repeat(4,minmax(84px,1fr)); gap:0 }
.home-pulse-stats>div { min-width:0; padding:8px 18px; border-left:1px solid rgba(23,23,19,.25) }
.home-pulse-stats dt { font-size:11px; font-weight:700; line-height:1.35; opacity:.66 }
.home-pulse-stats dd { margin-top:5px; font-size:29px; font-weight:800; line-height:1; letter-spacing:0 }
.home-pulse-stats small { margin-left:3px; font-size:11px; font-weight:700 }
.home-checkin { display:grid; justify-items:end; gap:4px; text-align:right }
.home-checkin>span { font-size:11px; opacity:.66 }
.home-checkin>strong { font-size:21px; line-height:1.2 }
.home-checkin button,.home-checkin>a { min-height:36px; margin-top:5px; padding:7px 13px; border:1px solid #171713; border-radius:5px; background:#171713; color:#fff; font-family:inherit; font-size:12px; font-weight:700; line-height:1.2; cursor:pointer; text-decoration:none }
.home-checkin button:hover,.home-checkin>a:hover { background:transparent; color:#171713 }
.home-checkin button:disabled { cursor:default; opacity:.48 }
.home-topic-strip { display:flex; align-items:center; gap:8px 18px; min-height:54px; padding:10px max(20px,calc((100vw - 1180px)/2)); overflow-x:auto; background:#101314; color:#fff; scrollbar-width:thin }
.home-topic-strip>span { flex:0 0 auto; color:#f5c94a; font-size:11px; font-weight:800 }
.home-topic-strip a { display:inline-flex; align-items:center; flex:0 0 auto; gap:6px; color:#fff; font-size:12px; text-decoration:none }
.home-topic-strip a:hover { color:#f5c94a }
.home-topic-strip i { width:7px; height:7px; flex:0 0 auto }
.home-topic-strip small { color:rgba(255,255,255,.5); font-size:10px }
.home-intro { padding:72px 20px 78px; background:#101314; color:#fff }
.home-intro-copy { display:grid; grid-template-columns:minmax(280px,.9fr) minmax(360px,1.1fr); gap:28px 64px; align-items:end }
.home-intro-copy>span { grid-column:1; color:#f5c94a; font-size:11px; font-weight:800; line-height:1.2 }
.home-intro-copy h2 { grid-column:1; margin:0; max-width:520px; font-size:42px; font-weight:800; line-height:1.08; letter-spacing:0 }
.home-intro-copy>p { grid-column:2; grid-row:1/3; margin:0; max-width:560px; align-self:end; color:#d8dddd; font-size:16px; line-height:1.8 }
.home-feature-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:24px; margin-top:58px }
.home-feature { min-width:0; padding:20px 2px 0; border-top:4px solid var(--feature-color); color:#fff; text-decoration:none }
.home-feature:hover h3 { color:var(--feature-color) }
.home-feature>span { color:var(--feature-color); font-size:10px; font-weight:800; line-height:1.2 }
.home-feature h3 { margin:13px 0 8px; color:#fff; font-size:20px; font-weight:800; line-height:1.3; letter-spacing:0 }
.home-feature p { margin:0; color:#aeb8b8; font-size:13px; line-height:1.65 }
.home-feature-discuss { --feature-color:#4bd3ad }
.home-feature-study { --feature-color:#ffb454 }
.home-feature-join { --feature-color:#8da2ff }
.home-feature-order { --feature-color:#f5c94a }
.promo-home-layout .urgent-announcements { margin:0; border:0; border-radius:0 }
.promo-home-layout .urgent-announcement-label { padding-right:max(20px,calc((100vw - 1180px)/2)); padding-left:max(20px,calc((100vw - 1180px)/2)) }
.promo-home-layout .urgent-announcement-row { padding-right:max(20px,calc((100vw - 1180px)/2)); padding-left:max(20px,calc((100vw - 1180px)/2)) }
.home-content-band.dashboard-section { margin:0; padding:68px 20px 72px; border:0; color:var(--home-band-text) }
.home-discussion-band,.home-homework-band,.home-polls-band { --home-band-text:var(--text); background:var(--bg) }
.home-content-band .dashboard-section-header { align-items:flex-end; margin-bottom:22px }
.home-content-band .dashboard-section-header h2 { color:inherit; font-size:38px; font-weight:800; line-height:1.08; letter-spacing:0 }
.home-content-band .dashboard-section-header>a { color:inherit; font-size:13px; font-weight:800 }
.home-content-band .dashboard-list { border-top:2px solid currentColor }
.home-content-band .dashboard-row { min-height:92px; padding:17px 4px; border-color:color-mix(in srgb,currentColor 22%,transparent); color:inherit }
.home-content-band .dashboard-row:hover { background:rgba(255,255,255,.22) }
.home-content-band .dashboard-row strong { color:inherit; font-size:18px; font-weight:750 }
.home-content-band .dashboard-post-meta,.home-content-band .dashboard-row p,.home-content-band .dashboard-row>span { color:inherit; opacity:.67 }
.home-content-band .dashboard-empty { border-color:color-mix(in srgb,currentColor 22%,transparent); color:inherit; opacity:.67 }
.night-mode .home-pulse { --home-band-text:#18150a; background:#e7b92f }
.night-mode .home-discussion-band,.night-mode .home-homework-band,.night-mode .home-polls-band { --home-band-text:var(--text); background:var(--bg) }
.promo-bottom-auth { padding:64px 20px 68px; background:#101314; color:#fff }
.promo-bottom-auth-inner { display:flex; align-items:center; justify-content:space-between; gap:28px }
.promo-bottom-auth-inner>div:first-child>span { color:#f5c94a; font-size:11px; font-weight:800; line-height:1.2 }
.promo-bottom-auth h2 { margin:10px 0 8px; font-size:34px; font-weight:800; line-height:1.12 }
.promo-bottom-auth p { margin:0; color:#c4cdcd; font-size:14px; line-height:1.6 }
.promo-bottom-auth-actions { display:flex; flex-wrap:wrap; gap:10px; flex:0 0 auto }

@media (max-width: 768px) {
  .home-intro-copy { grid-template-columns:1fr; gap:10px }
  .home-intro-copy>span,.home-intro-copy h2,.home-intro-copy>p { grid-column:1; grid-row:auto }
  .home-intro-copy>p { margin-top:12px }
  .home-feature-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px 18px; margin-top:42px }
  html:has(.home-sidebar), body:has(.home-sidebar) { overflow-x: hidden; overscroll-behavior-x: contain }
  .home-layout { display: block; overflow-x: clip; --home-drawer-shift: min(18vw, 72px) }
  .home-sidebar-backdrop { display: block; position: fixed; top: var(--nav-height); right: 0; bottom: 0; left: 0; z-index: 68; background: rgba(255,255,255,.2); opacity: 0; pointer-events: none; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); transition: opacity .22s ease }
  .night-mode .home-sidebar-backdrop { background: rgba(0,0,0,.26) }
  .home-sidebar-edge { display: flex; align-items: center; justify-content: flex-start; position: fixed; top: 50%; left: 4px; z-index: 81; width: 44px; height: 44px; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; color: var(--primary); cursor: pointer; touch-action: manipulation; transform: translateY(-50%); transition: color .16s ease }
  .home-sidebar-edge::after { content: ''; display: block; width: 4px; height: 36px; border: 0; border-radius: 0 2px 2px 0; background: currentColor; opacity: .9 }
  .home-sidebar-edge:hover, .home-sidebar-edge:focus-visible { background: transparent; color: var(--primary-hover) }
  .home-sidebar { position: fixed; top: var(--nav-height); bottom: 0; left: 0; z-index: 80; width: min(86vw, 340px); padding: 18px 18px 32px; overflow-y: auto; border-right: 1px solid var(--divider); background: var(--card-bg); transform: translateX(-100%); transition: transform .22s ease; will-change: transform; touch-action: pan-y }
  .home-layout.sidebar-open .home-sidebar { transform: translateX(0) }
  .home-layout.sidebar-open .home-sidebar-backdrop { opacity: 1; pointer-events: auto }
  .home-layout.sidebar-open .home-sidebar-edge, .home-layout.sidebar-dragging .home-sidebar-edge { opacity: 0; pointer-events: none; transform: translateX(-8px) }
  .home-layout .dashboard-shell { width: 100%; margin-left: 0; transition: transform .22s ease, filter .22s ease; will-change: transform, filter }
  .home-layout.sidebar-open .dashboard-shell { transform: translateX(var(--home-drawer-shift)); filter: blur(2.5px) }
  .home-layout.sidebar-dragging .home-sidebar, .home-layout.sidebar-dragging .home-sidebar-backdrop, .home-layout.sidebar-dragging .dashboard-shell { transition: none }
  .home-layout.sidebar-dragging .dashboard-shell { transform: translateX(var(--home-drawer-shift-current, 0px)); filter: blur(var(--home-drawer-blur-current, 0px)) }
  .home-sidebar-mobile-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 18px; color: var(--text) }
  .home-sidebar-mobile-head strong { font-size: 14px; line-height: 1.4 }
  .home-sidebar-close { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--text-muted); font-size: 22px; line-height: 1; cursor: pointer }
  .home-sidebar-close:hover, .home-sidebar-close:focus-visible { background: var(--primary-light); color: var(--primary) }
  .home-sidebar-content { display: block; width: auto; max-width: none; margin: 0 }
  .home-sidebar-resizer { display: none }
  .sidebar-section + .sidebar-section { margin-top: 28px }
  .sidebar-info-row { min-height: 36px; padding: 0 6px; font-size: 12px }
  .active-tag-row { min-height: 36px; padding: 0 6px }
  .checkin-table th, .checkin-table td { height: 27px; padding: 3px }
  .checkin-button { min-height: 44px }
  .dashboard-section-header { align-items: center }
  .dashboard-row { min-height: 68px; gap: 12px }
}

@media (max-width: 600px) {
  /* 首页移动端优先内容密度，避免标题和右侧统计互相挤压。 */
  body:has(.promo-home-layout) .container { padding:0 }
  .home-layout .dashboard-header { margin: 2px 0 8px; padding: 0 2px }
  .home-carousel { width:100%; margin:0 auto }
  .home-carousel-control { width: 36px; height: 36px; font-size: 28px }
  .home-carousel-prev { left: 8px }
  .home-carousel-next { right: 8px }
  .home-carousel-dots { bottom: 10px }
  .home-layout .feed-kicker { font-size: 10px }
  .home-layout .feed-heading h1 { font-size: 23px; }
  .home-layout .dashboard-section { padding-top: 16px; margin-top: 16px }
  .home-layout .dashboard-section-header { align-items: flex-end; gap: 10px; margin-bottom: 7px }
  .home-layout .dashboard-section-header h2 { font-size: 17px }
  .home-layout .dashboard-section-header > a { font-size: 11px; }
  .home-layout .dashboard-row { align-items: flex-start; gap: 8px; min-height: 0; padding: 11px 2px 12px }
  .home-layout .dashboard-row strong { font-size: 14px; line-height: 1.45; white-space: normal; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
  .home-layout .dashboard-row p { margin-top: 3px; font-size: 11px; line-height: 1.4; white-space: nowrap; }
  .home-layout .dashboard-post-meta { gap: 2px 8px; margin-top: 3px; font-size: 10px; }
  .home-layout .dashboard-post-meta span + span::before { margin-right: 8px; }
  .home-layout .dashboard-row > span { padding-top: 2px; font-size: 11px; }
  .home-layout .urgent-announcements { margin-bottom: 14px; }
  .home-hero-copy { right:18px; bottom:34px; left:18px; max-width:340px }
  .home-hero-kicker { margin-bottom:7px; font-size:9px }
  .home-hero-copy h1 { font-size:38px }
  .home-hero-copy p { max-width:310px; margin-top:9px; font-size:13px; line-height:1.45 }
  .home-hero-actions { gap:8px; margin-top:14px }
  .home-hero-actions a { min-height:38px; padding:8px 12px; font-size:11px }
  .home-carousel-control { width:32px; height:32px; font-size:24px; opacity:.82 }
  .home-carousel-prev { right:48px; left:auto }
  .home-carousel-next { right:8px }
  .home-carousel-dots { bottom:10px }
  .home-pulse-layout { grid-template-columns:1fr; gap:24px; padding:34px 16px 28px }
  .home-pulse-heading h2 { max-width:330px; font-size:28px }
  .home-pulse-stats { grid-template-columns:repeat(2,1fr) }
  .home-pulse-stats>div { padding:10px 12px; border-top:1px solid rgba(23,23,19,.22); border-left:0 }
  .home-pulse-stats dd { font-size:25px }
  .home-checkin { grid-template-columns:1fr auto; align-items:center; justify-items:start; text-align:left }
  .home-checkin>span { grid-column:1 }
  .home-checkin>strong { grid-column:1 }
  .home-checkin button,.home-checkin>a { grid-column:2; grid-row:1/3; margin:0 }
  .home-topic-strip { min-height:48px; padding:9px 16px }
  .home-intro { padding:48px 16px 54px }
  .home-intro-copy h2 { font-size:30px }
  .home-intro-copy>p { font-size:14px; line-height:1.7 }
  .home-feature-grid { grid-template-columns:1fr; gap:28px }
  .home-feature { padding-top:15px }
  .promo-home-layout .urgent-announcements { margin:0 }
  .promo-home-layout .urgent-announcement-label,.promo-home-layout .urgent-announcement-row { padding-right:16px; padding-left:16px }
  .home-content-band.dashboard-section { padding:46px 16px 50px }
  .home-content-band .dashboard-section-header { margin-bottom:16px }
  .home-content-band .dashboard-section-header h2 { font-size:29px }
  .home-content-band .dashboard-section-header>a { font-size:11px }
  .home-content-band .dashboard-row { min-height:0; padding:15px 2px }
  .home-content-band .dashboard-row strong { font-size:16px }
  .promo-bottom-auth { padding:46px 16px 50px }
  .promo-bottom-auth-inner { display:block }
  .promo-bottom-auth h2 { font-size:29px }
  .promo-bottom-auth-actions { margin-top:20px }
}

@media (prefers-reduced-motion: reduce) {
  .home-carousel-slide, .home-carousel-control, .home-carousel-dot { transition: none }
}

@media (max-width: 360px) {
  .home-sidebar { width: min(90vw, 320px) }
}



.card-header {

  display: flex; align-items: center; gap: 10px; margin-bottom: 10px;

}

.card-header .username { font-weight: 600; font-size: 14px; color: var(--text) }

.card-header .time { color: var(--text-muted); font-size: 12px; margin-left: auto }



.card { padding: 18px 22px; margin-bottom: 16px; border: 1px solid var(--card-border); border-radius: var(--radius-md); background: var(--card-bg) }

.card-title a { color: var(--text); text-decoration: none; transition: color 0.15s }

.card-title a:hover { color: var(--primary); text-decoration: none }

.card-content {

  font-size: 14px; line-height: 1.7; color: var(--text-secondary);

  word-wrap: break-word; overflow-wrap: break-word;

}

.card-content img { max-width: 100%; max-height: 420px; border-radius: var(--radius-sm); margin: 10px 0; cursor: zoom-in; transition: opacity 0.15s }

.card-content img:hover { opacity: 0.92 }

.card-footer {

  display: flex; gap: 2px; margin-top: 14px; padding-top: 12px;

  border-top: 1px solid var(--divider); flex-wrap: wrap; align-items: center;

}

/* ==================== 帖子条目（无框列表） ==================== */

.post-item {

  padding: 14px 20px;

  border-bottom: 1px solid var(--divider);

  cursor: pointer; transition: background 0.12s;

}

.post-item:first-child { padding-top: 22px }

.post-item:hover { background: rgba(128,128,128,0.03) }

.post-item-header { display: flex; align-items: center; gap: 8px; margin-bottom: 6px }

.post-avatar-preview { width: 28px; height: 28px; border-radius: 50%; object-fit: cover; flex-shrink: 0 }

.post-author { font-weight: 600; font-size: 14px; color: var(--text); text-decoration: none; margin-right: auto }

.post-meta-time { font-size: 12px; color: var(--text-muted); white-space: nowrap; margin-left: auto }

.post-item-title { font-size: 18px; font-weight: 700; margin-bottom: 8px; line-height: 1.4 }

.post-item-title a { color: var(--text); text-decoration: none }

.post-item-title a:hover { color: var(--primary) }

.post-item-content { font-size: 14px; color: var(--text-secondary); line-height: 1.6; max-height: 64px; overflow: hidden }

.post-thumb { width: auto; max-width: 48px; max-height: 40px; object-fit: cover; border-radius: 0; float: right; margin: 0 0 4px 8px }

.post-item-footer { margin-top: 4px; display: flex; align-items: center; gap: 6px }

.post-meta-hint { font-size: 12px; color: var(--primary); opacity: 0.7 }

.post-meta-time { font-size: 12px; color: var(--text-muted); white-space: nowrap; margin-left: auto }

.post-item-footer .post-actions { display: flex; gap: 2px; margin-left: auto }

.post-item-footer .post-actions .action-btn { font-size: 12px; padding: 4px 8px }



@media (max-width: 768px) {

  .post-item { padding: 14px 12px }

  .post-item-footer { flex-wrap: wrap }

}



/* ==================== 卡片尾部 ==================== */

.card-footer .post-actions {

  display: flex; gap: 2px;

}

/* 操作按钮 */

.action-btn {

  display: inline-flex; align-items: center; gap: 5px;

  padding: 6px 12px; border: none; background: none;

  color: var(--text-muted); font-size: 13px; cursor: pointer;

  border-radius: var(--radius-sm); transition: all 0.15s var(--ease);

  text-decoration: none !important; font-family: inherit;

  -webkit-tap-highlight-color: transparent;

}

.action-btn:focus-visible { outline: 2px solid var(--primary-ring); outline-offset: 1px }

.action-btn:active { transform: scale(0.97) }

.action-btn:hover { background: var(--primary-light); color: var(--primary) }

.action-btn.active { color: var(--primary); font-weight: 600 }

.action-btn.active:hover { color: var(--primary-hover) }

.action-btn.danger:hover { background: var(--danger-light); color: var(--danger) }

.action-btn .count { font-variant-numeric: tabular-nums }



/* 帖子列表首页 */

.post-feed-header {

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

  margin-bottom: 18px; flex-wrap: wrap; gap: 10px;

}

.post-feed-header h1 { font-size: 22px; font-weight: 700; letter-spacing: -0.3px }

.click-hint {

  font-size: 12px; color: var(--text-muted); margin-bottom: 2px;

  display: flex; align-items: center; gap: 4px;

}

/* ==================== 社区广场工具栏 ==================== */

.feed-shell { max-width: 800px; margin: 0 auto; }
.feed-header {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 20px; margin-bottom: 24px; padding: 0 4px;
}
.feed-heading { min-width: 0; }
.feed-kicker {
  display: block; margin-bottom: 2px; color: var(--text-muted);
  font-size: 11px; font-weight: 600; letter-spacing: 0.08em;
}
.feed-heading h1 { font-size: 26px; line-height: 1.2; font-weight: 750; }
.feed-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.feed-sort { display: flex; align-items: center; gap: 7px; color: var(--text-muted); font-size: 12px; }
.feed-sort select { min-width: 108px; cursor: pointer; color: var(--text); background: var(--card-bg); }

@media (max-width: 560px) {
  .feed-header { align-items: flex-start; flex-direction: column; gap: 14px; margin-bottom: 18px; }
  .feed-actions { width: 100%; justify-content: space-between; }
  .feed-sort { flex: 1; }
  .feed-sort select { flex: 1; min-width: 0; }
}



/* ==================== 按钮系统 ==================== */

.btn {

  display: inline-flex; align-items: center; justify-content: center; gap: 6px;

  padding: 7px 16px; border: 1.5px solid transparent; border-radius: var(--radius-sm);

  font-size: 13px; font-weight: 600; cursor: pointer; line-height: 1.4;

  transition: all 0.15s var(--ease); text-decoration: none !important;

  font-family: inherit; letter-spacing: 0.1px;

  -webkit-tap-highlight-color: transparent; box-sizing: border-box;

}

.btn:focus-visible { outline: 2px solid var(--primary-ring); outline-offset: 2px }

.btn:active { transform: scale(0.97) }

.btn-primary { background: var(--primary); color: #fff }

.btn-primary:hover { background: var(--primary-hover) }

.btn-danger { background: var(--danger); color: #fff }

.btn-danger:hover { filter: brightness(1.1) }

.btn-success { background: var(--success); color: #fff }

.btn-success:hover { filter: brightness(1.1) }

.btn-outline { background: transparent; border: 1.5px solid var(--input-border); color: var(--text); font-weight: 500 }

.btn-outline:hover { border-color: var(--primary); color: var(--primary); background: var(--primary-light) }

.btn-sm { padding: 4px 10px; font-size: 11px; border-radius: var(--radius-sm); line-height: 1.3 }

.btn-block { display: flex; width: 100% }

.btn-group { display: flex; gap: 6px; flex-wrap: wrap }



/* ==================== sticky comment bar ==================== */

.sticky-comment-bar {

  position: sticky; bottom: 0; z-index: 100;

  background: var(--card-bg); border-top: 2px solid var(--primary);

  padding: 10px 16px; margin: 16px -20px -20px; border-radius: 0 0 var(--radius-md) var(--radius-md);

}

.sticky-comment-bar textarea { flex: 1 }



/* ==================== comment layout ==================== */

.comment-main-row { display: flex; gap: 16px; align-items: flex-start }

.comment-left { flex: 1; min-width: 0 }

.comment-right { flex-shrink: 0; display: flex; flex-direction: column; align-items: flex-end; gap: 4px; padding-top: 2px }

.comment-time { font-size: 11px; color: var(--text-muted); white-space: nowrap }

.comment-actions { display: flex; gap: 4px }



/* ==================== post images gallery ==================== */

.post-images-gallery { display: flex; flex-direction: column; gap: 8px; margin-bottom: 8px }



/* ==================== 表单 ==================== */

.form-group { margin-bottom: 18px }

.form-group label {

  display: block; font-size: 13px; font-weight: 600;

  color: var(--text); margin-bottom: 6px; letter-spacing: 0.1px;

}

.form-input, .form-textarea, .form-select {

  width: 100%; padding: 10px 14px;

  border: 1.5px solid var(--input-border); border-radius: var(--radius-sm);

  background: var(--input-bg); color: var(--text);

  font-size: 15px; transition: border-color 0.15s var(--ease), box-shadow 0.15s var(--ease);

  font-family: inherit; line-height: 1.5;

}

.form-input:focus, .form-textarea:focus, .form-select:focus {

  outline: none; border-color: var(--input-focus);

  box-shadow: 0 0 0 3px var(--primary-ring);

}

.form-textarea { min-height: 120px; resize: vertical }

.form-error { color: var(--danger); font-size: 13px; margin-top: 4px; font-weight: 500 }

.form-success { color: var(--success); font-size: 13px; margin-top: 4px; font-weight: 500 }



/* ==================== Auth ==================== */

 .auth-container { max-width: 400px; margin: 32px auto }

.auth-container .card { padding: 36px 32px }

/* Cloudflare Turnstile 人机验证：flexible 宽度 + 居中，跨设备不溢出/不错位 */
.cf-turnstile {
  display: flex;
  justify-content: center;
  margin: 0 0 18px;
  width: 100%;
  min-height: 65px;
}
.cf-turnstile iframe {
  max-width: 100%;
}
/* 兼容非 flexible 渲染（回退）：窄屏按比例缩放，避免 300px 溢出 */
@media (max-width: 380px) {
  .cf-turnstile {
    transform: scale(0.92);
    transform-origin: center center;
    min-height: 72px;
  }
}

.auth-container h1 { font-size: 24px; text-align: center; margin-bottom: 28px; color: var(--text); font-weight: 700 }

.auth-footer { text-align: center; margin-top: 20px; font-size: 14px; color: var(--text-secondary) }

.agreement-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 6px }
.agreement-heading label { margin-bottom: 0 }
.agreement-heading a { flex: 0 0 auto; font-size: 12px; font-weight: 500 }

.agreement-content {
  height: min(360px, 48vh); overflow-y: auto; padding: 14px 16px;
  border: 1px solid var(--input-border); border-radius: var(--radius-sm);
  background: var(--input-bg); color: var(--text-secondary);
  font-size: 13px; line-height: 1.75; white-space: pre-wrap;
}

.agreement-content:focus {
  outline: none; border-color: var(--input-focus);
  box-shadow: 0 0 0 3px var(--primary-ring);
}

.agreement-check {
  display: flex !important; align-items: flex-start; gap: 8px;
  margin: 10px 0 0 !important; font-weight: 400 !important; line-height: 1.5; cursor: pointer;
}

.agreement-check input { width: 16px; height: 16px; margin: 2px 0 0; flex: 0 0 auto; accent-color: var(--primary) }

.agreement-page { max-width: 820px; margin: 32px auto; padding: 0 20px }
.agreement-page-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px }
.agreement-page-header h1 { margin: 0; font-size: 26px }
.agreement-document {
  padding: 28px; border: 1px solid var(--card-border); border-radius: var(--radius-md);
  background: var(--card-bg); color: var(--text); font-size: 15px; line-height: 1.85; white-space: pre-wrap;
}

@media (max-width: 600px) {
  .agreement-page { margin: 20px auto; padding: 0 12px }
  .agreement-page-header h1 { font-size: 22px }
  .agreement-document { padding: 18px 16px; font-size: 14px }
}



/* ==================== File Upload ==================== */

.file-upload-area {

  border: 2px dashed var(--input-border); border-radius: var(--radius-md);

  padding: 28px; text-align: center; cursor: pointer;

  transition: all 0.2s var(--ease); color: var(--text-muted); background: var(--input-bg);

}

.file-upload-area:hover, .file-upload-area.dragover { border-color: var(--primary); background: var(--primary-light) }

.file-upload-area .upload-icon { font-size: 32px; margin-bottom: 8px; opacity: 0.6 }

.file-upload-area input[type="file"] { display: none }

.file-preview { display: flex; align-items: center; gap: 8px; padding: 8px 12px; background: var(--bg); border-radius: var(--radius-sm); margin-top: 8px; font-size: 13px }

.file-preview .remove-file { margin-left: auto; padding: 0; border: 0; background: none; cursor: pointer; color: var(--danger); font: inherit; font-weight: 600 }

/* 进度条 */

.progress-bar { height: 5px; background: var(--divider); border-radius: 0; overflow: hidden; margin-top: 4px }

.progress-bar .progress-fill { height: 100%; border-radius: 0; background: var(--primary) }



/* ==================== Thread（帖子详情） ==================== */

/* ==================== 评论 ==================== */

.thread-container { max-width: 800px; margin: 0 auto }

.comment-item { padding: 14px 0; border-bottom: 1px solid var(--divider) }

.comment-item:last-child { border-bottom: none }

.comment-header { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; font-size: 13px }

.comment-header .username { font-weight: 600 }

.comment-content { font-size: 14px; line-height: 1.65; color: var(--text) }

.comment-main-row { display: flex; gap: 16px; align-items: flex-start }

.comment-left { flex: 1; min-width: 0 }

.comment-right { flex-shrink: 0; display: flex; flex-direction: column; align-items: flex-end; gap: 4px; padding-top: 2px }

.comment-time { font-size: 11px; color: var(--text-muted); white-space: nowrap }

.comment-actions { display: flex; gap: 4px }

.sticky-comment-bar {

  position: sticky; bottom: 0; z-index: 100;

  background: var(--card-bg); border-top: 2px solid var(--primary);

  padding: 10px 16px; margin: 16px -20px -20px; border-radius: 0 0 var(--radius-md) var(--radius-md);

}

.sticky-comment-bar textarea { flex: 1 }

/* ==================== post spacing ==================== */

.post-list { display: flex; flex-direction: column; gap: 0 }

.mb-16 { margin-bottom: 20px }



/* ==================== 徽章 ==================== */

.badge { display: inline-flex; align-items: center; gap: 3px; padding: 2px 7px; border-radius: 0; font-size: 11px; font-weight: 700; line-height: 1.4; letter-spacing: 0.2px }

.badge-admin { background: var(--badge-admin-bg); color: var(--badge-admin-color) }

.badge-precept { background: var(--badge-precept-bg); color: var(--badge-precept-color) }

.lv-badge { display: inline-flex; align-items: center; justify-content: center; border-radius: 0; font-weight: 800; line-height: 1; flex-shrink: 0; letter-spacing: -0.3px }



/* ==================== Toast 通知 ==================== */

.toast-container {

  position: fixed; top: calc(var(--nav-height) + 12px); right: 16px;

  z-index: 9999; display: flex; flex-direction: column; gap: 8px; pointer-events: none;

}

.toast {

  pointer-events: auto; padding: 13px 18px; border-radius: var(--radius-sm);

  background: var(--card-bg); border: 1px solid var(--card-border);

  box-shadow: var(--shadow-md); font-size: 14px; font-weight: 500;

  animation: toastIn 0.25s var(--ease-out); max-width: 380px;

  display: flex; align-items: center; gap: 8px;

}

.toast-success { border-color: var(--success); background: var(--success-light) }

.toast-error { border-color: var(--danger); background: var(--danger-light) }

.toast-info { border-color: var(--primary); background: var(--primary-light) }

@keyframes toastIn {

  from { opacity: 0; transform: translateX(40px) }

  to   { opacity: 1; transform: translateX(0) }

}



/* ==================== Pagination ==================== */

.pagination { display: flex; justify-content: center; gap: 4px; margin-top: 24px }

.pagination a, .pagination span {

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

  min-width: 38px; height: 38px; padding: 0 10px;

  border: 1.5px solid var(--card-border); border-radius: var(--radius-sm);

  font-size: 14px; color: var(--text); background: var(--card-bg);

  text-decoration: none !important; font-weight: 500;

  transition: all 0.15s var(--ease);

}

.pagination a:hover { background: var(--primary-light); color: var(--primary); border-color: var(--primary-ring) }

.pagination .active { background: var(--primary); color: #fff; border-color: var(--primary); font-weight: 700 }

.pagination .disabled { opacity: 0.35; pointer-events: none }



/* ==================== 通知 ==================== */

.notification-item { padding: 14px 18px; border-bottom: 1px solid var(--divider); display: flex; gap: 12px; align-items: flex-start; transition: background 0.15s }

.notification-item:last-child { border-bottom: none }

.notification-item.unread { background: var(--primary-light) }

.notification-item:hover { background: var(--bg) }

.notification-icon { font-size: 18px; flex-shrink: 0; margin-top: 1px }

.notification-content { flex: 1; font-size: 14px; line-height: 1.5 }

.notification-time { font-size: 12px; color: var(--text-muted); margin-top: 3px }

.notification-link { color: var(--link); font-weight: 600; white-space: nowrap }

.notification-toolbar, .notification-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap }

.notification-toolbar form, .notification-actions form { margin: 0 }

.notification-delete { padding: 0; border: 0; background: transparent; color: var(--danger); font: inherit; cursor: pointer }

.notification-delete:hover { text-decoration: underline }



/* ==================== 个人主页 ==================== */

.profile-header { display: flex; align-items: center; gap: 18px; margin-bottom: 18px }

.profile-avatar { width: 68px; height: 68px; border-radius: 50%; background: var(--primary-light); display: flex; align-items: center; justify-content: center; font-size: 28px; color: var(--primary); font-weight: 700; overflow: hidden; flex-shrink: 0; box-shadow: var(--shadow-sm) }

.profile-avatar img { width: 100%; height: 100%; object-fit: cover }

.profile-info { flex: 1; min-width: 0 }

.profile-info h2 { font-size: 21px; margin-bottom: 6px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap }

.profile-stats { display: flex; gap: 20px; font-size: 13px; color: var(--text-secondary); flex-wrap: wrap }
.profile-stats a { color: inherit; text-decoration: none }
.profile-stats a:hover { color: var(--primary) }
.profile-follow-form { display: inline-flex; margin-left: auto }
.profile-friend-badge { padding: 2px 6px; border: 1px solid var(--primary); color: var(--primary); font-size: 11px; font-weight: 600 }
.profile-privacy-form { display: flex; align-items: center; gap: 10px }
.profile-privacy-form label { display: flex; align-items: center; gap: 6px; font-size: 13px }
.social-list-page { max-width: 760px; margin: 0 auto }
.social-user-list { border-top: 1px solid var(--divider) }
.social-user-item { display: flex; align-items: center; gap: 12px; min-height: 58px; border-bottom: 1px solid var(--divider); color: var(--text); text-decoration: none }
.social-user-item > img, .social-user-item > span { display: grid; place-items: center; width: 36px; height: 36px; flex-shrink: 0; border-radius: 50%; background: var(--primary-light); object-fit: cover }
.social-user-item > div { display: flex; align-items: center; gap: 6px; min-width: 0 }
.social-user-item small { color: var(--primary); font-size: 11px }
.social-user-item:hover strong { color: var(--primary) }

.profile-bio {

  margin-top: 16px; padding-top: 16px;

  font-size: 14px; color: var(--text-secondary); line-height: 1.7;

  border-top: 1px solid var(--divider);

}

.profile-bio-edit {

  margin-top: 16px; padding-top: 16px;

  border-top: 1px solid var(--divider);

}

.profile-bio-edit textarea {

  font-size: 14px; width: 100%; min-height: 60px;

}

.profile-username-edit {

  margin-top: 12px; padding-top: 12px;

  border-top: 1px solid var(--divider);

}

.profile-stats .stat-num { font-weight: 700; color: var(--text) }



/* ==================== Admin ==================== */

.admin-layout { display: flex; gap: 20px; min-height: 60vh; align-items: flex-start }

.admin-sidebar { width: 200px; flex-shrink: 0; position: sticky; top: 70px; align-self: flex-start }

.admin-sidebar .card { padding: 6px 0 }

.admin-sidebar a { display: block; padding: 10px 18px; color: var(--text); font-size: 14px; text-decoration: none !important; transition: all 0.12s var(--ease); border-radius: 0; margin: 2px 6px; cursor: pointer }

.admin-sidebar a:hover, .admin-sidebar a.active { background: var(--primary-light); color: var(--primary); font-weight: 600 }

.admin-main { flex: 1; min-width: 0 }

.admin-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; margin-bottom: 20px }

.stat-card { background: var(--card-bg); border: 1px solid var(--card-border); border-radius: var(--radius-sm); padding: 20px 18px; text-align: center; transition: background 0.15s, border-color 0.15s }

.stat-card:hover { border-color: var(--primary-ring); background: var(--primary-light) }

.stat-card .stat-num { font-size: 28px; font-weight: 700; color: var(--primary); letter-spacing: -0.5px }

.stat-card .stat-label { font-size: 13px; color: var(--text-secondary); margin-top: 5px; font-weight: 500 }

/* Admin table */

.admin-table-wrap { overflow-x: auto; border-radius: var(--radius-sm); border: 1px solid var(--card-border) }

.admin-table { width: 100%; border-collapse: collapse; font-size: 13px }

.admin-table th { text-align: left; padding: 11px 14px; background: var(--bg); font-weight: 600; color: var(--text); font-size: 12px; text-transform: uppercase; letter-spacing: 0.5px; white-space: nowrap }

.admin-table td { padding: 10px 14px; border-top: 1px solid var(--divider); vertical-align: middle }

.admin-table tr:hover td { background: var(--bg) }



/* ==================== Homework ==================== */

.homework-file { display: flex; align-items: center; gap: 10px; padding: 12px 16px; background: var(--primary-light); border-radius: var(--radius-sm); margin: 10px 0; font-size: 14px; font-weight: 500; transition: background 0.15s }

.homework-file:hover { background: var(--primary-ring) }

.homework-file a { color: var(--primary); font-weight: 600 }

.homework-file .file-meta { font-size: 12px; color: var(--text-muted); margin-left: auto }

.answer-list { margin-top: 14px }

.answer-item { padding: 9px 14px; border: 1px solid var(--divider); margin-bottom: 6px; font-size: 13px; background: var(--bg); border-radius: var(--radius-sm); transition: background 0.15s }

.answer-item:hover { background: var(--success-light) }



/* ==================== 搜索 ==================== */

.search-box { display: flex; gap: 10px }



/* ==================== 错误/空状态 ==================== */

.empty-state { text-align: center; padding: 48px 20px }

.empty-state .empty-icon { font-size: 42px; margin-bottom: 12px; opacity: 0.35 }

.empty-state h2 { font-size: 18px; font-weight: 600; margin-bottom: 6px }

.empty-state p { color: var(--text-secondary); font-size: 14px; margin-bottom: 16px }

.guest-notice {

  padding: 10px 18px; background: var(--warning-light); color: var(--warning);

  text-align: center; font-size: 13px; border-radius: var(--radius-sm);

  margin-bottom: 20px; font-weight: 500; display: flex; align-items: center;

  justify-content: center; gap: 6px;

}

.guest-notice a { color: var(--warning); font-weight: 700 }


/* ==================== 标签页 ==================== */

.tags-page {
  max-width: 900px;
  margin: 0 auto;
}

/* 顶部栏 */
.tags-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}
.tags-topbar-left {
  display: flex;
  align-items: baseline;
  gap: 10px;
}
.tags-page-title {
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--text);
}
.tags-count {
  font-size: 13px;
  color: var(--text-muted);
  background: var(--primary-light);
  padding: 2px 10px;
  border-radius: var(--radius-full);
  font-weight: 500;
}
.tags-topbar-right {
  display: flex;
  align-items: center;
  gap: 10px;
}
.tags-search-form {
  position: relative;
}
.tags-search-input {
  padding: 8px 14px 8px 36px;
  border: 1.5px solid var(--input-border);
  border-radius: var(--radius-sm);
  background: var(--input-bg);
  color: var(--text);
  font-size: 14px;
  width: 220px;
  transition: border-color 0.15s, box-shadow 0.15s;
  font-family: inherit;
}
.tags-search-input:focus {
  outline: none;
  border-color: var(--input-focus);
  box-shadow: 0 0 0 3px var(--primary-ring);
}
.tags-search-input::placeholder {
  color: var(--text-muted);
}

/* 标签云 */
.tags-cloud {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  padding: 20px 24px;
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
  margin-bottom: 24px;
  line-height: 1;
}

/* 标签卡片 */
.tag-chip {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 5px 12px;
  border-radius: var(--radius-full);
  font-size: 13px;
  font-weight: 500;
  text-decoration: none;
  color: var(--text-secondary);
  background: var(--bg);
  border: 1px solid transparent;
  transition: all 0.15s var(--ease);
  white-space: nowrap;
}
.tag-chip:hover {
  color: var(--primary);
  background: var(--primary-light);
  border-color: var(--primary-ring);
  text-decoration: none;
}
.tag-chip--lg {
  font-size: 16px;
  font-weight: 700;
  padding: 7px 16px;
}
.tag-chip--md {
  font-size: 14px;
  font-weight: 600;
  padding: 6px 14px;
}
.tag-chip--active {
  color: #fff;
  background: var(--tag-color, var(--primary));
  border-color: var(--tag-color, var(--primary));
  font-weight: 600;
}
.tag-chip--active:hover {
  color: #fff;
  background: var(--tag-color, var(--primary-hover));
  filter: brightness(1.1);
}
.tag-chip-hash {
  opacity: 0.55;
}
.tag-chip-count {
  font-size: 0.82em;
  opacity: 0.6;
  margin-left: 2px;
}

/* 选中标签帖子区 */
.tags-posts-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}
.tags-posts-header h2 {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 16px;
  font-weight: 600;
}

/* 响应式 */
@media (max-width: 768px) {
  .tags-topbar {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }
  .tags-search-input {
    width: 100%;
  }
  .tags-cloud {
    padding: 14px 16px;
    gap: 6px;
  }
}



/* ==================== Footer ==================== */

.footer { background: var(--footer-bg); border-top: 1px solid var(--divider); padding: 16px 0; margin-top: 56px }

body:has(.home-sidebar) .footer { box-sizing: border-box; padding-left: var(--home-sidebar-width, max(264px, calc((100vw - 1080px) / 2 + 284px))) }

.footer-inner { max-width: 1080px; margin: 0 auto; padding: 0 20px; text-align: center; font-size: 11px; color: var(--text-muted) }

.footer-inner a { color: var(--text-muted); font-weight: 500; transition: color 0.15s }

.footer-inner a:hover { color: var(--text) }
.footer-version { white-space: nowrap }

.footer-donate { display: inline-flex; align-items: center; gap: 4px; margin-left: 2px; color: var(--danger); font-size: 11px; cursor: default; position: relative }

.footer-donate .donate-qr { display: none; width: 200px; height: 200px; border-radius: 0; position: absolute; bottom: 160%; left: 50%; transform: translateX(-50%); box-shadow: 0 4px 16px rgba(0,0,0,0.15); object-fit: contain; background: #fff; padding: 6px; z-index: 10 }

.footer-donate:hover .donate-qr { display: block }

@media (max-width: 768px) {
  body:has(.home-sidebar) .footer { padding-left: 0 }
}



/* ==================== 图片遮罩 ==================== */

.img-overlay-img { width: auto; height: auto; max-width: 94vw; max-height: 94vh; display: block; border-radius: var(--radius-md); object-fit: contain; box-shadow: var(--shadow-md) }



/* ==================== 移动端 ==================== */

/* ==================== 移动端标签栏（已移除标签侧栏，热门话题合并至导航栏首页面板） ==================== */



@media (max-width: 768px) {

  .mobile-subnav { display: none !important; }

  body { padding-bottom: 0; padding-top: var(--nav-height); }

}

/* ==================== 搜索框（Apple导航栏已在上方定义，此处不覆盖） ==================== */

/* ==================== 右侧用户区（Apple导航栏已在上方定义） ==================== */



/* 手机端二级菜单 — progressive entrance */
.mobile-subnav {

  display: none;

  background: var(--card-bg);

  border-bottom: 1px solid var(--card-border);

  padding: 6px 10px;

  overflow-x: auto;

  white-space: nowrap;

  -webkit-overflow-scrolling: touch;

  scrollbar-width: none;

}

.mobile-subnav::-webkit-scrollbar { display: none; }

.mobile-subnav a {

  display: inline-block;

  padding: 6px 14px;

  border-radius: 0;

  font-size: 13px;

  color: var(--text-secondary);

  text-decoration: none;

  margin-right: 4px;

  transition: all 0.15s cubic-bezier(0.22, 0.61, 0.36, 1);

  flex-shrink: 0;

  opacity: 0;
  animation: mobileSubIn 0.30s cubic-bezier(0.22, 0.61, 0.36, 1) forwards;

}
.mobile-subnav a:nth-child(1) { animation-delay: 0.02s; }
.mobile-subnav a:nth-child(2) { animation-delay: 0.08s; }
.mobile-subnav a:nth-child(3) { animation-delay: 0.14s; }
.mobile-subnav a:nth-child(4) { animation-delay: 0.20s; }
.mobile-subnav a:nth-child(5) { animation-delay: 0.26s; }
.mobile-subnav a:nth-child(6) { animation-delay: 0.32s; }
.mobile-subnav a:nth-child(7) { animation-delay: 0.38s; }

@keyframes mobileSubIn {
  from { opacity: 0; transform: translateY(-6px); }
  to   { opacity: 1; transform: translateY(0); }
}

.mobile-subnav a:hover,

.mobile-subnav a.active {

  background: var(--primary);

  color: #fff;

}

@media (max-width: 768px) {

  .mobile-subnav { display: none !important; }

  body { padding-top: var(--nav-height); }

}

/* 评论回复 */

.comment-reply { margin-left: 24px; padding-left: 12px; border-left: 2px solid var(--primary-ring); }

.reply-btn { font-size: 11px; color: var(--primary); cursor: pointer; background: none; border: none; padding: 2px 8px; border-radius: 0; }

.reply-btn:hover { background: var(--primary-light); }

.reply-form { display: none; margin-top: 8px; }

.reply-form textarea { width: 100%; min-height: 40px; font-size: 12px; padding: 8px; border: 1px solid var(--input-border); border-radius: 0; background: var(--input-bg); color: var(--text); resize: vertical; font-family: inherit; }

/* ==================== 投票区 ==================== */
.poll-list-item { cursor: default; }
.poll-list-item .post-item-footer { align-items: center; }
.poll-list-item .action-btn { color: var(--primary); text-decoration: none; }
.poll-create-card { margin-top: 24px; }
.poll-option-editor { display: flex; flex-direction: column; gap: 8px; }
.poll-vote-form { display: flex; flex-direction: column; gap: 10px; }
.poll-option-row {
  display: flex; align-items: center; gap: 10px; padding: 11px 13px;
  border: 1px solid var(--input-border); background: var(--input-bg);
  color: var(--text); cursor: pointer; transition: border-color .15s, background .15s;
}
.poll-option-row:hover { border-color: var(--primary); background: var(--primary-light); }
.poll-option-row input { accent-color: var(--primary); flex-shrink: 0; }
.poll-error {
  padding: 10px 12px; margin-bottom: 12px; color: var(--danger);
  border: 1px solid var(--danger); background: var(--danger-light); font-size: 13px;
}
.poll-result-row { margin-bottom: 14px; }
.poll-result-label { display: flex; justify-content: space-between; gap: 12px; font-size: 13px; line-height: 1.4; }
.poll-result-label strong { color: var(--text-secondary); white-space: nowrap; font-size: 12px; }
.poll-result-track { height: 8px; margin-top: 6px; background: var(--input-border); overflow: hidden; }
.poll-result-track span { display: block; height: 100%; background: var(--primary); transition: width .25s ease; }
.favorites-page { max-width: 800px; margin: 0 auto 72px; }
.favorites-page h1 { margin: 0; font-size: 20px; font-weight: 600; }
.favorites-tabs { display: flex; gap: 2px; margin-bottom: 14px; border-bottom: 1px solid var(--divider); }
.favorites-tabs a { padding: 9px 15px; border-bottom: 2px solid transparent; color: var(--text-muted); font-size: 13px; text-decoration: none; }
.favorites-tabs a:hover { color: var(--text); }
.favorites-tabs a.active { border-bottom-color: var(--primary); color: var(--primary); font-weight: 600; }
.favorites-item { cursor: pointer; }
.favorites-item .post-item-footer { align-items: center; }
.favorites-item .danger { margin-left: auto; }
.favorites-empty { display: flex; align-items: center; flex-direction: column; gap: 7px; padding: 52px 16px; color: var(--text-muted); text-align: center; }
.favorites-empty strong { color: var(--text); font-size: 15px; }
.favorites-empty span { font-size: 13px; }
@media (max-width: 600px) {
  .footer-version { display: none }
  .poll-result-label { align-items: flex-start; flex-direction: column; gap: 2px; }
  .poll-result-label strong { white-space: normal; }
}

/* ==================== 小法庭 ==================== */
.court-shell { max-width: 860px; margin: 0 auto 72px; }
.court-page-header { display: flex; align-items: end; justify-content: space-between; margin-bottom: 18px; }
.court-page-header h1, .court-detail-head h1 { font-size: 24px; line-height: 1.3; }
.court-list { border-top: 1px solid var(--divider); }
.court-list-item { display: grid; grid-template-columns: 88px minmax(0, 1fr) auto; gap: 16px; align-items: center; padding: 18px 2px; border-bottom: 1px solid var(--divider); color: var(--text); text-decoration: none; }
.court-list-item:hover { background: var(--hover-bg); }
.court-case-no { color: var(--text-muted); font-size: 11px; font-weight: 700; }
.court-list-main { display: flex; flex-direction: column; min-width: 0; gap: 4px; }
.court-list-main strong { overflow-wrap: anywhere; }
.court-list-main span, .court-list-meta > span:last-child { color: var(--text-muted); font-size: 12px; }
.court-list-meta { display: flex; flex-direction: column; align-items: end; gap: 6px; }
.court-status { display: inline-flex; align-items: center; min-height: 24px; padding: 2px 8px; border: 1px solid var(--divider); font-size: 12px; font-weight: 700; }
.court-status.status-voting { border-color: var(--primary); color: var(--primary); }
.court-status.status-awaiting_action { border-color: var(--warning); color: var(--warning); }
.court-status.status-resolved { border-color: var(--success); color: var(--success); }
.court-detail-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.court-band { padding: 20px 0; border-top: 1px solid var(--divider); }
.court-band h2 { margin-bottom: 12px; font-size: 16px; }
.court-parties { display: grid; grid-template-columns: 1fr 40px 1fr; align-items: center; text-align: center; }
.court-parties > div:not(.court-vs) { display: flex; flex-direction: column; gap: 5px; }
.court-parties span, .court-vs, .court-note { color: var(--text-muted); font-size: 12px; }
.court-parties strong { font-size: 18px; overflow-wrap: anywhere; }
.court-section-title, .court-score { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.court-section-title a { color: var(--primary); font-size: 13px; }
.court-report-reasons { margin-top: 12px; color: var(--text-secondary); font-size: 13px; line-height: 1.7; }
.court-result-track { display: flex; height: 10px; margin: 9px 0; overflow: hidden; background: var(--primary); }
.court-result-track span { display: block; height: 100%; background: var(--danger); }
.court-vote-form, .court-statement-form { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.court-vote-form textarea, .court-statement-form textarea { width: 100%; min-height: 92px; padding: 10px; border: 1px solid var(--input-border); background: var(--input-bg); color: var(--text); font: inherit; resize: vertical; }
.court-statement { padding: 2px 0 14px 14px; border-left: 2px solid var(--primary); }
.court-statement p { margin: 0 0 8px; color: var(--text-secondary); line-height: 1.75; overflow-wrap: anywhere; }
.court-statement time { color: var(--text-muted); font-size: 11px; }
.court-statement-form { margin-top: 16px; }
.court-statement-form textarea { min-height: 120px; }
.court-side-picker { display: grid; grid-template-columns: 1fr 1fr; width: 100%; gap: 10px; }
.court-side-picker label { display: flex; align-items: center; gap: 8px; padding: 12px; border: 1px solid var(--input-border); cursor: pointer; }
.court-vote-list article { position: relative; padding: 14px 0; border-bottom: 1px solid var(--divider); }
.court-vote-list article > div { display: flex; align-items: center; gap: 8px; }
.court-vote-list a { color: var(--text); font-weight: 700; text-decoration: none; }
.court-vote-list p { margin: 8px 0; color: var(--text-secondary); line-height: 1.7; overflow-wrap: anywhere; }
.court-vote-list time { color: var(--text-muted); font-size: 11px; }
.court-vote-side { padding: 2px 6px; border: 1px solid var(--divider); font-size: 11px; }
.court-vote-side.side-prosecution { color: var(--danger); border-color: var(--danger); }
.court-vote-side.side-defendant { color: var(--primary); border-color: var(--primary); }
.court-empty, .court-login { padding: 36px 4px; color: var(--text-muted); text-align: center; }
@media (max-width: 600px) {
  .court-list-item { grid-template-columns: 1fr auto; gap: 8px; }
  .court-case-no { grid-column: 1 / -1; }
  .court-list-meta { align-items: end; }
  .court-detail-head { align-items: flex-start; }
  .court-side-picker { grid-template-columns: 1fr; }
  .court-statement-form textarea { min-height: 140px; }
}

/* ==================== 公告区 ==================== */
.announcement-shell { max-width: 860px; margin: 0 auto 72px; }
.announcement-header { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; margin-bottom: 12px; }
.announcement-header h1 { font-size: 24px; line-height: 1.3; }
.announcement-tabs { display: flex; gap: 24px; border-bottom: 1px solid var(--divider); margin-bottom: 20px; }
.announcement-tabs a { padding: 10px 2px 8px; border-bottom: 2px solid transparent; color: var(--text-muted); text-decoration: none; font-size: 14px; }
.announcement-tabs a.active { color: var(--text); border-bottom-color: var(--primary); font-weight: 600; }
.announcement-list { border-top: 1px solid var(--divider); }
.announcement-item { padding: 20px 2px; border-bottom: 1px solid var(--divider); }
.announcement-item.importance-2 { border-left: 3px solid var(--warning); padding-left: 14px; }
.announcement-item.importance-3 { border-left: 3px solid var(--danger); padding-left: 14px; background: var(--danger-light); }
.announcement-item-head { display: flex; align-items: center; gap: 8px; color: var(--text-muted); font-size: 12px; }
.announcement-item-head time { margin-left: auto; }
.announcement-level { color: var(--text-secondary); font-weight: 700; }
.importance-2 .announcement-level { color: var(--warning); }
.importance-3 .announcement-level { color: var(--danger); }
.announcement-kind { padding-left: 8px; border-left: 1px solid var(--divider); }
.announcement-item h2 { margin-top: 8px; font-size: 18px; line-height: 1.45; overflow-wrap: anywhere; }
.announcement-content { margin-top: 8px; color: var(--text-secondary); line-height: 1.8; overflow-wrap: anywhere; }
.announcement-item footer { display: flex; justify-content: space-between; align-items: center; margin-top: 14px; color: var(--text-muted); font-size: 12px; }
.announcement-delete { border: 0; background: none; color: var(--danger); cursor: pointer; font: inherit; }
.announcement-empty { padding: 52px 8px; color: var(--text-muted); text-align: center; }
.urgent-announcements { border: 1px solid var(--danger); margin-bottom: 20px; background: var(--danger-light); }
.urgent-announcement-label { padding: 7px 12px; background: var(--danger); color: #fff; font-size: 12px; font-weight: 700; }
.urgent-announcement-row { display: grid; grid-template-columns: minmax(120px, 220px) 1fr; gap: 16px; padding: 10px 12px; border-top: 1px solid color-mix(in srgb, var(--danger) 25%, transparent); color: var(--text); text-decoration: none; }
.urgent-announcement-row:first-of-type { border-top: 0; }
.urgent-announcement-row span { color: var(--text-secondary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 600px) {
  .announcement-header { align-items: center; }
  .announcement-item { padding-right: 8px; }
  .urgent-announcement-row { grid-template-columns: 1fr; gap: 2px; }
  .urgent-announcement-row span { white-space: normal; }
}
.markdown-content > :first-child { margin-top: 0; }
.markdown-content > :last-child { margin-bottom: 0; }
.markdown-content h1, .markdown-content h2, .markdown-content h3 { margin: 18px 0 8px; line-height: 1.35; }
.markdown-content h1 { font-size: 1.45em; }
.markdown-content h2 { font-size: 1.25em; }
.markdown-content h3 { font-size: 1.1em; }
.markdown-content p { margin: 0 0 10px; white-space: pre-wrap; }
.markdown-content ul, .markdown-content ol { margin: 8px 0; padding-left: 24px; }
.markdown-content pre { padding: 12px; overflow-x: auto; border: 1px solid var(--divider); background: var(--input-bg); }
.markdown-content code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .9em; }
.markdown-content .katex-display { max-width: 100%; overflow-x: auto; overflow-y: hidden; }

/* ==================== 设置中心 ==================== */
.settings-shell {
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr);
  gap: 40px;
  max-width: 980px;
  min-height: calc(100dvh - var(--nav-height) - 180px);
  margin: 0 auto 72px;
  align-items: start;
}
.settings-sidebar {
  position: sticky;
  top: calc(var(--nav-height) + 24px);
}
.settings-sidebar h1 {
  margin-bottom: 18px;
  font-size: 24px;
  line-height: 1.25;
}
.settings-sidebar nav {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.settings-sidebar a {
  min-height: 38px;
  padding: 8px 10px;
  border-radius: var(--radius-sm);
  color: var(--text-secondary);
  text-decoration: none;
  font-size: 14px;
}
.settings-sidebar a:hover,
.settings-sidebar a:focus-visible,
.settings-sidebar a.is-active {
  background: var(--primary-light);
  color: var(--primary);
  outline: none;
}
.settings-main { min-width: 0; }
.settings-main.has-notice { padding-top: 24px; }
.settings-notice {
  scroll-margin-top: calc(var(--nav-height) + 16px);
  margin-top: 0;
  margin-bottom: 18px;
  padding: 10px 12px;
  border: 1px solid color-mix(in srgb, var(--success) 38%, var(--divider));
  border-radius: var(--radius-sm);
  background: var(--success-light);
  color: var(--text);
  font-size: 13px;
}
.settings-section {
  scroll-margin-top: calc(var(--nav-height) + 18px);
  padding: 0;
  margin: 0;
}
.settings-js .settings-section { display: none; }
.settings-js .settings-section.is-active { display: block; }
.settings-section > h2 {
  margin-bottom: 16px;
  font-size: 18px;
  line-height: 1.35;
}
.settings-form { max-width: 680px; }
.settings-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(150px, 220px);
  gap: 24px;
  align-items: center;
  min-height: 62px;
  padding: 12px 0;
  border-bottom: 1px solid var(--divider);
}
.settings-row:first-child { border-top: 1px solid var(--divider); }
.settings-row > span { display: flex; flex-direction: column; gap: 2px; }
.settings-row strong { font-size: 14px; }
.settings-row small { color: var(--text-muted); font-size: 12px; line-height: 1.45; }
.settings-font-picker { display: grid !important; grid-template-columns: minmax(150px, 1fr) minmax(110px, .65fr); gap: 8px; }
.settings-font-picker > span { display: grid; gap: 4px; }
.settings-font-picker > span[hidden] { display: none; }
.settings-row > input[type="checkbox"] {
  justify-self: end;
  width: 18px;
  height: 18px;
  accent-color: var(--primary);
}
.settings-row > input[type="color"] {
  justify-self: end;
  width: 48px;
  height: 34px;
  padding: 2px;
  border: 1px solid var(--input-border);
  border-radius: var(--radius-sm);
  background: var(--input-bg);
  cursor: pointer;
}
.settings-form > .btn { margin-top: 14px; }
.settings-account-card {
  max-width: 680px;
  margin: 0;
}
.settings-account-nav {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
  max-width: 680px;
  margin-bottom: 22px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--divider);
}
.settings-account-group { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.settings-account-group > span {
  margin-bottom: 5px;
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 600;
}
.settings-account-group-danger > span,
.settings-account-group-danger a { color: var(--danger); }
.settings-account-nav a {
  min-height: 30px;
  padding: 6px 8px;
  border-radius: var(--radius-sm);
  color: var(--text-secondary);
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
}
.settings-account-nav a:hover,
.settings-account-nav a:focus-visible,
.settings-account-nav a.is-active {
  background: var(--primary-light);
  color: var(--primary);
  outline: none;
}
.settings-js .settings-account-panel { display: none; }
.settings-js .settings-account-panel.is-active { display: block; }
.settings-device-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; padding-bottom:14px; border-bottom:1px solid var(--divider); }
.settings-device-heading strong { font-size:14px; }
.settings-device-heading p { margin:4px 0 0; color:var(--text-muted); font-size:12px; }
.settings-device-heading>span { flex:0 0 auto; color:var(--text-muted); font-size:12px; }
.settings-device-list { border-bottom:1px solid var(--divider); }
.settings-device-row { display:flex; align-items:center; justify-content:space-between; gap:18px; min-height:70px; padding:12px 0; border-bottom:1px solid var(--divider); }
.settings-device-row:last-child { border-bottom:0; }
.settings-device-main { min-width:0; }
.settings-device-main>strong { display:flex; align-items:center; flex-wrap:wrap; gap:7px; color:var(--text); font-size:13px; }
.settings-device-main>strong span { padding:1px 5px; border:1px solid var(--primary); border-radius:var(--radius-sm); color:var(--primary); font-size:10px; font-weight:600; }
.settings-device-main small { display:block; margin-top:4px; overflow-wrap:anywhere; color:var(--text-muted); font-size:11px; }
.settings-device-row form { flex:0 0 auto; }
.settings-device-empty { margin:0; padding:18px 0; color:var(--text-muted); font-size:12px; }
.settings-color-control {
  display: flex;
  justify-self: end;
  align-items: center;
  gap: 8px;
}
.settings-color-control input[type="color"] {
  width: 48px;
  height: 34px;
  padding: 2px;
  border: 1px solid var(--input-border);
  border-radius: var(--radius-sm);
  background: var(--input-bg);
  cursor: pointer;
}
.settings-danger {
  margin-top: 18px;
  border-top: 1px solid var(--divider);
  padding-top: 14px;
}
.settings-danger summary { color: var(--danger); cursor: pointer; font-size: 13px; }
.settings-danger form { display: flex; gap: 8px; margin-top: 12px; align-items: center; }
.settings-danger .btn { border-color: var(--danger); background: var(--danger); color: #fff; }
.settings-danger .form-input { max-width: 240px; }
@media (max-width: 760px) {
  .settings-shell { display: block; min-height: calc(100dvh - var(--nav-height) - 150px); margin-bottom: 48px; }
  .settings-sidebar { position: static; margin-bottom: 24px; }
  .settings-sidebar h1 { margin-bottom: 12px; font-size: 22px; }
  .settings-sidebar nav {
    flex-direction: row;
    gap: 4px;
    overflow-x: auto;
    padding-bottom: 4px;
  }
  .settings-sidebar a { flex: 0 0 auto; }
  .settings-account-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 20px; }
  .settings-row { grid-template-columns: minmax(0, 1fr) minmax(120px, 46%); gap: 14px; }
}
@media (max-width: 480px) {
  .settings-account-nav { grid-template-columns: 1fr 1fr; gap: 14px 10px; }
  .settings-row { grid-template-columns: 1fr; gap: 8px; }
  .settings-font-picker { grid-template-columns: 1fr; }
  .settings-row > input[type="checkbox"],
  .settings-row > input[type="color"],
  .settings-color-control { justify-self: start; }
  .settings-danger form { align-items: stretch; flex-direction: column; }
  .settings-danger .form-input { max-width: none; }
  .settings-device-row { align-items:flex-start; }
}
/* 邀请与勋章 */
.invite-link-row { display:flex; gap:8px; margin-top:16px; }
.invite-link-row .form-input { min-width:0; }
.invite-list > div { display:flex; justify-content:space-between; gap:16px; padding:12px 0; border-bottom:1px solid var(--border); }
.medal-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:12px; }
.medal-item { min-height:132px; display:flex; flex-direction:column; align-items:flex-start; justify-content:space-between; }
.medal-meta { display:grid; gap:3px; color:var(--text-muted); font-size:12px; }
.medal-application { display:grid; gap:14px; }
.medal-application-form { display:grid; grid-template-columns:minmax(160px,1fr) auto auto minmax(180px,1fr) auto; gap:10px; align-items:end; }
.medal-application-form label { display:grid; gap:5px; font-size:12px; color:var(--text-muted); }
.medal-application-status { display:flex; align-items:center; gap:10px; }
@media(max-width:700px){.medal-application-form{grid-template-columns:1fr}.medal-application-form label{align-items:start}}
.medal-locked { opacity:.42; }
.user-medal { border:0 !important; border-radius:var(--radius-sm) !important; white-space:nowrap; }
.user-medal:not(.badge-admin):not(.badge-precept) {
  background:color-mix(in srgb,var(--medal-accent) 22%, transparent) !important;
  color:color-mix(in srgb,var(--medal-accent) 72%, #fff) !important;
}
.settings-shortcuts { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:12px; }
@media (max-width:600px) { .invite-link-row { flex-direction:column; } }

/* 宣传页手机专属编排：与桌面宣传页保持同一内容，但采用单手浏览节奏。 */
@media (max-width:600px) {
  body:has(.promo-home-layout) { background:#101314; }
  body:has(.promo-home-layout) .site-header { position:relative; }
  .promo-home-layout .home-carousel {
    height: min(78svh, 590px);
    min-height: 470px;
    background:#0c1011;
  }
  .promo-home-layout .home-carousel::before {
    background: linear-gradient(180deg, rgba(5,8,9,.18) 8%, rgba(5,8,9,.72) 100%);
  }
  .promo-home-layout .home-carousel-slide img { object-position: center; }
  .promo-home-layout .home-hero-copy {
    right:20px;
    bottom:34px;
    left:20px;
    max-width:none;
    text-shadow:0 2px 14px rgba(0,0,0,.7);
  }
  .promo-home-layout .home-hero-kicker { margin-bottom:10px; color:#f5c94a; font-size:10px; }
  .promo-home-layout .home-hero-copy h1 { max-width:9em; font-size:clamp(34px, 11vw, 48px); line-height:1.02; }
  .promo-home-layout .home-hero-copy p { max-width:28em; margin-top:12px; font-size:14px; line-height:1.6; }
  .promo-home-layout .home-hero-actions { gap:9px; margin-top:20px; }
  .promo-home-layout .home-hero-actions a { min-height:44px; padding:11px 15px; border-radius:4px; font-size:13px; }
  .promo-home-layout .home-carousel-control { top:auto; bottom:24px; width:34px; height:34px; }
  .promo-home-layout .home-carousel-prev { right:58px; left:auto; }
  .promo-home-layout .home-carousel-next { right:18px; }
  .promo-home-layout .home-carousel-dots { right:auto; bottom:11px; left:20px; justify-content:flex-start; }

  .promo-home-layout .home-pulse-layout { gap:26px; padding:32px 20px 28px; }
  .promo-home-layout .home-pulse-heading > span { font-size:10px; }
  .promo-home-layout .home-pulse-heading h2 { max-width:11em; font-size:30px; line-height:1.08; }
  .promo-home-layout .home-pulse-stats { grid-template-columns:repeat(2, minmax(0,1fr)); gap:0; }
  .promo-home-layout .home-pulse-stats > div { min-height:74px; padding:12px 14px; border-top:1px solid rgba(23,23,19,.24); }
  .promo-home-layout .home-pulse-stats dt { font-size:10px; }
  .promo-home-layout .home-pulse-stats dd { margin-top:8px; font-size:27px; }
  .promo-home-layout .home-checkin { padding-top:2px; border-top:1px solid rgba(23,23,19,.24); }
  .promo-home-layout .home-topic-strip { min-height:50px; padding:10px 20px; }

  .promo-home-layout .home-intro { padding:52px 20px 56px; }
  .promo-home-layout .home-intro-copy { gap:12px; }
  .promo-home-layout .home-intro-copy h2 { max-width:10em; font-size:32px; line-height:1.08; }
  .promo-home-layout .home-intro-copy > p { margin-top:4px; font-size:14px; line-height:1.75; }
  .promo-home-layout .home-feature-grid { display:block; margin-top:38px; }
  .promo-home-layout .home-feature { display:grid; grid-template-columns:78px 1fr; column-gap:14px; padding:16px 0 18px; border-top-width:2px; }
  .promo-home-layout .home-feature > span { grid-column:1; grid-row:1 / span 2; padding-top:3px; font-size:9px; }
  .promo-home-layout .home-feature h3 { grid-column:2; margin:0 0 5px; font-size:18px; }
  .promo-home-layout .home-feature p { grid-column:2; font-size:12px; line-height:1.55; }

  .promo-home-layout .urgent-announcement-label { padding:13px 20px; font-size:11px; }
  .promo-home-layout .urgent-announcement-row { display:block; padding:14px 20px; }
  .promo-home-layout .urgent-announcement-row strong { display:block; margin-bottom:4px; }
  .promo-home-layout .urgent-announcement-row span { display:block; font-size:12px; line-height:1.5; }
  .promo-home-layout .home-content-band.dashboard-section { padding:48px 20px 52px; }
  .promo-home-layout .home-content-band .dashboard-section-header { align-items:flex-end; gap:12px; }
  .promo-home-layout .home-content-band .dashboard-section-header h2 { font-size:30px; }
  .promo-home-layout .home-content-band .dashboard-section-header > a { padding-bottom:2px; }
  .promo-home-layout .home-content-band .dashboard-row { min-height:0; padding:16px 0; }
  .promo-home-layout .home-content-band .dashboard-row strong { font-size:16px; line-height:1.4; white-space:normal; }
  .promo-home-layout .home-content-band .dashboard-row p { white-space:normal; line-height:1.5; }
  .promo-home-layout .promo-bottom-auth { padding:48px 20px 54px; }
  .promo-home-layout .promo-bottom-auth h2 { max-width:10em; font-size:30px; }
  .promo-home-layout .promo-bottom-auth-actions { gap:9px; }
}