:root{--surface-void: #05080b;--surface-plate: #0b1219;--surface-active: #122636;--surface-hairline: #1c2c38;--ink-bright: #eaf3f9;--ink-primary: #cddbe4;--ink-muted: #63798a;--ink-dim: #456174;--signal-ice: #9fd0ee;--signal-vent: #d8933f;--signal-fault: #c9705c;--signal-plumae: #46d39a;--accent-plumae-deep: #123028;--accent-plumae-pale: #a8f2d6;--accent-slate: #2b4356;--accent-slate-bright: #3f5a6b;--space-xs: 4px;--space-sm: 8px;--space-md: 12px;--space-lg: 16px;--space-xl: 24px;--font-sans: "IBM Plex Sans", system-ui, -apple-system, sans-serif;--font-mono: "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;font-family:var(--font-sans);font-size:10.5px;line-height:1.35;color:var(--ink-primary);background-color:var(--surface-void);color-scheme:dark;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;padding:0;width:100%;height:100vh;height:100dvh;overflow:hidden;background:var(--surface-void)}.console-shell{height:100vh;height:100dvh}*,*:before,*:after{border-radius:0;box-sizing:border-box}.readout,.num{font-family:var(--font-mono);font-variant-numeric:tabular-nums}.panel-label{font-family:var(--font-sans);font-weight:600;font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-muted)}.plate{background:var(--surface-plate);border:1px solid var(--surface-hairline)}a{color:var(--signal-ice);text-decoration:inherit}button{border:1px solid var(--surface-hairline);padding:var(--space-xs) var(--space-sm);font-family:var(--font-sans);font-size:10.5px;font-weight:500;color:var(--ink-primary);background-color:var(--surface-plate);cursor:pointer}button:hover:not(:disabled){background-color:var(--surface-active);border-color:var(--accent-slate-bright)}button:disabled{color:var(--ink-dim);cursor:default}button:focus-visible{outline:1px solid var(--signal-ice);outline-offset:1px}#root{width:100%;height:100%;margin:0;padding:0;overflow:hidden}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media(prefers-reduced-motion:no-preference){a:nth-of-type(2) .logo{animation:logo-spin infinite 20s linear}}.card{padding:2em}.read-the-docs{color:#888}