/* ============================================================
 * 80_Aero_Peek - Aero 桌面预览风格论坛模板
 * 特色: 底部任务栏 + Aero Peek 缩略图 + 显示桌面透视
 * ============================================================ */

/* === CSS 变量 === */
:root{
  --ap2-primary:#4A90D9;
  --ap2-primary-dark:#2D7DD2;
  --ap2-bg-start:#6BB2D9;
  --ap2-bg-end:#4A90D9;
  --ap2-surface:rgba(255,255,255,0.7);
  --ap2-surface-solid:#FFFFFF;
  --ap2-text:#1A1A1A;
  --ap2-text-sec:#555;
  --ap2-text-mute:#999;
  --ap2-desktop:#1A1A2E;
  --ap2-border:rgba(255,255,255,0.4);
  --ap2-border-dark:rgba(74,144,217,0.3);
  --ap2-accent:#3FA0E8;
  --ap2-shadow:0 4px 20px rgba(20,40,80,0.15);
  --ap2-radius:8px;
  --ap2-taskbar-h:42px;
  --font-stack:'Segoe UI','Noto Sans SC',sans-serif;
}

/* === 基础重置 === */
*{ margin:0; padding:0; box-sizing:border-box; }
.ap2-body{
  font-family:var(--font-stack);
  background:linear-gradient(135deg,var(--ap2-bg-start) 0%,var(--ap2-bg-end) 100%);
  color:var(--ap2-text);
  font-size:14px;
  line-height:1.6;
  min-height:100vh;
  padding-bottom:calc(var(--ap2-taskbar-h) + 10px);
  position:relative;
}
.ap2-body::before{
  content:'';
  position:fixed;
  top:0; left:0; right:0; bottom:0;
  background:
    radial-gradient(ellipse at 20% 10%,rgba(255,255,255,0.15),transparent 50%),
    radial-gradient(ellipse at 80% 80%,rgba(74,144,217,0.1),transparent 50%);
  pointer-events:none;
  z-index:0;
}
a{ text-decoration:none; color:inherit; }
img{ max-width:100%; display:block; }
button{ cursor:pointer; font-family:inherit; border:none; outline:none; }
ul,ol{ list-style:none; }
svg{ display:block; }

/* === 顶部 Aero 毛玻璃导航栏 === */
.ap2-topbar{
  position:sticky;
  top:0;
  z-index:100;
  background:linear-gradient(180deg,rgba(74,144,217,0.85),rgba(45,125,210,0.75));
  backdrop-filter:blur(20px) saturate(180%);
  -webkit-backdrop-filter:blur(20px) saturate(180%);
  border-bottom:1px solid rgba(255,255,255,0.25);
  box-shadow:0 2px 12px rgba(20,40,80,0.2);
  transition:background 0.3s ease,box-shadow 0.3s ease;
}
.ap2-topbar.scrolled{
  background:linear-gradient(180deg,rgba(74,144,217,0.95),rgba(45,125,210,0.9));
  box-shadow:0 4px 20px rgba(20,40,80,0.35);
}
.ap2-topbar-inner{
  max-width:1280px;
  margin:0 auto;
  display:flex;
  align-items:center;
  gap:16px;
  padding:0 18px;
  height:54px;
}
.ap2-logo-wrap{
  display:flex;
  align-items:center;
  gap:8px;
  flex-shrink:0;
}
.ap2-logo{ width:30px; height:30px; }
.ap2-logo-text{
  font-size:16px;
  font-weight:600;
  color:#fff;
  text-shadow:0 1px 3px rgba(0,0,0,0.2);
  white-space:nowrap;
}
.ap2-nav{
  display:flex;
  align-items:center;
  gap:1px;
  flex:1;
  overflow-x:auto;
  scrollbar-width:thin;
}
.ap2-nav::-webkit-scrollbar{ height:3px; }
.ap2-nav::-webkit-scrollbar-thumb{ background:rgba(255,255,255,0.3); border-radius:2px; }
.ap2-navlink{
  padding:6px 12px;
  font-size:13px;
  color:rgba(255,255,255,0.85);
  border-radius:4px;
  white-space:nowrap;
  transition:all 0.2s ease;
  position:relative;
}
.ap2-navlink:hover{
  background:rgba(255,255,255,0.15);
  color:#fff;
}
.ap2-navlink.active{
  background:rgba(255,255,255,0.22);
  color:#fff;
  font-weight:500;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.3);
}
.ap2-navlink.active::after{
  content:'';
  position:absolute;
  bottom:-1px; left:50%;
  transform:translateX(-50%);
  width:60%; height:2px;
  background:#fff;
  border-radius:1px;
}
.ap2-topbar-right{
  display:flex;
  align-items:center;
  gap:12px;
  flex-shrink:0;
}
.ap2-search{
  display:flex;
  align-items:center;
  gap:6px;
  background:rgba(255,255,255,0.2);
  border:1px solid rgba(255,255,255,0.3);
  border-radius:16px;
  padding:3px 10px;
  transition:all 0.2s ease;
}
.ap2-search:focus-within{
  background:rgba(255,255,255,0.35);
  border-color:rgba(255,255,255,0.6);
}
.ap2-search input{
  background:transparent;
  border:none;
  outline:none;
  color:#fff;
  font-size:12px;
  width:120px;
  font-family:inherit;
}
.ap2-search input::placeholder{ color:rgba(255,255,255,0.6); }
.ap2-search svg{ width:14px; height:14px; flex-shrink:0; }
.ap2-user{
  display:flex;
  align-items:center;
  gap:6px;
  padding:3px 10px 3px 4px;
  background:rgba(255,255,255,0.15);
  border:1px solid rgba(255,255,255,0.25);
  border-radius:18px;
  color:#fff;
  font-size:12px;
  transition:all 0.2s ease;
}
.ap2-user:hover{ background:rgba(255,255,255,0.28); }
.ap2-user img{ width:24px; height:24px; border-radius:50%; }

