.App h1{text-align:center}.editor-container{display:flex;flex-direction:column;gap:24px;max-width:1200px;margin:0 auto;padding:20px;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;background-color:#f8fafc;min-height:100vh}.toolbar{display:flex;gap:12px;flex-wrap:wrap;align-items:center;padding:12px 0;border-bottom:1px solid #e2e8f0}.toolbar select{padding:8px 12px;border-radius:6px;border:1px solid #cbd5e1;background-color:#fff;font-size:14px;color:#334155;cursor:pointer;transition:all .2s ease}.toolbar select:hover{border-color:#94a3b8}.toolbar select:focus{outline:none;border-color:#6366f1;box-shadow:0 0 0 2px #6366f133}.toolbar button{padding:8px 16px;border-radius:6px;border:none;background-color:#6366f1;color:#fff;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:6px}.toolbar button:hover{background-color:#4f46e5;transform:translateY(-1px)}.toolbar button:active{transform:translateY(0)}.editor-wrapper{border-radius:8px;overflow:hidden;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;border:1px solid #e2e8f0}.ai-container{display:flex;flex-direction:column;gap:16px}.ai-interaction{display:flex;gap:12px}.ai-interaction input{flex:1;padding:12px 16px;border-radius:8px;border:1px solid #e2e8f0;font-size:14px;transition:all .2s ease;background-color:#fff}.ai-interaction input:focus{outline:none;border-color:#6366f1;box-shadow:0 0 0 3px #6366f11a}.ai-interaction button{padding:12px 24px;border-radius:8px;border:none;background-color:#10b981;color:#fff;font-weight:500;cursor:pointer;transition:all .2s ease}.ai-interaction button:hover{background-color:#059669;transform:translateY(-1px)}.ai-interaction button:active{transform:translateY(0)}.ai-response{border-radius:8px;padding:16px;min-height:120px;background-color:#1e293b;color:#f8fafc;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;font-family:Fira Code,monospace;font-size:14px;line-height:1.5;overflow-x:auto}.ai-response pre{margin:0;white-space:pre-wrap;word-wrap:break-word}.loading-spinner{display:flex;justify-content:center;align-items:center;height:100%;color:#94a3b8}.loading-spinner:after{content:"";display:inline-block;width:16px;height:16px;margin-left:8px;border:3px solid rgba(255,255,255,.3);border-radius:50%;border-top-color:#6366f1;animation:spin 1s ease-in-out infinite}@keyframes spin{to{transform:rotate(360deg)}}@media (max-width: 768px){.editor-container{padding:12px}.toolbar{gap:8px}.toolbar button{padding:6px 12px;font-size:13px}.ai-interaction button{padding:10px 16px}}