.copybook-wrapper{max-width:1200px;margin:0 auto;padding:20px}.control-panel{background:var(--bi-surface);border-radius:16px;padding:25px;box-shadow:0 4px 20px #00000014;margin-bottom:30px}.form-label{font-weight:500;color:var(--bi-text);margin-bottom:8px}.form-select,.form-control{border-radius:10px;border:1px solid var(--bi-border);transition:all .3s ease}.form-select:focus,.form-control:focus{border-color:var(--brand);box-shadow:0 0 0 .2rem rgba(var(--brand-rgb),.15)}.preset-buttons{display:flex;flex-wrap:wrap;gap:10px}.preset-btn{border-radius:20px;padding:6px 16px;font-size:14px;transition:all .3s ease}.preset-btn:hover{background:var(--brand);border-color:var(--brand);color:#fff}.btn-lg{padding:12px 30px;border-radius:25px;font-weight:500}.copybook-preview{background:var(--bi-surface-2);border-radius:16px;padding:25px}.preview-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:15px;border-bottom:1px solid var(--bi-border)}.preview-header h5{color:var(--bi-text);font-weight:600;margin:0}.preview-container{background:var(--bi-surface);border-radius:12px;padding:20px;box-shadow:0 2px 10px #0000000d;overflow-x:auto}.copybook-page{width:210mm;min-height:297mm;margin:0 auto;background:var(--bi-surface);padding:10mm 15mm;box-shadow:0 0 20px #0000001a}.page-header{text-align:center;margin-bottom:20px;padding-bottom:15px;border-bottom:2px solid var(--brand)}.page-title-text{color:var(--brand);font-size:28px;margin:0 0 5px;font-weight:600}.page-subtitle{color:var(--bi-text-muted);font-size:14px;margin:0}.page-footer{display:flex;justify-content:space-between;margin-top:20px;padding-top:15px;border-top:1px solid #eee;color:var(--bi-text-muted);font-size:12px}.grids-container{display:grid;grid-template-columns:repeat(10,1fr);gap:8px;justify-content:center}.grid-cell{position:relative;border:1px solid #ddd;display:flex;align-items:center;justify-content:center;overflow:hidden}.grid-cell .char{line-height:1;z-index:2}.size-small .grid-cell{width:35px;height:35px}.size-small .grid-cell .char,.grid-cell .char{font-size:24px}.size-medium .grid-cell{width:50px;height:50px}.size-medium .grid-cell .char{font-size:36px}.size-large .grid-cell{width:80px;height:80px}.size-large .grid-cell .char{font-size:60px}.size-xlarge .grid-cell{width:100px;height:100px}.size-xlarge .grid-cell .char{font-size:76px}.grid-tian:before,.grid-tian:after{content:"";position:absolute;background:#f99}.grid-tian:before{width:100%;height:1px;top:50%;left:0}.grid-tian:after{width:1px;height:100%;left:50%;top:0}.grid-mi:before,.grid-mi:after{content:"";position:absolute;background:#f99}.grid-mi:before{width:141%;height:1px;top:50%;left:-20.5%;transform:rotate(45deg);transform-origin:center}.grid-mi:after{width:141%;height:1px;top:50%;left:-20.5%;transform:rotate(-45deg);transform-origin:center}.grid-mi .cross-h,.grid-mi .cross-v{position:absolute;background:#f99}.grid-mi .cross-h{width:100%;height:1px;top:50%;left:0}.grid-mi .cross-v{width:1px;height:100%;left:50%;top:0}.grid-fang{border:1px solid #ff9999}.grid-si{border:none;position:relative;background:repeating-linear-gradient(to bottom,transparent,transparent 24%,#ff9999 24%,#ff9999 25%,transparent 25%,transparent 49%,#999 49%,#999 50%,transparent 50%,transparent 74%,#ff9999 74%,#ff9999 75%,transparent 75%,transparent 100%)}.grid-si .char{position:relative;top:-5%}.grid-heng{border:none;border-bottom:1px solid #ff9999;background:linear-gradient(to bottom,transparent 90%,rgba(255,153,153,.3) 90%,rgba(255,153,153,.3) 100%)}.font-kaiti .char{font-family:"Noto Serif SC",KaiTi,STKaiti,serif}.font-xingshu .char{font-family:Ma Shan Zheng,Xingkai SC,cursive}.font-lishu .char{font-family:Zhi Mang Xing,LiSu,STLiti,cursive}.font-songti .char{font-family:Noto Sans SC,SimSun,Songti SC,serif}.font-hengshui .char{font-family:Courier New,Consolas,monospace;font-style:italic;font-weight:500}.mode-outline .char{color:transparent;-webkit-text-stroke:1px #333}.mode-fade .char{color:#0003}.mode-guide .char{color:rgba(var(--brand-rgb),.4)}.mode-black .char{color:var(--bi-text)}@media print{body *{visibility:hidden}.preview-container,.preview-container *,.preview-container *:before,.preview-container *:after{visibility:visible}.preview-container{position:absolute;left:0;top:0;width:100%;padding:0;background:#fff}.copybook-page{box-shadow:none;width:100%;padding:15px;margin:0}.control-panel,.preview-header,.navbar,.page-footer,.back-to-top{display:none!important}.grids-container{display:grid!important;width:100%;grid-template-columns:repeat(12,1fr)!important;gap:2mm}.grid-cell{break-inside:avoid;width:auto!important;height:auto!important;aspect-ratio:1;border:.75pt solid #bbb!important}.grid-cell .char{font-size:14pt}.grid-tian{position:relative!important;border:.75pt solid #bbb!important}.grid-tian:before{content:""!important;position:absolute!important;width:100%!important;height:.5pt!important;top:50%!important;left:0!important;background:#bbb!important;transform:translateY(-50%)!important}.grid-tian:after{content:""!important;position:absolute!important;width:.5pt!important;height:100%!important;left:50%!important;top:0!important;background:#bbb!important;transform:translate(-50%)!important}.grid-mi{position:relative!important;border:.75pt solid #bbb!important}.grid-mi:before{content:""!important;position:absolute!important;width:141%!important;height:.5pt!important;top:50%!important;left:-20.5%!important;background:#bbb!important;transform:rotate(45deg)!important;transform-origin:center!important}.grid-mi:after{content:""!important;position:absolute!important;width:141%!important;height:.5pt!important;top:50%!important;left:-20.5%!important;background:#bbb!important;transform:rotate(-45deg)!important;transform-origin:center!important}.grid-mi .cross-h,.grid-mi .cross-v{background:#bbb!important}.grid-si{background:repeating-linear-gradient(to bottom,transparent,transparent 24%,#ddd 24%,#ddd 25%,transparent 25%,transparent 49%,#aaa 49%,#aaa 50%,transparent 50%,transparent 74%,#ddd 74%,#ddd 75%,transparent 75%,transparent 100%)}}@media (max-width: 992px){.copybook-page{width:100%;min-height:auto;padding:20px}.grids-container{grid-template-columns:repeat(8,1fr)}}@media (max-width: 768px){.grids-container{grid-template-columns:repeat(6,1fr)}.preset-buttons{justify-content:center}.btn-lg{padding:10px 20px;font-size:14px}}@media (max-width: 480px){.grids-container{grid-template-columns:repeat(5,1fr);gap:4px}.size-medium .grid-cell{width:45px;height:45px}.size-large .grid-cell{width:55px;height:55px}}.grid-cell{animation:fadeIn .3s ease-in-out}@keyframes fadeIn{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.generating .grids-container{opacity:.5;pointer-events:none}.generating:after{content:"生成中...";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:var(--brand);font-size:18px;font-weight:500}html[data-theme=dark] .page-footer{border-top-color:var(--bi-border)}
