/* Prime Creation / Optical aperture and nested diorama contract, 2026-10-13.
   One original media element and one inert optical surface. Spatial Field alone owns pose.
   The screen is the aperture; content is recessed in native Z, not separately rotated. */

body.prime-v2 #main[data-app-shell] .prime-diorama-glass-face,
body.prime-v2 #main[data-app-shell] #portfolio .page04-glass-face{
  position:absolute!important;
  inset:0!important;
  display:block!important;
  box-sizing:border-box!important;
  width:100%!important;
  height:100%!important;
  margin:0!important;
  padding:0!important;
  border-radius:inherit!important;
  pointer-events:none!important;
  user-select:none!important;
  -webkit-user-select:none!important;
  backface-visibility:visible!important;
  transform-style:preserve-3d!important;
  touch-action:none!important;
  background:
    radial-gradient(ellipse 38% 22% at var(--prime-prismatic-pose-x,52%) var(--prime-prismatic-pose-y,27%),rgba(242,253,255,.18),rgba(198,232,247,.043) 36%,transparent 76%),
    linear-gradient(155deg,rgba(247,253,255,.09),transparent 23% 77%,rgba(105,207,247,.035))!important;
  box-shadow:
    inset 0 1px 0 rgba(242,253,255,.34),
    inset 1px 0 0 rgba(195,240,255,.11),
    inset -1px 0 0 rgba(98,182,220,.09),
    inset 0 -1px 0 rgba(40,118,150,.24)!important;
  opacity:.72!important;
  filter:none!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  mix-blend-mode:screen!important;
  animation:none!important;
  transition:none!important;
  will-change:auto!important;
}

/* Real front glass, in front of every registered machine-screen content lane.
   Leave host width, height, edge skin, pose and click target exactly where they are. */
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window
[data-prime-z-screen="true"]:not([data-prime-local-scroll]):not([data-prime-child-scroll]):not([data-prime-adapter-local-scroll]){
  transform-style:preserve-3d!important;
  backface-visibility:visible!important;
}
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window
[data-prime-z-screen="true"]>.prime-diorama-glass-face{
  z-index:50!important;
  translate:0 0 1px!important;
  transform:none!important;
}

/* A rigid 3D parent must not isolate the screen's descendants into one flat paint layer.
   Exclude scrolling assemblies to preserve Safari's native scrolling behavior. */
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window
[data-prime-z-screen="true"]:not([data-prime-local-scroll]):not([data-prime-child-scroll]):not([data-prime-adapter-local-scroll]):not(.page04-work):not(.page04-work-bezel){
  isolation:auto!important;
}
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window
[data-prime-z-screen="true"] [data-prime-z-screen-content]:not([data-prime-spatial-field-child="true"]){
  transform-style:preserve-3d!important;
  backface-visibility:visible!important;
}
/* Do not let a nested typed heading/buttons cross forward through their own glass. */
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window
[data-prime-z-screen="true"] [data-prime-z-screen-content="controls"]{
  max-width:100%;
}

/* Page 04: image/media on an inset, glass on the FACE of the same rigid card.
   The original card's world pitch/yaw is inherited by both, never recomputed.
   overflow:clip clips at the real aperture without the hidden-overflow paint group. */
body.prime-v2 #main[data-app-shell] #portfolio .page04-work-bezel{
  transform-style:preserve-3d!important;
  isolation:auto!important;
  contain:none!important;
  overflow:clip!important;
  -webkit-backface-visibility:visible!important;
  backface-visibility:visible!important;
}
body.prime-v2 #main[data-app-shell] #portfolio .page04-work-bezel>.page04-glass-face{
  z-index:28!important;
  translate:0 0 1px!important;
  transform:none!important;
  border:1px solid rgba(222,249,255,.27)!important;
  background:
    radial-gradient(ellipse 40% 23% at var(--prime-prismatic-pose-x,50%) var(--prime-prismatic-pose-y,33%),rgba(250,254,255,.23),rgba(200,236,250,.065) 33%,transparent 76%),
    linear-gradient(164deg,rgba(250,253,255,.09),transparent 28% 82%,rgba(79,192,235,.048))!important;
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,.30),
    inset 0 0 0 1px rgba(169,232,250,.10),
    inset 0 -2px 7px rgba(0,12,26,.18)!important;
  opacity:.87!important;
}
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>#portfolio.app-window
.page04-work[data-prime-spatial-field-child="true"]>.page04-work-bezel>:is(img,video)[data-source]:not([data-prime-no-inset]){
  /* Local negative Z only. Never create a second pose or distort source pixels. */
  translate:0 0 -10px!important;
  transform:none!important;
  rotate:none!important;
  scale:none!important;
  backface-visibility:visible!important;
}
/* Page 04 caption ink stays above its own opaque machine surface.
   Inset belongs to the media; placing caption at -5px hid it behind the card
   on tilted mobile Safari. The label shares the card's sole world pose. */
body.prime-v2 #main[data-app-shell] #portfolio .page04-work>.page04-work-label{
  position:relative!important;
  z-index:32!important;
  pointer-events:none!important;
  backface-visibility:visible!important;
}
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>#portfolio.app-window
.page04-work>.page04-work-label{
  translate:0 0 3px!important;
  transform-style:preserve-3d!important;
}
body.prime-v2 #main[data-app-shell] #portfolio .page04-work-bezel>.page04-load-scramble{
  pointer-events:none!important;
}
/* UI panels on Page04 also become proper windows, with glass in front of labels. */
body.prime-v2 #main[data-app-shell] #portfolio
:is(.page04-gallery-topbar,.page04-room-nav button,.page04-mode-nav button,.page04-work-info)
>.prime-diorama-glass-face{
  z-index:30!important;
  opacity:.58!important;
}
/* Even outside Spatial, the gallery's glass is above media, not behind it. */
html:not([data-prime-spatial-enabled="true"])
body.prime-v2 #main[data-app-shell] #portfolio .page04-work-bezel>.page04-glass-face{
  transform:none!important;
  translate:none!important;
}
@media (forced-colors:active){
  body.prime-v2 #main[data-app-shell] :is(.prime-diorama-glass-face,.page04-glass-face){display:none!important}
}


