*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#061725;color:#fff;font-family:Arial,sans-serif}.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;z-index:10;background:#ffd083;color:#000;padding:10px}main{max-width:1600px;margin:auto}.art{width:100%;position:relative;background-size:100% 100%;background-repeat:no-repeat;overflow:hidden}.hot{position:absolute;z-index:3;background:transparent;border:0;cursor:pointer;border-radius:5px;transition:background .22s,box-shadow .22s,filter .22s;touch-action:manipulation}.hot:hover,.hot:focus-visible{background:rgba(255,191,84,.16);box-shadow:inset 0 -3px #ffc369,0 0 22px rgba(255,192,92,.48);outline:none}.hot.clicked{animation:jiggle .36s ease-in-out;background:rgba(255,190,84,.24)}@keyframes jiggle{0%,100%{transform:translateX(0) rotate(0)}20%{transform:translateX(-4px) rotate(-1deg)}45%{transform:translateX(4px) rotate(1deg)}70%{transform:translateX(-2px)}}.dna-light{position:absolute;pointer-events:none;z-index:1;right:0;top:0;width:37%;height:100%;background:linear-gradient(110deg,transparent 25%,rgba(255,197,90,.10) 49%,transparent 72%);mix-blend-mode:screen;animation:shimmer 9s ease-in-out infinite alternate;mask-image:linear-gradient(to bottom,#000 0%,#000 45%,transparent 85%)}@keyframes shimmer{from{transform:translate(-12px,5px);opacity:.35}to{transform:translate(12px,-5px);opacity:1}}footer{padding:20px 3%;display:flex;gap:20px;justify-content:space-between;flex-wrap:wrap;font-size:13px;color:#e7c78f;border-top:1px solid #936a37}footer a{color:#ffd18a}.live-form{margin:25px auto 50px;padding:24px;max-width:700px;background:#092538;border:1px solid #a87b40;border-radius:8px;display:grid;gap:13px}.live-form h2{font:normal 30px Georgia,serif;margin:0 0 8px}.live-form label{display:grid;gap:6px;color:#f6d9a5}.live-form input,.live-form select,.live-form textarea{padding:13px;color:#fff;background:#061725;border:1px solid #9e825d;border-radius:4px;font:inherit}.send{background:#f7bf72;color:#061725;border:0;padding:15px;font-weight:700;cursor:pointer;transition:background .2s}.send:hover{background:#ffdb94;box-shadow:0 0 18px #ffc169}.send:active{animation:jiggle .36s}.hint{font-size:12px;color:#ddd;margin:0}@media(max-width:650px){.art{min-width:760px;left:50%;transform:translateX(-50%)}main{overflow:hidden}.live-form{margin:12px;padding:16px}footer{font-size:11px}}@media(prefers-reduced-motion:reduce){.dna-light,.hot.clicked,.send:active{animation:none}*{scroll-behavior:auto!important}}
/* Animated gold DNA strands: the original artwork remains unchanged beneath.
   Two carefully masked copies of its right-side helix drift in opposite phases,
   creating slow strand movement rather than only a light sweep. */
.dna-strands{position:absolute;right:0;top:0;width:39%;height:100%;pointer-events:none;z-index:2;overflow:hidden;mask-image:linear-gradient(90deg,transparent 0%,#000 26%,#000 100%);-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 26%,#000 100%)}
.dna-strand{position:absolute;inset:0;background-image:var(--dna-image);background-repeat:no-repeat;background-size:calc(100% / .39) 100%;background-position:right center;mix-blend-mode:screen;will-change:transform,opacity}
.dna-strand.one{clip-path:polygon(30% 0,100% 0,100% 51%,47% 59%,22% 42%);animation:dna-sway-a 13s ease-in-out infinite alternate;opacity:.48}
.dna-strand.two{clip-path:polygon(18% 39%,100% 35%,100% 100%,0 100%);animation:dna-sway-b 16s ease-in-out infinite alternate;opacity:.4}
@keyframes dna-sway-a{0%{transform:translate3d(-4px,2px,0) skewY(-.35deg);opacity:.32}50%{transform:translate3d(3px,-3px,0) skewY(.4deg);opacity:.56}100%{transform:translate3d(-1px,4px,0) skewY(-.25deg);opacity:.38}}
@keyframes dna-sway-b{0%{transform:translate3d(3px,-3px,0) skewY(.35deg);opacity:.42}50%{transform:translate3d(-3px,3px,0) skewY(-.45deg);opacity:.27}100%{transform:translate3d(4px,-1px,0) skewY(.3deg);opacity:.5}}
@media(prefers-reduced-motion:reduce){.dna-strand{animation:none!important;opacity:0!important}}