/* =====================================================================
   共鳴線 LyraLine — v2 结构 demo
   左：唱片舞台（position:fixed，随板块切换弹入弹出）
   右：内容列（正常滚动）
   ===================================================================== */

:root {
  /* ---- 企划色板（主题色设定稿）----
     高亮主题色 #E65947 / 辅助文本 #565448 / 辅助文本2 #6A724D / 青 #499CAB / 淡紫 #D8D5F0
     白色 #EBEBEB / 灰色 #D9D9D9 / 基础黑色 #2D2D2D / 可选区灰色 = #E7E7E7 → #303030 的灰阶
     版式参考 KAMITSUBAKI STUDIO：大面积黑白灰 + 直角细线，高亮红只用在"当前 / 聚焦"上 */
  --c-red: #e65947;
  --c-text: #565448;
  --c-olive: #6a724d;
  --c-teal: #499cab;
  --c-lavender: #d8d5f0;
  --c-white: #ebebeb;
  --c-gray: #d9d9d9;
  --c-black: #2d2d2d;

  --bg: var(--c-white);
  --bg-2: var(--c-gray);
  --ink: var(--c-black);
  --muted: var(--c-text);
  --line: rgba(45, 45, 45, .22);
  --accent: var(--c-red);
  --on-accent: var(--c-white);  /* 高亮色上的文字 */
  --panel: transparent;
  --case: var(--c-black);       /* 手提箱（入场 / 尾页）固定用深色 */
  --case-ink: var(--c-white);

  /* ---- 唱片几何（桌面端） ---- */
  /* 唱片右边缘 = disc-cx + disc-r ≈ 画面左侧 1/3（33vw） */
  --disc-r: 31vw;               /* 半径 */
  --disc-cx: 2vw;               /* 圆心距左边缘（负数 = 圆心在屏幕外） */
  --content-left: 42vw;         /* 右侧文字列起点（留出唱片 + 转盘标签的位置） */
  --content-right: 8vw;

  --ease-out: cubic-bezier(.22, 1, .36, 1);
  --ease-in: cubic-bezier(.5, 0, .75, .2);
  --ease-pop: cubic-bezier(.3, 1.35, .5, 1);   /* 弹入时的回弹 */
  --ease-io: cubic-bezier(.65, 0, .35, 1);

  --font-display: 'Cormorant Garamond', 'Times New Roman', serif;   /* 超大标题 / 竖排导航（参考神椿市的 PROJECT THEME） */
  --font-latin: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  --font-ja: 'Zen Kaku Gothic New', 'Hiragino Kaku Gothic ProN', 'Yu Gothic', 'Meiryo', sans-serif;
  --font-zh: 'Noto Sans SC', 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

html[data-theme="dark"] {
  --bg: var(--c-black);
  --bg-2: #3c3c3c;              /* 取自可选区灰阶 */
  --ink: var(--c-white);
  --muted: #a3a29b;             /* 辅助文本在深底上提亮一档，保证可读 */
  --line: rgba(235, 235, 235, .22);
  --case: #1f1f1f;
}

@media (max-width: 1100px) and (min-width: 769px) {
  :root { --disc-r: 36vw; --disc-cx: -4vw; --content-left: 42vw; --content-right: 5vw; }
}

/* ---------- base ---------- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
/* 整屏翻页：根节点不允许用户直接滚动（滚轮/触摸/键盘由 main.js 接管，翻页用 rAF 缓动），
   只有 .page-inner / .menu 这类内部滚动容器可以原生滚动 */
html { overflow: hidden; touch-action: pinch-zoom; -webkit-text-size-adjust: 100%; }
body {
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-latin), var(--font-ja);
  font-size: 15px;
  line-height: 1.9;
  letter-spacing: .06em;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  transition: background-color .4s, color .4s;
}
html:lang(zh) body { font-family: var(--font-latin), var(--font-zh); }
body.is-locked { overflow: hidden; }
a { color: inherit; }
img { max-width: 100%; display: block; }
button { font: inherit; color: inherit; }

.kicker { font-family: var(--font-latin); font-size: 11px; letter-spacing: .24em; text-transform: uppercase; color: var(--muted); }
.muted { color: var(--muted); }
.lead { font-size: clamp(15px, 1.1vw, 17px); line-height: 2; letter-spacing: .08em; max-width: 34em; }
.page-inner p.muted { line-height: 2; letter-spacing: .08em; }


/* 小箭头 ↗（参考站的 Explore ↗ / 一覧を見る ↗） */
.arrow {
  display: inline-block; width: .75em; height: .75em; flex: none;
  background: currentColor; vertical-align: baseline;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%23000' stroke-width='1'%3E%3Cpath d='M1.5 10.5 10.5 1.5M4 1.5h6.5V8'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%23000' stroke-width='1'%3E%3Cpath d='M1.5 10.5 10.5 1.5M4 1.5h6.5V8'/%3E%3C/svg%3E") center / contain no-repeat;
  transition: transform .3s var(--ease-out);
}
a:hover .arrow { transform: translate(2px, -2px); }

/* 直角描边按钮（参考站的「NEWS一覧を見る ↗」） */
/* 细长 > 箭头 */
.chev {
  display: inline-block; width: .6em; height: 1.1em; flex: none; background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 20' fill='none' stroke='%23000' stroke-width='1.2'%3E%3Cpath d='M1.5 1.5 8.5 10l-7 8.5'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 20' fill='none' stroke='%23000' stroke-width='1.2'%3E%3Cpath d='M1.5 1.5 8.5 10l-7 8.5'/%3E%3C/svg%3E") center / contain no-repeat;
  transition: transform .3s var(--ease-out);
}
a:hover .chev { transform: translateX(4px); }

.btn-more {
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
  width: min(100%, 400px); height: 54px; padding: 0 22px 0 28px; margin-top: min(26px, 2.8vh);
  border: 1px solid var(--ink); text-decoration: none;
  font-size: 15px; font-weight: 700; letter-spacing: .06em;
  transition: background-color .3s, color .3s;
}
.btn-more:hover { background: var(--ink); color: var(--bg); }

