#blockBreakerAreaFrame, #blockBreakerAreaFrame *{
	box-sizing:border-box;
	-webkit-tap-highlight-color:transparent;
}

#blockBreakerAreaFrame,
#blockBreakerAreaFrame{
	width:100%;
	height:100%;
	margin:0;
	overflow:hidden;
	background:#000;
}

#blockBreakerAreaFrame{
	display:grid;
	place-items:center;
	font-family:ruika9,"Yu Gothic UI","Yu Gothic",Meiryo,sans-serif;
	-webkit-user-select:none;
	user-select:none;
}

#blockBreakerAreaFrame img{
	-webkit-user-drag:none;
	user-drag:none;
}

#blockBreakerAreaFrame .area-screen{
	position:relative;
	display:grid;
	grid-template-rows:85.833333% 14.166667%;
	width:min(100vw,56.25dvh);
	height:min(100dvh,177.777778vw);
	aspect-ratio:9 / 16;
	overflow:hidden;
	background:#efe5d6;
	container-type:size;
}

/*
 * ヘッダーは固定し、横スライド対象をステージ領域だけへ限定する。
 * 旧area-slide-panel全体移動より、iPhoneの合成対象を小さくする検証構成。
 */
#blockBreakerAreaFrame .area-main{
	position:relative;
	display:grid;
	grid-template-rows:21.770833fr 64.0625fr;
	width:100%;
	height:100%;
	min-width:0;
	min-height:0;
	overflow:hidden;
	isolation:isolate;
}

/*
 * 並び順変更ボタンとページ表示はエリア横移動へ含めない。
 * ステージ領域と同じグリッド行へ重ね、移動完了後に表示内容だけ更新する。
 */
#blockBreakerAreaFrame .area-stage-fixed-controls{
	position:absolute;
	z-index:30;
	grid-row:2;
	grid-column:1;
	inset:0;
	min-width:0;
	min-height:0;
	pointer-events:none;
}

#blockBreakerAreaFrame .area-slide-viewport{
	position:relative;
	grid-row:2;
	min-width:0;
	min-height:0;
	overflow:hidden;
	touch-action:none;
	isolation:isolate;
}

#blockBreakerAreaFrame .area-slide-panel{
	position:absolute;
	z-index:1;
	inset:0;
	display:block;
	width:100%;
	height:100%;
	min-width:0;
	min-height:0;
	transform:translate3d(0,0,0);
	will-change:transform;
}

#blockBreakerAreaFrame .area-slide-panel.is-current{
	z-index:2;
}

#blockBreakerAreaFrame .area-slide-panel.is-snapshot{
	z-index:1;
	pointer-events:none;
}

#blockBreakerAreaFrame .area-slide-panel.is-transitioning{
	transition:transform 0.42s cubic-bezier(0.22,0.72,0.18,1);
}

#blockBreakerAreaFrame .area-slide-panel.is-area-drag-settling{
	transition:transform var(--area-drag-settle-duration,260ms) cubic-bezier(0.22,0.72,0.18,1);
}

body.is-area-dragging #blockBreakerAreaFrame .area-slide-viewport,
body.is-area-dragging #blockBreakerAreaFrame .area-header,
body.is-area-sliding #blockBreakerAreaFrame .area-slide-viewport,
body.is-area-sliding #blockBreakerAreaFrame .area-header{
	cursor:grabbing;
}

body.is-area-sliding #blockBreakerAreaFrame .area-slide-panel{
	pointer-events:none;
}

body.is-area-dragging #blockBreakerAreaFrame{
	user-select:none;
}

/* ステージページ送り。前ページがあれば上、次ページがあれば下に個別表示する。 */
#blockBreakerAreaFrame .area-stage-page-navigation{
	position:absolute;
	z-index:121;
	inset:0;
	display:block;
	pointer-events:none;
	overflow:hidden;
}

#blockBreakerAreaFrame .area-stage-page-navigation[hidden]{
	display:none;
}

/*
 * 元の左右アローは、回転前の画像領域が 5.925926cqw × 13.333333cqw、
 * 水平方向の見た目を scaleX(0.65) している。
 * これを90deg回転すると、ページアローの外接矩形は
 * 13.333333cqw × (5.925926cqw * 0.65) = 13.333333cqw × 3.851852cqw。
 * ボタン自体をこの外接矩形へ合わせることで、top:0 / bottom:0 を
 * 「回転前のDOM箱」ではなく「実際に見えているアローの端」と一致させる。
 */
#blockBreakerAreaFrame .area-stage-page-navigation-arrow{
	position:absolute;
	left:50%;
	display:block;
	width:13.333333cqw;
	height:3.851852cqw;
	min-height:0;
	padding:0;
	border:0;
	background:transparent;
	cursor:pointer;
	pointer-events:auto;
	touch-action:manipulation;
	transform:translateX(-50%) translateY(0);
	transition:transform 0.12s ease,filter 0.12s ease,opacity 0.12s ease;
	overflow:visible;
}

#blockBreakerAreaFrame .area-stage-page-navigation-arrow[hidden]{
	display:none;
}

#blockBreakerAreaFrame .area-stage-page-navigation-arrow.is-previous{
	top:0;
}

#blockBreakerAreaFrame .area-stage-page-navigation-arrow.is-next{
	bottom:0;
}

#blockBreakerAreaFrame .area-stage-page-navigation-arrow img{
	position:absolute;
	left:50%;
	top:50%;
	display:block;
	width:5.925926cqw;
	height:13.333333cqw;
	margin-left:-2.962963cqw;
	margin-top:-6.666667cqw;
	max-width:none;
	object-fit:contain;
	transform-origin:center center;
	filter:
		drop-shadow(1px 0 0 rgba(0,0,0,0.5))
		drop-shadow(-1px 0 0 rgba(0,0,0,0.5))
		drop-shadow(0 1px 0 rgba(0,0,0,0.5))
		drop-shadow(0 -1px 0 rgba(0,0,0,0.5))
		drop-shadow(1px 1px 0 rgba(0,0,0,0.5))
		drop-shadow(-1px 1px 0 rgba(0,0,0,0.5))
		drop-shadow(1px -1px 0 rgba(0,0,0,0.5))
		drop-shadow(-1px -1px 0 rgba(0,0,0,0.5));
	pointer-events:none;
}

#blockBreakerAreaFrame .area-stage-page-navigation-arrow.is-previous img{
	transform:rotate(-90deg) scaleX(0.65);
}

#blockBreakerAreaFrame .area-stage-page-navigation-arrow.is-next img{
	transform:rotate(90deg) scaleX(0.65);
}

#blockBreakerAreaFrame .area-stage-page-navigation-arrow:hover{
	filter:brightness(1.1);
}

#blockBreakerAreaFrame .area-stage-page-navigation-arrow:active{
	transform:translateX(-50%) translateY(0) scale(0.94);
	filter:brightness(0.95);
}

#blockBreakerAreaFrame .area-stage-page-navigation-arrow:focus-visible{
	outline:0.37037cqw solid #9d481b;
	outline-offset:-0.185185cqw;
	border-radius:0.740741cqw;
}

#blockBreakerAreaFrame .area-stage-page-navigation-arrow:disabled{
	visibility:hidden;
	pointer-events:none;
	cursor:default;
}

/* 上下とも3秒ごとに、静止位置0から画面端側へ2回だけ「ちょんちょん」して0へ戻る。 */
#blockBreakerAreaFrame .area-stage-page-navigation.is-nudging .area-stage-page-navigation-arrow.is-previous:not([hidden]):not(:disabled){
	animation:areaStagePageNavigationNudgePrevious 3s ease-in-out infinite;
}

#blockBreakerAreaFrame .area-stage-page-navigation.is-nudging .area-stage-page-navigation-arrow.is-next:not([hidden]):not(:disabled){
	animation:areaStagePageNavigationNudgeNext 3s ease-in-out infinite;
}

@keyframes areaStagePageNavigationNudgePrevious{
	0%,8%,16%,100%{transform:translateX(-50%) translateY(0);}
	4%{transform:translateX(-50%) translateY(-1.481481cqw);}
	12%{transform:translateX(-50%) translateY(-0.925926cqw);}
}

@keyframes areaStagePageNavigationNudgeNext{
	0%,8%,16%,100%{transform:translateX(-50%) translateY(0);}
	4%{transform:translateX(-50%) translateY(1.481481cqw);}
	12%{transform:translateX(-50%) translateY(0.925926cqw);}
}

body.is-area-frame-inactive #blockBreakerAreaFrame .area-stage-page-navigation-arrow,
body.is-area-page-overlay-open #blockBreakerAreaFrame .area-stage-page-navigation-arrow,
body.is-area-sliding #blockBreakerAreaFrame .area-stage-page-navigation-arrow,
body.is-area-dragging #blockBreakerAreaFrame .area-stage-page-navigation-arrow,
body.is-stage-load-locked #blockBreakerAreaFrame .area-stage-page-navigation-arrow{
	animation:none !important;
}

/* 上ページアローが出るページでは、同じ帯域のエリア●表示を確実に消す。 */
#blockBreakerAreaFrame .area-position-indicator[hidden],
#blockBreakerAreaFrame .area-position-indicator.is-stage-page-previous-visible{
	display:none !important;
}

/* 複数エリア時の左右切替ナビゲーション。 */
#blockBreakerAreaFrame .area-navigation{
	position:absolute;
	z-index:120;
	inset:0;
	pointer-events:none;
}

#blockBreakerAreaFrame .area-navigation[hidden]{
	display:none;
}

#blockBreakerAreaFrame .area-navigation-arrow{
	--area-navigation-guide-inward:0;
	--area-navigation-guide-outward:0;
	position:absolute;
	top:62.682039%;
	display:grid;
	place-items:center;
	width:5.925926cqw;
	height:auto;
	min-height:0;
	padding:0;
	border:0;
	background:transparent;
	cursor:pointer;
	pointer-events:auto;
	touch-action:manipulation;
	transform:translateY(-50%) scaleX(0.65);
	transition:transform 0.12s ease,filter 0.12s ease,opacity 0.12s ease;
}

#blockBreakerAreaFrame .area-navigation-arrow.is-left{
	--area-navigation-guide-inward:3.703704cqw;
	--area-navigation-guide-outward:-0.925926cqw;
	left:0;
	transform-origin:left center;
}

#blockBreakerAreaFrame .area-navigation-arrow.is-right{
	--area-navigation-guide-inward:-3.703704cqw;
	--area-navigation-guide-outward:0.925926cqw;
	right:0;
	transform-origin:right center;
}

#blockBreakerAreaFrame .area-navigation-arrow img{
	display:block;
	width:auto;
	height:13.333333cqw;
	max-width:100%;
	object-fit:contain;
	filter:
		drop-shadow(1px 0 0 rgba(0,0,0,0.5))
		drop-shadow(-1px 0 0 rgba(0,0,0,0.5))
		drop-shadow(0 1px 0 rgba(0,0,0,0.5))
		drop-shadow(0 -1px 0 rgba(0,0,0,0.5))
		drop-shadow(1px 1px 0 rgba(0,0,0,0.5))
		drop-shadow(-1px 1px 0 rgba(0,0,0,0.5))
		drop-shadow(1px -1px 0 rgba(0,0,0,0.5))
		drop-shadow(-1px -1px 0 rgba(0,0,0,0.5));
	pointer-events:none;
}

#blockBreakerAreaFrame .area-navigation-arrow:hover{
	filter:brightness(1.1);
}

#blockBreakerAreaFrame .area-navigation-arrow:active{
	transform:translateY(-50%) scaleX(0.611) scaleY(0.94);
	filter:brightness(0.95);
}

#blockBreakerAreaFrame .area-navigation-arrow:focus-visible{
	outline:0.37037cqw solid #9d481b;
	outline-offset:-0.185185cqw;
	border-radius:0.740741cqw;
}

#blockBreakerAreaFrame .area-navigation-arrow:disabled{
	opacity:0.48;
	pointer-events:none;
	cursor:default;
}

#blockBreakerAreaFrame .area-navigation-arrow.is-guide-animating{
	animation:areaNavigationArrowGuide 1s ease-out 1 both;
}

