*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;height:100%;overflow:hidden}:root{--bg: #f7f2e8;--bg2: #efe9d8;--cream: #fdfaf4;--dot: #d8cfbc;--copper: #c4813d;--copper2: #e0a060;--copper3: #8a5520;--trace-pw: #c4813d;--trace-sg: #a87840;--trace-gn: #b8a878;--silk: #1a1208;--silk2: #4a3a22;--silk3: #8a7a62;--mask: #ede5d0;--mask2: #ddd0b8;--gold: #d4b050;--gold2: #e8c870}html,body{background:var(--bg);font-family:Share Tech Mono,monospace;cursor:crosshair;user-select:none}#board{position:relative;width:100vw;height:100vh;overflow:hidden;background:var(--bg);animation:fadein .6s ease}#board:before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle,var(--dot) .85px,transparent .85px);background-size:22px 22px;opacity:.45;pointer-events:none;z-index:0}@keyframes fadein{0%{opacity:0}to{opacity:1}}.frame{position:absolute;inset:22px;pointer-events:none;z-index:2}.frame-outer{position:absolute;inset:0;border:1px solid rgba(196,129,61,.4)}.frame-inner{position:absolute;inset:8px;border:.5px solid rgba(216,207,188,.8)}.br{position:absolute}.br:before,.br:after{content:"";position:absolute;background:var(--copper);opacity:.55}.br-tl{top:0;left:0}.br-tl:before{top:0;left:0;width:36px;height:1.5px}.br-tl:after{top:0;left:0;width:1.5px;height:36px}.br-tr{top:0;right:0}.br-tr:before{top:0;right:0;width:36px;height:1.5px}.br-tr:after{top:0;right:0;width:1.5px;height:36px}.br-bl{bottom:0;left:0}.br-bl:before{bottom:0;left:0;width:36px;height:1.5px}.br-bl:after{bottom:0;left:0;width:1.5px;height:36px}.br-br{bottom:0;right:0}.br-br:before{bottom:0;right:0;width:36px;height:1.5px}.br-br:after{bottom:0;right:0;width:1.5px;height:36px}.th{width:14px;height:14px;border-radius:50%;background:var(--bg);border:.8px solid var(--dot);transform:translate(-50%,-50%)}.th:after{content:"";position:absolute;inset:3px;border-radius:50%;border:.5px dashed var(--dot)}.rm{width:18px;height:18px;transform:translate(-50%,-50%)}.rm:before{content:"";position:absolute;inset:0;border-radius:50%;border:.7px solid var(--dot)}.rm:after{content:"";position:absolute;width:6px;height:6px;border-radius:50%;border:.7px solid var(--dot);top:50%;left:50%;transform:translate(-50%,-50%)}#svg-traces{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}#info{position:absolute;left:60px;top:50%;transform:translateY(-50%);z-index:10;width:210px}.i-ref{font-size:8px;letter-spacing:.22em;color:var(--silk3);text-transform:uppercase;margin-bottom:14px}.i-name{font-family:Cormorant Garamond,serif;font-size:48px;font-weight:300;color:var(--silk);line-height:.88;text-transform:uppercase;letter-spacing:.05em}.i-tagline{font-family:Cormorant Garamond,serif;font-style:italic;font-size:13.5px;color:var(--silk2);margin-top:12px}.i-rule{width:32px;height:1px;background:var(--copper);margin:18px 0}.i-bio{font-size:9px;line-height:2.1;letter-spacing:.04em;color:var(--silk3)}.i-links{margin-top:22px;display:flex;flex-direction:column;gap:10px}.i-links a{font-size:8.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--copper);text-decoration:none;display:flex;align-items:center;gap:10px;transition:gap .2s,color .2s}.i-links a:before{content:"";display:block;width:18px;height:.8px;background:currentColor;flex-shrink:0;transition:width .25s}.i-links a:hover{color:var(--copper3);gap:14px}.i-links a:hover:before{width:30px}.node{position:absolute;z-index:10;cursor:pointer;transform:translate(-50%,-50%)}.c-ref{font-size:7.5px;letter-spacing:.16em;color:var(--silk3);text-transform:uppercase;margin-bottom:3px}.c-lbl{font-size:12px;letter-spacing:.07em;color:var(--silk)}.c-sub{font-size:8px;letter-spacing:.09em;color:var(--silk3);margin-top:2px}.gpad{background:var(--gold);border-radius:1px;transition:background .2s}.node:hover .gpad{background:var(--copper)}.mcu-wrap{position:relative;width:148px;height:148px}.mcu-body{position:absolute;inset:22px;background:var(--mask);border:1px solid var(--mask2);border-radius:4px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;transition:border-color .2s}.node:hover .mcu-body{border-color:var(--copper)}.mcu-dot{position:absolute;top:6px;left:6px;width:5px;height:5px;border-radius:50%;background:var(--silk3)}.qfp-row{position:absolute;display:flex;gap:5px}.qfp-top{top:0;left:50%;transform:translate(-50%);flex-direction:row}.qfp-bottom{bottom:0;left:50%;transform:translate(-50%);flex-direction:row}.qfp-left{left:0;top:50%;transform:translateY(-50%);flex-direction:column}.qfp-right{right:0;top:50%;transform:translateY(-50%);flex-direction:column}.qfp-pin{display:flex;flex-direction:column;align-items:center}.qfp-top .qfp-pin{flex-direction:column-reverse}.qfp-left .qfp-pin{flex-direction:row-reverse}.qfp-right .qfp-pin{flex-direction:row}.qfp-leg{background:var(--mask2);transition:background .2s}.node:hover .qfp-leg{background:var(--copper2)}.qfp-top .qfp-leg,.qfp-bottom .qfp-leg{width:5px;height:10px}.qfp-left .qfp-leg,.qfp-right .qfp-leg{width:10px;height:5px}.eeprom-wrap{position:relative;width:130px}.eeprom-body{position:relative;background:var(--mask);border:1px solid var(--mask2);border-radius:3px;padding:14px 18px 12px;margin:0 16px;transition:border-color .2s}.node:hover .eeprom-body{border-color:var(--copper)}.eeprom-notch{position:absolute;top:50%;left:-1px;transform:translateY(-50%);width:8px;height:22px;background:var(--bg2);border:1px solid var(--mask2);border-left:none;border-radius:0 5px 5px 0}.soic-col{position:absolute;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:8px}.soic-col.l{left:0}.soic-col.r{right:0}.soic-pin{display:flex;align-items:center}.soic-col.l .soic-pin{flex-direction:row-reverse}.soic-leg{width:15px;height:2px;background:var(--trace-sg);border-radius:0;transition:background .2s}.node:hover .soic-leg{background:var(--copper)}.soic-foot{width:5px;height:9px;border-radius:1px}.uart-wrap{position:relative}.uart-body{position:relative;background:var(--mask);border:1px solid var(--mask2);border-radius:40px;padding:18px 22px 16px;width:120px;margin:14px 0;transition:border-color .2s}.node:hover .uart-body{border-color:var(--copper)}.uart-line{position:absolute;top:50%;left:16px;right:16px;height:.5px;background:var(--mask2);transform:translateY(-50%)}.dip-row{position:absolute;left:50%;transform:translate(-50%);display:flex;gap:9px}.dip-row.top{top:0}.dip-row.bot{bottom:0}.dip-pin{display:flex;flex-direction:column;align-items:center}.dip-row.top .dip-pin{flex-direction:column-reverse}.dip-leg{width:2px;height:13px;background:var(--mask2);transition:background .2s}.node:hover .dip-leg{background:var(--copper2)}.dip-foot{width:7px;height:4px;border-radius:1px}.adc-wrap{position:relative}.adc-body{position:relative;background:var(--mask);border:1px solid var(--mask2);border-radius:3px;padding:16px;width:118px;transition:border-color .2s}.node:hover .adc-body{border-color:var(--copper)}.bga-grid{position:absolute;bottom:-10px;left:50%;transform:translate(-50%);display:flex;gap:6px;pointer-events:none}.bga-ball{width:7px;height:7px;border-radius:50%;background:var(--gold);border:.5px solid var(--copper3);opacity:.7;transition:opacity .2s,background .2s}.node:hover .bga-ball{opacity:1;background:var(--copper2)}.adc-cpad{position:absolute;width:9px;height:9px;background:var(--gold);border:.5px solid var(--copper3);border-radius:1px;transition:background .2s}.node:hover .adc-cpad{background:var(--copper)}.adc-cpad.tl{top:5px;left:5px}.adc-cpad.tr{top:5px;right:5px}.adc-cpad.bl{bottom:18px;left:5px}.adc-cpad.br{bottom:18px;right:5px}.gpio-wrap{position:relative}.gpio-body{position:relative;background:var(--mask);border:1px solid var(--mask2);border-radius:2px;padding:12px 10px 10px;width:122px;display:flex;gap:6px;transition:border-color .2s}.node:hover .gpio-body{border-color:var(--copper)}.gpio-text{flex:1}.gpio-terminals{display:flex;flex-direction:column;gap:5px;padding-top:2px}.gpio-term{width:18px;height:18px;background:var(--bg2);border:.8px solid var(--mask2);border-radius:2px;position:relative;transition:border-color .2s}.node:hover .gpio-term{border-color:var(--copper2)}.gpio-term:before{content:"";position:absolute;width:10px;height:1px;background:var(--mask2);top:50%;left:50%;transform:translate(-50%,-50%);transition:background .2s}.gpio-term:after{content:"";position:absolute;width:1px;height:10px;background:var(--mask2);top:50%;left:50%;transform:translate(-50%,-50%);transition:background .2s}.node:hover .gpio-term:before,.node:hover .gpio-term:after{background:var(--copper2)}.gpio-wires{position:absolute;left:-10px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:5px}.gpio-wire{display:flex;align-items:center;flex-direction:row-reverse}.gpio-hole{width:6px;height:6px;border-radius:50%;background:var(--bg);border:.8px solid var(--mask2);transition:border-color .2s}.node:hover .gpio-hole{border-color:var(--copper)}.gpio-wleg{width:10px;height:1.5px;background:var(--trace-pw);transition:background .2s}.node:hover .gpio-wleg{background:var(--copper)}#indicator{position:absolute;bottom:32px;left:60px;display:flex;align-items:center;gap:8px;z-index:10}.ind-dot{width:5px;height:5px;border-radius:50%;background:var(--copper);animation:blink 2.6s ease-in-out infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:.1}}.ind-txt{font-size:8px;letter-spacing:.16em;color:var(--silk3);text-transform:uppercase}#board-rev{position:absolute;bottom:32px;right:60px;font-size:7.5px;letter-spacing:.14em;color:var(--silk3);text-align:right;line-height:2;z-index:10;opacity:.65}#tooltip{position:fixed;z-index:200;background:var(--cream);border:.8px solid var(--copper);padding:14px 18px;pointer-events:none;opacity:0;transition:opacity .15s;max-width:230px}#tooltip.show{opacity:1}.tt-ref{font-size:8px;letter-spacing:.18em;color:var(--copper);text-transform:uppercase;margin-bottom:8px}.tt-name{font-family:Cormorant Garamond,serif;font-size:21px;font-weight:300;color:var(--silk);margin-bottom:4px}.tt-desc{font-family:Cormorant Garamond,serif;font-style:italic;font-size:12px;color:var(--silk2);line-height:1.65}.tt-hint{font-size:8px;letter-spacing:.1em;color:var(--silk3);margin-top:10px;border-top:.5px solid var(--mask2);padding-top:8px}