.hallboard {
	--screen-bg: #050910;
	--card-bg: rgba(18, 26, 36, .92);
	--panel-bg: rgba(255, 255, 255, .96);
	--text: #f7f9fc;
	--muted: rgba(255, 255, 255, .68);
	--dark: #111820;
	--soft: #edf2f7;
	--yellow: #d79b00;
	--pink: #ef3f68;
	--red: #ee334e;
	--blue: #1f75ca;
	--cyan: #18bba4;
	--purple: #9462e9;
	--unit: min(1vw, 1vh);
	position: fixed;
	z-index: 99999;
	inset: 0;
	display: grid;
	grid-template-rows: 11vh 15vh minmax(0, 1fr) 4.8vh;
	gap: 2vh;
	width: 100vw;
	height: 100vh;
	padding: 2.4vh 1.5vw 1.8vh;
	box-sizing: border-box;
	overflow: hidden;
	background:
		radial-gradient(circle at top left, rgba(23, 44, 69, .62), transparent 32vw),
		linear-gradient(135deg, #050910 0%, #0c121c 54%, #050910 100%);
	color: var(--text);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
}

.hallboard,
.hallboard * {
	box-sizing: border-box;
}

.hallboard-header {
	display: grid;
	grid-template-columns: 19vw minmax(0, 1fr) 19vw;
	align-items: start;
	min-height: 0;
}

.hallboard-brand {
	align-self: start;
	color: #f0191f;
	font-size: 2.7vw;
	line-height: 1;
	font-weight: 900;
	letter-spacing: -.08em;
	text-transform: uppercase;
}

.hallboard-title {
	text-align: center;
}

.hallboard-title h1 {
	margin: 0;
	font-size: 4.1vw;
	line-height: .95;
	font-weight: 900;
	letter-spacing: .045em;
	text-transform: uppercase;
	text-shadow: 0 .2vh 1.2vh rgba(0, 0, 0, .45);
}

.hallboard-title p {
	margin: 1.2vh 0 0;
	color: var(--muted);
	font-size: 1.35vw;
	line-height: 1;
	font-weight: 750;
}

.hallboard-clock {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: 1.1vw;
	line-height: 1;
	font-weight: 800;
}

.hallboard-clock span {
	color: rgba(255, 255, 255, .74);
	font-size: 1.45vw;
}

.hallboard-clock strong {
	padding-left: 1.2vw;
	border-left: .16vw solid #e60012;
	font-size: 2.6vw;
}

.hallboard-alert {
	position: absolute;
	left: 1.5vw;
	right: 1.5vw;
	top: 13.2vh;
	z-index: 2;
	padding: 1vh 1.2vw;
	border: .08vw solid rgba(255, 211, 127, .8);
	border-radius: .8vw;
	background: rgba(82, 49, 0, .92);
	color: #ffe2a3;
	font-size: 1.1vw;
	font-weight: 700;
}

.hallboard-metrics {
	display: grid;
	grid-template-columns: repeat(7, minmax(0, 1fr));
	gap: 1.15vw;
	min-height: 0;
}

.hallboard-metric {
	position: relative;
	display: grid;
	grid-template-rows: minmax(0, 1fr) auto auto;
	align-items: center;
	justify-items: center;
	min-width: 0;
	min-height: 0;
	padding: 1.45vh .7vw 1.2vh;
	border: .08vw solid rgba(255, 255, 255, .09);
	border-radius: .72vw;
	background: linear-gradient(180deg, rgba(28, 39, 52, .96), rgba(14, 20, 29, .96));
	box-shadow: inset 0 -.35vh 0 currentColor, 0 .8vh 2.2vh rgba(0, 0, 0, .34);
	color: #fff;
	overflow: hidden;
}

.hallboard-metric strong {
	font-size: 4vw;
	line-height: .86;
	font-weight: 950;
	letter-spacing: -.03em;
}

.hallboard-metric span {
	max-width: 100%;
	font-size: 1.05vw;
	line-height: 1.14;
	font-weight: 850;
	text-align: center;
}

.hallboard-metric small {
	min-height: 1.7vh;
	color: rgba(255, 255, 255, .58);
	font-size: .82vw;
	font-weight: 700;
	text-align: center;
}

.hallboard-metric--total { color: #f4f7fb; }
.hallboard-metric--no-card-in { color: var(--yellow); }
.hallboard-metric--present-no-work { color: var(--pink); }
.hallboard-metric--work-without-card { color: var(--red); }
.hallboard-metric--short-works { color: #51bdf4; }
.hallboard-metric--rapid-switches { color: var(--cyan); }
.hallboard-metric--stale-work { color: var(--purple); }

.hallboard-panels {
	display: grid;
	grid-template-columns: 1fr 1.05fr 1.05fr;
	gap: .8vw;
	min-height: 0;
}

.hallboard-panel {
	display: grid;
	grid-template-rows: 8.3vh minmax(0, 1fr);
	min-width: 0;
	min-height: 0;
	border-radius: .72vw;
	background: var(--panel-bg);
	box-shadow: 0 1vh 2.8vh rgba(0, 0, 0, .36);
	overflow: hidden;
}

.hallboard-panel > header {
	display: grid;
	grid-template-columns: 3.6vw minmax(0, 1fr);
	align-items: center;
	gap: 1vw;
	padding: 0 1.5vw;
	border-bottom: .18vh solid currentColor;
	background: rgba(255, 255, 255, .86);
	color: var(--blue);
}

.hallboard-panel h2 {
	margin: 0;
	font-size: 1.58vw;
	line-height: 1.08;
	font-weight: 900;
	text-transform: uppercase;
}

.hallboard-panel__icon {
	display: grid;
	place-items: center;
	width: 3.1vw;
	height: 3.1vw;
	border-radius: 50%;
	background: currentColor;
	color: #fff;
	font-size: 1.8vw;
	line-height: 1;
	font-weight: 950;
}

.hallboard-panel--no-card-in > header { color: var(--yellow); }
.hallboard-panel--present-no-work > header { color: var(--pink); }
.hallboard-panel--other > header { color: var(--blue); }

.hallboard-list {
	display: grid;
	align-content: start;
	gap: .72vh;
	min-height: 0;
	padding: 1.2vh 1.1vw;
	overflow: hidden;
}

.hallboard-person {
	display: grid;
	grid-template-columns: 2.4vw minmax(0, 1fr);
	gap: .75vw;
	align-items: start;
	min-height: 7vh;
	padding: .85vh .75vw;
	border: .08vw solid rgba(17, 24, 32, .08);
	border-radius: .65vw;
	background: rgba(255, 255, 255, .72);
	color: var(--dark);
}

.hallboard-person__icon {
	padding-top: .55vh;
	color: currentColor;
	font-size: 1.75vw;
	line-height: 1;
}

.hallboard-panel--no-card-in .hallboard-person__icon { color: var(--yellow); }
.hallboard-panel--present-no-work .hallboard-person__icon { color: var(--pink); }
.hallboard-panel--other .hallboard-person__icon { color: var(--blue); }

.hallboard-person__body {
	display: grid;
	gap: .25vh;
	min-width: 0;
}

.hallboard-person strong {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 1.78vw;
	line-height: 1.05;
	font-weight: 920;
}

.hallboard-person span,
.hallboard-person small {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	color: rgba(17, 24, 32, .62);
	font-size: .88vw;
	line-height: 1.15;
	font-weight: 700;
}

.hallboard-person small {
	color: rgba(17, 24, 32, .74);
}

.hallboard-person__tags {
	display: flex;
	flex-wrap: wrap;
	gap: .32vw;
	min-height: 2.35vh;
	padding-top: .25vh;
	overflow: hidden;
}

.hallboard-tag {
	display: inline-flex;
	align-items: center;
	min-height: 2vh;
	padding: .22vh .52vw;
	border-radius: 999px;
	background: var(--soft);
	color: var(--blue);
	font-size: .72vw;
	line-height: 1;
	font-weight: 850;
	white-space: nowrap;
}

.hallboard-tag--no-card-in { background: rgba(215, 155, 0, .14); color: #9b6b00; }
.hallboard-tag--present-no-work { background: rgba(239, 63, 104, .13); color: #c8204d; }
.hallboard-tag--work-without-card { background: rgba(238, 51, 78, .13); color: #c41832; }
.hallboard-tag--stale-work { background: rgba(148, 98, 233, .14); color: #6b3fd1; }
.hallboard-tag--short-works { background: rgba(31, 117, 202, .12); color: #185ca0; }
.hallboard-tag--rapid-switches { background: rgba(24, 187, 164, .14); color: #0b8273; }
.hallboard-tag--coverage-over-120 { background: rgba(226, 126, 0, .14); color: #a55200; }

.hallboard-more,
.hallboard-empty {
	display: grid;
	place-items: center;
	min-height: 6vh;
	border-radius: .65vw;
	background: rgba(17, 24, 32, .06);
	color: rgba(17, 24, 32, .64);
	font-size: 1.25vw;
	font-weight: 900;
}

.hallboard-more {
	color: var(--yellow);
	font-size: 1.35vw;
}

.hallboard-ok {
	display: grid;
	place-items: center;
	align-content: center;
	gap: 1.2vh;
	min-height: 0;
	border: .08vw solid rgba(255, 255, 255, .08);
	border-radius: .9vw;
	background: rgba(255, 255, 255, .96);
	color: var(--dark);
	text-align: center;
}

.hallboard-ok strong {
	font-size: 4vw;
	line-height: 1;
	font-weight: 950;
}

.hallboard-ok span {
	font-size: 1.3vw;
	font-weight: 720;
	color: rgba(17, 24, 32, .64);
}

.hallboard-footer {
	display: flex;
	align-items: center;
	gap: .8vw;
	min-height: 0;
	padding: 0 1.5vw;
	border: .08vw solid rgba(255, 255, 255, .08);
	border-radius: .55vw;
	background: rgba(14, 22, 32, .86);
	color: rgba(255, 255, 255, .72);
	font-size: 1.05vw;
	font-weight: 650;
}

.hallboard-footer i {
	display: block;
	width: .45vw;
	height: .45vw;
	border-radius: 50%;
	background: var(--pink);
}