.background{background-color:hsla(0,0%,96%,.2);background-image:linear-gradient(hsla(0,0%,79%,.2) 4px,transparent 0),linear-gradient(90deg,hsla(0,0%,79%,.2) 4px,transparent 0),linear-gradient(hsla(0,0%,79%,.2) 2px,transparent 0),linear-gradient(90deg,hsla(0,0%,79%,.2) 2px,hsla(0,0%,96%,.2) 0);background-size:100px 100px,100px 100px,20px 20px,20px 20px;background-position:-4px -4px,-4px -4px,-2px -2px,-2px -2px}table{border-collapse:collapse;width:100%;margin-top:20px}td,th{border:1px solid #ddd;padding:8px;text-align:left}th{background-color:#f2f2f2;cursor:pointer;position:relative}th.key-sequence{background-color:#d9edf7}th:hover:after{content:attr(data-tooltip);position:absolute;top:100%;left:0;white-space:pre-wrap;background-color:#333;color:#fff;padding:5px;border-radius:4px;font-size:12px;z-index:10}.popup,th:hover:not([data-tooltip]):after{display:none}.popup{position:absolute;top:100px;left:100px;background-color:#fff;border:1px solid #ccc;padding:10px;box-shadow:0 4px 8px rgba(0,0,0,.2);z-index:1000}.popup-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.popup-header h3{margin:0}.popup-header .close-popup{cursor:pointer;font-size:16px;color:#aaa}button{margin:5px;padding:5px 10px;cursor:pointer}.search-icon{display:inline-block;width:24px;height:24px;cursor:pointer}.hidden{display:none}.input-field{border:1px solid #ccc;box-sizing:border-box}.input-field.error{border-color:red}