: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-link-button{border:none;background:transparent;color:var(--text-dim);font:inherit;text-decoration:none;transition:color .15s ease;padding:8px 12px;cursor:pointer}.nav-links li>a{font-size:14px;font-weight:500;color:var(--text-dim);text-decoration:none;transition:color .15s ease;padding:8px 12px}.nav-links li>a:hover{color:var(--accent)}.nav-link-button: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}.portal-user-menu{position:relative}.portal-user-trigger{border:none;background:transparent;color:var(--text);font:600 14px/1.2 Inter,system-ui,-apple-system,PingFang SC,sans-serif;display:inline-flex;align-items:center;gap:8px;padding:8px 0 8px 12px;cursor:pointer}.portal-user-trigger:after{content:"";width:8px;height:8px;border-right:1.5px solid var(--text-dim);border-bottom:1.5px solid var(--text-dim);transform:rotate(45deg) translateY(-1px);transition:transform .18s ease,border-color .18s ease}.portal-user-trigger:hover,.portal-user-menu.is-open .portal-user-trigger{color:var(--accent)}.portal-user-trigger:hover:after,.portal-user-menu.is-open .portal-user-trigger:after{border-color:var(--accent)}.portal-user-menu.is-open .portal-user-trigger:after{transform:rotate(225deg) translateY(-1px)}.portal-user-dropdown{position:absolute;top:calc(100% + 12px);right:0;min-width:188px;padding:8px;background:#fffffffa;border:1px solid rgba(15,23,42,.08);border-radius:14px;box-shadow:0 18px 40px #0f172a24;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);display:grid;gap:4px}.portal-user-dropdown[hidden]{display:none!important}.portal-user-dropdown a,.portal-user-dropdown-action{display:flex;align-items:center;width:100%;min-height:40px;padding:0 12px;border:none;border-radius:10px;background:transparent;color:var(--text);font:500 14px/1.2 Inter,system-ui,-apple-system,PingFang SC,sans-serif;text-decoration:none;text-align:left;cursor:pointer;transition:background .18s ease,color .18s ease}.portal-user-dropdown a:hover,.portal-user-dropdown-action:hover{background:#2563eb14;color:var(--accent)}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)}footer a{color:inherit;text-decoration:none}footer a:hover{color:var(--accent);text-decoration:underline}@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%}}