:root {
	--TileSize: calc(var(--IconSize) * 2);
	--Columns: 3;
	--Gap: 8px;
	--IconSize: 48px;
	--SkinBtnSize: 40px;
	--Radius: 16px
	}
body {
	background: no-repeat #201f37;
	background-attachment: fixed;
	background-size: 100%;
	height: inherit;
	min-width: 320px;
	min-height: 720px;
	user-select: none;
	}
.ShortcutoGrid {
	display: grid;
	grid-template-columns: repeat(var(--Columns), var(--TileSize));
	gap: var(--Gap);
	width: calc(var(--TileSize) * var(--Columns) + var(--Gap) * var(--Columns) + var(--Gap));
	padding: var(--Gap);
	margin: 0 auto;
	position: relative;
	z-index: 2;
	}
.Tile {
	width: 100%;
	font-size: 12px;
	aspect-ratio: 1 / 1;
	border-radius: calc(var(--Radius) /2);
	display: flex;
	align-items: center;
	flex-direction: column;
	padding: calc(var(--Gap) * 2) 0 0 0;
	transition: .2s;
	position: relative;
	}
.Tile.small .Intro {
	display: none
	}
.Shortcut {
	width: var(--IconSize);
	height: var(--IconSize);
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 0 calc(var(--Gap) /4) 0;
	border-radius: var(--Radius);
	box-shadow: 0 0 0 1px rgba(255,255,255,.1) inset;
	}
.Shortcut img {
	width: var(--IconSize);
	height: var(--IconSize);
	padding: 8px;
	display: block
	}
a.Tile {
	color: white;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.8);
	}
a.Tile:hover {
	color: rgba(255,255,255,1.00);
	background: rgba(0,0,0,.2);
	}
.Tile:hover img {
	opacity: 1
	}
.wide {
	grid-column: span 2;
	height: var(--TileSize);
	}
.NoTxt .Shortcut {
	height: var(--TileSize);
	}
.large {
	grid-column: span 2;
	grid-row: span 2;
	}
.large .Shortcut {
	width: calc(var(--IconSize) * 3 + var(--Gap));
	height: calc(var(--IconSize) * 3 + var(--Gap));
    flex-direction: column
	}
.wide .Shortcut {
	width: calc(var(--IconSize) * 3 + var(--Gap));
    text-shadow: none;
	}
.large img {
    --IconSize: 56px
    }
.large .Flex1 {
    flex: none !important
    }
.Clock {
	width: calc(var(--TileSize) * 0.8);
	height: calc(var(--TileSize) * 0.8);
	}
.GlassMask {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
    backdrop-filter: saturate(130%) blur(15px);
    -webkit-backdrop-filter: saturate(130%) blur(15px);
	}
.ThemeMask {
	position: fixed;
	top: 50%;
	left: 50%;
	width: 0;
	height: 0;
	background: rgba(0,0,0,1.00);
	border-radius: 50%;
	transform: translate(-50%, -50%);
	pointer-events: none;
	opacity: .1;
	transition: opacity 0.2s;
	}
.ThemeMask.active {
	opacity: 1;
	animation: expandCircle 0.2s ease-out forwards;
	}
.Skin,
.Mgr {
	position: absolute;
	right: 	calc(var(--SkinBtnSize) *0.5);
	bottom: var(--SkinBtnSize);
	z-index: 10;
	}
.Mgr {
	right: 	calc(var(--SkinBtnSize) *2);
	}
.Skin:hover:after { /*加大甜区*/
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	border: 20px solid transparent;
	left: -20px;
	top: -20px;
	border-radius: 50%;
	display: block
	}
.Skin,
.Skin label,
.Mgr a {
	border-radius: 50%;
	width: var(--SkinBtnSize);
	height: var(--SkinBtnSize);
	background: rgba(255,255,255,.1);
	color: white;
	text-align: center;
	cursor: pointer;
	}
.Skin:hover {
	background: rgba(255,255,255,.3);
	}
.Skin label {
	background-color: rgba(255,255,255,.1);
	position: relative
	}
.Skin .FullDesignIcons {
	font-size: 24px;
	line-height: var(--SkinBtnSize);
	}
.Skin label:hover {
	background: rgba(255,255,255,.5);
	}
.Skin label:hover .Tips {
	display: block
	}
.Skin input {
	display: none
	}
.Skin input:checked + label {
	background: rgba(255,255,255,1);
	color: rgba(0,0,0,.8)
	}
.Skin form {
	flex-direction: column;
	margin: var(--SkinBtnSize) 0 0 0;
	position: absolute;
	gap: 8px 0;
	right: 0;
	bottom: calc(var(--SkinBtnSize) + 16px);
	display: none;
	transition: .2s;
	}
.Skin:hover form {
	display: flex;
	}
.Skin .Tips {
	position: absolute;
	border-radius: 4px;
	white-space: nowrap;
	padding: 4px 8px;
	background: rgba(0,0,0,.6);
	color: white;
	right: calc(var(--SkinBtnSize) + 8px);
	top: calc(50% - 16px);
	display: none;
	}
@keyframes expandCircle {
	0% {
		width: 0;
		height: 0;
		opacity: 0;  /* 开始完全透明 */
		}
	50% {
		opacity: 1;  /* 中间完全不透明 */
		}
	100% {
		width: 150vmax;
		height: 150vmax;
		opacity: 0;  /* 结束淡出 */
		}
	}