@keyframes areaNavigationArrowGuide{
	0%{opacity:0;transform:translateX(var(--area-navigation-guide-inward)) translateY(-50%) scaleX(0.65);}
	32%{opacity:1;transform:translateX(0) translateY(-50%) scaleX(0.65);}
	47%{opacity:1;transform:translateX(var(--area-navigation-guide-outward)) translateY(-50%) scaleX(0.65);}
	57%{opacity:1;transform:translateX(0) translateY(-50%) scaleX(0.65);}
	72%{opacity:1;transform:translateX(var(--area-navigation-guide-outward)) translateY(-50%) scaleX(0.65);}
	82%,100%{opacity:1;transform:translateX(0) translateY(-50%) scaleX(0.65);}
}

#blockBreakerAreaFrame .area-position-indicator{
	position:absolute;
	z-index:30;
	left:50%;
	top:25.364077%;
	display:flex;
	align-items:center;
	justify-content:center;
	gap:0.740741cqw;
	width:max-content;
	margin-top:2px;
	padding:0;
	transform:translateX(-50%);
	pointer-events:none;
	-webkit-user-select:none;
	user-select:none;
	white-space:nowrap;
}

#blockBreakerAreaFrame .area-position-indicator-dot{
	display:block;
	width:1.296296cqw;
	height:1.296296cqw;
	border:0.185185cqw solid rgba(59,31,18,0.78);
	border-radius:50%;
	background:rgba(255,248,225,0.68);
	box-shadow:0 0.185185cqw 0.37037cqw rgba(0,0,0,0.42);
}

#blockBreakerAreaFrame .area-position-indicator-dot.is-current{
	background:#53291a;
	box-shadow:
		0 0.185185cqw 0.37037cqw rgba(0,0,0,0.42),
		0 0 0.555556cqw rgba(255,244,197,0.68);
}

@media (prefers-reduced-motion:reduce){
	#blockBreakerAreaFrame .area-navigation-arrow.is-guide-animating{
		animation:none;
	}
}

#blockBreakerAreaFrame .area-header{
	position:relative;
	grid-row:1;
	min-width:0;
	min-height:0;
	overflow:hidden;
	touch-action:none;
	isolation:isolate;
}

/*
 * ヘッダー背景画像側でエフェクトを完成させるため、
 * 追加の白オーバーレイとぼかしは停止する。
 * タイトル、蛍、風船など他のヘッダー演出は維持する。
 *
.area-header::before{
	content:"";
	position:absolute;
	z-index:1;
	inset:0;
	background:rgba(255,255,255,0.01);
	-webkit-backdrop-filter:blur(0.925926cqw);
	backdrop-filter:blur(0.925926cqw);
	opacity:0.2;
	pointer-events:none;
}
*/

#blockBreakerAreaFrame .area-header-image{
	position:absolute;
	z-index:0;
	inset:0;
	display:block;
	width:100%;
	height:100%;
	object-fit:cover;
	object-position:center;
	pointer-events:none;
}

#blockBreakerAreaFrame .area-header-title{
	position:absolute;
	z-index:20;
	left:5cqw;
	top:2cqw;
	width:max-content;
	max-width:calc(100% - 5cqw - 2em);
	margin:0;
	padding:0;
	overflow:visible;
	transform:none;
	color:#fff7d1;
	font-family:killgo,"Yu Gothic UI","Yu Gothic",Meiryo,sans-serif;
	font-size:4.3cqw;
	font-weight:900;
	font-style:italic;
	line-height:1;
	letter-spacing:0.05em;
	text-align:left;
	white-space:nowrap;
	opacity:0.7;
	mix-blend-mode:hard-light;
	text-shadow:0 0.37037cqw 0.185185cqw #31190b,0 0 0.925926cqw #000;
	pointer-events:none;
}

#blockBreakerAreaFrame .area-header-title-adjusted-character{
	display:inline-block;
}

#blockBreakerAreaFrame .area-header-title-adjusted-character.is-katakana-n{
	margin-right:-0.1em;
}

#blockBreakerAreaFrame .area-header-title-adjusted-character.is-katakana-open{
	margin-right:0.05em;
}

#blockBreakerAreaFrame .area-header-title::after{
	content:"";
	position:absolute;
	left:0;
	top:calc(100% + 0.05em);
	display:block;
	width:calc(100% + 2em);
	height:1px;
	background:linear-gradient(
		to right,
		rgba(255,247,209,0.95) 0,
		rgba(255,247,209,0.95) calc(100% - 4em),
		rgba(255,247,209,0) 100%
	);
	pointer-events:none;
}

#blockBreakerAreaFrame .area-header-frame{
	position:absolute;
	z-index:10;
	inset:0;
	pointer-events:none;
}

#blockBreakerAreaFrame .area-header-frame-side{
	position:absolute;
	top:0;
	display:block;
	width:auto;
	height:100%;
	pointer-events:none;
}

#blockBreakerAreaFrame .area-header-frame-side.is-left{
	left:0;
}

#blockBreakerAreaFrame .area-header-frame-side.is-right{
	right:0;
}

#blockBreakerAreaFrame .area-stage-scroll{
	position:relative;
	width:100%;
	height:100%;
	min-width:0;
	min-height:0;
	overflow:hidden;
	overscroll-behavior:none;
	touch-action:none;
	background-color:#eadfcd;
	background-image:var(--area-stage-background);
	background-position:center;
	background-repeat:no-repeat;
	background-size:100% 100%;
	isolation:isolate;
}

/*
 * 実機負荷検証のため、areaStageScrollの背景エフェクトを一時停止する。
 * 背景画像そのものは.area-stage-scroll側で維持する。
 *
.area-stage-scroll::before{
	content:"";
	position:absolute;
	z-index:0;
	inset:0;
	background:rgba(255,255,255,0.01);
	-webkit-backdrop-filter:blur(0.925926cqw);
	backdrop-filter:blur(0.925926cqw);
	opacity:0.7;
	pointer-events:none;
}
*/

#blockBreakerAreaFrame .area-stage-page-decoration{
	position:absolute;
	z-index:0;
	outline-offset:-1.026cqw;
	outline:1.5cqw double white;
	border:0.6cqw dotted white;
	top:5cqw;
	right:-1cqw;
	display:block;
	width:11.5cqw;
	height:16cqw;
	border-radius:50%;
	background:radial-gradient(circle,#fff 0%,rgba(255,255,255,0.8) 50%,rgba(255,255,255,0) 100%);
	opacity:0.7;
	pointer-events:none;
}


/*
 * エリア横移動中だけ、移動するステージ側の飾りを隠し、
 * 固定コントロール層の同一飾りへ差し替えて視覚上の位置を固定する。
 */
#blockBreakerAreaFrame .area-stage-page-decoration.is-stage-stage-page-decoration{
	visibility:visible;
}

#blockBreakerAreaFrame .area-stage-page-decoration.is-fixed-stage-page-decoration{
	z-index:1;
	visibility:hidden;
}

body.is-area-dragging #blockBreakerAreaFrame .area-stage-page-decoration.is-stage-stage-page-decoration,
body.is-area-sliding #blockBreakerAreaFrame .area-stage-page-decoration.is-stage-stage-page-decoration{
	visibility:hidden;
}

body.is-area-dragging #blockBreakerAreaFrame .area-stage-page-decoration.is-fixed-stage-page-decoration,
body.is-area-sliding #blockBreakerAreaFrame .area-stage-page-decoration.is-fixed-stage-page-decoration{
	visibility:visible;
}

#blockBreakerAreaFrame .area-stage-list{
	position:relative;
	z-index:1;
	display:flex;
	flex-direction:column;
	width:100%;
	height:100%;
	min-height:0;
	padding:0;
	transform:translate3d(0,0,0);
	transition:transform 0.32s cubic-bezier(0.22,0.72,0.18,1);
	will-change:transform;
}

#blockBreakerAreaFrame .area-stage-list.is-dragging{
	transition:none;
}

#blockBreakerAreaFrame .area-stage-page{
	position:relative;
	display:flex;
	flex:0 0 100%;
	flex-direction:column;
	align-items:center;
	width:100%;
	height:100%;
	min-height:100%;
	aspect-ratio:1620 / 1845;
	gap:9.259259cqw;
	padding:0;
	overflow:hidden;
	isolation:isolate;
}

#blockBreakerAreaFrame .area-stage-page > .stage-panel{
	z-index:1;
}

#blockBreakerAreaFrame .area-stage-page .stage-panel:first-child{
	margin-top:auto;
}

#blockBreakerAreaFrame .area-stage-page .stage-panel:last-child{
	margin-bottom:auto;
}

/*
 * stage-panel本体はコンテンツ領域。
 * フレームはその外側へ20px相当はみ出して最前面へ置く。
 */
#blockBreakerAreaFrame .stage-panel{
	--stage-panel-overhang:1.851852cqw;
	--stage-panel-overhang-negative:-1.851852cqw;
	--stage-panel-left:5.37037cqw;
	--stage-panel-right:5.37037cqw;
	--stage-panel-top:5cqw;
	--stage-panel-bottom:5.185185cqw;
	position:relative;
	flex:0 0 auto;
	width:77%;
	height:auto;
	aspect-ratio:1500 / 853;
	overflow:visible;
	filter:drop-shadow(0 0 0.648148cqw rgba(228,193,164,0.52));
	cursor:pointer;
	outline:none;
}

#blockBreakerAreaFrame .stage-panel.is-coming-soon{
	cursor:default;
}

#blockBreakerAreaFrame .stage-panel.is-empty-slot{
	visibility:hidden;
	pointer-events:none;
	filter:none;
	cursor:default;
}

#blockBreakerAreaFrame .stage-panel:not(.is-coming-soon):focus-visible{
	filter:
		drop-shadow(0 0 0.648148cqw rgba(228,193,164,0.52))
		drop-shadow(0 0 0.925926cqw rgba(255,255,255,0.92));
}

#blockBreakerAreaFrame .stage-panel-content{
	position:absolute;
	z-index:1;
	inset:0;
	overflow:hidden;
	isolation:isolate;
	background-color:rgb(68 8 5);
	background-position:center;
	background-repeat:no-repeat;
	background-size:cover;
}

#blockBreakerAreaFrame .stage-panel-content::before{
	content:"";
	position:absolute;
	z-index:2;
	inset:0;
	background-image:var(--stage-panel-pinup-image);
	background-position:center;
	background-repeat:no-repeat;
	background-size:cover;
	mix-blend-mode:screen;
	opacity:0;
	transition:opacity 0.14s ease;
	pointer-events:none;
}

#blockBreakerAreaFrame .stage-panel:not(.is-coming-soon):hover .stage-panel-content::before{
	opacity:0.2;
}

@supports (mix-blend-mode:plus-lighter){
	#blockBreakerAreaFrame .stage-panel-content::before{
		mix-blend-mode:plus-lighter;
	}
}


/*
 * 実機検証のため、ステージパネル内側の常時境界・発光を一時停止する。
 * hover時の加算表示（.stage-panel-content::before）や外側フレームは維持する。
 *
.stage-panel-content::after{
	content:"";
	position:absolute;
	z-index:3;
	inset:0;
	border-radius:inherit;
	box-shadow:
		inset 0 0 0.555556cqw rgba(255,248,242,0.98),
		inset 0 0 1.481481cqw rgba(228,193,164,0.96),
		inset 0 0 3.703704cqw rgba(228,193,164,0.82);
	mix-blend-mode:screen;
	filter:brightness(1.22) saturate(1.08);
	opacity:0.96;
	pointer-events:none;
}

@supports (mix-blend-mode:plus-lighter){
	.stage-panel-content::after{
		mix-blend-mode:plus-lighter;
	}
}
*/

/* iPhone / iPadでは、hover時の加算発光レイヤーだけ生成しない。 */
html.is-area-stage-ios #blockBreakerAreaFrame .stage-panel-content::before{
	content:none;
	display:none;
}

#blockBreakerAreaFrame .stage-panel-content-overlay{
	position:absolute;
	z-index:4;
	inset:0;
	display:flex;
	flex-direction:column;
	justify-content:flex-start;
	padding:2.314815cqw 2.777778cqw 2.5cqw;
	color:#fff;
	font-family:ruika9,"Yu Gothic UI","Yu Gothic",Meiryo,sans-serif;
	font-weight:900;
	text-shadow:0 0.277778cqw 0.185185cqw rgba(0,0,0,0.95),0 0 0.740741cqw rgba(0,0,0,0.88);
	pointer-events:none;
}

#blockBreakerAreaFrame .stage-panel-header{
	position:relative;
	display:block;
	width:100%;
	height:100%;
	min-width:0;
	min-height:0;
	overflow:visible;
}

#blockBreakerAreaFrame .stage-panel-heading{
	position:absolute;
	z-index:2;
	left:0;
	top:0;
	display:block;
	width:100%;
	overflow:visible;
}

