:root {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: #102b43;
  background: #f2f7f8;
  font-synthesis: none;
  --ink: #102b43;
  --muted: #637c90;
  --teal: #007e6a;
  --teal-dark: #006451;
  --aqua: #00baca;
  --mint: #71dfb8;
  --rose: #c73973;
  --border: #d7e3e9;
  --soft: #f5f9fa;
  --surface: #fff;
  --surface-alt: #f5f9fa;
  --input: #fff;
  --success-bg: #eaf7f1;
  --warning-bg: #fff8e9;
  --error-bg: #fff0f5;
  color-scheme: light;
}
* { box-sizing: border-box; }
body { margin: 0; font-size: 14px; }
button, input, select { font: inherit; }
button, a, input, select { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; }
button:disabled svg { opacity: .7; }
a { color: inherit; text-decoration: none; }
svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
button { white-space: nowrap; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, label:focus-within { outline: 3px solid #30c6d7; outline-offset: 3px; }
input[type="checkbox"] { width: 18px; height: 18px; margin: 0; accent-color: var(--teal); cursor: pointer; flex-shrink: 0; }
[hidden] { display: none !important; }
.app-shell { min-height: 100vh; padding: 15px 24px 20px; }
.main-content { max-width: 1510px; margin: 0 auto; }
.topbar { display: flex; justify-content: space-between; align-items: center; gap: 20px; min-height: 83px; border: 1px solid var(--border); border-radius: 11px; background: #fff; padding: 15px 22px; }
.brand { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.brand-mark { width: 56px; height: 48px; }
.brand-mark svg { width: 56px; height: 48px; stroke-width: 4; stroke-linecap: square; }
.brand-rose { stroke: #cf4c7f; }
.brand-mint { stroke: #55bd9d; }
.brand-aqua { stroke: #00a5b8; }
.brand-wordmark { position: relative; font-size: 29px; line-height: 1.1; letter-spacing: -.95px; font-weight: 900; padding-bottom: 8px; }
.brand-lines { position: absolute; left: 1px; bottom: 0; width: 100%; height: 5px; background: linear-gradient(90deg, var(--mint) 0 33%, var(--rose) 33% 62%, var(--aqua) 62%); }
.brand-product { font-size: 17px; font-weight: 650; letter-spacing: 2px; color: #006e73; border-left: 1px solid #c8d9df; margin-left: 5px; padding-left: 14px; line-height: 1.5; }
.brand-product>span { display: block; font-size: 11px; letter-spacing: 1px; font-weight: 400; color: #637990; }
.topbar-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; justify-content: flex-end; }
.offline-status { display: inline-flex; align-items: center; gap: 8px; max-width: 270px; color: #687f8e; font-size: 12px; line-height: 1.5; }
.offline-status::before { content: ""; width: 7px; height: 7px; flex-shrink: 0; border-radius: 50%; background: #80a59b; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-height: 42px; padding: 10px 17px; border-radius: 7px; border: 1px solid transparent; font-size: 14px; font-weight: 600; line-height: 1.4; transition: background .15s, box-shadow .15s; }
.button svg { width: 18px; height: 18px; }
.button-quiet { background: #fff; border-color: #cbdbe3; color: #35536d; }
.button-quiet:not(:disabled):hover { background: #eef7f6; border-color: #8fb8b3; }
.button-quiet:disabled { color: #a0b0bc; background: #f9fbfc; }
.button-primary { color: white; background: var(--teal); border-color: var(--teal); }
.button-primary:not(:disabled):hover { background: var(--teal-dark); border-color: var(--teal-dark); box-shadow: 0 3px 10px #007e6a20; }
.button-primary:disabled { background: #a1c3ba; border-color: #a1c3ba; color: #fff; }
.button-secondary { background: white; color: #076f60; border-color: #6eaa9d; }
.button-secondary:not(:disabled):hover { background: #e7f8f1; }
.button-secondary:disabled { color: #99b3ad; border-color: #cbddd7; background: #f8fbfa; }
.setup-button { white-space: nowrap; }
.page-heading { display: flex; align-items: center; justify-content: space-between; gap: 22px; padding: 32px 4px 27px; }
.eyebrow { font-size: 11px; letter-spacing: 1.45px; font-weight: 650; color: #628095; margin-bottom: 11px; }
h1 { font-size: clamp(26px, 2.45vw, 35px); line-height: 1.15; letter-spacing: -.8px; margin: 0 0 12px; font-weight: 750; }
.page-heading p { margin: 0; font-size: 14px; line-height: 1.7; color: var(--muted); }
.mode-badge { display: flex; align-items: center; gap: 9px; background: #e9f7f2; border: 1px solid #bddfd2; border-radius: 7px; padding: 10px 12px; color: #277f69; font-size: 12px; font-weight: 600; white-space: nowrap; }
.status-dot { width: 7px; height: 7px; background: #269b7e; border-radius: 50%; flex-shrink: 0; display: inline-block; }
.mode-divider { height: 13px; width: 1px; background: #b1d6c8; margin: 0 2px; }
.card { background: #fff; border: 1px solid var(--border); border-radius: 11px; overflow: hidden; box-shadow: 0 2px 4px #183f5003; }
h2 { margin: 0; font-size: 18px; line-height: 1.3; font-weight: 700; letter-spacing: -.25px; }
.route-workspace { position: relative; }
.route-workspace::before { content: ""; height: 3px; background: linear-gradient(90deg, #72d9b7 0 38%, #d25184 38% 62%, #16becb 62%); position: absolute; inset: 0 0 auto; }
.route-workspace-heading { padding: 24px 24px 19px; display: flex; justify-content: space-between; align-items: center; gap: 20px; }
.route-heading-title { display: flex; align-items: center; gap: 14px; }
.route-icon { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 9px; background: #e7f7f1; border: 1px solid #cae9dd; color: #007f68; }
.route-icon svg { width: 25px; height: 25px; }
.route-heading-title p { margin: 5px 0 0; font-size: 14px; color: #718799; }
.project-actions { display: flex; align-items: center; gap: 9px; }
.load-project { position: relative; cursor: pointer; }
.load-project input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.route-overview { display: flex; align-items: center; gap: 28px; padding: 0 24px 21px; }
.route-name-field { width: min(360px, 40%); flex-shrink: 0; margin-bottom: 0 !important; }
.route-name-field input { font-size: 17px !important; font-weight: 600; background: #fbfdfd !important; }
#routeSummary { color: #688194; font-size: 14px; line-height: 1.7; margin: 19px 0 0; }
.route-stops { border-block: 1px solid #e1ebef; background: #f8fbfc; padding: 14px 24px; }
.route-empty { display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; min-height: 148px; padding: 15px; color: #668093; }
.route-empty strong { margin-top: 14px; font-size: 15px; color: #4c6b7e; font-weight: 600; }
.route-empty p { margin: 8px 0 0; font-size: 13px; line-height: 1.65; }
.route-empty-line { display: flex; gap: 43px; position: relative; }
.route-empty-line::before { content: ""; position: absolute; top: 6px; height: 1px; background: #add1cc; width: 100%; }
.route-empty-line i { display: block; width: 13px; height: 13px; border: 2px solid #7eb7a8; border-radius: 50%; background: #ecf8f1; position: relative; }
.route-empty-line i:nth-child(2) { border-color: #c27d9a; background: #fbedf3; }
.route-empty-line i:nth-child(3) { border-color: #74b8c2; background: #e7f7fa; }
.route-stop { display: flex; align-items: center; gap: 13px; padding: 14px 16px; background: #fff; border: 1px solid #dbe6eb; border-radius: 8px; margin: 8px 0; }
.route-stop.active, .route-stop.selected, .route-stop.reviewing { border-color: #83c4ba; box-shadow: inset 3px 0 #23a68d; background: #f5fcf9; }
.route-stop.excluded { opacity: .6; background: #f8fafb; }
.route-stop>input[type="checkbox"] { margin-right: 2px; }
.route-stop .stop-number, .route-stop .route-number, .route-stop .route-index { display: grid; place-items: center; color: #587b90; background: #edf5f6; border-radius: 50%; width: 29px; height: 29px; font-size: 13px; font-weight: 650; flex-shrink: 0; }
.route-stop>div { min-width: 0; }
.route-stop .route-stop-info, .route-stop .stop-info, .route-stop .route-stop-main, .route-stop .stop-main { flex: 1; }
.route-stop strong { color: #173d56; font-size: 15px; font-weight: 650; }
.route-stop small, .route-stop .stop-meta, .route-stop .route-stop-meta { display: block; color: #758c9c; font-size: 12px; line-height: 1.6; margin-top: 4px; }
.route-stop button { border: 1px solid #cfdee3; border-radius: 6px; background: #fff; color: #407264; padding: 7px 10px; font-size: 13px; }
.route-stop button:hover { background: #edf8f3; }
.route-stop button:disabled { color: #b0bdc3; background: #f9fbfc; }
.route-stop [data-up], .route-stop [data-down] { padding: 7px 9px; }
.route-stop .stop-actions, .route-stop .route-stop-actions { display: flex; gap: 6px; align-items: center; margin-left: auto; }
.route-stop { display: block; }
.route-stop-main { display: flex; align-items: center; gap: 14px; width: 100%; min-width: 0; }
.route-include { display: flex; align-items: center; gap: 13px; cursor: pointer; flex-shrink: 0; }
.stop-text { min-width: 0; flex: 1; }
.stop-text strong { display: block; overflow-wrap: anywhere; }
.stop-text>span { display: block; color: #7b92a3; font-size: 12px; line-height: 1.6; margin-top: 5px; }
.stop-order { display: flex; gap: 5px; }
.route-jobs { display: flex; flex-wrap: wrap; gap: 7px; margin: 13px 0 0 78px; }
.route-stop .job-chip { display: inline-flex; flex-wrap: wrap; gap: 5px 9px; align-items: baseline; max-width: 100%; border-color: #dbe5ea; border-radius: 5px; background: #f7fafc; padding: 7px 9px; font-size: 11px; line-height: 1.5; text-align: left; white-space: normal; overflow-wrap: anywhere; color: #71899a; }
.route-stop .job-chip>span { color: #398d7b; font-size: 10px; white-space: nowrap; }
.route-stop .job-chip.active { color: #2b7966; background: #e9f7ef; border-color: #a7d4c0; }
.route-stop .job-chip:hover { background: #e9f6f2; border-color: #a5cdbc; }
.stop-issues, .stop-warnings { margin: 13px 0 0 78px; font-size: 12px; line-height: 1.7; }
.stop-issues { color: #aa4970; }
.stop-warnings { color: #927547; }
.stop-issues summary, .stop-warnings summary { cursor: pointer; }
.stop-issues ul, .stop-warnings ul { margin: 9px 0 3px; padding-left: 19px; }
.route-stop.blocked { border-color: #edc9d7; background: #fffafb; }
.route-stop .stop-status.error { background: #fce8f0; color: #b34570; }
.route-stop .stop-status.ready { background: #e6f7ed; color: #2b896b; }
.stop-status, .route-status, .route-stop-status { display: inline-flex; padding: 5px 8px; background: #e8f7ef; color: #32866a; font-size: 11px; border-radius: 5px; white-space: nowrap; }
.stop-status.warning, .stop-status.needs-review, .route-status.warning { background: #fff0f5; color: #ac4d72; }
.route-workspace-footer { display: flex; justify-content: space-between; align-items: center; gap: 24px; padding: 20px 24px 17px; }
.checkbox-label { display: flex; align-items: flex-start; gap: 9px; cursor: pointer; color: #607a8d; font-size: 14px; line-height: 1.5; }
.checkbox-label input { margin-top: 1px; }
.route-confirm { max-width: 440px; }
.route-actions { display: flex; gap: 10px; flex-shrink: 0; }
.route-actions #resetRouteProgress { font-size: 12px; font-weight: 500; color: #8c8396; padding: 8px; }
.route-actions #resetRouteProgress:disabled { color: #b6bec7; text-decoration: none; }
.route-local-note { display: flex; gap: 7px; align-items: center; padding: 0 24px 18px; font-size: 12px; color: #8196a4; line-height: 1.6; }
.route-local-note svg { width: 14px; height: 14px; }
.section-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 29px 3px 17px; }
.section-heading>div { display: flex; align-items: center; gap: 10px; }
.section-accent { width: 4px; height: 20px; border-radius: 2px; background: #00afbc; }
.section-heading>span { font-size: 13px; color: #8297a6; }
.stats-strip { display: flex; align-items: center; border: 1px solid var(--border); border-radius: 9px; background: #fff; margin-bottom: 21px; padding: 18px 24px; }
.stat { display: flex; align-items: center; gap: 13px; padding-right: 30px; margin-right: 30px; border-right: 1px solid #e4edf0; }
.stat:nth-child(3) { border: none; }
.stat-icon { color: #278d7b; border: 1px solid #b7d9cf; border-radius: 50%; width: 37px; height: 37px; display: grid; place-items: center; }
.stat-icon svg { width: 20px; height: 20px; }
.stat>div { display: flex; align-items: baseline; gap: 9px; }
.stat strong { font-size: 29px; font-weight: 750; letter-spacing: -.6px; color: #146f5b; }
.stat>div>span { font-size: 13px; color: #6f8799; white-space: nowrap; }
.stat-explainer { display: flex; align-items: center; gap: 7px; color: #8097a4; font-size: 12px; margin-left: auto; }
.stat-explainer svg { color: #55a68c; width: 16px; height: 16px; }
.messages:empty { display: none; }
.messages { margin-bottom: 20px; }
.message { border: 1px solid #d4e7de; border-radius: 8px; padding: 13px 17px; font-size: 14px; line-height: 1.65; background: #edf8f1; color: #34715a; }
.message+.message { margin-top: 8px; }
.message.error { background: #fff0f5; border-color: #f0ccd9; color: #a43a63; }
.message.warning { background: #fff8e9; border-color: #ecdfbb; color: #86672b; }
.message.success { background: #eaf7f1; border-color: #c2e6d4; color: #34715a; }
.message ul { padding-left: 20px; margin: 7px 0 3px; }
.message li { margin: 3px 0; }
.editor-grid { display: grid; grid-template-columns: minmax(370px, .9fr) minmax(480px, 1.3fr); gap: 23px; align-items: start; }
.input-column { display: flex; flex-direction: column; gap: 21px; }
.card-heading { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 22px 24px 19px; }
.heading-label { display: flex; align-items: center; gap: 10px; }
.step-number { width: 27px; height: 27px; display: inline-flex; justify-content: center; align-items: center; background: #edf6f6; border: 1px solid #d7e9e8; color: #4e8a85; font-size: 11px; font-weight: 650; border-radius: 6px; flex-shrink: 0; }
.text-button { border: none; padding: 0; background: transparent; font-size: 13px; color: #168275; font-weight: 600; }
.text-button:hover { color: #006453; text-decoration: underline; }
#clearButton { color: #8d7890; font-size: 12px; }
.dropzone { position: relative; border: 1px dashed #a2c8c9; border-radius: 8px; background: #f1fafa; display: flex; flex-direction: column; align-items: center; text-align: center; padding: 25px 15px 22px; margin: 0 24px; cursor: pointer; transition: background .2s, border-color .2s; }
.dropzone:hover, .dropzone.dragover, .dropzone.drag-over, .dropzone:focus-within { border-color: #3c9f98; background: #e7f7f3; }
.dropzone input { position: absolute; opacity: 0; width: 1px; height: 1px; overflow: hidden; }
.upload-symbol { display: grid; place-items: center; width: 45px; height: 45px; color: #078b80; background: #fff; border: 1px solid #c9e4df; border-radius: 11px; margin-bottom: 15px; }
.upload-symbol svg { width: 26px; height: 26px; }
.dropzone strong { font-size: 17px; font-weight: 600; line-height: 1.5; }
.dropzone>span:not(.upload-symbol) { font-size: 14px; color: #7d94a0; margin-top: 3px; }
.dropzone .browse-link { color: #007d75; font-weight: 600; }
.dropzone small { color: #819aa6; font-size: 11px; margin-top: 15px; line-height: 1.6; }
.demo-row { display: flex; justify-content: center; align-items: center; gap: 8px; margin-top: 18px; font-size: 13px; color: #8194a1; }
.demo-row .text-button { font-size: 13px; }
.microcopy { font-size: 11px; color: #8fa1ac; line-height: 1.6; }
.demo-copy { text-align: center; margin: 7px 15px 20px; }
.file-list:empty { display: none; }
.file-list { display: flex; flex-wrap: wrap; gap: 7px; margin: 15px 24px 0; max-height: 180px; overflow: auto; }
.upload-card > .field, #importFormatSummary { margin-inline:24px; }
.file-chip { border: 1px solid #cfdee4; border-radius: 5px; background: #f7fafb; color: #6c8797; padding: 8px 10px; font-size: 12px; max-width: 100%; overflow: hidden; text-overflow: ellipsis; text-align: left; }
.file-chip.active { background: #e5f7ef; color: #247e62; border-color: #94cbb5; }
.file-chip:hover { border-color: #80b4ad; }
.small-badge { background: #f1f8f7; border: 1px solid #d9e9e5; color: #639487; border-radius: 5px; padding: 5px 6px; font-size: 9px; letter-spacing: .4px; white-space: nowrap; }
#configForm { padding: 0 24px 24px; }
.inspector-note { color: #7a909f; font-size: 12px; line-height: 1.7; margin: -1px 0 20px; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
.field { display: flex; flex-direction: column; min-width: 0; margin-bottom: 19px; }
.field label { color: #4c687e; font-size: 14px; font-weight: 550; margin-bottom: 8px; line-height: 1.4; }
.field input, .field select { height: 42px; border: 1px solid #cddce5; border-radius: 6px; background: white; width: 100%; min-width: 0; color: #24465f; font-size: 14px; padding: 0 11px; }
.field input:hover, .field select:hover { border-color: #92b9ba; }
.field input[readonly] { background: #f2f7f9; color: #6d879b; border-color: #dce6ec; }
.field input::placeholder { color: #a0b1bd; font-size: 12px; }
.field select { appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236c8998' stroke-width='1.8'%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 9px center; padding-right: 30px; }
.field-help { font-size: 12px; color: #8b9fab; margin-top: 7px; }
.section-divider { display: flex; border-top: 1px solid #e5edf0; padding-top: 18px; margin: 2px 0 18px; }
.section-divider span { color: #74929c; font-size: 11px; font-weight: 650; letter-spacing: 1.1px; }
.optional { font-size: 11px; font-weight: 400; color: #9baeb8; }
.remember-label { border-top: 1px solid #e5edf0; padding-top: 18px; font-size: 12px; }
.remember-label input { width: 16px; height: 16px; }
.live-badge { display: flex; align-items: center; gap: 6px; color: #649c85; font-size: 11px; white-space: nowrap; }
.live-badge .status-dot { width: 5px; height: 5px; }
.preview-stage { margin: 0 24px; border: 1px solid #dae7eb; border-radius: 8px; background-color: #f3f8f9; background-image: radial-gradient(#cadde0 .8px, transparent .8px); background-size: 13px 13px; min-height: 318px; padding: 20px 24px 17px; display: flex; flex-direction: column; justify-content: space-between; }
.preview-stage-top, .preview-stage-bottom { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 9px; letter-spacing: .9px; color: #839da9; }
.preview-stage-top { margin-bottom: 24px; }
.preview-stage-bottom { font-size: 10px; letter-spacing: 0; margin-top: 22px; }
.preview-mark { display: flex; align-items: center; gap: 6px; font-size: 9px; letter-spacing: .8px; }
.preview-mark>span { width: 6px; height: 6px; border: 1px solid #81a2af; border-radius: 1px; }
.label-preview { display: flex; flex-direction: column; justify-content: center; background: #fff; border: 1px solid #d7e2e5; box-shadow: 0 6px 12px #2854630b, 0 1px 2px #28546308; border-radius: 4px; min-height: 202px; width: 100%; padding: 23px 25px; overflow: hidden; color: #192b34; }
.label-paper { width: 100%; color: #172b35; font-family: Arial, Helvetica, sans-serif; font-size: clamp(13px, 1.14vw, 17px); line-height: 1.15; font-weight: 400; }
.label-line { white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.15; }
.label-line:empty:after { content: "\00a0"; }
.preview-empty { display: flex; align-items: center; flex-direction: column; text-align: center; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.preview-empty svg { width: 38px; height: 38px; color: #a4c1c9; margin-bottom: 15px; }
.empty-label-icon { color: #aac4ce; font-size: 36px; margin-bottom: 9px; }
.preview-empty strong, .preview-empty h3 { font-size: 16px; font-weight: 550; color: #6c8798; margin: 0; }
.preview-empty p { color: #92a5b0; font-size: 13px; line-height: 1.7; margin: 9px 0 0; }
.preview-navigation { display: flex; justify-content: space-between; align-items: center; gap: 15px; margin: 17px 24px 25px; }
.preview-meta { font-size: 12px; color: #8299a7; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.preview-controls { display: flex; align-items: center; gap: 11px; font-size: 12px; color: #5f7b8d; white-space: nowrap; }
.icon-button { width: 32px; height: 32px; padding: 0; display: inline-flex; justify-content: center; align-items: center; background: #fff; border: 1px solid #d4e2e6; color: #577c86; border-radius: 6px; }
.icon-button svg { width: 15px; height: 15px; }
.icon-button:not(:disabled):hover { background: #eaf7f4; }
.icon-button:disabled { color: #bacbd1; background: #f8fbfc; border-color: #e4edf0; }
.output-settings { background: #fbfdfd; border-top: 1px solid #e0eaed; padding: 25px 24px; }
.output-heading { display: flex; justify-content: space-between; gap: 20px; }
.output-heading h3 { font-size: 18px; font-weight: 650; letter-spacing: -.2px; margin: 0 0 9px; }
.output-heading p { color: #8299a5; margin: 0; font-size: 13px; line-height: 1.7; }
.output-heading>svg { color: #95b1b8; width: 24px; height: 24px; margin-top: 4px; }
.size-fields { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 14px; margin-top: 23px; }
.unit-input { display: flex; position: relative; align-items: center; }
.unit-input input { padding-right: 36px; }
.unit-input>span { position: absolute; right: 12px; top: 15px; color: #8ca4af; font-size: 11px; pointer-events: none; }
.unit-input input::-webkit-inner-spin-button { appearance: none; }
.export-actions { display: grid; grid-template-columns: 1fr auto; gap: 11px; }
.export-note { display: flex; align-items: flex-start; gap: 8px; margin-top: 15px; color: #7b96a3; }
.export-note svg { width: 15px; height: 15px; margin-top: 2px; }
.export-note p { font-size: 12px; line-height: 1.7; margin: 0; }
.queue-card { margin-top: 24px; }
.queue-heading { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 23px 24px 20px; }
.queue-title { display: flex; align-items: center; gap: 12px; }
.count-badge { display: inline-flex; border: 1px solid #cee4dc; background: #eff8f4; color: #6b9785; border-radius: 6px; padding: 5px 8px; font-size: 12px; }
.search-field { position: relative; width: 315px; }
.search-field>svg { position: absolute; left: 12px; top: 12px; width: 16px; height: 16px; color: #93acb8; }
.search-field>input { height: 40px; width: 100%; border: 1px solid #d1dfe6; border-radius: 6px; color: #42677b; font-size: 13px; padding: 0 12px 0 36px; background: #fff; }
.search-field>input::placeholder { color: #94aab7; }
.table-scroll { overflow: auto; }
table { width: 100%; border-collapse: collapse; text-align: left; white-space: nowrap; }
thead { background: #f3f8fa; border-block: 1px solid #e0e9ee; }
th { color: #6f8a9c; font-size: 11px; text-transform: uppercase; font-weight: 600; letter-spacing: .5px; padding: 14px 18px; }
.checkbox-cell { width: 58px; padding-left: 25px; }
td { border-bottom: 1px solid #e7eef2; color: #45667a; padding: 15px 18px; font-size: 14px; max-width: 400px; overflow: hidden; text-overflow: ellipsis; }
td:first-child { padding-left: 25px; }
tbody tr:hover { background: #f8fcfc; }
tbody tr.previewed, tbody tr.selected, tbody tr.is-active { background: #edf9f4; }
td small { display: block; margin-top: 5px; color: #8ca1ad; font-size: 12px; }
.mono { font-family: ui-monospace, "SFMono-Regular", Menlo, monospace; font-size: 12px; }
.row-preview { border: 0; background: none; padding: 0; color: #087f72; font-size: 14px; text-decoration: underline; text-decoration-color: #8dcbbf; text-underline-offset: 4px; }
.empty-table-row td { padding: 0; max-width: none; }
.table-empty { min-height: 180px; padding: 28px; display: flex; align-items: center; justify-content: center; flex-direction: column; text-align: center; }
.table-empty svg { width: 27px; height: 27px; color: #adc5cd; margin-bottom: 13px; }
.table-empty strong { color: #728c9e; font-size: 14px; font-weight: 550; }
.table-empty>span { color: #96aab6; font-size: 12px; margin-top: 9px; line-height: 1.7; white-space: normal; }
.empty-table { text-align: center; color: #8ba2af; padding: 50px 20px; font-size: 14px; white-space: normal; }
.queue-footer { display: flex; justify-content: space-between; padding: 15px 25px; color: #859da9; font-size: 12px; gap: 15px; }
.queue-footer>span:last-child { display: flex; align-items: center; gap: 6px; }
.queue-footer .status-dot { width: 5px; height: 5px; background: #7fb7a3; }
.main-footer { display: flex; align-items: center; justify-content: space-between; gap: 20px; color: #8aa0ae; font-size: 11px; line-height: 1.6; margin-top: 24px; padding: 0 3px; }
.main-footer>span:first-child { display: flex; align-items: center; gap: 7px; }
.main-footer svg { width: 13px; height: 13px; }
.main-footer>span:last-child { letter-spacing: .8px; }
dialog { border: 1px solid #c7dce2; border-radius: 15px; color: var(--ink); width: min(650px, calc(100vw - 30px)); max-height: calc(100vh - 45px); padding: 28px 32px; box-shadow: 0 25px 100px #133c4c40; }
dialog::backdrop { background: #102b43c2; backdrop-filter: blur(4px); }
.dialog-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 21px; }
.dialog-icon { width: 46px; height: 46px; border: 1px solid #bfe1d5; border-radius: 11px; background: #eaf8f2; color: #25816d; display: grid; place-items: center; }
.dialog-icon svg { width: 23px; height: 23px; }
dialog h2 { font-size: 27px; font-weight: 700; letter-spacing: -.6px; }
.dialog-intro { font-size: 14px; line-height: 1.75; color: #7890a1; margin: 12px 0 27px; }
.help-option { display: flex; gap: 14px; margin: 25px 0; }
.help-option .step-number { margin-top: 1px; }
.help-option h3 { font-size: 16px; margin: 3px 0 10px; font-weight: 650; }
.help-option p { font-size: 14px; line-height: 1.75; color: #678397; margin: 0; }
.help-option .help-fine { color: #91a5b1; font-size: 12px; margin-top: 12px; }
.help-notice { display: flex; gap: 11px; padding: 15px; border: 1px solid #d2e9e1; border-radius: 8px; background: #eff9f5; color: #5c8b7e; }
.help-notice>svg { width: 17px; height: 17px; margin-top: 2px; }
.help-notice p { font-size: 13px; line-height: 1.75; margin: 0; }
.help-links { display: flex; flex-wrap: wrap; gap: 18px; font-size: 12px; color: #278c7a; margin-top: 21px; }
.help-links a { border-bottom: 1px solid #acd7c9; padding-bottom: 3px; }
.help-links a:hover { color: #005d50; }
.help-footer { font-size: 12px; color: #8ca5ae; border-top: 1px solid #e3ecef; padding-top: 18px; margin-top: 25px; }
.help-footer strong { color: #638f8b; font-weight: 550; }
.route-print-progress { color: #2d9b80; font-size: 12px; font-weight: 650; letter-spacing: .6px; margin-bottom: 11px; }
.route-print-body { background: #f4f9fb; border: 1px solid #d7e5eb; border-radius: 8px; padding: 20px; margin-bottom: 22px; color: #456d7e; font-size: 14px; line-height: 1.8; }
.route-print-body:empty { display: none; }
.route-print-body h3 { margin: 0 0 9px; font-size: 19px; color: #264e65; }
.route-print-body p { margin: 7px 0; }
.route-print-body ul { padding-left: 20px; margin: 10px 0; }
.route-print-actions { display: flex; gap: 12px; margin-top: 25px; }
.route-print-actions .button { flex: 1; }
.route-skip { display: block; margin: 20px auto 0; color: #a06281; font-size: 12px; }
#printArea { display: none; }
@media (min-width: 1600px) { .app-shell { padding-inline: 45px; } .editor-grid { grid-template-columns: .85fr 1.35fr; } .preview-stage { min-height: 360px; } .label-preview { min-height: 230px; } }
@media (max-width: 1200px) {
  .app-shell { padding: 13px 19px 20px; }
  .topbar { padding: 15px 18px; }
  .brand-wordmark { font-size: 25px; }
  .brand-mark, .brand-mark svg { width: 47px; height: 42px; }
  .brand-product { font-size: 14px; padding-left: 10px; margin-left: 2px; }
  .brand-product>span { font-size: 10px; }
  .offline-status { max-width: 180px; font-size: 11px; }
  .topbar-actions { gap: 9px; }
  .topbar-actions .button { font-size: 12px; padding: 9px 12px; min-height: 38px; }
  .route-workspace-footer { align-items: flex-start; }
  .route-confirm { font-size: 13px; max-width: 310px; }
  .route-actions .button { font-size: 13px; padding-inline: 13px; }
  .editor-grid { grid-template-columns: minmax(340px, .95fr) minmax(410px, 1.2fr); gap: 20px; }
  .stat { padding-right: 25px; margin-right: 25px; }
  .stat-explainer { display: none; }
  .stat:nth-child(3) { margin-right: 0; padding-right: 0; }
  .card-heading { padding-inline: 21px; }
  .card-heading h2 { font-size: 17px; }
  .dropzone, .preview-stage, .file-list, .upload-card > .field, #importFormatSummary { margin-inline: 21px; }
  #configForm, .output-settings { padding-inline: 21px; }
  .field-row { gap: 12px; }
  .optional { display: none; }
  .preview-stage { padding-inline: 17px; }
  .label-preview { padding-inline: 19px; }
  .preview-stage-bottom { font-size: 8px; }
  .preview-navigation { margin-inline: 21px; }
  .preview-meta { font-size: 11px; }
  .preview-controls { gap: 8px; font-size: 11px; }
  .small-badge { font-size: 8px; }
  .export-actions .button { padding-inline: 13px; font-size: 13px; }
}
@media (max-width: 950px) {
  .page-heading { align-items: flex-start; }
  .page-heading .mode-badge { margin-top: 29px; font-size: 10px; }
  .topbar { flex-wrap: wrap; }
  .topbar-actions { margin-left: auto; }
  .offline-status { display: none; }
  .route-workspace-heading { padding-inline: 21px; }
  .route-heading-title p { font-size: 12px; }
  .route-heading-title h2 { font-size: 17px; }
  .project-actions .button { font-size: 12px; padding: 9px 11px; }
  .project-actions .button svg { width: 16px; height: 16px; }
  .route-workspace-footer { flex-wrap: wrap; gap: 17px; }
  .route-confirm { max-width: none; }
  .route-actions { margin-left: auto; }
  .route-overview { gap: 20px; padding-inline: 21px; }
  .route-stops { padding-inline: 20px; }
  .route-stop { gap: 10px; padding: 12px; flex-wrap: wrap; }
  .route-stop button { font-size: 12px; }
  .editor-grid { grid-template-columns: minmax(0, 1fr); }
  .input-column { display: grid; grid-template-columns: .9fr 1.1fr; align-items: start; gap: 20px; }
  .upload-card .card-heading { flex-wrap: wrap; gap: 7px; }
  .settings-card .small-badge { display: none; }
  .field-row { grid-template-columns: 1fr; }
  .panel-fields { grid-template-columns: 1fr 1fr; }
  .field { margin-bottom: 15px; }
  .field label { font-size: 14px; }
  .preview-stage { min-height: 340px; }
  .label-preview { width: 90%; margin-inline: auto; min-height: 220px; }
  .label-paper { font-size: 17px; }
  .preview-stage-top, .preview-stage-bottom { font-size: 10px; }
  .size-fields { max-width: 500px; }
  .export-actions { grid-template-columns: 1fr 170px; }
  .stat { flex: 1; padding-right: 22px; margin-right: 22px; }
  .stat>div { display: block; }
  .stat>div>span { display: block; font-size: 11px; margin-top: 2px; }
  .stat strong { font-size: 27px; }
  .stat-icon { width: 33px; height: 33px; }
  .main-footer>span:last-child { display: none; }
}
@media (max-width: 680px) {
  .app-shell { padding: 10px 13px 20px; }
  .topbar { padding: 14px; gap: 16px; }
  .brand { gap: 7px; }
  .brand-wordmark { font-size: 23px; }
  .brand-mark, .brand-mark svg { width: 42px; height: 39px; }
  .brand-product { font-size: 13px; letter-spacing: 1.5px; padding-left: 10px; margin-left: 4px; }
  .brand-product>span { font-size: 9px; }
  .topbar-actions { width: 100%; justify-content: space-between; flex-direction: row; margin: 0; gap: 8px; }
  .offline-status { display: inline-flex; font-size: 10px; max-width: 170px; }
  .topbar-actions .button { min-height: 34px; font-size: 11px; padding: 7px 10px; }
  .setup-button svg { width: 14px; height: 14px; }
  .page-heading { display: block; padding: 27px 3px 22px; }
  .eyebrow { font-size: 9px; letter-spacing: 1px; }
  h1 { font-size: 28px; line-height: 1.18; letter-spacing: -.6px; }
  .page-heading p { font-size: 14px; line-height: 1.7; }
  .page-heading .mode-badge { display: inline-flex; margin-top: 17px; font-size: 11px; padding: 8px 10px; }
  .route-workspace-heading { padding: 21px 17px 17px; flex-wrap: wrap; gap: 18px; }
  .route-heading-title { gap: 11px; }
  .route-heading-title h2 { font-size: 18px; }
  .route-heading-title p { font-size: 12px; }
  .route-icon { width: 39px; height: 39px; }
  .project-actions { width: 100%; }
  .project-actions .button { flex: 1; font-size: 12px; }
  .route-overview { padding: 0 17px 18px; display: block; }
  .route-name-field { width: 100%; }
  #routeSummary { font-size: 13px; margin-top: 13px; }
  .route-stops { padding: 11px 14px; }
  .route-empty { min-height: 168px; padding: 17px 8px; }
  .route-empty strong { font-size: 14px; }
  .route-empty p { font-size: 12px; }
  .route-stop { gap: 9px; }
  .route-stop-main { gap: 10px; flex-wrap: wrap; }
  .route-include { gap: 8px; }
  .stop-text { flex-basis: calc(100% - 65px); }
  .stop-order { margin-left: auto; }
  .route-stop .stop-status { margin-left: 59px; margin-top: 1px; }
  .route-jobs, .stop-issues, .stop-warnings { margin-left: 0; }
  .route-stop strong { font-size: 14px; }
  .route-stop small, .route-stop .stop-meta, .route-stop .route-stop-meta { font-size: 11px; }
  .route-stop .stop-actions, .route-stop .route-stop-actions { width: 100%; justify-content: flex-end; padding-top: 8px; border-top: 1px solid #e8f0f3; margin-top: 4px; }
  .route-workspace-footer { padding: 17px; gap: 17px; }
  .route-confirm { font-size: 13px; }
  .route-actions { display: grid; grid-template-columns: 1fr; width: 100%; gap: 9px; }
  .route-actions #resetRouteProgress { order: 3; padding-top: 3px; padding-bottom: 0; }
  .route-actions .button { min-height: 43px; font-size: 14px; }
  .route-local-note { padding: 0 17px 17px; align-items: flex-start; font-size: 11px; }
  .route-local-note svg { margin-top: 2px; }
  .section-heading { padding-top: 26px; padding-bottom: 14px; align-items: flex-start; }
  .section-heading h2 { font-size: 17px; }
  .section-heading>span { font-size: 10px; max-width: 125px; text-align: right; line-height: 1.6; }
  .stats-strip { padding: 15px 16px; margin-bottom: 18px; }
  .stat { gap: 0; padding-right: 14px; margin-right: 14px; }
  .stat-icon { display: none; }
  .stat strong { font-size: 25px; }
  .stat>div>span { font-size: 10px; white-space: normal; line-height: 1.4; }
  .input-column { display: flex; gap: 19px; }
  .card-heading { padding: 20px 18px 17px; }
  .card-heading h2 { font-size: 17px; }
  .upload-card .card-heading { flex-wrap: nowrap; }
  #clearButton { font-size: 11px; }
  .dropzone { margin-inline: 18px; padding: 23px 12px; }
  .dropzone strong { font-size: 16px; }
  .dropzone small { font-size: 10px; }
  .file-list, .upload-card > .field, #importFormatSummary { margin-inline: 18px; }
  .file-chip { font-size: 11px; }
  .settings-card .small-badge { display: block; font-size: 8px; }
  #configForm { padding: 0 18px 21px; }
  .inspector-note { font-size: 12px; }
  .field-row { grid-template-columns: 1fr 1fr; gap: 13px; }
  .field { margin-bottom: 17px; }
  .field label { font-size: 14px; }
  .field input, .field select { font-size: 14px; height: 42px; }
  .field input::placeholder { font-size: 11px; }
  .field-help { font-size: 11px; }
  .remember-label { font-size: 12px; }
  .preview-stage { margin: 0 17px; min-height: 280px; padding: 16px 13px; }
  .preview-stage-top { font-size: 8px; margin-bottom: 19px; }
  .preview-stage-bottom { font-size: 8px; gap: 12px; margin-top: 18px; }
  .preview-stage-bottom>span:last-child { max-width: 130px; line-height: 1.5; text-align: right; }
  .preview-mark { font-size: 8px; }
  .label-preview { width: 100%; padding: 20px 13px; min-height: 180px; }
  .label-paper { font-size: 12px; }
  .preview-empty strong, .preview-empty h3 { font-size: 14px; }
  .preview-empty p { font-size: 12px; }
  .preview-navigation { margin: 15px 17px 21px; gap: 10px; }
  .preview-meta { max-width: 195px; font-size: 10px; }
  .preview-controls { font-size: 10px; gap: 7px; }
  .icon-button { width: 28px; height: 28px; }
  .live-badge { font-size: 9px; }
  .output-settings { padding: 22px 18px; }
  .output-heading h3 { font-size: 17px; }
  .output-heading p { font-size: 12px; }
  .size-fields { gap: 11px; margin-top: 21px; }
  .size-fields .field label { font-size: 13px; }
  .export-actions { grid-template-columns: 1fr auto; gap: 9px; }
  .export-actions .button { padding: 10px 11px; font-size: 12px; }
  .export-actions .button svg { width: 16px; height: 16px; }
  .export-note p { font-size: 11px; }
  .queue-card { margin-top: 20px; }
  .queue-heading { padding: 21px 18px 18px; flex-direction: column; align-items: stretch; gap: 16px; }
  .queue-title h2 { font-size: 17px; }
  .search-field { width: 100%; }
  .search-field>input { font-size: 12px; }
  th { font-size: 10px; }
  td { font-size: 13px; }
  .table-empty { min-height: 180px; padding: 25px 20px; }
  .table-empty strong { font-size: 14px; }
  .table-empty>span { font-size: 12px; }
  .queue-footer { padding: 14px 18px; font-size: 10px; }
  .main-footer { align-items: flex-start; font-size: 10px; margin-top: 20px; }
  .main-footer>span:first-child { align-items: flex-start; }
  .main-footer svg { margin-top: 2px; }
  dialog { padding: 23px; }
  dialog h2 { font-size: 24px; }
  .dialog-intro { font-size: 13px; }
  .help-option { gap: 10px; }
  .help-option h3 { font-size: 15px; }
  .help-option p { font-size: 13px; }
  .help-option .help-fine { font-size: 11px; }
  .help-notice p { font-size: 12px; }
  .route-print-actions { flex-direction: column; gap: 9px; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; scroll-behavior: auto !important; } }
@media print {
  html, body { margin: 0 !important; padding: 0 !important; background: #fff !important; color: #000 !important; }
  .app-shell, dialog { display: none !important; }
  #printArea { display: block !important; }
  .print-label { display: flex; flex-direction: column; justify-content: center; box-sizing: border-box; margin: 0 !important; padding: 2mm 3mm; break-after: page; page-break-after: always; overflow: hidden; color: #000; background: #fff; font-family: Arial, Helvetica, sans-serif; line-height: 1.15; }
  .print-label:last-child { break-after: auto; page-break-after: auto; }
  .print-line { white-space: nowrap; }
  .print-line:empty:after { content: "\00a0"; }
}
/* Explicit local A/Z endpoint ownership. */
.endpoint-context{padding:12px 14px;border:1px solid #bcded9;border-left:3px solid #008f92;border-radius:7px;background:#eefaf7;color:#214e57;font-size:13px;line-height:1.65;margin:4px 0 18px}

/* The physical flag stays proportional at every viewport size. Guides are preview-only. */
.label-preview:has(.flag-svg){padding:15px;align-items:center;background:#edf4f4;border:0;box-shadow:none;min-height:0;overflow:visible}
.label-preview > .flag-svg{display:block;width:200px;max-width:100%;height:auto;border:1px solid #d3dfdf;box-shadow:0 5px 14px #1737401a}
.flag-profile-note,.font-note{font-size:12px;line-height:1.5;margin:8px 0;color:#607a8d}
.font-note{padding:9px 11px;background:#f2f7f6;border-radius:6px}
.size-fields input[readonly]{color:#536d7c;background:#f4f7f8;cursor:default;font-size:12px}
.printer-status{max-width:170px;font-size:11px;color:#536d7c;overflow-wrap:anywhere}
@media print{.print-label{display:block;padding:0!important}.print-label .flag-svg{display:block;width:129.2pt;height:68pt}}

/* Endpoint review and span exports */
.route-policy-note { margin: 14px 24px; color: #4d6878; line-height: 1.6; }
.endpoint-confirm { margin-top: 20px; line-height: 1.6; align-items: flex-start; }
.endpoint-confirm input { margin-top: 3px; }
#endpointReviewStatus { line-height: 1.6; margin-bottom: 16px; }
#endpointReviewStatus.review-blocked { color: #935112; }
.export-actions { grid-template-columns: 1fr 1fr; }
#exportButton { grid-column: 1 / -1; }
.panel-presets { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin:12px 0 20px; }
.panel-presets > span { width:100%; color:#607a8d; font-size:12px; }
.panel-presets .button { padding:9px 12px; font-size:12px; white-space:normal; }

/* Selected-batch preparation keeps source corrections separate from setup. */
.route-preflight { margin:0 24px 22px; padding:18px; border:1px solid #d5e6e3; border-radius:12px; background:#f5faf8; }
.route-preflight[hidden] { display:none; }
.route-preflight-heading h3 { margin:0 0 6px; color:#173b49; font-size:17px; }
.route-preflight-heading p { margin:0; color:#607a89; font-size:12px; line-height:1.6; }
.route-preflight-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:14px; align-items:start; }
.route-preflight-card { padding:14px; background:#fff; border:1px solid #dbe6e8; border-radius:9px; min-width:0; }
.route-preflight-card h4 { display:flex; flex-wrap:wrap; gap:7px; align-items:center; margin:0 0 9px; color:#173b49; font-size:13px; }
.route-preflight-card h4>span { font-size:10px; font-weight:600; border-radius:5px; padding:4px 6px; background:#edf5f5; color:#496c79; }
.route-preflight-card[data-preflight-category="source"].needs-attention { border-color:#e3bdcc; }
.route-preflight-card[data-preflight-category="source"].needs-attention h4>span { background:#fce8f0; color:#a63e67; }
.route-preflight-card>p { margin:0; color:#607a89; font-size:11px; line-height:1.6; }
.route-preflight-card ul { list-style:none; padding:0; margin:12px 0 0; }
.route-preflight-card li { display:flex; flex-direction:column; align-items:flex-start; gap:9px; padding:10px 0; border-top:1px solid #e4edee; }
.route-preflight-card li:first-child { padding-top:0; border-top:0; }
.route-preflight-card li>div { min-width:0; width:100%; overflow-wrap:anywhere; }
.route-preflight-card li strong,.route-preflight-card li span,.route-preflight-card li small { display:block; }
.route-preflight-card li strong { font-size:12px; color:#254c5a; }
.route-preflight-card li span,.route-preflight-card li small { margin-top:4px; font-size:11px; line-height:1.5; color:#607a89; }
.route-preflight-card .route-preflight-reason { margin:7px 0 0; color:#8a4b62; font-size:11px; line-height:1.55; }
.route-preflight-card .button { padding:8px 11px; font-size:11px; white-space:normal; }
.route-preflight-card summary { cursor:pointer; margin-top:8px; font-size:11px; color:#247d6c; }
.span-endpoint-actions { display:flex; align-items:center; flex-wrap:wrap; gap:8px 14px; }
.span-fix-issues { color:#a63e67; font-weight:650; }
@media(max-width:1000px) { .route-preflight-grid { grid-template-columns:1fr; } .route-preflight-card li { flex-direction:row; align-items:center; justify-content:space-between; } .route-preflight-card li>div { flex:1; } .route-preflight-card .button { flex-shrink:0; } }
@media(max-width:560px) { .route-preflight { margin-inline:14px; padding:13px; } .route-preflight-card li { flex-direction:column; align-items:flex-start; } }
@media screen {
  :root[data-theme="dark"] .route-preflight { background:var(--surface-alt); border-color:var(--border); }
  :root[data-theme="dark"] .route-preflight-card { background:var(--surface); border-color:var(--border); }
  :root[data-theme="dark"] :is(.route-preflight-heading h3,.route-preflight-card h4,.route-preflight-card li strong) { color:var(--ink); }
  :root[data-theme="dark"] :is(.route-preflight-heading p,.route-preflight-card>p,.route-preflight-card li span,.route-preflight-card li small) { color:var(--muted); }
  :root[data-theme="dark"] .route-preflight-card h4>span { background:#263d4b; color:#c3d5df; }
  :root[data-theme="dark"] .route-preflight-card[data-preflight-category="source"].needs-attention { border-color:#a5607d; }
  :root[data-theme="dark"] .route-preflight-card[data-preflight-category="source"].needs-attention h4>span { background:var(--error-bg); color:#f5b0c9; }
  :root[data-theme="dark"] .route-preflight-card li { border-color:var(--border); }
  :root[data-theme="dark"] :is(.route-preflight-card .route-preflight-reason,.span-fix-issues) { color:#f1a3c1; }
  :root[data-theme="dark"] .route-preflight-card summary { color:var(--mint); }
}

/* Span selection and independently confirmed endpoint progress. */
#spanChecklist { padding:0 24px 24px; }
.span-checklist-heading { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; margin:8px 0 12px; }
.span-checklist-heading h3 { margin:0 0 5px; font-size:16px; color:#173746; }
.span-checklist-heading p,.span-checklist-note { margin:0; color:#607a89; font-size:12px; line-height:1.65; }
.span-selection-actions { display:flex; flex-wrap:wrap; gap:14px; }
.span-checklist-rows { display:grid; gap:12px; margin:16px 0; }
.span-checklist-row { border:1px solid #dbe6e8; border-radius:12px; background:#fbfdfd; overflow:hidden; }
.span-checklist-row.selected { border-color:#aecfc9; background:#fff; }
.span-batch-choice { display:flex; align-items:flex-start; gap:11px; padding:16px 18px 12px; cursor:pointer; }
.span-batch-choice input { margin-top:3px; accent-color:#087c70; }
.span-batch-choice strong { display:block; font-size:13px; color:#173b49; overflow-wrap:anywhere; }
.span-batch-choice small { display:block; margin-top:5px; color:#647f8e; font-size:11px; overflow-wrap:anywhere; }
.span-endpoints { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; padding:0 18px 16px; }
.span-endpoint { padding:12px 14px; border:1px solid #e2eaeb; border-radius:8px; background:#f6f9fa; min-width:0; }
.span-endpoint.is-printed { background:#edf8f2; border-color:#c6e3d5; }
.span-endpoint-title { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:7px; }
.span-endpoint-title strong { font-size:12px; color:#294a5b; overflow-wrap:anywhere; }
.span-endpoint-status { padding:4px 7px; border-radius:5px; background:#e6efed; color:#30665a; font-size:10px; font-weight:700; white-space:nowrap; }
.span-endpoint-status.has-error { background:#fff0ed; color:#a34738; }
.span-endpoint p { margin:7px 0; color:#6a7f8e; font-size:11px; line-height:1.5; }
.span-review { display:block; text-align:left; font-size:11px; margin-top:6px; }
.span-panel-setup { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto; align-items:end; gap:10px; padding:14px 18px; border-top:1px solid #e4ebed; background:#f6faf9; }
.span-panel-setup label { display:grid; gap:6px; color:#466171; font-size:11px; font-weight:600; min-width:0; }
.span-panel-setup input { width:100%; box-sizing:border-box; padding:9px 10px; border:1px solid #cfdddf; border-radius:6px; background:white; color:#183a48; font:inherit; font-size:12px; }
.span-panel-setup small { grid-column:1 / -1; color:#687f8d; font-size:10px; line-height:1.5; }
.span-panel-setup .button { padding:9px 12px; font-size:11px; }
.stop-status.setup { background:#e8f0ef; color:#4e706b; }
.panel-setup-issues,.all-source-issues { color:#5c7483; }
@media(max-width:700px) {
  #spanChecklist { padding-left:16px; padding-right:16px; }
  .span-endpoints,.span-panel-setup { grid-template-columns:1fr; }
  .span-panel-setup .button { justify-self:start; }
}

.validation-group{border:1px solid var(--border,#dbe4e8);border-radius:12px;padding:12px 16px;margin:8px 0;background:#fff;font-size:13px;line-height:1.55}
.validation-group summary{cursor:pointer;font-weight:650}
.validation-group ul{padding-left:20px;margin-bottom:0}
.validation-group.error{border-color:#eccbc8;background:#fff7f6;color:#852d28}
.validation-group.notes{color:#586875;background:#f6f9fa}

/* Verified source corrections stay separate from label layout and print progress. */
.route-job-actions { display:flex; flex-direction:column; align-items:flex-start; gap:6px; }
.route-job-actions .route-source-review { margin:0 8px; font-size:11px; }
.source-review-dialog { width:min(1120px,calc(100vw - 48px)); max-width:1120px; max-height:calc(100vh - 48px); padding:0; border:1px solid #d7e5e5; border-radius:18px; color:#243f4c; background:white; box-shadow:0 30px 100px #102e3b44; }
.source-review-dialog::backdrop { background:#102c3b99; }
.source-review-shell { display:flex; flex-direction:column; max-height:calc(100vh - 52px); }
.source-review-header { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; padding:24px 28px 18px; border-bottom:1px solid #dce7e7; background:#f6faf9; }
.source-review-header h2 { margin:5px 0 8px; font-size:23px; }
.source-review-header p { margin:0; color:#627b88; font-size:12px; overflow-wrap:anywhere; }
.source-review-scroll { overflow:auto; padding:22px 28px; overscroll-behavior:contain; }
.source-review-intro { margin:0 0 18px; color:#4f6c79; font-size:13px; line-height:1.7; }
.source-issue-group { border:1px solid #e3ded3; border-radius:9px; margin:8px 0; padding:12px 14px; background:#fffdf7; font-size:12px; line-height:1.6; }
.source-issue-group summary { font-weight:700; cursor:pointer; color:#71562d; }
.source-issue-group summary span { margin-left:9px; color:#8a785d; font-weight:400; }
.source-issue-group p { color:#6f614d; }
.source-issue-group ul { padding-left:18px; overflow-wrap:anywhere; }
.source-actual-port { padding:16px 18px; border:1px solid #e4cfac; border-radius:10px; background:#fffaf1; margin:18px 0; }
.source-actual-port h3 { margin:0 0 8px; font-size:15px; }
.source-actual-port p { color:#77664b; font-size:12px; line-height:1.6; }
.source-actual-values { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:8px; margin:14px 0; max-height:180px; overflow:auto; font-size:12px; }
.source-actual-values code { white-space:pre-wrap; overflow-wrap:anywhere; }
.source-actual-values span { color:#99601b; font-size:11px; }
.source-actual-port label { display:grid; gap:7px; font-size:12px; font-weight:600; }
.source-actual-port select { padding:10px; border:1px solid #d8c9ad; border-radius:6px; background:white; color:#3d505b; width:100%; }
.source-review-toolbar { display:flex; justify-content:space-between; align-items:center; gap:12px; margin:24px 0 14px; flex-wrap:wrap; }
#sourceEndpointTabs { display:flex; flex-wrap:wrap; gap:8px; }
.source-endpoint-tab { border:1px solid #cddedc; border-radius:7px; padding:10px 14px; background:white; color:#48656f; font:inherit; font-size:12px; cursor:pointer; }
.source-endpoint-tab.active { background:#e4f2ee; border-color:#5ca394; color:#126957; font-weight:700; }
.source-review-toolbar label { display:flex; gap:8px; align-items:center; color:#5d7885; font-size:12px; }
.source-review-toolbar select { padding:8px; border:1px solid #ccdce0; border-radius:6px; background:white; color:#355766; }
.source-record { border:1px solid #d9e6e7; border-radius:10px; margin:12px 0; overflow:hidden; }
.source-record>header { display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px; padding:12px 16px; background:#eff6f5; color:#315d62; font-size:12px; }
.source-record.has-source-issues>header { background:#f9f4e8; color:#765e31; }
.source-record>header span { font-weight:400; font-size:11px; }
.source-row-issues { margin:0; padding:12px 18px 12px 32px; font-size:11px; line-height:1.6; color:#8a5142; background:#fffaf7; overflow-wrap:anywhere; }
.source-value-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; padding:18px 16px; }
.source-field { display:flex; flex-direction:column; gap:7px; min-width:0; color:#355764; font-size:12px; }
.source-field>span:first-child { font-weight:700; }
.source-field small { font-weight:400; font-size:10px; color:#718a94; }
.source-field>span:first-child small { margin-left:7px; }
.source-original { font-size:11px; color:#71818b; }
.source-original code,.source-cell-original code { white-space:pre-wrap; overflow-wrap:anywhere; }
.source-field input { width:100%; box-sizing:border-box; padding:10px 11px; border:1px solid #cddcdf; border-radius:6px; font:inherit; color:#173f50; background:white; }
.source-field.draft-changed input { border-color:#2d8e7a; box-shadow:0 0 0 1px #2d8e7a22; }
.source-field .source-cell-warning { color:#a2612b; }
.source-use-literal { align-self:flex-start; font-size:11px; }
.source-cell-original { font-size:10px; color:#71808b; }
.source-site-note,.source-no-rows { padding:0 16px 14px; margin:0; font-size:11px; color:#70838c; line-height:1.6; }
.source-no-rows { border:1px dashed #cfdddd; border-radius:9px; padding:20px; }
.source-correction-preview { padding:18px; border:1px solid #9ecbbf; border-radius:10px; background:#f1faf6; margin:22px 0; }
.source-correction-preview h3 { margin:0 0 10px; font-size:16px; color:#276451; }
.source-correction-preview p,.source-correction-preview details { font-size:12px; line-height:1.6; }
.source-preview-table-wrap { overflow:auto; max-height:300px; margin:14px 0; }
.source-preview-table-wrap table { width:100%; border-collapse:collapse; background:white; font-size:11px; }
.source-preview-table-wrap th,.source-preview-table-wrap td { padding:9px 10px; border:1px solid #d6e6de; text-align:left; white-space:pre-wrap; overflow-wrap:anywhere; max-width:280px; }
.source-preview-table-wrap td small { display:block; color:#69847b; font-size:10px; margin-top:5px; }
.source-review-history { margin:22px 0; border-top:1px solid #dfebeb; padding-top:18px; font-size:12px; color:#4c6978; line-height:1.6; }
.source-review-history summary { font-weight:600; cursor:pointer; margin-bottom:12px; }
.source-review-history li { margin-bottom:14px; }
.source-review-history li>span { display:block; color:#84949c; font-size:10px; }
.source-review-history li p { margin:4px 0; }
.source-review-proof { background:#f5f9fa; padding:18px; border:1px solid #dce7e9; border-radius:10px; font-size:12px; }
.source-review-proof>label:first-child { display:block; margin-bottom:9px; font-weight:600; }
.source-review-proof textarea { width:100%; box-sizing:border-box; resize:vertical; padding:11px; border:1px solid #c7dadd; border-radius:6px; font:inherit; color:#254c5a; background:white; }
.source-review-proof>input[type=text] { width:100%; box-sizing:border-box; padding:11px; border:1px solid #c7dadd; border-radius:6px; font:inherit; color:#254c5a; background:white; }
.source-review-proof .checkbox-label { margin-top:13px; align-items:flex-start; line-height:1.6; }
.source-review-proof .checkbox-label input { margin-top:3px; }
.source-review-proof p { margin:10px 0 0; color:#6f818a; font-size:11px; line-height:1.6; }
.source-discard-prompt { margin-top:18px; padding:18px; background:#fff7ed; border:1px solid #e7c798; border-radius:10px; font-size:12px; }
.source-discard-prompt .button { margin:6px 6px 0 0; }
.source-review-footer { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:14px; padding:16px 28px; border-top:1px solid #dbe7e7; background:white; }
.source-review-footer>span { font-size:11px; color:#6d838e; max-width:420px; line-height:1.5; }
.source-review-footer>div { display:flex; flex-wrap:wrap; gap:10px; }
.source-review-clear { color:#477969; background:#eff8f3; border-radius:8px; padding:12px; font-size:12px; }

/* One source issue at a time, with original evidence beside the verified edit. */
.source-guided-step { margin:16px 0; padding:17px 18px; border:1px solid #bbd6cf; border-radius:10px; background:#f3faf7; }
.source-guided-step[hidden] { display:none; }
.source-guided-nav { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; }
.source-guided-nav>strong { font-size:13px; color:#285f53; }
.source-guided-nav>div { display:flex; flex-wrap:wrap; gap:8px; }
.source-guided-nav .button { padding:8px 11px; font-size:11px; }
.source-issue-picker { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin:13px 0; color:#4d6d70; font-size:11px; }
.source-issue-picker select { flex:1; min-width:180px; width:100%; max-width:100%; padding:9px 10px; border:1px solid #bed4cf; border-radius:6px; background:#fff; color:#254c5a; font:inherit; }
#sourceIssueDetail { font-size:12px; line-height:1.65; overflow-wrap:anywhere; }
#sourceIssueDetail h3 { margin:10px 0 7px; font-size:15px; color:#214e47; }
#sourceIssueDetail p { margin:7px 0; color:#456963; }
#sourceIssueDetail ul { margin:8px 0; padding-left:20px; }
.source-guided-location { display:flex; flex-wrap:wrap; justify-content:space-between; gap:6px 14px; padding-bottom:8px; border-bottom:1px solid #d4e5df; }
.source-guided-location span { font-size:11px; }
.source-field.is-issue-field { border-left:3px solid #ca9c50; padding:10px 12px; background:#fffaf0; border-radius:4px 8px 8px 4px; }
.source-field.is-issue-field:not(.draft-changed) input { border-color:#bf9b61; }
.source-edit-label { margin-top:3px; font-weight:650; color:#285f53; font-size:11px; }
.source-setup-checks { margin:18px 0; padding:15px 18px; border:1px solid #cfdee5; border-radius:9px; background:#f5f9fb; font-size:12px; line-height:1.6; }
.source-setup-checks h3 { margin:0 0 7px; font-size:15px; color:#254c5a; }
.source-setup-checks p { margin:0 0 10px; color:#607a89; }
.source-setup-checks>div { margin-top:12px; padding-top:12px; border-top:1px solid #dae6ea; }
.source-setup-checks ul { margin:7px 0 10px; padding-left:20px; }
.source-setup-checks .button { padding:8px 11px; font-size:11px; }
.source-actual-comparison summary,.source-optional-note summary { cursor:pointer; font-size:12px; line-height:1.6; }
.source-actual-comparison summary { color:#79592d; }
.source-actual-values>div { padding:8px; border:1px solid #eadcc4; border-radius:6px; }
.source-actual-values>div>span { display:block; margin-top:4px; }
.source-review-proof>label.checkbox-label:first-child { display:flex; gap:9px; margin-top:0; }
.source-optional-note { margin-top:13px; color:#607a89; }
.source-optional-note label { display:block; margin:11px 0 7px; font-size:11px; }
.source-optional-note input { width:100%; box-sizing:border-box; padding:10px 11px; border:1px solid #c7dadd; border-radius:6px; font:inherit; color:#254c5a; background:#fff; }
@media(max-width:560px) { .source-guided-step { padding:13px; } .source-guided-nav>div { width:100%; } .source-guided-nav .button { flex:1; } .source-issue-picker { display:block; } .source-issue-picker select { min-width:0; margin-top:7px; } }
@media screen {
  :root[data-theme="dark"] .source-guided-step { background:var(--success-bg); border-color:#477b70; }
  :root[data-theme="dark"] :is(.source-guided-nav>strong,#sourceIssueDetail h3,.source-edit-label) { color:#b4ebd9; }
  :root[data-theme="dark"] :is(.source-issue-picker,#sourceIssueDetail p,.source-guided-location span,.source-setup-checks p,.source-optional-note) { color:var(--muted); }
  :root[data-theme="dark"] :is(.source-issue-picker select,.source-optional-note input) { background:var(--input); color:var(--ink); border-color:#587081; }
  :root[data-theme="dark"] :is(.source-guided-location,.source-setup-checks>div) { border-color:var(--border); }
  :root[data-theme="dark"] .source-field.is-issue-field { background:var(--warning-bg); border-left-color:#bf985e; }
  :root[data-theme="dark"] .source-setup-checks { background:var(--surface-alt); color:var(--ink); border-color:var(--border); }
  :root[data-theme="dark"] .source-setup-checks h3 { color:var(--ink); }
  :root[data-theme="dark"] .source-actual-values>div { border-color:#7b6745; }
  :root[data-theme="dark"] .source-actual-comparison summary { color:#f0d49e; }
}

/* Appearance is a local preference. The actual flag artwork never inherits it. */
.appearance-control { display:flex; align-items:center; gap:7px; color:var(--muted); font-size:11px; white-space:nowrap; }
.appearance-control select { min-height:38px; max-width:110px; padding:7px 9px; border:1px solid var(--border); border-radius:7px; background:var(--input); color:var(--ink); font-size:12px; cursor:pointer; }
.appearance-control select:hover { border-color:var(--teal); }
@media(max-width:680px) { .appearance-control { margin-left:auto; } .appearance-control select { min-height:36px; } }

/* A short, revisitable tour uses the same surfaces and actions as the workspace. */
.onboarding-dialog { width:min(720px,calc(100vw - 32px)); max-height:calc(100dvh - 32px); padding:24px 30px; background:var(--surface); color:var(--ink); border-color:var(--border); overflow:hidden; }
.onboarding-dialog[open] { display:flex; flex-direction:column; }
.onboarding-header { display:flex; flex-shrink:0; align-items:center; justify-content:space-between; gap:18px; margin-bottom:14px; }
.onboarding-kicker { font-size:11px; font-weight:750; letter-spacing:1.4px; color:var(--teal); }
.onboarding-header .button { padding:8px 11px; min-height:36px; font-size:12px; }
.onboarding-topic-label { flex-shrink:0; color:var(--muted); font-size:12px; margin-bottom:6px; }
.onboarding-topic { flex-shrink:0; width:100%; min-height:42px; margin:0 0 19px; padding:9px 12px; border:1px solid var(--border); border-radius:7px; background:var(--input); color:var(--ink); font:inherit; font-size:13px; }
.onboarding-scroll { min-height:0; overflow:auto; overscroll-behavior:contain; padding-right:6px; }
.onboarding-scroll:focus-visible { outline:2px solid var(--teal); outline-offset:3px; }
.onboarding-progress { display:inline-flex; align-items:center; gap:8px; margin:0 0 16px; color:var(--muted); font-size:12px; font-weight:600; }
.onboarding-progress::before { content:""; width:24px; height:3px; border-radius:3px; background:linear-gradient(90deg,var(--mint) 0 35%,var(--rose) 35% 65%,var(--aqua) 65%); }
.onboarding-dialog h2 { margin:0 0 19px; max-width:500px; font-size:29px; line-height:1.2; letter-spacing:-.55px; }
.onboarding-dialog h2:focus { outline:none; }
.onboarding-content { color:var(--ink); font-size:14px; line-height:1.75; }
.onboarding-content p { margin:0 0 15px; }
.onboarding-content ul { padding-left:22px; margin:0 0 15px; }
.onboarding-content li { margin-bottom:6px; }
.onboarding-tip { padding:14px 16px; margin:21px 0 0; border:1px solid var(--border); border-left:3px solid var(--teal); border-radius:7px; background:var(--surface-alt); color:var(--muted); font-size:13px; line-height:1.7; }
.onboarding-actions { display:flex; flex-shrink:0; flex-wrap:wrap; align-items:center; gap:10px; margin-top:14px; padding-top:12px; border-top:1px solid var(--border); }
.onboarding-scroll-hint { color:var(--muted); font-size:11px; line-height:1.5; }
.onboarding-actions:empty { display:none; }
.onboarding-footer { display:flex; flex-shrink:0; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:18px; margin-top:18px; padding-top:16px; border-top:1px solid var(--border); }
.onboarding-preference { display:flex; align-items:flex-start; gap:9px; max-width:230px; cursor:pointer; color:var(--muted); font-size:12px; line-height:1.6; }
.onboarding-preference input { margin-top:1px; }
.onboarding-navigation { display:flex; flex-wrap:wrap; gap:9px; margin-left:auto; }
.onboarding-navigation .button { min-width:88px; }
.tutorial-button { white-space:nowrap; }
.onboarding-status { font-size:13px; color:var(--muted); line-height:1.6; }
.onboarding-status:empty { display:none; }
.onboarding-practice { margin-top:22px; padding:18px; border:1px solid var(--border); border-radius:10px; background:var(--surface-alt); font-size:13px; line-height:1.6; }
.onboarding-practice[hidden] { display:none; }
.onboarding-practice h3 { margin:9px 0 12px; color:var(--ink); font-size:18px; }
.onboarding-practice p { margin:10px 0; }
.onboarding-practice code, .onboarding-practice strong { overflow-wrap:anywhere; }
.onboarding-practice>label:not(.checkbox-label) { display:block; font-size:12px; font-weight:650; margin:15px 0 6px; }
.onboarding-practice>input { display:block; width:100%; min-height:42px; padding:10px; border:1px solid var(--border); border-radius:7px; background:var(--input); color:var(--ink); font:inherit; }
.onboarding-practice .checkbox-label { margin:14px 0; align-items:flex-start; }
.onboarding-practice .button { min-height:40px; font-size:12px; }
#practicePreview { margin-top:12px; }
.practice-evidence { padding:10px 12px; border-left:3px solid var(--mint); background:var(--surface); }
.practice-result { padding:10px 12px; background:var(--surface); border-radius:6px; color:var(--ink); }
.practice-actions { display:flex; flex-wrap:wrap; gap:8px; }
.onboarding-label-example { padding:15px 18px; border:1px solid var(--border); border-radius:7px; background:var(--surface-alt); color:var(--ink); font:600 12px/1.65 ui-monospace,monospace; white-space:pre-wrap; overflow-wrap:anywhere; }
.onboarding-label-example[hidden] { display:none; }
.onboarding-coach { position:fixed; z-index:500; right:20px; bottom:20px; width:min(360px,calc(100vw - 32px)); max-height:36vh; overflow:auto; padding:18px; border:1px solid var(--teal); border-radius:12px; box-shadow:0 8px 30px #0003; background:var(--surface); color:var(--ink); }
.onboarding-coach[hidden] { display:none; }
.onboarding-coach-top { top:16px; bottom:auto; }
.onboarding-coach h2 { margin:8px 0; font-size:17px; line-height:1.3; }
.onboarding-coach p { margin:8px 0 14px; color:var(--muted); font-size:12px; line-height:1.65; }
.onboarding-coach-actions { display:flex; flex-wrap:wrap; gap:8px; }
.onboarding-coach-actions .button { min-height:38px; padding:8px 11px; font-size:12px; }
.onboarding-target { outline:3px solid var(--teal) !important; outline-offset:5px; border-radius:4px; scroll-margin-block:160px; }
.onboarding-target:focus-visible { outline:3px solid var(--aqua) !important; }
@media print { .onboarding-coach, .onboarding-dialog { display:none !important; } .onboarding-target { outline:none !important; } }
@media(max-width:680px) {
  .onboarding-dialog { width:calc(100vw - 24px); max-height:calc(100dvh - 24px); padding:18px; }
  .onboarding-header { margin-bottom:21px; gap:10px; }
  .onboarding-kicker { font-size:10px; letter-spacing:.9px; }
  .onboarding-dialog h2 { font-size:25px; }
  .onboarding-content { font-size:14px; line-height:1.75; }
  .onboarding-footer { gap:10px; margin-top:12px; padding-top:12px; }
  .onboarding-preference { max-width:none; width:100%; }
  .onboarding-navigation { width:100%; }
  .onboarding-navigation .button { flex:1; }
  .onboarding-topic { margin-bottom:14px; }
  .onboarding-coach { right:12px; bottom:12px; padding:14px; }
  .onboarding-coach-top { top:12px; bottom:auto; }
}

@media screen {
  :root[data-theme="dark"] {
    color-scheme:dark;
    color:#e7f1f6;
    background:#101a24;
    --ink:#e7f1f6;
    --muted:#a8bbc8;
    --teal:#72dbb7;
    --teal-dark:#91e8ca;
    --aqua:#52d8e2;
    --mint:#72dbb7;
    --rose:#ef98bb;
    --border:#3b5263;
    --soft:#1d2e3b;
    --surface:#172430;
    --surface-alt:#1d2e3b;
    --input:#101e2a;
    --success-bg:#173b35;
    --warning-bg:#3b3020;
    --error-bg:#3d2634;
  }
  :root[data-theme="dark"] .brand-rose { stroke:var(--rose); }
  :root[data-theme="dark"] .brand-mint { stroke:var(--mint); }
  :root[data-theme="dark"] .brand-aqua { stroke:var(--aqua); }
  :root[data-theme="dark"] :is(.topbar,.card,.stats-strip,dialog,.source-review-dialog,.source-review-footer,.validation-group,.source-preview-table-wrap table) { background:var(--surface); color:var(--ink); border-color:var(--border); }
  :root[data-theme="dark"] .topbar { box-shadow:0 8px 24px #030a1217; }
  :root[data-theme="dark"] .brand-product { color:var(--aqua); border-color:var(--border); }
  :root[data-theme="dark"] :is(.brand-product>span,.offline-status,.eyebrow,.route-heading-title p,#routeSummary,.route-empty,.route-empty strong,.route-stop small,.route-stop .stop-meta,.route-stop .route-stop-meta,.stop-text>span,.checkbox-label,.route-local-note,.section-heading>span,.stat>div>span,.stat-explainer,.dropzone>span:not(.upload-symbol),.dropzone small,.demo-row,.microcopy,.inspector-note,.field-help,.optional,.preview-stage-top,.preview-stage-bottom,.preview-meta,.preview-controls,.output-heading p,.unit-input>span,.export-note,.queue-footer,.main-footer,.dialog-intro,.help-option p,.help-option .help-fine,.help-footer,.flag-profile-note,.font-note,.printer-status,.route-policy-note,.panel-presets>span,.span-checklist-heading p,.span-checklist-note,.span-batch-choice small,.span-endpoint p,.span-panel-setup small,.panel-setup-issues,.all-source-issues) { color:var(--muted); }
  :root[data-theme="dark"] :is(.route-stop strong,.span-checklist-heading h3,.span-batch-choice strong,.span-endpoint-title strong,.route-print-body h3,.field label,.span-panel-setup label,.section-divider span) { color:var(--ink); }
  :root[data-theme="dark"] :is(.route-stops,.output-settings,thead,.span-panel-setup,.source-review-header,.source-review-proof,.validation-group.notes,.font-note) { background:var(--surface-alt); border-color:var(--border); }
  :root[data-theme="dark"] :is(.stat,.section-divider,.remember-label,.help-footer,.span-panel-setup,.source-review-history,.source-review-header,.source-review-footer) { border-color:var(--border); }
  :root[data-theme="dark"] :is(.route-stop,.span-checklist-row,.span-checklist-row.selected,.source-record) { background:var(--surface); border-color:var(--border); }
  :root[data-theme="dark"] .span-checklist-row.selected { border-color:#5b9487; }
  :root[data-theme="dark"] :is(.span-endpoint,.route-stop.excluded,.route-stop .job-chip,.file-chip,.route-print-body) { background:var(--surface-alt); color:var(--muted); border-color:var(--border); }
  :root[data-theme="dark"] :is(.route-stop.active,.route-stop.selected,.route-stop.reviewing,.route-stop .job-chip.active,.file-chip.active,.span-endpoint.is-printed,.source-endpoint-tab.active,.source-correction-preview) { background:var(--success-bg); color:#a1ebd2; border-color:#528d7b; }
  :root[data-theme="dark"] .route-stop.blocked { border-color:#a5607d; background:#30232f; }
  :root[data-theme="dark"] :is(.mode-badge,.route-icon,.dialog-icon,.step-number,.upload-symbol,.small-badge,.count-badge,.help-notice,.stop-status,.route-status,.route-stop-status,.route-stop .stop-status.ready,.span-endpoint-status,.source-review-clear) { background:var(--success-bg); color:#a1ebd2; border-color:#477b70; }
  :root[data-theme="dark"] :is(.mode-divider,.route-empty-line::before) { background:#477b70; }
  :root[data-theme="dark"] .status-dot { background:var(--mint); }
  :root[data-theme="dark"] :is(.route-stop .stop-number,.route-stop .route-number,.route-stop .route-index,.stop-status.setup) { background:#263d4b; color:#c3d5df; }
  :root[data-theme="dark"] :is(.route-stop .stop-status.error,.stop-status.warning,.stop-status.needs-review,.route-status.warning,.span-endpoint-status.has-error) { background:var(--error-bg); color:#f5b0c9; }
  :root[data-theme="dark"] :is(.message,.message.success,.source-correction-preview,.source-review-clear) { background:var(--success-bg); border-color:#477b70; color:#b4ebd9; }
  :root[data-theme="dark"] :is(.message.error,.validation-group.error) { background:var(--error-bg); border-color:#a3607e; color:#f6b5cd; }
  :root[data-theme="dark"] :is(.message.warning,.source-issue-group,.source-actual-port,.source-discard-prompt) { background:var(--warning-bg); border-color:#8d744d; color:#f0d49e; }
  :root[data-theme="dark"] :is(.stop-issues,.route-skip,#clearButton) { color:#f1a3c1; }
  :root[data-theme="dark"] :is(.stop-warnings,#endpointReviewStatus.review-blocked,.source-issue-group summary,.source-issue-group summary span,.source-issue-group p,.source-actual-port p,.source-actual-values span,.source-field .source-cell-warning) { color:#f0d49e; }
  :root[data-theme="dark"] :is(.text-button,.row-preview,.help-links,.help-footer strong,.dropzone .browse-link,.stat strong,.stat-icon,.live-badge,.route-print-progress,.route-stop .job-chip>span,.source-correction-preview h3) { color:var(--mint); }
  :root[data-theme="dark"] :is(.text-button:hover,.help-links a:hover) { color:#b3f0dc; }
  :root[data-theme="dark"] .help-links a { border-color:#528d7b; }
  :root[data-theme="dark"] .stat-icon { border-color:#477b70; }
  :root[data-theme="dark"] :is(.button-quiet,.button-secondary,.icon-button,.route-stop button,.source-endpoint-tab) { background:var(--surface-alt); color:#b3e8d8; border-color:#587d7a; }
  :root[data-theme="dark"] :is(.button-quiet:not(:disabled):hover,.button-secondary:not(:disabled):hover,.icon-button:not(:disabled):hover,.route-stop button:not(:disabled):hover,.source-endpoint-tab:hover) { background:#27483f; border-color:#72bca8; color:#d0f9eb; }
  :root[data-theme="dark"] .button-primary { color:#082b24; background:var(--teal); border-color:var(--teal); }
  :root[data-theme="dark"] .button-primary:not(:disabled):hover { color:#082b24; background:var(--teal-dark); border-color:var(--teal-dark); }
  :root[data-theme="dark"] .button-primary:disabled { color:#b2c8c2; background:#385c52; border-color:#385c52; }
  :root[data-theme="dark"] :is(.button-quiet:disabled,.button-secondary:disabled,.icon-button:disabled,.route-stop button:disabled,.route-actions #resetRouteProgress:disabled) { color:#8297a3; background:#1b2b36; border-color:#354c5b; }
  :root[data-theme="dark"] .route-actions #resetRouteProgress { color:var(--muted); }
  :root[data-theme="dark"] :is(.field input,.field select,.search-field>input,.span-panel-setup input,.source-field input,.source-review-proof textarea,.source-review-proof>input[type=text],.source-actual-port select,.source-review-toolbar select) { background-color:var(--input); color:var(--ink); border-color:#587081; }
  :root[data-theme="dark"] .route-name-field input { background:var(--input) !important; }
  :root[data-theme="dark"] :is(.field input[readonly],.size-fields input[readonly]) { background:#243744; color:#bbccd7; border-color:var(--border); }
  :root[data-theme="dark"] :is(input,textarea)::placeholder { color:#92a8b7; }
  :root[data-theme="dark"] .field select { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23a8bbc8' stroke-width='1.8'%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3C/svg%3E"); }
  :root[data-theme="dark"] :is(.span-batch-choice input,input[type="checkbox"]) { accent-color:var(--mint); }
  :root[data-theme="dark"] .dropzone { background:#17333a; border-color:#579f9b; }
  :root[data-theme="dark"] :is(.dropzone:hover,.dropzone.dragover,.dropzone.drag-over,.dropzone:focus-within) { background:#20453f; border-color:#7bd3bd; }
  :root[data-theme="dark"] .endpoint-context { background:#17383b; color:#b7e4e1; border-color:#4d8f91; border-left-color:var(--aqua); }
  :root[data-theme="dark"] .preview-stage { background-color:#12232d; background-image:radial-gradient(#35505b .8px,transparent .8px); border-color:var(--border); }
  :root[data-theme="dark"] .label-preview:has(.flag-svg) { background:transparent; }
  :root[data-theme="dark"] .label-preview>.flag-svg { border-color:#59747b; box-shadow:0 7px 20px #0006; background:#fff; color:#000; color-scheme:light; }
  :root[data-theme="dark"] .label-preview:not(:has(.flag-svg)) { background:#fff; color:#172b35; color-scheme:light; }
  :root[data-theme="dark"] :is(th,td) { color:#c0d0dc; border-color:var(--border); }
  :root[data-theme="dark"] :is(td small,.table-empty strong,.table-empty>span,.empty-table) { color:var(--muted); }
  :root[data-theme="dark"] tbody tr:hover { background:#203743; }
  :root[data-theme="dark"] :is(tbody tr.previewed,tbody tr.selected,tbody tr.is-active) { background:var(--success-bg); }
  :root[data-theme="dark"] :is(dialog::backdrop,.source-review-dialog::backdrop) { background:#030c14bd; }
  :root[data-theme="dark"] :is(.source-review-header p,.source-review-intro,.source-review-toolbar label,.source-field,.source-field small,.source-original,.source-cell-original,.source-site-note,.source-no-rows,.source-review-history,.source-review-history li>span,.source-review-proof p,.source-review-footer>span,.source-preview-table-wrap td small) { color:var(--muted); }
  :root[data-theme="dark"] .source-field>span:first-child { color:var(--ink); }
  :root[data-theme="dark"] .source-field.draft-changed input { border-color:var(--mint); box-shadow:0 0 0 1px #72dbb733; }
  :root[data-theme="dark"] .source-record>header { background:var(--success-bg); color:#b4ebd9; }
  :root[data-theme="dark"] .source-record.has-source-issues>header { background:var(--warning-bg); color:#f0d49e; }
  :root[data-theme="dark"] .source-row-issues { background:#382b27; color:#f0bfa3; }
  :root[data-theme="dark"] :is(.source-preview-table-wrap th,.source-preview-table-wrap td,.source-no-rows) { border-color:var(--border); }
}
@media(max-width:700px) {
  .source-review-dialog { width:calc(100vw - 16px); max-height:calc(100vh - 16px); }
  .source-review-shell { max-height:calc(100vh - 20px); }
  .source-review-header,.source-review-scroll,.source-review-footer { padding:18px; }
  .source-value-grid { grid-template-columns:1fr; }
  .source-review-header h2 { font-size:20px; }
}

/* Saved work and interrupted-print review share the existing Spanwise colors. */
.recovery-status {font-size:.9rem;margin:1rem 0;color:var(--muted,#60756d)}
.recovery-status[data-state="error"],.recovery-status[data-state="conflict"] {color:var(--danger,#bc476c)}
.recovery-status button {margin-left:.6rem}
.workspace-dialog {width:min(900px,94vw);max-height:90vh;overflow:auto;border:1px solid var(--border,#c9d8d1);border-radius:20px;background:var(--surface,#fff);color:var(--text,#18352c);padding:1.5rem}
.workspace-dialog::backdrop {background:#071c24a8;backdrop-filter:blur(5px)}
.workspace-dialog header {display:flex;gap:1rem;align-items:center;justify-content:space-between}
.workspace-dialog h2 {margin:0;font-size:1.5rem}
.workspace-dialog footer {display:grid;gap:1rem;margin-top:1rem;padding-top:1rem;border-top:1px solid var(--border,#c9d8d1)}
.workspace-dialog article,.print-recovery-flag {border:1px solid var(--border,#c9d8d1);border-radius:12px;padding:1rem;margin:1rem 0}
.print-recovery-flag {display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.print-recovery-flag pre {font-family:inherit;white-space:pre-wrap;font-size:.9rem;line-height:1.4}
.print-recovery-flag label {display:grid;gap:.5rem;align-content:center}
.print-recovery-flag select {width:100%;min-height:44px;padding:.6rem;border:1px solid var(--border,#c9d8d1);border-radius:8px;background:var(--surface,#fff);color:inherit}
.recovery-warning {padding:1rem;border:1px solid #dba659;border-radius:10px}
.site-next-action {min-height:44px;margin:.3rem}
[data-theme="dark"] .workspace-dialog {background:#172834;color:#e2edf1;border-color:#496270}
[data-theme="dark"] .workspace-dialog select {background:#10212d;color:#e2edf1;border-color:#496270}
@media(max-width:650px){.print-recovery-flag{grid-template-columns:1fr}.project-actions{flex-wrap:wrap}.workspace-dialog{padding:1rem}}