/* Circuit-map homepage. The board uses an exact 10px pitch so component pins,
   wire sockets, holes, and trench geometry share the same coordinate system. */

body.homepage { overflow: hidden; }
body.homepage #quarto-header,
body.homepage #quarto-sidebar,
body.homepage #quarto-margin-sidebar,
body.homepage #title-block-header,
body.homepage .page-navigation,
body.homepage footer { display: none !important; }
body.homepage #quarto-content {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: 100dvh;
  margin: 0 !important;
  padding: 0 !important;
}
body.homepage main.content {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

.home-circuit-viewport {
  width: 100%;
  height: 100%;
  min-height: 0;
  margin: 0;
  overflow: auto;
  border: 0;
  border-radius: 0;
  background: #d7d2c3;
  box-shadow: none;
}
.home-circuit-viewport--overview {
  position: relative;
  overflow: hidden;
}
.home-circuit-viewport:not(.home-circuit-viewport--overview) {
  cursor: grab;
  touch-action: none;
}
.home-circuit-viewport--panning,
.home-circuit-viewport--panning * {
  cursor: grabbing !important;
  user-select: none;
}

.home-circuit-board {
  --board-pitch: 10px;
  --core-x: 2880px;
  --core-y: 1980px;
  position: relative;
  isolation: isolate;
  box-sizing: border-box;
  width: 7200px;
  height: 3300px;
  min-width: 100%;
  overflow: hidden;
  border: 10px solid #c6c1b1;
  background-color: #f4f2e9;
  background-image:
    radial-gradient(circle, #6f706a 0 2px, #d4d1c5 2.2px 3.4px, transparent 3.6px);
  background-position: 0 0;
  background-size: var(--board-pitch) var(--board-pitch);
  box-shadow:
    inset 10px 0 10px -8px rgba(47,43,34,.72),
    inset -10px 0 10px -8px rgba(47,43,34,.72),
    inset 0 10px 10px -8px rgba(47,43,34,.5),
    inset 0 -10px 10px -8px rgba(47,43,34,.5);
}
.home-circuit-board:not(.is-ready) { visibility:hidden; }
.home-circuit-board--overview {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 0;
  transform: translate(-50%,-50%) scale(var(--overview-scale, .1));
  transform-origin: center;
}

.home-circuit-trench {
  position: absolute;
  z-index: 0;
  display: block;
  background: linear-gradient(to bottom,
    #e7e2d4 0, #aaa79c 2px, #5e605b 4px,
    #4b4d49 6px, #aaa79c 8px, #f0ecdf 10px);
  box-shadow: inset 0 1px rgba(255,255,255,.68), inset 0 -1px rgba(51,48,41,.3);
}
.home-circuit-trench--h { top: calc(var(--track) - 5px); left: 0; right: 0; height: 10px; }
.home-circuit-trench--v {
  top: 0;
  bottom: 0;
  left: calc(var(--track) - 5px);
  width: 10px;
  transform: rotate(180deg);
  background: linear-gradient(to right,
    #e7e2d4 0, #aaa79c 2px, #5e605b 4px,
    #4b4d49 6px, #aaa79c 8px, #f0ecdf 10px);
}

.home-circuit-memory-card {
  position: absolute;
  z-index: 1;
  box-sizing: border-box;
  display: block;
  overflow: hidden;
  border: 3px solid #173f2d;
  border-radius: 8px;
  background-color: #226244;
  background-image:
    radial-gradient(circle at center,rgba(225,203,111,.58) 0 1px,transparent 1.4px),
    linear-gradient(90deg,transparent 0 8%,rgba(169,151,73,.24) 8% 8.4%,transparent 8.4% 48%,rgba(169,151,73,.2) 48% 48.4%,transparent 48.4%),
    linear-gradient(0deg,#2d7654,#1d563c);
  background-size: 20px 20px,100% 100%,100% 100%;
  box-shadow: inset 0 0 0 2px rgba(202,221,189,.13),0 3px 7px rgba(35,31,24,.35);
}
.home-circuit-memory-card > span {
  position: absolute;
  z-index: 1;
  color: rgba(232,226,184,.72);
  font: 700 9px/1 "Courier New",monospace;
  letter-spacing: .14em;
}
.home-circuit-memory-card::before {
  position: absolute;
  content: "";
  opacity: .45;
  background: repeating-linear-gradient(90deg,transparent 0 38px,#b2a45c 38px 40px,transparent 40px 60px);
}
.home-circuit-memory-card::after {
  position: absolute;
  content: "";
  background: repeating-linear-gradient(90deg,#d4ad38 0 12px,#7f6418 12px 15px,transparent 15px 20px);
  box-shadow: inset 0 1px rgba(255,244,175,.72);
}
.home-circuit-memory-card--deduct { left: calc(var(--core-x) + 180px); top: calc(var(--core-y) + 20px); width: 960px; height: 150px; }
.home-circuit-memory-card--deduct > span { top: 8px; left: 18px; }
.home-circuit-memory-card--deduct::before { inset: 28px 12px 18px; }
.home-circuit-memory-card--deduct::after { right: 22px; bottom: 0; left: 22px; height: 10px; }
.home-circuit-memory-card--induct { left: calc(var(--core-x) + 960px); top: calc(var(--core-y) + 220px); width: 220px; height: 630px; }
.home-circuit-memory-card--abduct { left: calc(var(--core-x) + 140px); top: calc(var(--core-y) + 220px); width: 220px; height: 630px; }
.home-circuit-memory-card--induct > span,
.home-circuit-memory-card--abduct > span { top: 16px; left: 50%; transform: translateX(-50%); white-space: nowrap; }
.home-circuit-memory-card--induct::before,
.home-circuit-memory-card--abduct::before {
  inset: 38px 20px 20px;
  transform: rotate(90deg);
}
.home-circuit-memory-card--induct::after,
.home-circuit-memory-card--abduct::after {
  top: 22px;
  bottom: 22px;
  width: 10px;
  background: repeating-linear-gradient(0deg,#d4ad38 0 12px,#7f6418 12px 15px,transparent 15px 20px);
}
.home-circuit-memory-card--induct::after { left: 0; }
.home-circuit-memory-card--abduct::after { right: 0; }

.home-circuit-wires { position: absolute; z-index: 4; inset: 0; overflow: visible; pointer-events: none; }
.home-circuit-wire { fill: none; stroke-linejoin: round; }
/* Copper stays narrow enough to be fully covered by its jacket along the run,
   then shows cleanly at the deliberately unjacketed endpoints. */
.home-circuit-wire--copper { stroke: #b7652d; stroke-width: 6px; stroke-linecap: round; }
.home-circuit-wire--jacket,
.home-circuit-wire--highlight { stroke-linecap: butt; }
.home-circuit-wire--topic { stroke-width: 8px; }
.home-circuit-wire--inner,
.home-circuit-wire--capacitor { stroke-width: 8px; }
.home-circuit-wire--reading { stroke-width: 7px; filter: drop-shadow(0 1px 1px rgba(39,31,22,.45)); }
.home-circuit-wire--library { stroke-width: 7px; filter: drop-shadow(0 1px 1px rgba(77,20,18,.5)); }
.home-circuit-wire--survey { stroke-width: 9px; filter: drop-shadow(0 1px 1px rgba(10,50,90,.48)); }
.home-circuit-wire--memory { stroke-width: 8px; }
.home-circuit-wire--cpu { stroke-width: 10px; filter: drop-shadow(0 2px 1px rgba(39,31,22,.3)); }
.home-circuit-wire--highlight.home-circuit-wire--topic { stroke-width: 2px; opacity: .94; }
.home-circuit-wire--highlight.home-circuit-wire--inner,
.home-circuit-wire--highlight.home-circuit-wire--capacitor { stroke-width: 2px; opacity: .94; }
.home-circuit-wire--highlight.home-circuit-wire--reading { stroke-width: 1.5px; opacity: .75; }
.home-circuit-wire--highlight.home-circuit-wire--library { stroke-width: 2px; opacity: .92; }
.home-circuit-wire--highlight.home-circuit-wire--survey { stroke-width: 2px; opacity: .92; }
.home-circuit-wire--highlight.home-circuit-wire--memory { stroke-width: 2px; opacity: .94; }
.home-circuit-wire--highlight.home-circuit-wire--cpu { stroke-width: 2.5px; opacity: .94; }

.home-circuit-details {
  position: absolute;
  z-index: 1;
  inset: 0;
  display: block;
  pointer-events: none;
}
.home-circuit-detail {
  position: absolute;
  left: calc(var(--core-x) + var(--x));
  top: calc(var(--core-y) + var(--y));
  box-sizing: border-box;
  display: block;
}
.home-circuit-detail--resistor,
.home-circuit-detail--diode {
  width: 40px;
  height: 20px;
  background: linear-gradient(#b7652d,#b7652d) center / 100% 3px no-repeat;
}
.home-circuit-detail--resistor i {
  position: absolute;
  top: 3px;
  left: 10px;
  width: 20px;
  height: 14px;
  border: 1px solid #755328;
  border-radius: 48% 48% 44% 44%;
  background: linear-gradient(90deg,#c49a5a,#e0bd79 45%,#b98849);
  clip-path: polygon(0 22%,18% 7%,40% 18%,50% 30%,60% 18%,82% 7%,100% 22%,100% 78%,82% 93%,60% 82%,50% 70%,40% 82%,18% 93%,0 78%);
  box-shadow: 0 1px 2px rgba(44,30,15,.45);
}
.home-circuit-detail--resistor b {
  position: absolute;
  z-index: 1;
  top: 4px;
  width: 3px;
  height: 12px;
  background: #b52424;
}
.home-circuit-detail--resistor b:nth-of-type(1) { left: 15px; }
.home-circuit-detail--resistor b:nth-of-type(2) { left: 20px; background: #171918; }
.home-circuit-detail--resistor b:nth-of-type(3) { left: 25px; background: #25823e; }
.home-circuit-detail--diode i {
  position: absolute;
  top: 4px;
  left: 10px;
  width: 20px;
  height: 12px;
  border: 1px solid #101817;
  border-radius: 3px;
  background: linear-gradient(90deg,#182e2b 0 68%,#c8d2cb 68% 82%,#152522 82%);
  box-shadow: inset 0 2px rgba(255,255,255,.12),0 1px 2px rgba(25,22,16,.5);
}
.home-circuit-detail--led {
  /* Radial parts use --x/--y as a pin-aligned centre, unlike axial parts. */
  width: 40px;
  height: 40px;
  transform: translate(-20px,-20px);
  background: none;
}
.home-circuit-detail--led i {
  position: absolute;
  top: 5px;
  left: 5px;
  width: 30px;
  height: 30px;
  border: 2px solid #2a6137;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 27%,#ecffd8 0 8%,#78ed63 19%,#28a647 55%,#11622d 100%);
  box-shadow: 0 0 5px rgba(66,221,91,.75),inset 1px 1px 2px rgba(255,255,255,.45);
}
.home-circuit-detail--led-amber i {
  border-color: #795311;
  background: radial-gradient(circle at 35% 27%,#fffbd0 0 8%,#ffd85a 19%,#e9911d 55%,#87500b 100%);
  box-shadow: 0 0 5px rgba(255,183,41,.72),inset 1px 1px 2px rgba(255,255,255,.45);
}
.home-circuit-detail--capacitor {
  width: 60px;
  height: 60px;
  transform: translate(-30px,-30px);
  background: none;
}
.home-circuit-detail--capacitor i {
  position: absolute;
  top: 5px;
  left: 5px;
  width: 50px;
  height: 50px;
  border: 2px solid #173f46;
  border-radius: 50%;
  background: radial-gradient(circle,#315e66 0 68%,#173e45 84%,#0d282d 100%);
  box-shadow: inset 0 1px 2px rgba(225,255,255,.45), inset 0 -3px 4px rgba(8,31,36,.55), 0 2px 3px rgba(35,40,42,.42);
}
.home-circuit-detail--capacitor i::before {
  position: absolute;
  inset: 5px;
  content: "";
  border: 1px solid #707a7d;
  border-radius: 50%;
  background: radial-gradient(circle at 34% 27%,#ffffff 0 8%,#dfe5e6 28%,#aab4b7 64%,#697477 100%);
  box-shadow: inset 0 1px 2px rgba(255,255,255,.95), inset 0 -2px 3px rgba(39,47,50,.42), 0 0 0 1px rgba(211,232,234,.3);
}
.home-circuit-detail--capacitor i::after {
  position: absolute;
  top: 19px;
  left: 19px;
  width: 8px;
  height: 8px;
  content: "";
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%,#f7faf9 0 15%,#aeb9bb 45%,#697477 100%);
  box-shadow: inset 1px 1px 2px rgba(255,255,255,.72), inset -1px -1px 2px rgba(40,48,50,.55);
}
.home-circuit-detail--coil {
  width: 60px;
  height: 30px;
  transform: translate(-30px,-15px);
}
.home-circuit-detail--coil i {
  position: absolute;
  top: 3px;
  left: 12px;
  width: 36px;
  height: 24px;
  border: 2px solid #4d3429;
  border-radius: 50%;
  background:
    repeating-linear-gradient(90deg,#69351f 0 3px,#c16a32 3px 6px,#e39a4c 6px 8px,#7e3d22 8px 11px),
    #2a2425;
  box-shadow: inset 0 1px 2px rgba(255,219,167,.45), inset 0 -2px 3px rgba(19,18,20,.72), 0 1px 2px rgba(35,25,20,.48);
}
.home-circuit-detail--coil i::after {
  position: absolute;
  inset: 4px 7px;
  content: "";
  border-radius: 50%;
  background: radial-gradient(ellipse at 35% 28%,#4b4a4c,#25272b 66%,#11151a);
  box-shadow: inset 1px 1px 2px rgba(255,255,255,.16), inset -1px -1px 2px rgba(0,0,0,.72);
}
.home-circuit-detail-wire { fill: none; stroke-linejoin: round; }
.home-circuit-detail-wire--copper { stroke-width: 3px; stroke-linecap: round; }
.home-circuit-detail-wire--jacket { stroke-width: 5px; stroke-linecap: butt; }
.home-circuit-detail-wire--highlight { stroke-width: 1.3px; stroke-linecap: butt; opacity: .94; }

/* Generated chapter topology ------------------------------------------------
 * Pages are horizontal aluminium capacitors. Folders are DIP packages; when
 * several folder chips share one parent, a green PCB backplane groups them. */
.home-circuit-subboard {
  position: absolute;
  z-index: 1;
  box-sizing: border-box;
  border: 3px solid #173f2d;
  border-radius: 9px;
  background:
    radial-gradient(circle,rgba(231,207,112,.58) 0 1px,transparent 1.5px) 0 0 / 20px 20px,
    linear-gradient(145deg,#2d7654,#194a35);
  box-shadow: inset 0 0 0 2px rgba(202,221,189,.13),0 3px 7px rgba(35,31,24,.32);
  pointer-events: none;
}
.home-circuit-subboard::after {
  position: absolute;
  inset: 12px;
  content: "";
  border: 1px solid rgba(211,190,91,.32);
  border-radius: 5px;
}
.home-circuit-subboard > span {
  position: absolute;
  top: 6px;
  left: 10px;
  color: rgba(238,226,169,.76);
  font: 700 8px/1 "Courier New",monospace;
  letter-spacing: .1em;
}
.home-circuit-subboard--circuit {
  border-color:#1c5f90;
  background:
    radial-gradient(circle,rgba(132,205,240,.52) 0 1px,transparent 1.5px) 0 0 / 20px 20px,
    linear-gradient(145deg,#275d87,#173c5b);
}
.home-circuit-subboard--circuit > span { color:rgba(205,239,255,.84); }
.home-circuit-subboard--library {
  z-index: 2;
  overflow: visible;
  border-width: 3px;
  border-color: #0c426d;
  border-radius: 10px;
  box-shadow: inset 0 0 0 2px rgba(144,221,255,.18), 0 4px 9px rgba(24,41,61,.42);
}
.home-circuit-subboard--detail {
  z-index: 2;
  overflow: visible;
  border-width: 3px;
  border-color: #0c426d;
  border-radius: 10px;
  box-shadow: inset 0 0 0 2px rgba(144,221,255,.18), 0 4px 9px rgba(24,41,61,.42);
}
.home-circuit-subboard--library::after {
  inset: 14px;
  opacity: .52;
  background:
    linear-gradient(90deg,transparent 0 9%,rgba(117,211,246,.76) 9% 9.7%,transparent 9.7% 48%,rgba(117,211,246,.76) 48% 48.7%,transparent 48.7% 90%,rgba(117,211,246,.76) 90% 90.7%,transparent 90.7%),
    linear-gradient(0deg,transparent 0 22%,rgba(117,211,246,.64) 22% 22.8%,transparent 22.8% 71%,rgba(117,211,246,.64) 71% 71.8%,transparent 71.8%);
}
.home-circuit-subboard--detail::after {
  inset: 14px;
  opacity: .52;
  background:
    linear-gradient(90deg,transparent 0 9%,rgba(117,211,246,.76) 9% 9.7%,transparent 9.7% 48%,rgba(117,211,246,.76) 48% 48.7%,transparent 48.7% 90%,rgba(117,211,246,.76) 90% 90.7%,transparent 90.7%),
    linear-gradient(0deg,transparent 0 22%,rgba(117,211,246,.64) 22% 22.8%,transparent 22.8% 71%,rgba(117,211,246,.64) 71% 71.8%,transparent 71.8%);
}
.home-circuit-subboard__etching {
  top: 11px !important;
  left: 16px !important;
  color: rgba(205,239,255,.94) !important;
  font-size: 11px !important;
  letter-spacing: .13em !important;
  text-shadow: 0 1px #0c3150, 0 -1px rgba(196,239,255,.24);
}
.home-circuit-smd {
  position: absolute;
  z-index: 1;
  pointer-events: auto;
  right: 24px;
  left: auto;
  display: grid;
  grid-template-columns: 1fr;
  align-items: center;
  justify-items: center;
  width: 82px;
  height: 72px;
  color: #eafbff !important;
  border: 2px solid #102b3b;
  border-radius: 8px;
  background:
    linear-gradient(90deg,#c2c8c5 0 18px,transparent 18px calc(100% - 18px),#c2c8c5 calc(100% - 18px)),
    linear-gradient(145deg,#42545a,#1c292f 50%,#52656b);
  box-shadow: inset 0 1px rgba(255,255,255,.34), inset 0 -2px 3px rgba(0,0,0,.48), 0 2px 4px rgba(6,20,32,.45);
  text-decoration: none !important;
}
.home-circuit-smd::before,
.home-circuit-smd::after {
  position: absolute;
  top: 50%;
  width: 17px;
  height: 18px;
  content: "";
  background: linear-gradient(90deg,#747d7d,#eff7ec 45%,#89908e);
  transform: translateY(-50%);
}
.home-circuit-smd::before { left: -19px; }
.home-circuit-smd::after { right: -19px; }
.home-circuit-smd__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  margin-left: 0;
  color: #bdeeff;
  border: 2px solid #77c8e5;
  border-radius: 7px;
  background: linear-gradient(145deg,#174865,#0a2638);
  box-shadow: inset 0 1px rgba(230,255,255,.35), 0 1px 2px rgba(0,0,0,.5);
}
.home-circuit-smd-label {
  position: absolute;
  z-index: 1;
  left: 25px;
  color: rgba(205,239,255,.94);
  font: 700 15px/1 "Courier New",ui-monospace,monospace;
  letter-spacing: .06em;
  text-shadow: 0 1px #0c3150,0 -1px rgba(196,239,255,.22);
}
.home-circuit-smd--library { right: auto; }
.home-circuit-smd-label--library {
  width: 82px;
  text-align: center;
}
.home-circuit-smd--horizontal { right: auto; }
.home-circuit-smd-label--horizontal {
  width: 100px;
  font-size: 13px;
  line-height: 1.1;
  letter-spacing: .02em;
  text-align: center;
  white-space: normal;
}
.home-circuit-smd:hover,
.home-circuit-smd:focus-visible {
  z-index: 2;
  color: #fff !important;
  outline: 3px solid #83edff;
  outline-offset: 4px;
  filter: brightness(1.18);
}
.home-circuit-smd:hover .home-circuit-smd__icon,
.home-circuit-smd:focus-visible .home-circuit-smd__icon {
  color: #0d3b4d;
  background: radial-gradient(circle at 35% 30%,#f4ffff 0 10%,#b8f8ff 27%,#52caec 62%,#166386 100%);
  box-shadow: 0 0 8px #95f3ff, 0 0 15px rgba(83,214,244,.78);
}

.home-circuit-page,
.home-circuit-folder {
  position: absolute;
  z-index: 3;
  box-sizing: border-box;
  color: #fffdf0 !important;
  text-decoration: none !important;
  font-family: "Courier New",ui-monospace,monospace;
  font-weight: 700;
  box-shadow: 0 3px 7px rgba(42,35,24,.3);
}
.home-circuit-page {
  z-index: 5;
  display: grid;
  grid-template-columns: 34px minmax(0,1fr);
  align-items: center;
  gap: 9px;
  width: 210px;
  height: 60px;
  padding: 8px 12px 8px 28px;
  border: 2px solid var(--cap-border,#39494a);
  border-radius: 18px 7px 7px 18px;
  background:
    radial-gradient(ellipse 5px 9px at 7px 50%,rgba(18,38,39,.7) 0 38%,rgba(232,241,232,.38) 43% 55%,transparent 60%),
    linear-gradient(to right,var(--cap-end-dark,#304849) 0 7px,var(--cap-end-light,#8da5a4) 7px 12px,transparent 12px),
    linear-gradient(to bottom,var(--cap-top,#799294),var(--cap-highlight,#bfd0ca) 10%,var(--cap-upper,#6f898b) 24%,var(--cap-middle,#3e595b) 52%,var(--cap-lower,#789597) 79%,var(--cap-bottom,#d1dfd8));
  text-shadow: 0 1px rgba(18,29,29,.85);
}
.home-circuit-page[data-palette="1"] { --cap-top:#8a7658;--cap-highlight:#d5c6a1;--cap-upper:#826c4d;--cap-middle:#56442f;--cap-lower:#927653;--cap-bottom:#ddcba5;--cap-end-dark:#4d3b29;--cap-end-light:#a8926e; }
.home-circuit-page[data-palette="2"] { --cap-top:#687ca0;--cap-highlight:#bcc9df;--cap-upper:#607395;--cap-middle:#384b6c;--cap-lower:#7085aa;--cap-bottom:#cbd5e6;--cap-end-dark:#293b5a;--cap-end-light:#8498ba; }
.home-circuit-page[data-palette="3"] { --cap-top:#88708f;--cap-highlight:#d2c0d7;--cap-upper:#7a6382;--cap-middle:#503b58;--cap-lower:#92759a;--cap-bottom:#ddcbe1;--cap-end-dark:#47304e;--cap-end-light:#a28aaa; }
.home-circuit-page[data-palette="4"] { --cap-top:#8d6656;--cap-highlight:#d8b7a5;--cap-upper:#815c4d;--cap-middle:#57372e;--cap-lower:#986b59;--cap-bottom:#e0c1b0;--cap-end-dark:#4b2e27;--cap-end-light:#a77b68; }
.home-circuit-page__icon,
.home-circuit-folder__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 34px;
  height: 34px;
  color: #f3f0da;
  border: 2px solid rgba(246,241,213,.66);
  border-radius: 50%;
  background: rgba(20,30,30,.38);
  box-shadow: inset 0 1px 2px rgba(255,255,255,.24);
  transform: scaleY(.93);
  transform-origin: center;
}
.home-circuit-page__title,
.home-circuit-folder__title {
  min-width: 0;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  font-size: 12px;
  line-height: 1.14;
}
.home-circuit-folder {
  display: grid;
  grid-template-columns: 38px minmax(0,1fr);
  align-items: center;
  gap: 9px;
  width: 180px;
  height: 80px;
  padding: 10px 12px;
  border: 2px solid #343a37;
  border-radius: 7px;
  background: linear-gradient(145deg,#29312e,#111714 62%,#303a35);
  text-shadow: 0 1px #111;
}
.home-circuit-folder__icon { width: 38px;height: 38px; }
.home-circuit-generated-pin {
  position: absolute;
  z-index: -1;
  display: block;
  background: linear-gradient(90deg,#8c8572,#eee5c7 43%,#9b9584);
  box-shadow: 0 1px rgba(43,43,37,.38);
  pointer-events: none;
}
.home-circuit-generated-pin--top,
.home-circuit-generated-pin--bottom { width: 6px;height: 10px;transform: translateX(-3px); }
.home-circuit-generated-pin--top { top:-12px; }
.home-circuit-generated-pin--bottom { bottom:-12px; }
.home-circuit-generated-pin--left,
.home-circuit-generated-pin--right { width:10px;height:6px;transform:translateY(-3px); }
.home-circuit-generated-pin--left { left:-12px; }
.home-circuit-generated-pin--right { right:-12px; }

.home-circuit-page:hover,
.home-circuit-page:focus-visible,
.home-circuit-folder:hover,
.home-circuit-folder:focus-visible {
  z-index: 6;
  color:#fff !important;
  filter:brightness(1.16);
  text-shadow:0 0 5px rgba(255,255,255,.75);
  outline:3px solid #319c50;
  outline-offset:3px;
}
.home-circuit-page:hover .home-circuit-page__icon,
.home-circuit-page:focus-visible .home-circuit-page__icon,
.home-circuit-folder:hover .home-circuit-folder__icon,
.home-circuit-folder:focus-visible .home-circuit-folder__icon {
  color:#123b20;
  border-color:#52c878;
  background:radial-gradient(circle at 35% 30%,#efffe5 0 10%,#a6f58c 24%,#39b957 58%,#12632f 100%);
  box-shadow:inset 0 1px 2px rgba(255,255,255,.9),0 0 7px #81f58b,0 0 14px rgba(54,220,93,.78);
}

.home-circuit-unit,
.home-circuit-branch,
.home-circuit-cpu,
.home-circuit-author {
  position: absolute;
  z-index: 3;
  box-sizing: border-box;
  color: #fff9dc !important;
  text-decoration: none !important;
  border: 2px solid #343a37;
  background: linear-gradient(145deg,#29312e,#111714 62%,#303a35);
  box-shadow: inset 0 1px rgba(255,255,255,.18), 0 4px 8px rgba(42,35,24,.34);
}

.home-circuit-unit {
  left: calc(var(--core-x) + var(--x));
  top: calc(var(--core-y) + var(--y));
  display: grid;
  grid-template-columns: 38px minmax(0,1fr);
  align-items: center;
  gap: 8px;
  width: 190px;
  height: 100px;
  padding: 12px 10px;
  border-radius: 8px;
  font: 700 14px/1.15 "Courier New", ui-monospace, monospace;
}

.home-circuit-branch {
  left: calc(var(--core-x) + var(--x));
  top: calc(var(--core-y) + var(--y));
  width: 250px;
  height: 100px;
  border-radius: 9px;
  font: 700 17px/1.1 "Courier New", ui-monospace, monospace;
}
.home-circuit-branch--induct,
.home-circuit-branch--abduct { width: 100px; height: 250px; }
.home-circuit-branch__face {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 12px 14px;
}
.home-circuit-branch--induct .home-circuit-branch__face,
.home-circuit-branch--abduct .home-circuit-branch__face {
  inset: 50% auto auto 50%;
  width: 170px;
  height: 100px;
}
.home-circuit-branch--induct .home-circuit-branch__face { transform: translate(-50%,-50%) rotate(90deg); }
.home-circuit-branch--abduct .home-circuit-branch__face { transform: translate(-50%,-50%) rotate(-90deg); }

.home-circuit-unit::before,
.home-circuit-unit::after,
.home-circuit-branch::before,
.home-circuit-branch::after,
.home-circuit-author::before,
.home-circuit-author::after {
  position: absolute;
  z-index: -1;
  left: 15px;
  right: 15px;
  height: 10px;
  content: "";
  background: repeating-linear-gradient(90deg,transparent 0 8px,#c9a227 8px 14px,transparent 14px 20px);
}
.home-circuit-unit::before,
.home-circuit-branch::before,
.home-circuit-author::before { top: -12px; }
.home-circuit-unit::after,
.home-circuit-branch::after,
.home-circuit-author::after { bottom: -12px; }

.home-circuit-branch--induct::before,
.home-circuit-branch--induct::after,
.home-circuit-branch--abduct::before,
.home-circuit-branch--abduct::after {
  top: 15px;
  bottom: 15px;
  width: 10px;
  height: auto;
  background: repeating-linear-gradient(0deg,transparent 0 8px,#c9a227 8px 14px,transparent 14px 20px);
}
.home-circuit-branch--induct::before,
.home-circuit-branch--abduct::before { right: auto; left: -12px; }
.home-circuit-branch--induct::after,
.home-circuit-branch--abduct::after { right: -12px; left: auto; }

.home-circuit-unit__icon,
.home-circuit-branch__icon,
.home-circuit-cpu__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  color: #d8d5c4;
  border: 2px solid #747469;
  border-radius: 50%;
  background: radial-gradient(circle at 38% 32%,#454b46 0 12%,#242a27 45%,#101512 100%);
  box-shadow: inset 0 1px 2px rgba(255,255,255,.16), inset 0 -2px 3px rgba(0,0,0,.55);
  transform: scaleY(.93);
  transform-origin: center;
}
.home-circuit-unit__title { min-width: 0; }
.home-circuit-branch__icon { width: 44px; height: 44px; }
.home-circuit-branch__title { min-width: 0; }

.home-circuit-unit:hover,
.home-circuit-unit:focus-visible,
.home-circuit-branch:hover,
.home-circuit-branch:focus-visible,
.home-circuit-cpu:hover,
.home-circuit-cpu:focus-visible,
.home-circuit-author:hover,
.home-circuit-author:focus-visible {
  z-index: 6;
  color: #fff !important;
  filter: brightness(1.14);
  outline: 3px solid #8a531f;
  outline-offset: 3px;
}
.home-circuit-unit:hover .home-circuit-unit__icon,
.home-circuit-unit:focus-visible .home-circuit-unit__icon,
.home-circuit-branch:hover .home-circuit-branch__icon,
.home-circuit-branch:focus-visible .home-circuit-branch__icon,
.home-circuit-cpu:hover .home-circuit-cpu__icon,
.home-circuit-cpu:focus-visible .home-circuit-cpu__icon {
  color: #123b20;
  border-color: #52c878;
  background: radial-gradient(circle at 35% 30%,#efffe5 0 10%,#a6f58c 24%,#39b957 58%,#12632f 100%);
  box-shadow: inset 0 1px 2px rgba(255,255,255,.9), 0 0 7px #81f58b, 0 0 14px rgba(54,220,93,.78);
}

.home-circuit-cpu {
  left: calc(var(--core-x) + 535px);
  top: calc(var(--core-y) + 425px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 250px;
  height: 250px;
  padding: 28px;
  border-radius: 12px;
  text-align: center;
  transition: left .28s ease, top .28s ease, transform .28s ease;
}
.home-circuit-cpu__face {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 0;
  padding: 16px;
  border: 2px solid #aeb4b5;
  border-radius: 6px;
  color: #303638;
  background: linear-gradient(145deg,#f4f5f1,#bcc2c3 52%,#8e9698);
  box-shadow: inset 0 1px 2px rgba(255,255,255,.95), inset 0 -2px 4px rgba(42,47,48,.34), 0 1px 2px rgba(0,0,0,.28);
  text-shadow: 1px 1px 0 rgba(255,255,255,.58), -1px -1px 0 rgba(35,40,41,.26);
}
.home-circuit-cpu:hover .home-circuit-cpu__face,
.home-circuit-cpu:focus-visible .home-circuit-cpu__face {
  color: #1f282a;
  filter: brightness(1.08);
}
.home-circuit-cpu::before,
.home-circuit-cpu::after {
  position: absolute;
  z-index: -1;
  inset: -12px;
  content: "";
  background:
    repeating-linear-gradient(90deg,transparent 0 8px,#c9a227 8px 14px,transparent 14px 20px) top center / calc(100% - 30px) 10px no-repeat,
    repeating-linear-gradient(90deg,transparent 0 8px,#c9a227 8px 14px,transparent 14px 20px) bottom center / calc(100% - 30px) 10px no-repeat,
    repeating-linear-gradient(0deg,transparent 0 8px,#c9a227 8px 14px,transparent 14px 20px) center left / 10px calc(100% - 30px) no-repeat,
    repeating-linear-gradient(0deg,transparent 0 8px,#c9a227 8px 14px,transparent 14px 20px) center right / 10px calc(100% - 30px) no-repeat;
}
.home-circuit-cpu::after { filter: drop-shadow(0 1px 1px rgba(35,31,25,.35)); }
.home-circuit-cpu__icon { width: 62px; height: 62px; margin-bottom: 15px; font-size: 29px; }
.home-circuit-cpu__title { font: 700 21px/1.16 "Courier New",ui-monospace,monospace; }
.home-circuit-cpu__mark { margin-top: 15px; color: #4b5557; font: 700 9px/1 monospace; letter-spacing: .14em; }
.home-circuit-board--sidebar-open .home-circuit-cpu { left: 30px; top: 25px; transform: scale(.88); transform-origin: top left; }

.home-circuit-author {
  left: calc(var(--core-x) + 535px);
  top: calc(var(--core-y) + 705px);
  display: flex;
  align-items: center;
  overflow: hidden;
  width: 250px;
  height: 90px;
  padding: 13px 14px;
  border-radius: 8px;
  border-color: #555c5d;
  background: linear-gradient(145deg,#b9bfc0 0%,#737a7b 48%,#4a5051 100%);
  box-shadow: inset 0 1px 2px rgba(255,255,255,.6), inset 0 -3px 5px rgba(20,24,25,.55), 0 3px 7px rgba(26,29,29,.42);
  font: 700 20px/1.02 "Courier New",monospace;
  letter-spacing: .01em;
}
.home-circuit-author__display {
  display: block;
  width: 100%;
  overflow: hidden;
  padding: 9px 10px;
  border: 2px solid #62696a;
  border-radius: 4px;
  background:
    radial-gradient(ellipse,rgba(116,61,24,.42) 0 1px,transparent 1.35px) 0 0 / 7px 3.5px,
    repeating-linear-gradient(0deg,rgba(255,128,24,.08) 0 .5px,transparent .5px 2px),
    #1b120b;
  box-shadow: inset 0 0 8px rgba(0,0,0,.9), inset 0 1px rgba(255,255,255,.34), inset 0 -2px 2px rgba(17,21,21,.7), 0 0 2px rgba(20,24,24,.65);
  color: #ff9d2e;
  text-shadow: 0 0 3px #ff711b, 0 0 7px rgba(255,103,21,.72);
}
.home-circuit-author__track {
  display: flex;
  width: max-content;
  -webkit-mask-image: radial-gradient(ellipse,#000 0 1.05px,transparent 1.35px);
  -webkit-mask-size: 4px 2px;
  mask-image: radial-gradient(ellipse,#000 0 1.05px,transparent 1.35px);
  mask-size: 4px 2px;
  animation: home-circuit-author-scroll 28s linear infinite;
}
.home-circuit-author__track > span { padding-right: 5em; white-space: nowrap; }
.home-circuit-author:hover .home-circuit-author__track,
.home-circuit-author:focus-visible .home-circuit-author__track { animation-play-state: paused; filter: brightness(1.25); }
@keyframes home-circuit-author-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

@media (max-width: 760px) {
  .home-circuit-board { min-width: 7200px; }
}

@media (prefers-reduced-motion: reduce) {
  .home-circuit-cpu { transition: none; }
  .home-circuit-author__track { animation: none; }
  .home-circuit-board--overview { transition: none; }
}

@media (forced-colors: active) {
  .home-circuit-board { background: Canvas; border-color: CanvasText; }
  .home-circuit-trench { background: Canvas; border: 1px solid CanvasText; }
  .home-circuit-unit,.home-circuit-branch,.home-circuit-cpu,.home-circuit-author,.home-circuit-page,.home-circuit-folder,.home-circuit-smd { color: LinkText !important; background: Canvas; border-color: CanvasText; box-shadow: none; }
  .home-circuit-subboard { background:Canvas;border-color:CanvasText;box-shadow:none; }
  .home-circuit-generated-pin { background:CanvasText;box-shadow:none; }
  .home-circuit-detail--coil,.home-circuit-detail--coil i,.home-circuit-detail--coil i::after { background: Canvas; border-color: CanvasText; box-shadow: none; }
  .home-circuit-wire,.home-circuit-detail-wire { stroke: CanvasText !important; }
}