#blockBreakerAreaFrame .stage-panel-number{
	--stage-panel-number-height:3.7cqw;
	/* --stage-panel-number-height:22px; */

	position:absolute;
	z-index:20;
	left:50%;
	top:-0.88cqw;
	display:inline-grid;
	place-items:center;
	width:max-content;
	min-width:0;
	height:var(--stage-panel-number-height);
	margin:0;
	padding:0 7.388889cqw;
	box-sizing:border-box;
	isolation:isolate;
	transform:translate(-50%,-50%);
	pointer-events:none;
}

#blockBreakerAreaFrame .stage-panel-number-frame{
	position:absolute;
	z-index:0;
	left:0;
	top:0;
	display:flex;
	align-items:stretch;
	width:100%;
	height:100%;
	min-width:0;
	min-height:0;
	overflow:visible;
	pointer-events:none;
}

#blockBreakerAreaFrame .stage-panel-number-frame-image{
	display:block;
	height:100%;
	pointer-events:none;
	-webkit-user-drag:none;
	user-drag:none;
}

#blockBreakerAreaFrame .stage-panel-number-frame-side{
	position:relative;
	z-index:1;
	flex:0 0 auto;
	width:auto;
	height:100%;
}

#blockBreakerAreaFrame .stage-panel-number-frame-center{
	position:relative;
	z-index:0;
	flex:1 1 auto;
	min-width:0;
	min-height:0;
	margin-left:-2px;
	margin-right:-2px;
}

#blockBreakerAreaFrame .stage-panel-number-frame-center > .stage-panel-number-frame-image{
	width:100%;
	height:100%;
}

#blockBreakerAreaFrame .stage-panel-number-label{
	position:relative;
	z-index:2;
	display:flex;
	align-items:center;
	justify-content:center;
	width:100%;
	height:100%;
	min-width:0;
	min-height:0;
	pointer-events:none;
}

#blockBreakerAreaFrame .stage-panel-number-text{
	display:inline-block;
	margin:0;
	color:#d5a38fcf;
	font-family:medieval,ruika9,"Yu Gothic UI","Yu Gothic",Meiryo,sans-serif;
	font-size:2cqw;
	font-weight:900;
	line-height:1;
	letter-spacing:0.08em;
	text-shadow:0 0.277778cqw 0.185185cqw rgba(0,0,0,0.95),0 0 0.740741cqw rgba(0,0,0,0.88);
	transform:translateY(0.1em);
	white-space:nowrap;
}

#blockBreakerAreaFrame .stage-panel-title{
	margin:0 0 0.3cqw 0;
	font-family:killgo,ruika9,"Yu Gothic UI","Yu Gothic",Meiryo,sans-serif;
	font-size:4.166667cqw;
	line-height:1.08;
	letter-spacing:0.04em;
	white-space:nowrap;
}

#blockBreakerAreaFrame .stage-panel-title-number{
	margin-left:0.2em;
}

#blockBreakerAreaFrame .stage-panel-summary{
	position:absolute;
	z-index:2;
	top:0;
	right:0;
	display:grid;
	gap:0.740741cqw;
	width:max-content;
	min-width:0;
	padding:0.925926cqw 1.203704cqw;
	border:1px solid rgba(68,8,5,0.52);
	border-radius:0.925926cqw;
	outline:rgba(232,192,162,0.52) 1px dashed;
	outline-offset:-0.7cqw;
	background:rgba(154,90,54,0.62);
	/* box-shadow:inset 0 0 0 0.092593cqw rgba(255,255,255,0.3); */
}

#blockBreakerAreaFrame .stage-panel-summary p{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:1.111111cqw;
	margin:0;
	font-size:2.222222cqw;
	line-height:1.1;
	white-space:nowrap;
}

#blockBreakerAreaFrame .stage-panel-summary .stage-panel-difficulty{
	flex-direction:column;
	justify-content:flex-start;
	width:max-content;
	gap:0.45em;
	text-align:center;
}

#blockBreakerAreaFrame .stage-panel-summary-label{
	display:flex;
	align-items:baseline;
	justify-content:center;
	gap:0.32em;
	color:#f4f0df;
	text-shadow:-1px -1px 0 rgb(68,8,5),1px -1px 0 rgb(68,8,5),-1px 1px 0 rgb(68,8,5),1px 1px 0 rgb(68,8,5);
}

#blockBreakerAreaFrame .stage-panel-summary-difficulty-label{
	font-family:fivaji,"Yu Gothic UI","Yu Gothic",Meiryo,sans-serif;
	font-size:1.3em;
	letter-spacing:0.1em;
	line-height:1em;
	margin-bottom:-0.2em;
}

#blockBreakerAreaFrame .stage-panel-difficulty-stars{
	display:flex;
	align-items:center;
	min-height:1em;
	filter:
		drop-shadow(0 0 1px rgb(68,8,5))
		drop-shadow(0 0 1px rgb(68,8,5));
}

#blockBreakerAreaFrame .stage-panel-difficulty-star-image{
	display:block;
	height:1em;
	width:auto;
	margin-right:1px;
	pointer-events:none;
	-webkit-user-drag:none;
	user-drag:none;
}

#blockBreakerAreaFrame .stage-panel-summary-value{
	color:#fff;
}

#blockBreakerAreaFrame .stage-panel-total-playing{
	position:absolute;
	z-index:2;
	right:0;
	bottom:0;
	display:grid;
	justify-items:center;
	align-content:start;
	gap:0.42cqw;
	margin:0;
	font-family:tanuki,"Yu Gothic UI","Yu Gothic",Meiryo,sans-serif;
	font-size:1.944444cqw;
	line-height:1;
	letter-spacing:0.03em;
}

#blockBreakerAreaFrame .stage-panel-total-playing-label{
	padding-left:0;
	font-size:0.8em;
	color:#fff;
	-webkit-text-stroke:0.06em #000;
	paint-order:stroke fill;
	text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000;
}

#blockBreakerAreaFrame .stage-panel-total-playing-value{
	display:inline-grid;
	place-items:center;
	box-sizing:border-box;
	min-width:3.9em;
	height:1.62em;
	padding:0 0.833333cqw;
	border-radius:999px;
	background:rgba(68,8,5,0.58);
	font-family:cookie,"Yu Gothic UI","Yu Gothic",Meiryo,sans-serif;
	font-size:1em;
	line-height:1;
	color:#fff;
	text-align:center;
	text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000;
}

/* ステージパネル右下のカウンタだけを、パネル配色へ合わせる。 */
#blockBreakerAreaFrame #areaStageList .stage-panel-total-playing-label{
	text-shadow:
		-1px -1px 0 rgb(68,8,5),
		1px -1px 0 rgb(68,8,5),
		-1px 1px 0 rgb(68,8,5),
		1px 1px 0 rgb(68,8,5);
}

#blockBreakerAreaFrame #areaStageList .stage-panel-total-playing-value{
	background:rgba(68,8,5,0.58);
	text-shadow:
		-1px -1px 0 rgb(68,8,5),
		1px -1px 0 rgb(68,8,5),
		-1px 1px 0 rgb(68,8,5),
		1px 1px 0 rgb(68,8,5);
}

/* DEV: ステージパネルは初期描画から茶色。ヘッダー2カウンタだけ従来の黒を維持する。 */
#blockBreakerAreaFrame .area-header .stage-panel-total-playing-value{
	background:rgba(0,0,0,0.58);
}

#blockBreakerAreaFrame .stage-panel-total-playing-time-value{
	grid-auto-flow:column;
	gap:0.08em;
	min-width:5.2em;
	font-family:tanuki,"Yu Gothic UI","Yu Gothic",Meiryo,sans-serif;
}

#blockBreakerAreaFrame .stage-panel-total-playing-time-number{
	font-family:cookie,"Yu Gothic UI","Yu Gothic",Meiryo,sans-serif;
}

#blockBreakerAreaFrame .stage-panel-total-playing-time-unit{
	font-family:popinfo,"Yu Gothic UI","Yu Gothic",Meiryo,sans-serif;
	/* transform:translateY(0.1cqw); */
}

#blockBreakerAreaFrame .area-header-information{
	position:absolute;
	z-index:20;
	left:5cqw;
	top:7.5cqw;
	display:flex;
	flex-direction:column;
	align-items:flex-start;
	width:max-content;
	max-width:calc(100% - 10cqw);
	pointer-events:none;
}

#blockBreakerAreaFrame .area-playing-counters{
	display:flex;
	align-items:flex-start;
	gap:2.2cqw;
	width:max-content;
}

#blockBreakerAreaFrame .area-total-playing{
	position:relative;
	z-index:auto;
	left:auto;
	top:auto;
	right:auto;
	bottom:auto;
	justify-items:center;
	align-content:start;
	margin:0;
	pointer-events:none;
}

#blockBreakerAreaFrame .area-total-playing .stage-panel-total-playing-label{
	font-size:0.8em;
}

#blockBreakerAreaFrame .area-index{
	display:flex;
	flex-direction:column;
	align-items:flex-start;
	margin:1em 0 0;
	padding:0.22em 0.82em 0.38em;
	border:0.08em solid rgba(255,255,255,0.3);
	border-radius:0.62em;
	background:rgba(255,255,255,0.2);
	box-shadow:0 0.16em 0.42em rgba(0,0,0,0.22),inset 0 0 0.34em rgba(255,255,255,0.12);
	font-family:dot,"Yu Gothic UI","Yu Gothic",Meiryo,sans-serif;
	font-size:2.037037cqw;
	font-weight:900;
	line-height:1.18;
	letter-spacing:0.04em;
	color:#fff;
	text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000;
}

#blockBreakerAreaFrame .area-index-title{
	display:inline-block;
	width:max-content;
	margin:0 0 0.42em;
	padding:0.22em 1em 0.3em;
	border:0.12em solid rgba(255,247,209,0.94);
	border-radius:0.26em;
	background:linear-gradient(180deg,rgba(103,57,35,0.92),rgba(48,25,17,0.92));
	box-shadow:0 0.12em 0.28em rgba(0,0,0,0.46),inset 0 0 0.28em rgba(255,247,209,0.22);
	font:inherit;
	font-size:0.86em;
	line-height:1;
	color:#fff7d1;
}

#blockBreakerAreaFrame .area-index-list{
	display:grid;
	gap:0.18em;
	margin:0;
	padding:0;
	list-style:none;
}

#blockBreakerAreaFrame .area-index-item{
	display:grid;
	grid-template-columns:1.1em auto;
	align-items:center;
	min-width:0;
	margin:0;
	padding:0;
	white-space:nowrap;
	opacity:0.78;
	transition:opacity 160ms ease;
}

#blockBreakerAreaFrame .area-index-item.is-current{
	opacity:1;
}

#blockBreakerAreaFrame .area-index-prefix{
	display:inline-block;
	width:1em;
	transform:translateX(-0.28em) rotate(-90deg);
	transform-origin:center;
	font-size:0.82em;
	line-height:1;
	visibility:visible;
	opacity:0;
	transition:opacity 140ms ease,transform 180ms ease;
}

#blockBreakerAreaFrame .area-index-item.is-current .area-index-prefix{
	transform:translateX(0) rotate(-90deg);
	opacity:1;
}

#blockBreakerAreaFrame .area-index-label{
	min-width:0;
}

#blockBreakerAreaFrame .area-stage-sort-status{
	position:absolute;
	z-index:20;
	top:-1px;
	right:0;
	display:grid;
	justify-items:end;
	gap:0.37037cqw;
	width:max-content;
	margin:0;
	padding:0.35cqw 0.45cqw 0.65cqw 0.8cqw;
	border:0;
	border-radius:0;
	background:transparent;
	appearance:none;
	-webkit-appearance:none;
	color:inherit;
	font-family:tanuki,"Yu Gothic UI","Yu Gothic",Meiryo,sans-serif;
	font-size:1.944444cqw;
	line-height:1;
	text-align:right;
	pointer-events:auto;
	cursor:pointer;
	touch-action:manipulation;
	overflow:visible;
	isolation:isolate;
}

#blockBreakerAreaFrame .area-stage-sort-label{
	position:relative;
	font-size:0.9em;
	display:inline-flex;
	align-items:center;
	justify-content:flex-end;
	gap:0.42em;
	margin:0;
	color:#fff;
	-webkit-text-stroke:0.2em #000;
	paint-order:stroke fill;
	text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000;
	white-space:nowrap;
	pointer-events:none;
}

