/* Queue Manager redesign: a dense, table-first workspace isolated from the
   rest of the app. It deliberately relies on separators, not stacked cards. */
.qm-page { --qm-line:rgba(255,255,255,.10); --qm-line-soft:rgba(255,255,255,.065); --qm-panel:#15161d; --qm-raised:#1a1b23; --qm-violet:#7256df; --qm-violet-soft:rgba(114,86,223,.22); --qm-green:#65ca7c; --qm-amber:#e4a93e; --qm-red:#e66565; height:100%; min-height:0; display:flex; flex-direction:column; color:#e8e8ed; background:radial-gradient(ellipse at 60% -30%,rgba(92,67,180,.12),transparent 44%),#111217; font-size:13px; }
.qm-index-progress { min-height:34px; padding:0 14px; display:flex; align-items:center; gap:10px; border-bottom:1px solid var(--qm-line); background:#171421; color:#d9d1ff; font-size:11px; }.qm-index-progress > div { width:150px; height:4px; overflow:hidden; border-radius:99px; background:#332b48; }.qm-index-progress i { display:block; height:100%; border-radius:inherit; background:#8d73f1; transition:width .14s ease; }.qm-index-progress b { color:#aaa3bf; font-weight:500; font-variant-numeric:tabular-nums; }
.qm-index-progress.qm-index-loading { background:#14171d; color:#bfc7d5; }
/* Manual-refresh notice: the index is only rebuilt on request, so this says the
   source data has moved on since it was built, and offers the rebuild. It
   inherits the indexing bar's violet - same slot, same subject, so a colour
   change here would read as a different kind of message. */
.qm-index-progress.qm-index-stale { justify-content:space-between; }
.qm-index-progress.qm-index-stale b { color:#c6b6ff; font-weight:600; }
.qm-index-progress.qm-index-stale .qm-button { height:24px; padding:0 11px; font-size:11px; }
/* Scene expansion is a network call now: a skeleton row while a page loads, and
   an explicit Load more rather than an invisible infinite scroll. */
.qm-shot-skeleton { pointer-events:none; }
.qm-shot-skeleton span { height:9px; border-radius:99px; background:linear-gradient(90deg,rgba(255,255,255,.07),rgba(255,255,255,.15),rgba(255,255,255,.07)); background-size:220% 100%; animation:qm-shot-shimmer 1.1s linear infinite; }
.qm-shot-skeleton span:first-child { flex:1; }
.qm-shot-skeleton span:last-child { width:34px; }
@keyframes qm-shot-shimmer { from { background-position:120% 0; } to { background-position:-120% 0; } }
.qm-shot-more { width:100%; height:32px; padding:0 17px 0 51px; display:flex; align-items:center; border-bottom:1px solid rgba(255,255,255,.055); color:#b6a4f2; text-align:left; font-size:12px; }
.qm-shot-more:hover { background:var(--gr-hover); color:#d3c6ff; }
.qm-index-progress .is-indeterminate { width:42%; animation:qm-index-slide 1s ease-in-out infinite; background:#7184f1; }.qm-index-progress.qm-index-loading > div { background:#28313f; }@keyframes qm-index-slide { from { transform:translateX(-115%); } to { transform:translateX(355%); } }
/* Matches the app top bar this page replaces: a 48px bar sitting under the
   same safe-area inset, so the ribbon below starts at the identical y on
   every page. Without the inset the whole workspace rides 8px high. */
/* The Queue Manager's own bar is gone: its contents moved into the shared app
   top bar, so this page has one header like every other page. */
header.sticky .qm-workspace-switch button { height:28px; min-width:96px; padding:0 14px; border-radius:0; font-size:12px; font-weight:600; }
header.sticky .qm-workspace-switch { height:30px; padding:0; overflow:hidden; border:1px solid #3a3146; border-radius:4px; background:var(--gr-input); }
header.sticky .qm-workspace-switch button.is-active { color:#fff; background:linear-gradient(135deg,#352551,#49306e); }
header.sticky .qm-topbar-index-refresh { width:30px; height:30px; padding:0; display:inline-flex; align-items:center; justify-content:center; border:0; border-radius:4px; color:#fff; background:linear-gradient(135deg,#6366f1 0%,#a855f7 52%,#ec4899 100%); box-shadow:0 8px 20px -12px rgba(168,85,247,.8); } header.sticky .qm-topbar-index-refresh:hover { filter:brightness(1.09); } header.sticky .qm-topbar-index-refresh:disabled { opacity:.55; cursor:not-allowed; } header.sticky .qm-topbar-index-refresh svg { width:14px; height:14px; }
header.sticky .qm-pathmapper-tabs { height:30px; padding:2px; gap:2px; border:1px solid #30283a; border-radius:4px; background:var(--gr-input); }
header.sticky .qm-pathmapper-tabs button { height:24px; padding:0 10px; border-radius:2px; font-size:11px; }
header.sticky .qm-pathmapper-tabs button.is-active { color:#fff; background:#352551; }
header.sticky .qm-button { height:30px; padding:0 13px; font-size:12px; }

/* Create queue sits in the draft pane heading now - it acts on the draft, so
   it belongs next to it rather than up in the global chrome. */
.qm-page.is-newqueue .qm-draft-actions .qm-button { height:28px; padding:0 12px; font-size:11px; }
.qm-popover-action { width:100%; margin-bottom:8px; gap:7px; }
.qm-popover-action svg { width:13px; height:13px; }
.qm-popover-action:disabled { opacity:.4; cursor:not-allowed; }

/* This page's bar carries the workspace switch on top of the shared chrome,
   which is more than one line holds on a phone. Wrapping keeps the project
   selector and the account controls on screen instead of pushing them past
   the right edge, where nothing can reach them. */
.rd-newqueue-app header.sticky .bar-row,
.rd-newqueue-app header.sticky .bar-row > .ml-auto { flex-wrap:wrap; }
.rd-newqueue-app header.sticky .bar-row > .ml-auto { justify-content:flex-end; row-gap:6px; }
@media (max-width:700px) {
  header.sticky .qm-workspace-switch button { min-width:0; padding:0 10px; }
  header.sticky .qm-button { padding:0 10px; }
}
.qm-workspace-switch,.qm-pathmapper-tabs { display:flex; align-items:center; border:1px solid var(--qm-line); border-radius:5px; padding:2px; background:#101116; }
.qm-workspace-switch button,.qm-pathmapper-tabs button { height:30px; padding:0 13px; border-radius:3px; color:#a6a8b4; font-size:12px; font-weight:600; }
.qm-workspace-switch button.is-active,.qm-pathmapper-tabs button.is-active { color:#fff; background:var(--qm-violet); }
.qm-header-title { color:#e1e2e8; font-size:13px; font-weight:600; letter-spacing:-.02em; }.qm-header-spacer { flex:1; }
.qm-capacity { display:flex; align-items:center; gap:7px; font-size:12px; color:#b8bac4; white-space:nowrap; }.qm-capacity i { width:7px; height:7px; border-radius:50%; background:var(--qm-green); }.qm-capacity em { color:#626571; font-style:normal; }
.qm-header-actions { display:flex; gap:8px; }
.qm-button { height:32px; padding:0 13px; border:1px solid var(--qm-line); border-radius:4px; display:inline-flex; justify-content:center; align-items:center; font-size:12px; font-weight:600; white-space:nowrap; }.qm-button:disabled { opacity:.4; cursor:not-allowed; }.qm-button-muted { color:#d2d3da; background:#1a1b22; }.qm-button-muted:hover { background:var(--gr-hover); }.qm-button-primary { color:#fff; border-color:#805ff1; background:#6e50d4; }.qm-button-primary:hover { background:#7b5ce5; }
.qm-queue-workspace,.qm-pathmapper-workspace { min-height:0; flex:1; position:relative; display:flex; flex-direction:column; }.qm-queue-workspace { gap:0; }
.qm-batch-ribbon { height:62px; display:flex; align-items:center; gap:20px; padding:0 24px; border-bottom:1px solid var(--qm-line); background:#14151b; }.qm-ribbon-search,.qm-pane-search { height:42px; display:flex; align-items:center; gap:8px; padding:0 11px; border:1px solid var(--qm-line); border-radius:4px; background:#111217; }.qm-ribbon-search { width:314px; }.qm-ribbon-search svg,.qm-pane-search svg { width:18px; height:18px; color:#838693; flex-shrink:0; }.qm-ribbon-search input,.qm-pane-search input { min-width:0; width:100%; color:#e9e9ed; outline:0; background:transparent; font-size:13px; }.qm-ribbon-search input::placeholder,.qm-pane-search input::placeholder { color:#777a86; }
.qm-selection-count { padding:0 20px 0 2px; border-right:1px solid var(--qm-line); color:#d9dae0; white-space:nowrap; font-size:12px; }.qm-selection-count b { color:#fff; }
.qm-batch-ribbon label { display:flex; align-items:center; gap:8px; color:#9ea1ad; white-space:nowrap; }.qm-batch-ribbon select,.qm-batch-ribbon input:not(.qm-switch) { width:126px; height:32px; padding:0 9px; border:1px solid var(--qm-line); border-radius:4px; color:#dedfe7; background:#111217; outline:none; font-size:12px; }.qm-batch-ribbon .qm-priority-control input { width:56px; }.qm-master-control { padding-left:2px; }.qm-switch { width:33px; height:18px; accent-color:var(--qm-violet); }.qm-master-choice { max-width:150px; overflow:hidden; text-overflow:ellipsis; color:#bdb6f2; font-size:12px; }
.qm-batch-actions { margin-left:auto; display:flex; align-items:center; gap:9px; }
.qm-queue-grid { min-height:0; flex:1; display:grid; grid-template-columns:385px minmax(0,1fr); }.qm-shots-pane,.qm-draft-pane,.qm-scene-pane,.qm-mapping-table-pane,.qm-mapping-detail,.qm-coverage-table-pane,.qm-coverage-detail { min-height:0; overflow:hidden; background:rgba(18,19,25,.78); }.qm-shots-pane,.qm-scene-pane { display:flex; flex-direction:column; border-right:1px solid var(--qm-line); }.qm-draft-pane,.qm-mapping-table-pane,.qm-coverage-table-pane { display:flex; flex-direction:column; }
.qm-pane-heading { min-height:74px; padding:0 26px; display:flex; justify-content:space-between; align-items:center; gap:12px; border-bottom:1px solid var(--qm-line); }.qm-pane-heading h2 { margin:0; font-size:18px; font-weight:600; letter-spacing:-.025em; }.qm-pane-heading h2 span,.qm-heading-meta { color:#b5b7c1; font-size:15px; font-weight:400; }.qm-pane-heading > div { display:flex; align-items:center; gap:10px; }.qm-text-button { color:#bcaaff; font-size:13px; }.qm-text-button:disabled { opacity:.4; }.qm-icon-button { width:28px; height:28px; display:inline-grid; place-items:center; border-radius:4px; color:#a8aab5; }.qm-icon-button:hover { color:#fff; background:var(--gr-hover); }.qm-icon-button svg { width:15px; height:15px; }.qm-danger:hover,.qm-danger { color:#d96b78; }.qm-filter-button { width:30px; height:30px; display:inline-grid; place-items:center; color:#b7b9c4; }.qm-filter-button svg { width:18px; height:18px; }.qm-draft-actions { gap:13px !important; }.qm-draft-actions > i { width:1px; height:28px; background:var(--qm-line); }
.qm-shots-pane > .qm-pane-heading { min-height:56px; padding:0 24px; border-bottom:0; }
.qm-shots-pane > .qm-pane-heading h2, .qm-draft-pane > .qm-pane-heading h2 { font-size:16px; }
.qm-draft-pane > .qm-pane-heading { min-height:56px; padding:0 24px; }
.qm-shots-search { margin:12px 20px; }.qm-shots-list,.qm-scene-tree { min-height:0; flex:1; overflow:auto; }.qm-scene-group + .qm-scene-group { border-top:1px solid var(--qm-line-soft); }.qm-scene-heading { height:42px; display:flex; border-bottom:1px solid var(--qm-line-soft); }.qm-scene-heading > button:first-child { min-width:0; flex:1; padding:0 14px; display:flex; align-items:center; gap:8px; text-align:left; }.qm-scene-heading svg { width:14px; height:14px; color:#b9bbc5; }.qm-scene-heading .qm-folder-icon { width:16px; height:16px; color:#c0c2cc; }.qm-scene-heading strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:14px; font-weight:500; }.qm-scene-heading small { margin-left:auto; color:#bdb2ed; font-size:12px; }.qm-scene-heading.is-open { background:linear-gradient(90deg,rgba(111,81,210,.32),rgba(111,81,210,.12)); }.qm-shot-row { height:38px; padding:0 17px 0 51px; display:flex; align-items:center; gap:10px; border-bottom:1px solid rgba(255,255,255,.055); cursor:pointer; }.qm-shot-row:hover { background:var(--gr-hover-soft); }.qm-shot-row.is-selected { background:rgba(116,84,218,.16); }.qm-shot-row.is-queued { opacity:.45; }.qm-shot-name { min-width:0; flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:14px; }.qm-shot-row i,.qm-tree-shot i,.qm-map-cell i,.qm-status i { width:8px; height:8px; flex-shrink:0; border-radius:50%; background:#777; }.is-linked > i,.qm-shot-row i.is-linked,.qm-tree-shot i.is-linked { background:var(--qm-green); }.is-missing > i,.qm-shot-row i.is-missing,.qm-tree-shot i.is-missing { background:var(--qm-red); }.qm-shot-row small { color:#b4b5c0; font:12px var(--f-data); }.qm-shot-row em { width:42px; color:#b4b5c0; text-align:right; font-size:12px; font-style:normal; }.qm-pane-footer { min-height:43px; padding:0 18px; display:flex; align-items:center; justify-content:space-between; border-top:1px solid var(--qm-line); color:#8f929e; font-size:11px; }

/* Native controls read bright-white on macOS. The Queue Manager needs quiet,
   square data selectors that only acquire colour when a row is selected. */
.qm-shot-row input[type="checkbox"], .qm-scene-heading input[type="checkbox"], .qm-draft-check { appearance:none; -webkit-appearance:none; width:16px; height:16px; margin:0; flex:0 0 16px; border:1px solid #656873; border-radius:2px; background:#17181e; cursor:pointer; }
.qm-shot-row input[type="checkbox"]:hover, .qm-scene-heading input[type="checkbox"]:hover, .qm-draft-check:hover { border-color:#989ba7; }
.qm-shot-row input[type="checkbox"]:checked, .qm-scene-heading input[type="checkbox"]:checked, .qm-draft-check:checked { border-color:#a88cff; background-color:#a88cff; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8.3 6.4 11.5 13 4.8' fill='none' stroke='%23161520' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-position:center; background-repeat:no-repeat; background-size:13px; }
.qm-shot-row input[type="checkbox"]:disabled { opacity:.38; cursor:not-allowed; }

/* The Queue Manager no longer carries its own shell: the app-wide graphite
   tokens in app.css are this design, so the sidebar, canvas and navigation
   already arrive correct and only the workspace itself is styled here. The
   one exception is the top bar - the workspace switch IS this page's nav, so
   it takes that slot rather than stacking a second strip beneath it. */
.qm-header,.qm-batch-ribbon,.qm-pathmapper-tabs,.qm-draft-footer { background:#181a1c; }
.qm-shots-pane,.qm-draft-pane,.qm-scene-pane,.qm-mapping-table-pane,.qm-mapping-detail,.qm-coverage-table-pane,.qm-coverage-detail { background:#17191b; }
.qm-scene-heading.is-open { background:linear-gradient(90deg,rgba(101,76,175,.23),rgba(101,76,175,.08)); }

/* Screenshot-matched graphite palette. The reference intentionally keeps the
   header, toolbar, fields, panes and table header on the same #181a1c plane;
   hierarchy comes from fine separators and restrained selected-row colour. */
.rd-newqueue-app, .qm-page {
  --qm-shell:var(--gr-panel);
  --qm-sidebar:var(--gr-canvas);
  --qm-active-nav:var(--gr-raised);
  --qm-selected-scene:#302e3e;
  --qm-selected-row:#2a2a32;
  --qm-control-border:#393b3d;
  --qm-line:rgba(255,255,255,.105);
  --qm-line-soft:rgba(255,255,255,.065);
}
.qm-page { background:var(--qm-shell); }
.qm-page .qm-header, .qm-page .qm-batch-ribbon, .qm-page .qm-pathmapper-tabs,
.qm-page .qm-shots-pane, .qm-page .qm-draft-pane, .qm-page .qm-scene-pane, .qm-page .qm-mapping-table-pane,
.qm-page .qm-mapping-detail, .qm-page .qm-coverage-table-pane, .qm-page .qm-coverage-detail,
.qm-page .qm-coverage-summary, .qm-page .qm-pane-heading, .qm-page .qm-table-scroll { background:var(--qm-shell); }
.qm-page .qm-batch-ribbon select, .qm-page .qm-batch-ribbon input:not(.qm-switch),
.qm-page .qm-ribbon-search, .qm-page .qm-pane-search, .qm-page .qm-input, .qm-page .qm-coverage-health {
  color:#d0d1d6;
  background:var(--qm-shell);
  border-color:var(--qm-control-border);
}
.qm-page .qm-batch-ribbon select:focus, .qm-page .qm-batch-ribbon input:not(.qm-switch):focus,
.qm-page .qm-ribbon-search:focus-within, .qm-page .qm-pane-search:focus-within, .qm-page .qm-input:focus { border-color:#5d5f62; }
.qm-page .qm-ribbon-search input, .qm-page .qm-pane-search input { color:#d2d3d7; }
.qm-page .qm-ribbon-search input::placeholder, .qm-page .qm-pane-search input::placeholder { color:#8d8f94; }
.qm-button-muted { color:#d5d5da; background:var(--qm-shell); border-color:#3b3d40; }
.qm-button-muted:hover { background:var(--gr-hover); }
.qm-button-primary { border-color:transparent; background:linear-gradient(135deg,#6366f1 0%,#a855f7 52%,#ec4899 100%); box-shadow:0 10px 26px -12px rgba(168,85,247,.55); }
.qm-button-primary:hover { filter:brightness(1.08); }
.qm-draft-table th, .qm-mapping-table th, .qm-coverage-table th {
  color:#c9cacf;
  background:var(--qm-shell);
  border-bottom-color:var(--qm-control-border);
}
.qm-draft-table td, .qm-mapping-table td, .qm-coverage-table td { background:var(--qm-shell); border-bottom-color:rgba(255,255,255,.075); }
.qm-page .qm-scene-heading.is-open, .qm-page .qm-tree-scene.is-active { background:var(--qm-selected-scene); }
.qm-page .qm-shot-row.is-selected, .qm-page .qm-draft-table tr.is-selected td,
.qm-page .qm-mapping-table tr.is-selected td, .qm-page .qm-coverage-table tr.is-selected td { background:var(--qm-selected-row); }
.qm-shot-row input[type="checkbox"], .qm-scene-heading input[type="checkbox"], .qm-draft-check { background:var(--qm-shell); }
.qm-shot-row input[type="checkbox"]:checked, .qm-scene-heading input[type="checkbox"]:checked, .qm-draft-check:checked { border-color:#a58bfa; background-color:#a58bfa; }
.qm-switch { appearance:none; -webkit-appearance:none; width:36px; height:20px; flex:0 0 36px; border:1px solid #4a4c50; border-radius:999px; background:#34363a radial-gradient(circle at 9px 50%,#f4f4f6 0 6px,transparent 6.5px); cursor:pointer; transition:background-color .15s,border-color .15s; }
.qm-switch:checked { border-color:#7558db; background:#6549cc radial-gradient(circle at calc(100% - 9px) 50%,#fff 0 6px,transparent 6.5px); }
.qm-draft-check:indeterminate { border-color:#a58bfa; background:#a58bfa linear-gradient(#211a35,#211a35) center/9px 2px no-repeat; }
.qm-table-scroll { min-height:0; flex:1; overflow:auto; }.qm-draft-table,.qm-mapping-table,.qm-coverage-table { width:100%; min-width:760px; border-collapse:collapse; table-layout:fixed; }.qm-draft-table th,.qm-mapping-table th,.qm-coverage-table th { height:55px; padding:0 16px; position:sticky; top:0; z-index:1; background:#181921; border-bottom:1px solid var(--qm-line); text-align:left; color:#c7c9d0; font-size:12px; text-transform:none; letter-spacing:0; font-weight:500; }.qm-draft-table td,.qm-mapping-table td,.qm-coverage-table td { height:61px; padding:0 16px; border-bottom:1px solid var(--qm-line-soft); color:#e0e1e6; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:14px; }.qm-draft-table tr:hover td,.qm-mapping-table tr:hover td,.qm-coverage-table tr:hover td { background:var(--gr-hover-soft); }.qm-draft-table th:nth-child(1),.qm-draft-table td:nth-child(1) { width:66px; padding-right:0; }.qm-draft-table th:nth-child(2) { width:22%; }.qm-draft-table th:nth-child(3) { width:23%; }.qm-draft-table th:nth-child(4) { width:18%; }.qm-draft-table th:nth-child(5) { width:16%; }.qm-draft-table th:nth-child(6),.qm-draft-table td:nth-child(6) { width:60px; }.qm-draft-table th:nth-child(7),.qm-draft-table td:nth-child(7) { width:70px; text-align:center; }.qm-draft-table td:last-child { width:76px; padding-left:0; white-space:nowrap; }.qm-draft-table strong { font-weight:500; }.qm-draft-check { width:18px; height:18px; margin-right:13px; vertical-align:middle; accent-color:#9b7aff; }.qm-drag { color:#aaaeba; font-size:17px; vertical-align:middle; }.qm-map-cell { display:inline-flex; align-items:center; gap:9px; min-width:0; max-width:100%; }.qm-map-cell b { min-width:0; overflow:hidden; text-overflow:ellipsis; font-weight:500; }.qm-map-cell.is-missing b { color:var(--qm-amber); }.qm-master-mark { width:18px; height:18px; display:inline-grid; place-items:center; border:1px solid #777a85; border-radius:3px; color:transparent; font-size:12px; }.qm-master-mark.is-master { border-color:#a489ff; color:#1f192e; background:#ac92ff; }.qm-empty-table { height:180px !important; text-align:center; color:#777a85 !important; }.qm-draft-footer { min-height:70px; padding:0 28px; display:flex; align-items:center; justify-content:space-between; border-top:1px solid var(--qm-line); background:#15161d; color:#d1d2d9; font-size:14px; }.qm-draft-footer em { margin:0 8px; font-style:normal; color:#676a76; }.qm-warning-link { color:#ff716f; font-size:14px; }
.qm-draft-table th:last-child { width:76px; padding-left:0; text-align:right; }
.qm-draft-footer { justify-content:initial; }
.qm-draft-alert { width:34%; min-width:240px; display:flex; align-items:center; gap:14px; }
.qm-draft-total { flex:1; padding-left:34px; border-left:1px solid var(--qm-line); text-align:center; white-space:nowrap; }
.qm-ok-copy { color:var(--qm-green); }
.qm-jump-link { display:inline-flex; align-items:center; gap:5px; color:#c7b7ff; font-size:13px; white-space:nowrap; }
.qm-jump-link svg { width:15px; height:15px; }
/* Templates browser (was a cramped 370px popover). A production farm can have
   dozens of saved queues, so this is a centred dialog with a scrollable,
   auto-filling card grid rather than a short list of one-line rows. */
.qm-templates-layer { position:fixed; inset:0; z-index:60; display:flex; align-items:center; justify-content:center; padding:28px; }
.qm-templates-backdrop { position:absolute; inset:0; background:rgba(6,7,11,.66); backdrop-filter:blur(2px); }
.qm-templates-dialog { position:relative; z-index:1; width:min(1040px,100%); max-height:min(86vh,860px); display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--qm-line); border-radius:10px; background:#15161d; box-shadow:0 40px 90px rgba(0,0,0,.6); }
.qm-templates-head { padding:16px 18px 14px; display:flex; align-items:flex-start; justify-content:space-between; gap:12px; border-bottom:1px solid var(--qm-line); background:transparent; }
.qm-templates-head h2 { display:flex; align-items:center; gap:8px; color:#f2f1f8; font-size:16px; font-weight:600; }
.qm-templates-head h2 svg { width:15px; height:15px; color:#a691ff; }
.qm-templates-head > div > span { display:block; margin-top:3px; color:#8b8e99; font-size:11px; }
.qm-templates-close { width:28px; height:28px; border-radius:4px; color:#989ba6; font-size:20px; line-height:1; }
.qm-templates-close:hover { background:rgba(255,255,255,.07); color:#e8e8ed; }
.qm-templates-toolbar { padding:12px 18px; display:flex; align-items:center; gap:10px; border-bottom:1px solid var(--qm-line); }
.qm-templates-search { flex:1; min-width:0; margin:0; }
.qm-templates-save { flex:0 0 auto; gap:7px; }
.qm-templates-save svg { width:13px; height:13px; }
.qm-templates-save:disabled { opacity:.4; cursor:not-allowed; }
.qm-templates-grid { flex:1; min-height:0; padding:16px 18px 18px; display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); align-content:start; gap:12px; overflow-y:auto; overscroll-behavior:contain; }
.qm-template-card { min-width:0; padding:13px 14px 11px; display:flex; flex-direction:column; gap:7px; border:1px solid var(--qm-line); border-radius:8px; background:var(--qm-raised); transition:border-color .12s ease,transform .12s ease; }
.qm-template-card:hover { border-color:rgba(150,124,255,.45); transform:translateY(-1px); }
.qm-template-card.is-loaded { border-color:var(--qm-violet); box-shadow:inset 0 0 0 1px var(--qm-violet-soft); }
.qm-template-card-top { display:flex; align-items:baseline; justify-content:space-between; gap:10px; }
.qm-template-card-top h3 { min-width:0; overflow:hidden; color:#f0eff6; font-size:13px; font-weight:600; text-overflow:ellipsis; white-space:nowrap; }
.qm-template-count { flex:0 0 auto; padding:2px 7px; border-radius:99px; background:var(--qm-violet-soft); color:#c9bcff; font-size:10px; font-variant-numeric:tabular-nums; }
.qm-template-desc { display:-webkit-box; overflow:hidden; -webkit-box-orient:vertical; -webkit-line-clamp:2; color:#a9acb8; font-size:11.5px; line-height:1.45; }
.qm-template-preview { overflow:hidden; color:#75798a; font-family:var(--f-data,monospace); font-size:10.5px; text-overflow:ellipsis; white-space:nowrap; }
.qm-template-card-foot { margin-top:auto; padding-top:9px; display:flex; align-items:center; justify-content:space-between; gap:8px; border-top:1px solid var(--qm-line-soft); }
.qm-template-card-foot time { color:#6f7382; font-size:10px; }
.qm-template-card-actions { display:flex; align-items:center; gap:6px; }
.qm-template-card-actions .qm-button { height:25px; padding:0 10px; font-size:11px; }
.qm-templates-empty { grid-column:1/-1; padding:40px 0; text-align:center; }
.qm-templates-trigger.is-active { color:#c9bcff; background:var(--qm-violet-soft); }
.qm-input { width:100%; height:32px; padding:0 9px; border:1px solid var(--qm-line); border-radius:4px; color:#eee; background:#111217; outline:0; font-size:12px; }
/* Pathmapper */
.qm-pathmapper-tabs { height:44px; padding-left:20px; border-bottom:1px solid var(--qm-line); border-radius:0; border-top:0; border-left:0; border-right:0; background:#14151b; }.qm-pathmapper-tabs button { height:28px; }.qm-inspector-grid { min-height:0; flex:1; display:grid; grid-template-columns:285px minmax(0,1fr) 320px; }.qm-pane-search { margin:10px; }.qm-table-search { width:250px; margin:0; }.qm-tree-group + .qm-tree-group { border-top:1px solid var(--qm-line-soft); }.qm-tree-scene { height:38px; width:100%; padding:0 13px; display:flex; align-items:center; gap:8px; text-align:left; }.qm-tree-scene svg { width:13px; color:#9497a3; }.qm-tree-scene strong { min-width:0; flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; }.qm-tree-scene span { color:#9699a5; font-size:11px; }.qm-tree-scene.is-active { background:var(--qm-violet-soft); box-shadow:inset 3px 0 var(--qm-violet); }.qm-tree-shot { height:32px; width:100%; padding:0 13px 0 34px; display:flex; align-items:center; gap:8px; text-align:left; color:#c3c5cd; }.qm-tree-shot:hover { background:var(--gr-hover-soft); }.qm-tree-shot.is-active { color:#fff; background:rgba(114,86,223,.15); }.qm-tree-shot span { min-width:0; flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:11px; }.qm-tree-shot small { color:#999ba7; font:10px var(--f-data); }.qm-mapping-table-pane { border-right:1px solid var(--qm-line); }.qm-mapping-table tr { cursor:pointer; }.qm-mapping-table tr.is-selected td,.qm-coverage-table tr.is-selected td { background:var(--qm-violet-soft); }.qm-mapping-table th:nth-child(1) { width:20%; }.qm-mapping-table th:nth-child(2) { width:23%; }.qm-mapping-table th:nth-child(3) { width:27%; }.qm-mapping-table th:nth-child(4) { width:13%; }.qm-status { display:inline-flex; align-items:center; gap:7px; color:#a6a8b2; font-size:11px; }.qm-status.is-linked { color:var(--qm-green); }.qm-status.is-missing { color:var(--qm-amber); }.qm-status.is-muted { color:#858894; }.qm-status.is-muted i { background:#666975; }
.qm-mapping-detail,.qm-coverage-detail { background:#15161d; }.qm-detail-inner { padding:18px; }.qm-detail-heading { padding-bottom:16px; display:flex; justify-content:space-between; gap:12px; border-bottom:1px solid var(--qm-line); }.qm-detail-heading h2 { margin:0; font-size:15px; font-weight:650; }.qm-detail-heading small { display:block; margin-top:4px; color:#8c8f9b; font-size:11px; }.qm-mapping-detail dl { margin:16px 0; display:grid; grid-template-columns:76px 1fr; row-gap:9px; font-size:11px; }.qm-mapping-detail dt { color:#848792; }.qm-mapping-detail dd { min-width:0; margin:0; color:#d5d6dd; overflow:hidden; text-overflow:ellipsis; }.qm-path-value { color:#9699a5 !important; font:11px var(--f-data); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.qm-map-picker { border-top:1px solid var(--qm-line); padding-top:14px; }.qm-map-picker > label { display:block; margin-bottom:8px; color:#aaacb7; font-size:11px; font-weight:600; }.qm-map-picker > .qm-pane-search { margin:0; }.qm-map-picker-list { max-height:165px; margin:8px 0 12px; overflow:auto; border:1px solid var(--qm-line-soft); }.qm-map-picker-list button { min-height:40px; width:100%; padding:0 9px; display:flex; align-items:center; justify-content:space-between; gap:8px; text-align:left; border-bottom:1px solid var(--qm-line-soft); }.qm-map-picker-list button:hover,.qm-map-picker-list button.is-selected { background:var(--qm-violet-soft); }.qm-map-picker-list span { min-width:0; display:flex; flex-direction:column; }.qm-map-picker-list strong,.qm-map-picker-list small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.qm-map-picker-list strong { font-size:11px; }.qm-map-picker-list small { color:#858894; font:9px var(--f-data); }.qm-map-picker-list em { color:#9396a2; font:10px var(--f-data); font-style:normal; }.qm-map-picker .qm-button { width:100%; }
.qm-coverage-workspace { min-height:0; flex:1; display:flex; flex-direction:column; }.qm-coverage-summary { min-height:58px; padding:0 20px; display:flex; align-items:center; gap:0; border-bottom:1px solid var(--qm-line); background:#14151b; }.qm-coverage-summary > span { padding:0 30px; border-right:1px solid var(--qm-line); color:#b5b7c1; font-size:12px; }.qm-coverage-summary > span:first-child { padding-left:0; }.qm-coverage-summary b { color:#fff; font-weight:600; }.qm-coverage-summary .is-warning b { color:var(--qm-amber); }.qm-coverage-summary .qm-pane-search { width:240px; margin-left:auto; }.qm-coverage-grid { min-height:0; flex:1; display:grid; grid-template-columns:minmax(0,1fr) 330px; }.qm-coverage-table-pane { border-right:1px solid var(--qm-line); }.qm-coverage-table th:nth-child(1) { width:21%; }.qm-coverage-table th:nth-child(2) { width:35%; }.qm-coverage-table th:nth-child(3) { width:13%; }.qm-coverage-table th:nth-child(4) { width:15%; }.qm-coverage-table tr { cursor:pointer; }.qm-coverage-meter { width:100px; height:5px; margin-right:7px; display:inline-block; vertical-align:middle; overflow:hidden; background:#30323c; border-radius:4px; }.qm-coverage-meter i { height:100%; display:block; background:var(--qm-green); border-radius:inherit; }.qm-coverage-table small { color:#a2a5b0; font-size:10px; }.qm-detail-list { margin:18px 0; }.qm-detail-list h3 { margin:0 0 7px; color:#9da0ab; font-size:10px; font-weight:650; text-transform:uppercase; letter-spacing:.06em; }.qm-detail-list button,.qm-detail-list label { min-height:31px; width:100%; padding:0 8px; display:flex; align-items:center; border-bottom:1px solid var(--qm-line-soft); text-align:left; color:#d3d4db; font-size:11px; }.qm-detail-list button:hover { background:var(--gr-hover-soft); }.qm-detail-list.is-warning h3 { color:var(--qm-amber); }.qm-detail-list input { margin-right:8px; accent-color:var(--qm-violet); }.qm-coverage-detail .qm-button { width:100%; }.qm-coverage-health { margin-top:18px; padding:12px; display:flex; flex-direction:column; gap:4px; border:1px solid var(--qm-line); background:#111217; }.qm-coverage-health strong { font-size:12px; }.qm-coverage-health small { color:var(--qm-amber); font-size:11px; }.qm-empty-copy { padding:18px; color:#838692; font-size:12px; text-align:center; }
@media (max-width:1100px) { .qm-header-title,.qm-capacity { display:none; }.qm-batch-ribbon { height:auto; min-height:62px; flex-wrap:wrap; padding:10px 14px; gap:9px; }.qm-ribbon-search { width:200px; }.qm-queue-grid { grid-template-columns:270px minmax(0,1fr); }.qm-inspector-grid { grid-template-columns:240px minmax(0,1fr); }.qm-mapping-detail { display:none; }.qm-coverage-grid { grid-template-columns:minmax(0,1fr) 280px; } }
@media (max-width:800px) { .qm-page { min-height:100%; }.qm-header { min-height:57px; padding:max(env(safe-area-inset-top),0.5rem) 12px 8px; flex-wrap:wrap; }.qm-header-spacer { display:none; }.qm-header-actions { margin-left:auto; }.qm-queue-grid,.qm-inspector-grid,.qm-coverage-grid { grid-template-columns:1fr; }.qm-shots-pane,.qm-scene-pane { min-height:360px; border-right:0; border-bottom:1px solid var(--qm-line); }.qm-draft-pane,.qm-mapping-table-pane,.qm-coverage-table-pane { min-height:420px; }.qm-mapping-detail,.qm-coverage-detail { display:block; min-height:330px; }.qm-coverage-summary { padding:10px 14px; flex-wrap:wrap; gap:10px; }.qm-coverage-summary > span { padding:0 10px 0 0; border:0; }.qm-coverage-summary .qm-pane-search { width:100%; margin:0; }.qm-draft-footer { padding:10px 14px; gap:10px; flex-wrap:wrap; }.qm-templates-layer { padding:10px; }.qm-templates-dialog { max-height:92vh; }.qm-templates-grid { grid-template-columns:1fr; padding:12px; }.qm-templates-toolbar { flex-wrap:wrap; }.qm-templates-search { width:100%; flex:1 0 100%; }.qm-templates-save { width:100%; }.qm-batch-ribbon label { width:calc(50% - 5px); justify-content:space-between; }.qm-batch-ribbon label input:not(.qm-switch),.qm-batch-ribbon label select { width:70%; } }
@media (max-width:640px) { header.sticky .qm-topbar-index-refresh { width:30px; padding:0; justify-content:center; } header.sticky .qm-topbar-index-refresh span { display:none; } }

/* The dense table rule above is intentionally followed by the reference token
   so its older literal background cannot override the screenshot palette. */
.qm-draft-table th, .qm-mapping-table th, .qm-coverage-table th { background:var(--qm-shell); }

/* Pathmapper reference layout ------------------------------------------------
   Three uninterrupted data panes, compact controls and square separators. */
.qm-page.is-pathmapper {
  --pm-header:#0d0f11;
  /* The map browser is a panel too; use the same app surface as its detail
     pane instead of making the left column appear recessed. */
  --pm-sequences:var(--gr-panel);
  /* Keep page-specific layout tokens, but inherit the app's panel plane so
     Pathmapper does not drift from the shared graphite surface. */
  --pm-panel:var(--gr-panel);
  --pm-input:#141618;
  --pm-table-head:#1d1f23;
  --pm-selected:#382b53;
  --pm-footer:#111315;
  --pm-border:#34373a;
  --pm-purple:#6e4fa0;
  --pm-purple-dark:#352551;
  --pm-green:#5fbd69;
  --pm-amber:#f2a000;
  --pm-red:#ed4848;
  /* Canvas, not panel: the panes are inset cards on top of it, so the page
     itself has to be the darker plane or their edges vanish. Map coverage
     already worked this way; the Scene inspector was the odd one out. */
  background:var(--pm-header);
}
.qm-page.is-pathmapper .qm-header { gap:12px; background:var(--pm-header); border-color:var(--pm-border); }
.qm-page.is-pathmapper .qm-workspace-switch { height:30px; padding:0; overflow:hidden; border-color:#3a3146; border-radius:4px; background:#0e1012; }
.qm-page.is-pathmapper .qm-workspace-switch button { height:28px; min-width:96px; padding:0 14px; border-radius:0; font-size:12px; font-weight:600; }
.qm-page.is-pathmapper .qm-workspace-switch button.is-active { background:linear-gradient(135deg,var(--pm-purple-dark),#49306e); }
.qm-breadcrumb-chevron { color:#8f9297; font-size:20px; font-weight:300; line-height:1; }
.qm-page.is-pathmapper .qm-header-title { color:#d9dadd; font-size:13px; font-weight:500; letter-spacing:0; }
.qm-path-stats { display:flex; align-items:center; gap:7px; color:#d8d9dc; font-size:11px; white-space:nowrap; }
.qm-path-stats em { color:#777b80; font-style:normal; }
.qm-page.is-pathmapper .qm-header-actions .qm-button { height:30px; min-width:118px; padding:0 13px; font-size:12px; font-weight:600; }
.qm-page.is-pathmapper .qm-button-muted { background:#171a1c; border-color:#373a3d; }
.qm-page.is-pathmapper .qm-button-primary { border-color:transparent; background:linear-gradient(135deg,#6366f1 0%,#a855f7 52%,#ec4899 100%); }
.qm-page.is-pathmapper .qm-pathmapper-tabs { height:32px; padding:2px; gap:2px; border:1px solid #30283a; border-radius:4px; background:#101214; }
.qm-page.is-pathmapper .qm-pathmapper-tabs button { height:26px; padding:0 10px; font-size:10px; border-radius:2px; }
.qm-page.is-pathmapper .qm-pathmapper-tabs button.is-active { background:#352551; }
.qm-page.is-pathmapper .qm-pathmapper-workspace { background:var(--pm-header); }
/* The panes are inset cards on the canvas, like every other page's panels,
   rather than full-bleed columns divided by single rules. */
.qm-page.is-pathmapper .qm-inspector-grid { min-height:0; flex:1; grid-template-columns:19% 52% 29%; gap:8px; padding:8px; }
.qm-page.is-pathmapper .qm-scene-pane,
.qm-page.is-pathmapper .qm-mapping-table-pane,
.qm-page.is-pathmapper .qm-mapping-detail { border:1px solid var(--pm-border); border-radius:2px; }
.qm-page.is-pathmapper .qm-scene-pane { background:var(--pm-sequences); }
.qm-page.is-pathmapper .qm-mapping-table-pane,
.qm-page.is-pathmapper .qm-mapping-detail { background:var(--pm-panel); }
.qm-page.is-pathmapper .qm-pane-heading { min-height:48px; padding:0 14px; background:transparent; border-color:var(--pm-border); }
.qm-page.is-pathmapper .qm-pane-heading h2 { font-size:13px; font-weight:600; letter-spacing:-.015em; }
.qm-page.is-pathmapper .qm-scene-pane .qm-pane-heading { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.qm-navigation-switch { height:30px; display:flex; overflow:hidden; border:1px solid #3a3146; border-radius:3px; background:#101214; }
.qm-navigation-switch button { min-width:58px; padding:0 9px; color:#aeb0b5; font-size:11px; }
.qm-navigation-switch button.is-active { color:#fff; background:#352551; }
.qm-add-map { width:28px; height:28px; display:grid; place-items:center; border:0; border-radius:3px; color:#fff; background:linear-gradient(135deg,#6366f1 0%,#a855f7 52%,#ec4899 100%); box-shadow:0 7px 18px -11px rgba(168,85,247,.7); font-size:20px; font-weight:400; line-height:1; }
.qm-add-map:hover { color:#fff; filter:brightness(1.08); }
.qm-page.is-pathmapper .qm-heading-meta { margin-left:18px; color:#a4a7ac; font-size:12px; }
.qm-page.is-pathmapper .qm-scene-search-row,
.qm-page.is-pathmapper .qm-map-search-row { display:flex; align-items:center; gap:8px; }
.qm-page.is-pathmapper .qm-scene-search-row { min-height:58px; padding:0 14px; border-bottom:1px solid var(--pm-border); }
.qm-page.is-pathmapper .qm-scene-search-row .qm-pane-search,
.qm-page.is-pathmapper .qm-map-search-row .qm-pane-search { min-width:0; flex:1; margin:0; }
.qm-page.is-pathmapper .qm-pane-search { height:37px; margin:0; border-color:#393c3f; border-radius:3px; background:var(--pm-input); }
.qm-page.is-pathmapper .qm-pane-search svg { width:17px; height:17px; }
.qm-page.is-pathmapper .qm-pane-search input { font-size:12px; }
.qm-square-control { width:37px; height:37px; flex:0 0 37px; display:grid; place-items:center; border:1px solid #393c3f; border-radius:3px; color:#b8babf; background:#151719; }
.qm-square-control:hover { color:#fff; background:var(--gr-hover); }
.qm-square-control svg { width:17px; height:17px; }
.qm-page.is-pathmapper .qm-scene-tree { padding:8px 14px 12px; }
.qm-page.is-pathmapper .qm-map-nav-item { width:100%; height:36px; padding:0 8px; display:flex; align-items:center; gap:8px; text-align:left; border-radius:3px; color:#d7d8dc; }
.qm-page.is-pathmapper .qm-map-nav-item:hover { background:var(--gr-hover-soft); }
.qm-page.is-pathmapper .qm-map-nav-item.is-active { background:var(--pm-selected); box-shadow:inset 3px 0 var(--qm-violet); }
.qm-page.is-pathmapper .qm-map-nav-item > svg { width:17px; height:17px; flex:0 0 17px; padding:3px; border:1px solid #55585c; border-radius:3px; color:#d8d9dc; }
.qm-page.is-pathmapper .qm-nav-label { min-width:0; flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.qm-page.is-pathmapper .qm-map-nav-item small { flex:0 0 auto; color:#989ba0; font-size:10px; }
.qm-page.is-pathmapper .qm-nav-label { font-size:12px; font-weight:400; }
.qm-page.is-pathmapper .qm-map-nav-item > i { width:8px; height:8px; flex:0 0 8px; border-radius:50%; background:#666975; }
.qm-page.is-pathmapper .qm-map-nav-item > i.is-linked { background:var(--pm-green); }
.qm-page.is-pathmapper .qm-map-nav-item > i.is-muted { background:#666975; }
.qm-page.is-pathmapper .qm-tree-group + .qm-tree-group { border-top:0; }
.qm-page.is-pathmapper .qm-tree-scene { height:42px; padding:0 4px; gap:8px; color:#e7e7ea; }
.qm-page.is-pathmapper .qm-tree-scene:hover { background:transparent; }
.qm-page.is-pathmapper .qm-tree-scene svg { width:14px; color:#e2e3e5; }
.qm-page.is-pathmapper .qm-tree-scene strong { font-size:13px; font-weight:600; }
.qm-page.is-pathmapper .qm-tree-scene span { margin-left:auto; color:#a8aaae; font-size:11px; }
.qm-page.is-pathmapper .qm-tree-scene i,
.qm-pathmapper-filters i { width:8px; height:8px; flex:0 0 8px; border-radius:50%; }
.qm-page.is-pathmapper .qm-tree-shot { height:35px; padding:0 8px 0 42px; border-radius:2px; color:#bbbcc1; }
.qm-page.is-pathmapper .qm-tree-shot span { font-size:12px; }
.qm-page.is-pathmapper .qm-tree-shot i { order:2; margin-left:auto; width:8px; height:8px; }
.qm-page.is-pathmapper .qm-tree-shot.is-active { color:#e9e8ec; background:var(--pm-selected); }
.qm-page.is-pathmapper .is-linked { background-color:var(--pm-green); }
.qm-page.is-pathmapper .is-missing { background-color:var(--pm-amber); }
.qm-page.is-pathmapper .is-conflict { background-color:var(--pm-red); }
.qm-pathmapper-filters { display:flex; align-items:center; gap:6px; }
.qm-pathmapper-filters button { height:30px; padding:0 10px; display:inline-flex; align-items:center; gap:5px; border:1px solid #373a3e; border-radius:3px; color:#c0c2c6; font-size:10px; white-space:nowrap; }
.qm-pathmapper-filters button.is-active { color:#fff; border-color:#594277; background:#352551; }
.qm-pathmapper-filters i.is-missing { background:var(--pm-amber); }
.qm-pathmapper-filters i.is-conflict { background:var(--pm-red); }
.qm-mapping-toolbar { min-height:60px; padding:0 14px; display:flex; align-items:center; gap:12px; border-bottom:1px solid var(--pm-border); background:var(--pm-panel); }
.qm-mapping-toolbar .qm-pane-search { flex:1; }
.qm-mapping-toolbar select,
.qm-pagination select { height:37px; padding:0 10px; border:1px solid #3a3d40; border-radius:3px; color:#d4d5d8; background:#151719; outline:none; font-size:12px; }
.qm-mapping-toolbar select { width:145px; }
.qm-page.is-pathmapper .qm-table-scroll { background:var(--pm-panel); }
.qm-page.is-pathmapper .qm-mapping-table { min-width:0; }
.qm-page.is-pathmapper .qm-mapping-table th { height:28px; padding:0 12px; color:#9a9ca1; background:var(--pm-table-head); border-right:1px solid #33363a; border-bottom-color:#3b3e42; font-size:8px; font-weight:600; text-transform:uppercase; letter-spacing:.07em; }
.qm-page.is-pathmapper .qm-mapping-table td { height:39px; padding:0 12px; color:#d6d7da; background:var(--pm-panel); border-right:1px solid #303337; border-bottom-color:#303337; font-size:10px; }
.qm-page.is-pathmapper .qm-mapping-table tr.is-selected td { background:var(--pm-selected); }
.qm-page.is-pathmapper .qm-mapping-table th:nth-child(1),.qm-page.is-pathmapper .qm-mapping-table td:nth-child(1) { width:35%; }
.qm-page.is-pathmapper .qm-mapping-table th:nth-child(2),.qm-page.is-pathmapper .qm-mapping-table td:nth-child(2) { width:40%; }
.qm-page.is-pathmapper .qm-mapping-table th:nth-child(3),.qm-page.is-pathmapper .qm-mapping-table td:nth-child(3) { width:15%; }
.qm-page.is-pathmapper .qm-mapping-table th:nth-child(4),.qm-page.is-pathmapper .qm-mapping-table td:nth-child(4) { width:10%; padding-right:8px; padding-left:8px; text-align:center; }
.qm-page.is-pathmapper .qm-shot-cell { font-weight:400; }
.qm-page.is-pathmapper .qm-status { gap:8px; font-size:11px; }
.qm-page.is-pathmapper .qm-status i { width:8px; height:8px; }
.qm-page.is-pathmapper .qm-status.is-linked { color:#bfc2c4; background:transparent; }
.qm-page.is-pathmapper .qm-status.is-linked i { background:var(--pm-green); }
.qm-page.is-pathmapper .qm-status.is-missing { color:#e9ebed; background:transparent; }
.qm-page.is-pathmapper .qm-status.is-missing i { background:var(--pm-amber); }
.qm-page.is-pathmapper .qm-status.is-conflict { color:#ef6464; background:transparent; }
.qm-page.is-pathmapper .qm-status.is-conflict i { background:var(--pm-red); }
.qm-status-dot { width:16px; height:16px; justify-content:center; }
.qm-status-dot i { width:9px !important; height:9px !important; }
.qm-pagination { min-height:60px; padding:0 18px; display:flex; align-items:center; gap:18px; border-top:1px solid var(--pm-border); background:var(--gr-panel); color:#aeb0b4; font-size:11px; }
.qm-pagination > div { display:flex; gap:5px; }
.qm-pagination button { min-width:30px; height:30px; padding:0 7px; border-radius:3px; color:#b6b8bc; background:#181b1d; }
.qm-pagination button.is-active { color:#fff; background:#4a356d; }
.qm-pagination button:disabled { opacity:.3; }
.qm-pagination select { margin-left:auto; width:98px; height:35px; }
.qm-page.is-pathmapper .qm-mapping-detail { display:flex; flex-direction:column; overflow:hidden; }
.qm-page.is-pathmapper .qm-filtered-link-card { min-height:64px; padding:0 20px; display:flex; align-items:center; justify-content:space-between; gap:12px; border-bottom:1px solid var(--pm-border); background:var(--gr-panel); }
.qm-page.is-pathmapper .qm-filtered-link-card > span { color:#d8d9dc; font-size:11px; font-weight:500; }
.qm-page.is-pathmapper .qm-filtered-link-card .qm-link-filtered { margin-left:auto; }
.qm-detail-panel-title { min-height:48px; padding:0 14px; display:flex; align-items:center; border-bottom:1px solid var(--pm-border); color:#ececef; font-size:13px; font-weight:600; }
.qm-page.is-pathmapper .qm-detail-inner { min-height:0; flex:1; padding:20px; display:flex; flex-direction:column; }
.qm-page.is-pathmapper .qm-detail-heading { padding:0 0 14px; align-items:center; border-bottom:0; }
.qm-page.is-pathmapper .qm-detail-heading h2 { font-size:15px; font-weight:500; }
.qm-detail-actions { display:flex; align-items:center; gap:9px; }
.qm-page.is-pathmapper .qm-edit-pathmap { width:28px; height:28px; border:1px solid #3a3d40; border-radius:3px; background:#17191b; }
.qm-page.is-pathmapper .qm-edit-pathmap:hover { background:var(--gr-hover); }
.qm-status-chip { min-height:31px; padding:0 10px; border:1px solid currentColor; border-radius:3px; }
.qm-status-chip.is-missing { color:var(--pm-amber) !important; }
.qm-status-chip.is-conflict { color:var(--pm-red) !important; }
.qm-status-chip.is-linked { color:var(--pm-green) !important; }
.qm-page.is-pathmapper .qm-mapping-detail dl { margin:0 0 14px; padding-bottom:13px; grid-template-columns:90px minmax(0,1fr); row-gap:7px; border-bottom:1px solid var(--pm-border); font-size:10px; }
.qm-page.is-pathmapper .qm-mapping-detail dt { color:#b2b4b8; font-size:10px; }
.qm-page.is-pathmapper .qm-mapping-detail dd { color:#d4d5d8; font-size:10px; }
.qm-page.is-pathmapper .qm-mapping-detail .qm-path-value { font:10px var(--f-data); }
.qm-page.is-pathmapper .qm-map-picker { min-height:0; flex:1; padding-top:0; border-top:0; display:flex; flex-direction:column; }
.qm-page.is-pathmapper .qm-map-picker > label { margin-bottom:9px; color:#e1e2e4; font-size:11px; font-weight:500; }
.qm-picker-columns { margin:12px 8px 7px; display:flex; justify-content:space-between; color:#bbbcc0; font-size:10px; }
.qm-page.is-pathmapper .qm-map-picker-list { min-height:0; max-height:none; flex:1; margin:0 0 12px; border-color:#3a3d40; border-radius:3px; }
.qm-page.is-pathmapper .qm-map-picker-list button { min-height:38px; padding:0 10px; border-color:#373a3e; }
.qm-page.is-pathmapper .qm-map-picker-list button > svg { width:25px; height:25px; flex:0 0 25px; padding:4px; border:1px solid #55585c; border-radius:3px; color:#d8d9dc; }
.qm-page.is-pathmapper .qm-map-picker-list button.is-selected { background:#292136; }
.qm-page.is-pathmapper .qm-map-picker-list button > span { min-width:0; flex:1; flex-direction:row; align-items:center; gap:7px; }
.qm-page.is-pathmapper .qm-suggested-map-name { min-width:0; flex:0 1 auto; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:11px; font-weight:400; }
.qm-page.is-pathmapper .qm-map-picker-list small { min-width:0; flex:1 1 auto; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:none; color:#989a9f; font-size:9px; }
.qm-page.is-pathmapper .qm-map-picker-list em { margin-left:auto; color:#c4c6c9; font-size:10px; }
.qm-page.is-pathmapper .qm-map-picker .qm-button { height:38px; border-radius:2px; }.qm-page.is-pathmapper .qm-map-picker .qm-button-primary { background:linear-gradient(135deg,#6366f1 0%,#a855f7 52%,#ec4899 100%); }
/* The Pathmapper filters are a compact status instrument, not part of the
   table. Give them the same inset, dark mini-panel treatment as other
   workspace footers. */
.qm-pathmapper-footer { min-height:52px; margin:0 8px 8px; padding:0 16px; display:flex; align-items:center; gap:9px; border:1px solid var(--pm-border); border-radius:2px; background:var(--gr-panel); color:#c9cacc; font-size:12px; }
.qm-pathmapper-footer em { color:#666a6e; font-style:normal; }
.qm-pathmapper-footer b { color:var(--pm-green); font-weight:500; }
.qm-pathmapper-footer strong { color:var(--pm-amber); font-weight:500; }
.qm-pathmapper-footer > i { color:var(--pm-red); font-style:normal; }
.qm-link-filtered { height:30px; margin-left:4px; padding:0 10px; gap:6px; font-size:11px; }.qm-link-filtered span { min-width:18px; padding:1px 5px; border-radius:10px; background:rgba(255,255,255,.16); font-variant-numeric:tabular-nums; }
.qm-footer-status { margin-left:12px; }
.qm-save-hint { margin-left:auto; color:#d0d1d4; }

@media (max-width:1100px) {
  .qm-page.is-pathmapper .qm-inspector-grid { grid-template-columns:22% 49% 29%; }
  .qm-page.is-pathmapper .qm-pathmapper-tabs { display:none !important; }
  .qm-page.is-pathmapper .qm-heading-meta { display:none; }
  .qm-page.is-pathmapper .qm-header-actions .qm-button { min-width:auto; }
}
@media (max-width:1400px) and (min-width:801px) {
  .qm-pathmapper-filters button { min-width:0; justify-content:center; padding:0 7px; }
  .qm-footer-status { display:none; }
}

/* Shared card spacing -------------------------------------------------------
   The approved Pathmapper reference separates working columns with a narrow
   shell-coloured gutter. New Queue uses the same material and spacing system. */
.qm-page.is-pathmapper .qm-inspector-grid {
  grid-template-columns:minmax(220px,19fr) minmax(0,52fr) minmax(280px,29fr);
  gap:8px;
  padding:0 8px;
  border-bottom:0;
  background:var(--pm-header);
}
.qm-page.is-pathmapper .qm-header,
.qm-page.is-newqueue .qm-header { border-bottom:0; box-shadow:none; }
.qm-page.is-pathmapper .qm-pathmapper-footer { box-shadow:none; }
.qm-page.is-pathmapper .qm-scene-pane,
.qm-page.is-pathmapper .qm-mapping-table-pane,
.qm-page.is-pathmapper .qm-mapping-detail {
  border:1px solid var(--pm-border);
  border-radius:2px;
}
.qm-page.is-pathmapper .qm-coverage-grid {
  grid-template-columns:minmax(280px,26fr) minmax(0,74fr);
  gap:8px;
  padding:8px;
  background:var(--pm-header);
}
.qm-page.is-pathmapper .qm-coverage-map-pane,
.qm-page.is-pathmapper .qm-coverage-overview-pane {
  border:1px solid var(--pm-border);
  border-radius:2px;
}
.qm-coverage-map-pane { min-height:0; display:flex; flex-direction:column; overflow:hidden; background:var(--pm-sequences); }
.qm-page.is-pathmapper .qm-coverage-map-pane .qm-pane-heading { min-height:64px; padding:0 20px; }
.qm-page.is-pathmapper .qm-coverage-map-pane .qm-scene-search-row { min-height:58px; padding:0 14px; border-bottom:1px solid var(--pm-border); }
.qm-page.is-pathmapper .qm-coverage-map-pane .qm-pane-search { min-width:0; flex:1; margin:0; }
.qm-page.is-pathmapper .qm-coverage-map-pane .qm-scene-tree { padding:8px 14px 12px; }
.qm-coverage-overview-pane { min-height:0; overflow:hidden; background:var(--pm-panel); }
.qm-coverage-chart-panel { height:100%; box-sizing:border-box; padding:18px 20px; }
.qm-coverage-panel-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }
.qm-coverage-panel-heading h2 { margin:0; color:#e6e7e9; font-size:13px; font-weight:500; }
.qm-coverage-panel-heading span { display:block; margin-top:4px; color:#90939a; font-size:10px; }
.qm-coverage-panel-heading .qm-button { height:30px; padding:0 10px; font-size:10px; white-space:nowrap; }
.qm-coverage-chart-content { height:calc(100% - 43px); min-height:210px; display:flex; align-items:center; justify-content:center; gap:50px; }
.qm-coverage-pie { width:clamp(240px,29vw,330px); height:clamp(240px,29vw,330px); flex:0 0 clamp(240px,29vw,330px); position:relative; box-sizing:border-box; border:1px solid rgba(255,255,255,.12); border-radius:50%; box-shadow:0 18px 38px rgba(0,0,0,.28), inset 0 0 0 1px rgba(255,255,255,.08); }
.qm-coverage-pie svg { position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.qm-coverage-pie path { stroke:#15171a; stroke-width:1.2; transition:transform .18s ease,filter .18s ease; }
.qm-coverage-pie path.is-selected { stroke:#f4f3f8; stroke-width:2; filter:brightness(1.16) drop-shadow(0 3px 3px rgba(0,0,0,.38)); }
.qm-coverage-pie-core { position:absolute; inset:17%; display:flex; flex-direction:column; align-items:center; justify-content:center; border:1px solid #30343a; border-radius:50%; background:radial-gradient(circle at 36% 28%,#25282d,#17191c 69%); box-shadow:0 0 0 5px rgba(12,14,16,.45); color:#ececef; }
.qm-coverage-pie-core span { font:24px var(--f-data); letter-spacing:-.04em; }
.qm-coverage-pie-core small { margin-top:4px; color:#989ba1; font-size:10px; }
.qm-coverage-selected-map { min-width:180px; max-width:280px; }
.qm-coverage-selected-map > span { color:#96999e; font-size:10px; }
.qm-coverage-selected-map h3 { margin:7px 0 9px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#e1e2e5; font-size:14px; font-weight:400; }
.qm-coverage-selected-map p { margin:0; color:#a7a9ae; font-size:11px; }
.qm-coverage-selected-map b { color:#d8d9dd; font-weight:500; }
.qm-coverage-selected-map em { margin:0 5px; color:#666a70; font-style:normal; }

.qm-page.is-newqueue {
  --nq-header:#0d0f11;
  /* Match the shot browser to the draft panel and app-wide card surface. */
  --nq-shots:var(--gr-panel);
  /* New Queue shares the app panel colour rather than maintaining a near
     duplicate literal that becomes visibly different beside other pages. */
  --nq-panel:var(--gr-panel);
  --nq-input:#141618;
  --nq-table-head:#1d1f23;
  --nq-selected:#382b53;
  /* Both bottom strips use the shared main panel surface. */
  --nq-footer:var(--gr-panel);
  --nq-border:#34373a;
  background:var(--nq-header);
}
.qm-page.is-newqueue .qm-header {
  background:var(--nq-header);
  border-color:var(--nq-border);
}
.qm-page.is-newqueue .qm-workspace-switch { height:30px; padding:0; overflow:hidden; border-color:#3a3146; border-radius:4px; background:#0e1012; }
.qm-page.is-newqueue .qm-workspace-switch button { height:28px; min-width:96px; padding:0 14px; border-radius:0; font-size:12px; font-weight:600; }
.qm-page.is-newqueue .qm-workspace-switch button.is-active { background:linear-gradient(135deg,#352551,#49306e); }
.qm-page.is-newqueue .qm-header-actions .qm-button { height:30px; padding:0 13px; font-size:12px; }
.qm-page.is-newqueue .qm-queue-workspace { background:var(--nq-header); }
.qm-page.is-newqueue .qm-batch-ribbon {
  min-height:52px;
  margin:8px 8px 0;
  padding:7px 12px;
  border:1px solid var(--nq-border);
  border-radius:2px;
  background:var(--nq-panel);
}
.qm-page.is-newqueue .qm-batch-ribbon select,
.qm-page.is-newqueue .qm-batch-ribbon input:not(.qm-switch),
.qm-page.is-newqueue .qm-pane-search {
  background:var(--nq-input);
  border-color:#393c3f;
}
.qm-page.is-newqueue .qm-batch-ribbon { gap:14px; }
.qm-page.is-newqueue .qm-batch-ribbon label { gap:6px; font-size:10px; }
.qm-page.is-newqueue .qm-batch-ribbon select,.qm-page.is-newqueue .qm-batch-ribbon input:not(.qm-switch) { height:28px; font-size:10px; }
.qm-page.is-newqueue .qm-batch-ribbon .qm-priority-control input { width:46px; }
.qm-page.is-newqueue .qm-batch-ribbon .qm-button { height:30px; padding:0 10px; font-size:10px; }
.qm-page.is-newqueue .qm-button-muted { background:#171a1c; border-color:#373a3d; }
.qm-page.is-newqueue .qm-button-primary { border-color:transparent; background:linear-gradient(135deg,#6366f1 0%,#a855f7 52%,#ec4899 100%); }
.qm-page.is-newqueue .qm-queue-grid {
  grid-template-columns:minmax(270px,27fr) minmax(0,73fr);
  gap:8px;
  padding:8px;
  background:var(--nq-header);
}
.qm-page.is-newqueue .qm-shots-pane,
.qm-page.is-newqueue .qm-draft-pane {
  border:1px solid var(--nq-border);
  border-radius:2px;
}
.qm-page.is-newqueue .qm-shots-pane { background:var(--nq-shots); }
.qm-page.is-newqueue .qm-draft-pane,
.qm-page.is-newqueue .qm-table-scroll { background:var(--nq-panel); }
.qm-page.is-newqueue .qm-pane-heading { background:transparent; border-color:var(--nq-border); }
.qm-page.is-newqueue .qm-pane-heading { min-height:48px; padding:0 14px; }
.qm-page.is-newqueue .qm-pane-heading h2 { font-size:13px; font-weight:600; }
.qm-page.is-newqueue .qm-shots-search { margin:8px 14px; }
.qm-page.is-newqueue .qm-scene-heading { height:34px; }
.qm-page.is-newqueue .qm-scene-heading > button:first-child { padding:0 10px; gap:7px; }
.qm-page.is-newqueue .qm-scene-heading strong { font-size:11px; font-weight:500; }
.qm-page.is-newqueue .qm-scene-heading small { font-size:10px; }
.qm-page.is-newqueue .qm-shot-row { height:32px; padding:0 10px 0 38px; gap:7px; }
.qm-page.is-newqueue .qm-shot-row input[type="checkbox"] { width:14px; height:14px; flex-basis:14px; }
.qm-page.is-newqueue .qm-shot-name { font-size:11px; }
.qm-page.is-newqueue .qm-shot-row em { width:30px; font-size:10px; }
.qm-shot-meta { display:flex; align-items:center; gap:6px; flex:0 0 auto; }
.qm-page.is-newqueue .qm-shot-meta i { width:7px; height:7px; }
.qm-page.is-newqueue .qm-shot-meta small { color:#b4b5c0; font:10px var(--f-data); }
.qm-page.is-newqueue .qm-draft-table th { background:var(--nq-table-head); border-bottom-color:#3b3e42; }
.qm-page.is-newqueue .qm-draft-table td { background:var(--nq-panel); border-bottom-color:#303337; }
.qm-page.is-newqueue .qm-draft-table th { height:28px; padding:0 12px; font-size:8px; font-weight:600; text-transform:uppercase; letter-spacing:.07em; }
.qm-page.is-newqueue .qm-draft-table td { height:40px; padding:0 12px; font-size:11px; }
.qm-page.is-newqueue .qm-draft-table th:nth-child(1),.qm-page.is-newqueue .qm-draft-table td:nth-child(1) { width:48px; }
.qm-page.is-newqueue .qm-draft-table th:nth-child(2),.qm-page.is-newqueue .qm-draft-table td:nth-child(2) { width:30%; }
.qm-page.is-newqueue .qm-draft-table th:nth-child(3),.qm-page.is-newqueue .qm-draft-table td:nth-child(3) { width:22%; }
.qm-page.is-newqueue .qm-draft-table th:nth-child(4),.qm-page.is-newqueue .qm-draft-table td:nth-child(4) { width:12%; }
.qm-page.is-newqueue .qm-draft-table th:nth-child(5),.qm-page.is-newqueue .qm-draft-table td:nth-child(5) { width:12%; }
.qm-page.is-newqueue .qm-draft-table th:nth-child(6),.qm-page.is-newqueue .qm-draft-table td:nth-child(6) { width:46px; }
.qm-page.is-newqueue .qm-draft-table th:nth-child(7),.qm-page.is-newqueue .qm-draft-table td:nth-child(7) { width:52px; }
.qm-page.is-newqueue .qm-draft-table th:nth-child(8),.qm-page.is-newqueue .qm-draft-table td:nth-child(8) { width:58px; padding:0 4px; text-align:center; white-space:nowrap; }
.qm-page.is-newqueue .qm-draft-table td:nth-child(8) .qm-icon-button { width:24px; height:24px; }
.qm-page.is-newqueue .qm-draft-check { width:14px; height:14px; margin-right:8px; }
.qm-page.is-newqueue .qm-drag { font-size:14px; }
.qm-page.is-newqueue .qm-map-cell { gap:6px; }
.qm-page.is-newqueue .qm-master-mark { width:15px; height:15px; font-size:10px; }
.qm-page.is-newqueue .qm-pane-footer { min-height:38px; padding:0 14px; font-size:10px; }
.qm-page.is-newqueue .qm-draft-footer { min-height:38px; padding:0 14px; justify-content:space-between; border-color:var(--nq-border); background:var(--nq-footer); font-size:10px; }
.qm-page.is-newqueue .qm-draft-footer .qm-text-button { font-size:10px; }
.qm-draft-pager { display:flex; align-items:center; gap:8px; color:#9ea1aa; }
.qm-draft-pager button { width:25px; height:25px; border-radius:3px; color:#c9cbd1; background:#1b1d24; }
.qm-draft-pager button:disabled { opacity:.3; }
.qm-draft-pager select { height:25px; border:1px solid var(--nq-border); border-radius:3px; color:#c9cbd1; background:#15161d; }
.qm-page.is-newqueue .qm-draft-table tr.is-selected td { background:var(--nq-selected); }
.qm-page.is-newqueue .qm-scene-heading.is-open,
.qm-page.is-newqueue .qm-shot-row.is-selected { background:var(--nq-selected); }
.qm-page.is-newqueue .qm-pane-footer { background:var(--nq-footer); border-color:var(--nq-border); }

@media (max-width:1100px) and (min-width:801px) {
  .qm-page.is-pathmapper .qm-inspector-grid { grid-template-columns:minmax(220px,22fr) minmax(0,49fr) minmax(280px,29fr); }
  .qm-page.is-newqueue .qm-queue-grid { grid-template-columns:minmax(250px,30fr) minmax(0,70fr); }
}
@media (max-width:800px) {
  .qm-page.is-pathmapper .qm-inspector-grid,
  .qm-page.is-newqueue .qm-queue-grid { grid-template-columns:1fr; padding:8px; }
  .qm-page.is-newqueue .qm-batch-ribbon { margin:8px 8px 0; }
}

/* New Queue runs its own darker palette (--nq-*), so the templates dialog
   follows it rather than the base Queue Manager greys - otherwise the panel
   reads a shade lighter than every surface behind it. */
.qm-page.is-newqueue .qm-templates-dialog { border-color:var(--nq-border); background:var(--nq-panel); }
.qm-page.is-newqueue .qm-templates-head,
.qm-page.is-newqueue .qm-templates-toolbar { border-color:var(--nq-border); }
.qm-page.is-newqueue .qm-template-card { border-color:var(--nq-border); background:var(--nq-input); }
.qm-page.is-newqueue .qm-templates-grid { background:var(--nq-header); }
.qm-page.is-newqueue .qm-templates-save { height:30px; padding:0 12px; font-size:11px; }