fix: symmetric article gutters, Mintlify DOM retargeting, and light/dark theme audit

.github/workflows/validate-docs.yml

@@ -17,6 +17,9 @@ jobs:
       - name: Validate docs.json is valid JSON
         run: jq empty docs.json
 
+      - name: Validate snippet theme defaults
+        run: node scripts/check-snippet-theme-default.mjs
+
       - name: Verify all referenced pages exist
         run: |
           set -euo pipefail

AGENTS.md

@@ -1,4 +1,4 @@
 # Sei Docs — agent instructions
 
 ## About this project
 
@@ -18,7 +18,7 @@
 - Precompiles live at specific addresses — always reference exact address when mentioning
 - **Twin Turbo Consensus** and **parallelization engine** are proper nouns
 - Prefer "dApp" over "app" when the context is blockchain
 - Avoid "gas fees" — say "gas" or "transaction fees"
 
 ## Style preferences
 
@@ -33,6 +33,14 @@
 - Use `<Tabs>` / `<Tab>` for parallel code samples (hardhat vs. foundry, ethers vs. viem, etc.)
 - Always give `<CodeGroup>` blocks explicit language tags
 
+## Mintlify JSX styling
+
+- In `snippets/*.jsx` and rendered JSX in `.mdx` pages, write Tailwind utility lists as literal attributes. Prefer `className="..."`; static string and template expressions without interpolation are also extractor-safe.
+- Do not store utility lists in variables or assemble `className` dynamically. For conditional styling, use explicit JSX branches, inline styles, or a semantic data/class hook backed by `style.css`.
+- A component may forward the exact `className` prop when it destructures `className` in its parameters and every caller supplies a literal utility list.
+- Theme-aware snippets must seed hydration from `docs.json` `appearance.default` and synchronize the DOM theme in `useLayoutEffect`.
+- Run `node scripts/check-snippet-theme-default.mjs` after editing a theme-aware snippet.
+
 ## Content boundaries
 
 - Cosmos-SDK content is deprecated (see SIP-3) — keep the deprecation notice visible on `cosmos-sdk/index.mdx`
@@ -46,7 +54,7 @@
 
 All legacy paths from the Nextra site are preserved in `docs.json` under `redirects`. When renaming or moving a page, always add a matching redirect entry so external links and search results continue to resolve.
 
 ## llms.txt / llms-full.txt
 
 `llms.txt` and `llms-full.txt` at the repo root are hand-curated overrides for Mintlify's auto-generated versions. The script `scripts/generate-llms.mjs` reads `docs.json`, fetches each page's `.md` from the deployed site, and re-emits both files using the curated config block at the top of the script (project name, intro, constraints, quick reference, section overviews, examples, resources). A scheduled GitHub Action (`.github/workflows/regenerate-llms.yml`) runs this weekly and opens a PR when anything changed; trigger it manually via `workflow_dispatch` after large content updates if you don't want to wait. Edit the config block at the top of the script to update wording; do not hand-edit the generated `.txt` files.
 

CONTRIBUTING.md

@@ -30,3 +30,9 @@
 - **Lead with the goal**: Start instructions with what the user wants to accomplish
 - **Use consistent terminology**: Don't alternate between synonyms for the same concept
 - **Include examples**: Show, don't just tell
+
+## JSX styling
+
+Mintlify only generates Tailwind utilities it can extract from JSX. In `snippets/*.jsx` and rendered JSX in `.mdx` pages, keep class lists in literal attributes. Prefer `className="..."`; static string and template expressions without interpolation are also safe. Do not keep utility lists in variables or assemble `className` dynamically. Use explicit JSX branches, inline styles, or a semantic hook in `style.css` for conditional styles.
+
+For theme-aware snippets, run `node scripts/check-snippet-theme-default.mjs`.

evm/in-app-swaps.mdx

@@ -4,6 +4,8 @@
 description: 'Guide to integrating the Symphony swap widget into your Sei application for seamless token exchanges.'
 keywords: ['swap widget', 'in-app swaps', 'token exchange', 'dex integration', 'symphony']
 ---
+import { ThemeAwareIframe } from '/snippets/theme-aware-iframe.jsx';
+
 Integrating in-app swap functionality into your Sei application enables users to exchange tokens directly within your platform, enhancing user experience and engagement.
 
 ## Overview
