.data-controls { display:flex; flex-wrap:wrap; gap:12px; align-items:center; }
.data-controls>label { max-width:100%; }
#data-name { font-size:1.3rem; overflow-wrap:anywhere; min-width:0; }
#data-query { width:300px; max-width:100%; }
#data-column { max-width:300px; }
#data-page { width:85px; }
.data-scroll { max-width:100%; max-height:65vh; overflow:auto; border:1px solid #dce4ed; border-radius:8px; }
.data-scroll table { margin-bottom:0; width:max-content; min-width:100%; }
.data-scroll thead { position:sticky; top:0; z-index:1; }
.data-scroll th { background:#eaf0f8; }
.data-scroll td { min-width:100px; max-width:360px; white-space:pre-wrap; overflow-wrap:anywhere; }
.data-scroll th button { color:#172c45; border:0; background:none; text-align:left; max-width:300px; overflow-wrap:anywhere; }
#data-tree li { display:flex; flex-wrap:wrap; gap:10px; align-items:baseline; }
#data-tree .data-key { font-weight:700; overflow-wrap:anywhere; }
.data-value { white-space:pre-wrap; overflow-wrap:anywhere; min-width:0; }
.data-type { color:#65768b; font-size:.8rem; }
#data-path button { max-width:250px; overflow-wrap:anywhere; white-space:normal; }
#data-node,#data-caption { overflow-wrap:anywhere; }
#data-status[data-error=true] { color:#b02a37; }
.data-viewer [hidden] { display:none!important; }

#data-tree .data-key { max-width:100%; white-space:normal; }
#data-node { white-space:pre-wrap; }