:root { --queue-green:#078b68; --queue-ink:#12342d; --queue-line:#d6e7e1; --queue-soft:#f4faf7; }
.ai-jobs-page { background:linear-gradient(180deg,#eef9f4 0,#f8fbfa 42%,#fff 100%); min-height:100vh; color:var(--queue-ink); }
.ai-jobs-shell { width:min(1320px,calc(100% - 32px)); margin:28px auto 56px; }
.ai-jobs-hero { display:flex; justify-content:space-between; gap:24px; align-items:center; background:#fff; border:1px solid var(--queue-line); border-radius:22px; padding:26px 30px; box-shadow:0 14px 36px rgba(26,76,62,.08); }
.ai-jobs-hero h1 { margin:2px 0 5px; font-size:clamp(1.7rem,3vw,2.35rem); }
.ai-jobs-hero p { margin:0; color:#678078; }
.eyebrow { color:var(--queue-green)!important; font-weight:700; letter-spacing:.08em; }
.auto-refresh-switch { display:flex; align-items:center; gap:9px; white-space:nowrap; color:#41645a; }
.auto-refresh-switch input { width:20px; height:20px; accent-color:var(--queue-green); }
.ai-job-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin:18px 0; }
.ai-job-summary article { background:#fff; border:1px solid var(--queue-line); border-radius:18px; padding:18px 21px; display:flex; align-items:baseline; justify-content:space-between; }
.ai-job-summary span { font-size:2rem; font-weight:700; }
.ai-job-summary small { color:#6b817a; }
.ai-job-summary .active { border-left:5px solid #0ea5e9; }.ai-job-summary .success { border-left:5px solid #10b981; }.ai-job-summary .danger { border-left:5px solid #ef4444; }
.ai-job-toolbar { display:grid; grid-template-columns:minmax(260px,1fr) 220px 190px auto; gap:12px; align-items:end; background:#fff; border:1px solid var(--queue-line); border-radius:18px; padding:17px; }
.ai-job-toolbar label { display:grid; gap:6px; color:#4c665e; font-size:.88rem; }
.ai-job-toolbar input,.ai-job-toolbar select { min-height:44px; border:1px solid #bed7cf; border-radius:11px; padding:8px 12px; font:inherit; background:#fff; }
.ai-job-toolbar button,.ai-job-action,.ai-job-pagination button { min-height:44px; border:0; border-radius:11px; padding:9px 18px; font:inherit; font-weight:600; cursor:pointer; background:var(--queue-green); color:#fff; }
.ai-job-message { min-height:24px; color:#637c74; margin:13px 4px 7px; }
.ai-job-list { display:grid; gap:13px; }
.ai-job-card { background:#fff; border:1px solid var(--queue-line); border-radius:18px; overflow:hidden; box-shadow:0 5px 18px rgba(35,79,67,.05); }
.ai-job-main { display:grid; grid-template-columns:minmax(0,1fr) minmax(180px,300px) auto; gap:18px; align-items:center; padding:19px 21px; }
.ai-job-title { display:flex; align-items:center; gap:9px; flex-wrap:wrap; }.ai-job-title h2 { margin:0; font-size:1.08rem; }.ai-job-meta { margin:7px 0 0; color:#6c817b; font-size:.88rem; }
.ai-job-type { border-radius:999px; padding:5px 10px; background:#edf7f3; color:#176e58; font-size:.76rem; font-weight:700; white-space:nowrap; }
.ai-job-member { color:#176e58; margin-top:5px; font-size:.88rem; }
.ai-status { border-radius:999px; padding:5px 11px; font-size:.78rem; font-weight:700; white-space:nowrap; }
.ai-status.queued { background:#e0f2fe;color:#075985}.ai-status.running { background:#d1fae5;color:#065f46}.ai-status.retry_wait { background:#fef3c7;color:#92400e}.ai-status.completed { background:#dcfce7;color:#166534}.ai-status.failed { background:#fee2e2;color:#991b1b}.ai-status.cancelled { background:#e5e7eb;color:#4b5563}
.ai-job-progress-line { height:10px; border-radius:999px; overflow:hidden; background:#e8efed; }.ai-job-progress-line span { display:block; height:100%; background:linear-gradient(90deg,#0f9974,#57c795); transition:width .3s; }
.ai-job-progress-copy { display:flex; justify-content:space-between; margin-top:7px; color:#667d76; font-size:.82rem; }
.ai-job-actions { display:flex; gap:7px; flex-wrap:wrap; justify-content:flex-end; }.ai-job-action { min-height:38px; padding:7px 12px; }.ai-job-action.secondary { background:#e7f5ef;color:#096b52}.ai-job-action.danger { background:#fff0f0;color:#b42318;border:1px solid #fecaca}.ai-job-action:disabled { opacity:.45;cursor:not-allowed; }
.ai-job-error { margin:0 21px 15px; color:#b42318; background:#fff1f1; border-radius:10px; padding:10px 13px; font-size:.88rem; }
.ai-job-detail { border-top:1px solid var(--queue-line); padding:16px 21px 20px; background:var(--queue-soft); }.ai-job-detail[hidden] { display:none; }
.ai-topic-list { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; }.ai-topic { background:#fff;border:1px solid #dceae5;border-radius:11px;padding:11px;min-width:0}.ai-topic-head { display:flex;justify-content:space-between;gap:8px}.ai-topic b { font-size:.87rem; }.ai-topic small { display:block;color:#71857f;margin-top:5px}.ai-topic-error { color:#b42318!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.ai-job-empty { text-align:center;padding:55px 20px;background:#fff;border:1px dashed #b8d1c9;border-radius:18px;color:#6d837c; }
.ai-job-pagination { display:flex;justify-content:center;align-items:center;gap:16px;margin-top:20px}.ai-job-pagination button:disabled { opacity:.4;cursor:not-allowed; }
@media(max-width:900px){.ai-job-summary{grid-template-columns:repeat(2,1fr)}.ai-job-main{grid-template-columns:1fr}.ai-job-actions{justify-content:flex-start}.ai-topic-list{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.ai-jobs-shell{width:min(100% - 18px,1320px);margin-top:14px}.ai-jobs-hero{align-items:flex-start;flex-direction:column;padding:20px}.ai-job-summary{grid-template-columns:1fr 1fr}.ai-job-summary article{display:grid}.ai-job-toolbar{grid-template-columns:1fr}.ai-topic-list{grid-template-columns:1fr}.ai-job-main{padding:16px}.auto-refresh-switch{white-space:normal}}
