html.gb { --gb-fg:#15161C;--gb-tint:rgba(255,255,255,.10);--gb-tint2:rgba(255,255,255,.15);--gb-edge:rgba(21,22,28,.35);--gb-edge2:rgba(21,22,28,.6);--gb-halo:0 0 6px rgba(255,255,255,.9) }
html.gb .gb-on-dark { --gb-fg:#F2ECE0;--gb-tint:rgba(242,236,224,.05);--gb-tint2:rgba(242,236,224,.10);--gb-edge:rgba(242,236,224,.35);--gb-edge2:rgba(242,236,224,.6);--gb-halo:0 0 6px rgba(5,6,12,.85) }
html.gb .gb-on-light { --gb-fg:#15161C;--gb-tint:rgba(255,255,255,.10);--gb-tint2:rgba(255,255,255,.15);--gb-edge:rgba(21,22,28,.35);--gb-edge2:rgba(21,22,28,.6);--gb-halo:0 0 6px rgba(255,255,255,.9) }
html.gb .gb-on-mid { --gb-fg:#15161C;--gb-tint:rgba(255,255,255,.10);--gb-tint2:rgba(255,255,255,.15);--gb-edge:rgba(21,22,28,.35);--gb-edge2:rgba(21,22,28,.6);--gb-halo:0 0 6px rgba(255,255,255,.9);--gb-fg:#000 }
/* === Glass buttons (3 Nov 2026, Damien): clear centre, translucent iridescent rim. Rollout copy of asit-moth-v2/public/css/cosmos.css === */
@property --iri { syntax: '<angle>'; inherits: false; initial-value: 0deg; }
:where(html.gb) :where(button:not([data-glass-skip]), input[type=submit], input[type=button], a[role=button], .btn, .button, a.btn, a.button, [class*="btn"]:not(svg *):not(:has(a, button, input)):not(body):not(html), [class*="-cta"]:not(:has(a, button, input)):not(section):not(div)) { position: relative; }
html.gb :is(button:not([data-glass-skip]), input[type=submit], input[type=button], a[role=button], .btn, .button, a.btn, a.button, [class*="btn"]:not(svg *):not(:has(a, button, input)):not(body):not(html), [class*="-cta"]:not(:has(a, button, input)):not(section):not(div)) {
  isolation: isolate;
  background: var(--gb-tint) !important; background-image: none !important;
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  color: var(--gb-fg) !important; -webkit-text-fill-color: var(--gb-fg) !important;
  border: 1.5px solid var(--gb-edge) !important;
  text-shadow: var(--gb-halo);
  box-shadow: inset 0 0 14px rgba(143,216,255,.10), 0 0 18px rgba(201,182,255,.14) !important;
  transition: box-shadow .25s, background-color .25s, border-color .25s;
}
html.gb :is(button:not([data-glass-skip]), input[type=submit], input[type=button], a[role=button], .btn, .button, a.btn, a.button, [class*="btn"]:not(svg *):not(:has(a, button, input)):not(body):not(html), [class*="-cta"]:not(:has(a, button, input)):not(section):not(div)) :is(svg, svg *) { color: var(--gb-fg); }
html.gb :is(button:not([data-glass-skip]), input[type=submit], input[type=button], a[role=button], .btn, .button, a.btn, a.button, [class*="btn"]:not(svg *):not(:has(a, button, input)):not(body):not(html), [class*="-cta"]:not(:has(a, button, input)):not(section):not(div))::before {
  content: "" !important; position: absolute !important; inset: -1.5px !important; border-radius: inherit; padding: 3px; pointer-events: none; z-index: -1;
  display: block !important; width: auto !important; height: auto !important; transform: none !important;
  background: conic-gradient(from var(--iri), #8fd8ff, #c9b6ff, #ffb6e1, #ffe9a8, #a8ffd8, #8fd8ff) !important;
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  opacity: .75; animation: gb-iri 6s linear infinite !important;
}
html.gb :is(input[type=submit], input[type=button]) { border-image: conic-gradient(from var(--iri), #8fd8ff, #c9b6ff, #ffb6e1, #ffe9a8, #a8ffd8, #8fd8ff) 1 !important; animation: gb-iri 6s linear infinite; }
html.gb :is(button:not([data-glass-skip]), input[type=submit], input[type=button], a[role=button], .btn, .button, a.btn, a.button, [class*="btn"]:not(svg *):not(:has(a, button, input)):not(body):not(html), [class*="-cta"]:not(:has(a, button, input)):not(section):not(div)):hover { background-color: var(--gb-tint2) !important; border-color: var(--gb-edge2) !important; box-shadow: inset 0 0 18px rgba(201,182,255,.18), 0 0 26px rgba(143,216,255,.28) !important; }
html.gb :is(button:not([data-glass-skip]), input[type=submit], input[type=button], a[role=button], .btn, .button, a.btn, a.button, [class*="btn"]:not(svg *):not(:has(a, button, input)):not(body):not(html), [class*="-cta"]:not(:has(a, button, input)):not(section):not(div)):hover::before { opacity: 1; }
html.gb :is(button:not([data-glass-skip]), input[type=submit], input[type=button], a[role=button], .btn, .button, a.btn, a.button, [class*="btn"]:not(svg *):not(:has(a, button, input)):not(body):not(html), [class*="-cta"]:not(:has(a, button, input)):not(section):not(div)):focus-visible { outline: 2px solid var(--gb-fg) !important; outline-offset: 4px; }
html.gb :is(button:not([data-glass-skip]), input[type=submit], input[type=button], a[role=button], .btn, .button, a.btn, a.button, [class*="btn"]:not(svg *):not(:has(a, button, input)):not(body):not(html), [class*="-cta"]:not(:has(a, button, input)):not(section):not(div)):disabled { opacity: .45; cursor: not-allowed; }
html.gb :is(button:not([data-glass-skip]), input[type=submit], input[type=button], a[role=button], .btn, .button, a.btn, a.button, [class*="btn"]:not(svg *):not(:has(a, button, input)):not(body):not(html), [class*="-cta"]:not(:has(a, button, input)):not(section):not(div)):disabled::before { animation: none !important; filter: grayscale(1); }
@keyframes gb-iri { to { --iri: 360deg; } }
@media (prefers-reduced-motion: reduce) {
  html.gb :is(button:not([data-glass-skip]), input[type=submit], input[type=button], a[role=button], .btn, .button, a.btn, a.button, [class*="btn"]:not(svg *):not(:has(a, button, input)):not(body):not(html), [class*="-cta"]:not(:has(a, button, input)):not(section):not(div))::before, html.gb :is(input[type=submit], input[type=button]) { animation: none !important; }
}
/* no-overlap: let button rows wrap instead of stacking */
html.gb :has(> :is(button:not([data-glass-skip]), input[type=submit], input[type=button], a[role=button], .btn, .button, a.btn, a.button, [class*="btn"]:not(svg *):not(:has(a, button, input)):not(body):not(html), [class*="-cta"]:not(:has(a, button, input)):not(section):not(div)) + :is(button:not([data-glass-skip]), input[type=submit], input[type=button], a[role=button], .btn, .button, a.btn, a.button, [class*="btn"]:not(svg *):not(:has(a, button, input)):not(body):not(html), [class*="-cta"]:not(:has(a, button, input)):not(section):not(div))) { flex-wrap: wrap; gap: max(.5rem, 0px); }
/* === end glass buttons === */