diff --git a/devNotes/twine CSS b/devNotes/twine CSS
deleted file mode 100644
index 2ae27eb75df04d029932743b01b5911a77cb9036..0000000000000000000000000000000000000000
--- a/devNotes/twine CSS	
+++ /dev/null
@@ -1,711 +0,0 @@
-body {
-	overflow-x: hidden;
-}
-
-/* makes HR colorflip compatible */
-hr {
-	background:#ccc;
-	border:0;
-}
-
-/* clears SugarCube's default transition */
-.passage {
-	transition: none;
-	-webkit-transition: none;
-}
-
-.passage-in {
-	opacity: 1 !important;
-}
-
-/* default is 54em */
-#passages {
-	max-width: 100%;
-}
-
-/* small trick to hide broken images */
-img {
-	text-indent: -10000px;
-}
-
-.imageColumn { /* TODO: this is mostly a copy of imageRef to get its flex features working properly. They can probably be removed from imageRef at some point */
-	display: flex;
-	flex-direction: column;
-	flex-wrap: wrap;
-	align-items: flex-start;
-	position: relative;
-	float: right;
-}
-
-.imageRef {
-	display: flex;
-	flex-direction: column;
-	flex-wrap: wrap;
-	align-items: flex-start;
-	position: relative;
-	background-color: rgba(80, 80, 80, 0.5);
-	margin: 2px;
-}
-
-.tinyImg {
-	height: 120px;
-	width: 120px;
-	float: left;
-}
-
-.smlImg {
-	height: 150px;
-	width: 150px;
-	float: left;
-}
-
-.smlImg > img, .smlImg > video {
-	height: auto;
-}
-
-.medImg {
-	height: 300px;
-	width: 300px;
-	float: right;
-}
-
-.medImg > img, .medImg > video {
-	height: auto;
-}
-
-.lrgRender {
-	height: 531px;
-	width: 531px;
-	margin-right: -50px;
-	margin-left: -50px;
-	float: right;
-	z-index: -1;
-}
-
-.lrgVector {
-	height: 600px;
-	width: 600px;
-	margin-right: -125px;
-	margin-left: -125px;
-	float: right;
-	z-index: -1;
-}
-
-.lrgRender > div.mask {
-	width: 150px;
-	height: 100%;
-	background: linear-gradient(90deg, rgba(17,17,17,1), rgba(17,17,17,0.8) 60%, rgba(17,17,17,0));
-	z-index: 1;
-	/*position: absolute;*/
-}
-
-.lrgRender > img, .lrgRender > video {
-	margin-left: -150px;
-	height: 531px;
-	width: auto;
-}
-
-.lrgVector > div.mask {
-	width: 150px;
-	height: 100%;
-	background: linear-gradient(90deg, rgba(17,17,17,1), rgba(17,17,17,0.8) 60%, rgba(17,17,17,0));
-	z-index: 1;
-}
-
-.lrgVector > img, .lrgVector > video {
-	margin-left: -150px;
-	height: 600px;
-	width: auto;
-}
-
-.lrgVector svg {
-	width: 336px;
-}
-
-object {
-	object-fit: scale-down;
-	position: absolute;
-	top: 0;
-	left: 0;
-}
-
-img.paperdoll {
-	position: absolute;
-	top: 0;
-	left: 0;
-	margin-left: 0;
-}
-
-span.plusButton {
-	display: inline-block;
-	line-height: 25px;
-	width: 20px;
-	text-align: center;
-	border: 1px solid rgba(0, 139, 0, 0.3);
-	background: rgba(0, 139, 0, 0.2);
-	margin: 2px 0;
-}
-
-span.minusButton {
-	display: inline-block;
-	line-height: 25px;
-	width: 20px;
-	text-align: center;
-	border: 1px solid rgba(184, 0, 0, 0.3);
-	background: rgba(184, 0, 0, 0.2);
-	margin: 2px 0;
-}
-
-span.zeroButton {
-	display: inline-block;
-	line-height: 25px;
-	width: 20px;
-	text-align: center;
-	border: 1px solid rgba(0, 0, 255, 0.3);
-	background: rgba(0, 0, 255, 0.2);
-	margin: 2px 0;
-}
-
-span.plusButton:hover { background: rgba(0, 139, 0, 0.4); }
-span.minusButton:hover { background: rgba(184, 0, 0, 0.4); }
-span.zeroButton:hover { background: rgba(0, 0, 255, 0.4); }
-
-span.plusButton > a { display: block; }
-span.minusButton > a { display: block; }
-span.zeroButton > a { display: block; }
-
-span.plusButton > a:hover { text-decoration: none; }
-span.minusButton > a:hover { text-decoration: none; }
-span.zeroButton > a:hover { text-decoration: none; }
-
-/* Colors are made as css classes, to allow them to be changed for a light color scheme (for example). */
-.link { color: #68D } /* link color */
-.aquamarine { color: aquamarine }
-.coral { color: coral }
-.cyan { color: cyan }
-.darkgoldenrod { color: darkgoldenrod }
-.darkred { color: darkred }
-.darkviolet { color: darkviolet }
-.deeppink { color: deeppink }
-.steelblue { color: steelblue }
-.deepskyblue { color: deepskyblue }
-.dodgerblue { color: dodgerblue }
-.blue { color: blue }
-.gold { color: gold }
-.goldenrod { color: goldenrod }
-.gray { color: gray }
-.green { color: green }
-.hotpink { color: hotpink }
-.lawngreen { color: lawngreen }
-.lightblue { color: lightblue }
-.lightcoral { color: lightcoral }
-.lightgreen { color: lightgreen }
-.lightpink { color: lightpink }
-.lightsalmon { color: lightsalmon }
-.lime { color: lime }
-.limegreen { color: limegreen }
-.magenta { color: magenta }
-.mediumaquamarine { color: mediumaquamarine }
-.mediumorchid { color: mediumorchid }
-.mediumseagreen { color: mediumseagreen }
-.orange { color: orange }
-.orangered { color: orangered }
-.orchid { color: orchid }
-.pink { color: pink }
-.red { color: red }
-.seagreen { color: seagreen }
-.springgreen { color: springgreen }
-.tan { color: tan }
-.chocolate { color: chocolate }
-.saddlebrown { color: saddlebrown }
-.teal { color: teal }
-.yellow { color: yellow }
-.yellowgreen { color: yellowgreen }
-
-.link a { color: #68D } /* link color */
-.aquamarine a { color: aquamarine }
-.coral a { color: coral }
-.cyan a { color: cyan }
-.darkgoldenrod a { color: darkgoldenrod }
-.darkred a { color: darkred }
-.darkviolet a { color: darkviolet }
-.deeppink a { color: deeppink }
-.steelblue a { color: steelblue }
-.deepskyblue a { color: deepskyblue }
-.dodgerblue a { color: dodgerblue }
-.blue a { color: blue }
-.gold a { color: gold }
-.goldenrod a { color: goldenrod }
-.gray a { color: gray }
-.green a { color: green }
-.hotpink a { color: hotpink }
-.lawngreen a { color: lawngreen }
-.lightblue a { color: lightblue }
-.lightcoral a { color: lightcoral }
-.lightgreen a { color: lightgreen }
-.lightpink a { color: lightpink }
-.lightsalmon a { color: lightsalmon }
-.lime a { color: lime }
-.limegreen a { color: limegreen }
-.magenta a { color: magenta }
-.mediumaquamarine a { color: mediumaquamarine }
-.mediumorchid a { color: mediumorchid }
-.mediumseagreen a { color: mediumseagreen }
-.orange a { color: orange }
-.orangered a { color: orangered }
-.orchid a { color: orchid }
-.pink a { color: pink }
-.red a { color: red }
-.seagreen a { color: seagreen }
-.springgreen a { color: springgreen }
-.tan a { color: tan }
-.chocolate a { color: chocolate }
-.saddlebrown a { color: saddlebrown }
-.teal a { color: teal }
-.yellow a { color: yellow }
-.yellowgreen a { color: yellowgreen }
-
-/*! <<checkvars>> macro for SugarCube 2.x */
-#ui-dialog-body.checkvars{padding:1em}#ui-dialog-body.checkvars h1{font-size:1em;margin-top:0}#ui-dialog-body.checkvars table{border-collapse:collapse;border-spacing:0}#ui-dialog-body.checkvars thead tr{border-bottom:2px solid #444}#ui-dialog-body.checkvars tr:not(:first-child){border-top:1px solid #444}#ui-dialog-body.checkvars td,#ui-dialog-body.checkvars th{padding:.25em 1em}#ui-dialog-body.checkvars td:first-child,#ui-dialog-body.checkvars th:first-child{padding-left:.5em;border-right:1px solid #444}#ui-dialog-body.checkvars td:last-child,#ui-dialog-body.checkvars th:last-child{padding-right:.5em}#ui-dialog-body.checkvars th:first-child{text-align:center}#ui-dialog-body.checkvars td:first-child{font-weight:700;text-align:right}#ui-dialog-body.checkvars td{font-family:monospace,monospace;vertical-align:top;white-space:pre-wrap}#ui-dialog-body.checkvars .scroll-pad{margin:0;padding:0}
-
-/*! <<bugreport>> macro for SugarCube 2.x */
-#ui-dialog-body.bugreport #bugreport-info{margin-bottom:1em}#ui-dialog-body.bugreport #bugreport-data{display:block;overflow:auto;font-family:monospace,monospace;background-color:transparent;border:1px solid #444;margin:0;padding:6px;height:auto;min-height:200px;white-space:normal}#ui-dialog-body.bugreport .scroll-pad{margin:0;padding:0}
-
-div.output{
-width: 100%;
-width: 100vw;
-max-width: 100%;
-word-break: break-all;
-white-space: normal;
-}
-/* css rules for rules assistant */
-.rajs-listitem {
-	display: inline-block;
-	color: #68D;
-	margin-right: 1em;
-}
-.rajs-listitem:last-of-type { margin-right: 0; }
-.rajs-listitem:hover {
-	cursor: pointer;
-	text-decoration: underline;
-}
-.rajs-list strong:first-of-type, .rajs-list input {
-	margin-right: 2em;
-}
-.rajs-listitem input {
-	margin: 0.25em;
-}
-.rajs-section h1 {
-	border-bottom: 1px solid white;
-	cursor: pointer;
-}
-.rajs-section h1:hover { text-decoration: underline; }
-
-.scroll {
-	overflow: auto;
-}
-
-/* Accordion 000-250-006 */
-
-button.accordion {
-	cursor: pointer;
-	padding: 5px;
-	width: 100%;
-	margin-bottom: 10px;
-	border-bottom: 3px double;
-	border-right: 3px double;
-	border-left: none;
-	border-top: none;
-	text-align: left;
-	outline: none;
-	transition: 0.2s;
-	background-color: transparent;
-}
-
-button.accordion.active, button.accordion:hover {
-	background-color: transparent;
-}
-
-button.accordion:before {
-	content: '\002B';
-	color: #777;
-	font-weight: bold;
-	float: left;
-	margin-right: 5px;
-}
-
-.unStaffed {
-	background-color: transparent;
-	padding: .5em .2em;
-	margin-bottom: 1em;
-	border-bottom: thin inset grey;
-}
-
-.unStaffed:before {
-	content: '\00D7';
-	color: #777;
-	font-weight: bold;
-	color: red;
-	float: left;
-	margin-right: 5px;
-}
-
-.unStaffed:after {
-	content: attr(data-after);
-	float: right;
-	margin-left: 2em;
-	font-weight: strong;
-	color: green;
-}
-
-button.accordion:after {
-	content: attr(data-after);
-	float: right;
-	margin-left: 2em;
-	font-weight: normal;
-	color: green;
-}
-
-button.accordion.active:before {
-	content: "\2212";
-}
-
-.accHidden {
-	padding: 0 18px;
-	margin-top: 5px;
-	margin-bottom: 5px;
-	max-height: 0;
-	overflow: hidden;
-}
-
-div.accordion:before {
-	content: '\002B';
-	color: #777;
-	font-weight: bold;
-	float: left;
-	margin-right: 5px;
-}
-div.accordion.active:before {
-	content: "\2212";
-}
-
-.hidden
-{
-	display:none;
-}
-
-div.quicklist.devotion button.mindbroken
-{
-	background-color:red;
-}
-div.quicklist.devotion button.very-hateful
-{
-	background-color:darkviolet;
-}
-div.quicklist.devotion button.hateful
-{
-	background-color:darkviolet;
-}
-div.quicklist.devotion button.resistant
-{
-	background-color:mediumorchid;
-}
-div.quicklist.devotion button.ambivalent
-{
-	background-color: yellow;
-	color: #444444;
-}
-div.quicklist.devotion button.accepting
-{
-	background-color: hotpink;
-}
-div.quicklist.devotion button.devoted
-{
-	background-color: deeppink;
-}
-div.quicklist.devotion button.worshipful
-{
-	background-color: magenta;
-}
-div.quicklist.trust button.mindbroken
-{
-	background-color:red;
-}
-div.quicklist.trust button.extremely-terrified
-{
-	background-color: darkgoldenrod;
-}
-div.quicklist.trust button.terrified
-{
-	background-color: goldenrod;
-}
-div.quicklist.trust button.frightened
-{
-	background-color: gold;
-	color: coral;
-}
-div.quicklist.trust button.fearful
-{
-	background-color: yellow;
-	color: green;
-}
-div.quicklist.trust button.hate-careful
-{
-	background-color: orange;
-}
-div.quicklist.trust button.careful
-{
-	background-color: mediumaquamarine;
-	color: forestgreen;
-}
-div.quicklist.trust button.bold
-{
-	background-color: orangered;
-}
-div.quicklist.trust button.trusting
-{
-	background-color: mediumseagreen;
-}
-div.quicklist.trust button.defiant
-{
-	background-color: darkred;
-}
-div.quicklist.trust button.profoundly-trusting
-{
-	background-color: seagreen;
-}
-div.quicklist
-{
-	table-layout: fixed;
-	text-align: center;
-	border-collapse: separate;
-	border-spacing: 2px;
-	border-style: hidden;
-	empty-cells: hide;
-	width: 70%;
-}
-div.quicklist button
-{
-	margin-top: 15px;
-	margin-right: 20px;
-	white-space: nowrap;
-}
-
-.optionMacro {
-	margin-top: 8px;
-	display: inline-block;
-}
-
-.optionDescription {
-	display: inline-block;
-	width: 500px;
-	margin-right: 10px;
-	line-height: 1.2;
-	text-align: right;
-}
-
-@media only screen and (max-width: 1200px) {
-	.optionDescription {
-		display: block;
-		width: unset;
-		text-align: left;
-	}
-
-	.optionMacro {
-		margin-top: 30px;
-	}
-
-}
-
-.optionMacroOption {
-	border: #555 solid 0.5px;
-	border-top-width: 0;
-	vertical-align: top;
-	-moz-user-select: none;
-	min-width: 79px; /* 80px - 1px for border */
-	display: inline-block;
-	text-align: center;
-}
-
-.optionComment {
-	vertical-align: top;
-	color: gray;
-	padding-left: 10px;
-}
-
-/* But don't add the | after the last one */
-.optionMacroOption:last-child {
-	border-top-right-radius: 6px;
-	border-bottom-right-radius: 6px;
-	border-right-width: 0;
-}
-
-.optionMacroOption:first-child {
-	border-top-left-radius: 6px;
-	border-bottom-left-radius: 6px;
-}
-
-.optionMacroOption a {
-	padding: 0 10px;
-	box-sizing: border-box;
-	width: 100%;
-	display: block;
-}
-
-.optionMacroOption:hover {
-	background: #2F2F2F;
-}
-
-body.lightTheme .optionMacroOption:hover {
-	background: #DDDDDD;
-}
-
-body.lightTheme .optionMacroSelected {
-	background: #DDDDDD;
-}
-
-.optionMacroSelected {
-	background: #2F2F2F;
-	padding: 0 10px;
-	min-width: 80px;
-	cursor: pointer;
-	box-sizing: border-box;
-}
-
-.optionValue {
-	display: inline-flex;
-	flex-wrap: wrap;
-}
-
-.optionValue input {
-	padding: 3px 3px 3px 10px;
-	background: transparent;
-	border: #555 solid 0.5px;
-	border-top-width: 0;
-	min-width: unset;
-	width: 140px;
-	height: 22px;
-}
-
-.optionMacroNumber input {
-	width: 50px;
-}
-
-.optionValue input:last-child {
-	border-top-right-radius: 6px;
-	border-bottom-right-radius: 6px;
-	border-right-width: 0;
-}
-
-.optionValue input:first-child {
-	border-top-left-radius: 6px;
-	border-bottom-left-radius: 6px;
-}
-
-.optionMacroSelected.optionMacroEnable {
-	color: rgb(230,255,230);
-	background-image: linear-gradient(rgba(0, 255,0, 0.12), transparent);
-}
-
-.optionMacroSelected.optionMacroDisable {
-	color: rgb(255,240,240);
-	background-image: linear-gradient(rgba(255, 100, 0, 0.2), transparent);
-}
-
-/* Stylesheet for WardrobeUse.tw */
-
-#passage-wardrobe-use .optionMacro {
-	display: inline;
-}
-
-#passage-wardrobe-use .optionDescription {
-	width: unset;
-	text-align: left;
-}
-
-#passage-wardrobe-use .optionValue {
-	display: flex;
-}
-
-#passage-wardrobe-use .optionMacroOption {
-	flex-grow: 1;
-}
-
-/* Last line shouldn't grow */
-#passage-wardrobe-use .optionValue::after {
-	flex-grow: 1000000000;
-	content: '';
-}
-
-#graph .linage {
-	fill: none;
-	stroke: white;
-}
-#graph .marriage {
-	fill: none;
-	stroke: white;
-}
-#graph .node {
-	background-color: lightblue;
-	border-style: solid;
-	border-width: 1px;
-}
-#graph .nodeText{
-	font: 10px sans-serif;
-	margin: 0;
-	padding: 0;
-	color: black;
-}
-#graph {
-	font: 10px sans-serif;
-	margin: -20px 0;
-	padding: 0;
-	color: black;
-}
-
-#graph div {
-	border-style: solid;
-	border-width: 1px;
-}
-
-#graph .XY {
-	background-color: lightblue;
-}
-
-#graph div.XX {
-	background-color: pink;
-}
-
-#graph div.unknown {
-	background-color: gray;
-}
-
-#graph div.unknownXY {
-	background-color: #808080;
-}
-
-#graph div.unknownXX {
-	background-color: #808080;
-}
-
-#graph .you {
-	background-color: red;
-}
-
-#graph .emphasis {
-	font-style: italic;
-	font-weight: bold;
-	margin: 0;
-	background: #ffffff88;
-	border: 2px solid Gold;
-	white-space: nowrap;
-}
-
-#editFamily {
-	display: flex;
-	flex-wrap: wrap;
-	align-items: center;
-}
-
-#editFamily #familyTable {
-}