.menu{display:flex;font-weight:700;-webkit-user-select:none;user-select:none;overflow:hidden}.menu .menu-items{transition:all ease .3s;cursor:pointer;font-size:1em;padding:2em 0}.menu .menu-items:hover .adj-item{opacity:.5}.menu .menu-items:hover .other-item{opacity:.1}.menu .menu-items .menu-item{padding:.5em 1.2em;line-height:1em}.menu .menu-items .menu-item:hover{opacity:.8}.menu .menu-items .selected-item{opacity:1}.menu .menu-items .adj-item,.menu .menu-items .other-item{opacity:0;transition:all ease .3s}.menu .show-items .adj-item{opacity:.5}.menu .show-items .other-item{opacity:.1}.background{position:absolute;left:0;top:0;height:100%;width:100%;display:flex;justify-content:space-between;overflow:hidden;pointer-events:none;z-index:-1}.background .bg-side{display:flex;flex-direction:column;font-weight:700;line-height:1;opacity:.05}.background .bg-side .chars{font-size:140px}.background .bg-side .shuangpin{padding:5px 0;font-size:3.5em;width:3.5em}.background .left{transform:translate(-60%);justify-content:flex-end;align-items:flex-end}.background .left .shuangpin{text-align:right}.background .right{transform:translate(60%);justify-content:flex-start;align-items:flex-start}.background .right .shuangpin{text-align:left}.keyboard{display:flex;justify-content:center;flex-direction:column;z-index:999}.key-row{display:flex;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none}.key-row .key-item{margin:5px;background-color:var(--gray-001);border-radius:5px;box-shadow:0 1px 2px var(--gray-010);text-align:center;padding:10px;height:40px;width:45px;display:flex;flex-direction:column;justify-content:space-between;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:1px solid var(--gray-001)}@media (max-width: 576px){.key-row .key-item{margin:5px 3px;height:60px}}.key-row .key-item.hint-key{border:1px solid #ab2b2b}.key-row .key-item.pressing{background-color:var(--gray-010)}.key-row .key-item .main-content{display:flex;justify-content:space-between;align-items:center}.key-row .key-item .main-content .main-key{font-size:16px;font-weight:700}@media (max-width: 576px){.key-row .key-item .main-content .main-key{font-size:20px}}.key-row .key-item .main-content .lead-key{font-size:14px;font-weight:700;color:#ab2b2b}@media (max-width: 576px){.key-row .key-item .main-content .lead-key{font-size:18px}}.key-row .key-item .bottom-content{display:flex;justify-content:center}.key-row .key-item .bottom-content .follow-key{font-size:14px;margin-right:2px;white-space:nowrap}.key-row .backspace{align-items:center;justify-content:center}@keyframes shift-right-01e0236d{0%{transform:translate(0)}to{transform:translate(100%)}}.displayer[data-v-01e0236d]{display:flex;align-items:center;justify-content:center;position:relative}.displayer .current-outset[data-v-01e0236d]{border:1px solid var(--black);padding:5px}.displayer .follow-item[data-v-01e0236d]{font-size:48px;font-weight:700;margin-right:10px;margin-top:-1px;position:absolute;right:0;transition:all ease .3s}.displayer .current-item[data-v-01e0236d]{height:54px;width:54px;display:flex;flex-direction:column;align-items:center;position:relative;padding:10px;border-radius:0}.displayer .current-item .mi-bg[data-v-01e0236d]{position:absolute;height:100%;width:100%;top:0;opacity:.2}.displayer .current-item .pinyin[data-v-01e0236d]{font-size:16px;position:absolute;top:-1px}.displayer .current-item .hanzi[data-v-01e0236d]{font-size:48px;font-weight:700}.pinyin-input{display:flex;font-weight:700;font-size:72px;line-height:1.2}.pinyin-input .cursor{position:relative;text-align:center;min-height:1.2em;min-width:.5em}.pinyin-input .cursor:first-child{margin-right:5px}.pinyin-input .cursor:after{position:absolute;bottom:0;left:0;content:"";width:100%;height:5px;background-color:var(--black);margin-top:5px}.pinyin-input .cursor:last-child:after{animation:alternate infinite .6s blink}@keyframes blink{0%{opacity:0}to{opacity:1}}.type-summary{text-align:right;font-weight:700}.home-page{display:flex;flex-direction:column;align-items:center;height:100%}.home-page .single-menu{position:absolute;top:0;left:100px}.home-page .input-area{margin-bottom:32px;height:160px;display:flex;align-items:center}@media (max-width: 576px){.home-page .input-area{margin-top:30vh}}.home-page .summary{position:absolute;right:var(--app-padding);bottom:var(--app-padding)}@media (max-width: 576px){.home-page .summary{top:36px}}.home-page .hanzi-list{position:absolute;top:var(--app-padding);right:var(--app-padding)}@media (max-width: 576px){.home-page .hanzi-list{top:120px}}@media (max-width: 576px){.home-page .single-keyboard{position:absolute;bottom:1em}}.light[data-v-ecbddfe9]{--primary-color: #ab2b2b;--black: #000;--gray-2: #222;--gray-4: #444;--gray-6: #666;--gray-9: #999;--gray-a: #aaa;--white: white;--gray-001: rgba(0, 0, 0, .01);--gray-002: rgba(0, 0, 0, .02);--gray-003: rgba(0, 0, 0, .03);--gray-010: rgba(0, 0, 0, .1)}.dark[data-v-ecbddfe9]{--primary-color: #ab2b2b;--black: #aaa;--gray-2: #222;--gray-4: #444;--gray-6: #666;--gray-9: #999;--gray-a: #aaa;--white: #222;--gray-001: rgba(255, 255, 255, .01);--gray-002: rgba(255, 255, 255, .02);--gray-003: rgba(255, 255, 255, .03);--gray-010: rgba(255, 255, 255, .1)}.dark img[data-v-ecbddfe9],.dark svg[data-v-ecbddfe9]{filter:invert(1)}[data-v-ecbddfe9]:root{--primary-color: #ab2b2b;--black: #000;--gray-2: #222;--gray-4: #444;--gray-6: #666;--gray-9: #999;--gray-a: #aaa;--white: white;--gray-001: rgba(0, 0, 0, .01);--gray-002: rgba(0, 0, 0, .02);--gray-003: rgba(0, 0, 0, .03);--gray-010: rgba(0, 0, 0, .1)}:root *[data-v-ecbddfe9]{transition:all ease .3s}@media (prefers-color-scheme: dark){[data-v-ecbddfe9]:root{--primary-color: #ab2b2b;--black: #aaa;--gray-2: #222;--gray-4: #444;--gray-6: #666;--gray-9: #999;--gray-a: #aaa;--white: #222;--gray-001: rgba(255, 255, 255, .01);--gray-002: rgba(255, 255, 255, .02);--gray-003: rgba(255, 255, 255, .03);--gray-010: rgba(255, 255, 255, .1)}:root img[data-v-ecbddfe9],:root svg[data-v-ecbddfe9]{filter:invert(1)}}[data-v-ecbddfe9]:root{--app-padding: 30px;--page-width: 1200px;--page-max-width: var(--page-width);--page-height: 720px}@media (max-width: 576px){[data-v-ecbddfe9]:root{--page-height: 100vh;--page-width: 100vw}}.p-mode[data-v-ecbddfe9]{display:flex;flex-direction:column;height:100%}.p-mode .display-area[data-v-ecbddfe9]{padding:0 64px 32px 32px;flex:1;display:flex;align-items:center;justify-content:center}@media (max-width: 576px){.p-mode .display-area[data-v-ecbddfe9]{flex-direction:column;padding:var(--app-padding)}}.p-mode .display-area.editing[data-v-ecbddfe9]{align-items:flex-start}@media (max-width: 576px){.p-mode .display-area.editing[data-v-ecbddfe9]{align-items:center}}.p-mode .display-area .p-title[data-v-ecbddfe9]{margin-right:32px;width:260px;display:flex;flex-direction:column;align-items:flex-end}@media (max-width: 576px){.p-mode .display-area .p-title[data-v-ecbddfe9]{width:100vw;padding-right:calc(var(--app-padding) + 2px);margin-right:0;box-sizing:border-box}}.p-mode .display-area .p-title .pinyin[data-v-ecbddfe9]{font-size:12px}.p-mode .display-area .p-title .title-info[data-v-ecbddfe9]{display:flex;align-items:center;margin-top:8px}.p-mode .display-area .p-title .title-info .answer[data-v-ecbddfe9]{font-size:24px;margin-right:16px;font-weight:700;border-top:1px solid var(--black);border-bottom:1px solid var(--black)}.p-mode .display-area .p-title .title-and-count[data-v-ecbddfe9]{display:flex;flex-direction:column;align-items:flex-end;font-weight:700;font-size:12px}.p-mode .display-area .p-title .title-and-count .title[data-v-ecbddfe9]{max-width:160px;text-align:right}@media (max-width: 576px){.p-mode .display-area .p-title .title-and-count .title[data-v-ecbddfe9]{max-width:100vw}}.p-mode .display-area .p-title .article-menu[data-v-ecbddfe9]{display:none;height:110px}.p-mode .display-area .p-title[data-v-ecbddfe9]:hover,.p-mode .display-area .p-title.editing[data-v-ecbddfe9]{flex-direction:column}@media (max-width: 576px){.p-mode .display-area .p-title[data-v-ecbddfe9]:hover,.p-mode .display-area .p-title.editing[data-v-ecbddfe9]{align-items:center}}.p-mode .display-area .p-title:hover .pinyin[data-v-ecbddfe9],.p-mode .display-area .p-title.editing .pinyin[data-v-ecbddfe9],.p-mode .display-area .p-title:hover .title-info[data-v-ecbddfe9],.p-mode .display-area .p-title.editing .title-info[data-v-ecbddfe9],.p-mode .display-area .p-title:hover .title-and-count[data-v-ecbddfe9],.p-mode .display-area .p-title.editing .title-and-count[data-v-ecbddfe9]{display:none}.p-mode .display-area .p-title:hover .article-menu[data-v-ecbddfe9],.p-mode .display-area .p-title.editing .article-menu[data-v-ecbddfe9]{display:flex;flex-direction:column;position:relative}.p-mode .display-area .p-title:hover .article-menu .menu[data-v-ecbddfe9],.p-mode .display-area .p-title.editing .article-menu .menu[data-v-ecbddfe9]{overflow:visible}.p-mode .display-area .p-title:hover .article-menu .delete-btn[data-v-ecbddfe9],.p-mode .display-area .p-title.editing .article-menu .delete-btn[data-v-ecbddfe9]{color:#ab2b2b;opacity:.5;font-size:14px;cursor:pointer;font-weight:700;transition:all ease .3s;margin-top:16px;text-align:center;position:absolute;bottom:-10px;padding-left:1.4em}.p-mode .display-area .p-title:hover .article-menu .delete-btn[data-v-ecbddfe9]:hover,.p-mode .display-area .p-title.editing .article-menu .delete-btn[data-v-ecbddfe9]:hover{opacity:1}.p-mode .display-area .text-area[data-v-ecbddfe9]{position:relative;width:50vw;max-width:calc(.6 * var(--page-max-width))}@media (max-width: 576px){.p-mode .display-area .text-area[data-v-ecbddfe9]{width:100vw;max-width:calc(100vw - var(--app-padding) * 2)}}.p-mode .display-area .text-area .scroll-area[data-v-ecbddfe9]{overflow-y:scroll;height:240px;position:relative;margin:8px 0;font-size:20px;line-height:1.6}@media (max-width: 576px){.p-mode .display-area .text-area .scroll-area[data-v-ecbddfe9]{height:35vh;font-size:22px}}.p-mode .display-area .text-area .scroll-area .bg-text[data-v-ecbddfe9]{opacity:1;color:var(--black)}.p-mode .display-area .text-area .scroll-area .done-text[data-v-ecbddfe9]{opacity:1;color:#22c55e}.p-mode .display-area .text-area .scroll-area .current-text[data-v-ecbddfe9]{text-decoration:underline;text-underline-offset:2px;opacity:1;color:#ab2b2b;font-weight:700}.p-mode .display-area .editing-text-area[data-v-ecbddfe9]{display:flex;flex-direction:column;margin-top:40px;width:50vw;max-width:calc(.6 * var(--page-max-width))}@media (max-width: 576px){.p-mode .display-area .editing-text-area[data-v-ecbddfe9]{width:100vw;max-width:calc(100vw - var(--app-padding) * 2)}}.p-mode .display-area .editing-text-area .editing-bar[data-v-ecbddfe9]{display:flex;align-items:center;margin-bottom:16px}.p-mode .display-area .editing-text-area .editing-bar .editing-title[data-v-ecbddfe9]{font-family:inherit;font-size:14px;font-weight:700;border:0;outline:none;padding:0 8px;color:#ab2b2b;border-left:5px solid #ab2b2b;flex:1;background-color:transparent}.p-mode .display-area .editing-text-area .editing-bar .save-btn[data-v-ecbddfe9]{color:#ab2b2b;font-size:14px;cursor:pointer}.p-mode .display-area .editing-text-area .editing-bar .save-btn.disable[data-v-ecbddfe9]{color:var(--gray-a)}.p-mode .display-area .editing-text-area .editing-text[data-v-ecbddfe9]{font-family:inherit;font-size:16px;font-weight:700;border:0;outline:none;height:calc(var(--page-height) - 200px);resize:none;border:3px double var(--gray-6);color:var(--black);background-color:transparent;padding:8px 8px 8px 10px}@media (max-width: 576px){.p-mode .display-area .editing-text-area .editing-text[data-v-ecbddfe9]{height:calc(var(--page-height) - 300px);font-size:18px}}.p-mode .keyboard-area[data-v-ecbddfe9]{margin-top:0;margin-left:150px;padding-bottom:100px}@media (max-width: 576px){.p-mode .keyboard-area[data-v-ecbddfe9]{margin-top:10px;margin-left:0;padding-bottom:20px}}.p-mode .summary[data-v-ecbddfe9]{position:absolute;right:var(--app-padding);bottom:var(--app-padding)}@media (max-width: 576px){.p-mode .summary[data-v-ecbddfe9]{top:36px}}.input{background-color:var(--white);border:1px solid var(--gray-010);padding:8px;color:var(--black);outline:none;font-family:inherit}.scale-to-center-enter-active,.scale-to-center-leave-active{transition:all .3s ease;opacity:1;max-height:45px}.scale-to-center-leave-to,.scale-to-center-enter-from{opacity:0;max-height:0}.keyboard{position:relative}.keyboard .keyboard-name{display:flex;align-items:center;margin:auto;position:relative;height:40px;transform:translateY(-20px)}.keyboard .keyboard-name .keyboard-name-input{color:var(--black);background-color:var(--white);outline:none;font-family:inherit;border:0;border-bottom:2px solid var(--gray-010);padding-bottom:4px;font-size:16px;line-height:1.2;font-weight:bolder}.keyboard .keyboard-name .keyboard-name-input::placeholder{color:var(--gray-010)}.keyboard .keyboard-name .keyboard-name-input:focus{border-color:var(--primary-color)}.keyboard .keyboard-name .submit-btn{position:absolute;right:0;bottom:14px;cursor:pointer;color:var(--gray-010);font-size:12px}.keyboard .keyboard-name .active-btn{color:var(--primary-color)}.key-item{position:relative;cursor:pointer}.key-item:active{background-color:var(--gray-010)}.key-item .edit-popup{position:absolute;top:-160px;left:-80%;display:flex;flex-direction:column;background-color:var(--white);padding:14px;border:1px solid var(--gray-010);box-shadow:0 0 20px #0000001a;font-size:14px}.key-item .edit-popup .edit-line{display:flex;align-items:center;margin-bottom:14px}.key-item .edit-popup .edit-line .edit-label{margin-right:8px;width:40px;font-weight:bolder}.key-item .edit-popup .edit-line .edit-input{background-color:var(--white);border:1px solid var(--gray-010);padding:8px;color:var(--black);outline:none;font-family:inherit;max-width:60px}.key-item .edit-popup .edit-confirm-btn{cursor:pointer;color:var(--primary-color)}.key-item .edit-popup .edit-confirm-btn:hover{font-weight:700}.zero-config{display:flex;justify-content:center;padding:20px 0}.zero-config .zero-item{display:flex;flex-direction:column;align-items:center;font-size:12px;border-top:2px double var(--gray-6);border-bottom:2px double var(--gray-6)}.zero-config .zero-item .zero-text{border-bottom:2px double var(--gray-6);border-width:1px;font-weight:bolder}.zero-config .zero-item .sp-text{font-style:italic;background-color:var(--white);color:var(--black)}.zero-config .zero-item .sp-text.editing{cursor:pointer}.zero-config .zero-item input.sp-text{box-sizing:border-box;border:none;background:var(--primary-color);color:var(--white);height:100%;font-family:inherit;font-size:inherit}.zero-config .zero-item .zero-text,.zero-config .zero-item .sp-text{width:50px;padding:3px 0;text-align:center}.light[data-v-a3c438ef]{--primary-color: #ab2b2b;--black: #000;--gray-2: #222;--gray-4: #444;--gray-6: #666;--gray-9: #999;--gray-a: #aaa;--white: white;--gray-001: rgba(0, 0, 0, .01);--gray-002: rgba(0, 0, 0, .02);--gray-003: rgba(0, 0, 0, .03);--gray-010: rgba(0, 0, 0, .1)}.dark[data-v-a3c438ef]{--primary-color: #ab2b2b;--black: #aaa;--gray-2: #222;--gray-4: #444;--gray-6: #666;--gray-9: #999;--gray-a: #aaa;--white: #222;--gray-001: rgba(255, 255, 255, .01);--gray-002: rgba(255, 255, 255, .02);--gray-003: rgba(255, 255, 255, .03);--gray-010: rgba(255, 255, 255, .1)}.dark img[data-v-a3c438ef],.dark svg[data-v-a3c438ef]{filter:invert(1)}[data-v-a3c438ef]:root{--primary-color: #ab2b2b;--black: #000;--gray-2: #222;--gray-4: #444;--gray-6: #666;--gray-9: #999;--gray-a: #aaa;--white: white;--gray-001: rgba(0, 0, 0, .01);--gray-002: rgba(0, 0, 0, .02);--gray-003: rgba(0, 0, 0, .03);--gray-010: rgba(0, 0, 0, .1)}:root *[data-v-a3c438ef]{transition:all ease .3s}@media (prefers-color-scheme: dark){[data-v-a3c438ef]:root{--primary-color: #ab2b2b;--black: #aaa;--gray-2: #222;--gray-4: #444;--gray-6: #666;--gray-9: #999;--gray-a: #aaa;--white: #222;--gray-001: rgba(255, 255, 255, .01);--gray-002: rgba(255, 255, 255, .02);--gray-003: rgba(255, 255, 255, .03);--gray-010: rgba(255, 255, 255, .1)}:root img[data-v-a3c438ef],:root svg[data-v-a3c438ef]{filter:invert(1)}}.slide-from-bottom-enter-active[data-v-a3c438ef],.slide-from-bottom-leave-active[data-v-a3c438ef]{transition:all .3s ease;margin-top:0;opacity:1}.slide-from-bottom-leave-to[data-v-a3c438ef],.slide-from-bottom-enter-from[data-v-a3c438ef]{margin-top:-95px;opacity:0}.settings-page[data-v-a3c438ef]{display:flex;flex-direction:column;align-items:center}@media (max-width: 576px){.settings-page[data-v-a3c438ef]{height:100vh;padding-top:20vh}}.settings-page .settings[data-v-a3c438ef]{padding-top:32px;display:grid;grid-template-columns:repeat(2,1fr);gap:16px 32px}.settings-page .setting-item[data-v-a3c438ef]{display:flex;font-weight:700;cursor:pointer}.settings-page .setting-item .setting-name[data-v-a3c438ef]{color:#ab2b2b;margin-right:16px}.settings-page .mode-setting[data-v-a3c438ef]{align-items:baseline;max-height:6em;margin-bottom:2px}.settings-page .mode-setting .setting-name[data-v-a3c438ef]{height:2em}.settings-page .mode-setting:hover .mode-actions[data-v-a3c438ef]{opacity:1}.settings-page .mode-setting .mode-actions[data-v-a3c438ef]{display:flex;align-items:center;cursor:default;opacity:0;width:120px;margin-right:-120px}.settings-page .mode-setting .mode-actions .mode-action[data-v-a3c438ef]{margin-right:5px;cursor:pointer;color:var(--black);width:0;overflow:hidden;white-space:nowrap;opacity:0}.settings-page .mode-setting .mode-actions .mode-action.show[data-v-a3c438ef]{width:35px;opacity:.5}.settings-page .mode-setting .mode-actions .mode-action[data-v-a3c438ef]:hover{opacity:1}.settings-page .mode-setting .mode-actions .mode-action[data-v-a3c438ef]:last-child{margin-right:0}.settings-page .mode-setting .mode-actions.hide[data-v-a3c438ef]{width:0}@media (max-width: 576px){.settings-page .mode-config[data-v-a3c438ef]{position:absolute;bottom:var(--app-padding)}}body{margin:0;padding:0;font-family:"Noto Serif SC","Source Han Serif SC",source-han-serif-sc,serif;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:rgba(0,0,0,0);background-color:var(--white);font-size:18px}.light{--primary-color: #ab2b2b;--black: #000;--gray-2: #222;--gray-4: #444;--gray-6: #666;--gray-9: #999;--gray-a: #aaa;--white: white;--gray-001: rgba(0, 0, 0, .01);--gray-002: rgba(0, 0, 0, .02);--gray-003: rgba(0, 0, 0, .03);--gray-010: rgba(0, 0, 0, .1)}.dark{--primary-color: #ab2b2b;--black: #aaa;--gray-2: #222;--gray-4: #444;--gray-6: #666;--gray-9: #999;--gray-a: #aaa;--white: #222;--gray-001: rgba(255, 255, 255, .01);--gray-002: rgba(255, 255, 255, .02);--gray-003: rgba(255, 255, 255, .03);--gray-010: rgba(255, 255, 255, .1)}.dark img,.dark svg{filter:invert(1)}:root{--primary-color: #ab2b2b;--black: #000;--gray-2: #222;--gray-4: #444;--gray-6: #666;--gray-9: #999;--gray-a: #aaa;--white: white;--gray-001: rgba(0, 0, 0, .01);--gray-002: rgba(0, 0, 0, .02);--gray-003: rgba(0, 0, 0, .03);--gray-010: rgba(0, 0, 0, .1)}:root *{transition:all ease .3s}@media (prefers-color-scheme: dark){:root{--primary-color: #ab2b2b;--black: #aaa;--gray-2: #222;--gray-4: #444;--gray-6: #666;--gray-9: #999;--gray-a: #aaa;--white: #222;--gray-001: rgba(255, 255, 255, .01);--gray-002: rgba(255, 255, 255, .02);--gray-003: rgba(255, 255, 255, .03);--gray-010: rgba(255, 255, 255, .1)}:root img,:root svg{filter:invert(1)}}:root{--app-padding: 30px;--page-width: 1200px;--page-max-width: var(--page-width);--page-height: 720px}@media (max-width: 576px){:root{--page-height: 100vh;--page-width: 100vw}}#app{display:flex;height:100vh;width:100vw;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none}.content{box-sizing:border-box;width:var(--page-width);max-width:var(--page-max-width);height:var(--page-height);box-shadow:10px 20px 60px #0000001a;border-radius:0;padding:var(--app-padding);border:1px solid var(--gray-010);position:relative;color:var(--black);display:flex;flex-direction:column;align-items:center;overflow:hidden}.main-menu{color:#ab2b2b;position:absolute;top:0;left:0}.main-menu .selected-item{background-color:#ab2b2b;color:#fff}.page{position:absolute;top:0;left:0;width:100%;height:100%}*::-webkit-scrollbar{width:5px}*::-webkit-scrollbar-track{background-color:var(--gray-002)}*::-webkit-scrollbar-thumb{background-color:var(--gray-003)}