header>b{margin-right:auto}.logo{display:flex;align-items:center;gap:12px}.logo strong{font-size:14px;letter-spacing:2px}.logo strong em{font-style:normal;color:#777}.rp{position:relative;display:block!important;width:38px!important;height:38px!important;background:var(--ink);overflow:hidden}.rp span{position:absolute!important;color:var(--acid)!important;font-weight:900!important;font-size:24px!important;line-height:38px!important}.rp span:first-child{left:5px}.rp span:last-child{left:17px;mix-blend-mode:screen;transform:scaleX(.82)}
.hero{padding:24px 5vw 22px;display:flex;justify-content:space-between;align-items:end;gap:25px}.hero h1{font-size:clamp(25px,3vw,40px);line-height:1;letter-spacing:-2px;margin:8px 0 0}.hero small{font:13px Georgia;color:#777}.hero p{font-size:8px;margin:0}.designer{margin:0 4.5vw 30px;border:1px solid var(--line);background:#e5e2da}.toolbar{display:grid;grid-template-columns:170px minmax(220px,1fr) minmax(220px,1.1fr) auto 90px;align-items:center;background:var(--paper);border-bottom:1px solid var(--line);min-height:88px}.tool{padding:17px 20px;border-right:1px solid var(--line)}.tool label{display:block;margin-bottom:7px;font-size:8px}.tool select{width:100%;border:0;border-bottom:1px solid var(--ink);background:transparent;padding:4px 22px 7px 0;font-weight:bold;font-size:12px;outline:0}.connector-preview{display:flex;align-items:center;gap:16px;padding:12px 22px;border-right:1px solid var(--line);min-height:88px}.connector-preview>span small,.connector-preview>span strong,.connector-preview>span em{display:block}.connector-preview small{font-size:7px;color:#888;letter-spacing:1px}.connector-preview strong{font-size:11px;margin:4px 0}.connector-preview em{font-size:9px;color:#777;font-style:normal}.add{margin:0 18px;background:var(--acid);border:2px solid var(--ink);padding:15px 18px;font-weight:bold;white-space:nowrap;box-shadow:3px 3px var(--ink)}.add span{font-size:17px;margin-right:5px}.snap{border-left:1px solid var(--line);height:88px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:7px}.snap i{width:7px;height:7px;background:#59a33b;border-radius:50%}.snap b{font-size:9px}.stage-head{padding:17px 28px;background:var(--paper);display:flex;justify-content:space-between;border-bottom:1px solid var(--line)}.stage-head h2{font:19px Georgia;margin:5px 0}.stage-meta{display:flex;align-items:center;gap:12px}.stage-meta span{font-size:8px;color:#777}.stage-meta b{background:var(--ink);color:white;padding:8px 12px;font-size:9px}.canvas{min-height:480px;padding:55px 6%}.selected{background:var(--paper);align-items:center;border-top:1px solid var(--line)}.selected .coords{font:10px monospace;color:#777;margin-left:auto;margin-right:25px}.face{--z:1;position:relative;flex:0 0 auto;width:calc(36px * var(--z));height:calc(36px * var(--z));border-radius:50%;background:#202320;border:calc(3px * var(--z)) solid var(--c);box-shadow:0 3px 5px #0003}.face.true1 span,.face.power span{position:absolute;width:42%;height:55%;left:18%;top:15%;background:var(--c);border-radius:50% 45% 30% 50%;transform:rotate(-30deg)}.face.true1 i,.face.power i{position:absolute;width:18%;height:18%;right:19%;top:22%;background:#090a09;border-radius:50%}.face>b{position:absolute;bottom:-12px;width:100%;text-align:center;font-size:6px;color:#555}.face.xlr{border-color:#292c29}.face.xlr>i{position:absolute;width:16%;height:16%;border-radius:50%;background:var(--c)}.face.xlr>i:nth-child(1){left:22%;top:25%}.face.xlr>i:nth-child(2){right:22%;top:25%}.face.xlr>i:nth-child(3){left:42%;bottom:20%}.face.xlr.female>i{background:#050505;border:1px solid #777}.face.xlr>span{position:absolute;top:-5%;left:40%;width:20%;height:10%;background:#aaa}
@media(max-width:950px){.toolbar{grid-template-columns:1fr 1.5fr auto}.connector-preview,.snap{display:none}.canvas{min-height:400px}.hero small{display:none}}@media(max-width:650px){.designer{margin-inline:0;border-inline:0}.toolbar{grid-template-columns:1fr 1fr}.add{grid-column:1/-1;margin:12px}.stage-head{padding:15px}.canvas{padding:45px 3%;min-height:320px}.selected .coords{display:none}}
.plate-centers path{fill:none;stroke:#ff6945;stroke-width:.55;stroke-dasharray:4 2;opacity:.85;pointer-events:none}.socket text{pointer-events:none}.canvas{background-color:#d4d1c8;background-image:linear-gradient(45deg,#cbc8bf 25%,transparent 25%),linear-gradient(-45deg,#cbc8bf 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#cbc8bf 75%),linear-gradient(-45deg,transparent 75%,#cbc8bf 75%);background-size:12px 12px;background-position:0 0,0 6px,6px -6px,-6px 0}
