@import "https://fonts.googleapis.com/css2?family=Playfair+Display:wght@700;900&family=Inter:wght@400;500;600;700&display=swap";*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--navy:#1b2a4a;--red:#c41e3a;--gold:#c9a84c;--text:#1a1a1a;--muted:#777;--rule:#ddd}body{min-height:100vh;color:var(--text);background:#eaecef;font-family:Inter,sans-serif}#controls{background:var(--navy);z-index:100;flex-wrap:wrap;align-items:flex-end;gap:18px;padding:16px 28px 20px;display:flex;position:sticky;top:0}#controls h1{color:#fff;width:100%;font-family:Inter,sans-serif;font-size:17px;font-weight:600}.cg{flex-direction:column;gap:5px;display:flex}.cg>.lbl{letter-spacing:.8px;text-transform:uppercase;color:#ffffff80;font-size:10px;font-weight:700}.ctrl-input{color:#fff;background:#ffffff14;border:1px solid #fff3;border-radius:4px;padding:8px 12px;font-family:Inter,sans-serif;font-size:14px}.ctrl-input::placeholder{color:#ffffff59}.ctrl-input:focus{border-color:var(--gold);outline:none}select.ctrl-input{background:#2a3f66}select.ctrl-input option{color:#1a1a1a;background:#fff}#charInput{letter-spacing:3px;width:260px;font-family:serif;font-size:18px}.num-input{width:72px}.chk-group{flex-direction:column;gap:6px;display:flex}.chk-label{color:#fffc;cursor:pointer;align-items:center;gap:7px;font-size:13px;display:flex}.btn{cursor:pointer;border:none;border-radius:4px;padding:10px 22px;font-family:Inter,sans-serif;font-size:14px;font-weight:700;transition:all .15s}.btn-primary{background:var(--gold);color:var(--navy)}.btn-primary:hover{background:#d4b560}.btn-secondary{color:#ffffffb3;background:0 0;border:1px solid #ffffff40}.btn-secondary:hover{border-color:var(--gold);color:var(--gold)}.btn-row{align-self:flex-end;gap:8px;display:flex}#ws-wrap{max-width:900px;margin:28px auto;padding:0 20px}#worksheet{background:#fff;box-shadow:0 2px 20px #0000001f}.ws-header{background:var(--navy);border-bottom:4px solid var(--gold);padding:0}.ws-header-inner{align-items:stretch;gap:24px;padding:24px 36px;display:flex}.ws-seal{background:var(--red);color:#fff;letter-spacing:2px;writing-mode:vertical-rl;flex-shrink:0;justify-content:center;align-items:center;width:72px;height:72px;font-family:KaiTi,STKaiti,楷体,serif;font-size:30px;line-height:1;display:flex;box-shadow:inset 0 0 0 3px #fff3}.ws-header-text{flex:1}.ws-title{color:#fff;letter-spacing:-.2px;margin-bottom:4px;font-family:Playfair Display,serif;font-size:24px;font-weight:900}.ws-subtitle{color:var(--gold);letter-spacing:1.5px;text-transform:uppercase;font-size:12px;font-weight:600}.ws-level-badge{background:var(--red);color:#fff;letter-spacing:.8px;text-transform:uppercase;margin-top:8px;padding:3px 10px;font-size:10px;font-weight:700;display:inline-block}.ws-meta-bar{border-top:1px solid #ffffff1a;gap:0;display:flex}.ws-meta-field{color:#fff9;letter-spacing:.5px;text-transform:uppercase;border-right:1px solid #ffffff14;flex:1;align-items:center;gap:10px;padding:10px 36px;font-size:12px;font-weight:600;display:flex}.ws-meta-field:last-child{border-right:none}.ws-meta-field span{border-bottom:1px solid #ffffff40;flex:1;padding-bottom:2px}.ws-body{padding:24px 36px 16px}.empty-state{text-align:center;color:#ccc;padding:60px 20px;font-size:15px}.empty-state .eg{margin-bottom:12px;font-size:60px;line-height:1}.char-section{border-bottom:1px solid var(--rule);page-break-inside:avoid;break-inside:avoid;margin-bottom:20px;padding-bottom:18px}.char-section:last-child{border-bottom:none}.char-header{border-left:4px solid var(--red);align-items:center;gap:0;min-height:80px;margin-bottom:10px;padding-left:14px;display:flex}.char-pinyin-row{color:var(--red);letter-spacing:2px;min-height:24px;margin-bottom:4px;padding-left:18px;font-size:18px;font-style:italic;font-weight:700}.char-display{align-items:center;gap:0;display:flex}.char-big{font-family:KaiTi,STKaiti,楷体,SimSun,serif;font-size:68px;line-height:1}.char-divider{background:var(--rule);align-self:stretch;width:1px;margin:0 18px}.char-info{flex-direction:column;justify-content:center;gap:6px;display:flex}.stroke-count{color:var(--navy);font-family:Playfair Display,serif;font-size:28px;font-weight:700;line-height:1}.stroke-count-label{color:var(--muted);text-transform:uppercase;letter-spacing:1px;font-size:10px}.char-meta-loading{color:#bbb;font-size:12px}.section-label{text-transform:uppercase;letter-spacing:1.2px;color:var(--muted);align-items:center;gap:8px;margin-bottom:7px;font-size:10px;font-weight:700;display:flex}.section-label:after{content:"";background:var(--rule);flex:1;height:1px}.stroke-steps{flex-wrap:wrap;gap:3px;margin-bottom:12px;display:flex}.stroke-step{flex-direction:column;align-items:center;gap:1px;display:flex}.stroke-step-num{color:#bbb;font-size:9px;font-weight:500}.practice-rows{flex-direction:column;gap:2px;display:flex}.practice-row{gap:2px;display:flex}.tian-grid{border:1px solid #999;flex-shrink:0;position:relative;overflow:hidden}.tian-grid:before{content:"";border-left:1px dashed #ddd;position:absolute;top:0;bottom:0;left:calc(50% - .5px)}.tian-grid:after{content:"";border-top:1px dashed #ddd;position:absolute;top:calc(50% - .5px);left:0;right:0}.tian-grid svg{width:100%;height:100%;position:absolute;top:0;left:0}.loading-spinner{border:2px solid #eee;border-top-color:var(--gold);vertical-align:middle;border-radius:50%;width:13px;height:13px;margin-right:4px;animation:.7s linear infinite spin;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}@media print{@page{margin:14mm 18mm;@bottom-left{content:attr(data-store);font-size:8pt;color:#999;font-family:Inter,sans-serif}@bottom-right{content:"Page " counter(page) " of " counter(pages);font-size:8pt;color:#999;font-family:Inter,sans-serif}}body{background:#fff}#controls{display:none!important}#ws-wrap{max-width:none;margin:0;padding:0}#worksheet{box-shadow:none}.ws-body{padding:18px 28px 12px}.char-section{page-break-inside:avoid;break-inside:avoid}.loading-spinner{display:none}}