/*
 * ----------------------------------------------------------------------------
 * "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";

/* Human mode */
@media (prefers-color-scheme: light) {
    :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%;
    }
}

/* Youkai mode */
@media (prefers-color-scheme: dark) {
    :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%;
    }
}
    
body {
    background-repeat: no-repeat;
    background-color: var(--bg);
    font-family: 'Ume UI Gothic';
    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);
}
.powered_by {
	float: right;
}

@media screen and (max-width: 600px) {
    body {
	background: var(--bg);
	font-family: 'Roboto', sans-serif;
    }
    .menu {
	font-size: 20px;
    }
    .powered_by {
	display: none;
    }
}