/* ══════════════════════════════════════════════════════════════
   校园手稿 v2 —— 从“浅色纸”升级为“整本校园手写本”
   所有规则只在 body[data-theme="light"] 生效；切到星空/森绿/壁纸时自动还原
   ══════════════════════════════════════════════════════════════ */

/* ── 0. 手稿专用色板与手写字体 ── */
[data-theme="light"] {
  --font-hand: "LXGW WenKai", "Kaiti SC", "STKaiti", "KaiTi", "DFKai-SB", cursive;
  --ink-red: #D9573F;
  --ink-blue: #2E5EAA;
  --highlighter: #FFD65A;
  --tape: rgba(255, 214, 90, 0.45);
  --paper-hole: rgba(31, 27, 22, 0.14);
  --note-a: #FFFDF7;
  --note-b: #FDF6EC;
  --note-c: #F4F7F2;
  --note-d: #F2F6FD;
}

/* ── 1. 稿纸系统：红色页边线 + 纸纹噪点 ── */
[data-theme="light"] #main-bg {
  background-image:
    linear-gradient(90deg,
      transparent 34px,
      rgba(217, 87, 63, 0.16) 34px,
      rgba(217, 87, 63, 0.16) 35.5px,
      transparent 35.5px),
    repeating-linear-gradient(
      transparent,
      transparent 27px,
      rgba(0, 0, 0, 0.05) 27px,
      rgba(0, 0, 0, 0.05) 29px
    ),
    linear-gradient(180deg, #FBF7EE 0%, #F5F0E4 100%);
  background-size: 100% 100%, 100% 29px, cover;
  background-position: 0 0, 0 0, center;
}

[data-theme="light"] #main-bg::after {
  background:
    url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.72' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.55'/%3E%3C/svg%3E"),
    radial-gradient(ellipse at 50% 0%, transparent 55%, rgba(31, 27, 22, 0.10) 100%);
  background-size: 480px 480px, 100% 100%;
  background-repeat: repeat, no-repeat;
  opacity: 0.6;
}

/* 抽屉像笔记本封面：左侧活页孔 + 牛皮纸底 */
[data-theme="light"] .channel-drawer {
  background-image:
    url("data:image/svg+xml,%3Csvg width='18' height='84' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='9' cy='14' r='4.5' fill='rgba(31,27,22,0.10)' stroke='rgba(31,27,22,0.18)' stroke-width='1'/%3E%3Ccircle cx='9' cy='42' r='4.5' fill='rgba(31,27,22,0.10)' stroke='rgba(31,27,22,0.18)' stroke-width='1'/%3E%3Ccircle cx='9' cy='70' r='4.5' fill='rgba(31,27,22,0.10)' stroke='rgba(31,27,22,0.18)' stroke-width='1'/%3E%3C/svg%3E"),
    linear-gradient(180deg, #EDE7D8 0%, #E8E2D3 55%, #E2DBC9 100%);
  background-size: 18px 84px, 100% 100%;
  background-repeat: repeat-y, no-repeat;
  background-position: 10px 14px, 0 0;
}

/* ── 2. 手写字体 + 荧光笔划线 ── */
[data-theme="light"] .drawer-server-name,
[data-theme="light"] .drawer-user-name,
[data-theme="light"] .nav-channel-title,
[data-theme="light"] .msg-feed-name,
[data-theme="light"] .hot-card-title,
[data-theme="light"] .announcement-banner .ann-content,
[data-theme="light"] .settings-title {
  font-family: var(--font-hand);
}

[data-theme="light"] .drawer-server-name,
[data-theme="light"] .nav-channel-title,
[data-theme="light"] .msg-feed-name,
[data-theme="light"] .hot-card-title {
  width: fit-content;
  max-width: 100%;
  padding: 0 0.18em;
  margin-left: -0.18em;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
  background: linear-gradient(104deg,
      transparent 0 4%,
      rgba(255, 214, 90, 0.55) 4% 94%,
      transparent 94%);
  background-repeat: no-repeat;
  background-size: 100% 0.56em;
  background-position: 0 0.78em;
}

[data-theme="light"] .ch-item.active .ch-name {
  width: fit-content;
  max-width: 100%;
  padding: 0 0.14em;
  background: linear-gradient(104deg,
      transparent 0 4%,
      rgba(255, 214, 90, 0.55) 4% 94%,
      transparent 94%);
  background-repeat: no-repeat;
  background-size: 100% 0.5em;
  background-position: 0 0.82em;
  border-radius: 2px;
}

/* ── 3. 目录页抽屉：校徽相框 + 章节标题 + 便利贴频道 ── */
[data-theme="light"] .drawer-header {
  padding: 18px 14px 14px;
}

[data-theme="light"] .drawer-server {
  gap: 12px;
  padding: 14px 12px 12px;
  margin: 6px 2px 2px 8px;
  background: #FFFDF7;
  border: 1.5px dashed rgba(31, 27, 22, 0.18);
  border-radius: 8px 10px 6px 12px;
  box-shadow: 4px 5px 0 rgba(31, 27, 22, 0.08);
  transform: rotate(-1.2deg);
  position: relative;
}

/* 贴照片用的两段胶带 */
[data-theme="light"] .drawer-server::before,
[data-theme="light"] .drawer-server::after {
  content: "";
  position: absolute;
  top: -9px;
  width: 54px;
  height: 20px;
  background: var(--tape);
  border-left: 1px dashed rgba(31, 27, 22, 0.10);
  border-right: 1px dashed rgba(31, 27, 22, 0.10);
  pointer-events: none;
}
[data-theme="light"] .drawer-server::before {
  left: 14%;
  transform: rotate(-7deg);
}
[data-theme="light"] .drawer-server::after {
  right: 12%;
  transform: rotate(6deg);
}

/* 校徽变成一张贴在纸上的照片 */
[data-theme="light"] .drawer-server-icon {
  width: 74px;
  height: 74px;
  border: 3px solid #FFFDF7;
  border-radius: 6px 8px 5px 10px;
  padding: 0;
  background: #FFFDF7;
  object-fit: cover;
  box-shadow: 0 2px 6px rgba(31, 27, 22, 0.18);
}

[data-theme="light"] .drawer-server-name {
  line-height: 1.1;
  font-size: 1.45rem;
}
[data-theme="light"] .drawer-server-name::after {
  content: "宝丰一高 · 校园频道";
  display: block;
  font-family: inherit;
  font-size: 0.52em;
  font-weight: 500;
  color: var(--ink-sec);
  letter-spacing: 0.14em;
  margin-top: 0.35em;
  width: max-content;
  max-width: 100%;
}

/* 记忆树入口：折角便签 */
[data-theme="light"] .mt-drawer-entry-btn,
[data-theme="light"] #mt-entry-btn {
  transform: rotate(-0.6deg);
}
[data-theme="light"] .mt-drawer-entry-btn:hover,
[data-theme="light"] #mt-entry-btn:hover {
  transform: translateY(-2px) rotate(0.4deg);
}

