/* Step three shows how one reviewed project file becomes a usable workspace. */
.art-workflow-repo,.art-workflow-config,.art-workflow-view{position:absolute;z-index:2;border:1px solid var(--scene-stroke);border-radius:9px;background:var(--scene-panel);color:var(--scene-ink);box-shadow:0 12px 24px #3e657524}
.art-workflow-repo{left:3%;top:67px;width:20%;height:112px;padding:9px 7px}
.art-workflow-repo>span,.art-workflow-config>span,.art-workflow-inner>span{display:block;color:#6c8b9a;font-size:7px;font-weight:800;letter-spacing:.07em;white-space:nowrap}
.art-workflow-repo>span{padding-bottom:7px;border-bottom:1px solid var(--scene-stroke)}
.art-workflow-repo>b{display:block;margin-top:10px;color:var(--scene-ink);font:7px/1 ui-monospace,SFMono-Regular,Menlo,monospace;white-space:nowrap}
.art-workflow-repo>b:nth-of-type(2){color:#4e917c}
.art-workflow-config{left:29%;top:47px;width:25%;height:154px;padding:9px 8px;overflow:hidden;animation:setup-config-pulse 6s ease-in-out infinite}
.art-workflow-config>span{padding-bottom:7px;border-bottom:1px solid var(--scene-stroke)}
.art-workflow-config>strong{display:block;margin:9px 0 8px;font:700 8px/1.1 ui-monospace,SFMono-Regular,Menlo,monospace;white-space:nowrap}
.art-workflow-config>code{display:block;padding:0;background:transparent;color:var(--scene-ink);font:8px/1.7 ui-monospace,SFMono-Regular,Menlo,monospace;white-space:nowrap}
.art-workflow-config>small{position:absolute;bottom:9px;left:8px;display:flex;align-items:center;gap:2px;color:#5b9986;font:700 6px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em}
.art-workflow-config>small i{width:3px;height:3px;border-radius:50%;background:currentColor;animation:setup-thinking 1.2s ease-in-out infinite}
.art-workflow-config>small i:nth-child(2){animation-delay:.2s}.art-workflow-config>small i:nth-child(3){animation-delay:.4s}
.art-workflow-config:after{content:"";position:absolute;left:6px;right:6px;top:33px;height:14px;border-radius:4px;background:linear-gradient(180deg,transparent,#80c0a64d,transparent);pointer-events:none;animation:setup-read-line 6s linear infinite}
.art-workflow-arrow{position:absolute;z-index:3;top:111px;color:#5c9c86;font-size:16px;font-weight:700;line-height:1;animation:setup-arrow-glow 6s ease-in-out infinite}
.art-workflow-arrow-one{left:24%;animation-delay:0s}.art-workflow-arrow-two{left:55%;animation-delay:1.5s}
.art-workflow-view{right:3%;top:31px;width:38%;height:168px;overflow:hidden;animation:setup-view-ready 6s ease-in-out infinite}
.art-workflow-top{display:flex;align-items:center;gap:3px;height:23px;padding:0 7px;border-bottom:1px solid var(--scene-stroke);background:#e9f1f3}
.art-workflow-top i{width:3px;height:3px;border-radius:50%;background:#8fb0b8}.art-workflow-top b{margin-left:4px;font-size:7px;white-space:nowrap}
.art-workflow-inner{padding:8px}
.art-workflow-inner>span{margin-bottom:5px;font-size:6px}
.art-workflow-inner>div{display:flex;align-items:center;justify-content:space-between;gap:2px;min-height:24px;padding:2px 0;border-top:1px solid var(--scene-stroke);animation:setup-row-appear 6s ease-in-out infinite}
.art-workflow-inner>div:nth-of-type(2){animation-delay:.35s}.art-workflow-inner>div:nth-of-type(3){animation-delay:.7s}
.art-workflow-inner b{font-size:7px}.art-workflow-inner em{color:#4e9e7e;font-size:6px;font-style:normal;white-space:nowrap}
.art-workflow-inner svg{display:block;width:100%;height:20px;margin-top:5px;overflow:visible}
.art-workflow-inner svg path{fill:none;stroke:#74a4b7;stroke-width:2;stroke-linecap:round;stroke-dasharray:110;animation:setup-chart-draw 6s ease-in-out infinite}
html[data-theme="dark"] .art-workflow-top{background:#2b4758}
html[data-theme="dark"] .art-workflow-repo>span,html[data-theme="dark"] .art-workflow-config>span,html[data-theme="dark"] .art-workflow-inner>span{color:#a6c3ce}
html[data-theme="dark"] .art-workflow-repo>b:nth-of-type(2),html[data-theme="dark"] .art-workflow-inner em,html[data-theme="dark"] .art-workflow-config>small{color:#9bd9b9}
html[data-theme="dark"] .art-workflow-arrow{color:#9bd9b9}
html[data-theme="dark"] .art-workflow-config:after{background:linear-gradient(180deg,transparent,#8cd6b54d,transparent)}
@keyframes setup-config-pulse{0%,100%{box-shadow:0 12px 24px #3e657524}26%,45%{box-shadow:0 12px 24px #3e657524,0 0 0 3px #72b69c3a}}
@keyframes setup-thinking{0%,70%,100%{opacity:.35;transform:translateY(0)}35%{opacity:1;transform:translateY(-2px)}}
@keyframes setup-read-line{0%,8%{top:33px;opacity:0}14%{opacity:1}43%{top:116px;opacity:1}52%,100%{top:116px;opacity:0}}
@keyframes setup-arrow-glow{0%,15%,100%{opacity:.5;transform:translateX(0)}30%,55%{opacity:1;transform:translateX(3px)}}
@keyframes setup-view-ready{0%,34%,100%{box-shadow:0 12px 24px #3e657524}53%,78%{box-shadow:0 12px 24px #3e657524,0 0 0 3px #72b69c3a}}
@keyframes setup-row-appear{0%,36%,100%{opacity:.78;transform:translateY(1px)}52%,86%{opacity:1;transform:translateY(0)}}
@keyframes setup-chart-draw{0%,38%{stroke-dashoffset:110}62%,90%{stroke-dashoffset:0}100%{stroke-dashoffset:110}}
@media(max-width:950px){.setup-step:last-child .art-workflow-repo{width:22%}.setup-step:last-child .art-workflow-config{left:30%;width:25%}.setup-step:last-child .art-workflow-view{width:38%}.setup-step:last-child .art-workflow-arrow-one{left:25%}.setup-step:last-child .art-workflow-arrow-two{left:57%}}
@media(max-width:430px){.art-workflow-repo{left:3%;width:20%}.art-workflow-config{left:29%;width:25%}.art-workflow-view{right:3%;width:38%}.art-workflow-repo>span,.art-workflow-config>span{font-size:6px}.art-workflow-repo>b,.art-workflow-config>code{font-size:6px}.art-workflow-config>strong{font-size:7px}.art-workflow-inner{padding:7px 5px}.art-workflow-inner b{font-size:6px}.art-workflow-inner em{font-size:5px}}
@media(prefers-reduced-motion:reduce){.art-workflow-config,.art-workflow-config:after,.art-workflow-config>small i,.art-workflow-arrow,.art-workflow-view,.art-workflow-inner>div,.art-workflow-inner svg path{animation:none!important}.art-workflow-config:after{display:none}.art-workflow-inner svg path{stroke-dashoffset:0}}