@property --gc-glanz{syntax:'<percentage>';inherits:false;initial-value:-40%}
@property --gc-w{syntax:'<angle>';inherits:false;initial-value:-70deg}
html.gc3{--gc-hl:255,214,168}
@keyframes gcGlanz{from{--gc-glanz:-40%}to{--gc-glanz:140%}}
@keyframes gcKranz{from{--gc-w:-70deg}to{--gc-w:291deg}}
@keyframes gcKerze{0%,100%{opacity:.86}18%{opacity:1}34%{opacity:.8}52%{opacity:.97}70%{opacity:.84}86%{opacity:1}}
@keyframes gcPuls{0%,100%{transform:scale(.94);opacity:.75}50%{transform:scale(1.06);opacity:1}}

html.sc.rg.gc3 .gc-t{transition:transform .12s ease-out}
html.sc.rg.gc3 .gc-t::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;border-radius:2px;opacity:0;mix-blend-mode:screen;transition:opacity .12s;
  background:linear-gradient(105deg,transparent calc(var(--gc-glanz) - 16%),rgba(var(--gc-hl),.34) var(--gc-glanz),transparent calc(var(--gc-glanz) + 16%)),
    linear-gradient(to bottom,rgba(var(--gc-hl),.18),transparent 50%)}
html.sc.rg.gc3 .gc-t:is(:hover,:focus-visible):not(:disabled):not([aria-pressed="true"]){transform:translateY(-1px)}
html.sc.rg.gc3 .gc-t:is(:hover,:focus-visible):not(:disabled)::after{opacity:1;animation:gcGlanz .6s cubic-bezier(.2,.7,.3,1) both}
html.sc.rg.gc3 .gc-t:is(:hover,:focus-visible):not(:disabled){color:var(--gc-weiss)}
html.sc.rg.gc3 .gc-t:is(.gefahr,[data-gc="beenden"]):is(:hover,:focus-visible)::after{background:radial-gradient(ellipse 70% 90% at 50% 120%,rgba(200,40,20,.55),transparent 70%)}

html.sc.rg.gc3 .gc-knopf::before,html.sc.rg.gc3 .gc-knopf::after{content:"";position:absolute;left:50%;top:calc(20 * var(--bp));width:calc(43 * var(--bp));height:calc(43 * var(--bp));
  margin:calc(-21.5 * var(--bp)) 0 0 calc(-21.5 * var(--bp));border-radius:50%;pointer-events:none;opacity:0;mix-blend-mode:screen;transition:opacity .14s}
