.component-workshop{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:8px 10px;background:#0b1e2c;border:1px solid #26617a;border-radius:6px;margin:6px 0;color:#9bdff7;font:700 11px system-ui,sans-serif}
.component-workshop[hidden]{display:none}
.component-workshop button,.component-workshop select{min-height:34px;border:1px solid #3c829c;border-radius:4px;background:#133448;color:#edfaff;padding:6px 9px;font:inherit;cursor:pointer}
.component-workshop button:focus-visible,.component-workshop select:focus-visible{outline:2px solid #ffd34e;outline-offset:2px}
.component-workshop button:hover{background:#215570}
.component-workshop button[aria-pressed=true]{background:#1d6379;border-color:#88e6ff}
.component-workshop .component-rotation{display:flex;align-items:center;gap:5px;white-space:nowrap}
.component-workshop .component-rotation[hidden]{display:none}
.component-rotation input{width:95px;min-height:34px;accent-color:#59d8ff}
.component-rotation output{min-width:36px;text-align:right}
@media(max-width:760px){.component-workshop{gap:4px;padding:5px}.component-workshop>span{display:none}.component-workshop select{flex:1}}

#workshopTools #componentWorkshopHost{display:flex;justify-content:center;flex-wrap:wrap;gap:4px}
#shopHead #componentWorkshopHost{flex:1;display:flex;justify-content:center}
#shopHead #componentWorkshopHost{flex-wrap:wrap;gap:4px}
.component-loadouts [role=status]{font-weight:400;max-width:240px}
@media(max-width:760px){.component-loadouts [role=status]{display:block!important;width:100%;text-align:center}}
#workshopTools .component-workshop,#shopHead .component-workshop{margin:0;padding:4px 8px}
@media(max-width:760px){#shopOverlay #shopHead{flex-wrap:wrap}#workshopTools{order:0}#workshopTools .component-workshop{width:100%;justify-content:center}}
@media(max-width:760px){.component-workshop button,.component-workshop select,.component-rotation input{min-height:44px}.component-workshop .component-rotation{width:100%;justify-content:center}.component-rotation input{flex:1;max-width:200px}}

.component-workshop .component-spring{display:flex;align-items:center;gap:5px;white-space:nowrap}
.component-workshop .component-spring[hidden]{display:none}
.component-spring input{width:95px;min-height:34px;accent-color:#59d8ff}
.component-spring output{min-width:36px;text-align:right}
.component-spring input:focus-visible{outline:2px solid #ffd34e;outline-offset:2px}
@media(max-width:760px){.component-workshop .component-spring{width:100%;justify-content:center}.component-spring input{flex:1;max-width:200px;min-height:44px}}

/* The inspector can be narrow even on a wide, short screen. */
body[data-menu-section=workshop] #workshopTools .component-workshop{min-width:0;max-width:100%;box-sizing:border-box}
body[data-menu-section=workshop] #workshopTools .component-workshop select{min-width:0;max-width:100%;flex-basis:100%;width:100%}
body[data-menu-section=workshop] #workshopTools .component-rotation,
body[data-menu-section=workshop] #workshopTools .component-spring{display:flex;flex-direction:column;align-items:stretch;gap:2px;white-space:normal;overflow-wrap:anywhere;width:100%;min-width:0;box-sizing:border-box}
body[data-menu-section=workshop] #workshopTools .component-rotation[hidden],
body[data-menu-section=workshop] #workshopTools .component-spring[hidden]{display:none}
body[data-menu-section=workshop] #workshopTools input[type=range]{width:100%;max-width:100%;min-width:0;min-height:44px;box-sizing:border-box;margin:0}
body[data-menu-section=workshop] #workshopTools output{min-width:0;text-align:right}

.component-loadouts select[hidden]{display:none!important}
.component-loadouts .assemblyPicker{width:100%;flex-basis:100%;min-height:44px;text-align:left;border-radius:9px;white-space:normal}
.assemblyDialog{position:fixed;inset:0;margin:auto;width:min(420px,calc(100vw - 32px));max-height:calc(100dvh - 32px);box-sizing:border-box;padding:18px;border:1px solid #60d6ee;border-radius:18px;background:linear-gradient(145deg,#123344,#071823);color:#e4f7ff;box-shadow:0 18px 60px #0009;font:14px/1.4 system-ui;overflow:auto;scrollbar-width:none}
.assemblyDialog::backdrop{background:#020c17b8;backdrop-filter:blur(5px)}
.assemblyDialog header{display:flex;align-items:center;justify-content:space-between;gap:12px}
.assemblyDialog h2{margin:0;font-size:20px}
.assemblyDialog header button{width:44px;height:44px;border:1px solid #37738a;border-radius:12px;background:#102d3e;color:#9eefff;font-size:26px;cursor:pointer}
.assemblyDialog .assemblyHint{margin:4px 0 16px;color:#a8c7d7;font-size:12px}
.assemblyOptions{display:grid;gap:10px}
.assemblyOption{position:relative;display:grid;gap:5px;width:100%;min-height:70px;box-sizing:border-box;padding:14px 40px 14px 14px;border:1px solid #31566b;border-radius:12px;background:#0d2433;color:#e7f8ff;text-align:left;font:inherit;cursor:pointer}
.assemblyOption strong{font-size:14px}.assemblyOption small{color:#a9c7d8;font-size:12px}
.assemblyOption[aria-pressed=true]{border-color:#7eeeff;background:#17475b;box-shadow:inset 0 0 0 1px #7eeeff55}
.assemblyOption[aria-pressed=true]::after{content:'✓';position:absolute;right:14px;top:15px;color:#ffda6b;font-size:22px}
.assemblyOption:hover{background:#1b4053}.assemblyDialog button:focus-visible{outline:2px solid #ffdc75;outline-offset:2px}
.assemblyDialog::-webkit-scrollbar{display:none}
