*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:#1f2937;background:#f8fafc;line-height:1.55}
a{color:#2563eb;text-decoration:none}
a:hover{text-decoration:underline}
code{font-family:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.92em;background:#eef2ff;padding:2px 6px;border-radius:4px;color:#1e3a8a}

.site-header{display:flex;align-items:center;justify-content:space-between;padding:18px 32px;background:#fff;border-bottom:1px solid #e5e7eb}
.site-header .brand img{display:block}
.site-header nav a{margin-left:24px;color:#374151;font-weight:500}
.site-header nav a:hover{color:#2563eb;text-decoration:none}
.lang-switch{margin-left:24px;font-size:.88rem;color:#64748b}
.lang-switch a{margin-left:8px;color:#64748b;text-transform:uppercase;letter-spacing:.04em}
.lang-switch .lang-active{margin-left:8px;color:#0f172a;font-weight:600;text-transform:uppercase;letter-spacing:.04em}
.upgrade-card{text-align:center}
.upgrade-card .lede{margin:16px auto 28px;max-width:580px}

main{max-width:1080px;margin:0 auto;padding:48px 32px}

.hero{text-align:center;padding:48px 0 24px}
.hero h1{font-size:2.4rem;margin:0 0 12px;color:#0f172a;letter-spacing:-.02em}
.hero .lede{font-size:1.2rem;color:#475569;max-width:640px;margin:0 auto 32px}
.cta-row{display:flex;gap:12px;justify-content:center}

.btn{display:inline-block;padding:12px 22px;border-radius:8px;font-weight:600;font-size:.98rem;border:1px solid transparent;cursor:pointer}
.btn.primary{background:#2563eb;color:#fff}
.btn.primary:hover{background:#1d4ed8;text-decoration:none}
.btn.ghost{background:transparent;color:#1d4ed8;border-color:#cbd5e1}
.btn.ghost:hover{background:#eff6ff;text-decoration:none}

.features{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;margin:48px 0}
.card{background:#fff;border:1px solid #e5e7eb;border-radius:10px;padding:20px}
.card h3{margin:0 0 8px;font-size:1.05rem;color:#0f172a}
.card p{margin:0;color:#475569;font-size:.95rem}

.lede-block{background:#fff;border-radius:12px;padding:32px;border:1px solid #e5e7eb}
.lede-block h2{margin-top:0}
.steps{padding-left:20px;color:#374151}
.steps li{margin:8px 0}

.form-card{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:32px;max-width:680px;margin:0 auto}
.form-card h1{margin:0 0 8px;color:#0f172a}
.form-card .lede{color:#475569;margin-bottom:24px}
.stack{display:flex;flex-direction:column;gap:16px}
.stack label{display:flex;flex-direction:column;font-weight:600;color:#1f2937;font-size:.92rem}
.stack input,.stack textarea{margin-top:6px;padding:10px 12px;border:1px solid #cbd5e1;border-radius:8px;font:inherit;color:#0f172a;background:#fff}
.stack input:focus,.stack textarea:focus{outline:none;border-color:#2563eb;box-shadow:0 0 0 3px rgba(37,99,235,.15)}
.optional{color:#94a3b8;font-weight:400;font-size:.85rem}
.fineprint{font-size:.85rem;color:#64748b;margin-top:16px}

.banner{padding:14px 18px;border-radius:8px;margin-bottom:18px;font-size:.95rem}
.banner.success{background:#ecfdf5;border:1px solid #6ee7b7;color:#065f46}
.banner.success h3{margin:0 0 6px;color:#064e3b}
.banner.error{background:#fef2f2;border:1px solid #fca5a5;color:#991b1b}
.muted{color:#64748b;font-size:.9rem}

.token-meta{display:flex;flex-wrap:wrap;gap:18px;background:#f1f5f9;padding:12px 16px;border-radius:8px;margin:18px 0;font-size:.92rem}
.token-block{background:#0f172a;color:#e2e8f0;padding:16px;border-radius:8px;overflow-x:auto;word-break:break-all;white-space:pre-wrap;margin:8px 0}
.token-block code{background:transparent;color:#e2e8f0;padding:0;font-size:.85rem}

.features-list{padding-left:20px;color:#374151}
.features-list li{margin:6px 0}

.install-block{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:32px;margin-top:32px}
.install-block h2{margin-top:0}
.install-block h3{margin:24px 0 10px;color:#0f172a;font-size:1.05rem}
.install-block .lede{color:#475569;margin-bottom:18px}
.code-block{background:#0f172a;color:#e2e8f0;padding:16px 18px;border-radius:8px;overflow-x:auto;font-size:.88rem;line-height:1.5;margin:0}
.code-block code{background:transparent;color:#e2e8f0;padding:0;font-family:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace}

.install-methods{display:flex;flex-direction:column;gap:18px;margin:24px 0}
.install-method{background:#f8fafc;border:1px solid #e5e7eb;border-radius:10px;padding:24px;position:relative}
.install-method.recommended{background:linear-gradient(135deg,#f0f9ff 0%,#ecfdf5 100%);border:2px solid #2563eb}
.install-method h3{margin:0 0 8px;color:#0f172a;font-size:1.05rem}
.install-method p{margin:0 0 14px;color:#475569;font-size:.95rem}
.method-tag{position:absolute;top:-10px;left:20px;background:#2563eb;color:#fff;font-size:.7rem;font-weight:800;letter-spacing:.08em;padding:4px 10px;border-radius:999px}
.method-steps{padding-left:20px;color:#475569;font-size:.92rem;margin:14px 0 0}
.method-steps li{margin:6px 0}
.warn-private{margin-top:24px}

hr{border:none;border-top:1px solid #e5e7eb;margin:32px 0}

.site-footer{text-align:center;padding:32px;color:#94a3b8;font-size:.88rem;border-top:1px solid #e5e7eb;background:#fff;margin-top:48px}