body,html{width:100%}@media (max-width:1200px){.cli_buttons_container{display:flex;flex-direction:column;margin-bottom:2rem}.drawing_board{height:25rem}}@media (max-width:1100px){.current_letter_in_use{width:fit-content}.preview_text,.working_letter{width:9rem}.secondary_container{align-items:center!important;flex-direction:column!important}}@media (max-width:1000px){.preview_text,.working_letter{width:20rem}}@media (max-width:700px){.preview_text,.working_letter{width:9rem}.secondary_container{align-items:center!important;flex-direction:column!important;flex-wrap:nowrap!important}}@media (max-width:600px){.drawing_display,.drawing_extra_wrapper{flex-direction:column!important;margin-bottom:1rem!important;margin-top:1rem!important}}.navigation_bar{border-radius:0;border-bottom-left-radius:3rem;border-top-left-radius:3rem;gap:3rem;height:fit-content;margin-right:0;padding:2rem;position:fixed;right:0;top:50%;transform:translateY(-50%);width:fit-content;z-index:5}.navigation_bar[direction=left]{border-radius:0;border-bottom-right-radius:3rem;border-top-right-radius:3rem;left:0;margin-left:0}.utilities{gap:2rem}.utilities,.utilities .mode{display:flex;flex-direction:column}.utilities .mode{align-items:end;gap:1rem}.mode[current_mode=b] .bucket,.mode[current_mode=e] .eraser,.mode[current_mode=p] .pencil{filter:invert(1)}.utilities .modes{display:flex;flex-direction:row;gap:2rem}.modes>img{aspect-ratio:1/1;background:#fff;border:3px solid #000;border-radius:1rem;box-shadow:5px 5px;cursor:pointer;object-fit:contain;padding:.2rem;transition:.3s;width:2rem}.modes>img:hover{filter:brightness(.8)}.preview_text,.working_letter{align-items:center;background:#fff;border:3px solid #000;border-radius:1rem;box-shadow:5px 5px;color:#000;display:flex;font-family:Playwrite gb s;font-size:1.4rem;justify-content:center;text-align:center;width:4rem}.display_stroke,.mode_title,.preview_letters{margin:0}.main_title{text-align:center}.secondary_container{align-items:center;display:flex;flex-direction:row;gap:8rem;height:fit-content;justify-content:center;padding:0 5rem}.drawing_modal_wrapper{display:none}.drawing_mode_wrapper{align-items:center;display:none;flex-direction:column;justify-content:center;width:50%}.drawing_mode_wrapper button{border:0;border-radius:2rem;cursor:pointer;font-family:Poppins,cursvie;padding:1rem;transition:.3s}.drawing_mode_wrapper button:hover{filter:brightness(80%)}.drawing_modal_wrapper{background-color:rgba(0,0,0,.5);height:100%;position:absolute;width:100%;z-index:3}.drawing_modal_container{align-items:center;display:flex;flex-direction:column;height:100%;justify-content:center;width:100%}.drawing_modal_container .drawing_board{aspect-ratio:1/1.4!important;display:flex!important;width:20rem}.drawing_modal_container .current_letter_in_use{display:flex;width:50%}.bottom_buttons_wrapper,.drawing_board_and_current_letter_wrapper{align-items:center;display:flex;justify-content:center}.bottom_buttons_wrapper{gap:2rem;height:15%;width:100%}.bottom_buttons_wrapper button{border:0;border-radius:2rem;cursor:pointer;font-family:Poppins,cursvie;padding:1rem;transition:.3s}.bottom_buttons_wrapper button:hover{filter:brightness(80%)}.drawing_util_title{font-family:Playwrite GB S;font-size:1.5rem;font-weight:300}.modify{gap:2rem}.align_drawing_util,.modify,.modify button{align-items:center;display:flex;justify-content:center}.align_drawing_util,.modify button{background:#fff;border:3px solid #000;border-radius:1rem;box-shadow:5px 5px;color:#000;cursor:pointer;font-family:Playwrite gb s;font-size:1.4rem;padding:0 1rem;text-align:center;transition:.3s}.align_drawing_util{margin-bottom:2rem}.align_drawing_util:hover,.modify button:hover{filter:brightness(.8)}.drawing_letter_container,.line_width_container,.preview_letters_container{align-items:end;display:flex;flex-direction:column;gap:.5rem}.clear_canvas{border:2px solid #000;border-radius:2rem;cursor:pointer;font-family:Playwrite GB S,cursvie;height:fit-content;margin-top:1rem;padding:.4rem 1rem;transition:.3s}.line_boundary1{margin-top:9rem}.line_boundary1,.line_boundary2{background:#000;height:3px;position:absolute;width:25rem}.line_boundary2{margin-bottom:9rem}.cli_buttons_container button{border:2px solid #000;border-radius:1rem;font-family:Playwrite GB S;font-size:.7rem;font-weight:500;padding:.3rem 1rem}.save_whilst_move_on{border:2px solid #000;border-radius:1rem;font-family:Playwrite gb s}.display_letter{color:#00000040;font-family:Playwrite GB S;font-size:14rem;margin:0 0 4rem;position:absolute;text-align:center}.drawing_display,.drawing_wrapper{align-items:center;display:flex;flex-direction:column}.drawing_extra_wrapper .drawing_actions,.drawing_wrapper .drawing_actions{display:flex;flex-direction:row;gap:5rem;margin-top:2rem}.lock_scroll .lock_open{display:none}.delete_canvas img,.lock_scroll img{touch-action:none;width:1rem}.drawing_display button,.drawing_wrapper button{border:2px solid #000;border-radius:5px;box-shadow:5px 5px;cursor:pointer;padding:.5rem 1rem;transition:.3s}.drawing_display button:hover,.drawing_wrapper button:hover{box-shadow:3px 3px;filter:brightness(.8)}.drawing_extra_wrapper{align-items:center;display:flex;flex-direction:row}.drawing_wrapper>.clear_canvas{display:none}.drawing_display{display:none!important}.drawing_display[lock=true]{display:flex!important}body[lock=true],html[lock=true]{overflow:hidden;position:fixed}.drawing_wrapper[lock=true]>.clear_canvas{display:block!important}.drawing_wrapper[lock=true]{align-items:center;background:#000000a8;display:flex!important;height:100%;justify-content:center;position:fixed;top:0;width:100%;z-index:4}.close_drawing_util_wrapper,.open_drawing_util_wrapper{align-items:end;display:flex;width:100%}.navigation_bar[open=false]>.close_drawing_util_wrapper,.navigation_bar[open=false]>.drawing_util_title,.navigation_bar[open=false]>.utilities,.navigation_bar[open=true]>.open_drawing_util_wrapper{display:none!important}.navigation_bar[open=false]{border-top-left-radius:0;top:0}.close_drawing_util,.open_drawing_util{background:none;border:0;cursor:pointer;font-family:Playwrite gb s,cursive;font-size:2rem;margin:0;padding:.5rem 1rem;position:absolute;right:1rem;top:0}