#blockBreakerAreaFrame .area-stage-sort-label-text{
	display:inline-flex;
	align-items:baseline;
	justify-content:flex-end;
	font-size:1.8em;
	padding-right:0.5cqw;
}

#blockBreakerAreaFrame .area-stage-sort-label-arrow{
	flex:0 0 auto;
	font-family:'tanuki';
}

#blockBreakerAreaFrame .area-stage-sort-label-mode{
	flex:0 0 auto;
	margin-left:0.15em;
	font-family:'mystery';
	letter-spacing:0.03em;
}



#blockBreakerAreaFrame .area-stage-sort-status,
#blockBreakerAreaFrame .area-stage-sort-status:focus,
#blockBreakerAreaFrame .area-stage-sort-status:focus-visible{
	outline:none;
}

#blockBreakerAreaFrame .area-stage-sort-status > *,
#blockBreakerAreaFrame .area-stage-sort-status > * > *{
	pointer-events:none;
}

#blockBreakerAreaFrame .area-stage-sort-status.is-disabled{
	opacity:0.45;
	cursor:default;
	pointer-events:none;
}

/*
 * ページ表記は並べ替えボタン内の小型バッジではなく、右上へ題字として浮かせる。
 * 数字はmysteryを個別配置し、スラッシュは文字を使わずCSSの直線で描画する。
 */
#blockBreakerAreaFrame .area-stage-page-status{
	position:absolute;
	z-index:2;
	top:7.3cqw;
	right:0.6cqw;
	display:block;
	width:7.8cqw;
	height:9.6cqw;
	margin:0;
	padding:0;
	overflow:visible;
	pointer-events:none;
	font-style:italic;
}

#blockBreakerAreaFrame .area-stage-page-number{
	position:absolute;
	z-index:2;
	display:block;
	font-family:mystery,"Yu Gothic UI","Yu Gothic",Meiryo,sans-serif;
	font-size:6.2cqw;
	font-weight:400;
	line-height:0.82;
	letter-spacing:-0.08em;
	color:#fff;
	-webkit-text-stroke:0.93cqw #000;
	paint-order:stroke fill;
	white-space:nowrap;
	text-align:center;
}

#blockBreakerAreaFrame .area-stage-page-number.is-current{
	top:0;
	left:0.5cqw;
	transform:rotate(-4deg);
}

/*
 * 現在ページ番号：金庫ダイヤル風。
 * 下から送り込み、停止位置で小さく上下へ噛み合って「ガチャン」と止める。
 */
#blockBreakerAreaFrame .area-stage-page-number.is-current.is-dial-locking{
	animation:areaStagePageCurrentDialLock 0.56s cubic-bezier(0.18,0.72,0.16,1) both;
}

@keyframes areaStagePageCurrentDialLock{
	0%{transform:translateY(7.2cqw) rotate(-4deg);}
	48%{transform:translateY(-0.55cqw) rotate(-4deg);}
	62%{transform:translateY(0.28cqw) rotate(-4deg);}
	72%{transform:translateY(-0.18cqw) rotate(-4deg);}
	81%{transform:translateY(0.10cqw) rotate(-4deg);}
	90%{transform:translateY(-0.04cqw) rotate(-4deg);}
	100%{transform:translateY(0) rotate(-4deg);}
}

#blockBreakerAreaFrame .area-stage-page-number.is-current.is-value-1{
	left:1cqw;
}

#blockBreakerAreaFrame .area-stage-page-number.is-total{
	right:2cqw;
	bottom:-2cqw;
	font-size:7cqw;
	transform:rotate(3deg);
}

#blockBreakerAreaFrame .area-stage-page-number.is-total.is-value-1{
	right:2.2cqw;
}

#blockBreakerAreaFrame .area-stage-page-slash{
	position:absolute;
	z-index:1;
	left:50%;
	top:50%;
	display:block;
	width:0.58cqw;
	height:11.5cqw;
	margin-left:-0.7cqw;
	margin-top:-4.75cqw;
	box-sizing:border-box;
	border:0.16cqw solid #000;
	border-radius:999px;
	background:#FFF;
	transform:rotate(28deg);
	transform-origin:center center;
}

#blockBreakerAreaFrame .stage-panel-ranking-button-wrap{
	--stage-panel-ranking-button-edge-width:2.962963cqw;
	--stage-panel-ranking-button-overlap:2px;
	--stage-panel-ranking-button-lift:calc(2.592593cqw / 2);
	position:absolute;
	z-index:20;
	left:50%;
	/* 下段中央枠の高さ（5.185185cqw）の約4分の1だけ上へ寄せる。 */
	bottom:calc(var(--stage-panel-overhang-negative) + var(--stage-panel-ranking-button-lift));
	display:inline-flex;
	align-items:stretch;
	justify-content:center;
	width:max-content;
	height:max-content;
	isolation:isolate;
	transform:translateX(-50%);
	transition:transform 0.12s ease,filter 0.12s ease;
	pointer-events:auto;
	will-change:transform,filter;
}

/* モバイルでは枠の下端へ下付きにし、PC用の持ち上げだけを適用しない。 */
html.is-area-stage-mobile #blockBreakerAreaFrame .stage-panel-ranking-button-wrap{
	bottom:var(--stage-panel-overhang-negative);
}

#blockBreakerAreaFrame .stage-panel-ranking-button-wrap::before{
	content:"";
	position:absolute;
	z-index:0;
	top:0;
	bottom:0;
	left:calc(var(--stage-panel-ranking-button-edge-width) - var(--stage-panel-ranking-button-overlap));
	right:calc(var(--stage-panel-ranking-button-edge-width) - var(--stage-panel-ranking-button-overlap));
	background-image:var(--stage-panel-ranking-button-center-image);
	background-position:center center;
	background-repeat:repeat-x;
	background-size:auto 100%;
	pointer-events:none;
}

#blockBreakerAreaFrame .stage-panel-ranking-button{
	position:relative;
	z-index:1;
	display:block;
	width:max-content;
	min-width:16.666667cqw;
	height:5.185185cqw;
	padding:0 0.833333cqw 0.15cqw;
	overflow:hidden;
	border-style:solid;
	border-color:transparent;
	border-width:0 6.296296cqw;
	border-image-source:var(--stage-panel-ranking-button-image);
	border-image-slice:0 45 fill;
	border-image-width:0 2.962963cqw;
	border-image-outset:0;
	border-image-repeat:stretch;
	border-radius:0;
	background:transparent;
	box-sizing:border-box;
	appearance:none;
	-webkit-appearance:none;
	color:#f0f5ff;
	font-family:bird,ruika9,"Yu Gothic UI","Yu Gothic",Meiryo,sans-serif;
	font-size:2.037037cqw;
	font-weight:900;
	line-height:1;
	text-shadow:-1px -1px 0 #23150f,1px -1px 0 #23150f,-1px 1px 0 #23150f,1px 1px 0 #23150f,0 2px 1px rgba(0,0,0,0.7);
	text-overflow:ellipsis;
	white-space:nowrap;
	cursor:pointer;
	touch-action:manipulation;
}

#blockBreakerAreaFrame .stage-panel-ranking-button:hover,
#blockBreakerAreaFrame .stage-panel-ranking-button:active{
	transform:none;
	filter:none;
}

#blockBreakerAreaFrame .stage-panel-ranking-button:focus-visible{
	outline:0.277778cqw solid rgba(255,255,255,0.95);
	outline-offset:0.185185cqw;
}

@media (hover:hover) and (pointer:fine){
	#blockBreakerAreaFrame .stage-panel-ranking-button-wrap:has(> .stage-panel-ranking-button:hover){
		transform:translateX(-50%) translateY(-0.185185cqw);
		filter:brightness(1.08);
	}

	#blockBreakerAreaFrame .stage-panel-ranking-button-wrap:has(> .stage-panel-ranking-button:active){
		transform:translateX(-50%) translateY(0.185185cqw);
		filter:brightness(0.94);
	}
}

#blockBreakerAreaFrame .area-ranking-buttons{
	position:absolute;
	z-index:80;
	left:50%;
	bottom:0;
	display:flex;
	align-items:flex-end;
	justify-content:center;
	gap:0.925926cqw;
	width:max-content;
	max-width:96%;
	transform:translateX(-50%);
	pointer-events:auto;
}

#blockBreakerAreaFrame .area-ranking-buttons[hidden]{
	display:none !important;
}

#blockBreakerAreaFrame .area-ranking-buttons .area-ranking-button-wrap{
	position:relative;
	left:auto;
	bottom:auto;
	z-index:auto;
	transform:none;
}

#blockBreakerAreaFrame #areaRankingButtonWrap::before{
	background-image:var(--area-ranking-button-center-image);
}

#blockBreakerAreaFrame #grandRankingButtonWrap::before{
	background-image:var(--grand-ranking-button-center-image);
}

#blockBreakerAreaFrame .area-ranking-button{
	position:relative;
	min-width:17.592593cqw;
	font-size:1.851852cqw;
}

#blockBreakerAreaFrame .area-ranking-button-sizing-label{
	display:block;
	visibility:hidden;
	white-space:nowrap;
	pointer-events:none;
}

#blockBreakerAreaFrame .area-ranking-button-display-label{
	position:absolute;
	inset:0;
	display:flex;
	align-items:center;
	justify-content:center;
	box-sizing:border-box;
	padding-bottom:0.15cqw;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
	pointer-events:none;
}

#blockBreakerAreaFrame #areaRankingButton{
	border-image-source:var(--area-ranking-button-image);
}

#blockBreakerAreaFrame #grandRankingButton{
	border-image-source:var(--grand-ranking-button-image);
}

#blockBreakerAreaFrame .stage-panel-info-groups{
	/* 540px幅で31px／2pxだった寸法をcqw化し、スマホでも枠だけ太らせない。 */
	--stage-panel-info-left:5.740741cqw;
	--stage-panel-info-right:5.740741cqw;
	--stage-panel-info-top:5.740741cqw;
	--stage-panel-info-bottom:5.740741cqw;
	--stage-panel-info-overlap:0.37037cqw;
	position:relative;
	display:block;
	width:max-content;
	height:auto;
	max-width:100%;
	padding:0;
}

#blockBreakerAreaFrame .stage-panel-info-block{
	position:relative;
	z-index:2;
	display:block;
	width:max-content;
	max-width:100%;
	/* 540px幅で14px 17px 9pxだった余白を同率で縮小する。 */
	padding:2.592593cqw 3.148148cqw 1.666667cqw;
}

#blockBreakerAreaFrame .stage-panel-info-body{
	position:relative;
	z-index:2;
	display:grid;
	align-content:start;
	gap:0.462963cqw;
	width:max-content;
	max-width:100%;
	-webkit-text-stroke:0.045em #000;
	paint-order:stroke fill;
	text-shadow:
		-1px -1px 0 #000,
		1px -1px 0 #000,
		-1px 1px 0 #000,
		1px 1px 0 #000,
		0 0 0.45em rgba(0,0,0,0.42);
}

#blockBreakerAreaFrame .stage-panel-stat{
	min-width:0;
	margin:0;
	font-size:2.12963cqw;
	line-height:1.1;
	white-space:nowrap;
}

#blockBreakerAreaFrame .stage-panel-guide-row{
	display:flex;
	align-items:baseline;
}

#blockBreakerAreaFrame .stage-panel-clear-guide-row{
	position:relative;
	display:inline-flex;
	align-items:baseline;
	width:max-content;
	min-height:1.8em;
	padding:0.22em 1.35em 0.18em;
	overflow:hidden;
	border:0.09em solid rgba(232,194,120,0.92);
	border-radius:0.32em;
	background:
		linear-gradient(90deg,rgba(255,255,255,0.07),transparent 24%,transparent 76%,rgba(255,255,255,0.07)),
		linear-gradient(180deg,rgba(91,51,29,0.92),rgba(31,20,18,0.95));
	box-shadow:
		inset 0 0 0 0.06em rgba(45,22,13,0.92),
		inset 0 0.13em 0.22em rgba(255,244,211,0.16),
		0 0.14em 0.28em rgba(0,0,0,0.58),
		0 0 0.38em rgba(209,151,70,0.24);
	color:#fff4d1;
	font-family:dot;
	letter-spacing:0.04em;
	-webkit-text-stroke:0.055em #000;
	paint-order:stroke fill;
	text-shadow:
		-1px -1px 0 #000,
		1px -1px 0 #000,
		-1px 1px 0 #000,
		1px 1px 0 #000,
		0 0 0.55em rgba(0,0,0,0.38);
}

