*{box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Inter,sans-serif;line-height:1.7;color:#1a1a1a;background-color:#f8f9fa;margin:0;padding:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.article-container{max-width:800px;margin:0 auto;padding:2rem 1rem}.article-content{background:#fff;border-radius:12px;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;padding:3rem;margin-bottom:2rem}.article-header{margin-bottom:3rem;padding-bottom:2rem;border-bottom:1px solid #e5e7eb}.article-header h1{font-size:2.5rem;font-weight:700;color:#111827;margin-bottom:1rem;line-height:1.2}.article-subtitle{font-size:1.25rem;color:#6b7280;font-weight:400;line-height:1.5;margin:0}.section{margin-bottom:3rem}.section:last-child{margin-bottom:0}.section h2{font-size:1.875rem;font-weight:600;color:#111827;margin-bottom:1.5rem;line-height:1.3;border-left:4px solid #3498db;padding-left:1rem}.section h3{font-size:1.5rem;font-weight:600;color:#374151;margin:2rem 0 1rem;line-height:1.4}.section h4{font-size:1.25rem;font-weight:600;color:#4b5563;margin:1.5rem 0 1rem;line-height:1.4}.section p{margin-bottom:1rem;color:#374151}.section ul,.section ol{margin:1rem 0;padding-left:1.5rem}.section li{margin-bottom:.5rem;color:#374151}.section strong{color:#111827;font-weight:600}.section em{font-style:italic;color:#374151}code{background-color:#f3f4f6;color:#374151;padding:.25rem .5rem;border-radius:.375rem;font-family:Monaco,Menlo,Ubuntu Mono,Consolas,monospace;font-size:.875em;border:1px solid #e5e7eb}pre{background-color:#1f2937;color:#f9fafb;padding:1.5rem;border-radius:.5rem;overflow-x:auto;font-family:Monaco,Menlo,Ubuntu Mono,Consolas,monospace;font-size:.875rem;line-height:1.5;margin:1.5rem 0}pre code{background-color:transparent;color:inherit;padding:0;border-radius:0;border:none}.highlight{background-color:#fffbeb;border-left:4px solid #f59e0b;padding:1rem 1.5rem;margin:1.5rem 0;border-radius:.375rem;color:#92400e}.challenge-box{background-color:#fef2f2;border:1px solid #fca5a5;padding:1.5rem;margin:1.5rem 0;border-radius:.5rem;color:#991b1b}.solution-box{background-color:#f0fdf4;border:1px solid #86efac;padding:1.5rem;margin:1.5rem 0;border-radius:.5rem;color:#166534}.step-box{background-color:#dbeafe;border:1px solid #93c5fd;padding:1.5rem;margin:1.5rem 0;border-radius:.5rem;color:#1e40af}.success-box{background-color:#d1fae5;border:1px solid #6ee7b7;padding:1.5rem;margin:1.5rem 0;border-radius:.5rem;color:#065f46}.warning-box{background-color:#fed7d7;border:1px solid #feb2b2;padding:1.5rem;margin:1.5rem 0;border-radius:.5rem;color:#9b2c2c}.feature-list,.advantage-list{background-color:#eff6ff;border:1px solid #bfdbfe;padding:1.5rem;margin:1.5rem 0;border-radius:.5rem;color:#1e3a8a}.feature-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.5rem;margin:2rem 0}.template-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1rem;margin:2rem 0}.feature-card,.template-card{background-color:#f9fafb;border:1px solid #e5e7eb;padding:1.5rem;border-radius:.5rem;transition:all .2s ease-in-out}.feature-card:hover,.template-card:hover{box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;transform:translateY(-1px)}.feature-card h4,.template-card h4{font-size:1.125rem;font-weight:600;color:#111827;margin-bottom:.75rem}.feature-card p,.template-card p{color:#6b7280;margin:0;font-size:.875rem}.comparison-table{overflow-x:auto;margin:2rem 0;border-radius:.5rem;box-shadow:0 1px 3px #0000001a,0 1px 2px #0000000f}.comparison-table table{width:100%;border-collapse:collapse;margin:0;background:#fff;border-radius:.5rem;overflow:hidden}.comparison-table th,.comparison-table td{padding:1rem 1.5rem;text-align:left;border-bottom:1px solid #e5e7eb;transition:background-color .2s ease}.comparison-table th{background:linear-gradient(135deg,#f8fafc,#f1f5f9);font-weight:600;color:#1e293b;font-size:.875rem;text-transform:uppercase;letter-spacing:.05em;position:sticky;top:0;z-index:10}.comparison-table tbody tr{transition:all .2s ease}.comparison-table tbody tr:hover{background-color:#f8fafc;transform:translateY(-1px);box-shadow:0 4px 6px -1px #0000001a}.comparison-table tbody tr:last-child td{border-bottom:none}.comparison-table td{color:#475569;font-size:.9375rem}.comparison-table td:first-child{font-weight:600;color:#1e293b;background-color:#f8fafc}.comparison-table td:nth-child(2){color:#059669;font-weight:500}.comparison-table td:nth-child(3),.comparison-table td:nth-child(4){color:#dc2626;font-weight:500}.comparison-table td:contains("⚠️"){color:#d97706;font-weight:500}.demo-box{background-color:#f3f4f6;border:1px solid #d1d5db;padding:2rem;margin:2rem 0;border-radius:.5rem;text-align:center}.scalable-demo{font-size:1.5rem;font-family:Arial,sans-serif;margin:1rem 0;transition:font-size .3s ease;cursor:pointer}.scalable-demo:hover{font-size:3rem}.character-demo{font-size:2.5rem;font-family:serif;margin:1rem 0;text-align:center;color:#111827}.emoji-demo{font-size:2rem;margin:1rem 0;text-align:center}.code-example{margin:1.5rem 0}.code-example pre{background-color:#111827;color:#f9fafb;border:1px solid #374151}@media (max-width: 768px){.article-container{padding:1rem .5rem}.article-content{padding:2rem 1.5rem}.article-header h1{font-size:2rem}.article-subtitle{font-size:1.125rem}.section h2{font-size:1.5rem}.section h3{font-size:1.25rem}.feature-grid{grid-template-columns:1fr;gap:1rem}.template-grid{grid-template-columns:1fr;gap:.75rem}.comparison-table{margin:1.5rem -1.5rem;border-radius:0}.comparison-table table{border-radius:0}.comparison-table th,.comparison-table td{padding:.75rem 1rem;font-size:.875rem}.comparison-table th{font-size:.75rem}}@media (max-width: 480px){.article-header h1{font-size:1.75rem}.article-content{padding:1.5rem 1rem}}@media (prefers-color-scheme: dark){body{background-color:#111827;color:#f9fafb}.article-content{background-color:#1f2937;box-shadow:0 4px 6px -1px #0000004d}.article-header{border-bottom-color:#374151}.article-header h1{color:#f9fafb}.article-subtitle{color:#9ca3af}.section h2{color:#f9fafb;border-left-color:#60a5fa}.section h3{color:#e5e7eb}.section h4,.section p,.section li{color:#d1d5db}.section strong{color:#f9fafb}code{background-color:#374151;color:#e5e7eb;border-color:#4b5563}pre{background-color:#111827;color:#f9fafb;border:1px solid #374151}.highlight{background-color:#78350f;border-left-color:#f59e0b;color:#fef3c7}.challenge-box{background-color:#7f1d1d;border-color:#dc2626;color:#fecaca}.solution-box{background-color:#14532d;border-color:#16a34a;color:#bbf7d0}.step-box{background-color:#1e3a8a;border-color:#3b82f6;color:#bfdbfe}.success-box{background-color:#064e3b;border-color:#059669;color:#a7f3d0}.warning-box{background-color:#7c2d12;border-color:#ea580c;color:#fed7aa}.feature-list,.advantage-list{background-color:#1e3a8a;border-color:#3b82f6;color:#bfdbfe}.feature-card,.template-card{background-color:#374151;border-color:#4b5563}.feature-card:hover,.template-card:hover{box-shadow:0 4px 6px -1px #0000004d}.feature-card h4,.template-card h4{color:#f9fafb}.feature-card p,.template-card p{color:#9ca3af}.demo-box{background-color:#374151;border-color:#4b5563}.character-demo{color:#f9fafb}.comparison-table{box-shadow:0 1px 3px #0000004d,0 1px 2px #0003}.comparison-table table{background:#1f2937}.comparison-table th{background:linear-gradient(135deg,#1e293b,#334155);color:#e2e8f0;border-bottom-color:#475569}.comparison-table tbody tr:hover{background-color:#374151;box-shadow:0 4px 6px -1px #0000004d}.comparison-table td{color:#cbd5e1;border-bottom-color:#475569}.comparison-table td:first-child{color:#e2e8f0;background-color:#1e293b}.comparison-table td:nth-child(2){color:#34d399}.comparison-table td:nth-child(3),.comparison-table td:nth-child(4){color:#f87171}.comparison-table td:contains("⚠️"){color:#fbbf24}}