.bz-wrap{font-size:14px;color:#333;line-height:1.5}
.bz-wrap *{box-sizing:border-box}
.bz-load{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #eef1f4;border-radius:10px;padding:10px 14px;margin-bottom:12px;box-shadow:0 1px 4px rgba(0,0,0,.05)}
.bz-loadbar{flex:1;height:8px;background:#eef1f4;border-radius:4px;overflow:hidden}
.bz-loadin{height:100%;width:0;background:linear-gradient(90deg,#06b672,#0e9dd6);border-radius:4px;transition:width .2s}
#bz-loadtxt{font-size:12px;color:#888;white-space:nowrap}
.bz-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:#fff;border:1px solid #eef1f4;border-radius:12px;padding:12px 14px;margin-bottom:12px;box-shadow:0 2px 8px rgba(0,0,0,.05)}
.bz-btn{border:1px solid #d5dbdf;background:#fff;color:#333;border-radius:8px;padding:8px 14px;font-size:13px;cursor:pointer;transition:all .2s;user-select:none}
.bz-btn:hover{border-color:#06b672;color:#06b672}
#bz-play{background:linear-gradient(135deg,#06b672,#0e9dd6);border:none;color:#fff;font-weight:600;padding:10px 22px;border-radius:10px;box-shadow:0 4px 12px rgba(6,182,114,.3);min-width:96px}
#bz-play:hover{color:#fff;transform:translateY(-1px);box-shadow:0 6px 16px rgba(6,182,114,.4)}
#bz-play.on{background:linear-gradient(135deg,#ef4444,#f97316);box-shadow:0 4px 12px rgba(239,68,68,.3)}
#bz-play.on:hover{color:#fff}
#bz-metro.on{background:#06b672;color:#fff;border-color:#06b672}
#bz-export{background:#fff;border:1px solid #8b5cf6;color:#8b5cf6;font-weight:600}
#bz-export:hover{background:#f3edff;border-color:#8b5cf6;color:#7c3aed}
.bz-bpmbox{display:flex;align-items:center;gap:8px;flex:1;min-width:180px}
.bz-bpmbox .bz-lab{font-size:12px;color:#888}
.bz-bpmbox input[type=range]{flex:1;-webkit-appearance:none;appearance:none;height:6px;background:#e5e7eb;border-radius:3px;outline:none;cursor:pointer}
.bz-bpmbox input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:#06b672;border:3px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.25);cursor:pointer}
.bz-bpmbox input[type=range]::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#06b672;border:3px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.25);cursor:pointer}
.bz-bpmbox b{font-size:18px;color:#06b672;min-width:34px;text-align:center;font-variant-numeric:tabular-nums}
.bz-bpmbox .bz-unit{font-size:11px;color:#aaa}
.bz-panel{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:12px}
.bz-cell{background:#fff;border:1px solid #eef1f4;border-radius:10px;padding:10px 12px;box-shadow:0 1px 4px rgba(0,0,0,.04)}
.bz-cell label{display:block;font-size:12px;color:#888;margin-bottom:6px}
.bz-cell select{width:100%;height:34px;border:1px solid #d5dbdf;border-radius:8px;background:#fff;color:#333;font-size:13px;padding:0 6px;outline:none;cursor:pointer}
.bz-cell select:focus{border-color:#06b672}
.bz-chordbox{background:#fff;border:1px solid #eef1f4;border-radius:12px;padding:12px 14px;margin-bottom:12px;box-shadow:0 2px 8px rgba(0,0,0,.05)}
.bz-chtop{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.bz-chordbox label{font-size:12px;color:#888;flex:none}
.bz-chordbox input[type=text]{flex:1;min-width:160px;height:34px;border:1px solid #d5dbdf;border-radius:8px;padding:0 10px;font-size:14px;outline:none;color:#333;background:#fff}
.bz-chordbox input[type=text]:focus{border-color:#06b672}
.bz-mini{padding:6px 10px;font-size:12px}
#bz-random{color:#8b5cf6;border-color:#c4b5fd}
#bz-random:hover{background:#f3edff}
.bz-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.bz-chip{border:1px solid #e2e8f0;background:#f8fafc;color:#4a5568;border-radius:14px;padding:3px 10px;font-size:12px;cursor:pointer;transition:all .2s;text-decoration:none}
.bz-chip:hover{border-color:#06b672;color:#06b672;background:#e8faf0}
.bz-cur{margin-top:10px;font-size:13px;color:#666;display:flex;align-items:center;gap:8px}
.bz-cur b{font-size:16px;color:#06b672;background:#e8faf0;border:1px solid #b7ecd4;border-radius:8px;padding:2px 12px;letter-spacing:1px}
.bz-steps{display:grid;grid-template-columns:repeat(16,1fr);gap:4px;background:#fff;border:1px solid #eef1f4;border-radius:12px;padding:10px;margin-bottom:12px;box-shadow:0 2px 8px rgba(0,0,0,.05)}
.bz-step{height:26px;border-radius:6px;background:#f1f3f5;transition:all .12s}
.bz-step.on{background:linear-gradient(180deg,#06b672,#0e9dd6);box-shadow:0 2px 8px rgba(6,182,114,.4)}
.bz-tracks{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:12px}
.bz-track{background:#fff;border:1px solid #eef1f4;border-radius:12px;padding:12px;box-shadow:0 2px 8px rgba(0,0,0,.05);display:flex;flex-direction:column;gap:10px}
.bz-tkh{display:flex;align-items:center;gap:8px}
.bz-dot{width:10px;height:10px;border-radius:50%;flex:none}
.bz-tk-drum .bz-dot{background:#f39c12;box-shadow:0 0 0 3px rgba(243,156,18,.15)}
.bz-tk-piano .bz-dot{background:#3498db;box-shadow:0 0 0 3px rgba(52,152,219,.15)}
.bz-tk-guitar .bz-dot{background:#8b5cf6;box-shadow:0 0 0 3px rgba(139,92,246,.15)}
.bz-tk-bass .bz-dot{background:#16a085;box-shadow:0 0 0 3px rgba(22,160,133,.15)}
.bz-track b{font-size:14px;color:#333;flex:1}
.bz-switch{position:relative;display:inline-block;width:38px;height:22px;flex:none;cursor:pointer}
.bz-switch input{opacity:0;width:0;height:0}
.bz-switch span{position:absolute;inset:0;background:#d1d5db;border-radius:11px;transition:background .2s}
.bz-switch span:before{content:'';position:absolute;width:18px;height:18px;left:2px;top:2px;background:#fff;border-radius:50%;transition:transform .2s;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.bz-switch input:checked+span{background:#06b672}
.bz-switch input:checked+span:before{transform:translateX(16px)}
.bz-vol{display:flex;align-items:center;gap:8px}
.bz-vol input[type=range]{flex:1;-webkit-appearance:none;appearance:none;height:5px;background:#e5e7eb;border-radius:3px;outline:none;cursor:pointer}
.bz-vol input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:14px;height:14px;border-radius:50%;background:#555;border:2px solid #fff;box-shadow:0 1px 3px rgba(0,0,0,.2);cursor:pointer}
.bz-vol input[type=range]::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:#555;border:2px solid #fff;box-shadow:0 1px 3px rgba(0,0,0,.2);cursor:pointer}
.bz-tk-drum .bz-vol input[type=range]::-webkit-slider-thumb{background:#f39c12}
.bz-tk-piano .bz-vol input[type=range]::-webkit-slider-thumb{background:#3498db}
.bz-tk-guitar .bz-vol input[type=range]::-webkit-slider-thumb{background:#8b5cf6}
.bz-tk-bass .bz-vol input[type=range]::-webkit-slider-thumb{background:#16a085}
.bz-test{align-self:flex-start;border-radius:6px;padding:5px 12px;font-size:12px}
.bz-tk-drum .bz-test{color:#e67e22;border-color:#f5c796}
.bz-tk-drum .bz-test:hover{background:#fef3e7}
.bz-tk-piano .bz-test{color:#2980b9;border-color:#a8cceb}
.bz-tk-piano .bz-test:hover{background:#eaf3fc}
.bz-tk-guitar .bz-test{color:#7c3aed;border-color:#c4b5fd}
.bz-tk-guitar .bz-test:hover{background:#f3edff}
.bz-tk-bass .bz-test{color:#12856f;border-color:#a5d8cd}
.bz-tk-bass .bz-test:hover{background:#eafaf6}
.bz-editbox{background:#fff;border:1px solid #eef1f4;border-radius:12px;padding:12px 14px;margin-bottom:12px;box-shadow:0 2px 8px rgba(0,0,0,.05)}
.bz-edithead{display:flex;align-items:baseline;gap:10px;margin-bottom:10px;flex-wrap:wrap}
.bz-edithead b{font-size:14px;color:#333}
.bz-edithead span{font-size:12px;color:#999}
.bz-editrow{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.bz-editlabel{width:44px;flex:none;font-size:12px;color:#888;text-align:right;white-space:nowrap;overflow:hidden}
.bz-editcells{flex:1;display:grid;grid-template-columns:repeat(16,1fr);gap:2px}
.bz-editcell{height:16px;border-radius:4px;background:#eef1f4;cursor:pointer;transition:background .1s}
.bz-editcell.on{background:#06b672}
.bz-edittip{font-size:12px;color:#999;margin-top:8px}
#bz-resetpat{margin-top:10px;padding:6px 14px;font-size:12px}
.bz-tips{background:linear-gradient(90deg,#e9faf2,#f5fbf8);border:1px solid #d2f0e0;border-left:4px solid #06b672;border-radius:8px;padding:10px 14px;font-size:13px;color:#3d6b53;line-height:1.8}
body.night .bz-wrap{color:#d1d5db}
body.night .bz-load,body.night .bz-top,body.night .bz-cell,body.night .bz-chordbox,body.night .bz-steps,body.night .bz-track,body.night .bz-editbox{background:#1f2937;border-color:#374151;box-shadow:none}
body.night .bz-loadbar,body.night .bz-step{background:#374151}
body.night .bz-step.on{background:linear-gradient(180deg,#06b672,#0e9dd6)}
body.night .bz-cell select,body.night .bz-chordbox input[type=text]{background:#111827;border-color:#4b5563;color:#e5e7eb}
body.night .bz-btn{background:#273244;border-color:#4b5a6b;color:#cbd5e1}
body.night .bz-btn:hover{border-color:#06b672;color:#6ee7b7}
body.night .bz-chip{background:#273244;border-color:#4b5a6b;color:#cbd5e1}
body.night .bz-chip:hover{background:#123a2b;border-color:#06b672;color:#6ee7b7}
body.night .bz-cur b{color:#6ee7b7;background:#123a2b;border-color:#0e7a4e}
body.night .bz-track b{color:#e5e7eb}
body.night .bz-track .bz-dot{box-shadow:none}
body.night .bz-edithead b{color:#e5e7eb}
body.night .bz-editcell{background:#374151}
body.night .bz-editcell.on{background:#06b672}
body.night .bz-edithead span,body.night .bz-edittip{color:#7a8a98}
body.night .bz-tips{background:#14211c;border-color:#2c3a33;border-left-color:#06b672;color:#8fd4b0}
.bz-mode{display:flex;gap:8px;background:#fff;border:1px solid #eef1f4;border-radius:12px;padding:6px;margin-bottom:12px;box-shadow:0 2px 8px rgba(0,0,0,.05)}
.bz-modebtn{flex:1;border:1px solid transparent;background:transparent;color:#666;font-size:14px;padding:9px 12px;border-radius:8px;cursor:pointer;font-weight:600;transition:all .2s}
.bz-modebtn:hover{color:#06b672}
.bz-modebtn.on{background:linear-gradient(135deg,#06b672,#0e9dd6);color:#fff;box-shadow:0 3px 10px rgba(6,182,114,.3)}
.bz-jp{background:#fff;border:1px solid #eef1f4;border-radius:12px;padding:14px 16px;box-shadow:0 2px 8px rgba(0,0,0,.05);margin-bottom:12px}
.bz-jp-head{display:flex;flex-wrap:wrap;gap:6px;align-items:baseline;margin-bottom:10px}
.bz-jp-head b{font-size:15px;color:#0f172a}
.bz-jp-head span{font-size:12px;color:#888}
.bz-jp-input textarea{width:100%;height:110px;border:1px solid #e5e7eb;border-radius:10px;padding:10px 12px;font-size:15px;line-height:1.7;resize:vertical;background:#fff;color:#333;outline:none;font-family:Consolas,Menlo,monospace;box-sizing:border-box}
.bz-jp-input textarea:focus{border-color:#06b672;box-shadow:0 0 0 3px rgba(6,182,114,.12)}
.bz-jp-tools{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:10px 0}
.bz-jp-sel{display:flex;align-items:center;gap:6px;font-size:13px;color:#666}
.bz-jp-sel select{border:1px solid #e5e7eb;border-radius:8px;padding:6px 8px;background:#fff;color:#333;outline:none;font-size:13px}
.bz-jp-sel select:focus{border-color:#06b672}
.bz-jpinfo{font-size:12px;color:#888;background:#f8fafc;border:1px solid #eef1f4;border-radius:8px;padding:8px 10px;margin-bottom:10px;line-height:1.7}
.bz-jpinfo-err{color:#ef4444;border-color:#fecaca;background:#fef2f2}
.bz-jp-ctrl{display:flex;gap:10px;margin-bottom:10px;flex-wrap:wrap}
.bz-jp-ctrl #bz-jpplay{background:linear-gradient(135deg,#06b672,#0e9dd6);border:none;color:#fff;font-weight:600;padding:10px 22px;border-radius:10px;box-shadow:0 4px 12px rgba(6,182,114,.3);min-width:96px}
.bz-jp-ctrl #bz-jpplay:hover{color:#fff;transform:translateY(-1px);box-shadow:0 6px 16px rgba(6,182,114,.4)}
.bz-jp-ctrl #bz-jpplay.on{background:linear-gradient(135deg,#ef4444,#f97316);box-shadow:0 4px 12px rgba(239,68,68,.3)}
.bz-jp-ctrl #bz-jpplay.on:hover{color:#fff}
.bz-jp-ctrl #bz-jpexport{background:#fff;border:1px solid #8b5cf6;color:#8b5cf6;font-weight:600}
.bz-jp-ctrl #bz-jpexport:hover{background:#f3edff;color:#7c3aed}
.bz-jp-tips{font-size:12px;color:#475569;background:#f8fafc;border:1px solid #eef1f4;border-radius:8px;padding:10px 14px;line-height:1.7}
.bz-jp-tips .bz-tips-t{font-size:13px;font-weight:700;color:#0f766e;margin-bottom:6px}
.bz-jp-tips ol{margin:0;padding-left:20px}
.bz-jp-tips li{margin:3px 0}
.bz-jp-tips li::marker{color:#06b672;font-weight:700}
.bz-jp-tips code{background:#e8f5ef;border-radius:4px;padding:0 5px;font-family:Consolas,Menlo,monospace;color:#0b7a5c}
.bz-jp-guide{background:linear-gradient(180deg,#fbfdff,#f6f8fb);border:1px solid #e2e8f0;border-radius:12px;margin-top:10px;overflow:hidden;box-shadow:0 1px 4px rgba(15,23,42,.05)}
.bz-jp-guide .bz-guide-t{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid #eef1f4;font-size:14px;font-weight:700;color:#0f766e}
.bz-jp-guide .bz-guide-s{font-size:11.5px;color:#94a3b8;font-weight:400}
.bz-jp-guide-body{padding:4px 16px 16px;font-size:12.5px;color:#475569;line-height:1.9}
.bz-jp-guide-body h4{margin:14px 0 6px;font-size:13px;color:#0f172a;display:flex;align-items:center;gap:6px}
.bz-jp-guide-body h4::before{content:"";width:3px;height:13px;border-radius:2px;background:#06b672;display:inline-block}
.bz-jp-guide-body p{margin:5px 0}
.bz-jp-guide-body code{background:#e8f5ef;border-radius:4px;padding:1px 6px;font-family:Consolas,Menlo,monospace;color:#0b7a5c;font-size:12px}
.bz-jp-guide-body pre{background:#0f172a;color:#d1d5db;border-radius:8px;padding:10px 12px;font-family:Consolas,Menlo,monospace;font-size:12px;line-height:1.8;overflow-x:auto;margin:6px 0}
.bz-jp-guide-body pre .c{color:#5eead4}
.bz-jp-guide-body table{width:100%;border-collapse:collapse;margin:6px 0;border-radius:8px;overflow:hidden}
.bz-jp-guide-body td,.bz-jp-guide-body th{border:1px solid #e2e8f0;padding:5px 10px;text-align:left;font-size:12px}
.bz-jp-guide-body tr:nth-child(even) td{background:#f8fafc}
.bz-jp-guide-body th{background:#eef4ee;color:#0f5132;font-weight:600}
.bz-jpdrop{display:flex;align-items:center;justify-content:center;gap:6px;flex-direction:column;border:2px dashed #d8dee6;border-radius:10px;padding:20px 12px;margin-top:8px;font-size:13px;color:#888;cursor:pointer;transition:all .2s;background:#fafbfc;min-height:88px}
.bz-jpdrop:hover,.bz-jpdrop.over{border-color:#06b672;background:#eefaf3;color:#3d6b53}
.bz-jptransline{display:flex;align-items:center;gap:8px;margin:0 0 10px;font-size:13px;color:#666;flex-wrap:wrap}
.bz-jptransbtns{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.bz-jptransv{font-size:12px;color:#06b672;min-width:56px;text-align:center;font-weight:700}
.bz-jpscore{display:flex;flex-wrap:wrap;align-items:center;background:#fff;border:1px solid #eef1f4;border-radius:10px;padding:12px;margin-bottom:10px;min-height:46px;overflow-x:auto;font-family:Consolas,Menlo,monospace;white-space:nowrap}
.bz-scorenote{position:relative;display:inline-flex;align-items:center;justify-content:center;width:26px;height:30px;font-size:15px;font-weight:700;color:#0f172a;border-radius:6px;transition:all .12s;background:#f5f7fa}
.bz-scorenote.up::after{content:'•';position:absolute;top:1px;left:50%;transform:translateX(-50%);font-size:10px;color:#06b672}
.bz-scorenote.down::before{content:'•';position:absolute;bottom:1px;left:50%;transform:translateX(-50%);font-size:10px;color:#8b5cf6}
.bz-scorerest{color:#c3cad4;background:transparent;font-weight:400}
.bz-scorebar{display:inline-block;width:1px;height:26px;background:#e5e7eb;margin:0 4px}
.bz-scorebar2{display:inline-flex;align-items:center;color:#06b672;font-weight:700;width:14px;justify-content:center}
.bz-scorenote.on{background:linear-gradient(135deg,#06b672,#0e9dd6);color:#fff;box-shadow:0 2px 8px rgba(6,182,114,.35);transform:scale(1.08)}
body.night .bz-mode,body.night .bz-jp{background:#1f2937;border-color:#374151;box-shadow:none}
body.night .bz-modebtn{color:#9ca3af}
body.night .bz-modebtn.on{color:#fff}
body.night .bz-jp-head b{color:#e5e7eb}
body.night .bz-jp-head span{color:#7a8a98}
body.night .bz-jp-input textarea,body.night .bz-jp-sel select{background:#111827;border-color:#4b5563;color:#e5e7eb}
body.night .bz-jpinfo,body.night .bz-jp-tips{background:#111827;border-color:#374151;color:#9ca3af}
body.night .bz-jp-tips .bz-tips-t{color:#5eead4}
body.night .bz-jp-tips code{background:#123a2b;color:#6ee7b7}
body.night .bz-jp-tips li::marker{color:#5eead4}
body.night .bz-jp-guide{background:linear-gradient(180deg,#101826,#0d1520);border-color:#334155}
body.night .bz-jp-guide .bz-guide-t{border-bottom-color:#253041;color:#5eead4}
body.night .bz-jp-guide .bz-guide-s{color:#64748b}
body.night .bz-jp-guide-body{color:#a7b4c4}
body.night .bz-jp-guide-body h4{color:#f1f5f9}
body.night .bz-jp-guide-body code{background:#123a2b;color:#6ee7b7}
body.night .bz-jp-guide-body td,body.night .bz-jp-guide-body th{border-color:#334155}
body.night .bz-jp-guide-body tr:nth-child(even) td{background:#111a26}
body.night .bz-jp-guide-body th{background:#1d2b3a;color:#7dd3a8}
body.night .bz-jpinfo-err{color:#fca5a5;border-color:#7f1d1d;background:#450a0a}
body.night .bz-jp-ctrl #bz-jpexport{background:#273244;border-color:#8b5cf6;color:#a78bfa}
body.night .bz-jp-ctrl #bz-jpexport:hover{background:#2e2545;color:#c4b5fd}
body.night .bz-jpdrop{background:#111827;border-color:#4b5563;color:#7a8a98}
body.night .bz-jpdrop:hover,body.night .bz-jpdrop.over{border-color:#06b672;background:#123a2b;color:#6ee7b7}
body.night .bz-jpscore{background:#111827;border-color:#374151}
body.night .bz-scorenote{background:#273244;color:#e5e7eb}
body.night .bz-scorerest{color:#4b5a6b;background:transparent}
body.night .bz-scorebar{background:#4b5a6b}
body.night .bz-scorenote.on{background:linear-gradient(135deg,#06b672,#0e9dd6);color:#fff}
body.night .bz-jptransv{color:#6ee7b7}
@media screen and (max-width:900px){.bz-tracks{grid-template-columns:1fr}}
@media screen and (max-width:600px){.bz-panel{grid-template-columns:1fr 1fr}.bz-steps{gap:3px;padding:8px}.bz-step{height:20px;border-radius:4px}.bz-top{padding:10px 12px}}
@media screen and (max-width:420px){.bz-panel{grid-template-columns:1fr}.bz-bpmbox{min-width:100%}}