/* =====================================================================
   左上角 logo：白色字标 + difference 混合 → 压在深色唱片上显示白、压在浅底上显示黑
   ===================================================================== */
.site-logo {
  position: fixed; top: 24px; left: 36px; z-index: 61;
  display: block;
}
/* 白色字标：浅色主题反成黑色 */
.site-logo img { height: 36px; width: auto; }
html:not([data-theme="dark"]) .site-logo img { filter: invert(1); }

/* =====================================================================
   右上角控件：语言切换 / 底色切换 / 菜单（无底色、无边框，纯文字和细线）
   ===================================================================== */
.corner {
  position: fixed; top: 0; right: 0; z-index: 60;
  display: flex; justify-content: flex-end; align-items: center;
  padding: 28px 36px;
  pointer-events: none;
}
.corner > * { pointer-events: auto; }
.corner-right { display: flex; align-items: center; gap: 22px; }

.lang-switch { display: flex; align-items: center; }
.lang-switch button {
  border: 0; background: none; color: var(--muted); cursor: pointer;
  font-family: var(--font-latin); font-size: 12px; line-height: 1; letter-spacing: .06em;
  padding: 6px 0; position: relative;
  transition: color .2s;
}
.lang-switch button + button { margin-left: 22px; }
.lang-switch button + button::before {         /* 分隔符 / */
  content: '/'; position: absolute; left: -14px; color: var(--muted); opacity: .6;
}
.lang-switch button:hover { color: var(--ink); }
.lang-switch button.is-on { color: var(--ink); }
.lang-switch button.is-on::after {             /* 当前语言下划线 */
  content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: currentColor;
}

.icon-btn {
  width: 34px; height: 34px; padding: 0;
  border: 0; background: none;
  cursor: pointer; display: grid; place-items: center; position: relative;
}
.theme-dot {
  width: 14px; height: 14px; border-radius: 50%;
  border: 1px solid var(--ink);
  background: linear-gradient(90deg, var(--ink) 50%, transparent 50%);
  transition: transform .4s var(--ease-out);
}
.theme-btn:hover .theme-dot { transform: rotate(180deg); }
/* 菜单：三根长短不一的细线（参考站的汉堡图标） */
.menu-btn span {
  position: absolute; right: 0; height: 1px; background: var(--ink);
  transition: transform .35s var(--ease-io), top .35s var(--ease-io), width .35s var(--ease-io), opacity .2s;
}
.menu-btn span:nth-child(1) { top: 10px; width: 34px; }
.menu-btn span:nth-child(2) { top: 17px; width: 26px; }
.menu-btn span:nth-child(3) { top: 24px; width: 34px; }
.menu-btn:hover span:nth-child(2) { width: 34px; }
.menu-btn.is-open span:nth-child(1) { top: 17px; width: 30px; transform: rotate(30deg); }
.menu-btn.is-open span:nth-child(2) { opacity: 0; }
.menu-btn.is-open span:nth-child(3) { top: 17px; width: 30px; transform: rotate(-30deg); }

/* 右侧竖排导航（参考 TNK 右侧的 WHAT WE DO / COMPANY …）：手机端退化成短线 */
.dots {
  position: fixed; right: 26px; top: 50%; transform: translateY(-50%); z-index: 30;
  display: flex; flex-direction: column; align-items: center; gap: min(26px, 2.6vh);
}
.dots button {
  position: relative; padding: 0; border: 0; background: none; cursor: pointer;
  writing-mode: vertical-rl;
  font-family: var(--font-display); font-weight: 500; font-size: min(16px, 1.85vh); letter-spacing: .1em; line-height: 1;
  color: var(--muted); transition: color .25s;
}
.dots button:hover { color: var(--ink); }
.dots button.is-on { color: var(--ink); }
.dots button::before {                         /* 当前项左侧的红点 */
  content: ''; position: absolute; left: -9px; top: 0; width: 4px; height: 4px; border-radius: 50%;
  background: var(--accent); opacity: 0; transition: opacity .25s;
}
.dots button.is-on::before { opacity: 1; }

/* 当前位置（右下角）：01 / 07  NEWS */
.now {
  position: fixed; right: 36px; bottom: 26px; z-index: 30;
  display: flex; align-items: baseline; gap: 18px;
  font-family: var(--font-latin); font-size: 11px; letter-spacing: .14em; color: var(--muted);
}
.now-letter { color: var(--ink); word-spacing: .4em; }
::selection { background: var(--accent); color: var(--on-accent); }

/* =====================================================================
   菜单覆盖层：快速回归首页目录
   ===================================================================== */
.menu {
  position: fixed; inset: 0; z-index: 50;
  background: var(--bg);
  opacity: 0; visibility: hidden;
  transition: opacity .35s var(--ease-io), visibility 0s .35s;
  overflow: auto; overscroll-behavior: contain; touch-action: pan-y;
}
.menu.is-open { opacity: 1; visibility: visible; transition: opacity .35s var(--ease-io), visibility 0s; }
.menu-inner {
  min-height: 100%; max-width: 760px; margin: 0 auto;
  padding: 16vh 28px 10vh;
  display: flex; flex-direction: column; gap: 28px;
}
.menu-head, .dir-head { display: flex; align-items: baseline; gap: 14px; }
.menu-head > span:last-child, .dir-head > span:last-child { font-size: 13px; color: var(--muted); }
.menu .dir-list a { padding: 16px 0; }
.menu .dir-list .latin { font-size: clamp(22px, 3vw, 34px); }
.menu-foot { margin-top: auto; font-size: 12px; color: var(--muted); }
.menu .dir-list a { transform: translateY(12px); opacity: 0; transition: transform .5s var(--ease-out), opacity .5s, padding-left .3s var(--ease-out); }
.menu .dir-list a:hover { padding-left: 8px; }
.menu.is-open .dir-list a { transform: none; opacity: 1; }
.menu.is-open .dir-list li:nth-child(2) a { transition-delay: .04s; }
.menu.is-open .dir-list li:nth-child(3) a { transition-delay: .08s; }
.menu.is-open .dir-list li:nth-child(4) a { transition-delay: .12s; }
.menu.is-open .dir-list li:nth-child(5) a { transition-delay: .16s; }
.menu.is-open .dir-list li:nth-child(6) a { transition-delay: .20s; }

