*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:#0f0f1a;color:#e0e0e0;min-height:100vh}.app{max-width:800px;margin:0 auto;padding:40px 20px;min-height:100vh;display:flex;flex-direction:column}header{text-align:center;margin-bottom:40px}header h1{font-size:2.4rem;font-weight:700;background:linear-gradient(135deg,#60a5fa,#a78bfa);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.subtitle{color:#888;margin-top:8px;font-size:1rem}main{flex:1}.query-input{margin-bottom:32px}.input-row{display:flex;gap:12px}.input-row input{flex:1;padding:14px 18px;font-size:1rem;background:#1a1a2e;border:1px solid #2a2a4a;border-radius:12px;color:#e0e0e0;outline:none;transition:border-color .2s}.input-row input:focus{border-color:#60a5fa}.input-row input:disabled{opacity:.5}.input-row button{padding:14px 28px;font-size:1rem;font-weight:600;background:linear-gradient(135deg,#3b82f6,#7c3aed);color:#fff;border:none;border-radius:12px;cursor:pointer;transition:opacity .2s,transform .1s;white-space:nowrap}.input-row button:hover:not(:disabled){opacity:.9;transform:translateY(-1px)}.input-row button:disabled{opacity:.5;cursor:not-allowed}.examples{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.example-tag{padding:6px 14px;font-size:.85rem;background:#1a1a2e;border:1px solid #2a2a4a;border-radius:20px;color:#888;cursor:pointer;transition:all .2s}.example-tag:hover:not(:disabled){border-color:#60a5fa;color:#60a5fa}.example-tag:disabled{opacity:.4;cursor:not-allowed}.loading{display:flex;align-items:center;justify-content:center;gap:12px;padding:40px;color:#888;font-size:1rem}.spinner{width:20px;height:20px;border:2px solid #333;border-top-color:#60a5fa;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.error-card{background:#2a1a1a;border:1px solid #5a2a2a;border-radius:12px;padding:16px 20px;color:#f87171;font-size:.95rem}.result-card{background:#1a1a2e;border:1px solid #2a2a4a;border-radius:16px;padding:24px;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.answer-section{margin-bottom:20px}.answer-text{font-size:1.2rem;line-height:1.8;color:#f0f0f0;white-space:pre-wrap}.collapsible{margin-top:12px;border-top:1px solid #2a2a4a;padding-top:12px}.collapse-toggle{background:none;border:none;color:#888;cursor:pointer;font-size:.9rem;padding:4px 0;transition:color .2s}.collapse-toggle:hover{color:#60a5fa}.sql-block{margin-top:8px;padding:12px 16px;background:#12121f;border-radius:8px;font-family:SF Mono,Fira Code,monospace;font-size:.85rem;color:#a78bfa;overflow-x:auto;white-space:pre-wrap;word-break:break-all}.table-wrapper{margin-top:8px;overflow-x:auto;border-radius:8px}table{width:100%;border-collapse:collapse;font-size:.85rem}thead{background:#12121f}th{padding:10px 14px;text-align:left;color:#60a5fa;font-weight:600;white-space:nowrap}td{padding:8px 14px;border-top:1px solid #1f1f35;color:#ccc;white-space:nowrap}tr:hover td{background:#1f1f35}.empty-hint{color:#666;text-align:center;padding:20px}footer{text-align:center;padding:32px 0 16px;color:#444;font-size:.8rem}