.connect-data { min-width:0; }
.connect-data label { display:block; font:400 12px/1.6 var(--sans); color:var(--muted); }
.connect-data input:not([type=radio]):not([type=checkbox]),.connect-data select,.connect-data textarea { display:block; width:100%; min-width:0; min-height:44px; margin-top:5px; border:1px solid var(--line); border-radius:7px; padding:10px 12px; color:var(--ink); background:var(--paper); font:400 13px/1.5 var(--sans); }
.connect-data textarea { resize:vertical; }
.connect-data-search-field { display:block; position:relative; min-width:0; margin-top:5px; }
.connect-data #connect-data-search { margin-top:0; padding-left:38px; }
.connect-data-search-icon { position:absolute; left:12px; top:50%; transform:translateY(-50%); width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; color:var(--muted); pointer-events:none; }
.connect-data fieldset { min-width:0; padding:0; border:0; margin:20px 0; }
.connect-data legend { color:var(--muted); font-size:12px; margin-bottom:10px; }
.connect-data-system { display:grid; grid-template-columns:1fr auto; width:100%; text-align:left; gap:5px 16px; border:1px solid var(--line); border-radius:10px; padding:20px; background:var(--paper); color:var(--ink); }
.connect-data-system strong { font:500 18px/1.5 var(--sans); }
.connect-data-system span:first-of-type { grid-column:1; color:var(--muted); font:400 12px/1.7 var(--sans); }
.connect-data-system span:last-child { grid-column:2; grid-row:1/3; align-self:center; color:var(--teal); }
.connect-data-testing { padding-top:12px; }
.connect-data-testing small { display:block; margin-top:4px; color:var(--muted); font-size:11px; }
.connect-data-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin:20px 0; }
.connect-data-connections,.connect-data-parameters { display:grid; gap:9px; }
.connect-data .connect-data-choice { display:flex; align-items:flex-start; gap:12px; border:1px solid var(--line); border-radius:8px; padding:12px; color:var(--ink); cursor:pointer; }
.connect-data-choice:has(input:checked) { border-color:var(--teal); background:#f4faf6; }
.connect-data-choice:has(input:focus-visible),.connect-data-system:focus-visible { outline:2px solid var(--teal); outline-offset:3px; }
.connect-data-choice:has(input:disabled) { opacity:.55; cursor:default; }
.connect-data-choice input { margin:4px 0 0; flex-shrink:0; accent-color:var(--teal); }
.connect-data-choice span { min-width:0; }
.connect-data-choice strong,.connect-data-choice small { display:block; overflow-wrap:anywhere; }
.connect-data-choice strong { font-weight:500; }
.connect-data-choice small { color:var(--muted); font-size:11px; margin-top:3px; }
.connect-data .connect-data-parameters { max-height:min(330px,40dvh); overflow:auto; overscroll-behavior:contain; padding:3px; }
.connect-data-actions { flex-wrap:wrap; }
.connect-data-selection-actions { display:flex; flex-wrap:wrap; gap:8px; margin:14px 0 8px; }
.connect-data-selection-actions button { min-height:44px; }
.connect-data-pagination { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:10px 0 18px; color:var(--muted); font-size:11px; }
.connect-data-pagination span { margin-right:auto; }
.connect-data-pagination button { min-height:44px; }
.connect-data-satnogs-mapping { min-width:0; border:1px solid var(--line); border-radius:8px; padding:14px; }
.connect-data-satnogs-mapping h3 { overflow-wrap:anywhere; margin:0 0 12px; font:500 14px/1.5 var(--sans); }
.connect-data-satnogs-sample { display:grid; grid-template-columns:minmax(110px,1fr) minmax(0,2fr); gap:7px 14px; font-size:11px; }
.connect-data-satnogs-sample dt { color:var(--muted); }
.connect-data-satnogs-sample dd { margin:0; overflow-wrap:anywhere; }
#connect-data-selected > span { display:block; }
.connect-data-review-list { display:grid; gap:10px; margin:18px 0; }
.connect-data-review-item { min-width:0; padding:12px; border:1px solid var(--line); border-radius:8px; }
.connect-data-review-item > summary { display:grid; grid-template-columns:minmax(0,1fr) minmax(120px,auto); gap:12px; cursor:pointer; color:var(--ink); min-height:44px; }
.connect-data-review-item > summary:focus-visible { outline:2px solid var(--teal); outline-offset:3px; }
.connect-data-review-item strong,.connect-data-review-item small { display:block; overflow-wrap:anywhere; }
.connect-data-review-item strong { font:500 13px/1.5 var(--sans); }
.connect-data-review-item small { margin-top:4px; color:var(--muted); font:400 11px/1.5 var(--sans); }
.connect-data-review-value { text-align:right; font:400 18px/1.4 var(--serif); overflow-wrap:anywhere; }
.connect-data-review-item[open] > summary { margin-bottom:14px; }
.connect-data-reading { padding:18px; border:1px solid var(--line); border-radius:9px; background:#f7faf8; }
.connect-data-reading .eyebrow { display:block; margin:8px 0; overflow-wrap:anywhere; }
.connect-data-reading strong { display:block; font:400 32px/1.3 var(--serif); overflow-wrap:anywhere; }
.connect-data-reading strong small { font:400 13px/1.5 var(--sans); }
.connect-data-reading dl,.connect-data-provenance dl { display:grid; grid-template-columns:minmax(100px,1fr) minmax(0,2fr); gap:8px 18px; font-size:11px; }
.connect-data-reading dt,.connect-data-provenance dt { color:var(--muted); }
.connect-data-reading dd,.connect-data-provenance dd { margin:0; overflow-wrap:anywhere; }
.connect-data-provenance { margin:18px 0; font-size:12px; }
.connect-data-provenance summary { cursor:pointer; min-height:36px; color:var(--teal); padding:7px 0; }
.connect-data .connect-data-note { color:var(--muted); font-size:11px; }
@media(max-width:560px) { .connect-data-fields { grid-template-columns:minmax(0,1fr); gap:14px; } .connect-data-reading dl,.connect-data-provenance dl { grid-template-columns:minmax(0,1fr); gap:3px; } .connect-data-reading dd,.connect-data-provenance dd { margin-bottom:8px; } .connect-data-actions button { min-height:44px; } }
@media(max-width:560px) { .connect-data-review-item > summary { grid-template-columns:minmax(0,1fr); gap:8px; } .connect-data-review-value { text-align:left; } }
@media(max-width:560px) { .connect-data-satnogs-sample { grid-template-columns:minmax(0,1fr); gap:3px; } .connect-data-satnogs-sample dd { margin-bottom:7px; } }
.connect-data-provenance pre { max-height:220px; overflow:auto; white-space:pre-wrap; overflow-wrap:anywhere; font-size:11px; padding:10px; background:#f7f9f7; border:1px solid var(--line); border-radius:6px; }
/* Compact presentation choices on the existing mapping page. */
.connect-data-presentation { display:grid; grid-template-columns:minmax(0,1fr); gap:4px; align-items:start; }
.connect-data .connect-data-colors { display:flex; align-items:center; flex-wrap:wrap; gap:3px; margin:0; padding:0; }
.connect-data-colors legend { width:100%; margin:0 0 6px; }
.connect-data .connect-data-color-choice { position:relative; display:inline-flex; align-items:center; justify-content:center; width:30px; height:34px; cursor:pointer; }
.connect-data-color-choice input { position:absolute; width:1px; height:1px; opacity:0; }
.connect-data-color-ring,.connect-data-color-clear { display:flex; align-items:center; justify-content:center; width:27px; height:27px; border:1px solid transparent; border-radius:50%; color:var(--muted); font:400 16px/1 var(--sans); }
.connect-data-color-clear { border:1px dashed var(--muted); background:transparent; }
.connect-data-color-choice .label-color-dot { width:13px; height:13px; flex:0 0 13px; }
.connect-data-color-choice:has(input:checked) .connect-data-color-ring,.connect-data-color-choice:has(input:checked) .connect-data-color-clear { border-color:var(--ink); }
.connect-data-color-choice:has(input:focus-visible) { outline:2px solid var(--teal); outline-offset:1px; border-radius:5px; }
.connect-data-color-choice:has(input:disabled) { opacity:.5; cursor:default; }
.connect-data-label-picker { min-width:0; font:400 12px/1.6 var(--sans); }
.connect-data-label-picker > summary { min-height:38px; padding:7px 0; color:var(--ink); cursor:pointer; }
.connect-data-label-picker[open] { grid-column:1/-1; }
.connect-data-label-picker[open] > div { border:1px solid var(--line); border-radius:7px; padding:12px; }
.connect-data-label-options { display:grid; gap:8px; max-height:180px; overflow:auto; }
.connect-data .connect-data-label-options label { display:flex; align-items:center; gap:8px; min-height:32px; color:var(--ink); overflow-wrap:anywhere; }
.connect-data-label-options input { margin:0; accent-color:var(--teal); }
.connect-data-new-label { display:grid; gap:8px; margin-top:12px; }
.connect-data-new-label > button { justify-self:start; }
.connect-data-new-label > small { color:var(--muted); }
.connect-data-label-drafts { display:flex; flex-wrap:wrap; gap:5px; margin-top:10px; }
.connect-data-label-chip { display:inline-flex; align-items:center; gap:5px; max-width:100%; color:var(--ink); font:400 11px/1.5 var(--sans); overflow-wrap:anywhere; }
.connect-data-label-chip button { border:0; background:transparent; color:var(--muted); font-size:16px; min-width:28px; min-height:28px; cursor:pointer; }
.connect-data-reading-dot { display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:7px; background:#7c8794; }
.connect-data-reading-dot[data-reading-color="sage"] { background:#249a62; }
.connect-data-reading-dot[data-reading-color="sky"] { background:#238be0; }
.connect-data-reading-dot[data-reading-color="amber"] { background:#c27d0f; }
.connect-data-reading-dot[data-reading-color="rose"] { background:#e45b81; }
.connect-data-reading-dot[data-reading-color="violet"] { background:#9d6aec; }
.connect-data-literal-type { display:grid; gap:6px; align-content:start; font:400 12px/1.6 var(--sans); color:var(--muted); }
.connect-data-literal-type strong { font-weight:400; color:var(--ink); padding-top:7px; }
.connect-data-literal-type small { color:var(--muted); }
.connect-data-unit-field { min-width:0; }
.connect-data-unit-input { position:relative; }
.connect-data .connect-data-unit-input input { padding-right:49px; }
.connect-data-unit-input > button { position:absolute; right:1px; top:1px; bottom:1px; min-width:44px; border:0; border-left:1px solid var(--line); border-radius:0 6px 6px 0; background:transparent; color:var(--ink); cursor:pointer; font:400 15px/1 var(--sans); }
.connect-data-unit-input > button:disabled { color:var(--muted); opacity:.5; cursor:default; }
.connect-data-unit-symbols { position:fixed; z-index:10; box-sizing:border-box; width:320px; max-width:calc(100vw - 32px); max-height:280px; overflow:auto; padding:12px; border:1px solid var(--line); border-radius:8px; background:var(--paper); color:var(--ink); box-shadow:0 5px 18px #0002; }
.connect-data-unit-symbols[hidden] { display:none; }
.connect-data-symbol-group + .connect-data-symbol-group { margin-top:11px; }
.connect-data-symbol-group > span { display:block; margin-bottom:6px; color:var(--muted); font:400 11px/1.5 var(--sans); }
.connect-data-symbol-group > div { display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); gap:3px; }
.connect-data-symbol-group button { min-width:0; min-height:32px; border:1px solid transparent; border-radius:4px; background:transparent; color:var(--ink); font:400 17px/1.2 var(--sans); cursor:pointer; }
.connect-data-symbol-group button:hover,.connect-data-symbol-group button:focus-visible { border-color:var(--teal); background:var(--teal-tint,#edf6f2); }
.connect-data-unit-symbols > small { display:block; margin-top:10px; color:var(--muted); font:400 10px/1.5 var(--sans); }
@media(max-width:560px) { .connect-data-unit-symbols { width:290px; } }

.connect-data .sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

.connect-data-reviewed-labels { display:flex; flex-wrap:wrap; gap:5px 12px; margin-top:6px; }
.connect-data-reviewed-labels:empty { display:none; }