/* 目录列表（首页目录 + 菜单共用） */
.dir-list { list-style: none; }
.dir-list a {
  display: grid;
  grid-template-columns: 2.4em 1fr auto;
  grid-template-areas: "b latin local" "b subs subs";
  align-items: baseline; column-gap: 14px;
  padding: 12px 0; border-top: 1px solid var(--line);
  text-decoration: none;
}
.dir-list li:last-child a { border-bottom: 1px solid var(--line); }
.dir-list b { grid-area: b; font-family: var(--font-latin); font-weight: 400; font-size: 12px; letter-spacing: .2em; color: var(--muted); }
.dir-list .latin { grid-area: latin; font-family: var(--font-latin); font-weight: 500; letter-spacing: .06em; font-size: clamp(17px, 1.4vw, 21px); line-height: 1.2; transition: color .2s, transform .35s var(--ease-out); }
.dir-list .local { grid-area: local; font-size: 13px; color: var(--muted); }
.dir-list .subs { grid-area: subs; font-size: 12px; color: var(--muted); margin-top: 2px; }
.dir-list .subs em { font-style: normal; margin: 0 .5em; opacity: .5; }
.dir-list a:hover .latin, .dir-list a.is-current .latin { color: var(--accent); }
.dir-list a.is-current b { color: var(--accent); }
.dir-list a.is-current .latin { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 6px; }

/* =====================================================================
   左侧唱片舞台
   状态：默认停在左下方（车位）/ .is-above 停在左上方 / .is-active 在位
   向下滚：旧唱片 → 左上弹出，新唱片 ← 左下弹入；向上滚则相反
   ===================================================================== */
.disc-stage { position: fixed; inset: 0; z-index: 5; pointer-events: none; overflow: hidden; }
.disc {
  position: absolute;
  width: calc(var(--disc-r) * 2);
  height: calc(var(--disc-r) * 2);
  left: calc(var(--disc-cx) - var(--disc-r));
  top: calc(50vh - var(--disc-r));
  transform: translate3d(-68%, 26%, 0) rotate(18deg);
  visibility: hidden;
  transition: transform .7s var(--ease-in), visibility 0s .7s;
  will-change: transform;
}
.disc.is-above { transform: translate3d(-68%, -26%, 0) rotate(-18deg); }
.disc.is-active {
  transform: none; visibility: visible;
  transition: transform .9s var(--ease-pop) .1s, visibility 0s;
}
.disc.no-transition { transition: none !important; }
.disc::before {
  content: ''; position: absolute; inset: 0; border-radius: 50%;
  box-shadow: none;
}

/* 唱片本体：demo 阶段用纯色 + 纹路；有真实图后放 <img class="disc-img"> */
.disc-face {
  position: absolute; inset: 0; border-radius: 50%; overflow: hidden;
  background:
    repeating-radial-gradient(circle at 50% 50%, rgba(0, 0, 0, .10) 0 1.5px, transparent 1.5px 8px),
    var(--disc-color, #888);
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .12);
  will-change: transform;
}
.disc-face::after {                /* 光泽 */
  content: ''; position: absolute; inset: 0; border-radius: 50%;
  background: conic-gradient(from 0deg,
    transparent 0 32%, rgba(255, 255, 255, .14) 40%, transparent 48%,
    transparent 78%, rgba(255, 255, 255, .10) 86%, transparent 94%);
  mix-blend-mode: screen;
}
.disc-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.disc-label {
  position: absolute; inset: 34%; border-radius: 50%;
  background: var(--disc-label, #f2eee4); color: var(--disc-ink, #171717);
  text-align: center;
  font-weight: 700; font-size: clamp(13px, 1.5vw, 24px); letter-spacing: .18em;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .12);
}
.disc-label span { position: absolute; left: 8%; right: 8%; top: 22%; line-height: 1.2; }   /* 文字放在中心孔上方 */
.disc-hole {
  position: absolute; inset: 48.6%; border-radius: 50%;
  background: var(--bg);
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, .35);
  transition: background-color .4s;
}

/* 真实唱片图（assets/img/discs/*.webp，透明底）：
   去掉 demo 的纯色 / 纹路 / 光泽 / 标签 / 孔；不加阴影 */
.disc--img::before { display: none; }
.disc--img .disc-face { background: none; box-shadow: none; overflow: visible; }
.disc--img .disc-face::after { display: none; }
.disc--img .disc-label, .disc--img .disc-hole { display: none; }
.disc--img .disc-img {
  object-fit: contain; border-radius: 0;
  user-select: none; -webkit-user-drag: none;
}
/* 非圆盘（E：WP-7 侧脸）：不裁圆、不转，按 --disc-scale 缩小后居中放在唱片位上 */
.disc--free .disc-face { border-radius: 0; inset: calc((1 - var(--disc-scale, 1)) * 50%); }

/* =====================================================================
   转盘目录：目录标题沿唱片右侧圆弧排布，翻页时整圈跟着滚动位置转动，
   转到 3 点钟方向（指针位置）的就是当前板块（草图里的红框）
   ===================================================================== */
