/* ==========================================================================
   Grub — Main Stylesheet
   Variables, reset, fonts, base layout
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&family=Share+Tech+Mono&display=swap');

/* ---------- CSS Variables ---------- */
:root {
    /* UI Colors */
    --bg-dark: #1a1a2e;
    --bg-panel: #16213e;
    --bg-card: #0f3460;
    --text: #e0e0e0;
    --text-dim: #8899aa;
    --border: #2a2a4a;

    /* Accent Colors */
    --accent: #e63946;
    --green: #2a9d8f;
    --yellow: #e9c46a;
    --blue: #264653;
    --purple: #7209b7;
    --orange: #f4a261;

    /* Resource Colors */
    --wood: #8b6914;
    --stone: #708090;
    --metal: #4682b4;
    --hqm: #daa520;
    --scrap: #cd853f;
    --cloth: #c2b280;
    --bone: #f5f5dc;
    --animal-fat: #fffacd;
    --leather: #8b4513;

    /* Fonts */
    --font-pixel: 'Press Start 2P', monospace;
    --font-mono: 'Share Tech Mono', monospace;

    /* Discord */
    --discord: #5865F2;
    --discord-hover: #4752c4;
}

/* ---------- Reset ---------- */
*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    font-size: 16px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body {
    font-family: var(--font-mono);
    background-color: var(--bg-dark);
    color: var(--text);
    min-height: 100vh;
    line-height: 1.5;
}

img {
    image-rendering: pixelated;
    max-width: 100%;
}

a {
    color: var(--accent);
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

/* ---------- Utility ---------- */
.pixel-font {
    font-family: var(--font-pixel);
}

.mono-font {
    font-family: var(--font-mono);
}