:root {
    --kamiina-ember: #ff7a18;
    --kamiina-coal: #1f2328;
}

.bg-coal {
    background: var(--kamiina-coal);
}

.text-ember {
    color: var(--kamiina-ember);
}

.btn-ember {
    background: var(--kamiina-ember);
    border-color: var(--kamiina-ember);
    color: #111;
}

    .btn-ember:hover {
        filter: brightness(0.95);
    }

.hero {
    background: radial-gradient(1200px 600px at 20% 10%, rgba(255,122,24,.20), transparent 60%),
        radial-gradient(800px 400px at 80% 30%, rgba(255,255,255,.10), transparent 60%),
        linear-gradient(180deg, #0b0d10 0%, #12161c 100%);
}

.soft-border {
    border: 1px solid rgba(255,255,255,.10);
}

.muted {
    color: rgba(255,255,255,.70);
}

.code-block {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    font-size: .85rem;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.12);
    border-radius: .5rem;
    padding: .75rem 1rem;
    white-space: pre-wrap;
    overflow-x: auto;
}

.codechip {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    font-size: .9rem;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.12);
    border-radius: .5rem;
    padding: .15rem .5rem;
}