:root { color-scheme: dark; } html, body { margin: 0; background: #09090b; color: #ffffff; font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; } #root { display: none; } .nojs { min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; } .nojs-header, .nojs-footer { border-color: #27272a; border-style: solid; padding: 16px 24px; } .nojs-header { border-width: 0 0 1px 0; } .nojs-footer { border-width: 1px 0 0 0; color: #a1a1aa; font-size: 0.875rem; } .nojs-header-inner, .nojs-footer-inner { max-width: 72rem; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 16px; } .nojs-brand { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; font-size: 1.125rem; } .nojs-brand img { height: 32px; width: 32px; } .nojs-footer-brand { display: inline-flex; align-items: center; gap: 8px; } .nojs-footer-brand img { height: 16px; width: 16px; } .nojs-main { flex: 1; display: flex; align-items: center; justify-content: center; padding: 80px 16px; } .nojs-card { width: 100%; max-width: 28rem; text-align: center; } .nojs-icon { margin: 0 auto 24px; display: flex; height: 64px; width: 64px; align-items: center; justify-content: center; border-radius: 16px; background: rgba(24, 24, 27, 0.8); border: 1px solid #27272a; } .nojs-icon img { height: 32px; width: 32px; } .nojs-title { margin: 0 0 8px; font-size: 1.875rem; font-weight: 700; letter-spacing: -0.025em; line-height: 1.15; } .nojs-subtitle { margin: 0 0 32px; color: #a1a1aa; font-size: 0.875rem; line-height: 1.6; } .nojs-panel { background: rgba(24, 24, 27, 0.5); border: 1px solid #27272a; border-radius: 1rem; padding: 24px; text-align: left; } .nojs-label { display: block; margin: 0 0 8px; font-size: 0.75rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: #a1a1aa; } .nojs-panel p { margin: 0 0 20px; font-size: 0.9375rem; line-height: 1.6; color: #d4d4d8; } .nojs-actions { display: flex; flex-direction: column; gap: 8px; } .nojs-btn { display: inline-flex; align-items: center; justify-content: center; height: 44px; padding: 0 20px; border-radius: 0.5rem; font-size: 0.875rem; font-weight: 700; text-decoration: none; transition: opacity 120ms ease; border: 1px solid transparent; } .nojs-btn:hover { opacity: 0.9; } .nojs-btn-primary { background: #5dbd4e; color: #000000; } .nojs-btn-ghost { background: transparent; color: #a1a1aa; border-color: #27272a; } .nojs-btn-ghost:hover { color: #ffffff; opacity: 1; } .nojs-footer-links { display: flex; gap: 24px; } .nojs-footer-links a { color: inherit; text-decoration: none; } .nojs-footer-links a:hover { color: #ffffff; } @media (max-width: 640px) { .nojs-footer-inner { flex-direction: column; gap: 12px; } .nojs-title { font-size: 1.625rem; } }

Fractura

JavaScript is turned off

Fractura needs JavaScript to load your workspace.

What to do

Enable JavaScript in your browser settings, then reload this page. If you're not sure how, the guide below walks through it for every major browser.

Learn how to enable JavaScript Reload page