/* 先跑通 VI 2.1「黄金比例」覆盖层（2026-10-11）。
   放在 style.css / p0x.css 之后。颜色只用 墨黑 #111111 / 纸白 #FFFFFF / 浅灰 #F3F2EF / 中灰 #8C8C8C / 线灰 #DEDEDE；
   小字 #6B6B6B（墨黑底 #A3A3A3）；银朱 #E4402E 只在标志的 ■ 里，本文件不写银朱。
   间距走黄金刻度 6 / 10 / 16 / 26 / 42 / 68 / 110；分栏 38.2% : 61.8%；默认直角，不用阴影、渐变。 */
:root{--rf-sans:"Inter RF","Noto Sans SC RF","Noto Sans CJK SC","Source Han Sans SC","PingFang SC","Microsoft YaHei",sans-serif;--rf-mono:"Inter RF","Noto Sans SC RF","Noto Sans CJK SC","Source Han Sans SC","PingFang SC",sans-serif;
  --vi-ink:#111111;--vi-paper:#FFFFFF;--vi-alt:#F3F2EF;--vi-stone:#8C8C8C;--vi-line:#DEDEDE;--vi-muted:#6B6B6B;--vi-muted-dark:#A3A3A3;
  --vi-ease:cubic-bezier(.16,1,.3,1)}
html,body{font-family:var(--rf-sans)}
body{background:var(--vi-alt);color:var(--vi-ink);-webkit-font-smoothing:antialiased}
h1,h2,.rf-hero h1{font-weight:900;letter-spacing:0}
h3{font-weight:700}
.mono,.copy,code{font-family:var(--rf-mono);font-variant-numeric:tabular-nums}
/* VI 只用 Inter + 思源黑体：原来的等宽字体改成 Inter 等宽数字 */
.p2-form .copy i,.copy i{font-family:var(--rf-mono)}
:focus-visible{outline:2px solid var(--vi-ink)!important;outline-offset:2px}

