Sort out panel CSS

src/styles/_page.project.panel.settings.scss

@@ -10,7 +10,7 @@
 		.settings-box {
 			background: color.$default-bg;
 			border-radius: var.$block-radius;
-			box-shadow: 2px 2px var.$block-shadow 0px color.$over-img-shadow;
+			box-shadow: var.$map-shadow;
 		}
 
 		.settings-header {
@@ -56,7 +56,7 @@
 						img {
 							width: 12px;
 							vertical-align: center;
-							animation: spotlogo 20s infinite;
+							animation: spin 20s infinite;
 						}
 					}
 
@@ -74,7 +74,7 @@
 			justify-content: center;
 			font-size: 0.7em;
 			color: color.$default-inv;
-			text-shadow: 0px 1px 1px color.$over-img-shadow;
+			text-shadow: var.$elem-shadow;
 
 			a {
 				color: color.$default-inv;
@@ -188,4 +188,35 @@
 			}
 		}
 	}
+
+	#title {
+		left: calc(100% + var.$button-width + 2 * var.$block-spacing);
+		max-width: calc(100vw - var.$block-spacing - (var.$button-width + 2 * var.$block-spacing) * 2);
+		transition: max-width 0.5s;
+		@include common.no-text-overflow();
+
+		span {
+			font-size: 1.3em;
+			line-height: calc(var.$block-spacing / 1.3);
+			vertical-align: center;
+		}
+	}
+
+	#legend {
+		.track {
+			white-space: nowrap;
+			.line {
+				width: 2em;
+				display: inline-block;
+				border-radius: 2px;
+				vertical-align: middle;
+			}
+
+			.desc {
+				font-size: 1em;
+				margin-left: 0.5em;
+				color: color.$legend;
+			}
+		}
+	}
 }