.sql-workspace,.sql-workspace section{min-width:0}.sql-workspace .btn{min-height:44px}.sql-heading{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.sql-heading h2,.sql-heading h3{margin:0}.sql-heading .btn{font-size:12px}.sql-basics{grid-template-columns:110px minmax(0,1fr);gap:12px;display:grid}.sql-basics label,.sql-column label,.sql-condition label{gap:8px;min-width:0;display:grid}.sql-basics input,.sql-basics select{width:100%}.sql-columns,.sql-conditions{gap:12px;display:grid}.sql-column{grid-template-columns:minmax(0,1fr) 44px;align-items:end;gap:8px;display:grid}.sql-column:has([data-sql-remove-column][hidden]){grid-template-columns:minmax(0,1fr)}.sql-column>button{padding:10px}.sql-column label>span{color:var(--color-muted);font-size:12px}.sql-condition{border:var(--rule);background:var(--color-paper);border-radius:10px;grid-template-columns:minmax(0,1fr) minmax(0,.85fr) minmax(0,1.15fr) 44px;align-items:end;gap:8px;padding:12px;display:grid}.sql-condition label>span{color:var(--color-muted);font-size:12px}.sql-condition select,.sql-condition input{width:100%;min-width:0;padding-inline:8px}.sql-condition>button{padding:10px}.sql-condition .sql-condition-help{grid-column:1/-1;margin:0;font-size:12px}.sql-workspace .sql-output{font:14px/1.6 var(--font-mono);resize:vertical;height:300px;min-height:180px}.sql-examples{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}.sql-example{border:var(--rule);background:var(--color-paper);text-align:start;color:var(--color-ink);cursor:pointer;border-radius:10px;gap:8px;min-width:0;min-height:80px;padding:14px;display:grid}.sql-example code{font:600 12px var(--font-mono);color:var(--color-accent-ink)}.sql-example span{font-size:13px}.sql-tips{border-top:var(--rule);padding-top:12px}.sql-tips summary{cursor:pointer;min-height:44px}.sql-tips p{line-height:1.7}.sql-workspace [hidden]{display:none!important}.sql-workspace [data-sql-status].error{color:var(--color-danger,#bc3341)}@media (width<=767px){.sql-basics{grid-template-columns:1fr}.sql-condition{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 44px}.sql-condition-column{grid-column:1/3}.sql-condition>button{grid-area:1/3}.sql-condition-operator{grid-area:2/1}.sql-condition-value{grid-area:2/2/auto/4}.sql-workspace .sql-output{height:180px;font-size:16px}.sql-workspace .sql-heading{grid-template-columns:minmax(0,1fr) auto;gap:8px;display:grid}.sql-heading .btn{padding-inline:10px}.sql-heading h3{font-size:13px}}
