/**
 * Nirmana design system (shared tokens + opt-in subpage shell).
 * Source of truth: /design.md — load from subsites with href="../css/nirmana-system.css"
 * before the page’s main stylesheet so local themes may override.
 */

:root {
    /* Surfaces (home: phase ball / whirlpool) */
    --nir-void: #0a0506;
    --nir-void-elev: #140a0c;
    --nir-void-deep: #080303;
    --nir-crimson-mid: #1a0c0c;
    --nir-ink: #e8ddd4;
    --nir-ink-muted: #c4b8a6;
    --nir-ink-dim: #a69b89;
    --nir-ink-faint: #8a7f6f;
    /* Lines / rail (outline, no fill) */
    --nir-rail: rgba(166, 155, 137, 0.35);
    --nir-rail-hover: rgba(200, 185, 170, 0.55);
    --nir-crimson-line: rgba(90, 22, 28, 0.55);
    /* Typography (pairing) */
    --nir-serif: "EB Garamond", "Cormorant Garamond", Georgia, serif;
    --nir-mono: "JetBrains Mono", ui-monospace, monospace;
    /* Background recipes */
    --nir-bg-solid: var(--nir-void);
    --nir-bg-radial-home: radial-gradient(
        ellipse 130% 100% at 50% 35%,
        var(--nir-crimson-mid) 0%,
        #0c0404 45%,
        var(--nir-void-deep) 100%
    );
    /* Spacing */
    --nir-pad-x: clamp(1rem, 3vw, 1.75rem);
    --nir-pad-y: clamp(1.25rem, 3.5vh, 2.25rem);
    --nir-measure: 44rem;
}

/* Consistent back link to home (matches rail outline treatment) */
.nir-back {
    font-family: var(--nir-mono);
    font-size: 0.75rem;
    font-weight: 500;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--nir-ink-faint);
    text-decoration: none;
    display: inline-block;
    margin-bottom: 2rem;
    border-bottom: 1px solid var(--nir-rail);
    padding-bottom: 0.2rem;
    transition: color 0.2s ease, border-color 0.2s ease;
}
button.nir-back {
    appearance: none;
    background: transparent;
    border: none;
    border-bottom: 1px solid var(--nir-rail);
    cursor: pointer;
}

.nir-back:hover,
.nir-back:focus-visible {
    color: var(--nir-ink-muted);
    border-bottom-color: var(--nir-rail-hover);
    outline: none;
}

/* Optional: subpages that should match home typography + void without replacing bespoke layouts */
html.nirmana-sub {
    /* Top hairline: ties subsites to home chrome without covering content */
    border-top: 1px solid var(--nir-crimson-line);
    box-sizing: border-box;
}
html.nirmana-sub body {
    font-family: var(--nir-serif);
    background: var(--nir-bg-solid);
    color: var(--nir-ink-muted);
    min-height: 100vh;
    min-height: 100dvh;
    line-height: 1.5;
}

/* Heavier mood (whirlpool-like field) for marketing shells */
html.nirmana-sub--field body {
    background: var(--nir-bg-radial-home);
    color: var(--nir-ink-dim);
}

/* Panel / callout: outline frame like nav rail */
.nir-panel {
    border: 1px solid var(--nir-rail);
    padding: 1.25rem 1.4rem;
    max-width: var(--nir-measure);
}
.nir-panel h2,
.nir-panel h3 {
    font-family: var(--nir-mono);
    font-size: 0.72rem;
    font-weight: 500;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--nir-ink-faint);
    margin-bottom: 0.5rem;
}

@media (prefers-reduced-motion: reduce) {
    .nir-back,
    .nir-panel {
        transition: none;
    }
}