:root{font-family:Roboto,sans-serif;line-height:1.5;font-weight:400;color:#333;background-color:#f8f9fa;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;display:flex;justify-content:center;align-items:center;width:100%;min-height:100vh;background-color:#f8f9fa}h1{font-size:3.2em;line-height:1.1}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (max-width: 600px){h1{font-size:2.4em}}.Card{width:100px;max-width:100px;height:100px;border-radius:15px;overflow:hidden;box-shadow:0 4px 12px #0000001a;cursor:pointer;position:relative;perspective:1000px;transition:transform .3s}.Card-inner{position:absolute;width:100%;height:100%;transition:transform .6s;transform-style:preserve-3d}.Card.hidden .Card-inner{transform:rotateY(180deg)}.Card.visible .Card-inner{transform:rotateY(0)}.Card.found .Card-inner{border:2px solid #4caf50;opacity:.5}.Card-front,.Card-back{position:absolute;width:100%;height:100%;backface-visibility:hidden;border-radius:12px;display:flex;align-items:center;justify-content:center}.Card-front{background-color:#fff}.Card-back{transform:rotateY(180deg)}.Card img{width:80%;height:80%;object-fit:cover;border-radius:8px}@media (max-width: 600px){.Card{width:80px;max-width:80px;height:80px}}.CardTable{display:flex;flex-direction:column;gap:16px;padding:16px;background-color:#fff;justify-content:center;border-radius:12px;box-shadow:0 4px 12px #0000001a}.CardTable h1{font-size:24px;margin-bottom:16px;color:#333}.CardTable p{font-size:16px;color:#333}.CardTable .cards-container{display:flex;flex-wrap:wrap;gap:16px;justify-content:center}.Card{width:100px;height:100px;border:1px solid #ddd;border-radius:12px;overflow:hidden;box-shadow:0 4px 12px #0000001a;transition:transform .2s;display:flex;align-items:center;justify-content:center}.Card:hover{transform:scale(1.05)}.CardTable table{width:100%;border-collapse:collapse;margin-top:16px}.CardTable th,.CardTable td{padding:12px 15px;border:1px solid #ddd;text-align:left}.CardTable th{background-color:#f4f4f4;font-weight:700}.CardTable tr:nth-child(2n){background-color:#f9f9f9}.CardTable tr:hover{background-color:#f1f1f1}@media (max-width: 600px){.Card{width:80px;height:80px}.CardTable table{font-size:14px}.CardTable th,.CardTable td{padding:8px 10px}}.Input{display:flex;flex-direction:column;margin-bottom:16px}.Input label{font-size:16px;font-weight:700;margin-bottom:8px;color:#333}.Input input{padding:10px;font-size:16px;border:1px solid #ddd;border-radius:8px;background-color:#f8f9fa;color:#333;box-shadow:inset 0 1px 2px #0000001a;transition:border-color .3s,box-shadow .3s}.Input input:focus{border-color:#80bdff;outline:none;box-shadow:0 0 5px #80bdff80}@media (max-width: 600px){.Input{margin-bottom:12px}.Input label{font-size:14px}.Input input{padding:8px;font-size:14px}}.UserForm{display:flex;flex-direction:column;gap:16px;padding:20px;width:80%;margin:0 auto;background-color:#fff;border:1px solid #ddd;border-radius:12px;box-shadow:0 4px 12px #0000001a;color:#333}.UserForm button{padding:10px;font-size:16px;border:1px solid #ddd;border-radius:8px;background-color:#007bff;color:#fff;box-shadow:inset 0 1px 2px #0000001a;transition:border-color .3s,box-shadow .3s,background-color .3s;cursor:pointer}.UserForm button:hover{border-color:#0056b3;background-color:#0056b3;box-shadow:inset 0 1px 3px #0003}.UserForm select,.UserForm input{padding:10px;font-size:16px;border:1px solid #ddd;border-radius:8px;background-color:#f8f9fa;color:#333;box-shadow:inset 0 1px 2px #0000001a;transition:border-color .3s,box-shadow .3s,background-color .3s}.UserForm select:hover,.UserForm input:hover{border-color:#ccc;background-color:#e9ecef;box-shadow:inset 0 1px 3px #0003}.UserForm select{cursor:pointer}.deck-container{display:flex;align-items:center;gap:16px}.deck-image{width:80px;height:auto;border-radius:8px;border:1px solid #ddd}@media (max-width: 600px){.UserForm{width:90%;padding:10px}.deck-container{flex-direction:column;align-items:flex-start}.deck-image{width:60px}}.Timer{display:flex;flex-direction:column;align-items:center;gap:16px;padding:20px;background-color:#fff;border:1px solid #ddd;border-radius:12px;box-shadow:0 4px 12px #0000001a;color:#333;max-width:200px;margin:0 auto}.Timer h2{font-size:24px;margin:0}.Timer button{padding:10px;font-size:16px;border:1px solid #ddd;border-radius:8px;background-color:#007bff;color:#fff;box-shadow:inset 0 1px 2px #0000001a;transition:border-color .3s,box-shadow .3s,background-color .3s;cursor:pointer}.Timer button:hover{border-color:#0056b3;background-color:#0056b3;box-shadow:inset 0 1px 3px #0003}@media (max-width: 600px){.Timer{max-width:100%;padding:10px}}.Game{padding:20px;margin-bottom:20px;background-color:#fff;border:1px solid #ddd;border-radius:12px;box-shadow:0 4px 12px #0000001a;transition:background-color .3s,box-shadow .3s;display:flex;flex-direction:column;align-items:center;min-width:200px;width:100%}.Game p{margin:8px 0}.Game:hover{background-color:#f8f9fa;box-shadow:0 4px 12px #0003}@media (max-width: 600px){.Game{padding:10px}}.GamesBoard{padding:20px;background-color:#fff;color:#333;border-radius:12px;box-shadow:0 4px 12px #0000001a;max-width:1200px;margin:0 auto}.GamesBoard h2{margin-bottom:16px;text-align:center}.GamesBoard ul{list-style-type:none;padding:0;display:flex;flex-wrap:wrap;gap:20px;justify-content:center;overflow:hidden}.GamesBoard ul li{flex:1 1 calc(50% - 20px);box-sizing:border-box;max-width:250px}.GamesBoard p{text-align:center}.GamesBoard button{display:block;margin:0 auto 20px;padding:10px 20px;font-size:16px;border:1px solid #ddd;border-radius:8px;background-color:#007bff;color:#fff;box-shadow:inset 0 1px 2px #0000001a;transition:border-color .3s,box-shadow .3s,background-color .3s;cursor:pointer}.GamesBoard button:hover{border-color:#0056b3;background-color:#0056b3;box-shadow:inset 0 1px 3px #0003}.GamesBoard .buttons{display:flex;justify-content:center;align-items:center}@media (max-width: 600px){.GamesBoard ul li{flex:1 1 100%;max-width:100%}}.App{display:flex;flex-direction:column;align-items:center;gap:16px;padding:20px;background-color:#fff;border:1px solid #ddd;border-radius:12px;box-shadow:0 4px 12px #0000001a;color:#333;max-width:80%;min-width:400px;margin:0 auto}.UserFormContainer{display:flex;align-items:center;gap:16px}.UserFormContainer h1{margin:0}@media (max-width: 600px){.App{padding:10px;max-width:100%;min-width:100%}.UserFormContainer{flex-direction:column;align-items:flex-start}}