.g-knopf{position:relative;flex:none;display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);height:var(--g-knopf-hoehe);padding:0 var(--g-knopf-pad);border-radius:var(--g-rund-voll);font:var(--g-knopf-schrift);white-space:nowrap;color:var(--g-pille-text);background:var(--g-pille);box-shadow:inset 0 0 0 1px var(--g-pille-rand),inset 0 1px 0 var(--g-pille-licht);transition:background var(--g-dauer-kurz) ease,color var(--g-dauer-kurz) ease,transform var(--g-dauer-kurz) var(--g-kurve),box-shadow var(--g-dauer) ease,opacity var(--g-dauer) ease}.g-knopf>.g-i{width:var(--g-icon-klein);height:var(--g-icon-klein)}.g-knopf:hover{background:var(--g-pille-hover)}.g-knopf:active{transform:scale(.97);background:var(--g-pille-aktiv)}.g-knopf--primaer{color:var(--g-text-auf-akzent);background:var(--g-akzent-flaeche);box-shadow:inset 0 0 0 1px var(--g-eintrag-aktiv-rand),inset 0 1px 0 rgba(255,255,255,.18)}.g-knopf--primaer:hover{background:var(--g-akzent-flaeche);filter:brightness(1.08)}.g-knopf--primaer:active{background:var(--g-akzent-flaeche)}.g-knopf--leise{background:none;box-shadow:none;color:var(--g-akzent-text)}.g-knopf--leise:hover,.g-knopf--leise:active{background:var(--g-pop-hover)}.g-knopf--gefahr{color:var(--g-rot)}.g-knopf--gefahr:hover{background:var(--g-ton-negativ-flaeche)}.g-knopf--klein{height:var(--g-knopf-hoehe);padding:0 var(--g-knopf-pad);font:var(--g-knopf-schrift)}.g-knopf--fest{width:calc(var(--einheit) * 37)}.g-knopf:disabled,.g-knopf[aria-disabled=true]{opacity:.45;transform:none;filter:none}.g-knopf.ist-laden{color:transparent;pointer-events:none}.g-knopf.ist-laden>.g-i{opacity:0}.g-knopf.ist-laden::after{content:"";position:absolute;left:calc(50% - var(--g-icon-klein) / 2);top:calc(50% - var(--g-icon-klein) / 2);width:var(--g-icon-klein);height:var(--g-icon-klein);border-radius:50%;border:2px solid var(--g-pille-text);border-right-color:transparent;animation:g-dreh .7s linear infinite}.g-knopf--primaer.ist-laden::after{border-color:var(--g-text-auf-akzent);border-right-color:transparent}.g-knopf[data-mock]{outline:1px dashed var(--g-ton-violett);outline-offset:2px}.g-knopf[data-mock]:focus-visible{outline:var(--g-fokus-breite) solid var(--g-fokus-ring)}.g-knopf--fest{width:calc(var(--einheit-text) * 37)}
