.workflow-intro{color:#aaa5bc;font-size:16px;margin:-6px 0 24px}
.workflow-toolbar{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:27px 0 23px}
.workflow-steps{display:flex;align-items:center;gap:14px}
.workflow-steps button{display:flex;align-items:center;gap:10px;background:none;color:#b0a9c1;font-size:15px;padding:8px 0;white-space:nowrap}
.workflow-steps button>span{display:grid;place-items:center;width:30px;height:30px;border:1px solid #73628766;border-radius:50%;font-size:12px;transition:.3s}
.workflow-steps button[aria-pressed=true]{color:#e4d8fc}
.workflow-steps button[aria-pressed=true]>span{background:#9184d9;color:#191626;border-color:#9184d9;box-shadow:0 0 22px #9184d933}
.workflow-steps button.is-complete>span{color:#c1b5e3;border-color:#9184d980}
.workflow-steps>i{width:44px;height:1px;background:#79649055}
.workflow-play{color:#c2b7d6;background:#9184d912;border:1px solid #9184d93b;border-radius:7px;padding:10px 15px;font-size:14px;white-space:nowrap}
#demo-panel:not([data-view="board"]) .board-greeting,#demo-panel:not([data-view="board"]) .board-grid,#demo-panel:not([data-view="board"]) .board-composer{display:none}
.workflow-panel{padding:24px 0 0;min-height:516px;display:flex;flex-direction:column}
.workflow-panel[hidden],.workflow-panel [hidden]{display:none!important}
.workflow-heading>span{font-size:13px;color:#8875aa}
.workflow-heading h3{font-size:25px;line-height:1.4;letter-spacing:-.02em;margin:7px 0}
.workflow-heading>p{font-size:14px;color:#7f788e}
.workflow-create{position:relative;margin:24px 0;background:white;border:1px solid #e6e0ef;border-radius:14px;padding:25px;box-shadow:0 12px 35px #3b215707}
.project-symbol{position:absolute;right:25px;top:25px;background:#f0ecfa;border-radius:12px;padding:13px}
.project-field{max-width:85%;margin-bottom:22px}
.project-field>span{display:block;font-size:13px;color:#8b839c;margin-bottom:8px}
.project-field strong{font-size:21px;font-weight:600;line-height:1.5;display:block;max-width:80%}
.project-field p{font-size:15px;line-height:1.8;color:#595167;max-width:530px}
.project-tags{display:flex;gap:8px;flex-wrap:wrap}
.project-tags span{font-size:12px;background:#f2eef8;color:#8976a6;padding:5px 10px;border-radius:5px}
.workflow-upload{display:flex;gap:20px;margin:24px 0;align-items:stretch}
.upload-area{flex:0 0 38%;display:flex;align-items:center;justify-content:center;text-align:center;flex-direction:column;padding:22px 18px;border:1px dashed #c4b6da;border-radius:13px;background:#f0ebf7}
.upload-area>span{font-size:28px;color:#9b83be;margin-bottom:10px}
.upload-area strong{font-size:15px;font-weight:600}
.upload-area p{font-size:13px;color:#8b7d9d;margin:10px 0}
.upload-area small{font-size:12px;color:#90869d;line-height:1.7}
.workflow-files{display:flex;flex-direction:column;gap:12px;flex:1;min-width:0}
.workflow-file{padding:15px;display:flex;align-items:center;gap:12px;border:1px solid #e4dfee;background:white;border-radius:10px;opacity:.48;transform:translateY(6px);transition:opacity .4s,transform .4s}
.workflow-file.is-ready{opacity:1;transform:none}
.file-type{font-size:11px;display:grid;place-items:center;flex-shrink:0;width:39px;height:45px;border-radius:7px;background:#eee8f8;color:#8a6caa;letter-spacing:.02em}
.file-type[data-kind="XLSX"]{background:#e7f0ed;color:#5f8a7a}
.file-type[data-kind="PDF"]{background:#f5eae8;color:#b37c6e}
.workflow-file>div{min-width:0;flex:1}
.workflow-file strong{display:block;font-size:14px;overflow-wrap:anywhere;line-height:1.5}
.workflow-file small{font-size:12px;color:#948a9f;display:block;margin-top:4px}
.file-state{font-size:12px;color:#978ca5;white-space:nowrap}
.workflow-file.is-ready .file-state{color:#6a8b7f}
.workflow-generate{margin:24px 0}
.generation-heading{display:flex;gap:16px;align-items:center;background:white;border:1px solid #e4ddef;padding:20px;border-radius:12px}
.generation-heading strong{font-size:16px}
.generation-heading p{font-size:13px;color:#92859f;margin-top:5px}
.generation-skeleton{display:grid;grid-template-columns:1.3fr 1fr;gap:14px;margin-top:15px}
.generation-skeleton>div{border:1px solid #e9e3f0;border-radius:12px;background:white;padding:20px}
.generation-skeleton>div:last-child{grid-column:1/-1}
.generation-skeleton :is(i,b,em){display:block;border-radius:5px;height:9px;margin-bottom:12px;background:linear-gradient(100deg,#f0ebf7 15%,#e4dced 50%,#f0ebf7 85%);background-size:220% 100%;animation:workflow-shimmer 2s linear infinite}
.generation-skeleton i{width:36%;height:13px;margin-bottom:20px}
.generation-skeleton b{width:90%}.generation-skeleton b:nth-child(3){width:65%}.generation-skeleton em{width:40%;height:22px;margin-top:18px;margin-bottom:0}
.generation-note{color:#9a90a5;font-size:12px;margin-top:12px}
.workflow-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:auto;padding-top:8px}
.workflow-bottom>span{font-size:13px;color:#9a8ba9}
.workflow-bottom button{background:#8d79b8;color:white;font-size:14px;border-radius:8px;padding:12px 18px;font-weight:500}
#demo-panel[data-workflow="done"] .board-grid{animation:workflow-reveal .5s ease both}
@keyframes workflow-shimmer{to{background-position:-220% 0}}
@keyframes workflow-reveal{from{opacity:.2;transform:translateY(10px)}to{opacity:1;transform:none}}
@media(max-width:760px){.workflow-toolbar{flex-wrap:wrap;gap:12px}.workflow-steps{gap:9px;justify-content:space-between;width:100%}.workflow-steps button{font-size:13px;gap:6px}.workflow-steps button>span{width:24px;height:24px;font-size:11px}.workflow-steps>i{width:12px;flex:1}.workflow-play{margin-left:auto;font-size:12px;padding:7px 11px}.workflow-intro{font-size:15px}.workflow-heading h3{font-size:21px}.workflow-panel{min-height:560px;padding-top:20px}.workflow-upload{flex-direction:column;gap:14px;margin:20px 0}.upload-area{padding:16px}.upload-area>span,.upload-area p{display:none}.upload-area small{margin-top:6px}.workflow-create{padding:20px;margin:20px 0}.project-symbol{padding:8px;right:16px;top:20px}.project-symbol img{width:28px;height:24px}.project-field{max-width:100%}.project-field strong{font-size:19px;max-width:76%}.workflow-bottom{gap:12px;flex-wrap:wrap}.workflow-bottom button{margin-left:auto}.workflow-file{padding:13px;gap:9px}.file-state{font-size:11px}.generation-skeleton{gap:10px}.generation-skeleton>div{padding:14px}.generation-heading{padding:16px;gap:12px}}
@media(prefers-reduced-motion:reduce){.workflow-file{transition:none}.generation-skeleton :is(i,b,em),#demo-panel[data-workflow="done"] .board-grid{animation:none}}
.workflow-steps{gap:9px;flex:1;justify-content:space-between}
.workflow-steps>i{width:16px;flex:1;max-width:26px}
.workflow-steps button{font-size:14px;gap:7px}
.workflow-toolbar{gap:25px;margin-bottom:14px}
.workflow-caption{display:flex;align-items:center;gap:12px;margin:0 0 20px;color:#b8afc7;min-height:42px}
.workflow-caption-label{color:#ccbeed;border:1px solid #8e78ad55;border-radius:5px;font-size:12px;white-space:nowrap;padding:4px 8px}
.workflow-caption p{font-size:14px;line-height:1.65}
#demo-panel{position:relative}
#demo-panel [hidden]{display:none!important}
#demo-panel[data-view="board"] .board{min-height:560px}
#demo-panel[data-workflow="3"] #decision-options{display:none}
.flow-action{padding:11px 17px;background:#8d79b8;color:white;font-size:14px;border-radius:8px;font-weight:500;line-height:1.3}
.flow-action:disabled{opacity:.6;cursor:default}
#workflow-open-task{margin-top:15px;font-size:13px;padding:10px 15px}
#demo-panel[data-workflow="5"] #workflow-open-task,#demo-panel[data-workflow="done"] #workflow-open-task{background:#eee8f7;color:#84669f}
.workflow-task{padding:24px 0;min-height:516px}
.task-thread-top{display:flex;justify-content:space-between;color:#8a7c9a;font-size:12px;gap:15px;margin-bottom:18px}
.workflow-task h3{font-size:23px;line-height:1.5;margin-bottom:22px}
.task-assistant{display:flex;align-items:flex-start;gap:12px;background:white;border:1px solid #e7e0ee;border-radius:12px;padding:20px}
.task-assistant img{flex-shrink:0;margin-top:4px}
.task-assistant p{font-size:15px;color:#655b73;line-height:1.8}
.task-choices{display:flex;gap:10px;margin:18px 0;flex-wrap:wrap}
.task-choices button{border:1px solid #bda9d6;color:#876ca4;background:#f7f4fc;border-radius:8px;padding:11px 16px;font-size:14px}
.task-choices button[aria-pressed="true"]{background:#8d79b8;color:white;border-color:#8d79b8}
.task-reply{max-width:80%;margin:20px 0 20px auto;border-radius:12px 12px 2px 12px;background:#e9e1f6;padding:13px 18px}
.task-reply span{font-size:12px;color:#947fae}.task-reply p{font-size:14px;color:#665374;margin-top:4px}
.task-result{border-left:3px solid #b8a3d5;padding:4px 0 4px 15px;margin-bottom:18px}
.task-result strong{font-size:14px;color:#715d87}.task-result p{font-size:14px;color:#8a7e97;margin-top:4px}
.workflow-schedule{padding:24px 0;min-height:516px}
.schedule-page-heading>span{font-size:13px;color:#9280a6}
.schedule-page-heading h3{font-size:24px;line-height:1.4;margin:8px 0}
.schedule-page-heading p{font-size:14px;color:#8c809b}
.schedule-job{padding:24px;margin-top:24px;border:1px solid #e5dfee;background:white;border-radius:14px}
.schedule-job-top{display:flex;gap:13px;align-items:center}
.schedule-job-icon{display:grid;place-items:center;width:46px;height:46px;background:#f0eafa;color:#8b75b0;border-radius:12px;font-size:28px;flex-shrink:0}
.schedule-job-top h4{font-size:17px;line-height:1.5}
.schedule-job-top p{font-size:12px;color:#9a8daa;margin-top:3px}
.schedule-enabled{margin-left:auto;color:#7b9586;background:#edf4ef;padding:4px 8px;border-radius:5px;font-size:12px;white-space:nowrap}
.schedule-job>p{color:#81748e;font-size:14px;margin:17px 0}
.schedule-job-actions{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #eee8f5;padding-top:16px;gap:12px}
.schedule-job-actions>span{font-size:13px;color:#9a84ae}
.schedule-log{margin:24px 0 18px;font-size:13px;color:#91829e}
.schedule-log ol{padding:0;list-style:none;margin:14px 0 0}
.schedule-log li{display:flex;justify-content:space-between;gap:12px;padding:8px 0;color:#a79cae;font-size:13px}
.schedule-log li>span{font-size:12px;flex-shrink:0}
.schedule-log li.is-running{color:#9075b3}
.schedule-log li.is-complete{color:#648775}
.workflow-update{display:flex;gap:12px;align-items:center;border:1px solid #cce0d4;background:#edf6f0;border-radius:10px;padding:13px 16px;margin-bottom:16px;animation:workflow-reveal .5s ease both}
.workflow-update>span:first-child{color:#6c9482;font-size:20px}
.workflow-update strong{font-size:14px;color:#587561}
.workflow-update p{font-size:12px;color:#789385;margin-top:3px}
.update-time{margin-left:auto;font-size:11px;color:#90a597;white-space:nowrap}
#demo-panel[data-workflow="5"] .progress-card,#demo-panel[data-workflow="5"] .result-card{box-shadow:0 0 0 2px #b4a1d540;transition:box-shadow 1s}
.demo-cursor{position:absolute;pointer-events:none;z-index:8;left:0;top:0;transition:left .7s ease,top .7s ease;filter:drop-shadow(0 3px 5px #44345c26)}
.demo-cursor svg{position:relative;z-index:1;display:block}
.cursor-label{position:absolute;top:26px;left:20px;white-space:nowrap;background:#796091;color:white;font-size:12px;padding:5px 9px;border-radius:5px;box-shadow:0 3px 10px #4a345025}
.label-left .cursor-label{left:auto;right:16px}
.label-above .cursor-label{top:auto;bottom:34px}
.cursor-ripple{position:absolute;top:0;left:0;width:32px;height:32px;border-radius:50%;border:2px solid #9879be;opacity:0;transform:translate(-50%,-50%)}
.is-clicking .cursor-ripple{animation:click-pulse .9s ease-out infinite}
.flow-paused .cursor-ripple{animation-play-state:paused}
@keyframes click-pulse{0%{opacity:.9;transform:translate(-50%,-50%) scale(.25)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.8)}}
@media(max-width:1100px){.workflow-toolbar{flex-wrap:wrap;gap:12px}.workflow-play{margin-left:auto}.workflow-steps{flex-basis:100%}.workflow-steps>i{max-width:40px}}
@media(max-width:760px){.workflow-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 8px}.workflow-steps>i{display:none}.workflow-steps button{white-space:nowrap;font-size:13px;gap:6px}.workflow-caption{align-items:flex-start;gap:8px}.workflow-caption p{font-size:13px}.workflow-caption-label{font-size:11px;margin-top:2px}.workflow-task,.workflow-schedule{min-height:560px}.workflow-task h3,.schedule-page-heading h3{font-size:20px}.task-assistant{padding:16px;gap:10px}.task-assistant p{font-size:14px}.task-choices{flex-direction:column;align-items:stretch}.task-reply{max-width:95%}.schedule-job{padding:17px}.schedule-job-top{flex-wrap:wrap;gap:10px}.schedule-enabled{margin-left:0}.schedule-job-top h4{font-size:16px}.schedule-job-actions{flex-wrap:wrap}.schedule-job-actions .flow-action{margin-left:auto}.schedule-log li{line-height:1.6}.workflow-update{align-items:flex-start;flex-wrap:wrap;padding:12px}.workflow-update>div{flex:1}.update-time{display:none}.demo-cursor svg{width:23px;height:27px}.cursor-label{font-size:11px}.workflow-panel{min-height:560px}}
@media(prefers-reduced-motion:reduce){.demo-cursor{transition:none}.cursor-ripple,.workflow-update{animation:none}.demo-cursor .cursor-label{display:block}}

/* Extended walkthrough: task handling, schedules and results. */
