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; }
@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); } }