:root{--bg: #f8fafc;--surface: #ffffff;--surface-alt: #f1f5f9;--border: #e2e8f0;--text: #0f172a;--text-dim: #64748b;--accent: #2563eb;--accent-hover: #1d4ed8;--radius: 4px;--shadow: 0 1px 3px rgba(0, 0, 0, .05)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,system-ui,-apple-system,PingFang SC,Hiragino Sans GB,sans-serif;background:var(--bg);color:var(--text);min-height:100vh;-webkit-font-smoothing:antialiased}nav{display:flex;align-items:center;justify-content:space-between;padding:0 40px;height:60px;background:#ffffffd9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:100}.nav-brand{font-size:16px;font-weight:700;color:var(--text);text-decoration:none;display:flex;align-items:center;gap:6px;letter-spacing:-.2px}.ty-logo{color:var(--text);font-size:1.1em;font-weight:500}.ty-sep{color:var(--text);opacity:.8}.nav-links{display:flex;align-items:center;gap:20px;list-style:none}.nav-links li:last-child a{font-size:14px;font-weight:500;color:var(--text-dim);text-decoration:none;transition:color .15s ease;padding:8px 12px}.nav-links li:last-child a:hover{color:var(--accent)}.nav-links li:first-child a{display:inline-block;padding:8px 20px;background:var(--accent);color:#fff;border-radius:var(--radius);text-decoration:none;font-size:13px;font-weight:600;transition:all .2s;box-shadow:0 2px 8px #2563eb26}.nav-links li:first-child a:hover{background:var(--accent-hover);transform:translateY(-1px);box-shadow:0 4px 12px #2563eb40}main{max-width:800px;margin:0 auto;padding:64px 40px}.hero{text-align:center;margin-bottom:24px;padding:40px 0 0}.hero-title{font-size:42px;font-weight:800;letter-spacing:-1.2px;color:var(--text);line-height:1.1;margin-bottom:24px;display:flex;align-items:center;justify-content:center;gap:12px}.hero-title .ty-logo{color:var(--text)}.hero-title .ty-sep{color:var(--text);opacity:.8}.hero-subtitle{font-size:16px;font-weight:600;color:var(--accent);letter-spacing:2px;text-transform:uppercase;margin-bottom:24px}.hero-desc{font-size:16px;color:var(--text-dim);line-height:1.8;margin:0 0 32px;text-align:left}.cta-group{display:flex;justify-content:center;gap:16px}.btn-primary{display:inline-block;padding:12px 32px;background:var(--accent);color:#fff;border-radius:var(--radius);text-decoration:none;font-size:14px;font-weight:600;transition:all .2s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 12px #2563eb33}.btn-primary:hover{background:var(--accent-hover);transform:translateY(-1px);box-shadow:0 6px 16px #2563eb4d}.btn-secondary{display:inline-block;padding:12px 32px;background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:var(--radius);text-decoration:none;font-size:14px;font-weight:600;transition:all .2s}.btn-secondary:hover{background:var(--surface-alt);border-color:var(--text-dim)}.divider{border:none;border-top:1px solid var(--border);margin:24px 0 40px;width:100%}.features{display:grid;grid-template-columns:1fr 1fr;gap:32px 48px;margin-bottom:64px}.feature-item{padding:0}.feature-title{font-size:15px;font-weight:700;color:var(--accent);margin-bottom:10px;display:flex;align-items:center;gap:8px}.feature-desc{font-size:14px;color:var(--text-dim);line-height:1.7}.code-block{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow)}.code-block-title{font-size:11px;color:var(--text-dim);letter-spacing:1px;text-transform:uppercase;margin-bottom:8px}.code-block pre{font-family:JetBrains Mono,Consolas,Menlo,monospace;font-size:13px;line-height:1.7;color:var(--text);overflow-x:auto;counter-reset:ty-line}.code-block .ty-line{display:block;counter-increment:ty-line}.code-block .ty-line:before{content:counter(ty-line);display:inline-block;width:1.6em;margin-right:1em;text-align:right;color:#a0aec0;-webkit-user-select:none;user-select:none;font-size:11px}.code-block .hljs{background:transparent;color:#2d3748}.code-block .hljs-comment{color:#718096;font-style:italic}.code-block .hljs-string{color:#2f855a}.code-block .hljs-number{color:#c05621}.code-block .hljs-keyword{color:#2b6cb0;font-weight:600}.code-block .hljs-built_in{color:#6b46c1}.code-block .hljs-operator{color:#2d3748}.code-block .hljs-variable{color:#b7791f}.demo-label{font-size:11px;color:var(--text-dim);letter-spacing:1px;text-transform:uppercase;margin:32px 0 12px}.demo-row{display:flex;gap:20px;align-items:stretch;width:100%}.demo-row .code-block{margin-top:0;flex:1}.screenshot{flex:1.2;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:0 2px 8px #00000014}.screenshot img{display:block;width:100%;height:100%;object-fit:cover}footer{border-top:1px solid var(--border);padding:28px 48px;text-align:center;font-size:13px;color:var(--text-dim)}@media (max-width: 540px){nav{padding:0 20px}main{padding:60px 20px}.hero-title{font-size:38px}.features{grid-template-columns:1fr}.demo-row{flex-direction:column}.demo-row .code-block{width:100%}}pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}/*!
  Theme: GitHub
  Description: Light theme as seen on github.com
  Author: github.com
  Maintainer: @Hirse
  Updated: 2021-05-15

  Outdated base version: https://github.com/primer/github-syntax-light
  Current colors taken from GitHub's CSS
*/.hljs{color:#24292e;background:#fff}.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-template-tag,.hljs-template-variable,.hljs-type,.hljs-variable.language_{color:#d73a49}.hljs-title,.hljs-title.class_,.hljs-title.class_.inherited__,.hljs-title.function_{color:#6f42c1}.hljs-attr,.hljs-attribute,.hljs-literal,.hljs-meta,.hljs-number,.hljs-operator,.hljs-variable,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-id{color:#005cc5}.hljs-regexp,.hljs-string,.hljs-meta .hljs-string{color:#032f62}.hljs-built_in,.hljs-symbol{color:#e36209}.hljs-comment,.hljs-code,.hljs-formula{color:#6a737d}.hljs-name,.hljs-quote,.hljs-selector-tag,.hljs-selector-pseudo{color:#22863a}.hljs-subst{color:#24292e}.hljs-section{color:#005cc5;font-weight:700}.hljs-bullet{color:#735c0f}.hljs-emphasis{color:#24292e;font-style:italic}.hljs-strong{color:#24292e;font-weight:700}.hljs-addition{color:#22863a;background-color:#f0fff4}.hljs-deletion{color:#b31d28;background-color:#ffeef0}