/* Shared Slurx visual primitives. Canonical source; mirrored to desktop assets. */
:root {
  --sx-ink: #070b14;
  --sx-surface: #101827;
  --sx-raised: #172236;
  --sx-text: #edf2f8;
  --sx-muted: #aab8cd;
  --sx-silver: #c5d6ed;
  --sx-gold: #e9d3a1;
  --sx-focus: #b4caff;
  --sx-line: #c5d6ed26;
  --sx-radius: 18px;
  --sx-fast: 160ms;
  --sx-time: 280ms;
  --sx-enter: 440ms;
  --sx-ease: cubic-bezier(.22,1,.36,1);
  --sx-scroll: #52617a;
  --sx-scroll-hover: #8598b6;
}
html { scrollbar-color: var(--sx-scroll) var(--sx-ink); scrollbar-width: thin; }
* { scrollbar-color: var(--sx-scroll) transparent; scrollbar-width: thin; }
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: var(--sx-scroll); border: 2px solid var(--sx-ink); border-radius: 8px; }
::-webkit-scrollbar-thumb:hover { background: var(--sx-scroll-hover); }
::-webkit-scrollbar-track { background: transparent; }
:is(button,a,input,select,textarea,summary,[tabindex]):focus-visible { outline: 2px solid var(--sx-focus); outline-offset: 4px; }
:is(button,a,summary) { -webkit-tap-highlight-color: transparent; }
:is(button,a):not(:disabled):not([aria-disabled="true"]) { cursor: pointer; }
:is(button,input,textarea,select) { transition: background-color var(--sx-fast), border-color var(--sx-fast), box-shadow var(--sx-fast), color var(--sx-fast); }
button:disabled,[aria-disabled="true"] { cursor: not-allowed; }
.sx-tabs { position: relative; isolation: isolate; }
.sx-tabs > :is(button,a) { position: relative; z-index: 1; }
.sx-tabs .sx-tab-track { position: absolute; z-index: 0; left: 0; top: 0; pointer-events: none; border-radius: inherit; background: linear-gradient(125deg,#c5d6ed25,#c5d6ed0d); border: 1px solid #c5d6ed38; box-shadow: inset 0 1px #ffffff0b,0 3px 12px #0002; transition: translate var(--sx-time) var(--sx-ease),width var(--sx-time) var(--sx-ease),height var(--sx-time) var(--sx-ease),opacity var(--sx-fast); }
.sx-tabs > :is(button,a).sx-tab-current { background-color: transparent!important; background-image: none!important; box-shadow: none!important; border-color: transparent!important; }
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: sx-page-out 140ms ease both; }
::view-transition-new(root) { animation: sx-page-in 280ms var(--sx-ease) both; }
@keyframes sx-page-out { to { opacity: 0; } }
@keyframes sx-page-in { from { opacity: 0; translate: 0 5px; } to { opacity: 1; translate: 0 0; } }
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after { scroll-behavior: auto!important; }
  .sx-tabs .sx-tab-track { transition: none!important; }
  ::view-transition-old(root),::view-transition-new(root) { animation: none!important; }
}
.no-effects .sx-tab-track { transition: none!important; }
@media(forced-colors:active) {
  * { scrollbar-color: auto; }
  .sx-tab-track { border: 2px solid Highlight!important; background: Canvas!important; }
  :focus-visible { outline-color: Highlight; }
}

html.no-effects::view-transition-old(root),html.no-effects::view-transition-new(root) { animation: none!important; }