.pinyin-editor button{display:block;width:1.75rem;height:2.5rem;margin:.125rem;border:0;background-color:#fff;text-decoration:none;text-align:center;border-radius:var(--gRadius);box-shadow:0 2px 0 rgbA(0, 0, 0, 0.2)}.pinyin-editor button:hover,.pinyin-editor button:focus{background-color:rgbA(var(--subRGB), 0.2)}.pinyin-editor button:active{background-color:rgbA(var(--subRGB), 0.5);outline:none;transform:translateY(1px)}ul.pinyin-toolbar{display:flex;flex-wrap:wrap;padding:.5rem;margin-top:1rem;margin-bottom:1rem;background-color:var(--grayLight);list-style-type:none;border-radius:var(--gRadius)}ul.pinyin-toolbar li{display:flex;overflow:hidden;margin-bottom:.25rem;border-radius:var(--gRadius)}ul.pinyin-toolbar li+li{margin-left:.5rem}ul.pinyin-toolbar button{font-size:var(--mediumFontSize)}@media(max-width:480px){ul.pinyin-toolbar li:nth-child(5){margin-left:0}}.pinyin-field{position:relative}.pinyin-field::before{content:"";position:absolute;top:0;bottom:0;left:1.5rem;width:4px;border:1px solid;border-color:rgba(0,0,0,0) #efe4e4}.pinyin-field textarea{padding:1.5rem;padding-left:2.25rem;border:2px solid var(--gray);background-color:#fff;background-image:linear-gradient(to top, #d9eaf3 0%, #fff 8%);background-position:top;background-size:100% 1.5rem;transition:var(--gTransition)}.pinyin-field textarea::-webkit-input-placeholder{color:rgbA(0, 0, 0, 0.3)}.pinyin-field textarea::-moz-placeholder{color:rgbA(0, 0, 0, 0.3)}.pinyin-field textarea:-ms-input-placeholder{color:rgbA(0, 0, 0, 0.3)}.pinyin-field textarea:-moz-placeholder{color:rgbA(0, 0, 0, 0.3)}.pinyin-field textarea:focus{outline:4px solid rgbA(var(--mainRGB), 0.4);box-shadow:none}.pinyin-tooltip{--translateX: -50%;--translateY: calc(100% - 1rem);position:absolute;top:0;left:0;display:flex;padding:.25rem;background-color:var(--grayLight);border-radius:var(--gRadius);counter-reset:pinyin-tooltip-counter;transform:translateX(var(--translateX)) translateY(var(--translateY));transition:var(--gTransition)}.pinyin-tooltip.--hidden{display:none}.pinyin-tooltip button{display:flex;align-items:center;width:auto;height:auto;padding:.25rem .5rem;counter-increment:pinyin-tooltip-counter}.pinyin-tooltip button::before{content:counter(pinyin-tooltip-counter);display:inline-block;width:1rem;background-color:rgbA(0, 0, 0, 0.05);margin-right:.25rem;color:rgbA(0, 0, 0, 0.5);font-size:var(--smallFontSize);font-size:70%;border-radius:var(--gRadius)}