#root{width:100vw;height:100vh;margin:0;padding:0}html,body{margin:0;padding:0;height:100%;background-color:gray}.container{height:100vh;width:100vw;display:flex;justify-content:start;align-items:center;overflow-y:auto;flex-direction:column;gap:10px;padding-bottom:40px}h1,h2{margin:0}*{box-sizing:border-box}header{display:flex;background-color:#040404;color:#ff0;width:100vw;justify-content:space-between;padding:20px 10px;font-size:xx-large;z-index:10;position:sticky;top:0}.headerButtons{display:flex;gap:10px}.headerButtons button{background-color:#000;border:2px solid yellow;color:#ff0;border-radius:20px;padding:5px 10px;font-size:large;align-self:center;white-space:nowrap}.headerButtons button:hover{color:#000;background-color:#ff0;cursor:pointer}.net{border:5px solid black;border-radius:15px;padding:20px;height:fit-content;display:flex;flex-direction:column;gap:10px}.net button{background-color:#ffffe0;padding:5px 10px;border-radius:20px;font-size:large;border:2px solid black}.net button:hover{opacity:.7}.displayFlex{display:flex;flex-direction:column;gap:2px}.flexRow button{transform:translate(10px,-10px)}.netBox{width:100vw;display:grid;grid-template-columns:repeat(auto-fit,300px);gap:10px;justify-content:center}.modalOverlay{position:fixed;inset:0;background:#00000080;display:flex;justify-content:center;align-items:center;z-index:100;overflow-y:auto;padding:20px}.modalContent{background-color:gray;padding:20px;border-radius:20px;font-size:x-large;display:flex;flex-direction:column;align-items:flex-end;max-width:90vh;max-width:95vw;overflow-y:auto}.modalContent>button{width:fit-content;aspect-ratio:1;border-radius:50%;padding:8px;border:2px solid yellow;background-color:#000;color:#ff0;margin-bottom:20px;font-size:large;display:flex;justify-content:center;align-items:center}.modalContent button:hover{background-color:#ff0;color:#000}.newNet{display:flex;flex-direction:column;gap:5px;align-items:flex-end}.newNet button{margin-top:20px;width:fit-content;border:2px solid yellow;background-color:#000;color:#ff0;border-radius:20px;font-size:large;padding:5px 10px}.newNet input{border-radius:20px;background-color:#ffffe0;border:2px solid black;font-size:x-large;text-align:center}.editPlayerButtons{display:flex;justify-content:space-between}.editPlayerButtons button{background-color:#000;color:#ff0;border:2px solid yellow;border-radius:20px;padding:10px 20px;font-size:large}.editPlayerButtons .deleteButton{background-color:red;color:#ff0;border-radius:20px;padding:10px 20px}.flexRow{display:flex;justify-content:space-between}.flexRow button{height:fit-content;aspect-ratio:1;background-color:#000;border:2px solid yellow;color:#ff0}.flexRow button:hover{opacity:1;background-color:#ff0;color:#000}.editPlayerModal{display:flex;flex-direction:column;gap:20px;font-size:x-large}.playerStats{border:5px solid black;padding:10px;border-radius:10px;display:flex;flex-direction:row;align-items:center;flex-wrap:wrap;gap:20px;justify-content:center}.playerStats label{flex-grow:1}.editPlayerModal input,select{font-size:large;background-color:#ffffe0;border-radius:10px;border:2px solid black;padding:2px 5px}label{display:flex;flex-direction:column}@media screen and (max-width: 500px){.modalOverlay{align-items:start}}