/* vt323-regular - latin */
@font-face {
	font-family: VT323;
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url(/fonts/vt323-v17-latin-regular.woff2) format(woff2);
}

#wrap {
	/* Keep footer on screen at all times. */
	max-height: 100%;
}

/* Terminal container block. */
.RC-Terminal {
	--bg: #000;
	--green-color: #5bf870;
	--green-bg: #214c21;
	--red-color: #c0100a;
	--red-bg: #1b0302;
	--off: #000;
	--dark: #111;
	--terminal-font-size: 2rem;
	--cursor-font-size: 16px;
	display: grid;
	grid-template: 'rc-terminal' 100% / 100%;
	overflow: hidden;
	font-family: VT323, monospace;
	font-weight: 400;
	font-size: var(--terminal-font-size);
	contain: content;
	background: var(--off);
}

.RC-Terminal.theme-red {
	--color: var(--red-color);
	--bg: var(--red-bg);
}
.RC-Terminal.theme-green {
	--color: var(--green-color);
	--bg: var(--green-bg);
}
.RC-Terminal.theme-blue {
	 color: #00FFFF;
	text-shadow: 1px 1px 0 #0000ff;
	--bg: #002;
	--off: #050505;
}

.RC-Terminal.theme-blue.on .RC-Terminal__background {
	background: radial-gradient(
		ellipse,
		var(--bg) 0%,
		var(--off) 100%
	);
}

.RC-Terminal.theme-blue.turnOff .RC-Terminal__background {
	animation: turnOff .4s ease-in-out forwards;
}


.RC-Terminal--max-height {
	flex-grow: 1;
	min-height: 0;
}

.RC-Terminal__background {
	grid-area: rc-terminal;
}


.RC-Terminal__screen {
	grid-area: rc-terminal;
	display: grid;
	grid-template: 'rc-screen' 100% / 100%;
	overflow-y: auto;
	-webkit-user-select: none;
	user-select: none;
	will-change: scroll-position;
	contain: strict;
	
	
}

.RC-Terminal__content {
	grid-area: rc-screen;
	width: 80ch;
	margin: 0 auto;
}

.RC-Terminal.off .RC-Terminal_screen {
  display: none;
}

.RC-Terminal__typer {
	display: block;
	white-space: normal;
	/* Needs to be updated. Based on font size. */
	width: 100%;
	height: 24px;
	max-height: 24px;
	max-width: 100%;
	contain: strict;
	overflow: hidden;
	pointer-events: none;
	user-select: none;
}



/* Cursor Block */

.RC-Terminal__cursor {
	display: inline-block;
	background: white;
	width: 10px;
	height: 14px;
	opacity: 1;
	contain: strict;
	
}


/*********** ANIMATIONS *************/

.RC-Terminal__overlay {
	grid-area: rc-terminal;
	overflow: hidden;
	mix-blend-mode: multiply;
	contain: content;
}

/* Scanline moving top to bottom under the content. */
.RC-Terminal__vscanline {
	--scanline-height: 1px;
	grid-area: rc-terminal;
	width: 100%;
	height: var(--scanline-height);
	opacity: 0;
	transform: translateY(0);
	pointer-events: none;
	will-change: transform;
	contain: strict;
}

.RC-Terminal.theme-blue .RC-Terminal__vscanline {
	height: var(--scanline-height);
	background: #0000ff80;
}


/** 'minimize to the center' effect */
@keyframes turnOff {
	0% {
		background-color: #fff;
		transform: scale(1, 1.3);
		filter: brightness(1);
		opacity: 1;
	}
	60% {
		background-color: #fff;
		transform: scale(1.3, 0.001);
		filter: brightness(50);
	}
	100% {
		background-color: #fff;
		animation-timing-function: ease-out;
		transform: scale(0, 0.0001);
		filter: brightness(10);
	}
}