/*
 * Camera markers on the Lượng and Maison floor plans. Same palette as the site:
 * navy #244b69 / white at rest, navy + gold #b08a38 when selected. Sizes are in
 * screen pixels through --u (plan units per pixel, measured by camera-markers.js).
 */
svg.cam-fixed { overflow: hidden; }

/* Rest: compact 18 px marker with a heading notch */
:is(.luong-plan .cam-fixed, svg.maison-plan.cam-fixed) a circle:not(.cam-hit) { fill: #244b69; stroke: #fff; stroke-width: calc(var(--u, 40) * 1.3); }
:is(.luong-plan .cam-fixed, svg.maison-plan.cam-fixed) a path.cam-notch { fill: #244b69; stroke: #244b69; stroke-width: calc(var(--u, 40) * .6); stroke-linejoin: round; }
:is(.luong-plan .cam-fixed, svg.maison-plan.cam-fixed) a text {
  fill: #fff; font-size: calc(var(--u, 40) * 9.5px); font-weight: 700;
  dominant-baseline: central; font-variant-numeric: tabular-nums; letter-spacing: -.03em;
}
/* Invisible 44 px touch target */
:is(.luong-plan .cam-fixed, svg.maison-plan.cam-fixed) a circle.cam-hit,
:is(.luong-plan .cam-fixed, svg.maison-plan.cam-fixed) a:hover circle.cam-hit,
:is(.luong-plan .cam-fixed, svg.maison-plan.cam-fixed) a:focus circle.cam-hit,
:is(.luong-plan .cam-fixed, svg.maison-plan.cam-fixed) a[aria-current=true] circle.cam-hit { fill: transparent !important; stroke: none !important; animation: none !important; cursor: pointer; }

/* Hover / focus match the selected look (the old brown was outside the palette). */
:is(.luong-plan .cam-fixed, svg.maison-plan.cam-fixed) a:hover circle:not(.cam-hit),
:is(.luong-plan .cam-fixed, svg.maison-plan.cam-fixed) a:focus circle:not(.cam-hit),
:is(.luong-plan .cam-fixed, svg.maison-plan.cam-fixed) a[aria-current=true] circle:not(.cam-hit) {
  fill: #244b69; stroke: #b08a38; stroke-width: calc(var(--u, 40) * 2.2);
}
:is(.luong-plan .cam-fixed, svg.maison-plan.cam-fixed) a[aria-current=true] path.cam-notch,
:is(.luong-plan .cam-fixed, svg.maison-plan.cam-fixed) a:hover path.cam-notch { fill: #b08a38; stroke: #b08a38; }
:is(.luong-plan .cam-fixed, svg.maison-plan.cam-fixed) a[aria-current=true] text { fill: #fff; }
@media (prefers-reduced-motion: no-preference) {
  :is(.luong-plan .cam-fixed, svg.maison-plan.cam-fixed) a[aria-current=true] circle:not(.cam-hit) { animation: cam-select 700ms cubic-bezier(.22, 1, .36, 1); }
}
@keyframes cam-select {
  0% { stroke-width: calc(var(--u, 40) * 5); stroke: #d5ae52; }
  55% { stroke-width: calc(var(--u, 40) * 1.8); }
  100% { stroke-width: calc(var(--u, 40) * 2.2); stroke: #b08a38; }
}

/* Field of view: only the selected camera (gold) and a hovered camera (preview). */
:is(.luong-plan, .maison-plan) .cam-cones .cam-cone { opacity: 0; stroke: none; }
:is(.luong-plan, .maison-plan) .cam-cones .cam-cone.is-hot { opacity: .5; }
:is(.luong-plan, .maison-plan) .cam-cones .cam-cone.is-active { opacity: 1; }
@media (prefers-reduced-motion: no-preference) {
  :is(.luong-plan, .maison-plan) .cam-cones .cam-cone { transition: opacity .3s cubic-bezier(.32, .72, 0, 1); }
}
:is(.luong-plan, .maison-plan) .cam-cone-stop0 { stop-color: #c9993f; stop-opacity: .62; }
:is(.luong-plan, .maison-plan) .cam-cone-stop1 { stop-color: #d5ae52; stop-opacity: .3; }
:is(.luong-plan, .maison-plan) .cam-cone-stop2 { stop-color: #d5ae52; stop-opacity: 0; }

/* Spread-apart markers keep a hairline to the true camera position. */
:is(.luong-plan, .maison-plan) .cam-leaders .cam-leader { stroke: rgba(36, 59, 75, .5); stroke-width: calc(var(--u, 40) * .9); stroke-dasharray: calc(var(--u, 40) * 2) calc(var(--u, 40) * 2); }
:is(.luong-plan, .maison-plan) .cam-leaders circle.cam-origin { fill: #244b69; stroke: none; }

/* ---------- Liquid Glass lens on hover / press ---------- */
:is(.luong-plan, .maison-plan) .cam-lens { pointer-events: none; opacity: 0; transform-box: view-box; transform: scale(.55); }
:is(.luong-plan, .maison-plan) .cam-lens.is-on { opacity: 1; transform: scale(1); }
@media (prefers-reduced-motion: no-preference) {
  :is(.luong-plan, .maison-plan) .cam-lens { transition: opacity .18s cubic-bezier(.32, .72, 0, 1), transform .5s cubic-bezier(.34, 1.56, .64, 1); }
}
:is(.luong-plan, .maison-plan) .cam-lens circle.cam-lens-paper { fill: #f7f4ed; stroke: none; }
:is(.luong-plan, .maison-plan) .cam-lens text.cam-lens-text {
  fill: #244b69; font-size: calc(var(--u, 40) * 12px); font-weight: 700; dominant-baseline: central;
  paint-order: stroke; stroke: rgba(255, 255, 255, .85); stroke-width: calc(var(--u, 40) * 2.5);
}

@media (prefers-reduced-transparency: reduce), (prefers-contrast: more) {
  :is(.luong-plan, .maison-plan) .cam-lens use { display: none; }
}
@media print { :is(.luong-plan, .maison-plan) .cam-lens { display: none; } }

/* Maison draws its direction as a line; the notch + cone replace it. */
svg.maison-plan.cam-fixed a line { display: none; }