/* The Veil finish is deprecated and retained for existing sites. */
/* Optional action-only materials. Load after the matching global/scoped core.
   re.buttons overrides general material paint; re.utilities keeps preferences first.
   Default/omitted values deliberately install no override. Navigation toggles
   and dropdown controls keep their existing normal/hover paint. No JavaScript. */
@layer re.tokens {
  :where([data-depth="flat"], :scope[data-depth="flat"]) { --re-soft-distance:0px; --re-soft-blur:0px; }
  :where([data-depth="subtle"], :scope[data-depth="subtle"]) { --re-soft-distance:4px; --re-soft-blur:10px; }
  :where([data-depth="pronounced"], :scope[data-depth="pronounced"]) { --re-soft-distance:7px; --re-soft-blur:18px; }
  :where([data-motion="none"], :scope[data-motion="none"]) { --re-liquid-motion: 0; }
  :where([data-motion="subtle"], :scope[data-motion="subtle"]) { --re-liquid-motion: 1; --re-liquid-scale-x: 1.025; --re-liquid-scale-y: 1.015; }
  :where([data-motion="expressive"], :scope[data-motion="expressive"]) { --re-liquid-motion: 1; --re-liquid-scale-x: 1.045; --re-liquid-scale-y: 1.02; }
  :where([data-contrast="more"], :scope[data-contrast="more"]) { --re-bm-opacity: 100%; --re-bm-filter: none; --re-bm-image: none; --re-bm-shadow: none; --re-bm-strength: 0; }
  :where([data-contrast="auto"], :scope[data-contrast="auto"]) { --re-bm-opacity: initial; --re-bm-filter: initial; --re-bm-image: initial; --re-bm-shadow: initial; --re-bm-strength: 1; }
}
@layer re.buttons {
  @scope ([data-button-material="solid"], [data-button-material="glass"], [data-button-material="veil"], [data-button-material="soft"], [data-button-material="liquid"], :scope[data-button-material="solid"], :scope[data-button-material="glass"], :scope[data-button-material="veil"], :scope[data-button-material="soft"], :scope[data-button-material="liquid"]) to (:scope [data-button-material]) {
    :where(:scope:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]) :is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top),:scope:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))) { --re-bm-fallback:initial; --re-bm-fallback-text:initial; background-color:var(--re-action-start); background-image:var(--re-bm-image,linear-gradient(to bottom,var(--re-action-start),color-mix(in srgb,var(--re-action-end) calc(var(--re-gradient) * 28%),var(--re-action-start)))); background-position:0% 0%; background-size:auto; background-repeat:no-repeat; color:var(--re-action-text); border-color:color-mix(in srgb,var(--re-action-text) 18%,transparent); box-shadow:var(--re-bm-shadow,var(--re-shadow)); -webkit-backdrop-filter:none; backdrop-filter:none; transition:filter var(--re-duration) ease,transform var(--re-duration) ease; }
    :where(:scope:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]) :is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top),:scope:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(.outline,.ghost) { background-color:transparent; background-image:none; color:var(--re-action-link,var(--re-link)); border-color:transparent; box-shadow:none; }
    :where(:scope:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]) :is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top),:scope:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(.danger):where(.outline,.ghost) { color:var(--re-action-link,var(--re-danger-link)); }
    :where(:scope:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]) :is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top),:scope:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(.secondary):where(.outline,.ghost) { color:var(--re-action-link,var(--re-secondary-link)); }
    :where(:scope:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]) :is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top),:scope:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(.outline) { border-color:currentColor; }
    :where(:scope:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]) :is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top),:scope:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(:active):where(:not(:disabled,[aria-disabled="true"])) { box-shadow:none; }
    :where(:scope:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]) :is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top),:scope:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(:disabled,[aria-disabled="true"]) { transform:none; scale:none; filter:none; cursor:not-allowed; }
  }
  @supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
  @scope ([data-button-material="glass"], :scope[data-button-material="glass"]) to (:scope [data-button-material]) {
    :where(:scope:is([data-button-material="glass"]) :is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top),:scope:is([data-button-material="glass"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(:not(.outline,.ghost)) { background-color:color-mix(in srgb,color-mix(in srgb,var(--re-action-start) 65%,var(--re-action-end)) var(--re-bm-opacity,var(--re-glass-button-opacity,90%)),transparent); background-image:var(--re-bm-image,linear-gradient(to bottom,transparent,color-mix(in srgb,var(--re-action-end) calc(var(--re-gradient) * 28%),transparent))); border-block-start-color:color-mix(in srgb,currentColor 32%,transparent); -webkit-backdrop-filter:var(--re-bm-filter,var(--re-glass-filter,blur(12px) saturate(145%))); backdrop-filter:var(--re-bm-filter,var(--re-glass-filter,blur(12px) saturate(145%))); }
  }
  }
  @scope ([data-button-material="veil"], :scope[data-button-material="veil"]) to (:scope [data-button-material]) {
    :where(:scope:is([data-button-material="veil"]) :is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top),:scope:is([data-button-material="veil"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(:not(.outline,.ghost)) { background-image:var(--re-bm-image,radial-gradient(ellipse at 0% 0%,color-mix(in srgb,var(--re-action-text) calc(var(--re-gradient) * var(--re-bm-strength,1) * 3%),transparent),transparent 65%),radial-gradient(ellipse at 100% 100%,color-mix(in srgb,var(--re-action-end) calc(var(--re-gradient) * var(--re-bm-strength,1) * 40%),transparent),transparent 70%)); background-size:120% 120%; background-position:0% 0%,100% 100%; box-shadow:var(--re-bm-shadow,inset 0 0 0 calc(var(--re-surface-border) * 2) color-mix(in srgb,var(--re-action-text) 14%,transparent),inset 0 0 0 calc(var(--re-surface-border) * 4) color-mix(in srgb,var(--re-action-start) 65%,transparent),var(--re-shadow)); transition:background-position var(--re-duration) ease,filter var(--re-duration) ease,transform var(--re-duration) ease; }
    :where(:scope:is([data-button-material="veil"]) :is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top),:scope:is([data-button-material="veil"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(:not(.outline,.ghost)):where(:hover,:focus-visible):where(:not(:disabled,[aria-disabled="true"])) { background-position:8% 8%,92% 92%; }
  }
  @scope ([data-button-material="soft"], :scope[data-button-material="soft"]) to (:scope [data-button-material]) {
    :where(:scope:is([data-button-material="soft"]) :is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top),:scope:is([data-button-material="soft"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(:not(.outline,.ghost)) { --re-bm-soft-offset:calc(var(--re-soft-distance,4px) * var(--re-bm-strength,1)); --re-bm-soft-blur:calc(var(--re-soft-blur,10px) * var(--re-bm-strength,1)); --re-bm-soft-light:light-dark(rgb(255 255 255 / 90%),rgb(255 255 255 / 7%)); --re-bm-soft-dark:light-dark(rgb(0 0 0 / 14%),rgb(0 0 0 / 45%)); box-shadow:var(--re-bm-shadow,calc(-1 * var(--re-bm-soft-offset)) calc(-1 * var(--re-bm-soft-offset)) var(--re-bm-soft-blur) var(--re-bm-soft-light),var(--re-bm-soft-offset) var(--re-bm-soft-offset) var(--re-bm-soft-blur) var(--re-bm-soft-dark)); }
    :where(:scope:is([data-button-material="soft"]) :is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top),:scope:is([data-button-material="soft"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(:not(.outline,.ghost)):where(.secondary):where(:not([data-variant="primary"],[data-variant="success"],[data-variant="warning"],[data-variant="danger"],[data-variant="neutral"])) { background-color:var(--re-bg); background-image:none; color:var(--re-text); }
    :where(:scope:is([data-button-material="soft"]) :is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top),:scope:is([data-button-material="soft"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(:not(.outline,.ghost)):where(:active,[aria-pressed="true"]):where(:not(:disabled,[aria-disabled="true"])) { box-shadow:var(--re-bm-shadow,inset calc(var(--re-bm-soft-offset) * .5) calc(var(--re-bm-soft-offset) * .5) calc(var(--re-bm-soft-blur) * .65) var(--re-bm-soft-dark),inset calc(var(--re-bm-soft-offset) * -.5) calc(var(--re-bm-soft-offset) * -.5) calc(var(--re-bm-soft-blur) * .65) var(--re-bm-soft-light)); }
  }
  @scope ([data-button-material="liquid"], :scope[data-button-material="liquid"]) to (:scope [data-button-material]) {
    :where(:scope:is([data-button-material="liquid"]) :is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top),:scope:is([data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))) { --re-bm-fallback:light-dark(#fff,#191919); --re-bm-fallback-text:var(--re-text); color:var(--re-text); --re-liquid-return-easing:cubic-bezier(.2,.9,.2,1.2); transition:var(--re-liquid-transition,scale calc(var(--re-duration) * 2) var(--re-liquid-return-easing),filter var(--re-duration) ease,box-shadow var(--re-duration) ease); }
    :where(:scope:is([data-button-material="liquid"]) :is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top),:scope:is([data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(:not(.outline,.ghost)) { background-color:var(--re-bm-fallback); background-image:var(--re-bm-image,radial-gradient(ellipse at 8% 0%,rgb(255 255 255 / calc(var(--re-gradient) * 24%)),transparent 65%)); border-color:color-mix(in srgb,light-dark(#111,#f5f5f5) 18%,transparent); border-block-start-color:light-dark(rgb(255 255 255 / 80%),rgb(255 255 255 / 38%)); border-block-end-color:rgb(0 0 0 / 16%); box-shadow:var(--re-bm-shadow,inset 0 var(--re-surface-border) 0 rgb(255 255 255 / 55%),inset 0 calc(-1 * var(--re-surface-border)) 0 rgb(0 0 0 / 12%),var(--re-shadow)); }
    @supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
    :where(:scope:is([data-button-material="liquid"]) :is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top),:scope:is([data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(:not(.outline,.ghost)) { background-color:color-mix(in srgb,light-dark(#fff,#191919) var(--re-bm-opacity,var(--re-liquid-opacity,12%)),transparent); -webkit-backdrop-filter:var(--re-bm-filter,blur(var(--re-liquid-blur,14px))); backdrop-filter:var(--re-bm-filter,blur(var(--re-liquid-blur,14px))); }
    }
    @supports (transition-timing-function:linear(0,1)) {
    :where(:scope:is([data-button-material="liquid"]) :is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top),:scope:is([data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))) { --re-liquid-return-easing:linear(0,.45,.85,1.08,1.03,1); }
    }
    :where(:scope:is([data-button-material="liquid"]) :is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top),:scope:is([data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(:active):where(:not(:disabled,[aria-disabled="true"])) { transform:none; scale:var(--re-liquid-active-scale,calc(1 + (var(--re-liquid-scale-x,1.025) - 1) * var(--re-liquid-motion,1)) calc(1 + (var(--re-liquid-scale-y,1.015) - 1) * var(--re-liquid-motion,1))); transition-duration:var(--re-duration),var(--re-duration),var(--re-duration); transition-timing-function:ease-out; }
    :where(:scope:is([data-button-material="liquid"]) :is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top),:scope:is([data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(:not(.outline,.ghost)):where(:active):where(:not(:disabled,[aria-disabled="true"])) { box-shadow:var(--re-bm-shadow,inset 0 var(--re-surface-border) 0 rgb(255 255 255 / 80%),inset 0 calc(-1 * var(--re-surface-border)) 0 rgb(0 0 0 / 12%),var(--re-shadow)); }
  }
}
@layer re.utilities {
  @scope ([data-button-material="solid"], [data-button-material="glass"], [data-button-material="veil"], [data-button-material="soft"], [data-button-material="liquid"], :scope[data-button-material="solid"], :scope[data-button-material="glass"], :scope[data-button-material="veil"], :scope[data-button-material="soft"], :scope[data-button-material="liquid"]) to (:scope [data-button-material]) {
    @media (prefers-reduced-transparency:reduce), (prefers-contrast:more) {
    :where(:scope:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]) :is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top),:scope:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))) { -webkit-backdrop-filter:none; backdrop-filter:none; box-shadow:none; }
    :where(:scope:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]) :is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top),:scope:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(:not(.outline,.ghost)) { background-color:var(--re-bm-fallback,var(--re-action-start)); color:var(--re-bm-fallback-text,var(--re-action-text)); background-image:none; }
    :where(:scope:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]) :is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top),:scope:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(:not(.outline,.ghost)):where(.secondary):where(:not([data-variant="primary"],[data-variant="success"],[data-variant="warning"],[data-variant="danger"],[data-variant="neutral"])) { background-color:var(--re-bm-fallback,var(--re-secondary)); color:var(--re-bm-fallback-text,var(--re-on-secondary)); }
    }
    @media (prefers-reduced-motion:reduce), (forced-colors:active), print {
    :where(:scope:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]) :is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top),:scope:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))) { scale:none; transform:none; transition:none; }
    }
    @media (forced-colors:active) {
    :where(:scope:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]) :is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top),:scope:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))) { background:ButtonFace; color:ButtonText; border:1px solid ButtonText; box-shadow:none; -webkit-backdrop-filter:none; backdrop-filter:none; }
    }
    @media print {
    :where(:scope:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]) :is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top),:scope:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))) { background:#fff; color:#000; border:1px solid #000; box-shadow:none; -webkit-backdrop-filter:none; backdrop-filter:none; }
    }
  }
}