#blockBreakerAreaFrame .stage-panel-clear-guide-row::before,
#blockBreakerAreaFrame .stage-panel-clear-guide-row::after{
	content:"";
	position:absolute;
	top:50%;
	width:0.38em;
	height:0.38em;
	border:0.07em solid rgba(255,235,178,0.95);
	background:#96552b;
	box-shadow:0 0 0.28em rgba(255,195,98,0.75);
	transform:translateY(-50%) rotate(45deg);
	pointer-events:none;
}

#blockBreakerAreaFrame .stage-panel-clear-guide-row::before{
	left:0.46em;
}

#blockBreakerAreaFrame .stage-panel-clear-guide-row::after{
	right:0.46em;
}

#blockBreakerAreaFrame .stage-panel-clear-guide-row .stage-panel-guide-label{
	margin-right:0.62em;
	padding-right:0.62em;
	border-right:1px solid rgba(242,204,132,0.58);
	color:#ffd98e;
	font-size:0.84em;
	letter-spacing:0.08em;
}

#blockBreakerAreaFrame .stage-panel-clear-guide-row .stage-panel-guide-number{
	color:#fff9e8;
	font-size:1.26em;
}

#blockBreakerAreaFrame .stage-panel-clear-guide-row .stage-panel-guide-unit{
	color:#e9c78d;
}

#blockBreakerAreaFrame .stage-panel-guide-label{
	margin-right:0.65em;
}

#blockBreakerAreaFrame .stage-panel-guide-number{
	margin-right:0.3em;
	margin-left:0.2em;
	letter-spacing:0.1em;
	transform:translateY(0.3cqw);
}

#blockBreakerAreaFrame .stage-panel-guide-leading-zero{
	visibility:hidden;
}

#blockBreakerAreaFrame .stage-panel-guide-unit{
	font-size:0.8em;
}

#blockBreakerAreaFrame .stage-panel-guide-unit.is-minute{
	margin-right:0.3em;
}

#blockBreakerAreaFrame .stage-panel-block-count{
	display:block;
	width:100%;
	overflow:hidden;
	font-size:0.8em;
	text-align:center;
	text-overflow:ellipsis;
	-webkit-text-stroke:0.05em #000;
	paint-order:stroke fill;
	text-shadow:
		-1px -1px 0 #000,
		1px -1px 0 #000,
		-1px 1px 0 #000,
		1px 1px 0 #000,
		0 0 0.45em rgba(0,0,0,0.42);
}

#blockBreakerAreaFrame .stage-panel-block-table{
	width:max-content;
	margin:0.25em auto 0.25em;
	border-collapse:collapse;
	font-family:tanuki,ruika9,"Yu Gothic UI","Yu Gothic",Meiryo,sans-serif;
	white-space:nowrap;
}

#blockBreakerAreaFrame .stage-panel-block-table td{
	/* padding:0 0 0.38em; */
	vertical-align:middle;
}

#blockBreakerAreaFrame .stage-panel-block-label-cell{
	padding-right:0.7em !important;
}

#blockBreakerAreaFrame .stage-panel-block-color-text{
	visibility:hidden;
}

#blockBreakerAreaFrame .stage-panel-block-value-cell{
	text-align:right;
}

#blockBreakerAreaFrame .stage-panel-block-number{
	display:inline-block;
	margin-right:0.3em;
	font-family:'popinfo';
}

#blockBreakerAreaFrame .stage-panel-block-unit{
	font-family:'dot';
	font-size:0.7em;
}

#blockBreakerAreaFrame .stage-panel-block-total-row td{
	padding-top:0.16em;
	padding-bottom:0;
	border-top:0.08em solid rgba(0,0,0,0.96);
}

#blockBreakerAreaFrame .stage-panel-block-color{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-width:1.55em;
	padding:0.15em 0.3em 0;
	border:0.08em solid rgba(255,255,255,0.82);
	border-radius:0.32em;
	color:#fff;
	font-weight:900;
	line-height:1;
	text-shadow:0 0.08em 0.08em rgba(0,0,0,0.95);
	box-shadow:inset 0 0.08em 0 rgba(255,255,255,0.34),0 0.08em 0.18em rgba(0,0,0,0.48);
}

#blockBreakerAreaFrame .stage-panel-block-color.is-blue{
	background:#287bd7;
	border-color:#9ed1ff;
}

#blockBreakerAreaFrame .stage-panel-block-color.is-yellow{
	background:#d2a918;
	border-color:#fff09a;
	color:#fffbe2;
}

#blockBreakerAreaFrame .stage-panel-block-color.is-red{
	background:#c9463e;
	border-color:#ffaaa3;
}

#blockBreakerAreaFrame .stage-panel-frame{
	position:absolute;
	z-index:10;
	left:var(--stage-panel-overhang-negative);
	top:var(--stage-panel-overhang-negative);
	display:flex;
	flex-direction:column;
	width:calc(100% + 3.703704cqw);
	height:calc(100% + 3.703704cqw);
	pointer-events:none;
}

#blockBreakerAreaFrame .stage-panel-frame-row{
	display:flex;
	width:100%;
	overflow:hidden;
}

#blockBreakerAreaFrame .stage-panel-frame-image{
	display:block;
	pointer-events:none;
	-webkit-user-drag:none;
	user-drag:none;
}

#blockBreakerAreaFrame .stage-panel-frame-top{
	position:relative;
	z-index:2;
	overflow:visible;
	flex:0 0 var(--stage-panel-top);
	height:var(--stage-panel-top);
	margin-bottom:-2px;
}

#blockBreakerAreaFrame .stage-panel-new-badge{
	position:absolute;
	z-index:20;
	left:0;
	top:0;
	display:block;
	width:15cqw;
	height:auto;
	transform:translate(-28%,-38%) rotate(-12deg);
	transform-origin:center;
	pointer-events:none;
	user-select:none;
	-webkit-user-select:none;
	-webkit-user-drag:none;
}

#blockBreakerAreaFrame .stage-panel-frame-bottom{
	position:relative;
	z-index:2;
	overflow:visible;
	flex:0 0 var(--stage-panel-bottom);
	height:var(--stage-panel-bottom);
	margin-top:-2px;
}

#blockBreakerAreaFrame .stage-panel-frame-middle{
	position:relative;
	z-index:1;
	flex:1 1 auto;
	min-height:0;
	margin-top:-2px;
	margin-bottom:-2px;
}

#blockBreakerAreaFrame .stage-panel-frame-corner.is-left,
#blockBreakerAreaFrame .stage-panel-frame-side.is-left{
	flex:0 0 var(--stage-panel-left);
	width:var(--stage-panel-left);
}

#blockBreakerAreaFrame .stage-panel-frame-corner.is-right,
#blockBreakerAreaFrame .stage-panel-frame-side.is-right{
	flex:0 0 var(--stage-panel-right);
	width:var(--stage-panel-right);
}

#blockBreakerAreaFrame .stage-panel-frame-corner{
	height:100%;
}

#blockBreakerAreaFrame .stage-panel-frame-side{
	height:auto;
	align-self:stretch;
}

#blockBreakerAreaFrame .stage-panel-frame-center{
	position:relative;
	flex:1 1 auto;
	min-width:0;
	min-height:0;
}

#blockBreakerAreaFrame .stage-panel-frame-center > .stage-panel-frame-image{
	width:100%;
	height:100%;
}

#blockBreakerAreaFrame .stage-panel-info-frame{
	position:absolute;
	z-index:1;
	left:0;
	top:0;
	display:flex;
	flex-direction:column;
	width:100%;
	height:100%;
	pointer-events:none;
}

#blockBreakerAreaFrame .stage-panel-info-frame-row{
	display:flex;
	width:100%;
	overflow:hidden;
}

#blockBreakerAreaFrame .stage-panel-info-frame-image{
	display:block;
	pointer-events:none;
	-webkit-user-drag:none;
	user-drag:none;
}

#blockBreakerAreaFrame .stage-panel-info-frame-top{
	position:relative;
	z-index:2;
	flex:0 0 var(--stage-panel-info-top);
	height:var(--stage-panel-info-top);
	margin-bottom:calc(-1 * var(--stage-panel-info-overlap));
}

#blockBreakerAreaFrame .stage-panel-info-frame-bottom{
	position:relative;
	z-index:2;
	flex:0 0 var(--stage-panel-info-bottom);
	height:var(--stage-panel-info-bottom);
	margin-top:calc(-1 * var(--stage-panel-info-overlap));
}

#blockBreakerAreaFrame .stage-panel-info-frame-middle{
	position:relative;
	z-index:1;
	flex:1 1 auto;
	min-height:0;
	margin-top:calc(-1 * var(--stage-panel-info-overlap));
	margin-bottom:calc(-1 * var(--stage-panel-info-overlap));
}

#blockBreakerAreaFrame .stage-panel-info-frame-corner.is-left,
#blockBreakerAreaFrame .stage-panel-info-frame-side.is-left{
	flex:0 0 var(--stage-panel-info-left);
	width:var(--stage-panel-info-left);
	margin-right:calc(-1 * var(--stage-panel-info-overlap));
}

#blockBreakerAreaFrame .stage-panel-info-frame-corner.is-right,
#blockBreakerAreaFrame .stage-panel-info-frame-side.is-right{
	flex:0 0 var(--stage-panel-info-right);
	width:var(--stage-panel-info-right);
	margin-left:calc(-1 * var(--stage-panel-info-overlap));
}

#blockBreakerAreaFrame .stage-panel-info-frame-corner{
	height:100%;
}

#blockBreakerAreaFrame .stage-panel-info-frame-side{
	height:auto;
	align-self:stretch;
}

#blockBreakerAreaFrame .stage-panel-info-frame-center{
	position:relative;
	flex:1 1 auto;
	min-width:0;
	min-height:0;
}

#blockBreakerAreaFrame .stage-panel-info-frame-center > .stage-panel-info-frame-image{
	width:100%;
	height:100%;
}

#blockBreakerAreaFrame .area-creatorworks-area{
	position:relative;
	width:100%;
	height:100%;
	min-width:0;
	min-height:0;
	overflow:hidden;
	padding:0;
	background:#eadfcd;
	isolation:isolate;
	container-type:size;
	container-name:area-creatorworks;
}

#blockBreakerAreaFrame .area-creatorworks-area::before{
	content:"";
	position:absolute;
	z-index:0;
	left:50%;
	top:50%;
	display:block;
	width:100cqh;
	height:100cqw;
	background-image:var(--area-creatorworks-background-image);
	background-position:center center;
	background-repeat:no-repeat;
	background-size:cover;
	transform:translate(-50%,-50%) rotate(-90deg);
	transform-origin:center center;
	pointer-events:none;
}

#blockBreakerAreaFrame .area-creatorworks-slider{
	position:absolute;
	z-index:1;
	inset:0;
	overflow:hidden;
	touch-action:pan-y;
}

#blockBreakerAreaFrame .area-creatorworks-track{
	position:absolute;
	inset:0;
	display:flex;
	width:500%;
	height:100%;
	transform:translate3d(-20%,0,0);
	transition:transform 0.2s ease-in-out;
	will-change:transform;
}

#blockBreakerAreaFrame .area-creatorworks-track.is-dragging,
#blockBreakerAreaFrame .area-creatorworks-track.is-transition-disabled{
	transition:none;
}

#blockBreakerAreaFrame .area-creatorworks-table{
	position:relative;
	display:table;
	flex:0 0 20%;
	width:20%;
	height:100cqh;
	min-width:20%;
	max-width:20%;
	max-height:100cqh;
	overflow:hidden;
	border:0;
	border-collapse:collapse;
	border-spacing:0;
	table-layout:fixed;
	background:transparent;
}

#blockBreakerAreaFrame .area-creatorworks-table > tbody,
#blockBreakerAreaFrame .area-creatorworks-table > tbody > tr{
	width:100cqw;
	height:100cqh;
	max-height:100cqh;
	overflow:hidden;
}

#blockBreakerAreaFrame .area-creatorworks-visual-cell,
#blockBreakerAreaFrame .area-creatorworks-information-cell{
	position:relative;
	height:100cqh;
	max-height:100cqh;
	overflow:hidden;
	border:0;
	padding:0;
	vertical-align:middle;
}

#blockBreakerAreaFrame .area-creatorworks-visual-cell{
	width:calc(147.555556cqh + 5cqw);
	min-width:calc(147.555556cqh + 5cqw);
	max-width:calc(147.555556cqh + 5cqw);
	white-space:nowrap;
}

