/*
* @Author: kingpoolee
* @Date:   2026-08-14 05:02:49
* @Last Modified by:   kingpoolee
* @Last Modified time: 2026-08-21 13:30:10
*/

#app {
	min-width: 360px;
}

.cube-container {
	position: relative;
	width: 600px;
	height: 600px;
	margin: 20px auto;
	margin-top: 100px;
	vertical-align: top;

}

#search-box {
	width: 100%;
	position: fixed;
	bottom: 0;
	left: 0;
	background-color: gray;
	z-index: 1000;
	box-shadow: -1px 1px 10px black ;
	min-width: 360px;
}

#search-bar {
	width: 360px;
}

.search-input {
	display: inline-block;
	width: 340px;
	margin: 10px;
}

.search-input.illegal {
	border: 1px solid red;
}

.out, .middle, .inner {
	background-color: transparent;
	outline: 1px solid white;	
	outline: 1px solid white;
	border-radius: 200px;
}

.out {
	position: absolute;
	width: 400px;
	height: 400px;
	padding: 20px;
}

.middle {
	width: 360px;
	height: 360px;
	padding: 20px;
}

.inner {
	width: 320px;
	height: 320px;
}

.top {
	top: 0;
	left: 100px;	
}

.left {
	top: 100px;
	left: 0px;
}

.right {
	top: 100px;
	left: 200px;
}

.block {
	position: absolute;
	width: 10px;
	height: 10px;
	background-color: red;
	border-radius: 10px;
	z-index: 10;
}

.c0 {
	top: 113px;
	left: 12px;
}

.c3 {
	top: 140px;
	left: 2px;
}

.c5 {
	top: 169px;
	left: -4px;
}