/* JetDieline – Erklärgrafiken im Glossar. Farben nur über die Variablen aus style.css.
   Das Zeichenfeld bleibt wie die übrigen Bühnen der Seite in hell und dunkel papierfarben;
   Bedienelemente und Legende folgen dem Farbschema der Seite. Keine Rundungen. */
.glossary-figure{margin:0;min-width:0;max-width:820px;font-family:var(--body);color:var(--c-text)}
.glossary-figure[hidden]{display:none}

/* Fallback ohne JavaScript: normale Linkliste */
.glossary-figure-terms{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px 18px;font-size:14px;line-height:1.6}
.glossary-figure-terms a{display:inline-block;padding:9px 0;text-decoration:underline;text-underline-offset:3px}
.glossary-figure-ready>.glossary-figure-terms{display:none}

/* Zeichenfeld */
.glossary-figure-stage{position:relative;direction:ltr;overflow:hidden;color:var(--c-stage-text);background-color:var(--c-stage);background-image:linear-gradient(rgb(var(--c-stage-grid-rgb)/.2) 1px,transparent 1px),linear-gradient(90deg,rgb(var(--c-stage-grid-rgb)/.2) 1px,transparent 1px);background-size:27px 27px;border:1px solid var(--c-stage-line)}
.glossary-figure-svg{display:block;width:100%;height:auto;fill:none;stroke-linecap:butt;stroke-linejoin:miter}
.glossary-figure-svg *{vector-effect:non-scaling-stroke;transition:fill .18s,opacity .18s,stroke-width .18s}
.glossary-figure-off{display:none}
.glossary-figure-hot{cursor:pointer;outline:none}