#blockBreakerAreaFrame .area-creatorworks-visual{
	position:absolute;
	inset:0;
	display:flex;
	align-items:center;
	justify-content:flex-start;
	width:100%;
	height:100cqh;
	max-height:100cqh;
	overflow:hidden;
	box-sizing:border-box;
	padding:0 0 0 5cqw;
}

/* 最上位FANZA広告。3素材を広告面の等幅3列へ固定する。 */
#blockBreakerAreaFrame .area-creatorworks-table.is-featured-triple .area-creatorworks-visual-cell{
	width:100cqw;
	min-width:100cqw;
	max-width:100cqw;
}

#blockBreakerAreaFrame .area-creatorworks-table.is-featured-triple .area-creatorworks-featured-grid{
	display:grid;
	grid-template-columns:repeat(3,minmax(0,1fr));
	column-gap:1.5cqw;
	align-items:center;
	justify-items:stretch;
	width:100%;
	height:100cqh;
	padding:0 3cqw;
}

#blockBreakerAreaFrame .area-creatorworks-featured-link{
	position:relative;
	display:flex;
	align-items:center;
	justify-content:center;
	width:100%;
	min-width:0;
	height:80cqh;
	margin:0;
	padding:0;
	overflow:hidden;
	text-decoration:none;
	outline:none;
	cursor:pointer;
	transform:translateZ(0);
}

#blockBreakerAreaFrame .area-creatorworks-featured-link::after{
	content:"";
	position:absolute;
	z-index:2;
	top:-35%;
	bottom:-35%;
	left:-42%;
	width:26%;
	background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,0.48),rgba(255,255,255,0));
	transform:skewX(-18deg) translate3d(-180%,0,0);
	opacity:0;
	pointer-events:none;
}

#blockBreakerAreaFrame .area-creatorworks-featured-image{
	display:block;
	width:100%;
	height:100%;
	max-width:100%;
	max-height:100%;
	margin:0;
	padding:0;
	border:0;
	object-fit:contain;
	user-select:none;
	-webkit-user-select:none;
	-webkit-user-drag:none;
	transform:scale(1) translateZ(0);
	transform-origin:center center;
	transition:transform 0.55s cubic-bezier(0.22,1,0.36,1),filter 0.55s cubic-bezier(0.22,1,0.36,1);
}

@media (hover:hover) and (pointer:fine){
	#blockBreakerAreaFrame .area-creatorworks-featured-link:hover .area-creatorworks-featured-image,
	#blockBreakerAreaFrame .area-creatorworks-featured-link:focus-visible .area-creatorworks-featured-image{
		transform:scale(1.035) translate3d(0,-0.7cqh,0);
		filter:brightness(1.08) saturate(1.06) drop-shadow(0 0.8cqh 0.8cqh rgba(68,8,5,0.28));
	}

	#blockBreakerAreaFrame .area-creatorworks-featured-link:hover::after,
	#blockBreakerAreaFrame .area-creatorworks-featured-link:focus-visible::after{
		opacity:1;
		animation:areaCreatorWorksThumbnailShine 0.85s cubic-bezier(0.22,1,0.36,1) both;
	}
}

#blockBreakerAreaFrame .area-creatorworks-featured-link:active .area-creatorworks-featured-image{
	transform:scale(0.96) translateZ(0);
	filter:brightness(0.96);
	transition-duration:0.08s;
}

#blockBreakerAreaFrame .area-creatorworks-track.is-dragging .area-creatorworks-featured-image{
	transform:scale(1) translateZ(0);
	filter:none;
}

#blockBreakerAreaFrame .area-creatorworks-main-link{
	position:relative;
	display:block;
	flex:0 0 auto;
	width:147.555556cqh;
	height:83cqh;
	max-width:147.555556cqh;
	max-height:83cqh;
	margin:0;
	padding:0;
	border:0;
	background:transparent;
	color:inherit;
	font:inherit;
	text-decoration:none;
	outline:none;
	overflow:hidden;
	cursor:pointer;
	transform:translateZ(0);
}

#blockBreakerAreaFrame .area-creatorworks-main-link::after{
	content:"";
	position:absolute;
	z-index:2;
	top:-35%;
	bottom:-35%;
	left:-42%;
	width:26%;
	background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,0.48),rgba(255,255,255,0));
	transform:skewX(-18deg) translate3d(-180%,0,0);
	opacity:0;
	pointer-events:none;
}

#blockBreakerAreaFrame .area-creatorworks-table[data-creatorworks-clone]{
	pointer-events:none;
}

#blockBreakerAreaFrame .area-creatorworks-main-image{
	display:block;
	flex:0 0 auto;
	width:147.555556cqh;
	height:83cqh;
	max-width:147.555556cqh;
	max-height:83cqh;
	aspect-ratio:16 / 9;
	object-fit:contain;
	overflow:hidden;
	user-select:none;
	-webkit-user-select:none;
	-webkit-user-drag:none;
	transform:scale(1) translateZ(0);
	transform-origin:center center;
	transition:transform 0.55s cubic-bezier(0.22,1,0.36,1),filter 0.55s cubic-bezier(0.22,1,0.36,1);
}

@media (hover:hover) and (pointer:fine){
	#blockBreakerAreaFrame .area-creatorworks-main-link:hover .area-creatorworks-main-image,
	#blockBreakerAreaFrame .area-creatorworks-main-link:focus-visible .area-creatorworks-main-image{
		transform:scale(1.035) translate3d(0,-0.7cqh,0);
		filter:brightness(1.08) saturate(1.06) drop-shadow(0 0.8cqh 0.8cqh rgba(68,8,5,0.28));
	}

	#blockBreakerAreaFrame .area-creatorworks-main-link:hover::after,
	#blockBreakerAreaFrame .area-creatorworks-main-link:focus-visible::after{
		opacity:1;
		animation:areaCreatorWorksThumbnailShine 0.85s cubic-bezier(0.22,1,0.36,1) both;
	}
}

#blockBreakerAreaFrame .area-creatorworks-track.is-dragging .area-creatorworks-main-image{
	transform:scale(1) translateZ(0);
	filter:none;
}

@keyframes areaCreatorWorksThumbnailShine{
	0%{transform:skewX(-18deg) translate3d(-180%,0,0);}
	100%{transform:skewX(-18deg) translate3d(650%,0,0);}
}

#blockBreakerAreaFrame .area-creatorworks-information-cell{
	width:auto;
}

#blockBreakerAreaFrame .area-creatorworks-information{
	position:absolute;
	inset:0;
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	width:100%;
	height:100cqh;
	max-height:100cqh;
	overflow:hidden;
	box-sizing:border-box;
	padding:0 5cqw 0 3cqw;
}

#blockBreakerAreaFrame .area-creatorworks-heading{
	width:100%;
	white-space:nowrap;
	margin:0 0 1.5cqw 0;
	padding:0.55cqw 1.2cqw 0.65cqw 1.2cqw;
	border:0.16cqw solid rgba(255,211,128,0.96);
	border-radius:0.8cqw;
	box-sizing:border-box;
	background:
		linear-gradient(180deg,rgba(142,64,20,0.94),rgba(73,25,8,0.94));
	color:#fff0bd;
	font-family:'serifgoti';
	font-size:3cqw;
	font-weight:900;
	line-height:1.18;
	letter-spacing:0.04em;
	text-align:center;
	text-shadow:
		0 0.18cqw 0.08cqw #3a1204,
		0 0 0.55cqw rgba(255,147,46,0.8);
	box-shadow:
		inset 0 0 0 0.12cqw rgba(255,247,198,0.25),
		inset 0 0.35cqw 0.75cqw rgba(255,171,65,0.18),
		0 0.24cqw 0.5cqw rgba(47,12,0,0.55),
		0 0 0.8cqw rgba(255,128,34,0.32);
}

#blockBreakerAreaFrame .area-creatorworks-heading span{
	font-family:popinfo;
	margin-right:0.3em;
}

#blockBreakerAreaFrame .area-creatorworks-heading.is-goods{
	font-size:3cqw;
	letter-spacing:0.02em;
}

#blockBreakerAreaFrame .area-creatorworks-buttons{
	display:flex;
	align-items:center;
	justify-content:center;
	gap:6.5%;
	width:100%;
	margin:0;
	padding:0;
}

#blockBreakerAreaFrame .area-creatorworks-button{
	display:block;
	flex:0 0 40%;
	width:40%;
	max-width:40%;
	margin:0;
	padding:0;
	transition:transform 0.16s ease,filter 0.16s ease;
}

#blockBreakerAreaFrame .area-creatorworks-buttons.is-count-3{
	gap:3.5%;
}

#blockBreakerAreaFrame .area-creatorworks-buttons.is-count-3 .area-creatorworks-button{
	flex-basis:29%;
	width:29%;
	max-width:29%;
}

#blockBreakerAreaFrame .area-creatorworks-buttons.is-count-1{
	gap:0;
}

#blockBreakerAreaFrame .area-creatorworks-buttons.is-count-0,
#blockBreakerAreaFrame .area-creatorworks-buttons[hidden]{
	display:none;
}

#blockBreakerAreaFrame .area-creatorworks-button > img{
	display:block;
	width:100%;
	height:auto;
	user-select:none;
	-webkit-user-select:none;
	-webkit-user-drag:none;
}

@media (hover:hover) and (pointer:fine){
	#blockBreakerAreaFrame .area-creatorworks-button:hover{
		transform:scale(1.08);
		filter:brightness(1.12);
	}
}

#blockBreakerAreaFrame .area-creatorworks-button:active{
	transform:scale(0.96);
}

#blockBreakerAreaFrame .area-creatorworks-frame{
	position:absolute;
	z-index:2;
	left:0;
	top:0;
	display:flex;
	flex-direction:column;
	width:100%;
	height:100%;
	pointer-events:none;
	user-select:none;
	-webkit-user-select:none;
}

#blockBreakerAreaFrame .area-creatorworks-frame-row{
	display:flex;
	width:100%;
	min-width:0;
	overflow:hidden;
}

#blockBreakerAreaFrame .area-creatorworks-frame-image{
	display:block;
	pointer-events:none;
	user-select:none;
	-webkit-user-drag:none;
	-webkit-touch-callout:none;
}

#blockBreakerAreaFrame .area-creatorworks-frame-top{
	position:relative;
	z-index:1;
	flex:0 0 7.931246cqw;
	height:7.931246cqw;
	margin-bottom:-2px;
}

#blockBreakerAreaFrame .area-creatorworks-frame-bottom{
	position:relative;
	z-index:1;
	flex:0 0 7.931246cqw;
	height:7.931246cqw;
	margin-top:-2px;
}

#blockBreakerAreaFrame .area-creatorworks-frame-top > .area-creatorworks-frame-corner,
#blockBreakerAreaFrame .area-creatorworks-frame-bottom > .area-creatorworks-frame-corner{
	flex:0 0 7.722529cqw;
	width:7.722529cqw;
	height:100%;
}

#blockBreakerAreaFrame .area-creatorworks-frame-top > .area-creatorworks-frame-corner:first-child,
#blockBreakerAreaFrame .area-creatorworks-frame-bottom > .area-creatorworks-frame-corner:first-child{
	margin-right:-2px;
}

#blockBreakerAreaFrame .area-creatorworks-frame-top > .area-creatorworks-frame-corner:last-child,
#blockBreakerAreaFrame .area-creatorworks-frame-bottom > .area-creatorworks-frame-corner:last-child{
	margin-left:-2px;
}

#blockBreakerAreaFrame .area-creatorworks-frame-top-center,
#blockBreakerAreaFrame .area-creatorworks-frame-bottom-center{
	position:relative;
	flex:1 1 auto;
	min-width:0;
	height:100%;
}

#blockBreakerAreaFrame .area-creatorworks-frame-top-center > .area-creatorworks-frame-image,
#blockBreakerAreaFrame .area-creatorworks-frame-bottom-center > .area-creatorworks-frame-image{
	width:100%;
	height:100%;
}

#blockBreakerAreaFrame .area-creatorworks-navigation{
	position:absolute;
	z-index:2;
	left:50%;
	bottom:0;
	display:flex;
	align-items:center;
	justify-content:center;
	gap:0.740741cqw;
	width:max-content;
	margin:0;
	padding:0;
	transform:translateX(-50%);
	pointer-events:none;
	-webkit-user-select:none;
	user-select:none;
	white-space:nowrap;
}

