.design-board{display:none;position:relative;width:min(90%,640px);height:340px;place-items:center;background:#f4f4f0;border:1px solid #777c82;box-shadow:0 24px 50px rgba(0,0,0,.55);overflow:hidden}.pistol-stage:not([data-design="none"]) .design-board{display:grid}.design-number{position:absolute;z-index:2;left:22px;top:16px;color:#777b7e;font:700 17px "Barlow Condensed";letter-spacing:2px}.design-board .port-overlay{display:block;position:absolute;inset:15%;width:70%!important;height:70%!important;object-fit:contain;object-position:center center;transform:none;image-rendering:auto;filter:none}.pistol-stage[data-design="none"] .design-board .port-overlay{display:none}.photo-credit,.pistol-photo{display:none!important}.preview-disclaimer{margin-top:8px}
.config-field{position:relative;display:flex;flex-direction:column;gap:8px}.config-field-label{display:flex;flex-direction:column;gap:8px;color:#d8dbde;text-transform:uppercase;letter-spacing:1.3px;font:600 14px "Barlow Condensed",sans-serif}.config-field-label>span{color:var(--orange);font-size:12px}.port-design-native{display:none!important}.port-picker{position:relative}.port-picker-button{width:100%;min-height:51px;padding:7px 12px;border:1px solid #383c42;background:#0a0c0e;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:10px;text-align:left;cursor:pointer}.port-picker-button:focus{border-color:var(--orange);outline:0}.port-picker-button:disabled{color:#656a70;cursor:not-allowed}.port-picker-current{display:flex;align-items:center;gap:10px;min-width:0}.port-picker-current.has-selection img{width:48px;height:34px;padding:6px;background:#f4f4f0;object-fit:contain;object-position:center}.port-picker-current span{white-space:nowrap}.port-picker-chevron{color:var(--orange);font-size:21px;transition:transform .2s}.port-picker-button[aria-expanded="true"] .port-picker-chevron{transform:rotate(180deg)}.port-options{position:absolute;z-index:30;top:calc(100% + 6px);left:0;width:100%;max-height:480px;overflow-y:auto;padding:8px;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;background:#0d0f11;border:1px solid #4a4f55;box-shadow:0 24px 60px rgba(0,0,0,.72)}.port-options:not([hidden]){display:grid}.port-option{min-width:0;padding:7px;border:1px solid #30343a;background:#15181b;color:#dfe2e5;display:flex;flex-direction:column;align-items:center;gap:5px;cursor:pointer;font:600 12px "Barlow Condensed",sans-serif;letter-spacing:.4px}.port-option:hover,.port-option:focus,.port-option[aria-selected="true"]{border-color:var(--orange);background:#211710;outline:0}.port-option-art{width:100%;height:88px;padding:8px;background:#f4f4f0;display:grid;place-items:center;overflow:hidden}.port-option-art img{display:block;width:74%;height:74%;margin:auto;object-fit:contain;object-position:center center}.port-option>span:last-child{white-space:nowrap}.port-options::-webkit-scrollbar{width:8px}.port-options::-webkit-scrollbar-thumb{background:#555b61}.port-options::-webkit-scrollbar-track{background:#111316}
@media(max-width:850px){.design-board{width:94%;height:300px}.design-board .port-overlay{inset:13%;width:74%!important;height:74%!important}.port-options{position:fixed;z-index:40;left:14px;right:14px;top:auto;bottom:14px;width:auto;max-height:70vh;grid-template-columns:repeat(2,minmax(0,1fr))}.port-option-art{height:96px}}