/* Direct action roots also receive the same paint. This avoids Firefox
   losing local scope-root matches inside a differently configured material.
   Scoped distributions retain their outer .reva boundary. */
@layer re.buttons { :where(:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))) { --re-bm-fallback:initial; --re-bm-fallback-text:initial; background-color:var(--re-action-start); background-image:var(--re-bm-image,linear-gradient(to bottom,var(--re-action-start),color-mix(in srgb,var(--re-action-end) calc(var(--re-gradient) * 28%),var(--re-action-start)))); background-position:0% 0%; background-size:auto; background-repeat:no-repeat; color:var(--re-action-text); border-color:color-mix(in srgb,var(--re-action-text) 18%,transparent); box-shadow:var(--re-bm-shadow,var(--re-shadow)); -webkit-backdrop-filter:none; backdrop-filter:none; transition:filter var(--re-duration) ease,transform var(--re-duration) ease; } }
@layer re.buttons { :where(:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(.outline,.ghost) { background-color:transparent; background-image:none; color:var(--re-action-link,var(--re-link)); border-color:transparent; box-shadow:none; } }
@layer re.buttons { :where(:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(.danger):where(.outline,.ghost) { color:var(--re-action-link,var(--re-danger-link)); } }
@layer re.buttons { :where(:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(.secondary):where(.outline,.ghost) { color:var(--re-action-link,var(--re-secondary-link)); } }
@layer re.buttons { :where(:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(.outline) { border-color:currentColor; } }
@layer re.buttons { :where(:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(:active):where(:not(:disabled,[aria-disabled="true"])) { box-shadow:none; } }
@layer re.buttons { :where(:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(:disabled,[aria-disabled="true"]) { transform:none; scale:none; filter:none; cursor:not-allowed; } }
@layer re.buttons { @supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) { :where(:is([data-button-material="glass"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(:not(.outline,.ghost)) { background-color:color-mix(in srgb,color-mix(in srgb,var(--re-action-start) 65%,var(--re-action-end)) var(--re-bm-opacity,var(--re-glass-button-opacity,90%)),transparent); background-image:var(--re-bm-image,linear-gradient(to bottom,transparent,color-mix(in srgb,var(--re-action-end) calc(var(--re-gradient) * 28%),transparent))); border-block-start-color:color-mix(in srgb,currentColor 32%,transparent); -webkit-backdrop-filter:var(--re-bm-filter,var(--re-glass-filter,blur(12px) saturate(145%))); backdrop-filter:var(--re-bm-filter,var(--re-glass-filter,blur(12px) saturate(145%))); } }}
@layer re.buttons { :where(:is([data-button-material="veil"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(:not(.outline,.ghost)) { background-image:var(--re-bm-image,radial-gradient(ellipse at 0% 0%,color-mix(in srgb,var(--re-action-text) calc(var(--re-gradient) * var(--re-bm-strength,1) * 3%),transparent),transparent 65%),radial-gradient(ellipse at 100% 100%,color-mix(in srgb,var(--re-action-end) calc(var(--re-gradient) * var(--re-bm-strength,1) * 40%),transparent),transparent 70%)); background-size:120% 120%; background-position:0% 0%,100% 100%; box-shadow:var(--re-bm-shadow,inset 0 0 0 calc(var(--re-surface-border) * 2) color-mix(in srgb,var(--re-action-text) 14%,transparent),inset 0 0 0 calc(var(--re-surface-border) * 4) color-mix(in srgb,var(--re-action-start) 65%,transparent),var(--re-shadow)); transition:background-position var(--re-duration) ease,filter var(--re-duration) ease,transform var(--re-duration) ease; } }
@layer re.buttons { :where(:is([data-button-material="veil"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(:not(.outline,.ghost)):where(:hover,:focus-visible):where(:not(:disabled,[aria-disabled="true"])) { background-position:8% 8%,92% 92%; } }
@layer re.buttons { :where(:is([data-button-material="soft"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(:not(.outline,.ghost)) { --re-bm-soft-offset:calc(var(--re-soft-distance,4px) * var(--re-bm-strength,1)); --re-bm-soft-blur:calc(var(--re-soft-blur,10px) * var(--re-bm-strength,1)); --re-bm-soft-light:light-dark(rgb(255 255 255 / 90%),rgb(255 255 255 / 7%)); --re-bm-soft-dark:light-dark(rgb(0 0 0 / 14%),rgb(0 0 0 / 45%)); box-shadow:var(--re-bm-shadow,calc(-1 * var(--re-bm-soft-offset)) calc(-1 * var(--re-bm-soft-offset)) var(--re-bm-soft-blur) var(--re-bm-soft-light),var(--re-bm-soft-offset) var(--re-bm-soft-offset) var(--re-bm-soft-blur) var(--re-bm-soft-dark)); } }
@layer re.buttons { :where(:is([data-button-material="soft"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(:not(.outline,.ghost)):where(.secondary):where(:not([data-variant="primary"],[data-variant="success"],[data-variant="warning"],[data-variant="danger"],[data-variant="neutral"])) { background-color:var(--re-bg); background-image:none; color:var(--re-text); } }
@layer re.buttons { :where(:is([data-button-material="soft"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(:not(.outline,.ghost)):where(:active,[aria-pressed="true"]):where(:not(:disabled,[aria-disabled="true"])) { box-shadow:var(--re-bm-shadow,inset calc(var(--re-bm-soft-offset) * .5) calc(var(--re-bm-soft-offset) * .5) calc(var(--re-bm-soft-blur) * .65) var(--re-bm-soft-dark),inset calc(var(--re-bm-soft-offset) * -.5) calc(var(--re-bm-soft-offset) * -.5) calc(var(--re-bm-soft-blur) * .65) var(--re-bm-soft-light)); } }
@layer re.buttons { :where(:is([data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))) { --re-bm-fallback:light-dark(#fff,#191919); --re-bm-fallback-text:var(--re-text); color:var(--re-text); --re-liquid-return-easing:cubic-bezier(.2,.9,.2,1.2); transition:var(--re-liquid-transition,scale calc(var(--re-duration) * 2) var(--re-liquid-return-easing),filter var(--re-duration) ease,box-shadow var(--re-duration) ease); } }
@layer re.buttons { :where(:is([data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(:not(.outline,.ghost)) { background-color:var(--re-bm-fallback); background-image:var(--re-bm-image,radial-gradient(ellipse at 8% 0%,rgb(255 255 255 / calc(var(--re-gradient) * 24%)),transparent 65%)); border-color:color-mix(in srgb,light-dark(#111,#f5f5f5) 18%,transparent); border-block-start-color:light-dark(rgb(255 255 255 / 80%),rgb(255 255 255 / 38%)); border-block-end-color:rgb(0 0 0 / 16%); box-shadow:var(--re-bm-shadow,inset 0 var(--re-surface-border) 0 rgb(255 255 255 / 55%),inset 0 calc(-1 * var(--re-surface-border)) 0 rgb(0 0 0 / 12%),var(--re-shadow)); } }
@layer re.buttons { @supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) { :where(:is([data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(:not(.outline,.ghost)) { background-color:color-mix(in srgb,light-dark(#fff,#191919) var(--re-bm-opacity,var(--re-liquid-opacity,12%)),transparent); -webkit-backdrop-filter:var(--re-bm-filter,blur(var(--re-liquid-blur,14px))); backdrop-filter:var(--re-bm-filter,blur(var(--re-liquid-blur,14px))); } }}
@layer re.buttons { @supports (transition-timing-function:linear(0,1)) { :where(:is([data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))) { --re-liquid-return-easing:linear(0,.45,.85,1.08,1.03,1); } }}
@layer re.buttons { :where(:is([data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(:active):where(:not(:disabled,[aria-disabled="true"])) { transform:none; scale:var(--re-liquid-active-scale,calc(1 + (var(--re-liquid-scale-x,1.025) - 1) * var(--re-liquid-motion,1)) calc(1 + (var(--re-liquid-scale-y,1.015) - 1) * var(--re-liquid-motion,1))); transition-duration:var(--re-duration),var(--re-duration),var(--re-duration); transition-timing-function:ease-out; } }
@layer re.buttons { :where(:is([data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(:not(.outline,.ghost)):where(:active):where(:not(:disabled,[aria-disabled="true"])) { box-shadow:var(--re-bm-shadow,inset 0 var(--re-surface-border) 0 rgb(255 255 255 / 80%),inset 0 calc(-1 * var(--re-surface-border)) 0 rgb(0 0 0 / 12%),var(--re-shadow)); } }
@layer re.utilities { @media (prefers-reduced-transparency:reduce), (prefers-contrast:more) { :where(:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))) { -webkit-backdrop-filter:none; backdrop-filter:none; box-shadow:none; } }}
@layer re.utilities { @media (prefers-reduced-transparency:reduce), (prefers-contrast:more) { :where(:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(:not(.outline,.ghost)) { background-color:var(--re-bm-fallback,var(--re-action-start)); color:var(--re-bm-fallback-text,var(--re-action-text)); background-image:none; } }}
@layer re.utilities { @media (prefers-reduced-transparency:reduce), (prefers-contrast:more) { :where(:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))):where(:not(.outline,.ghost)):where(.secondary):where(:not([data-variant="primary"],[data-variant="success"],[data-variant="warning"],[data-variant="danger"],[data-variant="neutral"])) { background-color:var(--re-bm-fallback,var(--re-secondary)); color:var(--re-bm-fallback-text,var(--re-on-secondary)); } }}
@layer re.utilities { @media (prefers-reduced-motion:reduce), (forced-colors:active), print { :where(:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))) { scale:none; transform:none; transition:none; } }}
@layer re.utilities { @media (forced-colors:active) { :where(:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))) { background:ButtonFace; color:ButtonText; border:1px solid ButtonText; box-shadow:none; -webkit-backdrop-filter:none; backdrop-filter:none; } }}
@layer re.utilities { @media print { :where(:is([data-button-material="solid"],[data-button-material="glass"],[data-button-material="veil"],[data-button-material="soft"],[data-button-material="liquid"]):is(button,input:is([type=button],[type=submit],[type=reset]),.button,.scroll-top)):where(:not(.menu-toggle,.dropdown > li > :is(button,.button,.scroll-top))) { background:#fff; color:#000; border:1px solid #000; box-shadow:none; -webkit-backdrop-filter:none; backdrop-filter:none; } }}

/* Inherited preference guards also cover live OS changes in engines that cache
   nested @scope/media matches. Local auto/expressive choices cannot bypass them. */
@layer re.utilities {
  @media (prefers-reduced-transparency:reduce), (prefers-contrast:more), (forced-colors:active), print {
    :where(:root,:scope,[data-button-material],[data-contrast]) { --re-bm-opacity:100%; --re-bm-filter:none; --re-bm-image:none; --re-bm-shadow:none; --re-bm-strength:0; }
  }
  @media (prefers-reduced-motion:reduce), (forced-colors:active), print {
    :where(:root,:scope,[data-button-material],[data-motion]) { --re-liquid-active-scale:none; --re-liquid-transition:none; }
  }
}