* {
	box-sizing: border-box;
}

body {
	--c0: #161616;
	background: var(--c0);
	color: #fff;
	margin: 0;
	min-height: 100vh;
}

@font-face {
	font-family: "ega";
	src: url("./Web437_IBM_VGA_8x16.woff");
}

.term {
	--xsize: 80;
	--ysize: 24;
	/* --height: calc(var(--ysize) * 1.2); */
	--fg: var(--c7);
	--bg: var(--c0);
	font-family: "ega", monospace;
	position: absolute;
	white-space: pre-wrap;
	left: 50%;
	top: 0%;
	transform: translateX(-50%);
	font-size: min(calc(200vw / (var(--xsize) + 1)), .9cm);
	background: var(--c0);
	/* background: #333; */
	width: 40em;
	min-height: 20vh;
	/* height: 100%; */
	overflow: auto;

	--c1: #008;
	--c2: #080;
	--c3: #088;
	--c4: #800;
	--c5: #808;
	--c6: #880;
	--c7: #ddd;
	--c8: #444;
	--c9: #44f;
	--c10: #4f4;
	--c11: #4ff;
	--c12: #f44;
	--c13: #f4f;
	--c14: #ff4;
	--c15: #fff;

	line-height: 1em;

}
.term span {
	cursor: default;
	text-align: center;
	vertical-align: top;
	display: inline-block;
	width: .5em;
	height: 1em;
	/* height: calc(100% / 28.75); */
	color: var(--fg);
	background-color: var(--bg);
}
.term .pending {
	display: none;
}

em {
	display: inline;
	all: unset;
}

em.bg0 { --bg: var(--c0); }
em.bg1 { --bg: var(--c1); }
em.bg2 { --bg: var(--c2); }
em.bg3 { --bg: var(--c3); }
em.bg4 { --bg: var(--c4); }
em.bg5 { --bg: var(--c5); }
em.bg6 { --bg: var(--c6); }
em.bg7 { --bg: var(--c7); }

em.fg0 { --fg: var(--c0); }
em.fg1 { --fg: var(--c1); }
em.fg2 { --fg: var(--c2); }
em.fg3 { --fg: var(--c3); }
em.fg4 { --fg: var(--c4); }
em.fg5 { --fg: var(--c5); }
em.fg6 { --fg: var(--c6); }
em.fg7 { --fg: var(--c7); }

em.fg8 { --fg: var(--c8); }
em.fg9 { --fg: var(--c9); }
em.fg10 { --fg: var(--c10); }
em.fg11 { --fg: var(--c11); }
em.fg12 { --fg: var(--c12); }
em.fg13 { --fg: var(--c13); }
em.fg14 { --fg: var(--c14); }
em.fg15 { --fg: var(--c15); }

.term a {
	color: inherit;
}
.term a span {
	cursor: pointer;
}
.term a:hover span {
	box-shadow: inset 0 -.1em var(--fg, --c7, #fff);
	filter: brightness(1.2)
}
.term a span {
	box-shadow: inset 0 -.05em var(--fg, --c7, #fff);
}


button {
	all: unset;
}
button:hover span {
	background-color: var(--fg);
	color: var(--bg);
}

textarea {

}