:root{--bg:#0a0a0a;--surface:#141414;--border:#2a2a2a;--text:#e0e0e0;--text-muted:#888;--accent:#6c9eff;--accent-hover:#89b4ff;--error:#ff6b6b;--success:#4caf50;--font-mono:"SF Mono", "Fira Code", "Cascadia Code", monospace}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.6}.container{max-width:900px;margin:0 auto;padding:2rem 1.5rem}header{margin-bottom:2rem}header h1{margin-bottom:.25rem;font-size:1.75rem;font-weight:600}.subtitle{color:var(--text-muted);font-size:.9rem}.subtitle code{font-family:var(--font-mono);background:var(--surface);border-radius:4px;padding:.1em .4em;font-size:.85em}.query-input{margin-bottom:1.5rem}.query-input form{align-items:flex-start;gap:.75rem;display:flex}.query-input textarea{font-family:var(--font-mono);background:var(--surface);color:var(--text);border:1px solid var(--border);resize:vertical;border-radius:8px;outline:none;flex:1;padding:.75rem 1rem;font-size:.9rem;transition:border-color .15s}.query-input textarea:focus{border-color:var(--accent)}.query-input button[type=submit]{background:var(--accent);color:#000;cursor:pointer;white-space:nowrap;border:none;border-radius:8px;padding:.75rem 1.5rem;font-size:.9rem;font-weight:600;transition:background .15s}.query-input button[type=submit]:hover:not(:disabled){background:var(--accent-hover)}.query-input button[type=submit]:disabled{opacity:.5;cursor:not-allowed}.schema-view{margin-bottom:2rem}.schema-view h2{margin-bottom:.75rem;font-size:1.1rem;font-weight:600}.schema-diagram{gap:1.25rem;padding:.5rem 0;display:flex;position:relative;overflow-x:auto}.fk-lines{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.schema-table{border:1px solid var(--border);background:var(--surface);border-radius:6px;flex-shrink:0;min-width:160px}.schema-table-name{font-family:var(--font-mono);color:var(--accent);border-bottom:1px solid var(--border);padding:.4rem .6rem;font-size:.8rem;font-weight:700}.schema-col{font-family:var(--font-mono);border-bottom:1px solid var(--border);justify-content:space-between;gap:1rem;padding:.2rem .6rem;font-size:.72rem;display:flex}.schema-col:last-child{border-bottom:none}.col-name{color:var(--text);align-items:center;gap:.3rem;display:flex}.col-type{color:var(--text-muted)}.pk,.fk{border-radius:3px;flex-shrink:0;padding:.05rem .25rem;font-size:.55rem;font-weight:700}.pk{color:var(--accent);background:#6c9eff26}.fk{color:#ffc107;background:#ffc10726}.result{margin-bottom:1.5rem}.sanitised-query{color:var(--text-muted);margin-bottom:.75rem;font-size:.85rem}.sanitised-query code{font-family:var(--font-mono);color:var(--success)}.error{color:var(--error);font-family:var(--font-mono);background:#ff6b6b1a;border:1px solid #ff6b6b4d;border-radius:8px;padding:.75rem 1rem;font-size:.85rem}.empty{color:var(--text-muted);padding:1rem 0;font-style:italic}.table-wrapper{border:1px solid var(--border);border-radius:8px;overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:.85rem}th{text-align:left;background:var(--surface);border-bottom:1px solid var(--border);font-weight:600;font-family:var(--font-mono);color:var(--accent);white-space:nowrap;padding:.6rem 1rem;font-size:.8rem}td{border-bottom:1px solid var(--border);font-family:var(--font-mono);padding:.5rem 1rem;font-size:.8rem}tr:last-child td{border-bottom:none}tr:hover td{background:#6c9eff0a}.null{color:var(--text-muted);font-style:italic}.query-list{margin-top:2rem}.query-list h2{margin-bottom:.75rem;font-size:1.1rem;font-weight:600}.query-table-header{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--border);grid-template-columns:1fr auto 1fr;gap:.75rem;padding:.5rem .75rem;font-size:.75rem;font-weight:600;display:grid}.query-row{border-bottom:1px solid var(--border);grid-template-columns:1fr auto 1fr;align-items:start;gap:.75rem;padding:.5rem .75rem;display:grid}.query-row:last-child{border-bottom:none}.query-row pre{font-family:var(--font-mono);white-space:pre-wrap;word-break:break-word;margin:0;font-size:.78rem}.query-row .raw{color:var(--text)}.query-row.success .san{color:var(--success)}.query-row.rejected .san{color:var(--error);font-size:.75rem}.status-badge{border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:1.4rem;height:1.4rem;margin-top:.1rem;font-size:.7rem;font-weight:700;display:flex}.status-badge.ok{color:var(--success);background:#4caf5026}.status-badge.err{color:var(--error);background:#ff6b6b26}
