/* ── GEO STRIP (card studio sticky bar) ── */
#geo-strip {
  background: var(--bg-cool);
  border-bottom: 1px solid var(--bg-sand);
  padding: 8px 20px;
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
  font-size: 12px
}

#gs-lbl {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--light);
  white-space: nowrap;
  flex-shrink: 0
}

#gs-dropzone {
  border: 1.5px dashed var(--bd);
  border-radius: 7px;
  padding: 6px 14px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 7px;
  color: var(--light);
  font-size: 12px;
  transition: border-color .15s, color .15s;
  white-space: nowrap
}

#gs-dropzone:hover,
#gs-dropzone.over {
  border-color: var(--mid);
  color: var(--ink)
}

#gs-chip {
  display: none;
  align-items: center;
  gap: 7px;
  background: #f0f5fc;
  border: 1px solid #1a4f8a44;
  border-radius: 6px;
  padding: 5px 11px;
  font-size: 12px;
  color: var(--blue);
  min-width: 0;
  max-width: 340px
}

#gs-chip-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  flex: 1;
  font-weight: 500
}

#gs-chip-x {
  background: none;
  border: none;
  cursor: pointer;
  color: var(--light);
  font-size: 15px;
  line-height: 1;
  padding: 0 2px;
  flex-shrink: 0
}

#gs-chip-x:hover {
  color: var(--accent)
}

#gs-chip-change {
  background: none;
  border: 1px solid #1a4f8a55;
  border-radius: 4px;
  padding: 2px 8px;
  font-size: 10px;
  font-family: var(--font-ui);
  color: var(--blue);
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
  transition: border-color .15s
}

#gs-chip-change:hover {
  border-color: var(--blue)
}

.gs-chip-uploading {
  background: var(--card) !important;
  border-color: var(--light) !important;
  color: var(--light) !important;
  cursor: wait;
  opacity: 0.8;
  animation: pulseUpload 1.5s infinite alternate;
}

.gs-chip-uploading #gs-chip-change,
.gs-chip-uploading #gs-chip-x {
  display: none !important;
}

@keyframes pulseUpload {
  0% { opacity: 0.6; }
  100% { opacity: 1; }
}

.gs-chip-error {
  background: #fdf2f2 !important;
  border-color: #fca5a5 !important;
  color: #dc2626 !important;
  cursor: pointer;
  transition: all 0.2s ease;
}

.gs-chip-error:hover {
  background: #fee2e2 !important;
}

.gs-chip-error #gs-chip-change,
.gs-chip-error #gs-chip-x {
  display: none !important;
}

#gs-err {
  font-size: 11px;
  color: var(--accent);
  flex-shrink: 0
}

/* ── Linkage dropzone / chip — mirrors #gs-dropzone / #gs-chip styling ── */
#ls-dropzone {
  border: 1.5px dashed var(--bd);
  border-radius: 7px;
  padding: 6px 14px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 7px;
  color: var(--light);
  font-size: 12px;
  transition: border-color .15s, color .15s;
  white-space: nowrap
}

#ls-dropzone:hover,
#ls-dropzone.over {
  border-color: #2b83ba;
  color: var(--ink)
}

#ls-chip {
  display: none;
  align-items: center;
  gap: 7px;
  background: #eef6fb;
  border: 1px solid #2b83ba44;
  border-radius: 6px;
  padding: 5px 11px;
  font-size: 12px;
  color: #1f6690;
  min-width: 0;
  max-width: 340px
}

#ls-chip-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  flex: 1;
  font-weight: 500
}

#ls-chip-x {
  background: none;
  border: none;
  cursor: pointer;
  color: var(--light);
  font-size: 15px;
  line-height: 1;
  padding: 0 2px;
  flex-shrink: 0
}

#ls-chip-x:hover {
  color: var(--accent)
}

#ls-chip-change {
  background: none;
  border: 1px solid #2b83ba55;
  border-radius: 4px;
  padding: 2px 8px;
  font-size: 10px;
  font-family: var(--font-ui);
  color: #1f6690;
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
  transition: border-color .15s
}

#ls-chip-change:hover {
  border-color: #2b83ba
}

#ls-err {
  font-size: 11px;
  color: var(--accent);
  flex-shrink: 0
}