.pad-visualizer{color:#ebe4f2;font-family:Jersey,monospace;min-width:0}.pad-stage{position:relative;width:100%;aspect-ratio:648/435;isolation:isolate;margin:20px auto 10px;max-width:600px}.pad-art{display:block;width:100%;height:100%;overflow:hidden;image-rendering:pixelated}.pad-hit{position:absolute;left:0;top:0;transform:translate(calc(-50% + var(--axis-x,0px)),calc(-50% + var(--axis-y,0px)));background:transparent;border:2px solid transparent;border-radius:50%;width:8%;aspect-ratio:1;min-width:20px;padding:0;color:#ebe4f2;cursor:pointer;transition:background .08s,border .08s,box-shadow .08s;box-shadow:none;min-height:0}.pad-hit:hover,.pad-hit:focus-visible{border-color:#e8e3f5;background:#d6d2e233;outline:2px solid #8d8da5;outline-offset:3px}.pad-hit.pressed,.pad-hit.preview-pressed{border-color:#fff;background:#ebe4f25c;box-shadow:0 0 0 4px #b2aecb55;transform:translate(calc(-50% + var(--axis-x,0px)),calc(-50% + var(--axis-y,0px) + 2px))}.pad-hit.pad-callout{font:15px Jersey,monospace;border-radius:0;border:1px solid #85859b;background:#2c2c3c;padding:2px 4px;min-width:26px;min-height:23px;aspect-ratio:auto;width:auto;white-space:nowrap}.pad-hit.pad-callout.pressed,.pad-hit.pad-callout.preview-pressed{background:#d6d2e2;color:#262636}.pad-live-status,.pad-input-readout{font-size:18px;color:#b3afc2;margin:10px 0;line-height:1.3}.pad-input-readout{color:#ebe4f2;min-height:25px}.pad-style-label{display:grid;gap:7px;font-size:18px}.pad-style-label select{font:19px Jersey,monospace;color:#ebe4f2;background:#252630;border:2px solid #626478;padding:7px 10px;width:100%}.ejs_control_body .pad-visualizer{width:min(460px,100%);margin:12px auto 20px;padding:15px;border:2px solid #77788e;background:#30313e;box-sizing:border-box}.ejs_control_body .pad-stage{margin-top:15px}.ejs_control_body .pad-live-status,.ejs_control_body .pad-input-readout{font:17px Jersey,monospace;text-align:center}.ejs_control_body .pad-hit.pad-callout{font-size:13px}.ejs_control_body .pad-hit{min-width:18px}.ejs_control_body .pad-style-label{text-align:left}.ejs_control_body .pad-style-label select{width:100%;padding:6px}
@media(prefers-reduced-motion:reduce){.pad-hit{transition:none}.pad-hit.pressed,.pad-hit.preview-pressed{transform:translate(calc(-50% + var(--axis-x,0px)),calc(-50% + var(--axis-y,0px)))}}

.controller-comparison{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:18px;margin:22px 0 12px;align-items:start}
.comparison-own{min-width:0}.controller-comparison h3{font:9px/1.6 Silkscreen,monospace;letter-spacing:.5px;text-transform:uppercase;color:#b3afc2;margin:0 0 12px}
.hardware-reference{margin:0;min-width:0;padding-left:18px;border-left:1px solid #565972}
.hardware-reference img{display:block;width:100%;aspect-ratio:648/435;object-fit:contain}
.hardware-diagram{position:relative;width:100%;aspect-ratio:400/235}
.hardware-reference .hardware-diagram img{position:absolute;inset:0;width:100%;height:100%;max-height:none;aspect-ratio:auto;object-fit:contain}
.hardware-button-labels{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.hardware-button-labels text{font-family:Jersey,"Segoe UI Symbol",sans-serif;font-weight:normal;text-anchor:middle;dominant-baseline:central;fill:#fff;stroke:#30313e;stroke-width:3px;stroke-linejoin:round;paint-order:stroke fill}
.hardware-button-labels line{stroke:#b3afc2;stroke-width:.8px}
.hardware-button-labels rect{fill:#30313e;stroke:none}
.controller-comparison .pad-stage{margin:0 auto 12px}
.controller-comparison .pad-hit.pad-callout{font-size:12px;min-width:20px;min-height:20px;padding:1px 3px}
.controller-comparison .pad-live-status,.controller-comparison .pad-input-readout{font-size:16px}
#game .ejs_control_body .controller-comparison{max-width:960px;width:100%;margin:16px auto}
#game .ejs_control_body .controller-comparison .pad-visualizer{max-width:none;width:100%;margin:0;padding:0;border:0;background:none}
#game .ejs_control_body .controller-comparison h3{font:9px Silkscreen,monospace!important;margin-bottom:12px}
@media(max-width:620px){
 .controller-comparison{grid-template-columns:1fr;gap:22px}
 .hardware-reference{padding:18px 0 0;border-left:0;border-top:1px solid #565972}
 #game .ejs_control_body .controller-comparison{grid-template-columns:1fr}
}