:root{--bg: #000000;--text: #ffffff;--text-muted: #888888;--border: rgba(255, 255, 255, .12);--code-bg: #0a0a0a;--font-sans: "Inter", -apple-system, BlinkMacSystemFont, sans-serif;--font-mono: "JetBrains Mono", monospace;--syn-keyword: #c792ea;--syn-function: #82aaff;--syn-string: #c3e88d;--syn-component: #89ddff;--syn-prop: #ffcb6b;--syn-comment: #546e7a;--syn-bracket: #89ddff}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%}body{font-family:var(--font-sans);background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{min-height:100%;display:flex;flex-direction:column}.page{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 24px 40px;text-align:center}.header{display:flex;align-items:center;gap:20px;margin-bottom:12px;animation:fadeIn .6s ease-out}.logo{width:64px;height:64px;flex-shrink:0}.logo img{width:100%;height:100%;object-fit:contain}.title{font-size:56px;font-weight:700;letter-spacing:-.03em}.tagline{font-size:18px;color:var(--text-muted);margin-bottom:24px;animation:fadeIn .6s ease-out .1s both}.github-btn{display:inline-flex;align-items:center;gap:10px;padding:12px 24px;background:var(--text);color:var(--bg);text-decoration:none;font-size:15px;font-weight:600;border-radius:8px;margin-bottom:48px;transition:all .2s ease;animation:fadeIn .6s ease-out .15s both}.github-btn:hover{transform:translateY(-2px);box-shadow:0 8px 24px #ffffff26}.github-icon{width:20px;height:20px}.code-box{width:100%;max-width:680px;background:var(--code-bg);border:1px solid var(--border);border-radius:12px;overflow:hidden;text-align:left;margin-bottom:48px;animation:fadeIn .6s ease-out .2s both}.code-header{display:flex;align-items:center;gap:8px;padding:14px 16px;background:#ffffff08;border-bottom:1px solid var(--border)}.code-dot{width:12px;height:12px;border-radius:50%;background:#ffffff26}.code-filename{margin-left:8px;font-family:var(--font-mono);font-size:13px;color:var(--text-muted)}.code-content{padding:24px;font-family:var(--font-mono);font-size:14px;line-height:1.7;color:#e0e0e0;overflow-x:auto}.code-content .kw{color:var(--syn-keyword)}.code-content .fn{color:var(--syn-function)}.code-content .str{color:var(--syn-string)}.code-content .cmp{color:var(--syn-component)}.code-content .prop{color:var(--syn-prop)}.code-content .cmt{color:var(--syn-comment);font-style:italic}.code-content .br{color:var(--syn-bracket)}.links{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;animation:fadeIn .6s ease-out .3s both}.link{display:flex;align-items:center;gap:8px;padding:14px 24px;background:transparent;border:1px solid var(--border);border-radius:8px;color:var(--text);text-decoration:none;font-size:15px;font-weight:500;transition:all .2s ease}.link:hover{background:#ffffff0d;border-color:#ffffff40}.link-arrow{opacity:.5;transition:opacity .2s,transform .2s}.link:hover .link-arrow{opacity:1;transform:translate(3px)}.footer{padding:32px 24px;text-align:center;border-top:1px solid var(--border);animation:fadeIn .6s ease-out .4s both}.contact{margin-bottom:12px}.contact-name{font-size:15px;font-weight:500;color:var(--text);margin-bottom:6px}.contact-links{display:flex;align-items:center;justify-content:center;gap:8px}.contact-link{font-size:14px;color:var(--text-muted);text-decoration:none;transition:color .2s}.contact-link:hover{color:var(--text)}.contact-separator{color:var(--text-muted);opacity:.5}.footer-license{font-size:13px;color:var(--text-muted)}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@media(max-width:540px){.header{gap:14px}.logo{width:48px;height:48px}.title{font-size:40px}.tagline{font-size:16px}.code-content{font-size:12px;padding:16px}.links{flex-direction:column;width:100%;max-width:320px}.link{justify-content:space-between}}
