@import"https://cdn.jsdelivr.net/gh/jgthms/minireset.css@master/minireset.min.css";:root{font-family:monospace}#root{height:100vh;width:100vw;display:grid;grid-template-columns:1fr;grid-template-rows:100px 1fr 100px;max-width:1000px;position:relative;left:50%;transform:translate(-50%)}.nav-bar{grid-column-start:1;grid-column-end:2;grid-row-start:3;grid-row-end:4;display:flex;justify-content:center;align-items:center;justify-content:space-evenly}.nav-bar button{width:80px;height:40px;border-radius:5px;font-size:18px;box-shadow:5px 5px 10px #00000080}.nav-bar button:hover{cursor:pointer;background-color:#0009;color:#fff}.header{grid-column-start:1;grid-column-end:2;grid-row-start:1;grid-row-end:2;display:flex;flex-direction:column;justify-content:center;align-items:center}.heading{font-size:35px;border:2px solid black;padding:5px;border-radius:5px;box-shadow:5px 5px 10px #00000080;background-image:linear-gradient(to right,#faebd71a,#faebd780)}.home{grid-column-start:1;grid-column-end:2;grid-row-start:2;grid-row-end:3;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-evenly;gap:10px;overflow-inline:auto;border:2px solid black;border-radius:5px;background-image:linear-gradient(to right,#faebd71a,#faebd780);box-shadow:5px 5px 10px #00000080}.char-container{background-image:linear-gradient(to right,#faebd74d,#faebd7c2);margin:10px;height:250px;width:300px;padding:10px;font-size:16px;border:2px solid black;border-radius:5px;box-shadow:5px 5px 10px #00000080}.new-char{grid-column-start:1;grid-column-end:2;grid-row-start:2;grid-row-end:3;padding:20px;margin:2px solid black;box-shadow:5px 5px 10px #00000080;border-radius:5px;font-size:18px;background-image:linear-gradient(to right,#faebd71a,#faebd780)}.new-char button{width:70px;height:35px;border-radius:5px;font-size:18px;margin:10px;box-shadow:5px 5px 10px #00000080}.new-char button:hover{cursor:pointer;background-image:linear-gradient(to right,#faebd71a,#1ba51680)}.fieldset{margin:10px;display:block}.legend{padding:10px;display:block}label{font-size:20px;padding-bottom:5px;padding-top:5px;display:block}input{height:30px;font-weight:700;padding:5px;display:block;margin:10px}select{height:30px;padding:5px;display:block;margin:10px}input:invalid{background-image:linear-gradient(to right,#faebd74d,#faebd7c2)}input:valid{background-image:linear-gradient(to right,#faebd71a,#1ba51680)}select:invalid{background-image:linear-gradient(to right,#faebd74d,#faebd7c2)}select:valid{background-image:linear-gradient(to right,#faebd71a,#1ba51680)}.edit-char,.del-char{background-image:linear-gradient(to right,#faebd71a,#faebd780);grid-column-start:1;grid-column-end:2;grid-row-start:2;grid-row-end:3;font-size:16px;border:2px solid black;border-radius:5px;box-shadow:5px 5px 10px #00000080}.not-found{grid-column-start:1;grid-column-end:2;grid-row-start:2;grid-row-end:3;display:flex;flex-direction:column;justify-content:center;align-items:center;font-size:25px;padding:20px}