html, body {
    margin: 0;
    background: #0F141C;
    color: #E6EDF5;
    font-family: Roboto, Helvetica, Arial, sans-serif;
}

/* Subtle brand gradient behind the glassy surfaces, like the portals. */
body::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    background:
        radial-gradient(1200px 600px at 15% -10%, rgba(0,160,227,0.18), transparent 60%),
        radial-gradient(1000px 500px at 100% 0%, rgba(51,183,236,0.10), transparent 55%),
        #0F141C;
}

#blazor-error-ui {
    position: fixed;
    bottom: 0; left: 0; right: 0;
    background: #E8A13A;
    color: #171E26;
    padding: 0.6rem 1.2rem;
    display: none;
    z-index: 1000;
}
#blazor-error-ui .dismiss { cursor: pointer; float: right; }

/* ---- Rendered Markdown article body ---- */
.docs-body { font-size: 1rem; line-height: 1.7; color: #D7E0EA; }
.docs-body h2 { margin: 1.8rem 0 0.6rem; font-weight: 600; font-size: 1.5rem; color: #E6EDF5; }
.docs-body h3 { margin: 1.4rem 0 0.4rem; font-weight: 600; font-size: 1.2rem; color: #E6EDF5; }
.docs-body h4 { margin: 1.2rem 0 0.3rem; font-weight: 600; color: #E6EDF5; }
.docs-body p { margin: 0.6rem 0; }
.docs-body ul, .docs-body ol { margin: 0.6rem 0 0.6rem 1.4rem; }
.docs-body li { margin: 0.25rem 0; }
.docs-body a { color: #33B7EC; text-decoration: none; }
.docs-body a:hover { text-decoration: underline; }
.docs-body code {
    background: rgba(255,255,255,0.08);
    padding: 0.1rem 0.4rem;
    border-radius: 5px;
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
    font-size: 0.9em;
}
.docs-body pre {
    background: rgba(0,0,0,0.35);
    border: 1px solid rgba(255,255,255,0.10);
    border-radius: 8px;
    padding: 0.9rem 1.1rem;
    overflow-x: auto;
}
.docs-body pre code { background: none; padding: 0; }
.docs-body blockquote {
    margin: 0.8rem 0;
    padding: 0.4rem 1rem;
    border-left: 3px solid #00A0E3;
    background: rgba(0,160,227,0.08);
    color: #C6D2DE;
}
.docs-body table { border-collapse: collapse; margin: 1rem 0; width: 100%; }
.docs-body th, .docs-body td { border: 1px solid rgba(255,255,255,0.14); padding: 0.5rem 0.7rem; text-align: left; }
.docs-body th { background: rgba(255,255,255,0.05); }
.docs-body img { max-width: 100%; border-radius: 8px; }
.docs-body hr { border: none; border-top: 1px solid rgba(255,255,255,0.12); margin: 1.5rem 0; }