/**
 * @file theme.css
 * @brief design tokens - the hoff.world skin (overrides ggsp/web/theme.css defaults).
 * @copyright Copyright (c) 2026 hoff.industries
*/

:root {
	--accent:   #a89ec7;
	--accent-2: #e3f17b;
	--accent-3: #f86828;
	--cta:      #00d8b7;
	--text:     #f0ece2;
	--bg:        #1c1c1c;
	--surface:   #2d1f12;
	--header-bg: #3b291c;

	--rank-1:    #ffdb5b;
	--rank-2:    #cbf4ff;
	--rank-3:    #ecd299;
	--rank-misc: white;
}

body {
	background-image: url(images/output.jpg);
}

/* lazy-load: blurred placeholder paints first, fades out once output.jpg has loaded */
body::before {
	content: "";
	position: fixed;
	inset: 0;
	z-index: -1;
	background-image: url(images/output-blur.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	transition: opacity 0.6s ease;
}

body.bg_loaded::before {
	opacity: 0;
}

header {
	background-image: url(images/dirt.jpg);
}

/* this site: buttons are plain text - no fill, no outline (overrides ggsp defaults) */
.dot_button {
	background: none !important;
	border: none !important;
	font-size: 1.3rem;
}

/* this site: slimmer header bar (landscape only; portrait keeps its auto height) */
@media (min-aspect-ratio: 1 / 1) {
	body header {
		height: 3.5rem;
	}

	/* scale the logo to the slim header; vcenter of header items comes from ggsp base.css */
	.header_image {
		height: 80%;
		width: auto;
	}
}