/* “交流频道”变成章节标题 */
[data-theme="light"] .ch-category-title {
  display: flex !important;
  align-items: center;
  gap: 7px;
  font-weight: 800;
  font-family: var(--font-hand);
  letter-spacing: 0.02em;
  padding: 9px 10px 7px;
  margin: 6px 2px 0;
  background: rgba(255, 253, 247, 0.72);
  border: 1.5px dashed rgba(31, 27, 22, 0.14);
  border-radius: 12px 14px 10px 16px;
  box-shadow: var(--sh-sm);
  visibility: visible !important;
  opacity: 1 !important;
}
[data-theme="light"] .ch-category-title svg {
  flex-shrink: 0;
  color: var(--ink-sec);
}
[data-theme="light"] .ch-category-title .cat-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
[data-theme="light"] .ch-category-title .cat-text::before {
  content: "第 1 章 · ";
  color: var(--ink-red);
  font-weight: 800;
  letter-spacing: 0.06em;
}
[data-theme="light"] .ch-category-title.collapsed .cat-text::after {
  content: "（已折叠）";
  font-size: 0.72em;
  font-weight: 500;
  color: var(--ink-dim);
  margin-left: 0.4em;
}

/* 频道卡片：五颜六色的便利贴，像被胶带随机贴上去 */
[data-theme="light"] .ch-list .ch-item {
  position: relative;
  padding: 9px 10px;
  margin: 7px 3px;
  border: 1.5px dashed rgba(31, 27, 22, 0.16);
  border-radius: 14px 12px 16px 10px;
  box-shadow: 3px 4px 0 rgba(31, 27, 22, 0.06);
}
[data-theme="light"] .ch-list .ch-item:nth-child(4n+1) { --note: var(--note-a); transform: rotate(-0.55deg); }
[data-theme="light"] .ch-list .ch-item:nth-child(4n+2) { --note: var(--note-b); transform: rotate(0.45deg); }
[data-theme="light"] .ch-list .ch-item:nth-child(4n+3) { --note: var(--note-c); transform: rotate(-0.25deg); }
[data-theme="light"] .ch-list .ch-item:nth-child(4n+4) { --note: var(--note-d); transform: rotate(0.35deg); }
[data-theme="light"] .ch-list .ch-item { background: var(--note, var(--bg-surface)); }
[data-theme="light"] .ch-list .ch-item:hover,
[data-theme="light"] .ch-list .ch-item.active {
  transform: translateY(-2px) rotate(0deg);
  z-index: 2;
}
[data-theme="light"] .ch-list .ch-item.active {
  border-color: var(--accent);
  box-shadow: inset 2px 2px 0 rgba(31, 27, 22, 0.04), 3px 4px 0 rgba(31, 27, 22, 0.06);
}
[data-theme="light"] .ch-list .ch-item::before {
  content: "";
  position: absolute;
  top: -7px;
  left: 9px;
  width: 36px;
  height: 14px;
  background: var(--tape);
  border-left: 1px dashed rgba(31, 27, 22, 0.10);
  border-right: 1px dashed rgba(31, 27, 22, 0.10);
  border-radius: 1px;
  transform: rotate(-3deg);
  pointer-events: none;
}

/* 头像：去掉圆圈外环，改为不规则贴纸相片 */
[data-theme="light"] .drawer-user-avatar {
  width: 38px;
  height: 38px;
  flex-shrink: 0;
  border: none;
  border-radius: 14px 10px 16px 8px;
  background: #FFFDF7;
  color: var(--ink);
  box-shadow: 2px 3px 0 rgba(31, 27, 22, 0.10);
  font-size: 0.85rem;
}
[data-theme="light"] .drawer-user-avatar img {
  border-radius: 14px 10px 16px 8px;
}

/* ── 4. 作文本正文：页眉、消息稿纸、页边线 ── */
[data-theme="light"] .top-nav .nav-channel-title::before {
  content: "正在书写：#";
  color: var(--ink-red);
  font-size: 0.62em;
  vertical-align: 0.08em;
  margin-right: 0.22em;
  letter-spacing: 0.05em;
  font-weight: 700;
}

[data-theme="light"] .feed-wrapper {
  background:
    linear-gradient(90deg,
      transparent 54px,
      rgba(217, 87, 63, 0.07) 54px,
      rgba(217, 87, 63, 0.07) 55px,
      transparent 55px);
}

[data-theme="light"] .msg-group {
  background: rgba(255, 253, 247, 0.55);
  border: 1.5px dashed rgba(31, 27, 22, 0.08);
  border-radius: 18px 14px 20px 12px;
  box-shadow: var(--sh-sm);
  padding: 12px 0 10px;
  margin: 4px 0;
}
[data-theme="light"] .msg-group:hover {
  background: rgba(255, 253, 247, 0.85);
}

