html{scroll-padding-top:95px}body{background:#fff;color:#171717;font-family:Arial,"Helvetica Neue","Microsoft YaHei","PingFang SC",sans-serif}p{font-size:15px;line-height:1.8;letter-spacing:0;color:#494949;margin-bottom:22px}h1,h2,h3,h4{color:#161616;font-weight:500;letter-spacing:-.025em}h2{font-size:32px;line-height:1.35}h3{font-size:24px;line-height:1.5}h4{font-size:18px;line-height:1.5}strong{font-weight:600}.site-header{position:fixed;top:0;left:0;right:0;height:64px;display:flex;align-items:center;justify-content:space-between;padding:0 3.8%;background:#ffffffec;backdrop-filter:blur(12px);z-index:30;font-size:14px}.portfolio-name{font-size:16px}.portfolio-name span{font-size:12px;color:#888;margin-left:20px}.site-header>a:last-child{font-size:13px}.case-width{width:81%;max-width:1120px;margin:auto}.case-opening{padding-top:185px}.pills{margin-bottom:22px;gap:7px}.pills span{font-size:9px;padding:4px 8px;letter-spacing:.025em;border:1px solid #666;color:#202020;border-radius:30px;line-height:1.4}.case-opening h1{font-size:48px;line-height:1.2;margin-bottom:29px;letter-spacing:-.04em}.opening-body{max-width:760px}.opening-body p{font-size:16px;line-height:1.8;color:#333;margin-bottom:20px}.project-links{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin:38px 0 40px}.project-links>a{display:flex;gap:18px;align-items:center;background:#f6f6f7;border-radius:13px;padding:11px;min-height:104px}.project-links img{width:135px;height:80px;object-fit:cover;border-radius:8px;border:1px solid #e8e8e9}.project-links strong{display:block;font-size:14px;margin-bottom:7px;font-weight:600}.project-links span{font-size:12px;color:#8b8b8d;line-height:1.6;display:block}.project-links b{font-size:15px;margin-left:auto;margin-right:10px;font-weight:400;color:#888}.chapter-nav{position:static;display:flex;flex-direction:row;align-items:center;gap:0;padding:0;margin:0 0 115px;border:0;background:none;overflow-x:auto;scrollbar-width:none}.chapter-nav a{border:0;border-right:1px solid #dedede;border-radius:0;padding:0 20px;font-size:12px;color:#333;white-space:nowrap;line-height:1.2}.chapter-nav a:first-child{padding-left:0}.chapter-nav a:last-child{border-right:0}.chapter-nav a.active,.chapter-nav a:hover{color:#161616;text-decoration:underline;text-underline-offset:6px;background:none}.progress{background:#242424;height:1px}.chapter{padding:0 0 120px;border:0;margin:0}.chapter-heading{margin-bottom:28px}.chapter-heading h2{margin-bottom:22px}.chapter-heading p{max-width:800px;font-size:16px;color:#555;line-height:1.85}.figure{margin:28px 0}.figure .zoom{border-radius:13px;background:#f6f6f7;border:1px solid #eeeeef}.zoom img{width:100%;height:auto}.zoom-hint{width:29px;height:29px;color:#444;background:#fff;border:1px solid #eee;font-size:15px}.figure figcaption{font-size:10px;color:#939393;padding-top:10px}.figure figcaption span{font-size:9px}.main-product{margin-top:0}.main-product .zoom{border:0}.evolution{margin-top:110px;margin-bottom:130px}.evolution>h3{margin-bottom:28px}.evolution-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:38px}.evolution-grid .figure{margin:0 0 18px}.evolution-grid .zoom{padding:11px;background:linear-gradient(135deg,#dbe1dd,#eee3d9 65%,#dec8ac);border:0;border-radius:13px}.evolution-grid>div:nth-child(2) .zoom{background:linear-gradient(135deg,#e0dfd0,#cec9c0 60%,#b8b0af)}.evolution-grid>div:nth-child(3) .zoom{background:linear-gradient(135deg,#d2dcd8,#ddd9dc 65%,#e5cda8)}.evolution-grid .zoom img{border-radius:6px;aspect-ratio:1.48;object-fit:cover;object-position:top}.evolution-grid figcaption{display:none}.evolution h4{font-size:17px;font-weight:600;letter-spacing:-.015em;margin:0 0 10px;display:flex;gap:8px;align-items:center}.evolution h4 i{font-style:normal;color:#fff;background:#111;border-radius:50%;width:21px;height:21px;display:grid;place-items:center;font-size:12px;flex-shrink:0}.evolution-grid p{font-size:13px;color:#8b8b8b;line-height:1.85;margin:0}.evolution>small{font-size:10px;color:#aaa;display:block;margin-top:22px}.editorial-split{display:grid;grid-template-columns:1fr 1fr;gap:7%;align-items:center;margin:85px 0}.editorial-text h3{margin-bottom:24px}.editorial-text p{font-size:15px;line-height:1.85;color:#4c4c4c}.editorial-text ul{padding-left:18px;margin:27px 0 0;font-size:14px;line-height:2.2;color:#444}.editorial-text li{padding-left:3px}.editorial-image{min-width:0}.editorial-image .figure{margin:0}.editorial-split.reverse .editorial-text{order:2}.editorial-split.reverse .editorial-image{order:1}.architecture-art{background:linear-gradient(140deg,#a5ada4,#ded1c8 55%,#e4c38e);padding:30px;border-radius:14px;min-height:360px;display:flex;flex-direction:column;justify-content:center}.art-label{font-size:9px;letter-spacing:.1em;margin-bottom:20px;color:#444d45}.workspace-map{background:#fff;border-radius:11px;padding:14px;display:flex;gap:8px;min-height:215px;box-shadow:0 7px 30px #37352b0d}.map-nav{width:16%;background:#dedfdc;display:flex;align-items:center;justify-content:center;font-size:10px;color:#687267;line-height:1.8}.map-center{width:57%;display:flex;flex-direction:column;gap:8px}.map-canvas{flex:1;background:#bbc7c0;display:flex;flex-direction:column;justify-content:center;gap:20px;align-items:center;font-size:13px;color:#41564b}.map-output{height:45px;background:#d5bc90;display:grid;place-items:center;font-size:11px;color:#6d5936}.map-panel{flex:1;background:#c8c3cf;font-size:11px;display:flex;align-items:center;justify-content:center;text-align:center;line-height:1.9;color:#6b5b77}.map-nodes{display:flex;align-items:center}.map-nodes i{height:13px;width:24px;background:#fff;border:1px solid #7b978a;border-radius:3px}.map-nodes em{height:1px;width:12px;background:#7b978a}.architecture-art>small{font-size:10px;margin-top:19px;color:#655c50;line-height:1.8}.mental-model{margin:100px 0}.mental-model>h3{margin-bottom:24px}.mental-model>p{max-width:950px}.model-strip{display:flex;align-items:center;gap:20px;margin-top:38px;background:#f3f4f5;padding:18px 20px;border-radius:12px}.model-strip>div{flex:1;border:1px solid #999;border-radius:10px;padding:20px;text-align:center;background:#fff}.model-strip>div:first-child,.model-strip>div:last-child{background:#171717;border-color:#171717;color:white}.model-strip span{display:block;font-size:10px;opacity:.6;margin-bottom:10px}.model-strip strong{font-size:15px;font-weight:400}.model-strip b{font-weight:400;font-size:15px;color:#8d8d8d}.panel-art{aspect-ratio:1.35;display:flex;gap:12px;background:linear-gradient(135deg,#e1ded9,#e8ddcf 65%,#d2bb9c);padding:50px 28px;border-radius:14px}.panel-art-nav{width:18%;background:#bcbdbd}.panel-art-center{width:53%;display:flex;flex-direction:column;gap:10px}.panel-art-center>div:first-child{background:#c8c9cb;flex:1}.panel-art-center>div:last-child{background:#809789;height:24%}.panel-art-side{flex:1;background:#b5a5c3}.canvas-tour{padding:0;background:transparent;border:0;margin:60px 0 115px}.tour-image{position:relative;background:#f5f5f6;border-radius:13px;overflow:hidden}.tour-image>img{width:100%;height:auto}.tour-outline{position:absolute;border:2px solid #7c54c3;background:#9263de0a;border-radius:7px;pointer-events:none;transition:all .2s}.tour-outline span{position:absolute;top:9px;left:9px;background:#7650b4;color:#fff;padding:6px 10px;border-radius:5px;font-size:10px}.tour-outline[data-area=canvas]{left:18%;top:8%;width:54%;height:66%}.tour-outline[data-area=panel]{left:73%;top:2%;width:26%;height:96%}.tour-outline[data-area=output]{left:18%;top:75%;width:54%;height:23%}.tour-outline[data-area=navigation]{left:0;top:0;width:17%;height:100%}.tour-controls{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:25px}.tour-controls button{padding:12px 4px;text-align:left;border:0;border-bottom:2px solid #dedede;background:none;color:#999;font-size:14px;border-radius:0}.tour-controls button[aria-pressed=true]{border-color:#111;color:#111}.canvas-tour>p{font-size:14px;margin:20px 0 8px;color:#555}.canvas-tour>small{font-size:10px;color:#aaa}.canvas-decisions{margin-top:100px}.canvas-decisions h3{margin-bottom:22px}.canvas-decisions>p{max-width:780px}.config-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:38px;margin:75px 0 120px}.config-gallery .figure{margin:0 0 23px;background:#f5f5f6;padding:20px 20px 0;border-radius:13px}.config-gallery .zoom{height:360px;border-radius:8px 8px 0 0;overflow:hidden;border:0}.config-gallery .zoom img{height:auto;min-height:360px;object-fit:cover;object-position:top}.config-gallery figcaption{display:none}.config-gallery h4{font-size:19px;margin-bottom:12px}.config-gallery p{font-size:13px;color:#888;line-height:1.85}.source-details{border-color:#e7e7e7;margin:35px 0 60px}.source-details summary{font-size:12px;color:#777;padding:20px 0}.source-details .figure{max-width:none}.state-intro{margin-top:90px}.state-intro h3{margin-bottom:22px}.state-intro p{max-width:800px}.state-sheet{margin-top:35px}.state-explanations,.block-principles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:38px;margin:32px 0 0}.state-explanations h4,.block-principles h4{font-size:17px;margin-bottom:12px}.state-explanations p,.block-principles p{font-size:13px;color:#888;line-height:1.85}.agent-preview{max-width:330px;margin:auto!important}.agent-preview .zoom{padding:20px;background:#f3f3f4;border:0}.agent-preview figcaption{display:none}.compact-preview{padding:50px 45px;background:linear-gradient(135deg,#dce1df,#e7e0e7 70%,#ded4ca);border-radius:13px}.compact-preview .zoom{border-radius:12px;border:0}.compact-preview figcaption{display:none}.demo-title{margin:90px 0 20px}.demo-lead{max-width:820px}.block-demo{margin:35px 0 40px;border-color:#e5e1e9;background:#faf9fc}.demo-header{background:#faf9fc}.demo-header .mini-label{color:#888;letter-spacing:.04em}.demo-stage{height:420px}.demo-block{width:480px}.mock-node strong{font-weight:500}.block-principles{margin-top:45px}.editor-note{font-size:13px;color:#888;border-left:2px solid #ddd;padding-left:20px;line-height:1.9;margin-top:40px}.field-map{margin-top:30px}.field-map>div{display:flex;gap:18px;align-items:baseline;border-top:1px solid #e8e8e8;padding:14px 0;font-size:12px}.field-map b{width:95px;flex-shrink:0;font-weight:500}.field-map span{color:#888;line-height:1.7}.input-preview{padding:26px 45px 0;background:#f5f5f6;border-radius:13px}.input-preview .zoom{max-height:560px;border-radius:8px 8px 0 0}.input-preview figcaption{padding-bottom:16px}.appview-hero .zoom{border:0}.result-notes{display:grid;grid-template-columns:1fr 1fr;gap:7%;margin:70px 0 50px}.result-notes h3{font-size:23px;margin-bottom:22px}.result-notes p{font-size:15px;line-height:1.85}.mobile-heading{margin:100px 0 40px}.mobile-heading h3{margin-bottom:22px}.mobile-heading p{max-width:790px}.phone-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:55px;padding:40px 65px 25px;border-radius:14px;background:#f5f5f6}.phone-gallery .figure{margin:0}.phone-gallery .zoom{border-radius:24px;border-color:#e2e2e3}.phone-gallery figcaption span{display:none}.takeaways{margin-top:45px}.takeaways>div{position:relative;margin-bottom:45px;padding-left:40px;max-width:950px}.takeaways>div>span{position:absolute;left:0;top:3px;width:23px;height:23px;display:grid;place-items:center;background:#111;color:white;border-radius:50%;font-size:12px}.takeaways h3{font-size:23px;margin-bottom:15px}.takeaways p{font-size:15px;line-height:1.85}.evidence-note{font-size:11px;color:#999;max-width:900px;margin-top:60px;line-height:1.9}.history>p{font-size:12px;padding-top:15px}.history>a{display:inline-block;margin-right:25px;font-size:11px;color:#777;margin-bottom:24px}.case-footer{max-width:none;width:100%;padding:35px 9.5%;border-top:1px solid #eee;font-size:12px;color:#777}.back-top{position:fixed;right:32px;bottom:25px;background:#f2f2f2ed;border:1px solid #e7e7e7;border-radius:30px;padding:12px 18px;font-size:12px;z-index:15}.lightbox-bar p{color:#555}.lightbox-scroll{background:#f5f5f6}
@media(min-width:1500px){.case-opening{padding-top:190px}.case-width{max-width:1120px}}@media(max-width:1000px){.case-width{width:84%}.case-opening{padding-top:150px}.project-links{gap:18px}.project-links img{width:100px;height:72px}.project-links>a{gap:12px}.project-links strong{font-size:12px}.project-links span{font-size:10px}.chapter-nav a{padding:0 13px;font-size:11px}.editorial-split{gap:5%}.evolution-grid,.config-gallery,.state-explanations,.block-principles{gap:25px}.architecture-art{padding:22px;min-height:300px}.workspace-map{min-height:190px;padding:10px;gap:6px}.editorial-text p{font-size:14px}.phone-gallery{gap:35px;padding:30px 40px 20px}.config-gallery .figure{padding:15px 15px 0}.config-gallery .zoom{height:290px}.config-gallery .zoom img{min-height:290px}.tour-controls button{font-size:12px}.field-map>div{display:block}.field-map b{display:block;margin-bottom:7px}.compact-preview{padding:35px}.demo-block{max-width:420px}}
@media(max-width:700px){.case-width{width:86%}.site-header{height:60px;padding:0 7%}.portfolio-name{font-size:13px}.portfolio-name span{font-size:10px;margin-left:12px}.site-header>a:last-child{font-size:11px}.case-opening{padding-top:125px}.case-opening h1{font-size:40px;margin-bottom:25px}.opening-body p{font-size:14px;line-height:1.95}.project-links{grid-template-columns:1fr;gap:12px;margin:30px 0}.project-links>a{min-height:85px}.project-links img{width:110px;height:65px}.project-links strong{font-size:13px}.project-links span{font-size:11px}.chapter-nav{position:static;display:flex;margin:0 0 75px;padding:0 0 8px;background:none;backdrop-filter:none;overflow-x:auto;gap:0;border:0}.chapter-nav a{font-size:10px;padding:0 12px;flex-shrink:0}.chapter-nav a.active{background:none}.chapter{padding:0 0 85px;margin:0;border:0}h2{font-size:29px}h3{font-size:22px}h4{font-size:17px}.chapter-heading{margin-bottom:23px}.chapter-heading p{font-size:14px;line-height:1.95}.figure{margin:23px 0}.figure .zoom{border-radius:10px}.figure figcaption{font-size:9px;padding-top:9px;line-height:1.8}.figure figcaption span{display:none}.evolution{margin:65px 0 75px}.evolution-grid{grid-template-columns:1fr;gap:32px}.evolution-grid .zoom img{aspect-ratio:1.6}.evolution-grid .figure{margin-bottom:15px}.evolution h4{font-size:17px}.evolution-grid p{font-size:13px}.evolution>small{font-size:9px;line-height:1.9}.editorial-split{grid-template-columns:1fr;gap:25px;margin:60px 0}.editorial-split.reverse .editorial-text{order:0}.editorial-split.reverse .editorial-image{order:0}.editorial-text h3{font-size:22px;margin-bottom:19px}.editorial-text p{font-size:14px;line-height:1.95}.editorial-text ul{font-size:13px;line-height:2.1;margin-top:23px}.architecture-art{min-height:310px;padding:27px}.workspace-map{min-height:190px}.mental-model{margin:65px 0}.mental-model p{font-size:14px;line-height:1.95}.model-strip{padding:11px;gap:9px;border-radius:10px;margin-top:28px}.model-strip>div{padding:15px 5px;border-radius:7px}.model-strip span{font-size:8px}.model-strip strong{font-size:10px}.model-strip b{font-size:10px}.panel-art{aspect-ratio:1.6;padding:28px}.canvas-tour{margin:40px 0 70px}.tour-outline span{font-size:8px;padding:4px 7px;top:4px;left:4px}.tour-controls{gap:10px;grid-template-columns:1fr 1fr;margin-top:15px}.tour-controls button{font-size:11px;padding:10px 2px}.canvas-tour>p{font-size:12px;margin-top:17px}.canvas-tour>small{font-size:9px;line-height:1.8}.canvas-decisions{margin-top:65px}.canvas-decisions>p{font-size:14px}.config-gallery{grid-template-columns:1fr;gap:35px;margin:55px 0 75px}.config-gallery>div{display:grid;grid-template-columns:45% 1fr;gap:0 23px;align-items:start}.config-gallery .figure{grid-row:1/3;padding:12px 12px 0;margin:0}.config-gallery .zoom{height:250px}.config-gallery .zoom img{min-height:250px}.config-gallery h4{font-size:18px;margin:12px 0 15px}.config-gallery p{font-size:12px;line-height:1.9}.state-intro{margin-top:60px}.state-intro p{font-size:14px;line-height:1.95}.state-explanations,.block-principles{grid-template-columns:1fr;gap:20px;margin-top:25px}.state-explanations p,.block-principles p{font-size:13px;line-height:1.9;margin-bottom:0}.state-explanations h4,.block-principles h4{font-size:17px;margin-bottom:10px}.source-details{margin:28px 0 45px}.source-details summary{font-size:11px;padding:17px 0}.agent-preview{max-width:285px}.compact-preview{padding:35px;max-width:350px;margin:auto!important}.demo-title{margin-top:65px}.demo-lead{font-size:14px;line-height:1.95}.block-demo{margin:25px -3% 30px}.demo-header{padding:15px 12px}.demo-stage{height:330px}.demo-block{width:100%;max-width:325px}.editor-note{font-size:12px}.field-map>div{display:flex}.field-map b{width:90px;font-size:12px}.field-map span{font-size:11px}.input-preview{max-width:300px;margin:auto!important;padding:22px 40px 0}.input-preview .zoom{max-height:480px}.result-notes{grid-template-columns:1fr;gap:20px;margin:35px 0}.result-notes h3{font-size:21px;margin-bottom:18px}.result-notes p{font-size:14px;line-height:1.95}.mobile-heading{margin:65px 0 28px}.mobile-heading p{font-size:14px;line-height:1.95}.phone-gallery{padding:20px 15px 10px;gap:14px}.phone-gallery .zoom{border-radius:14px}.phone-gallery figcaption{font-size:8px}.takeaways>div{padding-left:32px;margin-bottom:30px}.takeaways>div>span{width:21px;height:21px;font-size:11px}.takeaways h3{font-size:20px;margin-bottom:15px}.takeaways p{font-size:14px;line-height:1.95}.evidence-note{font-size:10px;margin-top:45px}.case-footer{font-size:10px;padding:27px 7% 80px}.back-top{right:17px;bottom:17px;font-size:10px;padding:10px 14px}}
@media(prefers-reduced-motion:reduce){.tour-outline{transition:none}}

/* Nodie: an iterative task-building process. */
.task-cycle>div,.task-cycle>div:first-child,.task-cycle>div:last-child{background:#fff;color:#171717;border-color:#ddd}
.task-cycle>div:nth-of-type(2){border-color:#8d70c1;background:#f5f1fc}
.task-cycle span{font-size:13px;opacity:1;color:#666}
.task-cycle strong{font-size:14px}
.mental-model .cycle-caption{font-size:12px;color:#777;margin:14px 0 30px;line-height:1.8}
@media(max-width:600px){.task-cycle{flex-direction:column;gap:10px;padding:16px}.task-cycle>div{width:100%;padding:16px}.task-cycle>b{transform:rotate(90deg);line-height:1}.task-cycle span{margin-bottom:7px}}


/* Readable problem and requirement section, with a minimum usable column width. */
.requirements-stacked{margin:85px 0 110px;scroll-margin-top:95px}
.requirements-intro{width:100%;max-width:none;margin-bottom:40px}
.requirements-intro h3{font-size:28px;line-height:1.45;letter-spacing:0;margin:0 0 28px}
.requirements-intro p{font-size:17px;line-height:1.95;letter-spacing:0;color:#414141;margin:0 0 22px}
.requirements-intro p:last-child{margin-bottom:0}
.requirements-art{background:#f6f6f7;border-radius:16px;padding:32px}
.requirements-label{display:block;font-size:14px;line-height:1.6;color:#555;margin-bottom:28px}
.requirements-horizontal ol{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:40px;row-gap:32px;margin:0;padding:0;counter-reset:requirement}
.requirements-horizontal li{position:relative;padding:29px 0 0;counter-increment:requirement;border-top:1px solid #dcdce2}
.requirements-horizontal li:before{content:counter(requirement,decimal-leading-zero);position:absolute;left:0;top:11px;font-size:12px;line-height:1;color:#7353a3;font-weight:600}
.requirements-horizontal li>span{display:block;font-size:13px;line-height:1.7;color:#707075;margin:12px 0 10px}
.requirements-horizontal h4{font-size:20px;line-height:1.6;letter-spacing:0;font-weight:500;color:#202020;margin:0 0 12px;text-wrap:pretty}
.requirements-horizontal p{font-size:15px;line-height:1.9;letter-spacing:0;color:#505055;margin:0}
@media(min-width:1360px){.requirements-horizontal ol{grid-template-columns:repeat(4,minmax(0,1fr));gap:30px}.requirements-horizontal h4{font-size:19px;min-height:61px}.requirements-horizontal li>span{min-height:44px}}
@media(max-width:640px){.requirements-stacked{margin:55px 0 75px}.requirements-intro{margin-bottom:30px}.requirements-intro h3{font-size:25px;margin-bottom:23px}.requirements-intro p{font-size:16px;line-height:1.95;margin-bottom:20px}.requirements-art{padding:26px 23px;border-radius:12px}.requirements-label{font-size:14px;margin-bottom:24px}.requirements-horizontal ol{grid-template-columns:1fr;gap:28px}.requirements-horizontal h4{font-size:19px;margin-bottom:10px}.requirements-horizontal p{font-size:15px;line-height:1.9}.requirements-horizontal li>span{font-size:13px}}

/* Reference-inspired journey strip, retaining Nodie's iterative model. */
.task-journey{margin-top:38px;background:#f1f4f5;padding:16px 18px 18px;border-radius:14px}
.task-journey-line{display:flex;align-items:center;gap:20px;margin:0 3px 18px;color:#171717}
.task-journey-line b{font-size:13px;font-weight:400;letter-spacing:.12em;white-space:nowrap}
.task-journey-line>span{position:relative;height:1px;background:#171717;flex:1}
.task-journey-line>span:first-child:before,.task-journey-line>span:last-child:after{content:"";position:absolute;top:-4px;width:8px;height:8px;border-top:1.5px solid #171717}
.task-journey-line>span:first-child:before{left:0;border-left:1.5px solid #171717;transform:rotate(-45deg)}
.task-journey-line>span:last-child:after{right:0;border-right:1.5px solid #171717;transform:rotate(45deg)}
.task-journey-stages{display:grid;grid-template-columns:1fr 2fr 1fr;gap:12px}
.task-journey-stages>div{padding:15px 10px;min-height:74px;text-align:center;border:1px solid #171717;border-radius:11px;display:flex;flex-direction:column;justify-content:center;gap:7px;background:#050505;color:white}
.task-journey-stages>div:nth-child(2){background:transparent;color:#171717}
.task-journey-stages span{font-size:14px;line-height:1.4;letter-spacing:.04em}
.task-journey-stages strong{font-size:14px;line-height:1.5;font-weight:400;opacity:.78}
.journey-product{margin:22px 0 34px}
.journey-product .zoom{border:0;background:#f4f4f4;border-radius:13px}
.journey-product img{display:block;width:100%;height:auto}
@media(max-width:640px){.task-journey{padding:14px 10px;border-radius:11px}.task-journey-line{gap:12px;margin-bottom:14px}.task-journey-line b{font-size:12px}.task-journey-stages{grid-template-columns:1fr 1.4fr 1fr;gap:7px}.task-journey-stages>div{padding:12px 7px;border-radius:8px;min-height:90px}.task-journey-stages span{font-size:13px}.task-journey-stages strong{font-size:12px;line-height:1.6}.journey-product{margin:20px 0 28px}}

/* Panel studies: narrow explanations and large annotated product details. */
.panel-system{margin:85px 0 100px;scroll-margin-top:90px}
.panel-system-intro{margin-bottom:65px}
.panel-system-intro h3{font-size:28px;margin-bottom:24px;letter-spacing:0}
.panel-system-intro p{font-size:17px;line-height:1.9;max-width:900px}
.panel-explainer{display:grid;grid-template-columns:26% minmax(0,1fr);gap:48px;align-items:start;margin-bottom:80px}
.panel-explainer:last-child{margin-bottom:0}
.panel-explainer-copy h4{display:flex;align-items:center;gap:12px;font-size:20px;font-weight:600;line-height:1.5;letter-spacing:0;margin:0 0 24px}
.panel-explainer-copy p{font-size:16px;line-height:1.85;color:#454545;margin-bottom:20px}
.panel-location{position:relative;display:inline-block;flex:0 0 48px;width:48px;height:35px;padding:3px;border:1px solid #e4e4e8;border-radius:2px;background:#fff}
.panel-location i{position:absolute;display:block;background:#d9d9dc;border-radius:1px}
.loc-nav{left:3px;top:3px;bottom:3px;width:5px}.loc-canvas{left:10px;top:3px;width:23px;height:20px}.loc-side{right:3px;top:3px;width:8px;bottom:3px}.loc-output{left:10px;bottom:3px;width:23px;height:6px}
.active-canvas .loc-canvas,.active-side .loc-side,.active-output .loc-output{background:#8052f1}
.panel-explainer-media{min-width:0}
.panel-study{margin:0;background:#f5f6f7;border-radius:15px;padding:30px;overflow:hidden}
.panel-study+.panel-study{margin-top:22px}
.panel-study .zoom{display:block;border:1px solid #e7e7ec;border-radius:9px;overflow:hidden;background:#fff}
.panel-study .zoom img{display:block;width:100%;height:auto}
.canvas-study-image,.output-study-image{position:relative}
.canvas-study-zoom{position:relative;width:100%;aspect-ratio:1.18}
.canvas-study-zoom img{position:absolute;max-width:none;width:180%!important;height:auto!important;left:-31%;top:-10%}
.study-pin{position:absolute;display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#9554e8;color:#fff;font-size:11px;font-weight:600;box-shadow:0 0 0 3px #fff;pointer-events:none}
.canvas-pin-1{left:34%;top:30%}.canvas-pin-2{left:48%;top:91%}
.study-annotations{display:grid;grid-template-columns:1fr 1fr;gap:25px;padding-top:25px}
.study-annotations h5,.panel-study h5{font-size:16px;line-height:1.6;font-weight:600;margin:0 0 8px;color:#252525}
.study-annotations h5 b{font-size:12px;color:#9554e8;margin-right:9px}
.study-annotations p,.panel-study p{font-size:14px;line-height:1.8;color:#666;margin:0}
.agent-study{position:relative;padding:30px;min-height:570px}
.agent-study-zoom{width:52%;margin-left:auto}
.agent-study-notes{position:absolute;left:30px;top:30px;bottom:30px;width:36%}
.agent-study-notes>div{position:absolute;left:0;right:0;text-align:right}
.agent-study-notes>div:after{content:"";position:absolute;top:12px;left:calc(100% + 12px);width:22px;border-top:1px solid #bc5ae3}
.agent-study-notes>div:before{content:"";position:absolute;top:9px;left:calc(100% + 32px);width:6px;height:6px;border-radius:50%;background:#bc5ae3}
.note-intent{top:10%}.note-progress{top:44%}.note-followup{top:82%}
.config-study{display:grid;grid-template-columns:1fr 43%;gap:28px;align-items:center}
.config-study-zoom{width:100%}
.study-eyebrow{display:block;font-size:12px;line-height:1.7;color:#777;margin-bottom:14px}
.output-study-zoom{position:relative;width:100%;aspect-ratio:1.46}
.output-study-zoom img{position:absolute;max-width:none;width:239%!important;left:0;top:0;height:auto!important}
.output-pin-1{left:18%;top:5%}.output-pin-2{left:62%;top:24%}
@media(max-width:1000px){.panel-explainer{grid-template-columns:27% minmax(0,1fr);gap:30px}.panel-explainer-copy h4{font-size:17px;gap:10px;align-items:center;flex-direction:row}.panel-explainer-copy p{font-size:15px}.panel-study{padding:24px}.agent-study{min-height:500px}.agent-study-notes{left:24px;top:24px;bottom:24px;width:35%}.agent-study-notes p{font-size:13px}.agent-study-notes h5{font-size:14px}.agent-study-notes>div:after{left:calc(100% + 7px);width:15px}.agent-study-notes>div:before{left:calc(100% + 20px)}.config-study{gap:20px}.study-annotations{gap:20px}.study-annotations p{font-size:13px}}
@media(max-width:700px){.panel-system{margin:60px 0 75px}.panel-system-intro{margin-bottom:38px}.panel-system-intro h3{font-size:25px}.panel-system-intro p{font-size:16px;line-height:1.9}.panel-explainer{grid-template-columns:1fr;gap:22px;margin-bottom:55px}.panel-explainer-copy h4{flex-direction:row;align-items:center;font-size:20px;margin-bottom:18px}.panel-explainer-copy p{font-size:16px;line-height:1.9;margin-bottom:15px}.panel-study{padding:20px;border-radius:12px}.study-annotations{grid-template-columns:1fr;gap:18px;padding-top:20px}.study-annotations p,.panel-study p{font-size:14px}.agent-study{padding:22px 18px;min-height:420px}.agent-study-notes{left:18px;top:22px;bottom:22px;width:36%}.agent-study-notes p{font-size:12px;line-height:1.7}.agent-study-notes h5{font-size:13px}.agent-study-zoom{width:51%}.config-study{gap:18px;grid-template-columns:1fr 44%}.config-study h5{font-size:15px}.config-study p{font-size:13px}.study-eyebrow{font-size:11px}.note-followup{top:77%}}

.config-study>figcaption{display:block;min-width:0;text-align:left}.config-study>figcaption h5{display:block;width:auto}.panel-system .zoom-hint{z-index:2}
@media(max-width:700px){.agent-study{display:flex;flex-direction:column;min-height:0;padding:24px}.agent-study-zoom{width:85%;max-width:260px;margin:0 auto}.agent-study-notes{position:static;width:auto;order:2;display:grid;gap:20px;margin-top:25px}.agent-study-notes>div{position:static;text-align:left}.agent-study-notes>div:before,.agent-study-notes>div:after{display:none}.agent-study-notes h5{font-size:15px}.agent-study-notes p{font-size:14px;line-height:1.8}.config-study{grid-template-columns:1fr;gap:22px}.config-study-zoom{width:75%;max-width:220px;margin:auto}.config-study h5{font-size:17px}.config-study p{font-size:14px}}
@media(min-width:701px){.panel-explainer-copy{position:sticky;top:100px;align-self:start}}

/* Whole-workspace solution before the individual panel studies. */
.panel-solution{display:grid;grid-template-columns:1fr 1fr;gap:7%;align-items:center;margin-bottom:75px}
.panel-solution-copy h3{font-size:27px;line-height:1.5;letter-spacing:0;margin:0 0 24px}
.panel-solution-copy p{font-size:16px;line-height:1.9;color:#444;margin:0 0 22px}
.panel-solution-copy p:last-child{margin-bottom:0}
.panel-solution-visual{aspect-ratio:1.55;display:flex;align-items:center;justify-content:center;border-radius:16px;padding:13%;background:radial-gradient(ellipse at 90% 95%,#d6b782 0,transparent 53%),radial-gradient(ellipse at 15% 0%,#9ba99c 0,transparent 58%),linear-gradient(135deg,#d5c5b8,#ead3c9 63%,#dbc1a6)}
.workspace-schematic{position:relative;width:100%;aspect-ratio:1.62;background:#fff;border:1px solid #dedee2;border-radius:9px;box-sizing:border-box}
.workspace-schematic i{position:absolute;display:flex;align-items:center;justify-content:center;font-style:normal;background:#d8d8da;border-radius:2px;color:#666;font-size:11px;line-height:1.5;text-align:center}
.scheme-navigation{left:4%;top:6%;width:14%;height:88%}
.scheme-canvas{left:22%;top:6%;width:51%;height:63%}
.scheme-side{right:4%;top:6%;width:19%;height:88%}
.scheme-output{left:22%;bottom:6%;width:51%;height:19%}
.panel-task-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:34px}
.panel-task-grid .workspace-schematic{margin-bottom:23px}
.panel-task-grid h4{font-size:19px;line-height:1.5;letter-spacing:0;font-weight:500;margin:0 0 12px}
.panel-task-grid p{font-size:15px;line-height:1.85;color:#777;margin:0}
.focus-generation .scheme-canvas,.focus-generation .scheme-side,.focus-configuration .scheme-canvas,.focus-configuration .scheme-side,.focus-verification .scheme-canvas,.focus-verification .scheme-output{background:#8153ed}
.focus-generation .scheme-side{box-shadow:inset 0 0 0 2px #6640c4}
.focus-configuration .scheme-side{box-shadow:inset 0 0 0 2px #6640c4}
.panel-task-note{font-size:12px;color:#888;margin:22px 0 80px;line-height:1.7}
@media(max-width:1100px){.panel-solution{gap:40px;align-items:start;margin-bottom:55px}.panel-solution-copy h3{font-size:25px}.panel-solution-copy p{font-size:16px}.panel-solution-visual{margin-top:6px;padding:12%;aspect-ratio:1.3}.panel-solution-visual .workspace-schematic i{font-size:9px}.panel-task-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}.panel-task-grid .workspace-schematic{max-width:300px}.panel-task-grid h4{font-size:19px}.panel-task-grid p{font-size:15px}}
@media(max-width:700px){.panel-solution{grid-template-columns:1fr;gap:25px;margin-bottom:40px}.panel-solution-visual{padding:13%;aspect-ratio:1.55}.panel-solution-visual .workspace-schematic i{font-size:10px}.panel-task-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 22px}.panel-task-grid .workspace-schematic{margin-bottom:16px}.panel-task-grid h4{font-size:17px;margin-bottom:10px}.panel-task-grid p{font-size:14px;line-height:1.85}.panel-task-note{margin:24px 0 55px}}

/* Source-backed dialogue interaction study, Figma 3684:29253. */
.chat-panel-study{scroll-margin-top:95px}
.chat-evidence-stack .zoom img{display:block;width:100%;height:auto}
.chat-chronicle{position:relative;display:flex;justify-content:flex-end;padding:26px}
.chat-chronicle-zoom{position:relative;width:58%;aspect-ratio:.36;background:transparent!important;border:0!important;border-radius:11px}
.chat-chronicle-zoom img{position:absolute;top:0;left:0;width:100%;max-width:none;height:auto}
.chat-chronicle-notes{position:absolute;left:26px;top:26px;bottom:50px;width:31%;text-align:right}
.chat-chronicle-notes>div{position:absolute;left:0;right:0}
.chat-chronicle-notes>div:nth-child(1){top:9%}.chat-chronicle-notes>div:nth-child(2){top:43%}.chat-chronicle-notes>div:nth-child(3){top:70%}
.chat-chronicle-notes>div:after{content:"";position:absolute;top:12px;left:calc(100% + 12px);width:22px;border-top:1px solid #bc5ae3}
.chat-chronicle-notes>div:before{content:"";position:absolute;top:9px;left:calc(100% + 32px);width:6px;height:6px;border-radius:50%;background:#bc5ae3}
.chat-chronicle>figcaption{position:absolute;left:26px;right:26px;bottom:14px;display:block;font-size:11px;line-height:1.6;color:#777}
.chat-chronicle h5{font-size:15px}.chat-chronicle p{font-size:13px;line-height:1.85}
.chat-detail-group{margin-top:45px}
.chat-detail-group>h4{font-size:21px;line-height:1.6;letter-spacing:0;margin:0 0 17px;font-weight:500}
.chat-detail-group>p{font-size:15px;line-height:1.9;margin:0 0 24px;color:#505055}
.chat-neutral-surface{background:#f5f6f7;border-radius:14px;padding:26px}
.chat-two-up{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;align-items:start}
.chat-state-figure{margin:0;min-width:0}
.chat-state-figure .zoom{display:block;width:100%;border:0;background:transparent;border-radius:8px;overflow:hidden}
.chat-state-figure figcaption{display:block;padding:15px 0 0}
.chat-state-figure figcaption h5{font-size:16px;line-height:1.7;margin:0 0 9px;font-weight:500;color:#26232d}
.chat-state-figure figcaption p{font-size:14px;line-height:1.85;margin:0;color:#666}
.chat-progress-compact{display:grid;grid-template-columns:1fr;gap:24px;max-width:370px;margin:0 auto 25px}
.chat-expanded-figure{max-width:370px;margin:25px auto 0}
.chat-expanded-figure .zoom{border:0;background:transparent;display:block;width:100%}
.chat-expanded-figure figcaption{display:block;font-size:13px;line-height:1.8;color:#777;padding-top:12px}
.chat-reference-grid{background:#f5f6f7;border-radius:14px;padding:24px}
.chat-reference-composition{min-width:0}
.chat-reference-composition .reference-popup{display:block;width:70%;height:auto;margin:0 auto -44px 6%;position:relative;z-index:1;pointer-events:none}
.chat-reference-composition .zoom{border:0;box-shadow:none;overflow:visible}
.chat-input-exceptions{margin-top:28px}
.chat-auth-list{background:#f5f6f7;border-radius:14px;padding:26px;display:grid;gap:30px}
.chat-auth-list .chat-state-figure{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:24px;align-items:center}
.chat-auth-list .zoom{grid-column:2;grid-row:1;max-width:338px;margin-left:auto}
.chat-auth-list figcaption{grid-column:1;grid-row:1;padding:0}
.chat-source-link{display:inline-block;font-size:13px;color:#7351a6;margin-top:28px;text-decoration:underline;text-underline-offset:4px}
@media(max-width:1000px){.chat-chronicle{padding:22px}.chat-chronicle-notes{left:22px;top:22px;bottom:50px;width:30%}.chat-chronicle h5{font-size:14px}.chat-chronicle p{font-size:13px;line-height:1.8}.chat-chronicle-notes>div:after{left:calc(100% + 6px);width:17px}.chat-chronicle-notes>div:before{left:calc(100% + 21px)}.chat-neutral-surface,.chat-reference-grid,.chat-auth-list{padding:22px}.chat-auth-list .chat-state-figure{grid-template-columns:1fr;gap:12px}.chat-auth-list .zoom,.chat-auth-list figcaption{grid-column:1;grid-row:auto}.chat-auth-list .zoom{margin:0 auto;width:100%}.chat-auth-list figcaption{max-width:338px;width:100%;margin:auto}.chat-two-up{gap:20px}.chat-detail-group>h4{font-size:20px}}
@media(max-width:700px){.chat-chronicle{display:flex;flex-direction:column;padding:22px}.chat-chronicle-zoom{width:90%;max-width:350px;margin:auto;aspect-ratio:.36}.chat-chronicle-notes{position:static;order:2;width:auto;margin-top:25px;text-align:left;display:grid;gap:20px}.chat-chronicle-notes>div{position:static}.chat-chronicle-notes>div:after,.chat-chronicle-notes>div:before{display:none}.chat-chronicle h5{font-size:16px}.chat-chronicle p{font-size:14px}.chat-chronicle>figcaption{position:static;order:3;margin-top:20px;font-size:12px}.chat-two-up{grid-template-columns:1fr;gap:30px}.chat-detail-group{margin-top:35px}.chat-detail-group>h4{font-size:20px}.chat-detail-group>p{font-size:16px;line-height:1.9}.chat-neutral-surface,.chat-reference-grid,.chat-auth-list{padding:22px}.chat-state-figure figcaption h5{font-size:17px}.chat-state-figure figcaption p{font-size:15px}.chat-reference-composition .reference-popup{max-width:240px;width:75%;margin-left:5%}.chat-state-figure .zoom{max-width:404px;margin:auto}.chat-auth-list{gap:35px}}
.chat-search-states .zoom{height:126px;display:flex;align-items:center;justify-content:center}.chat-search-states .zoom img{max-height:126px;object-fit:contain}.chat-reference-composition>.reference-popup-zoom{display:block;width:70%;margin:0 auto -44px 6%;position:relative;z-index:1;overflow:visible;max-width:268px}.chat-reference-composition>.reference-popup-zoom img{display:block;width:100%;height:auto}@media(max-width:700px){.chat-reference-composition>.reference-popup-zoom{width:75%;max-width:240px;margin-left:5%}}
.chat-reference-grid>figure:nth-child(2) .reference-popup-zoom{margin-bottom:-18px}
.chat-reference-composition>.reference-popup-zoom,.chat-reference-grid>figure:nth-child(2) .reference-popup-zoom{margin-bottom:-5px}

/* Output study, grounded in Figma 3677:17583. */
.output-panel-study{scroll-margin-top:95px}
.output-detail-group{margin-top:42px}.output-detail-group:first-child{margin-top:0}
.output-detail-group>h4{font-size:21px;line-height:1.6;letter-spacing:0;margin:0 0 17px;font-weight:500}
.output-detail-group>p{font-size:15px;line-height:1.9;color:#505055;margin:0 0 24px}
.output-neutral-surface{background:#f5f6f7;border-radius:14px;padding:26px;margin:0}
.output-evidence-figure{margin:0}
.output-evidence-figure+.output-evidence-figure{margin-top:30px;padding-top:30px;border-top:1px solid #e2e2e7}
.output-evidence-stack .zoom{display:block;width:100%;border:0;background:transparent;border-radius:9px;overflow:hidden}
.output-evidence-stack .zoom img{display:block;width:100%;height:auto}
.output-evidence-stack figcaption{display:block;padding-top:18px}
.output-evidence-stack h5{font-size:16px;line-height:1.7;letter-spacing:0;font-weight:500;margin:0 0 9px;color:#26232d}
.output-evidence-stack figcaption p{font-size:14px;line-height:1.85;color:#666;margin:0}
.output-content-detail .zoom{position:relative;aspect-ratio:auto}
.output-content-detail .zoom img{position:static;width:100%;height:auto;max-width:100%}
.output-evidence-stack .output-field-notes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px;padding-top:24px}
.output-hover-study{margin-top:22px}
.output-evidence-stack .output-hover-crop{position:relative;aspect-ratio:3.25;border-radius:9px}
.output-evidence-stack .output-hover-crop img{position:absolute;max-width:none;width:346.75%;height:auto;left:-114.2%;top:-53.8%}
.output-source-link{display:inline-block;font-size:13px;line-height:1.8;color:#7351a6;text-decoration:underline;text-underline-offset:4px;margin-top:28px}
@media(max-width:1000px){.output-neutral-surface{padding:22px}.output-detail-group>h4{font-size:20px}.output-evidence-stack .output-field-notes{gap:22px}}
@media(max-width:700px){.output-detail-group{margin-top:34px}.output-detail-group>p{font-size:16px;line-height:1.9}.output-neutral-surface{padding:20px}.output-evidence-stack .output-field-notes{grid-template-columns:1fr;gap:20px}.output-evidence-stack h5{font-size:17px}.output-evidence-stack figcaption p{font-size:15px}.output-evidence-figure+.output-evidence-figure{margin-top:25px;padding-top:25px}}

/* Three matching Figma originals: preserve full panels and a shared scale. */
.config-gallery .figure{padding:18px;margin-bottom:24px}
.config-gallery .zoom{display:block;width:100%;height:auto;overflow:hidden;border-radius:12px}
.config-gallery .zoom img{display:block;width:100%;height:auto;min-height:0;object-fit:contain}
.config-gallery p{color:#666}
@media(max-width:700px){.config-gallery>div{display:block}.config-gallery .figure{max-width:386px;margin:0 auto 22px;padding:16px}.config-gallery h4{margin:0 0 12px}.config-gallery p{font-size:14px}}

/* Preserve the original Block outline without a second image-button surface. */
.compact-preview .zoom{background:transparent;border:0;border-radius:0;overflow:visible;box-shadow:none}
.compact-preview .zoom img{display:block;background:transparent;border-radius:0}

/* Show the same current Input original in Appview without clipping. */
.input-preview .zoom{max-height:none;height:auto;background:transparent;border:0;border-radius:0}
.input-preview .zoom img{display:block;width:100%;height:auto}

/* Schedule evidence: paired originals at a common width, without clipping. */
.schedule-studies{margin:50px 0 0;scroll-margin-top:100px}
.schedule-studies>h3{margin-bottom:32px}
.schedule-study-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px 36px;align-items:start}
.schedule-study h4{font-size:19px;margin:0 0 12px}
.schedule-study>p{font-size:14px;line-height:1.85;color:#666;margin:0 0 22px;min-height:52px}
.schedule-study .figure{margin:0;background:#f5f5f6;border-radius:14px;padding:24px}
.schedule-study .zoom{background:transparent;border:0;border-radius:0;max-height:none}
.schedule-study .zoom img{display:block;width:100%;height:auto}
.schedule-study figcaption{display:flex;justify-content:space-between;gap:12px;padding-top:14px;font-size:10px;color:#888}
@media(max-width:700px){.schedule-study-grid{grid-template-columns:1fr;gap:36px}.schedule-study>p{min-height:0}.schedule-study .figure{padding:18px}.schedule-studies>h3{font-size:22px}}

/* Block switching: original artwork, connected at native canvas coordinates. */
.block-demo.bd-demo{margin:28px 0 36px;border:1px solid #e7e5ec;border-radius:16px;background:#fbfbfc;overflow:hidden;box-shadow:none}
.bd-demo-header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 24px;background:#fff;border-bottom:1px solid #eeecf1}
.bd-demo-header>span{font-size:11px;letter-spacing:.07em;color:#8b8695}
.bd-view-switch{display:flex;gap:4px;background:#f2f0f5;padding:4px;border-radius:10px}
.bd-view-switch button{padding:7px 18px;border:0;border-radius:7px;background:transparent;color:#827b8c;font-size:12px;line-height:1.4;transition:background .2s,color .2s}
.bd-view-switch button[aria-pressed="true"]{background:white;color:#7844e7;box-shadow:0 1px 3px #24143e10}
.bd-stage{width:100%;overflow-x:auto;overscroll-behavior-x:contain}
.bd-canvas{display:block;width:100%;height:auto;min-width:0;overflow:visible}
.bd-wire{fill:none;stroke:#c4c1cc;stroke-width:1.5;stroke-linejoin:round}
.bd-boundary{fill:transparent;stroke:#915eff;stroke-width:2;filter:drop-shadow(0 0 2px #bba0ff);transition:x .36s cubic-bezier(.2,.8,.2,1),y .36s cubic-bezier(.2,.8,.2,1),width .36s cubic-bezier(.2,.8,.2,1),height .36s cubic-bezier(.2,.8,.2,1),opacity .25s}
.bd-block-label{transform:translate(336px,68px);transition:transform .36s cubic-bezier(.2,.8,.2,1)}
.bd-block-label rect{fill:#eee7fb;stroke:#e7dff6;stroke-width:1}
.bd-block-label text{font-family:Arial,'Microsoft YaHei',sans-serif;font-size:16px;font-weight:500;fill:#8750f6}
.bd-expanded-layer,.bd-compact-layer{transition:opacity .2s ease}
.bd-expanded-layer{opacity:1}.bd-compact-layer{opacity:0;pointer-events:none}
.bd-toolbar-position{transition:y .36s cubic-bezier(.2,.8,.2,1)}
.bd-toolbar{display:flex;align-items:center;gap:8px;width:233px;height:40px;padding:4px;background:#050505;border-radius:12px;box-sizing:border-box;box-shadow:0 3px 10px #16101b12}
.bd-toolbar-symbol{display:flex;align-items:center;justify-content:center;flex:0 0 32px;height:32px}
.bd-toolbar img{display:block;max-width:none;flex-shrink:0}
.bd-toolbar-divider{height:16px;border-left:1px solid #494949;flex:0 0 0}
.bd-mode-button{display:flex;align-items:center;justify-content:center;gap:4px;flex:1;height:32px;padding:4px;border:0;border-radius:8px;background:#050505;color:white;font-family:Arial,'Microsoft YaHei',sans-serif;font-size:14px;line-height:24px;white-space:nowrap}
.bd-mode-button:hover{background:#28252d}.bd-mode-button:focus-visible{outline:2px solid #ba9bff;outline-offset:-2px}
.bd-canvas.is-collapsed .bd-boundary{x:448px;y:153.5px;width:304px;height:213px;opacity:0}
.bd-canvas.is-collapsed .bd-block-label{transform:translate(448px,105.5px)}
.bd-canvas.is-collapsed .bd-expanded-layer{opacity:0;pointer-events:none}
.bd-canvas.is-collapsed .bd-compact-layer{opacity:1;pointer-events:auto}
.bd-canvas.is-collapsed .bd-toolbar-position{y:386.5px}
.bd-demo-footer{padding:17px 24px;background:white;border-top:1px solid #eeecf1}
.bd-demo-footer p{margin:0;font-size:12px;line-height:1.8;color:#77717f}
.bd-mobile-hint{display:none}
@media(max-width:700px){.block-demo.bd-demo{margin:24px 0 30px}.bd-demo-header{padding:14px 16px}.bd-demo-header>span{font-size:9px}.bd-view-switch button{padding:6px 12px}.bd-canvas{min-width:880px}.bd-demo-footer{padding:14px 16px}.bd-demo-footer p{font-size:11px}.bd-mobile-hint{display:block;color:#99939f;font-size:10px;margin-top:8px}}
@media(prefers-reduced-motion:reduce){.bd-canvas *{transition:none!important}}

.bd-block-label{transition:transform .36s cubic-bezier(.2,.8,.2,1),opacity .2s}
.bd-canvas.is-collapsed .bd-block-label{opacity:0}
.bd-toolbar-position{opacity:0;transition:y .36s cubic-bezier(.2,.8,.2,1),opacity .16s}
.bd-object:hover .bd-toolbar-position,.bd-object:focus-within .bd-toolbar-position{opacity:1}
@media(hover:none){.bd-toolbar-position{opacity:1}}

/* Brand originals share a visual grid; all five frames remain complete. */
.brand-study{margin:80px 0 0;scroll-margin-top:100px}
.brand-study>h3{margin:0 0 22px}
.brand-study>p{margin:0 0 36px;max-width:800px;font-size:16px;line-height:1.85}
.brand-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px 24px;align-items:start}
.brand-gallery .brand-wide{grid-column:span 2}
.brand-gallery .brand-figure{margin:0;min-width:0}
.brand-gallery .zoom{display:block;background:transparent;border:0;border-radius:0;overflow:visible;box-shadow:none}
.brand-gallery .zoom img{display:block;width:100%;height:auto;max-height:none;object-fit:contain;background:transparent;border:0;border-radius:0}
.brand-gallery figcaption{display:block;padding-top:12px;font-size:11px;line-height:1.8;color:#88838e}
@media(max-width:700px){.brand-study{margin-top:60px}.brand-study>p{font-size:14px;margin-bottom:26px}.brand-gallery{grid-template-columns:1fr;gap:26px}.brand-gallery .brand-wide{grid-column:auto}.brand-gallery figcaption{font-size:11px}}

/* Interactive website exhibit, isolated from the case-study styles. */
.landing-showcase{margin:60px 0 55px;scroll-margin-top:100px}
.landing-showcase>h3{margin:0 0 20px}.landing-showcase>p{max-width:800px;margin:0 0 32px;font-size:16px;line-height:1.85}
.landing-preview{border:1px solid #e5e3e9;border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 12px 36px #24202e08}
.landing-preview-topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:54px;padding:12px 18px;border-bottom:1px solid #eeedf1;background:#fafafa}
.landing-preview-title{display:flex;align-items:center;gap:18px;font-size:12px;color:#6c6674}
.landing-window-dots{display:flex;gap:5px}.landing-window-dots i{display:block;width:7px;height:7px;background:#d8d5dd;border-radius:50%}
.landing-preview-actions{display:flex;align-items:center;gap:16px;font-size:11px;color:#77717e}
.landing-preview-actions button{font:inherit;color:inherit;background:#fff;border:1px solid #e3e0e8;border-radius:6px;padding:6px 10px}
.landing-preview-actions a:hover,.landing-preview-actions button:hover{color:#7843e4}
.landing-preview-viewport{position:relative;width:100%;height:640px;overflow:hidden;background:#fff}
.landing-preview-viewport iframe{position:absolute;left:0;top:0;display:block;max-width:none;border:0;transform-origin:0 0;background:white}
.landing-preview-caption{display:flex;justify-content:space-between;gap:12px;padding:12px 18px;border-top:1px solid #eeedf1;color:#9a949f;font-size:10px;line-height:1.8;background:#fff}
.landing-preview.is-expanded{position:fixed;inset:20px;z-index:100;display:flex;flex-direction:column;margin:0;border-radius:12px;box-shadow:0 0 0 24px #19131f99,0 16px 80px #19131f30}
.landing-preview.is-expanded .landing-preview-viewport{height:auto;flex:1;min-height:0}
.landing-preview.is-expanded .landing-preview-topbar,.landing-preview.is-expanded .landing-preview-caption{flex-shrink:0}
@media(max-width:700px){.landing-showcase{margin:45px 0}.landing-showcase>p{font-size:14px;margin-bottom:24px}.landing-preview-topbar{padding:11px 12px;gap:10px}.landing-preview-title{gap:10px;font-size:11px}.landing-window-dots{display:none}.landing-preview-actions{font-size:10px;gap:12px}.landing-preview-viewport{height:600px}.landing-preview-caption{padding:10px 12px;font-size:9px;flex-wrap:wrap}.landing-preview.is-expanded{inset:8px;border-radius:10px;box-shadow:0 0 0 10px #19131f99}}

.input-node-intro{margin:80px 0}.input-node-intro h3{margin-bottom:22px}.input-node-intro>p{max-width:850px}.input-node-intro .figure{margin-top:32px}@media(max-width:700px){.input-node-intro{margin:52px 0}}

/* Original rounded artwork: leave transparent corners open to the page. */
.figure .zoom[data-image="assets/output-overview-expanded-2x.png"],.figure .zoom[data-image="assets/schedule-110-12064.png"]{background:transparent;border:0;border-radius:0;box-shadow:none}

.header-actions{display:flex;align-items:center;gap:24px}.header-actions>a{font-size:13px;white-space:nowrap}.language-switch{display:flex;align-items:center;gap:2px;border:1px solid #e6e6e8;border-radius:999px;padding:3px;background:#fff}.language-switch button{border:0;background:transparent;color:#777;font:inherit;font-size:12px;line-height:1.4;padding:6px 10px;border-radius:999px;cursor:pointer}.language-switch button[aria-pressed="true"]{background:#171717;color:#fff}.language-switch button:focus-visible{outline:2px solid #763ef8;outline-offset:2px}html[lang="en"] .opening-body{max-width:850px}html[lang="en"] .opening-body p{line-height:1.8}html[lang="en"] .requirements-grid h4{line-height:1.45}html[lang="en"] .chapter-nav a{padding-left:16px;padding-right:16px}html[lang="en"] .chapter-nav a:first-of-type{padding-left:0}html[lang="en"] .landing-preview-caption{gap:16px}@media(max-width:700px){.header-actions{gap:10px}.header-actions>a{display:none}.language-switch button{padding:5px 8px;font-size:11px}.site-header .portfolio-name{font-size:13px}.portfolio-name span{margin-left:9px}.language-switch{flex-shrink:0}html[lang="en"] .chapter-nav a{padding-left:12px;padding-right:12px}.landing-preview-caption{flex-wrap:wrap}}