.dial {
  position: absolute; z-index: 2;
  width: calc(var(--disc-r) * 2); height: calc(var(--disc-r) * 2);
  left: calc(var(--disc-cx) - var(--disc-r)); top: calc(50vh - var(--disc-r));
  pointer-events: none; opacity: 0; transition: opacity .5s;
}
.disc-stage[data-active]:not([data-active="none"]) .dial { opacity: 1; }
.dial-item {
  position: absolute; left: 50%; top: 50%;
  transform-origin: 0 50%;
  /* 以圆心为原点转到 --a 度，再沿半径推到唱片边缘附近（标题一半在盘上一半在盘外） */
  transform: translate(0, -50%) rotate(calc(var(--a, 0) * 1deg)) translateX(calc(var(--disc-r) - 1.5vw)) translateX(-50%);
  pointer-events: auto; cursor: pointer;
  transition: opacity .35s;
}
/* 直角标签（参考神椿市的导航）：当前项 = 墨色方块 + 反白粗体；其余 = 底色方块 + 粗体墨字（底色块保证压在唱片图上也能读） */
.dial-item span {
  display: inline-flex; align-items: baseline; gap: 8px; white-space: nowrap;
  padding: 5px 10px 4px; border-radius: 0;
  background: var(--bg); color: var(--ink);
  font-family: var(--font-latin); font-size: 12px; letter-spacing: .1em; font-weight: 700; line-height: 1.4;
  transition: background-color .3s, color .3s, font-size .3s, padding .3s;
}
.dial-item b { font-weight: 500; color: inherit; opacity: .55; font-size: .85em; }
.dial-item:hover span { background: var(--bg-2); }
.dial-item.is-focus span { background: var(--ink); color: var(--bg); font-size: 15px; padding: 7px 14px 6px; }
.dial-item.is-focus b { opacity: .7; }
.dial-item.is-near { opacity: .9; }
.dial-item.is-far { opacity: 0; pointer-events: none; }

/* =====================================================================
   右侧内容列
   ===================================================================== */
.stage { position: relative; }                  /* GSAP 在这上面做回弹（y）和悬停视差（x） */
.content { position: relative; z-index: 2; margin-left: var(--content-left); padding-right: var(--content-right); }
.page {
  position: relative;
  height: 100vh; height: 100dvh;                 /* 每个板块正好一屏 */
  display: flex; flex-direction: column; justify-content: center;
  padding: 9vh 0 7vh;
  /* 内容溢出由 .page-inner 处理。
     微滚预览时 GSAP 会给 .page 加 y / scale */
  transform-origin: 50% 50%;
}
/* 板块内容；超出一屏时在这里面滚，滚到底再翻页 */
.page-inner {
  min-height: 0; max-height: 100%;
  overflow-y: auto; overscroll-behavior: contain; touch-action: pan-y;
  scrollbar-width: thin; scrollbar-color: var(--line) transparent;
  padding-right: 6px;
}
/* 内容还没滚到底：底部渐隐提示"下面还有" */
.page.has-more::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 12vh;
  background: linear-gradient(to bottom, transparent, var(--bg) 70%);
  pointer-events: none; z-index: 1;
}

/* 内容进入视口时淡入 */
/* 注意位移用负值（从上方落入）：向下的 transform 会撑大 .page-inner 的可滚动高度，导致翻页前先滚十几像素 */
.page-inner > * { opacity: 0; transform: translateY(-12px); transition: opacity .7s var(--ease-out), transform .7s var(--ease-out); }
.page-inner > .is-in { opacity: 1; transform: none; }
.page-inner > :nth-child(2).is-in { transition-delay: .05s; }
.page-inner > :nth-child(3).is-in { transition-delay: .10s; }
.page-inner > :nth-child(4).is-in { transition-delay: .15s; }
.page-inner > :nth-child(5).is-in { transition-delay: .20s; }

/* 板块标题（参考神椿市 PROJECT THEME + TNK CONTACT FORM）：
   小字母编号 → 超大衬线英文标题 → 黑底白字的本地语言副标题条 */
.page-head { display: block; margin-bottom: min(22px, 2.4vh); }
.page-letter {
  display: flex; align-items: center; gap: 12px; margin-bottom: 6px;
  font-family: var(--font-latin); font-size: 12px; letter-spacing: .24em; color: var(--muted);
}
.page-letter::after { content: ''; width: 40px; height: 1px; background: currentColor; }
.page-title {
  font-family: var(--font-display); font-weight: 500;
  font-size: clamp(52px, min(6.6vw, 11.5vh), 124px); line-height: .86; letter-spacing: .01em;   /* 同时受宽高限制，矮屏不会挤出一屏 */
  margin-left: -.04em;                         /* 大字号的左侧字形留白，视觉上对齐正文 */
}
.page-local {
  display: table; margin-top: 14px;
  padding: .22em .6em .18em; background: var(--ink); color: var(--bg);
  font-size: clamp(16px, 1.35vw, 20px); font-weight: 700; letter-spacing: .08em; line-height: 1.4;
}

/* 子目录 01 02 03 */
.subnav {
  list-style: none; counter-reset: sub;
  display: flex; flex-wrap: wrap; gap: 6px 26px; margin-bottom: min(22px, 2.4vh);
  font-size: 13px; color: var(--muted);
}
.subnav li { display: flex; align-items: baseline; gap: 8px; }
.subnav li::before {
  counter-increment: sub; content: counter(sub, decimal-leading-zero);
  font-family: var(--font-latin); font-size: 11px; letter-spacing: .08em; color: var(--ink);
}

/* 列表条目：无底色、无圆角，条目之间一条细线（参考站的 NEWS 列表） */
.card-list { display: grid; margin-top: 4px; border-top: 1px solid var(--line); }
.card {
  border: 0; border-bottom: 1px solid var(--line); border-radius: 0; padding: min(16px, 1.7vh) 0; background: none;
  transition: opacity .2s;
}
.card h3 { font-size: 15px; font-weight: 700; letter-spacing: .04em; margin: 6px 0 4px; }
.card.row { display: block; }
.card-date { display: block; font-family: var(--font-latin); font-size: 15px; letter-spacing: .06em; color: var(--ink); }
.card-date + div { display: flex; flex-direction: column; align-items: flex-start; }
.card-date + div .tag { order: -1; margin-top: 8px; }
.card p.muted { font-size: 13px; margin-top: 2px; }
.ph {
  aspect-ratio: 16 / 9; max-height: 22vh; border-radius: 0; border: 1px solid var(--line);
  background: repeating-linear-gradient(-45deg, var(--bg-2) 0 1px, transparent 1px 12px);
  display: grid; place-items: center;
  color: var(--muted); font-family: var(--font-latin); font-size: 11px; letter-spacing: .24em; text-transform: uppercase;
}
.ph.square { aspect-ratio: 1; }
/* 标签：小胶囊（参考站 NOTICE / RELEASE） */
.tag {
  display: inline-block; white-space: nowrap; line-height: 1.3;
  font-family: var(--font-latin); font-size: 11px; font-weight: 500; letter-spacing: .04em;
  padding: 4px 8px 3px; border-radius: 11px;
  border: 1px solid var(--ink); color: var(--ink);
}
.tag.on { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }

