.mcl51-studio{--mcl51-green:#158661;--mcl51-ink:#213b30;--mcl51-border:#dfebe4;color:var(--mcl51-ink);padding:16px 0 56px;font-family:inherit}.mcl51-studio *{box-sizing:border-box}.mcl51-hero{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:30px 34px;margin-bottom:22px;background:linear-gradient(115deg,#e4f7eb,#f8fcf8);border:1px solid #d6ecde;border-radius:22px}.mcl51-eyebrow{font-size:11px;font-weight:800;letter-spacing:2px;color:#2f8460}.mcl51-hero h1{font-size:clamp(26px,3vw,38px);letter-spacing:-1px;line-height:1.25;margin:8px 0 10px}.mcl51-hero h1 span{font-weight:500;color:#6b987c;font-size:.7em}.mcl51-hero p{margin:0;color:#5c7468;line-height:1.6}.mcl51-link{display:inline-block;white-space:nowrap;border:1px solid #bbe1cb;border-radius:12px;color:#187251;padding:12px 16px;background:#fff;font-weight:750}.mcl51-layout{display:grid;grid-template-columns:minmax(260px,330px) minmax(0,1fr);gap:20px}.mcl51-card{background:#fff;border:1px solid var(--mcl51-border);border-radius:20px;padding:24px;box-shadow:0 9px 30px rgba(20,58,36,.035);margin-bottom:20px}.mcl51-card h2{font-size:21px;margin:0}.mcl51-settings label{display:block;font-size:13px;font-weight:750;margin:0 0 10px}.mcl51-settings input,.mcl51-composer select{padding:12px;border-radius:10px;border:1px solid #cdded4;min-width:0;background:#fff;color:inherit}.mcl51-search{display:flex;gap:6px}.mcl51-search input{width:100%;flex:1}.mcl51-studio button{cursor:pointer;font-family:inherit}.mcl51-studio button:focus-visible,.mcl51-studio a:focus-visible{outline:3px solid #5bb891;outline-offset:3px}.mcl51-search button,.mcl51-primary{background:#158661;color:#fff;border:0;border-radius:10px;padding:11px 16px;font-weight:750}.mcl51-results{display:grid;gap:6px;max-height:220px;overflow:auto;margin-top:12px}.mcl51-result{display:flex;gap:10px;text-align:left;align-items:center;border:1px solid #e1eee7;background:#f9fcfa;padding:8px;border-radius:9px}.mcl51-result b{font-size:23px}.mcl51-result span{font-size:12px;color:#597164}.mcl51-target{display:flex;align-items:center;gap:18px;background:#f2faf5;padding:18px;margin:18px 0;border-radius:14px}.mcl51-large{font-size:50px;line-height:1.3;max-width:120px;overflow-wrap:anywhere}.mcl51-target p{margin:4px 0}.mcl51-target small,.mcl51-small{font-size:12px;line-height:1.7;color:#72877a}.mcl51-character-list{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:15px}.mcl51-char{border:1px solid #d7e5da;background:#f8fbf8;border-radius:10px;padding:5px 13px;font-size:25px}.mcl51-char.active{background:#e1f6e7;border-color:#159565;color:#096e4c}.mcl51-count{margin-top:25px;border-top:1px solid #e5eee7;padding-top:17px;display:flex;align-items:center;justify-content:space-between;gap:10px}.mcl51-count strong{display:block;font-size:26px}.mcl51-count small{display:block;color:#71877b;font-size:11px}.mcl51-toolbar{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:20px}.mcl51-badge{background:#e9f7ec;border-radius:40px;color:#217b55;padding:7px 12px;font-size:12px}.mcl51-toolbar h2 span{color:#198661;font-size:26px}.mcl51-writing-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.mcl51-writing-grid>div{min-width:0}.mcl51-grid-box{width:min(100%,360px);aspect-ratio:1;position:relative;margin:0 auto;border:2px solid #b8d9c4;border-radius:12px;background:linear-gradient(to right,transparent calc(50% - .5px),#d4e5d9 50%,transparent calc(50% + .5px)),linear-gradient(to bottom,transparent calc(50% - .5px),#d4e5d9 50%,transparent calc(50% + .5px)),linear-gradient(45deg,transparent calc(50% - .5px),#e7eee9 50%,transparent calc(50% + .5px)),linear-gradient(-45deg,transparent calc(50% - .5px),#e7eee9 50%,transparent calc(50% + .5px)),#fff;overflow:hidden;display:grid;place-items:center}.mcl51-grid-box>svg{width:100%;height:100%}.mcl51-canvas-shell canvas{width:100%;height:100%;touch-action:none;display:block;cursor:crosshair}.mcl51-fallback-character{font-size:clamp(100px,19vw,220px);color:#b0c7b7}.mcl51-center{text-align:center;font-size:12px;color:#65796b;margin:10px 0}.mcl51-controls{display:flex;flex-wrap:wrap;gap:9px;margin:18px 0}.mcl51-controls button{border:1px solid #d7e7db;border-radius:10px;padding:10px 13px;background:#f7faf7;color:#285e44;font-size:13px;font-weight:700}.mcl51-controls button:hover,.mcl51-sound:hover{border-color:#188e64;background:#eaf7ed}.mcl51-section-heading{margin-bottom:20px}.mcl51-section-heading p{color:#667e70;margin:8px 0 0}.mcl51-sound-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:10px}.mcl51-sound{display:flex;flex-direction:column;align-items:center;gap:5px;padding:14px 8px;background:#fafdfa;border:1px solid #dfebe5;border-radius:11px;color:#1e7652}.mcl51-sound strong{font-size:24px}.mcl51-sound span{font-size:12px;color:#698174}.mcl51-final-group{padding-bottom:17px;margin-bottom:17px;border-bottom:1px solid #e7f0e9}.mcl51-final-group:last-child{border:0;margin-bottom:0}.mcl51-final-group h3{font-size:15px;margin:0 0 11px}.mcl51-tone-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.mcl51-tone-card{padding:19px 8px;border:1px solid #dcebe0;border-radius:13px;background:#f6fbf7;color:#256c4b;display:grid;gap:9px;text-align:center}.mcl51-tone-card strong{font-size:32px}.mcl51-tone-card span{font-size:12px;font-weight:700}.mcl51-tone-card small{color:#6b7e70}.mcl51-composer{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.mcl51-composer label{font-weight:750;font-size:13px}.mcl51-composed{text-align:center;padding:20px;background:#f4faf5;border-radius:16px;margin-top:18px}.mcl51-composed strong{font-size:64px;color:#167b53}.mcl51-composed p{margin:0;color:#687e70}.mcl51-tip-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.mcl51-tip-grid p{line-height:1.7;margin:0;background:#f6fbf7;padding:16px;border-radius:11px;color:#405c4b}.mcl51-tip h2{margin-bottom:18px}@media(max-width:900px){.mcl51-layout{grid-template-columns:1fr}.mcl51-tone-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:620px){.mcl51-hero{display:block;padding:22px}.mcl51-link{margin-top:16px}.mcl51-card{padding:16px}.mcl51-writing-grid{gap:8px}.mcl51-tone-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.mcl51-tip-grid{grid-template-columns:1fr}.mcl51-toolbar{flex-wrap:wrap}.mcl51-canvas-shell{min-width:0}}