body{font-family:Arial,sans-serif;margin:0;padding:0}:root{--shell-card-padding-y:26px}.header-info{text-align:left;margin-bottom:40px;line-height:30px}.header-info h1{font-size:24px;margin:0;display:inline;font-family:黑体,SimHei,sans-serif}.header-info p{margin:5px 0;font-size:14px;font-family:宋体,SimSun,serif}.header-info p.inline{display:inline;font-weight:700;font-family:楷体,KaiTi,serif}.header-info p.block{display:block;font-family:黑体,SimHei,sans-serif;margin-top:10px}.tracing-area{display:grid;gap:35px 0;width:100%;max-width:100%;background-color:#fff;margin:20px auto 0;page-break-inside:avoid}.tracing-wrapper{position:relative;height:0;padding-bottom:100%;background-color:#fff;justify-content:center;box-sizing:border-box;border:2px solid #d3d3d3;aspect-ratio:1/1;z-index:1}.tracing-wrapper:hover{z-index:7}.pinyin-wrapper,.tracing-wrapper{width:100%;display:flex;align-items:center}.pinyin-wrapper{position:absolute;top:-34px;height:31px;flex-direction:column;justify-content:space-between;pointer-events:auto;z-index:3;background-color:transparent;cursor:default}.pinyin-lines{height:1px;background-color:#000;left:0}.pinyin-lines,.pinyin-text{position:absolute;width:100%}.pinyin-text{top:50%;left:50%;transform:translate(-50%,-50%);font-size:.9em;line-height:1;text-align:center;cursor:default;z-index:1;white-space:nowrap}.pinyin-wrapper.polyphone{background-color:#ffe4e4!important;cursor:default}.pinyin-wrapper.polyphone:hover .pinyin-selector{display:block}.pinyin-selector{display:none;position:absolute;top:-6px;left:calc(100% + 2px);transform:none;background:#fff;border:1px solid #ddd;box-shadow:0 10px 25px rgba(0,0,0,.15);z-index:4;padding:10px;border-radius:8px;min-width:150px}.pinyin-selector:after,.pinyin-selector:before{content:"";position:absolute;border-style:solid}.pinyin-selector:before{top:15px;left:-8px;border-width:8px 8px 8px 0;border-color:transparent #fff transparent transparent;z-index:2}.pinyin-selector:after{top:14px;left:-9px;border-width:9px 9px 9px 0;border-color:transparent #ddd transparent transparent;z-index:1}.pinyin-option{display:flex;align-items:center;padding:10px;cursor:default;gap:15px;position:relative}.pinyin-option input[type=radio]{cursor:default;width:16px;height:16px;margin:0}.pinyin-grid-mini{position:relative;width:70px;height:35px;display:flex;align-items:center;justify-content:center}.mini-line{position:absolute;width:100%;height:1px;background-color:#ddd;left:0}.mini-line:first-child{top:0}.mini-line:nth-child(2){top:11px}.mini-line:nth-child(3){top:22px}.mini-line:nth-child(4){top:33px}.mini-text{position:relative;z-index:2;font-size:18px;top:-2px;color:#333}.pinyin-option:hover{background-color:#f4f4f4}.warning-box{display:none;padding:15px;background-color:#ffe4e4;border:1px solid #ffa39e;color:#cf1322;border-radius:10px;margin-top:20px;font-size:14px;line-height:1.5}.warning-box strong{display:block;margin-bottom:5px;font-size:16px;color:#f5222d}.tracing-wrapper:after,.tracing-wrapper:before{content:"";position:absolute;background-color:inherit;border-color:inherit;border-style:dashed;border-width:.5px;pointer-events:none}.tracing-wrapper:before{top:50%;left:0;width:100%;height:.01px;background-color:transparent;border-top:.1px dashed rgba(0,0,0,.1);transform:translateY(-50%)}.tracing-wrapper:after{left:50%;top:0;width:.01px;height:100%;background-color:transparent;border-left:.1px dashed rgba(0,0,0,.1);transform:translateX(-50%)}.tracing-wrapper .tianzi-mid-h{left:0;top:50%;width:100%;height:.01px;transform:translateY(-50%);border-top:.1px dashed rgba(0,0,0,.1)}.tracing-wrapper .tianzi-mid-h,.tracing-wrapper .tianzi-mid-v{position:absolute;background-color:transparent;pointer-events:none;z-index:1}.tracing-wrapper .tianzi-mid-v{left:50%;top:0;width:.01px;height:100%;transform:translateX(-50%);border-left:.1px dashed rgba(0,0,0,.1)}.tracing-wrapper .tianzi-mid-h,.tracing-wrapper .tianzi-mid-v{display:none!important}.tracing-wrapper .diagonal-1,.tracing-wrapper .diagonal-2{content:"";position:absolute;width:141%;height:.01px;background-color:transparent;border-top:.1px dashed rgba(0,0,0,.1)}.tracing-wrapper .diagonal-1{transform:rotate(45deg);top:50%;left:50%;transform:translate(-50%,-50%) rotate(45deg)}.tracing-wrapper .diagonal-2{transform:rotate(-45deg);top:50%;left:50%;transform:translate(-50%,-50%) rotate(-45deg)}.tracing-number{font-family:KaiTi,楷体,cursive;color:#000;position:absolute;margin:0;z-index:2;line-height:1;text-align:center;white-space:nowrap;pointer-events:none}.content-modal,.tracing-number{top:50%;left:50%;transform:translate(-50%,-50%)}.content-modal{display:none;position:fixed;background-color:#fff;border:1px solid #ccc;box-shadow:0 2px 10px rgba(0,0,0,.1);z-index:6;width:500px;max-width:80%;padding:20px}.content-modal textarea{width:100%;height:100px;border:1px solid #ddd;box-sizing:border-box;padding:10px;resize:none;white-space:pre-wrap}.content-modal button{margin-top:10px;padding:10px 20px;background-color:#007bff;color:#fff;border:none;cursor:default}.modal-overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.5);z-index:5}@media print{body{-webkit-print-color-adjust:exact;-moz-print-color-adjust:exact;-ms-print-color-adjust:exact;print-color-adjust:exact}.warning-box{display:none!important}.header-info h1{font-size:24px}.header-info p{font-size:14px}.container{margin:0;padding:0;width:100%;max-width:100%}.left-panel{padding:10px;margin:0}.tracing-area{width:100%}.pinyin-lines{border-bottom:1px solid #d3d3d3!important}.pinyin-wrapper.polyphone{background-color:transparent!important}}@media screen{:root{--music-screen-bg:#eeeff2;--music-card-width:194mm;--music-card-padding-y:40px;--music-card-padding-x:20px;--music-card-border:#e6e6e8;--music-card-shadow:0 6px 18px rgba(0,0,0,.12)}body{background:var(--music-screen-bg)!important}.container{width:min(96%,calc(var(--music-card-width) + 360px))!important;max-width:calc(var(--music-card-width) + 360px)!important;margin:18px auto 0!important;padding:0!important;gap:20px!important;align-items:flex-start!important;background:transparent!important}.left-panel{width:var(--music-card-width)!important;max-width:var(--music-card-width)!important;flex:0 0 var(--music-card-width)!important;margin:0!important;padding:var(--music-card-padding-y) var(--music-card-padding-x)!important;background:#fff!important;border:1px solid var(--music-card-border)!important;box-shadow:var(--music-card-shadow)!important;overflow:visible!important;box-sizing:border-box!important}.control-panel{background-color:transparent!important;border-left:none!important}}@page{size:A4 portrait;margin:8mm}@media print{.warning-box{display:none!important}.container{display:block!important;margin:0!important;padding:0!important;width:100%!important;max-width:100%!important}.left-panel{width:194mm!important;max-width:194mm!important;padding:0!important;margin:0 auto!important;overflow:visible!important}.header-info{width:100%!important;margin:0 0 12mm!important;page-break-before:auto!important;text-align:left!important}.tracing-area{width:100%!important;max-width:100%!important;margin:3mm auto 8mm!important;gap:35px 0!important;page-break-inside:auto!important}.pinyin-wrapper{top:-34px!important}}#pages-container{width:100%;margin:0 auto}.left-panel{width:194mm!important;max-width:194mm!important;flex:0 0 194mm!important}@media screen{.header-info{margin:0 0 12mm!important}.tracing-area{margin:3mm auto 8mm!important;gap:35px 0!important}}.print-page{width:100%;margin:0 auto}@media print{#pages-container{width:100%!important}.print-page{break-after:page;break-inside:avoid}.print-page:last-child{break-after:auto}}.tracing-area{margin:6mm auto 10mm!important}.tracing-wrapper{width:100%!important;aspect-ratio:1/1!important;height:auto!important;padding-bottom:0!important;border-left-width:1px!important;border-right-width:0!important;border-top-width:0!important;border-bottom-width:0!important;border-style:solid!important;background:#fff!important;box-sizing:border-box!important;display:flex!important;align-items:center!important;justify-content:center!important}.tracing-area.cols-12 .tracing-wrapper:nth-child(12n),.tracing-area.cols-15 .tracing-wrapper:nth-child(15n),.tracing-area.cols-18 .tracing-wrapper:nth-child(18n){border-right-width:1px!important}.tracing-wrapper.last-row-cell{border-bottom-width:0!important;box-shadow:inset 0 -1px 0 var(--grid-color,#d3d3d3)!important}.pinyin-wrapper{top:calc(-1 * var(--guide-gap, 24px))!important;height:var(--guide-gap,24px)!important}.pinyin-lines{height:1px!important}.pinyin-line1{top:0!important}.pinyin-line2{top:33.333%!important;opacity:.35}.pinyin-line3{top:66.666%!important;opacity:.35}.pinyin-line4{top:calc(100% - 1px)!important}.tracing-number{top:50%!important;left:50%!important;transform:translate(-50%,-50%)!important;line-height:1!important;text-align:center!important}.pinyin-text{top:50%!important;transform:translate(-50%,-52%)!important}@media print{.header-info{margin:0 0 12mm!important;page-break-before:auto!important;text-align:left!important}.tracing-area{margin:6mm auto 10mm!important;gap:var(--guide-gap,24px) 0!important}.pinyin-wrapper{top:calc(-1 * var(--guide-gap, 24px))!important;height:var(--guide-gap,24px)!important}.pinyin-lines{border-bottom:none!important}}@media print{body,html{width:210mm!important;height:297mm!important}.container,.left-panel{min-height:281mm!important}.left-panel{width:194mm!important;max-width:194mm!important;margin:0 auto!important;padding:0!important;display:flex!important;flex-direction:column!important;justify-content:center!important;align-items:center!important}#pages-container,.header-info,.print-page{width:100%!important}#pages-container{display:flex!important;justify-content:center!important}}:root{--a4-page-width:210mm;--a4-page-height:297mm;--a4-margin:8mm;--a4-content-width:194mm}#pages-container{width:100%!important;max-width:100%!important;margin:0 auto!important}.left-panel{width:var(--a4-content-width)!important;max-width:var(--a4-content-width)!important;flex:0 0 var(--a4-content-width)!important;margin:0 auto!important;overflow:visible!important}.print-page{width:100%!important;margin:0 auto!important}.header-info{page-break-before:auto!important}.header-info h1{font-size:24px!important;margin:0!important;display:inline!important;font-family:黑体,SimHei,sans-serif!important}.header-info p{margin:5px 0!important;font-size:14px!important;font-family:宋体,SimSun,serif!important}.header-info p.inline{display:inline!important;font-weight:700!important;font-family:楷体,KaiTi,serif!important}.header-info p.block{display:block!important;font-family:黑体,SimHei,sans-serif!important}.tracing-area{width:100%!important;max-width:100%!important;margin:calc(var(--guide-gap, 24px) + 2mm) auto 0!important;gap:var(--guide-gap,24px) 0!important;page-break-inside:auto!important}@media print{body{margin:0!important;padding:0!important;background:#fff!important;-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}.content-modal,.modal-overlay,.warning-box{display:none!important}.container{width:100%!important;max-width:100%!important;margin:0!important;background:#fff!important}.container,.left-panel{display:block!important;padding:0!important;min-height:auto!important}.left-panel{width:var(--a4-content-width)!important;max-width:var(--a4-content-width)!important;margin:0 auto!important;overflow:visible!important}#pages-container{display:block!important;width:100%!important}.print-page{width:100%!important;margin:0 auto!important;break-after:page!important;break-inside:auto!important}.print-page:last-child{break-after:auto!important}.header-info{margin:0 0 var(--header-gap)!important}.tracing-area{width:100%!important;max-width:100%!important;margin:calc(var(--guide-gap, 24px) + 2mm) auto 0!important;gap:var(--guide-gap,24px) 0!important}}:root{--header-fixed-height:96px;--header-gap:20px;--panel-top-padding:20px}.left-panel{padding-top:var(--panel-top-padding)!important}.header-info{margin:0 0 var(--header-gap)!important;height:var(--header-fixed-height)!important}@media print{.left-panel{padding-top:var(--panel-top-padding)!important}.header-info{margin:0 0 var(--header-gap)!important;height:var(--header-fixed-height)!important;box-sizing:border-box!important}}:root{--shell-header-height:96px;--shell-header-gap:10px}.header-info{height:var(--shell-header-height)!important;box-sizing:border-box!important}.header-info h1,.header-info p{margin:0!important}.header-info h1,.header-info p.block,.header-info p.inline{line-height:1.2!important}.header-info p.block{margin-top:10px!important}@media print{.header-info{height:var(--shell-header-height)!important;margin:0 0 var(--shell-header-gap)!important}}.tracing-wrapper .tianzi-mid-h{left:0!important;top:50%!important;width:100%!important;height:.01px!important;background-color:transparent!important;border-top:.1px dashed rgba(0,0,0,.1)!important;transform:translateY(-50%)!important}.tracing-wrapper .tianzi-mid-v{left:50%!important;top:0!important;width:.01px!important;height:100%!important;background-color:transparent!important;border-left:.1px dashed rgba(0,0,0,.1)!important;transform:translateX(-50%)!important}.tracing-wrapper .diagonal-1,.tracing-wrapper .diagonal-2{border-top:.1px dashed rgba(0,0,0,.1)!important}.tracing-wrapper .diagonal-1{top:50%!important;left:50%!important;transform:translate(-50%,-50%) rotate(45deg)!important}.tracing-wrapper .diagonal-2{top:50%!important;left:50%!important;transform:translate(-50%,-50%) rotate(-45deg)!important}.tracing-wrapper .diagonal-1,.tracing-wrapper .diagonal-2{width:141%!important;height:.01px!important;background-color:transparent!important;border-top-width:.1px!important;border-top-style:dashed!important;border-top-color:currentColor!important}.tracing-wrapper{color:var(--grid-color,#d3d3d3)}.tracing-wrapper .diagonal-1,.tracing-wrapper .diagonal-2,.tracing-wrapper .tianzi-mid-h,.tracing-wrapper .tianzi-mid-v,.tracing-wrapper:after,.tracing-wrapper:before{border-top-color:currentColor!important;border-left-color:currentColor!important}:root{--shell-card-padding-y:40px;--shell-header-gap:20px}.header-info{margin:0 0 var(--shell-header-gap)!important;text-align:left!important;line-height:30px!important}@media print{html.is-tem-page .container .left-panel.has-shell-print-pages #pages-container>.print-page{width:100%!important;margin:0 auto!important;min-height:auto!important;box-sizing:border-box!important;padding-left:var(--shell-card-padding-x)!important;padding-right:var(--shell-card-padding-x)!important;padding-bottom:0!important}html.is-tem-page .container .left-panel.has-shell-print-pages #pages-container>.print-page .header-info{margin:0 0 var(--shell-header-gap)!important;page-break-before:auto!important;text-align:left!important}.tracing-area{margin:0 auto!important}}