@import"https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&family=Noto+Sans+Thai:wght@100..900&display=swap";*,*:after,*:before{margin:0;padding:0;box-sizing:inherit;touch-action:manipulation}html{height:100%;scroll-behavior:smooth;box-sizing:border-box;font-size:62.5%}@media (max-width: 1024px){html{font-size:56.25%}}@media (max-width: 500px){html{font-size:50%}}body{min-height:100%;display:flex;flex-direction:column;font-family:Manrope,sans-serif;color:#0d141c;line-height:1.5;overflow-wrap:break-word}#root{flex:1;background:linear-gradient(180deg,#1a80e514 0,#fff);display:flex;flex-direction:column}a{text-decoration:none}button{border:none;background:none;transition:all .175s ease-out}button:hover{cursor:pointer}button:disabled{opacity:.32;pointer-events:none}a,button,input[type=text],textarea{font-family:inherit;font-weight:inherit;font-size:inherit;color:inherit;line-height:inherit}input[type=checkbox],input[type=radio]{accent-color:#1a80e5}.app-spinner-container,.page-spinner-container{flex:1;display:flex;align-items:center;justify-content:center}.app-spinner-container .spinner,.page-spinner-container .spinner{font-size:4.8rem;color:#1a80e5}.app{flex:1;display:flex;flex-direction:column}.app .Toastify{font-size:1.6rem}.app .Toastify__toast{border-radius:.8rem;font-family:Manrope,sans-serif;white-space:pre-line}.app .Toastify__toast-icon{width:1.8rem;height:1.8rem}@media (min-width: 1280px){.app .Toastify{font-size:1.4rem}.app .Toastify__toast{min-height:6rem}.app .Toastify__toast-icon{width:1.6rem;height:1.6rem}}.translate{position:relative;display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:min-content;gap:4rem;flex:1;width:100%;max-width:1400px;margin:0 auto;padding:4rem}@media (max-width: 1440px){.translate{padding:2rem 4rem}}@media (max-width: 768px){.translate{padding:1rem 3rem 2rem}}@media (max-width: 500px){.translate{padding:1rem 2rem 2rem}}@media (max-width: 768px){.translate{grid-template-columns:1fr;gap:3rem}}@media (max-width: 500px){.translate{gap:2rem}}.translate__example-sentence{grid-column:1/-1}@media (min-width: 768px){.translate:not(:has(.translate__synonym)):has(.translate__more-translation) .translate__example-sentence{grid-row:2;grid-column:1}}.translate__main{position:relative;grid-column:1/-1;display:flex;column-gap:4rem}@media (max-width: 768px){.translate__main{flex-direction:column;row-gap:3rem}}@media (max-width: 500px){.translate__main{row-gap:2rem}}.translate__main--input,.translate__main--translation{flex:1;display:flex;flex-direction:column;row-gap:1.2rem}.translate__main--input .language,.translate__main--translation .language{display:flex;align-items:center;column-gap:1.2rem;width:fit-content}.translate__main--input .language.clickable:hover,.translate__main--translation .language.clickable:hover{cursor:pointer}.translate__main--input .language__text,.translate__main--translation .language__text{font-size:1.6rem}.translate__main--input .language__icon,.translate__main--translation .language__icon{width:1.2rem;transform:scaleY(-1);fill:#0d141c;transition:transform .15s ease-out}.translate__main--input .language__icon.active,.translate__main--translation .language__icon.active{transform:scaleY(1) translateY(1px)}.translate__main--input .input-container,.translate__main--translation .input-container{font-size:1.6rem;display:flex;flex-direction:column;justify-content:space-between;height:calc(9em + 6.1rem);row-gap:.8rem;border:1px solid #d1dbe8;border-radius:.8rem;background:#fff}.translate__main--input .input-container textarea,.translate__main--translation .input-container textarea{border:none;outline:none;resize:none;width:100%;height:100%;padding:0 1.2rem;margin-top:1rem;scrollbar-width:none;font-family:Noto Sans Thai,sans-serif}.translate__main--input .input-container textarea::placeholder,.translate__main--translation .input-container textarea::placeholder{color:#848c9e}.translate__main--input .input-container textarea:read-only,.translate__main--translation .input-container textarea:read-only{background:#fff;margin-bottom:1rem;color:#0d141c}.translate__main--input .input-container__bottom,.translate__main--translation .input-container__bottom{display:flex;justify-content:space-between;align-items:flex-end;padding:0 1.2rem 1rem}.translate__main--input .input-container__bottom--counter,.translate__main--translation .input-container__bottom--counter{font-size:1.2rem;color:#848c9e}.translate__main--input .input-container__bottom--button,.translate__main--translation .input-container__bottom--button{font-size:1.4rem;font-weight:500;padding:.6rem 1.2rem;border-radius:.6rem;background:#1a80e5;color:#f7fafc;font-family:Manrope,sans-serif;white-space:nowrap;transition:all .15s ease-out;min-width:9rem}.translate__main--input .input-container__bottom--button:hover,.translate__main--translation .input-container__bottom--button:hover{background:#1773ce}.translate__main--input .input-container__bottom--button.unauthenticated,.translate__main--translation .input-container__bottom--button.unauthenticated{font-size:1.4rem;font-weight:500;padding:.4rem 1.4rem;border-radius:.8rem;background:#fff;color:#0d141c;font-family:Manrope,sans-serif;white-space:nowrap;transition:all .15s ease-out;border:1px solid #0d141c;min-width:7.4rem}.translate__main--input .input-container__bottom--button.unauthenticated:hover,.translate__main--translation .input-container__bottom--button.unauthenticated:hover{background:#f7f7f7}.translate__main--input .input-container__bottom--button.unauthenticated:hover,.translate__main--translation .input-container__bottom--button.unauthenticated:hover{background:#0d141c;color:#fff}.translate__main .language-selector{top:3.6rem}@media (max-width: 768px){.translate__main .language-selector{top:0}}.translate__synonym .title,.translate__more-translation .title{font-size:1.8rem;font-weight:500;margin-bottom:1.4rem}.translate__synonym .list-container,.translate__more-translation .list-container{list-style-type:none;display:flex;column-gap:1.2rem;row-gap:1.2rem;flex-wrap:wrap}.translate__synonym .list-container .item,.translate__more-translation .list-container .item{font-size:1.4rem;font-weight:400;padding:.6rem 1.6rem;border-radius:1rem;background:#e8edf2;color:#0d141c;font-family:Noto Sans Thai,sans-serif;white-space:nowrap;transition:all .15s ease-out}.translate__synonym .list-container .item:hover,.translate__more-translation .list-container .item:hover{background:#dee5ec}.translate__example-sentence .title{font-size:1.8rem;font-weight:500;margin-bottom:1.4rem}.translate__example-sentence .list-container{list-style-type:none;display:flex;flex-direction:column;row-gap:1.2rem}.translate__example-sentence .list-container .item{font-family:Noto Sans Thai,sans-serif}.translate__example-sentence .list-container .item .sentence{font-size:1.6rem}.translate__example-sentence .list-container .item .translation{font-size:1.4rem;color:#4f7396}.spinner{height:1.5em;display:flex;align-items:center;justify-content:center}.spinner span{height:1em;aspect-ratio:1;border-radius:50%;display:inline-block;border-top:3px solid currentColor;border-right:3px solid transparent;animation:spin 1s linear infinite}.spinner span.thin{border-top-width:2px;border-right-width:2px}.language-selector{position:absolute;width:100%;background:#fff;border:1px solid #d1dbe8;border-radius:.8rem;overflow:hidden;display:flex;flex-direction:column;font-size:1.4rem;box-shadow:0 .8rem 2.4rem #d1dbe833}.language-selector__search-container{display:flex;align-items:center;column-gap:1.6rem;border-bottom:1px solid #d1dbe8;padding:0 2rem}.language-selector__search-container button{border-radius:50%}.language-selector__search-container button:hover{background:#e9f0f7}.language-selector__search-container button svg{display:block;width:3rem;height:3rem;padding:.8rem;fill:#0d141c}.language-selector__search-container input{padding:1.6rem 0;border:none;outline:none;flex:1}.language-selector__item-container{display:grid;grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));padding:.8rem;max-height:75dvh;overflow-y:auto}.language-selector__item-container.search-active{grid-template-columns:1fr}.language-selector__item-container .item{padding:1.2rem;white-space:nowrap;border-radius:.4rem}.language-selector__item-container .item:hover{background:#e9f0f7;cursor:pointer}.nav{display:flex;justify-content:space-between;align-items:center;padding:2rem 4rem;min-height:8rem}@media (max-width: 768px){.nav{padding:2rem 3rem}}@media (max-width: 500px){.nav{padding:2rem}}.nav__logo--text{font-size:1.8rem;font-weight:600}.sign-in-btn{font-size:1.4rem;font-weight:600;padding:.8rem 1.8rem;border-radius:1rem;background:#e8edf2;color:#0d141c;font-family:Manrope,sans-serif;white-space:nowrap;transition:all .15s ease-out;min-width:8.1rem}.sign-in-btn:hover{background:#dee5ec}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.profile{position:relative}.profile__picture{display:block;width:4rem;height:4rem;border-radius:50%;object-fit:cover;border:transparent solid 3px;transition:border-color .25s ease-out}.profile__picture:hover,.profile__picture.active{cursor:pointer;border-color:#d1dbe8}.profile__details{position:absolute;right:0;top:calc(100% + 1rem);background:#f2f5f8;border-radius:.8rem;z-index:1;box-shadow:0 .2rem .8rem #0d141c1a}.profile__details--personal-info{display:flex;align-items:center;column-gap:1.6rem;padding:1.4rem 1.6rem 1rem}.profile__details--personal-info .left .picture{width:5.6rem;height:5.6rem;border-radius:50%;object-fit:cover}.profile__details--personal-info .right{white-space:nowrap}.profile__details--personal-info .right .name{font-size:1.6rem;font-weight:500}.profile__details--personal-info .right .email{font-size:1.4rem;color:#848c9e}.profile__details--personal-info .close-btn{align-self:flex-start;border-radius:50%;margin:-.6rem -.6rem -.6rem -.4rem}.profile__details--personal-info .close-btn:hover{background:#e3e9ef}.profile__details--personal-info .close-btn svg{display:block;width:2.6rem;height:2.6rem;padding:.6rem;fill:#0d141c}.profile__sign-out-btn{display:flex;align-items:center;width:100%;font-size:1.4rem;padding:1.4rem 1.6rem}.profile__sign-out-btn svg{width:1.6rem;height:1.6rem;margin-right:1.6rem;fill:#0d141c}.profile__sign-out-btn:hover{background:#e8edf2}