/* PAGE02 CANONICAL MACHINE FORMULA // ALL STANDARD PANELS r8
   One original physical machine root with its native child markup, the
   inherited world pose and a single screen-local perspective. Match the
   nine Page02 service cards. No second depth-stage wrapper, clip path, CSS
   mask, paint containment, nested lens or isolated compositor.
   Bounds are provided by the actual metal bezel/front-glass hardware;
   recessed children shrink into the field of view at negative Z. */
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window:not(#top):not(#portfolio)
[data-prime-z-screen="true"]:not([data-prime-local-scroll]):not([data-prime-child-scroll]):not([data-prime-adapter-local-scroll]):not([data-prime-native-scroll-host]){
  position:relative!important;
  overflow:visible!important;
  transform-style:preserve-3d!important;
  perspective:920px!important;
  perspective-origin:50% 48%!important;
  isolation:auto!important;
  contain:none!important;
  content-visibility:visible!important;
  clip-path:none!important;
  -webkit-clip-path:none!important;
  -webkit-mask:none!important;
  mask:none!important;
  opacity:1!important;
  filter:none!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  mix-blend-mode:normal!important;
}
/* The panel surface must not paint a solid layer IN FRONT OF its negative-Z
   contents. The actual opaque material belongs to the inert rear well. */
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window:not(#top):not(#portfolio)
[data-prime-z-screen="true"][data-prime-diorama-window="direct-panel-depth"]{
  background-color:transparent!important;
  background-image:none!important;
  transform-style:preserve-3d!important;
}
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window:not(#top):not(#portfolio)
[data-prime-diorama-window="direct-panel-depth"]>[data-prime-z-screen-content]{
  transform-style:preserve-3d!important;
  backface-visibility:visible!important;
}
/* PRIME Z2 SINGLE DEPTH OWNER r30.
   Rear Z and tunnel depth MUST derive from the same property. The previous
   36px tunnel against a -184px rear left a real 148px open hole.
   Native content tiers retain their independent 5/8/11/15 staging. */
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window:not(#top):not(#portfolio)
[data-prime-z-screen="true"]{
  --prime-tunnel-rear-z:-184px;
  /* Retain the skinned inward-facing tunnel without any mirrored exterior. */
}
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window:not(#top):not(#portfolio)
[data-prime-z-screen="true"][data-prime-z-screen-level="nested"]{
  --prime-tunnel-rear-z:-174px;
}
/* Only the screen itself is the 3D owner; these are hardware/optical
   siblings, not independent viewport/pose layers. */
/* The physical well backplate is not another glass/material layer. It is a
   single unlit opaque solid behind all recessed text, buttons and media.
   Front-face glass, bezel circuitry and existing skins remain untouched. */
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window:not(#top):not(#portfolio)
[data-prime-z-screen="true"]>.prime-diorama-well-backdrop{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:inherit!important;
  /* Keep the real deep Z2 rear at -184. A continuous opaque perimeter
     closes the four wall/back-wall corners in projection, without a new
     front surface or a clip/mask on the content. Skin supplies the pigment. */
  --prime-well-seal-color:var(--pm-depth,#030b14);
  background:linear-gradient(158deg,#0c1c2a 0%,#030d18 65%,#091624 100%)!important;
  box-shadow:inset 0 0 0 2px var(--prime-well-seal-color),
    inset 0 0 0 12px color-mix(in srgb,var(--prime-well-seal-color) 68%,transparent),
    inset 0 0 38px 16px color-mix(in srgb,var(--prime-well-seal-color) 62%,transparent)!important;
  translate:0 0 var(--prime-tunnel-rear-z,-184px)!important;
  transform:none!important;
  opacity:1!important;
  isolation:auto!important;
  filter:none!important;
  mix-blend-mode:normal!important;
  pointer-events:none!important;
  user-select:none!important;
  -webkit-user-select:none!important;
  /* Z-3 is a ONE-SIDED interior rear wall. Its exterior face is forbidden;
     showing both sides made the space behind the screen visible at tilt. */
  -webkit-backface-visibility:hidden!important;
  backface-visibility:hidden!important;
  z-index:0!important;
}
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window:not(#top):not(#portfolio)
[data-prime-z-screen="true"][data-prime-z-screen-level="nested"]>.prime-diorama-well-backdrop{
  translate:0 0 var(--prime-tunnel-rear-z,-174px)!important;
}
/* Z2 TRUE VOLUME r30: content lanes remain -24..-156px, wall at -184px,
   four continuous side surfaces physically meet it. Projected-quad scissor,
   not physically amputating the cavity, prevents outside black fins. */
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window:not(#top):not(#portfolio):not(#book)
[data-prime-z-screen="true"]>.prime-diorama-well-backdrop{
  /* The former 123% rear surface canceled perspective foreshortening and
     projected OUTSIDE tilted iPhone screen openings. A true 1:1 rear plane
     meets the full-depth tunnel in local coordinates, without overscan. */
  scale:1!important;
  transform-origin:50% 50%!important;
}
/* Preserve native in-panel scrolling when explicitly authored. */
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window:not(#top):not(#portfolio)
[data-prime-z-screen="true"]:is([data-prime-local-scroll],[data-prime-child-scroll],[data-prime-adapter-local-scroll],[data-prime-native-scroll-host]){
  overflow-x:hidden!important;
  overflow-y:auto!important;
  overscroll-behavior:contain;
}
/* The physical cover glass is still above the text and remains entirely
   pointer-transparent, while the panel ink prevents shared motion showing
   through transparent areas of its existing material gradients. */
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window
[data-prime-z-screen="true"]>.prime-diorama-glass-face{
  pointer-events:none!important;
}

/* Do not let the old 7px physical rear paint plane hide content at tier 15.
   The real opaque diorama rear is at -184. Metal sidewalls remain unchanged. */
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window:not(#top):not(#portfolio)
[data-prime-z-screen="true"]>.prime-spatial-thickness>.prime-machine-rear-plane{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}

/* PERIMETER OPTICS r8: keep original glass on the machine front, and
   use existing rim/hardware geometry rather than clipping an extra wrapper.
   Leaf surfaces alone can be masked/filtered, never their 3D ancestors. */
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window:not(#top):not(#portfolio)
[data-prime-diorama-window="direct-panel-depth"]>.prime-diorama-glass-face{
  pointer-events:none!important;
  translate:0 0 1px!important;
  transform:none!important;
  box-shadow:inset 0 0 0 2px rgba(12,31,45,.86),inset 0 0 9px rgba(0,3,10,.58)!important;
}

/* PRIME BLUE DIORAMA EDGE r9
   A visible optical boundary, not the retired .prime-diorama-aperture
   wrapper. This is one inert span on the front glass plane. Nothing here
   masks the 3D root, groups children or creates a second camera.
   The aperture culler uses this exact element's transformed rectangle. */
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window:not(#top)
[data-prime-z-screen="true"]>.prime-diorama-edge{
  position:absolute!important;
  inset:clamp(2.5px,.575vw,5.5px)!important;
  box-sizing:border-box!important;
  display:block!important;
  width:auto!important;
  height:auto!important;
  margin:0!important;
  padding:0!important;
  border:.5px solid rgba(101,213,247,.48)!important;
  border-radius:clamp(5px,.9vw,12px)!important;
  background:transparent!important;
  box-shadow:
    inset 0 0 0 1px rgba(7,33,52,.56),
    inset 0 0 7px rgba(64,178,221,.11),
    0 0 0 1px rgba(5,24,39,.55),
    0 0 9px rgba(58,182,236,.13)!important;
  opacity:.86!important;
  transform:none!important;
  translate:0 0 .65px!important;
  transform-style:preserve-3d!important;
  backface-visibility:visible!important;
  pointer-events:none!important;
  user-select:none!important;
  touch-action:none!important;
  isolation:auto!important;
  contain:none!important;
  overflow:visible!important;
  filter:none!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  mix-blend-mode:normal!important;
  animation:none!important;
  transition:none!important;
  z-index:49!important;
}
html:not([data-prime-spatial-enabled="true"])
body.prime-v2 #main[data-app-shell] .prime-diorama-edge,
html:not([data-prime-spatial-system-enabled="true"])
body.prime-v2 #main[data-app-shell] .prime-diorama-edge{
  display:none!important;
}
@media(forced-colors:active){
  body.prime-v2 #main[data-app-shell] .prime-diorama-edge{display:none!important}
}


/* PRIME PHOSPHOR GLASS r1 // emitted screen light + pixel-scan optics
   Existing glass and perimeter edge are the ONLY paint hosts.
   Scanline and pixel texture are on an inert sibling of the actual content.
   No mask, transform, isolation or paint containment on the machine itself. */
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]{
  --prime-phosphor-outer:rgba(111,208,246,.13);
  --prime-phosphor-edge:rgba(172,229,250,.105);
  --prime-phosphor-line:rgba(194,232,246,.135);
  --prime-phosphor-pixel:rgba(135,225,255,.075);
}
html[data-prime-skin="steampunk"][data-prime-spatial-enabled="true"],
html[data-prime-skin="liquid-gold"][data-prime-spatial-enabled="true"]{
  --prime-phosphor-outer:rgba(255,207,130,.12);
  --prime-phosphor-edge:rgba(255,228,176,.095);
  --prime-phosphor-line:rgba(255,234,198,.108);
  --prime-phosphor-pixel:rgba(255,222,156,.060);
}
/* A halo escapes the display face into the bezel and neighboring air.
   The front edge travels with the original 3D panel, no second camera. */
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window.is-prime-viewport-active:not(#top):not(#portfolio)
[data-prime-z-screen="true"]>.prime-diorama-edge::before{
  content:""!important;
  position:absolute!important;
  inset:-4px!important;
  border-radius:inherit!important;
  pointer-events:none!important;
  display:block!important;
  background:radial-gradient(ellipse 80% 70% at 50% 50%,transparent 59%,var(--prime-phosphor-edge,rgba(172,229,250,.105)) 87%,transparent 100%)!important;
  box-shadow:0 0 17px 3px var(--prime-phosphor-outer,rgba(111,208,246,.13)),
    0 0 4px 1px var(--prime-phosphor-edge,rgba(172,229,250,.105)),
    inset 0 0 9px var(--prime-phosphor-edge,rgba(172,229,250,.105))!important;
  opacity:.78!important;
  filter:none!important;
  transform:none!important;
  animation:none!important;
}
/* The glass is an inert optical surface. Its own overflow clips ONLY
   phosphor paint, never an image, button, foil or negative-Z descendant. */
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window.is-prime-viewport-active:not(#top):not(#portfolio)
[data-prime-z-screen="true"]>.prime-diorama-glass-face{
  overflow:hidden!important;
}
/* Sub-pixel horizontal phosphor rows; no visible white wash. */
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window.is-prime-viewport-active:not(#top):not(#portfolio)
[data-prime-z-screen="true"]>.prime-diorama-glass-face::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  display:block!important;
  border-radius:inherit!important;
  pointer-events:none!important;
  background:repeating-linear-gradient(180deg,
    transparent 0 3px,
    var(--prime-phosphor-line,rgba(194,232,246,.060)) 3px 3.6px,
    transparent 3.6px 6px)!important;
  opacity:.52!important;
  mix-blend-mode:normal!important;
  transform:none!important;
  animation:none!important;
}
/* Pixel resolution glitch: sparse checker cells in one narrow scanning
   slit, never actual media downsampling. Reduces resource cost vs shaders. */
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window.is-prime-viewport-active:not(#top):not(#portfolio)
[data-prime-z-screen="true"]>.prime-diorama-glass-face::after{
  content:""!important;
  position:absolute!important;
  left:0!important;
  right:0!important;
  top:-22%!important;
  height:17%!important;
  border-radius:0!important;
  display:block!important;
  pointer-events:none!important;
  background:
    repeating-linear-gradient(90deg,transparent 0 11px,var(--prime-phosphor-pixel,rgba(135,225,255,.075)) 11px 14px,transparent 14px 23px),
    repeating-linear-gradient(0deg,transparent 0 7px,var(--prime-phosphor-pixel,rgba(135,225,255,.075)) 7px 9px,transparent 9px 16px),
    linear-gradient(180deg,transparent,rgba(198,235,252,.10) 44%,transparent)!important;
  background-blend-mode:multiply,screen,normal!important;
  opacity:.64!important;
  transform:translate3d(0,0,0)!important;
  animation:prime-phosphor-pixel-sweep 15s steps(16,end) infinite!important;
  filter:none!important;
  mix-blend-mode:normal!important;
}
@keyframes prime-phosphor-pixel-sweep{
  0%,12%{transform:translate3d(0,0,0)}
  72%,100%{transform:translate3d(0,690%,0)}
}
/* The cover's image and foil remain coplanar at Z-2; the overlay belongs
   exclusively to front glass Z+1. Tone it down for collectible cover art. */
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>#book.app-window
.pc-book-mark.pc-book-cover>.prime-diorama-glass-face::before{opacity:.30!important}
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>#book.app-window
.pc-book-mark.pc-book-cover>.prime-diorama-glass-face::after{opacity:.34!important}
/* Safely degrade on older phones and for reduced-motion users. */
html:is([data-prime-performance-mode="light"],[data-prime-resource-tier="low"],[data-pc-hw-tier="low"],[data-prime-runtime-pressure="high"])
body.prime-v2 .prime-diorama-glass-face::after{
  animation:none!important;
  opacity:.12!important;
}
@media (prefers-reduced-motion:reduce){
  html[data-prime-spatial-enabled="true"] body.prime-v2 .prime-diorama-glass-face::after{
    animation:none!important;
    opacity:.12!important;
  }
}
@media (forced-colors:active){
  body.prime-v2 .prime-diorama-glass-face::before,
  body.prime-v2 .prime-diorama-glass-face::after,
  body.prime-v2 .prime-diorama-edge::before{display:none!important}
}

/* PRIME Z-TUNNEL OCCLUSION r1 // secondary wall geometry.
   Existing projected leaf scissor remains authoritative at the glass. The
   four sidewalls intercept genuinely projected pixels leaving the tunnel.
   No clip-path/mask/overflow/contain on an actual 3D machine ancestor. */
body.prime-v2 #main[data-app-shell] .prime-tunnel-wall{
  display:none!important;
  pointer-events:none!important;
  user-select:none!important;
  box-sizing:border-box!important;
  border:0!important;
  border-radius:0!important;
  margin:0!important;
  padding:0!important;
  opacity:1!important;
  /* The authored face points into the cavity. Never paint the inner skin
     on the exterior. The chrome coating is a separate reversed ::after face
     and inherits this wall's exact projected aperture clip. */
  -webkit-backface-visibility:hidden!important;
  backface-visibility:hidden!important;
  transform-style:preserve-3d!important;
  filter:none!important;
  isolation:auto!important;
  will-change:auto!important;
}
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window:not(#top):not(#portfolio)
[data-prime-z-screen="true"]>.prime-tunnel-wall{
  --prime-tunnel-inset:clamp(2.5px,.575vw,5.5px);
  --prime-tunnel-depth:calc(var(--prime-tunnel-join,3px) - var(--prime-tunnel-rear-z,-184px));
  --prime-tunnel-join:3px;
  /* Restore the original inward-facing, dark skinned Z2 chamber. */
  position:absolute!important;
  display:block!important;
  z-index:3!important;
  background:linear-gradient(125deg,
    rgba(6,18,28,.99) 0%,rgba(18,38,52,.99) 34%,
    rgba(3,9,17,.995) 74%,rgba(2,8,15,.99) 100%)!important;
  box-shadow:inset 0 1px 0 rgba(140,226,250,.15),
    inset 0 -1px 0 rgba(2,5,10,.95)!important;
}
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window:not(#top):not(#portfolio)
[data-prime-z-screen="true"]>.prime-tunnel-wall-left{
  left:var(--prime-tunnel-inset)!important;
  top:calc(var(--prime-tunnel-inset) - var(--prime-tunnel-join))!important;
  width:var(--prime-tunnel-depth)!important;
  height:calc(100% - var(--prime-tunnel-inset) - var(--prime-tunnel-inset) + var(--prime-tunnel-join) + var(--prime-tunnel-join))!important;
  transform-origin:0 50%!important;
  transform:rotateY(90deg)!important;
}
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window:not(#top):not(#portfolio)
[data-prime-z-screen="true"]>.prime-tunnel-wall-right{
  right:var(--prime-tunnel-inset)!important;
  top:calc(var(--prime-tunnel-inset) - var(--prime-tunnel-join))!important;
  width:var(--prime-tunnel-depth)!important;
  height:calc(100% - var(--prime-tunnel-inset) - var(--prime-tunnel-inset) + var(--prime-tunnel-join) + var(--prime-tunnel-join))!important;
  transform-origin:100% 50%!important;
  transform:rotateY(-90deg)!important;
}
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window:not(#top):not(#portfolio)
[data-prime-z-screen="true"]>.prime-tunnel-wall-top{
  top:var(--prime-tunnel-inset)!important;
  left:calc(var(--prime-tunnel-inset) - var(--prime-tunnel-join))!important;
  height:var(--prime-tunnel-depth)!important;
  width:calc(100% - var(--prime-tunnel-inset) - var(--prime-tunnel-inset) + var(--prime-tunnel-join) + var(--prime-tunnel-join))!important;
  transform-origin:50% 0!important;
  transform:rotateX(-90deg)!important;
}
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window:not(#top):not(#portfolio)
[data-prime-z-screen="true"]>.prime-tunnel-wall-bottom{
  bottom:var(--prime-tunnel-inset)!important;
  left:calc(var(--prime-tunnel-inset) - var(--prime-tunnel-join))!important;
  height:var(--prime-tunnel-depth)!important;
  width:calc(100% - var(--prime-tunnel-inset) - var(--prime-tunnel-inset) + var(--prime-tunnel-join) + var(--prime-tunnel-join))!important;
  transform-origin:50% 100%!important;
  transform:rotateX(90deg)!important;
}
/* PRIME Z2 EXTERIOR CHROME REMOVAL r35
   No silver mirrored backcoat may paint outside the display opening.
   The original skinned inner tunnel wall, its thickness, side geometry,
   backface culling and Z3 rear seal remain unchanged. */
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window:not(#top):not(#portfolio)
[data-prime-z-screen="true"]>.prime-tunnel-wall::after{
  content:none!important;
  display:none!important;
  background:none!important;
}
/* CONTINUOUS Z2 CORNER SEAL r30: four connected 90-degree walls extend to
   EXACTLY the rear Z+3px overlap and one another with 3px corner overlaps.
   Per-wall projected scissor masks the outboard 3D wedges in Safari.
   Do not clamp to 36px: it physically opens the interior again. */
/* At the glass, the actual bezel remains the visible source of truth; the
   tunnel starts just behind that optical rim and stops beyond tier 15. */

/* PRIME EXTERNAL HALO + MICROFLICKER r3
   This element is a direct inert SIBLING of glass, not a clipped child.
   All optical paint emanates outward; never creates a compositor for the
   original machine, its image, scroll controls or recessed Z tiers.
   Shadow blur is a single static material. Tiny particles are CSS sprites,
   NOT a canvas/WebGL engine or repeated JS motion measurements. */
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]{
  --prime-halo-core:rgba(153,237,255,.052);
  --prime-halo-wash:rgba(81,201,255,.064);
  --prime-halo-distance:rgba(46,155,235,.023);
  --prime-halo-spark:rgba(223,251,255,.25);
}
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"][data-prime-skin="steampunk"],
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"][data-prime-skin="liquid-gold"]{
  --prime-halo-core:rgba(255,230,172,.050);
  --prime-halo-wash:rgba(255,202,117,.058);
  --prime-halo-distance:rgba(235,147,64,.021);
  --prime-halo-spark:rgba(255,247,221,.24);
}
body.prime-v2 #main[data-app-shell] .prime-screen-halo{
  display:none!important;
  pointer-events:none!important;
  user-select:none!important;
  touch-action:none!important;
  border:0!important;
  padding:0!important;
  margin:0!important;
}
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window.is-prime-viewport-active:not(#top):not(#portfolio)
[data-prime-z-screen="true"]>.prime-screen-halo{
  display:block!important;
  position:absolute!important;
  inset:-6px!important;
  width:auto!important;
  height:auto!important;
  box-sizing:border-box!important;
  z-index:48!important;
  translate:0 0 1.4px!important;
  transform:none!important;
  rotate:none!important;
  border-radius:inherit!important;
  background:radial-gradient(ellipse 72% 67% at 50% 50%,
    transparent 53%,rgba(139,220,252,.025) 65%,
    var(--prime-halo-core,rgba(153,237,255,.052)) 82%,transparent 100%)!important;
  box-shadow:
    0 0 12px 2px var(--prime-halo-wash,rgba(81,201,255,.064)),
    0 0 25px 4px var(--prime-halo-distance,rgba(46,155,235,.023)),
    inset 0 0 7px 1px var(--prime-halo-core,rgba(153,237,255,.052))!important;
  opacity:.45!important;
  filter:none!important;
  isolation:auto!important;
  contain:none!important;
  overflow:visible!important;
  mix-blend-mode:normal!important;
  backface-visibility:visible!important;
  /* 50Hz microflicker, halo brightness varies by under 4 percentage points. */
  animation:prime-halo-microflicker .12s steps(6,end) infinite!important;
}
/* Three-axis lens flare: soft central flash, a thin cross, diagonal rays.
   Radial fade applies solely to its optical sprite, not to the 3D machine. */
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window.is-prime-viewport-active:not(#top):not(#portfolio)
[data-prime-z-screen="true"]>.prime-screen-halo::before{
  content:""!important;
  position:absolute!important;
  width:130px!important;
  height:130px!important;
  left:calc(76% - 65px)!important;
  top:calc(17% - 65px)!important;
  pointer-events:none!important;
  border:0!important;
  background:
    radial-gradient(circle at 50% 50%,var(--prime-halo-spark,rgba(223,251,255,.88)) 0 1px,
      rgba(189,234,255,.43) 3px,transparent 15px),
    linear-gradient(90deg,transparent 0,rgba(177,230,255,.015) 21%,
      rgba(218,246,255,.37) 49.5%,rgba(218,246,255,.37) 50.5%,
      rgba(177,230,255,.015) 79%,transparent 100%),
    linear-gradient(0deg,transparent 0,rgba(176,227,250,.015) 27%,
      rgba(226,247,255,.26) 49.4%,rgba(226,247,255,.26) 50.6%,
      rgba(176,227,250,.015) 73%,transparent 100%),
    linear-gradient(45deg,transparent 0,rgba(221,246,255,.20) 49.6%,
      rgba(221,246,255,.20) 50.4%,transparent 100%)!important;
  -webkit-mask-image:radial-gradient(circle at center,#000 0 7%,rgba(0,0,0,.55) 22%,transparent 65%)!important;
  mask-image:radial-gradient(circle at center,#000 0 7%,rgba(0,0,0,.55) 22%,transparent 65%)!important;
  opacity:.11!important;
  filter:none!important;
  animation:none!important;
}
/* Ten tiny phosphor motes follow screen pose without a separate particle
   renderer. One background, one low-rate transform+opacity animation. */
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window.is-prime-viewport-active:not(#top):not(#portfolio)
[data-prime-z-screen="true"]>.prime-screen-halo::after{
  content:""!important;
  position:absolute!important;
  inset:-12px!important;
  border-radius:inherit!important;
  pointer-events:none!important;
  background:
    radial-gradient(circle at 12% 15%,var(--prime-halo-spark) 0 1px,transparent 3px),
    radial-gradient(circle at 37% 6%,var(--prime-halo-spark) 0 .7px,transparent 2px),
    radial-gradient(circle at 66% 10%,var(--prime-halo-spark) 0 .9px,transparent 3px),
    radial-gradient(circle at 94% 24%,var(--prime-halo-spark) 0 1px,transparent 3px),
    radial-gradient(circle at 98% 67%,var(--prime-halo-spark) 0 .8px,transparent 2px),
    radial-gradient(circle at 83% 92%,var(--prime-halo-spark) 0 .9px,transparent 3px),
    radial-gradient(circle at 52% 97%,var(--prime-halo-spark) 0 .8px,transparent 3px),
    radial-gradient(circle at 18% 91%,var(--prime-halo-spark) 0 .7px,transparent 2px),
    radial-gradient(circle at 5% 65%,var(--prime-halo-spark) 0 1px,transparent 3px),
    radial-gradient(circle at 7% 38%,var(--prime-halo-spark) 0 .7px,transparent 2px)!important;
  opacity:.13!important;
  transform:translate3d(0,0,0)!important;
  animation:prime-halo-sprite-drift 12s ease-in-out infinite alternate!important;
  filter:none!important;
}
@keyframes prime-halo-microflicker{
  0%,100%{opacity:.44}
  16%{opacity:.46}
  33%{opacity:.45}
  50%{opacity:.47}
  66%{opacity:.44}
  83%{opacity:.46}
}
@keyframes prime-halo-sprite-drift{
  0%{transform:translate3d(0,0,0);opacity:.055}
  35%{opacity:.14}
  65%{opacity:.075}
  100%{transform:translate3d(0,-3px,0);opacity:.15}
}
/* The Actuator cover is a compact collector, not an enlarged light box.
   Preserve the cover photo and both foils at Z-2, backing at Z-3. */
html[data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>#book.app-window
.pc-book-mark.pc-book-cover>.prime-screen-halo{
  --prime-halo-wash:rgba(92,201,243,.045);
  --prime-halo-distance:rgba(56,153,225,.018);
}
html:is([data-prime-performance-mode="light"],[data-prime-resource-tier="low"],[data-pc-hw-tier="low"],[data-prime-runtime-pressure="high"])
body.prime-v2 .prime-screen-halo{
  animation:none!important;
  opacity:.43!important;
}
html:is([data-prime-performance-mode="light"],[data-prime-resource-tier="low"],[data-pc-hw-tier="low"],[data-prime-runtime-pressure="high"])
body.prime-v2 .prime-screen-halo::after{
  animation:none!important;
  opacity:.08!important;
}
@media (prefers-reduced-motion:reduce){
  html body.prime-v2 .prime-screen-halo::after{animation:none!important;opacity:.08!important}
  html body.prime-v2 .prime-screen-halo{animation:none!important;opacity:.45!important}
}
@media (forced-colors:active){
  html body.prime-v2 .prime-screen-halo{display:none!important}
}

/* PRIME OPTICAL VISIBILITY POLISH r4
   Keep the iPhone compositor free of particle and 50Hz glow updates for
   off-viewport panels. The IntersectionObserver only marks screen visibility.
   Never clips the physical screen, media, or its negative-Z content. */
html[data-prime-spatial-enabled="true"] body.prime-v2 #main[data-app-shell]
[data-prime-z-screen="true"][data-prime-optic-visible="false"]>.prime-screen-halo{
  visibility:hidden!important;
  animation-play-state:paused!important;
}
html[data-prime-spatial-enabled="true"] body.prime-v2 #main[data-app-shell]
[data-prime-z-screen="true"][data-prime-optic-visible="false"]>.prime-screen-halo::after,
html[data-prime-spatial-enabled="true"] body.prime-v2 #main[data-app-shell]
[data-prime-z-screen="true"][data-prime-optic-visible="false"]>.prime-diorama-glass-face::after{
  animation-play-state:paused!important;
}
/* Avoid needless pixel-sweep redraw during rapid changes in device
   pressure. Preserve static light, crystal materials and screen content. */
html[data-prime-runtime-pressure="high"] body.prime-v2 #main[data-app-shell]
[data-prime-z-screen="true"]>.prime-diorama-glass-face::after{
  animation:none!important;
  opacity:.12!important;
}

/* PRIME STOREFRONT SCAN GLASS // spatial machine screens r20
   Identical six-pixel CRT ink and the same 8.5-second downward optical sweep
   as .prime-storefront-visual > .prime-storefront-scan. The existing GLASS
   face owns both pseudos, inherits its rigid parent's Spatial pose and Z+1,
   and alone clips to the bezel contour. No wrapper, camera or media filters. */
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window.is-prime-viewport-active:not(#top):not(#portfolio)
[data-prime-z-screen="true"]>.prime-diorama-glass-face::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset:0!important;
  border-radius:inherit!important;
  pointer-events:none!important;
  opacity:.70!important;
  background:repeating-linear-gradient(
    180deg,
    rgba(169,237,250,.15) 0,
    rgba(169,237,250,.15) 1px,
    rgba(0,0,0,.20) 1px,
    rgba(0,0,0,.20) 3px,
    transparent 3px,
    transparent 6px
  )!important;
  filter:none!important;
  mix-blend-mode:normal!important;
  transform:none!important;
  animation:none!important;
}
/* Storefront scan beam stays ON the front glass. A faint small-cell signal
   artifact preserves the established pixel glitch at nearly zero extra cost,
   without altering the storefront's CRT row spacing or creating new paint DOM. */
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window.is-prime-viewport-active:not(#top):not(#portfolio)
[data-prime-z-screen="true"]>.prime-diorama-glass-face::after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  left:0!important;
  right:0!important;
  top:-42%!important;
  height:32%!important;
  border:0!important;
  border-radius:0!important;
  pointer-events:none!important;
  opacity:.72!important;
  background:
    linear-gradient(180deg,
      transparent,
      rgba(133,231,251,.04) 32%,
      rgba(197,244,255,.23) 47%,
      rgba(228,252,255,.31) 50%,
      rgba(129,226,247,.07) 57%,
      transparent),
    conic-gradient(from 90deg,
      rgba(149,232,255,.034) 0 25%,
      transparent 0 50%,
      rgba(127,211,245,.026) 0 75%,
      transparent 0) 0 0 / 18px 14px!important;
  background-blend-mode:screen,screen!important;
  box-shadow:none!important;
  filter:none!important;
  mix-blend-mode:normal!important;
  transform:translate3d(0,0,0)!important;
  animation:prime-storefront-window-scan-on-glass 8.5s linear infinite!important;
  animation-play-state:running!important;
  /* Avoid preallocating a GPU layer for panels Safari has not shown. */
  will-change:auto!important;
}
/* Exact Storefront window beam geometry. The whole scan band covers the
   visible glass before restarting regardless of panel aspect ratio. */
@keyframes prime-storefront-window-scan-on-glass{
  from{transform:translate3d(0,0,0)}
  to{transform:translate3d(0,470%,0)}
}
/* The cover is art behind Z+1 glass, not an RGB test pattern. */
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>#book.app-window
.pc-book-mark.pc-book-cover>.prime-diorama-glass-face::before{opacity:.20!important}
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>#book.app-window
.pc-book-mark.pc-book-cover>.prime-diorama-glass-face::after{opacity:.085!important}
/* Keep the storefront scan live in Spatial's ordinary/light/pressure modes.
   Forced data conservation remains an intentional user preference. */
html.pc-save-data body.prime-v2 .prime-diorama-glass-face::after{
  animation:none!important;
  opacity:.07!important;
}
@media(prefers-reduced-motion:reduce){
  html[data-prime-spatial-enabled="true"] body.prime-v2 .prime-diorama-glass-face::after{
    animation:none!important;
    opacity:.07!important;
  }
}
@media(forced-colors:active){
  body.prime-v2 .prime-diorama-glass-face::before,
  body.prime-v2 .prime-diorama-glass-face::after{display:none!important}
}

/* SCROLL CONTINUITY r22. Moving halos, glass scans and Spatial material
   lighting keep playing during native scroll. Their normal visibility,
   accessibility and genuine thermal/resource policy still apply. */

/* MACHINE SCAN GOVERNOR r21 // preserve the light beam under Spatial load.
   Runtime pressure slows the compositor travel rather than removing it.
   Save Data and accessibility preferences still stop nonessential animation. */
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"].pc-save-data
body.prime-v2 #main[data-app-shell]>.app-window.is-prime-viewport-active:not(#top):not(#portfolio)
[data-prime-z-screen="true"]>.prime-diorama-glass-face::after{
  animation:none!important;
  will-change:auto!important;
  opacity:0!important;
}
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"][data-prime-runtime-pressure="high"]
body.prime-v2 #main[data-app-shell]>.app-window.is-prime-viewport-active:not(#top):not(#portfolio)
[data-prime-z-screen="true"]>.prime-diorama-glass-face::after{
  animation-duration:12s!important;
  opacity:.60!important;
  will-change:auto!important;
}
@media(prefers-reduced-motion:reduce){
  html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
  body.prime-v2 #main[data-app-shell]>.app-window.is-prime-viewport-active:not(#top):not(#portfolio)
  [data-prime-z-screen="true"]>.prime-diorama-glass-face::after{
    animation:none!important;
    opacity:0!important;
  }
}
@media(forced-colors:active){
  html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
  body.prime-v2 #main[data-app-shell]>.app-window.is-prime-viewport-active:not(#top):not(#portfolio)
  [data-prime-z-screen="true"]>.prime-diorama-glass-face::before,
  html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
  body.prime-v2 #main[data-app-shell]>.app-window.is-prime-viewport-active:not(#top):not(#portfolio)
  [data-prime-z-screen="true"]>.prime-diorama-glass-face::after{
    display:none!important;
  }
}

/* MACHINE SCAN VISIBILITY CONTRACT r21 // visibility, not scroll velocity.
   Pseudo ink stays in the GLASS plane of its original 3D rigid panel. */
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window.is-prime-viewport-active:not(#top):not(#portfolio)
[data-prime-z-screen="true"][data-prime-optic-visible="false"]>.prime-diorama-glass-face::after{
  animation-play-state:paused!important;
}
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]:not([data-prime-runtime-pressure="high"]):not(.pc-save-data)
body.prime-v2 #main[data-app-shell]>.app-window.is-prime-viewport-active:not(#top):not(#portfolio)
[data-prime-z-screen="true"][data-prime-optic-visible="true"]>.prime-diorama-glass-face::after{
  will-change:transform!important;
}

/* PRIME HALF-THICKNESS OPTICAL TUBE r10.
   Inset/edge paint is half the legacy profile. The same DOM aperture and
   projection geometry are retained, so the glass mask follows the new lip. */
/* PRIME CONTOUR-CYAN BEZEL r9.
   The inset screen rail uses its REAL parent corner shape, not a fixed
   5-12px radius that leaves straight cyan bars at rounded corners.
   Multiple low-opacity static insets sharpen the metal/glass response without
   introducing blur, masks, extra layers, or a second Spatial pose. */
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window.is-prime-viewport-active:not(#top):not(#portfolio)
[data-prime-z-screen="true"]>.prime-diorama-edge{
  border-radius:inherit!important;
  /* Skin-dependent polished tubing, painted on the same existing edge. */
  border-color:color-mix(in srgb,var(--pm-hw-blade,var(--pm-rim,rgba(142,225,250,.57))) 74%,transparent)!important;
  box-shadow:
    inset 0 0 0 .5px color-mix(in srgb,var(--pm-hw-gasket,var(--pm-depth,#071d2f)) 64%,transparent),
    inset 0 0 0 1px color-mix(in srgb,var(--pm-hw-blade,var(--pm-rim,#71ddfe)) 26%,transparent),
    inset 0 0 4px color-mix(in srgb,var(--pm-glint,#3bb7ef) 16%,transparent),
    0 0 0 .5px color-mix(in srgb,var(--pm-hw-gasket,var(--pm-depth,#011423)) 65%,transparent),
    0 0 4px color-mix(in srgb,var(--pm-glint,#56cfff) 17%,transparent)!important;
}
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window.is-prime-viewport-active:not(#top):not(#portfolio)
[data-prime-z-screen="true"]>.prime-diorama-glass-face{
  border-radius:inherit!important;
  /* The narrow blue reflection tracks the same physical glass arc. */
  box-shadow:
    inset 0 1px 0 rgba(245,254,255,.40),
    inset 1px 0 0 rgba(130,230,255,.28),
    inset 0 0 0 1px rgba(170,237,255,.11),
    inset 0 0 0 2px rgba(105,215,252,.042),
    inset 0 0 16px rgba(93,200,248,.068),
    inset 0 -1px 0 rgba(38,127,166,.23)!important;
}

/* PRIME SCAN COMPOSITOR LEASE r21 // offscreen faces cost no GPU layers.
   A paused animation does not automatically relinquish will-change memory.
   Keep the colored CRT lattice and bezel material fully painted; only the
   traveling beam's GPU-promotion hint is revoked outside the viewport. */
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window.is-prime-viewport-active:not(#top):not(#portfolio)
[data-prime-z-screen="true"][data-prime-optic-visible="false"]>.prime-diorama-glass-face::after,
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]:is(
  [data-prime-runtime-pressure="high"],.pc-save-data)
body.prime-v2 #main[data-app-shell]>.app-window.is-prime-viewport-active:not(#top):not(#portfolio)
[data-prime-z-screen="true"]>.prime-diorama-glass-face::after{
  will-change:auto!important;
}

/* PRIME MACHINE SCREEN SPECULAR | polished-glass r1 | 2026-10-14 */
/* The machine's existing real glass face (Z +1) owns the reflection, not
   the screen content or its transform parent. A tighter elliptical hot spot
   gives a deliberate specular peak instead of the former broad gray haze.
   No new element, raster, mask, shader pass, event handler or filter. */
html[data-prime-skin]{
  --prime-screen-specular-core:rgba(249,254,255,.84);
  --prime-screen-specular-shoulder:rgba(206,244,255,.44);
  --prime-screen-specular-feather:rgba(163,226,252,.12);
  --prime-screen-specular-cut:rgba(246,253,255,.66);
  --prime-screen-specular-rail:rgba(181,229,251,.26);
}
html[data-prime-skin="glass"]{
  --prime-screen-specular-core:rgba(255,255,255,.92);
  --prime-screen-specular-shoulder:rgba(226,251,255,.56);
  --prime-screen-specular-feather:rgba(167,236,255,.16);
  --prime-screen-specular-cut:rgba(255,255,255,.81);
  --prime-screen-specular-rail:rgba(204,246,255,.35);
}
html[data-prime-skin="nexus"]{
  --prime-screen-specular-core:rgba(233,251,255,.77);
  --prime-screen-specular-shoulder:rgba(159,233,255,.43);
  --prime-screen-specular-feather:rgba(98,218,255,.13);
  --prime-screen-specular-cut:rgba(227,251,255,.63);
}
html[data-prime-skin="steampunk"]{
  --prime-screen-specular-core:rgba(255,248,223,.81);
  --prime-screen-specular-shoulder:rgba(255,226,178,.42);
  --prime-screen-specular-feather:rgba(245,187,112,.11);
  --prime-screen-specular-cut:rgba(255,243,210,.67);
  --prime-screen-specular-rail:rgba(229,180,107,.25);
}
html[data-prime-skin="liquid-gold"]{
  --prime-screen-specular-core:rgba(255,255,236,.86);
  --prime-screen-specular-shoulder:rgba(255,242,189,.49);
  --prime-screen-specular-feather:rgba(250,209,122,.14);
  --prime-screen-specular-cut:rgba(255,249,224,.75);
  --prime-screen-specular-rail:rgba(246,219,152,.28);
}
html[data-prime-spatial-system-enabled="true"][data-prime-spatial-enabled="true"]
body.prime-v2 #main[data-app-shell]>.app-window.is-prime-viewport-active:not(#top):not(#portfolio)
[data-prime-machine-panel="true"][data-prime-z-screen="true"]:not(.pc-book-cover)>.prime-diorama-glass-face{
  /* Narrow moving specular: bright center, fast falloff and thin softbox
     shoulder. The transparent balance keeps all authored content visible. */
  background:
    radial-gradient(ellipse 12% 5% at var(--prime-prismatic-pose-x,52%) var(--prime-prismatic-pose-y,27%),
      var(--prime-screen-specular-core) 0%,var(--prime-screen-specular-shoulder) 18%,
      var(--prime-screen-specular-feather) 42%,transparent 74%),
    radial-gradient(ellipse 28% 9% at var(--prime-prismatic-pose-x,52%) var(--prime-prismatic-pose-y,27%),
      var(--prime-screen-specular-shoulder) 0%,var(--prime-screen-specular-feather) 37%,transparent 84%),
    linear-gradient(164deg,rgba(247,253,255,.085),transparent 20% 82%,rgba(126,211,249,.038))!important;
  box-shadow:
    inset 0 1px 0 var(--prime-screen-specular-cut),
    inset 0 2px 0 rgba(238,252,255,.10),
    inset 1px 0 0 var(--prime-screen-specular-rail),
    inset -1px 0 0 rgba(125,204,236,.12),
    inset 0 -1px 0 rgba(30,117,157,.26),
    inset 0 0 0 1px rgba(170,237,255,.11),
    inset 0 0 0 2px rgba(105,215,252,.035),
    inset 0 0 10px rgba(93,200,248,.04)!important;
}
/* Preserve an inexpensive sharp glass cut when CPU/GPU pressure rises.
   Suppress the larger shoulder, never disable the resting highlight. */
html:is([data-prime-performance-mode="light"],[data-prime-runtime-pressure="high"],[data-prime-resource-tier="low"],[data-pc-hw-tier="low"],.super-low-cost)
body.prime-v2 #main[data-app-shell]>.app-window.is-prime-viewport-active:not(#top):not(#portfolio)
[data-prime-machine-panel="true"][data-prime-z-screen="true"]:not(.pc-book-cover)>.prime-diorama-glass-face{
  background:
    radial-gradient(ellipse 12% 5% at var(--prime-prismatic-pose-x,52%) var(--prime-prismatic-pose-y,27%),
      var(--prime-screen-specular-core),var(--prime-screen-specular-feather) 36%,transparent 72%),
    linear-gradient(164deg,rgba(247,253,255,.065),transparent 25% 82%,rgba(126,211,249,.025))!important;
}

/* PRIME MACHINE HIGH-GLOSS OPTICS r24 | tight specular with dark transmission.
   The existing passive Z+1 glass face owns the reflection. This changes no
   hit target, clipping boundary, media pixel, pose transform or scanline. */
html[data-prime-skin] body.prime-v2 #main[data-app-shell]>.app-window.is-prime-viewport-active:not(#top):not(#portfolio)
[data-prime-machine-panel="true"][data-prime-z-screen="true"]:not(.pc-book-cover)>.prime-diorama-glass-face{
  background:
    /* Tight coated-glass flash and long softbox: fewer translucent layers,
       stronger white point, no full-screen milky reflection. */
    radial-gradient(ellipse 6% 2.7% at var(--prime-prismatic-pose-x,52%) var(--prime-prismatic-pose-y,27%),
      rgba(255,255,255,1) 0 10%,var(--prime-screen-specular-core) 18%,
      var(--prime-screen-specular-shoulder) 30%,transparent 62%),
    radial-gradient(ellipse 19% 1.7% at calc(var(--prime-prismatic-pose-x,52%) - 5%) calc(var(--prime-prismatic-pose-y,27%) + 4%),
      rgba(255,255,255,.64),var(--prime-screen-specular-feather) 30%,transparent 70%),
    linear-gradient(164deg,rgba(250,254,255,.044),transparent 17% 85%,rgba(132,214,248,.019))!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.94),
    inset 0 2px 0 rgba(228,249,255,.19),
    inset 1px 0 0 var(--prime-screen-specular-rail),
    inset -1px 0 0 rgba(128,212,250,.12),
    inset 0 -1px 0 rgba(22,97,137,.27),
    inset 0 0 0 1px rgba(194,241,255,.15)!important;
  opacity:.94!important;
}
html:is([data-prime-performance-mode="light"],[data-prime-runtime-pressure="high"],[data-prime-resource-tier="low"],[data-pc-hw-tier="low"],.super-low-cost)[data-prime-skin]
body.prime-v2 #main[data-app-shell]>.app-window.is-prime-viewport-active:not(#top):not(#portfolio)
[data-prime-machine-panel="true"][data-prime-z-screen="true"]:not(.pc-book-cover)>.prime-diorama-glass-face{
  background:
    radial-gradient(ellipse 6% 2.7% at var(--prime-prismatic-pose-x,52%) var(--prime-prismatic-pose-y,27%),
      rgba(255,255,255,.94) 0 9%,var(--prime-screen-specular-shoulder) 27%,transparent 64%),
    linear-gradient(164deg,rgba(250,254,255,.035),transparent 21% 86%,rgba(132,214,248,.019))!important;
}