#flows-app{--fl-bg:#f6f8f9;--fl-paper:#fff;--fl-ink:#18282e;--fl-muted:#52646c;--fl-line:#dce5e8;--fl-accent:#006f80;--fl-soft:#e8f4f6;--fl-warn:#925d0b;box-sizing:border-box;min-height:100dvh;padding:28px;max-width:1600px;margin:auto;background:var(--fl-bg);color:var(--fl-ink);font:14px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}#flows-app *{box-sizing:border-box}#flows-app :is(button,input,textarea,select){font:inherit;color:inherit}#flows-app button,#flows-app .fl-link{border:1px solid var(--fl-line);background:var(--fl-paper);border-radius:7px;padding:9px 14px;min-height:40px;cursor:pointer}#flows-app button:hover{background:var(--fl-soft)}#flows-app button:disabled{opacity:.5;cursor:default}#flows-app :is(button,input,textarea,select,a,summary):focus-visible{outline:2px solid var(--fl-accent);outline-offset:3px}#flows-app .fl-primary{background:var(--fl-accent);color:#fff;border-color:var(--fl-accent)}#flows-app a{color:var(--fl-accent);text-underline-offset:3px}#flows-app h1{font-size:28px;letter-spacing:-.7px;font-weight:650;margin:0}#flows-app h2{font-size:19px;letter-spacing:-.3px;margin:0}#flows-app h3{font-size:15px;margin:0 0 10px}#flows-app p{margin:10px 0}#flows-app .fl-head,#flows-app .fl-toolbar,#flows-app .fl-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}#flows-app .fl-head{justify-content:space-between;margin-bottom:24px}#flows-app .fl-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:24px}#flows-app .fl-tabs button{border-color:transparent;background:transparent}#flows-app .fl-tabs button[aria-pressed=true]{background:var(--fl-paper);box-shadow:0 1px 3px #18282e12;color:var(--fl-accent)}#flows-app .fl-toolbar{justify-content:space-between;margin:20px 0 16px}#flows-app .fl-toolbar input{max-width:360px}#flows-app .fl-muted{color:var(--fl-muted);font-size:13px}#flows-app .fl-notice{padding:12px 15px;background:var(--fl-soft);border-radius:7px;margin-bottom:18px}#flows-app .fl-notice:empty{display:none}#flows-app .fl-notice[role=alert]{color:var(--fl-warn);background:#fbf1dd}#flows-app .fl-table-wrap{overflow:auto;border-radius:10px;background:var(--fl-paper)}#flows-app table{width:100%;border-collapse:collapse;text-align:left;white-space:nowrap}#flows-app th{font-weight:500;font-size:12px;color:var(--fl-muted);padding:12px 16px;background:var(--fl-paper)}#flows-app td{padding:16px;border-top:1px solid var(--fl-line);font-size:13px;vertical-align:top}#flows-app td:first-child{white-space:normal;min-width:150px}#flows-app td small{display:block;color:var(--fl-muted);margin-top:3px}#flows-app td button{min-height:32px;padding:5px 10px;margin:0 4px 4px 0;font-size:12px}#flows-app .fl-state{display:inline-block;padding:3px 8px;border-radius:5px;background:var(--fl-bg);font-size:12px}#flows-app .fl-empty{padding:60px 25px;text-align:center;background:var(--fl-paper);border-radius:10px;color:var(--fl-muted)}#flows-app .fl-empty h2{color:var(--fl-ink)}#flows-app input,#flows-app select,#flows-app textarea{width:100%;border:1px solid #81939b;border-radius:6px;min-height:42px;padding:9px 11px;background:var(--fl-paper)}#flows-app textarea{min-height:110px;resize:vertical}#flows-app label{display:flex;flex-direction:column;gap:6px;font-size:13px}#flows-app .fl-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}#flows-app .fl-full{grid-column:1/-1}#flows-app .fl-check{display:flex;flex-direction:row;align-items:center;gap:10px;padding:7px 0}#flows-app .fl-check input{width:18px;min-height:18px}#flows-app dialog{width:min(760px,calc(100vw - 32px));max-height:calc(100dvh - 32px);border:1px solid var(--fl-line);border-radius:12px;padding:24px;background:var(--fl-paper);color:var(--fl-ink);box-shadow:0 18px 70px #18282e30}#flows-app dialog::backdrop{background:#13262e80}#flows-app dialog .fl-head{margin-bottom:18px}#flows-app dialog form{display:grid;gap:18px}#flows-app .fl-footer{display:flex;justify-content:flex-end;gap:10px;margin-top:8px;flex-wrap:wrap}#flows-app fieldset{border:0;margin:0;padding:16px;background:var(--fl-bg);border-radius:8px;min-width:0}#flows-app legend{font-size:14px;font-weight:600;padding:0 6px}#flows-app .fl-steps{display:grid;gap:20px}#flows-app .fl-audience{max-height:240px;overflow:auto;padding:8px 12px;background:var(--fl-bg);border-radius:7px}#flows-app .fl-split{display:grid;grid-template-columns:minmax(220px,30%) minmax(0,1fr);gap:20px}#flows-app .fl-conversations{display:grid;gap:6px;align-content:start}#flows-app .fl-conversations button{text-align:left;padding:14px}#flows-app .fl-thread{background:var(--fl-paper);padding:24px;border-radius:10px;min-height:400px}#flows-app .fl-message{padding:14px 16px;margin:14px 0;white-space:pre-wrap;background:var(--fl-bg);border-radius:8px;overflow-wrap:anywhere}#flows-app .fl-message small{display:block;color:var(--fl-muted);margin-bottom:5px}#flows-app pre{white-space:pre-wrap;overflow-wrap:anywhere;font:inherit;background:var(--fl-bg);padding:14px;border-radius:7px}#flows-app .fl-code{overflow-wrap:anywhere;font-size:13px}#flows-app .fl-help{padding:14px 0;color:var(--fl-muted);font-size:13px}#flows-app summary{cursor:pointer;min-height:32px;padding:6px 0}#flows-app [hidden]{display:none!important}
@media(max-width:640px){#flows-app{padding:18px 12px}#flows-app h1{font-size:24px}#flows-app .fl-head{gap:10px;margin-bottom:18px}#flows-app .fl-grid{grid-template-columns:1fr}#flows-app .fl-tabs{gap:2px}#flows-app .fl-tabs button{padding-inline:10px}#flows-app button,#flows-app select,#flows-app input{min-height:44px}#flows-app .fl-split{grid-template-columns:1fr}#flows-app dialog{padding:18px;width:calc(100vw - 16px)}#flows-app input,#flows-app select,#flows-app textarea{font-size:16px}#flows-app .fl-toolbar{align-items:stretch}#flows-app .fl-footer button{flex:1}#flows-app .fl-thread{padding:16px}#flows-app .fl-audience{max-height:200px}}
@media(prefers-color-scheme:dark){#flows-app{color-scheme:dark;--fl-bg:#151c20;--fl-paper:#20282d;--fl-ink:#eaf0f2;--fl-muted:#aebec5;--fl-line:#35434a;--fl-accent:#6dd2e5;--fl-soft:#233b43}#flows-app .fl-primary{color:#14272e}#flows-app .fl-notice[role=alert]{color:#e8bd68;background:#443b28}}
@media(prefers-reduced-motion:reduce){#flows-app *{scroll-behavior:auto!important}}

#flows-app .fl-steps fieldset{display:grid;gap:14px}#flows-app .fl-audience .fl-toolbar{margin:10px 0}#flows-app .fl-audience input[type=search]{min-width:0}

#flows-app dialog>.fl-head{position:sticky;top:-24px;z-index:2;background:var(--fl-paper);margin:-24px -24px 18px;padding:16px 24px;border-bottom:1px solid var(--fl-line)}#flows-app .fl-steps fieldset>button{justify-self:end;min-height:36px;padding:6px 10px;font-size:12px}@media(max-width:640px){#flows-app dialog>.fl-head{top:-18px;margin:-18px -18px 18px;padding:12px 18px}}

#flows-app .fl-media-picker{margin-block:12px}#flows-app .fl-media-preview{display:flex;flex-direction:column;align-items:flex-start;gap:8px;max-width:100%;margin-block:10px}#flows-app .fl-media-preview img,#flows-app .fl-media-preview video{max-width:100%;max-height:260px;object-fit:contain;border-radius:8px}#flows-app .fl-media-preview audio{max-width:100%;width:300px}#flows-app .fl-media-preview a{overflow-wrap:anywhere;color:inherit;text-underline-offset:3px}#flows-app .fl-template-preview{white-space:pre-wrap;background:var(--fl-paper);border-radius:8px;padding:14px;line-height:1.5}#flows-app .fl-media-picker input[type=file]{width:100%;max-width:100%}

#flows-app .fl-message-options{display:grid;gap:14px}#flows-app .fl-media-picker input::file-selector-button{font:inherit;border:0;border-right:1px solid var(--fl-line);padding:2px 10px 2px 0;margin-right:10px;background:transparent;color:inherit;cursor:pointer}

#flows-app button.fl-primary:hover{background:#005b69;color:#fff}
#flows-app .fl-destination-choice{display:grid;gap:12px}
#flows-app .fl-destination-select{display:flex;flex-direction:row;align-items:center;gap:10px;min-height:44px}
#flows-app .fl-destination-select input{width:18px;min-height:18px;flex:0 0 18px}
#flows-app .fl-destination-select span{min-width:0;overflow-wrap:anywhere}
/* Keep connection state and actions in reading order on narrow screens. */
@media(max-width:640px){
 #flows-app .fl-accounts-table{overflow:visible;background:transparent;border-radius:0}
 #flows-app .fl-accounts-table table{display:block;white-space:normal}
 #flows-app .fl-accounts-table thead{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 #flows-app .fl-accounts-table tbody{display:grid;gap:12px}
 #flows-app .fl-accounts-table tr{display:grid;min-width:0;padding:16px;background:var(--fl-paper);border-radius:10px}
 #flows-app .fl-accounts-table td{display:block;min-width:0;padding:0;border:0;white-space:normal;overflow-wrap:anywhere}
 #flows-app .fl-accounts-table td:first-child{min-width:0;font-size:16px;font-weight:600}
 #flows-app .fl-accounts-table td:nth-child(2){margin-top:3px;color:var(--fl-muted)}
 #flows-app .fl-accounts-table td:nth-child(3){padding-top:12px}
 #flows-app .fl-accounts-table td small{font-size:13px}
 #flows-app .fl-accounts-table td:last-child{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;padding-top:14px;border-top:1px solid var(--fl-line)}
 #flows-app .fl-accounts-table td button{max-width:100%;min-height:44px;margin:0;padding:9px 12px;white-space:normal;overflow-wrap:anywhere}
}
