/* Shared platform/partner task surface; existing card/button/form tokens inherited. */
.wq-operation-tasks { min-width:0; max-width:100%; }
.wq-operation-tasks h2 { margin:0; font-size:21px; }
.wq-operation-tasks h3 { margin:0 0 12px; font-size:16px; }
.wq-operation-tasks h4 { margin:0 0 8px; font-size:13px; color:#475569; }
.wq-operation-tasks .op-toolbar { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin:12px 0; }
.wq-operation-tasks .op-heading { justify-content:space-between; }
.wq-operation-tasks .op-heading>div { display:flex; gap:6px; flex-wrap:wrap; }
.wq-operation-tasks .op-card { padding:16px; margin:12px 0; }
.wq-operation-tasks .op-muted { color:#64748b; font-size:12px; line-height:1.8; overflow-wrap:anywhere; }
.wq-operation-tasks .op-required { color:#cf1322; }
.wq-operation-tasks [data-task-feedback] { padding:10px 12px; background:#eff6ff; color:#164e77; border-radius:6px; line-height:1.7; overflow-wrap:anywhere; }
.wq-operation-tasks [data-task-feedback]:empty { display:none; }
.wq-operation-tasks [data-task-feedback].is-error,
.wq-operation-tasks .op-warning { background:#fff7ed; color:#9a3412; padding:10px 12px; border-radius:6px; }
.wq-operation-tasks .op-task-row { display:flex; justify-content:space-between; align-items:center; gap:12px; border:1px solid #e2e8f0; border-radius:8px; padding:14px; margin:10px 0; background:#fff; }
.wq-operation-tasks .op-task-row>div { min-width:0; overflow-wrap:anywhere; }
.wq-operation-tasks .op-task-row p { color:#64748b; font-size:12px; margin:6px 0 0; }
.wq-operation-tasks .op-compare-row { display:grid; grid-template-columns:minmax(90px,1fr) minmax(0,1.2fr) minmax(0,1.8fr); gap:12px; padding:12px 0; border-bottom:1px solid #eef2f6; align-items:start; }
.wq-operation-tasks .op-compare-heading { color:#64748b; font-size:12px; }
.wq-operation-tasks .op-compare-row>div { min-width:0; overflow-wrap:anywhere; }
.wq-operation-tasks .op-formal { color:#64748b; line-height:1.8; }
.wq-operation-tasks .op-suggested { white-space:pre-wrap; line-height:1.8; }
.wq-operation-tasks .op-image-compare { display:grid; grid-template-columns:1fr 1.4fr; gap:16px; }
.wq-operation-tasks .op-image-compare>div { min-width:0; }
.wq-operation-tasks .op-images { display:flex; flex-wrap:wrap; gap:8px; }
.wq-operation-tasks .op-image { border:0; padding:0; margin:0 6px 6px 0; background:none; cursor:pointer; max-width:100%; }
.wq-operation-tasks .op-field-choices { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px; margin:12px 0; }
.wq-operation-tasks .op-field-choices label { display:flex; gap:5px; align-items:center; font-size:13px; }
.wq-operation-tasks .op-candidate { display:flex; gap:8px; align-items:flex-start; padding:12px 0; border-bottom:1px solid #e2e8f0; }
.wq-operation-tasks .op-candidate span { min-width:0; overflow-wrap:anywhere; }
.wq-operation-tasks .op-candidate small { display:block; color:#64748b; margin-top:5px; }
.wq-operation-tasks .op-history { padding-left:22px; font-size:12px; color:#475569; line-height:1.9; }
.wq-operation-tasks .op-history p { margin:4px 0; white-space:pre-wrap; overflow-wrap:anywhere; }
.wq-operation-tasks [data-task-primary] { background:var(--primary,#1677ff); border-color:var(--primary,#1677ff); color:white; }
.wq-operation-tasks [data-task-action="cancel"] { background:var(--danger,#ff4d4f); border-color:var(--danger,#ff4d4f); color:white; }
.wq-operation-tasks [data-task-retry][hidden] { display:none; }
@media(max-width:600px){
 .wq-operation-tasks .op-card { padding:12px; }
 .wq-operation-tasks .op-compare-row { grid-template-columns:minmax(70px,.8fr) minmax(0,1.5fr); gap:8px; }
 .wq-operation-tasks .op-compare-row>div:last-child { grid-column:1/-1; }
 .wq-operation-tasks .op-compare-heading { display:none; }
 .wq-operation-tasks .op-image-compare { grid-template-columns:1fr; gap:14px; }
 .wq-operation-tasks .op-heading { align-items:flex-start; }
 .wq-operation-tasks .op-task-row { padding:12px; gap:8px; }
 .wq-operation-tasks .form-input,.wq-operation-tasks .form-select,.wq-operation-tasks .form-textarea { min-width:0; max-width:100%; box-sizing:border-box; }
}

/* The existing platform/partner chrome uses the same task lifecycle class.
   Keep all navigation items and readable content on phone widths. */
@media (max-width:768px) {
 .web-container.wq-task-workspace { width:100%; min-width:0; overflow-wrap:anywhere; }
 .web-container.wq-task-workspace .web-header { height:auto; min-height:52px; padding:12px; gap:10px; flex-wrap:wrap; }
 .web-container.wq-task-workspace .web-header .logo { min-width:0; max-width:100%; font-size:14px; white-space:normal; }
 .web-container.wq-task-workspace .web-header .user { min-width:0; max-width:100%; flex-wrap:wrap; gap:6px; }
 .web-container.wq-task-workspace .web-layout { width:100%; min-width:0; flex-direction:column; }
 .web-container.wq-task-workspace .web-sidebar { box-sizing:border-box; width:100%; min-width:0; max-height:180px; overflow-y:auto; overflow-x:hidden; padding:8px; border-right:0; border-bottom:1px solid var(--biz-border,#e2e8f0); }
 .web-container.wq-task-workspace .web-sidebar .menu-group { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px; padding:0 0 6px; }
 .web-container.wq-task-workspace .web-sidebar .menu-group-title { display:block; grid-column:1/-1; padding:6px; }
 .web-container.wq-task-workspace .web-sidebar .menu-item { min-width:0; padding:8px 6px; gap:6px; white-space:normal; }
 .web-container.wq-task-workspace .web-sidebar .menu-item span { display:inline; min-width:0; overflow-wrap:anywhere; }
 .web-container.wq-task-workspace .web-content { box-sizing:border-box; width:100%; min-width:0; padding:12px; overflow-y:visible; }
 .web-container.wq-task-workspace .wq-operation-tasks { width:100%; min-width:0; overflow-wrap:anywhere; }
}

/* Approved public promotion media; private document channels never enter here. */
.wq-operation-tasks .op-promotion-images{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(180px,100%),1fr));gap:12px;max-width:100%;}
.wq-operation-tasks .op-field-choices label:has(img){min-width:0;display:grid;gap:8px;}
.wq-operation-tasks .op-field-choices img{max-height:140px;object-fit:contain;}
