/*
Theme Name: Xinoscope Retro
Theme URI: https://xinoscope.com
Description: A retro-minimalist theme echoing the earliest websites — black text on white background, Times, simple title lists, centered article text in 40% of the screen. Renders using the browser's built-in user-agent stylesheet as much as possible; only the article column and the font are overridden.
Author: Xinoscope
Author URI: https://xinoscope.com
Version: 1.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: xinoscope-retro
*/

/*
 * The intent of this stylesheet is to do as little as possible. The look of
 * an early-90s web page is, almost by definition, the browser's default
 * rendering: a body margin, bold <h1>, bulleted <ul>, blue underlined links,
 * and whatever text size the user set. We override only the font family and
 * the few layout rules the brief requires.
 */

/* Use the legacy "Times" PostScript name first — on older Mac browsers this
 * was the default serif. Modern systems fall through to Times New Roman. */
body {
    font-family: "Times", "Times New Roman", Times, serif;
}

/* ---------- Front page: list of article titles ----------
 * A plain bulleted <ul> flowing in the body margin is the period-correct
 * look. We only constrain width on very narrow screens to keep it readable. */

.home-list {
    margin: 3em auto 6em;
    padding: 0 1.5em;
    max-width: 38em;
}
.home-list .site-title {
    margin: 0 0 1.5em;
}
.home-list .site-title a {
    color: #000;
    text-decoration: none;
}
.home-list ul {
    /* Keep the browser's default disc bullets. */
    margin: 0;
    padding: 0 0 0 2em;
}
.home-list li {
    margin: 0 0 0.75em;
    padding: 0;
}
.home-list .page-nav {
    margin-top: 2.5em;
}
.home-list .page-nav a {
    margin-right: 1em;
}

/* ---------- Single article: centered 40% column ---------- */

.single-article {
    margin: 0 auto;
    padding: 3em 0 6em;
    width: 40%;
    min-width: 18em;
}
.single-article .entry-meta {
    margin: 0 0 1.5em;
    font-size: 0.85em;
}

/* Images inside articles: allowed, but kept tidy. */
.single-article .entry-content img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 1.5em auto;
}
.single-article .entry-content figure {
    margin: 1.5em 0;
}
.single-article .entry-content figcaption {
    font-size: 0.8em;
    text-align: center;
    margin-top: 0.5em;
}

/* ---------- Page template (non-article) ---------- */

.page-content {
    margin: 0 auto;
    padding: 3em 0 6em;
    width: 50%;
    min-width: 18em;
}

/* ---------- Keep the 40% column usable on small screens ----------
 * Not a real media query for retro purposes — just usability. */

@media (max-width: 768px) {
    .home-list {
        padding: 0 1em;
        max-width: 100%;
    }
    .single-article,
    .page-content {
        width: 90%;
        margin-left: auto;
        margin-right: auto;
        padding-left: 1em;
        padding-right: 1em;
    }
}

/* ---------- 404 ---------- */

.error404 .page-content {
    text-align: left;
}
.error404 .page-content .search-form {
    margin-top: 2em;
}