/* PB017 · options B (Refined Crystal) and C (vgpu glass).
   Loaded after pb005-optical/optical-pyramid.css, whose instrument chrome is reused
   unchanged. Every rule is scoped to .pb017 / .pb017r* / .pb017g*. */

/* the resting object casts nothing onto the photograph: no drop-shadow filter */
.pb017 .pb005-open__obj { filter: none; }

/* key colours follow PB005 crystal */
.pb017 .pb005-key__plate { fill: rgba(214, 222, 218, 0.1); }
.pb017 .pb005-key__ink { fill: rgba(240, 226, 15, 0.82); }

.pb017r-obj { overflow: visible; }
.pb017r-obj .pb017r-face,
.pb017r-obj .pb017r-envelope,
.pb017r-obj .pb017r-inner polygon { vector-effect: non-scaling-stroke; stroke-linejoin: round; }
.pb017r-obj .pb017r-envelope { stroke: rgba(247, 245, 240, 0.2); stroke-width: 0.8; stroke-dasharray: 1.5 3.5; }
/* DEV02.4.2: .pb017r-seam removed with its element (PB019 G-1). */
.pb017r-obj .pb017r-sheen,
.pb017r-obj .pb017r-core,
.pb017r-obj .pb017r-glow { mix-blend-mode: screen; pointer-events: none; }
.pb017r-obj.is-pickable [data-side] { cursor: pointer; }
.pb017r-obj.is-pickable { touch-action: manipulation; }
.pb005-open__obj .pb017r-obj { height: 100%; width: auto; display: block; }

/* —— C · WebGPU glass layer ——————————————————————————————————
   The canvas sits exactly over the SVG (same viewBox, same box). While the GPU
   layer is live the SVG's painted layers go transparent but stay hit-testable,
   so strata picking, focus and accessibility are the SVG's, unchanged. */
.pb017g-wrap { position: relative; display: block; height: 100%; }
.pb005-stage .pb017g-wrap { position: absolute; inset: 0; }
.pb017g-canvas {
  position: absolute; inset: 0; width: 100%; height: 100%;
  display: block; pointer-events: none;
}
.pb017g-wrap[data-gpu="live"] .pb017r-visual,
.pb017g-wrap[data-gpu="live"] .pb017r-envelope { opacity: 0; }
.pb017g-wrap:not([data-gpu="live"]) .pb017g-canvas { visibility: hidden; }

/* —— D · holographic card ——————————————————————————————————————
   Same rule: only the card's own pixels are painted (the canvas is transparent
   outside the card). The flat SVG card is the fallback when WebGPU is not live. */
.pb017[data-treatment="holo"] { --pb-size: clamp(96px, 8.4vw, 128px); }
.pb017h-wrap { position: relative; display: block; height: 100%; aspect-ratio: 0.74; }
.pb005-stage .pb017h-wrap { position: absolute; inset: 0; height: auto; aspect-ratio: auto; }
.pb017h-canvas, .pb017h-fallback { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.pb017h-canvas { pointer-events: none; }
.pb017h-wrap[data-gpu="live"] .pb017h-fallback { visibility: hidden; }
.pb017h-wrap:not([data-gpu="live"]) .pb017h-canvas { visibility: hidden; }
.pb017h-wrap.is-pickable { touch-action: manipulation; }