/* Velqlar Web render-surface geometry and first-paint capability boundary only.
   Formal mainline CSS owns all visible typography, color, borders, shadows and spacing.
   Unsupported Web capabilities are suppressed here before JS runs so no later stylesheet
   injection is required to hide them. Runtime JS may change semantic state/attributes,
   but may not create or rewrite visual CSS. */

/* Fail-closed semantic markers. */
[data-vel-web-hidden="true"],
[data-vel-web-forbidden-control],
[data-vel-web-foreign-edition-command] {
  display: none !important;
  pointer-events: none !important;
}

/* Unsupported formal-mainline File commands are hidden from first paint. */
[data-vel-menu-item-id="open-project"], [data-menu-item-id="open-project"], [data-vel-menu-id="open-project"],
[data-vel-menu-item-id="save-project"], [data-menu-item-id="save-project"], [data-vel-menu-id="save-project"],
[data-vel-menu-item-id="save-project-as"], [data-menu-item-id="save-project-as"], [data-vel-menu-id="save-project-as"],
[data-vel-menu-item-id="open-dxf"], [data-menu-item-id="open-dxf"], [data-vel-menu-id="open-dxf"],
[data-vel-menu-item-id="open-image"], [data-menu-item-id="open-image"], [data-vel-menu-id="open-image"],
[data-vel-menu-item-id="open-images"], [data-menu-item-id="open-images"], [data-vel-menu-id="open-images"],
[data-vel-menu-item-id="open-ifc"], [data-menu-item-id="open-ifc"], [data-vel-menu-id="open-ifc"],
[data-vel-menu-item-id="recent-files"], [data-menu-item-id="recent-files"], [data-vel-menu-id="recent-files"],
[data-vel-menu-item-id="open-log"], [data-menu-item-id="open-log"], [data-vel-menu-id="open-log"],
[data-vel-menu-item-id="show-last-error"], [data-menu-item-id="show-last-error"], [data-vel-menu-id="show-last-error"],
[data-vel-menu-item-id="export-adjusted-glb"], [data-menu-item-id="export-adjusted-glb"], [data-vel-menu-id="export-adjusted-glb"],
[data-vel-menu-item-id="export-folder"], [data-menu-item-id="export-folder"], [data-vel-menu-id="export-folder"],
[data-vel-menu-item-id="export-web"], [data-menu-item-id="export-web"], [data-vel-menu-id="export-web"],
[data-vel-menu-item-id="export-pdf-report"], [data-menu-item-id="export-pdf-report"], [data-vel-menu-id="export-pdf-report"],
[data-vel-menu-item-id="match-mode"], [data-menu-item-id="match-mode"], [data-vel-menu-id="match-mode"],
[data-vel-menu-item-id="model-compare"], [data-menu-item-id="model-compare"], [data-vel-menu-id="model-compare"],
[data-vel-menu-item-id="pseudo-stereo"], [data-menu-item-id="pseudo-stereo"], [data-vel-menu-id="pseudo-stereo"],
[data-vel-menu-item-id="recorder"], [data-menu-item-id="recorder"], [data-vel-menu-id="recorder"],
[data-vel-menu-item-id="view-path"], [data-menu-item-id="view-path"], [data-vel-menu-id="view-path"],
[data-vel-menu-item-id="showcase"], [data-menu-item-id="showcase"], [data-vel-menu-id="showcase"],
[data-vel-menu-item-id="human-silhouette"], [data-menu-item-id="human-silhouette"], [data-vel-menu-id="human-silhouette"],
[data-vel-menu-item-id="size-reference"], [data-menu-item-id="size-reference"], [data-vel-menu-id="size-reference"],
#web-project-input, #web-dxf-input, #web-image-input, #web-images-input,
#recent-files-section, #dxf-surface, #image-surface,
[data-side-surface="images"], [data-side-surface="dxf"], [data-side-surface="compare"],
[data-surface="dxf"], [data-surface="images"], [data-surface="image"], [data-surface="compare"],
[data-vel-surface="dxf"], [data-vel-surface="images"], [data-vel-surface="image"], [data-vel-surface="compare"],
.vel-side-tab-images, .vel-side-tab-dxf-open, #vel-side-pdf-docs,
#view-match-layer, #mask-edit-layer, #composite-preview-panel, #recording-hud,
#velMemoDrawer [data-memo-tab="pins"], #velMemoDrawer [data-memo-view="pins"], .vel-memo-pin-export,
[data-tool="comment-pin"], [data-vel-annotate-tool="comment-pin"], [data-stamp-type="comment-pin"], option[value="comment-pin"],
#vel-pdf-edit-actions button[title="Merge"], #vel-pdf-edit-actions button[title="Delete"],
#vel-pdf-edit-actions button[title="Restore All"], #vel-pdf-edit-actions button[title*="DXF"],
.vel-pdf-search-row, #vel-pdf-text-search-results,
[data-board-action="add"], [data-board-action="create"], [data-board-action="duplicate"], [data-board-action="delete"],
[data-board-page-add], [data-board-page-create], [data-board-page-duplicate], [data-board-page-delete],
.vel-surface-card-board .vel-board-list-actions, .vel-surface-card-board .vel-board-list-sideband,
.vel-surface-card-board button[title="New Board"], .vel-surface-card-board button[title="Delete Board"],
.vel-human-silhouette-launcher, .vel-size-reference-launcher, .vel-surface-card-human-silhouette, .vel-size-reference-card,
.vel-model-xray-edge-card, .vel-fixed-model-display-control, .vel-model-xray-edge-main, .vel-fixed-model-display-details,
[data-tool-action="material-panel"], #vel-annotate-material-panel,
button[title="Focus camera on last measurement point"] {
  display: none !important;
  pointer-events: none !important;
}