.glossary-figure-carton{fill:var(--c-carton)}
.glossary-figure-edge{stroke:var(--c-stage-text);stroke-width:1.6}
.glossary-figure-cut{stroke:var(--c-stage-text);stroke-width:1.6;stroke-linejoin:round;pointer-events:none}
.glossary-figure-crease{stroke:var(--c-accent-bg);stroke-width:1.5;stroke-dasharray:6 4;pointer-events:none}
.glossary-figure-cut.glossary-figure-own,.glossary-figure-crease.glossary-figure-own{stroke-width:2.5}
.glossary-figure-cut.glossary-figure-on,.glossary-figure-crease.glossary-figure-on,.glossary-figure-strong{stroke-width:3.2}
.glossary-figure-carton.glossary-figure-own{fill:var(--c-carton-dark);fill:color-mix(in srgb,var(--c-accent-bg) 22%,var(--c-carton))}
.glossary-figure-carton.glossary-figure-on,.glossary-figure-fail{fill:var(--c-carton-dark);fill:color-mix(in srgb,var(--c-accent-bg) 52%,var(--c-carton))}
.glossary-figure-glue{fill:var(--c-carton-dark);fill:color-mix(in srgb,var(--c-accent-bg) 38%,var(--c-carton))}
.glossary-figure-folded{fill:var(--c-carton-dark)}
.glossary-figure-hit{stroke:transparent;stroke-width:14;pointer-events:stroke}
.glossary-figure-hit-area{fill:transparent;pointer-events:all}
.glossary-figure-dim{stroke:var(--c-stage-text);stroke-width:1.2;pointer-events:none}
.glossary-figure-dim.glossary-figure-on,.glossary-figure-dim.glossary-figure-own,.glossary-figure-layer.glossary-figure-on .glossary-figure-dim{stroke:var(--c-accent-bg);stroke-width:2.2}
.glossary-figure-guide{stroke:var(--c-stage-muted);stroke-width:1;stroke-dasharray:2 3}
.glossary-figure-bbox,.glossary-figure-margin{stroke:var(--c-stage-muted);stroke-width:1.2;stroke-dasharray:5 4}
.glossary-figure-limit{stroke:var(--c-stage-text);stroke-width:1.4;stroke-dasharray:2 3}
.glossary-figure-board,.glossary-figure-board-edge{vector-effect:none;stroke-linejoin:round;transition:none}
.glossary-figure-board{stroke:var(--c-carton)}
.glossary-figure-board-edge{stroke:var(--c-stage-text)}
.glossary-figure-bead{fill:var(--c-carton-dark);stroke:var(--c-stage-text);stroke-width:1.2}
.glossary-figure-wall{stroke:var(--c-stage-text);stroke-width:4;stroke-linejoin:miter}
.glossary-figure-space.glossary-figure-on{fill:var(--c-stage-hi)}
.glossary-figure-layer{opacity:.3}
.glossary-figure-layer.glossary-figure-on{opacity:1}
.glossary-figure-art{display:none}
.glossary-figure-art.glossary-figure-on{display:inline}
.glossary-figure-art-fill{fill:var(--c-stage-hi);stroke:var(--c-stage-hi);stroke-width:9;vector-effect:none}
.glossary-figure-art-accent{fill:var(--c-accent-bg)}
.glossary-figure-art-ink{fill:var(--c-stage-text)}
.glossary-figure-art-light{fill:var(--c-stage-hi)}
.glossary-figure-ref{stroke:var(--c-stage-muted);stroke-width:3.4;opacity:.42;stroke-linejoin:round}
.glossary-figure-ref-crease{stroke-dasharray:6 4}
.glossary-figure-sheet{fill:var(--c-stage-hi);stroke:var(--c-stage-text);stroke-width:1.4}
.glossary-figure-tile{fill:var(--c-stage);stroke:var(--c-stage-line);stroke-width:1.2;pointer-events:all}
.glossary-figure-tile.glossary-figure-on{fill:var(--c-stage-hi);stroke:var(--c-accent-bg);stroke-width:2.4}
.glossary-figure-variant{opacity:.36}
.glossary-figure-variant.glossary-figure-on{opacity:1}
.glossary-figure-variant.glossary-figure-on>.glossary-figure-tile{stroke:var(--c-stage-text);stroke-width:1.8;fill:var(--c-stage-hi)}
.glossary-figure-grain{stroke:var(--c-carton-dark);stroke-width:1.2}
.glossary-figure-step{fill:var(--c-stage-hi);stroke:var(--c-stage-text);stroke-width:1.4}
.glossary-figure-step.glossary-figure-on,.glossary-figure-variant.glossary-figure-on .glossary-figure-step{fill:var(--c-carton)}
.glossary-figure-variant.glossary-figure-current .glossary-figure-step{stroke-width:2.8}
.glossary-figure-glyph{stroke:var(--c-stage-text);stroke-width:1.4}
.glossary-figure-glyph-fill{fill:var(--c-stage-hi)}
.glossary-figure-mark rect{fill:var(--c-stage-hi);stroke:var(--c-stage-text);stroke-width:1.4}
.glossary-figure-mark path{stroke:var(--c-stage-text);stroke-width:2}
.glossary-figure-mark-warn rect{fill:var(--c-accent-bg);stroke:var(--c-accent-bg)}
.glossary-figure-mark-warn path{stroke:var(--c-on-accent)}
.glossary-figure-textline{fill:var(--c-stage-line)}
.glossary-figure-node{fill:var(--c-stage-hi);stroke:var(--c-stage-text);stroke-width:1.6}
.glossary-figure-variant.glossary-figure-on .glossary-figure-node{fill:var(--c-accent-bg)}

/* Beschriftungen über der Zeichnung (HTML, damit sie bei jeder Breite lesbar bleiben) */
.glossary-figure-tag{position:absolute;transform:translate(-50%,-50%);font:600 13px/1 var(--display);color:var(--c-stage-text);background:var(--c-stage);padding:2px 4px;pointer-events:none;white-space:nowrap;transition:opacity .18s}
.glossary-figure-tag.glossary-figure-num{box-sizing:border-box;width:22px;height:22px;padding:0;display:flex;align-items:center;justify-content:center;font:600 12px/1 var(--body);background:var(--c-stage-hi);border:1px solid var(--c-stage-text);text-decoration:none}
.glossary-figure-tag.glossary-figure-hot{pointer-events:auto}
.glossary-figure-tag.glossary-figure-hot::after{content:'';position:absolute;inset:-10px}
.glossary-figure-tag.glossary-figure-num.glossary-figure-on{background:var(--c-stage-text);color:var(--c-stage-hi)}
.glossary-figure-tag.glossary-figure-num.glossary-figure-own{background:var(--c-accent-bg);border-color:var(--c-accent-bg);color:var(--c-on-accent)}
.glossary-figure-label{position:absolute;z-index:2;transform:translate(-50%,-100%);max-width:86%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:6px 10px;font:600 13px/1.3 var(--body);background:var(--c-stage-text);color:var(--c-stage-hi);pointer-events:none}
.glossary-figure-label.glossary-figure-at-start{transform:translate(-14px,-100%)}
.glossary-figure-label.glossary-figure-at-end{transform:translate(calc(-100% + 14px),-100%)}
.glossary-figure-label[hidden]{display:none}

