:root{--color-bg-50:#f9fafb;--color-bg-100:#f3f4f6;--color-bg-200:#e5e7eb;--color-bg-600:#4b5563;--color-blue-50:#eff6ff;--color-blue-600:#2563eb;--color-blue-700:#1d4ed8;--color-gray-300:#d1d5db;--color-gray-400:#9ca3af;--color-gray-600:#4b5563;--color-gray-700:#374151;--color-gray-900:#111827;--color-indigo-50:#eef2ff}*{box-sizing:border-box;margin:0;padding:0}body{background:linear-gradient(to bottom right,var(--color-blue-50),var(--color-indigo-50));min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}.min-h-screen{min-height:100vh}.bg-gradient-to-br{background:linear-gradient(to bottom right,var(--color-blue-50),var(--color-indigo-50))}.p-4{padding:1rem}.p-6{padding:1.5rem}.p-8,.sm\:p-8{padding:2rem}.mx-auto{margin-left:auto;margin-right:auto}.max-w-6xl{max-width:72rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.mb-8{margin-bottom:2rem}.mt-4{margin-top:1rem}.mt-8{margin-top:2rem}.gap-6{gap:1.5rem}.grid{display:grid}.grid-cols-1{grid-template-columns:1fr}@media (min-width:1024px){.lg\:grid-cols-2{grid-template-columns:repeat(2,1fr)}}.bg-white{background-color:#fff}.bg-gray-50{background-color:var(--color-bg-50)}.bg-gray-100{background-color:var(--color-bg-100)}.bg-gray-200{background-color:var(--color-bg-200)}.bg-blue-600{background-color:var(--color-blue-600)}.bg-blue-700{background-color:var(--color-blue-700)}.bg-gray-300{background-color:var(--color-bg-200)}.text-gray-400{color:var(--color-gray-400)}.text-gray-600{color:var(--color-gray-600)}.text-gray-700{color:var(--color-gray-700)}.text-gray-900{color:var(--color-gray-900)}.text-white{color:#fff}.text-sm{font-size:.875rem;line-height:1.25rem}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-4xl{font-size:2.25rem;font-weight:700;line-height:2.5rem}.font-bold{font-weight:700}.font-semibold{font-weight:600}.font-medium{font-weight:500}.font-mono{font-family:Courier New,monospace}.rounded-lg{border-radius:.5rem}.border{border:1px solid var(--color-gray-300)}.border-gray-200{border:1px solid #e5e7eb}.border-gray-300{border:1px solid var(--color-gray-300)}.shadow-sm{box-shadow:0 1px 2px #0000000d}.w-full{width:100%}.h-96{height:24rem}.block{display:block}.overflow-auto{overflow:auto}.whitespace-pre-wrap{white-space:pre-wrap}.break-words{word-break:break-word}textarea,pre{border:1px solid var(--color-gray-300);border-radius:.5rem;padding:1rem;font-family:Courier New,monospace;font-size:.875rem}textarea{resize:none;color:var(--color-gray-900);background-color:#fff;width:100%;transition:border-color .2s}textarea:focus{outline:none;border-color:var(--color-blue-600);box-shadow:0 0 0 3px #2563eb1a}textarea::placeholder{color:var(--color-gray-400)}pre{background-color:var(--color-bg-50);color:var(--color-gray-900)}button{cursor:pointer;border:none;border-radius:.5rem;width:100%;padding:.5rem 1rem;transition:background-color .2s;font-size:.875rem;font-weight:500}.bg-gray-100{background-color:var(--color-bg-100);color:var(--color-gray-700)}.bg-gray-100:hover:not(:disabled){background-color:var(--color-bg-200)}.bg-blue-600{background-color:var(--color-blue-600);color:#fff}.bg-blue-600:hover:not(:disabled),.bg-blue-700{background-color:var(--color-blue-700)}.bg-gray-300{background-color:var(--color-bg-200)}button:disabled{background-color:var(--color-bg-200);cursor:not-allowed;opacity:.6}.text-center{text-align:center}