:root {
  --accent: #f4f4f5 !important;
  --accent-soft: rgba(255,255,255,.075) !important;
  --violet: #f4f4f5 !important;
}
.ui-icon {
  width: 1em;
  height: 1em;
  display: inline-block;
  flex: 0 0 1em;
  color: inherit;
  background: currentColor;
  -webkit-mask: var(--ui-icon) center / contain no-repeat;
  mask: var(--ui-icon) center / contain no-repeat;
}
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
button, a { touch-action: manipulation; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid #fff !important; outline-offset: 3px; }
@media (hover:hover) { button, a { transition-duration: 180ms !important; } }
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; scroll-behavior:auto !important; transition-duration:.01ms !important; } }

.brand img, .mobile-brand img { width: 22px; height: 22px; margin-right: 8px; vertical-align: -5px; color: #fff; }
.brand span, .mobile-brand span { color: #777 !important; }
body:has(.app-shell) { background: radial-gradient(900px 520px at 86% -16%, rgba(255,255,255,.055), transparent 68%), #060607 !important; }
.nav-link:hover, .nav-link.active, .account-link:hover { background: rgba(255,255,255,.065) !important; }
.nav-link.active::before { background: #fff !important; box-shadow: none !important; }
.avatar, .avatar-button { color: #fff !important; background: #18181b !important; border-color: rgba(255,255,255,.14) !important; }
.solid-button { color: #080809 !important; background: #f4f4f5 !important; border-color: #fff !important; box-shadow: none !important; }
.solid-button:hover { background: #fff !important; transform: translateY(-1px); }
.home-command { background: radial-gradient(600px 300px at 100% 110%,rgba(255,255,255,.07),transparent 70%),#0b0b0d !important; border-color: rgba(255,255,255,.1) !important; }
.kicker { color: #8f8f97 !important; }