/* Bedienelemente */
.glossary-figure-bar{display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px;margin-top:14px}
.glossary-figure-field{display:flex;align-items:center;gap:14px;flex:1 1 220px;min-width:0;min-height:44px;font-size:13px;font-weight:550;cursor:pointer}
.glossary-figure-field-label{flex:0 1 auto;min-width:0;overflow-wrap:anywhere}
.glossary-figure-range{flex:1 1 120px;min-width:90px;width:auto}
.glossary-figure-field-value{flex:none;min-width:36px;text-align:end;font-variant-numeric:tabular-nums;color:var(--c-text-muted)}
.glossary-figure-buttons{display:flex;flex-wrap:wrap;gap:8px;min-width:0}
.glossary-figure-button{display:inline-flex;align-items:center;gap:9px;min-width:44px;min-height:44px;justify-content:center;padding:6px 14px;border:1px solid var(--c-line-strong);background:var(--c-surface);color:var(--c-text);font:550 13px/1.35 var(--body);text-align:start;overflow-wrap:anywhere}
.glossary-figure-button:hover{border-color:var(--c-text)}
.glossary-figure-button[aria-pressed=true]{background:var(--c-action);border-color:var(--c-action);color:var(--c-on-action)}
.glossary-figure-button:focus-visible,.glossary-figure-chip:focus-visible{outline:3px solid var(--c-accent);outline-offset:2px}

/* Legende */
.glossary-figure-legend{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.glossary-figure-legend li{display:flex;min-width:0}
.glossary-figure-chip{display:inline-flex;align-items:center;gap:9px;min-height:44px;padding:6px 14px 6px 10px;border:1px solid var(--c-line);background:transparent;color:var(--c-text);font:500 13px/1.35 var(--body);text-align:start;text-decoration:none;overflow-wrap:anywhere;cursor:pointer}
.glossary-figure-chip:hover,.glossary-figure-chip.glossary-figure-on{border-color:var(--c-text);background:var(--c-surface-alt)}
.glossary-figure-chip.glossary-figure-own{background:var(--c-action);border-color:var(--c-action);color:var(--c-on-action);cursor:default}
.glossary-figure-key{align-items:center;gap:9px;min-height:44px;padding:0 8px;font-size:12px;color:var(--c-text-muted)}
.glossary-figure-swatch{flex:none;display:inline-block;box-sizing:border-box;font-style:normal}
.glossary-figure-swatch-cut{width:22px;border-top:2px solid currentColor}
.glossary-figure-swatch-crease{width:22px;border-top:2px dashed var(--c-accent)}
.glossary-figure-swatch-ref{width:22px;border-top:3px solid var(--c-control)}
.glossary-figure-swatch-bbox{width:16px;height:12px;border:1px dashed currentColor}
.glossary-figure-swatch-art{width:16px;height:12px;background:linear-gradient(90deg,var(--c-accent) 50%,transparent 50%);border:1px solid currentColor}
.glossary-figure-swatch-grain{width:18px;height:8px;border-top:1px solid currentColor;border-bottom:1px solid currentColor}
.glossary-figure-swatch-num{min-width:20px;height:20px;padding:0 3px;border:1px solid currentColor;display:inline-flex;align-items:center;justify-content:center;font:600 11px/1 var(--body)}
.glossary-figure-swatch-num:empty{min-width:10px;width:10px;height:10px;padding:0}
.glossary-figure-swatch-sym{font:italic 600 14px/1 var(--display)}

@media (max-width:520px){
  .glossary-figure-tag{font-size:12px}
  .glossary-figure-tag.glossary-figure-num{width:18px;height:18px;font-size:10px}
  .glossary-figure-label{font-size:12px;padding:5px 8px}
  .glossary-figure-field{flex-basis:100%}
}
@media (prefers-reduced-motion:reduce){
  .glossary-figure-svg *,.glossary-figure-tag{transition:none}
}