:root {
    --bg: #0b0c0e;
    --panel: #14161a;
    --panel-2: #101216;

    --text: #d0d0d0;
    --muted: #8a8f98;

    --border: #262a30;

    --accent: #6b7cff;
    --danger: #d45a5a;
}

body {
    background: var(--bg);
    color: var(--text);

    margin: 0;
}

h1 {
    font-size: 2rem;
    font-weight: bold;
    margin: 0;
}

.btn {
    background: var(--accent);
    color: var(--text);

    border: 1px solid var(--border);
    border-radius: 6px;

    padding: 8px 14px;

    cursor: pointer;

    transition:
        background 0.15s ease,
        border-color 0.15s ease;
}

.btn:hover {
    background: color-mix(in srgb, var(--accent), white 10%);
    border-color: color-mix(in srgb, var(--border), white 15%);
}

.btn:active {
    transform: translateY(1px);
}