#blockBreakerAreaFrame .area-creatorworks-navigation-dot{
	display:block;
	width:1.296296cqw;
	height:1.296296cqw;
	border:0.185185cqw solid rgba(59,31,18,0.78);
	border-radius:50%;
	background:rgba(255,248,225,0.68);
	box-shadow:0 0.185185cqw 0.37037cqw rgba(0,0,0,0.42);
}

#blockBreakerAreaFrame .area-creatorworks-navigation-dot.is-active{
	background:#53291a;
	box-shadow:
		0 0.185185cqw 0.37037cqw rgba(0,0,0,0.42),
		0 0 0.555556cqw rgba(255,244,197,0.68);
}

#blockBreakerAreaFrame .area-creatorworks-frame-middle{
	position:relative;
	z-index:0;
	flex:1 1 auto;
	min-height:0;
	margin-top:-2px;
	margin-bottom:-2px;
}

#blockBreakerAreaFrame .area-creatorworks-frame-middle > .area-creatorworks-frame-side{
	flex:0 0 7.722529cqw;
	width:7.722529cqw;
	height:100%;
}

#blockBreakerAreaFrame .area-creatorworks-frame-middle > .area-creatorworks-frame-side:first-child{
	margin-right:-2px;
}

#blockBreakerAreaFrame .area-creatorworks-frame-middle > .area-creatorworks-frame-side:last-child{
	margin-left:-2px;
}

#blockBreakerAreaFrame .area-creatorworks-frame-middle-center{
	position:relative;
	flex:1 1 auto;
	min-width:0;
	min-height:0;
}

#blockBreakerAreaFrame .area-creatorworks-frame-fill{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}

/*==================================================================================================
  ステージパネル PC hover オーラ
  マウス操作できるPCだけで有効。スマートフォン・タブレットでは生成しない。
==================================================================================================*/
@media (hover:hover) and (pointer:fine){
	#blockBreakerAreaFrame .stage-panel{
		transform-origin:left 70%;
		transform-style:preserve-3d;
		transition:
			transform 0.28s cubic-bezier(0.2,0.8,0.2,1),
			filter 0.22s ease;
		will-change:transform;
	}

	#blockBreakerAreaFrame .stage-panel:not(.is-coming-soon):hover{
		z-index:20;
		transform:
			perspective(90cqw)
			rotateY(9deg)
			rotateX(3deg)
			scale(1.2);
	}

	#blockBreakerAreaFrame .stage-panel::before,
#blockBreakerAreaFrame .stage-panel::after{
		content:"";
		position:absolute;
		z-index:0;
		inset:-6.3cqw;
		border-radius:14%;
		opacity:0;
		pointer-events:none;
		transform:translate3d(0,0,0) scale(0.9);
		transition:opacity 0.22s ease;
	}

	#blockBreakerAreaFrame .stage-panel::before{
		background:
			radial-gradient(ellipse at 8% 24%,rgba(224,255,131,1) 0%,rgba(143,255,82,0.86) 20%,rgba(116,255,67,0.34) 40%,transparent 64%),
			radial-gradient(ellipse at 92% 31%,rgba(255,241,142,1) 0%,rgba(238,255,132,0.78) 22%,rgba(194,255,95,0.3) 43%,transparent 66%),
			radial-gradient(ellipse at 46% 103%,rgba(150,255,105,0.98) 0%,rgba(211,255,126,0.7) 24%,rgba(139,255,82,0.25) 44%,transparent 68%),
			radial-gradient(ellipse at 52% -8%,rgba(255,239,128,0.82) 0%,rgba(189,255,101,0.34) 34%,transparent 66%);
		filter:blur(3.8cqw);
	}

	#blockBreakerAreaFrame .stage-panel::after{
		inset:-8.4cqw;
		background:
			radial-gradient(ellipse at 18% 80%,rgba(255,247,165,0.92) 0%,rgba(255,223,88,0.48) 28%,transparent 65%),
			radial-gradient(ellipse at 78% 12%,rgba(190,255,124,0.96) 0%,rgba(115,255,73,0.42) 27%,transparent 64%),
			radial-gradient(ellipse at 55% 58%,rgba(255,234,113,0.52) 0%,rgba(169,255,91,0.24) 38%,transparent 72%);
		filter:blur(5.4cqw);
	}

	#blockBreakerAreaFrame .stage-panel:not(.is-coming-soon):hover::before{
		opacity:1;
		animation:stagePanelAuraDrift 3.2s ease-in-out infinite alternate;
	}

	#blockBreakerAreaFrame .stage-panel:not(.is-coming-soon):hover::after{
		opacity:0.82;
		animation:stagePanelAuraDriftReverse 4.4s ease-in-out infinite alternate;
	}

	/*
	 * クリック成立後は読込ロックによりpointer-events:noneとなり、:hoverが外れる。
	 * 回転終了後の選択済みパネルだけ、クラスでPC hover状態を維持する。
	 */
	body.is-stage-load-locked #blockBreakerAreaFrame .stage-panel.is-stage-load-selected:not(.is-coming-soon):not(.is-stage-click-flipping){
		z-index:20;
		transform:
			perspective(90cqw)
			rotateY(9deg)
			rotateX(3deg)
			scale(1.2);
	}

	body.is-stage-load-locked #blockBreakerAreaFrame .stage-panel.is-stage-load-selected:not(.is-coming-soon):not(.is-stage-click-flipping) .stage-panel-content::before{
		opacity:0.2;
	}

	body.is-stage-load-locked #blockBreakerAreaFrame .stage-panel.is-stage-load-selected:not(.is-coming-soon):not(.is-stage-click-flipping)::before{
		opacity:1;
		animation:stagePanelAuraDrift 3.2s ease-in-out infinite alternate;
	}

	body.is-stage-load-locked #blockBreakerAreaFrame .stage-panel.is-stage-load-selected:not(.is-coming-soon):not(.is-stage-click-flipping)::after{
		opacity:0.82;
		animation:stagePanelAuraDriftReverse 4.4s ease-in-out infinite alternate;
	}
}


/*==================================================================================================
  ステージパネル タッチ選択時のPC hover再現
  タップ成立後からゲーム画面へスライドアウトするまで有効。
==================================================================================================*/
@media (hover:none), (pointer:coarse){
	#blockBreakerAreaFrame .stage-panel{
		transform-origin:left 70%;
		transform-style:preserve-3d;
		transition:
			transform 0.28s cubic-bezier(0.2,0.8,0.2,1),
			filter 0.22s ease;
		will-change:transform;
	}

	#blockBreakerAreaFrame .stage-panel.is-touch-stage-opening{
		z-index:20;
		transform:
			perspective(90cqw)
			rotateY(9deg)
			rotateX(3deg)
			scale(1.2);
	}

	html.is-area-stage-mobile #blockBreakerAreaFrame .stage-panel.is-touch-stage-opening{
		transition:
			transform 1.5s cubic-bezier(0.2,0.8,0.2,1),
			filter 0.22s ease;
	}

	#blockBreakerAreaFrame .stage-panel.is-touch-stage-opening::before,
#blockBreakerAreaFrame .stage-panel.is-touch-stage-opening::after{
		content:"";
		position:absolute;
		z-index:0;
		inset:-6.3cqw;
		border-radius:14%;
		opacity:0;
		pointer-events:none;
		transform:translate3d(0,0,0) scale(0.9);
		transition:opacity 0.22s ease;
	}

	#blockBreakerAreaFrame .stage-panel.is-touch-stage-opening::before{
		background:
			radial-gradient(ellipse at 8% 24%,rgba(224,255,131,1) 0%,rgba(143,255,82,0.86) 20%,rgba(116,255,67,0.34) 40%,transparent 64%),
			radial-gradient(ellipse at 92% 31%,rgba(255,241,142,1) 0%,rgba(238,255,132,0.78) 22%,rgba(194,255,95,0.3) 43%,transparent 66%),
			radial-gradient(ellipse at 46% 103%,rgba(150,255,105,0.98) 0%,rgba(211,255,126,0.7) 24%,rgba(139,255,82,0.25) 44%,transparent 68%),
			radial-gradient(ellipse at 52% -8%,rgba(255,239,128,0.82) 0%,rgba(189,255,101,0.34) 34%,transparent 66%);
		filter:blur(3.8cqw);
		opacity:1;
		animation:stagePanelAuraDrift 3.2s ease-in-out infinite alternate;
	}

	#blockBreakerAreaFrame .stage-panel.is-touch-stage-opening::after{
		inset:-8.4cqw;
		background:
			radial-gradient(ellipse at 18% 80%,rgba(255,247,165,0.92) 0%,rgba(255,223,88,0.48) 28%,transparent 65%),
			radial-gradient(ellipse at 78% 12%,rgba(190,255,124,0.96) 0%,rgba(115,255,73,0.42) 27%,transparent 64%),
			radial-gradient(ellipse at 55% 58%,rgba(255,234,113,0.52) 0%,rgba(169,255,91,0.24) 38%,transparent 72%);
		filter:blur(5.4cqw);
		opacity:0.82;
		animation:stagePanelAuraDriftReverse 4.4s ease-in-out infinite alternate;
	}
}


/*==================================================================================================
  並べ替え方向ガイド
==================================================================================================*/
#blockBreakerAreaFrame .area-stage-sort-guide{
	position:absolute;
	z-index:130;
	right:0;
	top:62.682039%;
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	width:8.05cqw;
	min-height:28cqw;
	max-height:43.8cqw;
	padding:4.8cqw 0.455cqw 5.2cqw;
	overflow:hidden;
	border:0.185185cqw solid rgba(0,0,0,0.96);
	border-right:0;
	border-radius:1.75cqw 0 0 1.75cqw;
	background:rgba(0,0,0,0.5);
	box-shadow:0 0.28cqw 0.65cqw rgba(0,0,0,0.34);
	opacity:0;
	transform:translateY(-50%);
	pointer-events:none;
}

#blockBreakerAreaFrame .area-stage-sort-guide.is-visible{
	animation:areaStageSortGuideFade 1.3s linear 1 both;
}

#blockBreakerAreaFrame .area-stage-sort-guide-text{
	display:block;
	min-width:1em;
	margin:0;
	color:#ddd;
	font-family:bird,ruika9,"Yu Gothic UI","Yu Gothic",Meiryo,sans-serif;
	font-size:3.498cqw;
	font-weight:900;
	line-height:1;
	letter-spacing:0.12em;
	white-space:nowrap;
	writing-mode:vertical-rl;
	-webkit-writing-mode:vertical-rl;
	text-orientation:upright;
	-webkit-text-orientation:upright;
	-webkit-text-stroke:0.1em #000;
	paint-order:stroke fill;
	text-shadow:
		-0.06em -0.06em 0 #000,
		0.06em -0.06em 0 #000,
		-0.06em 0.06em 0 #000,
		0.06em 0.06em 0 #000;
}

#blockBreakerAreaFrame .area-stage-sort-guide-arrow{
	position:relative;
	display:block;
	flex:0 0 auto;
	width:2em;
	height:6.42em;
	margin-top:0.45em;
	font-size:2.65cqw;
	filter:
		drop-shadow(-0.07em 0 0 #000)
		drop-shadow(0.07em 0 0 #000)
		drop-shadow(0 -0.07em 0 #000)
		drop-shadow(0 0.07em 0 #000);
}

#blockBreakerAreaFrame .area-stage-sort-guide-arrow::before{
	content:"";
	position:absolute;
	left:50%;
	top:0;
	width:0.16em;
	height:5.47em;
	border-radius:999px;
	background:#ddd;
	transform:translateX(-50%);
}

#blockBreakerAreaFrame .area-stage-sort-guide-arrow::after{
	content:"";
	position:absolute;
	left:50%;
	bottom:0;
	width:1.2em;
	height:1.15em;
	background:#ddd;
	clip-path:polygon(0 0,100% 0,50% 100%);
	-webkit-clip-path:polygon(0 0,100% 0,50% 100%);
	transform:translateX(-50%);
}

@keyframes areaStageSortGuideFade{
	0%{opacity:0;}
	15.384615%{opacity:1;}
	84.615385%{opacity:1;}
	100%{opacity:0;}
}

/*==================================================================================================
  並べ替え成立時のステージパネル再登場
==================================================================================================*/
#blockBreakerAreaFrame .stage-panel.is-sort-entering-from-bottom{
	/* ステージ順：パネル本体ではなく、外側フレームを含む見た目上の右上角を支点にする。 */
	-webkit-transform-origin:
		calc(100% + var(--stage-panel-overhang))
		var(--stage-panel-overhang-negative);
	transform-origin:
		calc(100% + var(--stage-panel-overhang))
		var(--stage-panel-overhang-negative);
	transform-box:border-box;
	animation:areaStagePanelSortEnterFromBottom 1s cubic-bezier(0.22,0.72,0.18,1) 1 both;
	pointer-events:none;
}

