/* kodybrown.me — R&D demo: AI GD&T check/create agent on an Onshape drawing.
   Scoped entirely under #demo-gdt. Companion to js/demo-gdt.js, which builds
   all interior DOM. Palette matches style.css tokens (hard-coded here so the
   file stands alone). */

#demo-gdt {
  background: #121417;
}

#demo-gdt .gdt-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 12px;
  border-bottom: 1px solid rgba(159, 180, 200, .14);
  font-family: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 10px;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #8b93a0;
}

#demo-gdt .gdt-head .gdt-head-r {
  flex: none;
  color: #6d7683;
}

#demo-gdt .gdt-stage {
  padding: 10px 10px 8px;
  background: #121417;
}

#demo-gdt svg {
  display: block;
  width: 100%;
  height: auto;
  user-select: none;
  -webkit-user-select: none;
}

#demo-gdt svg text {
  font-family: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  letter-spacing: .02em;
}

/* caption row under the sheet */
#demo-gdt .gdt-cap {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin: 0 10px;
  padding: 7px 2px 8px;
  border-top: 1px solid rgba(159, 180, 200, .14);
  font-family: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 9px;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: #8b93a0;
}

#demo-gdt .gdt-cap .gdt-cap-r {
  flex: none;
  color: #6d7683;
}

@media (min-width: 460px) {
  #demo-gdt .gdt-cap { font-size: 9.5px; }
  #demo-gdt .gdt-head { font-size: 10.5px; }
}