
@property --gradient-angle { syntax: "<angle>"; initial-value: 0deg; inherits: false; }
@property --gradient-angle-offset { syntax: "<angle>"; initial-value: 0deg; inherits: false; }
@property --gradient-percent { syntax: "<percentage>"; initial-value: 5%; inherits: false; }
@property --gradient-shine { syntax: "<color>"; initial-value: white; inherits: false; }

:where([data-ez-shiny="g"], .ezyer-magic-button, .ezb-magic, .ezp-green, .ezf-row-btn.is-green, .ezh-pill.is-green, .ezh-pill.is-big, .ezsc-cta:not(.is-quiet), .gbtn, .ezs-start-go, .ez-green, .ezyer-feature-grid > button.is-green, .esp-search button[type=submit], .ezd-btn.is-green, .ezyer-back, .ezyer-mini-primary, .ezyer-footer-primary, .shell .btn.btn-primary, .shell .connect-btn:not([disabled]):not(.is-on)):not(.ez-no-shiny) { --sc-bg:#0c0c0c;--sc-fg:#dce4e7;--sc-a:#05dc80;--sc-b:#16302b;--sc-shine-idle:#16302b;--sc-shine-hover:#02674f;--sc-glow:#05dc80;--sc-shimmer:#16302b;--sc-dots:#202020;--sc-dots-op:0.4;--sc-shimmer-op:0.6;--sc-glow-mix:100%; }
[data-ez-shiny="d"] { --sc-bg:#141414;--sc-fg:#dce4e7;--sc-a:#292929;--sc-b:#141414;--sc-shine-idle:#212121;--sc-shine-hover:#404040;--sc-glow:#333333;--sc-shimmer:#080808;--sc-dots:#4a4a4a;--sc-dots-op:0.4;--sc-shimmer-op:0.6;--sc-glow-mix:100%; }

:where([data-ez-shiny="g"], [data-ez-shiny="d"], .ezyer-magic-button, .ezb-magic, .ezp-green, .ezf-row-btn.is-green, .ezh-pill.is-green, .ezh-pill.is-big, .ezsc-cta:not(.is-quiet), .gbtn, .ezs-start-go, .ez-green, .ezyer-feature-grid > button.is-green, .esp-search button[type=submit], .ezd-btn.is-green, .ezyer-back, .ezyer-mini-primary, .ezyer-footer-primary, .shell .btn.btn-primary, .shell .connect-btn:not([disabled]):not(.is-on)):not(.ez-no-shiny) {
  --gradient-percent: 25%;
  --gradient-shine: var(--sc-shine-idle);
  --gradient-angle-offset: 0deg;
  --shadow-size: 2px;
  isolation: isolate !important;
  overflow: hidden !important;
  color: var(--sc-fg) !important;
  font-family: "Denim Ink WD", ui-sans-serif, system-ui, sans-serif !important;
  letter-spacing: -0.04em !important;
  border: 1px solid transparent !important;
  outline: none;
  background:
    linear-gradient(var(--sc-bg), var(--sc-bg)) padding-box,
    conic-gradient(
      from calc(var(--gradient-angle) - var(--gradient-angle-offset)),
      transparent,
      var(--sc-a) var(--gradient-percent),
      var(--gradient-shine) calc(var(--gradient-percent) * 2),
      var(--sc-b) calc(var(--gradient-percent) * 3),
      transparent calc(var(--gradient-percent) * 4)
    ) border-box !important;
  box-shadow: none !important;
  text-shadow: none !important;
  filter: none !important;
  transition: --gradient-angle-offset 1050ms cubic-bezier(0.25, 1, 0.5, 1), --gradient-percent 1050ms cubic-bezier(0.25, 1, 0.5, 1), --gradient-shine 1050ms cubic-bezier(0.25, 1, 0.5, 1), box-shadow 1050ms cubic-bezier(0.25, 1, 0.5, 1), opacity .2s ease, translate .12s ease !important;
  animation: ez-sc-angle 12s linear infinite, ez-sc-angle 30s linear infinite reverse paused !important;
  animation-composition: add;
}
:where(.ezyer-magic-button, .ezb-magic, .ezp-green, .ezf-row-btn.is-green, .ezh-pill.is-green, .ezh-pill.is-big, .ezsc-cta:not(.is-quiet), .gbtn, .ezs-start-go, .ez-green, .ezyer-feature-grid > button.is-green, .esp-search button[type=submit], .ezd-btn.is-green, .ezyer-back, .ezyer-mini-primary, .ezyer-footer-primary, .shell .btn.btn-primary, .shell .connect-btn:not([disabled]):not(.is-on)):not(.ez-no-shiny) { position: relative !important; }
/* the green buttons used Black or Spring Green on their insides: all White now (the Ezyer mark stays Spring Green) */
:where([data-ez-shiny="g"], .ezyer-magic-button, .ezb-magic, .ezp-green, .ezf-row-btn.is-green, .ezh-pill.is-green, .ezh-pill.is-big, .ezsc-cta:not(.is-quiet), .gbtn, .ezs-start-go, .ez-green, .ezyer-feature-grid > button.is-green, .esp-search button[type=submit], .ezd-btn.is-green, .ezyer-back, .ezyer-mini-primary, .ezyer-footer-primary, .shell .btn.btn-primary, .shell .connect-btn:not([disabled]):not(.is-on)):not(.ez-no-shiny) { font-weight: 600 !important; }
:where([data-ez-shiny="g"], .ezyer-magic-button, .ezb-magic, .ezp-green, .ezf-row-btn.is-green, .ezh-pill.is-green, .ezh-pill.is-big, .ezsc-cta:not(.is-quiet), .gbtn, .ezs-start-go, .ez-green, .ezyer-feature-grid > button.is-green, .esp-search button[type=submit], .ezd-btn.is-green, .ezyer-back, .ezyer-mini-primary, .ezyer-footer-primary, .shell .btn.btn-primary, .shell .connect-btn:not([disabled]):not(.is-on)):not(.ez-no-shiny) :where(span, b, strong, small, em, i, svg, p, div) { color: inherit !important; }
:where([data-ez-shiny="g"], .ezyer-magic-button, .ezb-magic, .ezp-green, .ezf-row-btn.is-green, .ezh-pill.is-green, .ezh-pill.is-big, .ezsc-cta:not(.is-quiet), .gbtn, .ezs-start-go, .ez-green, .ezyer-feature-grid > button.is-green, .esp-search button[type=submit], .ezd-btn.is-green, .ezyer-back, .ezyer-mini-primary, .ezyer-footer-primary, .shell .btn.btn-primary, .shell .connect-btn:not([disabled]):not(.is-on)):not(.ez-no-shiny) :is(.ezyer-spark-svg, svg.mark, .ez-mark, .ez-mark *) { color: #05dc80 !important; }
:where([data-ez-shiny="g"], .ezyer-magic-button, .ezb-magic, .ezp-green, .ezf-row-btn.is-green, .ezh-pill.is-green, .ezh-pill.is-big, .ezsc-cta:not(.is-quiet), .gbtn, .ezs-start-go, .ez-green, .ezyer-feature-grid > button.is-green, .esp-search button[type=submit], .ezd-btn.is-green, .ezyer-back, .ezyer-mini-primary, .ezyer-footer-primary, .shell .btn.btn-primary, .shell .connect-btn:not([disabled]):not(.is-on)):not(.ez-no-shiny) > :not(svg) { background-color: transparent !important; box-shadow: none !important; }

:where([data-ez-shiny="g"], [data-ez-shiny="d"], .ezyer-magic-button, .ezb-magic, .ezp-green, .ezf-row-btn.is-green, .ezh-pill.is-green, .ezh-pill.is-big, .ezsc-cta:not(.is-quiet), .gbtn, .ezs-start-go, .ez-green, .ezyer-feature-grid > button.is-green, .esp-search button[type=submit], .ezd-btn.is-green, .ezyer-back, .ezyer-mini-primary, .ezyer-footer-primary, .shell .btn.btn-primary, .shell .connect-btn:not([disabled]):not(.is-on)):not(.ez-no-shiny)::before, :where([data-ez-shiny="g"], [data-ez-shiny="d"], .ezyer-magic-button, .ezb-magic, .ezp-green, .ezf-row-btn.is-green, .ezh-pill.is-green, .ezh-pill.is-big, .ezsc-cta:not(.is-quiet), .gbtn, .ezs-start-go, .ez-green, .ezyer-feature-grid > button.is-green, .esp-search button[type=submit], .ezd-btn.is-green, .ezyer-back, .ezyer-mini-primary, .ezyer-footer-primary, .shell .btn.btn-primary, .shell .connect-btn:not([disabled]):not(.is-on)):not(.ez-no-shiny)::after {
  content: "" !important; display: block !important; pointer-events: none !important;
  position: absolute !important; inset: auto !important;
  left: 50% !important; top: 50% !important; transform: none !important; translate: -50% -50% !important;
  z-index: -1 !important; transition: none !important; border: 0 !important; box-shadow: none !important; filter: none !important;
}
/* dot pattern, revealed by a rotating mask */
:where([data-ez-shiny="g"], [data-ez-shiny="d"], .ezyer-magic-button, .ezb-magic, .ezp-green, .ezf-row-btn.is-green, .ezh-pill.is-green, .ezh-pill.is-big, .ezsc-cta:not(.is-quiet), .gbtn, .ezs-start-go, .ez-green, .ezyer-feature-grid > button.is-green, .esp-search button[type=submit], .ezd-btn.is-green, .ezyer-back, .ezyer-mini-primary, .ezyer-footer-primary, .shell .btn.btn-primary, .shell .connect-btn:not([disabled]):not(.is-on)):not(.ez-no-shiny)::before {
  --size: calc(100% - var(--shadow-size) * 3);
  --position: 2px;
  --space: calc(var(--position) * 2);
  width: var(--size) !important; height: var(--size) !important;
  background: radial-gradient(circle at var(--position) var(--position), var(--sc-dots) calc(var(--position) / 4), transparent 0) padding-box !important;
  background-size: var(--space) var(--space) !important;
  background-repeat: space !important;
  -webkit-mask-image: conic-gradient(from calc(var(--gradient-angle) + 45deg), black, transparent 10% 90%, black);
  mask-image: conic-gradient(from calc(var(--gradient-angle) + 45deg), black, transparent 10% 90%, black);
  border-radius: inherit !important;
  opacity: var(--sc-dots-op) !important;
  animation: ez-sc-angle 12s linear infinite, ez-sc-angle 30s linear infinite reverse paused !important;
  animation-composition: add;
}
/* inner shimmer */
:where([data-ez-shiny="g"], [data-ez-shiny="d"], .ezyer-magic-button, .ezb-magic, .ezp-green, .ezf-row-btn.is-green, .ezh-pill.is-green, .ezh-pill.is-big, .ezsc-cta:not(.is-quiet), .gbtn, .ezs-start-go, .ez-green, .ezyer-feature-grid > button.is-green, .esp-search button[type=submit], .ezd-btn.is-green, .ezyer-back, .ezyer-mini-primary, .ezyer-footer-primary, .shell .btn.btn-primary, .shell .connect-btn:not([disabled]):not(.is-on)):not(.ez-no-shiny)::after {
  /* big enough that the rotating square always covers the corners of wide tiles (no dark wedge sweeping past) */
  width: 160% !important; height: auto !important; aspect-ratio: 1 !important;
  background: linear-gradient(-50deg, transparent, var(--sc-shimmer), transparent) !important;
  -webkit-mask-image: radial-gradient(circle at bottom, transparent 40%, black);
  mask-image: radial-gradient(circle at bottom, transparent 40%, black);
  opacity: var(--sc-shimmer-op) !important;
  border-radius: 0 !important;
  animation: ez-sc-shimmer 12s linear infinite, ez-sc-shimmer 30s linear infinite reverse paused !important;
  animation-composition: add;
}
/* the dark buttons hold still until hovered (a panel can hold dozens) */
/* (specific enough to beat the shared rule above; the hover rule below is more specific still) */
[data-ez-shiny="d"][data-ez-shiny]:not(.ez-no-shiny), [data-ez-shiny="d"][data-ez-shiny]:not(.ez-no-shiny)::before, [data-ez-shiny="d"][data-ez-shiny]:not(.ez-no-shiny)::after { animation-play-state: paused !important; }
:where([data-ez-shiny="g"], [data-ez-shiny="d"], .ezyer-magic-button, .ezb-magic, .ezp-green, .ezf-row-btn.is-green, .ezh-pill.is-green, .ezh-pill.is-big, .ezsc-cta:not(.is-quiet), .gbtn, .ezs-start-go, .ez-green, .ezyer-feature-grid > button.is-green, .esp-search button[type=submit], .ezd-btn.is-green, .ezyer-back, .ezyer-mini-primary, .ezyer-footer-primary, .shell .btn.btn-primary, .shell .connect-btn:not([disabled]):not(.is-on)):not(.ez-no-shiny):active:not(:disabled) { translate: 0 1px; }
/* (never reset transform here: buttons centred with translate(-50%) would jump sideways while pressed) */
.ezyer-magic-button:active { transform: none !important; }

/* hover / keyboard focus: the shine brightens, the motion speeds up, the glow rises from the bottom (no inner ring) */
:where([data-ez-shiny="g"], [data-ez-shiny="d"], .ezyer-magic-button, .ezb-magic, .ezp-green, .ezf-row-btn.is-green, .ezh-pill.is-green, .ezh-pill.is-big, .ezsc-cta:not(.is-quiet), .gbtn, .ezs-start-go, .ez-green, .ezyer-feature-grid > button.is-green, .esp-search button[type=submit], .ezd-btn.is-green, .ezyer-back, .ezyer-mini-primary, .ezyer-footer-primary, .shell .btn.btn-primary, .shell .connect-btn:not([disabled]):not(.is-on)):not(.ez-no-shiny):is(:hover, :focus-visible):not(:disabled):not([aria-disabled="true"]) {
  --gradient-angle-offset: 0deg;
  --gradient-shine: var(--sc-shine-hover);
  box-shadow: inset 0 -1ex 2rem -4px color-mix(in srgb, var(--sc-glow) var(--sc-glow-mix), transparent) !important;
}
:where([data-ez-shiny="g"], [data-ez-shiny="d"], .ezyer-magic-button, .ezb-magic, .ezp-green, .ezf-row-btn.is-green, .ezh-pill.is-green, .ezh-pill.is-big, .ezsc-cta:not(.is-quiet), .gbtn, .ezs-start-go, .ez-green, .ezyer-feature-grid > button.is-green, .esp-search button[type=submit], .ezd-btn.is-green, .ezyer-back, .ezyer-mini-primary, .ezyer-footer-primary, .shell .btn.btn-primary, .shell .connect-btn:not([disabled]):not(.is-on)):not(.ez-no-shiny):is(:hover, :focus-visible):not(:disabled):not([aria-disabled="true"]), :where([data-ez-shiny="g"], [data-ez-shiny="d"], .ezyer-magic-button, .ezb-magic, .ezp-green, .ezf-row-btn.is-green, .ezh-pill.is-green, .ezh-pill.is-big, .ezsc-cta:not(.is-quiet), .gbtn, .ezs-start-go, .ez-green, .ezyer-feature-grid > button.is-green, .esp-search button[type=submit], .ezd-btn.is-green, .ezyer-back, .ezyer-mini-primary, .ezyer-footer-primary, .shell .btn.btn-primary, .shell .connect-btn:not([disabled]):not(.is-on)):not(.ez-no-shiny):is(:hover, :focus-visible):not(:disabled):not([aria-disabled="true"])::before, :where([data-ez-shiny="g"], [data-ez-shiny="d"], .ezyer-magic-button, .ezb-magic, .ezp-green, .ezf-row-btn.is-green, .ezh-pill.is-green, .ezh-pill.is-big, .ezsc-cta:not(.is-quiet), .gbtn, .ezs-start-go, .ez-green, .ezyer-feature-grid > button.is-green, .esp-search button[type=submit], .ezd-btn.is-green, .ezyer-back, .ezyer-mini-primary, .ezyer-footer-primary, .shell .btn.btn-primary, .shell .connect-btn:not([disabled]):not(.is-on)):not(.ez-no-shiny):is(:hover, :focus-visible):not(:disabled):not([aria-disabled="true"])::after { animation-play-state: running !important; }
:where([data-ez-shiny="g"], [data-ez-shiny="d"], .ezyer-magic-button, .ezb-magic, .ezp-green, .ezf-row-btn.is-green, .ezh-pill.is-green, .ezh-pill.is-big, .ezsc-cta:not(.is-quiet), .gbtn, .ezs-start-go, .ez-green, .ezyer-feature-grid > button.is-green, .esp-search button[type=submit], .ezd-btn.is-green, .ezyer-back, .ezyer-mini-primary, .ezyer-footer-primary, .shell .btn.btn-primary, .shell .connect-btn:not([disabled]):not(.is-on)):not(.ez-no-shiny):focus-visible { outline: 2px solid #05dc80 !important; outline-offset: 3px; }
:where([data-ez-shiny="g"], [data-ez-shiny="d"], .ezyer-magic-button, .ezb-magic, .ezp-green, .ezf-row-btn.is-green, .ezh-pill.is-green, .ezh-pill.is-big, .ezsc-cta:not(.is-quiet), .gbtn, .ezs-start-go, .ez-green, .ezyer-feature-grid > button.is-green, .esp-search button[type=submit], .ezd-btn.is-green, .ezyer-back, .ezyer-mini-primary, .ezyer-footer-primary, .shell .btn.btn-primary, .shell .connect-btn:not([disabled]):not(.is-on)):not(.ez-no-shiny):is(:disabled, [aria-disabled="true"]) { opacity: .5 !important; cursor: default; }

/* the flat squircles: the Dots card look, nothing moving */
:where([data-ez-shiny="s"], .ezb-link) { background: #141414 !important; background-image: none !important; border-color: transparent !important;
  box-shadow: inset 0 0 0 1px rgba(220, 228, 231, .07) !important; transition: box-shadow .2s ease, transform .25s cubic-bezier(.34, 1.56, .64, 1), opacity .2s ease; }
:where([data-ez-shiny="s"], .ezb-link):is(:hover, :focus-visible):not(:disabled):not([aria-disabled="true"]) { box-shadow: inset 0 0 0 1px rgba(220, 228, 231, .16) !important; }
:where([data-ez-shiny="s"], .ezb-link):focus-visible { outline: 2px solid #05dc80; outline-offset: 3px; }

@keyframes ez-sc-angle { to { --gradient-angle: 360deg; } }
@keyframes ez-sc-shimmer { to { rotate: 360deg; } }

@media (prefers-reduced-motion: reduce) {
  :where([data-ez-shiny="g"], [data-ez-shiny="d"], .ezyer-magic-button, .ezb-magic, .ezp-green, .ezf-row-btn.is-green, .ezh-pill.is-green, .ezh-pill.is-big, .ezsc-cta:not(.is-quiet), .gbtn, .ezs-start-go, .ez-green, .ezyer-feature-grid > button.is-green, .esp-search button[type=submit], .ezd-btn.is-green, .ezyer-back, .ezyer-mini-primary, .ezyer-footer-primary, .shell .btn.btn-primary, .shell .connect-btn:not([disabled]):not(.is-on)):not(.ez-no-shiny), :where([data-ez-shiny="g"], [data-ez-shiny="d"], .ezyer-magic-button, .ezb-magic, .ezp-green, .ezf-row-btn.is-green, .ezh-pill.is-green, .ezh-pill.is-big, .ezsc-cta:not(.is-quiet), .gbtn, .ezs-start-go, .ez-green, .ezyer-feature-grid > button.is-green, .esp-search button[type=submit], .ezd-btn.is-green, .ezyer-back, .ezyer-mini-primary, .ezyer-footer-primary, .shell .btn.btn-primary, .shell .connect-btn:not([disabled]):not(.is-on)):not(.ez-no-shiny)::before, :where([data-ez-shiny="g"], [data-ez-shiny="d"], .ezyer-magic-button, .ezb-magic, .ezp-green, .ezf-row-btn.is-green, .ezh-pill.is-green, .ezh-pill.is-big, .ezsc-cta:not(.is-quiet), .gbtn, .ezs-start-go, .ez-green, .ezyer-feature-grid > button.is-green, .esp-search button[type=submit], .ezd-btn.is-green, .ezyer-back, .ezyer-mini-primary, .ezyer-footer-primary, .shell .btn.btn-primary, .shell .connect-btn:not([disabled]):not(.is-on)):not(.ez-no-shiny)::after { animation: none !important; }
}
