@import url('https://fonts.googleapis.com/css2?family=Ubuntu+Sans+Mono:ital,wght@0,400..700;1,400..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200&icon_names=pause_circle,play_circle');

html {
	height: 100vh;
	font-family: 'Ubuntu Sans Mono', monospace;
	overflow: hidden;
}

body {
	background-color: #aaaaff;
	margin: 0px;
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100%;
	overflow: hidden;
}

#centered {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: end;
	max-width: 100%;
	user-select: none;
}

#timer {
	font-size: 8vw;
	font-weight: bold;
	width: min-content;
	white-space: pre-line;
}

#music {
	display: none;
}

#play-pause {
	font-size: 64px;
	border: none;
	cursor: pointer;
	background: transparent;
	padding: 0px;
	border-radius: 50%;
	width: 48px;
	height: 48px;
	position: fixed;
	bottom: 8px;
	right: 8px;
	display: flex;
	justify-content: center;
	align-items: center;
	user-select: none;
}

.sakura {
	position: fixed !important;
}