.automation-grid{display:grid;grid-template-columns:minmax(14rem,18rem) minmax(0,1fr);gap:var(--space-6);align-items:start}
@media (max-width:52rem){.automation-grid{grid-template-columns:minmax(0,1fr)}}
.automation-list{display:grid;gap:var(--space-3);padding:var(--space-4);border:1px solid var(--border);border-radius:var(--radius);background:var(--raised)}
.automation-list-head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2)}
.automation-list h2{margin:0;font-size:1rem}
.automation-list ul{list-style:none;margin:0;padding:0;display:grid;gap:var(--space-2)}
.automation-process{width:100%;display:grid;gap:var(--space-1);text-align:left;font:inherit;color:var(--text);padding:var(--space-3);border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--page);cursor:pointer}
.automation-process[aria-current="true"]{border-color:var(--brand-action);background:var(--brand-soft)}
.automation-process:hover{border-color:var(--control-border)}
.automation-process:focus-visible,.flow-body:focus-visible,.flow-switch button:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.automation-main{display:grid;gap:var(--space-4);min-width:0}
.describe{display:grid;gap:var(--space-2);padding:var(--space-4);border:1px solid var(--border);border-radius:var(--radius);background:var(--raised)}
.describe textarea,.questions textarea{font:inherit;padding:var(--space-2) var(--space-3);border:1px solid var(--control-border);border-radius:var(--radius-sm);background:var(--page);color:var(--text);resize:vertical;min-width:0}
.automation-work{display:grid;grid-template-columns:minmax(0,1fr) minmax(18rem,26rem);gap:var(--space-6);align-items:start}
@media (max-width:70rem){.automation-work{grid-template-columns:minmax(0,1fr)}}
.flow{display:grid;gap:var(--space-3);padding:var(--space-4);border:1px solid var(--border);border-radius:var(--radius);background:var(--inset);min-width:0}
.flow-count{font-size:.875rem}
.flow-line{list-style:none;margin:0;padding:0;display:grid;gap:0;justify-items:start}
.flow-end{font-size:.8125rem;font-weight:600;color:var(--text-secondary);padding:var(--space-1) var(--space-3);border:1px solid var(--border);border-radius:999px;background:var(--page)}
.flow-item{display:grid;justify-items:start;width:100%}
.flow-arrow{width:2px;height:var(--space-6);margin-left:var(--space-6);background:var(--control-border);position:relative}
.flow-arrow::after{content:"";position:absolute;left:-4px;bottom:-1px;border:5px solid transparent;border-top:7px solid var(--control-border);border-bottom:0}
.flow-box{width:min(100%,24rem);display:grid;border:2px solid var(--border);background:var(--page);color:var(--text)}
.flow-box.flow-agent{border-color:var(--brand-action);background:var(--brand-soft);border-radius:var(--space-1) var(--space-6) var(--space-1) var(--space-6)}
.flow-box.flow-person{border-style:solid;border-radius:var(--space-6) var(--space-1) var(--space-6) var(--space-1)}
.flow-box.flow-either{border-style:dashed;border-color:var(--brand-action);background:linear-gradient(90deg,var(--brand-soft) 0 50%,var(--page) 50% 100%);border-radius:var(--space-6)}
.flow-box.flow-open{box-shadow:0 0 0 3px var(--focus)}
.flow-body{display:grid;gap:var(--space-1);text-align:left;font:inherit;color:inherit;background:none;border:0;padding:var(--space-3) var(--space-4) var(--space-2);cursor:pointer}
.flow-who{display:inline-flex;align-items:center;gap:var(--space-2);font-size:.75rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--text-secondary)}
.flow-agent .flow-who,.flow-either .flow-who{color:var(--brand-action)}
.flow-then{font-size:.8125rem;font-weight:600;color:var(--text);border-top:1px dashed var(--control-border);padding-top:var(--space-1)}
.flow-glyph{width:1.125rem;height:1.125rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.flow-name{font-weight:600;overflow-wrap:anywhere}
.flow-switch{display:flex;gap:var(--space-1);padding:0 var(--space-4) var(--space-3)}
.flow-switch button{flex:1;font:inherit;font-size:.8125rem;padding:var(--space-1) var(--space-2);min-height:2rem;border:1px solid var(--control-border);background:var(--page);color:var(--text-secondary);border-radius:var(--radius-sm);cursor:pointer}
.flow-switch button[aria-pressed="true"]{background:var(--brand-action);border-color:var(--brand-action);color:var(--brand-on-action);font-weight:600;cursor:default}
.flow-person .flow-switch button[aria-pressed="true"]{background:var(--text);border-color:var(--text);color:var(--page)}
.flow-either .flow-switch button[aria-pressed="true"]{background:var(--page);border:2px dashed var(--brand-action);color:var(--text)}
.questions{display:grid;gap:var(--space-4);padding:var(--space-4);border:1px solid var(--border);border-radius:var(--radius);background:var(--raised)}
.ask{display:grid;gap:var(--space-2);border:0;padding:0;margin:0;min-width:0}
.ask legend{display:flex;align-items:center;gap:var(--space-2);font-weight:600;padding:0;margin-bottom:var(--space-2)}
.ask legend span{display:inline-grid;place-items:center;width:1.5rem;height:1.5rem;border-radius:50%;background:var(--brand-soft);color:var(--brand-action);font-size:.8125rem}
.ask label:not(.experience-field){display:flex;gap:var(--space-2);align-items:center}
.ask p{margin:0}
.ask-stray{color:var(--danger)}
.ask-row{display:flex;flex-wrap:wrap;gap:var(--space-2)}
.ask-fields{list-style:none;margin:0;padding:0;display:grid;gap:var(--space-2)}
.ask-fields li{display:flex;flex-wrap:wrap;gap:var(--space-2);align-items:center}
.ask-fields input,.ask-fields select,.questions select{font:inherit;padding:var(--space-2) var(--space-3);border:1px solid var(--control-border);border-radius:var(--radius-sm);background:var(--page);color:var(--text);min-width:0}
.ask-fields input{flex:1 1 10rem}
.who-choice{display:flex;flex-wrap:wrap;gap:var(--space-4)}
.automation-issues{margin:0;padding-left:var(--space-4);display:grid;gap:var(--space-1)}
.saved{display:grid;gap:var(--space-2);flex-basis:100%;justify-items:start}
.saved p{margin:0}
.rules-confirm{display:grid;gap:var(--space-2);padding:var(--space-3);border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--page)}.rules-confirm h2{margin:0;font-size:1rem}.rules-confirm ul{margin:0;padding-left:var(--space-4);display:grid;gap:var(--space-1)}
.flow-draw{display:flex;gap:var(--space-1);padding:0 var(--space-4) var(--space-3)}
.flow-draw button{flex:1;font:inherit;font-size:.8125rem;min-height:2rem;padding:var(--space-1) var(--space-2);border:1px dashed var(--control-border);background:transparent;color:var(--text-secondary);border-radius:var(--radius-sm);cursor:pointer}
.flow-draw button:hover{border-style:solid;color:var(--text)}
.flow-draw button:focus-visible,.start-tabs button:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.start-tabs{display:flex;flex-wrap:wrap;gap:var(--space-2)}
.start-tabs button{font:inherit;font-size:.9375rem;min-height:2.5rem;padding:var(--space-2) var(--space-4);border:1px solid var(--control-border);border-radius:var(--radius-sm);background:var(--page);color:var(--text);cursor:pointer}
.start-tabs button[aria-pressed="true"]{background:var(--brand-action);border-color:var(--brand-action);color:var(--brand-on-action);font-weight:600}
.start-panel{display:grid;gap:var(--space-2)}
.start-panel p{margin:0}
.start-panel textarea,.start-panel select{font:inherit;padding:var(--space-2) var(--space-3);border:1px solid var(--control-border);border-radius:var(--radius-sm);background:var(--page);color:var(--text);resize:vertical;min-width:0}
.start-sketch{max-width:min(100%,24rem);max-height:16rem;object-fit:contain;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--page)}
