html, body {
  margin: 0;
  min-height: 100%;
	cursor: url("media/customcursor.png"), auto;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;

  background-image: url("media/comic-patternsmall.png"); /* or a CSS pattern */
  background-repeat: repeat;
	background-size: 10px 10px;
  opacity: 0.10;

  pointer-events: none;  /* ← click-through magic */
  z-index: 9999;
}
.flexcontainer {
    display: flex;
	margin: 10vh 0px 5vh 0px;
    justify-content: center;
	flex-wrap: wrap;
	flex-direction: row; 
    padding: 15px;
    gap: 5px;
	height: 100%;
	z-index: 1;
}

.flexwrapper { 
    order:0;
    flex-grow:.75;
    flex-basis:4px;
    align-self:auto;
	background: rgba(0, 0, 0, 0.7);;
    border: 3px solid #000;
    border-radius: 5px;
    padding: 8px 0px 8px 0px;
	height: auto;
	z-index: 0;
	display: flex;
}
.flexwrapper p {
	filter: invert(100%);
}
.leftcontent { 
    flex:.65 2 auto;
	min-width: 60%;
	padding: 10px;
	font-size: 15pt;
}		
.rightcontent { 
 	flex:1 1 auto;
	min-width: 20%;
	padding: 10px;
	margin: 30px 0px 0px 0px;
	font-size: 15pt;
}
.wikititle {
	font-family: "Averia Sans Libre", sans-serif;
	font-size: 45pt;
	filter: invert(100%);
	text-shadow: -2px 2px 4px rgba(0, 0, 0, 0.3);
	margin: 0px 0px 50px 20px;
	max-width: 75%;
}
.character-placeholder {
  width: 80%;
  aspect-ratio: 2 / 3;
  background-image: var(--character-image);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 16px;
  overflow: hidden;
  background-color: #111;
}
.background {
  position: relative;
  width: 100%;
  min-height: 100vh;
  overflow-x: hidden;
  overflow-y: visible;
  background-image: url("media/starzbg.jpg");
  background-size: cover;
  background-position: center;
}

#aurora {
  position: fixed;
  inset: 0;
  z-index: 0;
  inset: 0;
  pointer-events: none;
  mix-blend-mode: screen;
  opacity: 0.9;
  filter:
    blur(28px)
    saturate(190%)
    contrast(120%)
    hue-rotate(-5deg);
  background-size: 400% 400%;
  animation:
    auroraDrift cubic-bezier(0.4, 0.0, 0.2, 1) infinite,
    auroraPulse cubic-bezier(0.6, 0.05, 0.1, 1) infinite;
}

@keyframes auroraDrift {
  0%   { background-position: 0% 40%; }
  30%  { background-position: 60% 30%; }
  60%  { background-position: 90% 50%; }
  100% { background-position: 0% 40%; }
}

@keyframes auroraPulse {
  0%   { opacity: 0.6; transform: scaleY(1); }
  40%  { opacity: 0.95; transform: scaleY(1.05); }
  70%  { opacity: 0.8; transform: scaleY(0.98); }
  100% { opacity: 0.6; transform: scaleY(1); }
}.wikititle {
}