@@ -15,33 +17,33 @@
 - **Revenue Opportunities**: Many providers offer fee-sharing mechanisms
 - **Cross-Chain Support**: Some widgets enable bridging assets from other chains
 
 ## Symphony Swap Widget
 
 [Symphony](https://symph.ag) is a native DEX aggregator on Sei, offering the simplest integration via iframe embedding.
 
 ### Quick Start
 
 ```html
 <iframe src="https://symph.ag/embed"></iframe>
 ```
 
 ### Live Demo
 
 <div style={{ display: 'flex', justifyContent: 'center' }}>
-  <iframe src="https://symph.ag/embed" style={{ width: '100%', maxWidth: '420px', minWidth: '377px', minHeight: '680px', border: 'none', borderRadius: '12px' }} title="Symphony Swap Widget Demo" />
+  <ThemeAwareIframe src="https://symph.ag/embed" style={{ width: '100%', maxWidth: '420px', minWidth: '377px', minHeight: '680px', border: 'none', borderRadius: '12px' }} loading="lazy" title="Symphony Swap Widget Demo" />
 </div>
 
 ### Size Requirements
 
 - **Minimum Width**: `377px`
 - **Minimum Height**: `650px` (recommended to prevent wallet modal scrolling)
 - **Optimal Height**: `680-685px`
 
 ### URL Parameters
 
 Customize the widget by appending query parameters:
 
 #### Token Selection
 
 | Parameter  | Description                   | Example                                               |
 | ---------- | ----------------------------- | ----------------------------------------------------- |
@@ -65,7 +67,7 @@
 | --------------- | ---------------------------- | --------------------------- |
 | `notifications` | Show/hide notification cards | `true` (default) or `false` |
 
 ### Complete Example
 
 <Tabs>
 <Tab title="HTML">
@@ -121,7 +123,7 @@
 </Tab>
 </Tabs>
 
 ### Popular Sei Token Addresses (Mainnet)
 
 | Token         | Address                                                                                                                  |
 | ------------- | ------------------------------------------------------------------------------------------------------------------------ |
@@ -131,9 +133,9 @@
 
 ---
 
 ## Best Practices
 
 ### Security Considerations
 
 <Warning>
 **Security Checklist**
@@ -142,7 +144,7 @@
 - ✅ Implement Content Security Policy (CSP) headers
 </Warning>
 
 ### Performance Optimization
 
 ```tsx
 // Lazy load swap widgets to improve initial page load
@@ -154,7 +156,7 @@
 });
 ````
 
 ### Responsive Design
 
 ```css
 /* Ensure swap widgets are responsive */
@@ -179,7 +181,7 @@
 }
 ```
 
 ### Error Handling
 
 ```tsx
 import { useState } from 'react';
