/* ─── Notulee brand palette ────────────────────────────────────────────────── Single source of truth for brand colour (ahead of a proper design system / site). The three anchors are taken straight from the app icon (icons/svg/icon.svg): • purple tile #4F46E5 • orange macron #F59E0B • white glyph #FFFFFF Tweak the anchors and everything that references them follows. The -soft / -deep steps are derived (indigo & amber families) for glows, gradients, hovers & borders. Theme-independent — same in light and dark. */ :root { --notulee-purple: #4F46E5; /* brand primary */ --notulee-orange: #F59E0B; /* brand accent */ --notulee-white: #FFFFFF; --notulee-purple-soft: #818CF8; /* lighter — glows, ripples, highlights on dark */ --notulee-purple-deep: #4338CA; /* darker — hover / pressed / shadow tint */ --notulee-orange-soft: #FBBF24; /* lighter */ --notulee-orange-deep: #D97706; /* darker */ } :root, :root[data-theme="dark"] { color-scheme: dark; --app-bg: #0e0e11; --app-chrome: #16161a; --app-fg: #e7e7ea; --app-muted: #9aa0aa; --app-border: #2a2a30; --app-accent: #93c5fd; } /* The page background follows the in-app theme (set on by the shell). */ :root[data-theme="light"] { color-scheme: light; --app-bg: #fdfdfc; --app-chrome: #f3f3f2; --app-fg: #1b1b1f; --app-muted: #6b6b73; --app-border: #e4e4e7; --app-accent: #2563eb; } @media (prefers-color-scheme: light) { :root[data-theme="system"] { color-scheme: light; --app-bg: #fdfdfc; --app-chrome: #f3f3f2; --app-fg: #1b1b1f; --app-muted: #6b6b73; --app-border: #e4e4e7; --app-accent: #2563eb; } } * { box-sizing: border-box; } html, body { margin: 0; height: 100%; font-family: "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif; background: var(--app-bg); color: var(--app-fg); } #app, .app-shell { height: 100%; } .app-shell { height: 100vh; } a { color: var(--app-accent); } #blazor-error-ui { color-scheme: light; background: #fff4d6; color: #4a3a00; bottom: 0; box-shadow: 0 -1px 4px rgba(0, 0, 0, 0.3); display: none; left: 0; padding: 0.6rem 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: "An error has occurred."; }