/* ---------- 页首 ---------- */
.rf-hero{background:var(--vi-paper);border-bottom:1px solid var(--vi-line)}
.rf-logo{height:auto;width:142px;display:block}
.rf-top-nologo{justify-content:flex-end}
.rf-hero .rf-nav a{border-color:var(--vi-line);color:var(--vi-ink);border-radius:0}
.rf-hero .rf-nav a.current,.rf-hero .rf-nav a:hover{background:var(--vi-ink);border-color:var(--vi-ink);color:var(--vi-paper)}
.rf-eyebrow{color:var(--vi-muted);letter-spacing:.06em}
.rf-eyebrow:before{background:var(--vi-ink);height:2px}
.rf-hero h1{font-size:clamp(36px,4.6vw,68px);line-height:1.15}
.rf-mark{background:none;text-decoration:underline;text-decoration-thickness:.09em;text-underline-offset:.16em;text-decoration-color:var(--vi-ink)}
.rf-hero .rf-lead{color:var(--vi-ink)}
.rf-hero .rf-note{color:var(--vi-muted)}
.rf-btn{background:var(--vi-ink);color:var(--vi-paper)}
.rf-btn:hover{background:#333333}
.rf-link{color:var(--vi-ink);border-bottom:2px solid var(--vi-ink)}
.rf-link:hover{border-bottom-color:var(--vi-stone)}
.rf-tile{border:1px solid var(--vi-line);transition:transform .236s var(--vi-ease)}
.rf-tile:hover{transform:translateY(-2px)}
.rf-tile span{padding:10px 10px 8px;background:var(--vi-ink)}
.rf-tile small{color:var(--vi-muted-dark)}
.rf-tile:focus-visible,.rf-btn:focus-visible,.rf-link:focus-visible{outline:2px solid var(--vi-ink);outline-offset:2px}
/* VIS 手册封面是横版：卡片里只露左边的大三角，不把右上角的标志切成半个 */
.rf-tile img[src*="手册2.1-P01"]{object-position:left top}

/* 招牌：步骤（左 0.382）+ 节奏条跑进标志（右 0.618），标志放右下；一屏只此一处银朱 */
.rf-run{display:grid;grid-template-columns:38.2% 61.8%;align-items:end;gap:0;margin-top:42px}
.rf-hero .rf-road{display:flex;flex-wrap:wrap;gap:10px 26px;margin:0;padding:0 26px 0 0;list-style:none}
.rf-hero .rf-road:before,.rf-hero .rf-road li:after{display:none!important;content:none}
.rf-hero .rf-road li{flex:0 0 auto;transform:none;padding:0;font-size:15px;font-weight:700;line-height:1.4;color:var(--vi-ink)}
.rf-hero .rf-road li:before{content:"▶";display:inline-block;font-size:.62em;margin-right:6px;transform:translateY(-.12em);color:var(--vi-ink)}
.rf-rhythm svg{display:block;width:100%;height:auto}
.rf-rhythm svg *{transform-box:fill-box;transform-origin:center}
@keyframes vi-beat{from{opacity:0;transform:translateX(-35%)}}
@keyframes vi-fade{from{opacity:0}}
@keyframes vi-stamp{0%{opacity:0;transform:scale(1.7)}60%{opacity:1}100%{opacity:1;transform:scale(1)}}
@media (prefers-reduced-motion:no-preference){
  .vi-js .rf-rhythm .beat{animation:vi-beat .236s var(--vi-ease) calc(.236s + var(--i) * .09s) both}
  .vi-js .rf-rhythm .run{animation:vi-beat .236s var(--vi-ease) calc(.236s + 16 * .09s + .09s) both}
  .vi-js .rf-rhythm .type{animation:vi-fade .382s var(--vi-ease) calc(.236s + 16 * .09s + .146s) both}
  .vi-js .rf-rhythm .seal{animation:vi-stamp .382s cubic-bezier(.32,0,.18,1) calc(.236s + 16 * .09s + .382s) both}
}
@media (max-width:900px){.rf-run{grid-template-columns:1fr;gap:16px}.rf-hero .rf-road{padding:0}}
@media (max-width:620px){.rf-logo{width:118px}.rf-hero .rf-road li{font-size:14px}}

/* 旧「通」印改为墨黑 ■（页眉标志里已有银朱 ■，路尽头不再落银朱） */
.vi-stop{display:inline-block;width:26px;height:26px;background:var(--vi-ink)}
.fp-end .vi-stop{margin-top:6px}

/* ---------- 通用：卡片、色条、提示 ---------- */
.card,.panel{box-shadow:none;border-radius:0}
.callout,.x-quote,.fp-quote,.p3-say,.p3 #canvas-detail,.p2-alert,.p5-tip,.p5-card .lead,.p4-msg,.p4-day-in{border-left-width:2px!important;border-left-color:var(--vi-ink)!important}
.callout{background:var(--vi-paper)}
.warn{background:var(--vi-paper);border-left:2px solid var(--vi-ink)}
.flow .step,.x-parts>div,.p2-main .p2-gate,.p2-steps li,.p3-core .sample,.p5-ask,.kpi-card{border-top-width:2px!important;border-top-color:var(--vi-ink)!important}
.x-parts>div:nth-child(n){border-top-color:var(--vi-ink)!important}
.x-k.warn{border-left:2px solid var(--vi-ink)}
.eyebrow,.artifact .label,.label{color:var(--vi-muted)}
.muted,.small.muted,.footer{color:var(--vi-muted)}
a{color:var(--vi-ink)}

/* 标签：不用颜色区分含义——实心＝要处理 / 描边＝正常 / 浅灰＝一般 */
.x-tag{background:var(--vi-alt);color:var(--vi-ink)}
.x-tag.r{background:var(--vi-ink);color:var(--vi-paper)}
.x-tag.g{background:var(--vi-paper);color:var(--vi-ink);box-shadow:inset 0 0 0 1px var(--vi-stone)}
.x-tag.y,.x-tag.k{background:var(--vi-alt);color:var(--vi-ink)}
.x-score.s5{background:var(--vi-ink);color:var(--vi-paper)}
.x-score.s3{background:var(--vi-alt);color:var(--vi-ink)}
.x-score.s2{background:var(--vi-paper);color:var(--vi-ink);box-shadow:inset 0 0 0 1px var(--vi-stone)}
.scene-tags em{background:var(--vi-alt);color:var(--vi-ink)}
.scene-tags em:last-child{background:var(--vi-paper);box-shadow:inset 0 0 0 1px var(--vi-line)}
.scene-tags em.real{background:var(--vi-ink)!important;color:var(--vi-paper)!important}
.scene:hover,.scene.active{border-color:var(--vi-ink);box-shadow:inset 0 0 0 1px var(--vi-ink)}

/* 图表：系列用 墨黑 / 中灰 / 线灰 区分，涨跌靠箭头 */
.x-chart i{background:var(--vi-ink)}
.x-chart i.g,.x-legend i.g{background:var(--vi-stone)}
.x-legend i{background:var(--vi-ink)}
.x-fun span{background:var(--vi-ink)}
.x-up,.x-dn{color:var(--vi-ink)}
.baritem.gold .rail i,.baritem.violet .rail i{background:var(--vi-stone)}
.bar{background:var(--vi-ink)}.bar.gold{background:var(--vi-stone)}.bar.light{background:var(--vi-line)}

/* 字色与底色相同的几处（原来是黄色字配深蓝底，换色后两者都成了墨黑） */
.x-shot span{background:var(--vi-ink);color:var(--vi-paper)}
.x-shotbar button.on,.x-tabs button.on{background:var(--vi-ink);border-color:var(--vi-ink);color:var(--vi-paper)}
.fp-stops li.key .fp-n{background:var(--vi-ink);color:var(--vi-paper)}
.fp-chain li:nth-last-child(-n+2){background:var(--vi-ink);color:var(--vi-paper);border-color:var(--vi-ink)}
.fp-chain li:nth-last-child(-n+2):after{color:var(--vi-paper)}
.p3 .p3-seg button:hover{background:var(--vi-alt);color:var(--vi-ink)}

/* 01 角色：老板＝墨黑字、团队＝中灰字、产物＝墨黑底反白小标签（原来靠蓝 / 灰 / 金三色区分） */
.fp-stops dt.r-out,.fp-legend .r-out{display:inline-block;background:var(--vi-ink);color:var(--vi-paper);padding:1px 6px}
.fp-legend .r-out:before{display:none}

/* 墨黑通栏里的小字与细线 */
.fp-rhythm,.p3-stage{background:var(--vi-ink)}
.fp-rhythm .fp-kicker,.fp-rhythm-note,.fp-beats span{color:var(--vi-muted-dark)}
.fp-beats li{border-top:2px solid var(--vi-paper)}
.fp-beats li:after{color:var(--vi-paper)}

/* 深色区里原来的黄色强调改为纸白 / 浅灰小字（浅底上仍是墨黑） */
.p3-stage{--gold:#FFFFFF}
.p3 .p3-seg button.active{background:var(--vi-paper);color:var(--vi-ink)}
.p3 .p3-screen>.pill{background:var(--vi-ink);color:var(--vi-paper)}
.p3-screen .mini-board b{border-bottom-color:var(--vi-ink)}
.p3-script h3{color:var(--vi-muted-dark)}
.p2-sched{--gold:#FFFFFF}
.p2-sched-head span,.p2-row p:before{color:var(--vi-muted-dark)}
.p5-seg button.active,.p5-card .label,.p5 .scene.active strong{color:var(--vi-paper)}
.p5 .scene.active:after{background:var(--vi-paper)}

/* 05 选中的场景卡：编号在墨黑底上用浅灰 */
.p5 .scene.active i{color:var(--vi-muted-dark)}

/* 07 SOP 泳道图：检查点＝浅灰底粗墨黑边，异常处理＝墨黑实心反白（不靠颜色区分） */
.x-lanes .s.ck{background:var(--vi-alt);border:2px solid var(--vi-ink)}
.x-lanes .s.ex{background:var(--vi-ink);border:2px solid var(--vi-ink);color:var(--vi-paper)}