html[data-ououWorkflowReader="pending"] #workflowGrid,
html[data-ououWorkflowReader="pending"] main.page { visibility: hidden; }
.ouou-workflow-live-list { display:grid!important; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:18px!important; align-items:stretch; }
.ouou-workflow-card { min-width:0; overflow:hidden; border:1px solid #e7e9ed; border-radius:8px; background:#fff; }
.ouou-workflow-card-link { display:block; height:100%; color:inherit; text-decoration:none; }
.ouou-workflow-card-link:focus-visible,.ouou-workflow-back:focus-visible,.ouou-workflow-button:focus-visible { outline:2px solid #477cf0; outline-offset:3px; }
.ouou-workflow-preview { display:grid; place-items:center; min-height:190px; padding:24px; color:#6d7580; background:#f4f6f8; text-align:center; font-size:13px; line-height:1.7; }
.ouou-workflow-card-copy { padding:18px 18px 16px; }
.ouou-workflow-kicker { display:block; color:#6f7782; font-size:12px; line-height:1.6; }
.ouou-workflow-card h2 { margin:8px 0 9px; font-size:17px; line-height:1.5; font-weight:600; overflow-wrap:anywhere; }
.ouou-workflow-card p { display:-webkit-box; margin:0 0 14px; overflow:hidden; color:#7b838e; font-size:12px; line-height:1.7; -webkit-box-orient:vertical; -webkit-line-clamp:3; }
.ouou-workflow-byline { display:flex; flex-wrap:wrap; align-items:center; gap:8px; color:#4b5563; font-size:13px; line-height:1.7; }
.ouou-workflow-byline.compact { font-size:11px; }
.ouou-workflow-verified { color:#2e6fd4; font-size:11px; white-space:nowrap; }
.ouou-workflow-list-note { grid-column:1/-1; margin:4px 0 12px; color:#89919b; font-size:12px; line-height:1.7; }
.ouou-workflow-state { max-width:680px; margin:76px auto; padding:48px 22px; border:1px dashed #dfe3e8; border-radius:8px; background:#fafbfc; text-align:center; }
.ouou-workflow-state h1 { margin:0 0 12px; color:#252a31; font-size:23px; line-height:1.5; font-weight:600; }
.ouou-workflow-state p { margin:0 0 22px; color:#737c87; font-size:14px; line-height:1.8; }
.ouou-workflow-state.error { border-color:#efc9cd; background:#fffafa; }
.ouou-workflow-button { min-height:38px; padding:8px 17px; border:1px solid #477cf0; border-radius:5px; background:#477cf0; color:#fff; font-size:13px; cursor:pointer; }
.ouou-workflow-button.is-secondary { border-color:#dfe3e8; background:#fff; color:#4f5966; }
.ouou-workflow-live-detail { max-width:960px; margin:0 auto; padding:42px 28px 90px; }
.ouou-workflow-detail-head { padding-bottom:28px; border-bottom:1px solid #e7e9ed; }
.ouou-workflow-detail-head h1 { margin:12px 0 20px; color:#20252c; font-size:32px; line-height:1.4; font-weight:600; overflow-wrap:anywhere; }
.ouou-workflow-body { max-width:760px; margin:20px 0 0; color:#68717d; font-size:15px; line-height:1.9; white-space:pre-wrap; }
.ouou-workflow-notice { margin-top:32px; padding:18px 20px; border-left:3px solid #b9cbed; border-radius:0 6px 6px 0; background:#f6f8fc; }
.ouou-workflow-notice strong { color:#315caa; font-size:14px; }
.ouou-workflow-notice p { margin:7px 0 0; color:#68717d; font-size:13px; line-height:1.8; }
.ouou-workflow-info { margin-top:36px; }
.ouou-workflow-info h2 { margin:24px 0 10px; color:#252a31; font-size:19px; line-height:1.5; }
.ouou-workflow-info p,.ouou-workflow-io { color:#5f6874; font-size:14px; line-height:1.9; white-space:pre-wrap; }
.ouou-workflow-io { margin:0; padding-left:22px; }
.ouou-workflow-back { display:inline-block; margin-top:34px; color:#477cf0; font-size:13px; text-decoration:none; }
.ouou-workflow-notice { border:1px solid #dfe5ef; border-radius:12px; background:#fafbfc; padding:24px; }
.ouou-workflow-notice h2 { margin:0 0 16px; color:#252a31; font-size:20px; }
.ouou-workflow-notice p { margin:12px 0 18px; font-size:14px; }
.ouou-workflow-notice .ouou-workflow-button { margin:8px 10px 0 0; min-height:44px; border-radius:8px; font-size:14px; }
.ouou-workflow-button:disabled { opacity:.55; cursor:default; }
.ouou-workflow-run-field { display:flex; flex-direction:column; gap:9px; margin:18px 0; color:#374151; font-size:14px; font-weight:500; }
.ouou-workflow-run-input { width:100%; box-sizing:border-box; min-height:44px; padding:10px 12px; border:1px solid #d7dde6; border-radius:8px; background:white; color:#252a31; font-family:inherit; font-size:15px; font-weight:400; line-height:1.6; }
.ouou-workflow-run-input:focus-visible { outline:2px solid #477cf0; outline-offset:2px; }
textarea.ouou-workflow-run-input { resize:vertical; }
.ouou-workflow-media-upload { display:flex; flex-direction:column; gap:12px; margin:-6px 0 20px; min-width:0; }
.ouou-workflow-media-upload input[type=file] { max-width:100%; min-width:0; font-size:14px; }
.ouou-workflow-media-upload input[type=file]::file-selector-button { margin-right:10px; padding:6px 9px; border:0; border-radius:5px; background:#eef1f5; color:#374151; }
.ouou-workflow-media-rights { display:flex; align-items:flex-start; gap:8px; color:#566171; font-size:14px; line-height:1.6; }
.ouou-workflow-media-rights input { flex:none; margin-top:5px; }
.ouou-workflow-run-input { min-width:0; max-width:100%; }
.ouou-workflow-run-result { margin-top:22px; padding-top:18px; border-top:1px solid #e1e6ed; overflow-wrap:anywhere; }
.ouou-workflow-run-result:empty { display:none; }
.ouou-workflow-run-result h3 { margin:0 0 10px; font-size:18px; color:#252a31; }
.ouou-workflow-notice .ouou-workflow-back { margin:8px 0 12px; font-size:14px; }
@media (max-width:680px) {
  .ouou-workflow-live-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px!important; }
  .ouou-workflow-preview { min-height:150px; padding:16px 10px; font-size:11px; }
  .ouou-workflow-card-copy { padding:13px 12px 12px; }
  .ouou-workflow-card h2 { font-size:14px; }
  .ouou-workflow-live-detail { padding:28px 17px 64px; }
  .ouou-workflow-detail-head h1 { font-size:27px; }
}
@media (max-width:520px) { .ouou-workflow-live-list { grid-template-columns:minmax(0,1fr); } }
