.tools-overview{padding-bottom:32px}.tools-feature{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);grid-template-columns:1.5fr 1fr;align-items:center;gap:48px;padding:40px;display:grid}.tools-feature p{max-width:52ch}.tools-reading-feature{margin-top:24px}.tools-feature .tools-note{margin:18px 0 0}.tools-example{color:var(--muted);flex-direction:column;align-items:center;gap:8px;display:flex}.tools-example strong{font:64px/1.4 var(--serif);color:var(--red);letter-spacing:.15em}.tools-next,.tools-faq{grid-template-columns:1fr 1.5fr;gap:64px;display:grid}.tools-next a{border-top:1px solid var(--line);justify-content:space-between;padding:18px 0 8px;font-weight:600;display:flex}.tools-note{color:var(--muted);font-size:12px;line-height:1.65}.pinyin-page-heading .page-header{padding-bottom:28px}.pinyin-page-heading h1{font-size:44px}.pinyin-workspace{grid-template-columns:minmax(0,1fr) 256px;align-items:start;gap:40px;display:grid}.pinyin-editor{border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);min-width:0;overflow:clip}.pinyin-editor-top,.pinyin-compose,.pinyin-document{padding:24px}.pinyin-editor-top{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:16px;display:flex}.pinyin-editor-top h2{font:600 16px/1.5 var(--sans);letter-spacing:0;margin:0}.pinyin-script{border:0;gap:4px;margin:0;padding:0;display:flex}.pinyin-script label{cursor:pointer;margin:0;position:relative}.pinyin-script input{opacity:0;width:1px;height:1px;position:absolute}.pinyin-script span{border-radius:var(--radius);align-items:center;min-height:44px;padding:8px 12px;font-size:12px;display:flex}.pinyin-script input:checked+span{background:var(--red-soft);color:var(--red)}.pinyin-script input:focus-visible+span{outline:2px solid var(--jade);outline-offset:2px}.pinyin-compose>label,.pinyin-document>label{margin-bottom:8px;font-size:13px;font-weight:600;display:block}#pinyin-query{border:1px solid var(--line);border-radius:var(--radius);background:var(--paper);width:100%;min-width:0;min-height:54px;padding:12px 16px;font-size:20px}#pinyin-query:focus{outline:2px solid var(--jade);outline-offset:2px}#pinyin-query[aria-invalid=true]{border-color:var(--red)}#pinyin-hint{margin:10px 0 4px}.pinyin-examples{color:var(--muted);flex-wrap:wrap;align-items:center;gap:4px 12px;font-size:12px;display:flex}.pinyin-examples button{min-height:44px;color:var(--red);text-underline-offset:4px;padding:6px 0;text-decoration:underline}.pinyin-status{min-height:24px;color:var(--muted);margin:12px 0;font-size:12px}.pinyin-candidates{grid-template-columns:repeat(3,minmax(0,1fr));align-content:start;gap:8px;min-height:222px;display:grid}.pinyin-candidates:empty{min-height:0}.pinyin-candidate{text-align:left;background:var(--paper);border-radius:var(--radius);overflow-wrap:anywhere;flex-direction:column;justify-content:center;gap:2px;min-height:68px;padding:8px 8px 8px 28px;display:flex;position:relative}.pinyin-candidate:hover,.pinyin-candidate:focus-visible{background:var(--red-soft);color:var(--red)}.pinyin-candidate strong{font:22px/1.3 var(--serif);letter-spacing:0}.pinyin-candidate-number{color:var(--muted);font-size:11px;position:absolute;top:12px;left:10px}.pinyin-candidate-sound{color:var(--muted);font-size:11px;line-height:1.4}.pinyin-candidate-footer,.pinyin-document-footer{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.pinyin-candidate-footer{margin-top:12px}.pinyin-pager{font-variant-numeric:tabular-nums;align-items:center;gap:8px;font-size:12px;display:flex}.pinyin-pager button{min-width:44px;min-height:44px;font-size:20px}.pinyin-pager span{text-align:center;min-width:52px}.pinyin-editor .text-button{text-underline-offset:4px;min-height:44px;padding:8px;font-size:12px;text-decoration:underline}.pinyin-document{border-top:1px solid var(--line)}#pinyin-output{resize:vertical;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);width:100%;min-height:180px;color:var(--ink);padding:16px;font-size:20px;line-height:1.8;display:block}#pinyin-output::placeholder{font:14px/1.8 var(--sans);color:var(--muted)}.pinyin-document-footer{margin-top:12px}#pinyin-count{color:var(--muted);font-variant-numeric:tabular-nums;font-size:12px}.pinyin-actions{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.pinyin-actions .button{min-height:44px;padding:10px 18px;font-size:12px}#pinyin-count-note{margin:12px 0 0}.pinyin-help{padding-top:12px}.pinyin-help h2{font-size:26px}.pinyin-help ol{padding-left:20px;font-size:13px}.pinyin-help li{margin-bottom:20px;padding-left:4px}.pinyin-help li::marker{color:var(--red)}.pinyin-help li p{color:var(--muted);margin:4px 0 0}.pinyin-help summary,.tools-faq summary{cursor:pointer;min-height:48px;padding-block:14px;font-size:13px;font-weight:600}.pinyin-help details,.tools-faq details{border-top:1px solid var(--line)}.pinyin-shortcuts{margin:0 0 12px}.pinyin-shortcuts>div{justify-content:space-between;align-items:center;gap:8px;padding-block:5px;font-size:11px;display:flex}.pinyin-shortcuts dd{color:var(--muted);margin:0}.pinyin-shortcuts kbd{font:inherit;background:var(--soft);border-radius:3px;padding:2px 4px}.pinyin-private{border-top:1px solid var(--line);margin-top:24px;padding-top:20px;font-size:13px}.pinyin-private p{color:var(--muted);margin:6px 0 0}.tools-faq details p{color:var(--muted);font-size:14px}.pinyin-attribution{margin-top:24px}.pinyin-attribution a{text-underline-offset:3px;text-decoration:underline}.tools-noscript{color:var(--red);padding:0 24px}@media (width<=1000px){.pinyin-workspace{grid-template-columns:minmax(0,1fr) 220px;gap:24px}.pinyin-editor-top{flex-direction:column;align-items:flex-start;gap:8px}}@media (width<=760px){.tools-feature{grid-template-columns:1fr;gap:24px;padding:24px}.tools-example{border-top:1px solid var(--line);padding-top:24px}.tools-next,.tools-faq,.pinyin-workspace{grid-template-columns:minmax(0,1fr);gap:28px}.pinyin-page-heading h1{font-size:32px}.pinyin-editor-top,.pinyin-compose,.pinyin-document{padding:16px}.pinyin-candidates{gap:6px}.pinyin-candidate{padding-left:22px}.pinyin-candidate-number{left:7px}.pinyin-candidate strong{font-size:20px}.pinyin-candidate-sound{font-size:10px}.pinyin-document-footer{flex-direction:column;align-items:flex-start}.pinyin-help{padding-top:0}.pinyin-shortcuts>div{font-size:12px}}