/*
//=====================================================================================
*/

.capsule_page .field_box input:read-only
{
	color: var(--text_dim);
}

.capsule_page .field_chip:disabled,
.capsule_page .segment:disabled
{
	opacity: 0.45;
	cursor: default;
}

.capsule_page .field_aside .money
{
	display: inline-flex;
	align-items: center;
	gap: 4px;
	margin-left: 4px;
}

.capsule_machines
{
	grid-template-columns: repeat(3, 1fr);
}

.capsule_machine_button
{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 5px;
	height: 54px;
}

.machine_name
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-weight: 600;
	line-height: 1;
}

.machine_dot
{
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: linear-gradient(180deg, #ff8fb0 50%, #fffaf5 50%);
	box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.25);
	opacity: 0.75;
}

[data-machine="1"] .machine_dot
{
	background: linear-gradient(180deg, #f5c451 50%, #fffdf7 50%);
}

[data-machine="2"] .machine_dot
{
	background: linear-gradient(180deg, #8b5cf6 50%, #1e1340 50%);
	box-shadow: inset 0 0 0 1px rgba(240, 171, 252, 0.5);
}

.machine_top
{
	color: rgba(253, 230, 138, 0.55);
	font: 700 12.5px/1 var(--font_game);
	letter-spacing: 0.02em;
	font-variant-numeric: tabular-nums;
	transition: color 0.25s;
}

.capsule_machine_button[aria-checked="true"] .machine_top
{
	color: #fde68a;
}

.capsule_machine_button[aria-checked="true"] .machine_dot
{
	opacity: 1;
}

.capsule_counts
{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 6px;
	margin-top: 8px;
}

.capsule_counts[hidden]
{
	display: none;
}

.capsule_counts .field_chip
{
	height: 30px;
	padding: 0 4px;
}

/*
//=====================================================================================
*/

.capsule_stage
{
	gap: 10px;
}

.capsule_stage .stage_status
{
	flex: 1 0 260px;
	min-width: 0;
}

.capsule_stage .stage_label
{
	display: block;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.capsule_stage .stage_label .money,
.plate_meta .money
{
	display: inline-flex;
	align-items: center;
	gap: 3px;
	vertical-align: -2px;
}

.capsule_stage .stage_label .coin
{
	width: 13px;
	height: 13px;
}

.capsule_stage .recent_list
{
	flex: 0 1 auto;
	min-width: 0;
	max-width: 56%;
}

.capsule_confetti
{
	z-index: 7;
}

.capsule_scene
{
	position: relative;
	flex: 1 1 0;
	min-height: 150px;
}

.capsule_rig
{
	position: absolute;
	left: 50%;
	top: 50%;
	width: 1000px;
	height: 620px;
	transform: translate(-50%, -50%) scale(var(--capsule_scale, 1));
}

.capsule_dome
{
	position: absolute;
	left: 257px;
	top: 92px;
	z-index: 1;
	width: 276px;
	height: 276px;
	border-radius: 50%;
}

.capsule_machine,
.capsule_fx,
.capsule_alien
{
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	overflow: visible;
	pointer-events: none;
}

.capsule_machine
{
	z-index: 2;
}

.capsule_fx
{
	z-index: 5;
}

.capsule_alien
{
	z-index: 6;
}

.case_title
{
	fill: rgba(245, 196, 81, 0.72);
	font: 700 11px var(--font_game);
	letter-spacing: 0.34em;
}

/*
//=====================================================================================
*/

.capsule_rig .sk_band
{
	fill: url(#cm_band_classic);
}

.capsule_rig .sk_stars,
.capsule_rig .sk_sheen
{
	display: none;
}

.capsule_rig .sk_panel_a
{
	stop-color: #ff9ccb;
}

.capsule_rig .sk_panel_b
{
	stop-color: #d8448f;
}

.capsule_rig .sk_panel_c
{
	stop-color: #6e1a5e;
}

.capsule_rig .sk_lid_a
{
	stop-color: #ffb3d6;
}

.capsule_rig .sk_lid_b
{
	stop-color: #e2468f;
}

.capsule_rig .sk_lid_c
{
	stop-color: #8e1c5a;
}

.capsule_rig .sk_knob_a
{
	stop-color: #ffd0dc;
}

.capsule_rig .sk_knob_b
{
	stop-color: #ff3d6e;
}

.capsule_rig .sk_knob_c
{
	stop-color: #9c0f35;
}

.capsule_rig.is_deluxe .sk_band
{
	fill: url(#cm_band_deluxe);
}

.capsule_rig.is_deluxe .sk_sheen
{
	display: inline;
}

.capsule_rig.is_deluxe .sk_panel_a
{
	stop-color: #fffaf0;
}

.capsule_rig.is_deluxe .sk_panel_b
{
	stop-color: #e6d7b8;
}

.capsule_rig.is_deluxe .sk_panel_c
{
	stop-color: #9c8256;
}

.capsule_rig.is_deluxe .sk_lid_a
{
	stop-color: #fff1b8;
}

.capsule_rig.is_deluxe .sk_lid_b
{
	stop-color: #e2a52c;
}

.capsule_rig.is_deluxe .sk_lid_c
{
	stop-color: #8a5310;
}

.capsule_rig.is_deluxe .sk_knob_a
{
	stop-color: #ffffff;
}

.capsule_rig.is_deluxe .sk_knob_b
{
	stop-color: #efe6ff;
}

.capsule_rig.is_deluxe .sk_knob_c
{
	stop-color: #9d8fc4;
}

.capsule_rig.is_mythic .sk_band
{
	fill: url(#cm_band_mythic);
}

.capsule_rig.is_mythic .sk_stars
{
	display: inline;
}

.capsule_rig.is_mythic .sk_panel_a
{
	stop-color: #6d3fd6;
}

.capsule_rig.is_mythic .sk_panel_b
{
	stop-color: #2a0f6b;
}

.capsule_rig.is_mythic .sk_panel_c
{
	stop-color: #10042b;
}

.capsule_rig.is_mythic .sk_lid_a
{
	stop-color: #a78bfa;
}

.capsule_rig.is_mythic .sk_lid_b
{
	stop-color: #4c1d95;
}

.capsule_rig.is_mythic .sk_lid_c
{
	stop-color: #1e0b46;
}

.capsule_rig.is_mythic .sk_knob_a
{
	stop-color: #fae8ff;
}

.capsule_rig.is_mythic .sk_knob_b
{
	stop-color: #c026d3;
}

.capsule_rig.is_mythic .sk_knob_c
{
	stop-color: #4a044e;
}

.capsule_flap
{
	transform-box: fill-box;
	transform-origin: 50% 0;
	transition: transform 0.22s var(--ease);
}

.capsule_flap.is_open
{
	transform: scaleY(0.14);
}

.fx_ball .ball_body,
.fx_ball .ball_top,
.fx_ball .ball_bottom
{
	transform-box: fill-box;
	transform-origin: 50% 50%;
}

.fx_ball .ball_top
{
	transform-origin: 50% 100%;
}

.fx_ball .ball_bottom
{
	transform-origin: 50% 0;
}

/*
//=====================================================================================
*/

.capsule_topper
{
	position: absolute;
	left: 240px;
	top: 0;
	z-index: 3;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 7px;
	width: 310px;
	height: 66px;
	border-radius: 26px 26px 10px 10px;
	background: radial-gradient(ellipse 70% 80% at 50% 0%, rgba(255, 255, 255, 0.08), transparent 70%), repeating-linear-gradient(45deg, rgba(255, 255, 255, 0.02) 0 2px, transparent 2px 5px), linear-gradient(180deg, #2c1f5e 0%, #1d1438 70%, #170f30 100%);
	box-shadow: inset 0 0 0 1.5px rgba(245, 196, 81, 0.45), inset 0 0 0 7px #1d1438, inset 0 0 0 8px rgba(245, 196, 81, 0.18), inset 0 -10px 20px rgba(0, 0, 0, 0.35), 0 0 0 8px #0f0a22, 0 0 0 9px rgba(245, 196, 81, 0.12), 0 10px 24px rgba(0, 0, 0, 0.45);
}

.capsule_title
{
	padding-left: 0.34em;
	font: 700 25px/1 var(--font_game);
	letter-spacing: 0.34em;
	white-space: nowrap;
	background: linear-gradient(180deg, #fff3c4 0%, #f5c451 52%, #b7791f 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	filter: drop-shadow(0 2px 0 rgba(10, 5, 25, 0.85));
}

.capsule_subtitle
{
	display: inline-flex;
	align-items: center;
	gap: 9px;
	padding-left: 0.4em;
	color: rgba(245, 196, 81, 0.66);
	font: 700 9.5px/1 var(--font_game);
	letter-spacing: 0.4em;
	text-transform: uppercase;
	white-space: nowrap;
}

.topper_ball
{
	width: 13px;
	height: 13px;
	margin: -4px 0;
}

/*
//=====================================================================================
*/

.capsule_slot
{
	position: absolute;
	left: 685px;
	top: 189px;
	z-index: 3;
	width: 230px;
	height: 288px;
	transform-origin: 50% 89%;
}

.capsule_slot .figure_svg
{
	width: 100%;
	height: 100%;
}

.capsule_slot.is_mystery .figure_svg
{
	opacity: 0.9;
}

.slot_mark
{
	position: absolute;
	left: 50%;
	top: 82px;
	color: rgba(245, 196, 81, 0.5);
	font: 800 64px/1 var(--font_game);
	transform: translateX(-50%);
}

.capsule_tag
{
	position: absolute;
	top: 156px;
	z-index: 4;
	display: grid;
	place-items: center;
	height: 26px;
	padding: 0 11px;
	border-radius: 8px;
	font: 800 13px/1 var(--font_game);
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.capsule_tag[hidden]
{
	display: none;
}

.capsule_new
{
	left: 666px;
	color: #3b2405;
	background: linear-gradient(180deg, #fff1b8 0%, #f5c451 55%, #c98a1c 100%);
	box-shadow: 0 2px 0 #7a4608, inset 0 1px 0 rgba(255, 255, 255, 0.7);
	transform: rotate(-6deg);
}

.capsule_dupe
{
	right: 66px;
	color: #e9e3ff;
	background: rgba(15, 10, 34, 0.9);
	box-shadow: inset 0 0 0 1px rgba(245, 196, 81, 0.4);
}

.capsule_plate
{
	position: absolute;
	left: 654px;
	top: 490px;
	z-index: 4;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 5px;
	width: 292px;
	height: 92px;
	padding: 0 16px;
	text-align: center;
}

.plate_ribbon
{
	position: relative;
	display: inline-grid;
	place-items: center;
	height: 20px;
	padding: 0 14px;
	color: rgba(245, 196, 81, 0.75);
	font: 700 10.5px/1 var(--font_game);
	letter-spacing: 0.26em;
	text-transform: uppercase;
	white-space: nowrap;
}

.capsule_plate.is_figure .plate_ribbon
{
	color: #fff;
	background: linear-gradient(180deg, color-mix(in srgb, var(--tier) 80%, #fff), var(--tier) 45%, var(--tier_deep));
	clip-path: polygon(0 0, 100% 0, calc(100% - 8px) 50%, 100% 100%, 0 100%, 8px 50%);
	text-shadow: 0 1px 0 rgba(0, 0, 0, 0.45);
	padding: 0 18px;
}

.plate_name
{
	max-width: 100%;
	overflow: hidden;
	color: #fff4d6;
	font: 700 21px/1.1 var(--font_game);
	letter-spacing: 0.02em;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.plate_meta
{
	max-width: 100%;
	overflow: hidden;
	color: var(--text_dim);
	font-size: 12.5px;
	font-weight: 600;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.plate_meta .coin
{
	width: 13px;
	height: 13px;
}

/*
//=====================================================================================
*/

.figure_svg
{
	display: block;
	overflow: visible;
}

.figure_svg.is_silhouette .fig_paint
{
	fill: #1b1438;
	stroke: rgba(167, 139, 250, 0.3);
	stroke-width: 1.2;
}

.figure_svg.is_silhouette .fig_detail,
.figure_svg.is_silhouette .fig_shadow
{
	display: none;
}

/*
//=====================================================================================
*/

.capsule_alien .alien_head,
.capsule_alien .alien_lid,
.capsule_alien .alien_antenna,
.capsule_alien .alien_leg,
.capsule_alien .alien_flame,
.capsule_alien .alien_brows
{
	transform-box: fill-box;
}

.capsule_alien .alien_head
{
	transform-origin: 50% 88%;
	transition: rotate 0.35s var(--ease);
}

.capsule_alien .alien_lid
{
	transform-origin: 50% 0;
	scale: 1 0;
	transition: scale 0.2s;
}

.capsule_alien .alien_antenna_left
{
	transform-origin: 100% 100%;
}

.capsule_alien .alien_antenna_right
{
	transform-origin: 0 100%;
}

.capsule_alien .alien_leg
{
	transform-origin: 50% 0;
}

.capsule_alien .alien_flame
{
	transform-origin: 50% 0;
	transition: scale 0.2s;
}

.capsule_alien.is_thrust .alien_flame
{
	scale: 1.2 1.55;
}

.capsule_alien .alien_mouth,
.capsule_alien .alien_happy,
.capsule_alien .alien_brows,
.capsule_alien .hand_thumb
{
	display: none;
}

.capsule_alien .alien_mouth_smile
{
	display: inline;
}

.capsule_alien.is_crank .alien_mouth_smile,
.capsule_alien.is_wow .alien_mouth_smile,
.capsule_alien.is_shrug .alien_mouth_smile,
.capsule_alien.is_thumbs .alien_mouth_smile,
.capsule_alien.is_nod .alien_mouth_smile,
.capsule_alien.is_jump .alien_mouth_smile,
.capsule_alien.is_cartwheel .alien_mouth_smile
{
	display: none;
}

.capsule_alien.is_crank .alien_mouth_bite,
.capsule_alien.is_wow .alien_mouth_o,
.capsule_alien.is_shrug .alien_mouth_meh,
.capsule_alien.is_thumbs .alien_mouth_grin,
.capsule_alien.is_nod .alien_mouth_grin,
.capsule_alien.is_jump .alien_mouth_grin,
.capsule_alien.is_cartwheel .alien_mouth_grin,
.capsule_alien.is_thumbs .hand_thumb,
.capsule_alien.is_crank .alien_brows,
.capsule_alien.is_wow .alien_brows
{
	display: inline;
}

.capsule_alien.is_wow .alien_brows
{
	translate: 0 -5px;
}

.capsule_alien.is_crank .alien_lid
{
	scale: 1 0.3;
}

.capsule_alien.is_shrug .alien_lid
{
	scale: 1 0.46;
}

.capsule_alien.is_shrug .alien_head
{
	rotate: -9deg;
}

.capsule_alien.is_thumbs .alien_happy,
.capsule_alien.is_jump .alien_happy,
.capsule_alien.is_cartwheel .alien_happy
{
	display: inline;
}

.capsule_alien.is_thumbs .alien_eyes,
.capsule_alien.is_jump .alien_eyes,
.capsule_alien.is_cartwheel .alien_eyes,
.capsule_alien.is_thumbs .alien_lid,
.capsule_alien.is_jump .alien_lid,
.capsule_alien.is_cartwheel .alien_lid
{
	display: none;
}

/*
//=====================================================================================
*/

.capsule_strip
{
	position: relative;
	z-index: 3;
	display: grid;
	flex: none;
	grid-template-columns: 104px minmax(0, 1fr);
	gap: 8px;
}

.capsule_strip[hidden]
{
	display: none;
}

.capsule_album_key
{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 4px;
	min-height: 78px;
	border-radius: 12px;
	background: repeating-linear-gradient(45deg, rgba(255, 255, 255, 0.02) 0 2px, transparent 2px 5px), linear-gradient(180deg, #2a1d5c, #170f30);
	box-shadow: inset 0 0 0 1.5px rgba(245, 196, 81, 0.42), inset 0 0 0 5px #1d1438, inset 0 0 0 6px rgba(245, 196, 81, 0.14);
	transition: transform 0.2s var(--ease), box-shadow 0.2s;
}

.capsule_album_key:hover
{
	transform: translateY(-1px);
	box-shadow: inset 0 0 0 1.5px rgba(245, 196, 81, 0.7), inset 0 0 0 5px #1d1438, inset 0 0 0 6px rgba(245, 196, 81, 0.2);
}

.album_key_label
{
	padding-left: 0.3em;
	color: rgba(245, 196, 81, 0.8);
	font: 700 10.5px/1 var(--font_game);
	letter-spacing: 0.3em;
	text-transform: uppercase;
}

.album_key_count
{
	color: #fff4d6;
	font: 700 20px/1 var(--font_game);
	font-variant-numeric: tabular-nums;
}

.album_key_hint
{
	color: var(--text_mute);
	font-size: 11px;
}

.capsule_tiers
{
	display: grid;
	grid-template-columns: repeat(var(--tier_count, 6), minmax(0, 1fr));
	gap: 6px;
	min-width: 0;
}

.capsule_tier
{
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 3px;
	min-width: 0;
	min-height: 78px;
	padding: 8px 9px 8px;
	overflow: hidden;
	border-radius: 11px;
	text-align: left;
	background: linear-gradient(180deg, color-mix(in srgb, var(--tier) 15%, #15102a), #0e0a1d 80%);
	box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--tier) 32%, transparent);
	transition: transform 0.25s var(--ease), box-shadow 0.25s, background 0.25s;
}

.capsule_tier:hover
{
	box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--tier) 60%, transparent);
}

.capsule_tier.is_hit
{
	transform: translateY(-3px);
	background: linear-gradient(180deg, color-mix(in srgb, var(--tier) 32%, #15102a), #120c24 85%);
	box-shadow: inset 0 0 0 2px var(--tier), 0 6px 14px rgba(0, 0, 0, 0.35);
}

.tier_head
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	max-width: 100%;
	overflow: hidden;
}

.tier_gem
{
	flex: none;
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: linear-gradient(180deg, color-mix(in srgb, var(--tier) 70%, #fff) 50%, var(--tier_deep) 50%);
	box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3);
}

.tier_name
{
	overflow: hidden;
	color: color-mix(in srgb, var(--tier) 75%, #fff);
	font: 700 10.5px/1 var(--font_game);
	letter-spacing: 0.12em;
	text-transform: uppercase;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.tier_pay
{
	color: #fff;
	font: 700 17px/1.05 var(--font_game);
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.tier_chance
{
	color: var(--text_mute);
	font-size: 11px;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.tier_dots
{
	display: flex;
	flex-wrap: wrap;
	gap: 3px;
	margin-top: 1px;
}

.tier_dot
{
	width: 7px;
	height: 9px;
	border-radius: 4px;
	background: rgba(255, 255, 255, 0.09);
}

.tier_dot.is_got
{
	background: linear-gradient(180deg, color-mix(in srgb, var(--tier) 75%, #fff) 50%, var(--tier) 50%);
}

/*
//=====================================================================================
*/

.capsule_album
{
	position: absolute;
	left: 16px;
	right: 16px;
	top: 52px;
	bottom: 16px;
	z-index: 8;
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 12px 14px 14px;
	border-radius: 16px;
	background: repeating-linear-gradient(45deg, rgba(255, 255, 255, 0.015) 0 2px, transparent 2px 5px), linear-gradient(180deg, rgba(30, 20, 64, 0.985), rgba(16, 10, 36, 0.985));
	box-shadow: inset 0 0 0 1.5px rgba(245, 196, 81, 0.42), inset 0 0 0 7px rgba(29, 20, 56, 0.9), inset 0 0 0 8px rgba(245, 196, 81, 0.14), 0 20px 50px rgba(0, 0, 0, 0.55);
	animation: capsule_drawer 0.3s var(--ease) both;
}

.capsule_album[hidden]
{
	display: none;
}

.album_head
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 2px 4px 0 8px;
}

.album_heading
{
	display: flex;
	align-items: baseline;
	gap: 12px;
	min-width: 0;
}

.album_title
{
	padding-left: 0.2em;
	color: #f5c451;
	font: 700 15px/1 var(--font_game);
	letter-spacing: 0.24em;
	text-transform: uppercase;
	white-space: nowrap;
}

.album_note
{
	overflow: hidden;
	color: var(--text_mute);
	font-size: 12px;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.album_close
{
	display: grid;
	flex: none;
	place-items: center;
	width: 30px;
	height: 30px;
	border-radius: 9px;
	color: var(--text_dim);
	background: rgba(255, 255, 255, 0.05);
}

.album_close:hover
{
	color: #fff;
}

.album_rows
{
	display: flex;
	flex: 1 1 0;
	flex-direction: column;
	gap: 10px;
	min-height: 0;
	padding: 2px 6px 4px;
	overflow-y: auto;
	scrollbar-width: thin;
}

.album_row
{
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 10px 12px 12px;
	border-radius: 12px;
	background: linear-gradient(180deg, color-mix(in srgb, var(--tier) 9%, #120c26), #0d0920);
	box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--tier) 22%, transparent);
}

.album_row.is_focus
{
	box-shadow: inset 0 0 0 1.5px var(--tier);
}

.album_row_head
{
	display: flex;
	align-items: center;
	gap: 14px;
}

.album_ribbon
{
	display: inline-grid;
	place-items: center;
	height: 22px;
	padding: 0 18px;
	color: #fff;
	font: 700 11px/1 var(--font_game);
	letter-spacing: 0.22em;
	text-transform: uppercase;
	text-shadow: 0 1px 0 rgba(0, 0, 0, 0.45);
	background: linear-gradient(180deg, color-mix(in srgb, var(--tier) 80%, #fff), var(--tier) 45%, var(--tier_deep));
	clip-path: polygon(0 0, 100% 0, calc(100% - 8px) 50%, 100% 100%, 0 100%, 8px 50%);
}

.album_stat
{
	color: var(--text_dim);
	font-size: 12.5px;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
}

.album_got
{
	margin-left: auto;
	color: color-mix(in srgb, var(--tier) 75%, #fff);
	font: 700 14px/1 var(--font_game);
	font-variant-numeric: tabular-nums;
}

.album_grid
{
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
	gap: 8px;
}

.album_card
{
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	padding: 8px 6px 8px;
	border-radius: 10px;
	background: radial-gradient(ellipse 80% 60% at 50% 30%, rgba(255, 255, 255, 0.04), transparent 70%), #0a0718;
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05);
}

.album_card.is_got
{
	background: radial-gradient(ellipse 80% 60% at 50% 30%, color-mix(in srgb, var(--tier) 16%, transparent), transparent 70%), #0d0920;
	box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--tier) 40%, transparent);
}

.album_card .figure_svg
{
	width: 64px;
	height: 80px;
}

.album_name
{
	max-width: 100%;
	overflow: hidden;
	color: var(--text_mute);
	font-size: 11.5px;
	font-weight: 600;
	text-align: center;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.album_card.is_got .album_name
{
	color: var(--text);
}

.album_count
{
	position: absolute;
	right: 6px;
	top: 6px;
	padding: 2px 6px;
	border-radius: 6px;
	color: #fde68a;
	font: 700 11px/1.2 var(--font_game);
	background: rgba(245, 196, 81, 0.14);
}

/*
//=====================================================================================
*/

.capsule_big
{
	inset: 0;
	gap: 6px;
	background: radial-gradient(closest-side, rgba(14, 6, 32, 0.6), rgba(14, 6, 32, 0));
}

.capsule_big::before
{
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	z-index: -1;
	width: min(560px, 86%);
	height: 196px;
	border-radius: 26px;
	transform: translate(-50%, -50%);
	background: radial-gradient(ellipse 70% 60% at 50% 0%, rgba(255, 255, 255, 0.08), transparent 70%), repeating-linear-gradient(45deg, rgba(255, 255, 255, 0.02) 0 2px, transparent 2px 5px), linear-gradient(180deg, rgba(40, 24, 92, 0.97), rgba(20, 10, 50, 0.97));
	box-shadow: inset 0 0 0 1.5px rgba(245, 196, 81, 0.55), inset 0 0 0 8px rgba(29, 20, 64, 0.97), inset 0 0 0 9.5px rgba(126, 232, 106, 0.45), 0 0 0 7px rgba(10, 5, 25, 0.6), 0 24px 50px rgba(0, 0, 0, 0.6);
}

.capsule_big .big_win_label
{
	padding-left: 0.22em;
	font: 800 44px/1 var(--font_game);
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: transparent;
	background: linear-gradient(180deg, #fff6d6 0%, #f5c451 50%, #b7791f 100%);
	-webkit-background-clip: text;
	background-clip: text;
	filter: drop-shadow(0 3px 0 rgba(10, 5, 25, 0.9));
}

.capsule_big[data-tier="2"] .big_win_label
{
	background-image: linear-gradient(180deg, #ecffe0 0%, #7ee36b 55%, #2f8a22 100%);
}

.capsule_big[data-tier="3"] .big_win_label
{
	font-size: 50px;
	background-image: linear-gradient(100deg, #ffd1f0 0%, #c4b5fd 22%, #a5f3fc 42%, #bbf7d0 60%, #fef08a 80%, #fbcfe8 100%);
}

.capsule_big .big_win_amount
{
	filter: drop-shadow(0 3px 0 rgba(10, 5, 25, 0.9));
}

.capsule_big .big_win_amount .money
{
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.capsule_big .big_win_amount .coin
{
	width: 38px;
	height: 38px;
}

.capsule_big .big_win_multiplier
{
	max-width: 480px;
	overflow: hidden;
	color: #e7f9df;
	font: 700 13px/1 var(--font_game);
	letter-spacing: 0.16em;
	text-transform: uppercase;
	white-space: nowrap;
	text-overflow: ellipsis;
}

/*
//=====================================================================================
*/

.capsule_pill
{
	color: color-mix(in srgb, var(--tier) 55%, #fff);
	background: color-mix(in srgb, var(--tier) 16%, transparent);
	box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--tier) 38%, transparent);
}

.capsule_pill.is_win
{
	color: color-mix(in srgb, var(--tier) 45%, #fff);
	background: color-mix(in srgb, var(--tier) 26%, transparent);
}

.capsule_tier_chip
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: color-mix(in srgb, var(--tier) 70%, #fff);
	font-weight: 600;
}

.capsule_tier_chip::before
{
	content: "";
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--tier);
}

.capsule_figure_cell
{
	color: var(--text);
	font-weight: 600;
}

/*
//=====================================================================================
*/

@media (prefers-reduced-motion: no-preference)
{
	.capsule_alien .alien_float
	{
		animation: alien_bob 2.8s ease-in-out infinite;
	}

	.capsule_alien.is_crank .alien_float,
	.capsule_alien.is_cartwheel .alien_float
	{
		animation: none;
	}

	.capsule_alien .alien_flame_left
	{
		animation: alien_flame 0.13s ease-in-out infinite alternate;
	}

	.capsule_alien .alien_flame_right
	{
		animation: alien_flame 0.13s ease-in-out 0.06s infinite alternate;
	}

	.capsule_alien .alien_antenna_left
	{
		animation: alien_antenna 2.6s ease-in-out infinite;
	}

	.capsule_alien .alien_antenna_right
	{
		animation: alien_antenna_right 2.6s ease-in-out 0.4s infinite;
	}

	.capsule_alien.is_jump .alien_antenna_left,
	.capsule_alien.is_cartwheel .alien_antenna_left
	{
		animation-duration: 0.5s;
	}

	.capsule_alien.is_jump .alien_antenna_right,
	.capsule_alien.is_cartwheel .alien_antenna_right
	{
		animation-duration: 0.5s;
	}

	.capsule_alien .alien_lid
	{
		animation: alien_blink 4.4s ease-in-out infinite;
	}

	.capsule_alien.is_crank .alien_lid,
	.capsule_alien.is_shrug .alien_lid,
	.capsule_alien.is_wow .alien_lid
	{
		animation: none;
	}

	.capsule_alien .alien_leg_left
	{
		animation: alien_swing 2.8s ease-in-out infinite;
	}

	.capsule_alien .alien_leg_right
	{
		animation: alien_swing 2.8s ease-in-out 1.4s infinite;
	}

	.capsule_alien.is_nod .alien_head
	{
		animation: alien_nod 0.5s ease-in-out 3;
	}

	.capsule_alien.is_shrug .alien_body
	{
		animation: alien_shrug 0.7s ease-in-out 2;
	}

	.capsule_alien.is_crank .alien_body
	{
		animation: alien_strain 0.3s ease-in-out infinite alternate;
	}

	.capsule_alien.is_quick.is_crank .alien_body
	{
		animation-duration: 0.12s;
	}

	.capsule_slot .figure_svg
	{
		animation: slot_float 3.4s ease-in-out infinite;
	}

	.figure_svg .fig_glint
	{
		animation: fig_twinkle 1.6s ease-in-out infinite;
	}

	.figure_svg .fig_glint:nth-of-type(3n)
	{
		animation-delay: 0.55s;
	}

	.figure_svg .fig_glint:nth-of-type(3n + 1)
	{
		animation-delay: 1.1s;
	}

	.capsule_album .figure_svg,
	.figure_svg.is_silhouette .fig_glint
	{
		animation: none;
	}
}

@keyframes alien_bob
{
	0%,
	100%
	{
		translate: 0 0;
	}

	50%
	{
		translate: 0 -7px;
	}
}

@keyframes alien_flame
{
	from
	{
		scale: 0.85 0.8;
	}

	to
	{
		scale: 1.08 1.18;
	}
}

@keyframes alien_antenna
{
	0%,
	100%
	{
		rotate: 0deg;
	}

	30%
	{
		rotate: -9deg;
	}

	65%
	{
		rotate: 6deg;
	}
}

@keyframes alien_antenna_right
{
	0%,
	100%
	{
		rotate: 0deg;
	}

	30%
	{
		rotate: 9deg;
	}

	65%
	{
		rotate: -6deg;
	}
}

@keyframes alien_blink
{
	0%,
	91%,
	100%
	{
		scale: 1 0;
	}

	95%
	{
		scale: 1 1;
	}
}

@keyframes alien_swing
{
	0%,
	100%
	{
		rotate: -6deg;
	}

	50%
	{
		rotate: 7deg;
	}
}

@keyframes alien_nod
{
	0%,
	100%
	{
		rotate: 0deg;
		translate: 0 0;
	}

	50%
	{
		rotate: 5deg;
		translate: 0 4px;
	}
}

@keyframes alien_shrug
{
	0%,
	100%
	{
		translate: 0 0;
	}

	40%
	{
		translate: 0 -4px;
	}
}

@keyframes alien_strain
{
	from
	{
		translate: 0 0;
	}

	to
	{
		translate: 1.5px 1px;
	}
}

@keyframes slot_float
{
	0%,
	100%
	{
		translate: 0 0;
	}

	50%
	{
		translate: 0 -5px;
	}
}

@keyframes fig_twinkle
{
	0%,
	100%
	{
		opacity: 1;
	}

	50%
	{
		opacity: 0.25;
	}
}

@keyframes capsule_drawer
{
	from
	{
		opacity: 0;
		translate: 0 10px;
	}
}

/*
//=====================================================================================
*/

@media (max-height: 860px) and (min-width: 1101px)
{
	.capsule_machine_button
	{
		height: 50px;
	}

	.capsule_tier,
	.capsule_album_key
	{
		min-height: 70px;
	}

	.capsule_tier
	{
		padding: 6px 8px;
		gap: 2px;
	}

	.tier_pay
	{
		font-size: 15px;
	}
}

@media (max-height: 760px) and (min-width: 1101px)
{
	.capsule_stage
	{
		gap: 8px;
	}

	.capsule_page .game_controls .field
	{
		margin-bottom: 10px;
	}

	.capsule_page .game_controls .field_box
	{
		height: 44px;
	}

	.capsule_page .segment
	{
		height: 34px;
	}

	.capsule_machine_button
	{
		height: 46px;
		gap: 3px;
	}

	.capsule_tier,
	.capsule_album_key
	{
		min-height: 60px;
	}

	.tier_chance
	{
		display: none;
	}

	.album_key_hint
	{
		display: none;
	}
}

@media (max-height: 700px) and (min-width: 1101px)
{
	.capsule_counts .field_chip
	{
		height: 26px;
	}

	.tier_dots
	{
		display: none;
	}

	.capsule_tier,
	.capsule_album_key
	{
		min-height: 48px;
	}
}

@media (max-width: 1400px)
{
	.capsule_strip
	{
		grid-template-columns: 88px minmax(0, 1fr);
	}

	.capsule_tier
	{
		padding: 7px 7px;
	}

	.tier_name
	{
		font-size: 9.5px;
		letter-spacing: 0.04em;
	}

	.tier_gem
	{
		display: none;
	}
}

@media (max-width: 1100px)
{
	.capsule_scene
	{
		flex: none;
		height: calc((100vw - 48px) * 0.62);
		max-height: 620px;
	}

	.capsule_strip
	{
		grid-template-columns: 1fr;
	}

	.capsule_tiers
	{
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

/*
//=====================================================================================
*/