html:has(.join-lab){scroll-behavior:auto;scroll-padding-top:80px}
@media(max-width:600px){html:has(.join-lab){scroll-padding-top:115px}}
.sql-page .join-lab{margin:1.5rem 0 2.5rem;padding:clamp(16px,3vw,30px);border:1px solid #64748b;border-top:4px solid #0f766e;border-radius:12px;background:#f8fafc;color:#172b3a;scroll-margin-top:80px}
.sql-page .join-lab h2{margin:0 0 .7rem;color:#102c3a;font-size:clamp(1.3rem,3vw,1.8rem)}
.sql-page .join-lab p,.sql-page .join-lab label,.sql-page .join-lab legend,.sql-page .join-lab summary{color:#263f50;line-height:1.65}
.sql-page .join-lab a{color:#065f65;text-decoration:underline}.join-lab>*{min-width:0}.join-lab summary{cursor:pointer;padding:8px 0}.join-lab button,.join-lab select{font:inherit;min-height:44px;padding:8px 12px;border:1px solid #64748b;border-radius:6px;background:#fff;color:#172b3a;cursor:pointer;max-width:100%;white-space:normal}.join-lab button:disabled{opacity:.65;cursor:wait}.join-lab :focus-visible{outline:3px solid #b45309;outline-offset:3px}.join-lab .join-controls,.join-lab .join-actions,.join-lab .join-presets{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:12px 0}.join-lab #join-run{background:#0f766e;color:#fff;border-color:#0f766e}.join-lab textarea{display:block;box-sizing:border-box;width:100%;max-width:100%;min-height:155px;margin-top:6px;padding:14px;border:1px solid #64748b;border-radius:6px;background:#102c3a;color:#f0fdfa;font:14px/1.6 ui-monospace,monospace;resize:vertical}.join-lab .join-data{display:grid;grid-template-columns:1fr 1fr;gap:16px}.join-lab .join-table{overflow:auto;max-width:100%;margin:12px 0}.join-lab table{width:100%;border-collapse:collapse;background:white;color:#172b3a}.join-lab caption{text-align:left;font-weight:600;padding:8px 0}.join-lab th,.join-lab td{border:1px solid #cbd5e1;padding:8px 12px;text-align:left}.join-lab th{background:#e2e8f0}.join-lab .join-null{color:#92400e}.join-lab #join-status{font-weight:600;min-height:1.65em}.join-lab fieldset{border:1px solid #94a3b8;padding:14px;min-width:0}.join-lab fieldset label{display:block;margin:8px 0}.join-lab .join-scope,.join-lab #join-hint{font-size:.88rem}.join-lab input[type=radio]{width:18px;height:18px;vertical-align:middle}@media(max-width:600px){.sql-page .join-lab{scroll-margin-top:115px}.join-lab .join-presets{display:grid;grid-template-columns:1fr 1fr}.join-lab .join-presets button:last-child{grid-column:1/-1}.join-lab .join-data{grid-template-columns:1fr}.join-lab .join-actions button{flex:1 1 140px}.join-lab .join-presets button{flex:1 1 100px}}

.join-lab .join-reading{margin:1.5rem 0;padding:1rem 1.25rem;border-left:3px solid #50716b;background:#f4f7f6;overflow-wrap:anywhere}.join-lab .join-reading h3{margin:0 0 .75rem;font-size:1.1rem}.join-lab .join-reading p{line-height:1.85}
