:root{--mt-primary: #0343df;--mt-primary-hover: #0236b8;--mt-primary-light: #dbeafe;--mt-graphite: #0f172a;--mt-graphite-light: #1e293b;--mt-bg: #f8fafc;--mt-bg-card: #ffffff;--mt-bg-code: #0f172a;--mt-text: #0f172a;--mt-text-secondary: #64748b;--mt-text-on-primary: #ffffff;--mt-text-code: #e2e8f0;--mt-border: #e2e8f0;--mt-success: #10b981;--mt-error: #ef4444;--mt-warning: #f59e0b;--mt-font-family: "IBM Plex Sans", system-ui, -apple-system, sans-serif;--mt-font-mono: "IBM Plex Mono", ui-monospace, monospace;--mt-space-1: 4px;--mt-space-2: 8px;--mt-space-3: 12px;--mt-space-4: 16px;--mt-space-5: 20px;--mt-space-6: 24px;--mt-space-8: 32px;--mt-space-10: 40px;--mt-space-16: 64px;--mt-container-max: 1280px;--mt-content-max: 780px;--mt-radius: 8px;--mt-input-height: 48px;--mt-button-height: 44px}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--mt-font-family);background:var(--mt-bg);color:var(--mt-text);line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{color:var(--mt-primary);text-decoration:none}a:hover{text-decoration:underline}code,pre,.mono{font-family:var(--mt-font-mono)}.container{max-width:var(--mt-container-max);margin:0 auto;padding:0 var(--mt-space-6)}.card{background:var(--mt-bg-card);padding:var(--mt-space-6);border-radius:var(--mt-radius);border:1px solid var(--mt-border)}.btn-primary{background:var(--mt-primary);color:var(--mt-text-on-primary);border:none;height:var(--mt-button-height);padding:0 var(--mt-space-5);border-radius:var(--mt-radius);cursor:pointer;font-family:var(--mt-font-family);font-size:.875rem;font-weight:500}.btn-primary:hover{background:var(--mt-primary-hover)}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-secondary{background:transparent;color:var(--mt-text-secondary);border:1px solid var(--mt-border);height:var(--mt-button-height);padding:0 var(--mt-space-5);border-radius:var(--mt-radius);cursor:pointer;font-family:var(--mt-font-family);font-size:.875rem}.input{height:var(--mt-input-height);padding:0 var(--mt-space-3);border:1px solid var(--mt-border);border-radius:var(--mt-radius);font-family:var(--mt-font-family);font-size:.875rem;width:100%;max-width:400px}.input:focus{outline:2px solid var(--mt-primary);outline-offset:1px;border-color:var(--mt-primary)}.code-block{background:var(--mt-bg-code);color:var(--mt-text-code);padding:var(--mt-space-4);border-radius:var(--mt-radius);font-family:var(--mt-font-mono);font-size:.875rem;white-space:pre-wrap;overflow-x:auto}