.young-workspace {
  --young-ink: #193d4b;
  --young-metal: #c6d2dc;
  --young-paper: #f8fafb;
  --young-accent: #a52c27;
}
.young-workspace svg {
  width: 100%;
  height: auto;
  display: block;
  background: var(--young-paper);
  border: 1px solid #c4d1d9;
  border-radius: 10px;
  margin: 1rem 0;
  color: var(--young-ink);
}
.young-workspace svg text {
  fill: var(--young-ink);
  font:
    16px system-ui,
    sans-serif;
}
.young-workspace .young-small {
  font-size: 12px;
}
.young-frame {
  fill: none;
  stroke: #476878;
  stroke-width: 30;
  stroke-linejoin: round;
}
.young-metal {
  fill: var(--young-metal);
  stroke: #344f60;
  stroke-width: 2;
}
.young-axis {
  stroke: #617783;
  stroke-dasharray: 4 4;
}
.young-wire {
  fill: #c27532;
  stroke: #75441b;
}
.young-wire-line {
  stroke: #a76327;
  stroke-width: 3;
}
.young-sleeve,
.young-ruler {
  fill: #fff0c7;
  stroke: #5d666a;
  stroke-width: 2;
}
.young-thimble {
  fill: #d9e3ea;
  stroke: #3a5364;
  stroke-width: 2;
}
.young-ink {
  stroke: #193d4b;
  stroke-width: 1.5;
}
.young-reference {
  stroke: #b3252c;
  stroke-width: 2;
  fill: none;
}
.young-support {
  stroke: #3a5364;
  stroke-width: 7;
  fill: none;
}
.young-screen {
  fill: #adcfdb22;
  stroke: #407984;
  stroke-dasharray: 6 4;
  stroke-width: 2;
}
.young-preload {
  fill: #a5aab1;
  stroke: #414e57;
}
.young-mass {
  fill: #4a6e81;
  stroke: #183a4b;
  stroke-width: 2;
}
.young-rack {
  fill: #e1e8ec;
  stroke: #7b929f;
}
.young-fiducial {
  stroke: #b3252c;
  stroke-width: 3;
  fill: none;
}
.young-lens {
  fill: #bae8f633;
  stroke: #176881;
  stroke-width: 3;
}
.young-draggable {
  cursor: grab;
  touch-action: none;
}
.young-draggable:active {
  cursor: grabbing;
}
.young-draggable:focus {
  outline: 3px solid #146cb2;
  outline-offset: 4px;
}
.young-workspace button {
  margin: 0.6rem 0.5rem 0.6rem 0;
}
.young-workspace label {
  display: block;
  margin: 0.75rem 0;
}
.young-workspace input[type="range"] {
  display: block;
  width: min(100%, 32rem);
}
.young-workspace input[type="number"] {
  max-width: 12rem;
  width: 100%;
  padding: 0.45rem;
}
.young-table-wrap,
.young-graph-wrap {
  overflow-x: auto;
  margin: 1rem 0;
}
.young-workspace table {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
}
.young-workspace th,
.young-workspace td {
  padding: 0.55rem;
  border-bottom: 1px solid #c8d3da;
}
.young-workspace caption {
  text-align: left;
  font-weight: 700;
  padding: 0.6rem 0;
}
.young-workspace td input {
  min-width: 6.5rem;
}
.young-bench {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(240px, 1fr);
  gap: 1.5rem;
  align-items: center;
}
.young-safety {
  padding: 1rem;
  border-left: 4px solid #b88013;
  background: #fff4dc;
  color: #42351b;
}
.young-correction {
  background: #fff0c5;
  color: #57400c;
  padding: 0.4rem;
}
.young-workspace svg[data-young-graph] {
  min-width: 620px;
}
.young-length-zoom svg {
  max-width: 720px;
}
.young-grid-minor {
  stroke: #dbe4e9;
  stroke-width: 0.6;
}
.young-grid-major {
  stroke: #a3b7c2;
  stroke-width: 1;
}
.young-fit {
  stroke: #185da2;
  stroke-width: 2;
  fill: none;
}
.young-point {
  fill: #185da2;
}
.young-unload {
  stroke: #b35418;
  stroke-width: 2;
  fill: none;
}
.young-bench-controls p {
  line-height: 1.6;
}
@media (max-width: 700px) {
  .young-bench {
    grid-template-columns: 1fr;
  }
  .young-workspace svg.young-micrometer {
    min-width: 580px;
  }
  .young-instrument {
    overflow-x: auto;
  }
  .young-workspace .young-loading {
    max-width: 420px;
    margin: auto;
  }
}
.young-workspace [hidden] {
  display: none !important;
}
.young-vernier-plate {
  fill: #e4f0f6;
  stroke: #416b80;
  stroke-width: 1.5;
}
.young-vernier-selected line {
  stroke: #1565ad;
  stroke-width: 4;
}
.young-vernier-selected text {
  font-weight: 700;
  fill: #1565ad;
}
[data-young-vernier-tick][role="button"] {
  cursor: pointer;
  touch-action: manipulation;
}
[data-young-vernier-tick][role="button"]:focus {
  outline: 2px solid #1565ad;
}
.young-vernier-wrap {
  overflow-x: auto;
}
.young-vernier-wrap svg {
  min-width: 650px;
}
.young-screen-reader {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.young-wire-map{width:100%;max-height:150px}.young-wire-map [aria-pressed="true"] circle{stroke:#d97706;stroke-width:5}