/* ---------- 首页 ---------- */
.home-title { margin: 0; display: flex; flex-direction: column; align-items: flex-start; }
.home-logo { width: min(560px, 36vw); height: auto; }
html:not([data-theme="dark"]) .home-logo { filter: invert(1); }    /* 白色字标 → 浅色底上反成黑色 */
.dir-head { margin-bottom: 8px; }
/* SCROLL DOWN + 向下流动的竖线 */
.scroll-cue {
  position: absolute; bottom: 0; right: 0;
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  font-family: var(--font-latin); font-size: 12px; font-weight: 500; letter-spacing: .06em; color: var(--muted);
}
.scroll-arrow { width: 1px; height: 54px; background: var(--line); position: relative; overflow: hidden; }
.scroll-arrow::after { content: ''; position: absolute; inset: 0; background: var(--accent); animation: cue 1.8s var(--ease-io) infinite; }
@keyframes cue { 0% { transform: translateY(-100%); } 60%, 100% { transform: translateY(100%); } }

/* ---------- B 作品 ---------- */
.works-grid { display: grid; grid-template-columns: 1fr; gap: 14px; margin-top: 8px; align-items: start; }
.track { display: flex; gap: 16px; align-items: center; padding: 14px 0; }
.track h3 { margin: 0; }
.track-cover { width: 48px; height: 48px; border-radius: 0; flex: none; background: var(--bg-2); border: 1px solid var(--line); overflow: hidden; }
.track-cover img { width: 100%; height: 100%; object-fit: cover; }
.track-meta { flex: 1; min-width: 0; }
.track-meta span { font-size: 12px; color: var(--muted); }

/* ---------- C 世界介绍 ---------- */
.world-grid { display: grid; grid-template-columns: 1fr 200px; gap: 28px; align-items: start; }
.world-text p + p { margin-top: 12px; }
.char-card { text-align: center; }
.char-card img { width: 100%; height: auto; }
.char-name { font-family: var(--font-latin); font-weight: 500; font-size: 22px; letter-spacing: .12em; margin-top: 8px; }
.char-role { font-size: 12px; color: var(--muted); letter-spacing: .2em; }
.char-desc { font-size: 13px; color: var(--muted); text-align: left; margin-top: 10px; }

/* ---------- D 成员构成 ---------- */
/* 成员：直角细线网格（格子之间共用一条线） */
.member-grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid var(--line); border-left: 1px solid var(--line);
}
.member {
  text-align: center; padding: 20px 12px; cursor: pointer;
  border: 0; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line);
  transition: background-color .3s;
}
.member:hover { background: var(--bg-2); }
.member h3 { font-family: var(--font-latin); font-weight: 500; }
.avatar {
  width: 64px; height: 64px; border-radius: 50%; margin: 0 auto 10px;
  background: var(--c, #999); position: relative;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .1);
}
.avatar::after { content: ''; position: absolute; inset: 44%; border-radius: 50%; background: var(--bg); }   /* 小唱片头像 */
.member h3 { font-size: 14px; }
.member p { font-size: 12px; color: var(--muted); }

/* ---------- E 关于我们 ---------- */
.platforms { display: flex; flex-wrap: wrap; gap: 10px; margin: 18px 0 26px; }
.platforms a {
  display: inline-flex; align-items: center; gap: 10px;
  height: 44px; padding: 0 20px; border: 1px solid var(--ink); border-radius: 0;
  text-decoration: none; font-family: var(--font-latin); font-size: 13px; font-weight: 500; letter-spacing: .04em;
  transition: background-color .3s, color .3s;
}
.platforms a:hover { background: var(--ink); color: var(--bg); }
.contact {
  display: flex; align-items: center; gap: 28px;
  padding: 26px 28px; margin-top: 10px; max-width: 640px;
  background: var(--ink); color: var(--bg); text-decoration: none;
}
.contact-label { font-size: 14px; font-weight: 700; letter-spacing: .06em; min-width: 7em; }
.contact-mail { flex: 1; font-family: var(--font-latin); font-size: 17px; font-weight: 500; letter-spacing: .04em; }
.contact-note { font-size: 13px; margin-top: 10px; }

/* =====================================================================
   尾页：合上手提箱（两根立柱从上下合入）
   ===================================================================== */
.footer {
  position: relative; z-index: 2;
  height: 100vh; height: 100dvh;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; gap: 14px; padding: 12vh 24px; overflow: hidden;
}
.pillar {
  position: absolute; top: -2%; bottom: -2%;
  width: clamp(44px, 6.5vw, 100px);
  background: linear-gradient(var(--case) 0 36%, var(--case-ink) 36% 39%, var(--case) 39% 58%, var(--case-ink) 58% 61%, var(--case) 61%);
  transform: translateY(-104%);
  transition: transform 1.1s var(--ease-out);
}
.pillar.l { left: 18%; }
.pillar.r { right: 18%; transform: translateY(104%); transition-delay: .1s; }
.footer.is-active .pillar { transform: none; }
.thanks {
  font-family: var(--font-latin); font-size: clamp(26px, 3.6vw, 50px); font-weight: 400; letter-spacing: .24em;
  padding: .35em .8em .3em 1.04em; border: 1px solid var(--ink); background: var(--bg);
}
.footer-line { font-size: 14px; }
.footer-copy { font-size: 11px; letter-spacing: .2em; color: var(--muted); margin-top: 28px; }
.footer-top { font-size: 11px; letter-spacing: .25em; text-transform: uppercase; color: var(--muted); text-decoration: none; border-bottom: 1px solid currentColor; }

/* =====================================================================
   入场动画：打开 WP-7 的手提箱（占位版：上盖翻开 + 下底滑走）
   ===================================================================== */
.intro { position: fixed; inset: 0; z-index: 100; perspective: 1200px; cursor: pointer; }
.intro-lid, .intro-base { position: absolute; left: 0; right: 0; height: 50%; background: var(--case); }
.intro-lid { top: 0; transform-origin: 50% 0; transition: transform 1.1s var(--ease-io); backface-visibility: hidden; }
.intro-lid::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: rgba(255, 255, 255, .12); }
.intro-base { bottom: 0; transition: transform .9s var(--ease-io) .15s; }
.intro-mark {
  position: absolute; inset: 0; pointer-events: none;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 26px;
  color: var(--case-ink); transition: opacity .3s;
}
.intro-x { width: 96px; height: 96px; position: relative; }
.intro-x::before, .intro-x::after {
  content: ''; position: absolute; left: 50%; top: 50%; width: 18px; height: 124px;
  background: var(--case-ink); transform: translate(-50%, -50%) rotate(45deg);
}
.intro-x::after { transform: translate(-50%, -50%) rotate(-45deg); }
.intro-logo { width: min(220px, 50vw); height: auto; }
.intro-tip { font-family: var(--font-latin); font-size: 10px; letter-spacing: .3em; opacity: .5; animation: blink 1.6s ease-in-out infinite; }
@keyframes blink { 50% { opacity: .15; } }
.intro.is-open .intro-lid { transform: rotateX(-100deg); }
.intro.is-open .intro-base { transform: translateY(100%); }
.intro.is-open .intro-mark { opacity: 0; }
.intro.is-done { display: none; }

