.word-box{position:relative;display:flex;border:1px ridge var(--dark-border-color);border-radius:4px;padding:.1rem;flex-wrap:wrap}@media screen and (max-width: 635px){.preceding-svg,.preceding-button,.following-button,.following-svg{display:none}.actions-menu{padding:1rem}.worddefo{top:30%}}.connector-line-svg{stroke-dasharray:1000;stroke-dashoffset:1000;animation:drawLine .8s cubic-bezier(.5,-.71,.7,.34) forwards}@keyframes drawLine{to{stroke-dashoffset:0}}.preceding-svg,.following-svg{position:relative;z-index:-2}.word-container{width:100%}.actions-menu{display:flex;flex-direction:column;justify-content:center;align-content:center;font-size:1.7rem;padding:}.preceding-button,.following-button{position:relative;width:2rem;height:2rem;font-size:.9rem;border-radius:50%;border:2px solid var(--soil-color-light);overflow:hidden;transition:transform .4s cubic-bezier(.165,.84,.44,1)}.preceding-button:hover,.following-button:hover{transform:scale(.8)}.preceding-button:hover:after,.following-button:hover:after{transform:translate(0)}.preceding-button:hover:before,.following-button:hover:before{transform:translate(0)}.following-button.buttonIsActive:before,.following-button.buttonIsActive:after,.preceding-button.buttonIsActive:before,.preceding-button.buttonIsActive:after{transform:translate(0)}.preceding-button:after,.following-button:after{position:absolute;content:"";bottom:0;right:0;width:100%;height:100%;transform:translate(1.5rem,1.5rem);border-radius:50%;background-color:var(--soil-color-light);opacity:.2;transition:transform .2s cubic-bezier(.165,.84,.44,1)}.preceding-button:before,.following-button:before{position:absolute;content:"";top:0;left:0;width:100%;height:100%;transform:translate(-1.5rem,-1.5rem);border-radius:100%;background-color:var(--soil-color-light);opacity:.3;transition:transform .3s cubic-bezier(.165,.84,.44,1)}.debug-border{border:1px solid gray}.preceding-word{opacity:0;transform:translate(-10px);animation:fadeInSlide .4s cubic-bezier(.5,-.71,.7,.34) forwards}.following-word{opacity:0;transform:translate(10px);animation:fadeInSlide .2s cubic-bezier(.5,-.71,.7,.34) forwards}@keyframes fadeInSlide{to{opacity:1;transform:translate(0)}}html.dark .preceding-word,.following-word{fill:#f9f9f4}.preceding-word.show{opacity:1;transform:translate(0)}html.dark .preceding-word{fill:#f9f9f4}.anchor-word{display:flex;align-items:center;gap:.5rem}.word-pop-enter-active,.word-pop-leave-active{transition:opacity .5s ease}.word-pop-enter-from,.word-pop-leave-to{opacity:0}.sentence-container{display:block;position:relative;overflow:hidden;padding-bottom:3.5rem;p,span{font-size:1.3rem}}.sentence-container p{transition:color .2s cubic-bezier(.5,-.71,.7,.34) .3s}.sentence-container:hover p{color:transparent;transition-delay:0s}.translation{position:absolute;top:0;left:0;width:100%;color:var(--soil-color-light);white-space:normal;transform:translate(-100%);opacity:0;transition:all .4s cubic-bezier(.5,-.71,.7,.34)}.sentence-container:hover .translation{transform:translate(0);opacity:1}.tip{font-size:.8rem;border-bottom:2px solid var(--dark-border-color);margin-bottom:.8rem}.sentences-box{margin-bottom:1rem}.block{border:2px solid var(--dark-border-color);padding:.5rem;border-radius:4px;width:100%}.blocks-grid{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin:1rem 0}.blocks-box{display:flex;padding:.5rem}.grammar-rules{display:grid;margin-bottom:1rem}.text-picker{border-bottom:2px solid var(--dark-border-color);display:flex;margin-bottom:1rem;select{border:1px solid var(--dark-border-color);border-radius:4px;padding:.2rem;margin-bottom:1rem}}.word-dashboard{margin-top:1rem;border-top:2px solid var(--dark-border-color);button{margin-top:.6rem;margin-right:.9rem;padding:.3rem;border:1px solid green;border-radius:4px}}.nouns{background-color:#fac83c;color:#000;padding:2px 0;border-radius:2px}.particles{background-color:#e85f6fe6;padding:2px 0;border-radius:2px}.adjectives{background-color:#3cc864;color:#000;padding:2px 0;border-radius:2px}.verbs{background-color:#4682c8;padding:2px 0;border-radius:2px}.adverbs{background-color:#cc73d6;padding:2px 0;border-radius:2px}html.dark .adverbs{background-color:#95439e}#zoom-btn,#unzoom-btn{padding:.2rem;border-radius:8px}#zoom-btn:hover,#unzoom-btn:hover{background-color:#0080006d;cursor:pointer;svg{transform:rotate(10deg)}}#nouns-button{border:2px solid rgb(250,200,60)}.nounsToggled{font-size:2rem}#adjectives-button{border:2px solid rgb(60,200,100)}#verbs-button{border:2px solid rgb(70,130,200)}#adverbs-button{border:2px solid rgb(204,115,214)}#particles-button{border:2px solid rgba(189,37,55,.559)}#nouns-button.active{background-color:#fac83c;color:#000}#adjectives-button.active{background-color:#3cc864;color:#000}#verbs-button.active{background-color:#4682c8}#adverbs-button.active{background-color:#cc73d6}.korean-compo{white-space:pre-wrap}.word-button{position:relative;transition:transform .1s cubic-bezier(.51,.38,.57,.69)}.word-button:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-color:#80808030;clip-path:circle(0% at top left);transition:clip-path .1s cubic-bezier(.11,.38,.57,.69);z-index:-1}.word-button:hover{transform:scale(1.1)}.word-button:hover:after{clip-path:circle(150% at top left)}.textchange-enter-active,.textchange-leave-active{transition:clip-path .3s cubic-bezier(.51,.38,.57,.69),opacity .3s ease}.textchange-enter-from,.textchange-leave-to{clip-path:inset(0 0 0 100%);opacity:0}.textchange-enter-to,.textchange-leave-from{clip-path:inset(0 0 0% 0);opacity:1}