#blockBreakerAreaFrame .stage-panel.is-sort-entering-from-top{
	transform-origin:right bottom;
	animation:areaStagePanelSortEnterFromTop 1s cubic-bezier(0.22,0.72,0.18,1) 1 both;
	pointer-events:none;
}

/* ステージ順：見た目上の右上角を支点に、反時計回り15degから正位置へ戻す。 */
@keyframes areaStagePanelSortEnterFromBottom{
	0%{opacity:0;transform:translate3d(0,50%,0) rotate(-15deg);}
	100%{opacity:1;transform:translate3d(0,0,0) rotate(0deg);}
}

/* 上から下へ進むパネルは右下を支点に反時計回り15degから正位置へ戻す。 */
@keyframes areaStagePanelSortEnterFromTop{
	0%{opacity:0;transform:translate3d(0,-50%,0) rotate(-15deg);}
	100%{opacity:1;transform:translate3d(0,0,0) rotate(0deg);}
}

/*==================================================================================================
  ステージパネル クリック成立時の縦軸1回転
==================================================================================================*/
#blockBreakerAreaFrame .stage-panel.is-stage-click-flipping{
	z-index:30;
	transform-origin:center center;
	animation:stagePanelClickFlipVertical 0.62s cubic-bezier(0.2,0.72,0.18,1) 1 both;
	pointer-events:none;
}

@keyframes stagePanelClickFlipVertical{
	0%{
		transform:
			perspective(90cqw)
			rotateY(9deg)
			rotateX(3deg)
			scale(1.2);
	}
	24%{
		transform:
			perspective(90cqw)
			rotateY(90deg)
			rotateX(1deg)
			scale(1.15);
	}
	50%{
		transform:
			perspective(90cqw)
			rotateY(183deg)
			rotateX(0deg)
			scale(1.12);
	}
	76%{
		transform:
			perspective(90cqw)
			rotateY(276deg)
			rotateX(-1deg)
			scale(1.15);
	}
	100%{
		transform:
			perspective(90cqw)
			rotateY(369deg)
			rotateX(3deg)
			scale(1.2);
	}
}

@keyframes stagePanelAuraDrift{
	0%{transform:translate3d(-2.6%,2.2%,0) scale(0.9) rotate(-2deg);}
	48%{transform:translate3d(2.8%,-3.2%,0) scale(1.13) rotate(2.4deg);}
	100%{transform:translate3d(-0.8%,-1.8%,0) scale(0.98) rotate(-0.8deg);}
}

@keyframes stagePanelAuraDriftReverse{
	0%{transform:translate3d(2.4%,-2.1%,0) scale(1.1) rotate(1.8deg);}
	52%{transform:translate3d(-3.2%,3%,0) scale(0.88) rotate(-2.6deg);}
	100%{transform:translate3d(1%,1.4%,0) scale(1.05) rotate(0.7deg);}
}

@media (prefers-reduced-motion:reduce){
	#blockBreakerAreaFrame .stage-panel:not(.is-coming-soon):hover::before,
#blockBreakerAreaFrame .stage-panel:not(.is-coming-soon):hover::after,
#blockBreakerAreaFrame .stage-panel.is-touch-stage-opening::before,
#blockBreakerAreaFrame .stage-panel.is-touch-stage-opening::after{
		animation:none;
	}

	#blockBreakerAreaFrame .stage-panel.is-stage-click-flipping{
		animation-duration:0.01ms;
	}
}


body.is-area-frame-inactive #blockBreakerAreaFrame .area-creatorworks-track{
	transition:none !important;
	will-change:auto;
}

/*==================================================================================================
  非表示area iframeのステージパネル演出停止

  親がゲーム画面へ切り替えた後は、ポインターの:hover状態がブラウザ内部に残っても、
  stagePanelAuraDrift系の無限アニメーションを生成・進行させない。
==================================================================================================*/
body.is-area-frame-inactive #blockBreakerAreaFrame .stage-panel::before,
body.is-area-frame-inactive #blockBreakerAreaFrame .stage-panel::after{
	opacity:0 !important;
	animation:none !important;
	transition:none !important;
}

/*==================================================================================================
  ステージ読込中の操作ロック
  選択済みパネルの回転演出だけを残し、他パネル・ランキング・ページ移動を無効化する。
==================================================================================================*/
body.is-stage-load-locked #blockBreakerAreaFrame .stage-panel,
body.is-stage-load-locked #blockBreakerAreaFrame .stage-panel-ranking-button-wrap,
body.is-stage-load-locked #blockBreakerAreaFrame .area-ranking-button-wrap{
	pointer-events:none;
}

body.is-stage-load-locked #blockBreakerAreaFrame .stage-panel:not(.is-stage-load-selected) .stage-panel-content::before{
	opacity:0;
}

@media (hover:hover) and (pointer:fine){
	body.is-stage-load-locked #blockBreakerAreaFrame .stage-panel:not(.is-coming-soon):not(.is-stage-load-selected):hover{
		z-index:auto;
		transform:none;
		filter:none;
	}

	body.is-stage-load-locked #blockBreakerAreaFrame .stage-panel:not(.is-coming-soon):not(.is-stage-load-selected):hover::before,
body.is-stage-load-locked #blockBreakerAreaFrame .stage-panel:not(.is-coming-soon):not(.is-stage-load-selected):hover::after{
		opacity:0;
		animation:none;
	}

	body.is-stage-load-locked #blockBreakerAreaFrame .stage-panel-ranking-button-wrap:has(> .stage-panel-ranking-button:hover),
body.is-stage-load-locked #blockBreakerAreaFrame .stage-panel-ranking-button-wrap:has(> .stage-panel-ranking-button:active){
		transform:translateX(-50%);
		filter:none;
	}
}



/* 公開済みステージがないエリアでは、ランキングボタンを確実に隠す。 */
#blockBreakerAreaFrame #areaRankingButtonWrap[hidden],
#blockBreakerAreaFrame .area-ranking-button-wrap[hidden]{
	display:none !important;
}



/* 公開済みステージがないエリアでは、位置を維持したまま準備中表示にする。 */
#blockBreakerAreaFrame #areaRankingButton:disabled{
	opacity:1;
	cursor:default;
	pointer-events:none;
}

#blockBreakerAreaFrame #areaRankingButtonWrap:has(> #areaRankingButton:disabled){
	transform:translateX(-50%);
	filter:none;
}


/*==================================================================================================
  スマートフォン：ステージ読込ロック時の視覚変化を無効化
  操作禁止（disabled／pointer-events:none）は維持し、opacityだけを変えない。
==================================================================================================*/
html.is-area-stage-mobile #blockBreakerAreaFrame .area-navigation-arrow:disabled{
	opacity:1;
	transition:transform 0.12s ease,filter 0.12s ease;
}

html.is-area-stage-mobile #blockBreakerAreaFrame .area-stage-sort-status.is-disabled,
html.is-area-stage-mobile body.is-stage-load-locked #blockBreakerAreaFrame .area-stage-sort-status{
	opacity:1;
	transition:none;
}

#blockBreakerAreaFrame .area-screen{
	width:100%;
	height:100%;
	max-width:none;
	max-height:none;
}


/*==================================================================================================
  グランド／エリアランキング2ボタン
==================================================================================================*/
@media (hover:hover) and (pointer:fine){
	#blockBreakerAreaFrame .area-ranking-buttons .area-ranking-button-wrap:has(> .stage-panel-ranking-button:hover){
		transform:translateY(-0.185185cqw);
	}

	#blockBreakerAreaFrame .area-ranking-buttons .area-ranking-button-wrap:has(> .stage-panel-ranking-button:active){
		transform:translateY(0.185185cqw);
	}
}

body.is-stage-load-locked #blockBreakerAreaFrame .area-ranking-buttons{
	pointer-events:none;
}

#blockBreakerAreaFrame #grandRankingButton:disabled,
#blockBreakerAreaFrame #areaRankingButton:disabled{
	opacity:1;
	cursor:default;
	pointer-events:none;
}

/* 2ボタン配置では旧単独ボタン用の中央寄せtransformを無効化する。 */
#blockBreakerAreaFrame .area-ranking-buttons #areaRankingButtonWrap:has(> #areaRankingButton:disabled),
#blockBreakerAreaFrame .area-ranking-buttons #grandRankingButtonWrap:has(> #grandRankingButton:disabled){
	transform:none;
	filter:none;
}


/* 縦ページドラッグ中、移動してくる別ステージパネルのhover/overを発火させない。 */
body.is-stage-page-dragging #blockBreakerAreaFrame .stage-panel,
body.is-stage-page-dragging #blockBreakerAreaFrame .stage-panel *{
	pointer-events:none !important;
}


/*==================================================================================================
  STAGE COMMENT：難易度ブロック直下アイコン
==================================================================================================*/
#blockBreakerAreaFrame .stage-panel-comment-button{
	position:absolute;
	z-index:20;
	top:11cqw;
	right:-3.2cqw;
	display:block;
	width:7.4cqw;
	height:7.4cqw;
	margin:0;
	padding:0;
	border:0;
	outline:0;
	background:transparent;
	cursor:pointer;
	transition:transform 0.12s ease,filter 0.12s ease;
	pointer-events:auto;
	touch-action:manipulation;
	will-change:transform,filter;
}

#blockBreakerAreaFrame .stage-panel-comment-icon{
	display:block;
	width:100%;
	height:100%;
	object-fit:contain;
	filter:drop-shadow(0 0.28cqw 0.28cqw rgba(0,0,0,0.55));
	pointer-events:none;
	-webkit-user-drag:none;
	user-drag:none;
}

#blockBreakerAreaFrame .stage-panel-comment-count{
	position:absolute;
	z-index:2;
	right:0.25cqw;
	bottom:-0.55cqw;
	display:block;
	width:max-content;
	max-width:10cqw;
	margin:0;
	padding:0;
	color:#fff;
	font-family:popinfo,ruika9,"Yu Gothic UI","Yu Gothic",Meiryo,sans-serif;
	font-size:2.35cqw;
	font-weight:900;
	line-height:1;
	letter-spacing:0.03em;
	white-space:nowrap;
	-webkit-text-stroke:0.12em rgb(68,8,5);
	paint-order:stroke fill;
	text-shadow:
		-1px -1px 0 rgb(68,8,5),
		 1px -1px 0 rgb(68,8,5),
		-1px  1px 0 rgb(68,8,5),
		 1px  1px 0 rgb(68,8,5);
	pointer-events:none;
}

@media (hover:hover) and (pointer:fine){
	#blockBreakerAreaFrame .stage-panel-comment-button:hover{
		transform:translateY(-0.185185cqw);
		filter:brightness(1.08);
	}
}

#blockBreakerAreaFrame .stage-panel-comment-button:active{
	transform:translateY(0.185185cqw) scale(0.96);
	filter:brightness(0.94);
}


/*==================================================================================================
  AREA_0005 ヘッダー「やさしく降り注ぐ光」Canvas
  ・AREA_0005のみ表示。固定位置の斜め光帯をopacityだけでゆっくり明滅させる。
  ・ヘッダーフレーム(z-index:10)より下、背景画像より上。
==================================================================================================*/
#blockBreakerAreaFrame .area-0005-light-rays-canvas{
	position:absolute;
	z-index:8;
	inset:0;
	display:block;
	width:100%;
	height:100%;
	margin:0;
	padding:0;
	border:0;
	background:transparent;
	/* 背景画像に対して光を明るく合成する。Canvas内部のlighterと二段構成。 */
	mix-blend-mode:screen;
	/*
	 * AREA_0005背景の右側だけへ光を出す。
	 * ユーザー指定マスク：上端 x=43.3%、下端 x=29.3% の斜め境界より右側。
	 */
	-webkit-clip-path:polygon(43.333% 0,100% 0,100% 100%,29.321% 100%);
	clip-path:polygon(43.333% 0,100% 0,100% 100%,29.321% 100%);
	pointer-events:none;
	-webkit-user-select:none;
	user-select:none;
}

#blockBreakerAreaFrame .area-0005-light-rays-canvas[hidden]{
	display:none;
}

@supports (mix-blend-mode:plus-lighter){
	#blockBreakerAreaFrame .area-0005-light-rays-canvas{
		mix-blend-mode:plus-lighter;
	}
}