/* ── 5. 微动效：纸飞机与印章 ── */
[data-theme="light"] .send-btn:hover svg {
  animation: ms-paper-plane 0.45s ease;
}
[data-theme="light"] .msg-interact-btn:active svg {
  animation: ms-stamp-press 0.28s cubic-bezier(0.34, 1.56, 0.64, 1);
}
@keyframes ms-paper-plane {
  0%, 100% { transform: rotate(0deg) translate(0, 0); }
  25% { transform: rotate(14deg) translate(1px, -1px); }
  65% { transform: rotate(-10deg) translate(-1px, 0); }
}
@keyframes ms-stamp-press {
  0% { transform: scale(1) rotate(0deg); }
  40% { transform: scale(1.25) rotate(-8deg); }
  100% { transform: scale(1) rotate(0deg); }
}

/* 设置面板中的主题预览同步成新手稿风（纸 + 红页边线 + 荧光笔） */
[data-theme="light"] .bg-theme-preview.light {
  background:
    linear-gradient(104deg,
      transparent 0 18%,
      rgba(255, 214, 90, 0.80) 18% 80%,
      transparent 80%),
    linear-gradient(90deg,
      transparent 9px,
      rgba(217, 87, 63, 0.20) 9px,
      rgba(217, 87, 63, 0.20) 10px,
      transparent 10px),
    repeating-linear-gradient(
      transparent,
      transparent 10px,
      rgba(0, 0, 0, 0.06) 10px,
      rgba(0, 0, 0, 0.06) 11px
    ),
    linear-gradient(180deg, #FBF7EE, #F5F0E4);
  border: 1px dashed rgba(31, 27, 22, 0.14);
}

/* ══════════════════════════════════════════════════════
   校园手稿 v3 —— 频道人格 + 日记抬头 + 整体 UI 查漏
   ══════════════════════════════════════════════════════ */

/* ── 6. 日记抬头：抽屉最顶部（校徽上方），全主题可见 ── */
.ms-diary-chip {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0 0 10px;
  padding: 2px 2px 5px;
  font-family: var(--font-hand, cursive);
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: rgba(255, 255, 255, 0.78);
  border-bottom: 1.5px dashed rgba(255, 255, 255, 0.20);
}
[data-theme="classroom"] .ms-diary-chip {
  color: var(--text-sec);
  border-bottom-color: rgba(10, 51, 36, 0.22);
}
[data-theme="light"] .ms-diary-chip {
  color: var(--ink-sec);
  border-bottom-color: rgba(31, 27, 22, 0.20);
}

/* ── 7. 欢迎卡（行线纸底 + 胶带 + 折角） ── */
.welcome-card { position: relative; }
.welcome-card {
  padding: 14px 20px 15px 18px;
  gap: 14px;
  background:
    linear-gradient(225deg, rgba(31,27,22,0.08) 0 12px, transparent 12.5px),
    repeating-linear-gradient(180deg, transparent 0 11px, var(--rule-line, rgba(31,27,22,0.05)) 11px, var(--rule-line, rgba(31,27,22,0.05)) 12.5px),
    var(--nav-card-bg, #FFFDF7);
  border: 1.5px dashed var(--nav-card-line, rgba(31,27,22,0.18));
  box-shadow: 2px 4px 0 var(--nav-card-shadow, rgba(31,27,22,0.06));
}
.welcome-card::after {
  content: "";
  position: absolute;
  top: -8px;
  left: 20px;
  width: 54px;
  height: 16px;
  background: var(--tape, rgba(255, 214, 90, 0.40));
  transform: rotate(-3deg);
  border-left: 1px dashed rgba(128,128,128,0.25);
  border-right: 1px dashed rgba(128,128,128,0.25);
  border-radius: 1px;
  pointer-events: none;
  z-index: 3;
}
[data-theme="light"] .welcome-card[data-ch]::after { display: block; }
[data-theme="light"] .welcome-card { overflow: visible; }
[data-theme="starry"] .welcome-card,
[data-theme="custom"] .welcome-card {
  --nav-card-bg: rgba(255, 255, 255, 0.045);
  --nav-card-line: rgba(255, 255, 255, 0.14);
  --nav-card-shadow: none;
  --rule-line: rgba(255, 255, 255, 0.05);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.25);
}
[data-theme="classroom"] .welcome-card {
  --nav-card-bg: #F4F9F1;
  --nav-card-line: rgba(10, 51, 36, 0.22);
  --nav-card-shadow: rgba(10, 51, 36, 0.10);
  --rule-line: rgba(10, 51, 36, 0.06);
}
.welcome-card[data-ch]::before { display: none !important; }

/* ── 8. P0 查漏（恢复） ── */
/* 8.1 右栏卡片：稿纸 + 胶带 + 手写标题 */
[data-theme="light"] .sidebar-card {
  background: var(--paper-card);
  border: 1.5px dashed rgba(31, 27, 22, 0.16);
  border-radius: 14px 16px 12px 18px;
  box-shadow: 2px 4px 0 rgba(31, 27, 22, 0.06);
  position: relative;
}
[data-theme="light"] .sidebar-card::before {
  content: "";
  position: absolute;
  top: -8px;
  left: 50%;
  width: 56px;
  height: 16px;
  margin-left: -28px;
  background: var(--tape);
  transform: rotate(-2deg);
  border-left: 1px dashed rgba(31, 27, 22, 0.10);
  border-right: 1px dashed rgba(31, 27, 22, 0.10);
  border-radius: 1px;
  pointer-events: none;
}
[data-theme="light"] .sidebar-card-title {
  font-family: var(--font-hand);
  border-bottom: 1.5px dashed rgba(31, 27, 22, 0.14);
}

/* ── 9. P1 查漏（恢复） ── */
[data-theme="light"] .msg-input,
[data-theme="light"] .message-input-wrapper textarea {
  border-bottom: 2px dashed var(--border-light);
}
[data-theme="light"] .msg-input::placeholder,
[data-theme="light"] .message-input-wrapper textarea::placeholder {
  font-family: var(--font-hand);
  color: var(--ink-dim);
}
[data-theme="light"] .msg-img-wrap,
[data-theme="light"] .msg-file-card { position: relative; }
[data-theme="light"] .msg-img-wrap::after,
[data-theme="light"] .msg-file-card::after {
  content: "";
  position: absolute;
  top: 6px;
  left: 12px;
  width: 44px;
  height: 15px;
  background: var(--tape);
  transform: rotate(-4deg);
  border-left: 1px dashed rgba(31, 27, 22, 0.10);
  border-right: 1px dashed rgba(31, 27, 22, 0.10);
  border-radius: 1px;
  opacity: 0.9;
  pointer-events: none;
  z-index: 2;
}
[data-theme="light"] .settings-section-title,
[data-theme="light"] .welcome-text h3 { font-family: var(--font-hand); }
[data-theme="light"] .scroll-bottom-btn {
  background: #FFFDF7;
  border: 1.5px dashed rgba(31, 27, 22, 0.22);
  border-radius: 10px 12px 9px 14px;
  box-shadow: 2px 3px 0 rgba(31, 27, 22, 0.10);
}
[data-theme="light"] .scroll-bottom-btn svg { display: none; }
[data-theme="light"] .scroll-bottom-btn::before { content: "📎"; font-size: 1.05rem; }

/* ── 10. P2 锦上添花（恢复） ── */
[data-theme="light"] .settings-panel.open {
  animation: ms-panel-unfold 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}
@keyframes ms-panel-unfold {
  0% { clip-path: inset(0 0 100% 0); }
  100% { clip-path: inset(0 0 0% 0); }
}
[data-theme="light"] .emoji-panel {
  background: var(--paper-card);
  border: 1.5px dashed rgba(31, 27, 22, 0.18);
  border-radius: 14px 16px 12px 18px;
  box-shadow: 3px 5px 0 rgba(31, 27, 22, 0.08);
}
[data-theme="light"] .emoji-grid { gap: 3px; }
[data-theme="light"] .emoji-item {
  border: 1px dashed rgba(31, 27, 22, 0.10);
  border-radius: 8px 10px 7px 11px;
}
[data-theme="light"] .emoji-item:hover { background: var(--bg-hover); }

/* ── 11. G3 抽屉章节：手绘三角箭头 + 章节编号（全主题） ── */
.ch-category-title svg { display: none !important; }
.ch-category-title { gap: 7px; }
.ch-category-title::before {
  content: "";
  width: 0;
  height: 0;
  flex-shrink: 0;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-top: 9px solid currentColor;
  opacity: 0.55;
  transform-origin: 50% 40%;
  transition: transform 0.28s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.ch-category-title.collapsed::before { transform: rotate(-90deg); }
.ch-category-title .cat-text::before {
  content: "第 1 章 · ";
  font-family: var(--font-hand);
  font-weight: 800;
}
.ch-category-title.collapsed .cat-text::after {
  content: "（已折叠）";
  opacity: 0.55;
  font-size: 0.9em;
}
[data-theme="starry"] .ch-category-title,
[data-theme="custom"] .ch-category-title {
  background: rgba(255, 255, 255, 0.04);
  border: 1px dashed rgba(255, 255, 255, 0.14);
  border-radius: 10px 12px 9px 13px;
  padding: 8px 10px;
  margin: 6px 2px 0;
}

/* ── 14. Y1 PC 三栏 + 右栏可收起 ── */
@media (min-width: 901px) {
  .right-sidebar { flex: 0 0 300px; width: 300px; padding-left: 12px; }
  .channel-main.sb-hidden .right-sidebar { display: none !important; }
}
@media (min-width: 901px) {
  .right-sidebar { flex: 0 0 300px; width: 300px; padding-left: 12px; }
}

/* ── 15. Y2 便签输入卡 + 印章发送钮（全主题） ── */
.message-input-wrapper {
  position: relative;
  background: var(--nav-card-bg, #FFFDF7);
  border: 1.5px dashed var(--nav-card-line, rgba(31, 27, 22, 0.18));
  border-radius: 12px 16px 10px 18px;
  box-shadow: 2px 4px 0 var(--nav-card-shadow, rgba(31, 27, 22, 0.06));
}
.message-input-wrapper::before {
  content: "";
  position: absolute;
  top: -8px;
  right: 18px;
  width: 48px;
  height: 15px;
  background: var(--tape, rgba(255, 214, 90, 0.40));
  transform: rotate(3deg);
  border-left: 1px dashed rgba(128, 128, 128, 0.25);
  border-right: 1px dashed rgba(128, 128, 128, 0.25);
  border-radius: 1px;
  pointer-events: none;
  z-index: 2;
}
[data-theme="light"] .message-input-wrapper { --nav-card-bg: #FFFDF7; --nav-card-line: rgba(31,27,22,0.18); --nav-card-shadow: rgba(31,27,22,0.07); }
[data-theme="classroom"] .message-input-wrapper { --nav-card-bg: #F4F9F1; --nav-card-line: rgba(10,51,36,0.22); --nav-card-shadow: rgba(10,51,36,0.10); }
[data-theme="starry"] .message-input-wrapper,
[data-theme="custom"] .message-input-wrapper { --nav-card-bg: rgba(255,255,255,0.045); --nav-card-line: rgba(255,255,255,0.14); --nav-card-shadow: rgba(0,0,0,0.2); }

/* v1.5.102：印章造型保留（全站记忆点），颜色改随主题：
   手稿=橙红邮票章（原样）/ 森绿=绿印 / 星空&custom=频道人格色青印 */
.send-btn {
  --stamp-a: #F26B4C; --stamp-b: #C93A1D; --stamp-ring: rgba(201, 58, 29, 0.25);
  width: 44px !important;
  height: 44px !important;
  border-radius: 50% 46% 52% 48% !important;
  background: radial-gradient(circle at 32% 30%, var(--stamp-a), var(--stamp-b) 72%) !important;
  color: #fff !important;
  border: 2.5px solid rgba(255, 255, 255, 0.55) !important;
  box-shadow: 0 0 0 2px var(--stamp-ring), 2px 3px 0 rgba(31, 27, 22, 0.18) !important;
  transition: transform 0.12s ease, box-shadow 0.12s ease !important;
}
[data-theme="classroom"] .send-btn {
  --stamp-a: #34d399; --stamp-b: #059669; --stamp-ring: rgba(5, 150, 105, 0.28);
}
[data-theme="starry"] .send-btn,
[data-theme="custom"] .send-btn {
  --stamp-a: hsl(var(--channel-hue, 190), 85%, 62%);
  --stamp-b: hsl(var(--channel-hue, 190), 80%, 42%);
  --stamp-ring: hsla(var(--channel-hue, 190), 85%, 55%, 0.30);
}
.send-btn:hover { transform: rotate(-5deg) scale(1.05); }
.send-btn:active { transform: scale(0.84) rotate(-14deg); box-shadow: 0 0 0 4px rgba(201, 58, 29, 0.18), 0 1px 0 rgba(31,27,22,0.18) !important; }

/* ── 16. D 方案落地：左抽屉导航栏 = channels.exe 像素窗口（全主题） ── */
#sidebar-channels {
  position: relative;
  margin: 6px 4px 10px;
  padding: 6px 5px 8px;
  background: var(--win-bg, #EDE9DC) !important;
  border: 2px solid #1F1B16;
  border-radius: 7px;
  box-shadow: 4px 4px 0 var(--win-shadow, rgba(0, 0, 0, 0.35));
  overflow: hidden;
}
/* CRT 扫描线 */
#sidebar-channels::after {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(180deg, rgba(0, 0, 0, 0.04) 0 1px, transparent 1px 3px);
  pointer-events: none;
  z-index: 2;
}
/* 频道行 = 窗口里的文件行 */
#sidebar-channels .ch-item {
  position: relative;
  border-radius: 4px;
  border-bottom: 1px dashed rgba(128, 128, 128, 0.18);
}
#sidebar-channels .ch-item:last-child { border-bottom: none; }
#sidebar-channels .ch-item:hover { background: rgba(124, 92, 252, 0.12); }
#sidebar-channels .ch-item.active {
  background: rgba(124, 92, 252, 0.16);
  border-left: 3px solid var(--accent, #7c5cfc);
}
#sidebar-channels .ch-item.active[data-name="公告栏"]     { background: rgba(224, 90, 63, 0.16);   border-left-color: #E05A3F; }
#sidebar-channels .ch-item.active[data-name="综合大厅"]   { background: rgba(139, 109, 253, 0.18); border-left-color: #8B6DFD; }
#sidebar-channels .ch-item.active[data-name="学习园地"]   { background: rgba(91, 141, 239, 0.18);  border-left-color: #5B8DEF; }
#sidebar-channels .ch-item.active[data-name="生活日常"]   { background: rgba(63, 166, 92, 0.18);   border-left-color: #3FA65C; }
#sidebar-channels .ch-item.active[data-name="二次元世界"] { background: rgba(240, 86, 143, 0.18);  border-left-color: #F0568F; }
#sidebar-channels .ch-category-title { padding: 8px 6px 5px; }
/* 主题变体 */
[data-theme="starry"] #sidebar-channels,
[data-theme="custom"] #sidebar-channels { --win-bg: #1A1F33; --win-shadow: rgba(0, 0, 0, 0.55); }
[data-theme="classroom"] #sidebar-channels { --win-bg: #F4F9F1; --win-shadow: rgba(10, 51, 36, 0.30); }

/* ── 16.2 channels.exe 加强：窗口内 = 复古文件管理器 ── */
#sidebar-channels {
  box-shadow: 4px 4px 0 var(--win-shadow, rgba(0, 0, 0, 0.35)), inset 0 0 0 1px rgba(255, 255, 255, 0.22);
}
#sidebar-channels .ch-item {
  margin: 2px 0;
  border-bottom: none;
  border-radius: 3px;
}
/* 每行的频道图标装进「文件图标盒」 */
#sidebar-channels .ch-item .ch-icon {
  width: 30px;
  height: 24px;
  border: 1.5px solid rgba(0, 0, 0, 0.35);
  border-radius: 4px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.35), rgba(255, 255, 255, 0.10)),
    rgba(0, 0, 0, 0.06);
  box-shadow: inset 0 -2px 0 rgba(0, 0, 0, 0.10);
  opacity: 1 !important;
}
#sidebar-channels .ch-item:hover { background: rgba(124, 92, 252, 0.15); }
/* 选中行 = 经典反白高亮：频道色实底 + 白字 */
#sidebar-channels .ch-item.active,
#sidebar-channels .ch-item.active[data-name="公告栏"],
#sidebar-channels .ch-item.active[data-name="综合大厅"],
#sidebar-channels .ch-item.active[data-name="学习园地"],
#sidebar-channels .ch-item.active[data-name="生活日常"],
#sidebar-channels .ch-item.active[data-name="二次元世界"] {
  border-left: 3px solid rgba(0, 0, 0, 0.30);
}
#sidebar-channels .ch-item.active[data-name="公告栏"]     { background: linear-gradient(180deg, #E8654A, #C74826) !important; }
#sidebar-channels .ch-item.active[data-name="综合大厅"]   { background: linear-gradient(180deg, #9272FF, #6F4FE0) !important; }
#sidebar-channels .ch-item.active[data-name="学习园地"]   { background: linear-gradient(180deg, #6497F2, #4472DF) !important; }
#sidebar-channels .ch-item.active[data-name="生活日常"]   { background: linear-gradient(180deg, #4BB168, #35914F) !important; }
#sidebar-channels .ch-item.active[data-name="二次元世界"] { background: linear-gradient(180deg, #F4609A, #E43F80) !important; }
#sidebar-channels .ch-item.active .ch-name {
  color: #fff !important;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.35);
}
#sidebar-channels .ch-item.active .ch-icon {
  border-color: rgba(255, 255, 255, 0.55);
  background: rgba(255, 255, 255, 0.18);
  box-shadow: none;
}

