.workflow-visual{font-family:Inter,Arial,sans-serif;color:#344139;position:relative;width:100%;padding:12px 14px 30px;container-type:inline-size}
.workflow-path{display:flex;align-items:center;justify-content:space-between;margin:0 8%}.workflow-path>span{display:grid;place-items:center;width:11cqw;height:11cqw;border-radius:3cqw;background:#fff0e6;border:1px solid #ffdbc6;box-shadow:0 6px 15px #43524808;color:#ed6a37}.workflow-path svg{width:5cqw;height:5cqw}.workflow-path i{width:24%;height:1px;background:linear-gradient(90deg,#f2673a66,#b7cfc4);position:relative}.workflow-path i:after{content:'›';position:absolute;right:-1px;top:-12px;font-size:22px;color:#95a99d}
.workflow-labels{display:flex;justify-content:space-between;padding:10px 6% 22px;font-size:2.3cqw;color:#77877c}.workflow-labels span{text-align:center;width:22%}
.workflow-screen{background:#fff;border:1px solid #e2e8e2;border-radius:22px;overflow:hidden;box-shadow:0 24px 40px -28px #30483e66}
.workflow-screen header{display:flex;gap:16px;align-items:center;padding:16px 20px;border-bottom:1px solid #eef0ec;background:linear-gradient(120deg,#fff,#f7faf6)}.workflow-screen header img{width:100px;height:auto;border-radius:0;box-shadow:none}.workflow-screen header>span{font-size:11px;color:#89948c;margin-left:auto}.workflow-screen header>i{width:8px;height:8px;background:#ef7649;border-radius:50%}
.workflow-screen-body{padding:20px}.workflow-title{display:flex;align-items:center;gap:12px;justify-content:space-between}.workflow-title small{display:block;letter-spacing:1.3px;font-size:8px;color:#e76f40;margin-bottom:7px}.workflow-title strong{font-size:18px;line-height:1.3;font-weight:600}.workflow-add{font-size:10px;white-space:nowrap;color:white;background:#f2673a;padding:8px 10px;border-radius:7px}
.workflow-filter{display:flex;align-items:center;gap:7px;border:1px solid #e5eae4;border-radius:8px;padding:9px 12px;margin:20px 0 12px;font-size:10px;color:#7c8a80}.workflow-filter svg{width:15px;height:15px}.workflow-filter>span{margin-left:auto}
.workflow-table-head{display:flex;justify-content:space-between;padding:10px 12px;background:#f5f7f3;border-radius:7px;font-size:9px;color:#89988d}.workflow-row{display:flex;align-items:center;gap:10px;padding:14px 0;border-bottom:1px solid #f0f2ed}.workflow-row em{height:33px;width:33px;display:grid;place-items:center;background:#fff1e8;color:#ed7140;border-radius:9px;flex-shrink:0}.workflow-row svg{width:19px;height:19px}.workflow-row>div:nth-child(2){flex:1;min-width:0}.workflow-row b{font-size:11px;line-height:1.3;display:block}.workflow-row small{font-size:9px;color:#97a297;display:block;margin-top:4px}.workflow-row-progress{width:24%;height:5px;background:#edf1eb;border-radius:5px;overflow:hidden}.workflow-row-progress span{display:block;width:var(--workflow-progress);height:100%;background:#87b5a4;border-radius:5px}
.workflow-summary{display:flex;gap:15px;justify-content:space-between;align-items:center;padding:16px;background:#f7f9f5;border-radius:12px;margin-top:18px}.workflow-summary>div:first-child{display:grid;grid-template-columns:26px 1fr;column-gap:8px}.workflow-summary>div:first-child>span{grid-row:span 2;display:grid;place-items:center;border-radius:50%;background:#e3eee4;color:#6b9c80;width:26px;height:26px}.workflow-summary svg{width:16px;height:16px}.workflow-summary b{font-size:10px;font-weight:600}.workflow-summary small{font-size:9px;color:#94a18f;margin-top:4px}.workflow-mini-bars{height:46px;width:29%;display:flex;gap:6px;align-items:flex-end}.workflow-mini-bars i{display:block;background:#a6c5b7;width:17%;border-radius:3px 3px 0 0}.workflow-mini-bars i:last-child{background:#f2673a}.workflow-screen footer{text-align:right;font-size:8px;color:#a1aaa0;margin-top:14px}
.workflow-report-chip{display:flex;align-items:center;gap:12px;position:relative;margin:-5px -5px 0 auto;width:max-content;max-width:100%;padding:16px 20px;background:white;border:1px solid #eef0e9;border-radius:15px;box-shadow:0 12px 22px -17px #263b2d66}.workflow-report-chip>svg{width:26px;height:26px;color:#f2673a}.workflow-report-chip b{display:block;font-size:12px}.workflow-report-chip span{display:block;font-size:9px;color:#89988c;margin-top:5px}
@media(max-width:479px){.workflow-visual{padding:8px 0 20px}.workflow-screen-body{padding:14px}.workflow-screen header{padding:12px 14px;gap:8px}.workflow-screen header img{width:85px}.workflow-screen header>span{font-size:9px}.workflow-title strong{font-size:16px}.workflow-add{font-size:9px;padding:7px}.workflow-row{gap:7px}.workflow-row b{font-size:10px}.workflow-row-progress{width:20%}.workflow-report-chip{padding:12px 15px;margin-right:0}.workflow-summary{padding:12px;gap:8px}.workflow-summary b{font-size:9px}}