.react-articles-container{max-width:1200px;margin:0 auto;padding:20px}.topic-chip{margin:4px;cursor:pointer;transition:all .3s ease}.topic-chip:hover{transform:translateY(-2px);box-shadow:0 4px 8px rgba(0,0,0,.1)}.article-content{margin-top:30px;padding:20px;border-radius:8px;background:var(--background-paper);box-shadow:0 2px 4px rgba(0,0,0,.1)}.code-block{background:#1e1e1e;color:#d4d4d4;padding:16px;border-radius:6px;font-family:Courier New,monospace;font-size:14px;line-height:1.5;overflow-x:auto;margin:16px 0}.example-container{border:1px solid var(--divider);border-radius:8px;padding:20px;margin:16px 0;background:var(--background-default)}.mcp-container{border:2px solid var(--primary-main);border-radius:12px;padding:24px;margin:20px 0;background:var(--background-paper);box-shadow:0 4px 12px rgba(0,0,0,.1)}.mcp-header{display:flex;align-items:center;gap:12px;margin-bottom:20px;padding-bottom:12px;border-bottom:2px solid var(--primary-main)}.mcp-title{font-size:1.5rem;font-weight:700;color:var(--primary-main)}.mcp-description{color:var(--text-secondary);margin-bottom:20px;line-height:1.6}.mcp-requirements{background:var(--background-default);padding:16px;border-radius:8px;margin:16px 0;border-left:4px solid var(--primary-main)}.requirement-item{margin:8px 0;padding-left:20px;position:relative}.requirement-item:before{content:"•";color:var(--primary-main);font-weight:700;position:absolute;left:0}.interactive-demo{border:1px solid var(--divider);border-radius:8px;padding:20px;margin:20px 0;background:var(--background-default)}.demo-controls{display:flex;gap:12px;margin-bottom:16px;flex-wrap:wrap}.demo-button{padding:8px 16px;border:1px solid var(--primary-main);background:rgba(0,0,0,0);color:var(--primary-main);border-radius:6px;cursor:pointer;transition:all .3s ease}.demo-button:hover{background:var(--primary-main);color:#fff}.demo-output{background:var(--background-paper);padding:16px;border-radius:6px;border:1px solid var(--divider);min-height:100px;font-family:monospace}@media(max-width:768px){.react-articles-container{padding:10px}.topic-chip{font-size:.8rem;margin:2px}.article-content{padding:15px}.mcp-container{padding:16px}.demo-controls{flex-direction:column}.demo-button{width:100%}}[data-theme=dark] .code-block{background:#2d2d2d;color:#e6e6e6}[data-theme=dark] .example-container{background:var(--background-paper)}[data-theme=dark] .demo-output{background:var(--background-default)}