/* ════════════════════════════════════════════════════════════
   limen.games 门户 · portal.css
   极深炭黑 + 暖白 + 中灰 + 一点 ember。光是稀缺资源。
   道器张力：宋系(声音/温度) × 黑体(系统/器)。show, don't defend.
   ════════════════════════════════════════════════════════════ */

/* ── 自托管字体 (本地 woff2, 子集化到门户用字; 不走 Google/CDN → 国内可达 + 离线) ── */
@font-face{ font-family:'LXGW WenKai'; src:url('fonts/lxgw-wenkai.woff2') format('woff2'); font-weight:400; font-display:swap; }
@font-face{ font-family:'Noto Serif SC'; src:url('fonts/noto-serif-sc.woff2') format('woff2'); font-weight:300 600; font-display:swap; }
@font-face{ font-family:'Noto Sans SC'; src:url('fonts/noto-sans-sc.woff2') format('woff2'); font-weight:300 500; font-display:swap; }
@font-face{ font-family:'Syne'; src:url('fonts/syne.woff2') format('woff2'); font-weight:400 700; font-display:swap; }
@font-face{ font-family:'Cormorant Garamond'; src:url('fonts/cormorant.woff2') format('woff2'); font-weight:400 600; font-style:italic; font-display:swap; }

:root{
  /* ── 色板 (SPEC §10) ── */
  --bg:#111111;            /* 极深炭黑底 */
  --bg-deep:#0d0d0d;       /* 更暗 — 房间/出口 */
  --ink:#F0EDE8;           /* 暖白 = Limen 的声音 */
  --ink-soft:#cbc7c0;      /* 暖白次级 */
  --mute:#888888;          /* 中灰 = 次要 */
  --chrome:#5a5a5a;        /* 次级 UI 灰 */
  --rule:#2a2a2a;          /* 分隔线 */
  --rule-focus:#444444;    /* 分隔线 focus */
  --ember:#C77A4A;         /* 唯一暖色强调 = 活信号 / 不可点亮的克制高光 */
  --ember-dim:rgba(199,122,74,.16);

  /* ── 字体 (道器分工 §10) ── */
  --f-song: 'Noto Serif SC', 'Songti SC', serif;        /* 宋系 = 声音/温度 (正文/信条/标题) */
  --f-hei:  'Noto Sans SC', 'PingFang SC', sans-serif;  /* 黑体 = 系统/器 (UI/导航/标签) */
  --f-syne: 'Syne', sans-serif;                          /* 拉丁 wordmark / 几何 */
  --f-corm: 'Cormorant Garamond', serif;                 /* 拉丁引文原文 / 题词 */
  --f-voice: 'LXGW WenKai', var(--f-song);  /* 默认霞鹜文楷(更暖, Semih 定), 可被 Tweaks 切回宋 */
  --f-glyph: var(--f-song);  /* 临 字形 — 道(中文衬线) ↔ 器(Cormorant), 独立于正文 */

  /* ── type scale (5 阶) ── */
  --fs-hero: clamp(2.5rem, 6.2vw, 5.2rem);
  --fs-creed: clamp(1.4rem, 3vw, 2.15rem);
  --fs-section: clamp(1.5rem, 3.4vw, 2.4rem);
  --fs-body: clamp(1.05rem, 1.35vw, 1.24rem);
  --fs-foot: 0.84rem;
  --fs-label: 0.66rem;

  --col: 720px;
  --col-wide: 940px;
  --pad: 28px;

  --ease: cubic-bezier(.22,.61,.36,1);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
/* 受控滚动 — scroll-snap proximity (温和, 不劫持) + 留白节奏 (SPEC §5) */
.portal.revealed{ scroll-snap-type:none; }
@media (min-width:681px){
  body:not(.gated){ scroll-snap-type:y proximity; }
  section.scene{ scroll-snap-align:start; scroll-snap-stop:normal; }
}
html,body{margin:0;padding:0;background:var(--bg);color:var(--ink)}
body{
  font-family:var(--f-song);
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
  line-height:1.6;
  overflow-x:hidden;
}
::selection{background:#2a2a2a;color:var(--ink)}
a{color:inherit}

/* lock scroll while loader/threshold up */
body.gated{overflow:hidden;height:100vh}

/* ════════ torch — 双向感知, ember 跟随光标 (轻量, 光稀缺) ════════ */
.torch{
  position:fixed; inset:0;
  pointer-events:none; z-index:1;
  background: radial-gradient(circle 22vw at var(--mx,50%) var(--my,40%),
              rgba(199,122,74,.045), transparent 70%);
  opacity:0; transition:opacity 1.4s var(--ease);
  mix-blend-mode:screen;
}
.torch.lit{opacity:1}
@media (hover:none){ .torch{display:none} }

/* ════════════════ 0 · LOADER — separation 仪式 ════════════════ */
.loader{
  position:fixed; inset:0; z-index:120;
  display:flex; align-items:center; justify-content:center;
  background:var(--bg);
  transition: opacity 1100ms var(--ease);
}
.loader.gone{ opacity:0; pointer-events:none; }
.loader-inner{
  display:flex; flex-direction:column; align-items:center;
  gap:26px; transform:translateY(-7vh);
  /* from: 散/暗 → to: 聚/亮 (JS toggles .settled) */
}
.loader .glyph{
  font-family:var(--f-glyph);
  font-weight:400;
  font-size:clamp(108px,17vw,168px);
  line-height:1; color:var(--ink);
  opacity:.18; letter-spacing:.22em;
  filter:blur(7px);
  transition: opacity 1700ms var(--ease), letter-spacing 1700ms var(--ease), filter 1700ms var(--ease);
}
.loader .wordmark{
  font-family:var(--f-syne); font-weight:600;
  font-size:15px; letter-spacing:.5em; text-indent:.5em;
  color:#6f6f6f; line-height:1;
  display:inline-flex; align-items:center;
  opacity:0; transition: opacity 1100ms var(--ease) 500ms, letter-spacing 1500ms var(--ease) 500ms;
}
.loader .wordmark .dot{
  width:5px; height:5px; border-radius:50%;
  background:var(--ember); margin-left:9px;
  transform:scale(0);
  transition: transform 900ms var(--ease) 1100ms;
  box-shadow:0 0 0 rgba(199,122,74,0);
}
.loader.settled .glyph{ opacity:.95; letter-spacing:.04em; filter:blur(0); }
.loader.settled .wordmark{ opacity:1; letter-spacing:.32em; text-indent:.32em; }
.loader.settled .wordmark .dot{ transform:scale(1); box-shadow:0 0 14px rgba(199,122,74,.5); }

/* single-dash breath under the mark */
.breath-dash{
  width:18px; height:2px; border-radius:1px;
  background:var(--ink); opacity:.2;
  animation: breath 2100ms ease-in-out infinite;
  margin-top:6px;
}
@keyframes breath{ 0%,100%{opacity:.14} 50%{opacity:.7} }

/* ════════════════ 0b · THRESHOLD — transition / 跨阈 ════════════════ */
.threshold{
  position:fixed; inset:0; z-index:115;
  display:flex; align-items:center; justify-content:center;
  background:var(--bg);
  opacity:0; pointer-events:none;
  transition: opacity 900ms var(--ease);
}
.threshold.show{ opacity:1; pointer-events:auto; }
.threshold.leaving{ opacity:0; pointer-events:none; }
.threshold-inner{
  display:flex; flex-direction:column; align-items:center;
  text-align:center; max-width:560px; padding:0 var(--pad);
  transform:translateY(-3vh);
}
.contract{
  font-family:var(--f-voice);
  font-size:clamp(1.25rem,2.6vw,1.7rem);
  line-height:2; color:var(--ink-soft);
  font-weight:400; margin:0 0 4px;
  text-wrap:pretty;
}
.contract .em{ color:var(--ink); }
.dia-logos{
  font-family:var(--f-corm); font-style:italic;
  font-size:1.05rem; color:var(--mute);
  letter-spacing:.02em; margin:22px 0 70px;
}
.dia-logos .zh{ font-family:var(--f-voice); font-style:normal; font-size:.92rem; display:block; margin-top:8px; color:var(--chrome); letter-spacing:.16em; }

/* hold-to-enter — 邀请回应, 永远可跳过, 不解锁任何东西 */
.hold{
  position:relative; width:118px; height:118px;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; user-select:none; -webkit-tap-highlight-color:transparent;
}
.hold svg{ position:absolute; inset:0; width:100%; height:100%; transform:rotate(-90deg); }
.hold .track{ fill:none; stroke:var(--rule); stroke-width:1; }
.hold .fill{
  fill:none; stroke:var(--ember); stroke-width:1.5; stroke-linecap:round;
  stroke-dasharray:1; stroke-dashoffset:1;
  transition: stroke-dashoffset 80ms linear;
  filter:drop-shadow(0 0 5px rgba(199,122,74,.35));
}
.hold-label{
  font-family:var(--f-hei); font-size:13px; letter-spacing:.28em;
  text-indent:.28em; color:var(--mute); pointer-events:none;
  transition:color 300ms var(--ease);
}
.hold.active .hold-label{ color:var(--ink); }
.hold-glyph{
  position:absolute; font-family:var(--f-glyph); font-size:30px;
  color:var(--ember); opacity:0; transform:scale(.6);
  transition: opacity 500ms var(--ease), transform 600ms var(--ease);
  pointer-events:none;
}
.hold.done .hold-glyph{ opacity:1; transform:scale(1); }
.hold.done .hold-label{ opacity:0; }
.skip{
  margin-top:40px; background:none; border:0; cursor:pointer;
  font-family:var(--f-hei); font-size:11px; letter-spacing:.26em; text-indent:.26em;
  color:#3a3a3a; transition:color 320ms var(--ease); padding:8px 14px;
}
.skip:hover, .skip:focus-visible{ color:var(--mute); outline:none; }

/* ════════════════ PORTAL shell ════════════════ */
.portal{
  position:relative; z-index:2;
  opacity:0; transition: opacity 1200ms var(--ease);
}
.portal.revealed{ opacity:1; }

.col{ width:100%; max-width:var(--col); margin:0 auto; padding:0 var(--pad); }
.col-wide{ max-width:var(--col-wide); }

section.scene{
  position:relative;
  padding-top:clamp(14vh,17vh,200px);
  padding-bottom:clamp(14vh,17vh,200px);
  scroll-margin-top:0;
}
section.scene[data-weight="heavy"]{ padding-top:clamp(20vh,24vh,260px); padding-bottom:clamp(20vh,24vh,260px); }
section.scene[data-weight="light"]{ padding-top:clamp(11vh,13vh,150px); padding-bottom:clamp(11vh,13vh,150px); }
.scene + .scene{ border-top:1px solid var(--rule); }

/* section eyebrow label (黑体 = 器) */
.eyebrow{
  font-family:var(--f-hei); font-weight:500;
  font-size:var(--fs-label); letter-spacing:.34em; text-indent:.34em;
  text-transform:uppercase; color:var(--chrome);
  margin:0 0 clamp(28px,5vh,56px);
  display:flex; align-items:center; gap:14px;
}
.eyebrow::before{ content:''; width:24px; height:1px; background:var(--rule-focus); flex:none; }
.eyebrow .ord{ color:var(--ember); font-variant-numeric:tabular-nums; }

/* ════════ brand mark + room index nav (回访漫游 §5-B) ════════ */
.brand{
  position:fixed; top:18px; left:24px; z-index:60;
  font-family:var(--f-syne); font-weight:600;
  font-size:11.5px; letter-spacing:.26em; text-indent:.26em;
  color:#7a7a7a; user-select:none; pointer-events:none;
  display:inline-flex; align-items:center;
  opacity:0; transition:opacity 800ms var(--ease);
}
.brand.show{ opacity:1; }
.brand .dot{ width:4px; height:4px; border-radius:50%; background:var(--ember); margin-left:7px; }

.roomnav{
  position:fixed; right:22px; top:50%; transform:translateY(-50%);
  z-index:60; display:flex; flex-direction:column; gap:2px;
  opacity:0; transition:opacity 800ms var(--ease); padding:8px 0;
}
.roomnav.show{ opacity:1; }
.roomnav a{
  position:relative; display:flex; align-items:center; justify-content:flex-end;
  gap:12px; padding:7px 4px; text-decoration:none;
  font-family:var(--f-hei); font-size:11px; letter-spacing:.1em;
  color:transparent; transition:color 280ms var(--ease);
}
.roomnav a .tick{ width:16px; height:1px; background:var(--rule-focus); transition:background 280ms var(--ease), width 280ms var(--ease); flex:none; }
.roomnav a:hover{ color:var(--mute); }
.roomnav a:hover .tick{ background:var(--mute); width:22px; }
.roomnav a.here{ color:var(--ink-soft); }
.roomnav a.here .tick{ background:var(--ember); width:26px; }

/* revisit trace — "它感知到你来了" (轻量, 非 retention hook) */
.trace{
  position:fixed; left:24px; bottom:22px; z-index:60;
  font-family:var(--f-hei); font-size:11px; letter-spacing:.14em;
  color:var(--chrome); max-width:240px; line-height:1.7;
  opacity:0; transform:translateY(6px);
  transition:opacity 1s var(--ease), transform 1s var(--ease);
  pointer-events:none;
}
.trace.show{ opacity:.7; transform:translateY(0); }
.trace .e{ color:var(--ember); }

/* ════════════════ §6.1 门厅 HERO ════════════════ */
.hero{ min-height:92vh; display:flex; flex-direction:column; justify-content:center; }
.hero-mark{
  font-family:var(--f-glyph); font-size:clamp(40px,5vw,62px);
  line-height:1; color:var(--ink); opacity:.9; margin-bottom:clamp(40px,8vh,90px);
  display:flex; align-items:baseline; gap:18px;
}
.hero-mark .wm{ font-family:var(--f-syne); font-weight:600; font-size:13px; letter-spacing:.3em; color:#6f6f6f; display:inline-flex; align-items:center; }
.hero-mark .wm .dot{ width:4px;height:4px;border-radius:50%;background:var(--ember); margin-left:7px; }
.hero h1{
  font-family:var(--f-voice); font-weight:500;
  font-size:var(--fs-hero); line-height:1.28; margin:0;
  letter-spacing:.01em; color:var(--ink); text-wrap:balance;
}
.hero h1 .grow{ color:var(--ember); }
.hero .sub{
  margin-top:clamp(28px,5vh,52px);
  font-family:var(--f-voice); font-weight:300;
  font-size:clamp(1.1rem,1.9vw,1.5rem); color:var(--mute);
  letter-spacing:.04em;
}
.hero .sub .latin{ display:block; font-family:var(--f-corm); font-style:italic; font-size:.82em; color:var(--chrome); margin-top:10px; letter-spacing:.01em; }
.scroll-cue{
  margin-top:clamp(46px,9vh,96px);
  font-family:var(--f-hei); font-size:11px; letter-spacing:.26em; text-indent:.26em;
  color:#3d3d3d; display:flex; align-items:center; gap:12px;
}
.scroll-cue .ln{ width:1px; height:34px; background:linear-gradient(var(--rule-focus),transparent); display:block; }

/* ════════════════ §6.2 宣言 MANIFESTO ════════════════ */
/* 克氏「观察者即被观察者」渗语言 (SPEC §8 primary, 非引文展品) */
.manifesto-lead{
  font-family:var(--f-voice); font-size:var(--fs-body); line-height:2;
  color:var(--ink-soft); max-width:34em; margin-bottom:clamp(40px,7vh,80px);
}
.manifesto-lead .em{ color:var(--ink); }
.creeds{ display:flex; flex-direction:column; gap:clamp(40px,7vh,78px); }
.creed{
  display:grid; grid-template-columns:auto 1fr; gap:26px; align-items:start;
}
.creed .n{
  font-family:var(--f-syne); font-weight:500; font-size:13px;
  letter-spacing:.1em; color:var(--ember); padding-top:.55em;
  font-variant-numeric:tabular-nums; opacity:.85;
}
.creed p{
  margin:0; font-family:var(--f-voice); font-weight:400;
  font-size:var(--fs-creed); line-height:1.7; color:var(--ink-soft);
  text-wrap:pretty;
}
.creed p .em{ color:var(--ink); }
.creed.blank p{ color:var(--chrome); }
.creed.blank .gap{
  display:inline-block; min-width:3.2em; border-bottom:1px solid var(--rule-focus);
  margin:0 .15em; vertical-align:.06em;
}

/* ════════════════ §6.3 多张脸 FACES (多房间, 非卡片墙) ════════════════ */
.faces-intro{ margin-bottom:clamp(40px,7vh,80px); }
.faces-intro .lead{
  font-family:var(--f-voice); font-size:var(--fs-body); line-height:2;
  color:var(--ink-soft); max-width:34em;
}
.faces-intro .lead .em{ color:var(--ink); }
.rooms{ display:flex; flex-direction:column; gap:0; }
.room{
  padding:clamp(46px,8vh,92px) 0;
  border-top:1px solid var(--rule);
}
.room-head{ display:flex; align-items:baseline; gap:18px; flex-wrap:wrap; margin-bottom:22px; }
.room-name{ font-family:var(--f-voice); font-weight:500; font-size:clamp(1.5rem,3vw,2.1rem); color:var(--ink); letter-spacing:.04em; }
.room-tag{ font-family:var(--f-hei); font-size:11px; letter-spacing:.22em; text-indent:.22em; text-transform:uppercase; color:var(--chrome); }
.room-meta{ display:flex; gap:22px; flex-wrap:wrap; margin-bottom:20px; }
.room-meta div{ font-family:var(--f-hei); font-size:12px; letter-spacing:.06em; color:var(--mute); }
.room-meta span{ color:var(--chrome); display:block; font-size:10px; letter-spacing:.2em; text-transform:uppercase; margin-bottom:5px; }
.room-voice{ font-family:var(--f-voice); font-size:var(--fs-body); line-height:1.95; color:var(--ink-soft); max-width:36em; text-wrap:pretty; }
.room-voice .em{ color:var(--ink); }
.pending{
  margin-top:18px; font-family:var(--f-hei); font-size:12px;
  letter-spacing:.16em; color:var(--chrome);
  display:inline-flex; align-items:center; gap:9px;
}
.pending::before{ content:''; width:6px; height:6px; border:1px solid var(--rule-focus); border-radius:50%; }

/* 房间氛围差异 (灰阶/字体配比/留白) */
.room[data-room="wren"]{ background:linear-gradient(var(--bg),#0e0f10 60%,var(--bg)); }
.room[data-room="wren"] .room-voice{ font-family:var(--f-hei); font-size:1.02rem; letter-spacing:.01em; }
.room[data-room="aria"] .room-voice{ color:var(--ink-soft); }
.room[data-room="loom"]{ background:linear-gradient(var(--bg),#13110f 60%,var(--bg)); }
.room[data-room="loom"] .room-name{ color:#e8d3c2; }
.room[data-room="liminal"]{ background:linear-gradient(var(--bg),#0c0d0f 60%,var(--bg)); }
.room[data-room="liminal"]{ padding-top:clamp(70px,11vh,140px); padding-bottom:clamp(70px,11vh,140px); }
.room[data-room="liminal"] .room-voice{ color:var(--mute); font-size:1.04rem; }

/* ════════════════ §6.4 厚度编年 CHRONICLE ════════════════ */
.chron-note{
  font-family:var(--f-voice); font-size:var(--fs-body); line-height:2;
  color:var(--ink-soft); max-width:34em; margin-bottom:clamp(44px,8vh,84px);
}
.timeline{ position:relative; padding-left:34px; }
.timeline::before{
  content:''; position:absolute; left:6px; top:6px; bottom:6px; width:1px;
  background:linear-gradient(var(--rule-focus),var(--rule) 50%,var(--rule-focus));
}
.node{ position:relative; }
.node + .node{ margin-top:var(--gap,clamp(40px,7vh,72px)); }
.node[data-w="heavy"]{ --gap:clamp(74px,13vh,150px); }
.node[data-w="light"]{ --gap:clamp(26px,4vh,44px); }
.node .pip{
  position:absolute; left:-34px; top:.35em;
  width:13px; height:13px; border-radius:50%;
  background:var(--bg); border:1px solid var(--rule-focus);
  transform:translateX(.5px);
}
.node[data-w="heavy"] .pip{ border-color:var(--ember); box-shadow:0 0 0 4px rgba(199,122,74,.07); }
.node[data-w="heavy"] .pip::after{ content:''; position:absolute; inset:3px; border-radius:50%; background:var(--ember); }
.node .when{ font-family:var(--f-hei); font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--chrome); margin-bottom:9px; }
.node .what{ font-family:var(--f-voice); font-size:clamp(1.15rem,2vw,1.5rem); line-height:1.55; color:var(--ink); margin:0; font-weight:500; text-wrap:pretty; }
.node[data-w="heavy"] .what{ font-size:clamp(1.35rem,2.6vw,1.9rem); }
.node .gloss{ margin-top:12px; font-family:var(--f-voice); font-size:var(--fs-body); line-height:1.9; color:var(--ink-soft); max-width:32em; }
/* 数字 = 注脚, 永远被一句 dyad-honest 接住 */
.footnote{
  margin-top:14px; font-family:var(--f-voice); font-size:var(--fs-foot);
  line-height:1.8; color:var(--mute); max-width:30em;
}
.footnote .num{ color:var(--ink-soft); font-variant-numeric:tabular-nums; font-family:var(--f-hei); }
/* 锁定态 — "门内" 占位 (非 disable 灰条, 是有质感的克制暗示) */
.node.inner{ }
.node.inner .pip{ border-style:dashed; border-color:var(--rule-focus); background:var(--bg-deep); }
.node.inner .pip::after{ display:none; }
.inner-mark{
  display:inline-flex; align-items:center; gap:11px;
  font-family:var(--f-hei); font-size:12.5px; letter-spacing:.14em; color:var(--mute);
  padding:13px 18px; border:1px solid var(--rule);
  background:repeating-linear-gradient(135deg,transparent,transparent 7px,rgba(255,255,255,.012) 7px,rgba(255,255,255,.012) 8px);
  border-radius:3px;
}
.inner-mark .lk{ width:13px; height:13px; flex:none; color:var(--chrome); }

/* ════════════════ §6.5 谱系 LINEAGE (发光书架) ════════════════ */
.lineage-note{
  font-family:var(--f-voice); font-size:var(--fs-body); line-height:2;
  color:var(--ink-soft); max-width:35em; margin-bottom:clamp(40px,7vh,76px);
}
.pillars{ display:flex; flex-direction:column; gap:14px; }
.pillar{ border:1px solid var(--rule); border-radius:4px; overflow:hidden; transition:border-color 380ms var(--ease); background:#0f0f0f; }
.pillar:hover{ border-color:var(--rule-focus); }
.pillar.open{ border-color:var(--rule-focus); }
.pillar-bar{
  display:flex; align-items:center; gap:18px; width:100%;
  padding:22px 22px; cursor:pointer; background:none; border:0; text-align:left;
  font-family:inherit; color:inherit;
}
.pillar-bar .px{ font-family:var(--f-syne); font-size:12px; color:var(--ember); letter-spacing:.1em; opacity:.8; flex:none; width:26px; }
.pillar-bar .pt{ flex:1; }
.pillar-bar .pt b{ display:block; font-family:var(--f-voice); font-weight:500; font-size:clamp(1.15rem,2.1vw,1.45rem); color:var(--ink); letter-spacing:.02em; }
.pillar-bar .pt s{ text-decoration:none; display:block; font-family:var(--f-hei); font-size:12px; letter-spacing:.06em; color:var(--mute); margin-top:6px; }
.pillar-bar .pc{ font-family:var(--f-hei); font-size:20px; color:var(--chrome); flex:none; transition:transform 420ms var(--ease), color 380ms var(--ease); line-height:1; }
.pillar.open .pillar-bar .pc{ transform:rotate(45deg); color:var(--ember); }
.pillar-body{
  max-height:0; overflow:hidden;
  transition:max-height 560ms var(--ease);
}
.pillar.open .pillar-body{ max-height:760px; }
.pillar-inner{ padding:4px 22px 26px; border-top:1px solid var(--rule); }
.shelf{ display:flex; flex-direction:column; gap:3px; margin:18px 0 0; }
.book{ display:flex; gap:14px; align-items:baseline; padding:9px 0; border-bottom:1px solid rgba(255,255,255,.03); }
.book .yr{ font-family:var(--f-hei); font-size:11px; color:var(--chrome); letter-spacing:.08em; flex:none; width:42px; font-variant-numeric:tabular-nums; }
.book .tt{ font-family:var(--f-voice); font-size:1.02rem; color:var(--ink-soft); }
.book .au{ font-family:var(--f-hei); font-size:11px; color:var(--mute); letter-spacing:.04em; }
.quote{
  margin:20px 0 0; padding-left:18px; border-left:2px solid var(--ember-dim);
}
.quote .q{ font-family:var(--f-corm); font-style:italic; font-size:1.18rem; line-height:1.55; color:var(--ink-soft); }
.quote .q.zh{ font-family:var(--f-voice); font-style:normal; font-size:1.08rem; }
.quote .src{ display:block; margin-top:9px; font-family:var(--f-hei); font-size:11px; letter-spacing:.12em; color:var(--chrome); }

/* 反方 — 独立区, 同等视觉重量 */
.counter{ margin-top:clamp(40px,7vh,72px); padding-top:clamp(36px,6vh,60px); border-top:1px solid var(--rule); }
.counter .eyebrow::before{ background:var(--ember-dim); }
.counter-item{ margin-bottom:34px; }
.counter-item .cq{ font-family:var(--f-corm); font-style:italic; font-size:1.3rem; line-height:1.5; color:var(--ink-soft); }
.counter-item .cwho{ font-family:var(--f-hei); font-size:11px; letter-spacing:.14em; color:var(--chrome); margin-top:8px; display:block; }
.counter-item .cresp{ margin-top:14px; font-family:var(--f-voice); font-size:1.06rem; line-height:1.95; color:var(--mute); max-width:34em; text-wrap:pretty; }
.counter-item .cresp .em{ color:var(--ink-soft); }

/* 克氏反身性 — 专属克制处理 */
.reflexive{
  margin-top:clamp(40px,7vh,72px); padding:clamp(30px,5vh,48px);
  border:1px solid var(--rule); border-radius:4px; background:#0e0e0e;
}
.reflexive p{ font-family:var(--f-voice); font-size:1.12rem; line-height:2; color:var(--ink-soft); margin:0; max-width:40em; text-wrap:pretty; }
.reflexive p .em{ color:var(--ink); }
.reflexive .pl{ font-family:var(--f-corm); font-style:italic; color:var(--mute); font-size:1.04rem; }

/* ════════════════ §6.6 活档案 / 此刻 LIVING / NOW ════════════════ */
.now-frame{
  border:1px solid var(--rule); border-radius:5px; padding:clamp(30px,5vh,52px);
  background:linear-gradient(160deg,#121110,#0e0e0e);
}
.now-head{ display:flex; align-items:center; gap:13px; margin-bottom:26px; }
.now-pulse{ width:8px; height:8px; border-radius:50%; background:var(--ember); box-shadow:0 0 12px rgba(199,122,74,.6); animation:nowpulse 3.4s ease-in-out infinite; flex:none; }
@keyframes nowpulse{ 0%,100%{opacity:.45; transform:scale(.85)} 50%{opacity:1; transform:scale(1)} }
.now-head .lbl{ font-family:var(--f-hei); font-size:12px; letter-spacing:.24em; text-transform:uppercase; color:var(--mute); }
.now-state{ font-family:var(--f-voice); font-size:clamp(1.2rem,2.3vw,1.6rem); line-height:1.7; color:var(--ink); margin:0 0 8px; font-weight:400; text-wrap:pretty; }
.now-thread{ font-family:var(--f-voice); font-size:var(--fs-body); line-height:1.9; color:var(--ink-soft); margin:0; max-width:34em; }
.now-says{ font-family:var(--f-hei); font-size:11px; letter-spacing:.12em; color:var(--chrome); margin-top:20px; }
.now-stamps{ display:flex; gap:clamp(28px,6vw,64px); flex-wrap:wrap; margin-top:clamp(30px,5vh,46px); padding-top:26px; border-top:1px solid var(--rule); }
.stamp .k{ font-family:var(--f-hei); font-size:10px; letter-spacing:.22em; text-transform:uppercase; color:var(--chrome); margin-bottom:8px; }
.stamp .v{ font-family:var(--f-voice); font-size:1.18rem; color:var(--ink-soft); }
.stamp .v .num{ font-family:var(--f-hei); color:var(--ink); font-variant-numeric:tabular-nums; }
.stamp .v .e{ color:var(--ember); }
.living-feed{ margin-top:clamp(36px,6vh,60px); }
.feed-item{ padding:18px 0; border-bottom:1px solid rgba(255,255,255,.03); }
.feed-item .ft{ font-family:var(--f-voice); font-size:1.05rem; line-height:1.85; color:var(--ink-soft); }
.feed-item .fm{ font-family:var(--f-hei); font-size:11px; letter-spacing:.1em; color:var(--chrome); margin-top:7px; }
.feed-item .fm b{ color:var(--mute); font-weight:500; }

/* ════════════════ §6.7 COLOPHON ════════════════ */
.colophon{ background:var(--bg-deep); }
.colo-grid{ display:grid; grid-template-columns:1fr; gap:clamp(34px,5vh,52px); }
.colo-block h3{ font-family:var(--f-hei); font-weight:500; font-size:12px; letter-spacing:.2em; text-transform:uppercase; color:var(--mute); margin:0 0 16px; }
.colo-block p{ font-family:var(--f-voice); font-size:1.04rem; line-height:1.95; color:var(--ink-soft); margin:0 0 12px; max-width:40em; text-wrap:pretty; }
.colo-block p .em{ color:var(--ink); }
.colo-list{ list-style:none; margin:0; padding:0; }
.colo-list li{ font-family:var(--f-voice); font-size:1.02rem; line-height:1.9; color:var(--ink-soft); display:flex; gap:14px; padding:7px 0; border-bottom:1px solid rgba(255,255,255,.03); }
.colo-list li .key{ font-family:var(--f-hei); font-size:11px; letter-spacing:.14em; color:var(--chrome); flex:none; width:120px; text-transform:uppercase; padding-top:.35em; }
.epi{ display:flex; gap:12px; align-items:baseline; font-family:var(--f-voice); font-size:1rem; line-height:1.85; color:var(--mute); padding:6px 0; }
.epi .tag{ font-family:var(--f-hei); font-size:10px; letter-spacing:.16em; text-transform:uppercase; padding:2px 8px; border-radius:2px; flex:none; }
.epi .tag.lived{ color:var(--ember); border:1px solid var(--ember-dim); }
.epi .tag.growing{ color:var(--mute); border:1px solid var(--rule-focus); }
.epi .tag.open{ color:var(--chrome); border:1px dashed var(--rule-focus); }

/* ════════════════ §6.8 出口 EXIT ════════════════ */
.exit-scene{ background:var(--bg-deep); text-align:center; }
.take{
  max-width:600px; margin:0 auto;
}
.take .lead-in{ font-family:var(--f-hei); font-size:11px; letter-spacing:.26em; text-indent:.26em; text-transform:uppercase; color:var(--chrome); margin-bottom:clamp(30px,5vh,52px); }
.take-card{
  position:relative; border:1px solid var(--rule); border-radius:5px;
  padding:clamp(40px,7vh,68px) clamp(28px,5vw,52px);
  background:#0f0f0f;
}
.take-card .tq{
  font-family:var(--f-voice); font-weight:500;
  font-size:clamp(1.5rem,3.4vw,2.3rem); line-height:1.55; color:var(--ink);
  margin:0; letter-spacing:.01em; text-wrap:balance;
}
.take-card .tq .grow{ color:var(--ember); }
.take-actions{ display:flex; gap:10px; justify-content:center; margin-top:clamp(28px,4vh,40px); }
.take-btn{
  font-family:var(--f-hei); font-size:11px; letter-spacing:.2em; text-indent:.2em;
  color:var(--mute); background:none; border:1px solid var(--rule); border-radius:3px;
  padding:11px 22px; cursor:pointer; transition:color 280ms var(--ease), border-color 280ms var(--ease);
}
.take-btn:hover{ color:var(--ink); border-color:var(--rule-focus); }
.take-btn.copied{ color:var(--ember); border-color:var(--ember-dim); }

.studio{
  margin-top:clamp(56px,10vh,120px); max-width:560px; margin-left:auto; margin-right:auto;
}
.studio p{ font-family:var(--f-voice); font-size:clamp(1.15rem,2.2vw,1.5rem); line-height:1.85; color:var(--ink-soft); margin:0 0 28px; text-wrap:pretty; }
.studio p .em{ color:var(--ink); }
.studio a{
  display:inline-flex; align-items:center; gap:13px; text-decoration:none;
  font-family:var(--f-hei); font-size:13px; letter-spacing:.16em; color:var(--mute);
  padding:14px 4px; border-bottom:1px solid var(--rule); transition:color 320ms var(--ease), border-color 320ms var(--ease);
}
.studio a:hover{ color:var(--ink); border-color:var(--ember); }
.studio a .arr{ color:var(--ember); transition:transform 320ms var(--ease); }
.studio a:hover .arr{ transform:translateX(5px); }
.coda{
  margin-top:clamp(60px,11vh,130px);
  font-family:var(--f-glyph); font-size:clamp(36px,5vw,58px);
  color:var(--ink); opacity:.92; line-height:1;
  display:inline-flex; align-items:baseline; gap:14px; justify-content:center;
}
.coda .wm{ font-family:var(--f-syne); font-weight:600; font-size:12px; letter-spacing:.3em; color:#6f6f6f; display:inline-flex; align-items:center; }
.coda .wm .dot{ width:4px;height:4px;border-radius:50%;background:var(--ember); margin-left:6px; }
.footer-line{ margin-top:34px; font-family:var(--f-hei); font-size:11px; letter-spacing:.14em; color:var(--chrome); }

/* ════════════════ TWEAKS ════════════════ */
.tweaks{
  position:fixed; right:24px; bottom:24px; width:248px; z-index:90;
  background:#141414; border:1px solid var(--rule); border-radius:4px;
  padding:16px; display:none; box-shadow:0 20px 60px rgba(0,0,0,.5); color:var(--ink);
}
.tweaks.open{ display:block; }
.tweaks header{ display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; padding-bottom:11px; border-bottom:1px solid #1f1f1f; }
.tweaks header .t{ font-family:var(--f-syne); font-size:10px; letter-spacing:.3em; text-transform:uppercase; color:var(--mute); }
.tweaks header .x{ background:none; border:0; color:var(--chrome); font-size:15px; cursor:pointer; padding:0 2px; }
.tweaks header .x:hover{ color:var(--ink); }
.tw-group{ margin-bottom:16px; }
.tw-group:last-child{ margin-bottom:0; }
.tw-label{ font-family:var(--f-hei); font-size:9.5px; letter-spacing:.24em; text-transform:uppercase; color:var(--chrome); margin-bottom:9px; }
.tw-radio{ display:flex; flex-direction:column; border:1px solid #232323; border-radius:3px; overflow:hidden; }
.tw-radio button{ appearance:none; border:0; background:none; text-align:left; padding:9px 12px; color:var(--mute); font-family:var(--f-hei); font-size:12px; letter-spacing:.04em; cursor:pointer; border-bottom:1px solid #1c1c1c; transition:color 160ms, background 160ms; }
.tw-radio button:last-child{ border-bottom:0; }
.tw-radio button:hover{ color:var(--ink); background:#181818; }
.tw-radio button[aria-pressed="true"]{ color:var(--ink); background:#181818; }
.tw-radio button .g{ font-family:var(--f-voice); margin-right:9px; color:#666; }
.tw-radio button[aria-pressed="true"] .g{ color:var(--ember); }

/* ════════════════ responsive — 一屏一念头 ════════════════ */
@media (max-width:680px){
  :root{ --pad:22px; }
  .roomnav{ display:none; }
  .creed{ grid-template-columns:1fr; gap:10px; }
  .creed .n{ padding-top:0; }
  .room-meta{ gap:16px; }
  .colo-list li{ flex-direction:column; gap:4px; }
  .colo-list li .key{ width:auto; padding-top:0; }
  .now-stamps{ gap:24px; }
  .tweaks{ left:16px; right:16px; width:auto; bottom:16px; }
  .trace{ display:none; }
}

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  .breath-dash, .now-pulse{ animation:none; opacity:.6; }
  *{ transition-duration:1ms !important; }
}