| * { | |
| box-sizing: border-box; | |
| padding: 0; | |
| margin: 0; | |
| font-family: sans-serif; | |
| } | |
| html, | |
| body { | |
| height: 100%; | |
| } | |
| body { | |
| background: rgb(21 21 21); | |
| padding: 32px; | |
| font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif; | |
| color: #ccc; | |
| line-height: 1.5; | |
| font-size: 16px; | |
| font-weight: 400; | |
| } | |
| body iframe { | |
| border: none; | |
| overflow: hidden; | |
| } | |
| .header { | |
| max-width: 600px; | |
| margin: 0 auto; | |
| text-align: center; | |
| margin-bottom: 32px; | |
| } | |
| .header p { | |
| color: #ccc; | |
| margin-bottom: 16px; | |
| } | |
| .demo-header { | |
| max-width: 800px; | |
| margin: 0 auto; | |
| text-align: left; | |
| margin-bottom: 32px; | |
| } | |
| .demo-header p { | |
| color: #ccc; | |
| margin-bottom: 16px; | |
| } | |
| .demo-header strong { | |
| display: block; | |
| text-align: left; | |
| margin-bottom: 8px; | |
| } | |
| .button { | |
| display: inline-flex; | |
| align-items: center; | |
| justify-content: center; | |
| padding: 12px 24px; | |
| border-radius: 9999px; | |
| background: #ea580c; | |
| color: #fff; | |
| font-size: 16px; | |
| font-weight: 600; | |
| text-decoration: none; | |
| gap: 8px; | |
| } | |
| .body { | |
| max-width: 1200px; | |
| margin: 0 auto; | |
| } | |
| .demo { | |
| margin-bottom: 16px; | |
| } | |
| .demo strong { | |
| display: block; | |
| margin-bottom: 8px; | |
| } | |
| .disclaimer { | |
| margin-top: 8px; | |
| color: #777; | |
| font-size: 14px; | |
| text-align: center; | |
| font-weight: 400; | |
| line-height: 1.5; | |
| margin-bottom: 32px; | |
| } |