/* Shared interaction states for static and dynamically inserted controls. */
:where(
    button:not(.orbit-core),
    a.button,
    a.nav-cta,
    a.return-link,
    select,
    summary,
    [role='button']
  ):not(:disabled):not([aria-disabled='true']) {
  transition:
    color 160ms ease,
    text-decoration-color 160ms ease,
    background-color 160ms ease,
    border-color 160ms ease,
    box-shadow 160ms ease,
    translate 180ms ease,
    scale 180ms ease;
}
:where(a[href]:not(.button):not(.nav-cta):not(.return-link):not(.brand)) {
  transition: color 160ms ease;
}
:where(a[href], button, summary, canvas, [role='button']):focus-visible {
  outline: 2px solid var(--cyan, #8be9fd);
  outline-offset: 4px;
}
/* Keep field focus on the existing edge instead of drawing a detached second frame. */
:is(input, textarea):focus {
  outline: none;
  outline-offset: 0;
  border-color: var(--purple, #bd93f9);
  box-shadow: inset 0 0 0 1px var(--purple, #bd93f9);
}
:is(input, textarea):focus-visible {
  border-color: var(--cyan, #8be9fd);
  box-shadow: inset 0 0 0 1px var(--cyan, #8be9fd);
}
/* Native selects may keep :focus-visible after a mouse selection. Keep actual focus, but show its ring only for keyboard input. */
select:focus {
  outline: none;
  outline-offset: 0;
}
:root:not([data-input-method='pointer']) select:focus-visible {
  border-color: var(--cyan, #8be9fd);
  box-shadow: inset 0 0 0 1px var(--cyan, #8be9fd);
}
@media (hover: hover) and (pointer: fine) {
  :where(button:not(.orbit-core), a.button, a.nav-cta, a.return-link, [role='button']):not(
      :disabled
    ):not([aria-disabled='true']):hover {
    color: var(--fg, #f8f8f2);
    border-color: #bd93f980;
    translate: 0 -1px;
  }
  :where(a[href]:not(.button):not(.nav-cta):not(.return-link):not(.brand), summary, select):not(
      :disabled
    ):not([aria-disabled='true']):hover {
    color: var(--fg, #f8f8f2);
    border-color: #bd93f980;
  }
  .button:not(:disabled):not([aria-disabled='true']):hover {
    scale: 1.015;
    box-shadow: 0 5px 18px #bd93f91a;
  }
  .button.primary:not(:disabled):not([aria-disabled='true']):hover {
    background-color: var(--primary-hover-bg, var(--pink, #ff79c6));
    color: var(--primary-hover-fg, #181322);
  }
  .agro-panel .button:not(:disabled):not([aria-disabled='true']):hover {
    background-color: #72fa95;
    color: #10111b;
  }
  :is(.tabs, .showcase-nav, .agro-demo-tabs) button:not(:disabled):hover,
  .lab-language-option:not(:disabled):hover {
    translate: none;
    background-color: #bd93f914;
  }
  summary:hover {
    color: var(--fg, #f8f8f2);
  }
  .brand-preview-header a[download]:hover {
    color: var(--purple, #bd93f9);
  }
  :is(.nav-cta, .return-link):not([aria-disabled='true']):hover {
    scale: 1.025;
    color: var(--fg, #f8f8f2);
  }
  .nav-cta:not([aria-disabled='true']):hover {
    background-color: #bd93f914;
    border-color: var(--purple, #bd93f9);
    box-shadow: 0 4px 16px #bd93f91a;
  }
  .return-link:hover {
    text-decoration-color: var(--purple, #bd93f9);
  }
  .language-selector:not(:disabled):hover {
    background-color: #bd93f914;
    border-color: var(--purple, #bd93f9);
  }
  .brand:hover {
    filter: brightness(1.07) drop-shadow(0 0 5px #bd93f92b);
  }
  .nysa-launcher[aria-expanded='true']:hover {
    border-color: #79dfc3b3;
  }
}
.button:not(:disabled):not([aria-disabled='true']):active,
:is(.nav-cta, .return-link):not([aria-disabled='true']):active,
:where(button:not(.orbit-core), a.button, a.nav-cta, a.return-link, [role='button']):not(
    :disabled
  ):not([aria-disabled='true']):active {
  translate: none;
  scale: 0.985;
}
:where(button, select, [role='button'], a.button, a.nav-cta, a.return-link):is(
  :disabled,
  [aria-disabled='true']
) {
  cursor: not-allowed;
  translate: none;
  scale: none;
}

.return-link {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  text-decoration: underline;
  text-decoration-color: transparent;
  text-underline-offset: 5px;
}
/* Light the complete lockup without resampling or shifting either logo. */
.brand {
  filter: brightness(1) drop-shadow(0 0 5px #bd93f900);
  transition: filter 280ms ease;
}
.brand:focus-visible {
  filter: brightness(1.07) drop-shadow(0 0 5px #bd93f92b);
}

/* Model feedback changes presentation, leaving renderer geometry and drag coordinates intact. */
.orbital-art .orbit-core :is(.logo-model, img) {
  transition:
    scale 220ms ease,
    filter 220ms ease;
  filter: brightness(1) drop-shadow(0 0 12px #bd93f900);
}
#asteroid {
  transition: filter 220ms ease;
  filter: brightness(1);
}
.asteroid-panel {
  transition:
    border-color 220ms ease,
    box-shadow 220ms ease;
}
.model-controls > span,
.atom-hint {
  transition: color 180ms ease;
}
@media (hover: hover) and (pointer: fine) {
  .orbital-art .orbit-core:hover :is(.logo-model, img) {
    scale: 1.035;
    filter: brightness(1) drop-shadow(0 0 8px #bd93f91f);
  }
  #asteroid:hover {
    filter: brightness(1.08);
  }
  .asteroid-panel:hover {
    border-color: #8be9fd66;
    box-shadow: 0 0 24px #8be9fd0c;
  }
  #asteroid:hover + .model-controls > span {
    color: var(--cyan);
  }
  .orbital-art:has(.orbit-core:hover) + .logo-controls .atom-hint {
    color: var(--cyan);
  }
}
.orbital-art .orbit-core:focus-visible :is(.logo-model, img) {
  scale: 1.035;
  filter: brightness(1) drop-shadow(0 0 8px #bd93f91f);
}
#asteroid:focus-visible {
  filter: brightness(1.08);
}
.asteroid-panel:focus-within {
  border-color: #8be9fd66;
  box-shadow: 0 0 24px #8be9fd0c;
}
.orbital-art .orbit-core:active :is(.logo-model, img) {
  scale: 1.015;
  filter: brightness(1.02) drop-shadow(0 0 8px #bd93f91f);
}
#asteroid:active {
  filter: brightness(1.1);
}
@media (prefers-reduced-motion: reduce) {
  :where(button, a[href], select, summary, [role='button']),
  .brand,
  .orbital-art .orbit-core :is(.logo-model, img),
  #asteroid,
  .asteroid-panel,
  .model-controls > span,
  .atom-hint {
    transition: none !important;
    translate: none !important;
    scale: none !important;
  }
}