Fixed pagination and scene poster overflowing page on small screens. Fixed back reload interfering with tag page hashes.

pages/scene/+Page.vue

@@ -149,13 +149,13 @@
 					</li>
 				</ul>
 
-				<div class="section">
+				<div
+					v-if="scene.description"
+					class="section"
+				>
 					<h3 class="heading">Description</h3>
 
-					<p
-						v-if="scene.description"
-						class="description"
-					>{{ scene.description }}</p>
+					<p class="description">{{ scene.description }}</p>
 				</div>
 
 				<div class="section details">
@@ -246,22 +246,30 @@ async function unstash() {
 .banner-container {
 	background-position: center;
 	background-size: cover;
+	border-radius: .5rem .5rem 0 0;
 	margin-top: .5rem;
 }
 
 .banner {
 	max-height: 18rem;
+	border-radius: .5rem .5rem 0 0;
 	display: flex;
 	font-size: 0;
 	backdrop-filter: blur(1rem);
+	overflow: hidden;
+}
+
+.poster-container {
+	padding: .5rem;
+	max-height: 18rem;
 }
 
 .poster {
 	height: auto;
-	max-height: 18rem;
+	max-height: 100%;
 	width: auto;
 	max-width: 100%;
-	border-radius: .25rem .25rem 0 0;
+	border-radius: .5rem;
 }
 
 .poster,
@@ -273,12 +281,12 @@ async function unstash() {
 }
 
 .album {
-	height: 100%;
+	height: auto;
 	flex-grow: 1;
 	display: grid;
     grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr));
 	gap: .5rem;
-	padding: 0 .5rem .5rem .5rem;
+	padding: .5rem .5rem .5rem 0;
 	overflow-y: auto;
 }
 
@@ -300,7 +308,7 @@ async function unstash() {
 	justify-content: space-between;
 	align-items: center;
 	background: var(--grey-dark-40);
-	border-radius: 0 0 .25rem .25rem;
+	border-radius: 0 0 .5rem .5rem;
 	color: var(--text-light);
 }
 
@@ -444,7 +452,31 @@ async function unstash() {
 	color: var(--shadow);
 }
 
-@media (--compact) {
+@media(--small-10) {
+	.banner-container {
+		border-radius: 0;
+		margin-top: 0;
+	}
+
+	.banner {
+		justify-content: center;
+	}
+
+	.poster-container {
+		padding: 0;
+		border-radius: 0;
+	}
+
+	.poster {
+		border-radius: 0;
+	}
+
+	.album {
+		display: none;
+	}
+}
+
+@media (--small) {
 	.header {
 		flex-direction: column-reverse;
 	}
@@ -455,13 +487,10 @@ async function unstash() {
 		margin-bottom: 1.5rem;
 	}
 
-	.view {
-		flex-direction: row-reverse;
-	}
-
 	.title {
 		width: 100%;
 		margin-left: 1rem;
+		white-space: wrap;
 	}
 
 	.meta {