@font-face{
font-family:'Trade Winds';
src:url("/rc/tw/trade-winds-v6-latin-regular.woff2") format("woff2");
font-weight:400;
font-style:normal;
font-display:swap;
}
:root{
	--font-color:#cac5bf;
	--font-mono:ui-monospace,"Roboto Mono","JetBrains Mono","DejaVu Sans Mono","Cascadia Code","Source Code Pro","Hack","Droid Sans Mono",monospace;
	--font-sans:ui-sans-serif,Roboto,Liberation,Ubuntu,sans-serif !important;
}
::selection{background:#955f50;color:#1f1816;}
html{
	scroll-behavior:smooth;
	-moz-text-size-adjust:none;
	-webkit-text-size-adjust:none;
	text-size-adjust:none;
	scrollbar-color:#543c22 #201e1b;
	scrollbar-width: thin;
	&::-webkit-scrollbar{width:8px;height:8px;}
	&::-webkit-scrollbar-track{background:#201e1b;border-radius:4px;} 
	&::-webkit-scrollbar-thumb{background-color:#543c22;border-radius:4px;border: 2px solid #201e1b;}
	&::-webkit-scrollbar-thumb:hover{background-color:#543c22;}
}
body{ 
color:var(--font-color);
margin:0px;
padding:0px;
font-family:var(--font-sans);
font-size:1rem;
line-height:1.6;
-webkit-tap-highlight-color:transparent;
background:#000;
}
a{color:#bec7e8;text-decoration:none;transition:all 250ms}
a:active{color:#f4a460;text-decoration:underline 1px;text-underline-offset:0.3em}
a:hover{color:#f4a460;text-decoration:underline 1px;text-underline-offset:0.3rem}
:focus{outline:none}
:focus-visible{outline:none;background:#543c22}
hr{margin:0;border:0;border-bottom:1px solid #543c22}
ul{padding-left:1rem;line-height:1.9}
ul li{padding-left:0.5rem}
ul li::marker{
	content:"\00bb";
	color:#955f50;
}
.sMain{margin:auto;max-width:100rem}
.sMainPad{padding:0 1rem 0 1rem}
.fSml{font-size:0.8rem}
#sNav{
	margin:auto;
	width:100%;
	max-width:100rem;
	display:flex;
	align-items:stretch;
	font-family:var(--font-mono);
	font-variant-ligatures:none;
	font-feature-settings:"calt" 0,"liga" 0;
	white-space:nowrap;
	overflow-x:auto;
	justify-content:flex-start;
	-webkit-overflow-scrolling:touch;
	&::-webkit-scrollbar{display:none}
	-ms-overflow-style:none;
	scrollbar-width:none;
}
#BG{
	position:fixed;
	top:0;right:0;bottom:0;left:0;
	background-color:#000;
	background-size:cover;
	background-position:center;
	filter:grayscale(80%) brightness(80%);
	z-index:-1
}
#sNav .sHref{
	flex-shrink:0;
	line-height:2rem;
}
/* q3js keys */
#viewport-frame{
	position:absolute;
	top:0;right:0;bottom:0;left:0;
}
#viewport-frame:focus{outline:none}
#viewport-frame:fullscreen,
#viewport:fullscreen {
    display:block;
    position:absolute;
    margin:0;
    top:0;
    left:0;
    width:100%;
    height:100%;
}
/* <canvas id="viewport"> is added to the end of #viewport-frame when loaded */
#viewport{width:100%;height:100%}
#loading{
	/* display:none is added to this when the pk3 is loaded */
}
#loading-progress{
	margin:1rem;
	padding:0.5rem 1rem 1rem 1rem;
	background:#201e1b;
	border-radius:0.75rem;
}
#loading-progress .description{
	/* loading: baseq3/bsp.pk3 added here */
}
#loading-progress .bar-wrapper{
	/* loading progress bar wrap */
}
#loading-progress .bar{
	/* loading progress bar */
}
/* end q3js keys */
.sCanScroll{overflow-y:auto}
.sCanNotScroll{overflow:hidden}
#ldStatBarWrap{
	width:100%;
	height:0.25rem;
	background:#1f1816;
}
#ldStatBar{height:0.25rem}
.ldFlat{
	background:linear-gradient(90deg, #f4a460 0%, #543c22 5%, #543c22 95%, #f4a460 100%);
	background-size:300% 100%;
	animation:kfLdFlat 2.75s linear infinite;
	transition: width 0.5s ease-out;
}
.ldLoop{
	width:100%;
	height:0.2rem;
	background:linear-gradient(90deg, #1f1816 0%, #1f1816 35%, #f4a460 49%, #f4a460 51%, #1f1816 65%, #1f1816 100%);
	background-size:200% 100%;
	background-repeat: no-repeat;
	animation:kfLdLoop 1.75s linear infinite;
}
@keyframes kfLdFlat{
	0%{background-position:300% 0}
	100%{background-position:0% 0}
}
@keyframes kfLdLoop{
	0%{background-position:175% 0}
	50%{background-position:-75% 0}
	100%{background-position:175% 0}
}
.sSplit,.sSplitCenter{
	margin:auto;
	max-width:100rem;
	display:grid;
	grid-template-columns:2fr 1fr;
}
.sSplit{align-items:stretch}
.sSplitCenter{align-items:center}
.s66Head{
	display:grid;
	align-items:center;
	padding:0.75rem 1rem 0.75rem 1rem;
	font-family:'Trade Winds';
	font-size:2rem;
	line-height:1;
	text-align:center;
}
.s34Head{
	display:grid;
	align-items:center;
	padding:1rem;
	font-family:var(--font-mono);
	font-variant-ligatures:none;
	font-feature-settings:"calt" 0,"liga" 0;
}
.sLoading{
	font-size:0.9rem;
	font-family:var(--font-mono);
	font-variant-ligatures:none;
	font-feature-settings:"calt" 0,"liga" 0;
	text-align:center;
	white-space:pre;
}
.sButL{
	margin:0;
	padding:0;
	font:inherit;
	border:none;
	background:none;
	white-space:nowrap;
	transition:all 250ms;
}
.sButL{color:#bec7e8;cursor:pointer}
.sButL:hover{
	color:#f4a460;
	text-decoration:underline 0.01rem;
	text-underline-offset:0.3rem
}
.sButL:focus-visible{outline:none;background:#543c22}
.sHref{
	padding:0.5rem;
	font-size:0.9rem;
	font-family:var(--font-mono);
	font-variant-ligatures:none;
	font-feature-settings:"calt" 0,"liga" 0;
	white-space:pre;
}
.sHref::before{
	content:"\005b\00a0";
	color:#543c22;
	transition:all 500ms;
}
.sHref::after{
	content:"\00a0\005d";
	color:#543c22;
	transition:all 500ms;
}
.sHref:focus::before, .sHref:focus::after{
	text-decoration:none;
	color:#f4a460;
}
.sHref:active, .sHref:active::before, .sHref:active::after{
	text-decoration:none;
	color:#f4a460;
}
.sHref:hover, .sHref:hover::before, .sHref:hover::after{
	text-decoration:none;
	color:#f4a460;
}
/* Modal */
.sModHead{
	text-align:center;
	padding:1rem 2rem 1rem 2rem;
	font-family:'Trade Winds';
	font-size:2em;
	text-align:center;
}
.sModBody{
	margin:auto;
	padding:0.5em 1.5em 1.5em 1.5em;
	width:100%;
	max-width:30rem;
	border-radius:2em;
	border:1em solid #201e1b; 
	background:#332f27;
	box-sizing:border-box;
	transition:all 250ms;
}
.sModInput{
	margin:auto;
	min-width:6rem;
	width:100%;
	font-family:var(--font-mono);
	font-size:0.9rem;
	color:var(--font-color);
	padding:0.5rem;
	border:1px solid #543c22;
	background:#33281c;
	box-sizing:border-box;
	transition:border 250ms;
}
.sModInput:focus{border:1px solid #80501c}
.sModAct{text-align:right}
/* End Modal */
.sBut{
	margin:0.5rem 0px 0.5rem 0px;
	padding:0.75rem;
	font-size:1rem;
	border-radius:0.5rem;
	border:1px solid #543c22;
	color:#aea8a1;
	background:#33281c;
	transition:all 250ms;
}
.sBut.dis{color:#847f7a;background:transparent}
.sBut.sel{color:var(--font-color);background:#201e1b}
.sBut:hover{
	color:#ffd9ad;
	border:1px solid #80501c;
	background:#201e1b;
}
.sBut:focus{
	color:#ffd9ad;
	border:1px solid #80501c;
	background:#1e1b17;
}
.sBut+.sBut{margin-left:0.5rem}
/* q3js only */
.sCacheList{
	padding:0 1rem 0 0.5rem;
	columns:auto;
	column-width:16rem;	
	column-gap:3rem;
}
.sCache{
	padding:0.25rem 0.25rem 0.25rem 0;
	font-size:0.8rem;
	font-family:var(--font-mono);
	font-variant-ligatures:none;
	font-feature-settings:"calt" 0,"liga" 0;
	white-space:pre;
	overflow:hidden;
	cursor:pointer;
	transition:all 250ms;
}
.sCacheText{color:#bec7e8}
.sCache:hover .sCacheText{
	color:#f4a460;
	text-decoration:underline 0.01rem;
	text-underline-offset:0.3rem
}
/* end q3js only */
.sFlex{
	display:flex;
	justify-content:center;
	align-items:var(--align,baseline);
	flex-wrap:var(--wrap,wrap);
}
.sHide{display:none}
.sCenter{margin:auto;text-align:center}
.sMarginTop2{margin-top:2rem}
.sPadTop05{padding-top:0.5rem}
/* Must be below other font* options */
.sBold{font-weight:bold}
.sRed{color:#ff4900}
/* 848px wide */
@media all and (max-width:53em){
	.sSplit, .sSplitCenter{grid-template-columns:1fr}
	.s66Head{border-right:0}
	.s34Head{
		position:relative;
		padding-top:0;
		text-align:center;
	}
	.sOrder1{order:1}
	.sOrder2{order:2}
}