/* ============================================================
   线下舞台 · 皮肤「纸白 Paper」（浅色）
   ------------------------------------------------------------
   启用方式（二选一）：
     1) 把 offline-stage.js 里的  var SKIN = 'qingshan'  改成 'paper'
     2) document.querySelector('.vn-layer').setAttribute('data-vn-skin', 'paper')

   本文件只覆盖「令牌 + 少量质感规则」，不碰任何布局。
   底座 offline-stage.css 里的 flex 版面、绝对定位、破形协议全部照旧。
   想临时切回暗色，把 data-vn-theme="light" 去掉即可（本皮肤自带浅色令牌，
   所以两种写法视觉一致）。
   ============================================================ */

.vn-layer[data-vn-skin="paper"],
.vn-layer[data-vn-skin="light"] {
  --vn-theme: light;

  /* 底色：米白纸面 */
  --vn-bg: #f2ede2;
  --vn-tint: rgba(255, 255, 255, .28);
  --vn-grain-opacity: .5;
  --vn-vignette: radial-gradient(104% 78% at 50% 44%, transparent 44%, rgba(112, 96, 70, .20) 100%);

  /* 文字：墨色，不用纯黑 */
  --vn-text: #1b1813;
  --vn-text-soft: rgba(27, 24, 19, .74);
  --vn-text-dim: rgba(27, 24, 19, .46);
  --vn-accent: #9a4b32;                 /* 朱砂 */
  --vn-line: rgba(27, 24, 19, .18);
  --vn-line-soft: rgba(27, 24, 19, .08);

  /* 字体：正文用宋/衬线，UI 保持无衬线 */
  --vn-font-text: Georgia, "Songti SC", "Noto Serif SC", serif;
  --vn-size-text: 15px;
  --vn-lh-text: 2.0;

  /* 气泡：实心纸卡，不要毛玻璃 */
  --vn-bubble-bg: rgba(255, 253, 247, .96);
  --vn-bubble-border: rgba(27, 24, 19, .14);
  --vn-bubble-radius: 2px;
  --vn-bubble-blur: 0px;
  --vn-bubble-shadow: 3px 4px 0 rgba(27, 24, 19, .06), 0 14px 28px -22px rgba(74, 60, 40, .42);

  /* 卡片：白纸 + 硬投影 */
  --vn-card-bg: #fffdf7;
  --vn-card-border: rgba(27, 24, 19, .18);
  --vn-card-radius: 2px;
  --vn-card-blur: 0px;
  --vn-card-shadow: 4px 5px 0 rgba(27, 24, 19, .07), 0 16px 30px -22px rgba(74, 60, 40, .40);

  --vn-avatar-radius: 2px;
  --vn-avatar-shadow: 0 4px 10px rgba(74, 60, 40, .26);
  --vn-scroll-thumb: rgba(27, 24, 19, .20);
  --vn-photo-fallback: linear-gradient(135deg, rgba(27, 24, 19, .10), rgba(27, 24, 19, .02));
  --vn-avatar-fallback: linear-gradient(135deg, rgba(27, 24, 19, .14), rgba(27, 24, 19, .04));
}

/* 纸纤维：用重复渐变当纹理，不加载图片 */
.vn-layer[data-vn-skin="paper"] .vn-bg-grain,
.vn-layer[data-vn-skin="light"] .vn-bg-grain {
  background-image:
    repeating-linear-gradient(0deg, rgba(120, 108, 88, .045) 0 1px, transparent 1px 3px),
    repeating-linear-gradient(90deg, rgba(120, 108, 88, .035) 0 1px, transparent 1px 4px);
  mix-blend-mode: multiply;
}

/* HUD：细线 + 大字距，像书的页眉 */
.vn-layer[data-vn-skin="paper"] .vn-hud,
.vn-layer[data-vn-skin="light"] .vn-hud {
  background: linear-gradient(180deg, rgba(252, 249, 242, .96), rgba(252, 249, 242, 0));
  border-bottom: 1px solid var(--vn-line);
}
.vn-layer[data-vn-skin="paper"] .vn-hud-title,
.vn-layer[data-vn-skin="light"] .vn-hud-title {
  font-family: var(--vn-font-text);
  font-size: 13px;
  letter-spacing: .16em;
}

/* 卡片标题：加一道墨线做压顶 */
.vn-layer[data-vn-skin="paper"] .vn-card-title,
.vn-layer[data-vn-skin="light"] .vn-card-title {
  font-size: 16px;
  letter-spacing: .06em;
}
.vn-layer[data-vn-skin="paper"] .vn-card-kicker,
.vn-layer[data-vn-skin="light"] .vn-card-kicker { letter-spacing: .36em; }

/* 便签：左侧一道竖线，像稿纸边 */
.vn-layer[data-vn-skin="paper"] .vn-card--note,
.vn-layer[data-vn-skin="light"] .vn-card--note {
  border-left: 3px solid var(--vn-accent);
}

/* 相片：白边拍立得 */
.vn-layer[data-vn-skin="paper"] .vn-photo-frame,
.vn-layer[data-vn-skin="light"] .vn-photo-frame {
  background: #ffffff;
  box-shadow: inset 0 0 0 1px rgba(27, 24, 19, .10);
}
