/* ===== Zero Sanity Studios — global theme ===== */
:root {
    --bg: #08060f;
    --ink: #e9bff;
    --neon: #b026ff;
    --acid: #39ff14;
    --blood: #ff2d55;
    --bone: #f3f0ff;
    --cyan: #21f0ff;
}

* { box-sizing: border-box; }

html, body {
    margin: 0;
    padding: 0;
    background: var(--bg);
    color: var(--bone);
    font-family: 'Space Grotesk', system-ui, sans-serif;
    overflow-x: hidden;
    scroll-behavior: smooth;
    cursor: crosshair;
}

/* faint CRT scanlines + vignette over everything */
body::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 9998;
    background:
        repeating-linear-gradient(0deg, rgba(0,0,0,0.18) 0 1px, transparent 1px 3px),
        radial-gradient(circle at 50% 40%, transparent 55%, rgba(0,0,0,0.6) 100%);
    mix-blend-mode: multiply;
}

a { color: var(--cyan); text-decoration: none; }

/* the hero <h1> is auto-focused on load (FocusOnNavigate) — hide the focus ring */
h1:focus, h1:focus-visible, [tabindex]:focus, [tabindex]:focus-visible { outline: none; }

::selection { background: var(--neon); color: #fff; }

/* ===== Boot / loading screen ===== */
.boot {
    position: fixed;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    background: var(--bg);
    color: var(--neon);
}
.boot-glyph { font-size: 4rem; animation: bootPulse 1.1s ease-in-out infinite; }
.boot-text {
    font-family: 'VT323', monospace;
    font-size: 1.6rem;
    letter-spacing: 0.2em;
    color: var(--acid);
    text-transform: uppercase;
}
@keyframes bootPulse {
    0%, 100% { transform: scale(1) rotate(-4deg); opacity: 0.5; filter: drop-shadow(0 0 4px var(--neon)); }
    50% { transform: scale(1.25) rotate(4deg); opacity: 1; filter: drop-shadow(0 0 22px var(--neon)); }
}

#blazor-error-ui {
    background: #1a0a12;
    color: #ffb3c1;
    bottom: 0;
    box-shadow: 0 -1px 12px rgba(255,45,85,0.5);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}
#blazor-error-ui .dismiss { cursor: pointer; position: absolute; right: 0.75rem; top: 0.5rem; }
.blazor-error-boundary { background: #b32121; padding: 1rem; color: white; }
.blazor-error-boundary::after { content: "A friendly glitch appeared."; }
