diff --git a/.circleci/config.yml b/.circleci/config.yml
index c195df81c..2025e8fe7 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -73,9 +73,6 @@ jobs:
       - run:
           name: Test - Non-Breaking Spaces
           command: npm run test:non-breaking-spaces
-      - run:
-          name: Test - Paragraph Justification
-          command: npm run test:paragraph-justification
       - run:
           name: Test - Variables
           command: npm run test:variables
diff --git a/changelog.md b/changelog.md
index 1464df6b0..f560ce1e5 100644
--- a/changelog.md
+++ b/changelog.md
@@ -88,6 +88,70 @@ pre {
 ## changelog
 For a full record of development, visit our [Github Page](https://github.com/naturalcrit/homebrewery).
 
+### Tuesday 03/18/2025 - v3.18.1
+
+{{taskList
+##### G-Ambatte
+* [x] Revert colon rendering from br elements to blank divs
+
+##### 5e-Cleric
+* [x] Allow for local connections within a same network when running a local version
+Fixes issue [#4094](https://github.com/naturalcrit/homebrewery/issues/4094)
+
+* [x] Add US Letter size page snippet
+Fixes issue [#3893](https://github.com/naturalcrit/homebrewery/issues/3893)
+}}
+
+### Monday 03/10/2025 - v3.18.0
+
+{{taskList
+##### dbolack
+* [x] Add ability to paste in any Share ID/URL into a brew's {{openSans :fas_circle_info: **Properties** :fas_arrow_right: **THEMES**}} selection, as long as that brew has been tagged as `meta:theme`. You can now share your custom brew themes without needing to make a personal copy.
+* [x] Begin migration of custom Markdown extensions into their own NPM packages, for easier adoption by other users or projects
+* [x] Fix external HTML appearing in open codeblocks
+
+Fixes issue [#3206](https://github.com/naturalcrit/homebrewery/issues/3206)
+
+* [x] Fix tables not rendering when directly after text
+
+
+##### G-Ambatte
+* [x] Cleanup of "cover pages" in the {{openSans :fas_rectangle_list: **NAVIGATION**}} list
+* [x] Fix autosave triggering when no changes are present
+
+Fixes issue [#4051](https://github.com/naturalcrit/homebrewery/issues/4051)
+
+* [x] Remove empty table rows resulting from rowspan
+
+Fixes issue [#1729](https://github.com/naturalcrit/homebrewery/issues/1729)
+
+##### 5e-Cleric
+* [x] Style fixes for covers art and logos on A4 size pages
+* [x] Fix crash when trying to open brews that don't exist
+* [x] Tweaks and style update styling on {{openSans **VAULT** :fas_dungeon:}} page.
+
+Fixes issue [#4079](https://github.com/naturalcrit/homebrewery/issues/4079)
+
+##### Calculuschild
+* [x] `꞉꞉꞉꞉` now produces `<br>` instead of a `<div>`
+* [x] Fix typos in tables freezing the editor
+
+Fixes issue [#4059](https://github.com/naturalcrit/homebrewery/issues/4059)
+
+
+##### MollyMaclachlan (New Contributor!)
+* [x] Fixed typos in the Monster Stat Block snippet
+
+Fixes issue [#4073](https://github.com/naturalcrit/homebrewery/issues/4073)
+
+
+##### All
+* [x] Update dependencies and scripts
+* [x] Refactor components and backend tools
+}}
+
+\column
+
 ### Thursday 01/30/2025 - v3.17.0
 
 {{taskList
@@ -169,7 +233,7 @@ Fixes issue [#3824](https://github.com/naturalcrit/homebrewery/issues/3824)
 * [x] Refactor components and fix various errors
 }}
 
-\column
+\page
 
 ### Wednesday 11/27/2024 - v3.16.1
 
@@ -217,8 +281,6 @@ Fixes issue [#3744](https://github.com/naturalcrit/homebrewery/issues/3744)
 * [x] Multiple code refactors, cleanups, and security fixes
 }}
 
-\page
-
 ### Saturday 10/12/2024 - v3.16.0
 
 {{taskList
diff --git a/client/admin/admin.jsx b/client/admin/admin.jsx
index f2f2667a4..95c296259 100644
--- a/client/admin/admin.jsx
+++ b/client/admin/admin.jsx
@@ -1,47 +1,48 @@
-require('./admin.less');
-const React = require('react');
-const createClass = require('create-react-class');
-
+import './admin.less';
+import React, { useEffect, useState } from 'react';
 const BrewUtils = require('./brewUtils/brewUtils.jsx');
 const NotificationUtils = require('./notificationUtils/notificationUtils.jsx');
+import AuthorUtils from './authorUtils/authorUtils.jsx';
 
-const tabGroups = ['brew', 'notifications'];
+const tabGroups = ['brew', 'notifications', 'authors'];
 
-const Admin = createClass({
-	getDefaultProps : function() {
-		return {};
-	},
+const Admin = ()=>{
+	const [currentTab, setCurrentTab] = useState('brew');
 
-	getInitialState : function(){
-		return ({
-			currentTab : 'brew'
-		});
-	},
+	useEffect(()=>{
+		setCurrentTab(localStorage.getItem('hbAdminTab'));
+	}, []);
 
-	handleClick : function(newTab){
-		if(this.state.currentTab === newTab) return;
-		this.setState({
-			currentTab : newTab
-		});
-	},
+	useEffect(()=>{
+		localStorage.setItem('hbAdminTab', currentTab);
+	}, [currentTab]);
 
-	render : function(){
-		return <div className='admin'>
+	return (
+		<div className='admin'>
 			<header>
 				<div className='container'>
 					<i className='fas fa-rocket' />
-					homebrewery admin
+					The Homebrewery Admin Page
+					<a href='/'>back to homepage</a>
 				</div>
 			</header>
 			<main className='container'>
 				<nav className='tabs'>
-					{tabGroups.map((tab, idx)=>{ return <button className={tab===this.state.currentTab ? 'active' : ''} key={idx} onClick={()=>{ return this.handleClick(tab); }}>{tab.toUpperCase()}</button>; })}
+					{tabGroups.map((tab, idx)=>(
+						<button
+							className={tab === currentTab ? 'active' : ''}
+							key={idx}
+							onClick={()=>setCurrentTab(tab)}>
+							{tab.toUpperCase()}
+						</button>
+					))}
 				</nav>
-				{this.state.currentTab==='brew' && <BrewUtils />}
-				{this.state.currentTab==='notifications' && <NotificationUtils />}
+				{currentTab === 'brew' && <BrewUtils />}
+				{currentTab === 'notifications' && <NotificationUtils />}
+				{currentTab === 'authors' && <AuthorUtils />}
 			</main>
-		</div>;
-	}
-});
+		</div>
+	);
+};
 
 module.exports = Admin;
diff --git a/client/admin/admin.less b/client/admin/admin.less
index c6c9b4662..1955f8a93 100644
--- a/client/admin/admin.less
+++ b/client/admin/admin.less
@@ -22,7 +22,7 @@ body {
 }
 
 :where(.admin) {
-
+	padding-bottom : 50px;
 	header {
 		padding          : 20px 0px;
 		margin-bottom    : 30px;
@@ -30,6 +30,7 @@ body {
 		color            : white;
 		background-color : @red;
 		i { margin-right : 30px; }
+		a { float : right; }
 	}
 
 	hr { margin : 30px 0px; }
@@ -48,21 +49,23 @@ body {
 		}
 
 		dl {
-			@maxItemWidth : 132px;
+			display               : grid;
+			grid-template-columns : 120px 1fr;
+			row-gap               : 10px;
+			align-items           : center;
+			justify-items         : start;
+			padding-top           : 0.5em;
 			dt {
-				float      : left;
-				width      : @maxItemWidth;
-				clear      : left;
-				text-align : right;
+				float       : left;
+				clear       : left;
+				height      : fit-content;
+				font-weight : 900;
+				text-align  : right;
 				&::after { content : ' : '; }
 			}
-			dd {
-				height      : 1em;
-				padding     : 0 0 0.5em 0;
-				margin-left : @maxItemWidth + 6px;
-			}
+			dd { height      : fit-content; }
 		}
-
+		
 		.tabs button {
 			margin-right     : 3px;
 			margin-left      : 3px;
@@ -90,11 +93,45 @@ body {
 		}
 	}
 
+	table {
+		padding    : 10px;
+
+		tr {
+			border-bottom : 1px solid;
+			&:last-of-type { border : none; }
+			&:nth-child(even) { background : #DDDDDD; }
+		}
+
+		thead {
+			background    : rgb(193,236,230);
+			border-bottom : 2px solid;
+		}
+        
+		th, td {
+			padding        : 5px 10px;
+			vertical-align : middle;
+			text-align     : center;
+			border-right   : 1px solid;
+
+			&:last-child { border-right : none; }
+		}
+
+		th { font-weight : 900; }
+
+		td {
+			&:first-child {
+				font-weight  : 900;
+				text-align   : left;
+			}
+		}
+	}
+
 	.error {
-		background: rgb(178, 54, 54);
-		color:white;
-		font-weight: 900;
-		margin-block:10px;
-		padding:10px;
+		float        : right;
+		padding      : 10px;
+		margin-block : 10px;
+		font-weight  : 900;
+		color        : white;
+		background   : rgb(178, 54, 54);
 	}
 }
diff --git a/client/admin/authorUtils/authorLookup/authorLookup.jsx b/client/admin/authorUtils/authorLookup/authorLookup.jsx
new file mode 100644
index 000000000..abdece6f7
--- /dev/null
+++ b/client/admin/authorUtils/authorLookup/authorLookup.jsx
@@ -0,0 +1,87 @@
+import './authorLookup.less';
+
+import React from 'react';
+import request from 'superagent';
+
+const authorLookup = ()=>{
+	const [author, setAuthor] = React.useState('');
+	const [searching, setSearching] = React.useState(false);
+	const [results, setResults] = React.useState([]);
+
+	const lookup = async ()=>{
+		if(!author) return;
+
+		setSearching(true);
+		setResults([]);
+
+		const brews = await request.get(`/admin/user/list/${author}`);
+		setResults(brews.body);
+		setSearching(false);
+	};
+
+	const renderResults = ()=>{
+		if(results.length == 0) return <>
+			<h2>Results</h2>
+			<p>None found.</p>
+		</>;
+
+		return <>
+			<h2>{`Results - ${results.length} brews` }</h2>
+			<table className='resultsTable'>
+				<thead>
+					<tr>
+						<th>Title</th>
+						<th>Share</th>
+						<th>Edit</th>
+						<th>Last Update</th>
+						<th>Storage</th>
+					</tr>
+				</thead>
+				<tbody>
+					{results
+						.sort((a, b)=>{         // Sort brews from most recently updated
+							if(a.updatedAt > b.updatedAt) return -1;
+							return 1;
+						})
+						.map((brew, idx)=>{
+							return <tr key={idx}>
+								<td><strong>{brew.title}</strong></td>
+								<td><a href={`/share/${brew.shareId}`}>{brew.shareId}</a></td>
+								<td>{brew.editId}</td>
+								<td style={{ width: '200px' }}>{brew.updatedAt}</td>
+								<td>{brew.googleId ? 'Google' : 'Homebrewery'}</td>
+							</tr>;
+						})}
+				</tbody>
+			</table>
+		</>;
+	};
+
+	const handleKeyPress = (evt)=>{
+		if(evt.key === 'Enter') return lookup();
+	};
+
+	const handleChange = (evt)=>{
+		setAuthor(evt.target.value);
+	};
+
+	return (
+		<div className='authorLookup'>
+			<div className='authorLookupInputs'>
+				<h2>Author Lookup</h2>
+				<label className='field'>
+					Author Name:
+					<input className='fieldInput' value={author} onKeyDown={handleKeyPress} onChange={handleChange} />
+					<button onClick={lookup}>
+						<i className={`fas ${searching ? 'fa-spin fa-spinner' : 'fa-search'}`} />
+					</button>
+				</label>
+			</div>
+			<div className='authorLookupResults'>
+				{renderResults()}
+			</div>
+		</div>
+	);
+};
+
+module.exports = authorLookup;
diff --git a/client/admin/authorUtils/authorLookup/authorLookup.less b/client/admin/authorUtils/authorLookup/authorLookup.less
new file mode 100644
index 000000000..8c37e80d1
--- /dev/null
+++ b/client/admin/authorUtils/authorLookup/authorLookup.less
@@ -0,0 +1,29 @@
+.authorLookup {
+	position       : relative;
+	display        : flex;
+	flex-direction : column;
+
+	.field {
+		display               : flex;
+		gap                   : 5px;
+		align-items           : center;
+		justify-items         : stretch;
+		width                 : 100%;
+		margin-bottom         : 20px;
+   
+	
+		input {
+			height        : 33px;
+			padding       : 0px 10px;
+			margin-bottom : unset;
+			font-family   : monospace;
+		}
+	
+		button {
+			width : 50px;
+				
+			i { margin-right : 10px; }
+		}
+	}
+
+}
\ No newline at end of file
diff --git a/client/admin/authorUtils/authorUtils.jsx b/client/admin/authorUtils/authorUtils.jsx
new file mode 100644
index 000000000..a96eea528
--- /dev/null
+++ b/client/admin/authorUtils/authorUtils.jsx
@@ -0,0 +1,13 @@
+import React from 'react';
+
+import AuthorLookup from './authorLookup/authorLookup.jsx';
+
+const authorUtils = ()=>{
+	return (
+		<section className='authorUtils'>
+			<AuthorLookup />
+		</section>
+	);
+};
+
+module.exports = authorUtils;
\ No newline at end of file
diff --git a/client/admin/brewUtils/brewCleanup/brewCleanup.jsx b/client/admin/brewUtils/brewCleanup/brewCleanup.jsx
index a166ae112..d4b17c570 100644
--- a/client/admin/brewUtils/brewCleanup/brewCleanup.jsx
+++ b/client/admin/brewUtils/brewCleanup/brewCleanup.jsx
@@ -1,10 +1,8 @@
-require('./brewCleanup.less');
 const React       = require('react');
 const createClass = require('create-react-class');
 
 const request = require('superagent');
 
-
 const BrewCleanup = createClass({
 	displayName : 'BrewCleanup',
 	getDefaultProps(){
@@ -39,9 +37,9 @@ const BrewCleanup = createClass({
 		if(!this.state.primed) return;
 
 		if(!this.state.count){
-			return <div className='removeBox'>No Matching Brews found.</div>;
+			return <div className='result noBrews'>No Matching Brews found.</div>;
 		}
-		return <div className='removeBox'>
+		return <div className='result'>
 			<button onClick={this.cleanup} className='remove'>
 				{this.state.pending
 					? <i className='fas fa-spin fa-spinner' />
@@ -52,7 +50,7 @@ const BrewCleanup = createClass({
 		</div>;
 	},
 	render(){
-		return <div className='BrewCleanup'>
+		return <div className='brewUtil brewCleanup'>
 			<h2> Brew Cleanup </h2>
 			<p>Removes very short brews to tidy up the database</p>
 
@@ -65,7 +63,7 @@ const BrewCleanup = createClass({
 			{this.renderPrimed()}
 
 			{this.state.error
-				&& <div className='error'>{this.state.error.toString()}</div>
+				&& <div className='error noBrews'>{this.state.error.toString()}</div>
 			}
 		</div>;
 	}
diff --git a/client/admin/brewUtils/brewCleanup/brewCleanup.less b/client/admin/brewUtils/brewCleanup/brewCleanup.less
deleted file mode 100644
index 16fc98957..000000000
--- a/client/admin/brewUtils/brewCleanup/brewCleanup.less
+++ /dev/null
@@ -1,9 +0,0 @@
-.BrewCleanup {
-	.removeBox {
-		margin-top : 20px;
-		button {
-			margin-right     : 10px;
-			background-color : @red;
-		}
-	}
-}
\ No newline at end of file
diff --git a/client/admin/brewUtils/brewCompress/brewCompress.jsx b/client/admin/brewUtils/brewCompress/brewCompress.jsx
index 2c8e5b023..ccb59e027 100644
--- a/client/admin/brewUtils/brewCompress/brewCompress.jsx
+++ b/client/admin/brewUtils/brewCompress/brewCompress.jsx
@@ -1,10 +1,7 @@
-require('./brewCompress.less');
 const React       = require('react');
 const createClass = require('create-react-class');
-
 const request = require('superagent');
 
-
 const BrewCompress = createClass({
 	displayName : 'BrewCompress',
 	getDefaultProps(){
@@ -53,9 +50,9 @@ const BrewCompress = createClass({
 		if(!this.state.primed) return;
 
 		if(!this.state.count){
-			return <div className='removeBox'>No Matching Brews found.</div>;
+			return <div className='result noBrews'>No Matching Brews found.</div>;
 		}
-		return <div className='removeBox'>
+		return <div className='result'>
 			<button onClick={this.cleanup} className='remove'>
 				{this.state.pending
 					? <i className='fas fa-spin fa-spinner' />
@@ -69,7 +66,7 @@ const BrewCompress = createClass({
 		</div>;
 	},
 	render(){
-		return <div className='BrewCompress'>
+		return <div className='brewUtil brewCompress'>
 			<h2> Brew Compression </h2>
 			<p>Compresses the text in brews to binary</p>
 
diff --git a/client/admin/brewUtils/brewCompress/brewCompress.less b/client/admin/brewUtils/brewCompress/brewCompress.less
deleted file mode 100644
index 8668e9280..000000000
--- a/client/admin/brewUtils/brewCompress/brewCompress.less
+++ /dev/null
@@ -1,9 +0,0 @@
-.BrewCompress {
-	.removeBox {
-		margin-top : 20px;
-		button {
-			margin-right     : 10px;
-			background-color : @red;
-		}
-	}
-}
\ No newline at end of file
diff --git a/client/admin/brewUtils/brewLookup/brewLookup.jsx b/client/admin/brewUtils/brewLookup/brewLookup.jsx
index e5b585ced..fb780f29e 100644
--- a/client/admin/brewUtils/brewLookup/brewLookup.jsx
+++ b/client/admin/brewUtils/brewLookup/brewLookup.jsx
@@ -1,5 +1,3 @@
-require('./brewLookup.less');
-
 const React = require('react');
 const createClass = require('create-react-class');
 const cx    = require('classnames');
@@ -55,7 +53,7 @@ const BrewLookup = createClass({
 
 	renderFoundBrew(){
 		const brew = this.state.foundBrew;
-		return <div className='foundBrew'>
+		return <div className='result'>
 			<dl>
 				<dt>Title</dt>
 				<dd>{brew.title}</dd>
@@ -90,7 +88,7 @@ const BrewLookup = createClass({
 	},
 
 	render(){
-		return <div className='brewLookup'>
+		return <div className='brewUtil brewLookup'>
 			<h2>Brew Lookup</h2>
 			<input type='text' value={this.state.query} onChange={this.handleChange} placeholder='edit or share id' />
 			<button onClick={this.lookup}>
@@ -106,7 +104,7 @@ const BrewLookup = createClass({
 
 			{this.state.foundBrew
 				? this.renderFoundBrew()
-				: <div className='noBrew'>No brew found.</div>
+				: <div className='result noBrew'>No brew found.</div>
 			}
 		</div>;
 	}
diff --git a/client/admin/brewUtils/brewLookup/brewLookup.less b/client/admin/brewUtils/brewLookup/brewLookup.less
deleted file mode 100644
index da15e3a64..000000000
--- a/client/admin/brewUtils/brewLookup/brewLookup.less
+++ /dev/null
@@ -1,6 +0,0 @@
-.brewLookup {
-    .cleanButton {
-        display : inline-block;
-        width   : 100%;
-    }
-}
\ No newline at end of file
diff --git a/client/admin/brewUtils/brewUtils.jsx b/client/admin/brewUtils/brewUtils.jsx
index de8c29895..bab2cb82f 100644
--- a/client/admin/brewUtils/brewUtils.jsx
+++ b/client/admin/brewUtils/brewUtils.jsx
@@ -1,6 +1,6 @@
 const React = require('react');
 const createClass = require('create-react-class');
-
+require('./brewUtils.less');
 
 const BrewCleanup = require('./brewCleanup/brewCleanup.jsx');
 const BrewLookup = require('./brewLookup/brewLookup.jsx');
diff --git a/client/admin/brewUtils/brewUtils.less b/client/admin/brewUtils/brewUtils.less
new file mode 100644
index 000000000..5bbbc3f69
--- /dev/null
+++ b/client/admin/brewUtils/brewUtils.less
@@ -0,0 +1,29 @@
+.brewUtil {
+	.result {
+		margin-top : 20px;
+		button {
+			margin-right     : 10px;
+			background-color : @red;
+		}
+	}
+	.cleanButton {
+		display : inline-block;
+		width   : 100%;
+	}
+}
+
+.stats {
+	position : relative;
+	
+	.pending {
+		position : absolute;
+		top      : 0.5em;
+		left     : 100px;
+		width    : 100%;
+		height   : 100%;
+	}
+
+	&:has(.pending) { opacity : 0.5; }
+
+	dl { grid-template-columns : 200px 250px; }
+}
\ No newline at end of file
diff --git a/client/admin/brewUtils/stats/stats.jsx b/client/admin/brewUtils/stats/stats.jsx
index 85ce10610..7f96618f9 100644
--- a/client/admin/brewUtils/stats/stats.jsx
+++ b/client/admin/brewUtils/stats/stats.jsx
@@ -1,11 +1,8 @@
-require('./stats.less');
 const React       = require('react');
 const createClass = require('create-react-class');
-const cx          = require('classnames');
 
 const request = require('superagent');
 
-
 const Stats = createClass({
 	displayName : 'Stats',
 	getDefaultProps(){
@@ -14,7 +11,8 @@ const Stats = createClass({
 	getInitialState(){
 		return {
 			stats : {
-				totalBrews : 0
+				totalBrews          : 0,
+				totalPublishedBrews : 0
 			},
 			fetching : false
 		};
@@ -29,11 +27,13 @@ const Stats = createClass({
 			.finally(()=>this.setState({ fetching: false }));
 	},
 	render(){
-		return <div className='Stats'>
+		return <div className='brewUtil stats'>
 			<h2> Stats </h2>
 			<dl>
 				<dt>Total Brew Count</dt>
 				<dd>{this.state.stats.totalBrews}</dd>
+				<dt>Total Brews Published</dt>
+				<dd>{this.state.stats.totalPublishedBrews}</dd>
 			</dl>
 
 			{this.state.fetching
diff --git a/client/admin/brewUtils/stats/stats.less b/client/admin/brewUtils/stats/stats.less
deleted file mode 100644
index b5a4612e1..000000000
--- a/client/admin/brewUtils/stats/stats.less
+++ /dev/null
@@ -1,13 +0,0 @@
-
-.Stats {
-	position : relative;
-	
-	.pending {
-		position         : absolute;
-		top              : 0px;
-		left             : 0px;
-		width            : 100%;
-		height           : 100%;
-		background-color : rgba(238,238,238, 0.5);
-	}
-}
\ No newline at end of file
diff --git a/client/admin/notificationUtils/notificationAdd/notificationAdd.less b/client/admin/notificationUtils/notificationAdd/notificationAdd.less
index 878da24c2..14bdabd03 100644
--- a/client/admin/notificationUtils/notificationAdd/notificationAdd.less
+++ b/client/admin/notificationUtils/notificationAdd/notificationAdd.less
@@ -6,31 +6,32 @@
 
 	.field {
 		display               : grid;
-		grid-template-columns : 120px 150px;
+		grid-template-columns : 120px 200px;
 		align-items           : center;
 		justify-items         : stretch;
 		width                 : 100%;
 		margin-bottom         : 20px;
-   
-	
+
 		input {
 			height        : 33px;
 			padding       : 0px 10px;
 			margin-bottom : unset;
 			font-family   : monospace;
+
+			&[type='date'] { width : 14ch; }
 		}
 	
 		textarea {
 			width      : 50ch;
 			min-height : 7em;
 			max-height : 20em;
-			resize     : vertical;
 			padding	   : 10px;
+			resize     : vertical;
 		}
 	}
 
 	button {
-	width: 200px;
+		width : 200px;
 		
 		i { margin-right : 10px; }
 	}
diff --git a/client/admin/notificationUtils/notificationLookup/notificationLookup.less b/client/admin/notificationUtils/notificationLookup/notificationLookup.less
index 3f9b78310..65903213c 100644
--- a/client/admin/notificationUtils/notificationLookup/notificationLookup.less
+++ b/client/admin/notificationUtils/notificationLookup/notificationLookup.less
@@ -1,8 +1,8 @@
-
 .notificationLookup {
 	width     : 450px;
-	height	  : fit-content;
+	height    : fit-content;
 
+	.noNotification { margin-block : 20px; }
 	.notificationList {
 		display        : flex;
 		flex-direction : column;
@@ -30,11 +30,6 @@
 				font-size   : 20px;
 				font-weight : 900;
 			}
-
-			dl dt{
-				font-weight: 900;
-			}
 		}
 	}
-	.noNotification { margin-block : 20px; }
 }
\ No newline at end of file
diff --git a/client/components/Anchored.less b/client/components/Anchored.less
index 4f0e2fa8f..aeb9f1d5f 100644
--- a/client/components/Anchored.less
+++ b/client/components/Anchored.less
@@ -1,13 +1,11 @@
 
 
 .anchored-box {
-	position:absolute;
-	@supports (inset-block-start: anchor(bottom)){
-		inset-block-start: anchor(bottom);
-	}
-	justify-self: anchor-center;
-	visibility: hidden;
-	&.active {
-		visibility: visible;
+	position     : absolute;
+	visibility   : hidden;
+	justify-self : anchor-center;
+	@supports (inset-block-start: anchor(bottom)) {
+		inset-block-start : anchor(bottom);
 	}
+	&.active { visibility : visible; }
 }
\ No newline at end of file
diff --git a/client/components/combobox.jsx b/client/components/combobox.jsx
index 56633bbdd..ae9f1d7f8 100644
--- a/client/components/combobox.jsx
+++ b/client/components/combobox.jsx
@@ -45,6 +45,7 @@ const Combobox = createClass({
 	},
 	handleDropdown : function(show){
 		this.setState({
+			value        : show ? '' : this.props.default,
 			showDropdown : show,
 			inputFocused : this.props.autoSuggest.clearAutoSuggestOnClick ? show : false
 		});
@@ -78,7 +79,7 @@ const Combobox = createClass({
 						if(!e.target.checkValidity()){
 							this.setState({
 								value : this.props.default
-							}, ()=>this.props.onEntry(e));
+							});
 						}
 					}}
 				/>
diff --git a/client/components/combobox.less b/client/components/combobox.less
index d58019f6f..27f78356b 100644
--- a/client/components/combobox.less
+++ b/client/components/combobox.less
@@ -27,7 +27,7 @@
 			position    : relative;
 			padding     : 5px;
 			margin      : 0 3px;
-			font-family : "Open Sans";
+			font-family : 'Open Sans';
 			font-size   : 11px;
 			cursor      : default;
 			&:hover {
diff --git a/client/homebrew/brewRenderer/brewRenderer.jsx b/client/homebrew/brewRenderer/brewRenderer.jsx
index a82ea8b34..21c0608bd 100644
--- a/client/homebrew/brewRenderer/brewRenderer.jsx
+++ b/client/homebrew/brewRenderer/brewRenderer.jsx
@@ -39,7 +39,7 @@ const BrewPage = (props)=>{
 		...props
 	};
 	const pageRef = useRef(null);
-	const cleanText = safeHTML(props.contents);
+	const cleanText = safeHTML(`${props.contents}\n<div class="columnSplit"></div>\n`);
 
 	useEffect(()=>{
 		if(!pageRef.current) return;
@@ -189,14 +189,13 @@ const BrewRenderer = (props)=>{
 				const injectedTags = firstLineTokens.find((obj)=>obj.injectedTags !== undefined)?.injectedTags;
 				if(injectedTags) {
 					styles     = { ...styles, ...injectedTags.styles };
-					styles     = _.mapKeys(styles, (v, k) => k.startsWith('--') ? k : _.camelCase(k)); // Convert CSS to camelCase for React
+					styles     = _.mapKeys(styles, (v, k)=>k.startsWith('--') ? k : _.camelCase(k)); // Convert CSS to camelCase for React
 					classes    = [classes, injectedTags.classes].join(' ').trim();
 					attributes = injectedTags.attributes;
 				}
 				pageText = pageText.includes('\n') ? pageText.substring(pageText.indexOf('\n') + 1) : ''; // Remove the \page line
 			}
 
-			pageText += `\n\n&nbsp;\n\\column\n&nbsp;`; //Artificial column break at page end to emulate column-fill:auto (until `wide` is used, when column-fill:balance will reappear)
 			const html = Markdown.render(pageText, index);
 
 			return <BrewPage className={classes} index={index} key={index} contents={html} style={styles} attributes={attributes} onVisibilityChange={handlePageVisibilityChange} />;
diff --git a/client/homebrew/brewRenderer/brewRenderer.less b/client/homebrew/brewRenderer/brewRenderer.less
index 68c688fb6..128c419be 100644
--- a/client/homebrew/brewRenderer/brewRenderer.less
+++ b/client/homebrew/brewRenderer/brewRenderer.less
@@ -1,43 +1,39 @@
 @import (multiple, less) 'shared/naturalcrit/styles/reset.less';
 
 .brewRenderer {
+	height        : 100vh;
+	padding-top   : 60px;
 	overflow-y    : scroll;
 	will-change   : transform;
-	padding-top   : 60px;
-	height        : 100vh;
-	&:has(.facing, .flow) {
-		padding : 60px 30px;
-	}
-	&.deployment {
-		background-color: darkred;
-	}
+	&:has(.facing, .flow) { padding : 60px 30px; }
+	&.deployment { background-color : darkred; }
 	:where(.pages) {
 		&.facing {
-			display: grid; 
-			grid-template-columns: repeat(2, auto); 
-			grid-template-rows: repeat(3, auto); 
-			gap: 10px 10px; 
-			justify-content: safe center;
+			display               : grid; 
+			grid-template-rows    : repeat(3, auto); 
+			grid-template-columns : repeat(2, auto); 
+			gap                   : 10px 10px; 
+			justify-content       : safe center;
 			&.recto .page:first-child {
 				// sets first page on 'right' ('recto') of the preview, as if for a Cover page.  
 				// todo: add a checkbox to toggle this setting
-				grid-column-start: 2; 
+				grid-column-start : 2; 
 			}
 			& :where(.page) {
-				margin-left: unset !important;
-				margin-right: unset !important;
+				margin-right : unset !important;
+				margin-left  : unset !important;
 			}
 		}
 
 		&.flow {
-			display: flex;
-			flex-wrap: wrap;
-			gap: 10px;
-			justify-content: safe center;
+			display         : flex;
+			flex-wrap       : wrap;
+			gap             : 10px;
+			justify-content : safe center;
 			& :where(.page) {
-				flex: 0 0 auto;
-				margin-left: unset !important;
-				margin-right: unset !important;
+				flex         : 0 0 auto;
+				margin-right : unset !important;
+				margin-left  : unset !important;
 			}
 
 		}
@@ -50,9 +46,7 @@
 			margin-left   : auto;
 			box-shadow    : 1px 4px 14px #000000;
 		}
-		*[id] {
-			scroll-margin-top:100px;
-		}
+		*[id] { scroll-margin-top : 100px; }
 	}
 	&::-webkit-scrollbar {
 		width : 20px;
@@ -79,11 +73,9 @@
 		overflow-y  : unset;
 		.pages {
 			margin : 0px;
-			zoom: 100% !important;
+			zoom   : 100% !important;
 			& > .page { box-shadow : unset; }
 		}
 	}
-	.headerNav {
-		visibility: hidden;
-	}
+	.headerNav { visibility : hidden; }
 }
\ No newline at end of file
diff --git a/client/homebrew/brewRenderer/headerNav/headerNav.jsx b/client/homebrew/brewRenderer/headerNav/headerNav.jsx
index 68963129f..04ced2585 100644
--- a/client/homebrew/brewRenderer/headerNav/headerNav.jsx
+++ b/client/homebrew/brewRenderer/headerNav/headerNav.jsx
@@ -3,7 +3,6 @@ require('./headerNav.less');
 import * as React from 'react';
 import * as _ from 'lodash';
 
-
 const MAX_TEXT_LENGTH = 40;
 
 const HeaderNav = React.forwardRef(({}, pagesRef)=>{
@@ -11,11 +10,30 @@ const HeaderNav = React.forwardRef(({}, pagesRef)=>{
 	const renderHeaderLinks = ()=>{
 		if(!pagesRef.current) return;
 
+		// Top Level Pages
+		// Pages that contain an element with a specified class (e.g. cover pages, table of contents)
+		// will NOT have its content scanned for navigation headers, instead displaying a custom label
+		// ---
+		// The property name is class that will be used for detecting the page is a top level page
+		// The property value is a function that returns the text to be used
+
+		const topLevelPages = {
+			'.frontCover'  : (el, pageType)=>{ const text = getHeaderContent(el); return text ? `Cover: ${text}` : 'Cover Page'; },
+			'.insideCover' : (el, pageType)=>{ const text = getHeaderContent(el); return text ? `Interior: ${text}` : 'Interior Cover Page'; },
+			'.partCover'   : (el, pageType)=>{ const text = getHeaderContent(el); return text ? `Section: ${text}` : 'Section Cover Page'; },
+			'.backCover'   : (el, pageType)=>{ const text = getHeaderContent(el); return text ? `Back: ${text}` : 'Rear Cover Page'; },
+			'.toc'         : ()=>{ return 'Table of Contents'; },
+		};
+
+		const getHeaderContent = (el)=>el.querySelector('h1')?.textContent;
+
+		const topLevelPageSelector = Object.keys(topLevelPages).join(',');
+
 		const selector = [
-			'.pages > .page',									// All page elements, which by definition have IDs
-			'.page:not(:has(.toc)) > [id]',						// All direct children of non-ToC .page with an ID (Legacy)
-			'.page:not(:has(.toc)) > .columnWrapper > [id]',	// All direct children of non-ToC .page > .columnWrapper with an ID (V3)
-			'.page:not(:has(.toc)) h2',							// All non-ToC H2 titles, like Monster frame titles
+			'.pages > .page',                                                   // All page elements, which by definition have IDs
+			`.page:not(:has(${topLevelPageSelector})) > [id]`,                  // All direct children of non-excluded .pages with an ID (Legacy)
+			`.page:not(:has(${topLevelPageSelector})) > .columnWrapper > [id]`, // All direct children of non-excluded .page > .columnWrapper with an ID (V3)
+			`.page:not(:has(${topLevelPageSelector})) h2`,                      // All non-excluded H2 titles, like Monster frame titles
 		];
 		const elements = pagesRef.current.querySelectorAll(selector.join(','));
 		if(!elements) return;
@@ -23,45 +41,35 @@ const HeaderNav = React.forwardRef(({}, pagesRef)=>{
 
 		// navList is a list of objects which have the following structure:
 		// {
-		// 		depth		: how deeply indented the item should be
-		// 		text		: the text to display in the nav link
-		// 		link		: the hyperlink to navigate to when clicked
-		// 		className	: [optional] the class to apply to the nav link for styling
+		// 	depth     : how deeply indented the item should be
+		// 	text      : the text to display in the nav link
+		// 	link      : the hyperlink to navigate to when clicked
+		// 	className : [optional] the class to apply to the nav link for styling
 		// }
 
 		elements.forEach((el)=>{
-			if(el.className.match(/\bpage\b/)) {
-				let text = `Page ${el.id.slice(1)}`;	// The ID of a page *should* always be equal to `p` followed by the page number
-				if(el.querySelector('.toc')){			// If the page contains a table of contents, add "- Contents" to the display text
-					text += ' - Contents';
-				};
-				navList.push({
-					depth     : 0,						// Pages are always at the least indented level
-					text      : text,
-					link      : el.id,
-					className : 'pageLink'
-				});
-				return;
-			}
-			if(el.localName.match(/^h[1-6]/)){			// Header elements H1 through H6
-				navList.push({
-					depth : el.localName[1],			// Depth is set by the header level
-					text  : el.textContent,				// Use `textContent` because `innerText` is affected by rendering, e.g. 'content-visibility: auto'
-					link  : el.id
-				});
-				return;
-			}
-			navList.push({
-				depth : 7,								// All unmatched elements with IDs are set to the maximum depth (7)
-				text  : el.textContent,					// Use `textContent` because `innerText` is affected by rendering, e.g. 'content-visibility: auto'
+			const navEntry = {        // Default structure of a navList entry
+				depth : 7,              // All unmatched elements with IDs are set to the maximum depth (7)
+				text  : el.textContent, // Use `textContent` because `innerText` is affected by rendering, e.g. 'content-visibility: auto'
 				link  : el.id
-			});
-		});
-
-		return _.map(navList, (navItem, index)=>{
-			return <HeaderNavItem {...navItem} key={index} />;
+			};
+			if(el.classList.contains('page')) {
+				let text = `Page ${el.id.slice(1)}`; // Get the page # by trimming off the 'p' from the ID
+				const pageType = Object.keys(topLevelPages).find((pageType)=>el.querySelector(pageType));
+				if(pageType)
+					text += ` - ${topLevelPages[pageType](el, pageType)}`; // If a Top Level Page, add extra label
+
+				navEntry.depth     = 0; // Pages are always at the least indented level
+				navEntry.text      = text;
+				navEntry.className = 'pageLink';
+			} else if(el.localName.match(/^h[1-6]/)){  // Header elements H1 through H6
+				navEntry.depth = el.localName[1];      // Depth is set by the header level
+			}
+			navList.push(navEntry);
 		});
 
+		return _.map(navList, (navItem, index)=><HeaderNavItem {...navItem} key={index} />
+		);
 	};
 
 	return <nav className='headerNav'>
@@ -69,8 +77,7 @@ const HeaderNav = React.forwardRef(({}, pagesRef)=>{
 			{renderHeaderLinks()}
 		</ul>
 	</nav>;
-}
-);
+});
 
 const HeaderNavItem = ({ link, text, depth, className })=>{
 
diff --git a/client/homebrew/brewRenderer/headerNav/headerNav.less b/client/homebrew/brewRenderer/headerNav/headerNav.less
index 8b35041d9..a5fd11f5e 100644
--- a/client/homebrew/brewRenderer/headerNav/headerNav.less
+++ b/client/homebrew/brewRenderer/headerNav/headerNav.less
@@ -1,45 +1,37 @@
 .headerNav {
-	position: fixed;
-	top: 32px;
-	left: 0px;
-	padding: 5px 10px;
-	background-color: #ccc;
-	border-radius: 5px;
-	max-height: calc(100vh - 32px);
-	max-width: 40vw;
-	overflow-y: auto;
-    &.active {
-        padding-bottom: 10px;
-        .navIcon {
-            padding-bottom: 10px;
-        }
-    }
-	.navIcon {
-		cursor: pointer;
+	position         : fixed;
+	top              : 32px;
+	left             : 0px;
+	max-width        : 40vw;
+	max-height       : calc(100vh - 32px);
+	padding          : 5px 10px;
+	overflow-y       : auto;
+	background-color : #CCCCCC;
+	border-radius    : 5px;
+	&.active {
+		padding-bottom : 10px;
+		.navIcon { padding-bottom : 10px; }
 	}
+	.navIcon { cursor : pointer; }
 	li {
-		list-style-type: none;
+		list-style-type : none;
 		a {
-			display: inline-block;
-			width: 100%;
-			font-family: 'Open Sans';
-			font-size: 12px;
-			padding: 2px;
-			color: inherit;
-			text-decoration: none;
-			cursor: pointer;
-			&:hover {
-				text-decoration: underline;
-			}
-			&.pageLink {
-				font-weight: 900;
-			}
+			display         : inline-block;
+			width           : 100%;
+			padding         : 2px;
+			font-family     : 'Open Sans';
+			font-size       : 12px;
+			color           : inherit;
+			text-decoration : none;
+			cursor          : pointer;
+			&:hover { text-decoration : underline; }
+			&.pageLink { font-weight : 900; }
 
-			@depths: 1,2,3,4,5,6,7;
+			@depths: 0,1,2,3,4,5,6,7;
 
 			each(@depths, {
 				&.depth-@{value} {
-					padding-left: ((@value - 1) * 0.5em);
+					padding-left: ((@value) * 0.5em);
 				}
 			});
 		}
diff --git a/client/homebrew/brewRenderer/notificationPopup/notificationPopup.less b/client/homebrew/brewRenderer/notificationPopup/notificationPopup.less
index be642f0fe..85d4c8365 100644
--- a/client/homebrew/brewRenderer/notificationPopup/notificationPopup.less
+++ b/client/homebrew/brewRenderer/notificationPopup/notificationPopup.less
@@ -86,8 +86,8 @@
 		width            : 100%;
 	}
 	.blank {
-		height           : 1em;
-		margin-top       : 0;
+		height     : 1em;
+		margin-top : 0;
 		& + * { margin-top : 0; }
 	}
 }
\ No newline at end of file
diff --git a/client/homebrew/brewRenderer/toolBar/toolBar.less b/client/homebrew/brewRenderer/toolBar/toolBar.less
index a24731489..8f1464c8f 100644
--- a/client/homebrew/brewRenderer/toolBar/toolBar.less
+++ b/client/homebrew/brewRenderer/toolBar/toolBar.less
@@ -156,7 +156,7 @@
 		min-width        : 46px;
 		height           : 100%;
 		&:hover { background-color : #444444; }
-		&:focus { border  : 1px solid #D3D3D3;outline : none;}
+		&:focus {outline : none; border  : 1px solid #D3D3D3;}
 		&:disabled {
 			color            : #777777;
 			background-color : unset !important;
@@ -182,8 +182,8 @@
 	position  : absolute;
 	left      : 0;
 	z-index   : 5;
+	display   : flex;
 	width     : 32px;
 	min-width : unset;
 	height    : 100%;
-	display   : flex;
 }
\ No newline at end of file
diff --git a/client/homebrew/editor/editor.jsx b/client/homebrew/editor/editor.jsx
index 2d0a26268..9e6178f3e 100644
--- a/client/homebrew/editor/editor.jsx
+++ b/client/homebrew/editor/editor.jsx
@@ -456,6 +456,7 @@ const Editor = createClass({
 					rerenderParent={this.rerenderParent} />
 				<MetadataEditor
 					metadata={this.props.brew}
+					themeBundle={this.props.themeBundle}
 					onChange={this.props.onMetaChange}
 					reportError={this.props.reportError}
 					userThemes={this.props.userThemes}/>
diff --git a/client/homebrew/editor/editor.less b/client/homebrew/editor/editor.less
index b2e96683e..5511bee6e 100644
--- a/client/homebrew/editor/editor.less
+++ b/client/homebrew/editor/editor.less
@@ -1,8 +1,8 @@
 @import 'themes/codeMirror/customEditorStyles.less';
 .editor {
-	position : relative;
-	width    : 100%;
-	container: editor / inline-size;
+	position  : relative;
+	width     : 100%;
+	container : editor / inline-size;
 
 	.codeEditor {
 		height            : 100%;
@@ -45,26 +45,26 @@
 			color       : green;
 		}
 		.emoji:not(.cm-comment) {
-			margin-left    : 2px;
-			color          : #360034;
-			background     : #ffc8ff;
-			border-radius  : 6px;
-			font-weight    : bold;
 			padding-bottom : 1px;
+			margin-left    : 2px;
+			font-weight    : bold;
+			color          : #360034;
+			outline        : solid 2px #FF96FC;
 			outline-offset : -2px;
-			outline        : solid 2px #ff96fc;
+			background     : #FFC8FF;
+			border-radius  : 6px;
 		}
 		.superscript:not(.cm-comment) {
-			font-weight    : bold;
-			color          : goldenrod;
-			vertical-align : super;
 			font-size      : 0.9em;
+			font-weight    : bold;
+			vertical-align : super;
+			color          : goldenrod;
 		}
 		.subscript:not(.cm-comment) {
-			font-weight    : bold;
-			color          : rgb(123, 123, 15);
-			vertical-align : sub;
 			font-size      : 0.9em;
+			font-weight    : bold;
+			vertical-align : sub;
+			color          : rgb(123, 123, 15);
 		}
 		.dl-highlight {
 			&.dl-colon-highlight {
diff --git a/client/homebrew/editor/metadataEditor/metadataEditor.jsx b/client/homebrew/editor/metadataEditor/metadataEditor.jsx
index 9d2ec7db6..8f256922f 100644
--- a/client/homebrew/editor/metadataEditor/metadataEditor.jsx
+++ b/client/homebrew/editor/metadataEditor/metadataEditor.jsx
@@ -4,7 +4,6 @@ const React = require('react');
 const createClass = require('create-react-class');
 const _     = require('lodash');
 import request from '../../utils/request-middleware.js';
-const Nav = require('naturalcrit/nav/nav.jsx');
 const Combobox = require('client/components/combobox.jsx');
 const TagInput = require('../tagInput/tagInput.jsx');
 
@@ -40,6 +39,7 @@ const MetadataEditor = createClass({
 				theme       : '5ePHB',
 				lang        : 'en'
 			},
+
 			onChange    : ()=>{},
 			reportError : ()=>{}
 		};
@@ -67,6 +67,11 @@ const MetadataEditor = createClass({
 		const inputRules = validations[name] ?? [];
 		const validationErr = inputRules.map((rule)=>rule(e.target.value)).filter(Boolean);
 
+		const debouncedReportValidity = _.debounce((target, errMessage)=>{
+			callIfExists(target, 'setCustomValidity', errMessage);
+			callIfExists(target, 'reportValidity');
+		}, 300); // 300ms debounce delay, adjust as needed
+
 		// if no validation rules, save to props
 		if(validationErr.length === 0){
 			callIfExists(e.target, 'setCustomValidity', '');
@@ -74,14 +79,16 @@ const MetadataEditor = createClass({
 				...this.props.metadata,
 				[name] : e.target.value
 			});
+			return true;
 		} else {
 			// if validation issues, display built-in browser error popup with each error.
 			const errMessage = validationErr.map((err)=>{
 				return `- ${err}`;
 			}).join('\n');
 
-			callIfExists(e.target, 'setCustomValidity', errMessage);
-			callIfExists(e.target, 'reportValidity');
+
+			debouncedReportValidity(e.target, errMessage);
+			return false;
 		}
 	},
 
@@ -102,6 +109,7 @@ const MetadataEditor = createClass({
 		}
 		this.props.onChange(this.props.metadata, 'renderer');
 	},
+
 	handlePublish : function(val){
 		this.props.onChange({
 			...this.props.metadata,
@@ -112,6 +120,14 @@ const MetadataEditor = createClass({
 	handleTheme : function(theme){
 		this.props.metadata.renderer = theme.renderer;
 		this.props.metadata.theme    = theme.path;
+
+		this.props.onChange(this.props.metadata, 'theme');
+	},
+
+	handleThemeWritein : function(e) {
+		const shareId = e.target.value.split('/').pop(); //Extract just the ID if a URL was pasted in
+		this.props.metadata.theme = shareId;
+
 		this.props.onChange(this.props.metadata, 'theme');
 	},
 
@@ -200,7 +216,7 @@ const MetadataEditor = createClass({
 				if(theme.path == this.props.metadata.shareId) return;
 				const preview = theme.thumbnail || `/themes/${theme.renderer}/${theme.path}/dropdownPreview.png`;
 				const texture = theme.thumbnail || `/themes/${theme.renderer}/${theme.path}/dropdownTexture.png`;
-				return <div className='item' key={`${renderer}_${theme.name}`} onClick={()=>this.handleTheme(theme)} title={''}>
+				return <div className='item' key={`${renderer}_${theme.name}`} value={`${theme.author ?? renderer} : ${theme.name}`} data={theme} title={''}>
 					{theme.author ?? renderer} : {theme.name}
 					<div className='texture-container'>
 						<img src={texture}/>
@@ -210,26 +226,40 @@ const MetadataEditor = createClass({
 						<img src={preview}/>
 					</div>
 				</div>;
-			});
+			}).filter(Boolean);
 		};
 
 		const currentRenderer = this.props.metadata.renderer;
-		const currentTheme    = mergedThemes[`${_.upperFirst(this.props.metadata.renderer)}`][this.props.metadata.theme]
-													?? { name: `!!! THEME MISSING !!! ID=${this.props.metadata.theme}` };
+		const currentThemeDisplay = this.props.themeBundle?.name ? `${this.props.themeBundle.author ?? currentRenderer} : ${this.props.themeBundle.name}` : 'No Theme Selected';
 		let dropdown;
 
 		if(currentRenderer == 'legacy') {
 			dropdown =
-				<Nav.dropdown className='disabled value' trigger='disabled'>
-					<div> {`Themes are not supported in the Legacy Renderer`} <i className='fas fa-caret-down'></i> </div>
-				</Nav.dropdown>;
+				<div className='disabled value' trigger='disabled'>
+					<div> Themes are not supported in the Legacy Renderer </div>
+				</div>;
 		} else {
 			dropdown =
-				<Nav.dropdown className='value' trigger='click'>
-					<div> {currentTheme.author ?? _.upperFirst(currentRenderer)} : {currentTheme.name} <i className='fas fa-caret-down'></i> </div>
-
-					{listThemes(currentRenderer)}
-				</Nav.dropdown>;
+				<div className='value'>
+					<Combobox trigger='click'
+						className='themes-dropdown'
+						default={currentThemeDisplay}
+						placeholder='Select from below, or enter the Share URL or ID of a brew with the meta:theme tag'
+						onSelect={(value)=>this.handleTheme(value)}
+						onEntry={(e)=>{
+							e.target.setCustomValidity('');	//Clear the validation popup while typing
+							if(this.handleFieldChange('theme', e))
+								this.handleThemeWritein(e);
+						}}
+						options={listThemes(currentRenderer)}
+						autoSuggest={{
+							suggestMethod           : 'includes',
+							clearAutoSuggestOnClick : true,
+							filterOn                : ['value', 'title']
+						}}
+					/>
+					<small>Select from the list below (built-in themes and brews you have tagged "meta:theme"), or paste in the Share URL or Share ID of any brew.</small>
+				</div>;
 		}
 
 		return <div className='field themes'>
@@ -251,8 +281,6 @@ const MetadataEditor = createClass({
 			});
 		};
 
-		const debouncedHandleFieldChange =  _.debounce(this.handleFieldChange, 500);
-
 		return <div className='field language'>
 			<label>language</label>
 			<div className='value'>
@@ -263,7 +291,7 @@ const MetadataEditor = createClass({
 					onSelect={(value)=>this.handleLanguage(value)}
 					onEntry={(e)=>{
 						e.target.setCustomValidity('');	//Clear the validation popup while typing
-						debouncedHandleFieldChange('lang', e);
+						this.handleFieldChange('lang', e);
 					}}
 					options={listLanguages()}
 					autoSuggest={{
@@ -271,8 +299,7 @@ const MetadataEditor = createClass({
 						clearAutoSuggestOnClick : true,
 						filterOn                : ['value', 'detail', 'title']
 					}}
-				>
-				</Combobox>
+				/>
 				<small>Sets the HTML Lang property for your brew. May affect hyphenation or spellcheck.</small>
 			</div>
 
@@ -345,7 +372,7 @@ const MetadataEditor = createClass({
 				placeholder='add tag' unique={true}
 				values={this.props.metadata.tags}
 				onChange={(e)=>this.handleFieldChange('tags', e)}
-				/>
+			/>
 
 			<div className='field systems'>
 				<label>systems</label>
@@ -370,7 +397,7 @@ const MetadataEditor = createClass({
 				values={this.props.metadata.invitedAuthors}
 				notes={['Invited author usernames are case sensitive.', 'After adding an invited author, send them the edit link. There, they can choose to accept or decline the invitation.']}
 				onChange={(e)=>this.handleFieldChange('invitedAuthors', e)}
-				/>
+			/>
 
 			<h2>Privacy</h2>
 
diff --git a/client/homebrew/editor/metadataEditor/metadataEditor.less b/client/homebrew/editor/metadataEditor/metadataEditor.less
index 2cff01cfe..fd04f07d9 100644
--- a/client/homebrew/editor/metadataEditor/metadataEditor.less
+++ b/client/homebrew/editor/metadataEditor/metadataEditor.less
@@ -1,28 +1,31 @@
 @import 'naturalcrit/styles/colors.less';
 
+.userThemeName {
+	padding-right : 10px;
+	padding-left  : 10px;
+}
 
 .metadataEditor {
 	position         : absolute;
-	z-index          : 5;
 	box-sizing       : border-box;
 	width            : 100%;
 	height           : calc(100vh - 54px); // 54px is the height of the navbar + snippet bar.  probably a better way to dynamic get this.
 	padding          : 25px;
 	overflow-y       : auto;
+	font-size        : 13px;
 	background-color : #999999;
-	font-size		 : 13px;
 
 	h1 {
-		margin: 0 0 40px;
-		font-weight: bold;
-		text-transform: uppercase;
+		margin         : 0 0 40px;
+		font-weight    : bold;
+		text-transform : uppercase;
 	}
 	
 	h2 {
-		margin      : 20px 0;
-		font-weight : bold;
-		border-bottom: 2px solid gray;
-		color: #555;
+		margin        : 20px 0;
+		font-weight   : bold;
+		color         : #555555;
+		border-bottom : 2px solid gray;
 	}
 
 	& > div { margin-bottom : 10px; }
@@ -51,10 +54,10 @@
 		min-width     : 200px;
 		& > label {
 			width          : 80px;
+			font-size      : 0.9em;
 			font-weight    : 800;
 			line-height    : 1.8em;
 			text-transform : uppercase;
-			font-size: .9em;
 		}
 		& > .value {
 			flex           : 1 1 auto;
@@ -71,8 +74,7 @@
 			border : 1px solid gray;
 			&:focus { outline : 1px solid #444444; }
 		}
-		&.thumbnail {
-			height      : 1.4em;
+		&.thumbnail, &.themes {
 			label { line-height : 2.0em; }
 			.value {
 				overflow      : hidden;
@@ -88,6 +90,17 @@
 			}
 		}
 
+		&.themes {
+			.value {
+				overflow      : visible;
+				text-overflow : auto;
+			}
+			button {
+				padding-right : 5px;
+				padding-left  : 5px;
+			}
+		}
+
 		&.description {
 			flex : 1;
 			textarea.value {
@@ -123,8 +136,8 @@
 			margin-right   : 15px;
 			font-size      : 0.9em;
 			font-weight    : 800;
-			white-space    : nowrap;
 			vertical-align : middle;
+			white-space    : nowrap;
 			cursor         : pointer;
 			user-select    : none;
 		}
@@ -151,94 +164,74 @@
 			.colorButton(@red);
 		}
 	}
-	.authors.field .value {
-		line-height    : 1.5em;
-	}
+	.authors.field .value { line-height    : 1.5em; }
 
 	.themes.field {
-		.navDropdownContainer {
+		& .dropdown-container {
 			position         : relative;
 			z-index          : 100;
 			background-color : white;
-			&.disabled {
-				font-style       : italic;
-				color            : dimgray;
-				background-color : darkgray;
-			}
-			& > div:first-child {
-				padding           : 3px 3px;
-				background-color  : inherit;
-				border            : 1px solid gray;
-				i { float	: right; }
-				&:hover {
-					color            : white;
-					background-color : @blue;
+		}
+		& .dropdown-options { overflow-y : visible; }
+		.disabled {
+			font-style       : italic;
+			color            : dimgray;
+			background-color : darkgray;
+		}
+		.item {
+			position          : relative;
+			padding           : 3px 3px;
+			overflow          : visible;
+			background-color  : white;
+			border-top        : 1px solid rgb(118, 118, 118);
+			.preview {
+				position       : absolute;
+				top            : 0;
+				right          : 0;
+				z-index        : 1;
+				display        : flex;
+				flex-direction : column;
+				width          : 200px;
+				overflow       : hidden;
+				color          : black;
+				background     : #CCCCCC;
+				border-radius  : 5px;
+				box-shadow     : 0 0 5px black;
+				opacity        : 0;
+				transition     : opacity 250ms ease;
+				h6 {
+					padding-block  : 0.5em;
+					padding-inline : 1em;
+					font-weight    : 900;
+					border-bottom  : 2px solid hsl(0,0%,40%);
 				}
 			}
-			.navDropdown .item > p {
-				width         : 45%;
-				height        : 1.1em;
-				overflow      : hidden;
-				text-overflow : ellipsis;
-				white-space   : nowrap;
-			}			
-			.navDropdown {
-				position	  : absolute;
-				width		    : 100%;
-				box-shadow	: 0px 5px 10px rgba(0, 0, 0, 0.3);
-				.item {
-					position          : relative;
-					padding           : 3px 3px;
-					overflow          : visible;
-					background-color  : white;
-					border-top        : 1px solid rgb(118, 118, 118);
-					.preview {
-						position       : absolute;
-						top            : 0;
-						right          : 0;
-						z-index        : 1;
-						display        : flex;
-						flex-direction : column;
-						width          : 200px;
-						overflow       : hidden;
-						color          : black;
-						background     : #CCCCCC;
-						border-radius  : 5px;
-						box-shadow     : 0 0 5px black;
-						opacity        : 0;
-						transition     : opacity 250ms ease;
-						h6 {
-							padding-block  : 0.5em;
-							padding-inline : 1em;
-							font-weight    : 900;
-							border-bottom  : 2px solid hsl(0,0%,40%);
-						}
-					}
-					&:hover {
-						color            : white;
-						background-color : @blue;
-					}
-					&:hover > .preview { opacity : 1; }
-					.texture-container {
-						position   : absolute;
-						top        : 0;
-						left       : 0;
-						width      : 100%;
-						height     : 100%;
-						min-height : 100%;
-						overflow   : hidden;
-						> img {
-							position            : absolute;
-							top                 : 0px;
-							right               : 0;
-							width               : 50%;
-							min-height          : 100%;
-							-webkit-mask-image  : linear-gradient(90deg, transparent, black 20%);
-							mask-image          : linear-gradient(90deg, transparent, black 20%);
-						}
-					}
+
+			.texture-container {
+				position   : absolute;
+				top        : 0;
+				left       : 0;
+				width      : 100%;
+				height     : 100%;
+				min-height : 100%;
+				overflow   : hidden;
+				> img {
+					position            : absolute;
+					top                 : 0;
+					right               : 0;
+					width               : 50%;
+					min-height          : 100%;
+					-webkit-mask-image  : linear-gradient(90deg, transparent, black 20%);
+					mask-image          : linear-gradient(90deg, transparent, black 20%);
 				}
 			}
+
+			&:hover {
+				color            : white;
+				background-color : @blue;
+				filter           : unset;
+			}
+			&:hover > .preview { opacity : 1; }
 		}
 	}
 
diff --git a/client/homebrew/editor/metadataEditor/validations.js b/client/homebrew/editor/metadataEditor/validations.js
index 32c8131f6..858fca6c4 100644
--- a/client/homebrew/editor/metadataEditor/validations.js
+++ b/client/homebrew/editor/metadataEditor/validations.js
@@ -27,6 +27,19 @@ module.exports = {
 		(value)=>{
 			return new RegExp(/^([a-zA-Z]{2,3})(-[a-zA-Z]{4})?(-(?:[0-9]{3}|[a-zA-Z]{2}))?$/).test(value) === false && (value.length > 0) ? 'Invalid language code.' : null;
 		}
+	],
+	theme : [
+		(value)=>{
+			const URL = global.config.baseUrl.replace(/[-/\\^$*+?.()|[\]{}]/g, '\\$&'); //Escape any regex characters
+			const shareIDPattern = '[a-zA-Z0-9-_]{12}';
+			const shareURLRegex  = new RegExp(`^${URL}\\/share\\/${shareIDPattern}$`);
+			const shareIDRegex   = new RegExp(`^${shareIDPattern}$`);
+			if(value?.length === 0)       return null;
+			if(shareURLRegex.test(value)) return null;
+			if(shareIDRegex.test(value))  return null;
+
+			return 'Must be a valid Share URL or a 12-character ID.';
+		}
 	]
 };
 
diff --git a/client/homebrew/editor/snippetbar/snippetbar.jsx b/client/homebrew/editor/snippetbar/snippetbar.jsx
index f7d9508f8..4d702bfdf 100644
--- a/client/homebrew/editor/snippetbar/snippetbar.jsx
+++ b/client/homebrew/editor/snippetbar/snippetbar.jsx
@@ -207,59 +207,59 @@ const Snippetbar = createClass({
 	renderEditorButtons : function(){
 		if(!this.props.showEditButtons) return;
 
-		
+
 
 		return (
-		<div className='editors'>
-			{this.props.view !== 'meta' && <><div className='historyTools'>
-				<div className={`editorTool snippetGroup history ${this.state.historyExists ? 'active' : ''}`}
-					onClick={this.toggleHistoryMenu} >
-					<i className='fas fa-clock-rotate-left' />
-					{ this.state.showHistory && this.renderHistoryItems() }
+			<div className='editors'>
+				{this.props.view !== 'meta' && <><div className='historyTools'>
+					<div className={`editorTool snippetGroup history ${this.state.historyExists ? 'active' : ''}`}
+						onClick={this.toggleHistoryMenu} >
+						<i className='fas fa-clock-rotate-left' />
+						{ this.state.showHistory && this.renderHistoryItems() }
+					</div>
+					<div className={`editorTool undo ${this.props.historySize.undo ? 'active' : ''}`}
+						onClick={this.props.undo} >
+						<i className='fas fa-undo' />
+					</div>
+					<div className={`editorTool redo ${this.props.historySize.redo ? 'active' : ''}`}
+						onClick={this.props.redo} >
+						<i className='fas fa-redo' />
+					</div>
 				</div>
-				<div className={`editorTool undo ${this.props.historySize.undo ? 'active' : ''}`}
-					onClick={this.props.undo} >
-					<i className='fas fa-undo' />
-				</div>
-				<div className={`editorTool redo ${this.props.historySize.redo ? 'active' : ''}`}
-					onClick={this.props.redo} >
-					<i className='fas fa-redo' />
-				</div>
-			</div>
-			<div className='codeTools'>
-			<div className={`editorTool foldAll ${this.props.foldCode ? 'active' : ''}`}
-				onClick={this.props.foldCode} >
-				<i className='fas fa-compress-alt' />
-			</div>
-			<div className={`editorTool unfoldAll ${this.props.unfoldCode ? 'active' : ''}`}
-				onClick={this.props.unfoldCode} >
-				<i className='fas fa-expand-alt' />
-			</div>
-				<div className={`editorTheme ${this.state.themeSelector ? 'active' : ''}`}
-					onClick={this.toggleThemeSelector} >
-					<i className='fas fa-palette' />
-					{this.state.themeSelector && this.renderThemeSelector()}
-				</div>
-			</div></>}
-	
+				<div className='codeTools'>
+					<div className={`editorTool foldAll ${this.props.foldCode ? 'active' : ''}`}
+						onClick={this.props.foldCode} >
+						<i className='fas fa-compress-alt' />
+					</div>
+					<div className={`editorTool unfoldAll ${this.props.unfoldCode ? 'active' : ''}`}
+						onClick={this.props.unfoldCode} >
+						<i className='fas fa-expand-alt' />
+					</div>
+					<div className={`editorTheme ${this.state.themeSelector ? 'active' : ''}`}
+						onClick={this.toggleThemeSelector} >
+						<i className='fas fa-palette' />
+						{this.state.themeSelector && this.renderThemeSelector()}
+					</div>
+				</div></>}
 
-			<div className='tabs'>
-				<div className={cx('text', { selected: this.props.view === 'text' })}
-					onClick={()=>this.props.onViewChange('text')}>
-					<i className='fa fa-beer' />
-				</div>
-				<div className={cx('style', { selected: this.props.view === 'style' })}
-					onClick={()=>this.props.onViewChange('style')}>
-					<i className='fa fa-paint-brush' />
-				</div>
-				<div className={cx('meta', { selected: this.props.view === 'meta' })}
-					onClick={()=>this.props.onViewChange('meta')}>
-					<i className='fas fa-info-circle' />
-				</div>
-			</div>
 
-		</div>
-		)
+				<div className='tabs'>
+					<div className={cx('text', { selected: this.props.view === 'text' })}
+						onClick={()=>this.props.onViewChange('text')}>
+						<i className='fa fa-beer' />
+					</div>
+					<div className={cx('style', { selected: this.props.view === 'style' })}
+						onClick={()=>this.props.onViewChange('style')}>
+						<i className='fa fa-paint-brush' />
+					</div>
+					<div className={cx('meta', { selected: this.props.view === 'meta' })}
+						onClick={()=>this.props.onViewChange('meta')}>
+						<i className='fas fa-info-circle' />
+					</div>
+				</div>
+
+			</div>
+		);
 	},
 
 	render : function(){
diff --git a/client/homebrew/editor/snippetbar/snippetbar.less b/client/homebrew/editor/snippetbar/snippetbar.less
index 7d56dc718..0860a44bf 100644
--- a/client/homebrew/editor/snippetbar/snippetbar.less
+++ b/client/homebrew/editor/snippetbar/snippetbar.less
@@ -22,7 +22,7 @@
 		justify-content : flex-end;
 		min-width       : 225px;
 
-		&:only-child { margin-left : auto;min-width:unset;}
+		&:only-child {min-width   : unset; margin-left : auto;}
 
 		>div {
 			display         : flex;
@@ -39,9 +39,7 @@
 				text-align  : center;
 				cursor      : pointer;
 
-				&.editorTool:not(.active) {
-					cursor:not-allowed;
-				}
+				&.editorTool:not(.active) { cursor : not-allowed; }
 
 				&:hover,&.selected { background-color : #999999; }
 				&.text {
@@ -151,9 +149,9 @@
 			position         : absolute;
 			top              : 100%;
 			z-index          : 1000;
+			visibility       : hidden;
 			padding          : 0px;
 			margin-left      : -5px;
-			visibility       : hidden;
 			background-color : #DDDDDD;
 			.snippet {
 				position    : relative;
diff --git a/client/homebrew/editor/tagInput/tagInput.jsx b/client/homebrew/editor/tagInput/tagInput.jsx
index 816541167..d60e23b1b 100644
--- a/client/homebrew/editor/tagInput/tagInput.jsx
+++ b/client/homebrew/editor/tagInput/tagInput.jsx
@@ -3,43 +3,43 @@ const React = require('react');
 const { useState, useEffect } = React;
 const _     = require('lodash');
 
-const TagInput = ({ unique = true, values = [], ...props }) => {
+const TagInput = ({ unique = true, values = [], ...props })=>{
 	const [tempInputText, setTempInputText] = useState('');
-	const [tagList, setTagList] = useState(values.map((value) => ({ value, editing: false })));
+	const [tagList, setTagList] = useState(values.map((value)=>({ value, editing: false })));
 
 	useEffect(()=>{
-		handleChange(tagList.map((context)=>context.value))
-	}, [tagList])
+		handleChange(tagList.map((context)=>context.value));
+	}, [tagList]);
 
 	const handleChange = (value)=>{
 		props.onChange({
 			target : { value }
-		})
+		});
 	};
 
-	const handleInputKeyDown = ({ evt, value, index, options = {} }) => {
-		if (_.includes(['Enter', ','], evt.key)) {
+	const handleInputKeyDown = ({ evt, value, index, options = {} })=>{
+		if(_.includes(['Enter', ','], evt.key)) {
 			evt.preventDefault();
 			submitTag(evt.target.value, value, index);
-			if (options.clear) {
+			if(options.clear) {
 				setTempInputText('');
 			}
 		}
 	};
 
-	const submitTag = (newValue, originalValue, index) => {
-		setTagList((prevContext) => {
+	const submitTag = (newValue, originalValue, index)=>{
+		setTagList((prevContext)=>{
 			// remove existing tag
 			if(newValue === null){
 				return [...prevContext].filter((context, i)=>i !== index);
 			}
 			// add new tag
 			if(originalValue === null){
-				return [...prevContext, { value: newValue, editing: false }]
+				return [...prevContext, { value: newValue, editing: false }];
 			}
 			// update existing tag
-			return prevContext.map((context, i) => {
-				if (i === index) {
+			return prevContext.map((context, i)=>{
+				if(i === index) {
 					return { ...context, value: newValue, editing: false };
 				}
 				return context;
@@ -47,10 +47,10 @@ const TagInput = ({ unique = true, values = [], ...props }) => {
 		});
 	};
 
-	const editTag = (index) => {
-		setTagList((prevContext) => {
-			return prevContext.map((context, i) => {
-				if (i === index) {
+	const editTag = (index)=>{
+		setTagList((prevContext)=>{
+			return prevContext.map((context, i)=>{
+				if(i === index) {
 					return { ...context, editing: true };
 				}
 				return { ...context, editing: false };
@@ -58,25 +58,25 @@ const TagInput = ({ unique = true, values = [], ...props }) => {
 		});
 	};
 
-	const renderReadTag = (context, index) => {
+	const renderReadTag = (context, index)=>{
 		return (
 			<li key={index}
 				data-value={context.value}
 				className='tag'
-				onClick={() => editTag(index)}>
+				onClick={()=>editTag(index)}>
 				{context.value}
-				<button onClick={(evt)=>{evt.stopPropagation(); submitTag(null, context.value, index)}}><i className='fa fa-times fa-fw'/></button>
+				<button onClick={(evt)=>{evt.stopPropagation(); submitTag(null, context.value, index);}}><i className='fa fa-times fa-fw'/></button>
 			</li>
 		);
 	};
 
-	const renderWriteTag = (context, index) => {
+	const renderWriteTag = (context, index)=>{
 		return (
 			<input type='text'
 				key={index}
-				defaultValue={context.value} 
-				onKeyDown={(evt) => handleInputKeyDown({evt, value: context.value, index: index})} 
-				autoFocus 
+				defaultValue={context.value}
+				onKeyDown={(evt)=>handleInputKeyDown({ evt, value: context.value, index: index })}
+				autoFocus
 			/>
 		);
 	};
@@ -86,7 +86,7 @@ const TagInput = ({ unique = true, values = [], ...props }) => {
 			<label>{props.label}</label>
 			<div className='value'>
 				<ul className='list'>
-					{tagList.map((context, index) => { return context.editing ? renderWriteTag(context, index) : renderReadTag(context, index); })}
+					{tagList.map((context, index)=>{ return context.editing ? renderWriteTag(context, index) : renderReadTag(context, index); })}
 				</ul>
 
 				<input
@@ -94,8 +94,8 @@ const TagInput = ({ unique = true, values = [], ...props }) => {
 					className='value'
 					placeholder={props.placeholder}
 					value={tempInputText}
-					onChange={(e) => setTempInputText(e.target.value)}
-					onKeyDown={(evt) => handleInputKeyDown({ evt, value: null, options: { clear: true } })}
+					onChange={(e)=>setTempInputText(e.target.value)}
+					onKeyDown={(evt)=>handleInputKeyDown({ evt, value: null, options: { clear: true } })}
 				/>
 			</div>
 		</div>
diff --git a/client/homebrew/homebrew.less b/client/homebrew/homebrew.less
index 828de796f..e265c2941 100644
--- a/client/homebrew/homebrew.less
+++ b/client/homebrew/homebrew.less
@@ -1,36 +1,32 @@
 @import 'naturalcrit/styles/core.less';
-.homebrew{
+.homebrew {
 	height : 100%;
-	.sitePage{
+	.sitePage {
 		display          : flex;
-		height           : 100%;
-		background-color : @steel;
 		flex-direction   : column;
+		height           : 100%;
 		overflow-y       : hidden;
-		.content{
+		background-color : @steel;
+		.content {
 			position   : relative;
-			height     : calc(~"100% - 29px"); //Navbar height
 			flex       : auto;
+			height     : calc(~'100% - 29px'); //Navbar height
 			overflow-y : hidden;
 		}
 		&.listPage .content {
 			overflow-y : scroll;
 
 			&::-webkit-scrollbar {
-				width: 20px;
-				&:horizontal{
-					height: 20px;
-					width:auto;
+				width : 20px;
+				&:horizontal {
+					width  : auto;
+					height : 20px;
 				}
 				&-thumb {
-					background: linear-gradient(90deg, #d3c1af 15px, #00000000 15px);
-					&:horizontal{
-						background: linear-gradient(0deg, #d3c1af 15px, #00000000 15px);
-					}
-				}
-				&-corner {
-					visibility: hidden;
+					background : linear-gradient(90deg, #D3C1AF 15px, #00000000 15px);
+					&:horizontal { background : linear-gradient(0deg, #D3C1AF 15px, #00000000 15px); }
 				}
+				&-corner { visibility : hidden; }
 			}
 		}
 	}
diff --git a/client/homebrew/navbar/error-navitem.jsx b/client/homebrew/navbar/error-navitem.jsx
index f6788e6d5..3de26ca56 100644
--- a/client/homebrew/navbar/error-navitem.jsx
+++ b/client/homebrew/navbar/error-navitem.jsx
@@ -116,6 +116,19 @@ const ErrorNavItem = createClass({
 			</Nav.item>;
 		}
 
+		if(HBErrorCode === '10') {
+			return <Nav.item className='save error' icon='fas fa-exclamation-triangle'>
+				Oops!
+				<div className='errorContainer' onClick={clearError}>
+					Looks like the brew you have selected
+					as a theme is not tagged for use as a
+					theme. Verify that
+					brew <a className='lowercase' target='_blank' rel='noopener noreferrer' href={`/share/${response.body.brewId}`}>
+						{response.body.brewId}</a> has the <span className='lowercase'>meta:theme</span> tag!
+				</div>
+			</Nav.item>;
+		}
+
 		return <Nav.item className='save error' icon='fas fa-exclamation-triangle'>
 			Oops!
 			<div className='errorContainer'>
diff --git a/client/homebrew/navbar/error-navitem.less b/client/homebrew/navbar/error-navitem.less
index be138dca4..637ddac95 100644
--- a/client/homebrew/navbar/error-navitem.less
+++ b/client/homebrew/navbar/error-navitem.less
@@ -1,78 +1,70 @@
 .navItem.error {
-  position         : relative;
-  background-color : @red;
+	position         : relative;
+	background-color : @red;
 }
 
-.errorContainer{
-  animation-name: glideDown;
-  animation-duration: 0.4s;
-  position         : absolute;
-  top              : 100%;
-  left             : 50%;
-  z-index          : 1000;
-  width            : 140px;
-  padding          : 3px;
-  color            : white;
-  background-color : #333;
-  border           : 3px solid #444;
-  border-radius    : 5px;
-  transform        : translate(-50% + 3px, 10px);
-  text-align       : center;
-  font-size        : 10px;
-  font-weight      : 800;
-  text-transform   : uppercase;
-	.lowercase {
-		text-transform : none;
+.errorContainer {
+	position           : absolute;
+	top                : 100%;
+	left               : 50%;
+	z-index            : 1000;
+	width              : 140px;
+	padding            : 3px;
+	font-size          : 10px;
+	font-weight        : 800;
+	color              : white;
+	text-align         : center;
+	text-transform     : uppercase;
+	background-color   : #333333;
+	border             : 3px solid #444444;
+	border-radius      : 5px;
+	transform          : translate(-50% + 3px, 10px);
+	animation-name     : glideDown;
+	animation-duration : 0.4s;
+	.lowercase { text-transform : none; }
+	a { color : @teal; }
+	&::before {
+		position      : absolute;
+		top           : -23px;
+		left          : 53px;
+		width         : 0px;
+		height        : 0px;
+		content       : '';
+		border-top    : 10px solid transparent;
+		border-right  : 10px solid transparent;
+		border-bottom : 10px solid #444444;
+		border-left   : 10px solid transparent;
+	}
+	&::after {
+		position      : absolute;
+		top           : -19px;
+		left          : 53px;
+		width         : 0px;
+		height        : 0px;
+		content       : '';
+		border-top    : 10px solid transparent;
+		border-right  : 10px solid transparent;
+		border-bottom : 10px solid #333333;
+		border-left   : 10px solid transparent;
+	}
+	.deny {
+		display          : inline-block;
+		width            : 48%;
+		padding          : 5px;
+		margin           : 1px;
+		background-color : #333333;
+		border-left      : 1px solid #666666;
+		.animate(background-color);
+		&:hover { background-color : red; }
+	}
+	.confirm {
+		display          : inline-block;
+		width            : 48%;
+		padding          : 5px;
+		margin           : 1px;
+		color            : white;
+		background-color : #333333;
+		.animate(background-color);
+		&:hover { background-color : teal; }
 	}
-  a{
-    color : @teal;
-  }
-  &:before {
-    content: "";
-    width: 0px;
-    height: 0px;
-    position: absolute;
-    border-left: 10px solid transparent;
-    border-right: 10px solid transparent;
-    border-top: 10px solid transparent;
-    border-bottom: 10px solid #444;
-    left: 53px;
-    top: -23px;
-  }
-  &:after {
-    content: "";
-    width: 0px;
-    height: 0px;
-    position: absolute;
-    border-left: 10px solid transparent;
-    border-right: 10px solid transparent;
-    border-top: 10px solid transparent;
-    border-bottom: 10px solid #333;
-    left: 53px;
-    top: -19px;
-  }
-  .deny {
-    width            : 48%;
-    margin           : 1px;
-    padding          : 5px;
-    background-color : #333;
-    display          : inline-block;
-    border-left      : 1px solid #666;
-    .animate(background-color);
-    &:hover{
-      background-color : red;
-    }
-  }
-  .confirm {
-    width            : 48%;
-    margin           : 1px;
-    padding          : 5px;
-    background-color : #333;
-    display          : inline-block;
-    color            : white;
-    .animate(background-color);
-    &:hover{
-      background-color : teal;
-    }
-  }
 }
diff --git a/client/homebrew/navbar/navbar.less b/client/homebrew/navbar/navbar.less
index ae11c1e7e..aa233d631 100644
--- a/client/homebrew/navbar/navbar.less
+++ b/client/homebrew/navbar/navbar.less
@@ -24,11 +24,11 @@
 }
 
 .homebrew nav {
+	position         : relative;
+	z-index          : 2;
+	display          : flex;
+	justify-content  : space-between;
 	background-color : #333333;
-	position        : relative;
-	z-index         : 2;
-	display         : flex;
-	justify-content : space-between;
 	
 	.navSection {
 		display     : flex;
@@ -82,8 +82,8 @@
 		font-weight      : 800;
 		line-height      : 13px;
 		color            : white;
-		text-decoration  : none;
 		text-transform   : uppercase;
+		text-decoration  : none;
 		cursor           : pointer;
 		background-color : #333333;
 		i {
@@ -106,11 +106,11 @@
 			display          : block;
 			width            : 100%;
 			overflow         : hidden;
+			text-overflow    : ellipsis;
 			font-size        : 12px;
 			font-weight      : 800;
 			color            : white;
 			text-align       : center;
-			text-overflow    : ellipsis;
 			text-transform   : initial;	
 			white-space      : nowrap;
 			background-color : transparent;		
@@ -170,16 +170,16 @@
 					h4 {
 						box-sizing : border-box;
 						display    : block;
-						flex-basis : 20%;
 						flex-grow  : 1;
+						flex-basis : 20%;
 						min-width  : 76px;
 						padding    : 5px 0;
 						color      : #BBBBBB;
 						text-align : center;
 					}
 					p {
-						flex-basis     : 80%;
 						flex-grow      : 1;
+						flex-basis     : 80%;
 						padding        : 5px 0;
 						font-family    : 'Open Sans', sans-serif;
 						font-size      : 10px;
@@ -215,10 +215,10 @@
 				z-index          : 10000;
 				box-sizing       : border-box;
 				display          : block;
+				visibility       : hidden;
 				width            : 100%;
 				padding          : 13px 5px;
 				text-align       : center;
-				visibility       : hidden;
 				background-color : #333333;
 			}
 		}
diff --git a/client/homebrew/pages/basePages/listPage/brewItem/brewItem.jsx b/client/homebrew/pages/basePages/listPage/brewItem/brewItem.jsx
index ef98e8425..ef309a613 100644
--- a/client/homebrew/pages/basePages/listPage/brewItem/brewItem.jsx
+++ b/client/homebrew/pages/basePages/listPage/brewItem/brewItem.jsx
@@ -30,11 +30,11 @@ const BrewItem = ({
 		}
 
 		request.delete(`/api/${brew.googleId ?? ''}${brew.editId}`).send().end((err, res)=>{
-				if (err) reportError(err); else window.location.reload();
-        });
+			if(err) reportError(err); else window.location.reload();
+		});
 	}, [brew, reportError]);
 
-	const updateFilter = useCallback((type, term)=> updateListFilter(type, term), [updateListFilter]);
+	const updateFilter = useCallback((type, term)=>updateListFilter(type, term), [updateListFilter]);
 
 	const renderDeleteBrewLink = ()=>{
 		if(!brew.editId) return null;
diff --git a/client/homebrew/pages/basePages/listPage/brewItem/brewItem.less b/client/homebrew/pages/basePages/listPage/brewItem/brewItem.less
index a3c17215e..0d45e8537 100644
--- a/client/homebrew/pages/basePages/listPage/brewItem/brewItem.less
+++ b/client/homebrew/pages/basePages/listPage/brewItem/brewItem.less
@@ -1,148 +1,129 @@
 
-.brewItem{
+.brewItem {
 	position                    : relative;
+	box-sizing                  : border-box;
 	display                     : inline-block;
-	vertical-align              : top;
-	box-sizing                  : border-box;
-	box-sizing                  : border-box;
-	overflow                    : hidden;
 	width                       : 48%;
 	min-height                  : 105px;
-	margin-right                : 15px;
-	margin-bottom               : 15px;
 	padding                     : 5px 15px 2px 6px;
 	padding-right               : 15px;
-	border                      : 1px solid #c9ad6a;
+	margin-right                : 15px;
+	margin-bottom               : 15px;
+	overflow                    : hidden;
+	vertical-align              : top;
+	background-color            : #CAB2802E;
+	border                      : 1px solid #C9AD6A;
 	border-radius               : 5px;
+	box-shadow                  : 0px 4px 5px 0px #333333;
+	break-inside                : avoid;
 	-webkit-column-break-inside : avoid;
 	page-break-inside           : avoid;
-	break-inside                : avoid;
-	box-shadow                  : 0px 4px 5px 0px #333;
-	background-color            : #cab2802e;
-	.thumbnail  {
-		position: absolute;
-		width: 150px;
-		height: 100%;
-		top: 0;
-		right: 0;
-		z-index: -1;
-		background-size: contain;
-		background-repeat: no-repeat;
-		background-position: right top;
-		mask-image: linear-gradient(80deg, #0000 20%, #050 40%);
-		-webkit-mask-image: linear-gradient(80deg, #0000 20%, #050 40%);
-		opacity: 50%;
+	.thumbnail {
+		position            : absolute;
+		top                 : 0;
+		right               : 0;
+		z-index             : -1;
+		width               : 150px;
+		height              : 100%;
+		background-repeat   : no-repeat;
+		background-position : right top;
+		background-size     : contain;
+		opacity             : 50%;
+		-webkit-mask-image  : linear-gradient(80deg, #00000000 20%, #005500 40%);
+		mask-image          : linear-gradient(80deg, #00000000 20%, #005500 40%);
 	}
 	.text {
 		min-height : 54px;
-		h4{
+		h4 {
 			margin-bottom : 5px;
 			font-size     : 2.2em;
 		}
 	}
-	.info{
-		position: initial;
-		bottom: 2px;
-		font-family : ScalySansRemake;
+	.info {
+		position    : initial;
+		bottom      : 2px;
+		font-family : "ScalySansRemake";
 		font-size   : 1.2em;
-		&>span{
+		& > span {
 			margin-right : 12px;
 			line-height  : 1.5em;
 
-			a {
-				color:inherit;
-			}
+			a { color : inherit; }
 		}
 	}
 	.brewTags span {
-		background-color: #c8ac6e3b;
-		margin: 2px;
-		padding: 2px;
-		border: 1px solid #c8ac6e;
-		border-radius: 4px;
-		white-space: nowrap;
-		display: inline-block;
-		font-weight: bold;
-		border-color: currentColor;
-		cursor : pointer;
-		&:before {
-			font-family: 'Font Awesome 5 Free';
-			font-size: 12px;
-			margin-right: 3px;
+		display          : inline-block;
+		padding          : 2px;
+		margin           : 2px;
+		font-weight      : bold;
+		white-space      : nowrap;
+		cursor           : pointer;
+		background-color : #C8AC6E3B;
+		border           : 1px solid #C8AC6E;
+		border-color     : currentColor;
+		border-radius    : 4px;
+		&::before {
+			margin-right : 3px;
+			font-family  : 'Font Awesome 5 Free';
+			font-size    : 12px;
 		}
 		&.type {
-			background-color: #0080003b;
-			color: #008000;
-			&:before{
-				content: '\f0ad';
-			}
+			color            : #008000;
+			background-color : #0080003B;
+			&::before { content : '\f0ad'; }
 		}
 		&.group {
-			background-color: #5050503b;
-			color: #000000;
-			&:before{
-				content: '\f500';
-			}
+			color            : #000000;
+			background-color : #5050503B;
+			&::before { content : '\f500'; }
 		}
 		&.meta {
-			background-color: #0000803b;
-			color: #000080;
-			&:before{
-				content: '\f05a';
-			}
+			color            : #000080;
+			background-color : #0000803B;
+			&::before { content : '\f05a'; }
 		}
 		&.system {
-			background-color: #8000003b;
-			color: #800000;
-			&:before{
-				content: '\f518';
-			}
+			color            : #800000;
+			background-color : #8000003B;
+			&::before { content : '\f518'; }
 		}
 	}
-	&:hover{
-		.links{
-			opacity : 1;
-		}
+	&:hover {
+		.links { opacity : 1; }
 	}
-	&:nth-child(2n + 1){
-		margin-right : 0px;
-	}
-	.links{
+	&:nth-child(2n + 1) { margin-right : 0px; }
+	.links {
 		.animate(opacity);
 		position         : absolute;
 		top              : 0px;
 		right            : 0px;
-		height           : 100%;
 		width            : 2em;
-		opacity          : 0;
-		background-color : fade(black, 60%);
+		height           : 100%;
 		text-align       : center;
-		a{
+		background-color : fade(black, 60%);
+		opacity          : 0;
+		a {
 			.animate(opacity);
 			display         : block;
 			margin          : 8px 0px;
-			opacity         : 0.6;
 			font-size       : 1.3em;
 			color           : white;
 			text-decoration : unset;
-			&:hover{
-				opacity : 1;
-			}
-			i{
-				cursor : pointer;
-			}
+			opacity         : 0.6;
+			&:hover { opacity : 1; }
+			i { cursor : pointer; }
 		}
 	}
 	.googleDriveIcon {
-		height	: 18px;
+		height  : 18px;
 		padding : 0px;
 		margin  : -5px;
 	}
 	.homebreweryIcon {
-		mix-blend-mode : darken;
-		height         : 24px;
 		position       : relative;
 		top            : 5px;
 		left           : -5px;
+		height         : 24px;
+		mix-blend-mode : darken;
 	}
 }
diff --git a/client/homebrew/pages/basePages/listPage/listPage.less b/client/homebrew/pages/basePages/listPage/listPage.less
index 0aa4a278d..bf899bc71 100644
--- a/client/homebrew/pages/basePages/listPage/listPage.less
+++ b/client/homebrew/pages/basePages/listPage/listPage.less
@@ -1,5 +1,5 @@
 
-.noColumns(){
+.noColumns() {
 	column-count         : auto;
 	column-fill          : auto;
 	column-gap           : normal;
@@ -13,177 +13,151 @@
 	height               : auto;
 	min-height           : 279.4mm;
 	margin               : 20px auto;
-	contain				 : unset;
+	contain              : unset;
 }
-.listPage{
-	.content{
+.listPage {
+	.content {
 		z-index : 1;
-		.page{
+		.page {
 			.noColumns() !important; //Needed to override PHB Theme since this is on a lower @layer
-			&::after{
-				display : none;
-			}
-			.noBrews{
+			&::after { display : none; }
+			.noBrews {
 				margin     : 10px 0px;
 				font-size  : 1.3em;
 				font-style : italic;
 			}
 			.brewCollection {
-				h1:hover{
-					cursor: pointer;
-				}
+				h1:hover { cursor : pointer; }
 				.active::before, .inactive::before {
-					font-family: 'Font Awesome 5 Free';
-					font-weight: 900;
-					font-size: 0.6cm;
-					padding-right: 0.5em;
-				}
-				.active {
-					color: var(--HB_Color_HeaderText);
-				}
-				.active::before {
-					content: '\f107';
-				}
-				.inactive {
-					color: #707070;
-				}
-				.inactive::before {
-					content: '\f105';
+					padding-right : 0.5em;
+					font-family   : 'Font Awesome 5 Free';
+					font-size     : 0.6cm;
+					font-weight   : 900;
 				}
+				.active { color : var(--HB_Color_HeaderText); }
+				.active::before { content : '\f107'; }
+				.inactive { color : #707070; }
+				.inactive::before { content : '\f105'; }
 			}
 		}
 	}
 	.sort-container {
-		font-family        : 'Open Sans', sans-serif;
-		position           : sticky;
-		top                : 0;
-		left               : 0;
-		width              : 100%;
-		height             : 30px;
-		background-color   : #555;
-		border-top         : 1px solid #666;
-		border-bottom         : 1px solid #666;
-		color              : white;
-		text-align         : center;
-		z-index            : 1;
-		display            : flex;
-		justify-content    : center;
-		align-items        : baseline;
-		column-gap         : 15px;
-		row-gap            : 5px;
-		flex-wrap          : wrap;
-		h6{
-			text-transform : uppercase;
+		position              : sticky;
+		top                   : 0;
+		left                  : 0;
+		z-index               : 1;
+		display               : flex;
+		flex-wrap             : wrap;
+		row-gap               : 5px;
+		column-gap            : 15px;
+		align-items           : baseline;
+		justify-content       : center;
+		width                 : 100%;
+		height                : 30px;
+		font-family           : 'Open Sans', sans-serif;
+		color                 : white;
+		text-align            : center;
+		background-color      : #555555;
+		border-top            : 1px solid #666666;
+		border-bottom         : 1px solid #666666;
+		h6 {
 			font-family    : 'Open Sans', sans-serif;
 			font-size      : 11px;
 			font-weight    : bold;
+			text-transform : uppercase;
 		}
 		.sort-option {
-			display: flex;
-			align-items: center;
-			padding: 0 8px;
-			color: #ccc;
-			height: 100%;
+			display     : flex;
+			align-items : center;
+			height      : 100%;
+			padding     : 0 8px;
+			color       : #CCCCCC;
 
-			&:hover{
-				background-color : #444;
-			}
+			&:hover { background-color : #444444; }
 
 			&.active {
-			font-weight: bold;
-			color: #ddd;
-			background-color: #333;
+				font-weight      : bold;
+				color            : #DDDDDD;
+				background-color : #333333;
 
-			button {
-				color: white;
-				font-weight: 800;
-				height: 100%;
-				& + .sortDir {
-					padding-left: 5px;
+				button {
+					height      : 100%;
+					font-weight : 800;
+					color       : white;
+					& + .sortDir { padding-left : 5px; }
 				}
 			}
-		}
 
 		}
 		.filter-option {
-			margin-left: 20px;
-			background-color : transparent !important;
+			margin-left      : 20px;
 			font-size        : 11px;
-			i{
-				padding-right : 5px;
-			}
+			background-color : transparent !important;
+			i { padding-right : 5px; }
+		}
+		button {
+			padding          : 0;
+			font-family      : 'Open Sans', sans-serif;
+			font-size        : 11px;
+			font-weight      : normal;
+			color            : #CCCCCC;
+			text-transform   : uppercase;
+			background-color : transparent;
 		}
-		button{
-				background-color : transparent;
-				font-family      : 'Open Sans', sans-serif;
-				text-transform   : uppercase;
-				font-weight      : normal;
-				font-size        : 11px;
-				color            : #ccc;
-				padding          : 0;
-			}
 
 
 	}
 	.tags-container {
-		height             : 30px;
-		background-color   : #555;
-		border-top         : 1px solid #666;
-		border-bottom      : 1px solid #666;
-		color              : white;
 		display            : flex;
-		justify-content    : center;
-		align-items        : center;
-		column-gap         : 15px;
-		row-gap            : 5px;
 		flex-wrap          : wrap;
+		row-gap            : 5px;
+		column-gap         : 15px;
+		align-items        : center;
+		justify-content    : center;
+		height             : 30px;
+		color              : white;
+		background-color   : #555555;
+		border-top         : 1px solid #666666;
+		border-bottom      : 1px solid #666666;
 		span {
+			padding        : 3px;
 			font-family    : 'Open Sans', sans-serif;
 			font-size      : 11px;
 			font-weight    : bold;
+			color          : #DFDFDF;
+			cursor         : pointer;
 			border         : 1px solid;
 			border-radius  : 3px;
-			padding        : 3px;
-			cursor         : pointer;
-			color: #dfdfdf;
-			&:before {
-				font-family: 'Font Awesome 5 Free';
-				font-size: 12px;
-				margin-right: 3px;
+			&::before {
+				margin-right : 3px;
+				font-family  : 'Font Awesome 5 Free';
+				font-size    : 12px;
 			}
-			&:after {
-				content: '\f00d';
-				font-family: 'Font Awesome 5 Free';
-				font-size: 12px;
-				margin-left: 3px;
+			&::after {
+				margin-left : 3px;
+				font-family : 'Font Awesome 5 Free';
+				font-size   : 12px;
+				content     : '\f00d';
 			}
 			&.type {
-				background-color: #008000;
-				border-color: #00a000;
-				&:before{
-					content: '\f0ad';
-				}
+				background-color : #008000;
+				border-color     : #00A000;
+				&::before { content : '\f0ad'; }
 			}
 			&.group {
-				background-color: #505050;
-				border-color: #000000;
-				&:before{
-					content: '\f500';
-				}
+				background-color : #505050;
+				border-color     : #000000;
+				&::before { content : '\f500'; }
 			}
 			&.meta {
-				background-color: #000080;
-				border-color: #0000a0;
-				&:before{
-					content: '\f05a';
-				}
+				background-color : #000080;
+				border-color     : #0000A0;
+				&::before { content : '\f05a'; }
 			}
 			&.system {
-				background-color: #800000;
-				border-color: #a00000;
-				&:before{
-					content: '\f518';
-				}
+				background-color : #800000;
+				border-color     : #A00000;
+				&::before { content : '\f518'; }
 			}
 		}
 	}
diff --git a/client/homebrew/pages/basePages/uiPage/uiPage.less b/client/homebrew/pages/basePages/uiPage/uiPage.less
index 913c74a2e..27f079e20 100644
--- a/client/homebrew/pages/basePages/uiPage/uiPage.less
+++ b/client/homebrew/pages/basePages/uiPage/uiPage.less
@@ -1,7 +1,7 @@
 .homebrew {
 	.uiPage.sitePage {
 		.content {
-			width            : ~"min(90vw, 1000px)";
+			width            : ~'min(90vw, 1000px)';
 			padding          : 2% 4%;
 			margin-top       : 25px;
 			margin-right     : auto;
@@ -17,19 +17,19 @@
 				border        : 2px solid black;
 				border-radius : 5px;
 				button {
+					width            : 125px;
+					margin-right     : 5px;
+					color            : black;
 					background-color : transparent;
 					border           : 1px solid black;
 					border-radius    : 5px;
-					width            : 125px;
-					color            : black;
-					margin-right     : 5px;
 					&.active {
-						background-color: #0007;
-						color: white;
-						&:before {
-							content: '\f00c';
-    						font-family: 'FONT AWESOME 5 FREE';
-    						margin-right: 5px;
+						color            : white;
+						background-color : #00000077;
+						&::before {
+							margin-right : 5px;
+							font-family  : 'FONT AWESOME 5 FREE';
+							content      : '\f00c';
 						}
 					}
 				}
diff --git a/client/homebrew/pages/editPage/editPage.jsx b/client/homebrew/pages/editPage/editPage.jsx
index ffb6a6b40..dc2520373 100644
--- a/client/homebrew/pages/editPage/editPage.jsx
+++ b/client/homebrew/pages/editPage/editPage.jsx
@@ -102,6 +102,14 @@ const EditPage = createClass({
 		window.onbeforeunload = function(){};
 		document.removeEventListener('keydown', this.handleControlKeys);
 	},
+	componentDidUpdate : function(){
+		const hasChange = this.hasChanges();
+		if(this.state.isPending != hasChange){
+			this.setState({
+				isPending : hasChange
+			});
+		}
+	},
 
 	handleControlKeys : function(e){
 		if(!(e.ctrlKey || e.metaKey)) return;
@@ -138,15 +146,13 @@ const EditPage = createClass({
 
 		this.setState((prevState)=>({
 			brew       : { ...prevState.brew, text: text },
-			isPending  : true,
 			htmlErrors : htmlErrors,
 		}), ()=>{if(this.state.autoSave) this.trySave();});
 	},
 
 	handleStyleChange : function(style){
 		this.setState((prevState)=>({
-			brew      : { ...prevState.brew, style: style },
-			isPending : true
+			brew : { ...prevState.brew, style: style }
 		}), ()=>{if(this.state.autoSave) this.trySave();});
 	},
 
@@ -158,8 +164,7 @@ const EditPage = createClass({
 			brew : {
 				...prevState.brew,
 				...metadata
-			},
-			isPending : true,
+			}
 		}), ()=>{if(this.state.autoSave) this.trySave();});
 	},
 
@@ -247,16 +252,17 @@ const EditPage = createClass({
 			});
 		if(!res) return;
 
-		this.savedBrew = res.body;
+		this.savedBrew = {
+			...this.state.brew,
+			googleId : res.body.googleId ? res.body.googleId : null,
+			editId 	 : res.body.editId,
+			shareId  : res.body.shareId,
+			version  : res.body.version
+		};
 		history.replaceState(null, null, `/edit/${this.savedBrew.editId}`);
 
-		this.setState((prevState)=>({
-			brew : { ...prevState.brew,
-				googleId : this.savedBrew.googleId ? this.savedBrew.googleId : null,
-				editId 	 : this.savedBrew.editId,
-				shareId  : this.savedBrew.shareId,
-				version  : this.savedBrew.version
-			},
+		this.setState(()=>({
+			brew        : this.savedBrew,
 			isPending   : false,
 			isSaving    : false,
 			unsavedTime : new Date()
@@ -311,7 +317,14 @@ const EditPage = createClass({
 	},
 
 	renderSaveButton : function(){
-		if(this.state.autoSaveWarning && this.hasChanges()){
+
+		// #1 - Currently saving, show SAVING
+		if(this.state.isSaving){
+			return <Nav.item className='save' icon='fas fa-spinner fa-spin'>saving...</Nav.item>;
+		}
+
+		// #2 - Unsaved changes exist, autosave is OFF and warning timer has expired, show AUTOSAVE WARNING
+		if(this.state.isPending && this.state.autoSaveWarning){
 			this.setAutosaveWarning();
 			const elapsedTime = Math.round((new Date() - this.state.unsavedTime) / 1000 / 60);
 			const text = elapsedTime == 0 ? 'Autosave is OFF.' : `Autosave is OFF, and you haven't saved for ${elapsedTime} minutes.`;
@@ -324,18 +337,17 @@ const EditPage = createClass({
 			</Nav.item>;
 		}
 
-		if(this.state.isSaving){
-			return <Nav.item className='save' icon='fas fa-spinner fa-spin'>saving...</Nav.item>;
+		// #3 - Unsaved changes exist, click to save, show SAVE NOW
+		// Use trySave(true) instead of save() to use debounced save function
+		if(this.state.isPending){
+			return <Nav.item className='save' onClick={()=>this.trySave(true)} color='blue' icon='fas fa-save'>Save Now</Nav.item>;
 		}
-		if(this.state.isPending && this.hasChanges()){
-			return <Nav.item className='save' onClick={this.save} color='blue' icon='fas fa-save'>Save Now</Nav.item>;
-		}
-		if(!this.state.isPending && !this.state.isSaving && this.state.autoSave){
+		// #4 - No unsaved changes, autosave is ON, show AUTO-SAVED
+		if(this.state.autoSave){
 			return <Nav.item className='save saved'>auto-saved.</Nav.item>;
 		}
-		if(!this.state.isPending && !this.state.isSaving){
-			return <Nav.item className='save saved'>saved.</Nav.item>;
-		}
+		// DEFAULT - No unsaved changes, show SAVED
+		return <Nav.item className='save saved'>saved.</Nav.item>;
 	},
 
 	handleAutoSave : function(){
@@ -379,7 +391,7 @@ const EditPage = createClass({
 		const title = `${this.props.brew.title} ${systems}`;
 		const text = `Hey guys! I've been working on this homebrew. I'd love your feedback. Check it out.
 
-**[Homebrewery Link](${global.config.publicUrl}/share/${shareLink})**`;
+**[Homebrewery Link](${global.config.baseUrl}/share/${shareLink})**`;
 
 		return `https://www.reddit.com/r/UnearthedArcana/submit?title=${encodeURIComponent(title.toWellFormed())}&text=${encodeURIComponent(text)}`;
 	},
@@ -410,7 +422,7 @@ const EditPage = createClass({
 					<Nav.item color='blue' href={`/share/${shareLink}`}>
 						view
 					</Nav.item>
-					<Nav.item color='blue' onClick={()=>{navigator.clipboard.writeText(`${global.config.publicUrl}/share/${shareLink}`);}}>
+					<Nav.item color='blue' onClick={()=>{navigator.clipboard.writeText(`${global.config.baseUrl}/share/${shareLink}`);}}>
 						copy url
 					</Nav.item>
 					<Nav.item color='blue' href={this.getRedditLink()} newTab={true} rel='noopener noreferrer'>
@@ -443,6 +455,7 @@ const EditPage = createClass({
 						reportError={this.errorReported}
 						renderer={this.state.brew.renderer}
 						userThemes={this.props.userThemes}
+						themeBundle={this.state.themeBundle}
 						snippetBundle={this.state.themeBundle.snippets}
 						updateBrew={this.updateBrew}
 						onCursorPageChange={this.handleEditorCursorPageChange}
diff --git a/client/homebrew/pages/editPage/editPage.less b/client/homebrew/pages/editPage/editPage.less
index f94b60c1b..184aaa1f7 100644
--- a/client/homebrew/pages/editPage/editPage.less
+++ b/client/homebrew/pages/editPage/editPage.less
@@ -1,29 +1,25 @@
 @keyframes glideDown {
-	0%   {transform : translate(-50% + 3px, 0px);
-				opacity   : 0;}
-	100% {transform : translate(-50% + 3px, 10px);
-				opacity   : 1;}
+	0% {
+		opacity   : 0;transform : translate(-50% + 3px, 0px);}
+	100% {
+		opacity   : 1;transform : translate(-50% + 3px, 10px);}
 }
-.editPage{
-	.navItem.save{
+.editPage {
+	.navItem.save {
+		position   : relative;
 		width      : 106px;
 		text-align : center;
-		position   : relative;
-		&.saved{
+		&.saved {
+			color  : #666666;
 			cursor : initial;
-			color  : #666;
 		}
 	}
-	.googleDriveStorage {
-		position : relative;
-	}
-	.googleDriveStorage img{
-		height	: 18px;
+	.googleDriveStorage { position : relative; }
+	.googleDriveStorage img {
+		height  : 18px;
 		padding : 0px;
 		margin  : -5px;
 
-		&.inactive {
-			filter: grayscale(1);
-		}
+		&.inactive { filter : grayscale(1); }
 	}
 }
diff --git a/client/homebrew/pages/errorPage/errors/errorIndex.js b/client/homebrew/pages/errorPage/errors/errorIndex.js
index 2c7be5d4b..9584a14b9 100644
--- a/client/homebrew/pages/errorPage/errors/errorIndex.js
+++ b/client/homebrew/pages/errorPage/errors/errorIndex.js
@@ -168,6 +168,14 @@ const errorIndex = (props)=>{
 
 		**Brew ID:**  ${props.brew.brewId}`,
 
+		// Theme Not Valid
+		'10' : dedent`
+		## The selected theme is not tagged as a theme.
+		
+		The brew selected as a theme exists, but has not been marked for use as a theme with the \`theme:meta\` tag.
+		
+		If the selected brew is your document, you may designate it as a theme by adding the \`theme:meta\` tag.`,
+
 		//account page when account is not defined
 		'50' : dedent`
 		## You are not signed in
diff --git a/client/homebrew/pages/homePage/homePage.jsx b/client/homebrew/pages/homePage/homePage.jsx
index 00d0c801d..b9c1b7371 100644
--- a/client/homebrew/pages/homePage/homePage.jsx
+++ b/client/homebrew/pages/homePage/homePage.jsx
@@ -100,32 +100,32 @@ const HomePage = createClass({
 		return <div className='homePage sitePage'>
 			<Meta name='google-site-verification' content='NwnAQSSJZzAT7N-p5MY6ydQ7Njm67dtbu73ZSyE5Fy4' />
 			{this.renderNavbar()}
-			<div className="content">
-			<SplitPane onDragFinish={this.handleSplitMove}>
-				<Editor
-					ref={this.editor}
-					brew={this.state.brew}
-					onTextChange={this.handleTextChange}
-					renderer={this.state.brew.renderer}
-					showEditButtons={false}
-					snippetBundle={this.state.themeBundle.snippets}
-					onCursorPageChange={this.handleEditorCursorPageChange}
-					onViewPageChange={this.handleEditorViewPageChange}
-					currentEditorViewPageNum={this.state.currentEditorViewPageNum}
-					currentEditorCursorPageNum={this.state.currentEditorCursorPageNum}
-					currentBrewRendererPageNum={this.state.currentBrewRendererPageNum}
-				/>
-				<BrewRenderer
-					text={this.state.brew.text}
-					style={this.state.brew.style}
-					renderer={this.state.brew.renderer}
-					onPageChange={this.handleBrewRendererPageChange}
-					currentEditorViewPageNum={this.state.currentEditorViewPageNum}
-					currentEditorCursorPageNum={this.state.currentEditorCursorPageNum}
-					currentBrewRendererPageNum={this.state.currentBrewRendererPageNum}
-					themeBundle={this.state.themeBundle}
-				/>
-			</SplitPane>
+			<div className='content'>
+				<SplitPane onDragFinish={this.handleSplitMove}>
+					<Editor
+						ref={this.editor}
+						brew={this.state.brew}
+						onTextChange={this.handleTextChange}
+						renderer={this.state.brew.renderer}
+						showEditButtons={false}
+						snippetBundle={this.state.themeBundle.snippets}
+						onCursorPageChange={this.handleEditorCursorPageChange}
+						onViewPageChange={this.handleEditorViewPageChange}
+						currentEditorViewPageNum={this.state.currentEditorViewPageNum}
+						currentEditorCursorPageNum={this.state.currentEditorCursorPageNum}
+						currentBrewRendererPageNum={this.state.currentBrewRendererPageNum}
+					/>
+					<BrewRenderer
+						text={this.state.brew.text}
+						style={this.state.brew.style}
+						renderer={this.state.brew.renderer}
+						onPageChange={this.handleBrewRendererPageChange}
+						currentEditorViewPageNum={this.state.currentEditorViewPageNum}
+						currentEditorCursorPageNum={this.state.currentEditorCursorPageNum}
+						currentBrewRendererPageNum={this.state.currentBrewRendererPageNum}
+						themeBundle={this.state.themeBundle}
+					/>
+				</SplitPane>
 			</div>
 			<div className={cx('floatingSaveButton', { show: this.state.welcomeText != this.state.brew.text })} onClick={this.handleSave}>
 				Save current <i className='fas fa-save' />
diff --git a/client/homebrew/pages/homePage/homePage.less b/client/homebrew/pages/homePage/homePage.less
index a7523bd3c..4cf9ff4fe 100644
--- a/client/homebrew/pages/homePage/homePage.less
+++ b/client/homebrew/pages/homePage/homePage.less
@@ -1,50 +1,40 @@
-.homePage{
+.homePage {
 	position : relative;
-	a.floatingNewButton{
+	a.floatingNewButton {
 		.animate(background-color);
 		position         : absolute;
-		display          : block;
 		right            : 70px;
 		bottom           : 50px;
-		z-index          : 100;
 		z-index          : 5001;
+		display          : block;
 		padding          : 1em;
-		background-color : @orange;
 		font-size        : 1.5em;
 		color            : white;
 		text-decoration  : none;
+		background-color : @orange;
 		box-shadow       : 3px 3px 15px black;
-		&:hover{
-			background-color : darken(@orange, 20%);
-		}
+		&:hover { background-color : darken(@orange, 20%); }
 	}
-	.floatingSaveButton{
+	.floatingSaveButton {
 		.animateAll();
 		position         : absolute;
-		display          : block;
 		right            : 200px;
 		bottom           : 70px;
-		z-index          : 100;
 		z-index          : 5000;
+		display          : block;
 		padding          : 0.8em;
-		cursor           : pointer;
-		background-color : @blue;
 		font-size        : 0.8em;
 		color            : white;
 		text-decoration  : none;
+		cursor           : pointer;
+		background-color : @blue;
 		box-shadow       : 3px 3px 15px black;
-		&:hover{
-			background-color : darken(@blue, 20%);
-		}
-		&.show{
-			right : 350px;
-		}
+		&:hover { background-color : darken(@blue, 20%); }
+		&.show { right : 350px; }
 	}
 
-	.navItem.save{
-		background-color: @orange;
-		&:hover{
-			background-color: @green;
-		}
+	.navItem.save {
+		background-color : @orange;
+		&:hover { background-color : @green; }
 	}
 }
diff --git a/client/homebrew/pages/newPage/newPage.jsx b/client/homebrew/pages/newPage/newPage.jsx
index ee2c67d5f..7aaeb3fd3 100644
--- a/client/homebrew/pages/newPage/newPage.jsx
+++ b/client/homebrew/pages/newPage/newPage.jsx
@@ -223,38 +223,39 @@ const NewPage = createClass({
 	render : function(){
 		return <div className='newPage sitePage'>
 			{this.renderNavbar()}
-			<div className="content">
-			<SplitPane onDragFinish={this.handleSplitMove}>
-				<Editor
-					ref={this.editor}
-					brew={this.state.brew}
-					onTextChange={this.handleTextChange}
-					onStyleChange={this.handleStyleChange}
-					onMetaChange={this.handleMetaChange}
-					renderer={this.state.brew.renderer}
-					userThemes={this.props.userThemes}
-					snippetBundle={this.state.themeBundle.snippets}
-					onCursorPageChange={this.handleEditorCursorPageChange}
-					onViewPageChange={this.handleEditorViewPageChange}
-					currentEditorViewPageNum={this.state.currentEditorViewPageNum}
-					currentEditorCursorPageNum={this.state.currentEditorCursorPageNum}
-					currentBrewRendererPageNum={this.state.currentBrewRendererPageNum}
-				/>
-				<BrewRenderer
-					text={this.state.brew.text}
-					style={this.state.brew.style}
-					renderer={this.state.brew.renderer}
-					theme={this.state.brew.theme}
-					themeBundle={this.state.themeBundle}
-					errors={this.state.htmlErrors}
-					lang={this.state.brew.lang}
-					onPageChange={this.handleBrewRendererPageChange}
-					currentEditorViewPageNum={this.state.currentEditorViewPageNum}
-					currentEditorCursorPageNum={this.state.currentEditorCursorPageNum}
-					currentBrewRendererPageNum={this.state.currentBrewRendererPageNum}
-					allowPrint={true}
-				/>
-			</SplitPane>
+			<div className='content'>
+				<SplitPane onDragFinish={this.handleSplitMove}>
+					<Editor
+						ref={this.editor}
+						brew={this.state.brew}
+						onTextChange={this.handleTextChange}
+						onStyleChange={this.handleStyleChange}
+						onMetaChange={this.handleMetaChange}
+						renderer={this.state.brew.renderer}
+						userThemes={this.props.userThemes}
+						themeBundle={this.state.themeBundle}
+						snippetBundle={this.state.themeBundle.snippets}
+						onCursorPageChange={this.handleEditorCursorPageChange}
+						onViewPageChange={this.handleEditorViewPageChange}
+						currentEditorViewPageNum={this.state.currentEditorViewPageNum}
+						currentEditorCursorPageNum={this.state.currentEditorCursorPageNum}
+						currentBrewRendererPageNum={this.state.currentBrewRendererPageNum}
+					/>
+					<BrewRenderer
+						text={this.state.brew.text}
+						style={this.state.brew.style}
+						renderer={this.state.brew.renderer}
+						theme={this.state.brew.theme}
+						themeBundle={this.state.themeBundle}
+						errors={this.state.htmlErrors}
+						lang={this.state.brew.lang}
+						onPageChange={this.handleBrewRendererPageChange}
+						currentEditorViewPageNum={this.state.currentEditorViewPageNum}
+						currentEditorCursorPageNum={this.state.currentEditorCursorPageNum}
+						currentBrewRendererPageNum={this.state.currentBrewRendererPageNum}
+						allowPrint={true}
+					/>
+				</SplitPane>
 			</div>
 		</div>;
 	}
diff --git a/client/homebrew/pages/newPage/newPage.less b/client/homebrew/pages/newPage/newPage.less
index f83827ffb..ebc44d543 100644
--- a/client/homebrew/pages/newPage/newPage.less
+++ b/client/homebrew/pages/newPage/newPage.less
@@ -1,8 +1,6 @@
-.newPage{
-	.navItem.save{
-		background-color: @orange;
-		&:hover{
-			background-color: @green;
-		}
+.newPage {
+	.navItem.save {
+		background-color : @orange;
+		&:hover { background-color : @green; }
 	}
 }
diff --git a/client/homebrew/pages/sharePage/sharePage.less b/client/homebrew/pages/sharePage/sharePage.less
index 754108506..b76dc50f9 100644
--- a/client/homebrew/pages/sharePage/sharePage.less
+++ b/client/homebrew/pages/sharePage/sharePage.less
@@ -1,9 +1,7 @@
-.sharePage{
+.sharePage {
 	nav .navSection.titleSection {
-		flex-grow: 1;
-		justify-content: center;
-	}
-	.content{
-		overflow-y : hidden;
+		flex-grow       : 1;
+		justify-content : center;
 	}
+	.content { overflow-y : hidden; }
 }
diff --git a/client/homebrew/pages/vaultPage/vaultPage.jsx b/client/homebrew/pages/vaultPage/vaultPage.jsx
index 21a8e8363..f979aa4f7 100644
--- a/client/homebrew/pages/vaultPage/vaultPage.jsx
+++ b/client/homebrew/pages/vaultPage/vaultPage.jsx
@@ -99,14 +99,14 @@ const VaultPage = (props)=>{
 		setSearching(true);
 		setError(null);
 
-		const title  = titleRef.current.value || '';
-		const author = authorRef.current.value || '';
-		const count  = countRef.current.value || 10;
-		const v3     = v3Ref.current.checked != false;
-		const legacy = legacyRef.current.checked != false;
+		const title      = titleRef.current.value || '';
+		const author     = authorRef.current.value || '';
+		const count      = countRef.current.value || 10;
+		const v3         = v3Ref.current.checked != false;
+		const legacy     = legacyRef.current.checked != false;
 		const sortOption = sort || 'title';
-		const dirOption = dir || 'asc';
-		const pageProp = page || 1;
+		const dirOption  = dir || 'asc';
+		const pageProp   = page || 1;
 
 		setSort(sortOption);
 		setdir(dirOption);
@@ -247,7 +247,7 @@ const VaultPage = (props)=>{
 					</li>
 					<li>
 						Some common words like "a", "after", "through", "itself", "here", etc.,
-						are ignored in searches. The full list can be found &nbsp;
+						are ignored in searches. The full list can be found&nbsp;
 						<a href='https://github.com/mongodb/mongo/blob/0e3b3ca8480ddddf5d0105d11a94bd4698335312/src/mongo/db/fts/stop_words_english.txt'>
 							here
 						</a>
@@ -286,9 +286,9 @@ const VaultPage = (props)=>{
 	};
 
 	const renderPaginationControls = ()=>{
-		if(!totalBrews) return null;
+		if(!totalBrews || totalBrews < 10) return null;
 
-		const countInt = parseInt(props.query.count || 20);
+		const countInt = parseInt(brewCollection.length || 20);
 		const totalPages = Math.ceil(totalBrews / countInt);
 
 		let startPage, endPage;
@@ -355,7 +355,7 @@ const VaultPage = (props)=>{
 	};
 
 	const renderFoundBrews = ()=>{
-		if(searching) {
+		if(searching && !brewCollection) {
 			return (
 				<div className='foundBrews searching'>
 					<h3 className='searchAnim'>Searching</h3>
@@ -395,6 +395,7 @@ const VaultPage = (props)=>{
 					{`Brews found: `}
 					<span>{totalBrews}</span>
 				</span>
+				{brewCollection.length > 10 && renderPaginationControls()}
 				{brewCollection.map((brew, index)=>{
 					return (
 						<BrewItem
@@ -415,14 +416,14 @@ const VaultPage = (props)=>{
 			<link href='/themes/V3/Blank/style.css' rel='stylesheet' />
 			<link href='/themes/V3/5ePHB/style.css' rel='stylesheet' />
 			{renderNavItems()}
-			<div className="content">
-			<SplitPane showDividerButtons={false}>
-				<div className='form dataGroup'>{renderForm()}</div>
-				<div className='resultsContainer dataGroup'>
-					{renderSortBar()}
-					{renderFoundBrews()}
-				</div>
-			</SplitPane>
+			<div className='content'>
+				<SplitPane showDividerButtons={false}>
+					<div className='form dataGroup'>{renderForm()}</div>
+					<div className='resultsContainer dataGroup'>
+						{renderSortBar()}
+						{renderFoundBrews()}
+					</div>
+				</SplitPane>
 			</div>
 		</div>
 	);
diff --git a/client/homebrew/pages/vaultPage/vaultPage.less b/client/homebrew/pages/vaultPage/vaultPage.less
index a69bcb33b..8a5f3a714 100644
--- a/client/homebrew/pages/vaultPage/vaultPage.less
+++ b/client/homebrew/pages/vaultPage/vaultPage.less
@@ -5,7 +5,7 @@
 
 	*:not(input) { user-select : none; }
 
-	.content .dataGroup {
+	:where(.content .dataGroup) {
 		width      : 100%;
 		height     : 100%;
 		background : white;
@@ -169,9 +169,10 @@
 				width            : 100%;
 				height           : 100%;
 				max-height       : 100%;
-				padding          : 50px 50px 70px 50px;
+				padding          : 70px 50px;
 				overflow-y       : scroll;
 				background-color : #2C3E50;
+				container-type   : inline-size;
 
 				h3 { font-size : 25px; }
 
@@ -236,6 +237,7 @@
 					margin-right     : 40px;
 					color            : black;
 					isolation        : isolate;
+					transition       : width 0.5s;
 						
 					&::after {
 						position         : absolute;
@@ -269,8 +271,8 @@
 					.links { z-index : 2; }
 
 					hr {
-						margin     : 0px;
 						visibility : hidden;
+						margin     : 0px;
 					}
 
 					.thumbnail { z-index : -1; }
@@ -278,30 +280,37 @@
 
 				.paginationControls {
 					position              : absolute;
+					top                   : 35px;
 					left                  : 50%;
 					display               : grid;
 					grid-template-areas   : 'previousPage currentPage nextPage';
 					grid-template-columns : 50px 1fr 50px;
+					gap                   : 20px;
 					place-items           : center;
 					width                 : auto;
+					font-size             : 15px;
 					translate             : -50%;
 
+					&:last-child { top : unset; }
+
 					.pages {
 						display         : flex;
 						grid-area       : currentPage;
+						gap             : 1em;
 						justify-content : space-evenly;
 						width           : 100%;
 						height          : 100%;
-						padding         : 5px 8px;
 						text-align      : center;
 
 						.pageNumber {
-							margin-inline           : 1vw;
+							place-content           : center;
+							width                   : fit-content;
+							min-width               : 2em;
 							font-family             : 'Open Sans';
 							font-weight             : 900;
 							color                   : white;
-							text-underline-position : under;
 							text-wrap               : nowrap;
+							text-underline-position : under;
 							cursor                  : pointer;
 
 							&.currentPage {
@@ -329,7 +338,6 @@
 			}
 		}
 	}
-	
 }
 
 @keyframes trailingDots {
@@ -344,8 +352,7 @@
 	100% { content : ' ...'; }
 }
 
-// media query for when the page is smaller than 1079 px in width
-@media screen and (max-width : 1079px) {
+@container (width < 670px) {
 	.vaultPage {
 
 		.dataGroup.form .brewLookup { padding : 1px 20px 20px 10px; }
diff --git a/client/icons/customIcons.less b/client/icons/customIcons.less
index 1c8d1bd47..a2caffc57 100644
--- a/client/icons/customIcons.less
+++ b/client/icons/customIcons.less
@@ -1,84 +1,34 @@
 .fac {
 	display          : inline-block;
-	background-color : currentColor;
-	mask-size        : contain;
-	mask-repeat      : no-repeat;
-	mask-position    : center;
 	width            : 1em;
 	aspect-ratio     : 1;
+	background-color : currentColor;
+	mask-repeat      : no-repeat;
+	mask-position    : center;
+	mask-size        : contain;
 }
-.position-top-left {
-  mask-image: url('../icons/position-top-left.svg');
-}
-.position-top-right {
-  mask-image: url('../icons/position-top-right.svg');
-}
-.position-bottom-left {
-  mask-image: url('../icons/position-bottom-left.svg');
-}
-.position-bottom-right {
-  mask-image: url('../icons/position-bottom-right.svg');
-}
-.position-top {
-  mask-image: url('../icons/position-top.svg');
-}
-.position-right {
-  mask-image: url('../icons/position-right.svg');
-}
-.position-bottom {
-  mask-image: url('../icons/position-bottom.svg');
-}
-.position-left {
-  mask-image: url('../icons/position-left.svg');
-}
-.mask-edge {
-  mask-image: url('../icons/mask-edge.svg');
-}
-.mask-corner {
-  mask-image: url('../icons/mask-corner.svg');
-}
-.mask-center {
-  mask-image: url('../icons/mask-center.svg');
-}
-.book-front-cover {
-  mask-image: url('../icons/book-front-cover.svg');
-}
-.book-back-cover {
-  mask-image: url('../icons/book-back-cover.svg');
-}
-.book-inside-cover {
-  mask-image: url('../icons/book-inside-cover.svg');
-}
-.book-part-cover {
-  mask-image: url('../icons/book-part-cover.svg');
-}
-.image-wrap-left {
-  mask-image: url('../icons/image-wrap-left.svg');
-}
-.image-wrap-right {
-  mask-image: url('../icons/image-wrap-right.svg');
-}
-.davek {
-  mask-image: url('../icons/Davek.svg');
-}
-.rellanic {
-  mask-image: url('../icons/Rellanic.svg');
-}
-.iokharic {
-  mask-image: url('../icons/Iokharic.svg');
-}
-.zoom-to-fit {
-	mask-image: url('../icons/zoom-to-fit.svg');
-}
-.fit-width {
-	mask-image: url('../icons/fit-width.svg');
-}
-.single-spread {
-	mask-image: url('../icons/single-spread.svg');
-}
-.facing-spread {
-	mask-image: url('../icons/facing-spread.svg');
-}
-.flow-spread {
-	mask-image: url('../icons/flow-spread.svg');
-}
+.position-top-left { mask-image : url('../icons/position-top-left.svg'); }
+.position-top-right { mask-image : url('../icons/position-top-right.svg'); }
+.position-bottom-left { mask-image : url('../icons/position-bottom-left.svg'); }
+.position-bottom-right { mask-image : url('../icons/position-bottom-right.svg'); }
+.position-top { mask-image : url('../icons/position-top.svg'); }
+.position-right { mask-image : url('../icons/position-right.svg'); }
+.position-bottom { mask-image : url('../icons/position-bottom.svg'); }
+.position-left { mask-image : url('../icons/position-left.svg'); }
+.mask-edge { mask-image : url('../icons/mask-edge.svg'); }
+.mask-corner { mask-image : url('../icons/mask-corner.svg'); }
+.mask-center { mask-image : url('../icons/mask-center.svg'); }
+.book-front-cover { mask-image : url('../icons/book-front-cover.svg'); }
+.book-back-cover { mask-image : url('../icons/book-back-cover.svg'); }
+.book-inside-cover { mask-image : url('../icons/book-inside-cover.svg'); }
+.book-part-cover { mask-image : url('../icons/book-part-cover.svg'); }
+.image-wrap-left { mask-image : url('../icons/image-wrap-left.svg'); }
+.image-wrap-right { mask-image : url('../icons/image-wrap-right.svg'); }
+.davek { mask-image : url('../icons/Davek.svg'); }
+.rellanic { mask-image : url('../icons/Rellanic.svg'); }
+.iokharic { mask-image : url('../icons/Iokharic.svg'); }
+.zoom-to-fit { mask-image : url('../icons/zoom-to-fit.svg'); }
+.fit-width { mask-image : url('../icons/fit-width.svg'); }
+.single-spread { mask-image : url('../icons/single-spread.svg'); }
+.facing-spread { mask-image : url('../icons/facing-spread.svg'); }
+.flow-spread { mask-image : url('../icons/flow-spread.svg'); }
diff --git a/package-lock.json b/package-lock.json
index bd3f71491..69cc1cade 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,29 +1,28 @@
 {
   "name": "homebrewery",
-  "version": "3.17.0",
+  "version": "3.18.1",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "homebrewery",
-      "version": "3.17.0",
+      "version": "3.18.1",
       "hasInstallScript": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/core": "^7.26.8",
-        "@babel/plugin-transform-runtime": "^7.26.8",
-        "@babel/preset-env": "^7.26.8",
+        "@babel/core": "^7.26.9",
+        "@babel/plugin-transform-runtime": "^7.26.9",
+        "@babel/preset-env": "^7.26.9",
         "@babel/preset-react": "^7.26.3",
-        "@googleapis/drive": "^8.14.0",
+        "@googleapis/drive": "^8.16.0",
         "body-parser": "^1.20.2",
         "classnames": "^2.5.1",
         "codemirror": "^5.65.6",
         "cookie-parser": "^1.4.7",
-        "core-js": "^3.40.0",
+        "core-js": "^3.41.0",
         "cors": "^2.8.5",
         "create-react-class": "^15.7.0",
         "dedent-tabs": "^0.10.3",
-        "dompurify": "^3.2.4",
         "expr-eval": "^2.0.2",
         "express": "^4.21.2",
         "express-async-handler": "^1.2.0",
@@ -34,20 +33,21 @@
         "jwt-simple": "^0.5.6",
         "less": "^3.13.1",
         "lodash": "^4.17.21",
-        "marked": "13.0.3",
-        "marked-emoji": "^1.4.3",
-        "marked-extended-tables": "^1.1.0",
+        "marked": "14.0.0",
+        "marked-emoji": "^2.0.0",
+        "marked-extended-tables": "^2.0.1",
         "marked-gfm-heading-id": "^4.0.1",
         "marked-smartypants-lite": "^1.0.3",
+        "marked-subsuper-text": "^1.0.3",
         "markedLegacy": "npm:marked@^0.3.19",
         "moment": "^2.30.1",
-        "mongoose": "^8.10.0",
-        "nanoid": "5.0.9",
+        "mongoose": "^8.12.1",
+        "nanoid": "5.1.3",
         "nconf": "^0.12.1",
         "react": "^18.3.1",
         "react-dom": "^18.3.1",
         "react-frame-component": "^4.1.3",
-        "react-router": "^7.1.5",
+        "react-router": "^7.3.0",
         "sanitize-filename": "1.6.3",
         "superagent": "^10.1.1",
         "vitreum": "git+https://git@github.com/calculuschild/vitreum.git"
@@ -55,15 +55,15 @@
       "devDependencies": {
         "@stylistic/stylelint-plugin": "^3.1.2",
         "babel-plugin-transform-import-meta": "^2.3.2",
-        "eslint": "^9.20.0",
+        "eslint": "^9.22.0",
         "eslint-plugin-jest": "^28.11.0",
         "eslint-plugin-react": "^7.37.4",
-        "globals": "^15.14.0",
+        "globals": "^16.0.0",
         "jest": "^29.7.0",
         "jest-expect-message": "^1.1.3",
         "jsdom-global": "^3.0.2",
         "postcss-less": "^6.0.0",
-        "stylelint": "^16.14.1",
+        "stylelint": "^16.16.0",
         "stylelint-config-recess-order": "^6.0.0",
         "stylelint-config-recommended": "^15.0.0",
         "supertest": "^7.0.0"
@@ -110,22 +110,21 @@
       }
     },
     "node_modules/@babel/core": {
-      "version": "7.26.8",
-      "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.26.8.tgz",
-      "integrity": "sha512-l+lkXCHS6tQEc5oUpK28xBOZ6+HwaH7YwoYQbLFiYb4nS2/l1tKnZEtEWkD0GuiYdvArf9qBS0XlQGXzPMsNqQ==",
+      "version": "7.26.9",
+      "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.26.9.tgz",
+      "integrity": "sha512-lWBYIrF7qK5+GjY5Uy+/hEgp8OJWOD/rpy74GplYRhEauvbHDeFB8t5hPOZxCZ0Oxf4Cc36tK51/l3ymJysrKw==",
       "license": "MIT",
       "dependencies": {
         "@ampproject/remapping": "^2.2.0",
         "@babel/code-frame": "^7.26.2",
-        "@babel/generator": "^7.26.8",
+        "@babel/generator": "^7.26.9",
         "@babel/helper-compilation-targets": "^7.26.5",
         "@babel/helper-module-transforms": "^7.26.0",
-        "@babel/helpers": "^7.26.7",
-        "@babel/parser": "^7.26.8",
-        "@babel/template": "^7.26.8",
-        "@babel/traverse": "^7.26.8",
-        "@babel/types": "^7.26.8",
-        "@types/gensync": "^1.0.0",
+        "@babel/helpers": "^7.26.9",
+        "@babel/parser": "^7.26.9",
+        "@babel/template": "^7.26.9",
+        "@babel/traverse": "^7.26.9",
+        "@babel/types": "^7.26.9",
         "convert-source-map": "^2.0.0",
         "debug": "^4.1.0",
         "gensync": "^1.0.0-beta.2",
@@ -141,13 +140,13 @@
       }
     },
     "node_modules/@babel/generator": {
-      "version": "7.26.8",
-      "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.26.8.tgz",
-      "integrity": "sha512-ef383X5++iZHWAXX0SXQR6ZyQhw/0KtTkrTz61WXRhFM6dhpHulO/RJz79L8S6ugZHJkOOkUrUdxgdF2YiPFnA==",
+      "version": "7.26.9",
+      "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.26.9.tgz",
+      "integrity": "sha512-kEWdzjOAUMW4hAyrzJ0ZaTOu9OmpyDIQicIh0zg0EEcEkYXZb2TjtBhnHi2ViX7PKwZqF4xwqfAm299/QMP3lg==",
       "license": "MIT",
       "dependencies": {
-        "@babel/parser": "^7.26.8",
-        "@babel/types": "^7.26.8",
+        "@babel/parser": "^7.26.9",
+        "@babel/types": "^7.26.9",
         "@jridgewell/gen-mapping": "^0.3.5",
         "@jridgewell/trace-mapping": "^0.3.25",
         "jsesc": "^3.0.2"
@@ -377,25 +376,25 @@
       }
     },
     "node_modules/@babel/helpers": {
-      "version": "7.26.7",
-      "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.26.7.tgz",
-      "integrity": "sha512-8NHiL98vsi0mbPQmYAGWwfcFaOy4j2HY49fXJCfuDcdE7fMIsH9a7GdaeXpIBsbT7307WU8KCMp5pUVDNL4f9A==",
+      "version": "7.26.10",
+      "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.26.10.tgz",
+      "integrity": "sha512-UPYc3SauzZ3JGgj87GgZ89JVdC5dj0AoetR5Bw6wj4niittNyFh6+eOGonYvJ1ao6B8lEa3Q3klS7ADZ53bc5g==",
       "license": "MIT",
       "dependencies": {
-        "@babel/template": "^7.25.9",
-        "@babel/types": "^7.26.7"
+        "@babel/template": "^7.26.9",
+        "@babel/types": "^7.26.10"
       },
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@babel/parser": {
-      "version": "7.26.8",
-      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.26.8.tgz",
-      "integrity": "sha512-TZIQ25pkSoaKEYYaHbbxkfL36GNsQ6iFiBbeuzAkLnXayKR1yP1zFe+NxuZWWsUyvt8icPU9CCq0sgWGXR1GEw==",
+      "version": "7.26.9",
+      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.26.9.tgz",
+      "integrity": "sha512-81NWa1njQblgZbQHxWHpxxCzNsa3ZwvFqpUg7P+NNUU6f3UU2jBEg4OlF/J6rl8+PQGh1q6/zWScd001YwcA5A==",
       "license": "MIT",
       "dependencies": {
-        "@babel/types": "^7.26.8"
+        "@babel/types": "^7.26.9"
       },
       "bin": {
         "parser": "bin/babel-parser.js"
@@ -974,11 +973,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-for-of": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-for-of/-/plugin-transform-for-of-7.25.9.tgz",
-      "integrity": "sha512-LqHxduHoaGELJl2uhImHwRQudhCM50pT46rIBNvtT/Oql3nqiS3wOwP+5ten7NpYSXrrVLgtZU3DZmPtWZo16A==",
+      "version": "7.26.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-for-of/-/plugin-transform-for-of-7.26.9.tgz",
+      "integrity": "sha512-Hry8AusVm8LW5BVFgiyUReuoGzPUpdHQQqJY5bZnbbf+ngOHWuCuYFKw/BqaaWlvEUrF91HMhDtEaI1hZzNbLg==",
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.25.9",
+        "@babel/helper-plugin-utils": "^7.26.5",
         "@babel/helper-skip-transparent-expression-wrappers": "^7.25.9"
       },
       "engines": {
@@ -1406,9 +1406,9 @@
       }
     },
     "node_modules/@babel/plugin-transform-runtime": {
-      "version": "7.26.8",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-runtime/-/plugin-transform-runtime-7.26.8.tgz",
-      "integrity": "sha512-H0jlQxFMI0Q8SyGPsj9pO3ygVQRxPkIGytsL3m1Zqca8KrCPpMlvh+e2dxknqdfS8LFwBw+PpiYPD9qy/FPQpA==",
+      "version": "7.26.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-runtime/-/plugin-transform-runtime-7.26.9.tgz",
+      "integrity": "sha512-Jf+8y9wXQbbxvVYTM8gO5oEF2POdNji0NMltEkG7FtmzD9PVz7/lxpqSdTvwsjTMU5HIHuDVNf2SOxLkWi+wPQ==",
       "license": "MIT",
       "dependencies": {
         "@babel/helper-module-imports": "^7.25.9",
@@ -1558,9 +1558,9 @@
       }
     },
     "node_modules/@babel/preset-env": {
-      "version": "7.26.8",
-      "resolved": "https://registry.npmjs.org/@babel/preset-env/-/preset-env-7.26.8.tgz",
-      "integrity": "sha512-um7Sy+2THd697S4zJEfv/U5MHGJzkN2xhtsR3T/SWRbVSic62nbISh51VVfU9JiO/L/Z97QczHTaFVkOU8IzNg==",
+      "version": "7.26.9",
+      "resolved": "https://registry.npmjs.org/@babel/preset-env/-/preset-env-7.26.9.tgz",
+      "integrity": "sha512-vX3qPGE8sEKEAZCWk05k3cpTAE3/nOYca++JA+Rd0z2NCNzabmYvEiSShKzm10zdquOIAVXsy2Ei/DTW34KlKQ==",
       "license": "MIT",
       "dependencies": {
         "@babel/compat-data": "^7.26.8",
@@ -1592,7 +1592,7 @@
         "@babel/plugin-transform-dynamic-import": "^7.25.9",
         "@babel/plugin-transform-exponentiation-operator": "^7.26.3",
         "@babel/plugin-transform-export-namespace-from": "^7.25.9",
-        "@babel/plugin-transform-for-of": "^7.25.9",
+        "@babel/plugin-transform-for-of": "^7.26.9",
         "@babel/plugin-transform-function-name": "^7.25.9",
         "@babel/plugin-transform-json-strings": "^7.25.9",
         "@babel/plugin-transform-literals": "^7.25.9",
@@ -1688,9 +1688,10 @@
       }
     },
     "node_modules/@babel/runtime": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.25.9.tgz",
-      "integrity": "sha512-4zpTHZ9Cm6L9L+uIqghQX8ZXg8HKFcjYO3qHoO8zTmRm6HQUJ8SSJ+KRvbMBZn0EGVlT4DRYeQ/6hjlyXBh+Kg==",
+      "version": "7.26.10",
+      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.26.10.tgz",
+      "integrity": "sha512-2WJMeRQPHKSPemqk/awGrAiuFfzBmOIPXKizAsVhWH9YJqLZ0H+HS4c8loHGgW6utJ3E/ejXQUsiGaQy2NZ9Fw==",
+      "license": "MIT",
       "dependencies": {
         "regenerator-runtime": "^0.14.0"
       },
@@ -1699,30 +1700,30 @@
       }
     },
     "node_modules/@babel/template": {
-      "version": "7.26.8",
-      "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.26.8.tgz",
-      "integrity": "sha512-iNKaX3ZebKIsCvJ+0jd6embf+Aulaa3vNBqZ41kM7iTWjx5qzWKXGHiJUW3+nTpQ18SG11hdF8OAzKrpXkb96Q==",
+      "version": "7.26.9",
+      "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.26.9.tgz",
+      "integrity": "sha512-qyRplbeIpNZhmzOysF/wFMuP9sctmh2cFzRAZOn1YapxBsE1i9bJIY586R/WBLfLcmcBlM8ROBiQURnnNy+zfA==",
       "license": "MIT",
       "dependencies": {
         "@babel/code-frame": "^7.26.2",
-        "@babel/parser": "^7.26.8",
-        "@babel/types": "^7.26.8"
+        "@babel/parser": "^7.26.9",
+        "@babel/types": "^7.26.9"
       },
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@babel/traverse": {
-      "version": "7.26.8",
-      "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.26.8.tgz",
-      "integrity": "sha512-nic9tRkjYH0oB2dzr/JoGIm+4Q6SuYeLEiIiZDwBscRMYFJ+tMAz98fuel9ZnbXViA2I0HVSSRRK8DW5fjXStA==",
+      "version": "7.26.9",
+      "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.26.9.tgz",
+      "integrity": "sha512-ZYW7L+pL8ahU5fXmNbPF+iZFHCv5scFak7MZ9bwaRPLUhHh7QQEMjZUg0HevihoqCM5iSYHN61EyCoZvqC+bxg==",
       "license": "MIT",
       "dependencies": {
         "@babel/code-frame": "^7.26.2",
-        "@babel/generator": "^7.26.8",
-        "@babel/parser": "^7.26.8",
-        "@babel/template": "^7.26.8",
-        "@babel/types": "^7.26.8",
+        "@babel/generator": "^7.26.9",
+        "@babel/parser": "^7.26.9",
+        "@babel/template": "^7.26.9",
+        "@babel/types": "^7.26.9",
         "debug": "^4.3.1",
         "globals": "^11.1.0"
       },
@@ -1740,9 +1741,9 @@
       }
     },
     "node_modules/@babel/types": {
-      "version": "7.26.8",
-      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.26.8.tgz",
-      "integrity": "sha512-eUuWapzEGWFEpHFxgEaBG8e3n6S8L3MSu0oda755rOfabWPnh0Our1AozNFVUxGFIhbKgd1ksprsoDGMinTOTA==",
+      "version": "7.26.10",
+      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.26.10.tgz",
+      "integrity": "sha512-emqcG3vHrpxUKTrxcblR36dcrcoRDvKmnL/dCL6ZsHaShW80qxCAcNhzQZrpeM765VzEos+xOi4s+r4IXzTwdQ==",
       "license": "MIT",
       "dependencies": {
         "@babel/helper-string-parser": "^7.25.9",
@@ -1862,12 +1863,13 @@
       }
     },
     "node_modules/@eslint/config-array": {
-      "version": "0.19.0",
-      "resolved": "https://registry.npmjs.org/@eslint/config-array/-/config-array-0.19.0.tgz",
-      "integrity": "sha512-zdHg2FPIFNKPdcHWtiNT+jEFCHYVplAXRDlQDyqy0zGx/q2parwh7brGJSiTxRk/TSMkbM//zt/f5CHgyTyaSQ==",
+      "version": "0.19.2",
+      "resolved": "https://registry.npmjs.org/@eslint/config-array/-/config-array-0.19.2.tgz",
+      "integrity": "sha512-GNKqxfHG2ySmJOBSHg7LxeUx4xpuCoFjacmlCoYWEbaPXLwvfIjixRI12xCQZeULksQb23uiA8F40w5TojpV7w==",
       "dev": true,
+      "license": "Apache-2.0",
       "dependencies": {
-        "@eslint/object-schema": "^2.1.4",
+        "@eslint/object-schema": "^2.1.6",
         "debug": "^4.3.1",
         "minimatch": "^3.1.2"
       },
@@ -1875,11 +1877,22 @@
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
       }
     },
-    "node_modules/@eslint/core": {
-      "version": "0.10.0",
-      "resolved": "https://registry.npmjs.org/@eslint/core/-/core-0.10.0.tgz",
-      "integrity": "sha512-gFHJ+xBOo4G3WRlR1e/3G8A6/KZAH6zcE/hkLRCZTi/B9avAG365QhFA8uOGzTMqgTghpn7/fSnscW++dpMSAw==",
+    "node_modules/@eslint/config-helpers": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/@eslint/config-helpers/-/config-helpers-0.1.0.tgz",
+      "integrity": "sha512-kLrdPDJE1ckPo94kmPPf9Hfd0DU0Jw6oKYrhe+pwSC0iTUInmTa+w6fw8sGgcfkFJGNdWOUeOaDM4quW4a7OkA==",
       "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      }
+    },
+    "node_modules/@eslint/core": {
+      "version": "0.12.0",
+      "resolved": "https://registry.npmjs.org/@eslint/core/-/core-0.12.0.tgz",
+      "integrity": "sha512-cmrR6pytBuSMTaBweKoGMwu3EiHiEC+DoyupPmlZ0HxBJBtIxwe+j/E4XPIKNx+Q74c8lXKPwYawBf5glsTkHg==",
+      "dev": true,
+      "license": "Apache-2.0",
       "dependencies": {
         "@types/json-schema": "^7.0.15"
       },
@@ -1888,10 +1901,11 @@
       }
     },
     "node_modules/@eslint/eslintrc": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-3.2.0.tgz",
-      "integrity": "sha512-grOjVNN8P3hjJn/eIETF1wwd12DdnwFDoyceUJLYYdkpbwq3nLi+4fqrTAONx7XDALqlL220wC/RHSC/QTI/0w==",
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-3.3.0.tgz",
+      "integrity": "sha512-yaVPAiNAalnCZedKLdR21GOGILMLKPyqSLWaAjQFvYA2i/ciDi8ArYVr69Anohb6cH2Ukhqti4aFnYyPm8wdwQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "ajv": "^6.12.4",
         "debug": "^4.3.2",
@@ -1915,6 +1929,7 @@
       "resolved": "https://registry.npmjs.org/globals/-/globals-14.0.0.tgz",
       "integrity": "sha512-oahGvuMGQlPw/ivIYBjVSrWAfWLBeku5tpPE2fOPLi+WHffIWbuh2tCjhyQhTBPMf5E9jDEH4FOmTYgYwbKwtQ==",
       "dev": true,
+      "license": "MIT",
       "engines": {
         "node": ">=18"
       },
@@ -1923,9 +1938,9 @@
       }
     },
     "node_modules/@eslint/js": {
-      "version": "9.20.0",
-      "resolved": "https://registry.npmjs.org/@eslint/js/-/js-9.20.0.tgz",
-      "integrity": "sha512-iZA07H9io9Wn836aVTytRaNqh00Sad+EamwOVJT12GTLw1VGMFV/4JaME+JjLtr9fiGaoWgYnS54wrfWsSs4oQ==",
+      "version": "9.22.0",
+      "resolved": "https://registry.npmjs.org/@eslint/js/-/js-9.22.0.tgz",
+      "integrity": "sha512-vLFajx9o8d1/oL2ZkpMYbkLv8nDB6yaIwFNt7nI4+I80U/z03SxmfOMsLbvWr3p7C+Wnoh//aOu2pQW8cS0HCQ==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -1933,21 +1948,23 @@
       }
     },
     "node_modules/@eslint/object-schema": {
-      "version": "2.1.4",
-      "resolved": "https://registry.npmjs.org/@eslint/object-schema/-/object-schema-2.1.4.tgz",
-      "integrity": "sha512-BsWiH1yFGjXXS2yvrf5LyuoSIIbPrGUWob917o+BTKuZ7qJdxX8aJLRxs1fS9n6r7vESrq1OUqb68dANcFXuQQ==",
+      "version": "2.1.6",
+      "resolved": "https://registry.npmjs.org/@eslint/object-schema/-/object-schema-2.1.6.tgz",
+      "integrity": "sha512-RBMg5FRL0I0gs51M/guSAj5/e14VQ4tpZnQNWwuDT66P14I43ItmPfIZRhO9fUVIPOAQXU47atlywZ/czoqFPA==",
       "dev": true,
+      "license": "Apache-2.0",
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
       }
     },
     "node_modules/@eslint/plugin-kit": {
-      "version": "0.2.5",
-      "resolved": "https://registry.npmjs.org/@eslint/plugin-kit/-/plugin-kit-0.2.5.tgz",
-      "integrity": "sha512-lB05FkqEdUg2AA0xEbUz0SnkXT1LcCTa438W4IWTUh4hdOnVbQyOJ81OrDXsJk/LSiJHubgGEFoR5EHq1NsH1A==",
+      "version": "0.2.7",
+      "resolved": "https://registry.npmjs.org/@eslint/plugin-kit/-/plugin-kit-0.2.7.tgz",
+      "integrity": "sha512-JubJ5B2pJ4k4yGxaNLdbjrnk9d/iDz6/q8wOilpIowd6PJPgaxCuHBnBszq7Ce2TyMrywm5r4PnKm6V3iiZF+g==",
       "dev": true,
+      "license": "Apache-2.0",
       "dependencies": {
-        "@eslint/core": "^0.10.0",
+        "@eslint/core": "^0.12.0",
         "levn": "^0.4.1"
       },
       "engines": {
@@ -1955,9 +1972,10 @@
       }
     },
     "node_modules/@googleapis/drive": {
-      "version": "8.14.0",
-      "resolved": "https://registry.npmjs.org/@googleapis/drive/-/drive-8.14.0.tgz",
-      "integrity": "sha512-AOokfpP6pCdcJXWA8khaCEgbGpWYavWTdAAhL4idbbf2VCQcJ2f7vPalAYNu6a4Sfj0Ly4Ehnd1xw9J9TixB1A==",
+      "version": "8.16.0",
+      "resolved": "https://registry.npmjs.org/@googleapis/drive/-/drive-8.16.0.tgz",
+      "integrity": "sha512-Xi2mMrUTQ+gsfyouRGd0pfnL+jjg4n4sjKsJruM1y4DknuRfdSBTk5E//WrL0YJ/CqpcBgyd7L8DvaPRtxZD3Q==",
+      "license": "Apache-2.0",
       "dependencies": {
         "googleapis-common": "^7.0.0"
       },
@@ -2015,10 +2033,11 @@
       }
     },
     "node_modules/@humanwhocodes/retry": {
-      "version": "0.4.1",
-      "resolved": "https://registry.npmjs.org/@humanwhocodes/retry/-/retry-0.4.1.tgz",
-      "integrity": "sha512-c7hNEllBlenFTHBky65mhq8WD2kbN9Q6gk0bTk8lSBvc554jpXSkST1iePudpt7+A/AQvuHs9EMqjHDXMY1lrA==",
+      "version": "0.4.2",
+      "resolved": "https://registry.npmjs.org/@humanwhocodes/retry/-/retry-0.4.2.tgz",
+      "integrity": "sha512-xeO57FpIu4p1Ri3Jq/EXq4ClRm86dVF2z/+kvFnyqVYRavTZmaFaUBbWCOuuTh0o/g7DSsk6kc2vrS4Vl5oPOQ==",
       "dev": true,
+      "license": "Apache-2.0",
       "engines": {
         "node": ">=18.18"
       },
@@ -2685,10 +2704,11 @@
       }
     },
     "node_modules/@keyv/serialize": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@keyv/serialize/-/serialize-1.0.2.tgz",
-      "integrity": "sha512-+E/LyaAeuABniD/RvUezWVXKpeuvwLEA9//nE9952zBaOdBd2mQ3pPoM8cUe2X6IcMByfuSLzmYqnYshG60+HQ==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/@keyv/serialize/-/serialize-1.0.3.tgz",
+      "integrity": "sha512-qnEovoOp5Np2JDGonIDL6Ayihw0RhnRh6vxPuHo4RDn1UOzwEo4AeIfpL6UGIrsceWrCMiVPgwRjbHu4vYFc3g==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "buffer": "^6.0.3"
       }
@@ -2712,6 +2732,7 @@
           "url": "https://feross.org/support"
         }
       ],
+      "license": "MIT",
       "dependencies": {
         "base64-js": "^1.3.1",
         "ieee754": "^1.2.1"
@@ -2871,12 +2892,6 @@
       "integrity": "sha512-AYnb1nQyY49te+VRAVgmzfcgjYS91mY5P0TKUDCLEM+gNnA+3T6rWITXRLYCpahpqSQbN5cE+gHpnPyXjHWxcw==",
       "dev": true
     },
-    "node_modules/@types/gensync": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/@types/gensync/-/gensync-1.0.4.tgz",
-      "integrity": "sha512-C3YYeRQWp2fmq9OryX+FoDy8nXS6scQ7dPptD8LnFDAUNcKWJjXQKDNJD3HVm+kOUsXhTOkpi69vI4EuAr95bA==",
-      "license": "MIT"
-    },
     "node_modules/@types/graceful-fs": {
       "version": "4.1.9",
       "resolved": "https://registry.npmjs.org/@types/graceful-fs/-/graceful-fs-4.1.9.tgz",
@@ -2918,7 +2933,8 @@
       "version": "7.0.15",
       "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.15.tgz",
       "integrity": "sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==",
-      "dev": true
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/@types/node": {
       "version": "22.1.0",
@@ -2937,12 +2953,6 @@
       "dev": true,
       "license": "MIT"
     },
-    "node_modules/@types/trusted-types": {
-      "version": "2.0.7",
-      "resolved": "https://registry.npmjs.org/@types/trusted-types/-/trusted-types-2.0.7.tgz",
-      "integrity": "sha512-ScaPdn1dQczgbl0QFTeTOmVHFULt394XJgOQNoyVhZ6r2vLnMLJfBPd53SB52T/3G36VI1/g2MZaX0cwDuXsfw==",
-      "optional": true
-    },
     "node_modules/@types/webidl-conversions": {
       "version": "7.0.3",
       "resolved": "https://registry.npmjs.org/@types/webidl-conversions/-/webidl-conversions-7.0.3.tgz",
@@ -3134,6 +3144,7 @@
       "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.14.0.tgz",
       "integrity": "sha512-cl669nCJTZBsL97OF4kUQm5g5hC2uihk0NxY3WENAC0TYdILVkAyHymAntgxGkl7K+t0cXIrH5siy5S4XkFycA==",
       "dev": true,
+      "license": "MIT",
       "bin": {
         "acorn": "bin/acorn"
       },
@@ -3146,6 +3157,7 @@
       "resolved": "https://registry.npmjs.org/acorn-jsx/-/acorn-jsx-5.3.2.tgz",
       "integrity": "sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==",
       "dev": true,
+      "license": "MIT",
       "peerDependencies": {
         "acorn": "^6.0.0 || ^7.0.0 || ^8.0.0"
       }
@@ -3199,6 +3211,7 @@
       "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz",
       "integrity": "sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "fast-deep-equal": "^3.1.1",
         "fast-json-stable-stringify": "^2.0.0",
@@ -3865,6 +3878,16 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/bindings": {
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/bindings/-/bindings-1.5.0.tgz",
+      "integrity": "sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==",
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "file-uri-to-path": "1.0.0"
+      }
+    },
     "node_modules/bn.js": {
       "version": "5.2.1",
       "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-5.2.1.tgz",
@@ -4171,9 +4194,9 @@
       }
     },
     "node_modules/bson": {
-      "version": "6.10.2",
-      "resolved": "https://registry.npmjs.org/bson/-/bson-6.10.2.tgz",
-      "integrity": "sha512-5afhLTjqDSA3akH56E+/2J6kTDuSIlBxyXPdQslj9hcIgOUE378xdOfZvC/9q3LifJNI6KR/juZ+d0NRNYBwXg==",
+      "version": "6.10.3",
+      "resolved": "https://registry.npmjs.org/bson/-/bson-6.10.3.tgz",
+      "integrity": "sha512-MTxGsqgYTwfshYWTRdmZRC+M7FnG1b4y7RO7p2k3X24Wq0yv1m77Wsj0BzlPzd/IowgESfsruQCUToa7vbOpPQ==",
       "license": "Apache-2.0",
       "engines": {
         "node": ">=16.20.1"
@@ -4243,22 +4266,24 @@
       }
     },
     "node_modules/cacheable": {
-      "version": "1.8.7",
-      "resolved": "https://registry.npmjs.org/cacheable/-/cacheable-1.8.7.tgz",
-      "integrity": "sha512-AbfG7dAuYNjYxFUtL1lAqmlWdxczCJ47w7cFjhGcnGnUdwSo6VgmSojfoW3tUI12HUkgTJ5kqj78yyq6TsFtlg==",
+      "version": "1.8.9",
+      "resolved": "https://registry.npmjs.org/cacheable/-/cacheable-1.8.9.tgz",
+      "integrity": "sha512-FicwAUyWnrtnd4QqYAoRlNs44/a1jTL7XDKqm5gJ90wz1DQPlC7U2Rd1Tydpv+E7WAr4sQHuw8Q8M3nZMAyecQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "hookified": "^1.6.0",
-        "keyv": "^5.2.3"
+        "hookified": "^1.7.1",
+        "keyv": "^5.3.1"
       }
     },
     "node_modules/cacheable/node_modules/keyv": {
-      "version": "5.2.3",
-      "resolved": "https://registry.npmjs.org/keyv/-/keyv-5.2.3.tgz",
-      "integrity": "sha512-AGKecUfzrowabUv0bH1RIR5Vf7w+l4S3xtQAypKaUpTdIR1EbrAcTxHCrpo9Q+IWeUlFE2palRtgIQcgm+PQJw==",
+      "version": "5.3.1",
+      "resolved": "https://registry.npmjs.org/keyv/-/keyv-5.3.1.tgz",
+      "integrity": "sha512-13hQT2q2VIwOoaJdJa7nY3J8UVbYtMTJFHnwm9LI+SaQRfUiM6Em9KZeOVTCKbMnGcRIL3NSUFpAdjZCq24nLQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@keyv/serialize": "^1.0.2"
+        "@keyv/serialize": "^1.0.3"
       }
     },
     "node_modules/cached-path-relative": {
@@ -4385,6 +4410,20 @@
         "fsevents": "~2.3.2"
       }
     },
+    "node_modules/chokidar/node_modules/fsevents": {
+      "version": "2.3.3",
+      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
+      "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
+      "hasInstallScript": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
+      }
+    },
     "node_modules/chokidar/node_modules/glob-parent": {
       "version": "5.1.2",
       "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
@@ -4687,10 +4726,11 @@
       }
     },
     "node_modules/core-js": {
-      "version": "3.40.0",
-      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.40.0.tgz",
-      "integrity": "sha512-7vsMc/Lty6AGnn7uFpYT56QesI5D2Y/UkgKounk87OP9Z2H9Z8kj6jzcSGAxFmUtDOS0ntK6lbQz+Nsa0Jj6mQ==",
+      "version": "3.41.0",
+      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.41.0.tgz",
+      "integrity": "sha512-SJ4/EHwS36QMJd6h/Rg+GyR4A5xE0FSI3eZ+iBVpfqf1x0eTSg1smWLHrA+2jQThZSh97fmSgFSU8B61nxosxA==",
       "hasInstallScript": true,
+      "license": "MIT",
       "funding": {
         "type": "opencollective",
         "url": "https://opencollective.com/core-js"
@@ -5344,15 +5384,6 @@
         "npm": ">=1.2"
       }
     },
-    "node_modules/dompurify": {
-      "version": "3.2.4",
-      "resolved": "https://registry.npmjs.org/dompurify/-/dompurify-3.2.4.tgz",
-      "integrity": "sha512-ysFSFEDVduQpyhzAob/kkuJjf5zWkZD8/A9ywSp1byueyuCfHamrCBa14/Oc2iiB0e51B+NpxSl5gmzn+Ms/mg==",
-      "license": "(MPL-2.0 OR Apache-2.0)",
-      "optionalDependencies": {
-        "@types/trusted-types": "^2.0.7"
-      }
-    },
     "node_modules/dunder-proto": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/dunder-proto/-/dunder-proto-1.0.1.tgz",
@@ -5397,9 +5428,10 @@
       "license": "ISC"
     },
     "node_modules/elliptic": {
-      "version": "6.6.0",
-      "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.6.0.tgz",
-      "integrity": "sha512-dpwoQcLc/2WLQvJvLRHKZ+f9FgOdjnq11rurqwekGQygGPsYSK29OMMD2WalatiqQ+XGFDglTNixpPfI+lpaAA==",
+      "version": "6.6.1",
+      "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.6.1.tgz",
+      "integrity": "sha512-RaddvvMatK2LJHqFJ+YA4WysVN5Ita9E35botqIYspQ4TkRAlCicdzKOjlyv/1Za5RyTNn7di//eEV0uTAfe3g==",
+      "license": "MIT",
       "dependencies": {
         "bn.js": "^4.11.9",
         "brorand": "^1.1.0",
@@ -5665,22 +5697,23 @@
       "license": "MIT"
     },
     "node_modules/eslint": {
-      "version": "9.20.0",
-      "resolved": "https://registry.npmjs.org/eslint/-/eslint-9.20.0.tgz",
-      "integrity": "sha512-aL4F8167Hg4IvsW89ejnpTwx+B/UQRzJPGgbIOl+4XqffWsahVVsLEWoZvnrVuwpWmnRd7XeXmQI1zlKcFDteA==",
+      "version": "9.22.0",
+      "resolved": "https://registry.npmjs.org/eslint/-/eslint-9.22.0.tgz",
+      "integrity": "sha512-9V/QURhsRN40xuHXWjV64yvrzMjcz7ZyNoF2jJFmy9j/SLk0u1OLSZgXi28MrXjymnjEGSR80WCdab3RGMDveQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "@eslint-community/eslint-utils": "^4.2.0",
         "@eslint-community/regexpp": "^4.12.1",
-        "@eslint/config-array": "^0.19.0",
-        "@eslint/core": "^0.11.0",
-        "@eslint/eslintrc": "^3.2.0",
-        "@eslint/js": "9.20.0",
-        "@eslint/plugin-kit": "^0.2.5",
+        "@eslint/config-array": "^0.19.2",
+        "@eslint/config-helpers": "^0.1.0",
+        "@eslint/core": "^0.12.0",
+        "@eslint/eslintrc": "^3.3.0",
+        "@eslint/js": "9.22.0",
+        "@eslint/plugin-kit": "^0.2.7",
         "@humanfs/node": "^0.16.6",
         "@humanwhocodes/module-importer": "^1.0.1",
-        "@humanwhocodes/retry": "^0.4.1",
+        "@humanwhocodes/retry": "^0.4.2",
         "@types/estree": "^1.0.6",
         "@types/json-schema": "^7.0.15",
         "ajv": "^6.12.4",
@@ -5688,7 +5721,7 @@
         "cross-spawn": "^7.0.6",
         "debug": "^4.3.2",
         "escape-string-regexp": "^4.0.0",
-        "eslint-scope": "^8.2.0",
+        "eslint-scope": "^8.3.0",
         "eslint-visitor-keys": "^4.2.0",
         "espree": "^10.3.0",
         "esquery": "^1.5.0",
@@ -5813,10 +5846,11 @@
       }
     },
     "node_modules/eslint-scope": {
-      "version": "8.2.0",
-      "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-8.2.0.tgz",
-      "integrity": "sha512-PHlWUfG6lvPc3yvP5A4PNyBL1W8fkDUccmI21JUu/+GKZBoH/W5u6usENXUrWFRsyoW5ACUjFGgAFQp5gUlb/A==",
+      "version": "8.3.0",
+      "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-8.3.0.tgz",
+      "integrity": "sha512-pUNxi75F8MJ/GdeKtVLSbYg4ZI34J6C0C7sbL4YOp2exGwen7ZsuBqKzUhXd0qMQ362yET3z+uPwKeg/0C2XCQ==",
       "dev": true,
+      "license": "BSD-2-Clause",
       "dependencies": {
         "esrecurse": "^4.3.0",
         "estraverse": "^5.2.0"
@@ -5841,19 +5875,6 @@
         "url": "https://opencollective.com/eslint"
       }
     },
-    "node_modules/eslint/node_modules/@eslint/core": {
-      "version": "0.11.0",
-      "resolved": "https://registry.npmjs.org/@eslint/core/-/core-0.11.0.tgz",
-      "integrity": "sha512-DWUB2pksgNEb6Bz2fggIy1wh6fGgZP4Xyy/Mt0QZPiloKKXerbqq9D3SBQTlCRYOrcRPu4vuz+CGjwdfqxnoWA==",
-      "dev": true,
-      "license": "Apache-2.0",
-      "dependencies": {
-        "@types/json-schema": "^7.0.15"
-      },
-      "engines": {
-        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
-      }
-    },
     "node_modules/eslint/node_modules/chalk": {
       "version": "4.1.2",
       "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
@@ -5924,6 +5945,7 @@
       "resolved": "https://registry.npmjs.org/espree/-/espree-10.3.0.tgz",
       "integrity": "sha512-0QYC8b24HWY8zjRnDTL6RiHfDbAWn63qb4LMj1Z4b076A4une81+z03Kg7l7mn/48PUTqoLptSXez8oknU8Clg==",
       "dev": true,
+      "license": "BSD-2-Clause",
       "dependencies": {
         "acorn": "^8.14.0",
         "acorn-jsx": "^5.3.2",
@@ -5941,6 +5963,7 @@
       "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-4.2.0.tgz",
       "integrity": "sha512-UyLnSehNt62FFhSwjZlHmeokpRK59rcz29j+F1/aDgbkbRTk7wIc9XzdoasMUbRNKDM0qQt/+BJ4BrpFeABemw==",
       "dev": true,
+      "license": "Apache-2.0",
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
       },
@@ -5980,6 +6003,7 @@
       "resolved": "https://registry.npmjs.org/esrecurse/-/esrecurse-4.3.0.tgz",
       "integrity": "sha512-KmfKL3b6G+RXvP8N1vr3Tq1kL/oCFgn2NYXEtqP8/L3pKapUA4G8cFVaoF3SU323CD4XypR/ffioHmkti6/Tag==",
       "dev": true,
+      "license": "BSD-2-Clause",
       "dependencies": {
         "estraverse": "^5.2.0"
       },
@@ -6374,6 +6398,13 @@
         "node": ">=16.0.0"
       }
     },
+    "node_modules/file-uri-to-path": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz",
+      "integrity": "sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw==",
+      "license": "MIT",
+      "optional": true
+    },
     "node_modules/fill-range": {
       "version": "7.1.1",
       "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.1.1.tgz",
@@ -6448,10 +6479,11 @@
       }
     },
     "node_modules/flatted": {
-      "version": "3.3.2",
-      "resolved": "https://registry.npmjs.org/flatted/-/flatted-3.3.2.tgz",
-      "integrity": "sha512-AiwGJM8YcNOaobumgtng+6NHuOqC3A7MixFeDafM3X9cIUM+xUXoS5Vfgf+OihAYe20fxqNM9yPBXJzRtZ/4eA==",
-      "dev": true
+      "version": "3.3.3",
+      "resolved": "https://registry.npmjs.org/flatted/-/flatted-3.3.3.tgz",
+      "integrity": "sha512-GX+ysw4PBCz0PzosHDepZGANEuFCMLrnRTiEy9McGjmkCQYwRq4A/X786G/fjM/+OjsWSU1ZrY5qyARZmO/uwg==",
+      "dev": true,
+      "license": "ISC"
     },
     "node_modules/for-each": {
       "version": "0.3.3",
@@ -6547,6 +6579,25 @@
       "integrity": "sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==",
       "license": "ISC"
     },
+    "node_modules/fsevents": {
+      "version": "1.2.13",
+      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.2.13.tgz",
+      "integrity": "sha512-oWb1Z6mkHIskLzEJ/XWX0srkpkTQ7vaopMQkyaEIoq0fmtFVxOthb8cCxeT+p3ynTdkk/RZwbgG4brR5BeWECw==",
+      "deprecated": "Upgrade to fsevents v2 to mitigate potential security issues",
+      "hasInstallScript": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "dependencies": {
+        "bindings": "^1.5.0",
+        "nan": "^2.12.1"
+      },
+      "engines": {
+        "node": ">= 4.0"
+      }
+    },
     "node_modules/function-bind": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz",
@@ -6813,10 +6864,11 @@
       }
     },
     "node_modules/globals": {
-      "version": "15.14.0",
-      "resolved": "https://registry.npmjs.org/globals/-/globals-15.14.0.tgz",
-      "integrity": "sha512-OkToC372DtlQeje9/zHIo5CT8lRP/FUgEOKBEhU4e0abL7J7CD24fD9ohiLN5hagG/kWCYj4K5oaxxtj2Z0Dig==",
+      "version": "16.0.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-16.0.0.tgz",
+      "integrity": "sha512-iInW14XItCXET01CQFqudPOWP2jYMl7T+QRQT+UNcR/iQncN/F0UNpgd76iFkBPgNQb4+X3LV9tLJYzwh+Gl3A==",
       "dev": true,
+      "license": "MIT",
       "engines": {
         "node": ">=18"
       },
@@ -7135,10 +7187,11 @@
       }
     },
     "node_modules/hookified": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/hookified/-/hookified-1.6.0.tgz",
-      "integrity": "sha512-se7cpwTA+iA/eY548Bu03JJqBiEZAqU2jnyKdj5B5qurtBg64CZGHTgqCv4Yh7NWu6FGI09W61MCq+NoPj9GXA==",
-      "dev": true
+      "version": "1.7.1",
+      "resolved": "https://registry.npmjs.org/hookified/-/hookified-1.7.1.tgz",
+      "integrity": "sha512-OXcdHsXeOiD7OJ5zvWj8Oy/6RCdLwntAX+wUrfemNcMGn6sux4xbEHi2QXwqePYhjQ/yvxxq2MvCRirdlHscBw==",
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/html-encoding-sniffer": {
       "version": "4.0.0",
@@ -8542,6 +8595,21 @@
         "fsevents": "^2.3.2"
       }
     },
+    "node_modules/jest-haste-map/node_modules/fsevents": {
+      "version": "2.3.3",
+      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
+      "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
+      "dev": true,
+      "hasInstallScript": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
+      }
+    },
     "node_modules/jest-leak-detector": {
       "version": "29.7.0",
       "resolved": "https://registry.npmjs.org/jest-leak-detector/-/jest-leak-detector-29.7.0.tgz",
@@ -9425,7 +9493,8 @@
       "version": "0.4.1",
       "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
       "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==",
-      "dev": true
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/json-stable-stringify": {
       "version": "0.0.1",
@@ -9835,9 +9904,9 @@
       }
     },
     "node_modules/marked": {
-      "version": "13.0.3",
-      "resolved": "https://registry.npmjs.org/marked/-/marked-13.0.3.tgz",
-      "integrity": "sha512-rqRix3/TWzE9rIoFGIn8JmsVfhiuC8VIQ8IdX5TfzmeBucdY05/0UlzKaw0eVtpcN/OdVFpBk7CjKGo9iHJ/zA==",
+      "version": "14.0.0",
+      "resolved": "https://registry.npmjs.org/marked/-/marked-14.0.0.tgz",
+      "integrity": "sha512-uIj4+faQ+MgHgwUW1l2PsPglZLOLOT1uErt06dAPtx2kjteLAkbsd/0FiYg/MGS+i7ZKLb7w2WClxHkzOOuryQ==",
       "license": "MIT",
       "bin": {
         "marked": "bin/marked.js"
@@ -9847,17 +9916,19 @@
       }
     },
     "node_modules/marked-emoji": {
-      "version": "1.4.3",
-      "resolved": "https://registry.npmjs.org/marked-emoji/-/marked-emoji-1.4.3.tgz",
-      "integrity": "sha512-HDZx1VOmzu7XT2QNKWfrHGbNRMTWKj9XD78yrcH1madD30HpGLMODPOmKr/e7CA7NKKXkpXXNdndQn++ysXmHg==",
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/marked-emoji/-/marked-emoji-2.0.0.tgz",
+      "integrity": "sha512-oTZ8fqbdVDHFQnqCE1tg4ND7zEd7cUVNHliR9Ldu4eys0J86uz/5Uksjd2mt5xcX16OOScDEr3MmPjajI/ZDHA==",
+      "license": "MIT",
       "peerDependencies": {
         "marked": ">=4 <16"
       }
     },
     "node_modules/marked-extended-tables": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/marked-extended-tables/-/marked-extended-tables-1.1.0.tgz",
-      "integrity": "sha512-xPQlnmr/mpIJEjwg9/guSKzxoKu7hyCD/sM59mcZc+nMIh2JuVM2se+kCa1Jo1UH+BEHcNlZ221ziJ/cOxAgCA==",
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/marked-extended-tables/-/marked-extended-tables-2.0.1.tgz",
+      "integrity": "sha512-DV4Si978ZdaFbycIxzG4TdaNMtC0J8QfIKj1UOCejgJHwVjVJse8DNdJriWDeo/n74DWVYpRC6S56AdgWDPrPA==",
+      "license": "MIT",
       "peerDependencies": {
         "marked": ">=3 <16"
       }
@@ -9883,6 +9954,15 @@
         "marked": ">=4 <16"
       }
     },
+    "node_modules/marked-subsuper-text": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/marked-subsuper-text/-/marked-subsuper-text-1.0.3.tgz",
+      "integrity": "sha512-v5hVVJo6L7HQtplIT8OYNbRWMCGupXYuZ7U9qTsC4yLDtfw24oM5xmWVYfzqzX6hD7KneMfDssMPt6U7fslbxQ==",
+      "license": "MIT",
+      "peerDependencies": {
+        "marked": ">=3 <16"
+      }
+    },
     "node_modules/markedLegacy": {
       "name": "marked",
       "version": "0.3.19",
@@ -10238,14 +10318,14 @@
       }
     },
     "node_modules/mongoose": {
-      "version": "8.10.0",
-      "resolved": "https://registry.npmjs.org/mongoose/-/mongoose-8.10.0.tgz",
-      "integrity": "sha512-nLhk3Qrv6q/HpD2k1O7kbBqsq+/kmKpdv5KJ+LLhQlII3e1p/SSLoLP6jMuSiU6+iLK7zFw4T1niAk3mA3QVug==",
+      "version": "8.12.1",
+      "resolved": "https://registry.npmjs.org/mongoose/-/mongoose-8.12.1.tgz",
+      "integrity": "sha512-UW22y8QFVYmrb36hm8cGncfn4ARc/XsYWQwRTaj0gxtQk1rDuhzDO1eBantS+hTTatfAIS96LlRCJrcNHvW5+Q==",
       "license": "MIT",
       "dependencies": {
-        "bson": "^6.10.1",
+        "bson": "^6.10.3",
         "kareem": "2.6.3",
-        "mongodb": "~6.13.0",
+        "mongodb": "~6.14.0",
         "mpath": "0.9.0",
         "mquery": "5.0.0",
         "ms": "2.1.3",
@@ -10321,13 +10401,13 @@
       }
     },
     "node_modules/mongoose/node_modules/mongodb": {
-      "version": "6.13.0",
-      "resolved": "https://registry.npmjs.org/mongodb/-/mongodb-6.13.0.tgz",
-      "integrity": "sha512-KeESYR5TEaFxOuwRqkOm3XOsMqCSkdeDMjaW5u2nuKfX7rqaofp7JQGoi7sVqQcNJTKuveNbzZtWMstb8ABP6Q==",
+      "version": "6.14.2",
+      "resolved": "https://registry.npmjs.org/mongodb/-/mongodb-6.14.2.tgz",
+      "integrity": "sha512-kMEHNo0F3P6QKDq17zcDuPeaywK/YaJVCEQRzPF3TOM/Bl9MFg64YE5Tu7ifj37qZJMhwU1tl2Ioivws5gRG5Q==",
       "license": "Apache-2.0",
       "dependencies": {
         "@mongodb-js/saslprep": "^1.1.9",
-        "bson": "^6.10.1",
+        "bson": "^6.10.3",
         "mongodb-connection-string-url": "^3.0.0"
       },
       "engines": {
@@ -10392,10 +10472,17 @@
       "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz",
       "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA=="
     },
+    "node_modules/nan": {
+      "version": "2.22.2",
+      "resolved": "https://registry.npmjs.org/nan/-/nan-2.22.2.tgz",
+      "integrity": "sha512-DANghxFkS1plDdRsX0X9pm0Z6SJNN6gBdtXfanwoZ8hooC5gosGFSBGRYHUVPz1asKA/kMRqDRdHrluZ61SpBQ==",
+      "license": "MIT",
+      "optional": true
+    },
     "node_modules/nanoid": {
-      "version": "5.0.9",
-      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-5.0.9.tgz",
-      "integrity": "sha512-Aooyr6MXU6HpvvWXKoVoXwKMs/KyVakWwg7xQfv5/S/RIgJMy0Ifa45H9qqYy7pTCszrHzP21Uk4PZq2HpEM8Q==",
+      "version": "5.1.3",
+      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-5.1.3.tgz",
+      "integrity": "sha512-zAbEOEr7u2CbxwoMRlz/pNSpRP0FdAU4pRaYunCdEezWohXFs+a0Xw7RfkKaezMsmSM1vttcLthJtwRnVtOfHQ==",
       "funding": [
         {
           "type": "github",
@@ -11258,9 +11345,9 @@
       }
     },
     "node_modules/postcss": {
-      "version": "8.5.1",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.1.tgz",
-      "integrity": "sha512-6oz2beyjc5VMn/KV1pPw8fliQkhBXrVn1Z3TVyqZxU8kZpzEKhBdmCFqI6ZbmGtamQvQGuU1sgPTk8ZrXDD7jQ==",
+      "version": "8.5.3",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.3.tgz",
+      "integrity": "sha512-dle9A3yYxlBSrt8Fu+IpjGT8SY8hN0mlaA6GY8t0P5PjIOZemULz/E2Bnm/2dcUOena75OTNkHI76uZBNUUq3A==",
       "dev": true,
       "funding": [
         {
@@ -11666,9 +11753,9 @@
       "license": "MIT"
     },
     "node_modules/react-router": {
-      "version": "7.1.5",
-      "resolved": "https://registry.npmjs.org/react-router/-/react-router-7.1.5.tgz",
-      "integrity": "sha512-8BUF+hZEU4/z/JD201yK6S+UYhsf58bzYIDq2NS1iGpwxSXDu7F+DeGSkIXMFBuHZB21FSiCzEcUb18cQNdRkA==",
+      "version": "7.3.0",
+      "resolved": "https://registry.npmjs.org/react-router/-/react-router-7.3.0.tgz",
+      "integrity": "sha512-466f2W7HIWaNXTKM5nHTqNxLrHTyXybm7R0eBlVSt0k/u55tTCDO194OIx/NrYD4TS5SXKTNekXfT37kMKUjgw==",
       "license": "MIT",
       "dependencies": {
         "@types/cookie": "^0.6.0",
@@ -13052,9 +13139,9 @@
       "license": "ISC"
     },
     "node_modules/stylelint": {
-      "version": "16.14.1",
-      "resolved": "https://registry.npmjs.org/stylelint/-/stylelint-16.14.1.tgz",
-      "integrity": "sha512-oqCL7AC3786oTax35T/nuLL8p2C3k/8rHKAooezrPGRvUX0wX+qqs5kMWh5YYT4PHQgVDobHT4tw55WgpYG6Sw==",
+      "version": "16.16.0",
+      "resolved": "https://registry.npmjs.org/stylelint/-/stylelint-16.16.0.tgz",
+      "integrity": "sha512-40X5UOb/0CEFnZVEHyN260HlSSUxPES+arrUphOumGWgXERHfwCD0kNBVILgQSij8iliYVwlc0V7M5bcLP9vPg==",
       "dev": true,
       "funding": [
         {
@@ -13081,7 +13168,7 @@
         "debug": "^4.3.7",
         "fast-glob": "^3.3.3",
         "fastest-levenshtein": "^1.0.16",
-        "file-entry-cache": "^10.0.5",
+        "file-entry-cache": "^10.0.7",
         "global-modules": "^2.0.0",
         "globby": "^11.1.0",
         "globjoin": "^0.1.4",
@@ -13095,14 +13182,14 @@
         "micromatch": "^4.0.8",
         "normalize-path": "^3.0.0",
         "picocolors": "^1.1.1",
-        "postcss": "^8.5.1",
+        "postcss": "^8.5.3",
         "postcss-resolve-nested-selector": "^0.1.6",
         "postcss-safe-parser": "^7.0.1",
-        "postcss-selector-parser": "^7.0.0",
+        "postcss-selector-parser": "^7.1.0",
         "postcss-value-parser": "^4.2.0",
         "resolve-from": "^5.0.0",
         "string-width": "^4.2.3",
-        "supports-hyperlinks": "^3.1.0",
+        "supports-hyperlinks": "^3.2.0",
         "svg-tags": "^1.0.0",
         "table": "^6.9.0",
         "write-file-atomic": "^5.0.1"
@@ -13217,23 +13304,25 @@
       "license": "MIT"
     },
     "node_modules/stylelint/node_modules/file-entry-cache": {
-      "version": "10.0.5",
-      "resolved": "https://registry.npmjs.org/file-entry-cache/-/file-entry-cache-10.0.5.tgz",
-      "integrity": "sha512-umpQsJrBNsdMDgreSryMEXvJh66XeLtZUwA8Gj7rHGearGufUFv6rB/bcXRFsiGWw/VeSUgUofF4Rf2UKEOrTA==",
+      "version": "10.0.7",
+      "resolved": "https://registry.npmjs.org/file-entry-cache/-/file-entry-cache-10.0.7.tgz",
+      "integrity": "sha512-txsf5fu3anp2ff3+gOJJzRImtrtm/oa9tYLN0iTuINZ++EyVR/nRrg2fKYwvG/pXDofcrvvb0scEbX3NyW/COw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "flat-cache": "^6.1.5"
+        "flat-cache": "^6.1.7"
       }
     },
     "node_modules/stylelint/node_modules/flat-cache": {
-      "version": "6.1.5",
-      "resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-6.1.5.tgz",
-      "integrity": "sha512-QR+2kN38f8nMfiIQ1LHYjuDEmZNZVjxuxY+HufbS3BW0EX01Q5OnH7iduOYRutmgiXb797HAKcXUeXrvRjjgSQ==",
+      "version": "6.1.7",
+      "resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-6.1.7.tgz",
+      "integrity": "sha512-qwZ4xf1v1m7Rc9XiORly31YaChvKt6oNVHuqqZcoED/7O+ToyNVGobKsIAopY9ODcWpEDKEBAbrSOCBHtNQvew==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "cacheable": "^1.8.7",
-        "flatted": "^3.3.2",
-        "hookified": "^1.6.0"
+        "cacheable": "^1.8.9",
+        "flatted": "^3.3.3",
+        "hookified": "^1.7.1"
       }
     },
     "node_modules/stylelint/node_modules/ignore": {
@@ -13246,9 +13335,9 @@
       }
     },
     "node_modules/stylelint/node_modules/postcss-selector-parser": {
-      "version": "7.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-7.0.0.tgz",
-      "integrity": "sha512-9RbEr1Y7FFfptd/1eEdntyjMwLeghW1bHX9GWjXo19vx4ytPQhANltvVxDggzJl7mnWM+dX28kb6cyS/4iQjlQ==",
+      "version": "7.1.0",
+      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-7.1.0.tgz",
+      "integrity": "sha512-8sLjZwK0R+JlxlYcTuVnyT2v+htpdrjDOKuMcOVdYjt52Lh8hWRYpxBPoKx/Zg+bcjc3wx6fmQevMmUztS/ccA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -13395,10 +13484,11 @@
       }
     },
     "node_modules/supports-hyperlinks": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/supports-hyperlinks/-/supports-hyperlinks-3.1.0.tgz",
-      "integrity": "sha512-2rn0BZ+/f7puLOHZm1HOJfwBggfaHXUpPUSSG/SWM4TWp5KCfmNYwnC3hruy2rZlMnmWZ+QAGpZfchu3f3695A==",
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/supports-hyperlinks/-/supports-hyperlinks-3.2.0.tgz",
+      "integrity": "sha512-zFObLMyZeEwzAoKCyu1B91U79K2t7ApXuQfo8OuxwXLDgcKxuwM+YvcbIhm6QWqz7mHUH1TVytR1PwVVjEuMig==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "has-flag": "^4.0.0",
         "supports-color": "^7.0.0"
@@ -13407,7 +13497,7 @@
         "node": ">=14.18"
       },
       "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
+        "url": "https://github.com/chalk/supports-hyperlinks?sponsor=1"
       }
     },
     "node_modules/supports-hyperlinks/node_modules/has-flag": {
@@ -13415,6 +13505,7 @@
       "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
       "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
       "dev": true,
+      "license": "MIT",
       "engines": {
         "node": ">=8"
       }
@@ -13424,6 +13515,7 @@
       "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
       "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "has-flag": "^4.0.0"
       },
@@ -14135,6 +14227,7 @@
       "resolved": "https://registry.npmjs.org/uri-js/-/uri-js-4.4.1.tgz",
       "integrity": "sha512-7rKUyy33Q1yc98pQ1DAmLtwX109F7TIfWlW1Ydo8Wl1ii1SeHieeh0HHfPeL2fMXK6z0s8ecKs9frCuLJvndBg==",
       "dev": true,
+      "license": "BSD-2-Clause",
       "dependencies": {
         "punycode": "^2.1.0"
       }
diff --git a/package.json b/package.json
index 342af4d6e..96528b786 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "homebrewery",
   "description": "Create authentic looking D&D homebrews using only markdown",
-  "version": "3.17.0",
+  "version": "3.18.1",
   "type": "module",
   "engines": {
     "npm": "^10.2.x",
@@ -39,7 +39,6 @@
     "test:definition-lists": "jest tests/markdown/definition-lists.test.js --verbose --noStackTrace",
     "test:hard-breaks": "jest tests/markdown/hard-breaks.test.js --verbose --noStackTrace",
     "test:non-breaking-spaces": "jest tests/markdown/non-breaking-spaces.test.js --verbose --noStackTrace",
-    "test:paragraph-justification": "jest tests/markdown/paragraph-justification.test.js --verbose --noStackTrace",
     "test:emojis": "jest tests/markdown/emojis.test.js --verbose --noStackTrace",
     "test:route": "jest tests/routes/static-pages.test.js --verbose",
     "test:safehtml": "jest tests/html/safeHTML.test.js --verbose",
@@ -85,20 +84,19 @@
     ]
   },
   "dependencies": {
-    "@babel/core": "^7.26.8",
-    "@babel/plugin-transform-runtime": "^7.26.8",
-    "@babel/preset-env": "^7.26.8",
+    "@babel/core": "^7.26.9",
+    "@babel/plugin-transform-runtime": "^7.26.9",
+    "@babel/preset-env": "^7.26.9",
     "@babel/preset-react": "^7.26.3",
-    "@googleapis/drive": "^8.14.0",
+    "@googleapis/drive": "^8.16.0",
     "body-parser": "^1.20.2",
     "classnames": "^2.5.1",
     "codemirror": "^5.65.6",
     "cookie-parser": "^1.4.7",
-    "core-js": "^3.40.0",
+    "core-js": "^3.41.0",
     "cors": "^2.8.5",
     "create-react-class": "^15.7.0",
     "dedent-tabs": "^0.10.3",
-    "dompurify": "^3.2.4",
     "expr-eval": "^2.0.2",
     "express": "^4.21.2",
     "express-async-handler": "^1.2.0",
@@ -109,20 +107,21 @@
     "jwt-simple": "^0.5.6",
     "less": "^3.13.1",
     "lodash": "^4.17.21",
-    "marked": "13.0.3",
-    "marked-emoji": "^1.4.3",
-    "marked-extended-tables": "^1.1.0",
+    "marked": "14.0.0",
+    "marked-emoji": "^2.0.0",
+    "marked-extended-tables": "^2.0.1",
     "marked-gfm-heading-id": "^4.0.1",
     "marked-smartypants-lite": "^1.0.3",
+    "marked-subsuper-text": "^1.0.3",
     "markedLegacy": "npm:marked@^0.3.19",
     "moment": "^2.30.1",
-    "mongoose": "^8.10.0",
-    "nanoid": "5.0.9",
+    "mongoose": "^8.12.1",
+    "nanoid": "5.1.3",
     "nconf": "^0.12.1",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "react-frame-component": "^4.1.3",
-    "react-router": "^7.1.5",
+    "react-router": "^7.3.0",
     "sanitize-filename": "1.6.3",
     "superagent": "^10.1.1",
     "vitreum": "git+https://git@github.com/calculuschild/vitreum.git"
@@ -130,15 +129,15 @@
   "devDependencies": {
     "@stylistic/stylelint-plugin": "^3.1.2",
     "babel-plugin-transform-import-meta": "^2.3.2",
-    "eslint": "^9.20.0",
+    "eslint": "^9.22.0",
     "eslint-plugin-jest": "^28.11.0",
     "eslint-plugin-react": "^7.37.4",
-    "globals": "^15.14.0",
+    "globals": "^16.0.0",
     "jest": "^29.7.0",
     "jest-expect-message": "^1.1.3",
     "jsdom-global": "^3.0.2",
     "postcss-less": "^6.0.0",
-    "stylelint": "^16.14.1",
+    "stylelint": "^16.16.0",
     "stylelint-config-recess-order": "^6.0.0",
     "stylelint-config-recommended": "^15.0.0",
     "supertest": "^7.0.0"
diff --git a/scripts/buildHomebrew.js b/scripts/buildHomebrew.js
index 656714d87..4d55a4176 100644
--- a/scripts/buildHomebrew.js
+++ b/scripts/buildHomebrew.js
@@ -10,7 +10,7 @@ import babel          from '@babel/core';
 import babelConfig    from '../babel.config.json' with { type : 'json' };
 import less           from 'less';
 
-const isDev = !!process.argv.find((arg) => arg === '--dev');
+const isDev = !!process.argv.find((arg)=>arg === '--dev');
 
 const babelify = async (code)=>(await babel.transformAsync(code, babelConfig)).code;
 
@@ -53,7 +53,7 @@ fs.emptyDirSync('./build');
 	const themes = { Legacy: {}, V3: {} };
 
 	let themeFiles = fs.readdirSync('./themes/Legacy');
-	for (let dir of themeFiles) {
+	for (const dir of themeFiles) {
 		const themeData = JSON.parse(fs.readFileSync(`./themes/Legacy/${dir}/settings.json`).toString());
 		themeData.path = dir;
 		themes.Legacy[dir] = (themeData);
@@ -70,7 +70,7 @@ fs.emptyDirSync('./build');
 	}
 
 	themeFiles = fs.readdirSync('./themes/V3');
-	for (let dir of themeFiles) {
+	for (const dir of themeFiles) {
 		const themeData = JSON.parse(fs.readFileSync(`./themes/V3/${dir}/settings.json`).toString());
 		themeData.path = dir;
 		themes.V3[dir] = (themeData);
@@ -113,7 +113,7 @@ fs.emptyDirSync('./build');
 	const stream = fs.createWriteStream(editorThemeFile, { flags: 'a' });
 	stream.write('[\n"default"');
 
-	for (let themeFile of editorThemeFiles) {
+	for (const themeFile of editorThemeFiles) {
 		stream.write(`,\n"${themeFile.slice(0, -4)}"`);
 	}
 	stream.write('\n]\n');
diff --git a/server/admin.api.js b/server/admin.api.js
index 1a39f020b..e70268afa 100644
--- a/server/admin.api.js
+++ b/server/admin.api.js
@@ -93,7 +93,7 @@ router.get('/admin/finduncompressed', mw.adminOnly, (req, res)=>{
 
 /* Cleans `<script` and `</script>` from the "text" field of a brew */
 router.put('/admin/clean/script/:id', asyncHandler(HomebrewAPI.getBrew('admin', false)), async (req, res)=>{
-	console.log(`[ADMIN] Cleaning script tags from ShareID ${req.params.id}`);
+	console.log(`[ADMIN: ${req.account?.username || 'Not Logged In'}] Cleaning script tags from ShareID ${req.params.id}`);
 
 	function cleanText(text){return text.replaceAll(/(<\/?s)cript/gi, '');};
 
@@ -114,6 +114,18 @@ router.put('/admin/clean/script/:id', asyncHandler(HomebrewAPI.getBrew('admin',
 	return await HomebrewAPI.updateBrew(req, res);
 });
 
+/* Get list of a user's documents */
+router.get('/admin/user/list/:user', mw.adminOnly, async (req, res)=>{
+	const username = req.params.user;
+	const fields = { _id: 0, text: 0, textBin: 0 };		// Remove unnecessary fields from document lists
+
+	console.log(`[ADMIN: ${req.account?.username || 'Not Logged In'}] Get brew list for ${username}`);
+
+	const brews = await HomebrewModel.getByUser(username, true, fields);
+
+	return res.json(brews);
+});
+
 /* Compresses the "text" field of a brew to binary */
 router.put('/admin/compress/:id', (req, res)=>{
 	HomebrewModel.findOne({ _id: req.params.id })
@@ -135,7 +147,6 @@ router.put('/admin/compress/:id', (req, res)=>{
 		});
 });
 
-
 router.get('/admin/stats', mw.adminOnly, async (req, res)=>{
 	try {
 		const totalBrewsCount = await HomebrewModel.countDocuments({});
diff --git a/server/admin.api.spec.js b/server/admin.api.spec.js
index 6a23393b1..036c238c9 100644
--- a/server/admin.api.spec.js
+++ b/server/admin.api.spec.js
@@ -1,6 +1,6 @@
 import supertest from 'supertest';
 import HBApp     from './app.js';
-import {model as NotificationModel } from './notifications.model.js';
+import { model as NotificationModel } from './notifications.model.js';
 
 
 // Mimic https responses to avoid being redirected all the time
@@ -16,7 +16,7 @@ describe('Tests for admin api', ()=>{
 			const testNotifications = ['a', 'b'];
 
 			jest.spyOn(NotificationModel, 'find')
-			.mockImplementationOnce(() => {
+			.mockImplementationOnce(()=>{
 				return { exec: jest.fn().mockResolvedValue(testNotifications) };
 			});
 
@@ -59,7 +59,7 @@ describe('Tests for admin api', ()=>{
 			expect(response.body).toEqual(savedNotification);
 		});
 
-		it('should handle error adding a notification without dismissKey', async () => {
+		it('should handle error adding a notification without dismissKey', async ()=>{
 			const inputNotification = {
 				title   : 'Test Notification',
 				text    : 'This is a test notification',
@@ -75,7 +75,7 @@ describe('Tests for admin api', ()=>{
 
 			const response = await app
 				.post('/admin/notification/add')
-				.set('Authorization', 'Basic ' + Buffer.from('admin:password3').toString('base64'))
+				.set('Authorization', `Basic ${Buffer.from('admin:password3').toString('base64')}`)
 				.send(inputNotification);
 
 			expect(response.status).toBe(500);
@@ -86,14 +86,14 @@ describe('Tests for admin api', ()=>{
 			const dismissKey = 'testKey';
 
 			jest.spyOn(NotificationModel, 'findOneAndDelete')
-				.mockImplementationOnce((key) => {
+				.mockImplementationOnce((key)=>{
 					return { exec: jest.fn().mockResolvedValue(key) };
 				});
 			const response = await app
 				.delete(`/admin/notification/delete/${dismissKey}`)
 				.set('Authorization', `Basic ${Buffer.from('admin:password3').toString('base64')}`);
 
-			expect(NotificationModel.findOneAndDelete).toHaveBeenCalledWith({'dismissKey': 'testKey'});
+			expect(NotificationModel.findOneAndDelete).toHaveBeenCalledWith({ 'dismissKey': 'testKey' });
 			expect(response.status).toBe(200);
 			expect(response.body).toEqual({ dismissKey: 'testKey' });
 		});
@@ -102,14 +102,14 @@ describe('Tests for admin api', ()=>{
 			const dismissKey = 'testKey';
 
 			jest.spyOn(NotificationModel, 'findOneAndDelete')
-				.mockImplementationOnce(() => {
+				.mockImplementationOnce(()=>{
 					return { exec: jest.fn().mockResolvedValue() };
 				});
 			const response = await app
 				.delete(`/admin/notification/delete/${dismissKey}`)
 				.set('Authorization', `Basic ${Buffer.from('admin:password3').toString('base64')}`);
 
-			expect(NotificationModel.findOneAndDelete).toHaveBeenCalledWith({'dismissKey': 'testKey'});
+			expect(NotificationModel.findOneAndDelete).toHaveBeenCalledWith({ 'dismissKey': 'testKey' });
 			expect(response.status).toBe(500);
 			expect(response.body).toEqual({ message: 'Notification not found' });
 		});
diff --git a/server/app.js b/server/app.js
index 4dec6b4c4..6bd0c7c9a 100644
--- a/server/app.js
+++ b/server/app.js
@@ -11,7 +11,6 @@ const version = packageJSON.version;
 import _       from 'lodash';
 import jwt     from 'jwt-simple';
 import express from 'express';
-import yaml    from 'js-yaml';
 import config  from './config.js';
 import fs      from 'fs-extra';
 
@@ -70,13 +69,11 @@ const corsOptions = {
 			'https://homebrewery-stage.herokuapp.com',
 		];
 
-		if(isLocalEnvironment) {
-			allowedOrigins.push('http://localhost:8000', 'http://localhost:8010');
-		}
+		const localNetworkRegex = /^http:\/\/(localhost|127\.0\.0\.1|10\.\d+\.\d+\.\d+|192\.168\.\d+\.\d+|172\.(1[6-9]|2\d|3[0-1])\.\d+\.\d+):\d+$/;
 
 		const herokuRegex = /^https:\/\/(?:homebrewery-pr-\d+\.herokuapp\.com|naturalcrit-pr-\d+\.herokuapp\.com)$/; // Matches any Heroku app
 
-		if(!origin || allowedOrigins.includes(origin) || herokuRegex.test(origin)) {
+		if(!origin || allowedOrigins.includes(origin) || herokuRegex.test(origin) || (isLocalEnvironment && localNetworkRegex.test(origin))) {
 			callback(null, true);
 		} else {
 			console.log(origin, 'not allowed');
@@ -352,7 +349,7 @@ app.get('/user/:username', async (req, res, next)=>{
 app.put('/api/user/rename', async (req, res)=>{
 	const { username, newUsername } = req.body;
 	const ownAccount = req.account && (req.account.username == newUsername);
-	
+
 	if(!username || !newUsername)
 		return res.status(400).json({ error: 'Username and newUsername are required.' });
 	if(!ownAccount)
@@ -552,6 +549,7 @@ const renderPage = async (req, res)=>{
 	const configuration = {
 		local       : isLocalEnvironment,
 		publicUrl   : config.get('publicUrl') ?? '',
+		baseUrl     : `${req.protocol}://${req.get('host')}`,
 		environment : nodeEnv,
 		deployment  : config.get('heroku_app_name') ?? ''
 	};
diff --git a/server/googleActions.js b/server/googleActions.js
index 2c2cbac73..0ca7556ba 100644
--- a/server/googleActions.js
+++ b/server/googleActions.js
@@ -27,12 +27,12 @@ if(!config.get('service_account')){
 const defaultAuth = serviceAuth || config.get('google_api_key');
 
 const retryConfig = {
-  retry: 3, // Number of retry attempts
-  retryDelay: 100, // Initial delay in milliseconds
-  retryDelayMultiplier: 2, // Multiplier for exponential backoff
-  maxRetryDelay: 32000, // Maximum delay in milliseconds
-  httpMethodsToRetry: ['PATCH'], // Only retry PATCH requests
-  statusCodesToRetry: [[429, 429]], // Only retry on 429 status code
+	retry                : 3, // Number of retry attempts
+	retryDelay           : 100, // Initial delay in milliseconds
+	retryDelayMultiplier : 2, // Multiplier for exponential backoff
+	maxRetryDelay        : 32000, // Maximum delay in milliseconds
+	httpMethodsToRetry   : ['PATCH'], // Only retry PATCH requests
+	statusCodesToRetry   : [[429, 429]], // Only retry on 429 status code
 };
 
 const GoogleActions = {
@@ -177,8 +177,8 @@ const GoogleActions = {
 				mimeType : 'text/plain',
 				body     : brew.text
 			},
-			headers: {
-				'X-Forwarded-For': userIp, // Set the X-Forwarded-For header
+			headers : {
+				'X-Forwarded-For' : userIp, // Set the X-Forwarded-For header
 			},
 			retryConfig
 		})
diff --git a/server/homebrew.api.js b/server/homebrew.api.js
index 9a479732e..af408e579 100644
--- a/server/homebrew.api.js
+++ b/server/homebrew.api.js
@@ -1,6 +1,6 @@
 /* eslint-disable max-lines */
 import _                             from 'lodash';
-import {model as HomebrewModel}      from './homebrew.model.js';
+import { model as HomebrewModel }    from './homebrew.model.js';
 import express                       from 'express';
 import zlib                          from 'zlib';
 import GoogleActions                 from './googleActions.js';
@@ -92,7 +92,7 @@ const api = {
 			const accessMap = {
 				edit  : { editId: id },
 				share : { shareId: id },
-				admin : { $or : [{ editId: id }, { shareId: id }] }
+				admin : { $or: [{ editId: id }, { shareId: id }] }
 			};
 
 			// Try to find the document in the Homebrewery database -- if it doesn't exist, that's fine.
@@ -181,6 +181,7 @@ const api = {
 			`${text}`;
 		return text;
 	},
+
 	getGoodBrewTitle : (text)=>{
 		const tokens = Markdown.marked.lexer(text);
 		return (tokens.find((token)=>token.type === 'heading' || token.type === 'paragraph')?.text || 'No Title')
@@ -279,6 +280,8 @@ const api = {
 		let currentTheme;
 		const completeStyles   = [];
 		const completeSnippets = [];
+		let themeName;
+		let themeAuthor;
 
 		while (req.params.id) {
 			//=== User Themes ===//
@@ -292,6 +295,10 @@ const api = {
 
 				currentTheme = req.brew;
 				splitTextStyleAndMetadata(currentTheme);
+				if(!currentTheme.tags.some((tag)=>tag === 'meta:theme' || tag === 'meta:Theme'))
+					throw { brewId: req.params.id, name: 'Invalid Theme Selected', message: 'Selected theme does not have the meta:theme tag', status: 422, HBErrorCode: '10' };
+				themeName   ??= currentTheme.title;
+				themeAuthor ??= currentTheme.authors?.[0];
 
 				// If there is anything in the snippets or style members, append them to the appropriate array
 				if(currentTheme?.snippets) completeSnippets.push(JSON.parse(currentTheme.snippets));
@@ -301,6 +308,7 @@ const api = {
 				req.params.renderer = currentTheme.renderer;
 			} else {
 			//=== Static Themes ===//
+				themeName ??= req.params.id;
 				const localSnippets = `${req.params.renderer}_${req.params.id}`; // Just log the name for loading on client
 				const localStyle    = `@import url(\"/themes/${req.params.renderer}/${req.params.id}/style.css\");`;
 				completeSnippets.push(localSnippets);
@@ -313,7 +321,9 @@ const api = {
 		const returnObj = {
 			// Reverse the order of the arrays so they are listed oldest parent to youngest child.
 			styles   : completeStyles.reverse(),
-			snippets : completeSnippets.reverse()
+			snippets : completeSnippets.reverse(),
+			name     : themeName,
+			author   : themeAuthor
 		};
 
 		res.setHeader('Content-Type', 'application/json');
diff --git a/server/homebrew.api.spec.js b/server/homebrew.api.spec.js
index 8270b1568..1c42cb4be 100644
--- a/server/homebrew.api.spec.js
+++ b/server/homebrew.api.spec.js
@@ -576,7 +576,7 @@ brew`);
 	describe('Theme bundle', ()=>{
 		it('should return Theme Bundle for a User Theme', async ()=>{
 			const brews = {
-				userThemeAID : { title: 'User Theme A', renderer: 'V3', theme: null, shareId: 'userThemeAID', style: 'User Theme A Style' }
+				userThemeAID : { title: 'User Theme A', renderer: 'V3', theme: null, shareId: 'userThemeAID', style: 'User Theme A Style', tags: ['meta:theme'], authors: ['authorName'] }
 			};
 
 			const toBrewPromise = (brew)=>new Promise((res)=>res({ toObject: ()=>brew }));
@@ -587,6 +587,8 @@ brew`);
 
 			expect(res.status).toHaveBeenCalledWith(200);
 			expect(res.send).toHaveBeenCalledWith({
+				name     : 'User Theme A',
+				author   : 'authorName',
 				styles   : ['/* From Brew: https://localhost/share/userThemeAID */\n\nUser Theme A Style'],
 				snippets : []
 			});
@@ -594,9 +596,9 @@ brew`);
 
 		it('should return Theme Bundle for nested User Themes', async ()=>{
 			const brews = {
-				userThemeAID : { title: 'User Theme A', renderer: 'V3', theme: 'userThemeBID', shareId: 'userThemeAID', style: 'User Theme A Style' },
-				userThemeBID : { title: 'User Theme B', renderer: 'V3', theme: 'userThemeCID', shareId: 'userThemeBID', style: 'User Theme B Style' },
-				userThemeCID : { title: 'User Theme C', renderer: 'V3', theme: null, shareId: 'userThemeCID', style: 'User Theme C Style' }
+				userThemeAID : { title: 'User Theme A', renderer: 'V3', theme: 'userThemeBID', shareId: 'userThemeAID', style: 'User Theme A Style', tags: ['meta:theme'], authors: ['authorName'] },
+				userThemeBID : { title: 'User Theme B', renderer: 'V3', theme: 'userThemeCID', shareId: 'userThemeBID', style: 'User Theme B Style', tags: ['meta:theme'], authors: ['authorName'] },
+				userThemeCID : { title: 'User Theme C', renderer: 'V3', theme: null, shareId: 'userThemeCID', style: 'User Theme C Style', tags: ['meta:theme'], authors: ['authorName'] }
 			};
 
 			const toBrewPromise = (brew)=>new Promise((res)=>res({ toObject: ()=>brew }));
@@ -607,6 +609,8 @@ brew`);
 
 			expect(res.status).toHaveBeenCalledWith(200);
 			expect(res.send).toHaveBeenCalledWith({
+				name   : 'User Theme A',
+				author : 'authorName',
 				styles : [
 					'/* From Brew: https://localhost/share/userThemeCID */\n\nUser Theme C Style',
 					'/* From Brew: https://localhost/share/userThemeBID */\n\nUser Theme B Style',
@@ -623,6 +627,8 @@ brew`);
 
 			expect(res.status).toHaveBeenCalledWith(200);
 			expect(res.send).toHaveBeenCalledWith({
+				name   : '5ePHB',
+				author : undefined,
 				styles : [
 					`/* From Theme Blank */\n\n@import url("/themes/V3/Blank/style.css");`,
 					`/* From Theme 5ePHB */\n\n@import url("/themes/V3/5ePHB/style.css");`
@@ -636,9 +642,9 @@ brew`);
 
 		it('should return Theme Bundle for nested User and Static Themes together', async ()=>{
 			const brews = {
-				userThemeAID : { title: 'User Theme A', renderer: 'V3', theme: 'userThemeBID', shareId: 'userThemeAID', style: 'User Theme A Style' },
-				userThemeBID : { title: 'User Theme B', renderer: 'V3', theme: 'userThemeCID', shareId: 'userThemeBID', style: 'User Theme B Style' },
-				userThemeCID : { title: 'User Theme C', renderer: 'V3', theme: '5eDMG', shareId: 'userThemeCID', style: 'User Theme C Style' }
+				userThemeAID : { title: 'User Theme A', renderer: 'V3', theme: 'userThemeBID', shareId: 'userThemeAID', style: 'User Theme A Style', tags: ['meta:theme'], authors: ['authorName'] },
+				userThemeBID : { title: 'User Theme B', renderer: 'V3', theme: 'userThemeCID', shareId: 'userThemeBID', style: 'User Theme B Style', tags: ['meta:theme'], authors: ['authorName'] },
+				userThemeCID : { title: 'User Theme C', renderer: 'V3', theme: '5eDMG', shareId: 'userThemeCID', style: 'User Theme C Style', tags: ['meta:theme'], authors: ['authorName'] }
 			};
 
 			const toBrewPromise = (brew)=>new Promise((res)=>res({ toObject: ()=>brew }));
@@ -649,6 +655,8 @@ brew`);
 
 			expect(res.status).toHaveBeenCalledWith(200);
 			expect(res.send).toHaveBeenCalledWith({
+				name   : 'User Theme A',
+				author : 'authorName',
 				styles : [
 					`/* From Theme Blank */\n\n@import url("/themes/V3/Blank/style.css");`,
 					`/* From Theme 5ePHB */\n\n@import url("/themes/V3/5ePHB/style.css");`,
@@ -665,9 +673,9 @@ brew`);
 			});
 		});
 
-		it('should fail for an invalid Theme in the chain', async()=>{
+		it('should fail for a missing Theme in the chain', async()=>{
 			const brews = {
-				userThemeAID : { title: 'User Theme A', renderer: 'V3', theme: 'missingTheme', shareId: 'userThemeAID', style: 'User Theme A Style' },
+				userThemeAID : { title: 'User Theme A', renderer: 'V3', theme: 'missingTheme', shareId: 'userThemeAID', style: 'User Theme A Style', tags: ['meta:theme'], authors: ['authorName'] },
 			};
 
 			const toBrewPromise = (brew)=>new Promise((res)=>res({ toObject: ()=>brew }));
@@ -686,6 +694,27 @@ brew`);
 				name        : 'ThemeLoad Error',
 				status      : 404 });
 		});
+
+		it('should fail for a User Theme not tagged with meta:theme', async ()=>{
+			const brews = {
+				userThemeAID : { title: 'User Theme A', renderer: 'V3', theme: null, shareId: 'userThemeAID', style: 'User Theme A Style' }
+			};
+
+			const toBrewPromise = (brew)=>new Promise((res)=>res({ toObject: ()=>brew }));
+			model.get = jest.fn((getParams)=>toBrewPromise(brews[getParams.shareId]));
+			const req = { params: { renderer: 'V3', id: 'userThemeAID' }, get: ()=>{ return 'localhost'; }, protocol: 'https' };
+
+			let err;
+			await api.getThemeBundle(req, res)
+			.catch((e)=>err = e);
+
+			expect(err).toEqual({
+				HBErrorCode : '10',
+				brewId      : 'userThemeAID',
+				message     : 'Selected theme does not have the meta:theme tag',
+				name        : 'Invalid Theme Selected',
+				status      : 422 });
+		});
 	});
 
 	describe('deleteBrew', ()=>{
diff --git a/server/homebrew.model.js b/server/homebrew.model.js
index adeac0d5d..15341f5d8 100644
--- a/server/homebrew.model.js
+++ b/server/homebrew.model.js
@@ -63,7 +63,7 @@ HomebrewSchema.statics.getByUser = async function(username, allowAccess=false, f
 
 const Homebrew = mongoose.model('Homebrew', HomebrewSchema);
 
-export { 
+export {
 	HomebrewSchema as schema,
 	Homebrew       as model
 };
diff --git a/server/vault.api.js b/server/vault.api.js
index 6a7b9fb91..3a6c6e989 100644
--- a/server/vault.api.js
+++ b/server/vault.api.js
@@ -1,6 +1,6 @@
 import express    from 'express';
 import asyncHandler from 'express-async-handler';
-import {model as HomebrewModel }     from './homebrew.model.js';
+import { model as HomebrewModel }     from './homebrew.model.js';
 
 const router = express.Router();
 
@@ -29,7 +29,7 @@ const rendererConditions = (legacy, v3)=>{
 	return {}; // If all renderers selected, renderer field not needed in query for speed
 };
 
-const sortConditions = (sort, dir) => {
+const sortConditions = (sort, dir)=>{
 	return { [sort]: dir === 'asc' ? 1 : -1 };
 };
 
diff --git a/shared/helpers.js b/shared/helpers.js
index b2190cdcd..2ad9218fa 100644
--- a/shared/helpers.js
+++ b/shared/helpers.js
@@ -44,13 +44,19 @@ const fetchThemeBundle = async (obj, renderer, theme)=>{
 			.catch((err)=>{
 				obj.setState({ error: err });
 			});
-	if(!res) return;
-
+	if(!res) {
+		obj.setState((prevState)=>({
+			...prevState,
+			themeBundle : {}
+		}));
+		return;
+	}
 	const themeBundle = res.body;
 	themeBundle.joinedStyles = themeBundle.styles.map((style)=>`<style>${style}</style>`).join('\n\n');
 	obj.setState((prevState)=>({
 		...prevState,
-		themeBundle : themeBundle
+		themeBundle : themeBundle,
+		error       : null
 	}));
 };
 
diff --git a/shared/naturalcrit/markdown.js b/shared/naturalcrit/markdown.js
index 99766b536..0b90c051c 100644
--- a/shared/naturalcrit/markdown.js
+++ b/shared/naturalcrit/markdown.js
@@ -7,6 +7,7 @@ import MarkedExtendedTables     from 'marked-extended-tables';
 import { markedSmartypantsLite as MarkedSmartypantsLite }                                from 'marked-smartypants-lite';
 import { gfmHeadingId as MarkedGFMHeadingId, resetHeadings as MarkedGFMResetHeadingIDs } from 'marked-gfm-heading-id';
 import { markedEmoji as MarkedEmojis }                                                   from 'marked-emoji';
+import MarkedSubSuperText from 'marked-subsuper-text';
 
 //Icon fonts included so they can appear in emoji autosuggest dropdown
 import diceFont      from '../../themes/fonts/iconFonts/diceFont.js';
@@ -59,8 +60,14 @@ mathParser.functions.signed = function (a) {
 	return `${a}`;
 };
 
+// Normalize variable names; trim edge spaces and shorten blocks of whitespace to 1 space
+const normalizeVarNames = (label)=>{
+	return label.trim().replace(/\s+/g, ' ');
+};
+
 //Processes the markdown within an HTML block if it's just a class-wrapper
-renderer.html = function (html) {
+renderer.html = function (token) {
+	let html = token.text;
 	if(_.startsWith(_.trim(html), '<div') && _.endsWith(_.trim(html), '</div>')){
 		const openTag = html.substring(0, html.indexOf('>')+1);
 		html = html.substring(html.indexOf('>')+1);
@@ -71,18 +78,21 @@ renderer.html = function (html) {
 };
 
 // Don't wrap {{ Spans alone on a line, or {{ Divs in <p> tags
-renderer.paragraph = function(text){
+renderer.paragraph = function(token){
 	let match;
+	const text = this.parser.parseInline(token.tokens);
 	if(text.startsWith('<div') || text.startsWith('</div'))
 		return `${text}`;
-	else if(match = text.match(/(^|^.*?\n)<span class="inline-block(.*?<\/span>)$/)) {
+	else if(match = text.match(/(^|^.*?\n)<span class="inline-block(.*?<\/span>)$/))
 		return `${match[1].trim() ? `<p>${match[1]}</p>` : ''}<span class="inline-block${match[2]}`;
-	} else
+	else
 		return `<p>${text}</p>\n`;
 };
 
 //Fix local links in the Preview iFrame to link inside the frame
-renderer.link = function (href, title, text) {
+renderer.link = function (token) {
+	let { href, title, tokens } = token;
+	const text = this.parser.parseInline(tokens);
 	let self = false;
 	if(href[0] == '#') {
 		self = true;
@@ -104,8 +114,8 @@ renderer.link = function (href, title, text) {
 };
 
 // Expose `src` attribute as `--HB_src` to make the URL accessible via CSS
-renderer.image = function (href, title, text) {
-	href = cleanUrl(href);
+renderer.image = function (token) {
+	const { href, title, text } = token;
 	if(href === null)
 		return text;
 
@@ -333,35 +343,6 @@ const mustacheInjectBlock = {
 	}
 };
 
-const superSubScripts = {
-	name  : 'superSubScript',
-	level : 'inline',
-	start(src) { return src.match(/\^/m)?.index; },  // Hint to Marked.js to stop and check for a match
-	tokenizer(src, tokens) {
-		const superRegex = /^\^(?!\s)(?=([^\n\^]*[^\s\^]))\1\^/m;
-		const subRegex   = /^\^\^(?!\s)(?=([^\n\^]*[^\s\^]))\1\^\^/m;
-		let isSuper = false;
-		let match = subRegex.exec(src);
-		if(!match){
-			match = superRegex.exec(src);
-			if(match)
-				isSuper = true;
-		}
-		if(match?.length) {
-			return {
-				type   : 'superSubScript', // Should match "name" above
-				raw    : match[0],          // Text to consume from the source
-				tag    : isSuper ? 'sup' : 'sub',
-				tokens : this.lexer.inlineTokens(match[1])
-			};
-		}
-	},
-	renderer(token) {
-		return `<${token.tag}>${this.parser.parseInline(token.tokens)}</${token.tag}>`;
-	}
-};
-
-
 const justifiedParagraphClasses = [];
 justifiedParagraphClasses[2] = 'Left';
 justifiedParagraphClasses[4] = 'Right';
@@ -415,7 +396,7 @@ const forcedParagraphBreaks = {
 		}
 	},
 	renderer(token) {
-		return `<div class='blank'></div>`.repeat(token.length).concat('\n');
+		return `<div class='blank'></div>\n`.repeat(token.length);
 	}
 };
 
@@ -533,7 +514,7 @@ const replaceVar = function(input, hoist=false, allowUnresolved=false) {
 	const match = regex.exec(input);
 
 	const prefix = match[1];
-	const label  = match[2];
+	const label  = normalizeVarNames(match[2]); // Ensure the label name is normalized as it should be in the var stack.
 
 	//v=====--------------------< HANDLE MATH >-------------------=====v//
 	const mathRegex = /[a-z]+\(|[+\-*/^(),]/g;
@@ -688,8 +669,8 @@ function MarkedVariables() {
 							});
 					}
 					if(match[3]) { // Block Definition
-						const label   = match[4] ? match[4].trim().replace(/\s+/g, ' ')    : null; // Trim edge spaces and shorten blocks of whitespace to 1 space
-						const content = match[5] ? match[5].trim().replace(/[ \t]+/g, ' ') : null; // Trim edge spaces and shorten blocks of whitespace to 1 space
+						const label   = match[4] ? normalizeVarNames(match[4]) : null;
+						const content = match[5] ? match[5].trim().replace(/[ \t]+/g, ' ') : null; // Normalize text content (except newlines for block-level content)
 
 						varsQueue.push(
 							{ type    : 'varDefBlock',
@@ -698,7 +679,7 @@ function MarkedVariables() {
 							});
 					}
 					if(match[6]) { // Block Call
-						const label = match[7] ? match[7].trim().replace(/\s+/g, ' ') : null; // Trim edge spaces and shorten blocks of whitespace to 1 space
+						const label = match[7] ? normalizeVarNames(match[7]) : null;
 
 						varsQueue.push(
 							{ type    : 'varCallBlock',
@@ -707,7 +688,7 @@ function MarkedVariables() {
 							});
 					}
 					if(match[8]) { // Inline Definition
-						const label = match[10] ? match[10].trim().replace(/\s+/g, ' ') : null; // Trim edge spaces and shorten blocks of whitespace to 1 space
+						const label = match[10] ? normalizeVarNames(match[10]) : null;
 						let content = match[11] || null;
 
 						// In case of nested (), find the correct matching end )
@@ -739,7 +720,7 @@ function MarkedVariables() {
 							});
 					}
 					if(match[12]) { // Inline Call
-						const label = match[13] ? match[13].trim().replace(/\s+/g, ' ') : null; // Trim edge spaces and shorten blocks of whitespace to 1 space
+						const label = match[13] ? normalizeVarNames(match[13]) : null;
 
 						varsQueue.push(
 							{ type    : 'varCallInline',
@@ -796,10 +777,11 @@ const tableTerminators = [
 
 Marked.use(MarkedVariables());
 Marked.use({ extensions : [justifiedParagraphs, definitionListsMultiLine, definitionListsSingleLine, forcedParagraphBreaks,
-	nonbreakingSpaces, superSubScripts, mustacheSpans, mustacheDivs, mustacheInjectInline] });
+	nonbreakingSpaces, mustacheSpans, mustacheDivs, mustacheInjectInline] });
 Marked.use(mustacheInjectBlock);
+Marked.use(MarkedSubSuperText());
 Marked.use({ renderer: renderer, tokenizer: tokenizer, mangle: false });
-Marked.use(MarkedExtendedTables(tableTerminators), MarkedGFMHeadingId({ globalSlugs: true }),
+Marked.use(MarkedExtendedTables({ interruptPatterns: tableTerminators }), MarkedGFMHeadingId({ globalSlugs: true }),
 	MarkedSmartypantsLite(), MarkedEmojis(MarkedEmojiOptions));
 
 function cleanUrl(href) {
@@ -864,12 +846,12 @@ const processStyleTags = (string)=>{
 			obj[key.trim()] = value.trim();
 			return obj;
 		}, {}) || null;
-	const styles = tags?.length ? tags.reduce((styleObj, style) => {
-			const index = style.indexOf(':');
-			const [key, value] = [style.substring(0, index), style.substring(index + 1)];
-			styleObj[key.trim()] = value.replace(/"?([^"]*)"?/g, '$1').trim();
-			return styleObj;
-		}, {}) : null;
+	const styles = tags?.length ? tags.reduce((styleObj, style)=>{
+		const index = style.indexOf(':');
+		const [key, value] = [style.substring(0, index), style.substring(index + 1)];
+		styleObj[key.trim()] = value.replace(/"?([^"]*)"?/g, '$1').trim();
+		return styleObj;
+	}, {}) : null;
 
 	return {
 		id         : id,
@@ -885,8 +867,8 @@ const extractHTMLStyleTags = (htmlString)=>{
 	const id         = firstElementOnly.match(/id="([^"]*)"/)?.[1]    || null;
 	const classes    = firstElementOnly.match(/class="([^"]*)"/)?.[1] || null;
 	const styles     = firstElementOnly.match(/style="([^"]*)"/)?.[1]
-		?.split(';').reduce((styleObj, style) => {
-			if (style.trim() === '') return styleObj;
+		?.split(';').reduce((styleObj, style)=>{
+			if(style.trim() === '') return styleObj;
 			const index = style.indexOf(':');
 			const [key, value] = [style.substring(0, index), style.substring(index + 1)];
 			styleObj[key.trim()] = value.trim();
@@ -896,7 +878,7 @@ const extractHTMLStyleTags = (htmlString)=>{
 		?.filter((attr)=>!attr.startsWith('class="') && !attr.startsWith('style="') && !attr.startsWith('id="'))
 		.reduce((obj, attr)=>{
 			const index = attr.indexOf('=');
-			let [key, value] = [attr.substring(0, index), attr.substring(index + 1)];
+			const [key, value] = [attr.substring(0, index), attr.substring(index + 1)];
 			obj[key.trim()] = value.replace(/"/g, '');
 			return obj;
 		}, {}) || null;
@@ -909,7 +891,7 @@ const extractHTMLStyleTags = (htmlString)=>{
 	};
 };
 
-const mergeHTMLTags = (originalTags, newTags) => {
+const mergeHTMLTags = (originalTags, newTags)=>{
 	return {
 		id         : newTags.id || originalTags.id || null,
 		classes    : [originalTags.classes, newTags.classes].join(' ').trim() || null,
diff --git a/shared/naturalcrit/nav/nav.jsx b/shared/naturalcrit/nav/nav.jsx
index d9b403239..50dff4c33 100644
--- a/shared/naturalcrit/nav/nav.jsx
+++ b/shared/naturalcrit/nav/nav.jsx
@@ -12,8 +12,8 @@ const Nav = {
 		displayName : 'Nav.base',
 		render      : function(){
 			return <nav>
-					{this.props.children}
-					</nav>;
+				{this.props.children}
+			</nav>;
 		}
 	}),
 	logo : function(){
diff --git a/shared/naturalcrit/splitPane/splitPane.jsx b/shared/naturalcrit/splitPane/splitPane.jsx
index 1500c759f..4c77d81a5 100644
--- a/shared/naturalcrit/splitPane/splitPane.jsx
+++ b/shared/naturalcrit/splitPane/splitPane.jsx
@@ -29,8 +29,8 @@ const SplitPane = (props)=>{
 	const limitPosition = (x, min = 1, max = window.innerWidth - 13)=>Math.round(Math.min(max, Math.max(min, x)));
 
 	//when resizing, the divider should grow smaller if less space is given, then grow back if the space is restored, to the original position
-	const handleResize = () =>setDividerPos(limitPosition(window.localStorage.getItem(storageKey), 0.1 * (window.innerWidth - 13), 0.9 * (window.innerWidth - 13)));
-	
+	const handleResize = ()=>setDividerPos(limitPosition(window.localStorage.getItem(storageKey), 0.1 * (window.innerWidth - 13), 0.9 * (window.innerWidth - 13)));
+
 	const handleUp =(e)=>{
 		e.preventDefault();
 		if(isDragging) {
diff --git a/shared/naturalcrit/splitPane/splitPane.less b/shared/naturalcrit/splitPane/splitPane.less
index 8b61097be..80a8695af 100644
--- a/shared/naturalcrit/splitPane/splitPane.less
+++ b/shared/naturalcrit/splitPane/splitPane.less
@@ -21,8 +21,8 @@
 		background-color : #BBBBBB;
 		.dots {
 			display        : table-cell;
-			text-align     : center;
 			vertical-align : middle;
+			text-align     : center;
 			i {
 				display   : block !important;
 				margin    : 10px 0px;
diff --git a/shared/naturalcrit/styles/animations.less b/shared/naturalcrit/styles/animations.less
index 69aac3e09..5757df151 100644
--- a/shared/naturalcrit/styles/animations.less
+++ b/shared/naturalcrit/styles/animations.less
@@ -3,127 +3,127 @@
 @defaultEasing             : ease;
 
 //Animates all properties on an element
-.animateAll(@duration : @defaultDuration, @easing : @defaultEasing){
-	-webkit-transition: all @duration @easing;
-	   -moz-transition: all @duration @easing;
-		 -o-transition: all @duration @easing;
-			transition: all @duration @easing;
+.animateAll(@duration : @defaultDuration, @easing : @defaultEasing) {
+	-webkit-transition : all @duration @easing;
+	-moz-transition    : all @duration @easing;
+	-o-transition      : all @duration @easing;
+	transition         : all @duration @easing;
 }
 //Animates Specific property
-.animate(@prop, @duration : @defaultDuration, @easing : @defaultEasing){
-	-webkit-transition: @prop @duration @easing;
-	   -moz-transition: @prop @duration @easing;
-		 -o-transition: @prop @duration @easing;
-			transition: @prop @duration @easing;
+.animate(@prop, @duration : @defaultDuration, @easing : @defaultEasing) {
+	-webkit-transition : @prop @duration @easing;
+	-moz-transition    : @prop @duration @easing;
+	-o-transition      : @prop @duration @easing;
+	transition         : @prop @duration @easing;
 }
 
-.animateMany(...){
+.animateMany(...) {
 	@value: ~`"@{arguments}".replace(/[\[\]]|\,\sX/g, '')`;
-	-webkit-transition-property: @value;
-	   -moz-transition-property: @value;
-		 -o-transition-property: @value;
-			transition-property: @value;
+	-webkit-transition-property : @value;
+	-moz-transition-property    : @value;
+	-o-transition-property      : @value;
+	transition-property         : @value;
 
 	.animateDuration();
 	.animateEasing();
 }
 
-.animateDuration(@duration : @defaultDuration){
-	-webkit-transition-duration: @duration;
-	   -moz-transition-duration: @duration;
-		 -o-transition-duration: @duration;
-			transition-duration: @duration;
+.animateDuration(@duration : @defaultDuration) {
+	-webkit-transition-duration : @duration;
+	-moz-transition-duration    : @duration;
+	-o-transition-duration      : @duration;
+	transition-duration         : @duration;
 }
 
-.animateEasing(@easing : @defaultEasing){
-	-webkit-transition-timing-function: @easing;
-	   -moz-transition-timing-function: @easing;
-		 -o-transition-timing-function: @easing;
-			transition-timing-function: @easing;
+.animateEasing(@easing : @defaultEasing) {
+	-webkit-transition-timing-function : @easing;
+	-moz-transition-timing-function    : @easing;
+	-o-transition-timing-function      : @easing;
+	transition-timing-function         : @easing;
 }
 
 
 .transition (@prop, @duration: @defaultDuration) {
-	-webkit-transition: @prop @duration, -webkit-transform @duration;
-	   -moz-transition: @prop @duration, -moz-transform @duration;
-		 -o-transition: @prop @duration, -o-transform @duration;
-		-ms-transition: @prop @duration, -ms-transform @duration;
-			transition: @prop @duration, transform @duration;
+	-webkit-transition : @prop @duration, -webkit-transform @duration;
+	-moz-transition    : @prop @duration, -moz-transform @duration;
+	-o-transition      : @prop @duration, -o-transform @duration;
+	-ms-transition     : @prop @duration, -ms-transform @duration;
+	transition         : @prop @duration, transform @duration;
 }
 .transform (@transform) {
-	-webkit-transform: @transform;
-	   -moz-transform: @transform;
-		 -o-transform: @transform;
-		-ms-transform: @transform;
-			transform: @transform;
+	-webkit-transform : @transform;
+	-moz-transform    : @transform;
+	-o-transform      : @transform;
+	-ms-transform     : @transform;
+	transform         : @transform;
 }
 
 
-.delay(@delay){
-	animation-delay:@delay;
-	-webkit-animation-delay:@delay;
-	transition-delay:@delay;
-	-webkit-transition-delay:@delay;
+.delay(@delay) {
+	-webkit-transition-delay : @delay;
+	transition-delay         : @delay;
+	-webkit-animation-delay  : @delay;
+	animation-delay          : @delay;
 }
-.keep(){
-	-webkit-animation-fill-mode:forwards;
-	   -moz-animation-fill-mode:forwards;
-		-ms-animation-fill-mode:forwards;
-		 -o-animation-fill-mode:forwards;
-			animation-fill-mode:forwards;
+.keep() {
+	-webkit-animation-fill-mode : forwards;
+	-moz-animation-fill-mode    : forwards;
+	-ms-animation-fill-mode     : forwards;
+	-o-animation-fill-mode      : forwards;
+	animation-fill-mode         : forwards;
 }
 
 
-.sequentialDelay(@delayInc : 0.2s, @initialDelay : 0s){
-	&:nth-child(1){.delay(0*@delayInc + @initialDelay)}
-	&:nth-child(2){.delay(1*@delayInc + @initialDelay)}
-	&:nth-child(3){.delay(2*@delayInc + @initialDelay)}
-	&:nth-child(4){.delay(3*@delayInc + @initialDelay)}
-	&:nth-child(5){.delay(4*@delayInc + @initialDelay)}
-	&:nth-child(6){.delay(5*@delayInc + @initialDelay)}
-	&:nth-child(7){.delay(6*@delayInc + @initialDelay)}
-	&:nth-child(8){.delay(7*@delayInc + @initialDelay)}
-	&:nth-child(9){.delay(8*@delayInc + @initialDelay)}
-	&:nth-child(10){.delay(9*@delayInc + @initialDelay)}
-	&:nth-child(11){.delay(10*@delayInc + @initialDelay)}
-	&:nth-child(12){.delay(11*@delayInc + @initialDelay)}
-	&:nth-child(13){.delay(12*@delayInc + @initialDelay)}
-	&:nth-child(14){.delay(13*@delayInc + @initialDelay)}
-	&:nth-child(15){.delay(14*@delayInc + @initialDelay)}
-	&:nth-child(16){.delay(15*@delayInc + @initialDelay)}
-	&:nth-child(17){.delay(16*@delayInc + @initialDelay)}
-	&:nth-child(18){.delay(17*@delayInc + @initialDelay)}
-	&:nth-child(19){.delay(18*@delayInc + @initialDelay)}
-	&:nth-child(20){.delay(19*@delayInc + @initialDelay)}
+.sequentialDelay(@delayInc : 0.2s, @initialDelay : 0s) {
+	&:nth-child(1) {.delay(0*@delayInc + @initialDelay); }
+	&:nth-child(2) {.delay(1*@delayInc + @initialDelay); }
+	&:nth-child(3) {.delay(2*@delayInc + @initialDelay); }
+	&:nth-child(4) {.delay(3*@delayInc + @initialDelay); }
+	&:nth-child(5) {.delay(4*@delayInc + @initialDelay); }
+	&:nth-child(6) {.delay(5*@delayInc + @initialDelay); }
+	&:nth-child(7) {.delay(6*@delayInc + @initialDelay); }
+	&:nth-child(8) {.delay(7*@delayInc + @initialDelay); }
+	&:nth-child(9) {.delay(8*@delayInc + @initialDelay); }
+	&:nth-child(10) {.delay(9*@delayInc + @initialDelay); }
+	&:nth-child(11) {.delay(10*@delayInc + @initialDelay); }
+	&:nth-child(12) {.delay(11*@delayInc + @initialDelay); }
+	&:nth-child(13) {.delay(12*@delayInc + @initialDelay); }
+	&:nth-child(14) {.delay(13*@delayInc + @initialDelay); }
+	&:nth-child(15) {.delay(14*@delayInc + @initialDelay); }
+	&:nth-child(16) {.delay(15*@delayInc + @initialDelay); }
+	&:nth-child(17) {.delay(16*@delayInc + @initialDelay); }
+	&:nth-child(18) {.delay(17*@delayInc + @initialDelay); }
+	&:nth-child(19) {.delay(18*@delayInc + @initialDelay); }
+	&:nth-child(20) {.delay(19*@delayInc + @initialDelay); }
 }
 
 
 
-.createFrames(@name, @from, @to){
+.createFrames(@name, @from, @to) {
 	@frames: {
 		from { @from(); }
 		to { @to(); }
 	};
-	@-webkit-keyframes @name {@frames();}
-	   @-moz-keyframes @name {@frames();}
-		@-ms-keyframes @name {@frames();}
-		 @-o-keyframes @name {@frames();}
-			@keyframes @name {@frames();}
+	@-webkit-keyframes		 @name {@frames();}
+	@-moz-keyframes @name {@frames();}
+	@-ms-keyframes @name {@frames();}
+	@-o-keyframes @name {@frames();}
+	@keyframes @name {@frames();}
 }
 
-.createAnimation(@name, @duration : @defaultDuration, @easing : @defaultEasing){
-	-webkit-animation-name: @name;
-	   -moz-animation-name: @name;
-		-ms-animation-name: @name;
-			animation-name: @name;
-	-webkit-animation-duration: @duration;
-	   -moz-animation-duration: @duration;
-		-ms-animation-duration: @duration;
-			animation-duration: @duration;
-	-webkit-animation-timing-function: @easing;
-	   -moz-animation-timing-function: @easing;
-		-ms-animation-timing-function: @easing;
-			animation-timing-function: @easing;
+.createAnimation(@name, @duration : @defaultDuration, @easing : @defaultEasing) {
+	-webkit-animation-name            : @name;
+	-moz-animation-name               : @name;
+	-ms-animation-name                : @name;
+	animation-name                    : @name;
+	-webkit-animation-duration        : @duration;
+	-moz-animation-duration           : @duration;
+	-ms-animation-duration            : @duration;
+	animation-duration                : @duration;
+	-webkit-animation-timing-function : @easing;
+	-moz-animation-timing-function    : @easing;
+	-ms-animation-timing-function     : @easing;
+	animation-timing-function         : @easing;
 }
 
 
@@ -132,82 +132,82 @@
 	  Standard Animations
 ****************************/
 
-.fadeIn(@duration : @defaultDuration, @easing : @defaultEasing){
+.fadeIn(@duration : @defaultDuration, @easing : @defaultEasing) {
 	.createAnimation(fadeIn; @duration; @easing);
 	.createFrames(fadeIn,
-		{ opacity : 0; },
+	{ opacity : 0; },
 		{ opacity : 1; }
 	);
 }
 
-.fadeInDown(@duration : @defaultDuration, @easing : @defaultEasing){
+.fadeInDown(@duration : @defaultDuration, @easing : @defaultEasing) {
 	.createAnimation(fadeInDown; @duration; @easing);
 	.createFrames(fadeInDown,
-		{ opacity : 0; .transform(translateY(20px));},
+	{ opacity : 0; .transform(translateY(20px));},
 		{ opacity : 1; .transform(translateY(0px));}
 	);
 }
 
-.fadeInTop(@duration : @defaultDuration, @easing : @defaultEasing){
+.fadeInTop(@duration : @defaultDuration, @easing : @defaultEasing) {
 	.createAnimation(fadeInTop; @duration; @easing);
 	.createFrames(fadeInTop,
-		{ opacity : 0; .transform(translateY(-20px)); },
+	{ opacity : 0; .transform(translateY(-20px)); },
 		{ opacity : 1; .transform(translateY(0px));}
 	);
 }
 
-.fadeInLeft(@duration : @defaultDuration, @easing : @defaultEasing){
+.fadeInLeft(@duration : @defaultDuration, @easing : @defaultEasing) {
 	.createAnimation(fadeInLeft; @duration; @easing);
 	.createFrames(fadeInLeft,
-		{ opacity: 0; .transform(translateX(-20px));},
+	{ opacity: 0; .transform(translateX(-20px));},
 		{ opacity: 1; .transform(translateX(0));}
 	);
 }
 
-.fadeInRight(@duration : @defaultDuration, @easing : @defaultEasing){
+.fadeInRight(@duration : @defaultDuration, @easing : @defaultEasing) {
 	.createAnimation(fadeInRight; @duration; @easing);
 	.createFrames(fadeInRight,
-		{ opacity: 0; .transform(translateX(20px));},
+	{ opacity: 0; .transform(translateX(20px));},
 		{ opacity: 1; .transform(translateX(0));}
 	);
 }
 
-.fadeOut(@duration : @defaultDuration, @easing : @defaultEasing){
+.fadeOut(@duration : @defaultDuration, @easing : @defaultEasing) {
 	.createAnimation(fadeOut; @duration; @easing);
 	.createFrames(fadeOut,
-		{ opacity : 1; },
+	{ opacity : 1; },
 		{ opacity : 0; }
 	);
 }
 
-.fadeOutDown(@duration : @defaultDuration, @easing : @defaultEasing){
+.fadeOutDown(@duration : @defaultDuration, @easing : @defaultEasing) {
 	.createAnimation(fadeOutDown; @duration; @easing);
 	.createFrames(fadeOutDown,
-		{ opacity : 1; .transform(translateY(0)); visibility: visible;},
+	{ opacity : 1; .transform(translateY(0)); visibility: visible;},
 		{ opacity : 0; .transform(translateY(20px)); visibility: hidden;}
 	);
 }
 
-.fadeOutTop(@duration : @defaultDuration, @easing : @defaultEasing){
+.fadeOutTop(@duration : @defaultDuration, @easing : @defaultEasing) {
 	.createAnimation(fadeOutTop; @duration; @easing);
 	.createFrames(fadeOutTop,
-		{ opacity : 1; .transform(translateY(0)); },
+	{ opacity : 1; .transform(translateY(0)); },
 		{ opacity : 0; .transform(translateY(-20px)); }
 	);
 }
 
-.fadeOutLeft(@duration : @defaultDuration, @easing : @defaultEasing){
+.fadeOutLeft(@duration : @defaultDuration, @easing : @defaultEasing) {
 	.createAnimation(fadeOutLeft; @duration; @easing);
 	.createFrames(fadeOutLeft,
-		{ opacity : 1; .transform(translateX(0));},
+	{ opacity : 1; .transform(translateX(0));},
 		{ opacity : 0; .transform(translateX(-20px));}
 	);
 }
 
-.fadeOutRight(@duration : @defaultDuration, @easing : @defaultEasing){
+.fadeOutRight(@duration : @defaultDuration, @easing : @defaultEasing) {
 	.createAnimation(fadeOutRight; @duration; @easing);
 	.createFrames(fadeOutRight,
-		{ opacity : 1; .transform(translateX(0));},
+	{ opacity : 1; .transform(translateX(0));},
 		{ opacity : 0; .transform(translateX(20px));}
 	);
 }
@@ -219,50 +219,50 @@
 		Fun Animations
 ****************************/
 
-.spin(@duration : @defaultDuration, @easing : @defaultEasing){
+.spin(@duration : @defaultDuration, @easing : @defaultEasing) {
 	.createAnimation(spin, @duration, @easing);
-	.spinKeyFrames(){
+	.spinKeyFrames() {
 		from { .transform(rotate(0deg)); }
-		to   { .transform(rotate(360deg)); }
+		to { .transform(rotate(360deg)); }
 	}
 	@-webkit-keyframes spin {.spinKeyFrames();}
-	   @-moz-keyframes spin {.spinKeyFrames();}
-	    @-ms-keyframes spin {.spinKeyFrames();}
-	     @-o-keyframes spin {.spinKeyFrames();}
-	        @keyframes spin {.spinKeyFrames();}
+	@-moz-keyframes spin {.spinKeyFrames();}
+	@-ms-keyframes spin {.spinKeyFrames();}
+	@-o-keyframes spin {.spinKeyFrames();}
+	@keyframes spin {.spinKeyFrames();}
 }
 
-.bounce(@duration : @defaultDuration, @easing : @defaultEasing){
+.bounce(@duration : @defaultDuration, @easing : @defaultEasing) {
 	.createAnimation(bounce, @duration, @easing);
-	.bounceKeyFrames(){
+	.bounceKeyFrames() {
 		0%, 20%, 50%, 80%, 100% { .transform(translateY(0));}
 		40% { .transform(translateY(-30px));}
 		60% { .transform(translateY(-15px));}
 	}
 	@-webkit-keyframes bounce {.bounceKeyFrames();}
-	   @-moz-keyframes bounce {.bounceKeyFrames();}
-	    @-ms-keyframes bounce {.bounceKeyFrames();}
-	     @-o-keyframes bounce {.bounceKeyFrames();}
-	        @keyframes bounce {.bounceKeyFrames();}
+	@-moz-keyframes bounce {.bounceKeyFrames();}
+	@-ms-keyframes bounce {.bounceKeyFrames();}
+	@-o-keyframes bounce {.bounceKeyFrames();}
+	@keyframes bounce {.bounceKeyFrames();}
 }
 
-.pulse(@duration : @defaultDuration, @easing : @defaultEasing){
+.pulse(@duration : @defaultDuration, @easing : @defaultEasing) {
 	.createAnimation(pulse, @duration, @easing);
-	.pulseKeyFrames(){
-		0%   { .transform(scale(1));}
-		50%  { .transform(scale(1.4));}
+	.pulseKeyFrames() {
+		0% { .transform(scale(1));}
+		50% { .transform(scale(1.4));}
 		100% { .transform(scale(1));}
 	}
 	@-webkit-keyframes pulse {.pulseKeyFrames();}
-	   @-moz-keyframes pulse {.pulseKeyFrames();}
-	    @-ms-keyframes pulse {.pulseKeyFrames();}
-	     @-o-keyframes pulse {.pulseKeyFrames();}
-	        @keyframes pulse {.pulseKeyFrames();}
+	@-moz-keyframes pulse {.pulseKeyFrames();}
+	@-ms-keyframes pulse {.pulseKeyFrames();}
+	@-o-keyframes pulse {.pulseKeyFrames();}
+	@keyframes pulse {.pulseKeyFrames();}
 }
 
-.rubberBand(@duration : @defaultDuration, @easing : @defaultEasing){
+.rubberBand(@duration : @defaultDuration, @easing : @defaultEasing) {
 	.createAnimation(rubberBand, @duration, @easing);
-	.rubberBandKeyFrames(){
+	.rubberBandKeyFrames() {
 		0% {.transform(scale(1));}
 		30% {.transform(scaleX(1.25) scaleY(0.75));}
 		40% {.transform(scaleX(0.75) scaleY(1.25));}
@@ -270,32 +270,32 @@
 		100% {.transform(scale(1));}
 	}
 	@-webkit-keyframes rubberBand {.rubberBandKeyFrames();}
-	   @-moz-keyframes rubberBand {.rubberBandKeyFrames();}
-	    @-ms-keyframes rubberBand {.rubberBandKeyFrames();}
-	     @-o-keyframes rubberBand {.rubberBandKeyFrames();}
-	        @keyframes rubberBand {.rubberBandKeyFrames();}
+	@-moz-keyframes rubberBand {.rubberBandKeyFrames();}
+	@-ms-keyframes rubberBand {.rubberBandKeyFrames();}
+	@-o-keyframes rubberBand {.rubberBandKeyFrames();}
+	@keyframes rubberBand {.rubberBandKeyFrames();}
 }
 
-.shake(@duration : @defaultDuration, @easing : @defaultEasing){
+.shake(@duration : @defaultDuration, @easing : @defaultEasing) {
 	.createAnimation(shake, @duration, @easing);
-	.shakeKeyFrames(){
+	.shakeKeyFrames() {
 		0%, 100% {.transform( translateX(0));}
 		10%, 30%, 50%, 70%, 90% {.transform( translateX(-10px));}
 		20%, 40%, 60%, 80% {.transform( translateX(10px));}
 	}
 	@-webkit-keyframes shake {.shakeKeyFrames();}
-	   @-moz-keyframes shake {.shakeKeyFrames();}
-	    @-ms-keyframes shake {.shakeKeyFrames();}
-	     @-o-keyframes shake {.shakeKeyFrames();}
-	        @keyframes shake {.shakeKeyFrames();}
+	@-moz-keyframes shake {.shakeKeyFrames();}
+	@-ms-keyframes shake {.shakeKeyFrames();}
+	@-o-keyframes shake {.shakeKeyFrames();}
+	@keyframes shake {.shakeKeyFrames();}
 }
 
-.swing(@duration : @defaultDuration, @easing : @defaultEasing){
-	-webkit-transform-origin: top center;
-	    -ms-transform-origin: top center;
-	        transform-origin: top center;
+.swing(@duration : @defaultDuration, @easing : @defaultEasing) {
+	-webkit-transform-origin : top center;
+	-ms-transform-origin     : top center;
+	transform-origin         : top center;
 	.createAnimation(swing, @duration, @easing);
-	.swingKeyFrames(){
+	.swingKeyFrames() {
 		20% {.transform(rotate(15deg));}
 		40% {.transform(rotate(-10deg));}
 		60% {.transform(rotate(5deg));}
@@ -303,18 +303,18 @@
 		100% {.transform(rotate(0deg));}
 	}
 	@-webkit-keyframes swing {.swingKeyFrames();}
-	   @-moz-keyframes swing {.swingKeyFrames();}
-	    @-ms-keyframes swing {.swingKeyFrames();}
-	     @-o-keyframes swing {.swingKeyFrames();}
-	        @keyframes swing {.swingKeyFrames();}
+	@-moz-keyframes swing {.swingKeyFrames();}
+	@-ms-keyframes swing {.swingKeyFrames();}
+	@-o-keyframes swing {.swingKeyFrames();}
+	@keyframes swing {.swingKeyFrames();}
 }
 
-.twist(@duration : @defaultDuration, @easing : @defaultEasing){
-	-webkit-transform-origin: center center;
-	    -ms-transform-origin: center center;
-	        transform-origin: center center;
+.twist(@duration : @defaultDuration, @easing : @defaultEasing) {
+	-webkit-transform-origin : center center;
+	-ms-transform-origin     : center center;
+	transform-origin         : center center;
 	.createAnimation(swing, @duration, @easing);
-	.swingKeyFrames(){
+	.swingKeyFrames() {
 		20% {.transform(rotate(15deg));}
 		40% {.transform(rotate(-10deg));}
 		60% {.transform(rotate(5deg));}
@@ -322,15 +322,15 @@
 		100% {.transform(rotate(0deg));}
 	}
 	@-webkit-keyframes swing {.swingKeyFrames();}
-	   @-moz-keyframes swing {.swingKeyFrames();}
-	    @-ms-keyframes swing {.swingKeyFrames();}
-	     @-o-keyframes swing {.swingKeyFrames();}
-	        @keyframes swing {.swingKeyFrames();}
+	@-moz-keyframes swing {.swingKeyFrames();}
+	@-ms-keyframes swing {.swingKeyFrames();}
+	@-o-keyframes swing {.swingKeyFrames();}
+	@keyframes swing {.swingKeyFrames();}
 }
 
-.wobble(@duration : @defaultDuration, @easing : @defaultEasing){
+.wobble(@duration : @defaultDuration, @easing : @defaultEasing) {
 	.createAnimation(wobble, @duration, @easing);
-	.wobbleKeyFrames(){
+	.wobbleKeyFrames() {
 		0% {.transform(translateX(0%));}
 		15% {.transform(translateX(-25%) rotate(-5deg));}
 		30% {.transform(translateX(20%) rotate(3deg));}
@@ -340,22 +340,22 @@
 		100% {.transform(translateX(0%));}
 	}
 	@-webkit-keyframes wobble {.wobbleKeyFrames();}
-	   @-moz-keyframes wobble {.wobbleKeyFrames();}
-	    @-ms-keyframes wobble {.wobbleKeyFrames();}
-	     @-o-keyframes wobble {.wobbleKeyFrames();}
-	        @keyframes wobble {.wobbleKeyFrames();}
+	@-moz-keyframes wobble {.wobbleKeyFrames();}
+	@-ms-keyframes wobble {.wobbleKeyFrames();}
+	@-o-keyframes wobble {.wobbleKeyFrames();}
+	@keyframes wobble {.wobbleKeyFrames();}
 }
 
-.popIn(@duration : @defaultDuration, @easing : @defaultEasing){
+.popIn(@duration : @defaultDuration, @easing : @defaultEasing) {
 	.createAnimation(popIn, @duration, @easing);
-	.popInKeyFrames(){
-		0%   { .transform(scale(0));}
-		70%  { .transform(scale(1.4));}
+	.popInKeyFrames() {
+		0% { .transform(scale(0));}
+		70% { .transform(scale(1.4));}
 		100% { .transform(scale(1));}
 	}
 	@-webkit-keyframes popIn {.popInKeyFrames();}
-	   @-moz-keyframes popIn {.popInKeyFrames();}
-	    @-ms-keyframes popIn {.popInKeyFrames();}
-	     @-o-keyframes popIn {.popInKeyFrames();}
-	        @keyframes popIn {.popInKeyFrames();}
+	@-moz-keyframes popIn {.popInKeyFrames();}
+	@-ms-keyframes popIn {.popInKeyFrames();}
+	@-o-keyframes popIn {.popInKeyFrames();}
+	@keyframes popIn {.popInKeyFrames();}
 }
diff --git a/shared/naturalcrit/styles/colors.less b/shared/naturalcrit/styles/colors.less
index 30a7610a2..c096b9b4f 100644
--- a/shared/naturalcrit/styles/colors.less
+++ b/shared/naturalcrit/styles/colors.less
@@ -23,47 +23,47 @@
 @grey        : #7F8C8D;
 
 #backgroundColors {
-  &.tealLight{ background-color : @tealLight };
-  &.teal{ background-color : @teal };
-  &.greenLight{ background-color : @greenLight };
-  &.green{ background-color : @green };
-  &.blueLight{ background-color : @blueLight };
-  &.blue{ background-color : @blue };
-  &.purpleLight{ background-color : @purpleLight };
-  &.purple{ background-color : @purple };
-  &.steelLight{ background-color : @steelLight };
-  &.steel{ background-color : @steel };
-  &.yellowLight{ background-color : @yellowLight };
-  &.yellow{ background-color : @yellow };
-  &.orangeLight{ background-color : @orangeLight };
-  &.orange{ background-color : @orange };
-  &.redLight{ background-color : @redLight };
-  &.red{ background-color : @red };
-  &.silverLight{ background-color : @silverLight };
-  &.silver{ background-color : @silver };
-  &.greyLight{ background-color : @greyLight };
-  &.grey{ background-color : @grey };
+	&.tealLight { background-color : @tealLight; };
+	&.teal { background-color : @teal; };
+	&.greenLight { background-color : @greenLight; };
+	&.green { background-color : @green; };
+	&.blueLight { background-color : @blueLight; };
+	&.blue { background-color : @blue; };
+	&.purpleLight { background-color : @purpleLight; };
+	&.purple { background-color : @purple; };
+	&.steelLight { background-color : @steelLight; };
+	&.steel { background-color : @steel; };
+	&.yellowLight { background-color : @yellowLight; };
+	&.yellow { background-color : @yellow; };
+	&.orangeLight { background-color : @orangeLight; };
+	&.orange { background-color : @orange; };
+	&.redLight { background-color : @redLight; };
+	&.red { background-color : @red; };
+	&.silverLight { background-color : @silverLight; };
+	&.silver { background-color : @silver; };
+	&.greyLight { background-color : @greyLight; };
+	&.grey { background-color : @grey; };
 }
 
 #backgroundColorsHover {
-  &.tealLight:hover{ background-color : @tealLight };
-  &.teal:hover{ background-color : @teal };
-  &.greenLight:hover{ background-color : @greenLight };
-  &.green:hover{ background-color : @green };
-  &.blueLight:hover{ background-color : @blueLight };
-  &.blue:hover{ background-color : @blue };
-  &.purpleLight:hover{ background-color : @purpleLight };
-  &.purple:hover{ background-color : @purple };
-  &.steelLight:hover{ background-color : @steelLight };
-  &.steel:hover{ background-color : @steel };
-  &.yellowLight:hover{ background-color : @yellowLight };
-  &.yellow:hover{ background-color : @yellow };
-  &.orangeLight:hover{ background-color : @orangeLight };
-  &.orange:hover{ background-color : @orange };
-  &.redLight:hover{ background-color : @redLight };
-  &.red:hover{ background-color : @red };
-  &.silverLight:hover{ background-color : @silverLight };
-  &.silver:hover{ background-color : @silver };
-  &.greyLight:hover{ background-color : @greyLight };
-  &.grey:hover{ background-color : @grey };
+	&.tealLight:hover { background-color : @tealLight; };
+	&.teal:hover { background-color : @teal; };
+	&.greenLight:hover { background-color : @greenLight; };
+	&.green:hover { background-color : @green; };
+	&.blueLight:hover { background-color : @blueLight; };
+	&.blue:hover { background-color : @blue; };
+	&.purpleLight:hover { background-color : @purpleLight; };
+	&.purple:hover { background-color : @purple; };
+	&.steelLight:hover { background-color : @steelLight; };
+	&.steel:hover { background-color : @steel; };
+	&.yellowLight:hover { background-color : @yellowLight; };
+	&.yellow:hover { background-color : @yellow; };
+	&.orangeLight:hover { background-color : @orangeLight; };
+	&.orange:hover { background-color : @orange; };
+	&.redLight:hover { background-color : @redLight; };
+	&.red:hover { background-color : @red; };
+	&.silverLight:hover { background-color : @silverLight; };
+	&.silver:hover { background-color : @silver; };
+	&.greyLight:hover { background-color : @greyLight; };
+	&.grey:hover { background-color : @grey; };
 }
\ No newline at end of file
diff --git a/shared/naturalcrit/styles/core.less b/shared/naturalcrit/styles/core.less
index 3248269c5..02db5db18 100644
--- a/shared/naturalcrit/styles/core.less
+++ b/shared/naturalcrit/styles/core.less
@@ -12,37 +12,31 @@
 	font-family : 'CodeBold';
 	src         : data-uri('naturalcrit/styles/CODE Bold.otf') format('opentype');
 }
-html,body, #reactRoot{
+html,body, #reactRoot {
 	height      : 100vh;
 	min-height  : 100vh;
 	margin      : 0;
 	font-family : 'Open Sans', sans-serif;
 }
-*{
-	box-sizing : border-box;
-}
-.colorButton(@backgroundColor : @green){
+* { box-sizing : border-box; }
+.colorButton(@backgroundColor : @green) {
 	.animate(background-color);
 	display          : inline-block;
 	padding          : 0.6em 1.2em;
-	cursor           : pointer;
-	background-color : @backgroundColor;
 	font-family      : 'Open Sans', sans-serif;
 	font-size        : 0.8em;
 	font-weight      : 800;
 	color            : white;
-	text-decoration  : none;
 	text-transform   : uppercase;
-	border           : none;
+	text-decoration  : none;
+	cursor           : pointer;
 	outline          : none;
-	&:hover{
-		background-color : darken(@backgroundColor, 5%);
-	}
-	&:active{
-		background-color : darken(@backgroundColor, 10%);
-	}
-	&:disabled{
+	background-color : @backgroundColor;
+	border           : none;
+	&:hover { background-color : darken(@backgroundColor, 5%); }
+	&:active { background-color : darken(@backgroundColor, 10%); }
+	&:disabled {
+		cursor           : not-allowed;
 		background-color : @silver !important;
-		cursor:not-allowed;
 	}
 }
diff --git a/shared/naturalcrit/styles/elements.less b/shared/naturalcrit/styles/elements.less
index e7f8b05f5..ca4574f26 100644
--- a/shared/naturalcrit/styles/elements.less
+++ b/shared/naturalcrit/styles/elements.less
@@ -1,86 +1,76 @@
 
 @containerWidth : 1000px;
 
-html, body{
+html, body {
 	position         : relative;
 	height           : 100%;
 	min-height       : 100%;
-	background-color : #eee;
 	font-family      : 'Lato', sans-serif;
 	color            : @copyGrey;
+	background-color : #EEEEEE;
 }
-.container{
+.container {
 	position      : relative;
 	max-width     : @containerWidth;
-	margin        : 0 auto;
 	padding-right : 20px;
 	padding-left  : 20px;
+	margin        : 0 auto;
 }
-h1{
+h1 {
 	margin-top    : 10px;
 	margin-bottom : 15px;
 	font-size     : 2em;
 }
-h2{
+h2 {
 	margin-top    : 10px;
 	margin-bottom : 15px;
 	font-size     : 1.5em;
 	font-weight   : 900;
 }
-h3{
+h3 {
 	margin-top    : 5px;
 	margin-bottom : 7px;
 	font-size     : 1em;
 	font-weight   : 900;
 }
-p{
+p {
 	margin-bottom : 1em;
 	font-size     : 16px;
-	color         : @copyGrey;
 	line-height   : 1.5em;
+	color         : @copyGrey;
 }
-code{
-	background-color : #F8F8F8;
-	font-family      : 'Courier', mono;
+code {
+	font-family      : 'Courier', "mono";
 	color            : black;
 	white-space      : pre;
+	background-color : #F8F8F8;
 }
-a{
-	color : inherit;
-}
-strong{
-	font-weight : bold;
-}
-button{
+a { color : inherit; }
+strong { font-weight : bold; }
+button {
 	.button();
 }
-.button(@backgroundColor : @green){
+.button(@backgroundColor : @green) {
 	.animate(background-color);
 	display          : inline-block;
 	padding          : 0.6em 1.2em;
-	cursor           : pointer;
-	background-color : @backgroundColor;
-	font-family      : "Lato", Helvetica, Arial, sans-serif;
+	font-family      : 'Lato', "Helvetica", "Arial", sans-serif;
 	font-size        : 15px;
 	color            : white;
 	text-decoration  : none;
-	border           : none;
-	outline          : none;
-	&:hover{
-		background-color : darken(@backgroundColor, 5%);
-	}
-	&:active{
-		background-color : darken(@backgroundColor, 10%);
-	}
-	&:disabled{
-		background-color : @silver !important;
-	}
-}
-.iconButton(@backgroundColor : @green){
-	padding          : 0.6em;
 	cursor           : pointer;
+	outline          : none;
 	background-color : @backgroundColor;
+	border           : none;
+	&:hover { background-color : darken(@backgroundColor, 5%); }
+	&:active { background-color : darken(@backgroundColor, 10%); }
+	&:disabled { background-color : @silver !important; }
+}
+.iconButton(@backgroundColor : @green) {
+	padding          : 0.6em;
 	font-size        : 14px;
 	color            : white;
 	text-align       : center;
+	cursor           : pointer;
+	background-color : @backgroundColor;
 }
\ No newline at end of file
diff --git a/shared/naturalcrit/styles/reset.less b/shared/naturalcrit/styles/reset.less
index df5564a21..21e07a1c0 100644
--- a/shared/naturalcrit/styles/reset.less
+++ b/shared/naturalcrit/styles/reset.less
@@ -1,33 +1,23 @@
-:where(html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,button,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video){
-  border:0;font-size:100%;font:inherit;vertical-align:baseline;margin:0;padding:0
+:where(html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,button,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video) {padding        : 0;margin         : 0;font           : inherit;font-size      : 100%;vertical-align : baseline;
+	border         : 0;
 }
 
-:where(article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section){
-  display:block
-}
+:where(article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section) { display : block; }
 
-:where(body){
-  line-height:1
-}
+:where(body) { line-height : 1; }
 
-:where(ol,ul){
-  list-style:none
-}
+:where(ol,ul) { list-style : none; }
 
-:where(blockquote,q){
-  quotes:none
-}
+:where(blockquote,q) { quotes : none; }
 
-:where(blockquote:before,blockquote:after,q:before,q:after){
-  content:none
-}
+:where(blockquote::before,blockquote::after,q::before,q::after) { content : none; }
 
-:where(table){
-  border-collapse:collapse;border-spacing:0
+:where(table) {border-spacing  : 0;
+	border-collapse : collapse;
 }
 
 :where(button) {
-	background-color: unset;
-	text-transform: unset;
-	color: unset;
+	color            : unset;
+	text-transform   : unset;
+	background-color : unset;
 }
diff --git a/shared/naturalcrit/styles/tooltip.less b/shared/naturalcrit/styles/tooltip.less
index 078cfd0c1..b21439486 100644
--- a/shared/naturalcrit/styles/tooltip.less
+++ b/shared/naturalcrit/styles/tooltip.less
@@ -2,116 +2,115 @@
 @tooltipColor  : #383838;
 @arrowSize     : 6px;
 @arrowPosition : 18px;
-[data-tooltip]{
+[data-tooltip] {
 	.tooltip(attr(data-tooltip));
 }
-[data-tooltip-top]{
+[data-tooltip-top] {
 	.tooltipTop(attr(data-tooltip-top));
 }
-[data-tooltip-bottom]{
+[data-tooltip-bottom] {
 	.tooltipBottom(attr(data-tooltip-bottom));
 }
-[data-tooltip-left]{
+[data-tooltip-left] {
 	.tooltipLeft(attr(data-tooltip-left));
 }
-[data-tooltip-right]{
+[data-tooltip-right] {
 	.tooltipRight(attr(data-tooltip-right));
 }
-.tooltip(@content){
+.tooltip(@content) {
 	.tooltipBottom(@content);
 }
-.tooltipTop(@content){
+.tooltipTop(@content) {
 	.tooltipBase(@content);
-	&:before {
+	&::before {
 		margin-bottom    : -@arrowSize * 2;
 		border-top-color : @tooltipColor;
 	}
-	&:after{ margin-left: -18px; }
-	&:before, &:after{
+	&::after { margin-left : -18px; }
+	&::before, &::after {
 		bottom : 100%;
 		left   : 50%;
 	}
-	&:hover:after, &:hover:before, &:focus:after, &:focus:before {
+	&:hover::after, &:hover::before, &:focus::after, &:focus::before {
 		.transform(translateY(-(@arrowSize + 2)));
 	}
 }
-.tooltipBottom(@content){
+.tooltipBottom(@content) {
 	.tooltipBase(@content);
-	&:before {
+	&::before {
 		margin-top          : -@arrowSize * 2;
 		border-bottom-color : @tooltipColor;
 	}
-	&:after{ margin-left: -18px; }
-	&:before, &:after{
+	&::after { margin-left : -18px; }
+	&::before, &::after {
 		top  : 100%;
 		left : 50%;
 	}
-	&:hover:after, &:hover:before, &:focus:after, &:focus:before {
+	&:hover::after, &:hover::before, &:focus::after, &:focus::before {
 		.transform(translateY(@arrowSize + 2));
 	}
 }
-.tooltipLeft(@content){
+.tooltipLeft(@content) {
 	.tooltipBase(@content);
-	&:before {
+	&::before {
 		margin-right      : -@arrowSize * 2;
 		margin-bottom     : -@arrowSize;
 		border-left-color : @tooltipColor;
 	}
-	&:after{ margin-bottom: -14px;}
-	&:before, &:after {
+	&::after { margin-bottom : -14px;}
+	&::before, &::after {
 		right  : 100%;
 		bottom : 50%;
 	}
-	&:hover:after, &:hover:before, &:focus:after, &:focus:before {
+	&:hover::after, &:hover::before, &:focus::after, &:focus::before {
 		.transform(translateX(-(@arrowSize + 2)));
 	}
 }
-.tooltipRight(@content){
+.tooltipRight(@content) {
 	.tooltipBase(@content);
-	&:before {
+	&::before {
 		margin-bottom      : -@arrowSize;
 		margin-left        : -@arrowSize * 2;
 		border-right-color : @tooltipColor;
 	}
-	&:after{ margin-bottom: -14px;}
-	&:before, &:after {
+	&::after { margin-bottom : -14px;}
+	&::before, &::after {
 		bottom : 50%;
 		left   : 100%;
 	}
-	&:hover:after, &:hover:before, &:focus:after, &:focus:before {
+	&:hover::after, &:hover::before, &:focus::after, &:focus::before {
 		.transform(translateX(@arrowSize + 2));
 	}
 }
-.tooltipShow(){
-}
-.tooltipBase(@content){
+.tooltipShow(){ }
+.tooltipBase(@content) {
 	//position: relative;
-	&:before, &:after{
+	&::before, &::after {
 		.animateAll();
 		position       : absolute;
 		z-index        : 1000000;
-		opacity        : 0;
 		pointer-events : none;
+		opacity        : 0;
 	}
 	//Arrow
-	&:before{
-		content    : '';
+	&::before {
 		z-index    : 1000001;
+		content    : '';
 		background : transparent;
 		border     : @arrowSize solid transparent;
 	}
 	//Box
-	&:after{
-		content     : @content;
+	&::after {
 		visibility  : hidden;
 		padding     : 8px 10px;
-		background  : @tooltipColor;
 		font-size   : 12px;
-		color       : white;
 		line-height : 12px;
+		color       : white;
 		white-space : nowrap;
+		content     : @content;
+		background  : @tooltipColor;
 	}
-	&:hover:before, &:hover:after {
+	&:hover::before, &:hover::after {
 		visibility : visible;
 		opacity    : 1;
 	}
diff --git a/tests/markdown/basic.test.js b/tests/markdown/basic.test.js
index e5feec0b3..aaa2adf58 100644
--- a/tests/markdown/basic.test.js
+++ b/tests/markdown/basic.test.js
@@ -1,4 +1,4 @@
-/* eslint-disable max-lines */
+
 
 import Markdown from 'naturalcrit/markdown.js';
 
diff --git a/tests/markdown/definition-lists.test.js b/tests/markdown/definition-lists.test.js
index 039754ca1..144dad880 100644
--- a/tests/markdown/definition-lists.test.js
+++ b/tests/markdown/definition-lists.test.js
@@ -1,4 +1,4 @@
-/* eslint-disable max-lines */
+
 
 import Markdown from 'naturalcrit/markdown.js';
 
@@ -92,12 +92,12 @@ describe('Multiline Definition Lists', ()=>{
 	test('Multiline Definition Term must have at least one non-empty Definition', function() {
 		const source = 'Term 1\n::';
 		const rendered = Markdown.render(source).trim();
-		expect(rendered, `Input:\n${source}`, { showPrefix: false }).toBe(`<p>Term 1</p>\n<div class='blank'></div><div class='blank'></div>`);
+		expect(rendered, `Input:\n${source}`, { showPrefix: false }).toBe(`<p>Term 1</p>\n<div class='blank'></div>\n<div class='blank'></div>`);
 	});
 
 	test('Multiline Definition List must have at least one non-newline character after ::', function() {
 		const source = 'Term 1\n::\nDefinition 1\n\n';
 		const rendered = Markdown.render(source).trim();
-		expect(rendered, `Input:\n${source}`, { showPrefix: false }).toBe(`<p>Term 1</p>\n<div class='blank'></div><div class='blank'></div>\n<p>Definition 1</p>`);
+		expect(rendered, `Input:\n${source}`, { showPrefix: false }).toBe(`<p>Term 1</p>\n<div class='blank'></div>\n<div class='blank'></div>\n<p>Definition 1</p>`);
 	});
 });
diff --git a/tests/markdown/hard-breaks.test.js b/tests/markdown/hard-breaks.test.js
index 8af102716..63bfaef9c 100644
--- a/tests/markdown/hard-breaks.test.js
+++ b/tests/markdown/hard-breaks.test.js
@@ -1,4 +1,4 @@
-/* eslint-disable max-lines */
+
 
 import Markdown from 'naturalcrit/markdown.js';
 
@@ -12,31 +12,31 @@ describe('Hard Breaks', ()=>{
 	test('Double Break', function() {
 		const source = '::\n\n';
 		const rendered = Markdown.render(source).trim();
-		expect(rendered, `Input:\n${source}`, { showPrefix: false }).toBe(`<div class='blank'></div><div class='blank'></div>`);
+		expect(rendered, `Input:\n${source}`, { showPrefix: false }).toBe(`<div class='blank'></div>\n<div class='blank'></div>`);
 	});
 
 	test('Triple Break', function() {
 		const source = ':::\n\n';
 		const rendered = Markdown.render(source).trim();
-		expect(rendered, `Input:\n${source}`, { showPrefix: false }).toBe(`<div class='blank'></div><div class='blank'></div><div class='blank'></div>`);
+		expect(rendered, `Input:\n${source}`, { showPrefix: false }).toBe(`<div class='blank'></div>\n<div class='blank'></div>\n<div class='blank'></div>`);
 	});
 
 	test('Many Break', function() {
 		const source = '::::::::::\n\n';
 		const rendered = Markdown.render(source).trim();
-		expect(rendered, `Input:\n${source}`, { showPrefix: false }).toBe(`<div class='blank'></div><div class='blank'></div><div class='blank'></div><div class='blank'></div><div class='blank'></div><div class='blank'></div><div class='blank'></div><div class='blank'></div><div class='blank'></div><div class='blank'></div>`);
+		expect(rendered, `Input:\n${source}`, { showPrefix: false }).toBe(`<div class='blank'></div>\n<div class='blank'></div>\n<div class='blank'></div>\n<div class='blank'></div>\n<div class='blank'></div>\n<div class='blank'></div>\n<div class='blank'></div>\n<div class='blank'></div>\n<div class='blank'></div>\n<div class='blank'></div>`);
 	});
 
 	test('Multiple sets of Breaks', function() {
 		const source = ':::\n:::\n:::';
 		const rendered = Markdown.render(source).trim();
-		expect(rendered, `Input:\n${source}`, { showPrefix: false }).toBe(`<div class='blank'></div><div class='blank'></div><div class='blank'></div>\n<div class='blank'></div><div class='blank'></div><div class='blank'></div>\n<div class='blank'></div><div class='blank'></div><div class='blank'></div>`);
+		expect(rendered, `Input:\n${source}`, { showPrefix: false }).toBe(`<div class='blank'></div>\n<div class='blank'></div>\n<div class='blank'></div>\n<div class='blank'></div>\n<div class='blank'></div>\n<div class='blank'></div>\n<div class='blank'></div>\n<div class='blank'></div>\n<div class='blank'></div>`);
 	});
 
 	test('Break directly between two paragraphs', function() {
 		const source = 'Line 1\n::\nLine 2';
 		const rendered = Markdown.render(source).trim();
-		expect(rendered, `Input:\n${source}`, { showPrefix: false }).toBe(`<p>Line 1</p>\n<div class='blank'></div><div class='blank'></div>\n<p>Line 2</p>`);
+		expect(rendered, `Input:\n${source}`, { showPrefix: false }).toBe(`<p>Line 1</p>\n<div class='blank'></div>\n<div class='blank'></div>\n<p>Line 2</p>`);
 	});
 
 	test('Ignored inside a code block', function() {
diff --git a/tests/markdown/non-breaking-spaces.test.js b/tests/markdown/non-breaking-spaces.test.js
index 9dad4eb0f..c4f36554a 100644
--- a/tests/markdown/non-breaking-spaces.test.js
+++ b/tests/markdown/non-breaking-spaces.test.js
@@ -1,4 +1,4 @@
-/* eslint-disable max-lines */
+
 
 import Markdown from 'naturalcrit/markdown.js';
 
diff --git a/tests/markdown/paragraph-justification.test.js b/tests/markdown/paragraph-justification.test.js
index 48b311e85..7876f5a26 100644
--- a/tests/markdown/paragraph-justification.test.js
+++ b/tests/markdown/paragraph-justification.test.js
@@ -1,4 +1,4 @@
-/* eslint-disable max-lines */
+
 
 import Markdown from 'naturalcrit/markdown.js';
 
diff --git a/tests/markdown/variables.test.js b/tests/markdown/variables.test.js
index 41259da7e..4c91d7d00 100644
--- a/tests/markdown/variables.test.js
+++ b/tests/markdown/variables.test.js
@@ -410,4 +410,29 @@ describe('Regression Tests', ()=>{
 		const rendered = Markdown.render(source).trimReturns();
 		expect(rendered).toBe('<table><thead><tr><th>title 1</th><th>title 2</th><th>title 3</th><th>title 4</th></tr></thead><tbody><tr><td><a href=\"bar\">foo</a></td><td>Ipsum</td><td>)</td><td>)</td></tr></tbody></table>');
 	});
+
+	it('Handle Extra spaces in image alt-text 1', function(){
+		const source='![ where is my image??](http://i.imgur.com/hMna6G0.png)';
+		const rendered = Markdown.render(source).trimReturns();
+		expect(rendered).toBe('<p><img src=\"http://i.imgur.com/hMna6G0.png\" alt=\"where is my image??\" style=\"--HB_src:url(http://i.imgur.com/hMna6G0.png);\"></p>');
+	});
+
+	it('Handle Extra spaces in image alt-text 2', function(){
+		const source='![where  is my image??](http://i.imgur.com/hMna6G0.png)';
+		const rendered = Markdown.render(source).trimReturns();
+		expect(rendered).toBe('<p><img src=\"http://i.imgur.com/hMna6G0.png\" alt=\"where is my image??\" style=\"--HB_src:url(http://i.imgur.com/hMna6G0.png);\"></p>');
+	});
+
+	it('Handle Extra spaces in image alt-text 3', function(){
+		const source='![where is my image?? ](http://i.imgur.com/hMna6G0.png)';
+		const rendered = Markdown.render(source).trimReturns();
+		expect(rendered).toBe('<p><img src=\"http://i.imgur.com/hMna6G0.png\" alt=\"where is my image??\" style=\"--HB_src:url(http://i.imgur.com/hMna6G0.png);\"></p>');
+	});
+
+	it('Handle Extra spaces in image alt-text 4', function(){
+		const source='![where is my image??](http://i.imgur.com/hMna6G0.png){height=20%,width=20%}';
+		const rendered = Markdown.render(source).trimReturns();
+		expect(rendered).toBe('<p><img style=\"--HB_src:url(http://i.imgur.com/hMna6G0.png);\" src=\"http://i.imgur.com/hMna6G0.png\" alt=\"where is my image??\" height=\"20%\" width=\"20%\"></p>');
+	});
+
 });
\ No newline at end of file
diff --git a/themes/Legacy/5ePHB/style.less b/themes/Legacy/5ePHB/style.less
index 4ebfbf840..56d1bed94 100644
--- a/themes/Legacy/5ePHB/style.less
+++ b/themes/Legacy/5ePHB/style.less
@@ -9,26 +9,22 @@
 @headerText            : #58180D; // Dark maroon
 @monsterStatBackground : #FDF1DC; // Lighter parchment
 @captionText           : #766649; // Brown
-@page { margin: 0; }
-body {
-	counter-reset : phb-page-numbers;
-}
-*{
-	-webkit-print-color-adjust : exact;
-}
-.useSansSerif(){
-	font-family : ScalySans;
-	em{
-		font-family : ScalySans;
+@page { margin : 0; }
+body { counter-reset : phb-page-numbers; }
+* { -webkit-print-color-adjust : exact; }
+.useSansSerif() {
+	font-family : "ScalySans";
+	em {
+		font-family : "ScalySans";
 		font-style  : italic;
 	}
-	strong{
-		font-family    : ScalySans;
+	strong {
+		font-family    : "ScalySans";
 		font-weight    : 800;
 		letter-spacing : -0.02em;
 	}
 }
-.useColumns(@multiplier : 1){
+.useColumns(@multiplier : 1) {
 	column-count         : 2;
 	column-fill          : auto;
 	column-gap           : 1cm;
@@ -40,21 +36,21 @@ body {
 	-webkit-column-gap   : 1cm;
 	-moz-column-gap      : 1cm;
 }
-.phb, .page{
+.phb, .page {
 	.useColumns();
-	counter-increment      : phb-page-numbers;
 	position               : relative;
 	z-index                : 15;
 	box-sizing             : border-box;
-	overflow               : hidden;
-	height                 : 279.4mm;
 	width                  : 215.9mm;
+	height                 : 279.4mm;
 	padding                : 1.0cm 1.7cm;
 	padding-bottom         : 1.5cm;
+	overflow               : hidden;
+	font-family            : "BookSanity";
+	font-size              : 0.317cm;
+	counter-increment      : phb-page-numbers;
 	background-color       : @background;
 	background-image       : @backgroundImage;
-	font-family            : BookSanity;
-	font-size              : 0.317cm;
 	text-rendering         : optimizeLegibility;
 	page-break-before      : always;
 	page-break-after       : always;
@@ -63,199 +59,175 @@ body {
 	contain-intrinsic-size : auto none;
 }
 
-.phb{
+.phb {
 	//*****************************
 	// *            BASE
 	// *****************************/
-	p{
+	p {
 		padding-bottom : 0.8em;
 		line-height    : 1.269em;
-		&+p{
-			margin-top : -0.8em;
-		}
+		& + p { margin-top : -0.8em; }
 	}
-	ul{
-		margin-bottom       : 0.8em;
+	ul {
 		padding-left        : 1.4em;
+		margin-bottom       : 0.8em;
 		line-height         : 1.269em;
 		list-style-position : outside;
 		list-style-type     : disc;
 	}
-	ol{
-		margin-bottom       : 0.8em;
+	ol {
 		padding-left        : 1.4em;
+		margin-bottom       : 0.8em;
 		line-height         : 1.269em;
 		list-style-position : outside;
 		list-style-type     : decimal;
 	}
 	//Indents after p or lists
-	p+p, ul+p, ol+p{
-		text-indent : 1em;
-	}
-	img{
-		z-index : -1;
-	}
-	strong{
+	p + p, ul + p, ol + p { text-indent : 1em; }
+	img { z-index : -1; }
+	strong {
 		font-weight    : bold;
 		letter-spacing : 0.03em;
 	}
-	em{
-		font-style : italic;
-	}
-	sup{
+	em { font-style : italic; }
+	sup {
+		font-size      : smaller;
+		line-height    : 0;
 		vertical-align : super;
-		font-size      : smaller;
-		line-height    : 0;
 	}
-	sub{
-		vertical-align : sub;
+	sub {
 		font-size      : smaller;
 		line-height    : 0;
+		vertical-align : sub;
 	}
 	//*****************************
 	// *           HEADERS
 	// *****************************/
-	h1,h2,h3,h4{
+	h1,h2,h3,h4 {
 		margin-top    : 0.2em;
 		margin-bottom : 0.2em;
-		font-family   : MrJeeves;
+		font-family   : "MrJeeves";
 		font-weight   : 800;
 		color         : @headerText;
 	}
-	h1{
+	h1 {
 		column-span         : all;
 		font-size           : 0.987cm;
 		-webkit-column-span : all;
 		-moz-column-span    : all;
-		&+p::first-letter{
+		& + p::first-letter {
 			float       : left;
-			font-family : Solberry;
+			font-family : "Solberry";
 			font-size   : 10em;
-			color       : #222;
 			line-height : 0.795em;
+			color       : #222222;
 		}
 	}
-	h2{
-		font-size : 0.705cm;
-	}
-	h3{
+	h2 { font-size : 0.705cm; }
+	h3 {
 		font-size     : 0.529cm;
 		border-bottom : 2px solid @headerUnderline;
 	}
-	h4{
+	h4 {
 		margin-bottom : 0.00em;
 		font-size     : 0.458cm;
 	}
-	h5{
+	h5 {
 		margin-bottom : 0.2em;
-		font-family   : ScalySansSmallCaps;
+		font-family   : "ScalySansSmallCaps";
 		font-size     : 0.423cm;
 		font-weight   : 900;
 	}
 	//*****************************
 	// *          TABLE
 	// *****************************/
-	table{
+	table {
 		.useSansSerif();
 		width         : 100%;
 		margin-bottom : 1em;
 		font-size     : 10pt;
-		thead{
-			display: table-row-group;
+		thead {
+			display     : table-row-group;
 			font-weight : 800;
-			th{
-				vertical-align : bottom;
-				padding-bottom : 0.3em;
+			th {
 				padding-right  : 0.1em;
+				padding-bottom : 0.3em;
 				padding-left   : 0.1em;
+				vertical-align : bottom;
 			}
 		}
-		tbody{
-			tr{
-				td{
-					padding : 0.3em 0.1em;
-				}
-				&:nth-child(odd){
-					background-color : @noteGreen;
-				}
+		tbody {
+			tr {
+				td { padding : 0.3em 0.1em; }
+				&:nth-child(odd) { background-color : @noteGreen; }
 			}
 		}
 	}
 	//*****************************
 	// *            NOTE
 	// *****************************/
-	blockquote{
+	blockquote {
 		.useSansSerif();
 		box-sizing          : border-box;
-		margin-bottom       : 1em;
 		padding             : 5px 10px;
+		margin-bottom       : 1em;
 		background-color    : @noteGreen;
 		border-style        : solid;
 		border-width        : 11px;
 		border-image        : @noteBorderImage 11;
 		border-image-outset : 9px 0px;
-		box-shadow          : 1px 4px 14px #888;
-		p, ul{
+		box-shadow          : 1px 4px 14px #888888;
+		p, ul {
 			font-size   : 0.352cm;
 			line-height : 1.083em;
 		}
 	}
 	//If a note starts a column, give it space at the top to render border
-	pre+blockquote, h2+blockquote, h3+blockquote, h4+blockquote, h5+blockquote {
-		margin-top : 13px;
-	}
+	pre + blockquote, h2 + blockquote, h3 + blockquote, h4 + blockquote, h5 + blockquote { margin-top : 13px; }
 	//*****************************
 	// *    MONSTER STAT BLOCK
 	// *****************************/
-	hr+blockquote{
+	hr+blockquote {
 		position         : relative;
 		padding-top      : 15px;
 		background-color : @monsterStatBackground;
 		border-style     : solid;
 		border-width     : 10px;
 		border-image     : @monsterBorderImageLegacy 10;
-		h2{
+		h2 {
 			margin-top    : -8px;
 			margin-bottom : 0px;
-			&+p{
-				padding-bottom : 0px;
-			}
+			& + p { padding-bottom : 0px; }
 		}
-		h3{
-			font-family   : ScalySans;
-			font-weight   : 400;
+		h3 {
+			font-family   : "ScalySans";
+			font-weight   : normal;
 			border-bottom : 1px solid @headerText;
 		}
-		hr+ul{
-			color : @headerText;
-		}
-		ul{
+		hr + ul { color : @headerText; }
+		ul {
 			.useSansSerif();
 			padding-left : 1em;
 			font-size    : 0.352cm;
 		}
 		// Monster Ability table
-		hr+table{
+		hr + table {
 			margin              : 0;
 			background-color    : transparent;
 			border-style        : none;
 			border-image        : none;
-			tbody{
-				tr:nth-child(odd), tr:nth-child(even){
-					background-color : transparent;
-				}
+			tbody {
+				tr:nth-child(odd), tr:nth-child(even) { background-color : transparent; }
 			}
 		}
-		table{
-			color : @headerText;
-		}
-		p+p{
-			margin-top     : 0em;
+		table { color : @headerText; }
+		p + p {
 			padding-bottom : 0.5em;
+			margin-top     : 0em;
 			text-indent    : 0em;
 		}
 		//Triangle dividers
-		hr{
+		hr {
 			visibility       : visible;
 			height           : 6px;
 			margin           : 4px 0px;
@@ -265,100 +237,90 @@ body {
 		}
 	}
 	//Full Width
-	hr+hr+blockquote{
+	hr + hr + blockquote {
 		.useColumns(0.96);
 		column-fill : balance;
 	}
 	//*****************************
 	// *           FOOTER
 	// *****************************/
-	&:after{
-		content          : "";
+	&:after {
 		position         : absolute;
 		bottom           : 0px;
 		left             : 0px;
 		z-index          : 100;
-		height           : 50px;
 		width            : 100%;
+		height           : 50px;
+		content          : '';
 		background-image : @footerAccentImage;
 		background-size  : cover;
 	}
-	&:nth-child(even){
-		&:after{
-			transform : scaleX(-1);
-		}
-		.pageNumber{
-			left : 2px;
-		}
-		.footnote{
+	&:nth-child(even) {
+		&::after { transform : scaleX(-1); }
+		.pageNumber { left : 2px; }
+		.footnote {
 			left       : 80px;
 			text-align : left;
 		}
 	}
-	.pageNumber{
+	.pageNumber {
 		position   : absolute;
 		right      : 2px;
 		bottom     : 22px;
 		width      : 50px;
 		font-size  : 0.9em;
-		color      : #c9ad6a;
+		color      : #C9AD6A;
 		text-align : center;
-		&.auto::after {
-			content : counter(phb-page-numbers);
-		}
+		&.auto::after { content : counter(phb-page-numbers); }
 	}
-	.footnote{
+	.footnote {
 		position   : absolute;
 		right      : 80px;
 		bottom     : 32px;
 		z-index    : 150;
 		width      : 200px;
 		font-size  : 0.8em;
-		color      : #c9ad6a;
+		color      : #C9AD6A;
 		text-align : right;
 	}
 	//*****************************
 	// *          EXTRAS
 	// *****************************/
-	hr{
+	hr {
 		visibility : hidden;
 		margin     : 0px;
 	}
 	//Modified unorder list, used in spells
-	hr+ul{
-		margin-bottom   : 0.5em;
+	hr + ul {
 		padding-left    : 1em;
+		margin-bottom   : 0.5em;
 		text-indent     : -1em;
 		list-style-type : none;
 	}
 	//Column Break
-	pre, code{
+	pre, code {
 		visibility                 : hidden;
 		-webkit-column-break-after : always;
 		break-after                : always;
 		-moz-column-break-after    : always;
 	}
 	//Avoid breaking up
-	p,blockquote,table{
+	p,blockquote,table {
 		z-index                     : 15;
 		-webkit-column-break-inside : avoid;
 		page-break-inside           : avoid;
 		break-inside                : avoid;
 	}
 	//Better spacing for spell blocks
-	h4+p+hr+ul{
-		margin-top : -0.5em
-	}
+	h4 + p + hr + ul { margin-top : -0.5em; }
 	//Text indent right after table
-	table+p{
-		text-indent : 1em;
-	}
+	table + p { text-indent : 1em; }
 	// Nested lists
-	ul ul,ol ol,ul ol,ol ul{
+	ul ul,ol ol,ul ol,ol ul {
 		margin-bottom : 0px;
 		margin-left   : 1.5em;
 	}
-	li{
+	li {
 		-webkit-column-break-inside : avoid;
 		page-break-inside           : avoid;
 		break-inside                : avoid;
@@ -367,89 +329,81 @@ body {
 //*****************************
 // *         SPELL LIST
 // *****************************/
-.phb .spellList{
+.phb .spellList {
 	.useSansSerif();
 	column-count        : 4;
-	column-span         : all;
 	-webkit-column-span : all;
 	-moz-column-span    : all;
-	ul+h5{
-		margin-top : 15px;
-	}
-	p, ul{
+	column-span         : all;
+	ul + h5 { margin-top : 15px; }
+	p, ul {
 		font-size   : 0.352cm;
 		line-height : 1.263em;
 	}
-	ul{
-		margin-bottom               : 0.5em;
+	ul {
 		padding-left                : 1em;
+		margin-bottom               : 0.5em;
 		text-indent                 : -1em;
 		list-style-type             : none;
+		break-inside                : auto;
 		-webkit-column-break-inside : auto;
 		page-break-inside           : auto;
-		break-inside                : auto;
 	}
 }
 //*****************************
 // *         WIDE
 // *****************************/
-.phb .wide{
-	column-span         : all;
+.phb .wide {
 	-webkit-column-span : all;
 	-moz-column-span    : all;
+	column-span         : all;
 }
 //*****************************
 // *       CLASS TABLE
 // *****************************/
-.phb .classTable{
+.phb .classTable {
 	margin-top          : 25px;
 	margin-bottom       : 40px;
 	border-collapse     : separate;
 	background-color    : white;
 	border              : initial;
 	border-style        : solid;
+	border-image-source : @frameBorderImage;
+	border-image-slice  : 150 200 150 200;
+	border-image-width  : 47px;
 	border-image-outset : 25px 17px;
 	border-image-repeat : stretch;
-	border-image-slice  : 150 200 150 200;
-	border-image-source : @frameBorderImage;
-	border-image-width  : 47px;
-	h5{
-		margin-bottom : 10px;
-	}
+	h5 { margin-bottom : 10px; }
 }
 //************************************
 // *       DESCRIPTIVE TEXT BOX
 // ************************************/
-.phb .descriptive{
+.phb .descriptive {
 	margin-bottom       : 1em;
-	background-color    : #faf7ea;
-	font-family         : ScalySans;
+	font-family         : "ScalySans";
+	background-color    : #FAF7EA;
 	border-style        : solid;
 	border-width        : 7px;
 	border-image        : @descriptiveBoxImage 12 stretch;
 	border-image-outset : 4px;
-	box-shadow          : 0px 0px 6px #faf7ea;
-	p{
+	box-shadow          : 0px 0px 6px #FAF7EA;
+	p {
 		display        : block;
 		padding-bottom : 0px;
 		line-height    : 1.47em;
 	}
-	p + p {
-		padding-top : .8em;
-	}
+	p + p { padding-top : 0.8em; }
 	em {
-		font-family : ScalySans;
+		font-family : "ScalySans";
 		font-style  : italic;
 	}
 	strong {
-		font-family    : ScalySans;
+		font-family    : "ScalySans";
 		font-weight    : 800;
 		letter-spacing : -0.02em;
 	}
 }
-.phb pre+.descriptive{
-	margin-top : 8px;
-}
+.phb pre + .descriptive { margin-top : 8px; }
 
 //*****************************
 // *    ARTIST CREDIT BLOCK
@@ -457,47 +411,41 @@ body {
 .phb {
 	.artist {
 		position    : absolute;
-		text-align  : center;
-		font-family : WalterTurncoat;
+		font-family : "WalterTurncoat";
 		font-size   : 0.27cm;
 		color       : @captionText;
+		text-align  : center;
 		p, p + p {
 			margin      : unset;
-			text-indent : unset;
 			line-height : 0.941em;
+			text-indent : unset;
 		}
-	 	h5 {
+		h5 {
+			font-family : "WalterTurncoat";
 			font-size   : 1.3em;
-			font-family : WalterTurncoat;
 		}
-		a{
+		a {
 			color           : inherit;
 			text-decoration : unset;
-			&:hover {
-				text-decoration : underline;
-			}
+			&:hover { text-decoration : underline; }
 		}
 	}
 }
 //*****************************
 // *      TABLE OF CONTENTS
 // *****************************/
-.phb .toc{
+.phb .toc {
 	-webkit-column-break-inside : avoid;
 	page-break-inside           : avoid;
 	break-inside                : avoid;
-	a{
+	a {
 		color           : black;
 		text-decoration : none;
-		&:hover{
-			text-decoration : underline;
-		}
+		&:hover { text-decoration : underline; }
 	}
-	ul{
+	ul {
 		padding-left    : 0;
 		list-style-type : none;
 	}
-	&>ul>li{
-		margin-bottom : 10px;
-	}
+	& > ul > li { margin-bottom : 10px; }
 }
diff --git a/themes/V3/5eDMG/snippets.js b/themes/V3/5eDMG/snippets.js
index 636befb60..bad5e8e6a 100644
--- a/themes/V3/5eDMG/snippets.js
+++ b/themes/V3/5eDMG/snippets.js
@@ -1,4 +1,4 @@
-/* eslint-disable max-lines */
+
 
 module.exports = [
 ];
diff --git a/themes/V3/5eDMG/style.less b/themes/V3/5eDMG/style.less
index 2ced98312..cbc3fa890 100644
--- a/themes/V3/5eDMG/style.less
+++ b/themes/V3/5eDMG/style.less
@@ -7,37 +7,29 @@
 }
 
 .page {
-	background-image : url(/assets/DMG_background.png);
+	background-image : url("/assets/DMG_background.png");
 	background-size  : cover;
 
-	/*TABLES WITHIN NOTES*/
-	.note table tbody tr:nth-child(odd) {
-		background:#fff;
-	}
+	/* TABLES WITHIN NOTES */
+	.note table tbody tr:nth-child(odd) { background : #FFFFFF; }
 
-	/*DROP CAP*/
+	/* DROP CAP */
 	h1 + p::first-letter {
-		background-image: unset;
-		color:black;
+		color            : black;
+		background-image : unset;
 	}
 
-	.quote p:first-child::first-line  {
-		all: unset;
+	.quote p:first-child::first-line { all : unset; }
+
+	&::after {
+		height           : 58px;
+		background-image : url("/assets/DMG_footerAccent.png");
 	}
 
-	&:after {
-		background-image : url(/assets/DMG_footerAccent.png);
-		height: 58px;
-	}
-
-	.footnote {
-		bottom : 40px;
-	}
+	.footnote { bottom : 40px; }
 }
 
 .page:has(.partCover) {
 
-	.partCover {
-		background-image: @partCoverHeaderDMG;
-	}
+	.partCover { background-image : @partCoverHeaderDMG; }
 }
diff --git a/themes/V3/5ePHB/snippets/monsterblock.gen.js b/themes/V3/5ePHB/snippets/monsterblock.gen.js
index e61c206f0..dffb59d04 100644
--- a/themes/V3/5ePHB/snippets/monsterblock.gen.js
+++ b/themes/V3/5ePHB/snippets/monsterblock.gen.js
@@ -148,7 +148,7 @@ const genAction = function(){
 		'Turnbuckle Roll'
 	]);
 
-	return `***${name}.*** *Melee Weapon Attack:* +4 to hit, reach 5ft., one target. *Hit* 5 (1d6 + 2) `;
+	return `***${name}.*** *Melee Weapon Attack:* +4 to hit, reach 5 ft., one target. *Hit:* 5 (1d6 + 2) `;
 };
 
 
@@ -161,8 +161,8 @@ module.exports = {
 			*${getType()}, ${getAlignment()}*
 			___
 			**Armor Class** :: ${_.random(10, 20)} (chain mail, shield)
-			**Hit Points**  :: ${_.random(1, 150)}(1d4 + 5)
-			**Speed**       :: ${_.random(0, 50)}ft.
+			**Hit Points**  :: ${_.random(1, 150)} (1d4 + 5)
+			**Speed**       :: ${_.random(0, 50)} ft.
 			___
 			|  STR  |  DEX  |  CON  |  INT  |  WIS  |  CHA  |
 			|:-----:|:-----:|:-----:|:-----:|:-----:|:-----:|
diff --git a/themes/V3/5ePHB/style.less b/themes/V3/5ePHB/style.less
index 9e2ce5064..d51cfd313 100644
--- a/themes/V3/5ePHB/style.less
+++ b/themes/V3/5ePHB/style.less
@@ -17,7 +17,6 @@
 .useSansSerif() {
 	font-family : 'ScalySansRemake';
 	font-size   : 0.318cm;
-	line-height : 1.2em;
 	p,dl,ul,ol { line-height : 1.2em; }
 	ul, ol { padding-left : 1em; }
 	em { font-style : italic; }
@@ -306,12 +305,12 @@
 			margin-left           : -0.16cm;
 			background-color      : var(--HB_Color_MonsterStatBackground);
 			background-image      : @monsterBlockBackground;
-			background-blend-mode : overlay;
 			border-style          : solid;
 			border-width          : 7px 6px;
 			border-image          : @monsterBorderImage 14 round;
 			border-image-outset   : 0px 2px;
 			box-shadow            : 1px 4px 14px #888888;
+			background-blend-mode : overlay;
 		}
 
 		position      : relative;
@@ -336,9 +335,9 @@
 
 		//Triangle dividers
 		hr {
+			visibility       : visible;
 			height           : 6px;
 			margin           : 0.12cm 0cm;
-			visibility       : visible;
 			background-image : @redTriangleImage;
 			background-size  : 100% 100%;
 			border           : none;
@@ -356,8 +355,8 @@
 		}
 
 		.bonus {
-			float: right;
-			padding-right: 0.5em;
+			float         : right;
+			padding-right : 0.5em;
 		}
 
 		// Monster Ability table
@@ -457,8 +456,8 @@
 	// *          EXTRAS
 	// *****************************/
 	hr {
-		margin     : 0px;
 		visibility : hidden;
+		margin     : 0px;
 	}
 	//Text indent right after table
 	table + p { text-indent : 1em; }
@@ -526,10 +525,10 @@
 		content             : '';
 		background-image    : @classTableDecoration,
 			@classTableDecoration;
-		filter              : drop-shadow(0px 0px 1px #C8C5C080);
 		background-repeat   : no-repeat, no-repeat;
 		background-position : top, bottom;
 		background-size     : contain, contain;
+		filter              : drop-shadow(0px 0px 1px #C8C5C080);
 		transform           : translateY(-50%) translateX(-50%);
 	}
 	&.decoration.wide::before {
@@ -546,39 +545,40 @@
 	columns    : 1;
 	text-align : center;
 	&::after { display : none; }
+	.frontCover { position : absolute; }
 	h1 {
-		margin-top     : 1.2cm;
-		margin-bottom  : 0;
-		font-family    : 'NodestoCapsCondensed';
-		font-size      : 2.245cm;
-		font-weight    : normal;
-		line-height    : 1.9cm;
-		color          : white;
-		text-shadow    : unset;
-		text-transform : uppercase;
-		-webkit-text-stroke: 0.2cm black;
-  		paint-order:stroke;
+		margin-top          : 1.55cm;
+		margin-bottom       : 0;
+		font-family         : 'NodestoCapsCondensed';
+		font-size           : 2.245cm;
+		font-weight         : normal;
+		line-height         : 1.9cm;
+		color               : white;
+		text-transform      : uppercase;
+		text-shadow         : unset;
+		-webkit-text-stroke : 0.2cm black;
+		paint-order         : stroke;
 	}
 	h2 {
-		font-family    : 'NodestoCapsCondensed';
-		font-size      : 0.85cm;
-		font-weight    : normal;
-		color          : white;
-		letter-spacing : 0.1cm;
-		-webkit-text-stroke: 0.14cm black;
-  		paint-order:stroke;
+		font-family         : 'NodestoCapsCondensed';
+		font-size           : 0.85cm;
+		font-weight         : normal;
+		color               : white;
+		letter-spacing      : 0.1cm;
+		-webkit-text-stroke : 0.14cm black;
+		paint-order         : stroke;
 	}
 	hr {
 		position         : relative;
 		display          : block;
+		visibility       : visible;
 		width            : 12cm;
 		height           : 0.5cm;
 		margin           : auto;
-		visibility       : visible;
 		background-image : @horizontalRule;
-		filter           : drop-shadow(0 0 3px black);
 		background-size  : 100% 100%;
 		border           : none;
+		filter           : drop-shadow(0 0 3px black);
 	}
 	.banner {
 		position         : absolute;
@@ -601,19 +601,19 @@
 		filter           : drop-shadow(2px 2px 2px black);
 	}
 	.footnote {
-		position     : absolute;
-		right        : 0;
-		bottom       : 1.3cm;
-		left         : 0;
-		width        : 70%;
-		margin-right : auto;
-		margin-left  : auto;
-		font-family  : 'Overpass';
-		font-size    : 0.496cm;
-		color        : white;
-		text-align   : center;
-		-webkit-text-stroke: 0.1cm black;
-  		paint-order:stroke;
+		position            : absolute;
+		right               : 0;
+		bottom              : 1.3cm;
+		left                : 0;
+		width               : 70%;
+		margin-right        : auto;
+		margin-left         : auto;
+		font-family         : 'Overpass';
+		font-size           : 0.496cm;
+		color               : white;
+		text-align          : center;
+		-webkit-text-stroke : 0.1cm black;
+		paint-order         : stroke;
 	}
 	.logo {
 		position   : absolute;
@@ -621,10 +621,7 @@
 		right      : 0;
 		left       : 0;
 		filter     : drop-shadow(0 0 0.075cm black);
-		img {
-			width  : 100%;
-			height : 2cm;
-		}
+		img { height : 2cm; }
 	}
 }
 // *****************************
@@ -634,8 +631,9 @@
 	columns    : 1;
 	text-align : center;
 	&::after { display	: none; }
+	.insideCover { position : absolute; }
 	h1 {
-		margin-top     : 1.2cm;
+		margin-top     : 1.55cm;
 		margin-bottom  : 0;
 		font-family    : 'NodestoCapsCondensed';
 		font-size      : 2.1cm;
@@ -652,10 +650,10 @@
 	hr {
 		position         : relative;
 		display          : block;
+		visibility       : visible;
 		width            : 12cm;
 		height           : 0.5cm;
 		margin           : auto;
-		visibility       : visible;
 		background-image : @horizontalRule;
 		background-size  : 100% 100%;
 		border           : none;
@@ -666,26 +664,23 @@
 		bottom   : 1cm;
 		left     : 0;
 		height   : 2cm;
-		img {
-			width  : 100%;
-			height : 2cm;
-		}
+		img { height : 2cm; }
 	}
 }
 // *****************************
 // *      BACK COVER
 // *****************************/
 .page:has(.backCover) {
-	padding : 2.25cm 1.3cm 2cm 1.3cm;
-	color   : #FFFFFF;
-	columns : 1;
+	padding     : 2.25cm 1.3cm 2cm 1.3cm;
+	line-height : 1.4em;
+	color       : #FFFFFF;
+	columns     : 1;
 	&::after { display : none; }
 	.columnWrapper { width : 7.6cm; }
 	.backCover {
 		position          : absolute;
 		inset             : 0;
 		z-index           : -1;
-		width             : 11cm;
 		background-image  : @backCover;
 		background-repeat : no-repeat;
 		background-size   : contain;
@@ -708,12 +703,12 @@
 		height   : 100%;
 	}
 	hr {
+		visibility       : visible;
 		width            : 4.5cm;
 		height           : 0.53cm;
 		margin-top       : 1.1cm;
 		margin-right     : auto;
 		margin-left      : auto;
-		visibility       : visible;
 		background-image : @horizontalRule;
 		background-size  : 100% 100%;
 		border           : none;
@@ -737,7 +732,6 @@
 		img {
 			position : relative;
 			z-index  : 0;
-			width    : 100%;
 			height   : 1.5cm;
 		}
 		p {
@@ -801,11 +795,9 @@
 .monster { --TOC: exclude; }
 
 .page:has(.partCover) {
-	--TOC: exclude;
-	& h1 {
-	  --TOC: include;
-	}
-  }
+	--TOC : exclude;
+	& h1 { --TOC : include; }
+}
 
 .page {
 	&:has(.toc)::after { display : none; }
@@ -871,9 +863,7 @@
 			.useColumns(0.96, @fillMode: balance);
 		}
 	}
-	.toc.wide li {
-			break-inside: auto;
-	}
+	.toc.wide li { break-inside : auto; }
 }
 
 // *****************************
@@ -898,9 +888,7 @@
 
 .page h1 + * { margin-top : 0; }
 
-.page .descriptive.wide + * {
-	margin-top: 0;
-}
+.page .descriptive.wide + * { margin-top : 0; }
 
 //*****************************
 // *       RUNE TABLE
@@ -915,8 +903,8 @@
 				width          : 1.3cm;
 				height         : 1.3cm;
 				font-weight    : normal;
-				text-transform : uppercase;
 				vertical-align : middle;
+				text-transform : uppercase;
 				outline        : 1px solid #000000;
 			}
 			th {
diff --git a/themes/V3/Blank/snippets.js b/themes/V3/Blank/snippets.js
index 809035a3a..1b347dd07 100644
--- a/themes/V3/Blank/snippets.js
+++ b/themes/V3/Blank/snippets.js
@@ -486,6 +486,15 @@ module.exports = [
 		icon      : 'fas fa-print',
 		view      : 'style',
 		snippets  : [
+			{
+				name : 'US Letter Page Size',
+				icon : 'far fa-file',
+				gen  : dedent`/* US Letter Page Size */
+					.page {
+						width  : 215.9mm; /* 8.5in */
+						height : 279.4mm; /* 11in */
+					}\n\n`,
+			},
 			{
 				name : 'A3 Page Size',
 				icon : 'far fa-file',
diff --git a/themes/V3/Blank/style.less b/themes/V3/Blank/style.less
index c3a792b16..519b60207 100644
--- a/themes/V3/Blank/style.less
+++ b/themes/V3/Blank/style.less
@@ -22,9 +22,9 @@ body { counter-reset : page-numbers 0; }
 // *****************************/
 .page {
 	.block {
-		break-inside      : avoid;
 		display           : inline-block;
 		width             : 100%;
+		break-inside      : avoid;
 		img { z-index : 0; }
 	}
 	.inline-block {
@@ -59,8 +59,8 @@ body { counter-reset : page-numbers 0; }
 	content-visibility     : auto;
 	contain-intrinsic-size : auto none;
 }
-	//*****************************
-	// *            BASE
+//*****************************
+// *            BASE
 	// *****************************/
 .page {
 	p {
@@ -121,7 +121,7 @@ body { counter-reset : page-numbers 0; }
 	// *           CODE BLOCKS
 	// ************************************/
 	code {
-		font-family      : 'Courier New', "Courier", monospace;
+		font-family      : 'Courier New', 'Courier', monospace;
 		overflow-wrap    : break-word;
 		white-space      : pre-wrap;
 	}
@@ -134,10 +134,10 @@ body { counter-reset : page-numbers 0; }
 	// *          EXTRAS
 	// *****************************/
 	.columnSplit {
-		margin-top                 : 0;
 		visibility                 : hidden;
-		-webkit-column-break-after : always;
+		margin-top                 : 0;
 		break-after                : always;
+		-webkit-column-break-after : always;
 		-moz-column-break-after    : always;
 		& + * { margin-top : 0; }
 	}
@@ -200,11 +200,11 @@ body { counter-reset : page-numbers 0; }
 		background-color    : var(--HB_Color_WatercolorStain);			/* default color */
 		background-size     : cover;
 		-webkit-mask-image  : var(--wc);
-		-webkit-mask-size   : contain;
-		-webkit-mask-repeat : no-repeat;
 		mask-image          : var(--wc);
-		mask-size           : contain;
+		-webkit-mask-repeat : no-repeat;
 		mask-repeat         : no-repeat;
+		-webkit-mask-size   : contain;
+		mask-size           : contain;
 		--wc                : @watercolor1;         /* default image */
 	}
 
@@ -232,15 +232,15 @@ body { counter-reset : page-numbers 0; }
 		height                : 200%;
 		background-image      : var(--checkerboard);
 		background-size       : 20px;
-		transform             : translateY(50%) translateX(-50%) rotate(calc(1deg * var(--rotation))) scaleX(var(--scaleX)) scaleY(var(--scaleY));
 		-webkit-mask-image    : var(--wc), var(--revealer);
-		-webkit-mask-repeat   : repeat-x;
-		-webkit-mask-size     : 50%; //Scale only X to fit page width, leave height at aspect ratio, designed to hang off the edge
-		-webkit-mask-position : 50% calc(50% - var(--offset));
 		mask-image            : var(--wc);
+		-webkit-mask-repeat   : repeat-x;
 		mask-repeat           : repeat-x;
-		mask-size             : 50%;
+		-webkit-mask-position : 50% calc(50% - var(--offset));
 		mask-position         : 50% calc(50% - var(--offset));
+		-webkit-mask-size     : 50%; //Scale only X to fit page width, leave height at aspect ratio, designed to hang off the edge
+		mask-size             : 50%;
+		transform             : translateY(50%) translateX(-50%) rotate(calc(1deg * var(--rotation))) scaleX(var(--scaleX)) scaleY(var(--scaleY));
 		--rotation            : 0;
 		--revealer            : none;
 		--checkerboard        : none;
@@ -277,19 +277,19 @@ body { counter-reset : page-numbers 0; }
 		}
 		&.revealImage {
 			--revealer     : linear-gradient(0deg, rgba(0,0,0,0.2) 0%, rgba(0,0,0,0.2));
-			--checkerboard : url("/assets/waterColorMasks/missingImage.png"); //shows any masked regions not filled by image
+			--checkerboard : url('/assets/waterColorMasks/missingImage.png'); //shows any masked regions not filled by image
 		}
 	}
 
 	.imageMaskEdge {
-		&1 { --wc : url("/assets/waterColorMasks/edge/0001.webp"); }
-		&2 { --wc : url("/assets/waterColorMasks/edge/0002.webp"); }
-		&3 { --wc : url("/assets/waterColorMasks/edge/0003.webp"); }
-		&4 { --wc : url("/assets/waterColorMasks/edge/0004.webp"); }
-		&5 { --wc : url("/assets/waterColorMasks/edge/0005.webp"); }
-		&6 { --wc : url("/assets/waterColorMasks/edge/0006.webp"); }
-		&7 { --wc : url("/assets/waterColorMasks/edge/0007.webp"); }
-		&8 { --wc : url("/assets/waterColorMasks/edge/0008.webp"); }
+		&1 { --wc : url('/assets/waterColorMasks/edge/0001.webp'); }
+		&2 { --wc : url('/assets/waterColorMasks/edge/0002.webp'); }
+		&3 { --wc : url('/assets/waterColorMasks/edge/0003.webp'); }
+		&4 { --wc : url('/assets/waterColorMasks/edge/0004.webp'); }
+		&5 { --wc : url('/assets/waterColorMasks/edge/0005.webp'); }
+		&6 { --wc : url('/assets/waterColorMasks/edge/0006.webp'); }
+		&7 { --wc : url('/assets/waterColorMasks/edge/0007.webp'); }
+		&8 { --wc : url('/assets/waterColorMasks/edge/0008.webp'); }
 	}
 
 	[class*='imageMaskCenter'] {
@@ -297,15 +297,15 @@ body { counter-reset : page-numbers 0; }
 		left                  : calc(var(--offsetX));
 		width                 : 100%;
 		height                : 100%;
-		transform             : rotate(calc(1deg * var(--rotation))) scaleX(var(--scaleX)) scaleY(var(--scaleY));
 		-webkit-mask-image    : var(--wc), var(--revealer);
-		-webkit-mask-repeat   : no-repeat;
-		-webkit-mask-size     : 100% 100%; //Scale both dimensions to fit page size
-		-webkit-mask-position : 0% 0%;
 		mask-image            : var(--wc), var(--revealer);
+		-webkit-mask-repeat   : no-repeat;
 		mask-repeat           : no-repeat;
-		mask-size             : 100% 100%; //Scale both dimensions to fit page size
+		-webkit-mask-position : 0% 0%;
 		mask-position         : 50% 50%;
+		-webkit-mask-size     : 100% 100%; //Scale both dimensions to fit page size
+		mask-size             : 100% 100%; //Scale both dimensions to fit page size
+		transform             : rotate(calc(1deg * var(--rotation))) scaleX(var(--scaleX)) scaleY(var(--scaleY));
 
 		& > p:has(img) {
 			position   : absolute;
@@ -322,23 +322,23 @@ body { counter-reset : page-numbers 0; }
 	}
 
 	.imageMaskCenter {
-		&1 { --wc : url("/assets/waterColorMasks/center/0001.webp"); }
-		&2 { --wc : url("/assets/waterColorMasks/center/0002.webp"); }
-		&3 { --wc : url("/assets/waterColorMasks/center/0003.webp"); }
-		&4 { --wc : url("/assets/waterColorMasks/center/0004.webp"); }
-		&5 { --wc : url("/assets/waterColorMasks/center/0005.webp"); }
-		&6 { --wc : url("/assets/waterColorMasks/center/0006.webp"); }
-		&7 { --wc : url("/assets/waterColorMasks/center/0007.webp"); }
-		&8 { --wc : url("/assets/waterColorMasks/center/0008.webp"); }
-		&9 { --wc : url("/assets/waterColorMasks/center/0009.webp"); }
-		&10 { --wc : url("/assets/waterColorMasks/center/0010.webp"); }
-		&11 { --wc : url("/assets/waterColorMasks/center/0011.webp"); }
-		&12 { --wc : url("/assets/waterColorMasks/center/0012.webp"); }
-		&13 { --wc : url("/assets/waterColorMasks/center/0013.webp"); }
-		&14 { --wc : url("/assets/waterColorMasks/center/0014.webp"); }
-		&15 { --wc : url("/assets/waterColorMasks/center/0015.webp"); }
-		&16 { --wc : url("/assets/waterColorMasks/center/0016.webp"); }
-		&special { --wc : url("/assets/waterColorMasks/center/special.webp"); }
+		&1 { --wc : url('/assets/waterColorMasks/center/0001.webp'); }
+		&2 { --wc : url('/assets/waterColorMasks/center/0002.webp'); }
+		&3 { --wc : url('/assets/waterColorMasks/center/0003.webp'); }
+		&4 { --wc : url('/assets/waterColorMasks/center/0004.webp'); }
+		&5 { --wc : url('/assets/waterColorMasks/center/0005.webp'); }
+		&6 { --wc : url('/assets/waterColorMasks/center/0006.webp'); }
+		&7 { --wc : url('/assets/waterColorMasks/center/0007.webp'); }
+		&8 { --wc : url('/assets/waterColorMasks/center/0008.webp'); }
+		&9 { --wc : url('/assets/waterColorMasks/center/0009.webp'); }
+		&10 { --wc : url('/assets/waterColorMasks/center/0010.webp'); }
+		&11 { --wc : url('/assets/waterColorMasks/center/0011.webp'); }
+		&12 { --wc : url('/assets/waterColorMasks/center/0012.webp'); }
+		&13 { --wc : url('/assets/waterColorMasks/center/0013.webp'); }
+		&14 { --wc : url('/assets/waterColorMasks/center/0014.webp'); }
+		&15 { --wc : url('/assets/waterColorMasks/center/0015.webp'); }
+		&16 { --wc : url('/assets/waterColorMasks/center/0016.webp'); }
+		&special { --wc : url('/assets/waterColorMasks/center/special.webp'); }
 	}
 
 
@@ -347,15 +347,15 @@ body { counter-reset : page-numbers 0; }
 		left                  : calc(-50% + var(--offsetX));
 		width                 : 200%;
 		height                : 200%;
-		transform             : rotate(calc(1deg * var(--rotation))) scaleX(var(--scaleX)) scaleY(var(--scaleY));
 		-webkit-mask-image    : var(--wc), var(--revealer);
-		-webkit-mask-repeat   : no-repeat;
-		-webkit-mask-size     : 100% 100%; //Scale both dimensions to fit page size
-		-webkit-mask-position : 50% 50%;
 		mask-image            : var(--wc), var(--revealer);
+		-webkit-mask-repeat   : no-repeat;
 		mask-repeat           : no-repeat;
-		mask-size             : 100% 100%; //Scale both dimensions to fit page size
+		-webkit-mask-position : 50% 50%;
 		mask-position         : 50% 50%;
+		-webkit-mask-size     : 100% 100%; //Scale both dimensions to fit page size
+		mask-size             : 100% 100%; //Scale both dimensions to fit page size
+		transform             : rotate(calc(1deg * var(--rotation))) scaleX(var(--scaleX)) scaleY(var(--scaleY));
 		& > p:has(img) {
 			bottom     : 25%;
 			left       : 25%;
@@ -368,43 +368,43 @@ body { counter-reset : page-numbers 0; }
 		}
 	}
 	.imageMaskCorner {
-		&1 { --wc : url("/assets/waterColorMasks/corner/0001.webp"); }
-		&2 { --wc : url("/assets/waterColorMasks/corner/0002.webp"); }
-		&3 { --wc : url("/assets/waterColorMasks/corner/0003.webp"); }
-		&4 { --wc : url("/assets/waterColorMasks/corner/0004.webp"); }
-		&5 { --wc : url("/assets/waterColorMasks/corner/0005.webp"); }
-		&6 { --wc : url("/assets/waterColorMasks/corner/0006.webp"); }
-		&7 { --wc : url("/assets/waterColorMasks/corner/0007.webp"); }
-		&8 { --wc : url("/assets/waterColorMasks/corner/0008.webp"); }
-		&9 { --wc : url("/assets/waterColorMasks/corner/0009.webp"); }
-		&10 { --wc : url("/assets/waterColorMasks/corner/0010.webp"); }
-		&11 { --wc : url("/assets/waterColorMasks/corner/0011.webp"); }
-		&12 { --wc : url("/assets/waterColorMasks/corner/0012.webp"); }
-		&13 { --wc : url("/assets/waterColorMasks/corner/0013.webp"); }
-		&14 { --wc : url("/assets/waterColorMasks/corner/0014.webp"); }
-		&15 { --wc : url("/assets/waterColorMasks/corner/0015.webp"); }
-		&16 { --wc : url("/assets/waterColorMasks/corner/0016.webp"); }
-		&17 { --wc : url("/assets/waterColorMasks/corner/0017.webp"); }
-		&18 { --wc : url("/assets/waterColorMasks/corner/0018.webp"); }
-		&19 { --wc : url("/assets/waterColorMasks/corner/0019.webp"); }
-		&20 { --wc : url("/assets/waterColorMasks/corner/0020.webp"); }
-		&21 { --wc : url("/assets/waterColorMasks/corner/0021.webp"); }
-		&22 { --wc : url("/assets/waterColorMasks/corner/0022.webp"); }
-		&23 { --wc : url("/assets/waterColorMasks/corner/0023.webp"); }
-		&24 { --wc : url("/assets/waterColorMasks/corner/0024.webp"); }
-		&25 { --wc : url("/assets/waterColorMasks/corner/0025.webp"); }
-		&26 { --wc : url("/assets/waterColorMasks/corner/0026.webp"); }
-		&27 { --wc : url("/assets/waterColorMasks/corner/0027.webp"); }
-		&28 { --wc : url("/assets/waterColorMasks/corner/0028.webp"); }
-		&29 { --wc : url("/assets/waterColorMasks/corner/0029.webp"); }
-		&30 { --wc : url("/assets/waterColorMasks/corner/0030.webp"); }
-		&31 { --wc : url("/assets/waterColorMasks/corner/0031.webp"); }
-		&32 { --wc : url("/assets/waterColorMasks/corner/0032.webp"); }
-		&33 { --wc : url("/assets/waterColorMasks/corner/0033.webp"); }
-		&34 { --wc : url("/assets/waterColorMasks/corner/0034.webp"); }
-		&35 { --wc : url("/assets/waterColorMasks/corner/0035.webp"); }
-		&36 { --wc : url("/assets/waterColorMasks/corner/0036.webp"); }
-		&37 { --wc : url("/assets/waterColorMasks/corner/0037.webp"); }
+		&1 { --wc : url('/assets/waterColorMasks/corner/0001.webp'); }
+		&2 { --wc : url('/assets/waterColorMasks/corner/0002.webp'); }
+		&3 { --wc : url('/assets/waterColorMasks/corner/0003.webp'); }
+		&4 { --wc : url('/assets/waterColorMasks/corner/0004.webp'); }
+		&5 { --wc : url('/assets/waterColorMasks/corner/0005.webp'); }
+		&6 { --wc : url('/assets/waterColorMasks/corner/0006.webp'); }
+		&7 { --wc : url('/assets/waterColorMasks/corner/0007.webp'); }
+		&8 { --wc : url('/assets/waterColorMasks/corner/0008.webp'); }
+		&9 { --wc : url('/assets/waterColorMasks/corner/0009.webp'); }
+		&10 { --wc : url('/assets/waterColorMasks/corner/0010.webp'); }
+		&11 { --wc : url('/assets/waterColorMasks/corner/0011.webp'); }
+		&12 { --wc : url('/assets/waterColorMasks/corner/0012.webp'); }
+		&13 { --wc : url('/assets/waterColorMasks/corner/0013.webp'); }
+		&14 { --wc : url('/assets/waterColorMasks/corner/0014.webp'); }
+		&15 { --wc : url('/assets/waterColorMasks/corner/0015.webp'); }
+		&16 { --wc : url('/assets/waterColorMasks/corner/0016.webp'); }
+		&17 { --wc : url('/assets/waterColorMasks/corner/0017.webp'); }
+		&18 { --wc : url('/assets/waterColorMasks/corner/0018.webp'); }
+		&19 { --wc : url('/assets/waterColorMasks/corner/0019.webp'); }
+		&20 { --wc : url('/assets/waterColorMasks/corner/0020.webp'); }
+		&21 { --wc : url('/assets/waterColorMasks/corner/0021.webp'); }
+		&22 { --wc : url('/assets/waterColorMasks/corner/0022.webp'); }
+		&23 { --wc : url('/assets/waterColorMasks/corner/0023.webp'); }
+		&24 { --wc : url('/assets/waterColorMasks/corner/0024.webp'); }
+		&25 { --wc : url('/assets/waterColorMasks/corner/0025.webp'); }
+		&26 { --wc : url('/assets/waterColorMasks/corner/0026.webp'); }
+		&27 { --wc : url('/assets/waterColorMasks/corner/0027.webp'); }
+		&28 { --wc : url('/assets/waterColorMasks/corner/0028.webp'); }
+		&29 { --wc : url('/assets/waterColorMasks/corner/0029.webp'); }
+		&30 { --wc : url('/assets/waterColorMasks/corner/0030.webp'); }
+		&31 { --wc : url('/assets/waterColorMasks/corner/0031.webp'); }
+		&32 { --wc : url('/assets/waterColorMasks/corner/0032.webp'); }
+		&33 { --wc : url('/assets/waterColorMasks/corner/0033.webp'); }
+		&34 { --wc : url('/assets/waterColorMasks/corner/0034.webp'); }
+		&35 { --wc : url('/assets/waterColorMasks/corner/0035.webp'); }
+		&36 { --wc : url('/assets/waterColorMasks/corner/0036.webp'); }
+		&37 { --wc : url('/assets/waterColorMasks/corner/0037.webp'); }
 	}
 }
 
@@ -428,17 +428,6 @@ body { counter-reset : page-numbers 0; }
 	}
 }
 
-//*****************************
-// *    BLANK LINE
-// *****************************/
-.page {
-	.blank {
-		height     : 1em;
-		margin-top : 0;
-		& + * { margin-top : 0; }
-	}
-}
-
 //*****************************
 // *         WIDE
 // *****************************/
@@ -449,6 +438,11 @@ body { counter-reset : page-numbers 0; }
 		margin-bottom       : 1em;
 		& + * { margin-top : 0; }
 	}
+	.blank {
+		height     : 1em;
+		margin-top : 0;
+		& + * { margin-top : 0; }
+	}
 }
 
 //*****************************
@@ -473,8 +467,8 @@ body { counter-reset : page-numbers 0; }
 		height           : 1.5cm;
 		margin           : 0 auto;
 		background-color : black;
-		-webkit-mask     : url("/assets/naturalCritLogoWhite.svg") center / contain no-repeat;
-		mask             : url("/assets/naturalCritLogoWhite.svg") center / contain no-repeat;
+		-webkit-mask     : url('/assets/naturalCritLogoWhite.svg') center / contain no-repeat;
+		mask             : url('/assets/naturalCritLogoWhite.svg') center / contain no-repeat;
 	}
 	.homebreweryIcon.red { background-color : red; }
 	.homebreweryIcon.gold { background-image : linear-gradient(to top left, brown 22.5%, gold 40%, white 60%, gold 67.5%, brown 82.5%); }
@@ -498,13 +492,9 @@ body { counter-reset : page-numbers 0; }
 		.pageNumber { left : 30px; }
 	}
 
-	.resetCounting {
-		counter-set : page-numbers 1;
-	}
+	.resetCounting { counter-set : page-numbers 1; }
 
-	&:not(:has(.skipCounting)) {
-		counter-increment : page-numbers;
-	}
+	&:not(:has(.skipCounting)) { counter-increment : page-numbers; }
 
 }
 
diff --git a/themes/V3/Journal/snippets.js b/themes/V3/Journal/snippets.js
index 636befb60..bad5e8e6a 100644
--- a/themes/V3/Journal/snippets.js
+++ b/themes/V3/Journal/snippets.js
@@ -1,4 +1,4 @@
-/* eslint-disable max-lines */
+
 
 module.exports = [
 ];
diff --git a/themes/V3/Journal/style.less b/themes/V3/Journal/style.less
index b8ed3ce8f..bddefb749 100644
--- a/themes/V3/Journal/style.less
+++ b/themes/V3/Journal/style.less
@@ -11,47 +11,35 @@
 	--HB_Color_WatercolorStain       : #BBAD82; // Light brown
 }
 
-.useSansSerif(){
-	font-family : PermanentMarker;
+.useSansSerif() {
+	font-family : "PermanentMarker";
 	font-size   : 0.3cm;
 	line-height : 1.2em;
 	color       : var(--HB_Color_Text2);
-	p,dl,ul,ol {
-		line-height : 1.2em;
-	}
-	ul, ol {
-		padding-left : 1em;
-	}
-	em{
-		font-style  : italic;
-	}
-	strong{
-		font-weight : 800;
+	p,dl,ul,ol { line-height : 1.2em; }
+	ul, ol { padding-left : 1em; }
+	em { font-style  : italic; }
+	strong {
 		font-size   : 1.1em;
+		font-weight : 800;
 	}
-	h5 + * {
-		margin-top : 0.1cm;
-	}
-}
-.useColumns(@multiplier : 1, @fillMode: balance){
-	column-gap           : 0.5cm;
+	h5 + * { margin-top : 0.1cm; }
 }
+.useColumns(@multiplier : 1, @fillMode: balance) { column-gap           : 0.5cm; }
 
-.page{
-	background-size     : 200% 100%;
-	background-repeat   : no-repeat;
-	filter              : drop-shadow(1px 4px 14px black);
-	background-image    : url(/assets/Journal/Background1.webp);
+.page {
 	padding             : 2.1cm 1.9cm 1.7cm 3.8cm;
-	&:nth-of-type(2n + 1) {
-		background-position : left;
-	}
+	background-image    : url("/assets/Journal/Background1.webp");
+	background-repeat   : no-repeat;
+	background-size     : 200% 100%;
+	filter              : drop-shadow(1px 4px 14px black);
+	&:nth-of-type(2n + 1) { background-position : left; }
 	&:nth-of-type(2n) {
-		background-position : right;
 		padding             : 2.1cm 3.9cm 1.7cm 1.8cm;
+		background-position : right;
 	}
 	&:nth-of-type(2) {
-		background-image    : url(/assets/Journal/Background2.webp); //Only first page should show ribbon
+		background-image    : url("/assets/Journal/Background2.webp"); //Only first page should show ribbon
 	}
 
 	& .columnWrapper {
@@ -59,167 +47,137 @@
 	}
 }
 
-	//*****************************
-	// *            BASE
+//*****************************
+// *            BASE
 	// *****************************/
-.page{
-	color       : var(--HB_Color_Text);
-	font-family : ReenieBeanie;
+.page {
+	font-family : "ReenieBeanie";
 	font-size   : 0.53cm;
 	line-height : 0.8em;
-	p + * {
-		margin-top : 0.325cm;
-	}
-	p + p{
-		margin-top : 0;
-	}
-	ul{
-		margin-bottom       : 0.8em;
-	}
-	ol{
-		margin-bottom       : 0.8em;
-	}
-	em{
+	color       : var(--HB_Color_Text);
+	p + * { margin-top : 0.325cm; }
+	p + p { margin-top : 0; }
+	ul { margin-bottom       : 0.8em; }
+	ol { margin-bottom       : 0.8em; }
+	em {
+		font-style      : unset;
 		text-decoration : underline;
-  	font-style      : unset;
-	}
-	del{
-		text-decoration-style: double;
 	}
+	del { text-decoration-style : double; }
 
 	//Indents after p or lists
-	p+p, ul+p, ol+p{
-		text-indent : 1em;
-	}
+	p + p, ul + p, ol + p { text-indent : 1em; }
 	//*****************************
 	// *           HEADERS
 	// *****************************/
-	h1,h2,h3,h4,h5{
-		font-family   : FrederickaTheGreat;
+	h1,h2,h3,h4,h5 {
+		font-family   : "FrederickaTheGreat";
 		font-weight   : unset;
 		color         : var(--HB_Color_HeaderText);
 	}
-	h1{
+	h1 {
 		margin-bottom       : 0.18cm; //Margin-bottom only because this is WIDE
 		font-size           : 0.89cm;
-		line-height         : 1em;
 		font-variant        : small-caps;
-		&+p::first-letter{
+		line-height         : 1em;
+		& + p::first-letter {
 			float                   : left;
-			font-family             : FrederickaTheGreat;
-			line-height             : 1em;
-			font-size               : 1.9em;
-			padding-left            : 40px; //Allow background color to extend into margins
-			margin-top              : -0.3cm;
-			margin-bottom           : -20px;
-			margin-left             : -40px;
-			margin-right            : 0.1em;
 			padding-top             : 0.3em;
 			padding-bottom          : 2px;
+			padding-left            : 40px; //Allow background color to extend into margins
+			margin-top              : -0.3cm;
+			margin-right            : 0.1em;
+			margin-bottom           : -20px;
+			margin-left             : -40px;
+			font-family             : "FrederickaTheGreat";
+			font-size               : 1.9em;
+			line-height             : 1em;
 		}
-		&+p::first-line{
-			font-variant : small-caps;
-		}
+		& + p::first-line { font-variant : small-caps; }
 	}
-	h2{
+	h2 {
 		font-size     : 0.62cm;
 		line-height   : 0.988em; //Font is misaligned. Shift up slightly
 	}
-	h3{
+	h3 {
+		margin-left   : -0.9em;
 		font-size     : 0.575cm;
 		line-height   : 0.995em; //Font is misaligned. Shift up slightly
-		margin-left   : -0.9em;
 	}
-	h4{
+	h4 {
+		padding-bottom : 5px;
 		font-size      : 0.55cm;
 		line-height    : 0.971em; //Font is misaligned. Shift up slightly
 		color          : var(--HB_Color_Text);
-		padding-bottom : 5px;
-		transform:rotate(0deg);
-		&:nth-of-type(2n) {
-			transform:rotate(1deg);
-		}
-		&:nth-of-type(3n) {
-			transform:rotate(-1.5deg);
-		}
+		transform      : rotate(0deg);
+		&:nth-of-type(2n) { transform : rotate(1deg); }
+		&:nth-of-type(3n) { transform : rotate(-1.5deg); }
 	}
-	h5{
-		font-family   : PermanentMarker;
+	h5 {
+		font-family   : "PermanentMarker";
 		font-size     : 0.4cm;
-		color         : var(--HB_Color_Text2);
 		font-weight   : bold;
 		line-height   : 0.951em; //Font is misaligned. Shift up slightly
-		& + * {
-			margin-top : 0.2cm;
-		}
+		color         : var(--HB_Color_Text2);
+		& + * { margin-top : 0.2cm; }
 	}
 	//*****************************
 	// *          TABLE
 	// *****************************/
-	table{
+	table {
 		.useSansSerif();
-		& + * {
-			margin-top : 0.325cm;
-		}
-		thead{
-			th{
-				vertical-align : bottom;
+		& + * { margin-top : 0.325cm; }
+		thead {
+			th {
 				padding        : 0.14em 0;
+				vertical-align : bottom;
 			}
 		}
-		tbody{
-			tr{
-				td{
-					padding : 0.14em 0;
-				}
-				&:nth-child(odd){
-					background-image : linear-gradient(to left, #41212100, #41212122, #41212100);
-				}
+		tbody {
+			tr {
+				td { padding : 0.14em 0; }
+				&:nth-child(odd) { background-image : linear-gradient(to left, #41212100, #41212122, #41212100); }
 			}
 		}
 	}
 	//*****************************
 	// *            NOTE
 	// *****************************/
-	.note{
+	.note {
 		.useSansSerif();
+		padding             : 0.2cm;
+		background-image    : url("/assets/Journal/HashMarks.png"),
+			linear-gradient(to bottom right, #FF000000, #A36A4E14, #41212100);
+		background-repeat   : no-repeat;
+		background-position : center;
+		background-size     : 120% 120%;
 		border-style        : solid;
 		border-width        : 1px;
-		border-image-source : url(/assets/Journal/Border1.png);
+		border-image-source : url("/assets/Journal/Border1.png");
 		border-image-slice  : 18 18 18 18;
 		border-image-width  : 6px 6px 6px 6px;
 		border-image-outset : 5px 5px 5px 5px;
 		border-image-repeat : stretch stretch;
-		background-image    : url(/assets/Journal/HashMarks.png),
-													linear-gradient(to bottom right, #ff000000, #a36a4e14, #41212100);
-		background-size     : 120% 120%;
-		background-repeat   : no-repeat;
-		background-position : center;
-		padding             : 0.2cm;
 		:where(&) {
 			margin-top        : 9px; //Prevent top border getting cut off on colbreak
 		}
-		& + * {
-			margin-top : 0.45cm;
-		}
-		h5 {
-			font-size : 0.375cm;
-		}
-		p{
-			padding-bottom : 0px;
-		}
-		:last-child {
-			margin-bottom : 0;
-		}
+		& + * { margin-top : 0.45cm; }
+		h5 { font-size : 0.375cm; }
+		p { padding-bottom : 0px; }
+		:last-child { margin-bottom : 0; }
 	}
 	//************************************
 	// *       DESCRIPTIVE TEXT BOX
 	// ************************************/
-	* + .descriptive {
-		margin-top : 0.6cm;
-	}
-	.descriptive{
+	* + .descriptive { margin-top : 0.6cm; }
+	.descriptive {
 		.useSansSerif();
+		padding             : 0.2cm;
+		background-image    : url("/assets/Journal/HashMarks.png"),
+			linear-gradient(to bottom right, #FF000000, #41212114, #41212100);
+		background-repeat   : no-repeat;
+		background-position : center;
+		background-size     : 120% 120%;
 		border-style        : solid;
 		border-width        : 1px;
 		border-image-source : url('/assets/Journal/Border2.png');
@@ -227,27 +185,13 @@
 		border-image-width  : 20px;
 		border-image-outset : 16px 20px 16px 20px;
 		border-image-repeat : stretch stretch;
-		background-image    : url(/assets/Journal/HashMarks.png),
-													linear-gradient(to bottom right, #ff000000, #41212114, #41212100);
-		background-size     : 120% 120%;
-		background-repeat   : no-repeat;
-		background-position : center;
-		padding             : 0.2cm;
 		:where(&) {
 			margin-top        : 4px; //Prevent top border getting cut off on colbreak
 		}
-		& + * {
-			margin-top : 0.45cm;
-		}
-		h5 {
-			font-size : 0.375cm;
-		}
-		p{
-			padding-bottom : 0px;
-		}
-		:last-child {
-			margin-bottom : 0;
-		}
+		& + * { margin-top : 0.45cm; }
+		h5 { font-size : 0.375cm; }
+		p { padding-bottom : 0px; }
+		:last-child { margin-bottom : 0; }
 	}
 	//*****************************
 	// *    Images Snippets
@@ -257,25 +201,23 @@
 	.artist {
 		position    : absolute;
 		width       : auto;
-		text-align  : center;
-		font-family : WalterTurncoat;
+		font-family : "WalterTurncoat";
 		font-size   : 0.27cm;
 		color       : var(--HB_Color_CaptionText);
+		text-align  : center;
 		p, p + p {
 			margin      : unset;
-			text-indent : unset;
 			line-height : 1em;
+			text-indent : unset;
 		}
-	 	h5 {
+		h5 {
+			font-family : "WalterTurncoat";
 			font-size   : 1.3em;
-			font-family : WalterTurncoat;
 		}
-		a{
+		a {
 			color           : inherit;
 			text-decoration : unset;
-			&:hover {
-				text-decoration : underline;
-			}
+			&:hover { text-decoration : underline; }
 		}
 	}
 
@@ -285,6 +227,10 @@
 	.monster {
 		.useSansSerif();
 		&.frame {
+			padding               : 0.2cm;
+			background-image      : url('/assets/Journal/HashMarks.png'),
+				linear-gradient(to bottom right, #FF000000, #A36A4E14, #41212100);
+			background-size       : 100%;
 			border-style          : solid;
 			border-width          : 7px 6px;
 			border-image-source   : url('/assets/Journal/Border3.png');
@@ -292,33 +238,29 @@
 			border-image-width    : 15px 20px 15px 20px;
 			border-image-outset   : 12px 12px 12px 12px;
 			border-image-repeat   : stretch round;
-			background-image      : url('/assets/Journal/HashMarks.png'),
-				                      linear-gradient(to bottom right, #ff000000, #a36a4e14, #41212100);
 			background-blend-mode : screen multiply;
-			background-size       : 100%;
-			padding               : 0.2cm;
 		}
-
-		color: var(--HB_Color_Text);
 		position          : relative;
 		padding           : 0px;
 		margin-bottom     : 0.325cm;
 
+		color             : var(--HB_Color_Text);
+
 		//Headers
-		h2{
+		h2 {
+			margin        : 0;
 			font-size     : 0.62cm;
 			line-height   : 1em;
-			margin        : 0;
-			&+p {
+			& + p {
 				margin-bottom : 0; //Monster size and type subtext
 			}
 		}
-		h3{
+		h3 {
+			padding-bottom : 0.05cm;
 			margin-left    : 0;
 			font-variant   : small-caps;
-  		padding-bottom : 0.05cm;
 		}
-		hr{
+		hr {
 			visibility       : visible;
 			height           : 6px;
 			margin           : 0.12cm 0cm;
@@ -330,24 +272,18 @@
 		}
 
 		// Monster Ability table
-		hr + table:first-of-type{
+		hr + table:first-of-type {
 			margin              : 0;
-			column-span         : none;
-		  background-image    : none;
+			color               : inherit;
+			background-image    : none;
 			border-style        : none;
 			border-image        : none;
-			color               : inherit;
-			tr {
-				background-image  : none;
-			}
-			td,th {
-				padding: 0px;
-			}
+			column-span         : none;
+			tr { background-image  : none; }
+			td,th { padding : 0px; }
 		}
 
-		:last-child {
-			margin-bottom : 0;
-		}
+		:last-child { margin-bottom : 0; }
 
 		strong, em {
 			font-style      : normal;
@@ -356,29 +292,27 @@
 	}
 
 	//Full Width
-	.monster.wide{
+	.monster.wide {
 		.useColumns(0.96, @fillMode: balance);
 	}
 
 	//*****************************
 	// *           FOOTER
 	// *****************************/
-	&:nth-child(odd){
-		.pageNumber{
-			left : 3cm;
-		}
-		.footnote{
+	&:nth-child(odd) {
+		.pageNumber { left : 3cm; }
+		.footnote {
 			left       : 4.5cm;
 			text-align : left;
 		}
 	}
-	.pageNumber{
-		font-family : FrederickaTheGreat;
+	.pageNumber {
 		right       : 3cm;
 		bottom      : 1.25cm;
+		font-family : "FrederickaTheGreat";
 		color       : var(--HB_Color_HeaderText);
 	}
-	.footnote{
+	.footnote {
 		position   : absolute;
 		right      : 4.5cm;
 		bottom     : 1.25cm;
@@ -391,154 +325,134 @@
 	//************************************
 	// *           CODE BLOCKS
 	// ************************************/
-	code{
-		font-size        : 0.3cm;
+	code {
 		padding          : 0px 4px;
-		color            : var(--HB_Color_Text);
+		font-size        : 0.3cm;
 		vertical-align   : middle;
-		background-color : #faf7ea;
+		color            : var(--HB_Color_Text);
+		background-color : #FAF7EA;
 		border-radius    : 4px;
 	}
 
-	pre code{
+	pre code {
+		padding             : 0.15cm;
+		margin-bottom       : 2px;
 		border-style        : solid;
 		border-width        : 1px;
+		border-radius       : 12px;
 		border-image        : @codeBorderImage 26 stretch;
 		border-image-width  : 10px;
 		border-image-outset : 2px;
-		border-radius       : 12px;
-		margin-bottom       : 2px;
-		padding             : 0.15cm;
 		.page :where(&) {
 			margin-top        : 2px; //Prevent top border getting cut off on colbreak
 		}
-		& + * {
-			margin-top : 0.325cm;
-		}
+		& + * { margin-top : 0.325cm; }
 	}
 	//*****************************
 	// *          EXTRAS
 	// *****************************/
-	hr{
+	hr {
 		visibility : hidden;
-		border     : none;
 		margin     : 0px;
+		border     : none;
 	}
 	//Text indent right after table
-	table+p{
-		text-indent : 1em;
-	}
+	table + p { text-indent : 1em; }
 	a, a:visited, a:hover {
-		color: var(--HB_Color_Text);
-		transition:all 1s ease;
-	}
-	a:hover {
-		color:red;
+		color      : var(--HB_Color_Text);
+		transition : all 1s ease;
 	}
+	a:hover { color : red; }
 }
 //*****************************
 // *         SPELL LIST
 // *****************************/
 
-.page .spellList{
+.page .spellList {
 	.useSansSerif();
-	font-family  : PermanentMarker;
+	font-family  : "PermanentMarker";
 	column-count : 2;
-	ul+h5{
-		margin-top : 15px;
-	}
-	ul{
-		margin-bottom               : 0.5em;
+	ul + h5 { margin-top : 15px; }
+	ul {
 		padding-left                : 1em;
+		margin-bottom               : 0.5em;
 		text-indent                 : -1em;
 		list-style-type             : none;
+		break-inside                : auto;
 		-webkit-column-break-inside : auto;
 		page-break-inside           : auto;
-		break-inside                : auto;
-	}
-	&.wide{
-		column-count : 4;
 	}
+	&.wide { column-count : 4; }
 }
 
 //*****************************
 // *       CLASS TABLE
 // *****************************/
-.page .classTable{
-	th[colspan]:not([rowspan]) {
-		white-space : nowrap;
-	}
-	h5 + table{
-		margin-top : 0.2cm;
-	}
+.page .classTable {
+	th[colspan]:not([rowspan]) { white-space : nowrap; }
+	h5 + table { margin-top : 0.2cm; }
 }
 //*****************************
 // *      TABLE OF CONTENTS
 // *****************************/
-.page .toc{
+.page .toc {
 	-webkit-column-break-inside : avoid;
 	page-break-inside           : avoid;
 	break-inside                : avoid;
 	h1 {
-		text-align    : center;
 		margin-bottom : 0.3cm;
+		text-align    : center;
 	}
-	a{
+	a {
 		display         : inline;
 		color           : inherit;
 		text-decoration : none;
-		&:hover{
-			text-decoration : underline;
-		}
+		&:hover { text-decoration : underline; }
 	}
 	h4 {
 		margin-top  : 0.2cm;
 		line-height : 0.4cm;
-		& + ul li {
-			line-height: 1.2em;
-		}
+		& + ul li { line-height : 1.2em; }
 	}
-	ul{
+	ul {
 		padding-left    : 0;
 		list-style-type : none;
 		li + li h3 {
 			margin-top  : 0.26cm;
-			line-height : 1em
-		}
-		h3 span:first-child::after {
-			border : none;
+			line-height : 1em;
 		}
+		h3 span:first-child::after { border : none; }
 		span {
 			display : table-cell;
 			&:first-child {
-				position   :       relative;
-				overflow   :       hidden;
+				position   : relative;
+				overflow   : hidden;
 				&::after {
-					content       : "";
 					position      : absolute;
 					bottom        : 0.08cm;
-					margin-left   : 0.06cm;        /* Spacing before dot leaders */
 					width         : 100%;
-					border-bottom : 0.05cm dotted #000;
+					margin-left   : 0.06cm;        /* Spacing before dot leaders */
+					content       : '';
+					border-bottom : 0.05cm dotted #000000;
 				}
 			}
 			&:last-child {
-				font-family    : ReenieBeanie;
-				font-size      : 0.34cm;
-				font-weight    : normal;
-				color          : black;
-				text-align     : right;
-				vertical-align : bottom; /* Keep page number bottom-aligned */
 				width          : 1%;
 				padding-left   : 0.06cm; /* Spacing after dot leaders */
-				/*white-space  : nowrap; /* Uncomment if needed */
+				font-family    : "ReenieBeanie";
+				font-size      : 0.34cm;
+				font-weight    : normal;
+				vertical-align : bottom; /* Keep page number bottom-aligned */
+				color          : black;
+				text-align     : right;
+				/* white-space  : nowrap; /* Uncomment if needed */
 			}
 		}
-		ul { /*List indent*/
+		ul { /* List indent */
 			margin-left : 1em;
 		}
 	}
-	&.wide{
+	&.wide {
 		.useColumns(0.96, @fillMode: balance);
 	}
 }
@@ -546,6 +460,4 @@
 //*****************************
 // *         WIDE
 // *****************************/
-.page .wide {
-	margin-bottom       : 0.45cm;
-}
+.page .wide { margin-bottom       : 0.45cm; }
diff --git a/themes/codeMirror/customEditorStyles.less b/themes/codeMirror/customEditorStyles.less
index 367eaec33..8c48c1b43 100644
--- a/themes/codeMirror/customEditorStyles.less
+++ b/themes/codeMirror/customEditorStyles.less
@@ -1,88 +1,83 @@
 .editor .codeEditor .CodeMirror {
-    // Themes with dark backgrounds
-    &.cm-s-3024-night,
-    &.cm-s-abbott,
-    &.cm-s-abcdef,
-    &.cm-s-ambiance,
-    &.cm-s-ayu-dark,
-    &.cm-s-ayu-mirage,
-    &.cm-s-base16-dark,
-    &.cm-s-bespin,
-    &.cm-s-blackboard,
-    &.cm-s-cobalt,
-    &.cm-s-colorforth,
-    &.cm-s-darcula,
-    &.cm-s-dracula,
-    &.cm-s-duotone-dark,
-    &.cm-s-erlang-dark,
-    &.cm-s-gruvbox-dark,
-    &.cm-s-hopscotch,
-    &.cm-s-icecoder,
-    &.cm-s-isotope,
-    &.cm-s-lesser-dark,
-    &.cm-s-liquibyte,
-    &.cm-s-lucario,
-    &.cm-s-material,
-    &.cm-s-material-darker,
-    &.cm-s-material-ocean,
-    &.cm-s-material-palenight,
-    &.cm-s-mbo,
-    &.cm-s-midnight,
-    &.cm-s-monokai,
-    &.cm-s-moxer,
-    &.cm-s-night,
-    &.cm-s-nord,
-    &.cm-s-oceanic-next,
-    &.cm-s-panda-syntax,
-    &.cm-s-paraiso-dark,
-    &.cm-s-pastel-on-dark,
-    &.cm-s-railscasts,
-    &.cm-s-rubyblue,
-    &.cm-s-seti,
-    &.cm-s-shadowfox,
-    &.cm-s-the-matrix,
-    &.cm-s-tomorrow-night-bright,
-    &.cm-s-tomorrow-night-eighties,
-    &.cm-s-twilight,
-    &.cm-s-vibrant-ink,
-    &.cm-s-xq-dark,
-    &.cm-s-yonce,
-    &.cm-s-zenburn
-     {
-        .CodeMirror-code {
-            .block:not(.cm-comment) {
-                color: magenta;
-            }
-            .columnSplit {
-                color: black;
-                background-color: rgba(35,153,153,0.5);
-            }
-            .pageLine {
-                background-color: rgba(255,255,255,0.5);
-                & ~ pre.CodeMirror-line {
-                    color: black;
-                }
-            }
-        }
-    }
-    // Themes with light backgrounds
-    &.cm-s-default,
-    &.cm-s-3024-day,
-    &.cm-s-ambiance-mobile,
-    &.cm-s-base16-light,
-    &.cm-s-duotone-light,
-    &.cm-s-eclipse,
-    &.cm-s-elegant,
-    &.cm-s-juejin,
-    &.cm-s-neat,
-    &.cm-s-neo,
-    &.cm-s-paraiso-lightm
-    &.cm-s-solarized,
-    &.cm-s-ssms,
-    &.cm-s-ttcn,
-    &.cm-s-xq-light,
-    &.cm-s-yeti {
-        // Future styling for themes with light backgrounds
-        --dummyVar: 'currently unused';
-    }
+	// Themes with dark backgrounds
+	&.cm-s-3024-night,
+	&.cm-s-abbott,
+	&.cm-s-abcdef,
+	&.cm-s-ambiance,
+	&.cm-s-ayu-dark,
+	&.cm-s-ayu-mirage,
+	&.cm-s-base16-dark,
+	&.cm-s-bespin,
+	&.cm-s-blackboard,
+	&.cm-s-cobalt,
+	&.cm-s-colorforth,
+	&.cm-s-darcula,
+	&.cm-s-dracula,
+	&.cm-s-duotone-dark,
+	&.cm-s-erlang-dark,
+	&.cm-s-gruvbox-dark,
+	&.cm-s-hopscotch,
+	&.cm-s-icecoder,
+	&.cm-s-isotope,
+	&.cm-s-lesser-dark,
+	&.cm-s-liquibyte,
+	&.cm-s-lucario,
+	&.cm-s-material,
+	&.cm-s-material-darker,
+	&.cm-s-material-ocean,
+	&.cm-s-material-palenight,
+	&.cm-s-mbo,
+	&.cm-s-midnight,
+	&.cm-s-monokai,
+	&.cm-s-moxer,
+	&.cm-s-night,
+	&.cm-s-nord,
+	&.cm-s-oceanic-next,
+	&.cm-s-panda-syntax,
+	&.cm-s-paraiso-dark,
+	&.cm-s-pastel-on-dark,
+	&.cm-s-railscasts,
+	&.cm-s-rubyblue,
+	&.cm-s-seti,
+	&.cm-s-shadowfox,
+	&.cm-s-the-matrix,
+	&.cm-s-tomorrow-night-bright,
+	&.cm-s-tomorrow-night-eighties,
+	&.cm-s-twilight,
+	&.cm-s-vibrant-ink,
+	&.cm-s-xq-dark,
+	&.cm-s-yonce,
+	&.cm-s-zenburn {
+		.CodeMirror-code {
+			.block:not(.cm-comment) { color : magenta; }
+			.columnSplit {
+				color            : black;
+				background-color : rgba(35,153,153,0.5);
+			}
+			.pageLine {
+				background-color : rgba(255,255,255,0.5);
+				& ~ pre.CodeMirror-line { color : black; }
+			}
+		}
+	}
+	// Themes with light backgrounds
+	&.cm-s-default,
+	&.cm-s-3024-day,
+	&.cm-s-ambiance-mobile,
+	&.cm-s-base16-light,
+	&.cm-s-duotone-light,
+	&.cm-s-eclipse,
+	&.cm-s-elegant,
+	&.cm-s-juejin,
+	&.cm-s-neat,
+	&.cm-s-neo,
+	&.cm-s-paraiso-lightm
+	&.cm-s-solarized,
+	&.cm-s-ssms,
+	&.cm-s-ttcn,
+	&.cm-s-xq-light,
+	&.cm-s-yeti {
+		// Future styling for themes with light backgrounds
+		--dummyVar : 'currently unused';
+	}
 }
diff --git a/themes/fonts/5e legacy/fonts.less b/themes/fonts/5e legacy/fonts.less
index d4c10c456..680e395ec 100644
--- a/themes/fonts/5e legacy/fonts.less	
+++ b/themes/fonts/5e legacy/fonts.less	
@@ -1,61 +1,61 @@
 /* Main Font, serif */
 @font-face {
-	font-family: BookSanity;
-	src: url('../../../fonts/5e legacy/Bookinsanity.woff2');
-	font-weight: normal;
-	font-style: normal;
+	font-family : "BookSanity";
+	font-style : normal;
+	font-weight : normal;
+	src : url('../../../fonts/5e legacy/Bookinsanity.woff2');
 }
 @font-face {
-	font-family: BookSanity;
-	src: url('../../../fonts/5e legacy/Bookinsanity Bold.woff2');
-	font-weight: bold;
-	font-style: normal;
+	font-family : "BookSanity";
+	font-style : normal;
+	font-weight : bold;
+	src : url('../../../fonts/5e legacy/Bookinsanity Bold.woff2');
 }
 @font-face {
-	font-family: BookSanity;
-	src: url('../../../fonts/5e legacy/Bookinsanity Italic.woff2');
-	font-weight: normal;
-	font-style: italic;
+	font-family : "BookSanity";
+	font-style : italic;
+	font-weight : normal;
+	src : url('../../../fonts/5e legacy/Bookinsanity Italic.woff2');
 }
 @font-face {
-	font-family: BookSanity;
-	src: url('../../../fonts/5e legacy/Bookinsanity Bold Italic.woff2');
-	font-weight: bold;
-	font-style: italic;
+	font-family : "BookSanity";
+	font-style : italic;
+	font-weight : bold;
+	src : url('../../../fonts/5e legacy/Bookinsanity Bold Italic.woff2');
 }
 
 /* Notes and Tables, sans-serif */
 @font-face {
-	font-family: ScalySans;
-	src: url('../../../fonts/5e legacy/Scaly Sans.woff2');
-	font-weight: normal;
-	font-style: normal;
+	font-family : "ScalySans";
+	font-style : normal;
+	font-weight : normal;
+	src : url('../../../fonts/5e legacy/Scaly Sans.woff2');
 }
 @font-face {
-	font-family: ScalySansSmallCaps;
-	src: url('../../../fonts/5e legacy/Scaly Sans Caps.woff2');
-	font-weight: normal;
-	font-style: normal;
+	font-family : "ScalySansSmallCaps";
+	font-style : normal;
+	font-weight : normal;
+	src : url('../../../fonts/5e legacy/Scaly Sans Caps.woff2');
 }
 @font-face {
-	font-family: WalterTurncoat;
-	src: url('../../../fonts/5e legacy/WalterTurncoat-Regular.woff2');
-	font-weight: normal;
-	font-style: normal;
+	font-family : "WalterTurncoat";
+	font-style : normal;
+	font-weight : normal;
+	src : url('../../../fonts/5e legacy/WalterTurncoat-Regular.woff2');
 }
 
 /* Headers */
 @font-face {
-	font-family: MrJeeves;
-	src: url('../../../fonts/5e legacy/Mr Eaves Small Caps.woff2');
-	font-weight: normal;
-	font-style: normal;
+	font-family : "MrJeeves";
+	font-style : normal;
+	font-weight : normal;
+	src : url('../../../fonts/5e legacy/Mr Eaves Small Caps.woff2');
 }
 
 /* Fancy Drop Cap */
 @font-face {
-	font-family: Solberry;
-	src: url('../../../fonts/5e legacy/Solbera Imitation.woff2');
-	font-weight: normal;
-	font-style: normal;
+	font-family : "Solberry";
+	font-style : normal;
+	font-weight : normal;
+	src : url('../../../fonts/5e legacy/Solbera Imitation.woff2');
 }
diff --git a/themes/fonts/5e/fonts.less b/themes/fonts/5e/fonts.less
index c028b06f9..eec5c418f 100644
--- a/themes/fonts/5e/fonts.less
+++ b/themes/fonts/5e/fonts.less
@@ -1,143 +1,143 @@
 /* Main Font, serif */
 @font-face {
-	font-family: BookInsanityRemake;
-	src: url('../../../fonts/5e/Bookinsanity.woff2');
-	font-weight: normal;
-	font-style: normal;
+	font-family : "BookInsanityRemake";
+	font-style : normal;
+	font-weight : normal;
+	src : url('../../../fonts/5e/Bookinsanity.woff2');
 }
 @font-face {
-	font-family: BookInsanityRemake;
-	src: url('../../../fonts/5e/Bookinsanity Bold.woff2');
-	font-weight: bold;
-	font-style: normal;
+	font-family : "BookInsanityRemake";
+	font-style : normal;
+	font-weight : bold;
+	src : url('../../../fonts/5e/Bookinsanity Bold.woff2');
 }
 @font-face {
-	font-family: BookInsanityRemake;
-	src: url('../../../fonts/5e/Bookinsanity Italic.woff2');
-	font-weight: normal;
-	font-style: italic;
+	font-family : "BookInsanityRemake";
+	font-style : italic;
+	font-weight : normal;
+	src : url('../../../fonts/5e/Bookinsanity Italic.woff2');
 }
 @font-face {
-	font-family: BookInsanityRemake;
-	src: url('../../../fonts/5e/Bookinsanity Bold Italic.woff2');
-	font-weight: bold;
-	font-style: italic;
+	font-family : "BookInsanityRemake";
+	font-style : italic;
+	font-weight : bold;
+	src : url('../../../fonts/5e/Bookinsanity Bold Italic.woff2');
 }
 
 /* Notes and Tables, sans-serif */
 @font-face {
-	font-family: ScalySansRemake;
-	src: url('../../../fonts/5e/Scaly Sans.woff2');
-	font-weight: normal;
-	font-style: normal;
+	font-family : "ScalySansRemake";
+	font-style : normal;
+	font-weight : normal;
+	src : url('../../../fonts/5e/Scaly Sans.woff2');
 }
 @font-face {
-	font-family: ScalySansRemake;
-	src: url('../../../fonts/5e/Scaly Sans Bold.woff2');
-	font-weight: bold;
-	font-style: normal;
+	font-family : "ScalySansRemake";
+	font-style : normal;
+	font-weight : bold;
+	src : url('../../../fonts/5e/Scaly Sans Bold.woff2');
 }
 @font-face {
-	font-family: ScalySansRemake;
-	src: url('../../../fonts/5e/Scaly Sans Italic.woff2');
-	font-weight: normal;
-	font-style: italic;
+	font-family : "ScalySansRemake";
+	font-style : italic;
+	font-weight : normal;
+	src : url('../../../fonts/5e/Scaly Sans Italic.woff2');
 }
 @font-face {
-	font-family: ScalySansRemake;
-	src: url('../../../fonts/5e/Scaly Sans Bold Italic.woff2');
-	font-weight: bold;
-	font-style: italic;
+	font-family : "ScalySansRemake";
+	font-style : italic;
+	font-weight : bold;
+	src : url('../../../fonts/5e/Scaly Sans Bold Italic.woff2');
 }
 @font-face {
-	font-family: ScalySansSmallCapsRemake;
-	src: url('../../../fonts/5e/Scaly Sans Caps.woff2');
-	font-weight: normal;
-	font-style: normal;
+	font-family : "ScalySansSmallCapsRemake";
+	font-style : normal;
+	font-weight : normal;
+	src : url('../../../fonts/5e/Scaly Sans Caps.woff2');
 }
 @font-face {
-	font-family: WalterTurncoat;
-	src: url('../../../fonts/5e/WalterTurncoat-Regular.woff2');
-	font-weight: normal;
-	font-style: normal;
+	font-family : "WalterTurncoat";
+	font-style : normal;
+	font-weight : normal;
+	src : url('../../../fonts/5e/WalterTurncoat-Regular.woff2');
 }
 
 /* Headers */
 @font-face {
-	font-family: MrEavesRemake;
-	src: url('../../../fonts/5e/Mr Eaves Small Caps.woff2');
-	font-weight: normal;
-	font-style: normal;
+	font-family : "MrEavesRemake";
+	font-style : normal;
+	font-weight : normal;
+	src : url('../../../fonts/5e/Mr Eaves Small Caps.woff2');
 }
 
 /* Fancy Drop Cap */
 @font-face {
-	font-family: SolberaImitationRemake; //Tweaked 5e version
-	src: url('../../../fonts/5e/Solbera Imitation Tweak.woff2');
-	font-weight: 100 1000;
-	font-style: normal;
-	font-style: italic;
+	font-family : "SolberaImitationRemake"; //Tweaked 5e version
+	font-style : normal;
+	font-style : italic;
+	font-weight : 100 1000;
+	src : url('../../../fonts/5e/Solbera Imitation Tweak.woff2');
 }
 
 /* Cover Page */
 @font-face {
-	font-family: NodestoCapsCondensed;
-	src: url('../../../fonts/5e/Nodesto Caps Condensed.woff2');
-	font-weight: normal;
-	font-style: normal;
+	font-family : "NodestoCapsCondensed";
+	font-style : normal;
+	font-weight : normal;
+	src : url('../../../fonts/5e/Nodesto Caps Condensed.woff2');
 }
 
 @font-face {
-	font-family: NodestoCapsCondensed;
-	src: url('../../../fonts/5e/Nodesto Caps Condensed Bold.woff2');
-	font-weight: bold;
-	font-style: normal;
+	font-family : "NodestoCapsCondensed";
+	font-style : normal;
+	font-weight : bold;
+	src : url('../../../fonts/5e/Nodesto Caps Condensed Bold.woff2');
 }
 
 @font-face {
-	font-family: NodestoCapsCondensed;
-	src: url('../../../fonts/5e/Nodesto Caps Condensed Italic.woff2');
-	font-weight: normal;
-	font-style: italic;
+	font-family : "NodestoCapsCondensed";
+	font-style : italic;
+	font-weight : normal;
+	src : url('../../../fonts/5e/Nodesto Caps Condensed Italic.woff2');
 }
 
 @font-face {
-	font-family: NodestoCapsCondensed;
-	src: url('../../../fonts/5e/Nodesto Caps Condensed Bold Italic.woff2');
-	font-weight: bold;
-	font-style: italic;
+	font-family : "NodestoCapsCondensed";
+	font-style : italic;
+	font-weight : bold;
+	src : url('../../../fonts/5e/Nodesto Caps Condensed Bold Italic.woff2');
 }
 
 @font-face {
-	font-family: NodestoCapsWide;
-	src: url('../../../fonts/5e/Nodesto Caps Wide.woff2');
-	font-weight: normal;
-	font-style: normal
+	font-family : "NodestoCapsWide";
+	font-style : normal;
+	font-weight : normal;
+	src : url('../../../fonts/5e/Nodesto Caps Wide.woff2');
 }
 
 @font-face {
-	font-family: Overpass;
-	src: url('../../../fonts/5e/Overpass Medium.woff2');
-	font-weight: 500;
-	font-style: normal;
+	font-family : "Overpass";
+	font-style : normal;
+	font-weight : 500;
+	src : url('../../../fonts/5e/Overpass Medium.woff2');
 }
 
 @font-face {
-	font-family: Davek;
-	src: url('../../../fonts/5e/Davek.woff2');
-	font-weight: 500;
-	font-style: normal;
+	font-family : "Davek";
+	font-style : normal;
+	font-weight : 500;
+	src : url('../../../fonts/5e/Davek.woff2');
 }
 
 @font-face {
-	font-family: Iokharic;
-	src: url('../../../fonts/5e/Iokharic.woff2');
-	font-weight: 500;
-	font-style: normal;
+	font-family : "Iokharic";
+	font-style : normal;
+	font-weight : 500;
+	src : url('../../../fonts/5e/Iokharic.woff2');
 }
 @font-face {
-	font-family: Rellanic;
-	src: url('../../../fonts/5e/Rellanic.woff2');
-	font-weight: 500;
-	font-style: normal;
+	font-family : "Rellanic";
+	font-style : normal;
+	font-weight : 500;
+	src : url('../../../fonts/5e/Rellanic.woff2');
 }
diff --git a/themes/fonts/Blank/fonts.less b/themes/fonts/Blank/fonts.less
index 4a3d2d1e8..6558c84b4 100644
--- a/themes/fonts/Blank/fonts.less
+++ b/themes/fonts/Blank/fonts.less
@@ -18,29 +18,29 @@ License:
 */
 
 @font-face {
-	font-family: Pagella;
-	src: url('../../../fonts/Blank/texgyrepagella-regular.woff2');
-	font-weight: normal;
-	font-style: normal;
+	font-family : "Pagella";
+	font-style : normal;
+	font-weight : normal;
+	src : url('../../../fonts/Blank/texgyrepagella-regular.woff2');
 }
 
 @font-face {
-	font-family: Pagella;
-	src: url('../../../fonts/Blank/texgyrepagella-bold.woff2');
-	font-weight: bold;
-	font-style: normal;
+	font-family : "Pagella";
+	font-style : normal;
+	font-weight : bold;
+	src : url('../../../fonts/Blank/texgyrepagella-bold.woff2');
 }
 
 @font-face {
-	font-family: Pagella;
-	src: url('../../../fonts/Blank/texgyrepagella-italic.woff2');
-	font-weight: normal;
-	font-style: italic;
+	font-family : "Pagella";
+	font-style : italic;
+	font-weight : normal;
+	src : url('../../../fonts/Blank/texgyrepagella-italic.woff2');
 }
 
 @font-face {
-	font-family: Pagella;
-	src: url('../../../fonts/Blank/texgyrepagella-bolditalic.woff2');
-	font-weight: bold;
-	font-style: italic;
+	font-family : "Pagella";
+	font-style : italic;
+	font-weight : bold;
+	src : url('../../../fonts/Blank/texgyrepagella-bolditalic.woff2');
 }
diff --git a/themes/fonts/Journal/fonts.less b/themes/fonts/Journal/fonts.less
index 703b594ba..20190c651 100644
--- a/themes/fonts/Journal/fonts.less
+++ b/themes/fonts/Journal/fonts.less
@@ -1,58 +1,58 @@
 /* Main Font, serif */
 @font-face {
-	font-family: ReenieBeanie;
-	src: url('../../../fonts/Journal/ReenieBeanie-Regular.woff2');
-	font-weight: normal;
-	font-style: normal;
+	font-family : "ReenieBeanie";
+	font-style : normal;
+	font-weight : normal;
+	src : url('../../../fonts/Journal/ReenieBeanie-Regular.woff2');
 }
 
 /* Notes and Tables, sans-serif */
 @font-face {
-	font-family: PermanentMarker;
-	src: url('../../../fonts/Journal/PermanentMarker-Regular.woff2');
-	font-weight: normal;
-	font-style: normal;
+	font-family : "PermanentMarker";
+	font-style : normal;
+	font-weight : normal;
+	src : url('../../../fonts/Journal/PermanentMarker-Regular.woff2');
 }
 @font-face {
-	font-family: WalterTurncoat;
-	src: url('../../../fonts/5e/WalterTurncoat-Regular.woff2');
-	font-weight: normal;
-	font-style: normal;
+	font-family : "WalterTurncoat";
+	font-style : normal;
+	font-weight : normal;
+	src : url('../../../fonts/5e/WalterTurncoat-Regular.woff2');
 }
 
 /* Headers */
 @font-face {
-	font-family: FrederickaTheGreat;
-	src: url('../../../fonts/Journal/FrederickaTheGreat-Regular.woff2');
-	font-weight: normal;
-	font-style: normal;
+	font-family : "FrederickaTheGreat";
+	font-style : normal;
+	font-weight : normal;
+	src : url('../../../fonts/Journal/FrederickaTheGreat-Regular.woff2');
 }
 
 /* Cover Page */
 @font-face {
-	font-family: NodestoCapsCondensed;
-	src: url('../fonts/5e/Nodesto Caps Condensed.woff2');
-	font-weight: normal;
-	font-style: normal;
+	font-family : "NodestoCapsCondensed";
+	font-style : normal;
+	font-weight : normal;
+	src : url('../fonts/5e/Nodesto Caps Condensed.woff2');
 }
 
 @font-face {
-	font-family: NodestoCapsCondensed;
-	src: url('../fonts/5e/Nodesto Caps Condensed Bold.woff2');
-	font-weight: bold;
-	font-style: normal;
+	font-family : "NodestoCapsCondensed";
+	font-style : normal;
+	font-weight : bold;
+	src : url('../fonts/5e/Nodesto Caps Condensed Bold.woff2');
 }
 
 @font-face {
-	font-family: NodestoCapsCondensed;
-	src: url('../fonts/5e/Nodesto Caps Condensed Italic.woff2');
-	font-weight: normal;
-	font-style: italic;
+	font-family : "NodestoCapsCondensed";
+	font-style : italic;
+	font-weight : normal;
+	src : url('../fonts/5e/Nodesto Caps Condensed Italic.woff2');
 }
 
 @font-face {
-	font-family: NodestoCapsCondensed;
-	src: url('../fonts/5e/Nodesto Caps Condensed Bold Italic.woff2');
-	font-weight: bold;
-	font-style: italic;
+	font-family : "NodestoCapsCondensed";
+	font-style : italic;
+	font-weight : bold;
+	src : url('../fonts/5e/Nodesto Caps Condensed Bold Italic.woff2');
 }
diff --git a/themes/fonts/iconFonts/diceFont.less b/themes/fonts/iconFonts/diceFont.less
index ec80f132b..3b60093d0 100644
--- a/themes/fonts/iconFonts/diceFont.less
+++ b/themes/fonts/iconFonts/diceFont.less
@@ -13,8 +13,8 @@
 	font-weight             : normal;
 	font-variant            : normal;
 	line-height             : 1;
-	text-decoration         : inherit;
 	text-transform          : none;
+	text-decoration         : inherit;
 	text-rendering          : optimizeLegibility;
 	
 	/* Better Font Rendering =========== */
diff --git a/themes/fonts/iconFonts/fontAwesome.js b/themes/fonts/iconFonts/fontAwesome.js
index f5f89e3aa..bf11a7c92 100644
--- a/themes/fonts/iconFonts/fontAwesome.js
+++ b/themes/fonts/iconFonts/fontAwesome.js
@@ -1,3 +1,5 @@
+/* eslint-disable max-lines */
+
 const fontAwesome = {
 	// FONT-AWESOME SOLID
 	'fas_0'                                      : 'fas fa-0',
diff --git a/themes/phb.depricated.less b/themes/phb.depricated.less
index 992dab35b..7cc574183 100644
--- a/themes/phb.depricated.less
+++ b/themes/phb.depricated.less
@@ -1,31 +1,31 @@
-.phb{
+.phb {
 	//Double hr for full width elements
-	hr+hr+blockquote{
-		column-span         : all;
+	hr + hr + blockquote {
 		-webkit-column-span : all;
 		-moz-column-span    : all;
+		column-span         : all;
 	}
 
 	//*****************************
 	// *      CLASS TABLE
 	// *****************************/
-	hr+table{
+	hr+table {
+		padding-top         : 10px;
 		margin-top          : -5px;
 		margin-bottom       : 50px;
-		padding-top         : 10px;
 		border-collapse     : separate;
 		background-color    : white;
 		border              : initial;
 		border-style        : solid;
+		border-image-source : @frameBorderImage;
+		border-image-slice  : 150 200 150 200;
+		border-image-width  : 47px;
 		border-image-outset : 37px 17px;
 		border-image-repeat : round;
-		border-image-slice  : 150 200 150 200;
-		border-image-source : @frameBorderImage;
-		border-image-width  : 47px;
 	}
-	h5+hr+table{
-		column-span         : all;
+	h5 + hr + table {
 		-webkit-column-span : all;
 		-moz-column-span    : all;
+		column-span         : all;
 	}
 }
\ No newline at end of file