@font-face {
    font-family: "Geosans";
    src: url("https://en2fe.com/fonts/GeosansLight-36e6a06a4146af2f966ffcf021751724.ttf") format("truetype");
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: "U_condensed";
    src: url("https://en2fe.com/fonts/U_condensed-5ce78707b48aa3aea6c996a07c304546.ttf") format("truetype");
    font-weight: 400;
    font-display: swap;
}

:root {
    --bg:     #073B3A;
    --fg:     #F2ECDD;
    --border: #0B6E4F;
    --muted:  #9FC8B8;
    --muted-2: #DDB771;
    --muted-3: #CFE6DB;
    --surface: #0B6E4F;

    --tag-bg: #0B6E4F;
    --tag-fg: #DDB771;

    --blockquote-border: #08A045;
    --blockquote-fg:     #DDB771;

    --code-bg:        #052928;
    --inline-code-bg: #0B6E4F;

    --copy-btn-bg:     #0B6E4F;
    --copy-btn-border: #08A045;
    --copy-btn-fg:     #DDB771;
}

body {
    background: var(--bg);
    color: var(--fg);
    font-family: "Geosans", "Trebuchet MS", sans-serif;
    font-size: 19px;
    font-weight: 600;
}

a {
    color: #08A045;
    font-weight: 700;
}

a:hover {
    color: #DDB771;
}

.container {
    max-width: 760px;
}

/* Header & nav */
header {
    background: var(--border);
    border-bottom: none;
    padding: 1.25rem 20px;
}

.site-name {
    color: #fff;
    font-family: "U_condensed", "Geosans", sans-serif;
    font-size: 1.6rem;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

.nav-links a {
    color: var(--muted-2);
    font-weight: 700;
}

.nav-links a:hover {
    color: #fff;
}

.theme-btn,
.rss-btn {
    color: var(--muted-2);
    background: rgba(255, 255, 255, 0.08);
    border-radius: 9999px;
}

.theme-btn:hover,
.rss-btn:hover {
    color: #fff;
    background: #08A045;
}

/* Footer */
footer {
    border-top: 1px solid var(--border);
    color: var(--muted);
}

/* Hero */
.site-hero h1 {
    color: #fff;
    font-family: "U_condensed", "Geosans", sans-serif;
    letter-spacing: 0.02em;
}

.site-description {
    color: var(--muted-2);
    font-size: 1.05rem;
    font-weight: 600;
}

/* Search bar */
.search-bar__input,
.tag-select__control {
    background: var(--border);
    border: 1px solid #0f8560;
    color: var(--fg);
    border-radius: 0.75rem;
}

.search-bar__input::placeholder {
    color: var(--muted);
}

.search-bar__btn {
    background: #08A045;
    color: #fff;
    border-radius: 9999px;
    border: none;
}

.search-bar__btn:hover {
    background: #0bb84f;
}

.search-bar__sort,
.search-bar__clear {
    color: var(--muted-2);
}

.tag-select__menu {
    background: var(--border);
    border: 1px solid #0f8560;
}

.tag-select__item:hover {
    background: #08A045;
    color: #fff;
}

/* Post cards */
.post-card {
    background: var(--border);
    border-radius: 1.25rem;
    padding: 1.5rem 1.75rem;
    border: none;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15);
}

.post-card + .post-card {
    margin-top: 1rem;
}

.post-card__title a {
    color: #fff;
}

.post-card__title a:hover {
    color: var(--muted-2);
}

.post-card__excerpt {
    color: var(--muted-3);
    font-size: 1rem;
    font-weight: 600;
}

.post-card__meta {
    color: var(--muted);
    font-size: 0.9rem;
    font-weight: 600;
}

/* Tags */
.tag {
    background: rgba(221, 183, 113, 0.15);
    color: var(--muted-2);
    border: 1px solid rgba(221, 183, 113, 0.4);
    border-radius: 9999px;
    font-size: 0.85rem;
    font-weight: 700;
}

/* Pagination */
.pagination__btn {
    color: var(--muted-2);
}

.pagination__btn:hover {
    color: #fff;
}

.pagination__info {
    color: var(--muted);
}

/* Post detail */
.post-header__back {
    color: var(--muted-2);
    font-size: 0.95rem;
    font-weight: 600;
}

.post-header__back:hover {
    color: #fff;
}

.post-header__title {
    color: #fff;
    font-family: "U_condensed", "Geosans", sans-serif;
    letter-spacing: 0.01em;
}

.post-header__excerpt {
    color: var(--muted-3);
    font-size: 1.15rem;
    font-weight: 600;
}

.post-header__meta {
    color: var(--muted);
    font-size: 0.95rem;
    font-weight: 600;
}

.post-body {
    background: var(--border);
    border-radius: 1.25rem;
    padding: 2rem 2.25rem;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15);
    font-size: 1.05rem;
}

.post-body h1,
.post-body h2,
.post-body h3,
.post-body h4 {
    color: #fff;
    font-family: "U_condensed", "Geosans", sans-serif;
    letter-spacing: 0.01em;
}

.post-body a {
    color: #DDB771;
    text-decoration: underline;
}

.post-body a:hover {
    color: #fff;
}

.post-body strong {
    color: #fff;
}

.post-body blockquote {
    border-left: 3px solid var(--blockquote-border);
    color: var(--blockquote-fg);
}

/* 404 */
.not-found__code {
    color: var(--muted-2);
    font-family: "U_condensed", "Geosans", sans-serif;
}

.not-found__title {
    color: #fff;
}

.not-found__message {
    color: var(--muted-3);
}