.root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;max-width:1100px}body{margin:0;display:flex;place-items:center;justify-content:center;min-width:320px;min-height:100vh;width:100vw}form{background-color:#fff;display:flex;flex-direction:column;justify-content:space-evenly;align-items:center;border:solid 1px black;padding:1.5rem;width:16rem;box-shadow:5px 5px #333}form input,form select{margin-top:10px;padding:10px;border:1px solid #ccc}form img{object-fit:cover}.orientation{display:flex;flex-direction:column;margin:1rem 0 0;width:100%}.form-button{margin:1.5rem 0;border:1px solid #ccc;padding:.5rem 0}.message{color:red;text-shadow:1px 1px 0 #333}.container{padding:1rem;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;gap:1.5rem}.card{background-color:#fff;display:flex;flex-direction:column;justify-content:initial;align-items:center;border:solid 1px black;box-shadow:5px 5px #333;height:125px;width:150px;transition:all .3s cubic-bezier(.25,.8,.25,1)}.card img{width:100%;height:auto;background:content-box radial-gradient(#535353,#000)}.card p{margin:0;box-sizing:border-box;width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-align:center;height:65px;padding:.125rem 1rem}.card:hover{cursor:pointer;box-shadow:6px 10px 2px #333}.card:focus{box-shadow:6px 10px 2px #333;outline:1px solid black}.card:hover img{background:content-box radial-gradient(#8b8b8b,#000)}.card:focus img{background:content-box radial-gradient(#8b8b8b,#000)}.profile{background-color:#fff;display:flex;justify-content:space-between;flex-direction:row;align-items:center;border:solid 1px black;padding:.5rem 1.5rem;box-shadow:5px 5px #333;width:100%;box-sizing:border-box}.profile input{margin:.12rem;padding:10px;width:100%;border:1px solid #ccc}.profile img{object-fit:cover}.profile button{margin:.12rem;border:1px solid #ccc;padding:10px;transition:all .3s cubic-bezier(.25,.8,.25,1)}.profile button:hover{cursor:pointer;box-shadow:3px 3px #333}.profile button:focus{box-shadow:3px 3px #333;outline:1px solid black}.prof-info{display:flex;flex-direction:row;justify-content:center;align-items:center}.prof-info img{border-radius:50px;margin-right:10px}.prof-info h1,.prof-info p{margin:0}.player{padding:1rem;box-sizing:border-box;width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center}.player video{box-shadow:5px 5px #333}.search-container{display:flex;justify-content:center;margin-bottom:30px}.search-input{width:50%;margin-top:10px;padding:10px;border:1px solid #ccc}
