@font-face{font-family:"Asap";font-style:normal;font-weight:400;src:local("Asap Regular"),local("Asap-Regular"),url("../font/asap-v11-latin-regular.woff2") format("woff2"),url("../font/asap-v11-latin-regular.woff") format("woff")}@font-face{font-family:"Asap";font-style:normal;font-weight:600;src:local("Asap SemiBold"),local("Asap-SemiBold"),url("../font/asap-v11-latin-600.woff2") format("woff2"),url("../font/asap-v11-latin-600.woff") format("woff")}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}:focus{outline:none !important}*{box-sizing:border-box;user-select:none}a{color:inherit}input{user-select:auto}html,body{height:100%}body{margin:0;padding:0;overflow:hidden;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;overscroll-behavior:none}/*!
 * Cropper.js v1.5.13
 * https://fengyuanchen.github.io/cropperjs
 *
 * Copyright 2015-present Chen Fengyuan
 * Released under the MIT license
 *
 * Date: 2022-11-20T05:30:43.444Z
 */.cropper-container{direction:ltr;font-size:0;line-height:0;position:relative;-ms-touch-action:none;touch-action:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.cropper-container img{-webkit-backface-visibility:hidden;backface-visibility:hidden;display:block;height:100%;image-orientation:0deg;max-height:none !important;max-width:none !important;min-height:0 !important;min-width:0 !important;width:100%}.cropper-canvas,.cropper-crop-box,.cropper-drag-box,.cropper-modal,.cropper-wrap-box{bottom:0;left:0;position:absolute;right:0;top:0}.cropper-canvas,.cropper-wrap-box{overflow:hidden}.cropper-drag-box{background-color:#fff;opacity:0}.cropper-modal{background-color:#000;opacity:.5}.cropper-view-box{display:block;height:100%;outline:1px solid #39f;outline-color:rgba(51, 153, 255, 0.75);overflow:hidden;width:100%}.cropper-dashed{border:0 dashed #eee;display:block;opacity:.5;position:absolute}.cropper-dashed.dashed-h{border-bottom-width:1px;border-top-width:1px;height:33.33333%;left:0;top:33.33333%;width:100%}.cropper-dashed.dashed-v{border-left-width:1px;border-right-width:1px;height:100%;left:33.33333%;top:0;width:33.33333%}.cropper-center{display:block;height:0;left:50%;opacity:.75;position:absolute;top:50%;width:0}.cropper-center:after,.cropper-center:before{background-color:#eee;content:" ";display:block;position:absolute}.cropper-center:before{height:1px;left:-3px;top:0;width:7px}.cropper-center:after{height:7px;left:0;top:-3px;width:1px}.cropper-face,.cropper-line,.cropper-point{display:block;height:100%;opacity:.1;position:absolute;width:100%}.cropper-face{background-color:#fff;left:0;top:0}.cropper-line{background-color:#39f}.cropper-line.line-e{cursor:ew-resize;right:-3px;top:0;width:5px}.cropper-line.line-n{cursor:ns-resize;height:5px;left:0;top:-3px}.cropper-line.line-w{cursor:ew-resize;left:-3px;top:0;width:5px}.cropper-line.line-s{bottom:-3px;cursor:ns-resize;height:5px;left:0}.cropper-point{background-color:#39f;height:5px;opacity:.75;width:5px}.cropper-point.point-e{cursor:ew-resize;margin-top:-3px;right:-3px;top:50%}.cropper-point.point-n{cursor:ns-resize;left:50%;margin-left:-3px;top:-3px}.cropper-point.point-w{cursor:ew-resize;left:-3px;margin-top:-3px;top:50%}.cropper-point.point-s{bottom:-3px;cursor:s-resize;left:50%;margin-left:-3px}.cropper-point.point-ne{cursor:nesw-resize;right:-3px;top:-3px}.cropper-point.point-nw{cursor:nwse-resize;left:-3px;top:-3px}.cropper-point.point-sw{bottom:-3px;cursor:nesw-resize;left:-3px}.cropper-point.point-se{bottom:-3px;cursor:nwse-resize;height:20px;opacity:1;right:-3px;width:20px}@media(min-width: 768px){.cropper-point.point-se{height:15px;width:15px}}@media(min-width: 992px){.cropper-point.point-se{height:10px;width:10px}}@media(min-width: 1200px){.cropper-point.point-se{height:5px;opacity:.75;width:5px}}.cropper-point.point-se:before{background-color:#39f;bottom:-50%;content:" ";display:block;height:200%;opacity:0;position:absolute;right:-50%;width:200%}.cropper-invisible{opacity:0}.cropper-bg{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAAA3NCSVQICAjb4U/gAAAABlBMVEXMzMz////TjRV2AAAACXBIWXMAAArrAAAK6wGCiw1aAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAABFJREFUCJlj+M/AgBVhF/0PAH6/D/HkDxOGAAAAAElFTkSuQmCC)}.cropper-hide{display:block;height:0;position:absolute;width:0}.cropper-hidden{display:none !important}.cropper-move{cursor:move}.cropper-crop{cursor:crosshair}.cropper-disabled .cropper-drag-box,.cropper-disabled .cropper-face,.cropper-disabled .cropper-line,.cropper-disabled .cropper-point{cursor:not-allowed}body{font-family:"Asap",sans-serif;font-size:14px;color:#000;background-color:#f9f9f9}.nowrap{white-space:nowrap}button,input,textarea{font-family:"Asap",sans-serif;font-size:14px}button{cursor:pointer}.version-container{position:absolute;bottom:0;left:50%;font-size:12px;color:#ccc;transform:translateX(-50%)}.button{border-radius:10px;background-color:#f2f2f2;cursor:pointer;text-align:center;padding:12px;border:1px solid #ddd;margin:24px 0}.button.disabled{color:#d6d6d6;background-color:#fdfdfd;cursor:default}.animation-left-out{animation:horizontal-out 100ms ease-in 0s 1 normal forwards}.animation-left-in{animation:horizontal-out 100ms ease-in 0s 1 reverse forwards}.animation-right-in{animation:horizontal-in 100ms ease-in 0s 1 normal forwards}.animation-right-out{animation:horizontal-in 100ms ease-in 0s 1 reverse forwards}.animation-fadeInDown{animation:fadeInDown 300ms ease-in 0s 1 normal forwards}.animation-fadeOutUp{animation:fadeInDown 300ms ease-in 0s 1 reverse forwards}.animation-fadeInUp{animation:fadeInUp 300ms ease-in 0s 1 normal forwards}.animation-fadeOutDown{animation:fadeInUp 300ms ease-in 0s 1 reverse forwards}@keyframes horizontal-out{0%{opacity:1;transform:translateX(0px)}100%{opacity:0;transform:translateX(-20px)}}@keyframes horizontal-in{0%{opacity:0;transform:translateX(20px)}100%{opacity:1;transform:translateX(0px)}}@keyframes fadeInDown{from{opacity:0;transform:translate3d(0, -100%, 0)}to{opacity:1;transform:translate3d(0, 0, 0)}}@keyframes fadeInUp{from{opacity:0;transform:translate3d(0, 100%, 0)}to{opacity:1;transform:translate3d(0, 0, 0)}}

#body{position:relative;overflow:auto;height:calc(100% - 70px)}#version{position:absolute;bottom:0;text-align:center;color:#ccc;font-size:11px;pointer-events:none;width:100%}
#app-loading-container{position:absolute;top:0;bottom:0;left:0;right:0;z-index:1000;background-color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center}#app-loading-container h1{color:#c693c2}
#card-inner-container{width:100%;max-width:500px;margin:0 auto;padding:24px;overflow:hidden}#card-inner-container .flip{perspective:2000px;width:100%;height:100%}#card-inner-container .flip .flip-inner{position:relative;width:100%;height:100%;text-align:center;transition:transform .8s;transform-style:preserve-3d}#card-inner-container .flip.locked .flip-inner{transition:none}#card-inner-container .flip.flipping .flip-inner{transform:rotateY(-180deg)}#card-inner-container .flip .front-side,#card-inner-container .flip .back-side{position:absolute;width:100%;height:100%;backface-visibility:hidden;display:flex;flex-direction:column}#card-inner-container .flip .back-side{transform:rotateY(180deg)}#card-inner-container .front-side{box-shadow:0 0 9px rgba(0,0,0,.3);border-radius:20px;border:1px solid #fff;background-color:#c693c2;text-align:center;padding:24px;justify-content:center}#card-inner-container .front-side img{width:100%;border-radius:10px;border:2px solid #fff}#card-inner-container .front-side .cardnumber-container{display:flex;justify-content:center;align-items:center;flex-direction:column;margin-top:24px;margin-bottom:-74px}#card-inner-container .front-side .cardnumber-container .code-field{border-radius:10px;font-weight:bold;width:100%;color:#fff;font-size:26px;letter-spacing:2px}#card-inner-container .front-side .cardnumber-container .label{font-size:12px;padding:6px 12px;width:100%;color:#fff}#card-inner-container .back-side{box-shadow:0 0 9px rgba(0,0,0,.3);border-radius:20px;border:1px solid #fff;background-color:#fff;text-align:center;padding:24px;align-items:center;justify-content:center}#card-inner-container .back-side .qrcode{width:100%}#card-inner-container .back-side svg{max-width:160px}#card-inner-container .back-side .lock{position:absolute;bottom:24px;font-size:40px;cursor:pointer}#card-inner-container .back-side .lock .close{display:none}#card-inner-container .back-side .lock .open{display:inline-block}#card-inner-container .back-side .lock>i{text-align:center}#card-inner-container .back-side .lock.locked .close{display:inline-block}#card-inner-container .back-side .lock.locked .open{display:none}
#card-container{display:flex;height:100%}#card-container.empty{align-items:center}
#new-card-container{width:90%;max-width:360px;height:190px;margin:0 auto;box-shadow:0 0 9px rgba(0,0,0,.3);border-radius:10px;background-color:#f2f2f2;border:1px solid #fff;display:flex;align-items:center;flex-direction:column;justify-content:center;cursor:pointer}#new-card-container i{font-size:50px;color:#aaa}#new-card-container span{margin-top:12px;margin-bottom:-24px;line-height:12px;font-size:12px;color:#aaa}
.dialog-background{position:fixed;left:0;right:0;top:0;bottom:0;z-index:19;background-color:rgba(0,0,0,.3);transition:all .2s linear;visibility:hidden;opacity:0}.dialog-background.show{visibility:visible;opacity:1}.dialog{position:fixed;top:12px;left:12px;right:12px;bottom:12px;z-index:20;display:flex;align-items:center;flex-direction:column;justify-content:center}.dialog .dialog-inner{overflow:hidden;max-height:100%}.dialog .dialog-wrap{position:relative;max-height:100%;background-color:#fff;box-shadow:0 0 10px rgba(0,0,0,.5);border-radius:6px}@media(max-width: 600px){.dialog .dialog-wrap{min-width:100%}}.dialog.fullwide .dialog-wrap{width:100%;max-width:1000px}.dialog.fullheight .dialog-wrap{min-height:100%;padding-top:6px}.dialog.fullheight .dialog-wrap .dialog-inner{height:100%}.dialog.fullheight .dialog-wrap .close{top:-3px;right:-3px}.dialog .close{position:absolute;top:-8px;right:-10px;font-size:35px;background-color:#fff;border-radius:100%;width:30px;height:30px;box-shadow:2px -2px 7px 1px;display:flex;justify-content:center;align-items:center}.dialog .close i{width:36px;height:36px}.dialog .button-container{display:flex;flex-direction:row}.dialog .max-300{max-width:300px;width:100%}@media(max-width: 300px){.dialog .max-300 .button-container{flex-direction:column}}.confirm-dialog .title{padding:24px;border-bottom:1px solid #d6d6d6;font-size:20px;font-weight:normal}.confirm-dialog p{padding:12px 24px 0;margin:0}.confirm-dialog .button-container{gap:12px;margin:24px}.confirm-dialog .button{width:100%;min-width:100px;margin:0}.confirm-dialog .button.yes{border-color:#c693c2;background-color:#fff4fe;color:#c693c2}.waiting-dialog .title{padding:24px;border-bottom:1px solid #d6d6d6;font-size:20px;font-weight:normal}.waiting-dialog p{padding:24px;margin:0}.toast{position:fixed;left:12px;bottom:12px;right:12px;z-index:20;border-radius:6px}.toast .toast-inner{overflow:auto;max-height:100%;width:100%}.toast .toast-inner p{margin-top:6px;margin-bottom:12px}.toast .toast-wrap{position:relative;max-height:100%;padding:12px 0 12px 18px;background-color:rgba(0,0,0,.9);box-shadow:0 0 10px rgba(0,0,0,.5);border-radius:6px;font-size:14px;display:flex;flex-direction:row-reverse;padding-right:0;width:100%;color:#fff}.toast .close{font-size:35px;display:flex;justify-content:center;align-items:center;padding:0 18px}.toast .title{font-weight:bold;margin-bottom:6px}.toast .action{font-size:12px;color:#d6d6d6;margin-top:6px}
#header{display:flex;width:100%;height:70px;background-color:#fff;box-shadow:0 0 3px rgba(0,0,0,.4);position:relative;z-index:20}#header #logo{height:100%;padding:7px}#header .side{width:70px}#header .title{flex:1 0 auto;text-align:center}
#new-card-selector-container{position:fixed;top:0;left:0;bottom:0;right:0;z-index:10;background-color:#fff;padding-top:70px;transition:transform .4s linear;transform:translateY(-100%);display:flex;flex-direction:column;overflow:auto;overflow-x:hidden}#new-card-selector-container.show{transform:translateY(0)}#new-card-selector-container .content{flex:1 1 auto;overflow:auto;padding:12px;margin:0 auto;width:100%;max-width:800px}#new-card-selector-container .content h2{font-weight:normal;font-size:21px}#new-card-selector-container .content h2 span{font-size:12px;display:block}#new-card-selector-container .content.fullsize{max-width:100%}#new-card-selector-container .footer{flex:0 0 auto;display:flex;height:70px;width:100%;z-index:4;box-shadow:0 0 5px rgba(0,0,0,.4)}@media(max-height: 400px){#new-card-selector-container .footer{height:32px}}#new-card-selector-container .footer div{width:50%;display:flex;align-items:center;justify-content:center;flex-direction:column;cursor:pointer;position:relative}#new-card-selector-container .footer div i{font-size:24px}#new-card-selector-container .footer div span{margin-top:4px;margin-bottom:-14px;line-height:12px;font-size:12px}#new-card-selector-container .footer div.next i{color:#c693c2}#new-card-selector-container .footer div.disabled{color:#d6d6d6;cursor:default}#new-card-selector-container .footer div.disabled i{color:#d6d6d6}#new-card-selector-container .footer div:first-child::after{content:"";display:block;position:absolute;right:0;top:6px;bottom:6px;border-right:1px solid #d6d6d6}@media(max-height: 400px){#new-card-selector-container .footer div{flex-direction:row}#new-card-selector-container .footer div:first-child span{margin:0 0 0 6px}#new-card-selector-container .footer div:last-child span{order:-1;margin:0 6px 0 0}}#new-card-selector-container .file-selector{position:relative;box-shadow:0 0 9px rgba(0,0,0,.3);border-radius:10px;background-color:#f2f2f2;border:1px solid #fff;width:90%;max-width:360px;margin:0 auto;overflow:hidden}#new-card-selector-container .file-selector::before{content:"";padding-top:59%;display:block}#new-card-selector-container .file-selector .empty{position:absolute;top:0;left:0;bottom:0;right:0;display:flex;align-items:center;justify-content:center;flex-direction:column;color:#aaa}#new-card-selector-container .file-selector .empty i{font-size:42px}#new-card-selector-container .file-selector .empty span{margin-top:12px;margin-bottom:-24px;line-height:12px;font-size:12px}#new-card-selector-container .file-selector .selected{position:absolute;top:0;left:0;bottom:0;right:0;display:none;background-repeat:no-repeat;background-size:cover;background-position:center center}#new-card-selector-container .file-selector .input{position:absolute;top:0;left:0;bottom:0;right:0;opacity:0;cursor:pointer}#new-card-selector-container .button{width:90%;max-width:360px;margin:24px auto}#new-card-selector-container .qrcode-state{width:90%;max-width:360px;margin:24px auto}#new-card-selector-container .qrcode-state .code-field{padding:12px;border-radius:10px;border:1px solid #ddd}#new-card-selector-container .qrcode-state .code-field .code span{color:#999}#new-card-selector-container .qrcode-state .label{font-size:12px;padding:6px 12px;color:#999}#new-card-selector-container .image-editor-container{width:100%;height:100%;box-shadow:0 0 9px rgba(0,0,0,.3);position:relative}#new-card-selector-container .image-editor-container .image-editor{width:100%;height:100%}#new-card-selector-container .image-editor-container img{width:100%;height:100%}#new-card-selector-container .image-editor-container .image-editor-tools{position:absolute;bottom:24px;text-align:center;left:50%;transform:translateX(-50%);display:flex}#new-card-selector-container .image-editor-container .image-editor-tools button{border-radius:100%;background-color:rgba(0,0,0,.4);color:#fff;box-shadow:0 0 4px rgba(0,0,0,.3);margin:12px;font-size:24px;border:none;width:52px;height:52px;display:flex;justify-content:center;align-items:center;float:left}#new-card-selector-container .image-editor-container .cropper-point,#new-card-selector-container .image-editor-container .cropper-line{background-color:#c693c2}#new-card-selector-container .image-editor-container .cropper-view-box{outline-color:#c693c2}