/* =====================================================================
   手机端：唱片改为顶部半圆，内容全宽；唱片左右横向弹入弹出
   ===================================================================== */
@media (max-width: 768px) {
  :root { --disc-r: 37vw; --content-left: 0px; --content-right: 0px; }
  body { font-size: 14px; }

  /* 圆心放在 12vh，标签区避开顶部按钮 */
  .disc {
    left: calc(50vw - var(--disc-r));
    top: calc(12vh - var(--disc-r));
    transform: translate3d(115%, 0, 0) rotate(30deg);
  }
  .disc.is-above { transform: translate3d(-115%, 0, 0) rotate(-30deg); }
  .disc-label { font-size: 12px; }

  /* 转盘目录：手机上唱片是顶部半圆，指针改到 6 点钟方向（底部），标题文字由 JS 反转保持水平 */
  .dial { left: calc(50vw - var(--disc-r)); top: calc(12vh - var(--disc-r)); }
  .dial-item { transform: translate(0, -50%) rotate(calc(var(--a, 0) * 1deg)) translateX(calc(var(--disc-r) + 3vw)) translateX(-50%); }
  .dial-item span { font-size: 10px; padding: 3px 7px; letter-spacing: .08em; }
  .dial-item.is-focus span { font-size: 12px; padding: 5px 10px; }

  .content { margin-left: 0; padding: 0 20px; }
  .page { padding: calc(12vh + var(--disc-r) + 3vh) 0 5vh; justify-content: flex-start; }
  .page-inner { padding-right: 0; }
  .card { padding: 14px 0; }
  .card-date { font-size: 14px; }
  .dir-list a { padding: 10px 0; }
  .dots { right: 8px; gap: 4px; align-items: flex-end; }
  .dots button { writing-mode: horizontal-tb; width: 8px; height: 13px; background: linear-gradient(var(--muted), var(--muted)) right center / 100% 1px no-repeat; transition: width .35s var(--ease-out); }
  .dots button span, .dots button::before { display: none; }
  .dots button.is-on { width: 16px; background-image: linear-gradient(var(--accent), var(--accent)); }

  .site-logo { top: 16px; left: 18px; }
  .site-logo img { height: 24px; }
  .corner { padding: 12px 14px; }
  .corner-right { gap: 12px; padding: 4px 4px 4px 14px; background: var(--bg); }
  .lang-switch button { font-size: 11px; }
  .lang-switch button + button { margin-left: 16px; }
  .lang-switch button + button::before { left: -11px; }
  .icon-btn { width: 28px; height: 28px; }
  .menu-btn span:nth-child(1) { top: 7px; width: 28px; }
  .menu-btn span:nth-child(2) { top: 14px; width: 20px; }
  .menu-btn span:nth-child(3) { top: 21px; width: 28px; }
  .menu-btn.is-open span:nth-child(1), .menu-btn.is-open span:nth-child(3) { top: 14px; width: 24px; }
  .now { right: 18px; bottom: 14px; padding: 4px 0 4px 10px; background: var(--bg); }
  .menu-inner { padding-top: 14vh; }

  .home-logo { width: min(320px, 78vw); }
  .page-home { justify-content: center; }   /* 首页只有 logo：在唱片下方的剩余空间里垂直居中 */
  .scroll-cue { display: none; }

  .page-head { margin-bottom: 16px; }
  .page-title { font-size: clamp(38px, 11vw, 52px); }
  .page-local { font-size: 15px; margin-top: 10px; }
  .contact { flex-wrap: wrap; gap: 6px 16px; padding: 18px 20px; }
  .contact-mail { font-size: 15px; }
  .btn-more { width: 100%; }
  .world-grid { grid-template-columns: 1fr; }
  .char-card { display: grid; grid-template-columns: 120px 1fr; gap: 0 16px; align-items: center; text-align: left; }
  .char-card img { grid-row: span 3; }
  .char-desc { grid-column: 2; }
  .member-grid { grid-template-columns: repeat(2, 1fr); }
  .pillar.l { left: 10%; }
  .pillar.r { right: 10%; }
}

/* =====================================================================
   首页列表条目改成链接（内容由 js/render.js 按 js/data.js 渲染）
   ===================================================================== */
.card-link { text-decoration: none; }
.card-link h3 { transition: color .2s; }
.card-link:hover h3 { color: var(--accent); }
a.member { display: block; text-decoration: none; }
.member p em, .profile-roles em { font-style: normal; margin: 0 .4em; opacity: .5; }
.avatar.has-img { background: var(--bg-2); overflow: hidden; }
.avatar.has-img::after { display: none; }
.avatar.has-img img { width: 100%; height: 100%; object-fit: cover; }
#homeWorks + .btn-more, .works-grid + .btn-more { margin-top: 18px; }

