/* ============================================================ Plot Explorer — brand styling ported from kristianskorpen.com inverter-course (editorial paper aesthetic). ============================================================ */ @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Serif:ital,wght@0,400;0,500;0,600;0,700;1,400&family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;700&display=swap'); * { box-sizing: border-box; } /* HTML `hidden` attribute must always win over any class-level display rule. */ [hidden] { display: none !important; } :root { /* brand greens */ --green-50: #ECF6EE; --green-100: #D5EBD9; --green-200: #A8D6B0; --green-300: #7BC086; --green-500: #1F8A4C; --green-600: #166E3D; --green-700: #0E5630; /* ink scale */ --ink-900: #0E1413; --ink-700: #2E3633; --ink-500: #5A645F; --ink-400: #7B847F; --ink-300: #A8AEA9; --ink-200: #D6D9D4; --ink-150: #E6E5DE; --ink-100: #EFEDE5; --ink-50: #F7F5EE; --ink-25: #FAFAF6; --paper: #FFFFFF; --warn-500: #B04A1B; --warn-100: #FAEADD; --fg: var(--ink-900); --fg-soft: var(--ink-500); --fg-muted: var(--ink-400); --bg: var(--ink-25); --bg-card: var(--paper); --bg-paper: var(--ink-50); --bg-inset: var(--ink-100); --border: var(--ink-150); --border-strong:var(--ink-200); --accent: var(--green-500); --accent-hover: var(--green-600); --accent-soft: var(--green-50); --font-serif: "IBM Plex Serif", "Source Serif 4", Charter, Georgia, serif; --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; --font-mono: "JetBrains Mono", "SFMono-Regular", Menlo, Consolas, monospace; --radius-1: 4px; --radius-2: 6px; --radius-3: 8px; --radius-4: 12px; --shadow-1: 0 1px 2px rgba(10,15,13,0.04), 0 0 0 1px rgba(10,15,13,0.02); --shadow-2: 0 2px 6px rgba(10,15,13,0.06), 0 1px 2px rgba(10,15,13,0.04); --shadow-focus: 0 0 0 3px rgba(31,138,76,0.25); --dur-fast: 120ms; --dur-base: 180ms; } /* Scope to the explorer root only when standalone, so we don't override ,
,