:root
{
	--hue: 0;
}

html
{
	font-family: monospace;
	font-size: 1.5em;
	
	background-color: hsl(var(--hue), 0%, 0%);
	color: hsl(var(--hue), 0%, 100%);
}


body
{
	max-width: 960px;
	margin: auto;
	padding: 24px;
	
	background-color: hsl(var(--hue), 0%, 12.5%);
	color: hsl(var(--hue), 0%, 87.5%);
}

body:not([rel="logged_out"]) nav .logged_out {display: none;}
body:not([rel="logged_in"]) nav .logged_in {display: none;}

a
{
	background-color: hsl(var(--hue), 0%, 12.5%);
	
	text-decoration: none;
}

a:not(:hover)
{
	/*
	color: hsl(var(--hue), 75%, 50%);
	 */
	color: hsl(var(--hue), 72.3%, 54.7%);
}

a:hover
{
	/*
	color: hsl(var(--hue), 75%, 75%);
	 */
	color: hsl(var(--hue), 72.8%, 79.8%)
}

input[type="text"]
,
input[type="number"]
,
input[type="password"]
{
	background-color: hsl(var(--hue), 0%, 87.5%);
	color: hsl(var(--hue), 0%, 12.5%);
	
	padding: 8px;
}

nav
{
	border-bottom: 1px solid hsl(var(--hue), 0%, 100%);
	margin-bottom: 16px;
}

nav > ul
{
	list-style-type: none;
	margin: 0;
	padding: 0;
}

nav > ul > li
{
	display: inline-block;
	margin-right: 16px;
	padding: 8px;
	
	/*
	text-transform: uppercase;
	 */
}

/*
nav > ul > li:hover::before
{
	content: "[";
}

nav > ul > li:hover::after
{
	content: "]";
}
 */

.plankton_form_field
{
	margin-bottom: 16px;
}

.plankton_form_label
{
	display: block;
	
	font-size: 0.75em;
	font-weight: bold;
}

.plankton_input_group_field
{
	margin-bottom: 16px;
}

.plankton_input_group_field_label
{
	font-size: 0.75em;
	font-weight: bold;
	/*
	text-transform: capitalize;
	 */
}

.plankton_input_group_field_label + :not(.plankton_input_group_field_help)
{
	display: block;
}

.plankton_input_group_field_help
{
	margin-left: 8px;
	
	font-size: 0.75em;
	font-weight: bold;
	
	cursor: help;
}

.plankton_input_group_field_help + *
{
	display: block;
}


.plankton_input_enumeration > *
{
	display: block;
}

.plankton_editor_actions
{
	margin-top: 16px;
}

.plankton_editor_action
{
	text-transform: uppercase;
	margin: 8px;
}

.members-result:not([href])
{
	display: none;
}

.register:not([rel]) .register-message {display: none;}
.register:not([rel]) .register-form {display: none;}

.register[rel="fill"] .register-message {}
.register[rel="fill"] .register-form {}

.register[rel="wait"] .register-message {}
.register[rel="wait"] .register-form {display: none;}

.register[rel="done"] .register-message {}
.register[rel="done"] .register-form {display: none;}

.members:not([rel]) .members-extras {display: none;}
.members[rel="poor"] .members-extras {display: none;}
.members[rel="rich"] .members-extras {}