body { background:#f5f5f5; }

#sheetWrapper {
	width:100%;
	display:flex;
	justify-content:center;
	overflow:hidden;
}

#sheet {
	position:relative;
	width:794px;
	height:1123px;
	transform-origin:top center;
}

#sheet img {
	position:absolute;
	width:100%;
	height:100%;
	z-index:1;
}

.field {
	position: absolute;
	font-size: 12px;
	z-index: 3;
	pointer-events: none;
	
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

#clickLayer {
	position:absolute;
	width:100%;
	height:100%;
	z-index:2;
}

.row-click {
	position:absolute;
	width:100%;
	cursor:pointer;
}

.row-click.active::after {
	content:"";
	position:absolute;
	left:121px;
	right:104px;
	top:0px;
	height:19px;
	border:2px solid rgba(0,175,239,0.7);
	border-radius:4px;
}

.row-click::after {
	transition: opacity 1.5s;
}

.sticky-download {
	position:sticky;
	bottom:0;
	background:white;
	padding:10px;
	border-top:1px solid #ddd;
}

.modal-dialog {
  transition:
    transform 0.15s ease,
    opacity 0.1s ease;

  opacity: 0;
}

#defaultsModal {
	font-size: 0.9rem;
}

#defaultsModal .btn {
	font-size: 0.85rem;
	padding: 6px 10px;
}

#openAuthBtn i {
	color: #333;
}

#openAuthBtn:hover {
	background: #ddd;
}
.user-circle {
	width: 42px;
	height: 42px;
	border-radius: 50%;
	background: #eee;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.2s ease;
	cursor: pointer;
}

.user-circle i {
	color: #333;
}

#openAuthBtn:hover .user-circle {
	background: #ddd;
}

#loadingOverlay {
	position: fixed;
	inset: 0;
	background: rgba(0,0,0,0.35);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 9999;
}