.index{height:100vh;width:100vw;display:flex;flex-direction:column;justify-content:center;align-items:center}.index.green{background:linear-gradient(to right,#9acd32,bisque)}.index.purple{background:linear-gradient(to right,plum,#fff)}.index.blue{background:linear-gradient(to right,#4b9cd3,#f0f8ff)}.index_logo{width:150px;height:150px;margin-bottom:20px}.index_title{color:#f0f8ff;font-size:52px;font-weight:700;text-align:center;font-family:Courier New,Courier,monospace;animation-fill-mode:forwards}.index_title.green{color:#000}.index_title.purple{color:#49022e}.index_title.blue{color:#00008b}@keyframes fadeOut{0%{opacity:1}25%{opacity:.75}50%{opacity:.5}75%{opacity:.25}to{opacity:0}}@media (max-width: 768px){.index_title{font-size:28px;font-weight:700}.index_logo{width:100px;height:100px}}.home{height:100vh;width:100vw;color:#480148;display:flex;flex-direction:column;justify-content:center;align-items:center}.home.green{background:linear-gradient(to right,#9acd32,bisque)}.home.purple{background:linear-gradient(to right,plum,#fff)}.home.blue{background:linear-gradient(to right,#4b9cd3,#f0f8ff)}.home_title{color:#f0f8ff;font-size:52px;font-weight:700;text-align:center;font-family:Courier New,Courier,monospace}.navbar{position:absolute;top:0;left:0;width:100%;padding:20px 30px;display:flex;flex-direction:row;justify-content:space-between;align-items:center}.navbar_logo_container{gap:20px;display:flex;flex-direction:row;justify-content:center;align-items:center}.navbar_logo{height:40px;width:40px}.navbar_title{color:#000;font-size:24px;font-weight:700;text-align:center;font-family:Courier New,Courier,monospace}.navbar_title.green{color:#000}.navbar_title.green{color:#49022e}.navbar_title.black{color:#f0f8ff}.navbar_links{display:flex;flex-direction:row;justify-content:center;align-items:center}.navbar_links_text{position:relative;color:#000;font-size:20px;font-weight:600;text-align:center;font-family:Courier New,Courier,monospace;margin-left:20px;margin-right:20px;cursor:pointer}.navbar_links_text.green{color:#000}.navbar_links_text.green{color:#49022e}.navbar_links_text.black{color:#00008b}.navbar_links_text:after{content:"";position:absolute;bottom:0;left:0;width:0;height:2px;background-color:#000;transition:width .3s ease}.navbar_links_text:after .green{color:#000}.navbar_links_text:after .green{color:#49022e}.navbar_links_text:after .black{color:#00008b}.navbar_links_text:active:after,.navbar_links_text:hover:after{width:100%}.hamburger_icon{width:35px;height:35px;cursor:pointer;display:none}.game_column{display:flex;flex-direction:column;justify-content:center;align-items:center;width:max-content;height:max-content}.grid_header{width:100%;display:flex;flex-direction:row;justify-content:space-between;align-items:center;margin-bottom:5px}.level,.game_heart_text{color:#000;font-size:20px;font-weight:600;text-align:center;font-family:Courier New,Courier,monospace}.game_heart_con{display:flex;flex-direction:row;gap:7px;align-items:center}.game_heart{height:30px;width:30px}.character_grid{display:grid;grid-template-columns:repeat(4,80px);gap:10px;width:100%;justify-content:center}.cell{font-family:Permanent Market;width:80px;height:80px;border:3px solid black;border-radius:7px;cursor:pointer;line-height:100px;justify-content:center;align-items:center;display:flex;font-size:28px;font-weight:800;transition:background-color .3s ease-in-out}.cell.green{background-color:#9acd32;box-shadow:0 1px 3px #006400}.cell.purple{background-color:plum;box-shadow:0 1px 3px #49022e}.cell.blue{background-color:#4b9cd3;box-shadow:0 1px 3px #000}.game_options{flex-direction:row;justify-content:center;align-items:center;gap:30px;margin-top:30px;display:flex}.game_options_con{display:flex;flex-direction:row;justify-content:center;align-items:center}.hint_number{font-size:24px;font-weight:500;color:#f0f8ff}.hint_icon{width:40px;height:40px;cursor:pointer}.restart_button,.end_button{background-color:gray;color:#f0f8ff;font-size:18px;font-weight:600;text-align:center;font-family:Courier New,Courier,monospace;padding:10px 20px;border-radius:10px;border:2px solid black;cursor:pointer;margin-top:30px}.end_button{background-color:#a10303}.restart_button.green:hover{background-color:green;transition:background-color .3s ease-in-out}.restart_button.purple:hover{background-color:purple;transition:background-color .3s ease-in-out}.restart_button.blue:hover{background-color:#00008b;transition:background-color .3s ease-in-out}.end_button.blue:hover,.end_button.purple:hover,.end_button.green:hover{background-color:#dd0f0f;transition:background-color .3s ease-in-out}@keyframes fadeIn{0%{opacity:0}25%{opacity:.25}50%{opacity:.5}75%{opacity:.75}to{opacity:1}}@media (max-width: 1000px){.navbar{padding:20px 30px}.navbar_logo_container{gap:10px}.navbar_logo{width:40px;height:40px}.navbar_title{font-size:22px}.navbar_links_text{margin-left:10px;margin-right:10px;font-size:18px}}@media (max-width: 768px){.navbar{padding:20px 30px}.navbar_logo_container{gap:10px}.navbar_logo{width:35px;height:35px}.navbar_title{font-size:22px}.navbar_links_text{font-size:18px;font-weight:700}.hamburger_icon{display:block}.navbar_links{position:absolute;top:80px;right:0;width:100%;padding:20px 0;flex-direction:column;align-items:center;gap:15px;transform:translateY(-200%);opacity:0;transition:transform .3s ease-in-out,opacity .3s ease-in-out}.navbar_links.show_green{display:flex;transform:translateY(0);opacity:1;background:linear-gradient(to right,#9acd32,bisque);border-bottom:2px solid black}.navbar_links.show_purple{display:flex;transform:translateY(0);opacity:1;background:linear-gradient(to right,plum,#fff);border-bottom:2px solid black}.navbar_links.show_blue{display:flex;transform:translateY(0);opacity:1;background:linear-gradient(to right,#4b9cd3,#f0f8ff);border-bottom:2px solid black;box-shadow:0 4px 4px -4px #000}.game_heart{width:25px;height:25px}.character_grid{grid-template-columns:repeat(4,70px);gap:10px}.cell{width:70px;height:70px;font-size:24px}.level,.game_heart_text{font-size:18px;font-weight:700}.restart_button.green{background-color:green;transition:background-color .3s ease-in-out}.restart_button.purple{background-color:purple;transition:background-color .3s ease-in-out}.restart_button.blue{background-color:#00008b;transition:background-color .3s ease-in-out}}@media (max-width: 351px){.character_grid{grid-template-columns:repeat(4,60px);gap:10px}.cell{width:60px;height:60px}}.other_dialog{height:100vh;width:100vw;position:fixed;top:0;left:0;z-index:100;display:none;flex-direction:column;justify-content:center;align-items:center}.other_dialog.show{display:flex}.other_dialog_overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#00000080}.other_dialog_content{position:relative;padding:30px;height:max-content;width:30vw;display:flex;flex-direction:column;justify-content:center;align-content:center;border:5px solid black;border-radius:50px;overflow-y:auto}.other_dialog_content.green{background-color:#7fad25}.other_dialog_content.purple{background-color:purple}.other_dialog_content.blue{background-color:#012f6b}.content_header{font-size:24px;font-weight:600;margin-bottom:50px;width:100%;text-align:center}.radio_button_column{display:flex;flex-direction:column;gap:20px;align-items:start;width:max-content;justify-self:center}.content_column_label{display:inline-flex;align-items:center;cursor:pointer;font-size:20px;font-weight:600}.content_column_label.green,.content_header.green{color:#000}.content_column_label.purple,.content_header.purple,.content_column_label.blue,.content_header.blue{color:#f0f8ff}.content_column_label input[type=radio]{display:none}.radio-mark{height:16px;width:16px;border-radius:50%;margin-right:8px;position:relative}.radio-mark.green{border:2px solid black}.radio-mark.purple,.radio-mark.blue{border:2px solid aliceblue}.content_column_label.green input[type=radio]:checked+.radio-mark{background-color:#006400}.content_column_label.purple input[type=radio]:checked+.radio-mark{background-color:plum;border:2px solid plum}.content_column_label.blue input[type=radio]:checked+.radio-mark{background-color:#4b9cd3;border:2px solid #4B9CD3}.other_dialog_button{width:50%;margin-top:50px;display:flex;flex-direction:column;justify-content:center;align-items:center;font-size:20px;font-weight:600;padding:10px 20px;border:2px solid black;border-radius:20px;cursor:pointer;align-self:center;margin-bottom:0}.other_dialog_button.green{background-color:#9acd32}.other_dialog_button.purple{background-color:#cd4ed3;color:#f0f8ff}.other_dialog_button.blue{background-color:#0066b2;color:#f0f8ff}.other_dialog_button.green:hover{background-color:#adff2f}.other_dialog_button.purple:hover{background-color:plum;color:#000}.other_dialog_button.blue:hover{background-color:#4b9cd3;color:#00008b}.about_column{display:flex;flex-direction:column;justify-content:start;overflow-y:auto}.about_text{font-size:20px;font-weight:500;width:100%}.about_text.green{color:#000}.about_text.purple,.about_text.blue{color:#f0f8ff}@media (max-width: 768px){.other_dialog_content{padding:30px;width:80vw}.content_header{font-size:20px;margin-bottom:50px}.radio_button_column{gap:20px}.content_column_label,.about_text{font-size:18px}.radio-mark{height:16px;width:16px;border-radius:50%;margin-right:8px}.other_dialog_button{width:50%;margin-top:50px;font-size:18px;padding:10px 50px;border-radius:15px}}.end_dialog{height:100vh;width:100vw;position:fixed;top:0;left:0;z-index:1000;display:none;flex-direction:column;justify-content:center;align-items:center}.end_dialog.show{display:flex}.end_dialog_overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#00000080}.end_dialog_content{position:relative;padding:50px;height:max-content;width:30vw;display:flex;flex-direction:column;justify-content:center;align-content:center;background-color:green;border:5px solid black;border-radius:50px;overflow-y:auto}.end_dialog_header{font-size:28px;font-weight:600;color:#f0f8ff;text-align:center}@media (max-width: 768px){.end_dialog_content{padding:50px;border-radius:40px;width:80vw}.end_dialog_header{font-size:24px}}*{margin:0;padding:0;box-sizing:border-box}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (prefers-reduced-motion: no-preference){a:nth-of-type(2) .logo{animation:logo-spin infinite 20s linear}}.card{padding:2em}.read-the-docs{color:#888}