.reg-slider{width:300px;margin:12px auto;padding:16px;border:1px solid #d4dacd;border-radius:14px;background:#fcfbf6;color:#334e43;font:13px/1.5 "Microsoft YaHei",Arial,sans-serif;text-align:left;box-shadow:0 8px 26px rgba(33,60,49,.12),inset 0 0 0 4px rgba(255,255,255,.65)}
.reg-slider-heading{position:relative;margin:0 0 13px;min-height:25px;font-size:14px;font-weight:600;line-height:25px;letter-spacing:1px}
.reg-slider-heading:before{content:"";display:inline-block;box-sizing:border-box;width:13px;height:13px;margin:0 10px 2px 2px;border:1px solid #648473;border-radius:3px;background:#e7ecdd;box-shadow:inset 0 0 0 3px #fcfbf6;transform:rotate(45deg);vertical-align:middle}
.reg-slider-refresh{position:absolute;right:0;top:0;min-width:54px;height:25px;margin:0;padding:0 7px;border:1px solid #e1e4d9;border-radius:12px;background:#f4f4eb;color:#6f7e66;font:11px/23px "Microsoft YaHei",Arial,sans-serif;cursor:pointer;transition:background .15s,color .15s}
.reg-slider-refresh:before{content:"\21bb";margin-right:4px;font:14px Arial,sans-serif;vertical-align:-1px}
.reg-slider-refresh:hover{background:#e8eedf;color:#3a6655}.reg-slider-refresh:disabled{opacity:.55;cursor:wait}.reg-slider-refresh:focus,.reg-slider-handle:focus{outline:2px solid #8f9e71;outline-offset:2px}
.reg-puzzle{position:relative;width:300px;height:120px;overflow:hidden;border-radius:8px;background:#e4e9d7;isolation:isolate}
.reg-puzzle:after{content:"";position:absolute;inset:0;border:1px solid rgba(91,111,83,.16);border-radius:8px;pointer-events:none;z-index:4}
.reg-puzzle-bg,.reg-puzzle-hole{position:absolute;left:0;top:0;width:300px;height:120px;border:0;pointer-events:none;user-select:none;-webkit-user-drag:none}
.reg-puzzle-piece{position:absolute;z-index:2;left:0;width:46px;height:46px;border:0;filter:drop-shadow(0 2px 2px rgba(22,47,37,.3));pointer-events:none;user-select:none;-webkit-user-drag:none}
.reg-slider-bar{position:relative;width:300px;height:50px;margin-top:14px;overflow:hidden;border:0;border-radius:25px;background:#eff0e6;background:linear-gradient(180deg,#e9eddf,#f3f4ec);box-shadow:inset 0 0 0 1px #dfe4d5,inset 0 2px 4px rgba(56,76,47,.035);touch-action:none;user-select:none;-webkit-user-select:none}
.reg-slider-fill{position:absolute;left:0;top:0;width:0;height:50px;border-radius:25px;background:#d9e5cf;background:linear-gradient(90deg,#cbdac0,#e3ead7)}
.reg-slider-text{position:absolute;z-index:2;left:50px;right:12px;top:0;display:block;line-height:50px;text-align:center;color:#7b866e;font-size:12px;letter-spacing:.4px;pointer-events:none;transition:opacity .15s}
.reg-slider-handle{position:absolute;z-index:3;left:0;top:2px;box-sizing:border-box;width:46px;height:46px;border:1px solid #3e6a55;border-radius:50%;background:#3c745d;background:linear-gradient(145deg,#6a9677 0%,#3d755b 48%,#285540 100%);color:#f6edcb;font:26px/42px Arial,sans-serif;text-align:center;box-shadow:0 2px 5px rgba(32,69,47,.22),inset 0 1px 1px rgba(255,253,222,.35);cursor:grab;touch-action:none;transition:box-shadow .15s}
.reg-slider-handle:before{content:"";position:absolute;inset:4px;border:1px solid rgba(232,219,169,.45);border-radius:50%;pointer-events:none}
.reg-slider-handle:after{content:"";position:absolute;left:50%;top:50%;display:block;width:8px;height:8px;margin:-5px 0 0 -7px;border-top:2px solid currentColor;border-right:2px solid currentColor;transform:rotate(45deg)}
.reg-slider-status{margin-top:11px;color:#929883;font-size:11px;line-height:18px;text-align:center;min-height:18px;letter-spacing:.3px}
.reg-slider-status:before,.reg-slider-status:after{content:"\00b7";padding:0 6px;color:#b8ae87}
.reg-slider-dragging .reg-slider-handle{cursor:grabbing;box-shadow:0 2px 8px rgba(32,69,47,.35),inset 0 1px 1px rgba(255,253,222,.35)}
.reg-slider-dragging .reg-slider-text{opacity:0}
.reg-slider-loading .reg-slider-handle,.reg-slider-checking .reg-slider-handle{background:#a1b29a;border-color:#94a38a;cursor:wait;box-shadow:none}
.reg-slider-error .reg-slider-status{color:#b66043}
.reg-slider-ok .reg-slider-bar{background:#edf2e5;box-shadow:inset 0 0 0 1px #d5e1c9}
.reg-slider-ok .reg-slider-text{left:0;right:0;color:#476f48;font-weight:600;font-size:13px}
.reg-slider-ok .reg-slider-handle{visibility:hidden}.reg-slider-ok .reg-slider-fill{width:100%!important;background:#edf2e5}
.reg-slider-ok .reg-slider-status{color:#718764}.reg-slider-ok .reg-puzzle-piece,.reg-slider-ok .reg-puzzle-hole{opacity:0;transition:opacity .25s}
@media(max-width:420px){form[name=reg]>table{width:100%!important;max-width:400px}form[name=reg]>table table{width:100%!important}.reg-slider{padding:10px;margin:10px auto}}
@media(prefers-reduced-motion:reduce){.reg-slider *{transition:none!important}}