/* =====================================================================
   子页面（news.html / works.html / members.html）：普通滚动
   桌面：左列固定板块标题（占首页唱片的位置），右列内容；手机：上下排
   ===================================================================== */
html.is-sub { overflow: auto; overflow-x: hidden; touch-action: auto; scroll-behavior: smooth; }
html.is-sub.is-locked { overflow: hidden; }
html.is-sub .site-logo { position: absolute; }                 /* 子页：logo 跟着页面滚走，不压在内容上 */
html.is-sub .corner-right { background: var(--bg); padding: 4px 0 4px 16px; transition: background-color .4s; }   /* 滚动时控件不压在内容上 */
.sub {
  display: grid; grid-template-columns: minmax(280px, 34vw) minmax(0, 1fr);
  gap: 0 6vw; padding: 0 var(--content-right) 0 36px;
  min-height: 100vh; min-height: 100dvh;
}
.sub-side {
  position: sticky; top: 0; align-self: start;
  height: 100vh; height: 100dvh;
  display: flex; flex-direction: column; justify-content: center; gap: 22px;
  padding: 120px 0 60px;
  opacity: 0; transform: translateY(-12px); transition: opacity .7s var(--ease-out), transform .7s var(--ease-out);
}
.sub-side.is-in { opacity: 1; transform: none; }
.sub-side .page-head { margin: 0; }
.sub-lead { max-width: 22em; }
.sub-note { font-size: 13px; }
.sub-back {
  display: inline-flex; align-items: center; gap: 10px; align-self: flex-start;
  font-size: 12px; letter-spacing: .12em; color: var(--muted); text-decoration: none;
  transition: color .2s;
}
.sub-back .chev { transform: scaleX(-1); }
.sub-back:hover { color: var(--ink); }
.sub-back:hover .chev { transform: scaleX(-1) translateX(4px); }

/* 筛选 / 分组：竖排一列，左边一条细线，当前项红点 + 墨色 */
.sub-filter { display: flex; flex-direction: column; align-items: flex-start; border-left: 1px solid var(--line); }
.sub-filter > * {
  position: relative; display: flex; align-items: baseline; gap: 14px;
  padding: 6px 0 6px 18px; border: 0; background: none; cursor: pointer; text-decoration: none;
  color: var(--muted); transition: color .2s, padding-left .3s var(--ease-out);
}
.sub-filter > * span:first-child { font-family: var(--font-latin); font-size: 13px; font-weight: 600; letter-spacing: .12em; }
.sub-filter > * span:last-child { font-size: 12px; }
.sub-filter > *::before {
  content: ''; position: absolute; left: -1px; top: 8px; bottom: 8px; width: 2px;
  background: var(--accent); transform: scaleY(0); transition: transform .3s var(--ease-out);
}
.sub-filter > *:hover { color: var(--ink); padding-left: 22px; }
.sub-filter > .is-on { color: var(--ink); }
.sub-filter > .is-on::before { transform: none; }
body.is-detail .sub-filter { display: none; }

.sub-main { padding: 140px 0 100px; min-width: 0; }
.empty { padding: 40px 0; }

/* 淡入（js/sub.js 给条目加 .fx，进入视口加 .is-in） */
.fx { opacity: 0; transform: translateY(14px); transition: opacity .7s var(--ease-out), transform .7s var(--ease-out); }
.fx.is-in { opacity: 1; transform: none; }

/* ---------- 新闻一览：日期 | 标签 | 标题 | > ---------- */
.news-list { margin-top: 0; }
.news-row {
  display: grid; grid-template-columns: 7.5em 6.5em minmax(0, 1fr) auto; align-items: baseline; gap: 0 20px;
  padding: 26px 0; transition: padding-left .3s var(--ease-out);
}
.news-row:hover { padding-left: 8px; }
.news-row .card-date { color: var(--muted); }
.news-row h3 { margin: 0; font-size: 16px; }
.news-row .chev { align-self: center; color: var(--muted); }

/* ---------- 作品一览：两列卡片 ---------- */
.work-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 48px 32px; }
.work-card { display: block; text-decoration: none; }
.work-cover {
  aspect-ratio: 16 / 9; overflow: hidden; border: 1px solid var(--line);
  background: repeating-linear-gradient(-45deg, var(--bg-2) 0 1px, transparent 1px 12px);
}
.work-cover img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--ease-out), filter .4s; }
.work-card:hover .work-cover img { transform: scale(1.04); }
.work-info { padding-top: 14px; }
.work-no { display: flex; justify-content: space-between; font-family: var(--font-latin); font-size: 12px; letter-spacing: .12em; color: var(--muted); }
.work-no span:first-child { color: var(--ink); }
.work-title { font-size: 20px; font-weight: 700; letter-spacing: .06em; margin: 6px 0 8px; transition: color .2s; }
.work-card:hover .work-title { color: var(--accent); }
.work-kicker { display: flex; align-items: center; gap: 12px; font-family: var(--font-latin); font-size: 12px; letter-spacing: .08em; }
.work-info p.muted { font-size: 13px; margin-top: 10px; line-height: 1.9; }

/* ---------- 详情（新闻 / 作品共用） ---------- */
.article { max-width: 760px; }
.article-meta { display: flex; align-items: center; gap: 16px; margin-bottom: 14px; }
.article-meta .card-date { color: var(--muted); }
.article-title { font-size: clamp(22px, 2.2vw, 32px); font-weight: 700; letter-spacing: .06em; line-height: 1.5; margin: 4px 0 18px; }
.work-detail .article-title { margin-left: -.5em; }               /* 「」的左半个字宽，视觉上对齐 */
.work-no-big { font-family: var(--font-latin); font-weight: 300; font-size: 40px; line-height: 1; letter-spacing: .02em; }
.article .lead { margin-bottom: 28px; }
.article-img { margin: 8px 0 32px; border: 1px solid var(--line); }
.article-img img { width: 100%; height: auto; }
.prose { font-size: 15px; line-height: 2.1; letter-spacing: .08em; }
.prose p + p { margin-top: 1.2em; }
.prose a { color: var(--accent); }
.article .btn-more { margin-top: 36px; }

