/* VARS */
:root {
    --gap: 2ch;
}


/* Reset all margins and paddings globally */
*,
*::before,
*::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box; /* Prevents padding and borders from affecting width/height */
}

/* Ensure html and body elements have no margins or padding */
html, body {
    margin: 0;
    padding: 0;
    height: 100%;  /* Full height for the body */
	  -webkit-text-size-adjust: 100%; /* stops Safari from zooming/adjusting */
	  overflow-x: hidden;

}

body {
	background-color: #1e1e1e;
	font-family: Courier, monospace;
    font-weight: normal;
    font-size: 14px;
    line-height: auto;
    color: #fdfdfd;
}


main {
    padding-top: 12px; 
	padding-bottom: 20px;
	padding-left: 15px;
	padding-right: 15px;	
}

.live
{
	padding-left: 2ch;
}


span10
{
text-decoration: none;
}


span1
{
font-style: italic;
}

span2
{
color: mediumorchid;
}

span3
{
color: mediumorchid;
}

span4
{
color: mediumorchid;
}

span5
{
color: mediumorchid;
}

span6
{
	color: dodgerblue;
	background-color: none;
	text-decoration: underline;
	text-underline-offset: 2px;
}

span7
{
	color: grey;
}

span8
{
	color: #fdfdfd;
}

span9
{
	color: grey;
}

span11
{
color: goldenrod;
}


pre {
  font-family: Courier, monospace; /* system-safe font */
  white-space: pre; /* explicit, avoids reflow */
  line-height: 1.2; /* lock in line-height */
}

.header-pre {
    margin: 0;
    padding: 0;
    line-height: 1.2; /* keeps ASCII compact */
    display: block;
}

a {
    color: #fdfdfd;
		background-color: none;
	text-decoration: underline;
	text-underline-offset: 2px;
}


a:link {
    color: #fdfdfd;
	background-color: none;
	text-decoration: underline;}



a:visited {
  	text-decoration: underline;
    color: #fdfdfd;
	background-color: none;

}



a:hover {
	color: #fdfdfd;
	text-decoration: none;
	background-color: none;
}




.ex {
  	animation: blinkingText 0.75s infinite;
	color: mediumpurple;
	
}
@keyframes blinkingText {
  0% {
    color: grey;

  }
  49% {
    color: grey;


  }
  60% {
    color: transparent;

  }
  99% {
    color: transparent;

  }
  100% {
    color: grey;

  }
}


.header__left {
    margin-right: var(--gap);
    flex-shrink: 0;
}


.block {
    display: flex;
}

.desktop{
    display: block;
}

.mobile{
    display: none;
}


.left {
    /* background-color: beige; */
    /* min-width: 86px; */
    margin-right: var(--gap);
}



@media (max-width: 800px) {
	
	
body {
	font-size: 15px;
}	
	

.mobile{
    display: block;
}		
	
.desktop{
    display: none;
}


	
	
	.live
{
	padding-left: 0ch;
}

}