.modal-lab{width:100%;display:grid;gap:20px;font-family:"Source Han Sans CN","思源黑体 CN","Microsoft YaHei",sans-serif}
.modal-playground{padding:20px;display:grid;gap:16px;border:1px solid #e8e8e8;border-radius:8px;background:#fff}
.modal-head{display:grid;gap:2px}.modal-head h3{margin:0;font-size:14px;line-height:22px}.modal-head span{color:#999;font-size:11px;line-height:18px}
.modal-control{width:min(100%,440px);display:grid;gap:8px}.modal-control label{color:#666;font-size:12px;line-height:18px}
.modal-live{min-height:650px;padding:28px 20px;display:grid;place-items:center;overflow:hidden;border:1px dashed #d9d9d9;border-radius:6px;background:#f7f7f7}
.modal-gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(500px,1fr));gap:16px}
.modal-variant{min-width:0;overflow:hidden;border:1px solid #e8e8e8;border-radius:8px;background:#fff}
.modal-variant>header{height:44px;padding:0 12px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e8e8e8;font-size:12px}
.modal-variant>header span{color:#999}.modal-stage{min-height:620px;padding:24px 12px;display:grid;place-items:center;overflow:hidden;background:#f7f7f7}

.modal-popover,.modal-popover *,.modal-confirm,.modal-confirm *,.modal-shell,.modal-shell *{box-sizing:border-box}
.modal-button{height:32px;padding:5px 16px;display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:4px;color:#fff;background:#2990ff;font:400 14px/22px "Source Han Sans CN","思源黑体 CN","Microsoft YaHei",sans-serif;white-space:nowrap;cursor:pointer;transition:background-color .14s,border-color .14s,color .14s}
.modal-button:hover,.modal-button:focus-visible{background:#4ba2ff}.modal-button:active{background:#2279d6}
.modal-button.secondary{color:#333;border:1px solid #d9d9d9;background:#fff}.modal-button.secondary:hover,.modal-button.secondary:focus-visible{color:#333;border-color:#d9d9d9;background:rgba(0,0,0,.04)}.modal-button.secondary:active{color:#333;border-color:#d9d9d9;background:rgba(0,0,0,.08)}
.modal-button.danger{background:#e44144}.modal-button.danger:hover,.modal-button.danger:focus-visible{background:#eb5b5e}.modal-button.danger:active{background:#c93639}
.modal-button.small{height:30px;padding:4px 8px}.modal-button:focus-visible,.modal-icon-button:focus-visible,.modal-expand-button:focus-visible{outline:2px solid #2990ff;outline-offset:1px}

.modal-state-icon{position:relative;width:24px;height:24px;display:block}.modal-state-icon img{position:absolute;inset:0;width:24px;height:24px;display:block}.modal-state-icon .is-hover,.modal-state-icon .is-pressed{display:none}
.modal-icon-button:hover .is-normal,.modal-icon-button:focus-visible .is-normal{display:none}.modal-icon-button:hover .is-hover,.modal-icon-button:focus-visible .is-hover{display:block}.modal-icon-button:active .is-hover{display:none}.modal-icon-button:active .is-pressed{display:block}
.modal-icon-button,.modal-expand-button{width:24px;height:24px;padding:0;display:grid;place-items:center;border:0;border-radius:4px;background:transparent;cursor:pointer}.modal-icon-button:hover,.modal-icon-button:focus-visible,.modal-expand-button:hover,.modal-expand-button:focus-visible{background:rgba(0,0,0,.04)}.modal-icon-button:active,.modal-expand-button:active{background:rgba(0,0,0,.08)}.modal-expand-button img{width:16px;height:16px;display:block}

.modal-popover{width:268px;height:138px;display:flex;flex-direction:column;align-items:center;gap:2px;color:#000}.modal-popover.with-buttons{height:180px}
.modal-popover-panel{width:268px;padding:12px;border-radius:6px;background:#fff;box-shadow:var(--modal-shadow,0 4px 10px rgba(0,0,0,.08))}.modal-popover-panel strong{display:block;color:#333;font-size:14px;font-weight:700;line-height:22px}.modal-popover-panel p{width:244px;margin:8px 0 0;font-size:14px;line-height:22px}.modal-popover-panel>div{margin-top:12px;display:flex;justify-content:flex-end;gap:12px}
.modal-popover-arrow{width:16px;height:6px;margin-top:-2px;background:#fff;clip-path:polygon(0 0,100% 0,50% 100%)}.modal-popover>.modal-button{flex:0 0 auto}

.modal-confirm{position:relative;width:390px;height:180px;padding:24px 24px 16px;display:grid;grid-template-columns:24px 302px;grid-template-rows:24px 44px 32px;column-gap:16px;row-gap:16px;overflow:hidden;border-radius:6px;color:#000;background:#fff;box-shadow:var(--modal-shadow,0 4px 10px rgba(0,0,0,.08))}
.modal-confirm-head{display:contents}.modal-confirm-head strong{grid-column:2;grid-row:1;color:#222;font-size:16px;font-weight:700;line-height:24px}.modal-confirm-symbol{grid-column:1;grid-row:1;width:24px;height:24px;display:grid;place-items:center}.modal-confirm-symbol img{width:24px;height:24px;display:block;filter:brightness(0) saturate(100%) invert(35%) sepia(81%) saturate(1406%) hue-rotate(321deg) brightness(98%) contrast(89%)}.modal-confirm-symbol.warning img{filter:brightness(0) saturate(100%) invert(74%) sepia(53%) saturate(1532%) hue-rotate(338deg) brightness(101%) contrast(88%)}
.modal-confirm-copy{grid-column:2;grid-row:2;margin:0;font-size:14px;line-height:22px}.modal-confirm footer{grid-column:2;grid-row:3;display:flex;justify-content:flex-end;gap:16px}.modal-confirm.special{height:248px;display:flex;flex-direction:column;gap:16px}.modal-confirm.special .modal-confirm-head{display:flex;align-items:center;gap:16px;height:24px}.modal-confirm.special .modal-confirm-special-body{display:grid;gap:8px}.modal-confirm-special-body p{margin:0;color:#333;font-size:14px;line-height:22px}.modal-confirm-special-body section{min-height:60px;padding:8px;border-radius:4px;color:#666;background:#f7f8fa;font-size:14px;line-height:22px}.modal-confirm.special footer{margin-top:auto;display:flex;justify-content:flex-end;gap:16px}

.modal-shell{--modal-radius:8px;--modal-shadow:0 4px 10px rgba(0,0,0,.08);--modal-border:#d9d9d9;--modal-divider:#ebebeb;--modal-table-outline:#f5f5f5;--modal-hover:rgba(0,0,0,.04);--modal-line:rgba(0,0,0,.08);position:relative;width:var(--modal-width);height:var(--modal-height);display:flex;flex-direction:column;gap:24px;overflow:hidden;border-radius:var(--modal-radius);color:#222;background:#fff;font-weight:400;box-shadow:var(--modal-shadow)}
.modal-small{--modal-width:520px;--modal-radius:6px}.modal-medium{--modal-width:600px;--modal-radius:8px}.modal-large{--modal-width:800px;--modal-height:928px;--modal-radius:8px}.modal-extra{--modal-width:952px;--modal-height:834px;--modal-radius:12px}.modal-extra.fullscreen{--modal-width:1440px;--modal-height:900px}.modal-drawer{--modal-height:858px;--modal-radius:12px 0 0 12px}.modal-drawer.drawer-large{--modal-width:800px}.modal-drawer.drawer-medium{--modal-width:650px}.modal-drawer.drawer-small{--modal-width:450px}
.modal-shell-header{width:100%;height:56px;padding:16px 24px;display:flex;flex:0 0 56px;align-items:flex-start;justify-content:space-between;background:#fff;box-shadow:0 1px 0 var(--modal-line)}.modal-title{display:flex;align-items:center;gap:4px;height:24px}.modal-title strong{color:#222;font-size:16px;font-weight:700;line-height:24px}.modal-title small{color:#999;font-size:12px;font-weight:400;line-height:18px}.modal-header-tools{display:flex;align-items:center;gap:8px}.modal-small .modal-title small{display:none}
.modal-shell>main{width:calc(100% - 48px);min-height:0;margin:0 24px;flex:1;overflow:hidden}.modal-shell-footer{width:100%;height:52px;padding:10px 24px;display:flex;flex:0 0 52px;align-items:center;justify-content:space-between;background:#fff;box-shadow:0 -1px 0 var(--modal-line)}.modal-shell-footer>div{display:flex;gap:16px}.modal-footer-note{display:flex;align-items:center;gap:4px;color:#666;font-size:14px;font-weight:400;line-height:22px}.modal-footer-note i{width:22px;height:22px;display:grid;place-items:center;border-radius:4px;background:transparent;color:#666}.modal-footer-note i:hover{color:#333;background:var(--modal-hover)}.modal-footer-note img{display:block}.modal-footer-note i:hover img{filter:brightness(.5)}
.modal-footer-actions{justify-content:flex-end}.modal-footer-actions>div{margin-left:auto}

.modal-simple-fields{display:flex;flex-direction:column;gap:24px}.modal-field{position:relative;display:grid;gap:4px;color:#333;font-size:14px;font-weight:400;line-height:22px}.modal-field>span{height:22px;color:#999}.modal-field b,.modal-upload-field b{color:#e44144;font-weight:400}.modal-field input,.modal-field textarea,.modal-select-field,.modal-icon-field,.modal-currency,.modal-password{width:100%;height:32px;padding:5px 12px;border:1px solid var(--modal-border);border-radius:4px;color:#333;background:#fff;font:400 14px/22px inherit;outline:0}.modal-field input::placeholder,.modal-field textarea::placeholder{color:#999;opacity:1}.modal-field input:hover,.modal-field textarea:hover,.modal-select-field:hover,.modal-icon-field:hover,.modal-currency:hover,.modal-password:hover{border-color:var(--modal-border);background:var(--modal-hover)}.modal-field input:focus,.modal-field textarea:focus{border-color:#2990ff;background:#fff;box-shadow:0 0 0 2px #2990ff1a}.modal-select-field,.modal-icon-field{display:flex;align-items:center;justify-content:space-between;color:#999;cursor:pointer}.modal-dropdown-arrow{width:12px;height:12px;display:block;flex:0 0 12px;transition:transform .14s}.modal-currency.is-open .modal-dropdown-arrow{transform:rotate(180deg)}
.modal-field-textarea{height:186px}.modal-field textarea{height:160px;padding-top:12px;resize:none}.modal-field-textarea small{position:absolute;right:12px;bottom:8px;color:#999;font-size:12px;line-height:18px}.modal-currency,.modal-password{padding:0;display:flex;align-items:center}.modal-password{padding-right:8px}.modal-currency input,.modal-password input{min-width:0;border:0;background:transparent}.modal-currency-toggle{position:relative;height:30px;margin-left:8px;padding:4px 12px 4px 8px;display:flex;align-items:center;gap:8px;border:0;color:#333;background:transparent;cursor:pointer}.modal-currency-toggle::before{content:"";position:absolute;left:-4px;top:8px;width:1px;height:14px;background:var(--modal-divider)}.modal-currency em{font-size:12px;font-style:normal;white-space:nowrap}.modal-password>span{width:24px;height:30px;display:grid;flex:0 0 24px;place-items:center;color:#666}.modal-password>span+span{position:relative;margin-left:8px;border-left:0}.modal-password>span+span::before{content:"";position:absolute;left:-4px;top:8px;width:1px;height:14px;background:var(--modal-divider)}.modal-password img,.modal-icon-field img{display:block}

.modal-medium-table{height:280px;display:grid;grid-template-rows:38px 226px;gap:16px}.modal-info-strip,.modal-warning-strip{height:38px;padding:8px 12px;border-radius:6px;color:#666;background:#edf0f4;font-size:14px;line-height:22px}.modal-warning-strip{background:#fef7eb}
.modal-data-table{position:relative;height:226px;display:grid;grid-template-rows:38px repeat(4,47px);overflow:hidden;border:0;border-radius:6px;background:#fff;color:#666;font-size:14px;font-weight:400;line-height:22px}.modal-data-table::after{content:"";position:absolute;z-index:3;inset:0;border:1px solid var(--modal-divider);border-radius:6px;pointer-events:none}.modal-data-table>header,.modal-table-row{display:grid;grid-template-columns:141px 162px 162px 84px;align-items:center;background:#fff}.modal-data-table>header{color:#333;background:#edf0f4}.modal-data-table>header,.modal-table-row:not(:last-child){border-bottom:1px solid var(--modal-divider)}.modal-data-table>header>span,.modal-table-row>span{height:100%;padding:8px 12px;display:flex;min-width:0;align-items:center;gap:4px;overflow:hidden;white-space:nowrap}.modal-data-table>header>span+span,.modal-table-row>span+span{border-left:1px solid var(--modal-divider)}.modal-data-table>header>span:last-child{justify-content:space-between}.modal-table-row{height:47px;transition:background-color .12s}.modal-table-row:hover{background:var(--modal-hover)}.modal-row-actions{padding:12px!important;gap:8px!important}.modal-row-actions .modal-icon-button{width:22px;height:22px}.modal-row-actions .modal-state-icon,.modal-row-actions .modal-state-icon img{width:22px;height:22px}.modal-row-actions>i{width:0;height:16px;border-left:1px solid var(--modal-divider)}.modal-attachment{width:calc(100% - 16px);height:26px!important;margin:0 8px;padding:4px 8px!important;display:flex;min-width:0;align-items:center;gap:4px;overflow:hidden;border:1px dashed var(--modal-border);border-radius:4px;color:#666;background:#fff;font-size:12px;line-height:18px;white-space:nowrap}.modal-attachment>img{width:12px;height:12px;flex:0 0 12px}.modal-attachment b{flex:0 0 auto;margin-left:auto;padding:0 6px;border-radius:3px;color:#333;background:#f0f0f0;font-weight:400}.modal-checkbox{width:16px;height:16px;display:block;border:1px solid var(--modal-border);border-radius:4px;background:#fff}.modal-check-cell{justify-content:center;padding:0!important}
.modal-medium-form{height:408px;display:grid;gap:16px}.modal-medium-form>.modal-field:not(.modal-field-textarea){height:58px}

.modal-vertical>main{height:772px;display:grid;grid-template-rows:280px 468px;gap:24px}.modal-vertical-group{display:grid;gap:16px}.modal-vertical-summary{grid-template-rows:38px 226px}.modal-vertical-detail{grid-template-rows:24px 226px 186px}.modal-vertical .modal-section-title{height:24px;margin:0;padding-left:12px;position:relative;font-size:16px;line-height:24px}.modal-section-title:before{content:"";position:absolute;left:0;top:5px;width:3px;height:14px;border-radius:2px;background:#2990ff}.modal-vertical .modal-field-textarea{margin:0}.modal-wide-table>header,.modal-wide-table>.modal-table-row{grid-template-columns:40px 190px 162px 272px 84px}.modal-wide-table .modal-attachment{width:248px;margin:0;padding:4px 8px!important}
.modal-horizontal{--modal-width:900px;--modal-height:600px;--modal-radius:12px;gap:0;padding-left:4px}.modal-horizontal>.modal-shell-header,.modal-horizontal>.modal-shell-footer{margin-left:-4px;width:calc(100% + 4px)}.modal-horizontal>main{width:896px;margin:0;display:flex;flex:1}.modal-inner-nav{width:182px;height:190px;margin-top:8px;display:grid;gap:2px}.modal-inner-nav button{height:30px;padding:4px 8px;display:flex;align-items:center;gap:4px;overflow:hidden;border:0;border-radius:4px;color:#666;background:transparent;font:400 14px/22px inherit;white-space:nowrap;cursor:pointer}.modal-inner-nav button:hover,.modal-inner-nav button:focus-visible,.modal-inner-nav button.active{color:#333;background:var(--modal-hover)}.modal-inner-nav img{width:14px;height:14px}.modal-inner-divider{width:1px;height:492px;margin-left:8px;background:var(--modal-divider)}.modal-horizontal-content{width:670px;margin:12px 0 0 11px;display:grid;align-content:start;gap:16px}.modal-search-row{height:32px;display:flex;gap:16px}.modal-search-row label{width:288px;height:32px;padding:5px 12px;display:flex;align-items:center;gap:8px;border:1px solid var(--modal-border);border-radius:4px;background:#fff}.modal-search-row label:hover,.modal-search-row>button:hover{background:var(--modal-hover)}.modal-search-row label img{width:16px;height:16px}.modal-search-row input{min-width:0;border:0;outline:0;background:transparent;font:400 14px/22px inherit}.modal-search-row>button{width:32px;height:32px;padding:8px;border:1px solid var(--modal-border);border-radius:4px;background:#fff}.modal-search-row>button img{width:16px;height:16px}.modal-horizontal-table>header,.modal-horizontal-table>.modal-table-row{grid-template-columns:40px 275px 272px 84px}.modal-horizontal-table{box-shadow:inset 0 0 0 1px var(--modal-table-outline)}.modal-horizontal-table .modal-attachment{width:248px;margin:0;padding:4px 8px!important}

.modal-extra>main,.modal-drawer>main{display:flex}.modal-rich-form{width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:max-content;gap:16px 24px;align-content:start}.modal-rich-form>.modal-field{height:58px}.modal-rich-form>.modal-position-field{grid-column:1}.modal-rich-form>.modal-rich-textarea,.modal-upload-field{grid-column:1/-1}.modal-rich-form>.modal-rich-textarea{height:186px}.modal-rich-form>.modal-rich-textarea textarea{height:160px}.modal-upload-field{display:grid;gap:4px}.modal-upload-field>header{height:22px;display:flex;align-items:center;justify-content:space-between;font-size:14px;line-height:22px}.modal-upload-field>header>span{color:#333}.modal-upload-field a{display:flex;align-items:center;gap:4px;color:#2990ff;font-size:14px;line-height:22px}.modal-upload-field a img{width:14px;height:14px;filter:brightness(0) saturate(100%) invert(48%) sepia(98%) saturate(2357%) hue-rotate(190deg) brightness(101%) contrast(101%)}.modal-upload-field>div{height:154px;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px dashed var(--modal-border);border-radius:6px;background:#fff}.modal-upload-field>div:hover{background:var(--modal-hover)}.modal-upload-field>div img{width:80px;height:80px;object-fit:contain}.modal-upload-field>div strong{color:#666;font-size:14px;font-weight:400;line-height:22px}.modal-upload-field>div span{color:#999;font-size:12px;line-height:18px}
.modal-extra .modal-rich-form{grid-template-columns:repeat(2,440px)}.modal-extra.fullscreen .modal-rich-form{grid-template-columns:repeat(2,minmax(0,1fr))}.modal-drawer .modal-rich-form{gap:16px 24px}.modal-drawer.drawer-large .modal-rich-form{grid-template-columns:repeat(2,364px)}.modal-drawer.drawer-medium .modal-rich-form{grid-template-columns:repeat(2,289px)}.modal-drawer.drawer-small .modal-rich-form{grid-template-columns:1fr}.modal-drawer.drawer-small .modal-rich-form>*{grid-column:1}.modal-drawer.drawer-small .modal-field:nth-child(4),.modal-drawer.drawer-small .modal-field:nth-child(6),.modal-drawer.drawer-small .modal-field:nth-child(7){display:none}.modal-drawer.drawer-small .modal-upload-field>div{height:104px}.modal-drawer.drawer-small .modal-upload-field>div img{width:48px;height:48px}

.modal-code{min-height:46px;padding:8px 10px;display:flex;align-items:center;justify-content:space-between;gap:10px;color:#d9e1ec;background:#111722}.modal-code code{min-width:0;overflow:hidden;font:11px/18px ui-monospace,Consolas,monospace;text-overflow:ellipsis;white-space:nowrap}.modal-code button{height:26px;padding:0 10px;flex:0 0 auto;border:1px solid #4b5565;border-radius:4px;color:#d9e1ec;background:#202838;font-size:11px}

.modal-stage .modal-small{zoom:.86}.modal-stage .modal-medium{zoom:.76}.modal-stage .modal-large{zoom:.61}.modal-stage .modal-extra{zoom:.49}.modal-stage .modal-extra.fullscreen{zoom:.33}.modal-stage .modal-drawer{zoom:.57}
.modal-live .modal-medium{zoom:.92}.modal-live .modal-large{zoom:.68}.modal-live .modal-extra{zoom:.65}.modal-live .modal-extra.fullscreen{zoom:.43}.modal-live .modal-drawer{zoom:.7}

body.theme-dark .modal-playground,body.theme-dark .modal-variant{border-color:#343c48;background:#1d232d}body.theme-dark .modal-live,body.theme-dark .modal-stage{border-color:#343c48;background:#171c24}body.theme-dark .modal-control .modern-select-trigger{color:#e4e7ec;border-color:#46505e;background:#252c37}body.theme-dark .modal-control .modern-select-menu{border-color:#343c48;background:#252c37}

@media(max-width:760px){.modal-gallery{grid-template-columns:1fr}.modal-control{width:100%}.modal-live,.modal-stage{min-height:520px;padding-inline:4px}.modal-confirm{zoom:.82}.modal-stage .modal-small,.modal-live .modal-small{zoom:.62}.modal-stage .modal-medium,.modal-live .modal-medium{zoom:.53}.modal-stage .modal-large,.modal-live .modal-large{zoom:.4}.modal-stage .modal-extra,.modal-live .modal-extra{zoom:.34}.modal-stage .modal-extra.fullscreen,.modal-live .modal-extra.fullscreen{zoom:.22}.modal-stage .modal-drawer,.modal-live .modal-drawer{zoom:.38}}

.modal-replace-people,.modal-replace-people *{box-sizing:border-box}
.modal-replace-people{width:520px;height:456px;display:flex;flex-direction:column;overflow:hidden;border-radius:12px;background:#fff;box-shadow:0 6px 16px 4px rgba(0,0,0,.12);font-family:"Source Han Sans CN","思源黑体 CN","Microsoft YaHei",sans-serif}
.modal-replace-people>header{height:56px;padding:16px 24px;display:flex;flex:0 0 56px;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(0,0,0,.08);background:#fff}
.modal-replace-people>header strong{color:#000;font-size:16px;line-height:24px;font-weight:700}
.modal-replace-people>main{height:348px;padding:8px;display:flex;flex:0 0 348px;flex-direction:column;gap:8px;background:#edf0f4}
.modal-replace-people>main>section{width:504px;padding:16px;display:flex;flex-direction:column;gap:16px;border-radius:8px;background:#fff}
.modal-replace-people>main>section:first-child{height:164px}
.modal-replace-people>main>section:last-child{height:160px}
.modal-replace-field{height:58px;display:flex;flex-direction:column;gap:4px}
.modal-replace-field>span,.modal-replace-pair>span{height:22px;color:#333;font-size:14px;line-height:22px}
.modal-replace-field>span b,.modal-replace-pair>span b{color:#e44144;font-weight:400}
.modal-replace-field>button{width:100%;height:32px;padding:5px 12px;display:flex;align-items:center;justify-content:space-between;border:1px solid #d9d9d9;border-radius:4px;background:#fff;cursor:pointer}
.modal-replace-field>button:hover{background:rgba(0,0,0,.04)}
.modal-replace-field>button:active{border-color:#2990ff;background:#fff}
.modal-replace-field>button em{overflow:hidden;color:#999;font:400 14px/22px "Source Han Sans CN","思源黑体 CN","Microsoft YaHei",sans-serif;font-style:normal;text-overflow:ellipsis;white-space:nowrap}
.modal-replace-arrow{width:12px;height:12px;display:block;flex:0 0 12px;transform:rotate(90deg)}
.modal-replace-arrow img{width:12px;height:12px;display:block}
.modal-replace-pair{height:56px;display:flex;flex-direction:column;gap:2px}
.modal-replace-pair>div{display:grid;grid-template-columns:180px 283px;gap:8px}
.modal-replace-pair .modal-replace-field{height:32px;display:block}
.modal-replace-pair .modal-replace-field>span{display:none}
.modal-replace-people>footer{height:52px;padding:10px 24px;display:flex;flex:0 0 52px;align-items:center;justify-content:flex-end;border-top:1px solid rgba(0,0,0,.08);background:#fff}
.modal-replace-people>footer>div{display:flex;align-items:center;gap:16px}
.modal-stage .modal-replace-people{zoom:.86}
.modal-live .modal-replace-people{zoom:1}
@media(max-width:760px){.modal-stage .modal-replace-people,.modal-live .modal-replace-people{zoom:.62}}

.modal-code-picker,.modal-code-picker *{box-sizing:border-box}
.modal-code-picker{width:952px;height:760px;display:flex;flex-direction:column;overflow:hidden;border-radius:12px;color:#222;background:#fff;box-shadow:0 6px 16px 4px rgba(0,0,0,.12);font:400 14px/22px "Source Han Sans CN","思源黑体 CN","Microsoft YaHei",sans-serif}
.modal-code-picker>header{height:56px;padding:16px 24px;display:flex;flex:0 0 56px;align-items:center;justify-content:space-between;box-shadow:0 1px 0 rgba(0,0,0,.08)}
.modal-code-picker>header strong{font-size:16px;line-height:24px}
.modal-code-picker>main{min-height:0;padding:8px;display:grid;flex:1;grid-template-columns:540px 1fr;gap:8px;background:#edf0f4}
.modal-code-picker>main>section{min-width:0;padding:16px;overflow:hidden;border-radius:8px;background:#fff}
.modal-code-list{position:relative;display:flex;flex-direction:column;gap:16px}
.modal-code-toolbar{height:32px;display:flex;align-items:center;gap:8px}
.modal-code-toolbar>label{width:288px;height:32px;padding:5px 12px;display:flex;align-items:center;gap:8px;border:1px solid #d9d9d9;border-radius:4px}
.modal-code-toolbar>label:hover{background:rgba(0,0,0,.04)}.modal-code-toolbar>label img{width:16px;height:16px}.modal-code-toolbar input{min-width:0;border:0;outline:0;background:transparent;font:inherit}.modal-code-toolbar input::placeholder{color:#999}
.modal-code-toolbar>span,.modal-code-entry>header>span{margin-left:auto;color:#999;white-space:nowrap}.modal-code-count{color:#333}.modal-code-toolbar>i,.modal-code-entry>header>i{width:1px;height:16px;background:#ebebeb}
.modal-code-recognize{height:32px;padding:5px 16px;display:flex;align-items:center;gap:4px;border:1px solid #2990ff;border-radius:4px;color:#2990ff;background:#fff;font:inherit;white-space:nowrap}.modal-code-recognize:hover{background:rgba(0,0,0,.04)}
.modal-code-table{height:520px;overflow:hidden;border:1px solid rgba(0,0,0,.08);border-radius:6px}
.modal-code-table-head,.modal-code-row{width:100%;height:46px;padding:0;display:grid;grid-template-columns:40px 1fr;align-items:center;border:0;border-bottom:1px solid rgba(0,0,0,.08);color:#666;background:#fff;text-align:left;font:inherit}
.modal-code-table-head{height:38px;color:#333;background:#edf0f4}.modal-code-table-head>i,.modal-code-row>i{margin:auto}.modal-code-row>span,.modal-code-table-head>span{height:100%;padding:12px;display:flex;align-items:center;border-left:1px solid rgba(0,0,0,.08)}
.modal-code-row:hover,.modal-code-row.is-active{color:#333;background:rgba(0,0,0,.04)}.modal-code-row.is-selected .modal-code-check{border-color:#2990ff;background:#2990ff}.modal-code-row.is-selected .modal-code-check:after{content:"";width:7px;height:4px;border-left:1.5px solid #fff;border-bottom:1.5px solid #fff;transform:rotate(-45deg) translate(1px,-1px)}
.modal-code-check{width:16px;height:16px;display:grid;place-items:center;border:1px solid #d9d9d9;border-radius:4px;background:#fff}
.modal-code-pagination{position:absolute;left:16px;right:16px;bottom:16px;height:36px;padding-top:12px;display:flex;align-items:center;justify-content:flex-end;gap:4px;background:#fff;box-shadow:0 -2px 2px rgba(0,0,0,.08);font-size:12px;line-height:17px}
.modal-code-pagination button{min-width:24px;height:24px;padding:0;border:0;border-radius:4px;background:#fff}.modal-code-pagination button:not(:disabled):hover{background:rgba(0,0,0,.04)}.modal-code-pagination button.active{color:#fff;background:#2990ff}.modal-code-pagination select{height:24px;border:1px solid #d9d9d9;border-radius:4px}.modal-code-pagination input{width:54px;height:24px;border:1px solid #d9d9d9;border-radius:4px}
.modal-code-entry{display:flex;flex-direction:column;gap:16px}.modal-code-entry>header{height:32px;padding:4px 0;display:flex;align-items:center;gap:8px}.modal-code-entry>header:before{content:"";width:4px;height:16px;border-radius:10px;background:#2990ff}.modal-code-entry>header strong{font-size:16px;line-height:24px}.modal-code-clear{padding:0;border:0;color:#e44144;background:transparent;font:inherit}
.modal-code-textarea{min-height:0;padding:12px;display:flex;flex:1;flex-direction:column;align-items:flex-end;border:1px solid #d9d9d9;border-radius:6px}.modal-code-textarea p{width:100%;margin:0;color:#999;line-height:24px}.modal-code-textarea .modal-button{margin-top:auto}
.modal-code-picker>footer{height:52px;padding:10px 24px;display:flex;flex:0 0 52px;align-items:center;justify-content:flex-end;box-shadow:0 -2px 4px rgba(0,0,0,.08)}.modal-code-picker>footer>div{display:flex;gap:16px}
.modal-stage .modal-code-picker{zoom:.49}.modal-live .modal-code-picker{zoom:.65}
@media(max-width:760px){.modal-stage .modal-code-picker,.modal-live .modal-code-picker{zoom:.34}}