/* === 主内容区 === */
.ap2-content{
  position:relative;
  z-index:1;
  max-width:1280px;
  margin:0 auto;
  padding:16px 18px 8px;
  transition:opacity 0.3s ease,filter 0.3s ease;
}

/* === 桌面透视效果 (Aero Peek Show Desktop) === */
.ap2-body.peek-active .ap2-content{
  opacity:0.15;
  filter:blur(2px);
}
.ap2-body.peek-active .ap2-topbar{
  opacity:0.3;
}
.ap2-peek-overlay{
  display:none;
  position:fixed;
  top:0; left:0; right:0; bottom:var(--ap2-taskbar-h);
  z-index:90;
  pointer-events:none;
}
.ap2-body.peek-active .ap2-peek-overlay{
  display:block;
  border:2px solid rgba(74,144,217,0.6);
  box-shadow:inset 0 0 60px rgba(74,144,217,0.15);
}

/* === Banner 面板 === */
.ap2-banner-panel{
  position:relative;
  border-radius:var(--ap2-radius);
  overflow:hidden;
  margin-bottom:16px;
  box-shadow:var(--ap2-shadow);
  border:1px solid var(--ap2-border);
  background:var(--ap2-surface);
  backdrop-filter:blur(10px);
}
.ap2-banner-img{ width:100%; height:180px; object-fit:cover; }
.ap2-banner-overlay{
  position:absolute;
  bottom:0; left:0; right:0;
  padding:20px 24px;
  background:linear-gradient(0deg,rgba(26,26,46,0.8),transparent);
  color:#fff;
}
.ap2-banner-overlay h1{ font-size:22px; font-weight:600; margin-bottom:4px; text-shadow:0 2px 6px rgba(0,0,0,0.4); }
.ap2-banner-overlay p{ font-size:13px; opacity:0.9; text-shadow:0 1px 3px rgba(0,0,0,0.4); }

/* === 主网格布局 === */
.ap2-main-grid{
  display:grid;

  gap:16px;
}
.ap2-main-grid-list{ grid-template-columns:1fr 260px; }

.ap2-main-grid-search{ grid-template-columns:1fr 260px; }

/* === 区域标题 === */
.ap2-section-title{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:16px;
  font-weight:600;
  color:var(--ap2-text);
  margin-bottom:12px;
  padding:8px 14px;
  background:var(--ap2-surface);
  backdrop-filter:blur(10px);
  border:1px solid var(--ap2-border);
  border-radius:var(--ap2-radius);
  box-shadow:0 2px 8px rgba(20,40,80,0.08);
}
.ap2-ico{ width:20px; height:20px; }

/* === 板块列表 === */
.ap2-boards-area{ min-width:0; }
.ap2-boards{
  display:grid;
  grid-template-columns:1fr;
  gap:8px;
  margin-bottom:16px;
}
.ap2-board{
  display:flex;
  align-items:center;
  gap:14px;
  padding:12px 16px;
  background:var(--ap2-surface);
  backdrop-filter:blur(10px);
  border:1px solid var(--ap2-border);
  border-radius:var(--ap2-radius);
  box-shadow:0 2px 8px rgba(20,40,80,0.06);
  transition:all 0.25s ease;
  position:relative;
  overflow:hidden;
}
.ap2-board::before{
  content:'';
  position:absolute;
  left:0; top:0; bottom:0;
  width:3px;
  background:var(--ap2-primary);
  opacity:0;
  transition:opacity 0.25s ease;
}
.ap2-board:hover{
  background:rgba(255,255,255,0.85);
  border-color:var(--ap2-border-dark);
  box-shadow:0 4px 16px rgba(74,144,217,0.15);
  transform:translateX(3px);
}
.ap2-board:hover::before{ opacity:1; }
.ap2-board-ico{ width:44px; height:44px; flex-shrink:0; }
.ap2-board-ico svg{ width:100%; height:100%; }
.ap2-board-info{ flex:1; min-width:0; }
.ap2-board-info h3{
  font-size:15px;
  font-weight:600;
  color:var(--ap2-text);
  margin-bottom:3px;
  display:flex;
  align-items:center;
  gap:6px;
}
.ap2-board-info p{ font-size:12px; color:var(--ap2-text-sec); margin-bottom:5px; }
.ap2-board-stat{ display:flex; gap:14px; font-size:11px; color:var(--ap2-text-mute); }
.ap2-board-arrow{ width:12px; height:12px; flex-shrink:0; opacity:0.4; transition:opacity 0.2s; }
.ap2-board:hover .ap2-board-arrow{ opacity:1; }
.ap2-hot-badge{
  display:inline-block;
  padding:1px 6px;
  font-size:10px;
  font-weight:600;
  color:#fff;
  background:#E74C3C;
  border-radius:8px;
  vertical-align:middle;
}
.ap2-board-hot{ border-color:rgba(231,76,60,0.25); }
.ap2-board-latest{
  font-size:11px;
  color:var(--ap2-primary);
  margin-top:4px;
  padding:3px 8px;
  background:rgba(74,144,217,0.08);
  border-radius:4px;
  display:inline-block;
}