html.sc.rg.gc3 .gc-knopf::before{background:radial-gradient(circle,rgba(var(--gc-hl),.15) 0 64%,transparent 70%)}
html.sc.rg.gc3 .gc-knopf::after{background:conic-gradient(from var(--gc-w),transparent 0deg,rgba(var(--gc-hl),1) 26deg,transparent 62deg 360deg);
  -webkit-mask:radial-gradient(circle,transparent 0 79%,#000 82% 95%,transparent 99%);mask:radial-gradient(circle,transparent 0 79%,#000 82% 95%,transparent 99%)}
html.sc.rg.gc3 .gc-knopf:is(:hover,:focus-visible)::before{opacity:1}
html.sc.rg.gc3 .gc-knopf:is(:hover,:focus-visible)::after{opacity:1;animation:gcKranz .7s cubic-bezier(.25,.6,.3,1) both}
html.sc.rg.gc3 .gc-knopf:is(:hover,:focus-visible) span{color:var(--gc-weiss)}
html.sc.rg.gc3 .gc-knopf:hover{filter:none}

html.sc.rg.gc3 .gc-nische::after{content:"";position:absolute;left:16%;right:16%;top:12%;bottom:24%;border-radius:50% 50% 6% 6% / 34% 34% 6% 6%;pointer-events:none;opacity:0;
  mix-blend-mode:screen;transition:opacity .18s;background:radial-gradient(ellipse 70% 60% at 50% 96%,rgba(var(--gc-hl),.5),rgba(var(--gc-hl),.12) 55%,transparent 78%)}
html.sc.rg.gc3 .gc-nische:is(:hover,:focus-visible)::after{opacity:1;animation:gcKerze 1.8s ease-in-out infinite}
html.sc.rg.gc3 .gc-nische:is(:hover,:focus-visible) span{color:var(--gc-weiss);text-shadow:var(--gc-schatten),0 0 calc(8 * var(--bp)) rgba(var(--gc-hl),.45)}
html.sc.rg.gc3 .gc-nische:hover{filter:none}

html.sc.rg.gc3 #scSocle #scBar button i{position:relative}
html.sc.rg.gc3 #scSocle #scBar button i::after{content:"";position:absolute;inset:calc(-1.5 * var(--bp));border-radius:50%;pointer-events:none;opacity:0;transition:opacity .14s;
  box-shadow:0 0 0 calc(1.4 * var(--bp)) rgba(var(--gc-hl),.8),0 0 calc(8 * var(--bp)) rgba(var(--gc-hl),.5)}
html.sc.rg.gc3 #scSocle #scBar button:is(:hover,:focus-visible) i::after{opacity:1;animation:gcKerze 1.8s ease-in-out infinite}
html.sc.rg.gc3 #scSocle #scBar button:is(:hover,:focus-visible) i{color:var(--gc-weiss);text-shadow:0 0 calc(6 * var(--bp)) rgba(var(--gc-hl),.9)}

html.sc.rg.gc3 .gc-schalter{position:relative}
html.sc.rg.gc3 .gc-schalter::after{content:"";position:absolute;right:calc(-23 * var(--bp));top:calc(-2 * var(--bp));bottom:calc(-2 * var(--bp));width:calc(20 * var(--bp));pointer-events:none;opacity:0;
  mix-blend-mode:screen;transition:opacity .14s,transform .2s ease-out;border-radius:calc(8 * var(--bp));background:radial-gradient(ellipse 60% 70% at 70% 50%,rgba(var(--gc-hl),.55),transparent 72%)}
html.sc.rg.gc3 .gc-schalter[aria-checked="true"]::after{background:radial-gradient(ellipse 60% 70% at 30% 50%,rgba(var(--gc-hl),.4),transparent 72%)}
html.sc.rg.gc3 .gc-schalter:is(:hover,:focus-visible)::after{opacity:1}
html.sc.rg.gc3 .gc-schalter:is(:hover,:focus-visible) :is(.name,.zust){color:var(--gc-weiss)}
html.sc.rg.gc3 .gc-schalter:hover{filter:none}

html.sc.rg.gc3 .gc-rund::after{content:"";position:absolute;inset:calc(-1.5 * var(--bp));border-radius:50%;pointer-events:none;opacity:0;mix-blend-mode:screen;transition:opacity .12s;
  background:conic-gradient(from var(--gc-w),transparent 0deg,rgba(var(--gc-hl),.95) 26deg,transparent 64deg 360deg);
  -webkit-mask:radial-gradient(circle,transparent 0 76%,#000 80% 96%,transparent 100%);mask:radial-gradient(circle,transparent 0 76%,#000 80% 96%,transparent 100%)}
html.sc.rg.gc3 .gc-rund:is(:hover,:focus-visible)::after{opacity:1;animation:gcKranz .7s cubic-bezier(.25,.6,.3,1) both}
html.sc.rg.gc3 .gc-rund:hover{filter:brightness(1.12)}

html.sc.rg.gc3 .gc-held .gc-med i{transition:filter .14s}
html.sc.rg.gc3 .gc-held:is(:hover,:focus-visible) .gc-med i{filter:brightness(1.35) drop-shadow(0 0 calc(4 * var(--bp)) rgba(var(--gc-hl),.65))}
#gcFigurLicht{position:fixed;z-index:6;pointer-events:none;border-radius:50%;box-shadow:0 0 0 2px rgba(var(--gc-hl),.9),0 0 14px 3px rgba(var(--gc-hl),.55),inset 0 0 10px rgba(var(--gc-hl),.4);
  animation:gcPuls 1.4s ease-in-out infinite}

html.sc.rg.gc3 #gcKopf .gc-marke:is(:hover,:focus-visible) .gc-siegel{filter:brightness(1.4) drop-shadow(0 0 calc(5 * var(--bp)) rgba(var(--gc-hl),.6))}
html.sc.rg.gc3 #gcTisch .gc-spiegel:is(:hover,:focus-visible){box-shadow:inset 0 0 0 1px rgba(var(--gc-hl),.6),inset 0 0 calc(24 * var(--bp)) rgba(var(--gc-hl),.18)}

@media (prefers-reduced-motion:reduce){
  html.gc3 :is(.gc-t,.gc-knopf,.gc-nische,.gc-rund,#scBar button i)::after,#gcFigurLicht{animation:none!important}
  html.gc3 .gc-knopf::after{--gc-w:291deg}
  html.gc3 .gc-t:hover{transform:none}
}