/* One button material across workspaces. Selected/danger states keep their colors. */
button.crystal-control {
  isolation: isolate;
  transition: border-color 160ms ease, box-shadow 160ms ease, background-color 160ms ease;
}
button.crystal-relative { position: relative; }
.crystal-control .control-luster {
  position: absolute; inset: 0; padding: 1px; border-radius: inherit;
  overflow: hidden; pointer-events: none; opacity: 0;
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  transition: opacity 180ms ease;
}
.control-luster::before {
  content: ""; position: absolute; inset: -100%;
  background: conic-gradient(from 225deg, transparent 0 65%, rgba(151,229,255,.8) 78%, rgba(222,170,255,.75) 85%, transparent 95%);
  animation: controlOrbit 8s linear infinite; animation-play-state: paused;
}
.portal.crystal-control, .preview-primary.crystal-control,
.collection-primary.crystal-control, .sheet-actions .primary.crystal-control,
.intake-button.crystal-control, #loginSubmit.crystal-control {
  background-image: linear-gradient(145deg, rgba(136,197,255,.17), rgba(110,106,211,.12) 45%, rgba(164,107,214,.17));
  background-color: rgba(14,21,50,.7);
  border: 1px solid rgba(190,215,255,.45); color: #f5f8ff;
  box-shadow: inset 0 1px 0 rgba(243,250,255,.3), inset 0 -7px 10px rgba(185,166,255,.08), 0 8px 24px rgba(3,7,24,.25);
}
.facetmenu.crystal-control, .preview-action.crystal-control,
.collection-toggle.crystal-control, .chat-starter-chip.crystal-control,
.roster-find-btn.crystal-control, .show-more.crystal-control {
  background-image: none; background-color: rgba(120,155,214,.07);
  border-color: rgba(193,215,255,.22);
  box-shadow: inset 0 1px 0 rgba(229,242,255,.1);
}
.crystal-control:focus-visible { outline: 2px solid #c3edff; outline-offset: 4px; }
.crystal-control:focus-visible .control-luster { opacity: 1; }
.crystal-control:disabled { cursor: not-allowed; opacity: .45; }
.crystal-control:disabled .control-luster { opacity: 0; }
@media (hover: hover) and (pointer: fine) {
  .crystal-control:not(:disabled):hover { border-color: rgba(216,238,255,.7); box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 0 18px rgba(138,166,255,.16); }
  .crystal-control:not(:disabled):hover .control-luster { opacity: 1; }
  .crystal-control:not(:disabled):hover .control-luster::before { animation-play-state: running; }
}
@keyframes controlOrbit { to { transform: rotate(360deg); } }
.app.space-resting .control-luster::before { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) { .control-luster::before { animation: none; } }