/* ── 16.3 深色主题窗口对比度加强（星空/壁纸下也要一眼可见） ── */
[data-theme="starry"] #sidebar-channels,
[data-theme="custom"] #sidebar-channels {
  --win-bg: #262C4A;
  border-color: #0B0D18;
  box-shadow:
    5px 5px 0 rgba(0, 0, 0, 0.55),
    0 0 0 1px rgba(255, 255, 255, 0.07),
    inset 0 0 0 1px rgba(255, 255, 255, 0.10);
}
[data-theme="starry"] #sidebar-channels::before,
[data-theme="custom"] #sidebar-channels::before {
  background:
    radial-gradient(circle 3.5px at 12px 50%, #3AC25D 3.5px, transparent 4px),
    radial-gradient(circle 3.5px at 26px 50%, #F2B63C 3.5px, transparent 4px),
    radial-gradient(circle 3.5px at 40px 50%, #E05A3F 3.5px, transparent 4px),
    linear-gradient(180deg, #6C50D8, #4E37B0);
  border-bottom: 1px solid rgba(0, 0, 0, 0.55);
}

/* ── 18. 顶栏频道卡 = D 像素窗口（恢复；52px 精确贴合，全主题） ── */
.top-nav .nav-channel-info[data-ch] {
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 0 !important;
  padding: 0 !important;
  height: auto !important;
  border-radius: 7px !important;
  background: var(--win-bg, #EDE9DC) !important;
  border: 2px solid #1F1B16 !important;
  box-shadow: 4px 4px 0 var(--win-shadow, rgba(0, 0, 0, 0.45)) !important;
  overflow: hidden;
  transform-origin: 0 100%;
}
[data-theme="light"] .top-nav .nav-channel-info[data-ch] {
  background: var(--win-bg, #EDE9DC) !important;
  border: 2px solid #1F1B16 !important;
  border-radius: 7px !important;
  box-shadow: 4px 4px 0 rgba(31, 27, 22, 0.35) !important;
}
[data-theme="classroom"] .top-nav .nav-channel-info[data-ch] {
  background: #F4F9F1 !important;
  box-shadow: 4px 4px 0 rgba(10, 51, 36, 0.35) !important;
}
.top-nav .nav-channel-info[data-ch]::after { display: none !important; }
.top-nav .nav-channel-title { background: none !important; padding-bottom: 0 !important; }
.top-nav .ch-card-bar {
  display: flex !important;
  position: static !important;
  top: auto !important;
  bottom: auto !important;
  width: auto !important;
  height: 18px;
  align-items: center;
  gap: 4px;
  padding: 0 7px;
  border-radius: 0 !important;
  background: linear-gradient(180deg, var(--ch-color, #8B6DFD), var(--ch-deep, #6a4be0)) !important;
  flex-shrink: 0;
}
.top-nav .ch-card-bar i {
  width: 6px;
  height: 6px;
  border-radius: 1.5px;
  background: rgba(0, 0, 0, 0.25);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35);
  flex-shrink: 0;
}
.top-nav .ch-card-bar i:nth-child(1) { background: #3AC25D; }
.top-nav .ch-card-bar i:nth-child(2) { background: #F2B63C; }
.top-nav .ch-card-bar i:nth-child(3) { background: #E05A3F; }
.top-nav .ch-win-title {
  font-family: ui-monospace, Consolas, monospace;
  font-size: 0.6rem;
  letter-spacing: 0.04em;
  color: rgba(255, 255, 255, 0.96);
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.3);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.top-nav .ch-card-text {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 30px;
  padding: 3px 10px 3px 9px;
  min-width: 0;
  position: relative;
  z-index: 1;
}
.top-nav .ch-win-icon { flex-shrink: 0; line-height: 1; }
.top-nav .ch-win-icon .hi { position: relative; display: block; width: 30px; height: 30px; transform: scale(0.72); transform-origin: center; }
.top-nav .ch-win-icon .hi i { position: absolute; display: block; }
.top-nav .ch-card-textmain { min-width: 0; line-height: 1.25; }
.top-nav .nav-channel-title {
  font-size: 0.95rem !important;
  margin: 0;
  color: #1F1B16 !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.top-nav .nav-channel-desc {
  font-size: 0.64rem !important;
  color: #6b6350 !important;
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.top-nav .nav-channel-info[data-ch]::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  width: auto !important;
  height: auto !important;
  transform: none !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  background: repeating-linear-gradient(180deg, rgba(0, 0, 0, 0.05) 0 1px, transparent 1px 3px) !important;
  border-radius: 0 !important;
  pointer-events: none;
  z-index: 2;
}
.top-nav .nav-channel-info[data-ch="notice"] { --ch-color: #E05A3F; --ch-deep: #B03A20; }
.top-nav .nav-channel-info[data-ch="chat"]   { --ch-color: #8B6DFD; --ch-deep: #6a4be0; }
.top-nav .nav-channel-info[data-ch="book"]   { --ch-color: #5B8DEF; --ch-deep: #3d6fe8; }
.top-nav .nav-channel-info[data-ch="life"]   { --ch-color: #3FA65C; --ch-deep: #2e9147; }
.top-nav .nav-channel-info[data-ch="anime"]  { --ch-color: #F0568F; --ch-deep: #e93a7c; }
[data-theme="starry"] .top-nav .nav-channel-info[data-ch],
[data-theme="custom"] .top-nav .nav-channel-info[data-ch] {
  --win-bg: #262C4A;
  box-shadow: 4px 4px 0 rgba(0, 0, 0, 0.6), 0 0 16px var(--ch-glow, rgba(124, 92, 252, 0.25)) !important;
}
[data-theme="starry"] .top-nav .nav-channel-title,
[data-theme="custom"] .top-nav .nav-channel-title { color: #E8EAF6 !important; }
[data-theme="starry"] .top-nav .nav-channel-desc,
[data-theme="custom"] .top-nav .nav-channel-desc { color: #9aa1c0 !important; }
@media (max-width: 768px) {
  .top-nav .ch-card-bar { height: 16px; gap: 3px; padding: 0 6px; }
  .top-nav .ch-card-bar i { width: 5px; height: 5px; }
  .top-nav .ch-win-title { font-size: 0.55rem; }
  .top-nav .ch-card-text { min-height: 28px; padding: 2px 8px 2px 7px; gap: 7px; }
  .top-nav .ch-win-icon .hi { width: 26px; height: 26px; transform: scale(0.62); }
  .top-nav .nav-channel-title { font-size: 0.88rem !important; }
  .top-nav .nav-channel-desc { font-size: 0.6rem !important; }
}

/* ── 19. 顶栏频道卡 = D 像素窗口 · ID 级硬兜底（压过一切旧规则/缓存样式） ── */
#top-nav #nav-channel-card{
  flex-direction: column !important; align-items: stretch !important; gap: 0 !important;
  padding: 0 !important; min-width: 216px; max-width: 340px;
  background: #EDE9DC !important;
  border: 2px solid #1F1B16 !important; border-radius: 7px !important;
  box-shadow: 4px 4px 0 rgba(31,27,22,0.35) !important;
  overflow: hidden !important; position: relative !important;
}
#top-nav #nav-channel-card::before{
  content: "" !important; position: absolute !important; inset: 0 !important;
  width: auto !important; height: auto !important; transform: none !important;
  border: none !important; box-shadow: none !important; border-radius: 0 !important;
  background: repeating-linear-gradient(180deg, rgba(31,27,22,0.05) 0 1px, transparent 1px 3px) !important;
  pointer-events: none !important; z-index: 3 !important;
}
#top-nav #nav-channel-card .ch-card-bar{
  position: static !important; inset: auto !important; top: auto !important; bottom: auto !important; left: auto !important;
  display: flex !important; width: auto !important; align-self: stretch !important; flex: none !important;
  height: 14px !important; margin: 0 !important; padding: 0 8px !important;
  align-items: center !important; gap: 4px !important; border-radius: 0 !important;
  background: linear-gradient(180deg, var(--ch-color, #8B6DFD), var(--ch-deep, #6a4be0)) !important;
  z-index: 2;
}
#top-nav #nav-channel-card .ch-card-bar i{
  position: static !important; width: 6px !important; height: 6px !important;
  border-radius: 1.5px !important; flex: none !important; display: block !important;
}
#top-nav #nav-channel-card .ch-card-bar i:nth-child(1){ background: #3AC25D !important; }
#top-nav #nav-channel-card .ch-card-bar i:nth-child(2){ background: #F2B63C !important; }
#top-nav #nav-channel-card .ch-card-bar i:nth-child(3){ background: #E05A3F !important; }
#top-nav #nav-channel-card .ch-win-title{
  position: static !important; transform: none !important; width: auto !important; flex: 1 1 auto !important; min-width: 0 !important;
  display: block !important; font-family: ui-monospace, Consolas, monospace !important;
  font-size: 0.62rem !important; letter-spacing: 0.05em !important;
  color: #FFFFFF !important; text-shadow: 0 1px 0 rgba(0,0,0,0.35) !important;
  white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important;
}
#top-nav #nav-channel-card .ch-card-text{
  display: flex !important; flex-direction: row !important; align-items: center !important; gap: 9px !important;
  padding: 2px 8px 2px 7px !important; min-height: 0 !important; width: auto !important;
  background: transparent !important; border: none !important; box-shadow: none !important;
  position: relative !important; z-index: 2;
}
#top-nav #nav-channel-card .nav-channel-title{
  font-size: 0.82rem !important; font-weight: 800 !important; color: #1F1B16 !important;
  margin: 0 !important; line-height: 1.2 !important;
}
#top-nav #nav-channel-card .nav-channel-desc{
  font-size: 0.56rem !important; color: #6B6350 !important; display: block !important; line-height: 1.3 !important;
}
.ms-cursor{ display: inline-block; margin-left: 2px; color: #8B6DFD; animation: msCurBlink 1.05s steps(1) infinite; }
@keyframes msCurBlink{ 0%,55%{opacity:1;} 56%,100%{opacity:0;} }
#ch-online{
  margin-left: auto; flex: none; display: inline-flex; align-items: center; gap: 5px;
  font-family: ui-monospace, Consolas, monospace; font-size: 0.58rem; letter-spacing: 0.06em;
  color: #2E7D43; background: rgba(63,166,92,0.12); border: 1px solid rgba(63,166,92,0.35);
  border-radius: 4px; padding: 2px 6px;
}
#ch-online .on-dot{
  width: 6px; height: 6px; border-radius: 50%; background: #3FA65C;
  box-shadow: 0 0 6px rgba(63,166,92,0.8); animation: onPulse 1.6s ease-in-out infinite;
}
@keyframes onPulse{ 0%,100%{opacity:1;} 50%{opacity:.35;} }
[data-theme="starry"] #top-nav #nav-channel-card,
[data-theme="custom"] #top-nav #nav-channel-card{
  background: #262C4A !important;
  box-shadow: 4px 4px 0 rgba(0,0,0,0.6), 0 0 16px var(--ch-glow, rgba(124,92,252,0.25)) !important;
}
[data-theme="starry"] #top-nav #nav-channel-card .nav-channel-title,
[data-theme="custom"] #top-nav #nav-channel-card .nav-channel-title{ color: #E8EAF6 !important; }
[data-theme="starry"] #top-nav #nav-channel-card .nav-channel-desc,
[data-theme="custom"] #top-nav #nav-channel-card .nav-channel-desc{ color: #9AA1C0 !important; }
[data-theme="starry"] #ch-online,
[data-theme="custom"] #ch-online{ color: #7ED9A0; background: rgba(63,166,92,0.16); border-color: rgba(126,217,160,0.4); }
[data-theme="classroom"] #top-nav #nav-channel-card{ background: #F4F9F1 !important; box-shadow: 4px 4px 0 rgba(10,51,36,0.35) !important; }
@media (max-width: 768px){
  #top-nav #nav-channel-card{ min-width: 0; max-width: 62vw; }
  #top-nav #nav-channel-card .ch-card-bar{ height: 17px !important; padding: 0 6px !important; }
  #top-nav #nav-channel-card .ch-card-bar i{ width: 5px !important; height: 5px !important; }
  #top-nav #nav-channel-card .ch-win-title{ font-size: 0.55rem !important; }
  #top-nav #nav-channel-card .ch-card-text{ min-height: 30px !important; padding: 3px 8px 4px 7px !important; gap: 7px !important; }
  #ch-online{ display: none; }
}
/* ── 20. 消息流欢迎分隔 = 方案4加强版（手稿一行：马克笔重点+emoji+胶带+星星虚线+页码） ── */
.wc-line{ display:flex; align-items:center; gap:10px; margin:14px 0 2px; padding:12px 2px 8px; position:relative; }
.wc-line[data-ch="notice"]{ --c:#E05A3F; --cd:#B03A20; --hl:rgba(224,90,63,.20); }
.wc-line[data-ch="chat"]  { --c:#8B6DFD; --cd:#6a4be0; --hl:rgba(139,109,253,.20); }
.wc-line[data-ch="book"]  { --c:#5B8DEF; --cd:#3d6fe8; --hl:rgba(91,141,239,.20); }
.wc-line[data-ch="life"]  { --c:#3FA65C; --cd:#2e9147; --hl:rgba(63,166,92,.20); }
.wc-line[data-ch="anime"] { --c:#F0568F; --cd:#e93a7c; --hl:rgba(240,86,143,.20); }
.wcl-line{ flex:1; min-width:14px; border-top:1.5px dashed #c9c0a8; position:relative; }
.wcl-line::before{ content:""; position:absolute; left:0; right:0; top:-4px; border-top:1px dotted rgba(201,192,168,.5); }
.wcl-star{ color:var(--c); font-size:.66rem; opacity:.9; flex:none; }
.wcl-txt{ display:flex; align-items:baseline; gap:7px; flex:none; position:relative; }
.wcl-ic{ font-size:1.08rem; align-self:center; filter:drop-shadow(1px 1px 0 rgba(31,27,22,.14)); }
.wcl-name{ font-size:1.06rem; font-weight:900; letter-spacing:.04em; padding:0 7px; border-radius:3px;
  background:linear-gradient(104deg, rgba(0,0,0,0) 1.5%, var(--hl) 5% 94%, rgba(0,0,0,0) 98.5%); }
.wcl-desc{ font-family:'Caveat','Kaiti SC','STKaiti',KaiTi,cursive; font-size:1.05rem; color:#6b6350; }
.wcl-chip{ flex:none; font-family:ui-monospace,Consolas,monospace; font-size:.58rem; letter-spacing:.08em; color:#8a8270;
  border:1px dashed #c9c0a8; border-radius:999px; padding:2px 8px; background:rgba(255,255,255,.55); }
.wcl-tape{ position:absolute; top:-3px; left:calc(50% - 36px); width:72px; height:15px;
  background:var(--tape, rgba(255,214,90,.45)); transform:rotate(-2.5deg);
  box-shadow:0 1px 2px rgba(0,0,0,.07); border-left:1px dashed rgba(255,255,255,.65); border-right:1px dashed rgba(255,255,255,.65);
  z-index:1; pointer-events:none; }
.wc-line::after{ content:""; position:absolute; left:24%; right:24%; bottom:2px; height:3px; border-radius:2px;
  background:radial-gradient(ellipse at center, var(--hl), transparent 70%); opacity:.5; pointer-events:none; }
[data-theme="starry"] .wc-line, [data-theme="custom"] .wc-line{ --hl:rgba(124,92,252,.30); }
[data-theme="starry"] .wcl-name, [data-theme="custom"] .wcl-name{ color:#E8EAF6; }
[data-theme="starry"] .wcl-desc, [data-theme="custom"] .wcl-desc{ color:#9aa1c0; }
[data-theme="starry"] .wcl-line, [data-theme="custom"] .wcl-line{ border-color:#3a4270; }
[data-theme="starry"] .wcl-line::before, [data-theme="custom"] .wcl-line::before{ border-color:rgba(58,66,112,.5); }
[data-theme="starry"] .wcl-chip, [data-theme="custom"] .wcl-chip{ color:#9aa1c0; border-color:#3a4270; background:rgba(38,44,74,.6); }
[data-theme="starry"] .wcl-tape, [data-theme="custom"] .wcl-tape{ background:rgba(124,92,252,.35); }
[data-theme="classroom"] .wcl-line{ border-color:#bcd8c2; }
@media (max-width:768px){ .wcl-chip{ display:none; } .wc-line::after{ display:none; } }
