.gh-draw{--gh-draw-accent:#ff5401;--gh-draw-accent-d:#d94400;--gh-draw-ink:#2b2f3a;--gh-draw-bg:#f6faf9;--gh-draw-line:#dfeae7;--gh-draw-stroke:#3d4250;--gh-draw-tab:#4f9a8f;max-width:640px;color:var(--gh-draw-ink);background:var(--gh-draw-bg);border:1px solid var(--gh-draw-line);border-radius:16px;margin:1rem auto;padding:1.1rem 1.15rem 1.25rem;font-family:inherit}.gh-draw__loading,.gh-draw__empty{text-align:center;color:#7c8092;padding:1.2rem 0}.gh-draw__title{text-align:center;margin:0 0 .5rem;font-size:1.25rem;font-weight:800;line-height:1.3}.gh-draw__intro{color:#545a6b;text-align:center;max-width:34rem;margin:0 auto 1rem;font-size:.95rem;line-height:1.55}.gh-draw__tabs{justify-content:center;gap:.4rem;margin-bottom:.9rem;display:flex}.gh-draw__tab{color:#55606b;border:1.5px solid var(--gh-draw-line);cursor:pointer;background:#fff;border-radius:999px;padding:.5rem 1rem;font-size:.9rem;font-weight:600;transition:color .15s,border-color .15s,background .15s}.gh-draw__tab:hover{border-color:var(--gh-draw-tab)}.gh-draw__tab.is-active{color:#fff;background:var(--gh-draw-tab);border-color:var(--gh-draw-tab)}.gh-draw__stage{justify-content:center;margin:0 auto .9rem;display:flex}.gh-draw__canvaswrap{width:100%;max-width:var(--gh-draw-canvas-w,340px);position:relative}.gh-draw__svg{width:100%;max-width:var(--gh-draw-canvas-w,340px);aspect-ratio:1;color:var(--gh-draw-stroke);border:1px solid var(--gh-draw-line);touch-action:manipulation;background:#fff;border-radius:12px;margin:0 auto;display:block}.gh-draw__brush{cursor:crosshair;touch-action:none;border-radius:12px;width:100%;height:100%;position:absolute;inset:0}.gh-draw__region{cursor:pointer;stroke:#eef2f1;stroke-width:.5px;transition:fill .12s}.gh-draw__region:hover{opacity:.85}.gh-draw__controls{text-align:center}.gh-draw__steplabel{color:var(--gh-draw-tab);min-height:1.4em;margin-bottom:.6rem;font-size:.9rem;font-weight:600}.gh-draw__row{flex-wrap:wrap;justify-content:center;align-items:center;gap:.5rem;margin-bottom:.55rem;display:flex}.gh-draw__caption{color:#8b90a0;margin-right:.2rem;font-size:.82rem}.gh-draw__caption--gap{margin-left:.5rem}.gh-draw__sizes{justify-content:center;align-items:center;gap:.35rem;margin:0 0 .7rem;display:flex}.gh-draw__size{color:#55606b;border:1.5px solid var(--gh-draw-line);cursor:pointer;background:#fff;border-radius:8px;min-width:34px;padding:.28rem .55rem;font-size:.82rem;font-weight:700;transition:border-color .12s,color .12s,background .12s}.gh-draw__size:hover{border-color:var(--gh-draw-tab)}.gh-draw__size.is-active{color:#fff;background:var(--gh-draw-tab);border-color:var(--gh-draw-tab)}.gh-draw__shaderow{justify-content:center;align-items:center;gap:.4rem;margin-bottom:.7rem;display:flex}.gh-draw__palette--shades{margin-bottom:0}.gh-draw__row--brush{flex-wrap:wrap;gap:.3rem;margin-bottom:.6rem}.gh-draw__brushtype,.gh-draw__bsize{color:#55606b;border:1.5px solid var(--gh-draw-line);cursor:pointer;background:#fff;border-radius:999px;padding:.3rem .6rem;font-size:.8rem;font-weight:600;transition:border-color .12s,color .12s,background .12s}.gh-draw__brushtype:hover,.gh-draw__bsize:hover{border-color:var(--gh-draw-tab)}.gh-draw__brushtype.is-active,.gh-draw__bsize.is-active{color:#fff;background:var(--gh-draw-accent);border-color:var(--gh-draw-accent)}.gh-draw__btn{color:#fff;background:var(--gh-draw-accent);cursor:pointer;border:none;border-radius:999px;padding:.58rem 1.2rem;font-size:.92rem;font-weight:700;transition:background .15s,transform .1s}.gh-draw__btn:hover{background:var(--gh-draw-accent-d)}.gh-draw__btn:active{transform:translateY(1px)}.gh-draw__btn--ghost{color:var(--gh-draw-accent-d);border:1.5px solid var(--gh-draw-line);background:0 0}.gh-draw__btn--ghost:hover{border-color:var(--gh-draw-accent);background:#fff}.gh-draw__btn--ghost.is-active{color:#fff;background:var(--gh-draw-tab);border-color:var(--gh-draw-tab)}.gh-draw__speed{color:#55606b;border:1.5px solid var(--gh-draw-line);cursor:pointer;background:#fff;border-radius:999px;padding:.38rem .85rem;font-size:.85rem;font-weight:600;transition:border-color .12s,color .12s}.gh-draw__speed:hover{border-color:var(--gh-draw-tab)}.gh-draw__speed.is-active{color:#fff;background:var(--gh-draw-tab);border-color:var(--gh-draw-tab)}.gh-draw__palette{flex-wrap:wrap;justify-content:center;gap:.5rem;margin-bottom:.8rem;display:flex}.gh-draw__swatch{background:var(--sw);width:32px;height:32px;box-shadow:0 0 0 1.5px var(--gh-draw-line);cursor:pointer;border:2px solid #fff;border-radius:50%;padding:0;transition:transform .1s,box-shadow .12s}.gh-draw__swatch:hover{transform:scale(1.1)}.gh-draw__swatch.is-active{box-shadow:0 0 0 3px var(--gh-draw-accent)}.gh-draw__progression{border-top:1px solid var(--gh-draw-line);margin-top:1.2rem;padding-top:1rem}.gh-draw__prog-head{text-align:center;margin-bottom:.35rem;font-size:1.02rem;font-weight:800}.gh-draw__prog-note{color:#5b6472;text-align:center;max-width:34rem;margin:0 auto .8rem;font-size:.86rem;line-height:1.5}.gh-draw__prog-row{flex-wrap:wrap;justify-content:center;align-items:center;gap:.5rem;display:flex}.gh-draw__prog-cell{text-align:center;flex:0 130px;margin:0}.gh-draw__prog-img{aspect-ratio:1;object-fit:contain;border:1px solid var(--gh-draw-line);background:#fff;border-radius:10px;width:100%;max-width:140px}.gh-draw__prog-cap{color:#55606b;margin-top:.3rem;font-size:.8rem;font-weight:600}.gh-draw__prog-arrow{color:var(--gh-draw-accent,#ff5401);flex:none;font-size:1.3rem;font-weight:700}.gh-draw__examples{border-top:1px solid var(--gh-draw-line);margin-top:1.2rem;padding-top:1rem}.gh-draw__ex-head{text-align:center;margin-bottom:.35rem;font-size:1.02rem;font-weight:800}.gh-draw__ex-note{color:#5b6472;text-align:center;max-width:34rem;margin:0 auto .8rem;font-size:.86rem;line-height:1.5}.gh-draw__ex-player{aspect-ratio:16/9;background:#000;border-radius:12px;max-width:480px;margin:0 auto;position:relative;overflow:hidden}.gh-draw__ex-facade{cursor:pointer;background:#000;border:none;width:100%;height:100%;padding:0;display:block;position:relative}.gh-draw__ex-poster{object-fit:cover;opacity:.92;width:100%;height:100%;transition:opacity .15s;display:block}.gh-draw__ex-facade:hover .gh-draw__ex-poster{opacity:1}.gh-draw__ex-playbtn{background:var(--gh-draw-accent,#ff5401);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;padding-left:4px;font-size:1.3rem;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 2px 10px #00000059}.gh-draw__ex-iframe{border:0;width:100%;height:100%;display:block}.gh-draw__ex-list{max-width:480px;margin:.7rem auto 0;padding:0;list-style:none}.gh-draw__ex-item{text-align:left;color:#3d4250;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:8px;align-items:center;gap:.5rem;width:100%;padding:.5rem .6rem;font-size:.88rem;display:flex}.gh-draw__ex-item:hover{background:#f4f6fa}.gh-draw__ex-item.is-active{color:var(--gh-draw-accent,#d94400);font-weight:700}.gh-draw__ex-dot{color:var(--gh-draw-accent,#ff5401);flex:none;font-size:.7rem}@media (width<=480px){.gh-draw{padding:.9rem .8rem 1rem}.gh-draw__tab{padding:.45rem .7rem;font-size:.82rem}.gh-draw__title{font-size:1.1rem}.gh-draw__svg,.gh-draw__canvaswrap{max-width:280px}.gh-draw__swatch{width:28px;height:28px}}