/* Workflows shares the existing shell and background. */
#pageWorkflows { padding-top: 12px; }
.wf-root { --wf-red:#ff263f; --wf-muted:#b0b1ba; --wf-line:#ffffff19; color:var(--fd-text,#f5f5f6); max-width:1320px; margin:0 auto; padding:12px 0 30px; }
.wf-root *, .wf-dialog *, .wf-root *::before, .wf-dialog *::before { box-sizing:border-box; }
.wf-root h1,.wf-root h2,.wf-root p,.wf-dialog h2,.wf-dialog h3,.wf-dialog p { margin:0; }
.wf-root button,.wf-dialog button,.wf-dialog input,.wf-dialog select { font:inherit; }
.wf-root button,.wf-dialog button { cursor:pointer; touch-action:manipulation; }
.wf-root button:disabled,.wf-dialog button:disabled { opacity:.45; cursor:default; }
.wf-root svg,.wf-dialog svg { width:21px; height:21px; flex-shrink:0; }
.wf-root button:focus-visible,.wf-root summary:focus-visible,.wf-dialog :is(button,input,select,a):focus-visible { outline:2px solid #ff8b9b; outline-offset:4px; }
.wf-heading { display:flex; align-items:center; gap:12px; }
.wf-heading h1 { font-size:clamp(30px,3vw,40px); font-weight:650; letter-spacing:-.035em; line-height:1.2; }
.wf-beta { display:inline-flex; color:#ff4057; background:#c4122a20; border:1px solid #ed29474d; border-radius:11px; padding:4px 10px; font-size:12px; font-weight:600; letter-spacing:.02em; }
.wf-empty { min-height:calc(100dvh - 165px); max-width:750px; margin:auto; padding:32px 16px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; }
.wf-empty .wf-heading { flex-direction:column-reverse; gap:16px; margin-bottom:18px; }
.wf-empty .wf-heading h1 { font-size:42px; }
.wf-empty-header,.wf-create-panel,.wf-panel-start { display:contents; }
.wf-panel-start[hidden] { display:none; }
.wf-empty > h2,.wf-empty-header > h2 { font-size:25px; font-weight:600; line-height:1.4; letter-spacing:-.025em; }
.wf-empty > p,.wf-empty-header > p { font-size:16px; line-height:1.65; color:#c2c4cb; max-width:630px; margin:14px 0 0; }
.wf-primary { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:46px; padding:11px 23px; border-radius:12px; border:1px solid #ff526b; background:linear-gradient(165deg,#ff2843 0%,#ea152f 48%,#a90723 100%); box-shadow:inset 0 1px #ffffff2b,0 4px 22px #f3153424; color:#fff; font-weight:550; transition:box-shadow .18s,filter .18s; }
.wf-primary:hover:not(:disabled) { filter:brightness(1.09); box-shadow:inset 0 1px #ffffff2b,0 5px 28px #f3153440; }
.wf-empty .wf-new { width:min(100%,368px); min-height:60px; margin:28px 0 42px; font-size:17px; border-radius:14px; box-shadow:inset 0 1px #ffffff2b,0 0 34px #fa15362e; }
.wf-process { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px 18px; width:100%; max-width:650px; padding:0; margin:0; list-style:none; text-align:left; }
.wf-process li { position:relative; min-width:0; display:grid; align-content:start; gap:8px; }
.wf-process-step { display:grid; place-items:center; width:28px; height:28px; margin-bottom:3px; border:1px solid #ffffff24; border-radius:9px; background:linear-gradient(145deg,#ffffff0b,#ffffff02); color:#f5bcc4; font-size:12px; font-weight:600; box-shadow:inset 0 1px #ffffff09; }
.wf-process h3 { margin:0; color:#eceef2; font-size:13px; font-weight:550; line-height:1.4; }
.wf-process p { color:#b0b5c0; line-height:1.55; font-size:12px; }
.wf-how { display:flex; justify-content:center; align-items:center; gap:12px; padding:28px 12px 4px; margin-top:38px; width:100%; max-width:650px; border:0; border-top:1px solid var(--wf-line); background:none; color:#c3c9d0; font-size:15px; }
.wf-glass { background:linear-gradient(130deg,#ffffff06,#ffffff01 55%,#9f142908),#0e1318a8; border:1px solid var(--wf-line); border-radius:15px; box-shadow:inset 0 1px #ffffff06,0 8px 26px #0002; backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); }
.wf-toolbar { display:flex; justify-content:space-between; align-items:center; gap:24px; margin:8px 0 25px; }
.wf-toolbar > div > p { color:var(--wf-muted); font-size:15px; line-height:1.6; margin-top:12px; }
.wf-toolbar-actions { display:flex; align-items:center; gap:14px; }
.wf-icon-button { display:inline-grid; place-items:center; min-width:44px; min-height:44px; padding:9px; border:1px solid transparent; border-radius:10px; color:#cbd0d8; background:transparent; }
.wf-icon-button:hover { background:#ffffff0c; border-color:#ffffff12; }
.wf-usage-row { display:flex; align-items:center; flex-wrap:wrap; gap:20px; margin-bottom:24px; }
.wf-usage { display:flex; align-items:center; gap:15px; width:100%; max-width:470px; padding:16px 18px; }
.wf-usage > svg { width:27px; height:27px; }
.wf-usage > div { flex:1; min-width:0; }
.wf-usage strong { display:block; font-size:14px; font-weight:600; }
.wf-usage strong span { font-weight:400; color:#d1d3da; }
.wf-usage > div > span { display:block; color:var(--wf-muted); font-size:12px; line-height:1.5; }
.wf-root progress { display:block; appearance:none; -webkit-appearance:none; border:0; height:8px; width:100%; border-radius:99px; overflow:hidden; background:#ffffff0b; }
.wf-root progress::-webkit-progress-bar { background:#ffffff0b; border-radius:99px; }
.wf-root progress::-webkit-progress-value { background:linear-gradient(90deg,#ff263f,#c5132d); border-radius:99px; }
.wf-root progress::-moz-progress-bar { background:linear-gradient(90deg,#ff263f,#c5132d); border-radius:99px; }
.wf-usage progress { margin:8px 0 7px; }
.wf-capacity-note { max-width:350px; font-size:13px; color:var(--wf-muted); line-height:1.5; }
.wf-filters { display:flex; gap:22px; border-bottom:1px solid var(--wf-line); margin-bottom:24px; overflow-x:auto; }
.wf-filters button { white-space:nowrap; min-height:45px; padding:0 2px 12px; background:none; border:0; border-bottom:2px solid transparent; color:#aeb4be; font-size:13px; }
.wf-filters button[aria-pressed=true] { border-color:var(--wf-red); color:#fff; }
.wf-filters span { opacity:.8; }
.wf-cards { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,310px),1fr)); align-items:start; gap:20px; }
.wf-card { min-width:0; max-width:440px; padding:21px; }
.wf-card-top { display:flex; gap:14px; align-items:center; position:relative; }
.wf-thumb { width:64px; height:64px; display:grid; place-items:center; flex-shrink:0; border:1px solid #ffffff15; border-radius:10px; background:radial-gradient(circle at 72% 40%,#eb183e2b,transparent 55%),linear-gradient(135deg,#1f29335e,#080e12aa); color:#aeb8c6; }
.wf-thumb svg { width:34px; height:34px; }
.wf-card-title { flex:1; min-width:0; }
.wf-card h2 { font-size:17px; font-weight:600; letter-spacing:-.025em; line-height:1.35; overflow-wrap:anywhere; }
.wf-status { display:inline-block; font-size:11px; color:#cad1dc; border:1px solid #ffffff22; background:#9aabc512; border-radius:20px; padding:3px 9px; margin-top:7px; }
.wf-status.is-running { color:#c6fce7; background:#0c7e6545; border-color:#24ad895c; }
.wf-status.is-held { color:#ffccae; background:#b360201f; border-color:#b3783a55; }
.wf-menu { margin-left:auto; align-self:flex-start; }
.wf-menu summary { min-width:44px; min-height:44px; display:grid; place-items:center; font-size:24px; line-height:1; list-style:none; cursor:pointer; border-radius:7px; }
.wf-menu summary::-webkit-details-marker { display:none; }
.wf-menu[open] summary { background:#ffffff12; }
.wf-menu > div { position:absolute; right:0; top:48px; z-index:4; display:flex; flex-direction:column; padding:5px; width:170px; background:#181b22; border:1px solid #ffffff25; border-radius:11px; box-shadow:0 12px 35px #0009; }
.wf-menu button { text-align:left; min-height:40px; padding:8px 11px; background:none; border:0; color:#e9eaf0; border-radius:6px; font-size:13px; }
.wf-menu button:hover { background:#ffffff0c; }
.wf-menu [data-wf=delete] { color:#ff8b9b; }
.wf-card-description { margin:17px 0 !important; font-size:13px; color:#b1b7c1; line-height:1.6; }
.wf-tags { display:flex; flex-wrap:wrap; gap:10px 13px; margin-bottom:24px; font-size:11px; color:#c4cad4; }
.wf-tags span { display:inline-flex; align-items:center; gap:5px; }
.wf-tags svg { width:13px; height:13px; }
.wf-progress p { font-size:13px; color:#c4c8d1; margin-bottom:9px; }
.wf-progress p strong { color:#fff; font-weight:600; }
.wf-progress > span { display:block; margin:8px 0 17px; color:#a9b0bb; font-size:12px; line-height:1.5; }
.wf-run,.wf-secondary { display:inline-flex; justify-content:center; align-items:center; gap:10px; min-height:46px; padding:10px 18px; border-radius:10px; background:linear-gradient(145deg,#ffffff08,#ffffff02),#131b23a6; border:1px solid #ffffff22; color:#f3f5f9; font-size:14px; }
.wf-run { width:100%; margin-top:8px; font-weight:550; }
.wf-run.is-ready { border-color:#d2dce138; box-shadow:inset 0 1px #ffffff08; }
.wf-run:hover:not(:disabled),.wf-secondary:hover:not(:disabled) { border-color:#ff4c6869; background:linear-gradient(145deg,#dd20311a,#141820); }
.wf-text { border:0; background:transparent; color:#e1e3eb; padding:4px 0; text-align:left; text-decoration:underline; text-underline-offset:4px; font-size:13px; }
.wf-inline-error,.wf-notice { font-size:13px; color:#ffc3b4; line-height:1.6; margin:10px 0 !important; }
.wf-notice { color:#cbd8dc; padding:12px 15px; border:1px solid #ffffff18; background:#ffffff04; border-radius:10px; }
.wf-filter-empty { color:var(--wf-muted); font-size:14px; padding:20px 0; }
.wf-root .wf-desktop-only,.wf-root .wf-desktop-action { display:none !important; }
@media(min-width:768px) {
  .wf-root:has(.wf-cards) { max-width:1440px; position:relative; }
  .wf-root .wf-desktop-only { display:initial !important; }
  .wf-root .wf-mobile-only { display:none !important; }
  .wf-toolbar { margin-bottom:22px; }
  .wf-usage-row { width:100%; margin-bottom:20px; }
  .wf-usage { max-width:none; width:100%; gap:14px; padding:16px 20px; min-height:65px; }
  .wf-usage > svg { width:20px; height:20px; }
  .wf-usage > div { display:grid; grid-template-columns:max-content minmax(80px,1fr) minmax(180px,auto); align-items:center; gap:20px; }
  .wf-usage strong { font-size:13px; }
  .wf-usage progress { height:5px; margin:0; }
  .wf-usage > div > span { text-align:right; font-size:12px; max-width:300px; }
  .wf-root .wf-connect.wf-desktop-only { display:inline-flex !important; align-items:center; justify-content:center; flex-shrink:0; min-height:38px; padding:8px 13px; border:1px solid #ffffff25; border-radius:8px; background:#ffffff07; color:#edf0f5; font-size:12px; }
  .wf-connect:hover { background:#ffffff10 !important; border-color:#ffffff40 !important; }
  .wf-root .wf-filters.wf-desktop-only { display:flex !important; }
  .wf-filters { gap:25px; margin-bottom:18px; }
  .wf-filters button { min-height:43px; padding-bottom:11px; }
  .wf-cards { display:grid; grid-template-columns:minmax(0,1fr); gap:14px; width:100%; }
  .wf-card { display:grid; grid-template-columns:minmax(0,1fr) minmax(180px,1fr) minmax(150px,1fr); align-items:center; gap:32px; position:relative; max-width:none; width:100%; min-height:128px; padding:23px 78px 23px 25px; }
  .wf-card:has(.wf-menu[open]) { z-index:3; }
  .wf-card-main,.wf-card-progress { min-width:0; }
  .wf-card-progress { width:100%; max-width:260px; justify-self:center; }
  .wf-card-top { position:static; gap:0; }
  .wf-card .wf-thumb,.wf-card .wf-status,.wf-card-description { display:none; }
  .wf-card h2 { font-size:18px; }
  .wf-tags { gap:8px 14px; margin:12px 0 0; font-size:12px; line-height:1.4; }
  .wf-root .wf-tags > .wf-desktop-only { display:inline-flex !important; }
  .wf-card .wf-menu { position:absolute; top:50%; right:16px; transform:translateY(-50%); margin:0; }
  .wf-root .wf-menu button.wf-desktop-action { display:block !important; }
  .wf-card .wf-progress p { font-size:13px; margin-bottom:8px; }
  .wf-card .wf-progress p strong { font-size:15px; }
  .wf-card .wf-progress progress { height:5px; }
  .wf-card .wf-progress > span { margin:7px 0 0; font-size:12px; }
  .wf-card-progress .wf-inline-error { margin:8px 0 0 !important; font-size:12px; line-height:1.45; }
  .wf-card > .wf-run { margin:0; min-height:48px; max-width:150px; justify-self:end; font-size:14px; }
  .wf-card > .wf-run:not(:disabled) { color:#fff; border-color:#ff47625c; background:linear-gradient(160deg,#ef2344,#b5092a); box-shadow:inset 0 1px #ffffff1c,0 5px 18px #e21b3315; }
  .wf-card > .wf-run:not(:disabled):hover { background:linear-gradient(160deg,#ff3656,#c80d31); border-color:#ff6c8499; }
  .wf-root .wf-success { position:absolute; width:1px; height:1px; padding:0; margin:-1px !important; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
  .wf-root:has(.wf-create-panel) { max-width:1440px; }
  .wf-empty:has(.wf-create-panel) { width:100%; max-width:none; min-height:0; padding:20px 0 40px; display:block; text-align:left; }
  .wf-empty-header { display:block; max-width:800px; margin-bottom:34px; }
  .wf-empty-header .wf-heading { flex-direction:row; gap:13px; margin-bottom:24px; }
  .wf-empty-header .wf-heading h1 { font-size:40px; }
  .wf-empty-header > h2 { font-size:28px; }
  .wf-empty-header > p { max-width:760px; margin-top:12px; font-size:16px; line-height:1.75; }
  .wf-create-panel { --wf-panel-height:clamp(500px,62vh,680px); display:grid; place-items:center; min-height:var(--wf-panel-height); border:1px solid #ffffff20; border-radius:24px; background:linear-gradient(125deg,#ffffff07,#ffffff01 55%,#9f142908),#0e131866; box-shadow:inset 0 1px #ffffff09,0 18px 60px #0002; backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px); }
  .wf-panel-start { display:grid; place-items:center; width:100%; min-height:var(--wf-panel-height); padding:70px 30px; }
  .wf-empty .wf-new { width:min(100%,460px); min-height:94px; padding:26px 34px; margin:0; font-size:19px; }
  .wf-empty .wf-process { grid-template-columns:repeat(4,minmax(0,1fr)); max-width:none; margin:28px auto 0; gap:30px; }
  .wf-process li:not(:last-child)::after { content:""; position:absolute; top:14px; left:42px; right:0; height:1px; background:linear-gradient(90deg,#ffffff26,#ffffff08); }
  .wf-empty .wf-how { width:max-content; margin:24px auto 0; padding:8px 12px; border:0; }
  .wf-empty.is-setting-up > :is(.wf-process,.wf-how) { display:none; }
}
@media(min-width:768px) and (max-width:1100px) {
  .wf-card { grid-template-columns:minmax(0,1fr) 150px 112px; gap:20px; padding:20px 68px 20px 20px; }
  .wf-card .wf-menu { right:10px; }
  .wf-usage > div { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:7px 14px; }
  .wf-usage > div > span { font-size:11px; }
  .wf-usage progress { grid-row:2; grid-column:1 / -1; }
}
.wf-loading { color:#c2c7d1; padding:24px 0; }
.wf-dialog { --wf-line:#ffffff19; width:min(760px,calc(100% - 36px)); max-height:calc(100dvh - 50px); padding:0; border:1px solid #ffffff28; border-radius:20px; color:#f5f5f7; background:linear-gradient(145deg,#1a1c22f7,#0d1117fc); box-shadow:0 30px 120px #000b,inset 0 1px #ffffff0a; overflow:hidden; }
.wf-dialog[open] { display:flex; }
.wf-dialog::backdrop { background:#02040bc2; backdrop-filter:blur(7px); -webkit-backdrop-filter:blur(7px); }
.wf-dialog-form { display:flex; flex-direction:column; width:100%; max-height:calc(100dvh - 52px); min-height:0; }
.wf-dialog-head { display:flex; justify-content:space-between; gap:20px; padding:24px 28px 21px; border-bottom:1px solid #ffffff13; flex-shrink:0; }
.wf-dialog h2 { font-size:24px; font-weight:600; letter-spacing:-.03em; margin-top:6px; }
.wf-eyebrow { font-size:10px; font-weight:600; color:#b3a9b5; letter-spacing:.13em; }
.wf-dialog-body { overflow-y:auto; min-height:0; padding:24px 28px; overscroll-behavior:contain; }
.wf-dialog-body > p { font-size:14px; line-height:1.65; color:#c0c5d0; }
.wf-dialog-body a { color:#f5bec8; text-underline-offset:3px; }
.wf-dialog-footer { display:flex; gap:12px; justify-content:flex-end; padding:18px 28px; background:#0f131bd9; border-top:1px solid #ffffff13; flex-shrink:0; }
.wf-dialog fieldset { border:0; min-width:0; margin:0 0 24px; padding:0; }
.wf-dialog legend { font-size:14px; font-weight:550; margin-bottom:11px; padding:0; }
.wf-dialog legend span,.wf-field > span { display:block; color:#a7aebb; font-weight:400; font-size:12px; margin-top:4px; }
.wf-field { display:flex; flex-direction:column; gap:9px; font-size:14px; margin-bottom:24px; }
.wf-field :is(select,input) { min-height:45px; padding:9px 13px; border:1px solid #ffffff25; border-radius:9px; background:#ffffff06; color:#f1f3f8; color-scheme:dark; width:100%; }
.wf-field option { background:#1b1e25; color:#f5f5f7; }
.wf-steps { display:flex; justify-content:space-between; gap:12px; padding-bottom:22px; margin-bottom:22px; border-bottom:1px solid #ffffff10; }
.wf-steps > span { display:flex; align-items:center; gap:7px; color:#828a98; font-size:12px; }
.wf-steps b { font-weight:450; }
.wf-steps [aria-current=step] { color:#ff778d; }
.wf-choices,.wf-segments { display:flex; flex-wrap:wrap; gap:9px; }
.wf-choices label,.wf-segments label { display:flex; align-items:center; gap:8px; min-height:44px; padding:9px 13px; border:1px solid #ffffff20; border-radius:9px; font-size:13px; color:#c6ccd6; cursor:pointer; }
.wf-choices label:has(:checked),.wf-segments label:has(:checked) { border-color:#ff3a5d88; color:#fff; background:#ec19311a; }
.wf-dialog input[type=checkbox],.wf-dialog input[type=radio] { accent-color:#ef2943; width:16px; height:16px; flex-shrink:0; }
.wf-scope-option { display:flex; gap:13px; align-items:center; border:1px solid #ffffff1c; border-radius:12px; padding:15px; margin-bottom:10px; cursor:pointer; }
.wf-scope-option.is-selected { border-color:#f9345980; background:#f0183410; }
.wf-scope-icon { color:#ccd1db; }
.wf-scope-option > span:last-child { min-width:0; flex:1; }
.wf-scope-option strong { display:block; font-size:14px; font-weight:550; }
.wf-scope-option strong small { margin-left:7px; color:#ff8195; font-size:10px; font-weight:450; }
.wf-scope-option > span > span { display:block; color:#b0b7c2; font-size:12px; line-height:1.5; margin-top:4px; }
.wf-scope-option em { display:block; font-style:normal; color:#8fa6b2; font-size:11px; margin-top:5px; }
.wf-state-options { max-height:190px; overflow:auto; padding:4px; margin-top:14px; }
.wf-state-options .wf-choices { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); }
.wf-help { color:#aeb6c4 !important; font-size:12px !important; line-height:1.6 !important; margin:12px 0 !important; }
.wf-preview { border:1px solid #ffffff1b; border-radius:12px; padding:18px; background:#0002; }
.wf-preview > span { display:block; color:#929dac; font-size:11px; margin-bottom:15px; }
.wf-preview strong { display:block; font-size:14px; font-weight:550; padding-bottom:13px; border-bottom:1px solid #ffffff10; }
.wf-preview pre { white-space:pre-wrap; overflow-wrap:anywhere; font:inherit; font-size:13px; line-height:1.7; color:#c9cdd6; max-height:220px; overflow:auto; margin:15px 0 0; }
.wf-review-summary { padding:22px; }
.wf-review-summary .wf-thumb { margin-bottom:14px; }
.wf-review-summary h3 { font-size:20px; font-weight:550; }
.wf-review-summary dl { margin:20px 0 0; }
.wf-review-summary dl > div { display:grid; grid-template-columns:90px minmax(0,1fr); gap:15px; font-size:13px; line-height:1.6; padding:8px 0; border-top:1px solid #ffffff0c; }
.wf-review-summary dt { color:#9ca7b5; }.wf-review-summary dd { margin:0; overflow-wrap:anywhere; }
.wf-form-error { color:#ffadbc !important; font-size:13px !important; margin-top:14px !important; line-height:1.5 !important; }
.wf-form-error:empty { display:none; }
.wf-explainer { margin:0; padding:0 0 0 23px; }
.wf-explainer li { padding:0 0 25px 10px; }
.wf-explainer li:last-child { padding-bottom:0; }
.wf-explainer strong { font-size:16px; font-weight:550; }
.wf-explainer p { color:#b2bac6; margin-top:9px; font-size:14px; line-height:1.7; }
.wf-confirm { display:flex; align-items:flex-start; gap:10px; font-size:13px; line-height:1.6; }
@media(max-width:900px) { .wf-toolbar { align-items:flex-start; }.wf-toolbar-actions { gap:5px; }.wf-toolbar-actions .wf-primary { padding:10px 14px; font-size:13px; } }
@media(max-width:767px) {
  .wf-usage-row { margin:20px 0 0; }
  #pageWorkflows { padding-top:3px; }.wf-root { padding-top:7px; }.wf-empty { min-height:calc(100dvh - 190px); padding:14px 4px 24px; }
  .wf-empty .wf-heading h1 { font-size:34px; }.wf-empty .wf-heading { gap:13px; margin-bottom:14px; }.wf-empty > h2,.wf-empty-header > h2 { font-size:21px; max-width:280px; }.wf-empty > p,.wf-empty-header > p { font-size:15px; line-height:1.6; max-width:350px; }
  .wf-empty .wf-new { margin:25px 0 29px; min-height:55px; }.wf-process { max-width:350px; }.wf-how { margin-top:27px; padding-top:22px; }
  .wf-toolbar { margin-top:6px; flex-wrap:wrap; gap:18px; }.wf-toolbar .wf-heading h1 { font-size:29px; }.wf-toolbar > div > p { margin-top:10px; font-size:14px; }.wf-toolbar-actions { width:100%; justify-content:space-between; flex-direction:row-reverse; }.wf-toolbar-actions .wf-primary { flex:1; }.wf-usage-row { gap:12px; }.wf-usage { padding:14px; max-width:none; }.wf-usage strong { font-size:13px; }
  .wf-filters { gap:19px; margin-bottom:20px; }.wf-cards { grid-template-columns:minmax(0,1fr); gap:18px; }.wf-card { max-width:none; padding:18px; }.wf-card-top { gap:12px; }.wf-tags { gap:10px; }.wf-dialog { width:calc(100% - 20px); border-radius:17px; max-height:calc(100dvh - 28px); }.wf-dialog-form { max-height:calc(100dvh - 30px); }.wf-dialog-head { padding:20px 18px 16px; }.wf-dialog h2 { font-size:21px; }.wf-dialog-body { padding:19px 18px; }.wf-dialog-footer { padding:14px 18px; }.wf-steps { gap:7px; }.wf-steps b { font-size:11px; }.wf-state-options .wf-choices { grid-template-columns:repeat(3,minmax(0,1fr)); }.wf-scope-option { padding:12px; gap:9px; }.wf-dialog-footer .wf-primary { flex:1; }.wf-preview { padding:14px; }
}
@media(prefers-reduced-motion:reduce) { .wf-root *, .wf-dialog * { animation:none !important; transition:none !important; scroll-behavior:auto !important; } }

/* One shared configuration screen. Only filter panels and the editor scroll. */
body:has(.wf-config[open]:not(.wf-inline-config)) { overflow:hidden; }
.wf-config { width:min(660px,calc(100% - 36px)); height:min(740px,calc(var(--wf-viewport-height,100dvh) - 48px)); max-height:calc(var(--wf-viewport-height,100dvh) - 48px); }
.wf-config .wf-dialog-form { height:100%; max-height:none; }
.wf-config .wf-dialog-head { padding:20px 24px 16px; align-items:center; }
.wf-config .wf-eyebrow { display:none; }
.wf-config h2 { margin:0; font-size:24px; }
.wf-config .wf-dialog-body { display:flex; flex-direction:column; gap:18px; flex:1; overflow:visible; padding:18px 24px; }
.wf-config-schools,.wf-config-coaches { flex-shrink:0; min-width:0; }
.wf-section-heading { display:flex; align-items:center; justify-content:space-between; min-height:30px; gap:12px; margin-bottom:6px; }
.wf-section-heading h3 { margin:0; font-size:14px; font-weight:600; letter-spacing:-.01em; }
.wf-section-heading > span { color:#aeb2bd; font-size:11px; }
.wf-config .wf-segments { display:flex; padding:3px; border:1px solid #ffffff13; border-radius:10px; background:#ffffff04; gap:3px; }
.wf-config .wf-segments label { flex:1; min-width:0; min-height:0; padding:0; border:0; background:none; position:relative; display:block; }
.wf-config .wf-segments input { position:absolute; opacity:0; width:1px; height:1px; }
.wf-config .wf-segments label:has(input:focus-visible) span { outline:2px solid #ff8b9b; outline-offset:1px; }
.wf-config .wf-segments span { display:flex; justify-content:center; align-items:center; min-height:36px; padding:5px 8px; border-radius:7px; border:0; font-size:13px; }
.wf-config .wf-segments input:checked + span { background:#ffffff12; color:#fff; box-shadow:inset 0 1px #ffffff0c,0 1px 4px #0004; }
.wf-config-sport select { max-width:120px; padding:4px 20px 4px 8px; border:1px solid #ffffff15; border-radius:7px; color:#e8e9ed; background:#ffffff06; color-scheme:dark; font-size:12px; }
.wf-config .wf-help { font-size:12px !important; line-height:1.45 !important; margin:7px 0 0 !important; color:#abb0bb; }
.wf-config .wf-recommendation { min-height:34px; }
.wf-filter-row { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:8px; margin-top:8px; }
.wf-filter { position:relative; min-width:0; }
.wf-filter summary { list-style:none; display:flex; align-items:center; gap:8px; min-height:38px; border:1px solid #ffffff18; background:#ffffff04; border-radius:8px; padding:8px 10px; font-size:12px; cursor:pointer; }
.wf-filter summary::-webkit-details-marker { display:none; }
.wf-filter summary::after { content:"⌄"; color:#9ca4b0; margin-left:auto; }
.wf-filter summary span { color:#aeb4c1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:65%; }
.wf-filter[open] > summary { border-color:#ffffff40; }
.wf-filter-panel { position:absolute; top:calc(100% + 5px); left:0; z-index:5; width:max-content; min-width:100%; max-width:min(340px,calc(100vw - 58px)); max-height:230px; overflow:auto; padding:12px; border:1px solid #ffffff29; border-radius:11px; background:#171b24f5; backdrop-filter:blur(24px); box-shadow:0 15px 40px #0008; overscroll-behavior:contain; }
.wf-filter-row .wf-filter:last-child .wf-filter-panel { right:0; left:auto; width:310px; }
.wf-config .wf-filter-panel .wf-choices { margin-top:8px; gap:6px; }
.wf-config .wf-filter-panel .wf-choices label { flex:1 0 auto; }
.wf-config .wf-filter-panel .wf-choices span { padding:8px 10px; font-size:12px; }
.wf-config .wf-filter-panel .wf-segments span { font-size:11px; padding:5px; }
.wf-coach-filter { margin-top:8px; }
.wf-coach-filter .wf-filter-panel { width:100%; }
@media(min-width:768px) {
  .wf-dialog.wf-inline-config { position:relative; inset:auto; width:100%; max-width:none; height:auto; max-height:none; padding:0; margin:0; border:0; border-radius:24px; background:transparent; box-shadow:none; overflow:visible; }
  .wf-inline-config .wf-dialog-form { height:var(--wf-panel-height); min-height:var(--wf-panel-height); max-height:none; }
  .wf-inline-config .wf-dialog-head { padding:21px 30px; }
  .wf-inline-config .wf-dialog-head h2 { font-size:20px; }
  .wf-inline-config .wf-dialog-body { display:grid; grid-template-columns:minmax(240px,.85fr) minmax(0,1.3fr); grid-template-rows:auto 1fr; gap:26px 34px; padding:24px 30px; align-content:start; }
  .wf-inline-config .wf-config-schools { grid-column:1; grid-row:1; }
  .wf-inline-config .wf-config-coaches { grid-column:1; grid-row:2; }
  .wf-inline-config .wf-config-message { grid-column:2; grid-row:1 / span 2; min-height:0; }
  .wf-inline-config :is(.wf-config-schools,.wf-config-coaches):has(.wf-filter[open]) { position:relative; z-index:10; }
  .wf-inline-config .wf-filter[open] { z-index:1; }
  .wf-inline-config .wf-filter-panel { background:#171b24; backdrop-filter:none; -webkit-backdrop-filter:none; }
  .wf-inline-config .wf-form-error { grid-column:1 / -1; }
  .wf-inline-config .wf-form-error:empty { display:none; }
  .wf-inline-config .wf-dialog-footer { padding:19px 30px; border-radius:0 0 24px 24px; background:#080c1126; }
  .wf-inline-config .wf-dialog-footer .wf-primary { width:300px; min-height:60px; padding:16px 28px; font-size:16px; }
  .wf-inline-config.wf-setup-reveal :is(.wf-config-schools,.wf-config-coaches,.wf-config-message) { transform-origin:50% 30%; animation:wf-setup-spring 650ms cubic-bezier(.2,.8,.25,1) backwards; animation-delay:var(--wf-setup-elapsed,0ms); }
  .wf-inline-config.wf-setup-reveal .wf-config-coaches { animation-delay:calc(var(--wf-setup-elapsed,0ms) + 65ms); }
  .wf-inline-config.wf-setup-reveal .wf-config-message { animation-delay:calc(var(--wf-setup-elapsed,0ms) + 130ms); }
}
@keyframes wf-setup-spring {
  0% { opacity:0; transform:translateY(24px) scale(.92); }
  55% { opacity:1; transform:translateY(-4px) scale(1.012); }
  78% { transform:translateY(1.5px) scale(.997); }
  100% { opacity:1; transform:translateY(0) scale(1); }
}
.wf-config-message { flex:1; min-height:140px; display:flex; flex-direction:column; }
.wf-regenerate { border:0; background:transparent; color:#d3d8e2; display:flex; align-items:center; gap:5px; font-size:12px !important; padding:5px 0 5px 10px; min-height:32px; }
.wf-regenerate svg { width:14px; height:14px; }
.wf-message-editor { display:flex; flex-direction:column; flex:1; min-height:0; border:1px solid #ffffff20; border-radius:11px; background:#080c114d; overflow:hidden; }
.wf-message-editor.is-generating { border-color:#ff4c6859; box-shadow:0 0 20px #ef244015,inset 0 1px #ffffff09; transform-origin:50% 40%; animation:wf-template-spring 560ms cubic-bezier(.22,.85,.25,1) both; }
.wf-writing-dots { display:inline-flex; width:16px; margin-left:1px; }
.wf-writing-dots b { animation:wf-writing-bounce 900ms ease-in-out infinite; font-weight:500; }
.wf-writing-dots b:nth-child(2) { animation-delay:120ms; }
.wf-writing-dots b:nth-child(3) { animation-delay:240ms; }
@keyframes wf-template-spring {
  0% { transform:translateY(4px) scale(.993); }
  48% { transform:translateY(-1.5px) scale(1.004); }
  74% { transform:translateY(.5px) scale(.999); }
  100% { transform:translateY(0) scale(1); }
}
@keyframes wf-writing-bounce { 0%,65%,100% { transform:translateY(0); opacity:.5; } 32% { transform:translateY(-2px); opacity:1; } }
.wf-subject-row { display:flex; align-items:center; gap:10px; min-height:42px; padding:0 12px; border-bottom:1px solid #ffffff13; }
.wf-subject-row span { font-size:12px; color:#aeb4c0; }
.wf-subject-row input { min-width:0; flex:1; width:100%; border:0; outline-offset:-2px; color:#f1f3f7; background:transparent; padding:9px 0; font-size:13px; }
.wf-message-editor textarea { flex:1; width:100%; min-height:0; resize:none; border:0; border-radius:0; padding:12px; background:transparent; color:#e8ebf1; font-size:14px; line-height:1.6; overflow:auto; overscroll-behavior:contain; }
.wf-config .wf-form-error:empty { display:none; }
.wf-config .wf-form-error { flex-shrink:0; margin:0; font-size:12px; }
.wf-config .wf-dialog-footer { padding:14px 24px; align-items:center; gap:10px; }
.wf-save-note { margin-right:auto; color:#a5adba; font-size:11px; }
.wf-config .wf-dialog-footer button { min-height:44px; }
.wf-sr-only { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media(max-width:767px) {
  .wf-config { position:fixed; inset:var(--wf-viewport-top,0px) auto auto 0; margin:0; width:100%; max-width:none; height:var(--wf-viewport-height,100dvh); max-height:none; border:0; border-radius:0; }
  .wf-config .wf-dialog-head { padding:calc(13px + env(safe-area-inset-top,0px)) 16px 11px; }
  .wf-config h2 { font-size:21px; }
  .wf-config .wf-dialog-body { padding:10px 14px; gap:12px; overflow-y:auto; }
  .wf-config .wf-section-heading { min-height:28px; margin-bottom:4px; }
  .wf-config .wf-segments span { min-height:38px; }
  .wf-config-sport select { min-height:30px; font-size:16px; padding:3px 4px; }
  .wf-config .wf-filter summary { min-height:40px; }
  .wf-config .wf-help { line-height:1.4 !important; }
  .wf-config .wf-recommendation { min-height:30px; }
  .wf-config-message { min-height:110px; }
  .wf-config .wf-regenerate { min-height:36px; }
  .wf-subject-row input,.wf-message-editor textarea { font-size:16px; }
  .wf-message-editor textarea { line-height:1.45; padding:10px; }
  .wf-config .wf-dialog-footer { padding:10px 14px calc(10px + env(safe-area-inset-bottom,0px)); flex-wrap:wrap; gap:6px; }
  .wf-config .wf-dialog-footer .wf-secondary { display:none; }
  .wf-config .wf-save-note { display:block; flex-basis:100%; margin:0; text-align:center; font-size:10px; line-height:1.35; }
  .wf-config .wf-dialog-footer .wf-primary { width:100%; }
  .wf-config.wf-keyboard .wf-dialog-head { padding-top:8px; padding-bottom:7px; }
  .wf-config.wf-keyboard .wf-dialog-body { gap:7px; padding-top:7px; padding-bottom:7px; }
  .wf-config.wf-keyboard .wf-section-heading { min-height:22px; }
  .wf-config.wf-keyboard .wf-filter summary { min-height:34px; padding-top:6px; padding-bottom:6px; }
  .wf-config.wf-keyboard .wf-filter-row { margin-top:4px; }
  .wf-config.wf-keyboard .wf-help { display:none; }
  .wf-config.wf-keyboard .wf-config-message { min-height:90px; }
  .wf-config.wf-keyboard .wf-dialog-footer { padding-top:7px; padding-bottom:calc(7px + env(safe-area-inset-bottom,0px)); }
}