.text-button-wrap{font-size:.8rem;display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;position:relative;margin-right:auto}.text-button-wrap .title{display:inline-block;margin-right:1rem;font-size:1rem;background:var(--bg);color:var(--sub);z-index:100;cursor:pointer}.text-button-wrap .button{display:inline-block;margin:0 .2rem}.text-button-wrap .button:not(.selected){position:absolute;color:var(--sub);opacity:0}.text-button-wrap.selecting .button{margin-right:.4rem}.text-button-wrap.selecting .button:not(.selected){position:relative;opacity:1}.text-button-wrap.selecting .button:not(.selected):hover{color:var(--major)}.major-color,.text-button-wrap:hover .title{color:var(--major)!important}nav{margin-top:2rem;grid-template-areas:"left right";display:grid;grid-auto-flow:column;grid-template-columns:1fr auto;align-items:center;gap:.5rem}nav .left-wing{font-size:2.3rem}nav.transparent{position:relative}nav.transparent,nav.transparent~.home{transform:translateY(-40px)}footer{margin-top:3rem}footer a{margin:2rem}.button-group{display:flex}.button-group .text-button{font-size:.8rem;margin-right:.5rem;cursor:pointer;color:var(--sub)}.button-group .text-button.on,.button-group .text-button:hover{color:var(--major)}.fade-enter-active{-webkit-animation:fade-in .5s;animation:fade-in .5s}.fade-leave-active{animation:fade-in .5s reverse}@-webkit-keyframes fade-in{0%{opacity:0}50%{opacity:.8}to{opacity:1}}@keyframes fade-in{0%{opacity:0}50%{opacity:.8}to{opacity:1}}#continue-button{position:absolute;top:0;bottom:0;left:0;right:0;display:flex;align-items:center;justify-content:center}#continue-button div svg{position:relative;color:var(--major);border-radius:50%;border:1.9px solid var(--major);padding:15px 12px 15px 18px;z-index:10;cursor:pointer}#continue-button div svg:hover{background:var(--major);opacity:.7;color:var(--bg)}#continue-button a{color:var(--major);z-index:10;margin:2rem;font-size:1.4rem}.fade-pinyin-enter-active{-webkit-animation:pinyin-fade-in .5s;animation:pinyin-fade-in .5s;-webkit-animation-timing-function:ease;animation-timing-function:ease}.fade-pinyin-leave-active{animation:pinyin-fade-in .5s reverse;-webkit-animation-timing-function:ease;animation-timing-function:ease}@-webkit-keyframes pinyin-fade-in{0%{position:relative;opacity:0;transform:scale(0)}50%{position:relative;opacity:.2}75%{transform:scale(1.1)}to{position:relative;opacity:1;transform:scale(1)}}@keyframes pinyin-fade-in{0%{position:relative;opacity:0;transform:scale(0)}50%{position:relative;opacity:.2}75%{transform:scale(1.1)}to{position:relative;opacity:1;transform:scale(1)}}#word-list-container{position:relative}#word-list-item-container{display:flex;flex-flow:row wrap;align-content:flex-start;overflow:hidden;position:relative}.word-list-item{box-sizing:content-box;margin:0 .8rem .2rem 0;text-align:center;margin-bottom:.6rem;display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative;font-weight:700}.word-list-item .pinyin{position:relative;font-size:.75rem;top:.1rem}#input-area{margin-top:1rem;display:flex;justify-content:space-between}#input-area input{flex:auto;padding:.4rem 0;font-size:1.2rem;font-family:JetBrains Mono,monospace;text-transform:capitalize}#input-area button{margin-left:1rem;padding:.4rem 1rem;border-radius:.2rem;border:none;font-size:1.2rem}@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:400;src:url(/fonts/jetbrains-mono-v3-latin-regular.eot);src:local(""),url(/fonts/jetbrains-mono-v3-latin-regular.eot?#iefix) format("embedded-opentype"),url(/fonts/jetbrains-mono-v3-latin-regular.woff2) format("woff2"),url(/fonts/jetbrains-mono-v3-latin-regular.woff) format("woff"),url(/fonts/jetbrains-mono-v3-latin-regular.ttf) format("truetype"),url(/fonts/jetbrains-mono-v3-latin-regular.svg#JetBrainsMono) format("svg")}*{transition:all .5s cubic-bezier(.17,.84,.44,1) 0s}body,html{margin:0;padding:0}main{font-family:Jetbrains Mono,Nimbus Roman No9 L,source-han-serif-sc,PingFang SC,Hiragino Sans GB,"Noto Serif SC",Microsoft Yahei,WenQuanYi Micro Hei,ST Heiti,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-align:center;max-width:850px;min-height:100vh;display:flex;margin:0 auto;padding:0 2rem;flex-flow:column}.abs{padding:1rem 0}.view{margin:auto;display:flex;align-items:center}.no-select{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.blur{filter:blur(4px)}.transparent{opacity:0}.pointer{cursor:pointer}#root{background-color:var(--bg)}#root[data-theme=BoW]{--bg:#f7f7f7;--major:#050505;--input:#f7f7f7;--sub:#a5a5a5;--correct:#050505;--wrong:#a8a7a7;--highlight:#00439b}#root[data-theme=BoW] #input-area input{color:var(--major)}#root[data-theme=WoB]{--bg:#050505;--major:#f7f7f7;--input:#f7f7f7;--sub:grey;--correct:#f7f7f7;--wrong:#7a7a7a;--highlight:#458eec}#root[data-theme=Olivia]{--bg:#1c1b1d;--major:#deaf9d;--input:#deaf9d;--sub:#705151;--correct:#deaf9d;--wrong:#88695d;--highlight:#de9db1}#root #input-area input{color:var(--input);background:var(--bg);border:none;border-bottom:2px solid var(--major)}#root #input-area input:focus{outline:none}#root .word-list-item{color:var(--major)}#root .pinyin{color:var(--sub)}#root .correct{color:var(--correct)}#root .wrong{color:var(--wrong)}#root .highlight{color:var(--highlight)}#root footer,#root nav{color:var(--major)}