/* 进站提示：光敏性癫痫（2026-10-26 用户：不收敛动态效果，进站时写一个提示）。
   第二版（同日用户）：排成 About 那种文件——白纸、文件头 + 分割线、标题 + 正文、页脚 + 分割线；Continue 用 Back 那种按钮放右下角、箭头朝右、带下划线
   （用户：让访客先熟悉「这种字是能按的」）。尺寸 / 字号照 2K 下 About 卡片量的：可见宽 480、高 744、小字 10、标题 30、正文 19（js/nav.js 的 about*）。
   网页一出来就盖住全站（导航 100 之上），点 Continue 后淡出、页面才开始入场；数值由 js/warning.js 的参数面板写进这些变量。
   var() 里的初值 = warning.js 里 P 的默认值（脚本加载前就要显示），两边要一起改，不然脚本加载那一下会跳。第一版在 archive/warning-v1-2026-10-26/ */
#warn {
  position: fixed; inset: 0; z-index: 1000;
  display: flex; align-items: center; justify-content: center;
  background: var(--warn-bg, #091015);
  opacity: 1; transition: opacity var(--warn-fade, 0.6s) ease;
}
/* 这次会话 / 这台电脑已经看过（index.html 头部的小脚本按存储加的类）：一开始就不显示，不会闪一下 */
html.warn-seen #warn, #warn[hidden] { display: none; }
#warn.out { opacity: 0; pointer-events: none; }
/* 两页叠放（2026-10-26 用户：参考 Hedron 第 2 屏的叠卡，光敏性后面加一页剧透警告）：同一个格子；后面那页往右下错开、转一点、纸色暗一点，前面那页有淡投影 */
#warn .warn-stack { display: grid; margin: 0 var(--warn-dx, 21px) var(--warn-dy, 26px) 0; }   /* 错开露出的那截也算进整块大小（居中时不偏） */
#warn .warn-stack > .warn-card { grid-area: 1 / 1; z-index: 2; box-shadow: var(--warn-shadow, 0 0 18px rgba(0, 0, 0, .18)); transition: transform .25s, background-color .25s; }
#warn .warn-stack > .warn-card.back {
  z-index: 1; cursor: pointer; background: var(--warn-back-paper, #e8e4dc); box-shadow: none;
  transform: translate(var(--warn-dx, 21px), var(--warn-dy, 26px)) rotate(var(--warn-rot, 1.2deg));
}
/* 后面那页的按钮不露出来：往下错开的那截里会露出半个「CONTINUE」，像有两个按钮（换到前面时才显示） */
#warn .warn-stack > .warn-card.back .warn-go { visibility: hidden; }
#warn .warn-stack > .warn-card.back:hover {
  transform: translate(calc(var(--warn-dx, 21px) + var(--warn-hover, 10px)), calc(var(--warn-dy, 26px) + var(--warn-hover, 10px))) rotate(var(--warn-rot, 1.2deg));
}
/* 一张白纸（同导航卡片的 .paper + .plate） */
#warn .warn-card {
  position: relative;   /* 正文按整张纸居中（absolute） */
  box-sizing: border-box;
  width: min(var(--warn-w, 480px), calc(100vw - 32px));
  height: min(calc(var(--warn-w, 480px) * var(--warn-ratio, 1.55)), calc(100vh - 32px));
  display: flex; flex-direction: column; justify-content: space-between;
  padding: 20px var(--warn-pad, 24px) 18px;
  background: var(--warn-paper, #fff); color: var(--warn-ink, #111);
  font-family: var(--font-display); font-weight: 700;
}
/* 文件头：Basic Commercial 大写小字 + 分割线（同 #nav .doc-head） */
#warn .warn-head {
  display: flex; justify-content: space-between; gap: 16px; padding-bottom: 8px; border-bottom: 1.5px solid currentColor;
  font-family: var(--font-body); font-weight: 400; font-size: var(--warn-small, 10px); letter-spacing: .1em; text-transform: uppercase; line-height: 1.5;
}
#warn .warn-head .right { text-align: right; white-space: nowrap; }
/* 正文：标题（同 About this site）+ 一段（同 .about-p）。2026-10-26 用户：左对齐，上下放在纸的正中间（按整张纸算，不是文件头和按钮之间） */
#warn .warn-body {
  position: absolute; left: var(--warn-pad, 24px); right: var(--warn-pad, 24px); top: 50%; transform: translateY(-50%);
}
#warn .warn-title {
  margin: 0 0 var(--warn-gap, 53px);   /* 标题和正文之间空几行（2026-10-26 用户；53 ≈ 正文两行 = 2 × 19 × 1.4） */
  font-size: var(--warn-title, 30px); line-height: 1; letter-spacing: -0.01em;
}
#warn .warn-p em { font-style: italic; }   /* 游戏名（同 About 里的 *Control*） */
#warn .warn-p { margin: 0; font-family: var(--font-body); font-weight: 400; font-size: var(--warn-size, 19px); line-height: var(--warn-line, 1.4); }
/* 页脚：只有右下角的 Continue（2026-10-26 用户：删掉 Notice 和这里的分割线） */
#warn .warn-foot {
  display: flex; justify-content: flex-end; align-items: baseline;
  font-family: var(--font-label); font-weight: 500; font-size: var(--warn-small, 10px); letter-spacing: .14em; text-transform: uppercase; line-height: 1.5;
}
/* Continue = About 的 Back 那种按钮：同一套字（Basic Commercial 大写、字距 .1em），下划线（About 的 Back 也加了，见 css/nav.css） */
#warn .warn-go {
  font: inherit; font-family: var(--font-body); font-weight: 400; letter-spacing: .1em; text-transform: uppercase;
  font-size: var(--warn-btn, 19px);   /* 2026-10-26 用户：和正文一样大 */
  color: inherit; background: none; border: 0; padding: 1px 2px; margin: 0 -2px; cursor: pointer;
  text-decoration: underline; text-underline-offset: .18em; text-decoration-thickness: 1px;
}
#warn .warn-go:focus { outline: none; }
/* 焦点框只在用键盘时画（html.warn-kbd，js/warning.js）：进站时脚本把焦点放在 Continue 上，新开的标签页还没动过鼠标，
   Chrome 会把这个焦点算成 :focus-visible 直接画框（2026-10-27 用户：Live Server 一打开 Continue 上有个框） */
html.warn-kbd #warn .warn-go:focus-visible { outline: 1.5px solid currentColor; outline-offset: 2px; }