.player { position: relative; aspect-ratio: 16 / 9; background: #000; margin: 8px 0 12px; }
.player iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.player.ph { max-height: none; background-color: var(--bg-2); background-size: cover; background-position: center; }
.player.ph span { padding: 6px 12px; background: var(--bg); }
.player-src { display: flex; gap: 18px; margin-bottom: 20px; }
.player-src button {
  border: 0; background: none; padding: 4px 0; cursor: pointer; color: var(--muted);
  font-family: var(--font-latin); font-size: 12px; letter-spacing: .1em; border-bottom: 1px solid transparent;
}
.player-src button.is-on { color: var(--ink); border-color: currentColor; }

.block { margin-top: 48px; }
.block-title {
  display: flex; align-items: baseline; gap: 14px;
  padding-bottom: 12px; margin-bottom: 4px; border-bottom: 1px solid var(--ink);
  font-size: 13px; font-weight: 500; color: var(--muted);
}
.block-title span:first-child { font-family: var(--font-display); font-size: 28px; font-weight: 500; line-height: 1; color: var(--ink); letter-spacing: .02em; }
.block-title b { margin-left: auto; font-family: var(--font-latin); font-weight: 400; font-size: 12px; letter-spacing: .12em; }
.credits { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 32px; }
.credits div { display: flex; justify-content: space-between; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--line); font-size: 14px; }
.credits dt { color: var(--muted); }
.credits dd { font-family: var(--font-latin); font-weight: 500; text-align: right; }
.tracks { list-style: none; counter-reset: tr; }
.tracks li { display: flex; gap: 18px; padding: 12px 0; border-bottom: 1px solid var(--line); font-size: 14px; }
.tracks li::before { counter-increment: tr; content: counter(tr, decimal-leading-zero); font-family: var(--font-latin); font-size: 12px; color: var(--muted); }
.tracks li span:first-child { flex: 1; }
.tracks li span:last-child { font-family: var(--font-latin); color: var(--muted); }
.note summary { cursor: pointer; list-style: none; }
.note summary::-webkit-details-marker { display: none; }
.note summary .chev { margin-left: auto; transform: rotate(90deg); transition: transform .3s var(--ease-out); }
.note[open] summary .chev { transform: rotate(-90deg); }
.note .prose { padding-top: 16px; }

/* 上一篇 / 一览 / 下一篇 */
.pager {
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 20px;
  max-width: 760px; margin-top: 72px; padding-top: 22px; border-top: 1px solid var(--line);
}
.pager a { text-decoration: none; transition: color .2s; }
.pager a:hover { color: var(--accent); }
.pager-prev, .pager-next { display: flex; flex-direction: column; gap: 4px; font-size: 14px; font-weight: 700; min-width: 0; }
.pager-next { text-align: right; }
.pager-list {
  display: flex; align-items: center; height: 44px; padding: 0 22px; border: 1px solid var(--ink);
  font-size: 13px; font-weight: 700; transition: background-color .3s, color .3s !important;
}
.pager .pager-list:hover { background: var(--ink); color: var(--bg); }

/* ---------- 成员 ---------- */
.member-group:first-child { margin-top: 0; }
.profile-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 32px; }
.profile {
  display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: 20px; align-items: start;
  padding: 26px 0; border-bottom: 1px solid var(--line);
  scroll-margin-top: 30vh;
}
.profile .avatar { width: 84px; height: 84px; margin: 0; }
.profile-name { font-family: var(--font-latin); font-size: 18px; font-weight: 600; letter-spacing: .06em; line-height: 1.4; }
.profile-roles { font-size: 12px; color: var(--muted); margin-top: 2px; }
.profile-bio { font-size: 13px; line-height: 2; margin-top: 10px; }
.profile-works { font-size: 12px; color: var(--muted); margin-top: 6px; }
.profile.is-target .profile-name { color: var(--accent); }
.platforms.small { margin: 12px 0 0; gap: 8px; }
.platforms.small a { height: 32px; padding: 0 12px; font-size: 12px; }

/* ---------- 子页页脚 ---------- */
.sub-foot {
  display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center;
  padding: 80px 24px 60px; border-top: 1px solid var(--line); font-size: 13px; color: var(--muted);
}
.sub-foot-logo img { height: 40px; width: auto; }
html:not([data-theme="dark"]) .sub-foot-logo img { filter: invert(1); }
.sub-foot .footer-copy { margin-top: 8px; }

@media (max-width: 1100px) {
  .work-grid, .profile-list, .credits { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 768px) {
  .sub { display: block; padding: 0 20px; }
  .sub-side { position: static; height: auto; padding: 96px 0 8px; gap: 18px; }
  .sub-filter { flex-direction: row; flex-wrap: wrap; border-left: 0; border-bottom: 1px solid var(--line); gap: 0 18px; }
  .sub-filter > * { padding: 10px 0; flex-direction: column; gap: 0; line-height: 1.5; }
  .sub-filter > *:hover { padding-left: 0; }
  .sub-filter > *::before { left: 0; right: 0; top: auto; bottom: -1px; width: auto; height: 2px; transform: scaleX(0); }
  .sub-filter > .is-on::before { transform: none; }
  .sub-main { padding: 32px 0 72px; }
  .news-row { grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "d t c" "h h c"; gap: 6px 14px; padding: 20px 0; }
  .news-row .card-date { grid-area: d; font-size: 13px; }
  .news-row .news-tag { grid-area: t; }
  .news-row .news-title { grid-area: h; }
  .news-row .chev { grid-area: c; }
  .news-row h3 { font-size: 15px; }
  .work-grid { gap: 36px; }
  .profile { grid-template-columns: 64px minmax(0, 1fr); gap: 16px; }
  .profile .avatar { width: 64px; height: 64px; }
  .pager { grid-template-columns: 1fr 1fr; }
  .pager-list { grid-column: 1 / -1; grid-row: 2; justify-content: center; }
}

/* 减少动态效果偏好 */
@media (prefers-reduced-motion: reduce) {
  .disc, .disc.is-active, .intro-lid, .intro-base, .pillar, .fx, .sub-side { transition-duration: .01s !important; }
  .scroll-arrow::after, .intro-tip { animation: none; }
}