*{box-sizing:border-box;margin:0;padding:0}:root{font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--bg-primary:#f9fafb;--bg-secondary:#fff;--text-primary:#111827;--text-secondary:#6b7280;--border-color:#e5e7eb;--shadow-sm:0 1px 2px 0 #0000000d;--shadow-md:0 4px 6px -1px #0000001a, 0 2px 4px -1px #0000000f;--color-blue:#3b82f6;--color-green:#10b981;--color-purple:#8b5cf6;--color-red:#ef4444;--color-orange:#f97316;font-family:system-ui,Segoe UI,Roboto,sans-serif}@media (prefers-color-scheme:dark){:root{--bg-primary:#111827;--bg-secondary:#1f2937;--text-primary:#f3f4f6;--text-secondary:#9ca3af;--border-color:#374151;--shadow-sm:0 1px 2px 0 #0000004d;--shadow-md:0 4px 6px -1px #0006, 0 2px 4px -1px #0000004d}}body{background-color:var(--bg-primary);min-height:100vh;color:var(--text-primary);margin:0}.container{width:100%;max-width:1280px;margin:0 auto;padding:0 1rem}.header{background-color:var(--bg-secondary);box-shadow:var(--shadow-sm);text-align:center;padding:1.5rem 0}.header h1{color:var(--text-primary);margin-bottom:.5rem;font-size:1.875rem;font-weight:700}.header p{color:var(--text-secondary);font-size:1rem}.main{padding:2rem 0}.tools-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1.5rem;display:grid}.tool-card{background-color:var(--bg-secondary);border:1px solid var(--border-color);cursor:pointer;border-radius:.75rem;padding:1.5rem;transition:box-shadow .3s}.tool-card:hover{box-shadow:var(--shadow-md)}.tool-icon{border-radius:.5rem;justify-content:center;align-items:center;width:32px;height:32px;margin-bottom:1rem;display:flex}.tool-card h2{color:var(--text-primary);margin-bottom:.5rem;font-size:1.125rem;font-weight:600}.tool-card p{color:var(--text-secondary);font-size:.875rem;line-height:1.4}.tool-card.blue{background-color:#3b82f60d;border-color:#3b82f633}.tool-card.green{background-color:#10b9810d;border-color:#10b98133}.tool-card.purple{background-color:#8b5cf60d;border-color:#8b5cf633}.tool-card.red{background-color:#ef44440d;border-color:#ef444433}.tool-card.orange{background-color:#f973160d;border-color:#f9731633}.footer{background-color:var(--bg-secondary);box-shadow:inset 0 1px 0 var(--border-color);text-align:center;margin-top:2rem;padding:1.5rem 0}.footer p{color:var(--text-secondary);font-size:.875rem}@media (width>=640px){.tools-grid{grid-template-columns:repeat(2,1fr)}}@media (width>=768px){.tools-grid{grid-template-columns:repeat(3,1fr)}}@media (width>=1024px){.tools-grid{grid-template-columns:repeat(4,1fr)}}.tool-icon svg{color:#fff;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;fill:none;width:16px;height:16px}