/* A thin-rim paper tray carries the approved leaves over the shared background. */
.notebook:before{content:'';position:absolute;inset:27px 3.8% 25px;background:url('../assets/customer-paper-tray-v10.fast.webp') center/100% 100% no-repeat;pointer-events:none}
.title-plaque h1{color:#fff1d7;text-shadow:0 2px 1px #263c4c70}.title-plaque h1:after{background:#e3b25c;box-shadow:0 2px 1px #263c4c44}.drawer-label b{color:#3d342b;text-shadow:none}
.project-heading{left:8%;top:102px}.chapter-rail{right:8%;top:95px;width:350px;height:62px}.pages{left:8%;right:8%;top:171px;bottom:76px}
#overview{gap:17px}.overview-heading{min-height:77px;padding:0 3px}.title-emblem{width:60px;height:60px}.title-plaque h1{font-size:37px}.overview-heading .clay-button{height:61px}.overview-poster{padding:4px 0 9px;gap:20px;grid-template-columns:1.08fr 1.15fr .8fr}
.design-column,.process-column,.results-column,.route-sheet,.reply-pocket{background:#fff3dd url('../assets/customer-common-clay-v3.fast.webp') 46% 29%/3000px 1800px no-repeat;border:1px solid #fff8e7;border-radius:3px 7px 4px 5px;box-shadow:0 2px 1px #b2946e70,0 7px 16px #503b2420;transform:none}
.design-column,.process-column,.results-column{padding:24px 24px 27px}.design-column{gap:15px}.overview-column h3{width:161px;min-height:51px;font-size:21px;padding:8px 13px;margin-bottom:7px}.design-column h3{margin-bottom:0}.design-insight h4{font-size:15px}.design-insight p{font-size:12px;line-height:1.95}.design-boundary{background:#e6cfa649;box-shadow:none;border-radius:2px 5px 2px 4px;padding:10px 11px}.design-boundary p,.design-validation p{font-size:11px;line-height:1.9}.design-validation{margin-top:4px;padding:0}.design-validation>b,.design-boundary h4{font-size:12px}
.overview-routing{margin-top:10px;margin-bottom:18px;min-height:175px}.exhibit-node b,.exhibit-note,.station b,.station small,.branch-note{background:#f8ecd5}.overview-process{padding-top:14px;gap:14px 12px}.overview-process b{font-size:12px}.overview-process small{font-size:9px}.results-column,.reply-pocket{box-shadow:3px 3px 0 #526a77,4px 5px 0 #345366,0 8px 15px #503b2420}.results-column .pilot-hero{margin-top:15px;margin-bottom:10px}.pilot-hero>strong{font-size:57px}.route-sheet{padding:28px 30px 24px}.reply-pocket{padding:30px 25px 28px}
@media(min-width:901px) and (max-height:790px){.project-heading{top:81px}.chapter-rail{top:73px;height:56px;width:320px}.pages{top:137px;bottom:62px}.overview-heading{min-height:61px}.title-emblem{width:49px;height:49px}.title-plaque h1{font-size:32px}.overview-heading .clay-button{height:54px}#overview{gap:11px}.overview-poster{gap:14px;padding-top:1px}.design-column,.process-column,.results-column{padding:18px 20px 22px}.design-column{gap:9px}.overview-column h3{width:145px;min-height:44px;font-size:19px;margin-bottom:4px}.design-column h3{margin-bottom:0}.design-insight h4{font-size:13px;line-height:1.75}.design-insight p{font-size:11px;line-height:1.8;margin-top:4px}.design-boundary{padding:8px 9px}.design-boundary p,.design-validation p{font-size:10px;line-height:1.8}.design-validation>b,.design-boundary h4{font-size:11px}.overview-routing{min-height:145px;margin-top:7px;margin-bottom:14px}.overview-process{padding-top:10px;gap:10px}.process-column>.overview-claim{font-size:10px}.results-column .pilot-hero{margin-top:11px;margin-bottom:8px}.pilot-hero>strong{font-size:47px}.route-sheet{padding:22px 23px 19px}.reply-pocket{padding:25px 21px 23px}.route-map{min-height:205px}}
@media(min-width:901px) and (max-width:1100px){.overview-poster{gap:11px;grid-template-columns:1.1fr 1.1fr .8fr}.design-column,.process-column,.results-column{padding-left:15px;padding-right:15px}.overview-column h3{width:132px;min-height:43px;font-size:18px}.design-insight h4{font-size:12px}.design-insight p{font-size:10.5px}.overview-process b{font-size:10px}.overview-process small{font-size:8px}.overview-routing{min-height:140px}.pilot-hero>strong{font-size:43px}.pilot-metrics strong{font-size:21px}}
@media(min-width:1600px) and (min-height:900px){.pages{top:183px;bottom:85px}.project-heading{top:113px}.chapter-rail{top:106px}.design-column,.process-column,.results-column{padding:30px}.design-column{gap:18px}.design-insight h4{font-size:17px}.design-insight p{font-size:13px}.design-boundary p,.design-validation p{font-size:12px}.overview-column h3{width:180px;min-height:58px;font-size:24px}.overview-routing{min-height:190px}}
@media(max-width:900px){.notebook:before{inset:21px 3%;opacity:1}.project-heading{left:10%;top:93px}.chapter-rail{left:9%;right:9%;width:auto;top:143px;height:61px}.pages{left:9%;right:9%;top:221px;bottom:75px}.overview-heading{min-height:0;padding:0}.title-emblem{width:40px;height:40px}.title-plaque h1{font-size:clamp(18px,4.8vw,30px)}.overview-heading .clay-button{height:54px}.overview-poster{gap:21px;padding:5px 3px 14px}.design-column,.process-column,.results-column{padding:23px 22px 27px}.design-column{gap:18px}.overview-column h3{width:161px;min-height:52px;font-size:21px;margin-bottom:7px}.design-column h3{margin-bottom:0}.design-insight h4{font-size:14px}.design-insight p{font-size:12px;line-height:1.95}.design-boundary p,.design-validation p{font-size:11px}.design-validation{margin-top:4px}.overview-routing{height:210px;min-height:210px;margin:18px 0 24px}.overview-process{gap:17px 12px;padding-top:17px}.overview-process b{font-size:12px}.overview-process small{font-size:9px}.pilot-hero>strong{font-size:59px}.route-sheet{padding:23px 11px 20px;min-height:415px}.reply-pocket{padding:27px 23px}.route-map{min-height:285px}}
/* Preserve the two approved material leaves; lighten only the project-design leaf. */
.process-column,.results-column,.route-sheet,.reply-pocket{background-image:url('../assets/customer-section-leaves-v3.fast.webp');background-size:300% 110%;background-repeat:no-repeat;background-color:transparent;border:0;border-radius:0;box-shadow:none}
.process-column,.route-sheet{background-position:50% center}.results-column,.reply-pocket{background-position:100% center}
.process-column{padding:28px 35px 47px}.results-column{padding:28px 29px 39px}.route-sheet{padding:35px 9% 48px}.reply-pocket{padding:34px 28px 39px}
.design-column{position:relative;background-size:2300px 1400px;background-position:45% 27%;border-color:#fff8e2;box-shadow:0 2px 1px #ad8d6460,0 6px 13px #6c4e3320}
.design-column:before{display:block;content:'';position:absolute;top:-7px;right:27px;width:48px;height:17px;background:#d7b888b3;box-shadow:0 1px 1px #7c5c331a;transform:rotate(4deg)}
@media(min-width:901px) and (max-height:790px){.process-column{padding:23px 29px 40px}.results-column{padding:23px 25px 34px}.overview-routing{min-height:125px;margin-bottom:10px}.overview-process{gap:8px}.route-sheet{padding:29px 9% 40px}.reply-pocket{padding:28px 24px 33px}}
@media(min-width:901px) and (max-width:1100px){.process-column{padding-left:25px;padding-right:25px}.results-column{padding-left:23px;padding-right:23px}}
@media(max-width:900px){.process-column{padding:29px 28px 49px}.results-column{padding:29px 29px 39px}.route-sheet{padding:30px 9% 42px}.reply-pocket{padding:30px 26px 37px}.overview-routing{height:210px;min-height:210px}}
.process-column{padding-left:41px;padding-right:39px}@media(min-width:901px) and (max-height:790px){.process-column{padding-left:36px;padding-right:34px}}@media(min-width:901px) and (max-width:1100px){.process-column{padding-left:31px;padding-right:29px}}@media(max-width:900px){.process-column{padding-left:33px;padding-right:32px}}
/* A stitched cloth project label: quiet context, typeset title, restrained brass detail. */
.overview-heading .title-plaque{position:relative;gap:15px;min-width:365px;padding:12px 34px 13px 17px;background:#456071 url('../assets/customer-common-clay-v3.fast.webp') left bottom/1600px 900px;background-blend-mode:multiply;border:1px solid #6f8288;border-radius:3px 4px 7px 3px;box-shadow:2px 3px 0 #263d49,0 6px 12px #233b4a38}
.overview-heading .title-plaque:before{content:'';position:absolute;inset:5px;border:1px dashed #c9b58d70;border-radius:1px 2px 4px 1px;pointer-events:none}
.overview-heading .title-plaque:after{content:'';position:absolute;right:15px;top:50%;width:7px;height:7px;border-radius:50%;background:#b79a61;box-shadow:inset 0 1px 1px #f3dca8,0 1px 2px #192c36;transform:translateY(-50%)}
.overview-heading .title-emblem{width:45px;height:45px;transform:rotate(-4deg);filter:drop-shadow(0 2px 1px #1d344350)}
.overview-heading .title-plaque h1{display:flex;flex-direction:column;gap:4px;font-family:'Microsoft YaHei','PingFang SC',sans-serif;color:#eadfca;text-shadow:none;white-space:nowrap;letter-spacing:0;line-height:1}
.overview-heading .title-context{font:400 11px/1.1 'Microsoft YaHei',sans-serif;letter-spacing:.4em;color:#c2b79f}
.overview-heading .title-name{font:600 30px/1.15 'SimSun','Songti SC',serif;letter-spacing:.12em}
.overview-heading .title-plaque h1:after{display:none}
@media(min-width:901px) and (max-height:790px){.overview-heading .title-plaque{min-width:325px;padding:8px 31px 10px 15px;gap:12px}.overview-heading .title-emblem{width:39px;height:39px}.overview-heading .title-name{font-size:27px}.overview-heading .title-context{font-size:10px}}
@media(max-width:900px){.overview-heading .title-plaque{width:auto;min-width:0;max-width:100%;padding:12px 31px 13px 13px;gap:10px}.overview-heading .title-emblem{width:35px;height:35px}.overview-heading .title-name{font-size:clamp(21px,5.7vw,28px);letter-spacing:.09em}.overview-heading .title-context{font-size:10px}.overview-heading .title-plaque:after{right:13px;width:6px;height:6px}}
/* Selected direction 03: blue-backed design record at left; taped thin results sheet at right. */
.design-column{background:transparent url('../assets/customer-section-leaves-v3.fast.webp') 100% center/300% 110% no-repeat;border:0;border-radius:0;box-shadow:none;padding:30px 31px 43px}
.design-column:before{display:none}
.results-column{background:#fff3dd url('../assets/customer-common-clay-v3.fast.webp') 45% 27%/2300px 1400px no-repeat;border:1px solid #fff8e2;border-radius:3px 7px 4px 5px;box-shadow:0 2px 1px #ad8d6460,0 6px 13px #6c4e3320;padding:24px 24px 27px}
.results-column:before{display:block;content:'';position:absolute;top:-7px;right:25px;width:48px;height:17px;background:#d7b888b3;box-shadow:0 1px 1px #7c5c331a;transform:rotate(4deg)}
@media(min-width:901px) and (max-height:790px){.design-column{padding:24px 27px 36px}.results-column{padding:18px 20px 22px}}
@media(min-width:901px) and (max-width:1100px){.design-column{padding-left:24px;padding-right:24px}.results-column{padding-left:18px;padding-right:18px}}
@media(min-width:1600px) and (min-height:900px){.design-column{padding:34px 36px 48px}.results-column{padding:30px}}
@media(max-width:900px){.design-column{padding:30px 29px 42px}.results-column{padding:23px 22px 27px}}
.results-column:before{border:0;border-radius:1px;clip-path:polygon(2% 0,100% 3%,98% 100%,0 97%);transform:rotate(4deg)}.design-column{padding-right:40px}@media(min-width:901px) and (max-height:790px){.design-column{padding-right:36px}}@media(min-width:901px) and (max-width:1100px){.design-column{padding-right:32px}}@media(max-width:900px){.design-column{padding-right:37px}}
/* Direction 03 title strip and matching chapter controls. */
.overview-heading .title-plaque{min-width:0;width:410px;height:81px;gap:0;padding:12px 27px 12px 57px;background:transparent url('../assets/customer-title-paper-v11.fast.webp') center/100% 100% no-repeat;border:0;border-radius:0;box-shadow:none}
.overview-heading .title-plaque:before,.overview-heading .title-plaque:after,.overview-heading .title-emblem{display:none}
.overview-heading .title-plaque h1{flex-direction:row;align-items:baseline;gap:14px;color:#422d20}
.overview-heading .title-context{font-size:14px;letter-spacing:.12em;color:#5f4532;position:relative}
.overview-heading .title-context:after{content:'';position:absolute;left:0;bottom:-12px;width:27px;height:3px;background:#ac5539;border-radius:2px;transform:rotate(-3deg)}
.overview-heading .title-name{font-size:31px;letter-spacing:.07em}
.overview-heading .clay-button{display:none}
.chapter{font:600 14px/1.4 var(--text);gap:9px}.chapter-rail nav{gap:12px}
.results-column .regression-result{margin-top:22px;padding-top:17px;border-top:1px dashed #bda57f;gap:8px}
.results-column .regression-result:after{display:none}
.results-column .regression-result>p{font-size:14px;line-height:1.85;font-weight:500;color:#654b36;text-wrap:pretty}
.results-column .regression-result>span{font:600 14px/1.6 var(--text)}
.results-column .regression-result em{font-size:11px}
@media(min-width:901px){.notebook:has(#overview.on) .chapter-rail{top:180px}}
@media(min-width:901px) and (max-height:790px){.overview-heading .title-plaque{width:365px;height:68px;padding:9px 23px 10px 51px}.overview-heading .title-name{font-size:28px}.overview-heading .title-context{font-size:12px}.notebook:has(#overview.on) .chapter-rail{top:143px}.results-column .regression-result{margin-top:15px;padding-top:11px;gap:5px}.results-column .regression-result>p{font-size:13px;line-height:1.75}}
@media(min-width:901px) and (max-width:1100px){.overview-heading .title-plaque{width:340px}.overview-heading .title-name{font-size:25px}.results-column .regression-result>p{font-size:12px}}
@media(max-width:900px){.overview-heading .title-plaque{width:100%;height:68px;padding:9px 17px 10px 43px;max-width:360px}.overview-heading .title-plaque h1{gap:9px}.overview-heading .title-name{font-size:clamp(20px,5.5vw,27px);letter-spacing:.04em}.overview-heading .title-context{font-size:11px;letter-spacing:0}.overview-heading .title-context:after{width:21px;bottom:-9px;height:2px}.results-column .regression-result{margin-top:25px;padding-top:18px;gap:8px}.results-column .regression-result>p{font-size:14px;line-height:1.85}}
.overview-heading .title-plaque{background-size:100% 260%;background-position:center 51%}@media(min-width:901px) and (max-height:790px){.atelier #overview .overview-poster{flex:1 1 0%;min-height:0}}
@media(min-width:901px) and (max-height:790px){.results-column .pilot-hero{margin-top:8px;margin-bottom:6px}.results-column .regression-result{margin-top:10px;padding-top:9px}.results-column{padding-bottom:18px}}
/* User-provided red clay return button; larger tray gives the three leaves breathing room. */
.project-heading .return-link{display:block;width:72px;height:47px;min-height:44px;padding:0;background:transparent url('../assets/customer-return-red-v12.fast.webp') center/100% 100% no-repeat;border-radius:0;box-shadow:none;transition:transform .15s ease}
.project-heading .return-link svg{display:none}.project-heading .return-link span{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.project-heading .return-link:hover{transform:translateY(-2px)}.project-heading .return-link:active{transform:translateY(1px)}
@media(min-width:901px){.notebook:before{inset:20px 2.5% 18px}.pages{left:6.8%;right:6.8%;top:164px;bottom:56px}.project-heading{left:6.8%}.chapter-rail{right:6.8%}.notebook:has(#overview.on) .chapter-rail{top:173px}}
@media(min-width:901px) and (max-height:790px){.pages{top:131px;bottom:49px}.notebook:has(#overview.on) .chapter-rail{top:137px}}
@media(max-width:900px){.notebook:before{inset:18px 1.5%}.pages{left:7%;right:7%;bottom:61px}.project-heading .return-link{width:66px;height:44px}}
@media(min-width:901px){.results-column{margin-bottom:16px}}
/* Common chapter position; the experiment gets its own clear header and lighter routing tray. */
.route-sheet{background:transparent url('../assets/customer-route-thin-v13.fast.webp') center/100% 100% no-repeat;padding:29px 33px 28px}
.experiment{grid-template-columns:minmax(0,1fr) clamp(230px,23vw,310px);gap:22px}
.route-map{min-height:250px;margin:15px 0 13px}.incoming{padding-bottom:12px}.map-foot{padding-top:10px}
@media(min-width:901px){.notebook:before{bottom:0}.pages{bottom:42px}.atelier .chapter-rail,.atelier .notebook:has(#overview.on) .chapter-rail{top:130px}#flow{padding-top:58px;gap:19px;padding-bottom:10px}.case-drawer{flex-shrink:0}.case-slips{gap:9px}.case-slip{min-height:63px}.drawer-label{margin-bottom:8px}}
@media(min-width:901px) and (max-height:790px){.pages{bottom:38px}.atelier .chapter-rail,.atelier .notebook:has(#overview.on) .chapter-rail{top:106px}#flow{padding-top:53px;gap:14px}.route-sheet{padding:22px 27px 22px}.route-map{min-height:190px;margin:11px 0 9px}.experiment{gap:17px}.case-slip{min-height:58px}.drawer-label b{font-size:19px}.incoming{padding-bottom:10px}.incoming strong{font-size:17px}.map-foot{padding-top:8px;font-size:9px}}
@media(min-width:901px) and (max-width:1100px){.experiment{grid-template-columns:minmax(0,1fr) 230px;gap:14px}.route-sheet{padding-left:24px;padding-right:24px}.case-slip{font-size:10px;padding-left:9px;padding-right:9px}}
@media(max-width:900px){.notebook:before{bottom:0}.pages{bottom:48px}.experiment{display:flex;gap:20px}.route-sheet{padding:25px 18px 22px;min-height:420px}.route-map{min-height:280px;margin:16px 0 12px}}
/* Reserve a visible substrate band below both pages, rather than filling the tray to its rim. */
@media(min-width:901px){.pages{bottom:84px}.results-column{margin-bottom:0}}
@media(min-width:901px) and (max-height:790px){.pages{bottom:74px}.overview-heading{min-height:64px}.overview-heading .title-plaque{height:64px}}
@media(max-width:900px){.pages{bottom:84px}}
@media(min-width:901px) and (max-height:790px){.route-map .say,.route-map .rule{top:21%}.route-map .direct{top:20%}}
@media(min-width:901px) and (max-height:790px){.route-map .station i{width:64px;height:64px}.route-map .model{top:78%}}
/* Return belongs to the outer navigation; title and chapter controls share the tray's header row. */
@media(min-width:901px){.atelier>.project-heading{left:3.8%;top:22px}.pages{top:120px}.overview-heading{min-height:81px;padding:0}.atelier .chapter-rail,.atelier .notebook:has(#overview.on) .chapter-rail{top:130px}#flow{padding-top:24px}.overview-poster{gap:22px}.experiment{gap:24px}}
@media(min-width:901px) and (max-height:790px){.atelier>.project-heading{top:12px}.pages{top:104px}.overview-heading{min-height:64px}.atelier .chapter-rail,.atelier .notebook:has(#overview.on) .chapter-rail{top:108px}#flow{padding-top:16px}.overview-poster{gap:17px}.experiment{gap:19px}}
@media(min-width:901px) and (max-width:1100px){.overview-poster{gap:13px}.experiment{gap:16px}}
@media(max-width:900px){.atelier>.project-heading{left:5.5%;top:78px}.project-heading .return-link{width:60px;height:44px}.notebook:before{top:80px}.overview-heading{padding:0}.experiment{gap:22px}}
/* One clay pagination base is visually distinct from the separate question bubbles. */
.chapter-rail nav{position:relative;align-items:stretch;gap:4px;height:100%;padding:7px 13px;background:#536d7b url('../assets/customer-common-clay-v3.fast.webp') left bottom/1600px 900px no-repeat;background-blend-mode:multiply;border:1px solid #577080;border-bottom-color:#233e4b;border-radius:9px 12px 8px 10px;box-shadow:inset 0 1px 1px #a1b2b177,0 3px 0 #2b4655,0 5px 8px #593d2525}
.chapter-rail nav:before,.chapter-rail nav:after{content:'';position:absolute;top:50%;width:4px;height:4px;border-radius:50%;background:#baa06e;box-shadow:inset 0 1px #f4dfad,0 1px 1px #122b37;transform:translateY(-50%)}
.chapter-rail nav:before{left:5px}.chapter-rail nav:after{right:5px}
.chapter-rail .chapter{position:relative;height:auto;min-height:44px;flex:1;gap:10px;padding:8px 11px;background:transparent;border:1px solid transparent;border-radius:4px 6px 5px 4px;box-shadow:none;color:#d8d4bf;font:500 13px/1.5 var(--text);transition:color .15s ease,background-color .15s ease;transform:none}
.chapter-rail .chapter:before{content:'01';font:500 10px/1 var(--text);letter-spacing:.03em;color:#b5ac93}
.chapter-rail .chapter[data-page='flow']:before{content:'02'}
.chapter-rail .chapter .tab-icon{display:none}
.chapter-rail .chapter b{font-weight:600}
.chapter-rail .chapter.on{background:#ead6b3 url('../assets/customer-common-clay-v3.fast.webp') 45% 27%/2300px 1400px no-repeat;background-blend-mode:multiply;border-color:#f5e7cc;border-bottom-color:#b29a75;color:#354b53;box-shadow:inset 0 1px 1px #fff6df,0 2px 2px #162e3a55}
.chapter-rail .chapter.on:before{color:#907248}
.chapter-rail .chapter.on:after{display:none}
.chapter-rail .chapter:hover{color:#fff0d4;transform:none;background-color:#9aa79422}
.chapter-rail .chapter.on:hover{color:#273e48;background-color:#efddbd}
.case-slips{padding-top:16px}.case-slip{position:relative}
.case-slip:after{content:'';position:absolute;left:22px;bottom:5px;width:11px;height:9px;background:#ead5b4;clip-path:polygon(0 0,100% 0,0 100%);pointer-events:none}
.case-slip.on:after{background:#435a65}
@media(max-width:900px){.chapter-rail .chapter{height:auto;font-size:13px;padding:8px 7px;gap:8px}.chapter-rail nav{padding:7px 12px}}
@media(prefers-reduced-motion:reduce){.chapter-rail .chapter{transition:none}}
