.signal-actions { display: flex; flex-wrap: wrap; gap: 18px 30px; align-items: center; margin-top: 32px; }
.mode-toggle, .decode-all { min-height: 52px; padding: 0; color: var(--white); background: transparent; border: 0; border-bottom: 1px solid currentColor; }
.mode-toggle { display: grid; grid-template-columns: auto auto; gap: 16px; align-items: center; text-align: left; }
.mode-toggle small { color: var(--white-muted); font-family: var(--mono); font-size: .67rem; }
.mode-toggle:active, .decode-all:active { transform: scale(.98); }
.decode-all { color: #c2c5c0; font-family: var(--mono); font-size: .74rem; transition: opacity 180ms ease, color 180ms ease; }
.decode-all:disabled { opacity: .28; cursor: default; }

.signal-stage { position: relative; width: calc(100% + clamp(40px, 11vw, 176px)); height: clamp(620px, 60vw, 760px); margin: 80px calc(clamp(20px, 5.5vw, 88px) * -1) 0; overflow: hidden; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: var(--black); isolation: isolate; contain: layout paint; }
#particle-field { position: absolute; z-index: -1; inset: 0; width: 100%; height: 100%; opacity: .14; transition: opacity 460ms var(--ease-out); }
.signal-stage[data-mode="field"] #particle-field { opacity: .92; }
.flow-system, .constellation-system { position: absolute; inset: 0; transition: opacity 320ms var(--ease-out), clip-path 640ms var(--ease-move), transform 640ms var(--ease-move), filter 320ms ease; }
.signal-stage.no-motion .flow-system, .signal-stage.no-motion .constellation-system, .signal-stage.no-motion #particle-field { transition: none; }
.flow-system { display: grid; grid-template-rows: repeat(3, 1fr); opacity: 1; clip-path: inset(0 0 0 0); transform: scale(1); }
.constellation-system { opacity: 0; clip-path: inset(46% 0 46% 0); transform: scale(.92); pointer-events: none; }
.signal-stage[data-mode="field"] .flow-system { opacity: 0; clip-path: inset(33% 0 33% 0); transform: scale(1.04); filter: blur(2px); pointer-events: none; }
.signal-stage[data-mode="field"] .constellation-system { opacity: 1; clip-path: inset(0 0 0 0); transform: scale(1); pointer-events: auto; }

.signal-lane { min-width: 0; overflow: hidden; border-bottom: 1px solid #25282b; }
.signal-lane:last-child { border-bottom: 0; }
.lane-track { width: max-content; height: 100%; display: flex; align-items: stretch; animation: lane-forward var(--lane-speed, 34s) linear infinite; will-change: transform; }
.lane-two .lane-track { --lane-speed: 42s; animation-direction: reverse; }
.lane-three .lane-track { --lane-speed: 37s; }
.lane-group { min-width: max(100vw, 960px); height: 100%; display: flex; align-items: center; justify-content: space-around; flex-shrink: 0; white-space: nowrap; }
.lane-group button, .lane-group > span { min-height: 52px; display: inline-flex; align-items: center; padding: 0 clamp(12px, 1.5vw, 26px); color: #9da19e; background: transparent; border: 0; font-size: clamp(2rem, 4.2vw, 4.8rem); font-weight: 680; letter-spacing: -.045em; }
.lane-one .lane-group button { font-size: clamp(2.7rem, 5.7vw, 6rem); }
.lane-two .lane-group button { font-size: clamp(2.15rem, 4.6vw, 5rem); }
.lane-three .lane-group button { font-size: clamp(1.75rem, 3.5vw, 3.8rem); }
.lane-group > span { color: #404447; font-weight: 400; }
.lane-group button.is-active { color: var(--white); text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 11px; }
@keyframes lane-forward { to { transform: translate3d(-50%, 0, 0); } }

.signal-word { position: absolute; z-index: 1; min-width: 44px; min-height: 44px; padding: 8px 0; color: rgba(225,226,222,.58); background: transparent; border: 0; white-space: nowrap; animation: word-drift var(--duration, 12s) var(--delay, 0s) var(--ease-move) infinite alternate; will-change: transform; text-shadow: 0 1px 1px rgba(0,0,0,.9); }
.signal-word.is-active { color: var(--white); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 10px; }
.signal-a { top: 13%; left: 7%; --duration: 11s; --delay: -3s; font-size: clamp(2.8rem, 6vw, 6rem); font-weight: 700; }
.signal-b { top: 8%; right: 9%; --duration: 14s; --delay: -7s; font-size: clamp(1.4rem, 3vw, 3rem); }
.signal-c { top: 38%; left: 31%; --duration: 9s; --delay: -4s; font-size: clamp(1.1rem, 2vw, 2rem); }
.signal-d { top: 63%; left: 8%; --duration: 13s; --delay: -8s; font-size: clamp(1.3rem, 2.7vw, 2.7rem); }
.signal-e { top: 48%; right: 4%; --duration: 16s; --delay: -10s; font-size: clamp(2rem, 4.5vw, 4.6rem); font-weight: 700; }
.signal-f { top: 79%; left: 43%; --duration: 12s; --delay: -1s; font-size: clamp(1.2rem, 2.2vw, 2.2rem); }
.signal-g { top: 23%; left: 55%; --duration: 15s; --delay: -6s; font-size: clamp(1rem, 1.8vw, 1.8rem); }
.signal-h { top: 78%; right: 6%; --duration: 10s; --delay: -7s; font-size: clamp(1.2rem, 2.1vw, 2.1rem); }
.signal-i { top: 55%; left: 42%; --duration: 17s; --delay: -11s; font-size: clamp(1rem, 1.8vw, 1.8rem); }
.signal-j { top: 87%; left: 8%; --duration: 11s; --delay: -5s; font-size: clamp(1rem, 1.6vw, 1.6rem); }
.signal-k { top: 9%; left: 39%; --duration: 13s; --delay: -9s; font-size: clamp(1rem, 1.7vw, 1.7rem); }
.signal-l { top: 67%; left: 67%; --duration: 9s; --delay: -2s; font-size: clamp(1rem, 1.6vw, 1.6rem); }
@keyframes word-drift { from { transform: translate3d(-7px, -5px, 0) scale(.98); } to { transform: translate3d(12px, 10px, 0) scale(1.02); } }

.signal-state { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 28px; margin-top: 22px; }
.mode-status { margin: 0; color: #8f9490; font-family: var(--mono); font-size: .78rem; }
.signal-reader { margin-top: 54px; }


/* F104: full-width flow; source B10 transitions and ordered type scales retained. */
.about-page{row-gap:96px;padding-bottom:96px}
.about-facts{margin-bottom:0}
.about-chapter{grid-column:1/-1;scroll-margin-top:100px}
.about-chapter-heading{display:flex;align-items:baseline;justify-content:space-between;gap:24px}
.about-chapter-heading h2{margin:0;color:#e3e3de;font-size:24px;font-weight:450;letter-spacing:-.03em}
.about-chapter-heading>p{margin:0;color:#858580;font-size:12px;line-height:1.6}
.about-signals{--signal-display:"Songti SC","Noto Serif SC","STSong","SimSun",serif;--white:#e8e8e5;--white-muted:#888883;--line:#ffffff19;--black:#0a0a0a;--mono:ui-monospace,Menlo,monospace;--ease-out:cubic-bezier(.22,1,.36,1);--ease-move:cubic-bezier(.45,0,.25,1)}
.about-signals button{font-family:inherit;cursor:pointer}
.about-signals .signal-actions{margin-top:16px;gap:24px}
.about-signals .mode-toggle,.about-signals .decode-all{min-height:44px;font-size:12px;border-bottom:1px solid #ffffff30}
.about-signals .mode-toggle{gap:14px}
.about-signals .mode-toggle small{font-size:9px}
.about-signals .signal-stage{width:var(--signal-viewport-width,100vw);left:50%;margin:16px 0 0 calc(var(--signal-viewport-width,100vw) / -2);height:clamp(264px,20vw,296px);background:transparent;transition:height 640ms var(--ease-move)}
.about-signals .signal-stage[data-mode=field]{height:clamp(420px,37vw,530px)}
.about-signals .flow-system{grid-template-rows:1.06fr 1fr .94fr}
.about-signals .signal-stage[data-mode=flow]{border-color:#ffffff0d}
.about-signals .signal-lane{border-bottom-color:transparent}
.about-signals .signal-stage[data-mode=flow] #particle-field{opacity:.5}
.about-signals .lane-one{--flow-ink:#b8b8b2}
.about-signals .lane-two{--flow-ink:#a0a09a}
.about-signals .lane-three{--flow-ink:#85857f}
.about-signals .lane-group button{color:var(--flow-ink)}
.about-signals .lane-group button:nth-of-type(2n){translate:0 -6px}
.about-signals .lane-group button:nth-of-type(3n){translate:0 6px}
.about-signals .lane-group button.is-active{color:var(--white)}
.about-signals .lane-group{width:max-content;min-width:max(var(--signal-viewport-width,100vw),1100px);padding-inline:clamp(24px,3vw,48px);gap:clamp(22px,3vw,48px)}
.about-signals .lane-group button,.about-signals .lane-group>span{flex:none;min-height:44px;padding-inline:0}
/* F121: smaller, separated words drifting through an open field. */
.about-signals .lane-group button{font-family:var(--signal-display);font-weight:700;letter-spacing:.035em;line-height:1.2}
.about-signals .lane-group>span{color:#ffffff24;font-size:14px;font-weight:350}
.about-signals .lane-group button.is-active{text-underline-offset:8px;text-decoration-thickness:1px}
.about-signals .lane-group button:hover{color:var(--white)}
.about-signals .lane-one button:nth-of-type(1){font-size:clamp(28px,2.6vw,40px)}
.about-signals .lane-one button:nth-of-type(2){font-size:clamp(30px,2.9vw,44px)}
.about-signals .lane-one button:nth-of-type(3){font-size:clamp(25px,2.3vw,36px)}
.about-signals .lane-one button:nth-of-type(4){font-size:clamp(28px,2.7vw,42px)}
.about-signals .lane-two button:nth-of-type(1){font-size:clamp(23px,2.1vw,32px)}
.about-signals .lane-two button:nth-of-type(2){font-size:clamp(25px,2.35vw,36px)}
.about-signals .lane-two button:nth-of-type(3){font-size:clamp(22px,1.9vw,30px)}
.about-signals .lane-two button:nth-of-type(4){font-size:clamp(24px,2.2vw,34px)}
.about-signals .lane-three button:nth-of-type(1){font-size:clamp(18px,1.6vw,25px)}
.about-signals .lane-three button:nth-of-type(2){font-size:clamp(20px,1.8vw,28px)}
.about-signals .lane-three button:nth-of-type(3){font-size:clamp(17px,1.5vw,24px)}
.about-signals .lane-three button:nth-of-type(4){font-size:clamp(19px,1.7vw,26px)}
.about-signals .constellation-system{max-width:1440px;margin-inline:auto}
/* F123: one display family for flow and field; retain depth through weight and scale. */
.about-signals .signal-word{font-family:var(--signal-display);font-weight:400;letter-spacing:.035em;line-height:1.25;text-shadow:none}
.about-signals .signal-a,.about-signals .signal-e{font-weight:700}
.about-signals .signal-b,.about-signals .signal-d,.about-signals .signal-f,.about-signals .signal-h{font-weight:600}
.about-signals .signal-a{font-size:clamp(30px,3.8vw,52px)}
.about-signals .signal-b{font-size:clamp(20px,2.4vw,32px)}
.about-signals .signal-c,.about-signals .signal-g,.about-signals .signal-i,.about-signals .signal-j,.about-signals .signal-k,.about-signals .signal-l{font-size:clamp(13px,1.7vw,21px)}
.about-signals .signal-d,.about-signals .signal-f,.about-signals .signal-h{font-size:clamp(17px,2.2vw,28px)}
.about-signals .signal-e{font-size:clamp(24px,3vw,40px)}
.about-signals .signal-j{top:84%}.about-signals .signal-l{top:72%}
.about-signals .signal-reader{margin-top:24px;display:grid;grid-template-columns:1fr 1.48fr;gap:100px;min-height:116px}
.reader-label{padding-top:6px;color:#84847e;font:400 11px/1.5 var(--mono);letter-spacing:.06em}
.signal-reader h3{margin:0 0 12px;font-size:20px;font-weight:450;color:#deded8}
.signal-reader p{margin:0;max-width:37em;color:#a7a7a0;font-size:15px;line-height:1.9}
.signal-reader.is-decoding h3::after{content:"_";margin-left:.2em;color:#777;font:400 .8em var(--mono)}
.signal-state{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.signal-stage[data-paused=true] .lane-track,.signal-stage[data-paused=true] .signal-word{animation-play-state:paused}
.signal-stage[data-mode=field] .lane-track{animation-play-state:paused}
.about-now{display:grid;grid-template-columns:1fr 1.48fr;gap:100px;padding-top:38px;border-top:1px solid var(--page-line)}
.about-now .about-chapter-heading{display:block;align-self:start}
.now-caption{display:block;margin:0 0 24px;color:#777771;font:400 10px/1.5 ui-monospace,Menlo,monospace;letter-spacing:.12em}
.about-now .about-chapter-heading h2{font-size:clamp(60px,6.5vw,92px);font-weight:300;letter-spacing:-.06em;line-height:1.1}
.about-now .about-chapter-heading>p{margin-top:25px;font-size:11px}
.now-list{margin:0;counter-reset:now}
.now-item{position:relative;padding:30px 0 30px 48px;border-bottom:1px solid var(--page-line);counter-increment:now}
.now-item:first-child{padding-top:4px}.now-item:last-child{border-bottom:0;padding-bottom:0}
.now-item::before{content:counter(now,decimal-leading-zero);position:absolute;left:0;top:36px;color:#6f6f69;font:400 11px/1.4 ui-monospace,Menlo,monospace}
.now-item:first-child::before{top:10px}
.now-item h3{margin:0 0 13px;font-weight:450;font-size:20px;line-height:1.55;letter-spacing:-.02em;color:#deded8}
.now-item p{margin:0;color:#9b9b94;font-size:15px;line-height:1.9;max-width:32em}
.now-item a{display:inline-block;font-size:12px;color:#b9b9b2;padding:14px 0 3px;text-decoration:none}
.now-item a:hover{text-decoration:underline;text-underline-offset:5px}
.page-footer .journal-colophon{display:inline-flex;align-items:center;gap:32px;min-height:44px;text-decoration:none;color:#a4a49d}
.journal-colophon-mark{font-size:18px;font-weight:300;transition:transform .25s}
.journal-colophon:hover .journal-colophon-mark{transform:rotate(90deg)}
@media(max-width:1000px){.about-signals .signal-reader,.about-now{gap:64px;grid-template-columns:1fr 1.5fr}.now-item{padding-left:36px}}
@media(max-width:720px){
 .about-chapter{margin-top:76px;scroll-margin-top:84px}
 .about-chapter-heading{align-items:flex-start;flex-direction:column;gap:12px}
 .about-chapter-heading h2{font-size:22px}
 .about-signals .signal-stage{height:252px}
 .about-signals .lane-group{min-width:780px;padding-inline:24px;gap:28px}
 .about-signals .lane-one button:nth-of-type(n){font-size:28px}
 .about-signals .lane-one button:nth-of-type(2){font-size:30px}
 .about-signals .lane-two button:nth-of-type(n){font-size:22px}
 .about-signals .lane-two button:nth-of-type(2){font-size:24px}
 .about-signals .lane-three button:nth-of-type(n){font-size:18px}
 .about-signals .lane-three button:nth-of-type(2){font-size:21px}
 .about-signals .signal-reader{display:block;min-height:160px;margin-top:24px}
 .reader-label{display:block;padding-top:0;margin-bottom:14px;font-size:10px}
 .signal-reader h3{font-size:19px}.signal-reader p{font-size:14px}
 .about-now{display:block;padding-top:28px;margin-top:68px}
 .about-now .about-chapter-heading{position:relative;padding-bottom:28px}
 .now-caption{margin-bottom:18px;font-size:9px}
 .about-now .about-chapter-heading h2{font-size:60px}
 .about-now .about-chapter-heading>p{position:absolute;right:0;bottom:33px;margin:0;font-size:10px}
 .now-list{border-top:1px solid var(--page-line)}
 .now-item,.now-item:first-child{padding:25px 0 25px 35px}
 .now-item::before,.now-item:first-child::before{top:30px;font-size:10px}
 .now-item h3{font-size:19px;margin-bottom:10px}.now-item p{font-size:14px}
 .about-page{padding-bottom:60px}
}
@media(max-width:600px){
 .about-signals .signal-stage[data-mode=field]{height:500px}
 .about-signals .constellation-system{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:repeat(6,1fr);align-items:center;padding:16px 24px;gap:0 18px}
 .about-signals .signal-word{position:static;min-width:0;white-space:normal;text-align:left;line-height:1.35;padding:8px 0;animation-name:about-word-drift}
 .about-signals .signal-a{font-size:30px}
 .about-signals .signal-b,.about-signals .signal-d,.about-signals .signal-e{font-size:22px}
 .about-signals .signal-c,.about-signals .signal-f,.about-signals .signal-g,.about-signals .signal-h{font-size:17px}
 .about-signals .signal-i,.about-signals .signal-j,.about-signals .signal-k,.about-signals .signal-l{font-size:15px}
 @keyframes about-word-drift{from{transform:translate3d(-2px,-2px,0)}to{transform:translate3d(3px,3px,0)}}
}
@media(prefers-reduced-motion:reduce){
 .about-signals *{transition:none!important}
 .about-signals .lane-track,.about-signals .signal-word{animation:none}
 .about-signals .lane-group button:nth-of-type(n){translate:none}
 .about-signals .lane-track{width:100%;transform:none}
 .about-signals .lane-group:not([aria-hidden=true]){width:100%;min-width:0;flex:1;gap:8px 16px;flex-wrap:wrap;justify-content:flex-start;padding:12px 24px;white-space:normal}
 .about-signals .lane-group[aria-hidden=true]{display:none}
 .about-signals .lane-group button:nth-of-type(n){font-size:clamp(14px,2.2vw,24px);white-space:normal;text-align:left}
 .about-signals .lane-group>span{font-size:12px}
 .about-signals .signal-stage[data-mode=flow]{height:420px}
 .journal-colophon-mark{transition:none}
}

/* Keep original (non-duplicated) lane controls in view for keyboard browsing. */
.signal-stage[data-keyboard=true] .lane-track{animation:none;transform:none}
.signal-stage[data-keyboard=true] .signal-lane{overflow:auto;scrollbar-width:none}
.signal-stage[data-keyboard=true] .signal-lane::-webkit-scrollbar{display:none}
.signal-reader.is-read p{color:#cbcbc4}

/* F124: five author-selected identities retain three flowing lanes and the open field. */
.about-signals .signal-c{top:45%;left:42%;font-size:clamp(20px,2.5vw,32px)}
.about-signals .signal-d{top:72%;left:16%}
.about-signals .signal-e{top:66%;right:10%}
.about-signals .lane-group{min-width:max(680px,80vw)}
@media(max-width:720px){.about-signals .lane-group{min-width:560px}.about-signals .signal-c{left:42%;font-size:22px}.about-signals .signal-e{right:9%}}