/* Flow cleanup layer: loaded last. Production timeline, responsive fixes,
   contrast and focus repairs. Uses the existing studio tokens. */

/* Production timeline */
.production-timeline{margin:-14px 0 26px}
.production-timeline ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.timeline-stage button{width:100%;height:100%;display:flex;gap:10px;align-items:flex-start;text-align:left;padding:10px 12px;min-height:0;border:1px solid var(--line);border-radius:10px;background:var(--surface);box-shadow:none;color:var(--text);font-weight:400}
.timeline-stage button:hover{border-color:#b9d3c8;background:var(--surface)}
.timeline-dot{width:10px;height:10px;margin-top:5px;flex-shrink:0;border-radius:50%;background:var(--control)}
.timeline-text{min-width:0}
.timeline-text strong{display:block;font-size:12px;line-height:1.4;font-weight:650}
.timeline-text small{display:block;font-size:11px;line-height:1.4;color:var(--muted);overflow-wrap:anywhere}
.timeline-time{display:block;margin-top:3px;font-size:11px;font-weight:600;color:#3d4653;font-variant-numeric:tabular-nums}
.timeline-stage[data-state="done"] .timeline-dot{background:var(--accent)}
.timeline-stage[data-state="running"] button{border-color:#9cc7b7;background:var(--bg)}
.timeline-stage[data-state="running"] .timeline-dot{background:var(--accent);box-shadow:0 0 0 0 #176b5866;animation:timeline-pulse 1.6s ease-out infinite}
.timeline-stage[data-state="running"] .timeline-time{color:var(--accent)}
.timeline-stage[data-state="attention"] .timeline-dot,.timeline-stage[data-state="current"] .timeline-dot{background:var(--surface);border:2px solid #b06a1f}
.timeline-stage[data-state="attention"] button{border-color:#ecd3ac;background:var(--review-soft)}
.timeline-stage[data-state="current"] .timeline-dot{border-color:var(--accent)}
.timeline-stage[data-state="error"] button{border-color:#efc2b6;background:var(--attention-soft)}
.timeline-stage[data-state="error"] .timeline-dot{background:#b5482f}
.timeline-stage[data-state="error"] small{color:#8f3521}
.timeline-stage[data-state="todo"] .timeline-text strong{color:var(--muted)}
.timeline-parallel{margin:8px 0 0;font-size:11px;color:var(--muted)}
@keyframes timeline-pulse{0%{box-shadow:0 0 0 0 #176b5866}80%,100%{box-shadow:0 0 0 7px #176b5800}}
@media(max-width:1100px){.production-timeline ol{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:600px){.production-timeline ol{display:flex;overflow-x:auto;scroll-snap-type:x proximity;padding-bottom:4px}.timeline-stage{flex:0 0 150px;scroll-snap-align:start}}
@media(prefers-reduced-motion:reduce){.timeline-stage[data-state="running"] .timeline-dot{animation:none}}

/* Contrast and focus repairs */
.empty h2,.empty h1{color:var(--text)}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid #3f8b77;outline-offset:1px;border-color:#3f8b77}
.genie-steps button{color:var(--muted)}
.primary:disabled,.primary[disabled]{background:#cfe1da;border-color:#cfe1da;color:#2f4d44;opacity:1}
button:disabled{cursor:not-allowed}
.sidebar nav a[aria-current="page"],.sidebar nav button[aria-current="page"]{background:var(--done-soft);color:var(--done-strong);font-weight:700}
.sidebar nav button{text-align:left;border:0;background:transparent;box-shadow:none;padding:12px 14px;border-radius:6px;font-size:13px;color:#737b87;font-weight:400}
.sidebar nav button:hover{background:var(--bg)}

/* Mobile: readable step tabs, a bottom bar that scrolls instead of clipping */
@media(max-width:700px){
 .genie-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:3px;padding:4px}
 .genie-steps button{flex-direction:column;justify-content:center;gap:1px;min-width:0;padding:8px 2px;text-align:center;line-height:1.25;white-space:normal}
 .genie-steps b{font-size:11px!important;overflow-wrap:anywhere}
 .pagehead{flex-direction:column;align-items:stretch}
}
@media(max-width:800px){
 .sidebar nav{display:flex;justify-content:flex-start;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scrollbar-width:none;padding-bottom:env(safe-area-inset-bottom)}
 .sidebar nav::-webkit-scrollbar{display:none}
 .sidebar nav a,.sidebar nav button{flex:0 0 auto;min-width:76px;min-height:44px;padding:10px 8px;font-size:11px;text-align:center;justify-content:center;scroll-snap-align:start;border-radius:0}
 .background-task-tray{left:16px;right:16px;width:auto}
}

/* Retired provider panels stay available but folded away */
.legacy-provider>summary{cursor:pointer;display:flex;flex-wrap:wrap;gap:8px;align-items:baseline}
.legacy-provider>summary .muted{font-size:12px}
.legacy-provider[open]>summary{margin-bottom:14px}

/* One-click drafting */
.auto-draft-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:-12px 0 24px;padding:12px 16px;border:1px solid #cfe3da;border-left:3px solid var(--accent);border-radius:10px;background:var(--bg)}
.auto-draft-bar p{flex:1;min-width:220px;margin:0;font-size:13px}
.auto-draft-bar.paused{border-color:#ecd3ac;border-left-color:#b06a1f;background:var(--review-soft)}
.auto-draft-bar.idle{border-left-color:#9aa6b2;background:var(--surface)}
.brief-save-options{display:grid;gap:6px;max-width:62ch}
.check-option{display:flex;gap:8px;align-items:flex-start;font-size:13px;font-weight:500;margin:0}
.check-option input{margin-top:3px;flex-shrink:0}
.check-option:has(input:disabled){color:var(--muted)}

/* 30 / 45 / 60 second presets */
.duration-presets{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 16px}
.duration-presets button{display:flex;flex-direction:column;align-items:flex-start;min-width:96px;padding:8px 14px;border:1px solid var(--line);border-radius:10px;background:var(--surface);font-weight:650;font-size:14px;line-height:1.3}
.duration-presets button small{font-weight:400;font-size:11px}
.duration-presets button.selected{border-color:#92b9a8;background:var(--soft);color:var(--done-strong)}
.duration-presets .muted{font-size:12px}