/* A foreign node may not impersonate the two Web-owned File commands. */
[data-vel-menu-item-id="open-model"]:not([data-vel-web-edition-command="open-model"]),
[data-menu-item-id="open-model"]:not([data-vel-web-edition-command="open-model"]),
[data-vel-menu-id="open-model"]:not([data-vel-web-edition-command="open-model"]),
[data-vel-menu-item-id="open-pdf"]:not([data-vel-web-edition-command="open-pdf"]),
[data-menu-item-id="open-pdf"]:not([data-vel-web-edition-command="open-pdf"]),
[data-vel-menu-id="open-pdf"]:not([data-vel-web-edition-command="open-pdf"]) {
  display: none !important;
  pointer-events: none !important;
}

.vel-surface-card-board .vel-board-list-meta {
  pointer-events: none !important;
  cursor: default !important;
}

#web-model-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  z-index: 1;
}
body:not([data-vel-display-surface="model"]) #web-model-canvas { display: none; }
#walker { visibility: hidden !important; pointer-events: none !important; }

/* Laser is an additive transient tool surface, never a shell rewrite. Its geometry
   is declared statically so the behavior owner never injects or mutates UI CSS. */
.vel-laser-pointer-canvas {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  display: none;
  pointer-events: none;
  touch-action: none;
  z-index: 9999;
}
.vel-laser-pointer-canvas[data-vel-laser-visible="true"] { display: block; }

/* These are formal mainline entry surfaces. The Web canvas must remain below them,
   but the Web boundary must not restyle their visible presentation. */
#model-empty,
#pdf-empty { z-index: 4; }

/* PDF runtime-owned canvas geometry only. */
#web-pdf-main {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 100%;
  min-height: 100%;
}
#web-pdf-page-wrap {
  position: relative;
  line-height: 0;
  transform-origin: center center;
}
#web-pdf-page { display: block; max-width: none; }
#web-pdf-page-annotations {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
#web-pdf-thumbnails { overflow: auto; }
.web-pdf-thumb { width: 100%; }

/* Web product capability: Board is one A4 Portrait sheet.
   Keep formal mainline Board styling; override only paper/preview geometry.
   The formal A3 pseudo-label is suppressed rather than replaced by Web-specific chrome. */
