/* AgentFlow Product UI v3 — light-first and task-focused. */
:root,html[data-theme="light"]{
--v3-bg:#f5f6f8;--v3-surface:#fff;--v3-soft:#f8f9fb;--v3-ink:#16181d;--v3-ink-2:#4e5563;--v3-ink-3:#8a92a3;--v3-line:#e7e9ee;--v3-line-2:#d9dde5;--v3-accent:#5b5ce2;--v3-accent-soft:#eeefff;--v3-accent-ink:#4546c8;--v3-positive:#158f67;--v3-positive-soft:#e8f7f1;--v3-warning:#b76e00;--v3-warning-soft:#fff5df;--v3-danger:#c63c4b;--v3-danger-soft:#fff0f1;--v3-info:#2475c7;--v3-info-soft:#eaf3ff;--v3-shadow:0 10px 30px rgba(16,24,40,.08);--v3-radius:14px;
--bg:var(--v3-bg);--panel:var(--v3-surface);--panel-2:var(--v3-soft);--border:var(--v3-line);--border-strong:var(--v3-line-2);--text:var(--v3-ink);--text-strong:var(--v3-ink);--muted:var(--v3-ink-2);--muted-2:var(--v3-ink-3);--primary:var(--v3-accent);--success:var(--v3-positive);--warning:var(--v3-warning);--danger:var(--v3-danger)}
html[data-theme="dark"]{
--v3-bg:#101116;--v3-surface:#17191f;--v3-soft:#1d2028;--v3-ink:#f2f3f7;--v3-ink-2:#b4bac7;--v3-ink-3:#767e8e;--v3-line:#292d36;--v3-line-2:#363b47;--v3-accent:#8585ff;--v3-accent-soft:#262640;--v3-accent-ink:#aaaaff;--v3-positive:#52c99b;--v3-positive-soft:#18352b;--v3-warning:#efb957;--v3-warning-soft:#382e1b;--v3-danger:#f17b87;--v3-danger-soft:#3a2227;--v3-info:#6aacec;--v3-info-soft:#1e3147;--v3-shadow:0 14px 36px rgba(0,0,0,.3);
--bg:var(--v3-bg);--panel:var(--v3-surface);--panel-2:var(--v3-soft);--border:var(--v3-line);--border-strong:var(--v3-line-2);--text:var(--v3-ink);--text-strong:#ffffff;--muted:var(--v3-ink-2);--muted-2:var(--v3-ink-3);--primary:var(--v3-accent);--success:var(--v3-positive);--warning:var(--v3-warning);--danger:var(--v3-danger)}
*{scrollbar-color:var(--v3-line-2) transparent}body{background:var(--v3-bg);color:var(--v3-ink);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;letter-spacing:-.01em}button,input,select,textarea{font:inherit}button{letter-spacing:-.01em}

/* Application frame */
.app-shell{grid-template-columns:248px minmax(0,1fr);background:var(--v3-bg)}
.platform-sidebar{width:248px;padding:0 14px;background:var(--v3-surface);border-right:1px solid var(--v3-line);color:var(--v3-ink-2);box-shadow:none}
.platform-sidebar .brand{height:66px;padding:0 8px;border:0;gap:10px}.brand-mark svg{width:30px;height:30px;filter:drop-shadow(0 4px 9px rgba(91,92,226,.2))}.brand-text b{color:var(--v3-ink);font-size:15px;letter-spacing:-.02em}.brand-text small{color:var(--v3-ink-3);font-size:10px}
.workspace-switch{margin:8px 2px 18px;padding:10px;border:1px solid var(--v3-line);border-radius:12px;background:var(--v3-soft);box-shadow:none}.workspace-switch>span{background:var(--v3-ink);color:var(--v3-surface);border-radius:9px}.workspace-switch b{color:var(--v3-ink)}.workspace-switch small{color:var(--v3-ink-3)}
.platform-sidebar nav{padding:0 0 84px}.platform-sidebar nav p{margin:20px 10px 7px;color:var(--v3-ink-3);font-size:10px;font-weight:650;letter-spacing:.09em}.platform-sidebar .nav{min-height:38px;margin:2px 0;padding:0 10px;gap:10px;color:var(--v3-ink-2);border:0;border-radius:9px;font-size:13px;font-weight:520;transition:.14s ease}.platform-sidebar .nav:before{display:none}.platform-sidebar .nav:hover{background:var(--v3-soft);color:var(--v3-ink);transform:none}.platform-sidebar .nav.active{background:var(--v3-ink);color:var(--v3-surface);box-shadow:0 5px 14px rgba(20,22,28,.12)}.platform-sidebar .nav.active .nav-icon{color:inherit;background:rgba(255,255,255,.12)}.nav-icon{width:24px;height:24px;display:grid;place-items:center;border-radius:7px;color:var(--v3-ink-3)}.platform-sidebar .nav .nav-badge,.nav-badge{margin-left:auto;background:transparent;color:var(--v3-ink-3);box-shadow:none;min-width:0;height:auto;padding:0;border-radius:0;font-size:12px;font-weight:650}
.sidebar-bottom{left:0;right:0;bottom:0;min-height:62px;padding:0 22px;background:color-mix(in srgb,var(--v3-surface) 92%,transparent);border-top:1px solid var(--v3-line);backdrop-filter:blur(18px)}.sidebar-bottom b{color:var(--v3-ink-2)}.sidebar-bottom small{color:var(--v3-ink-3)}
.shell-main{min-width:0;background:var(--v3-bg)}.topbar{height:66px;padding:0 28px;background:color-mix(in srgb,var(--v3-surface) 90%,transparent);border-bottom:1px solid var(--v3-line);backdrop-filter:blur(20px);box-shadow:none}.page-context{display:flex;align-items:baseline;gap:9px;flex-shrink:0}.page-context b{color:var(--v3-ink);font-size:15px;font-weight:680}.page-context span{color:var(--v3-ink-3);font-size:12px}.command-trigger{width:min(360px,28vw);height:38px;margin-left:28px;padding:0 8px 0 12px;display:flex;align-items:center;gap:9px;background:var(--v3-soft);border:1px solid var(--v3-line);border-radius:10px;color:var(--v3-ink-3);cursor:pointer}.command-trigger:hover{border-color:var(--v3-line-2);color:var(--v3-ink-2)}.command-trigger b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:500}.command-trigger kbd,.command-search kbd{margin-left:auto;padding:2px 6px;border:1px solid var(--v3-line);border-radius:5px;background:var(--v3-surface);color:var(--v3-ink-3);font-size:10px}.topbar-project{gap:8px}.topbar-project-label{display:none}.project-global-switch{min-width:215px;height:38px;padding:0 34px 0 12px;background:var(--v3-soft);border-color:var(--v3-line);border-radius:10px;color:var(--v3-ink)}.save-state{color:var(--v3-ink-3)}.theme-toggle{width:38px;height:38px;padding:0;display:grid;place-items:center;background:var(--v3-soft);border:1px solid var(--v3-line);border-radius:10px;color:var(--v3-ink-2)}.theme-toggle b{display:none}.top-actions{gap:8px}
.command-palette{position:fixed;z-index:500;inset:0;background:rgba(18,20,27,.32);backdrop-filter:blur(7px);padding-top:13vh}.command-dialog{width:min(680px,calc(100vw - 40px));max-height:68vh;margin:0 auto;display:flex;flex-direction:column;background:var(--v3-surface);border:1px solid var(--v3-line-2);border-radius:18px;box-shadow:0 30px 90px rgba(15,23,42,.25);overflow:hidden}.command-search{height:64px;padding:0 18px;display:flex;align-items:center;gap:12px;border-bottom:1px solid var(--v3-line)}.command-search>span{font-size:22px;color:var(--v3-ink-3)}.command-search input{height:auto;flex:1;padding:0;border:0!important;background:transparent!important;box-shadow:none!important;color:var(--v3-ink);font-size:16px}.command-results{padding:8px;overflow:auto}.command-results button{width:100%;min-height:58px;padding:9px 11px;display:grid;grid-template-columns:64px 1fr 24px;align-items:center;gap:8px;text-align:left;background:transparent;border:0;border-radius:10px;color:var(--v3-ink);cursor:pointer}.command-results button:hover,.command-results button:focus{background:var(--v3-accent-soft);outline:0}.command-kind{width:max-content;padding:4px 7px;background:var(--v3-soft);border:1px solid var(--v3-line);border-radius:6px;color:var(--v3-ink-3);font-size:10px}.command-results b,.command-results small{display:block}.command-results b{font-size:13px}.command-results small{margin-top:3px;color:var(--v3-ink-3);font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.command-results em{color:var(--v3-ink-3);font-style:normal}.command-footer{height:40px;padding:0 16px;display:flex;align-items:center;gap:18px;background:var(--v3-soft);border-top:1px solid var(--v3-line);color:var(--v3-ink-3);font-size:10px}.command-empty{padding:52px 20px;text-align:center}.command-empty b,.command-empty span{display:block}.command-empty span{margin-top:5px;color:var(--v3-ink-3);font-size:12px}
.shell-main>main{background:var(--v3-bg)}.page-view.active{padding:30px 32px 46px;max-width:1540px;margin:0 auto}.page-heading{align-items:flex-end;margin:0 0 18px;gap:24px}.page-heading h1{margin:2px 0 5px;color:var(--v3-ink);font-size:22px;font-weight:720;line-height:1.15;letter-spacing:-.035em}.page-heading>div>p:last-child{color:var(--v3-ink-2);font-size:13px;line-height:1.6}.eyebrow{color:var(--v3-accent-ink)!important;font-size:10px!important;font-weight:750;letter-spacing:.13em!important}.heading-actions{gap:9px}

/* Controls */
.button,.icon-button{min-height:38px;padding:0 14px;border-radius:10px;border:1px solid var(--v3-line-2);background:var(--v3-surface);color:var(--v3-ink);box-shadow:0 1px 2px rgba(16,24,40,.04);font-weight:620;transition:.14s ease}.button:hover,.icon-button:hover{transform:translateY(-1px);border-color:var(--v3-ink-3);box-shadow:0 5px 16px rgba(16,24,40,.08)}.button.primary{background:var(--v3-ink);border-color:var(--v3-ink);color:var(--v3-surface);box-shadow:0 7px 18px rgba(20,22,28,.16)}.button.primary:hover{background:color-mix(in srgb,var(--v3-ink) 86%,var(--v3-accent))}.button.dark{background:var(--v3-accent);border-color:var(--v3-accent);color:#fff}.button.ghost{background:var(--v3-surface);color:var(--v3-ink-2)}.button.small{min-height:32px;padding:0 11px;border-radius:8px}
.input,.select,.textarea,input:not([type="checkbox"]):not([type="radio"]),textarea,select{color:var(--v3-ink);background:var(--v3-surface);border-color:var(--v3-line-2);border-radius:9px;box-shadow:none}.input:focus,.select:focus,.textarea:focus,input:focus,textarea:focus,select:focus{border-color:var(--v3-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--v3-accent) 14%,transparent);outline:0}

/* Shared surfaces */
.sh-card,.panel,.project-context-bar,.sync-panel,.issue-table,.run-list-panel,.run-detail,.approval-card,.sop-card,.definition-card,.asset-card,.metric-card,.obs-card,.flow-commandbar,.flow-settings-panel,.flow-outline-panel,.properties{background:var(--v3-surface);border:1px solid var(--v3-line);border-radius:var(--v3-radius);box-shadow:0 1px 2px rgba(16,24,40,.04)}.sh-card{padding:18px}.sh-card-title{color:var(--v3-ink);font-size:13px;font-weight:680}.sh-card-title .sub{color:var(--v3-ink-3)}.sh-card-icon{border-radius:8px}.empty-properties,.empty-state,.issue-table-empty{color:var(--v3-ink-3)}

/* Decision-first dashboard */
.stat-grid,.sop-overview,.run-overview,.approval-stats,.observability-overview{gap:10px;margin-bottom:16px}.stat-card,.overview-metric,.run-overview-card,.approval-stat,.obs-overview-card{min-height:104px;padding:16px 17px;background:var(--v3-surface);border:1px solid var(--v3-line);border-radius:13px;box-shadow:none;overflow:hidden}.stat-card:before,.overview-metric:before{width:100%;height:3px;top:0;left:0;bottom:auto;opacity:.9}.stat-card:hover,.overview-metric:hover{transform:translateY(-2px);border-color:var(--v3-line-2);box-shadow:var(--v3-shadow)}.stat-card .value,.overview-metric b,.run-overview-card b,.approval-stat b{color:var(--v3-ink);font-size:25px;letter-spacing:-.035em}.stat-card .label,.overview-metric span{color:var(--v3-ink-3)}.stat-card .foot,.overview-metric small{color:var(--v3-ink-2)}.dash-grid{grid-template-columns:minmax(260px,.85fr) minmax(360px,1.2fr) minmax(320px,1fr);gap:12px}.dash-grid .sh-card{min-height:410px}.dash-row,.dash-run-row,.dash-issue-row{padding:12px 8px;border-radius:9px;border-bottom-color:var(--v3-line)}.dash-row:hover,.dash-run-row:hover,.dash-issue-row:hover{background:var(--v3-soft)}.dash-feed-card{margin-top:12px;min-height:auto}

/* Requirements */
.project-context-bar{padding:16px 18px;margin-bottom:12px;background:linear-gradient(120deg,var(--v3-surface),var(--v3-soft))}.project-context-mark{background:var(--v3-ink);color:var(--v3-surface);border-radius:10px;box-shadow:none}.sync-panel{margin-bottom:12px;overflow:hidden}.sync-panel-head{padding:12px 16px;background:var(--v3-surface)}.sync-panel-summary{padding:10px 16px;background:var(--v3-soft);border-top-color:var(--v3-line)}.sync-panel-config{background:var(--v3-soft);border-top-color:var(--v3-line)}
.issue-toolbar,.run-toolbar,.sop-toolbar,.catalog-toolbar{min-height:54px;padding:8px;margin:0 0 10px;background:var(--v3-surface);border:1px solid var(--v3-line);border-radius:12px}.issue-search,.run-search,.catalog-search{background:var(--v3-soft);border-color:transparent;border-radius:9px}.issue-table{overflow:hidden}.issue-table-row{background:var(--v3-surface);border-bottom:1px solid var(--v3-line)}.issue-table-row.needs-attention{background:rgba(198,60,75,.1)}.issue-table-row.needs-attention .issue-title-cell b{color:var(--v3-danger)!important}.issue-table-row.needs-confirm{background:rgba(251,191,36,.12)}.issue-table-row.needs-confirm .issue-title-cell b{color:var(--v3-ink)!important}.issue-table-row:hover{background:var(--v3-soft)}.issue-table-row.needs-attention:hover{background:rgba(198,60,75,.14)}.issue-table-row.needs-confirm:hover{background:rgba(251,191,36,.16)}.issue-table-head{min-height:42px;background:var(--v3-soft);color:var(--v3-ink-3);font-size:10px;font-weight:720;letter-spacing:.05em}.issue-table-body .issue-table-row{min-height:48px}.issue-title-cell b,.issue-workflow-cell b,.issue-key-cell b{color:var(--v3-ink)}.issue-title-cell span,.issue-table small{color:var(--v3-ink-3)}.issue-stage-cell i,.health-dot-card{box-shadow:none}.issue-progress-track,.closure-track{background:var(--v3-soft)}.issue-progress-track i,.closure-track i{background:var(--v3-accent)}

/* Run center */
.runs-layout{gap:12px;min-height:0}.run-list-panel{width:350px;overflow:hidden}.run-list-heading{padding:14px 16px;background:var(--v3-soft);border-bottom:1px solid var(--v3-line)}.run-list-item{padding:14px 16px;background:transparent;border-bottom:1px solid var(--v3-line)}.run-list-item:hover{background:var(--v3-soft)}.run-list-item.active{background:var(--v3-accent-soft);box-shadow:inset 3px 0 var(--v3-accent)}.run-detail{overflow:hidden;max-height:none}.run-detail-header,.run-detail-tabs{background:var(--v3-surface);border-color:var(--v3-line)}.run-detail-tabs button.active{color:var(--v3-accent-ink);border-color:var(--v3-accent)}.run-node-card,.run-node-step,.artifact-item{background:var(--v3-surface);border-color:var(--v3-line);border-radius:11px}.run-node-card.active,.run-node-step.active{border-color:var(--v3-accent);background:var(--v3-accent-soft)}.live-state{color:var(--v3-positive);background:var(--v3-positive-soft);border-color:transparent}
.worker-log-section,.worker-log-feed{background:#0a101c!important;color:#d8e1ee!important;border-color:#223049!important}
.worker-log-section{background:#0d1420!important}
.worker-log-line pre,.worker-log-line time,.worker-log-line b{color:#d8e1ee}
.worker-log-line time{color:#8fa0b8}
.worker-log-line b{color:#a8b6ca}

/* SOP and Agent libraries */
.sop-catalog,.definition-card-grid{gap:14px}.sop-card,.definition-card{padding:18px;border-color:var(--v3-line);box-shadow:none;transition:.17s ease}.sop-card:before,.definition-card:before{display:none}.sop-card:hover,.definition-card:hover{transform:translateY(-3px);border-color:var(--v3-line-2);box-shadow:var(--v3-shadow)}.sop-card h3,.definition-card h3{color:var(--v3-ink);font-size:16px;letter-spacing:-.02em}.sop-card p,.definition-card p{color:var(--v3-ink-2);line-height:1.55}.sop-kpis,.definition-card-assets,.sop-runtime{background:var(--v3-soft);border:0;border-radius:10px}.sop-status,.definition-version,.health-dot-card+b{font-weight:650}.recent-runs button{background:transparent;border-color:var(--v3-line)}

/* Flow studio */
.view#flowView.active{background:var(--v3-bg)}.flow-commandbar{min-height:70px;margin:14px 18px 10px;padding:10px 12px;background:var(--v3-surface);border-radius:13px}.flow-command-main{min-width:0}.flow-command-main select{min-width:280px;background:var(--v3-soft);border-color:transparent}.flow-command-main b{color:var(--v3-ink)}.flow-command-main span{color:var(--v3-ink-3)}.flow-workbench{grid-template-columns:260px minmax(480px,1fr) 360px;gap:10px;padding:0 18px 18px}.flow-outline-panel,.properties{border-radius:13px;overflow:hidden}.flow-panel-head,.properties-header{background:var(--v3-surface);border-color:var(--v3-line)}.flow-quick-add{padding:10px;background:var(--v3-soft);border-color:var(--v3-line)}.flow-quick-add button{background:var(--v3-surface);border:1px solid var(--v3-line);border-radius:10px;color:var(--v3-ink-2)}.flow-quick-add button:hover{border-color:var(--v3-accent);color:var(--v3-accent-ink);transform:translateY(-1px)}.flow-outline-item{border:1px solid transparent;border-radius:9px}.flow-outline-item:hover{background:var(--v3-soft)}.flow-outline-item.active{background:var(--v3-accent-soft);border-color:color-mix(in srgb,var(--v3-accent) 28%,transparent);color:var(--v3-accent-ink)}.workspace-wrap{border:1px solid var(--v3-line);border-radius:13px;overflow:hidden;background:var(--v3-surface)}.canvas-toolbar{background:var(--v3-surface);border-color:var(--v3-line)}.canvas{background-color:var(--v3-soft)}.canvas-grid{opacity:.38}.flow-node{background:var(--v3-surface);border-color:var(--v3-line-2);border-radius:13px;box-shadow:0 6px 20px rgba(16,24,40,.08)}.flow-node.selected{border-color:var(--v3-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--v3-accent) 13%,transparent),0 10px 28px rgba(16,24,40,.1)}.node-title{color:var(--v3-ink)}.node-subtitle,.node-body{color:var(--v3-ink-3)}.prop-card{border-color:var(--v3-line);border-radius:11px;overflow:hidden;background:var(--v3-surface)}.prop-card summary{background:var(--v3-soft)}.prop-card-body{background:var(--v3-surface)}.flow-settings-panel{margin:0 18px 10px}

/* Observability, projects and assets */
.observability-tabs,.asset-tabs,.project-tabs{background:var(--v3-surface);border:1px solid var(--v3-line);border-radius:11px;padding:4px}.observability-tabs button,.asset-tabs button,.project-tabs button{border-radius:8px;color:var(--v3-ink-2)}.observability-tabs button.active,.asset-tabs button.active,.project-tabs button.active{background:var(--v3-ink);color:var(--v3-surface);box-shadow:none}.chart-card,.analytics-card,.project-card,.asset-card{background:var(--v3-surface);border-color:var(--v3-line);border-radius:var(--v3-radius);box-shadow:0 1px 2px rgba(16,24,40,.04)}.chart-card h3,.analytics-card h3,.project-card h3,.asset-card h3{color:var(--v3-ink)}.chart-grid-line{stroke:var(--v3-line)}.project-card:hover,.asset-card:hover{border-color:var(--v3-line-2);box-shadow:var(--v3-shadow);transform:translateY(-2px)}

/* Focused modal workflows */
.modal{background:rgba(18,20,27,.36);backdrop-filter:blur(8px)}.modal-card,.agent-modal-card,.sop-create-card,.issue-detail-shell{background:var(--v3-surface);border:1px solid color-mix(in srgb,var(--v3-line-2) 70%,transparent);border-radius:18px;box-shadow:0 30px 80px rgba(15,23,42,.2)}.modal-header,.agent-modal-header,.sop-create-header{background:var(--v3-surface);border-color:var(--v3-line)}.modal-header h2,.agent-modal-header h2,.sop-create-header h2{color:var(--v3-ink);letter-spacing:-.025em}.agent-wizard-steps,.sop-create-steps{background:var(--v3-soft);border-color:var(--v3-line)}.agent-step-dot,.sop-create-step i{background:var(--v3-surface);border-color:var(--v3-line-2);color:var(--v3-ink-3)}.agent-step.active .agent-step-dot,.sop-create-step.active i{background:var(--v3-ink);border-color:var(--v3-ink);color:var(--v3-surface)}.agent-preset-grid button,.template-choice{background:var(--v3-soft);border-color:var(--v3-line);border-radius:12px}.agent-preset-grid button:hover,.template-choice:hover,.template-choice.active{border-color:var(--v3-accent);background:var(--v3-accent-soft)}.wizard-actions,.sop-create-actions{background:var(--v3-surface);border-color:var(--v3-line)}.toast{background:var(--v3-ink);color:var(--v3-surface);border:0;border-radius:10px;box-shadow:var(--v3-shadow)}

@media(max-width:1280px){.app-shell{grid-template-columns:218px minmax(0,1fr)}.platform-sidebar{width:218px}.page-view.active{padding:24px 22px 40px}.dash-grid{grid-template-columns:1fr 1fr}.dash-col-right{grid-column:1/-1;min-height:auto!important}.flow-workbench{grid-template-columns:230px minmax(430px,1fr) 330px;padding-inline:10px}}
@media(max-width:960px){.app-shell{grid-template-columns:72px minmax(0,1fr)}.platform-sidebar{width:72px;padding-inline:6px}.brand-text,.workspace-switch div,.platform-sidebar nav p,.sidebar-bottom div,.platform-sidebar .nav-label,.platform-sidebar .nav-group-chevron,.platform-sidebar .nav-submenu{display:none!important}.workspace-switch{padding:0;width:44px;height:44px;margin:6px auto;justify-content:center}.platform-sidebar .nav{justify-content:center;padding:0;width:44px;height:42px;margin:3px auto}.flow-workbench{grid-template-columns:220px minmax(460px,1fr)}.properties{position:fixed;z-index:30;right:14px;top:78px;bottom:14px;width:360px;box-shadow:var(--v3-shadow)}}