/* ==========================================================================
   The Burning Fire — the silent forest & the village
   ========================================================================== */

div#village {
	position: absolute;
	top: 0;
	right: 0;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: var(--bg-panel);
	cursor: default;
	padding: 9px 12px 7px;
	width: 200px;
	box-sizing: content-box;
}

div#village:before {
	position: absolute;
	background: var(--bg);
	content: attr(data-legend);
	left: 10px;
	top: -0.72em;
	padding: 0 7px;
	line-height: 1.4;
}

div#population {
	position: absolute;
	top: -0.72em;
	right: 12px;
	padding: 0 7px;
	background: var(--bg);
	color: var(--ink-dim);
	font-family: var(--font-mono);
	font-size: var(--fs-micro);
	font-variant-numeric: tabular-nums;
	line-height: 1.4;
}

.noHuts #population { display: none; }

/* ---- Worker assignment ------------------------------------------------- */

div#workers {
	position: absolute;
	top: -4px;
	left: 160px;
	width: 150px;
}

.workerRow {
	position: relative;
	margin: 12px 0;
	cursor: default;
}

.workerRow > .row_val {
	position: relative;
	padding-right: 22px;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.workerRow .tooltip      { width: 150px; }
div.storeRow div.tooltip { width: 168px; }

/* Gatherers are the fallback job; hold them slightly back visually. */
.workerRow:first-child .row_key { color: var(--ink-faint); }