html,body{font:14px/1.21 Helvetica Neue,arial,sans-serif;font-weight:400;height:100%;margin:0;padding:0}.header{text-align:center}.header h1{margin:0}.wordle{max-width:500px;width:100%;height:100%;margin:auto;padding:10px;display:flex;flex-direction:column;flex-wrap:nowrap;box-sizing:border-box;position:relative}.board{flex-grow:1}.board__tiles{display:flex;gap:4px;justify-content:center;padding:2px 0}.board__tile{font-size:30px;font-weight:700;line-height:50px;height:50px;width:50px;border-style:solid;border-width:2px;border-color:#000;text-align:center;text-transform:uppercase;transition:all .3s ease-in-out}.board__tile.empty{border-color:#a9a9a9}.keyboard__key.answered,.board__tile.answered{background-color:gray;border-color:gray;color:#fff}.keyboard__key.correct,.board__tile.correct{background-color:#fbff00;border-color:#fbff00;color:#000}.keyboard__key.exact,.board__tile.exact{background-color:#c9e265;border-color:#c9e265;color:#fff}@keyframes pop{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}@keyframes flip{0%{transform:rotateX(0)}50%{transform:rotateX(90deg)}to{transform:rotateX(0)}}.board__tile:not(.empty):not(.answered){animation:pop .1s}.board__tile.answered{animation:flip .5s ease-in}.board__tile.answered:nth-child(1){animation-delay:0ms;transition-delay:.25s}.board__tile.answered:nth-child(2){animation-delay:.1s;transition-delay:.35s}.board__tile.answered:nth-child(3){animation-delay:.2s;transition-delay:.45s}.board__tile.answered:nth-child(4){animation-delay:.3s;transition-delay:.55s}.board__tile.answered:nth-child(5){animation-delay:.4s;transition-delay:.65s}.keyboard{padding:10px 0}.keyboard__row{display:flex;width:100%;gap:4px;padding:2px 0;justify-content:center}.keyboard__key{line-height:40px;font-weight:bolder;margin:0;padding:0;flex-grow:1;background-color:#d3d3d3;border-width:1px;border-style:solid;border-color:gray;cursor:pointer;text-transform:uppercase}.keyboard__key.special{border-color:#000;background-color:#a9a9a9}@media(prefers-color-scheme:dark){html,body{background-color:#000;color:#fff}.board__tile,.keyboard__key.special{border-color:#fff}}.toast{position:absolute;margin:20px auto;background:#c9e265e6;color:#fff;padding:10px;border-radius:10px;opacity:0;transition:all .3s ease-in-out;text-align:center;left:50%;transform:translate(-50%,-100%)}.toast.show{opacity:1;transform:translate(-50%,-20px)}.share{padding:20px 0;display:flex;gap:20px}.share__button{background:none;border:2px solid rgba(201,226,101,.9);color:#c9e265;display:block;margin:auto;font-size:30px;padding:10px 30px;text-decoration:none;text-align:center;cursor:pointer;transition:all .3s ease-in-out}.share__button:hover{background-color:#c9e265;color:#fff}