body {
    margin: 0;
    font-family: Arial;
    background: #0f0f0f;
    color: white;
}
.controls {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding: 10px;
    background: #1a1a1a;
    position: sticky;
    top: 0;
    z-index: 10;
}

table {
    width: 100%;
    border-collapse: collapse;
}

th, td {
    padding: 10px;
    border-bottom: 1px solid #333;
    text-align: left;
}

th {
	background: #222;
}

select {
	width: 11em ;
	padding: 5px;
	}
input {
	padding: 5px;
	}


@media screen and (max-width: 720px) {

	.controls {
		flex-direction: column;
	}

	select {
		width: 100% ;
	}
	
	.hide-mobile {
        display: none;
    }

    td, th {
        font-size: 12px;
        padding: 6px;
    }
	
}