:root {
    --bg: #ece7da;
    --ink: #101211;
    --paper: #fffaf0;
    --mut: #696b64;
    --red: #d63e2f;
    --acid: #d7ff44;
    --blue: #263cff;
    --line: #101211;
    --mx: 50vw;
    --my: 30vh;
    --max: 1180px;
}

* { box-sizing: border-box; }

html {
    scroll-behavior: smooth;
    background: var(--bg);
    color: var(--ink);
}

body {
    margin: 0;
    min-height: 100vh;
    font-family: Arial, Helvetica, sans-serif;
    letter-spacing: 0;
    overflow-x: hidden;
    cursor: crosshair;
    background:
        radial-gradient(circle at var(--mx) var(--my), #d7ff4438, transparent 260px),
        linear-gradient(135deg, #ece7da, #f7f0de 44%, #dde4ff);
}

a { color: inherit; text-decoration: none; }
button, input, textarea { font: inherit; }

.cv,
.grain {
    position: fixed;
    inset: 0;
    pointer-events: none;
}

.cv { z-index: 0; opacity: .34; }

.grain {
    z-index: 30;
    opacity: .16;
    mix-blend-mode: multiply;
    background-image: radial-gradient(#111 1px, transparent 1px);
    background-size: 13px 13px;
}

main,
.top,
footer {
    position: relative;
    z-index: 2;
}
