@font-face {
    font-family: "Fraunces";
    src: url("/assets/fonts/Fraunces-Display-Regular.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Fraunces";
    src: url("/assets/fonts/Fraunces-Display-SemiBold.ttf") format("truetype");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Manrope";
    src: url("/assets/fonts/Manrope-Regular.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Manrope";
    src: url("/assets/fonts/Manrope-Medium.ttf") format("truetype");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Manrope";
    src: url("/assets/fonts/Manrope-Bold.ttf") format("truetype");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Manrope";
    src: url("/assets/fonts/Manrope-ExtraBold.ttf") format("truetype");
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "JetBrains Mono";
    src: url("/assets/fonts/JetBrainsMono-Regular.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "JetBrains Mono";
    src: url("/assets/fonts/JetBrainsMono-Bold.ttf") format("truetype");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

:root {
    --fk-slate-base: #0f1012;
    --fk-slate-800: #1a1c20;
    --fk-slate-700: #26282e;
    --fk-gold: #d4b16a;
    --fk-gold-bright: #e4c889;
    --fk-white: #fbfbfb;
    --fk-muted: #8a8e96;
    --fk-bg: var(--fk-slate-base);
    --fk-surface: var(--fk-slate-800);
    --fk-border: var(--fk-slate-700);
    --fk-text: var(--fk-white);
    --fk-text-muted: var(--fk-muted);
    --fk-accent: var(--fk-gold);
    --fk-accent-hover: var(--fk-gold-bright);

    --fk-font-display: "Fraunces", Georgia, serif;
    --fk-font-body: "Manrope", Inter, -apple-system, "Segoe UI", sans-serif;
    --fk-font-mono: "JetBrains Mono", ui-monospace, Menlo, monospace;

    --fk-space-1: 4px;
    --fk-space-2: 8px;
    --fk-space-3: 12px;
    --fk-space-4: 16px;
    --fk-space-5: 24px;
    --fk-space-6: 32px;
    --fk-space-7: 48px;
    --fk-space-8: 64px;
    --fk-radius-lg: 16px;
    --fk-radius-md: 10px;
}

* {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    min-height: 100%;
}

body {
    min-height: 100svh;
    background:
        radial-gradient(circle at 12% -10%, rgba(228, 200, 137, 0.22), transparent 32%),
        radial-gradient(circle at 85% 12%, rgba(212, 177, 106, 0.12), transparent 30%),
        var(--fk-bg);
    color: var(--fk-text);
    font:
        400 13px/1.55 var(--fk-font-body);
    -webkit-font-smoothing: antialiased;
}

.fk-wordmark {
    font:
        600 1em/1 var(--fk-font-display);
    white-space: nowrap;
}

.fk-wordmark .fob {
    color: var(--fk-gold);
}

.fk-wordmark .kit {
    color: var(--fk-white);
}

a {
    color: var(--fk-text);
    text-underline-offset: 0.22em;
}