@import"https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&family=Noto+Sans+Thai:wght@100..900&display=swap";.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}.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}.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}.sign-in-btn:hover{background:#dee5ec}.sign-in-btn{min-width:8.1rem}.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}.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__search-field{display:flex;align-items:center;column-gap:.8rem;flex:1}.language-selector__empty-state{padding:1.2rem;text-align:center;color:#848c9e}.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;border:none;background:transparent;width:100%;text-align:left;font:inherit;color:inherit}.language-selector__item-container .item:hover{background:#e9f0f7;cursor:pointer}.translation-results__output,.translation-results__synonym,.translation-results__more-translation,.translation-results__example-sentence{min-width:0}.translation-results__output{grid-column:2;grid-row:2}.translation-results__output .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}.translation-results__output .input-container textarea{border:none;outline:none;resize:none;width:100%;height:100%;padding:0 1.2rem;margin:1rem 0;scrollbar-width:none;font-family:Noto Sans Thai,sans-serif;background:#fff;color:#0d141c}@media(max-width:768px){.translation-results__output{grid-column:1;grid-row:auto}}.translation-results__synonym,.translation-results__more-translation{margin-top:2.8rem}.translation-results__synonym .title,.translation-results__more-translation .title{font-size:1.8rem;font-weight:500;margin-bottom:1.4rem}.translation-results__synonym .list-container,.translation-results__more-translation .list-container{list-style-type:none;display:flex;column-gap:1.2rem;row-gap:1.2rem;flex-wrap:wrap}.translation-results__synonym .item,.translation-results__more-translation .item{list-style-type:none}.translation-results__synonym .item button,.translation-results__more-translation .item button{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}.translation-results__synonym .item button:hover,.translation-results__more-translation .item button:hover{background:#dee5ec}.translation-results__synonym .item button:focus-visible,.translation-results__more-translation .item button:focus-visible{outline:2px solid #1a80e5;outline-offset:2px}@media(max-width:768px){.translation-results__synonym,.translation-results__more-translation{grid-column:1;margin-top:1.8rem}}@media(max-width:500px){.translation-results__synonym,.translation-results__more-translation{margin-top:.8rem}}.translation-results__synonym{grid-column:1}.translation-results__more-translation{grid-column:2}@media(max-width:768px){.translation-results__more-translation{grid-column:1;grid-row:auto}}.translation-results__example-sentence{grid-column:1/-1;margin-top:2.8rem}.translation-results__example-sentence .title{font-size:1.8rem;font-weight:500;margin-bottom:1.4rem}.translation-results__example-sentence .list-container{list-style-type:none;display:flex;flex-direction:column;row-gap:1.2rem}.translation-results__example-sentence .item{font-family:Noto Sans Thai,sans-serif}.translation-results__example-sentence .item .sentence{font-size:1.6rem}.translation-results__example-sentence .item .translation{font-size:1.4rem;color:#4f7396}@media(max-width:768px){.translation-results__example-sentence{grid-column:1;grid-row:auto;margin-top:1.8rem}}@media(max-width:500px){.translation-results__example-sentence{margin-top:.8rem}}.translation-workspace__input,.translation-workspace__control{display:flex;flex-direction:column;row-gap:1.2rem;min-width:0}.translation-workspace__input .language,.translation-workspace__control .language{display:flex;align-items:center;column-gap:1.2rem;width:fit-content}.translation-workspace__input .language.clickable:hover,.translation-workspace__control .language.clickable:hover{cursor:pointer}.translation-workspace__input .language__text,.translation-workspace__control .language__text{font-size:1.6rem}.translation-workspace__input .language__icon,.translation-workspace__control .language__icon{width:1.2rem;transform:scaleY(-1);fill:#0d141c;transition:transform .15s ease-out}.translation-workspace__input .language__icon.active,.translation-workspace__control .language__icon.active{transform:scaleY(1) translateY(1px)}.translation-workspace__input{grid-column:1;grid-row:1/span 2}.translation-workspace__input .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}.translation-workspace__input .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}.translation-workspace__input .input-container textarea::placeholder{color:#848c9e}.translation-workspace__input .input-container__bottom{display:flex;justify-content:space-between;align-items:flex-end;padding:0 1.2rem 1rem}.translation-workspace__input .input-container__bottom--counter{font-size:1.2rem;color:#848c9e}.translation-workspace__input .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}.translation-workspace__input .input-container__bottom--button:hover{background:#1773ce}.translation-workspace__input .input-container__bottom--button{min-width:9rem}.translation-workspace__input .input-container__bottom--button:focus-visible{outline:2px solid #1a80e5;outline-offset:2px}.translation-workspace__input .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}.translation-workspace__input .input-container__bottom--button.unauthenticated:hover{background:#f7f7f7}.translation-workspace__input .input-container__bottom--button.unauthenticated{border:1px solid #0d141c}.translation-workspace__input .input-container__bottom--button.unauthenticated:hover{background:#0d141c;color:#fff}.translation-workspace__input .input-container__bottom--button.unauthenticated{min-width:7.4rem}@media(max-width:768px){.translation-workspace__input{grid-column:1;grid-row:1}}.translation-workspace__control{position:relative;grid-column:2;grid-row:1;z-index:1}.translation-workspace__control .language-selector{top:3.6rem;right:0;width:calc(200% + 4rem)}@media(max-width:768px){.translation-workspace__control .language-selector{top:0;left:0;right:auto;width:100%;z-index:3}}@media(max-width:768px){.translation-workspace__control{position:static;grid-column:1;grid-row:2;margin-top:1.8rem}}@media(max-width:500px){.translation-workspace__control{margin-top:.8rem}}.translate{position:relative;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}}.translate__main{position:relative;display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:min-content;column-gap:4rem;row-gap:1.2rem}@media(max-width:768px){.translate__main{grid-template-columns:minmax(0,1fr);grid-auto-flow:row}}.translate__main>*{min-width:0}@media(min-width:768px){.translate__main:not(:has(.translation-results__synonym)):has(.translation-results__more-translation) .translation-results__example-sentence{grid-row:3;grid-column:1}}.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}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}*,*: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}
