:root{--bg:#f5f5ed;--ink:#243e30;--green:#28563f;--muted:#778072;--line:#dce0d3;--yellow:#e8e4ab;--paper:#fcfcf7;--error:#a43927;font-family:'PingFang SC','Microsoft YaHei',sans-serif;color:var(--ink);background:var(--bg);font-synthesis:none}*{box-sizing:border-box}body{margin:0}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}button,a,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer;border:1px solid var(--line);border-radius:9px;background:transparent;color:var(--ink);min-height:44px;padding:10px 16px;font-size:13px;font-weight:550;transition:background .18s,transform .18s}button:hover:not(:disabled){background:#e9ecdf}button:active:not(:disabled){transform:translateY(1px)}button:disabled{opacity:.42;cursor:not-allowed}button:focus-visible,a:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #9eb77a;outline-offset:4px}[hidden]{display:none!important}.topbar{max-width:1200px;margin:0 auto;height:92px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{font-weight:650;display:flex;align-items:center;gap:9px;font-size:19px}.brand-mark{font-size:37px;font-weight:400}.brand-en{font-family:monospace;font-size:10px;font-weight:400;letter-spacing:1.8px;border-left:1px solid #bac5b2;margin-left:14px;padding-left:22px}.help-link{font-size:13px;display:flex;gap:18px}.help-link:hover{color:#618052}main{max-width:1040px;margin:0 auto}.intro{padding:53px 0 34px}.eyebrow{font-family:monospace;font-size:10px;letter-spacing:1.7px;font-weight:500}.intro .eyebrow{letter-spacing:2px;font-size:11px;display:flex;align-items:center;gap:8px}.intro .eyebrow span{width:6px;height:6px;background:#718d43;border-radius:50%}h1{font-family:'Songti SC','STSong','Noto Serif CJK SC',serif;font-size:45px;line-height:1.35;letter-spacing:2px;font-weight:600;margin:18px 0 14px}h1 em{font-style:normal;position:relative;z-index:0}h1 em:after{content:'';position:absolute;bottom:0;left:2px;right:3px;height:12px;background:var(--yellow);z-index:-1;transform:rotate(-1deg)}.intro-copy{font-size:13px;color:var(--muted);line-height:1.8;margin:0}.workspace{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}.editor{padding-top:23px}.step-heading{display:flex;align-items:center;gap:11px;margin-bottom:24px}.step{font-family:Georgia,serif;font-style:italic;font-size:15px;color:#8d997f}.step-heading h2{font-size:15px;font-weight:600;margin:0}.subtle{margin-left:auto;color:#929a89;font-size:11px}.field-label{font-size:12px;display:block;margin-bottom:10px}textarea{width:100%;height:90px;resize:vertical;min-height:80px;max-height:180px;border:1px solid #ced6c6;border-radius:10px;background:var(--paper);padding:16px;font-size:14px;line-height:1.6;color:var(--ink);transition:border .2s}textarea:focus{border-color:var(--green)}.field-foot{display:flex;justify-content:space-between;gap:15px;font-size:10px;color:var(--muted);margin-top:9px}.settings{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:29px}.settings label{font-size:12px;display:grid;gap:10px}select{border:1px solid #d4dace;background:var(--paper);border-radius:8px;min-height:44px;padding:8px 12px;color:var(--ink);font-size:12px;width:100%;cursor:pointer}.setting-hint{font-size:11px;color:var(--muted);line-height:1.7;margin:12px 0 24px}.primary{background:var(--green);border-color:var(--green);color:white}.primary:hover:not(:disabled){background:#1b412e}.generate{width:100%;display:flex;justify-content:space-between;align-items:center;padding:12px 20px;height:49px;font-size:14px}.generate span:last-child{font-size:22px;font-weight:400}.error{font-size:12px;line-height:1.7;color:var(--error);background:#fbebe5;border:1px solid #edd0c5;border-radius:8px;padding:10px 14px}.avatar-section{border-top:1px solid var(--line);margin-top:30px;padding-top:28px}.avatar-section .step-heading{margin-bottom:17px}.avatar-box{display:flex;align-items:center;gap:15px}.avatar-button{padding:0;border:1px dashed #b9c7a5;border-radius:50%;min-height:58px;width:58px;flex-shrink:0;overflow:hidden;font-size:25px;font-weight:300;color:#769358;background:#f0f2e5}#avatar-preview{display:flex;align-items:center;justify-content:center;width:56px;height:56px}#avatar-preview img{width:100%;height:100%;object-fit:cover}.avatar-copy strong{font-size:12px;font-weight:500}.avatar-copy p{font-size:10px;color:var(--muted);line-height:1.7;margin:5px 0 0}.text-button{padding:4px 7px;border:0;font-size:11px;margin-left:auto;text-decoration:underline}.local-note{display:flex;gap:10px;align-items:center;margin-top:26px;color:var(--muted)}.local-note>span{font-size:25px;color:#7b8f62}.local-note p{font-size:10px;line-height:1.9;margin:0}.local-note strong{font-size:11px;font-weight:500;color:#607255}.preview-panel{background:#fdfdf9;border:1px solid #d8dfce;border-radius:17px;padding:24px 26px 19px;box-shadow:0 8px 32px #2c453307}.preview-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.preview-heading .eyebrow{font-size:9px;color:#809072;letter-spacing:1.5px}.status{font-size:10px;color:#6c854a;display:flex;align-items:center;gap:6px}.status:before{content:'';width:5px;height:5px;border-radius:50%;background:currentColor}.status.pending{color:#9b8142}.preview-stage{padding:16px;background-image:radial-gradient(#dfe5d7 .65px,transparent .65px);background-size:13px 13px;border-radius:10px;margin-top:19px;aspect-ratio:1}.preview{background:white;border-radius:6px;width:100%;height:100%;box-shadow:0 4px 20px #2c453305;transition:opacity .2s;display:flex;align-items:center;justify-content:center}.preview img{display:block;width:100%;height:auto;border-radius:6px}.preview.stale{opacity:.35}.preview-empty{text-align:center;color:var(--muted);padding:30px;font-size:13px;line-height:2}.code-meta{display:flex;justify-content:space-between;font-family:monospace;font-size:9px;letter-spacing:.6px;color:#7b8772;margin:15px 1px 20px}.export-settings{display:flex;align-items:center;justify-content:space-between;margin:0 0 13px}.export-settings label{font-size:11px;color:#748069}.export-settings select{width:137px;min-height:34px;font-family:monospace;font-size:11px;padding:6px 10px}.export{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:8px}.export button{font-size:11px;padding:9px 6px;white-space:nowrap}.export-hint{font-size:10px;text-align:center;color:#87917d;margin:14px 0 0;line-height:1.6}.compatibility{display:flex;align-items:flex-start;gap:9px;background:#eeefe3;border-radius:8px;padding:12px 16px;margin:30px 0 0;color:#717b61}.compatibility>span{font-size:14px}.compatibility p{font-size:10px;line-height:1.8;margin:0}.compatibility a{text-decoration:underline;text-underline-offset:3px;margin-left:7px}.quick-guide{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;padding:31px 0 33px}.quick-guide>div{border-left:1px solid #d8ddcf;padding-left:17px}.quick-guide span{font-family:monospace;font-size:9px;color:#909b80;letter-spacing:1px}.quick-guide h3{font-size:12px;font-weight:500;margin:10px 0 6px}.quick-guide p{font-size:10px;color:var(--muted);margin:0;line-height:1.7}footer{max-width:1200px;margin:auto;border-top:1px solid var(--line);padding:25px 0 32px;display:flex;justify-content:space-between;font-size:11px;color:#77806c}.footer-small{font-size:10px;margin-left:18px;color:#969f8b}footer>span:last-child{font-size:10px}.guide{max-width:800px;padding-bottom:60px}.guide h1{font-size:36px}.guide h2{font-size:20px;margin-top:36px}.guide h3{font-size:15px;margin-top:24px}.guide p,.guide li{font-size:14px;line-height:1.95;color:#5d6e59}.guide a{text-decoration:underline;text-underline-offset:3px}.guide table{width:100%;border-collapse:collapse;font-size:13px;line-height:1.7}.guide th,.guide td{padding:12px;text-align:left;border-bottom:1px solid var(--line)}.guide th{background:#eaeede}.guide code{background:#e9edde;border-radius:4px;padding:2px 6px;font-size:12px}.guide pre{white-space:pre-wrap;overflow-wrap:anywhere;background:#e9edde;padding:17px;border-radius:10px;line-height:1.8;font-size:12px}.guide .back{display:inline-block;margin-top:28px;font-size:12px}.guide .callout{border-left:3px solid #859b5c;background:#ecefdf;padding:13px 18px;border-radius:0 8px 8px 0}
@media(min-width:900px){.intro{animation:enter .5s ease-out}.workspace{animation:enter .65s ease-out}}@keyframes enter{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}@media(max-width:1260px){.topbar,footer{margin-left:36px;margin-right:36px}main{margin-left:auto;margin-right:auto;width:calc(100% - 120px);max-width:1040px}}@media(max-width:900px){main{width:calc(100% - 64px)}.workspace{gap:28px}.preview-panel{padding:20px}.intro{padding-top:35px}h1{font-size:39px}.settings{gap:10px}.brand-en{display:none}}@media(max-width:700px){.topbar{height:75px;margin:0 22px}.brand{font-size:17px}.brand-mark{font-size:31px}.help-link{font-size:12px;gap:8px}main{width:calc(100% - 44px)}.intro{padding:30px 0 25px}h1{font-size:33px;letter-spacing:1px}.intro-copy{font-size:12px;max-width:290px}.workspace{grid-template-columns:1fr;gap:28px}.editor{padding-top:9px}.avatar-section{margin-top:25px;padding-top:24px}.local-note{margin-top:20px}.preview-panel{max-width:480px;width:100%;justify-self:center;padding:20px}.preview-stage{padding:13px}.quick-guide{gap:12px;padding:25px 0}.quick-guide>div{padding-left:10px}.quick-guide span{font-size:8px;letter-spacing:.2px}.quick-guide h3{font-size:11px}.quick-guide p{font-size:9px}.compatibility{margin-top:23px}footer{margin:0 22px;padding:20px 0;gap:15px;font-size:10px}.footer-small{display:none}.guide h1{font-size:30px}.guide table{font-size:11px}.guide th,.guide td{padding:8px}.guide p,.guide li{font-size:13px}.status{font-size:9px}}

/* Document navigation and long technical content. */
.doc-toc{display:flex;flex-wrap:wrap;gap:9px 20px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:18px 0;margin:24px 0 30px}.doc-toc a{font-size:12px;color:#607255}.guide h2{scroll-margin-top:24px}.guide pre{font-family:ui-monospace,'SFMono-Regular',Consolas,monospace;white-space:pre-wrap;word-break:break-word}.guide pre code{padding:0;background:none}.guide p,.guide li,.guide td{overflow-wrap:anywhere}.table-scroll{width:100%;overflow-x:auto}.guide ol,.guide ul{padding-left:24px}.guide li{margin:6px 0}