.dumi-default-previewer{margin:24px 0 32px;border:1px solid #e4e9ec;border-radius:4px;background-color:inherit}[data-prefers-color=dark] .dumi-default-previewer{border-color:#2a353c}[data-dumi-demo-grid] .dumi-default-previewer{margin:0 0 16px}[data-dumi-demo-grid] .dumi-default-previewer:first-child{margin-top:24px}[data-dumi-demo-grid] .dumi-default-previewer:last-child{margin-bottom:32px}.dumi-default-previewer-demo{border-top-left-radius:2px;border-top-right-radius:2px;padding:40px 24px}.dumi-default-previewer-demo>iframe{display:block;width:100%;height:300px;border:0}.dumi-default-previewer-demo[data-iframe]{position:relative;padding:0;border-top:24px solid #e4e9ec;box-sizing:border-box}[data-prefers-color=dark] .dumi-default-previewer-demo[data-iframe]{border-top-color:#2a353c}.dumi-default-previewer-demo[data-iframe]:after{content:"";position:absolute;top:-19px;left:8px;display:inline-block;width:12px;height:12px;border-radius:50%;background-color:#fd6458;box-shadow:20px 0 #ffbf2b,40px 0 #24cc3d}.dumi-default-previewer-demo[data-transform]{transform:translate(0)}.dumi-default-previewer-demo[data-compact]{padding:0}.dumi-default-previewer-demo[data-error][data-compact]{min-height:30px}.dumi-default-previewer-demo[data-error][data-compact]+.dumi-default-previewer-demo-error{border-top-left-radius:3px;border-top-right-radius:3px}.dumi-default-previewer-demo[data-loading]{position:relative}.dumi-default-previewer-demo[data-loading]:before{position:absolute;top:50%;left:50%;content:"";display:block;height:28px;max-height:90%;aspect-ratio:1;border-radius:50%;border:2.8px solid;border-color:#1677ff transparent;box-sizing:border-box;animation:dumi-previewer-loading 1s infinite;transform:translate(-50%,-50%)}[data-prefers-color=dark] .dumi-default-previewer-demo[data-loading]:before{border-color:#0053c8 transparent}@keyframes dumi-previewer-loading{to{transform:translate(-50%,-50%) rotate(.5turn)}}.dumi-default-previewer-demo[data-loading]>*{opacity:.3!important}.dumi-default-previewer-demo-error{position:relative;margin-top:-30px;height:30px;padding:0 24px;line-height:30px;color:#b23642;font-size:13px;white-space:nowrap;text-overflow:ellipsis;background:#fdf4f5;box-sizing:border-box;overflow:hidden}[data-prefers-color=dark] .dumi-default-previewer-demo-error{color:#c6414e;background:#2a060a}[data-prefers-color=dark] .dumi-default-previewer-demo-error>svg{fill:#c6414e}.dumi-default-previewer-demo-error>svg{width:14px;padding-right:4px;fill:#ce1f31;vertical-align:-.14em}.dumi-default-previewer-meta{border-top:1px solid #e4e9ec}[data-prefers-color=dark] .dumi-default-previewer-meta{border-top-color:#2a353c}.dumi-default-previewer-desc{position:relative}.dumi-default-previewer-desc>.markdown{padding:14px 24px;border-bottom:1px dashed #e4e9ec}[data-prefers-color=dark] .dumi-default-previewer-desc>.markdown{border-bottom-color:#2a353c}.dumi-default-previewer-desc>h5{position:absolute;top:-7px;left:20px;margin:0;padding:0 4px;display:inline-block;font-size:14px;line-height:1;font-weight:700;background:linear-gradient(to top,#fff,#fff 50%,#fff0) 100%}[data-prefers-color=dark] .dumi-default-previewer-desc>h5{background:linear-gradient(to top,#000000f2,#000000f2 50%,#0000) 100%}.dumi-default-previewer-desc>h5>a{color:#30363f}[data-prefers-color=dark] .dumi-default-previewer-desc>h5>a{color:#c6c9cd}.dumi-default-previewer-desc>h5>a:not(:hover){text-decoration:none}.dumi-default-previewer-desc>h5>a>strong{float:inline-start;padding-inline-end:8px;color:#d59200;font-size:12px;line-height:15px}[data-prefers-color=dark] .dumi-default-previewer-desc>h5>a>strong{color:#895e00}.dumi-default-previewer[data-active]{box-shadow:0 0 0 4px #1677ff1a;border-color:#7cb3ff}[data-prefers-color=dark] .dumi-default-previewer[data-active]{box-shadow:0 0 0 4px #0053c81a;border-color:#002962}.dumi-default-previewer[data-debug]{border-color:#ffc23c}[data-prefers-color=dark] .dumi-default-previewer[data-debug]{border-color:#231800}.dumi-default-previewer[data-debug][data-active]{box-shadow:0 0 0 4px #d592001a}[data-prefers-color=dark] .dumi-default-previewer[data-debug][data-active]{box-shadow:0 0 0 4px #895e001a}#nprogress{pointer-events:none}#nprogress .bar{background:var;position:fixed;z-index:1031;top:0;left:0;width:100%;height:2px}#nprogress .peg{display:block;position:absolute;right:0;width:100px;height:100%;box-shadow:0 0 10px undefined,0 0 5px undefined;opacity:1;transform:rotate(3deg) translateY(-4px)}#nprogress .spinner{display:block;position:fixed;z-index:1031;top:15px;right:15px}#nprogress .spinner-icon{width:18px;height:18px;box-sizing:border-box;border:solid 2px transparent;border-top-color:undefined;border-left-color:undefined;border-radius:50%;animation:nprogress-spinner .4s linear infinite}.nprogress-custom-parent{overflow:hidden;position:relative}.nprogress-custom-parent #nprogress .spinner,.nprogress-custom-parent #nprogress .bar{position:absolute}@keyframes nprogress-spinner{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes react-loading-skeleton{to{transform:translate(100%)}}.react-loading-skeleton{--base-color: #ebebeb;--highlight-color: #f5f5f5;--animation-duration: 1.5s;--animation-direction: normal;--pseudo-element-display: block;background-color:var(--base-color);width:100%;border-radius:.25rem;display:inline-flex;line-height:1;position:relative;user-select:none;overflow:hidden}.react-loading-skeleton:after{content:" ";display:var(--pseudo-element-display);position:absolute;top:0;left:0;right:0;height:100%;background-repeat:no-repeat;background-image:var( --custom-highlight-background, linear-gradient( 90deg, var(--base-color) 0%, var(--highlight-color) 50%, var(--base-color) 100% ) );transform:translate(-100%);animation-name:react-loading-skeleton;animation-direction:var(--animation-direction);animation-duration:var(--animation-duration);animation-timing-function:ease-in-out;animation-iteration-count:infinite}@media (prefers-reduced-motion){.react-loading-skeleton{--pseudo-element-display: none}}.dumi-default-loading-skeleton .react-loading-skeleton{margin-block-end:.38em}.dumi-default-loading-skeleton .react-loading-skeleton.first-line{width:calc(100% - 2em);margin-inline-start:2em}[data-prefers-color=dark] .dumi-default-loading-skeleton .react-loading-skeleton{--highlight-color: rgba(198, 201, 205, .22);--base-color: #30363f}