/*
 * ----------------------------------------------------------------------------
 * "THE BEER-WARE LICENSE" (Revision 42.1+yakumolabs):
 * <eternal-servant@yakumo.dev> wrote this file. As long as you retain this notice you
 * can do whatever you want with this stuff. If we meet some day, and you think
 * this stuff is worth it, you can buy me a Yukari Yakumo fumo (or related merch) in return Izuru Yakumo
 * ----------------------------------------------------------------------------
 */

/*
 * This is a hand-written layout which aims to replicate the user interface of
 * GoldSrc-based game menus as much as possible.
 * It contains a lot of hacks just to make stuff work.
 * Mobile support is a non-goal (it works, but wallpaper doesn't fit for obvious reasons)
 */

@import "/css/font.css";

/*
 * Color schemes (Human mode)
 */
:root {
	--bg: #ffffff;
	--fg: #000000;
	--link: #000000;
	--link-hover: #800080;
	--link-visited: #ff0000;
	--border: #9d9d9d;
}

body {
    background-image: url('/img/reimu.jpg');
    background-position: 40% 10%;
    background-repeat: no-repeat;
    background-color: var(--bg);
    font-family: 'ArialPixel', sans-serif;
    font-weight: bold;
}
div.content {
    color: var(--fg);
}
.menu {
    position: absolute;
    text-align: justified;
    float: left;
    bottom: 2px;
    left: 5px;
    right: 30px;
    top: 420px;
}
.menu a {
    color: var(--link);
}
.menu a:hover {
    color: var(--link-hover);
}
.menu a:visited {
    color: var(--link-visited);
}
.footer {
    margin-top: 85ch;
    position: relative;
    text-align: center;
}
.powered_by {
	float: right;
}

@media(prefers-color-scheme: dark) {
    /*
     * Color schemes (Youkai mode)
     */
    :root {
	--bg: #000000;
	--fg: #ffffff;
	--link: #ffffff;
	--link-hover: #ffd700;
	--link-visited: #ffa500;
	--border: #494949;
    }
    body {
	background-image: url('/img/yukari.jpg');
	background-position: 35% 35%;
    }
}
@media screen and (max-width: 600px) {
	body {
		background-image: url('/img/reimu_mobile.jpg');
	}
	.footer {
		display: none
	}
	.menu {
		font-size: 20px;
	}
	.powered_by {
		display: none;
	}
}