:root{--primary1:#467235;--primary2:#283f24}html{width:100vw;height:100vh}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--color-background);color:var(--color-text);width:100%;height:100%;margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}#root{flex-direction:column;width:100%;height:100%;display:flex}:root{--color-background:#1a1a1b;--color-text:#fff;--color-border:#3a3a3c;--color-tile-background:#3a3a3c;--color-tile-text:#fff;--color-tile-empty:#1a1a1b;--color-tile-present:#b59f3b;--color-tile-correct:#538d4e;--color-tile-absent:#3a3a3c;--color-key-background:#818384;--color-key-text:#fff;--color-key-present:#b59f3b;--color-key-correct:#538d4e;--color-key-absent:#3a3a3c}#body[data-2edd1180]{flex:1;justify-content:center;align-items:center;display:flex}#game[data-2edd1180]{box-sizing:border-box;flex-direction:column;align-items:center;width:100%;max-width:500px;padding:10px;display:flex}.game-board[data-2edd1180]{grid-gap:5px;grid-template-rows:repeat(6,1fr);width:100%;max-width:350px;margin:0 auto;padding:10px;display:grid}.word-row[data-2edd1180]{grid-gap:5px;width:100%;display:grid}.letter-tile[data-2edd1180]{text-transform:uppercase;border:2px solid var(--color-border);background-color:var(--color-tile-empty);width:100%;height:60px;color:var(--color-tile-text);box-sizing:border-box;justify-content:center;align-items:center;font-size:2rem;font-weight:700;display:flex}.letter-tile.present[data-2edd1180],.letter-tile.correct[data-2edd1180],.letter-tile.absent[data-2edd1180]{animation:1s forwards reveal;animation-delay:calc(var(--i)*.2s)}.letter-tile.present[data-2edd1180]{background-color:var(--color-tile-present);border-color:var(--color-tile-present)}.letter-tile.correct[data-2edd1180]{background-color:var(--color-tile-correct);border-color:var(--color-tile-correct)}.letter-tile.absent[data-2edd1180]{background-color:var(--color-tile-absent);border-color:var(--color-tile-absent)}.keyboard[data-2edd1180]{flex-direction:column;width:100%;max-width:500px;margin-top:20px;display:flex}.keyboard-row[data-2edd1180]{justify-content:center;margin-bottom:8px;display:flex}.key[data-2edd1180]{background-color:var(--color-key-background);color:var(--color-key-text);text-transform:uppercase;cursor:pointer;border:none;border-radius:4px;flex-grow:1;justify-content:center;align-items:center;min-width:30px;margin:0 3px;padding:15px 10px;font-size:1rem;font-weight:700;display:flex}.key.large[data-2edd1180]{flex-grow:1.5}.key.present[data-2edd1180]{background-color:var(--color-key-present)}.key.correct[data-2edd1180]{background-color:var(--color-key-correct)}.key.absent[data-2edd1180]{background-color:var(--color-key-absent)}@keyframes reveal{0%{transform:rotateX(0)}50%{transform:rotateX(90deg)}to{transform:rotateX(0)}}header[data-3c487bfc]{background:linear-gradient(180deg,var(--primary1),var(--primary2));z-index:10;flex-direction:row;justify-content:space-between;align-items:center;padding:10px 50px;display:flex;position:sticky;top:0;box-shadow:0 10px 24px #0000001f}.name[data-3c487bfc]{font-size:40px;font-weight:700}.pseudo[data-3c487bfc]{margin:0 10px;font-size:14px;font-weight:600}.login[data-3c487bfc],.register[data-3c487bfc],.logout[data-3c487bfc]{color:#000;cursor:pointer;border:none;border-radius:10px;align-items:center;gap:8px;padding:8px 14px;font-size:14px;font-weight:600;text-decoration:none;transition:background-color .2s,box-shadow .2s,transform .1s;display:inline-flex}.login[data-3c487bfc]{color:#fff;background:#2f80ed;margin-right:5px;box-shadow:0 4px 10px #2f80ed59}.login[data-3c487bfc]:hover{background:#256edc;transform:translateY(-1px);box-shadow:0 6px 14px #2f80ed73}.login[data-3c487bfc]:active{transform:translateY(0);box-shadow:0 2px 6px #2f80ed4d}.register[data-3c487bfc]{color:#fff;background:#27ae60;box-shadow:0 4px 10px #27ae6059}.register[data-3c487bfc]:hover{background:#219150;transform:translateY(-1px);box-shadow:0 6px 14px #27ae6073}.register[data-3c487bfc]:active{transform:translateY(0);box-shadow:0 2px 6px #27ae604d}.logout[data-3c487bfc]{color:#fff;background:#1f2937;box-shadow:0 4px 10px #00000040}.logout[data-3c487bfc]:hover{background:#111827;transform:translateY(-1px);box-shadow:0 6px 14px #00000059}.avatar{object-fit:cover;background:#e9e9ee;border:2px solid #ffffffe6;border-radius:50%;width:38px;height:38px;box-shadow:0 6px 14px #00000026}.avatar--navbar{width:32px;height:32px;box-shadow:0 4px 10px #00000026}.avatar--large{width:96px;height:96px;box-shadow:0 8px 24px #00000059}