
.font-industrial { font-family: 'Chakra Petch', sans-serif; }
.font-mono-digital { font-family: 'Share Tech Mono', monospace; }

.chassis-panel {
    background: linear-gradient(145deg, #242933, #1a1d24);
    box-shadow: 4px 4px 10px rgba(0,0,0,0.5), inset 1px 1px 2px rgba(255,255,255,0.05);
}

.screw {
    width: 8px; height: 8px;
    background: radial-gradient(circle, #64748b 0%, #334155 100%);
    border-radius: 50%;
    display: inline-block;
    box-shadow: inset 1px 1px 2px rgba(255,255,255,0.3), inset -1px -1px 2px rgba(0,0,0,0.8), 1px 1px 2px rgba(0,0,0,0.5);
    position: relative;
}
.screw::after {
    content: ''; position: absolute; top: 50%; left: 50%;
    width: 60%; height: 1px; background: #1e293b;
    transform: translate(-50%, -50%) rotate(45deg);
}

.led-indicator {
    width: 10px; height: 10px; border-radius: 50%;
    box-shadow: inset 1px 1px 2px rgba(255,255,255,0.4), inset -1px -1px 2px rgba(0,0,0,0.4);
    border: 1px solid #111;
}
.led-red-on { background: #ef4444; box-shadow: 0 0 8px #ef4444, inset 1px 1px 3px rgba(255,255,255,0.5); }
.led-green-on { background: #22c55e; box-shadow: 0 0 8px #22c55e, inset 1px 1px 3px rgba(255,255,255,0.5); }
.led-amber-on { background: #f59e0b; box-shadow: 0 0 8px #f59e0b, inset 1px 1px 3px rgba(255,255,255,0.5); }
.led-blink { animation: blink 1.5s infinite; }

@keyframes blink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.3; }
}

.btn-3d-hardware {
    border-radius: 4px; text-transform: uppercase;
    transition: all 0.1s ease;
    box-shadow: 0 4px 0 #000, 0 5px 5px rgba(0,0,0,0.4), inset 0 1px 1px rgba(255,255,255,0.2);
}
.btn-3d-hardware:active {
    transform: translateY(4px); box-shadow: 0 0 0 #000, 0 1px 1px rgba(0,0,0,0.4), inset 0 2px 4px rgba(0,0,0,0.5);
}
.btn-3d-grey { background: linear-gradient(to bottom, #475569, #334155); color: #cbd5e1; border: 1px solid #1e293b; }
.btn-3d-green { background: linear-gradient(to bottom, #16a34a, #15803d); color: #fff; border: 1px solid #14532d; }