/* === 双栏面板 === */
.ap2-dual-panel{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.ap2-panel{
  background:var(--ap2-surface);
  backdrop-filter:blur(10px);
  border:1px solid var(--ap2-border);
  border-radius:var(--ap2-radius);
  padding:14px 16px;
  box-shadow:0 2px 8px rgba(20,40,80,0.06);
}
.ap2-panel-h{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:14px;
  font-weight:600;
  margin-bottom:10px;
  color:var(--ap2-text);
  padding-bottom:8px;
  border-bottom:1px solid rgba(74,144,217,0.12);
}
.ap2-mini{ width:16px; height:16px; }
.ap2-hot-list li{
  display:flex;
  align-items:center;
  gap:8px;
  padding:6px 0;
  font-size:13px;
  border-bottom:1px solid rgba(0,0,0,0.04);
}
.ap2-hot-list li:last-child{ border-bottom:none; }
.ap2-rank{
  width:20px; height:20px;
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:11px;
  font-weight:700;
  color:var(--ap2-text-mute);
  background:rgba(0,0,0,0.06);
  border-radius:4px;
}
.ap2-r1{ background:#E74C3C; color:#fff; }
.ap2-r2{ background:#F39C12; color:#fff; }
.ap2-r3{ background:var(--ap2-primary); color:#fff; }
.ap2-hot-list a{ flex:1; color:var(--ap2-text-sec); transition:color 0.2s; }
.ap2-hot-list a:hover{ color:var(--ap2-primary); }
.ap2-hot-cnt{ font-size:11px; color:var(--ap2-text-mute); flex-shrink:0; }
.ap2-gallery{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:6px; }
.ap2-gallery a{ border-radius:6px; overflow:hidden; border:1px solid var(--ap2-border); transition:transform 0.2s; }
.ap2-gallery a:hover{ transform:scale(1.05); }
.ap2-gallery img{ width:100%; height:60px; object-fit:cover; }

/* === 侧边栏 === */
.ap2-sidebar{ display:flex; flex-direction:column; gap:12px; }
.ap2-side-card{
  background:var(--ap2-surface);
  backdrop-filter:blur(10px);
  border:1px solid var(--ap2-border);
  border-radius:var(--ap2-radius);
  padding:14px 16px;
  box-shadow:0 2px 8px rgba(20,40,80,0.06);
}
.ap2-side-h{
  font-size:13px;
  font-weight:600;
  color:var(--ap2-text);
  margin-bottom:10px;
  padding-bottom:6px;
  border-bottom:1px solid rgba(74,144,217,0.12);
  display:flex;
  align-items:center;
  gap:6px;
}
.ap2-side-h::before{
  content:'';
  width:3px; height:14px;
  background:var(--ap2-primary);
  border-radius:2px;
}
.ap2-stat-grid{ display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.ap2-stat-item{
  text-align:center;
  padding:10px 6px;
  background:rgba(74,144,217,0.06);
  border-radius:6px;
}
.ap2-stat-item b{ display:block; font-size:18px; font-weight:700; color:var(--ap2-primary); }
.ap2-stat-item span{ font-size:11px; color:var(--ap2-text-mute); }
.ap2-new-users{ display:flex; flex-direction:column; gap:8px; }
.ap2-new-user{ display:flex; align-items:center; gap:8px; }
.ap2-new-user img{ width:28px; height:28px; border-radius:50%; }
.ap2-new-user b{ font-size:13px; display:block; }
.ap2-new-user span{ font-size:11px; color:var(--ap2-text-mute); }
.ap2-links{ display:flex; flex-wrap:wrap; gap:6px; }
.ap2-links a{
  padding:3px 10px;
  font-size:12px;
  color:var(--ap2-text-sec);
  background:rgba(74,144,217,0.06);
  border-radius:12px;
  transition:all 0.2s;
}
.ap2-links a:hover{ background:var(--ap2-primary); color:#fff; }
.ap2-side-note{ font-size:12px; color:var(--ap2-text-sec); line-height:1.7; }
.ap2-side-hot li{ padding:5px 0; font-size:12px; border-bottom:1px solid rgba(0,0,0,0.04); }
.ap2-side-hot li:last-child{ border-bottom:none; }
.ap2-side-hot a{ color:var(--ap2-text-sec); }
.ap2-side-hot a:hover{ color:var(--ap2-primary); }
.ap2-side-ava{ width:60px; height:60px; border-radius:50%; margin:0 auto 8px; }
.ap2-user-stat li{ display:flex; justify-content:space-between; padding:4px 0; font-size:12px; border-bottom:1px solid rgba(0,0,0,0.04); }
.ap2-user-stat li:last-child{ border-bottom:none; }
.ap2-user-stat span{ color:var(--ap2-text-mute); }
.ap2-user-stat b{ color:var(--ap2-text); }
.ap2-side-thumb{ display:block; border-radius:6px; overflow:hidden; border:1px solid var(--ap2-border); }
.ap2-side-thumb img{ width:100%; height:100px; object-fit:cover; }
.ap2-mods{ display:flex; flex-direction:column; gap:8px; }
.ap2-mod{ display:flex; align-items:center; gap:8px; }
.ap2-mod img{ width:28px; height:28px; border-radius:50%; }
.ap2-mod b{ font-size:13px; display:block; }
.ap2-mod-badge{ font-size:10px; padding:1px 6px; border-radius:8px; }
.ap2-mod-main{ background:var(--ap2-primary); color:#fff; }
.ap2-mod-sub{ background:rgba(74,144,217,0.15); color:var(--ap2-primary); }

/* === 面包屑 === */
.ap2-crumb{
  display:flex;
  align-items:center;
  gap:4px;
  font-size:13px;
  color:var(--ap2-text-sec);
  padding:8px 14px;
  margin-bottom:12px;
  background:var(--ap2-surface);
  backdrop-filter:blur(10px);
  border:1px solid var(--ap2-border);
  border-radius:var(--ap2-radius);
  box-shadow:0 2px 6px rgba(20,40,80,0.05);
}
.ap2-crumb a{ display:flex; align-items:center; gap:3px; color:var(--ap2-primary); }
.ap2-crumb a svg{ width:14px; height:14px; }
.ap2-crumb a:hover{ text-decoration:underline; }
.ap2-crumb-sep{ color:var(--ap2-text-mute); }
.ap2-crumb-cur{ color:var(--ap2-text); font-weight:500; }

/* === 板块信息头 === */
.ap2-board-head{
  display:flex;
  align-items:center;
  gap:14px;
  padding:14px 16px;
  margin-bottom:12px;
  background:var(--ap2-surface);
  backdrop-filter:blur(10px);
  border:1px solid var(--ap2-border);
  border-radius:var(--ap2-radius);
  box-shadow:0 2px 8px rgba(20,40,80,0.06);
}
.ap2-board-head-ico{ width:48px; height:48px; flex-shrink:0; }
.ap2-board-head-text{ flex:1; }
.ap2-board-head-text h1{ font-size:18px; font-weight:600; color:var(--ap2-text); }
.ap2-board-head-text p{ font-size:12px; color:var(--ap2-text-sec); margin-top:3px; }
.ap2-post-btn{
  display:flex;
  align-items:center;
  gap:5px;
  padding:8px 18px;
  background:linear-gradient(180deg,var(--ap2-accent),var(--ap2-primary));
  color:#fff;
  border-radius:6px;
  font-size:13px;
  font-weight:500;
  box-shadow:0 2px 8px rgba(74,144,217,0.35);
  transition:all 0.2s;
  flex-shrink:0;
}
.ap2-post-btn:hover{ box-shadow:0 4px 14px rgba(74,144,217,0.5); transform:translateY(-1px); }
.ap2-post-btn svg{ width:14px; height:14px; }

/* === 帖子列表 === */
.ap2-threads{
  background:var(--ap2-surface);
  backdrop-filter:blur(10px);
  border:1px solid var(--ap2-border);
  border-radius:var(--ap2-radius);
  overflow:hidden;
  box-shadow:0 2px 8px rgba(20,40,80,0.06);
}
.ap2-thread-head{
  display:grid;
  grid-template-columns:1fr 120px 80px 140px;
  gap:10px;
  padding:8px 16px;
  font-size:12px;
  font-weight:600;
  color:var(--ap2-text-mute);
  background:rgba(74,144,217,0.08);
  border-bottom:1px solid var(--ap2-border-dark);
}
.ap2-thread{
  display:grid;
  grid-template-columns:1fr 120px 80px 140px;
  gap:10px;
  align-items:center;
  padding:10px 16px;
  border-bottom:1px solid rgba(0,0,0,0.04);
  transition:background 0.2s ease;
}
.ap2-thread:last-child{ border-bottom:none; }
.ap2-thread:hover{ background:rgba(74,144,217,0.05); }
.ap2-th-title{ display:flex; align-items:center; gap:6px; min-width:0; }
.ap2-flag{
  flex-shrink:0;
  padding:1px 6px;
  font-size:10px;
  font-weight:600;
  border-radius:3px;
}
.ap2-flag-top{ background:#E74C3C; color:#fff; }
.ap2-flag-ess{ background:#F39C12; color:#fff; }
.ap2-th-text{
  font-size:13px;
  color:var(--ap2-text);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  transition:color 0.2s;
}
.ap2-thread:hover .ap2-th-text{ color:var(--ap2-primary); }
.ap2-th-author{ display:flex; align-items:center; gap:6px; font-size:12px; color:var(--ap2-text-sec); }
.ap2-th-author img{ width:22px; height:22px; border-radius:50%; }
.ap2-th-reply{ text-align:center; }
.ap2-th-reply b{ font-size:14px; color:var(--ap2-text); }
.ap2-th-reply span{ display:block; font-size:11px; color:var(--ap2-text-mute); }
.ap2-th-last{ display:flex; align-items:center; gap:6px; font-size:11px; }
.ap2-th-last img{ width:22px; height:22px; border-radius:50%; }
.ap2-th-last b{ font-size:12px; color:var(--ap2-text-sec); display:block; }
.ap2-th-last span{ font-size:11px; color:var(--ap2-text-mute); }

/* === 分页 === */
.ap2-pager{
  display:flex;
  align-items:center;
  gap:4px;
  justify-content:center;
  padding:14px 0 4px;
  flex-wrap:wrap;
}
.ap2-pg{
  padding:5px 12px;
  font-size:13px;
  color:var(--ap2-text-sec);
  background:var(--ap2-surface);
  backdrop-filter:blur(10px);
  border:1px solid var(--ap2-border);
  border-radius:5px;
  transition:all 0.2s;
}
.ap2-pg:hover{ background:rgba(74,144,217,0.1); border-color:var(--ap2-primary); color:var(--ap2-primary); }
.ap2-pg-active{ background:var(--ap2-primary); color:#fff; border-color:var(--ap2-primary); }
.ap2-pg-active:hover{ background:var(--ap2-primary-dark); color:#fff; }
.ap2-pg-disabled{ opacity:0.4; pointer-events:none; }
.ap2-pg-ellipsis{ padding:5px 4px; color:var(--ap2-text-mute); }

/* === 帖子详情 === */
.ap2-d-title{ font-size:20px; font-weight:600; color:var(--ap2-text); margin-bottom:8px; padding:0 4px; }
.ap2-d-meta{
  display:flex;
  gap:14px;
  font-size:12px;
  color:var(--ap2-text-mute);
  padding:8px 14px;
  margin-bottom:12px;
  background:var(--ap2-surface);
  backdrop-filter:blur(10px);
  border:1px solid var(--ap2-border);
  border-radius:var(--ap2-radius);
  flex-wrap:wrap;
}
.ap2-d-meta b{ color:var(--ap2-primary); }
.ap2-floor{
  display:flex;
  gap:0;
  background:var(--ap2-surface);
  backdrop-filter:blur(10px);
  border:1px solid var(--ap2-border);
  border-radius:var(--ap2-radius);
  margin-bottom:10px;
  overflow:hidden;
  box-shadow:0 2px 8px rgba(20,40,80,0.06);
}
.ap2-floor-op{ border-color:rgba(74,144,217,0.35); box-shadow:0 2px 12px rgba(74,144,217,0.1); }
.ap2-floor-side{
  width:130px;
  flex-shrink:0;
  padding:14px 10px;
  text-align:center;
  background:rgba(74,144,217,0.06);
  border-right:1px solid var(--ap2-border-dark);
}
.ap2-floor-ava{ width:50px; height:50px; border-radius:50%; margin:0 auto 6px; border:2px solid rgba(255,255,255,0.6); }
.ap2-floor-name{ font-size:13px; font-weight:600; color:var(--ap2-text); }
.ap2-floor-lv{ font-size:11px; color:var(--ap2-primary); margin-top:2px; }
.ap2-floor-meta{ margin-top:8px; display:flex; flex-direction:column; gap:3px; font-size:10px; color:var(--ap2-text-mute); }
.ap2-floor-main{ flex:1; padding:12px 16px; min-width:0; }
.ap2-floor-top{ display:flex; align-items:center; gap:8px; margin-bottom:8px; }
.ap2-floor-tag{
  padding:2px 8px;
  font-size:10px;
  font-weight:600;
  border-radius:3px;
  color:#fff;
}
.ap2-tag-op{ background:var(--ap2-primary); }
.ap2-tag-sofa{ background:#E74C3C; }
.ap2-tag-bench{ background:#F39C12; }
.ap2-tag-floor{ background:#27AE60; }
.ap2-tag-n{ background:#8E44AD; }
.ap2-floor-time{ font-size:11px; color:var(--ap2-text-mute); }
.ap2-floor-content p{ font-size:13px; color:var(--ap2-text); margin-bottom:10px; line-height:1.8; }
.ap2-d-img{ max-width:400px; border-radius:6px; border:1px solid var(--ap2-border); margin:8px 0; }
.ap2-floor-act{ display:flex; gap:6px; margin-top:8px; padding-top:8px; border-top:1px solid rgba(0,0,0,0.04); }
.ap2-act-btn{
  display:flex;
  align-items:center;
  gap:4px;
  padding:4px 12px;
  font-size:12px;
  color:var(--ap2-text-sec);
  background:rgba(255,255,255,0.5);
  border:1px solid rgba(0,0,0,0.08);
  border-radius:4px;
  transition:all 0.2s;
}
.ap2-act-btn:hover{ background:rgba(74,144,217,0.1); border-color:var(--ap2-primary); color:var(--ap2-primary); }
.ap2-act-btn svg{ width:14px; height:14px; }
.ap2-act-btn.liked{ color:var(--ap2-primary); font-weight:600; }

/* === 回复框 === */
.ap2-reply-box{
  background:var(--ap2-surface);
  backdrop-filter:blur(10px);
  border:1px solid var(--ap2-border);
  border-radius:var(--ap2-radius);
  padding:14px 16px;
  margin-top:12px;
  box-shadow:0 2px 8px rgba(20,40,80,0.06);
}
.ap2-reply-h{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:14px;
  font-weight:600;
  margin-bottom:10px;
  color:var(--ap2-text);
}
.ap2-reply-text{
  width:100%;
  height:100px;
  padding:10px 12px;
  border:1px solid rgba(74,144,217,0.2);
  border-radius:6px;
  font-size:13px;
  resize:vertical;
  outline:none;
  font-family:inherit;
  background:rgba(255,255,255,0.6);
  transition:all 0.2s;
}
.ap2-reply-text:focus{ border-color:var(--ap2-primary); box-shadow:0 0 0 2px rgba(74,144,217,0.15); background:#fff; }
.ap2-reply-tool{ display:flex; gap:6px; align-items:center; margin-top:8px; flex-wrap:wrap; }
.ap2-reply-tool-btn{
  padding:4px 10px;
  font-size:12px;
  color:var(--ap2-text-sec);
  background:rgba(255,255,255,0.5);
  border:1px solid rgba(0,0,0,0.08);
  border-radius:4px;
  transition:all 0.2s;
}
.ap2-reply-tool-btn:hover{ background:rgba(74,144,217,0.1); color:var(--ap2-primary); }
.ap2-reply-submit{
  margin-left:auto;
  padding:7px 22px;
  background:linear-gradient(180deg,var(--ap2-accent),var(--ap2-primary));
  color:#fff;
  border-radius:5px;
  font-size:13px;
  font-weight:500;
  box-shadow:0 2px 8px rgba(74,144,217,0.35);
  transition:all 0.2s;
}
.ap2-reply-submit:hover{ box-shadow:0 4px 14px rgba(74,144,217,0.5); }

/* === 搜索页 === */
.ap2-search-hero{
  background:var(--ap2-surface);
  backdrop-filter:blur(12px);
  border:1px solid var(--ap2-border);
  border-radius:var(--ap2-radius);
  padding:26px 24px;
  text-align:center;
  margin-bottom:16px;
  box-shadow:var(--ap2-shadow);
}
.ap2-search-hero-title{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  font-size:22px;
  font-weight:600;
  color:var(--ap2-text);
  margin-bottom:16px;
}
.ap2-search-hero-ico{ width:28px; height:28px; }
.ap2-search-hero-box{ display:flex; gap:8px; max-width:560px; margin:0 auto; }
.ap2-search-hero-input{
  flex:1;
  padding:10px 16px;
  font-size:14px;
  border:2px solid var(--ap2-primary);
  border-radius:6px;
  outline:none;
  font-family:inherit;
  background:rgba(255,255,255,0.8);
}
.ap2-search-hero-btn{
  display:flex;
  align-items:center;
  gap:5px;
  padding:0 24px;
  background:linear-gradient(180deg,var(--ap2-accent),var(--ap2-primary));
  color:#fff;
  border-radius:6px;
  font-size:14px;
  font-weight:500;
  box-shadow:0 2px 8px rgba(74,144,217,0.35);
  transition:all 0.2s;
}
.ap2-search-hero-btn:hover{ box-shadow:0 4px 14px rgba(74,144,217,0.5); }
.ap2-search-hero-btn svg{ width:14px; height:14px; }
.ap2-search-hero-meta{ font-size:13px; color:var(--ap2-text-sec); margin-top:14px; }
.ap2-search-hero-meta b{ color:var(--ap2-primary); font-size:15px; }

.ap2-filter-bar{
  display:flex;
  align-items:center;
  gap:5px;
  flex-wrap:wrap;
  background:var(--ap2-surface);
  backdrop-filter:blur(10px);
  border:1px solid var(--ap2-border);
  border-radius:var(--ap2-radius);
  padding:10px 14px;
  margin-bottom:12px;
  box-shadow:0 2px 6px rgba(20,40,80,0.05);
}
.ap2-filter-label{ font-size:12px; color:var(--ap2-text-sec); font-weight:500; }
.ap2-filter-tag{
  padding:3px 11px;
  font-size:12px;
  color:var(--ap2-text-sec);
  background:rgba(255,255,255,0.5);
  border:1px solid rgba(0,0,0,0.08);
  border-radius:14px;
  transition:all 0.2s;
}
.ap2-filter-tag:hover{ border-color:var(--ap2-primary); color:var(--ap2-primary); }
.ap2-filter-active{ background:var(--ap2-primary); color:#fff; border-color:var(--ap2-primary); }
.ap2-filter-sort{ margin-left:auto; font-size:12px; color:var(--ap2-text-mute); }
.ap2-filter-sort select{ padding:2px 6px; border-radius:3px; border:1px solid rgba(0,0,0,0.1); font-family:inherit; }

.ap2-search-results{
  background:var(--ap2-surface);
  backdrop-filter:blur(10px);
  border:1px solid var(--ap2-border);
  border-radius:var(--ap2-radius);
  padding:4px 16px;
  box-shadow:0 2px 8px rgba(20,40,80,0.06);
}
.ap2-result-item{ padding:14px 0; border-bottom:1px solid rgba(0,0,0,0.05); }
.ap2-result-item:last-child{ border-bottom:none; }
.ap2-result-title a{ font-size:15px; color:var(--ap2-primary); font-weight:500; }
.ap2-result-title a:hover{ text-decoration:underline; }
.ap2-result-snippet{ font-size:13px; color:var(--ap2-text-sec); margin:6px 0; line-height:1.7; }
.ap2-result-snippet em{ color:var(--ap2-primary); font-style:normal; font-weight:600; background:#FFF3D6; padding:0 3px; border-radius:2px; }
.ap2-result-meta{ display:flex; gap:14px; font-size:11px; color:var(--ap2-text-mute); flex-wrap:wrap; }
.ap2-result-board{ color:var(--ap2-primary); font-weight:500; }

.ap2-hot-tags{ display:flex; flex-wrap:wrap; gap:6px; }
.ap2-hot-tag{
  padding:3px 12px;
  font-size:12px;
  color:var(--ap2-text-sec);
  background:rgba(74,144,217,0.08);
  border-radius:12px;
  transition:all 0.2s;
}
.ap2-hot-tag:hover{ background:var(--ap2-primary); color:#fff; }
.ap2-search-history li{ padding:5px 0; font-size:12px; border-bottom:1px solid rgba(0,0,0,0.04); }
.ap2-search-history li:last-child{ border-bottom:none; }
.ap2-search-history a{ color:var(--ap2-text-sec); }
.ap2-search-history a:hover{ color:var(--ap2-primary); }

/* === 底部 Aero 任务栏 === */
.ap2-taskbar{
  position:fixed;
  bottom:0; left:0; right:0;
  height:var(--ap2-taskbar-h);
  background:linear-gradient(180deg,rgba(40,50,80,0.85),rgba(26,26,46,0.9));
  backdrop-filter:blur(20px) saturate(180%);
  -webkit-backdrop-filter:blur(20px) saturate(180%);
  border-top:1px solid rgba(255,255,255,0.15);
  box-shadow:0 -2px 16px rgba(0,0,0,0.25);
  display:flex;
  align-items:center;
  z-index:200;
  transition:opacity 0.3s ease;
}
.ap2-body.peek-active .ap2-taskbar{ opacity:0.95; }
.ap2-taskbar-start{
  display:flex;
  align-items:center;
  gap:6px;
  padding:0 18px;
  height:100%;
  color:#fff;
  font-size:13px;
  font-weight:500;
  border-right:1px solid rgba(255,255,255,0.1);
  cursor:pointer;
  transition:background 0.2s;
}
.ap2-taskbar-start:hover{ background:rgba(255,255,255,0.1); }
.ap2-start-ico{ width:22px; height:22px; }
.ap2-taskbar-tasks{
  flex:1;
  display:flex;
  align-items:center;
  gap:3px;
  padding:0 8px;
  height:100%;
  overflow-x:auto;
  scrollbar-width:none;
}
.ap2-taskbar-tasks::-webkit-scrollbar{ display:none; }
.ap2-task{
  position:relative;
  display:flex;
  align-items:center;
  gap:5px;
  padding:0 12px;
  height:32px;
  min-width:110px;
  max-width:180px;
  color:rgba(255,255,255,0.85);
  font-size:12px;
  background:rgba(255,255,255,0.08);
  border:1px solid rgba(255,255,255,0.1);
  border-radius:5px;
  cursor:pointer;
  transition:all 0.2s ease;
  overflow:hidden;
}
.ap2-task svg{ width:14px; height:14px; flex-shrink:0; }
.ap2-task span{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ap2-task:hover{ background:rgba(255,255,255,0.18); border-color:rgba(255,255,255,0.25); box-shadow:0 0 12px rgba(74,144,217,0.3); }
.ap2-task-active{
  background:rgba(74,144,217,0.25);
  border-color:rgba(74,144,217,0.4);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.15);
}
.ap2-task-active::after{
  content:'';
  position:absolute;
  bottom:1px; left:8px; right:8px;
  height:2px;
  background:var(--ap2-accent);
  border-radius:1px;
}

/* === Aero Peek 缩略图预览 === */
.ap2-thumb{
  position:absolute;
  bottom:calc(100% + 8px);
  left:50%;
  transform:translateX(-50%) scale(0.9);
  width:200px;
  background:rgba(255,255,255,0.95);
  backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,0.5);
  border-radius:8px;
  box-shadow:0 8px 32px rgba(0,0,0,0.35);
  opacity:0;
  visibility:hidden;
  transition:all 0.25s ease;
  z-index:300;
  overflow:hidden;
  pointer-events:none;
}
.ap2-task:hover .ap2-thumb{
  opacity:1;
  visibility:visible;
  transform:translateX(-50%) scale(1);
}
.ap2-thumb-title{
  padding:6px 10px;
  font-size:11px;
  font-weight:600;
  color:var(--ap2-text);
  background:rgba(74,144,217,0.08);
  border-bottom:1px solid rgba(0,0,0,0.06);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.ap2-thumb-body{ padding:8px 10px; }
.ap2-thumb-banner{ width:100%; height:30px; background:linear-gradient(135deg,var(--ap2-primary),var(--ap2-accent)); border-radius:3px; margin-bottom:6px; }
.ap2-thumb-lines{ display:flex; flex-direction:column; gap:4px; }
.ap2-thumb-lines span{ height:5px; background:rgba(74,144,217,0.15); border-radius:2px; }
.ap2-thumb-lines span:nth-child(2){ width:80%; }
.ap2-thumb-lines span:nth-child(3){ width:60%; }
.ap2-thumb-list{ display:flex; flex-direction:column; gap:5px; }
.ap2-thumb-list span{ height:8px; background:rgba(74,144,217,0.12); border-radius:2px; }
.ap2-thumb-list span:nth-child(2){ width:90%; }
.ap2-thumb-list span:nth-child(3){ width:75%; }
.ap2-thumb-list span:nth-child(4){ width:85%; }
.ap2-thumb-detail{ display:flex; flex-direction:column; gap:5px; }
.ap2-thumb-detail span{ height:6px; background:rgba(74,144,217,0.12); border-radius:2px; }
.ap2-thumb-detail span:nth-child(2){ width:95%; }
.ap2-thumb-detail span:nth-child(3){ width:70%; }
.ap2-thumb-search{ display:flex; flex-direction:column; gap:5px; }
.ap2-thumb-search span{ height:8px; background:rgba(74,144,217,0.12); border-radius:2px; }
.ap2-thumb-search span:nth-child(2){ width:80%; }

/* === 系统托盘 === */
.ap2-taskbar-tray{
  display:flex;
  align-items:center;
  gap:8px;
  padding:0 8px 0 12px;
  height:100%;
  border-left:1px solid rgba(255,255,255,0.1);
}
.ap2-tray-ico{ width:18px; height:18px; cursor:pointer; opacity:0.8; transition:opacity 0.2s; }
.ap2-tray-ico:hover{ opacity:1; }
.ap2-tray-clock{
  color:rgba(255,255,255,0.85);
  font-size:12px;
  font-variant-numeric:tabular-nums;
  letter-spacing:0.5px;
  cursor:default;
}
.ap2-show-desktop{
  width:18px;
  height:100%;
  cursor:pointer;
  display:flex;
  align-items:center;
  border-left:1px solid rgba(255,255,255,0.1);
  padding-left:8px;
  transition:background 0.2s;
}
.ap2-show-desktop svg{ width:16px; height:16px; opacity:0.8; transition:opacity 0.2s; }
.ap2-show-desktop:hover svg{ opacity:1; }
.ap2-show-desktop:hover{ background:rgba(255,255,255,0.08); }

/* === Toast 提示 === */
.ap2-toast{
  position:fixed;
  bottom:calc(var(--ap2-taskbar-h) + 20px);
  left:50%;
  transform:translateX(-50%) translateY(20px);
  background:linear-gradient(180deg,rgba(40,50,80,0.95),rgba(26,26,46,0.95));
  backdrop-filter:blur(14px);
  color:#fff;
  padding:12px 28px;
  border-radius:8px;
  border:1px solid rgba(74,144,217,0.3);
  font-size:14px;
  box-shadow:0 6px 24px rgba(0,0,0,0.35);
  opacity:0;
  transition:all 0.3s ease;
  z-index:9999;
  pointer-events:none;
}
.ap2-toast.show{ opacity:1; transform:translateX(-50%) translateY(0); }

/* === 滚动条 === */
::-webkit-scrollbar{ width:8px; height:8px; }
::-webkit-scrollbar-track{ background:rgba(0,0,0,0.05); }
::-webkit-scrollbar-thumb{ background:rgba(74,144,217,0.3); border-radius:4px; }
::-webkit-scrollbar-thumb:hover{ background:rgba(74,144,217,0.5); }

/* === 响应式 === */
@media (max-width:980px){
  .ap2-main-grid,
  .ap2-main-grid-list,
  .ap2-main-grid-detail,
  .ap2-main-grid-search{ grid-template-columns:1fr; }
  .ap2-dual-panel{ grid-template-columns:1fr; }
  .ap2-thread-head{ grid-template-columns:1fr 80px 60px 100px; font-size:10px; }
  .ap2-thread{ grid-template-columns:1fr 80px 60px 100px; }
  .ap2-th-author span,
  .ap2-th-last b{ display:none; }
  .ap2-floor-side{ width:90px; padding:10px 6px; }
  .ap2-floor-meta{ display:none; }
  .ap2-task span{ display:none; }
  .ap2-task{ min-width:40px; justify-content:center; }
  .ap2-logo-text{ display:none; }
  .ap2-navlink{ padding:6px 8px; font-size:12px; }
}
@media (max-width:640px){
  .ap2-thread-head{ display:none; }
  .ap2-thread{ grid-template-columns:1fr; gap:6px; padding:10px 12px; }
  .ap2-th-reply{ text-align:left; }
  .ap2-th-last{ display:none; }
  .ap2-board-head{ flex-wrap:wrap; }
  .ap2-post-btn{ width:100%; justify-content:center; }
  .ap2-search-hero-box{ flex-direction:column; }
  .ap2-search-hero-btn{ justify-content:center; padding:10px; }
  .ap2-board-arrow{ display:none; }
}

/* ============================================================
 * CMS Styles - Pagination & Comment System
 * ============================================================ */

/* === CMS Pagination (.jv-pagination) === */
.jv-pagination{
  display:flex;
  align-items:center;
  gap:4px;
  justify-content:center;
  flex-wrap:wrap;
}
.jv-pagination a,
.jv-pagination span{
  padding:5px 12px;
  font-size:13px;
  color:var(--ap2-text-sec);
  background:var(--ap2-surface);
  backdrop-filter:blur(10px);
  border:1px solid var(--ap2-border);
  border-radius:5px;
  transition:all 0.2s;
  text-decoration:none;
  display:inline-block;
}
.jv-pagination a:hover{
  background:rgba(74,144,217,0.1);
  border-color:var(--ap2-primary);
  color:var(--ap2-primary);
}
.jv-pagination .current{
  background:var(--ap2-primary);
  color:#fff;
  border-color:var(--ap2-primary);
}
.jv-pagination .current:hover{
  background:var(--ap2-primary-dark);
  color:#fff;
}
.jv-pagination .disabled{
  opacity:0.4;
  pointer-events:none;
}

/* === Comment System (.comment-*) === */
.ap2-replies-section{
  margin-bottom:12px;
}
.comment-item{
  display:flex;
  gap:0;
  background:var(--ap2-surface);
  backdrop-filter:blur(10px);
  border:1px solid var(--ap2-border);
  border-radius:var(--ap2-radius);
  margin-bottom:10px;
  overflow:hidden;
  box-shadow:0 2px 8px rgba(20,40,80,0.06);
}
.comment-avatar{
  width:50px;
  height:50px;
  border-radius:50%;
  margin:14px 10px;
  border:2px solid rgba(255,255,255,0.6);
  flex-shrink:0;
}
.comment-body{
  flex:1;
  padding:12px 16px;
  min-width:0;
}
.comment-head{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:8px;
}
.comment-author{
  font-size:13px;
  font-weight:600;
  color:var(--ap2-text);
}
.comment-time{
  font-size:11px;
  color:var(--ap2-text-mute);
}
.comment-content{
  font-size:13px;
  color:var(--ap2-text);
  line-height:1.8;
  margin-bottom:8px;
}
.comment-actions{
  display:flex;
  gap:6px;
  padding-top:8px;
  border-top:1px solid rgba(0,0,0,0.04);
}
.comment-reply-btn{
  display:flex;
  align-items:center;
  gap:4px;
  padding:4px 12px;
  font-size:12px;
  color:var(--ap2-text-sec);
  background:rgba(255,255,255,0.5);
  border:1px solid rgba(0,0,0,0.08);
  border-radius:4px;
  transition:all 0.2s;
  cursor:pointer;
}
.comment-reply-btn:hover{
  background:rgba(74,144,217,0.1);
  border-color:var(--ap2-primary);
  color:var(--ap2-primary);
}
.comment-replies{
  margin-left:20px;
}
.comment-reply-form{
  padding:12px 16px;
  background:rgba(74,144,217,0.04);
  border-top:1px solid rgba(0,0,0,0.04);
}
.comment-reply-input{
  width:100%;
  height:60px;
  padding:8px 12px;
  border:1px solid rgba(74,144,217,0.2);
  border-radius:6px;
  font-size:13px;
  resize:vertical;
  outline:none;
  font-family:inherit;
  background:rgba(255,255,255,0.6);
  margin-bottom:8px;
}
.comment-reply-input:focus{
  border-color:var(--ap2-primary);
  box-shadow:0 0 0 2px rgba(74,144,217,0.15);
  background:#fff;
}
.comment-reply-submit{
  padding:5px 18px;
  background:linear-gradient(180deg,var(--ap2-accent),var(--ap2-primary));
  color:#fff;
  border-radius:5px;
  font-size:12px;
  font-weight:500;
  border:none;
  cursor:pointer;
  box-shadow:0 2px 8px rgba(74,144,217,0.35);
  transition:all 0.2s;
}
.comment-reply-submit:hover{
  box-shadow:0 4px 14px rgba(74,144,217,0.5);
}
.comment-reply-submit:disabled{
  opacity:0.6;
  cursor:default;
}