/* Elevation drawing, corner handles and the local orientation cube. */
.ht-board-grid-minor { fill: none; stroke: var(--grid-line); stroke-width: 1; }
.ht-board-grid-major { fill: none; stroke: var(--grid-line-major); stroke-width: 1; }
.ht-board-tier-body { fill: var(--surface-card); stroke: var(--line-strong); stroke-width: 1.4; }
.ht-board-tier-selected .ht-board-tier-body { fill: var(--surface-brand-subtle); stroke: var(--line-brand); stroke-width: 2; }
.ht-board-tier-inner { fill: none; stroke: var(--line-default); pointer-events: none; }
.ht-board-caption { fill: var(--text-secondary); font: var(--type-body-sm); }
.ht-board-partition { stroke: var(--line-strong); stroke-width: 2; }
.ht-board-partition-target { stroke: transparent; stroke-width: 44; cursor: pointer; }
.ht-board-hit { fill: transparent; stroke: none; }
.ht-board-vent { fill: var(--surface-sunken); stroke: var(--text-secondary); }
.ht-board-vent-line { stroke: var(--text-secondary); stroke-width: 1; pointer-events: none; }
.ht-board-vent-edge { fill: var(--red-500); stroke: var(--red-500); }
.ht-board-vent-hidden { fill: url(#heat-board-hidden-vent); stroke: var(--red-500); stroke-dasharray: 3 2; }
.ht-board-hatch-paper { fill: var(--red-100); }
.ht-board-hatch-line { fill: none; stroke: var(--red-500); stroke-width: .65; }
.ht-board-feature-selected { stroke: var(--line-brand); stroke-width: 2; }
.ht-board-feature { cursor: pointer; }
.ht-board-handle-mark { fill: var(--surface-card); stroke: var(--line-brand); stroke-width: 1.5; }
.ht-board-handle--nw, .ht-board-handle--se { cursor: nwse-resize; }
.ht-board-handle--ne, .ht-board-handle--sw { cursor: nesw-resize; }
.ht-board-handle:hover .ht-board-handle-mark, .ht-board-handle:focus-visible .ht-board-handle-mark { fill: var(--red-100); stroke-width: 2.5; }
.ht-board-tier:focus-visible, .ht-board-feature:focus-visible, .ht-board-handle:focus-visible { outline: 2px solid var(--red-500); outline-offset: 3px; }
.ht-board-ghost-invalid { fill: none; stroke-dasharray: 3 3; }
.ht-board-viewcube {
  position: absolute; top: var(--space-3); right: var(--space-3); width: 112px;
  border: 1px solid var(--line-default); border-radius: var(--radius-1); background: var(--surface-card);
  color: var(--text-primary); cursor: default; user-select: none;
}
.ht-board-viewcube-label {
  display: flex; align-items: center; gap: var(--space-2); justify-content: center;
  padding: var(--space-2); border-bottom: 1px solid var(--line-default);
  font: var(--type-label); letter-spacing: var(--tracking-label); text-transform: uppercase;
}
.ht-board-cube-wire { fill: none; stroke: var(--ink-500); stroke-width: 1; }
.ht-board-viewcube-faces { display: grid; grid-template-columns: 1fr 1fr; }
.ht-board-view-button {
  min-height: 44px; min-width: 44px; padding: var(--space-2); border: 0;
  background: var(--surface-card); color: var(--text-primary); cursor: pointer;
  font: var(--type-body-sm); border-bottom: 2px solid transparent;
  transition: background var(--dur-fast) var(--ease-out);
}
.ht-board-view-button:nth-child(odd) { border-right: 1px solid var(--line-default); }
.ht-board-view-button:nth-child(-n+2) { box-shadow: inset 0 -1px var(--line-default); }
.ht-board-view-button:hover { background: var(--surface-hover); }
.ht-board-view-button[aria-pressed='true'] { background: var(--surface-brand-subtle); border-bottom-color: var(--red-500); font-weight: var(--fw-semibold); }
.ht-board-view-button:focus-visible { outline: none; box-shadow: var(--focus-ring); position: relative; z-index: 1; }
.ht-board-legend {
  position: absolute; bottom: var(--space-3); left: var(--space-4); display: flex; gap: var(--space-5);
  align-items: center; flex-wrap: wrap; max-width: calc(100% - 24px); padding: var(--space-2) var(--space-3);
  border: 1px solid var(--line-default); background: var(--surface-card); border-radius: var(--radius-1);
  color: var(--text-secondary); font: var(--type-body-sm); pointer-events: auto;
}
.ht-board-legend > span { display: inline-flex; gap: var(--space-2); align-items: center; }
.ht-board-legend-hatch { display: inline-block; width: 13px; height: 11px; border: 1px dashed var(--red-500); background: var(--red-100); }
.ht-board-legend-edge { display: inline-block; width: 4px; height: 12px; background: var(--red-500); }
.ht-board-drag-readout {
  position: absolute; top: 34px; left: var(--space-5); padding: var(--space-2) var(--space-3);
  border: 1px solid var(--line-default); background: var(--surface-card); color: var(--text-primary);
  font: var(--type-mono); font-variant-numeric: tabular-nums; max-width: calc(100% - 152px);
  pointer-events: none;
}
@media (max-width: 430px) {
  .ht-board-viewcube { width: 104px; }
  .ht-board-viewcube-label { gap: 0; letter-spacing: normal; }
  .ht-board-viewcube-label svg { width: 23px; }
  .ht-board-legend { gap: var(--space-3); }
}
@media (prefers-reduced-motion: reduce) {
  .ht-board-view-button { transition: none; }
}

.ht-board-fan-ring {fill:none;stroke:var(--brand-red, #c00000);stroke-width:1.5;}
.ht-board-fan-blade {fill:var(--brand-red, #c00000);stroke:none;}

.ht-board-partition-control, .ht-board-partition-control .ht-board-partition-target { cursor: ns-resize; }

.ht-board-opening-control { cursor: move; }