:root{--bubble_color: #F0F4F7;--bubble_color: #F5F5F7}.grammar_view_split{display:flex;flex-direction:column;height:100%;overflow:auto}.split_hero{flex:0 0 50%;display:flex;flex-direction:row;align-items:center;justify-content:center}.split_character{flex:0 1 180px;height:80%;display:flex;align-items:center;margin-left:-20px}.split_bubble{flex:1;max-width:320px;background:#fff;color:#131415;padding:14px 18px;border-radius:18px;font-size:15px;font-weight:700;line-height:1.4;position:relative;box-shadow:0 5px 15px #0000004d}.split_bubble:after{content:"";position:absolute;left:-10px;top:50%;transform:translateY(-50%);border-top:10px solid transparent;border-bottom:10px solid transparent;border-right:12px solid #ffffff}.split_content_card{flex:0 0 50%;display:flex;align-items:flex-start;justify-content:center;padding:0 20px 20px}.split_scroll_area{background-color:#1e1e1e;background-color:var(--c-bg-card);border:2px solid #333333;border:2px solid var(--c-border);border-radius:10px;width:100%;max-width:500px;padding:20px;overflow-y:auto;display:flex;flex-direction:column}.grammar_view_centered{display:flex;flex-direction:column;height:100%;align-items:center;justify-content:center}.centered_bubble{background:var(--bubble_color);color:#131415;padding:20px 25px;border-radius:24px;font-size:18px;font-weight:700;line-height:1.4;text-align:center;position:relative;box-shadow:0 8px 20px #0006;max-width:90%;z-index:5}.centered_bubble:after{content:"";position:absolute;bottom:-12px;left:50%;transform:translate(-50%);border-left:12px solid transparent;border-right:12px solid transparent;border-top:15px solid #ffffff}.centered_character{flex:0 1 40%;display:flex;justify-content:center;align-items:flex-start}.grammar_view_text_only{padding:40px 20px;display:flex;justify-content:center;align-items:center;height:100%;background-color:#131415;background-color:var(--c-bg-body)}.text_only_scroll_area{background-color:#1e1e1e;background-color:var(--c-bg-card);border:2px solid #333333;border:2px solid var(--c-border);border-radius:10px;padding:20px;width:100%;max-width:600px;max-height:90%;overflow-y:auto}.char_img{max-height:100%;max-width:100%;object-fit:contain;filter:drop-shadow(0 10px 20px rgba(0,0,0,.5))}.char_img_big{height:300px;width:300px}.split_quiz_section .c_option{margin-left:0!important;width:100%;margin-top:10px}.char_img.is_happy{animation:bounceChar .5s ease-out}.char_img.is_angry{animation:shakeChar .4s ease-in-out}@keyframes bounceChar{0%{transform:translateY(0)}30%{transform:translateY(-15px)}50%{transform:translateY(0)}80%{transform:translateY(-7px)}to{transform:translateY(0)}}@keyframes shakeChar{0%,to{transform:translate(0) rotate(0)}25%{transform:translate(-6px) rotate(-4deg)}75%{transform:translate(6px) rotate(4deg)}}.split_rich_text h1,.split_rich_text h3,.text_only_scroll_area h1,.text_only_scroll_area h3{color:#23ac5e!important;color:var(--c-accent-green)!important;font-weight:800;font-size:1.3rem;margin-bottom:1rem}.split_rich_text h2,.text_only_scroll_area h2{color:#23ac5e!important;color:var(--c-accent-green)!important;font-weight:800;font-size:1.3rem;display:block;margin:0 auto;margin-bottom:1rem}.split_rich_text p,.text_only_scroll_area p{margin-bottom:1rem}.split_bubble b,.centered_bubble b,.centered_bubble strong{color:#1865f2!important;color:var(--c-accent-blue)!important;font-weight:800}.split_bubble i,.centered_bubble i{color:#9333ea!important;color:var(--c-accent-purple)!important}.split_rich_text,.text_only_rich_text,.centered_bubble{font-family:inherit}.split_rich_text b,.split_rich_text strong,.text_only_rich_text b,.text_only_rich_text strong{color:#23ac5e!important;color:var(--c-accent-green)!important;font-weight:800}.split_rich_text ul,.text_only_rich_text ul{list-style:none;padding:0;margin:15px 0}.split_rich_text li,.text_only_rich_text li{padding-left:20px;position:relative;margin-bottom:10px}.split_rich_text li:before,.text_only_rich_text li:before{content:"\2022";position:absolute;left:0;color:#23ac5e;color:var(--c-accent-green);font-weight:700;font-size:1.2em}.audio_word[data-audio]{background:#23ac5e26;color:#23ac5e;color:var(--c-accent-green);font-weight:700;padding:1px 8px;border-radius:10px;cursor:pointer;white-space:nowrap;text-decoration:none;-webkit-transition:background .15s,-webkit-transform .1s;transition:background .15s,transform .1s}.audio_word[data-audio]:after{content:"";display:inline-block;width:.8em;height:.8em;margin-left:4px;vertical-align:middle;opacity:.75;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 9v6h4l5 5V4L7 9H3zm13.5 3c0-1.77-1.02-3.29-2.5-4.03v8.05c1.48-.73 2.5-2.25 2.5-4.02zM14 3.23v2.06c2.89.86 5 3.54 5 6.71s-2.11 5.85-5 6.71v2.06c4.01-.91 7-4.49 7-8.77s-2.99-7.86-7-8.77z'/%3E%3C/svg%3E") center / contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 9v6h4l5 5V4L7 9H3zm13.5 3c0-1.77-1.02-3.29-2.5-4.03v8.05c1.48-.73 2.5-2.25 2.5-4.02zM14 3.23v2.06c2.89.86 5 3.54 5 6.71s-2.11 5.85-5 6.71v2.06c4.01-.91 7-4.49 7-8.77s-2.99-7.86-7-8.77z'/%3E%3C/svg%3E") center / contain no-repeat}.audio_word[data-audio]:hover{background:#23ac5e47}.audio_word[data-audio]:active{-webkit-transform:scale(.94);transform:scale(.94)}.cjk_ruby{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end;vertical-align:bottom}.cjk_ruby_unit{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;line-height:1.12;padding-left:.18em;padding-right:.18em}.cjk_ruby_py{font-size:.58em;font-weight:700;opacity:.95;white-space:nowrap;margin-bottom:2px}.cjk_ruby_base{font-size:1.35em;line-height:1.1}.gram_trc_ruby:after{display:none}.cjk_fg{color:#1865f2;color:var(--c-accent-blue);font-weight:700}.cjk_mode .split_rich_text,.cjk_mode .text_only_rich_text{font-size:1.18rem}.cjk_mode .split_rich_text h1,.cjk_mode .split_rich_text h2,.cjk_mode .split_rich_text h3,.cjk_mode .text_only_scroll_area h1,.cjk_mode .text_only_scroll_area h2,.cjk_mode .text_only_scroll_area h3{font-size:1.6rem}.cjk_mode .split_bubble,.cjk_mode .centered_bubble{font-size:1.15rem}.cjk_mode .c_option_text{font-size:1.2rem}