.crTonesAction{margin:20px 0 0;display:flex;flex-wrap:wrap;gap:12px;justify-content:inherit}
.crTonesAction>.crTonesButton{display:inline-flex;align-items:center;justify-content:center;min-height:44px;max-width:100%;padding:10px 20px;border:1px solid #cdd8d3;border-radius:999px;background:transparent;color:#294c40;font-family:inherit;font-size:14px;font-weight:400;line-height:1.5;letter-spacing:0;text-align:center;cursor:pointer}
.crTonesAction>.crTonesButton:hover{background:#f3f7f4;border-color:#91aa9c}
.crTonesAction>.crTonesButton:focus-visible,#cr-tones-dialog button:focus-visible{outline:2px solid #296552;outline-offset:4px}
html.crTonesOpen{overflow:hidden}
#cr-tones-dialog{box-sizing:border-box;width:min(720px,calc(100% - 24px));max-width:720px;max-height:calc(100dvh - 32px);margin:auto;padding:0;border:1px solid #e7ece8;border-radius:18px;background:#fff;color:#23302e;box-shadow:0 18px 70px #142a2440;font-family:inherit;overflow:auto;overscroll-behavior:contain}
#cr-tones-dialog::backdrop{background:rgb(20 35 30 / .45)}
#cr-tones-dialog *{box-sizing:border-box}
#cr-tones-dialog .crTonesSheet{padding:28px 32px}
#cr-tones-dialog .crTonesHeader{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 22px}
#cr-tones-dialog .crTonesBrand{font-size:12px;letter-spacing:2px;font-weight:500;color:#296552}
#cr-tones-dialog .crTonesClose{font:inherit;font-size:13px;color:#294c40;background:#fff;border:1px solid #cdd8d3;border-radius:999px;padding:8px 14px;min-height:44px;cursor:pointer;flex:none}
#cr-tones-dialog h2{font-size:29px;line-height:1.25;font-weight:300;letter-spacing:-.7px;margin:0 0 10px;text-align:left;color:#23302e}
#cr-tones-dialog .crTonesIntro{font-size:14px;line-height:1.6;color:#5d6b64;margin:0 0 22px}
#cr-tones-dialog .crTonesRow{display:grid;grid-template-columns:105px 90px minmax(0,1fr);align-items:center;gap:16px;padding:18px 0;border-top:1px solid #e7ece8;text-align:left}
#cr-tones-dialog .crTonesNumber{font-size:11px;text-transform:uppercase;color:#5d6b64;line-height:1.5;margin-bottom:5px;letter-spacing:.3px}
#cr-tones-dialog .crTonesName{font-size:15px;font-weight:400;line-height:1.4}
#cr-tones-dialog .crTonesCurve{width:90px;height:48px;overflow:visible}
#cr-tones-dialog .crTonesPath{fill:none;stroke:#296552;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
#cr-tones-dialog .crTonesBase{fill:none;stroke:#e7ece8;stroke-width:1}
#cr-tones-dialog circle{fill:#296552}
#cr-tones-dialog .crTonesExample{font-size:21px;line-height:1.5;margin-bottom:5px}
#cr-tones-dialog .crTonesMeaning{display:inline-block;margin-left:10px;font-size:13px;color:#5d6b64}
#cr-tones-dialog .crTonesDescription{font-size:13px;line-height:1.5;color:#5d6b64}
#cr-tones-dialog .crTonesNote{border-top:1px solid #e7ece8;padding-top:18px;margin:0;font-size:12px;line-height:1.6;color:#5d6b64;text-align:left}
@media(max-width:480px){#cr-tones-dialog .crTonesSheet{padding:20px 16px}#cr-tones-dialog h2{font-size:25px}#cr-tones-dialog .crTonesRow{grid-template-columns:82px 44px minmax(0,1fr);gap:9px}#cr-tones-dialog .crTonesCurve{width:44px;height:40px}#cr-tones-dialog .crTonesMeaning{display:block;margin:3px 0 0}#cr-tones-dialog .crTonesExample{font-size:20px}#cr-tones-dialog .crTonesNumber{font-size:11px}}