:root{
  --bg:#f4f6f8;
  --card:#ffffff;
  --line:#d7dde4;
  --text:#16202a;
  --muted:#5d6b7a;
  --primary:#1f6feb;
  --primary-strong:#0f55c7;
  --ok:#18794e;
  --warn:#b45309;
  --danger:#b42318;
  --shadow:0 8px 24px rgba(16,24,40,.08);
  --radius:16px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:Segoe UI,Arial,sans-serif;background:var(--bg);color:var(--text)}
body{min-height:100vh}
.topbar{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding:24px 28px 14px;border-bottom:1px solid var(--line);background:#fff;position:sticky;top:0;z-index:10}
.eyebrow{font-size:12px;font-weight:700;color:var(--primary);letter-spacing:.08em;text-transform:uppercase}
h1{margin:4px 0 6px;font-size:28px;line-height:1.2}
.subline{font-size:14px;color:var(--muted)}
.headerActions,.panelActions,.stepActions{display:flex;gap:10px;flex-wrap:wrap}
.layout{display:grid;grid-template-columns:320px minmax(0,1fr);gap:18px;padding:18px 20px 26px;align-items:start}
.sidebar,.mainColumn{display:flex;flex-direction:column;gap:18px}
.panel{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px}
.panel.compact{padding:16px}
.panelHead{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:14px}
.panelHead h2{margin:0;font-size:18px}
.badge{display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;background:#e9eef6;color:#38506b;font-size:12px;font-weight:700}
.badge.active{background:#dbeafe;color:#1d4ed8}
.badge.done{background:#dcfce7;color:#166534}
.badge.warn{background:#fff7ed;color:#9a3412}
.input,select.input{width:100%;padding:10px 12px;border:1px solid #c7d0da;border-radius:12px;background:#fff;color:var(--text);font-size:14px}
.input:focus{outline:2px solid rgba(31,111,235,.18);border-color:var(--primary)}
.btn{border:1px solid #c8d2de;background:#fff;color:var(--text);padding:10px 14px;border-radius:12px;font-size:14px;font-weight:600;cursor:pointer}
.btn:hover{background:#f9fbfd}
.btn:disabled{opacity:.55;cursor:not-allowed}
.btnPrimary{background:var(--primary);border-color:var(--primary);color:#fff}
.btnPrimary:hover{background:var(--primary-strong)}
.formGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.field{display:flex;flex-direction:column;gap:6px}
.field span{font-size:12px;font-weight:700;color:#495769;text-transform:uppercase;letter-spacing:.04em}
.fieldWide{grid-column:span 2}
.inlineStatus{padding:12px 14px;border-radius:12px;background:#f8fafc;border:1px solid #d9e2ec;color:#334155;font-size:14px;margin-top:14px}
.primaryStepPanel{border:2px solid #dbeafe;background:linear-gradient(180deg,#f8fbff,#ffffff)}
.stepText{margin:0 0 14px;color:#334155;line-height:1.5}
.workflowSteps{display:flex;flex-direction:column;gap:10px}
.workflowItem{border:1px solid var(--line);border-radius:14px;padding:12px;background:#fff}
.workflowItem.current{border-color:#93c5fd;background:#eff6ff}
.workflowItem.done{border-color:#a7f3d0;background:#f0fdf4}
.workflowItem .title{font-weight:700;font-size:14px;margin-bottom:4px}
.workflowItem .meta{font-size:12px;color:var(--muted);line-height:1.4}
.jobHistoryList,.clientFilesList,.eventsList,.agentBoard{display:flex;flex-direction:column;gap:10px}
.jobRow,.fileRow,.eventRow,.agentCard{border:1px solid var(--line);border-radius:12px;background:#fff;padding:10px 12px}
.jobRow{cursor:pointer}
.jobRow.active{border-color:#93c5fd;background:#eff6ff}
.jobTop,.fileTop{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}.fileTop strong{display:block;min-width:0;white-space:normal;overflow-wrap:anywhere;word-break:break-word;line-height:1.35}
.jobRef{font-weight:700}
.jobMeta,.fileMeta,.eventMeta,.agentMeta{font-size:12px;color:var(--muted);line-height:1.45}
.fileRow.selected{border-color:#93c5fd;background:#eff6ff}
.fileRow button{margin-top:8px}
.twoCol{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.previewBox{display:flex;align-items:center;justify-content:center;min-height:280px;border:1px dashed #c5cfdb;border-radius:14px;background:#f8fafc;color:var(--muted);padding:18px;text-align:center}
.previewBox.empty{display:flex}
.previewImage{width:100%;max-height:520px;object-fit:contain;border:1px solid var(--line);border-radius:14px;background:#fff}
.previewFrame{width:100%;min-height:520px;border:1px solid var(--line);border-radius:14px;background:#fff}
.hidden{display:none !important}
.statusGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.kv{display:flex;flex-direction:column;gap:4px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:#fafcff}
.kv span{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.kv strong{font-size:14px;line-height:1.4}
.detailsPanel summary{cursor:pointer;font-weight:700}
.detailsPanel[open] summary{margin-bottom:12px}
.advancedGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.agentCard .agentTitle{font-weight:700;margin-bottom:4px}
.toast{position:fixed;right:20px;bottom:20px;max-width:360px;background:#111827;color:#fff;padding:12px 14px;border-radius:12px;box-shadow:var(--shadow);z-index:20}
.toast.ok{background:#166534}.toast.warn{background:#9a3412}.toast.err{background:#991b1b}

.resultSplit{display:grid;grid-template-columns:minmax(0,3fr) minmax(300px,1fr);gap:18px;align-items:start}
.previewTwinGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start}
.previewPane,.resultMetaPane{display:flex;flex-direction:column;gap:12px}
.resultMetaGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:16px;align-items:start}
.panelMiniCard{min-height:100%}
.infoGridSingle{grid-template-columns:1fr}
.stackedActions{flex-direction:column;align-items:stretch}
.panelFlowActions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.panelFlowActions .btn{width:100%}
@media (max-width: 1480px){.resultSplit{grid-template-columns:1fr}}
@media (max-width: 1180px){.previewTwinGrid,.resultMetaGrid{grid-template-columns:1fr}}
@media (max-width: 1180px){
  .layout{grid-template-columns:1fr}
  .sidebar{order:2}
  .formGrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .twoCol{grid-template-columns:1fr}
}
@media (max-width: 720px){
  .topbar{padding:18px;position:static;flex-direction:column}
  .layout{padding:14px}
  .formGrid,.statusGrid,.advancedGrid{grid-template-columns:1fr}
  .fieldWide{grid-column:span 1}
}

.formFooterBar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:18px;padding-top:14px;border-top:1px solid var(--line)}
.formFooterHint{font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.btnSaveCorner{min-width:170px;margin-left:auto}
.busyOverlay{position:fixed;inset:0;background:rgba(15,23,42,.42);display:flex;align-items:center;justify-content:center;padding:20px;z-index:40}
.busyCard{min-width:320px;max-width:440px;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);padding:24px 22px;text-align:center}
.spinner{width:52px;height:52px;border-radius:50%;border:5px solid #dbeafe;border-top-color:var(--primary);margin:0 auto 14px;animation:spin .9s linear infinite}
.busyTitle{font-size:18px;font-weight:700;margin-bottom:8px}
.busyText{font-size:14px;line-height:1.45;color:var(--muted)}
body.isBusy .btn{pointer-events:none}
@keyframes spin{to{transform:rotate(360deg)}}
@media (max-width:720px){.formFooterBar{flex-direction:column;align-items:stretch}.btnSaveCorner{width:100%}}


.focusHeadingWrap{display:flex;flex-direction:column;gap:6px}
.focusTag{display:inline-flex;align-self:flex-start;padding:4px 8px;border-radius:999px;background:rgba(31,111,235,.1);color:var(--primary);font-size:11px;font-weight:800;letter-spacing:.08em}
.focusSection{transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, opacity .18s ease, background .18s ease}
.focusSection.focusActive{border-color:var(--primary);box-shadow:0 18px 36px rgba(31,111,235,.14);transform:scale(1.01);background:linear-gradient(180deg,#ffffff 0%, #f8fbff 100%)}
.focusSection.focusActive .focusTag{display:inline-flex}
.focusSection.focusActive h2{font-size:1.18em}
.focusSection.focusContext{border-color:#bcd3f7;box-shadow:0 10px 24px rgba(31,111,235,.08)}
.focusSection.focusDim{opacity:.64;filter:saturate(.88)}
@media (max-width:1100px){
  .focusSection.focusActive{transform:none}
  .focusSection.focusDim{opacity:1}
}


.workflowNavPanel{position:static;top:auto}

.sidebar > .panel,.sidebar > details{position:relative;z-index:1}
.mainColumn > .panel{position:relative;z-index:2}
.primaryStepPanel{padding:22px;min-height:164px}
.primaryStepPanel.focusActive{transform:scale(1.03);box-shadow:0 24px 44px rgba(31,111,235,.18);border-width:2px}
.primaryStepPanel .stepText{font-size:15px}
.primaryStepPanel.focusActive .stepText{font-size:16px}
.focusSection.focusPrimary{border-color:var(--primary);box-shadow:0 24px 44px rgba(31,111,235,.18);transform:scale(1.03);background:linear-gradient(180deg,#ffffff 0%, #f3f8ff 100%)}
.focusSection.focusPrimary .focusTag{display:inline-flex}
.focusSection.focusPrimary h2{font-size:1.24em}
.focusSection.focusContextSoft{border-color:#d6e4fb;box-shadow:0 8px 18px rgba(31,111,235,.06);opacity:.88}
@media (max-width:1100px){
  .workflowNavPanel{position:static}
  .primaryStepPanel.focusActive,.focusSection.focusPrimary{transform:none}
}

.sourceLayout{display:grid;grid-template-columns:minmax(280px,.9fr) minmax(0,1.1fr);gap:16px;align-items:start}
.sourceColumn{display:flex;flex-direction:column;gap:12px}
.selectionRow{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:#fafcff}
.selectionMain{min-width:0;display:flex;flex-direction:column;gap:6px}.selectionMain strong,.selectionMain .value{overflow-wrap:anywhere;word-break:break-word}
.selectionName{font-size:20px;font-weight:700;line-height:1.2;word-break:break-word}
.selectionBadges{display:flex;gap:8px;flex-wrap:wrap;align-items:center;justify-content:flex-end}
.selectionActions{display:flex;justify-content:flex-end}
.selectionActions .btn{min-width:180px}
.panelSubhead{font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.infoGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.infoCard{padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:#fafcff;min-height:72px}
.infoCard .label{display:block;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.infoCard .value{display:block;font-size:14px;line-height:1.45;word-break:break-word}
.infoCard .value.path{font-family:Consolas,monospace;font-size:12px}
.assessmentBox{border:1px solid var(--line);border-radius:14px;background:#f8fbff;padding:12px;display:flex;flex-direction:column;gap:10px}
.assessmentHead{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.assessmentSummary{font-size:14px;line-height:1.45;color:var(--text)}
.assessmentItems{display:flex;flex-direction:column;gap:8px}
.assessmentItem{display:grid;grid-template-columns:110px 1fr;gap:10px;padding:9px 10px;border-radius:10px;background:#fff;border:1px solid #e6edf7}
.assessmentItemLabel{font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.assessmentItemValue{font-size:13px;line-height:1.45;color:var(--text)}
.assessmentEmpty{font-size:14px;color:var(--muted)}
.badge.ok{background:#e8f7ec;color:#176b2c;border-color:#cdebd6}
.badge.warn{background:#fff6dd;color:#8a6200;border-color:#f1df9e}
.badge.alert{background:#ffe6e3;color:#a63c2f;border-color:#f0c0ba}
.badge.block{background:#ffe6e3;color:#a63c2f;border-color:#f0c0ba}
@media (max-width: 1180px){.sourceLayout{grid-template-columns:1fr}.infoGrid{grid-template-columns:1fr 1fr}}
@media (max-width: 720px){.infoGrid{grid-template-columns:1fr}.previewFrame{min-height:340px}.panelFlowActions{grid-template-columns:1fr}}

/* V8.3.22 file picker source flow */
.stepSummaryRow{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(320px,.8fr);gap:18px;align-items:start;margin-bottom:18px}
.stepSummaryText h3{margin:0;font-size:28px;line-height:1.1}
.stepCurrentRow{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:10px}
.currentStepActions{justify-content:flex-end;align-items:stretch;flex-wrap:wrap}
.currentStepActions .btn{min-width:180px}
.processQueue{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.processCard{position:relative;margin-top:24px;border:1px solid var(--line);border-radius:16px;background:#fff;padding:14px;display:flex;flex-direction:column;gap:12px;min-height:100%}
.processCardLetter{position:absolute;left:50%;top:-24px;transform:translateX(-50%);font-size:28px;line-height:1;font-weight:500;color:#0f172a;pointer-events:none}
.processCard.isCurrent{border-color:var(--primary);box-shadow:0 18px 36px rgba(31,111,235,.14);background:linear-gradient(180deg,#ffffff 0%, #f6faff 100%)}
.processCard.isReady{border-color:#bcd3f7}
.processCard.isDone{border-color:#b5e3c4;background:linear-gradient(180deg,#ffffff 0%, #f3fcf6 100%)}
.processCardHead{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.processCardHead h3{margin:2px 0 0;font-size:18px;line-height:1.2}
.processHelp{margin:0;font-size:13px;line-height:1.45;color:var(--muted)}
.processButtons{display:grid;grid-template-columns:1fr;gap:10px}
.processButtons .btn{width:100%;justify-content:flex-start;text-align:left}
.processButtons .btn.activeStep{background:var(--primary);border-color:var(--primary);color:#fff}

.processCardPlanned{border-style:dashed;background:linear-gradient(180deg,#ffffff 0%, #fbfdff 100%);opacity:.92}
.processCardPlanned .badge{background:#eef2ff;color:#475569}
.processList{margin:0;padding-left:18px;color:var(--muted);display:grid;gap:6px;font-size:13px}
.triColumns{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:start}
.stagePanel{display:flex;flex-direction:column;gap:14px;height:100%}
.sourceBottomGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:start}
.sourceMetaColumn{display:flex;flex-direction:column;gap:12px;min-width:0}
.stageActionsCompact{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;align-items:stretch}
.stageActionsCompact .btn{width:100%}
#clientFilesList{max-height:280px;overflow:auto;padding-right:4px}
#clientSourcePreviewImage,#aaPreviewImage,#panelPreviewImage{display:block}
#clientSourcePreviewImage.hidden,#aaPreviewImage.hidden,#panelPreviewImage.hidden{display:none}
.previewBox{min-height:300px}
.previewImage,.previewFrame{width:100%;min-height:420px;max-height:420px;object-fit:contain;border:1px solid var(--line);border-radius:14px;background:#fff}
#clientSourcePreviewImage,#aaPreviewImage,#panelPreviewImage{min-height:420px;max-height:420px}
.panelActions{display:flex;gap:10px;flex-wrap:wrap}
@media (max-width: 1600px){
  .triColumns{grid-template-columns:repeat(3,minmax(0,1fr))}
  .processQueue{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width: 1280px){
  .stepSummaryRow{grid-template-columns:1fr}
  .currentStepActions{justify-content:flex-start}
  .triColumns{grid-template-columns:1fr}
}
@media (max-width: 980px){
  .processQueue,.sourceBottomGrid,.stageActionsCompact{grid-template-columns:1fr}
  .selectionRow{grid-template-columns:1fr}
  .selectionBadges,.selectionActions{justify-content:flex-start}
}


.clientBillingSummary{border:1px solid var(--line);border-radius:14px;background:#fafcff;padding:12px 14px;font-size:14px;line-height:1.5;color:var(--text);min-height:72px}
.clientBillingSummary strong{font-size:15px}
.modalOverlay{position:fixed;inset:0;background:rgba(15,23,42,.42);display:flex;align-items:center;justify-content:center;padding:20px;z-index:60}
.modalCard{width:min(1100px,100%);max-height:92vh;overflow:auto;background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:0 24px 44px rgba(15,23,42,.22);padding:22px}
.modalGrid{display:grid;grid-template-columns:minmax(280px,.9fr) minmax(0,1.4fr);gap:18px;align-items:start}
.modalSection{display:flex;flex-direction:column;gap:12px}
.modalFormGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
#clientDirectorySelect{min-height:280px}
@media (max-width:980px){.modalGrid,.modalFormGrid{grid-template-columns:1fr}}


.clientDirectoryPreviewEmpty{color:var(--muted)}


.processButtonsPlanned .btn[disabled]{opacity:.75;cursor:not-allowed;}