/* Lighting is additive; keep the original architecture and key artwork. */
@media(min-width:701px){.reference-hero .hero-media{background-image:url('assets/images/scene-relocated-sun-v5.png')}}
.ribbon-texture{filter:brightness(1.85);opacity:.95;--ribbon-envelope:linear-gradient(transparent calc(var(--ribbon-reveal,0%) - 30%),#0004 calc(var(--ribbon-reveal,0%) - 20%),#000c calc(var(--ribbon-reveal,0%) - 10%),#000 var(--ribbon-reveal,0%),#000c calc(var(--ribbon-reveal,0%) + 10%),#0004 calc(var(--ribbon-reveal,0%) + 20%),transparent calc(var(--ribbon-reveal,0%) + 30%))}
.hero-sun{position:absolute;z-index:1;left:var(--sun-x,76%);top:var(--sun-y,50px);width:0;height:0;pointer-events:none;mix-blend-mode:screen}
.hero-sun:before{content:'';position:absolute;width:110px;height:110px;left:-55px;top:-55px;background:radial-gradient(circle,#f3ffff 0%,#c5f5ff80 8%,#8de5f629 30%,transparent 68%)}
.hero-sun:after{content:'';position:absolute;left:-280px;top:-8px;width:560px;height:var(--beam-length,650px);transform-origin:50% 0;transform:rotate(var(--beam-angle,28deg));background:conic-gradient(from 156deg at 50% 0,transparent 0deg,#b9f3ff08 8deg,#d8faff30 15deg,#f2ffff70 23deg,#bdefff26 30deg,transparent 48deg);mask-image:linear-gradient(#000 0%,#0009 55%,transparent 100%)}
.arch-depth-light{position:absolute;inset:0;pointer-events:none;z-index:1;background:radial-gradient(ellipse 8% 24% at 89% 55%,#b5f5ff24,transparent 75%),radial-gradient(ellipse 19% 7% at 78% 72%,#64d8eb18,transparent 75%);mix-blend-mode:screen}
.reference-key:nth-child(1){--layout-x:38.25}.reference-key:nth-child(2){--layout-x:103.25}.reference-key:nth-child(3){--layout-x:168.25}.reference-key:nth-child(4){--layout-x:233.25}
.reference-key:nth-child(5){--layout-x:5.75}.reference-key:nth-child(6){--layout-x:70.75}.reference-key:nth-child(7){--layout-x:135.75}.reference-key:nth-child(8){--layout-x:200.75}.reference-key:nth-child(9){--layout-x:265.75}
.reference-key:nth-child(n+5){margin-top:-.65%}
.reference-key .key-face{filter:brightness(1.08)}
.reference-key .key-face:before{background:radial-gradient(ellipse at 78% 7%,#ffffffd9,transparent 53%);opacity:.62}
.reference-key .key-face:after,.reference-key.is-pulsing .key-face:after{animation:none!important;inset:0;transform:none;opacity:.45;background:linear-gradient(125deg,transparent 40%,#eaffff20 51%,#fff8 61%,transparent 73%)}
.reference-key:nth-child(1):after,.reference-key:nth-child(4):after,.reference-key:nth-child(7):after{animation:none!important;opacity:.72;transform:scale(.75)}
@media(min-width:701px){.reference-hero .code-fragment{width:37ch;max-width:34%;font-size:clamp(9px,.78vw,12px);line-height:1.8;top:27%;opacity:.7;mask-image:linear-gradient(transparent,#000 5%,#000 88%,transparent)}.reference-hero .code-left{left:14%}.reference-hero .code-right{right:11%}}
@media(max-width:700px){.hero-sun:before{width:76px;height:76px;left:-38px;top:-38px}.hero-sun:after{opacity:.42;width:340px;left:-170px}.arch-depth-light{background:radial-gradient(ellipse 12% 25% at 90% 66%,#c4f8ff26,transparent 75%)}.ribbon-texture{opacity:.85}}
@media(prefers-reduced-motion:reduce){.reference-key .key-face:after{display:block}.reference-key:after{animation:none!important}}