/* VI 2.1 换色：由 build_vi21.py 从 v13 同名文件生成（旧注释已去掉），规则见脚本头 */

.p4-hero{padding-bottom:40px}
.p4-head{max-width:860px;margin-top:40px}
.p4-hero h1{margin:16px 0 18px}
.p4-main{max-width:1180px}
.p4-main section{margin:28px 0 48px}


.p4-trio{display:grid;grid-template-columns:1fr 1fr 1.25fr;gap:34px;align-items:stretch}
.p4-card{position:relative;background:#FFFFFF;border:1px solid #DEDEDE;border-radius:0;padding:22px 22px 20px}
.p4-card:not(:last-child):after{content:'→';position:absolute;right:-26px;top:50%;transform:translateY(-50%);color:#111111;font-weight:900;font-size:20px}
.p4-tag{display:inline-block;font-size:12px;font-weight:800;letter-spacing:.14em;color:#6B6B6B}
.p4-card h3{font-family:var(--rf-sans);font-weight:900;font-size:20px;line-height:1.35;color:#111111;margin:8px 0 10px}
.p4-card p{margin:0;font-size:14px;line-height:1.75;color:#111111}
.p4-card-out{background:#111111;border-color:#111111;box-shadow:none}
.p4-card-out .p4-tag{color:#111111}
.p4-card-out h3{color:#FFFFFF;font-size:23px}
.p4-card-out p{color:#DEDEDE}


.p4-road{position:relative}
.p4-day{position:relative;display:flex;flex-direction:column;background:#FFFFFF;border:1px solid #DEDEDE;border-radius:0;padding:14px 14px 0;overflow:hidden}
.p4-num{font-family:var(--rf-sans);font-weight:900;color:#111111;line-height:1}
.p4-see{margin:0 0 10px;font-size:13px;line-height:1.5}
.p4-see b{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.06em;color:#6B6B6B;background:#FFFFFF;border-radius:0;padding:1px 6px;margin-bottom:4px}
.p4-see a{display:block;color:#111111;font-weight:700;text-decoration:none}
.p4-see a:hover{text-decoration:underline;text-decoration-color:#111111;text-underline-offset:3px}
.p4-see a:focus-visible{outline:3px solid #111111;outline-offset:2px;border-radius:0}
.p4-act{display:block;font-family:var(--rf-sans);font-weight:900;font-size:16px;line-height:1.4;color:#111111}
.p4-desc{margin:5px 0 12px;font-size:13px;line-height:1.65;color:#111111}
.p4-keep{display:block;margin:auto -14px 0;padding:8px 14px;background:#F3F2EF;border-top:2px solid #111111;font-size:12px;font-weight:700;line-height:1.5;color:#111111}


.p4-day-in{display:grid;grid-template-columns:110px minmax(0,1fr) minmax(0,1.5fr) auto;grid-template-areas:"n s a k" "n s d k";column-gap:22px;align-items:center;padding:16px 20px;margin-bottom:8px;border-left:4px solid #111111}
.p4-day-in .p4-num{grid-area:n;font-size:34px}
.p4-day-in .p4-see{grid-area:s;margin:0}
.p4-day-in .p4-act{grid-area:a;align-self:end}
.p4-day-in .p4-desc{grid-area:d;align-self:start;margin:4px 0 0}
.p4-day-in .p4-keep{grid-area:k;margin:0;border:0;border-radius:0;padding:6px 14px}

.p4-week{display:flex;align-items:center;gap:10px;margin:26px 0 10px;font-size:12px;font-weight:800;letter-spacing:.2em;color:#6B6B6B}
.p4-week:before{content:'';width:22px;height:2px;background:#111111}
.p4-wk{position:relative}
.p4-days{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:12px;position:relative}
.p4-days:before{content:'';position:absolute;left:0;right:0;top:21px;height:2px;background:#111111}
.p4-days .p4-day{margin-top:56px;overflow:visible}
.p4-days .p4-num{position:absolute;left:-1px;top:-56px;font-size:38px;height:44px;padding-right:8px;background:#F3F2EF}
.p4-days .p4-keep{border-radius:0}
.p4-day.key{border:2px solid #111111;box-shadow:none}
.p4-day.key .p4-num{color:#111111;background:#F3F2EF}
.p4-days .p4-day.key .p4-keep{margin:auto -14px 0;border-radius:0}
.p4-final{background:#F3F2EF}
.p4-wk2 .p4-days:before{right:-14px}

.p4-end{position:absolute;right:-62px;top:26px}
.p4-seal{width:46px;height:46px;display:grid;place-items:center;background:#111111;color:#FFFFFF;font-family:var(--rf-sans);font-size:26px;font-weight:900;border-radius:0;animation:rf-stamp .35s ease-out .4s both}
@media(prefers-reduced-motion:reduce){.p4-seal{animation:none}}


.p4-pair{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
.p4-sheet{background:#FFFFFF;border:1px solid #DEDEDE;border-radius:0;padding:20px 22px 22px}
.p4-sheet h3{font-family:var(--rf-sans);font-weight:900;font-size:19px;color:#111111;margin:0 0 12px}
.p4-form{font-size:15px;line-height:34px;color:#111111;background:#F3F2EF;padding:0 2px}
.p4-sheet-eg{background:#F3F2EF;border-color:#DEDEDE}
.p4-sheet-eg .p4-form{color:#111111}
.p4-fake{display:inline-block;margin:0 0 10px;font-size:12px;color:#6B6B6B;border:1px dashed #8C8C8C;border-radius:0;padding:3px 9px}
.p4-tips{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}
.p4-tips p{margin:0;border-top:2px solid #111111;padding-top:10px;font-size:14px;line-height:1.75;color:#111111}
.p4-tips b{color:#111111}


.p4-bookends{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}
.p4-bookends section{margin:28px 0 40px}
.p4-msg{background:#FFFFFF;border:1px solid #DEDEDE;border-left:4px solid #111111;border-radius:0;padding:18px 20px;font-size:15px;line-height:1.85;color:#111111}
.p4-aside{margin:10px 0 0;font-size:12px;line-height:1.6;color:#6B6B6B}

@media(max-width:1300px){.p4-end{position:static;display:flex;justify-content:flex-end;margin-top:12px}.p4-wk2 .p4-days:before{right:0}}
@media(max-width:1100px){
.p4-trio{gap:28px}
.p4-road:before{content:'';position:absolute;left:27px;top:24px;bottom:23px;width:2px;background:#111111}
.p4-day-in,.p4-days .p4-day{margin-left:72px}
.p4-day-in{display:flex;flex-direction:column;align-items:stretch;padding:14px 14px 0;border-left:1px solid #DEDEDE;border:2px solid #111111}
.p4-day-in .p4-num,.p4-days .p4-num{position:absolute;left:-74px;top:10px;width:56px;height:auto;padding:4px 0;text-align:center;font-size:26px;background:#F3F2EF}
.p4-day-in .p4-num{font-size:20px;top:12px}
.p4-day-in .p4-act,.p4-day-in .p4-desc{align-self:auto}
.p4-day-in{overflow:visible}
.p4-day-in .p4-see{margin:0 0 10px}
.p4-day-in .p4-desc{margin:5px 0 12px}
.p4-day-in .p4-keep{margin:auto -14px 0;border-top:2px solid #111111;border-radius:0}
.p4-week{margin:22px 0 10px 72px}
.p4-days{grid-template-columns:1fr;gap:10px}
.p4-days:before{display:none}
.p4-days .p4-day{margin-top:0}
.p4-day.key .p4-num{background:#111111 center bottom/60% 4px no-repeat,#F3F2EF}
.p4-end{justify-content:flex-start;margin:12px 0 0 5px;position:relative;right:auto;top:auto}
.p4-bookends{grid-template-columns:1fr;gap:0}
}
@media(max-width:760px){
.p4-trio{grid-template-columns:1fr;gap:26px}
.p4-card:not(:last-child):after{content:'↓';right:auto;left:50%;top:auto;bottom:-25px;transform:translateX(-50%)}
.p4-pair,.p4-tips{grid-template-columns:1fr}
}
@media(max-width:620px){
.p4-head{margin-top:28px}
.p4-hero h1{font-size:clamp(26px,7.6vw,34px)}
.fp-sechead h2{font-size:23px}
.p4-road:before{left:21px}
.p4-day-in,.p4-days .p4-day{margin-left:54px}
.p4-day-in .p4-num,.p4-days .p4-num{left:-56px;width:44px;font-size:22px}
.p4-day-in .p4-num{font-size:17px}
.p4-week{margin-left:54px}
.p4-end{margin-left:-1px}
.p4-card-out h3{font-size:21px}
.p4-form{font-size:14px}
}
@media print{.p4-seal{animation:none}.p4-card-out{background:#FFFFFF;color:#111111}.p4-card-out h3{color:#111111}.p4-card-out p{color:#111111}.p4-day{break-inside:avoid}}
