/* 4 · NOIR STEEL (modern belt) — hover + spinning dial + scan beam */
.variant-noir.active { animation: noir-hover 4.6s ease-in-out infinite; }
.noir-waist { background: linear-gradient(180deg, #3a4046 0%, #16191c 55%, #000 100%); border: 1px solid #000; border-radius: 50%; height: 84px; left: 44px; position: absolute; top: 56px; width: 252px; }
.noir-glint { animation: band-sheen 2.8s ease-in-out infinite; border-radius: 50%; border-top: 2px solid rgba(160,220,255,0.7); display: block; height: 52px; left: 28px; position: absolute; top: 8px; width: 194px; }
.noir-strap { background: linear-gradient(90deg, #050607, #2b3137 30%, #4a5560 50%, #2b3137 70%, #050607); border: 1px solid #000; border-radius: 18px; height: 224px; left: 152px; position: absolute; top: 116px; width: 36px; }
.noir-edge { background: linear-gradient(180deg, rgba(140,200,255,0.55), transparent 30%); border-radius: 12px; display: block; height: 100%; margin: 0 auto; width: 4px; }
.noir-combo { background: linear-gradient(180deg, #22272c, #0a0c0e); border: 1px solid #39414a; border-radius: 10px; display: flex; gap: 5px; justify-content: center; left: 131px; padding: 10px 8px 16px; position: absolute; top: 92px; z-index: 3; }
.noir-dial { background: radial-gradient(circle at 50% 30%, #dfe7ed, #5b6671); border: 1px solid #000; border-radius: 50%; display: block; height: 18px; width: 18px; }
.noir-dial.d2 { animation: dial-spin 3s linear infinite; }
.noir-led { animation: led-blink 1.4s steps(2, start) infinite; background: #ff3b3b; border-radius: 50%; bottom: 4px; box-shadow: 0 0 8px #ff3b3b; height: 6px; left: 50%; position: absolute; transform: translateX(-50%); width: 6px; }
.noir-scan { animation: scan-drop 3s ease-in-out infinite; background: linear-gradient(180deg, transparent, rgba(120,200,255,0.55), transparent); height: 44px; left: 152px; position: absolute; top: 116px; width: 36px; }
@keyframes noir-hover { 0%, 100% { transform: translateY(0); filter: brightness(1); } 50% { transform: translateY(-12px); filter: brightness(1.12); } }
@keyframes dial-spin { from { transform: rotate(0); } to { transform: rotate(360deg); } }
@keyframes led-blink { 0%, 100% { opacity: 1; } 50% { opacity: 0.15; } }
@keyframes scan-drop { 0% { transform: translateY(0); opacity: 0; } 20% { opacity: 1; } 80% { opacity: 1; } 100% { transform: translateY(180px); opacity: 0; } }