/* ========================================================================== nxt-ig.css — Nxtcure internal docs design system -------------------------------------------------------------------------- One stylesheet shared by every surface: the dynamic admin screens compiled per request by adminapp.py, the statically compiled wiki documents, and the login page. The typst sources cannot import across directories (compile_html.sh forbids `../`), so the shared look lives here and each htmllib.typ links it by absolute url instead of duplicating the css. Theming is driven by [data-theme] on , set before first paint by the inline boot snippet each htmllib.typ emits, and toggled by nxt-theme.js. Everything below is expressed in custom properties so light and dark are the same rules with a different palette. ========================================================================== */ /* ---------- palette ------------------------------------------------------ */ :root, [data-theme="dark"] { --nxt-canvas: #000000; --nxt-surface: #121212; --nxt-raised: #1c1c1e; --nxt-nav-bg: #000000; --nxt-input-bg: #121212; --nxt-hairline: #262626; --nxt-hairline-strong: #3a3a3a; --nxt-text: #f5f5f5; --nxt-muted: #a8a8a8; --nxt-faint: #737373; --nxt-primary: #0095f6; --nxt-primary-hover: #1877f2; --nxt-danger: #ed4956; --nxt-success: #2fb457; --nxt-warning: #e5a600; --nxt-hover: rgba(255, 255, 255, 0.06); --nxt-active: rgba(255, 255, 255, 0.1); --nxt-shadow: 0 4px 16px rgba(0, 0, 0, 0.55); --nxt-code-bg: #1c1c1e; color-scheme: dark; } [data-theme="light"] { --nxt-canvas: #fafafa; --nxt-surface: #ffffff; --nxt-raised: #ffffff; --nxt-nav-bg: #ffffff; --nxt-input-bg: #fafafa; --nxt-hairline: #dbdbdb; --nxt-hairline-strong: #c7c7c7; --nxt-text: #262626; --nxt-muted: #8e8e8e; --nxt-faint: #a8a8a8; --nxt-primary: #0095f6; --nxt-primary-hover: #1877f2; --nxt-danger: #ed4956; --nxt-success: #1f9d4f; --nxt-warning: #b57e00; --nxt-hover: rgba(0, 0, 0, 0.05); --nxt-active: rgba(0, 0, 0, 0.08); --nxt-shadow: 0 4px 16px rgba(0, 0, 0, 0.08); --nxt-code-bg: #f1f1f1; color-scheme: light; } :root { /* the instagram brand sweep, used sparingly: wordmark, avatar rings, accents */ --nxt-gradient: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888); --nxt-nav-w: 245px; --nxt-nav-w-collapsed: 72px; --nxt-bottombar-h: 52px; --nxt-radius: 12px; --nxt-radius-sm: 8px; --nxt-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"; --nxt-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace; } /* ---------- base --------------------------------------------------------- */ html { background: var(--nxt-canvas); } body { margin: 0; background: var(--nxt-canvas); color: var(--nxt-text); font-family: var(--nxt-font); font-size: 14px; line-height: 1.5; -webkit-font-smoothing: antialiased; } /* typst's html export opens the body with a paragraph holding the and