@@ -204,6 +206,6 @@
 
 ---
 
 ## Additional Resources
 
 - [Symphony Swap Widget Documentation](https://docs.symph.ag/widget/symphony-swap-widget)

evm/index.mdx

@@ -5,7 +5,7 @@
 keywords: ["sei evm", "ethereum virtual machine", "web3 development", "blockchain development", "fast evm"]
 ---
 
 ## Why Choose Sei EVM?
 
 | Feature                    | Sei EVM       | Ethereum         | Other Layer 1s  |
 | -------------------------- | ------------- | ---------------- | --------------- |
@@ -19,7 +19,7 @@
   View detailed Ethereum comparison
 </Card>
 
 ## Quick Start
 
 <Steps>
   <Step title="Add Sei to Wallet">
@@ -36,7 +36,7 @@
   </Step>
 </Steps>
 
 ## Ready-to-Deploy Examples
 
 <CardGroup cols={3}>
   <Card horizontal title="EVM Contract Wizard" icon="wand-magic-sparkles" href="/evm/evm-wizard">
@@ -50,7 +50,7 @@
   </Card>
 </CardGroup>
 
 ## Development Tools
 
 <CardGroup cols={3}>
   <Card horizontal title="Deploy with Hardhat" icon="terminal" href="/evm/evm-hardhat">
@@ -64,7 +64,7 @@
   </Card>
 </CardGroup>
 
 ## Use Cases
 
 <CardGroup cols={3}>
   <Card horizontal title="x402 Payments" icon="credit-card" href="/ai/x402">
@@ -78,7 +78,7 @@
   </Card>
 </CardGroup>
 
 ## RPC Endpoints
 
 Choose from official Sei Foundation endpoints or community-maintained alternatives. All endpoints support standard EVM JSON-RPC methods. Public endpoints have rate limits — for production apps, use a [dedicated RPC provider](/learn/rpc-providers) or [run your own node](/node).
 
@@ -86,19 +86,19 @@
   <Tab title="Sei Mainnet">
     | Endpoint | Provider | Type | Rate limit | Notes |
     | --- | --- | --- | --- | --- |
-    | `https://evm-rpc.sei-apis.com` | Sei Foundation | <span style={{ backgroundColor: 'rgba(34,197,94,0.15)', color: '#16a34a', padding: '0.125rem 0.5rem', borderRadius: '9999px', fontSize: '0.75rem', fontWeight: 600 }}>public</span> | 10 req/s | Recommended for development |
-    | `https://evm-rpc-sei.stingray.plus` | Staketab | <span style={{ backgroundColor: 'rgba(34,197,94,0.15)', color: '#16a34a', padding: '0.125rem 0.5rem', borderRadius: '9999px', fontSize: '0.75rem', fontWeight: 600 }}>public</span> | — | Community maintained |
-    | `https://sei-evm-rpc.publicnode.com` | PublicNode | <span style={{ backgroundColor: 'rgba(34,197,94,0.15)', color: '#16a34a', padding: '0.125rem 0.5rem', borderRadius: '9999px', fontSize: '0.75rem', fontWeight: 600 }}>public</span> | 5 req/s | Community maintained |
-    | `https://seievm-rpc.polkachu.com` | Polkachu | <span style={{ backgroundColor: 'rgba(34,197,94,0.15)', color: '#16a34a', padding: '0.125rem 0.5rem', borderRadius: '9999px', fontSize: '0.75rem', fontWeight: 600 }}>public</span> | — | Community maintained |
-    | `https://jsonrpc.lavenderfive.com:443/sei` | LavenderFive | <span style={{ backgroundColor: 'rgba(34,197,94,0.15)', color: '#16a34a', padding: '0.125rem 0.5rem', borderRadius: '9999px', fontSize: '0.75rem', fontWeight: 600 }}>public</span> | — | Community maintained |
+    | `https://evm-rpc.sei-apis.com` | Sei Foundation | <span className="rounded-full px-2 py-0.5 text-xs font-semibold bg-green-500/15 text-green-800 dark:text-green-400">public</span> | 10 req/s | Recommended for development |
+    | `https://evm-rpc-sei.stingray.plus` | Staketab | <span className="rounded-full px-2 py-0.5 text-xs font-semibold bg-green-500/15 text-green-800 dark:text-green-400">public</span> | — | Community maintained |
+    | `https://sei-evm-rpc.publicnode.com` | PublicNode | <span className="rounded-full px-2 py-0.5 text-xs font-semibold bg-green-500/15 text-green-800 dark:text-green-400">public</span> | 5 req/s | Community maintained |
+    | `https://seievm-rpc.polkachu.com` | Polkachu | <span className="rounded-full px-2 py-0.5 text-xs font-semibold bg-green-500/15 text-green-800 dark:text-green-400">public</span> | — | Community maintained |
+    | `https://jsonrpc.lavenderfive.com:443/sei` | LavenderFive | <span className="rounded-full px-2 py-0.5 text-xs font-semibold bg-green-500/15 text-green-800 dark:text-green-400">public</span> | — | Community maintained |
   </Tab>
   <Tab title="Sei Testnet">
     | Endpoint | Provider | Type | Rate limit | Notes |
     | --- | --- | --- | --- | --- |
-    | `https://evm-rpc-testnet.sei-apis.com` | Sei Foundation | <span style={{ backgroundColor: 'rgba(34,197,94,0.15)', color: '#16a34a', padding: '0.125rem 0.5rem', borderRadius: '9999px', fontSize: '0.75rem', fontWeight: 600 }}>public</span> | 20 req/s | Recommended for testing |
-    | `https://evm-rpc-testnet-sei.stingray.plus` | Staketab | <span style={{ backgroundColor: 'rgba(34,197,94,0.15)', color: '#16a34a', padding: '0.125rem 0.5rem', borderRadius: '9999px', fontSize: '0.75rem', fontWeight: 600 }}>public</span> | — | Community maintained |
-    | `https://seievm-testnet-rpc.polkachu.com` | Polkachu | <span style={{ backgroundColor: 'rgba(34,197,94,0.15)', color: '#16a34a', padding: '0.125rem 0.5rem', borderRadius: '9999px', fontSize: '0.75rem', fontWeight: 600 }}>public</span> | — | Community maintained |
-    | `https://sei-testnet.drpc.org` | dRPC | <span style={{ backgroundColor: 'rgba(34,197,94,0.15)', color: '#16a34a', padding: '0.125rem 0.5rem', borderRadius: '9999px', fontSize: '0.75rem', fontWeight: 600 }}>public</span> | — | Community maintained |
+    | `https://evm-rpc-testnet.sei-apis.com` | Sei Foundation | <span className="rounded-full px-2 py-0.5 text-xs font-semibold bg-green-500/15 text-green-800 dark:text-green-400">public</span> | 20 req/s | Recommended for testing |
+    | `https://evm-rpc-testnet-sei.stingray.plus` | Staketab | <span className="rounded-full px-2 py-0.5 text-xs font-semibold bg-green-500/15 text-green-800 dark:text-green-400">public</span> | — | Community maintained |
+    | `https://seievm-testnet-rpc.polkachu.com` | Polkachu | <span className="rounded-full px-2 py-0.5 text-xs font-semibold bg-green-500/15 text-green-800 dark:text-green-400">public</span> | — | Community maintained |
+    | `https://sei-testnet.drpc.org` | dRPC | <span className="rounded-full px-2 py-0.5 text-xs font-semibold bg-green-500/15 text-green-800 dark:text-green-400">public</span> | — | Community maintained |
   </Tab>
 </Tabs>