/*! Copyright © 2011 - 2021 miHoYo. All Rights Reserved */

.user-model-loading
{
	display:none;
	font-size:14px
}
.user-model-loading__bg
{
	position:fixed;
	z-index:2147483646;
	top:0;
	right:0;
	left:0;
	bottom:0;
	background:hsla(0,0%,7%,.5)
}
.user-model-loading__toast
{
	position:fixed;
	z-index:2147483647;
	width:7.6em;
	min-height:7.6em;
	top:50%;
	left:50%;
	margin-left:-3.8em;
	margin-top:-3.8em;
	text-align:center;
	border-radius:5px;
	color:#fff
}
.user-model-loading__icon
{
	width:38px;
	height:38px;
	margin:30px 0 0;
	display:inline-block;
	vertical-align:middle;
	-webkit-animation:user-model-loading 1s steps(12) infinite;
	animation:user-model-loading 1s steps(12) infinite;
	background:transparent url(data:image/svg+xml;
	base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMjAiIGhlaWdodD0iMTIwIiB2aWV3Qm94PSIwIDAgMTAwIDEwMCI+PHBhdGggZmlsbD0ibm9uZSIgZD0iTTAgMGgxMDB2MTAwSDB6Ii8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjRTlFOUU5IiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAgLTMwKSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iIzk4OTY5NyIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSgzMCAxMDUuOTggNjUpIi8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjOUI5OTlBIiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0icm90YXRlKDYwIDc1Ljk4IDY1KSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iI0EzQTFBMiIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSg5MCA2NSA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNBQkE5QUEiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoMTIwIDU4LjY2IDY1KSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iI0IyQjJCMiIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSgxNTAgNTQuMDIgNjUpIi8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjQkFCOEI5IiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0icm90YXRlKDE4MCA1MCA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNDMkMwQzEiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoLTE1MCA0NS45OCA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNDQkNCQ0IiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoLTEyMCA0MS4zNCA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNEMkQyRDIiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoLTkwIDM1IDY1KSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iI0RBREFEQSIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSgtNjAgMjQuMDIgNjUpIi8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjRTJFMkUyIiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0icm90YXRlKC0zMCAtNS45OCA2NSkiLz48L3N2Zz4=) no-repeat;
	background-size:100%
}
.user-model-loading__text
{
	margin:0 0 15px;
	font-size:14px
}
	@-webkit-keyframes user-model-loading
{
	0%
{
	-webkit-transform:rotate(0deg);
	transform:rotate(0deg)
}
	to
{
	-webkit-transform:rotate(1turn);
	transform:rotate(1turn)
}

}
	@keyframes user-model-loading
{
	0%
{
	-webkit-transform:rotate(0deg);
	transform:rotate(0deg)
}
	to
{
	-webkit-transform:rotate(1turn);
	transform:rotate(1turn)
}

}
.gal-collection-container,.gal-collection-container .gal-collection-preload,.gal-collection-container .gal-collection-preview,.stage-bg-container,.stage-bg-container .stage-bg,.stage-bg-container iframe,.stage-bg-container video,.stage-cg-container,.stage-cg-container .stage-cg,.stage-cg-container iframe,.stage-cg-container video,.stage-character-container,.stage-click-layer,.stage-effect-container,.stage-letterbox,.stage-log-container,.stage-monologue-container,.stage-options-container,.stage-options-container .stage-options-wrp,.stage-popup-container,.stage-remark-container,.stage-transition-mask,.stage-transition-mask .stage-transition-mask-canvas,.stage-transition-mask .stage-transition-mask-layer
{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%
}
.stage-scene
{
	position:absolute;
	top:50%;
	left:50%;
	width:19.2rem;
	height:10.8rem;
	margin-top:-5.4rem;
	margin-left:-9.6rem;
	background-color:#000;
	color:#fff;
	overflow:hidden
}
.stage-scene *
{
	outline:none;
	-webkit-tap-highlight-color:transparent;
	-webkit-touch-callout:none;
	-webkit-overflow-scrolling:touch;
	box-sizing:border-box
}
.stage-scene li,.stage-scene p,.stage-scene ul
{
	padding:0;
	margin:0
}
.stage-scene em
{
	font-style:normal
}
	@keyframes fade-in
{
	0%
{
	opacity:0
}
	to
{
	opacity:1
}

}
	@keyframes fade-out
{
	0%
{
	opacity:1
}
	to
{
	opacity:0
}

}
.stage-scene .stage-control-panel
{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	transition:.3s
}
.stage-scene .stage-control-panel.stage-control-panel-active
{
	top:0
}
.stage-scene .stage-btn
{
	position:absolute;
	z-index:800;
	cursor:pointer;
	background-position:50%;
	background-repeat:no-repeat;
	background-size:cover
}
.stage-scene .stage-btn-auto,.stage-scene .stage-btn-cgmode,.stage-scene .stage-btn-exit,.stage-scene .stage-btn-load,.stage-scene .stage-btn-log,.stage-scene .stage-btn-panel,.stage-scene .stage-btn-save,.stage-scene .stage-btn-skip
{
	position:absolute
}
.stage-scene .stage-btn-close
{
	position:absolute;
	cursor:pointer;
	background-position:50%;
	background-repeat:no-repeat;
	background-size:cover
}
.stage-scene .stage-btn-remark
{
	position:absolute
}
.stage-click-layer
{
	z-index:500
}
.stage-bg-container
{
	z-index:90
}
.stage-bg-container .stage-bg
{
	background-position:50%;
	background-repeat:no-repeat;
	background-size:cover
}
.stage-cg-container
{
	z-index:100
}
.stage-cg-container .stage-cg
{
	background-position:50%;
	background-repeat:no-repeat;
	background-size:cover
}
.stage-character-container
{
	z-index:120
}
.stage-character-container .stage-character-wrp
{
	position:absolute;
	bottom:0;
	font-size:0;
	width:100%;
	height:100%;
	display:flex;
	justify-content:center;
	align-items:flex-end
}
.stage-character-container .stage-character-wrp .stage-character-direction
{
	width:100%;
	height:100%
}
.stage-character-container .stage-character-wrp .stage-character
{
	background-size:contain;
	background-position:50% 100%;
	background-repeat:no-repeat;
	transition-property:filter,opacity;
	transition-duration:.3s;
	width:100%;
	height:100%
}
.stage-effect-container
{
	z-index:150
}
.stage-effect-container .stage-effect-wrp
{
	position:absolute;
	bottom:0;
	font-size:0;
	width:100%;
	height:100%;
	display:flex;
	justify-content:center;
	align-items:flex-end
}
.stage-effect-container .stage-effect-wrp .stage-effect
{
	background-size:contain;
	background-position:50%;
	background-repeat:no-repeat;
	width:100%;
	height:100%
}
	@keyframes arrow-next
{
	0%
{
	transform:translateY(-.03rem)
}
	to
{
	transform:translateY(.03rem)
}

}
.stage-text-box
{
	height:100%
}
.stage-monologue-container .stage-text-box
{
	height:100%;
	overflow-y:auto
}
.stage-remark-container .stage-text-box
{
	overflow-y:auto
}
.stage-remark-container .stage-text-box p
{
	word-break:break-word;
	word-wrap:break-word
}
.stage-text-typewriter
{
	position:relative;
	height:100%
}
.stage-dialog-container .stage-text-typewriter
{
	overflow:auto
}
.stage-text-typewriter .typewriter-arrow-inline,.stage-text-typewriter .typewriter-pagebreak-inline
{
	display:inline-block;
	background-repeat:no-repeat;
	background-position:50%;
	background-size:cover;
	animation:arrow-next 1s infinite alternate linear;
	vertical-align:middle
}
.stage-text-typewriter .text-p
{
	position:relative;
	white-space:pre-wrap;
	word-break:break-word;
	word-wrap:break-word
}
.stage-text-typewriter *
{
	user-select:none
}
.stage-dialog-container
{
	position:absolute;
	z-index:550;
	background-position:50%;
	background-repeat:no-repeat;
	background-size:cover
}
.stage-dialog-container .stage-dialog-header .stage-dialog-name-player
{
	white-space:nowrap;
	text-overflow:ellipsis;
	overflow:hidden
}
.stage-dialog-container .stage-text-container
{
	background-position:50%;
	background-repeat:no-repeat;
	background-size:cover
}
.stage-dialog-container .stage-text-box
{
	height:2.304rem
}
.stage-dialog-container .typewriter-pagebreak
{
	animation:arrow-next 1s infinite alternate linear
}
.stage-dialog-container .typewriter-end,.stage-dialog-container .typewriter-pagebreak
{
	position:absolute;
	background-position:50%;
	background-repeat:no-repeat;
	background-size:cover
}
.stage-monologue-container
{
	z-index:560
}
.stage-monologue-container .stage-mono-box
{
	position:absolute;
	left:50%;
	top:50%;
	transform:translate3d(-50%,-50%,0)
}
.stage-monologue-container .stage-mono-content
{
	height:100%
}
.stage-monologue-container .typewriter-pagebreak
{
	animation:arrow-next 1s infinite alternate linear
}
.stage-monologue-container .typewriter-end,.stage-monologue-container .typewriter-pagebreak
{
	position:absolute;
	background-position:50%;
	background-repeat:no-repeat;
	background-size:cover
}
.stage-log-container
{
	z-index:1000;
	background-color:rgba(0,0,0,.8)
}
.stage-log-container .stage-log-box
{
	position:absolute;
	top:50%;
	left:50%;
	transform:translate3d(-50%,-50%,0)
}
.stage-log-container .stage-log-box .stage-log-close
{
	position:absolute;
	z-index:300
}
.stage-log-container .stage-log-box .stage-log-content
{
	position:relative;
	height:100%;
	width:100%;
	z-index:200;
	background-position:50%;
	background-repeat:no-repeat;
	background-size:cover
}
.stage-log-container .stage-log-box .stage-log-content .stage-log-inner
{
	height:100%;
	width:100%
}
.stage-log-container .stage-log-view
{
	overflow:auto;
	height:100%
}
.stage-log-container .stage-log-text-box .stage-log-scene-break
{
	padding:.2rem 0
}
.stage-log-container .stage-log-text-box .stage-log-text
{
	word-break:break-word;
	word-wrap:break-word;
	white-space:pre-wrap
}
.stage-log-container .stage-log-text-box .stage-log-text.log-type-title .log-text
{
	text-indent:0;
	margin-bottom:.1rem;
	border-bottom-color:#6c5070;
	border-bottom-style:solid;
	border-bottom-width:.02rem;
	padding-bottom:.1rem
}
.stage-log-container .stage-log-text-box .stage-log-text.log-type-option
{
	color:red
}
.stage-log-container .stage-log-text-box .stage-log-text.log-type-player .log-name
{
	color:#bd5d98
}
.stage-log-container .stage-log-text-box .stage-log-text.log-type-mono-text .log-text,.stage-log-container .stage-log-text-box .stage-log-text.log-type-text .log-text
{
	padding-left:0;
	text-indent:0
}
.stage-log-container .stage-log-text-box .stage-log-text .log-name
{
	font-weight:700;
	white-space:nowrap;
	text-overflow:ellipsis;
	overflow:hidden
}
.stage-log-container .stage-log-text-box .stage-log-text .log-text
{
	padding-left:.48rem
}
.stage-options-container
{
	z-index:600;
	animation:fade-in .3s both
}
.stage-options-container .stage-options-wrp
{
	display:table;
	text-align:center;
	vertical-align:middle
}
.stage-options-container .stage-options-content
{
	transform:translate3d(-50%,-50%,0);
	position:absolute;
	left:50%;
	top:50%
}
.stage-options-container .stage-options-content .stage-option
{
	font-size:.48rem;
	display:flex;
	align-items:center;
	justify-content:center;
	cursor:pointer;
	position:relative;
	word-break:break-word;
	word-wrap:break-word
}
.stage-options-container .stage-options-content .stage-option:before
{
	content:"";
	display:block;
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background-color:hsla(0,0%,100%,.9);
	border-radius:.04rem;
	opacity:1;
	z-index:0
}
.stage-options-container .stage-options-content .stage-option span
{
	position:relative;
	z-index:10;
	white-space:nowrap
}
.stage-options-container .stage-options-content .stage-option+.stage-option
{
	margin-top:.2rem
}
.stage-options-container .stage-options-content .stage-option:active
{
	opacity:.9
}
.stage-letterbox
{
	z-index:140;
	pointer-events:none
}
.stage-letterbox .stage-letterbox-down,.stage-letterbox .stage-letterbox-up
{
	position:absolute;
	width:100%
}
.stage-letterbox .stage-letterbox-up
{
	top:0
}
.stage-letterbox .stage-letterbox-down
{
	bottom:0
}
.stage-remark-container
{
	z-index:1100;
	background-color:rgba(0,0,0,.8)
}
.stage-remark-container .stage-remark-box
{
	position:absolute;
	left:50%;
	top:50%;
	transform:translate3d(-50%,-50%,0);
	background-position:50%;
	background-repeat:no-repeat;
	background-size:cover
}
.stage-remark-container .stage-remark-close
{
	position:absolute;
	cursor:pointer
}
.stage-notification-container
{
	position:absolute;
	pointer-events:none
}
.stage-notification-container .stage-notification-box
{
	font-size:.48rem;
	white-space:pre-wrap;
	word-break:break-word;
	word-wrap:break-word;
	user-select:none
}
.notification-enter-active
{
	animation:notification-enter .3s both
}
.notification-exit-active
{
	animation:notification-exit .3s both
}
	@keyframes notification-enter
{
	0%
{
	transform:translateX(-100%)
}
	to
{
	transform:translateX(0)
}

}
	@keyframes notification-exit
{
	0%
{
	opacity:1
}
	to
{
	opacity:0
}

}
.stage-transition-mask
{
	z-index:1200
}
.stage-transition-mask .stage-transition-mask-layer
{
	background-color:#000
}
.stage-transition-mask .stage-transition-move-left:after,.stage-transition-mask .stage-transition-move-left:before,.stage-transition-mask .stage-transition-move-right:after,.stage-transition-mask .stage-transition-move-right:before
{
	content:"";
	position:absolute;
	top:0;
	width:100%;
	height:100%;
	background-position:0 0;
	background-repeat:repeat-y;
	background-image:url(images/transition_move.215e4a28.png);
	background-size:cover
}
.stage-transition-mask .stage-transition-move-left:before,.stage-transition-mask .stage-transition-move-right:before
{
	transform:translate3d(-99%,0,0) scaleX(-1)
}
.stage-transition-mask .stage-transition-move-left:after,.stage-transition-mask .stage-transition-move-right:after
{
	transform:translate3d(99%,0,0)
}
.stage-transition-mask .stage-transition-move-left.stage-transition-move-thick:after,.stage-transition-mask .stage-transition-move-left.stage-transition-move-thick:before,.stage-transition-mask .stage-transition-move-right.stage-transition-move-thick:after,.stage-transition-mask .stage-transition-move-right.stage-transition-move-thick:before
{
	background-image:url(images/transition_move2.2719b717.png)
}
.stage-popup-container
{
	z-index:1500
}
.stage-popup-container .stage-popup-mask
{
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background-color:rgba(0,0,0,.8);
	z-index:0
}
.stage-popup-container .stage-popup-content
{
	position:absolute;
	z-index:10;
	top:50%;
	left:50%;
	background-size:cover;
	background-position:50%;
	background-repeat:no-repeat;
	transform:translate3d(-50%,-50%,0)
}
.stage-popup-container .stage-popup-content .stage-popup-text-wrp
{
	display:flex;
	justify-content:center;
	align-items:center
}
.stage-popup-container .stage-popup-content .stage-popup-text-wrp .stage-popup-text
{
	word-break:break-word;
	word-wrap:break-word
}
.stage-popup-container .stage-popup-content .stage-popup-btn-wrp
{
	position:absolute;
	width:100%;
	display:flex;
	justify-content:center
}
.stage-popup-container .stage-popup-btn
{
	background-repeat:no-repeat;
	background-position:50%;
	background-size:cover;
	cursor:pointer;
	text-align:center;
	display:inline-block;
	border:none;
	outline:none
}
.gal-collection-container
{
	background-color:rgba(0,0,0,.8);
	z-index:10000
}
.gal-collection-container .gal-collection-close
{
	position:absolute;
	top:0;
	right:0;
	background-size:cover
}
.gal-collection-container .gal-collection-view
{
	width:100%;
	padding:1rem 3rem
}
.gal-collection-container .gal-collection-list
{
	display:flex;
	flex-wrap:wrap;
	overflow:hidden
}
.gal-collection-container .gal-collection-list li
{
	width:50%;
	position:relative;
	overflow:hidden;
	padding:.2rem
}
.gal-collection-container .gal-collection-list li .gal-collection-thumb
{
	width:100%;
	padding-top:56.25%;
	background-repeat:no-repeat;
	background-position:50%;
	background-size:cover
}
.gal-collection-container .gal-collection-pager
{
	position:absolute;
	width:100%;
	left:0;
	bottom:.3rem;
	text-align:center;
	margin-top:.2rem
}
.gal-collection-container .gal-collection-pager-btn
{
	display:inline-block;
	background-repeat:no-repeat;
	background-position:50%;
	background-size:cover;
	margin:0 .2rem
}
.gal-collection-container .gal-collection-pager-disabled
{
	opacity:.5
}
.gal-collection-container .gal-collection-preview
{
	z-index:100
}
.gal-collection-container .gal-collection-image
{
	position:absolute;
	background-repeat:no-repeat;
	background-position:50%;
	background-size:cover;
	width:100%
}
.gal-collection-container .gal-collection-image:before
{
	content:"";
	display:block;
	padding-top:56.25%
}
.gal-collection-container .gal-collection-enter-active
{
	animation:fade-in both
}
.gal-collection-container .gal-collection-preload
{
	z-index:200
}
.gal-collection-container .gal-collection-preload:after
{
	content:"";
	display:block;
	position:absolute;
	background-repeat:no-repeat;
	background-position:50%;
	background-size:cover
}