body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#222;margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.app{max-width:1400px;margin:0 auto;padding:2rem;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.header{text-align:center;margin-bottom:2rem}.header h1{color:#007bff;margin:0;font-size:2rem}.nav{border-bottom:1px solid #999;flex-wrap:wrap;gap:.5rem;margin-bottom:2rem;padding-bottom:1rem;display:flex}.nav button{cursor:pointer;background:#f5f5f5;border:1px solid #ccc;border-radius:4px;padding:.5rem 1rem;font-size:.9rem}.nav button:hover{background:#e0e0e0}.nav button.active{color:#fff;background:#007bff;border-color:#007bff}.comparison{grid-template-columns:1fr 1fr;gap:2rem;display:grid}.panel{background:#000;border-radius:8px;padding:1.5rem;box-shadow:0 0 3px #000}.panel.component{background:#fff;margin-top:1.5rem}.panel h2{color:#fff;border-bottom:2px solid #007bff;margin-top:0;margin-bottom:1rem;padding-bottom:.5rem;font-size:1.25rem}.panel.component h2{color:#000}.react-syntax-highlighter-line-number{color:#666;-webkit-user-select:none;user-select:none}.react-syntax-highlighter-line{color:#d4d4d4;white-space:pre-wrap;word-wrap:break-word;background:#1e1e1e;border-radius:4px;margin:0;padding:1rem;font-size:.85rem;line-height:1.5;overflow-x:auto}.react-syntax-highlighter-line-number span{text-align:right;width:3em;padding-right:1em;display:inline-block}.welcome{text-align:center;color:#666;padding:4rem 2rem;font-size:1.1rem}pre{color:#fff;background:#000;min-height:350px;max-height:450px}@media (width<=768px){.comparison{grid-template-columns:1fr}}.card.tsrx-lzh87r{border:1px solid #ddd;padding:1.5rem}h2.tsrx-lzh87r{color:#333}.badge.tsrx-14gu3lk{padding:.25rem .5rem}.highlight.tsrx-hbh3cd{color:#2e7d32;background:#e8f5e9}