#whiteboard-board {
  width: min(
    calc(100% - 24px),
    calc((100vh - var(--vel-shell-menu-height, 32px) - var(--vel-shell-bottom-height, 44px) - 34px - 36px) * 0.7070707)
  );
  aspect-ratio: 210 / 297;
}
#whiteboard-board::after { content: none; }
#velShellRight .vel-board-list-preview {
  width: 50% !important;
  aspect-ratio: 210 / 297 !important;
  justify-self: center !important;
}

/* Display Setup uses the formal mainline panel, but the right-rail flex column must
   scroll instead of shrinking its formal rows/buttons into clipped strips. This is
   geometry-only: mainline still owns control styling, labels, spacing and ordering. */
#velShellRight .vel-surface-card-display-setup .vel-right-card-body-unified,
#velShellRight[data-panel-mode="displaySetup"] .vel-right-card-body-unified {
  overflow-y: auto !important;
  overflow-x: hidden !important;
}
#velShellRight .vel-surface-card-display-setup .vel-right-card-body-unified > *,
#velShellRight[data-panel-mode="displaySetup"] .vel-right-card-body-unified > * {
  flex-shrink: 0 !important;
}
#velShellRight .vel-surface-card-display-setup .vel-right-actions,
#velShellRight .vel-surface-card-display-setup .vel-panel-range,
#velShellRight .vel-surface-card-display-setup .vel-board-section-title,
#velShellRight .vel-surface-card-display-setup .vel-display-bg-dropzone,
#velShellRight[data-panel-mode="displaySetup"] .vel-right-actions,
#velShellRight[data-panel-mode="displaySetup"] .vel-panel-range,
#velShellRight[data-panel-mode="displaySetup"] .vel-board-section-title,
#velShellRight[data-panel-mode="displaySetup"] .vel-display-bg-dropzone {
  flex: 0 0 auto !important;
}
#velShellRight .vel-surface-card-display-setup .vel-right-actions,
#velShellRight[data-panel-mode="displaySetup"] .vel-right-actions {
  min-height: 18px !important;
}
#velShellRight .vel-surface-card-display-setup .vel-right-actions-grid,
#velShellRight[data-panel-mode="displaySetup"] .vel-right-actions-grid {
  grid-auto-rows: minmax(18px, auto);
}
#velShellRight .vel-surface-card-display-setup .vel-shell-btn,
#velShellRight[data-panel-mode="displaySetup"] .vel-shell-btn {
  min-height: 18px !important;
}

/* Narrow-phone fit only. This changes no mainline control identity, typography,
   colors, borders or ordering. The formal 280px desktop right rail otherwise leaves
   essentially zero usable Web work surface at phone widths, so shrink only its
   geometry while retaining the same mainline panel and side rail. */
@media (max-width: 720px) {
  :root {
    --vel-shell-right-base-width: clamp(104px, 30vw, 136px) !important;
    --vel-shell-right-width: clamp(104px, 30vw, 136px) !important;
  }

  #velShellRight {
    width: var(--vel-shell-right-base-width) !important;
    min-width: var(--vel-shell-right-base-width) !important;
    padding: 6px !important;
  }

  #velMemoDrawer {
    width: min(
      280px,
      calc(100vw - var(--vel-left-shell-width) - var(--vel-shell-rail-width) - 4px)
    ) !important;
    min-width: 0 !important;
    max-width: calc(100vw - var(--vel-left-shell-width) - var(--vel-shell-rail-width) - 4px) !important;
  }

  #whiteboard-board {
    width: min(
      calc(100% - 16px),
      calc((100vh - var(--vel-shell-menu-height, 32px) - var(--vel-shell-bottom-height, 44px) - 34px - 36px) * 0.7070707)
    );
  }
}

@media (max-width: 360px) {
  :root {
    --vel-shell-right-base-width: 96px !important;
    --vel-shell-right-width: 96px !important;
  }

  #velShellRight { padding: 4px !important; }
}