*{box-sizing:border-box;margin:0;padding:0;font-family:Helvetica,Arial,sans-serif}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.rotatee{fill:none;stroke:navy;stroke-width:6px;width:3rem;height:3rem;animation-name:rotation;animation-duration:.8s;animation-timing-function:linear;animation-iteration-count:infinite;overflow:visible}.rotatee-former{color:navy;justify-content:center;width:100%;height:3.14rem;font-size:2rem;font-weight:700;animation-name:rotation;animation-duration:1.1s;animation-timing-function:linear;animation-iteration-count:infinite;display:flex}.rotatee-alt{width:fit-content;font-size:2rem;font-weight:700;animation-name:rotation;animation-duration:2s;animation-timing-function:linear;animation-iteration-count:infinite}.banner{border-radius:3px;justify-content:center;align-self:center;width:100%;padding:.75rem;font-size:1.2rem;display:flex}.success{color:#007800;background-color:#8cff7f;border:2px solid #017801}.error{color:#9b0000;background-color:#faa;border:2px solid #9b0000}.top-level{flex:0 0 0;justify-content:space-between;width:100%;height:fit-content;padding:1rem;display:flex}.groups-header{justify-content:space-between;align-items:space-between;flex-direction:row;width:100%;min-width:100px;max-width:1000px;padding:1rem;display:flex}.groups-header h2{color:#fff;border-bottom:3px solid #fff;width:fit-content}.rows{flex-direction:column;width:100%;min-width:100px;max-width:1000px;padding:1rem;font-family:Franklin Gothic Medium,Arial Narrow,Arial,sans-serif;font-size:1.5rem;display:flex}.rows div{cursor:pointer;background-color:#fff;border-radius:5px;justify-content:space-between;margin-bottom:.5rem;padding:.75rem;display:flex}.rows div:hover{background-color:#cdcbcb}a{text-decoration:none}.outer-box{background:linear-gradient(135deg,indigo,#300080);flex-direction:column;flex:1 1 0;align-items:center;padding:1rem;display:flex}.button-box{justify-content:space-between;width:100%;min-width:228px;max-width:756px;display:flex}.outer-row-box{background-color:#171717;border-radius:10px;width:100%;max-width:756px;margin:1rem}.card-row-box,.card-row-box-header{color:#fff;text-align:center;background-color:#2e2e2e}.card-row-box-header{background-color:#171717;border-radius:20px;grid-template-columns:28px 1fr 1fr 28px;place-items:center;height:30px;display:grid}.card-row-box{color:#000;background-color:#fff;max-height:65vh;overflow-y:auto}.card-row{grid-template-columns:28px 1fr 1fr 28px;grid-template-rows:minmax(100px 350px);grid-auto-rows:minmax(100px 350px);width:100%;max-width:756px;display:grid}.card-row:hover{cursor:pointer;background-color:#cdcbcb}.card-col{border:2px solid #000;justify-content:center;align-items:center;padding:.5rem;display:flex}.row-del-btn{color:#fff;stroke:#fff;width:100%;height:100%;font-family:inherit;font-size:inherit;background-color:#2e2e2e;border:none;transition:background .3s}.row-del-btn button,.row-del-btn svg{border:2px solid #000}.row-del-btn:hover{background-color:red}.row-del-btn:active{color:#000}.add-modal{z-index:1;background-color:#0006;width:100%;height:100%;padding-top:9rem;position:fixed;top:0;left:0;overflow:auto}.modal-content{background-color:#fefefe;border:1px solid #888;border-radius:3px;flex-direction:column;width:80%;max-width:550px;margin:auto;padding:10px 20px 20px;display:flex}.content-col{flex-direction:column;gap:1rem;display:flex}.input-container{flex-direction:column;gap:.15rem;display:flex}.close{color:#aaa;stroke:#aaa;float:right;align-self:flex-end;width:1.75rem;height:1.75rem;font-size:28px;font-weight:700}.close:hover,.close:focus{color:#000;stroke:#000;cursor:pointer;text-decoration:none}.modal-outer2{z-index:2;background-color:#0006;width:100%;height:100vh;padding:32vh .5rem .5rem;position:fixed}.flip-outer{perspective:1000px;background-color:#0000;width:550px;min-width:300px;max-width:95%;height:300px;margin:auto}.flip-inner{width:100%;height:100%;transform-style:preserve-3d;transition:transform .6s;position:relative;box-shadow:0 4px 8px #0003}.red{background-color:red}.flipper{transform:rotateY(180deg)}.flip-card-front,.flip-card-back{backface-visibility:hidden;text-align:center;flex-direction:column;gap:1.75rem;width:100%;height:100%;padding:1.75rem;display:flex;position:absolute}.flip-card-front{background-color:#fefefe}.flip-card-back{background-color:#fefefe;transform:rotateY(180deg)}.modal-content2{text-align:center;background-color:#fefefe;border-radius:1rem;flex-direction:column;gap:1.75rem;width:550px;min-width:300px;max-width:100%;margin:auto;padding:1.75rem;display:flex}.btn-row{justify-content:space-evenly;display:flex}.btn2{color:#fff;cursor:pointer;background-color:navy;border:none;border-radius:8px;padding:.5rem 1rem;font-family:Arial,Helvetica,sans-serif;font-size:1rem;font-weight:700}.btn2:hover{background-color:#0d0dbe}#root{flex-direction:column;height:100vh;display:flex}h1{font-size:2.5rem}.outer{background:linear-gradient(135deg,indigo,#300080);flex-direction:column;flex:1 1 0;align-items:center;width:100%;display:flex}.modal{background-color:#f0f8ff;border:2px solid #000;border-radius:5px;flex-direction:column;justify-self:center;place-items:center;gap:.5rem;width:100%;max-width:600px;height:fit-content;margin:20vh .5rem .5rem;padding:1rem;font-size:.75rem;display:flex}.input-box{flex-direction:column;justify-content:center;width:100%;min-width:100px;max-width:300px;padding:.75rem;display:flex}.input-box input[type=text],.input-box input[type=password]{background-color:#f0f0f0;border:1.5px solid gray;border-radius:5px;width:100%;padding:.5rem;font-size:1rem}.input-box input[type=text]:focus,.input-box input[type=password]:focus{background-color:#fff;border:2px solid #000}.btn{color:#fff;cursor:pointer;background-color:navy;border-radius:6px;padding:1rem;font-family:Arial,Helvetica,sans-serif;font-size:1rem}.btn-del{color:#fff;cursor:pointer;z-index:1;background-color:#d60101;border-radius:5px;padding:.4rem;font-family:Franklin Gothic Medium,Arial Narrow,Arial,sans-serif;font-size:1rem;font-weight:700}.refresh-btn{aspect-ratio:1;cursor:pointer;stroke:#000;background-color:#fff;border:1px solid #000;border-radius:3rem;height:3rem;font-size:1.5rem;font-weight:1000;transition:background .3s}.refresh-btn:hover{background-color:#cbcbcb}.refresh-btn:active{stroke:red;color:red}.refresh-btn:active polygon{fill:red}