/* Powertune – Maschinenpark · Komax Gamma 450: breite 3D-Bühne unter den beiden Spalten (gamma.js, gamma-scene.js) */
.gm-fig{margin:48px 0 0}
.gm-stage{position:relative;aspect-ratio:21/9;border:1px solid var(--card-line);border-radius:22px;overflow:hidden;background:radial-gradient(120% 110% at 50% 30%,#fdfdfe 0%,#eef0f3 55%,#e2e5e9 100%)}
html:not(.js) .gm-fig,.gm-off .gm-fig{display:none}
@media (prefers-reduced-motion:reduce){.gm-fig{display:none}}
.gm-canvas{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity .9s var(--ease)}
.gm-ready .gm-canvas{opacity:1}
.gm-fig figcaption{margin-top:12px;font:500 10.5px/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--fg-3)}

/* Schrittleiste: zeigt den laufenden Schritt, Klick springt dorthin */
.gm-chips{position:absolute;left:14px;right:14px;bottom:12px;z-index:3;display:flex;flex-wrap:wrap;align-items:center;gap:6px;opacity:0;transition:opacity .6s var(--ease)}
.gm-ready .gm-chips{opacity:1}
.gm-chips button{padding:6px 11px;border:1px solid rgba(11,12,14,.12);border-radius:999px;background:rgba(255,255,255,.8);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font:500 10.5px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:#4a4f57;cursor:pointer;transition:color .3s,border-color .3s,background .3s,box-shadow .3s}
.gm-chips button:hover{color:#0b0c0e}
.gm-chips button.on{color:#0b0c0e;border-color:rgba(79,163,255,.75);background:#fff;box-shadow:inset 0 -2px 0 #4FA3FF}
.gm-chips button:focus-visible{outline:2px solid #4FA3FF;outline-offset:2px}
.gm-chips em{padding-left:4px;font:500 10.5px/1 var(--mono);font-style:normal;letter-spacing:.08em;text-transform:uppercase;color:#6a6f77}

/* Beschriftungen wie im Maschinenpark (dunkle Pille, Führungslinie zum Punkt) */
.gm-labels{position:absolute;inset:0;z-index:1;overflow:hidden;pointer-events:none}
.gm-labels .sl{position:absolute;left:0;top:0;display:flex;flex-direction:column;align-items:center;gap:5px;opacity:0;white-space:nowrap}
.gm-labels .sl b{transform:translateX(var(--dx,0px));padding:4px 9px;border:1px solid rgba(255,255,255,.16);border-radius:999px;background:rgba(10,11,13,.8);font:560 12px/1 var(--display);font-variation-settings:"wdth" 106;color:#F2F3F5}
.gm-labels .sl i{width:1px;height:16px;background:linear-gradient(rgba(11,12,14,.55),rgba(11,12,14,0))}
.gm-narrow .gm-labels .sl.minor{display:none}

/* Anzeige oben rechts: Länge, Einschneideüberwachung, Kamera Q1240, Crimpkraft CFA+ */
.gm-hud{position:absolute;right:14px;top:14px;z-index:2;width:clamp(150px,22%,214px);padding:9px 11px 8px;border:1px solid rgba(11,12,14,.1);border-radius:14px;background:rgba(255,255,255,.86);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#0b0c0e;opacity:0;transition:opacity .35s var(--ease);pointer-events:none}
.gm-hud.on{opacity:1}
.gm-hp{display:none;gap:5px}
.gm-hp.on{display:grid}
.gm-hh{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font:500 9.5px/1.2 var(--mono);letter-spacing:.1em;text-transform:uppercase}
.gm-hh b{font:inherit;color:#1E8A4C;white-space:nowrap;opacity:0;transition:opacity .3s}
.gm-hh b.on{opacity:1}
.gm-hh b.bsp{color:#6a6f77}
.gm-hr{display:grid;grid-template-columns:auto 1fr;gap:8px;font:500 11px/1.3 var(--mono)}
.gm-hr span{opacity:.72}
.gm-hr i{justify-self:end;font-style:normal;font-variant-numeric:tabular-nums;font-weight:600}
.gm-hud svg{display:block;width:100%;height:auto;overflow:visible}
.gm-hud .g{fill:none;stroke:currentColor;stroke-opacity:.18}
.gm-hud .ut{fill:none;stroke:#4FA3FF;stroke-opacity:.6;stroke-dasharray:2 2}
.gm-hud .ref{fill:none;stroke:rgba(30,138,76,.22);stroke-width:5;stroke-linecap:round;stroke-linejoin:round}
.gm-hud .cv{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.gm-hud .dot{fill:#4FA3FF}
.gm-hud .utl{font:500 5.5px var(--mono);fill:#4FA3FF}
.gm-hud small{font:500 8.5px/1.3 var(--mono);letter-spacing:.05em;opacity:.62}
.gm-probe .gm-canvas,.gm-probe .gm-chips,.gm-probe .gm-hud,.gm-probe .gm-hh b,.gm-probe .gm-fig{transition:none!important}

/* schmal (Handy): hohes Format, Schrittleiste kompakter, Anzeige kleiner */
@media (max-width:760px){
  .gm-fig{margin-top:32px}
  .gm-stage{aspect-ratio:4/5;border-radius:18px}
  .gm-chips{left:10px;right:10px;bottom:10px;gap:5px}
  .gm-chips button{padding:5px 8px;font-size:9.5px;letter-spacing:.05em}
  .gm-chips em{display:none}
  .gm-hud{right:10px;top:10px;width:min(58%,214px);padding:7px 9px 6px}
}
