/* Free tools and Academy tools: icon orbit, 3D cards, upload glow
   (pairs with tools-fx.js; founder 2026-10-09). */
.tlx-host { position: relative; isolation: isolate; }
.tlx-orbit { position: absolute; left: 50%; top: 50%; width: 0; height: 0; z-index: -1; pointer-events: none; }
.tlx-orbit.tlx-wide { left: 83%; z-index: 0; }
.tlx-host > :not(.tlx-orbit) { position: relative; z-index: 1; }
.tlx-core { position: absolute; left: 0; top: 0; width: 70px; height: 70px; margin: -35px 0 0 -35px; border-radius: 50% !important; z-index: 5;
  background: radial-gradient(circle at 38% 35%, #fff 0, #9fd0ff 14%, #1f7bff 45%, rgba(139, 92, 246, .45) 70%, transparent 72%); box-shadow: 0 0 50px rgba(56, 182, 255, .55); }
html.sfx-on .tlx-core { animation: tlx-core 3.6s ease-in-out infinite; }
@keyframes tlx-core { 50% { transform: scale(1.1); box-shadow: 0 0 70px rgba(139, 92, 246, .6); } }
.tlx-orbit:not(.tlx-wide) .tlx-core { opacity: .22; }
.tlx-orbit:not(.tlx-wide) .tlx-icon { opacity: .22 !important; }
.tlx-icon { position: absolute; left: 0; top: 0; display: grid; place-items: center; width: 46px; height: 46px; color: #9fd0ff; will-change: transform, opacity;
  border: 1px solid rgba(120, 180, 255, .35); background: linear-gradient(150deg, rgba(31, 123, 255, .28), rgba(139, 92, 246, .18)); box-shadow: 0 10px 26px -12px rgba(56, 182, 255, .7);
  transform: translate(-50%, -50%); }
.tlx-icon .sfx-ic { width: 22px; height: 22px; }
.tlx-icon:nth-child(3n+2) { color: #c4b5fd; }
.tlx-icon:nth-child(3n) { color: #6ee7b7; }
.tlx-icon.is-mine { color: #fff; border-color: rgba(245, 184, 46, .8); background: linear-gradient(150deg, rgba(245, 184, 46, .6), rgba(236, 72, 153, .4)); box-shadow: 0 0 26px rgba(245, 184, 46, .55); }
:root[data-theme="light"] .tlx-icon { color: #3b5bdb; background: linear-gradient(150deg, rgba(91, 69, 255, .14), rgba(56, 182, 255, .12)); border-color: rgba(91, 69, 255, .3); }

/* Free tools: the Academy tools banner. */
.tlx-banner { position: relative; overflow: hidden; }
.tlx-banner::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(110deg, transparent 30%, rgba(255, 255, 255, .14) 48%, transparent 66%); transform: translateX(-120%); }
html.sfx-on .tlx-banner::after { animation: tlx-sweep 5s ease-in-out 1.2s infinite; }
@keyframes tlx-sweep { 0%, 60% { transform: translateX(-120%); } 100% { transform: translateX(120%); } }

/* Academy tools: floating cards whose icons turn on hover. */
html.sfx-on .tlx-at { perspective: 1200px; }
html.sfx-on .tlx-at > .at-card.sfx-done:not(.sfx-hot) { animation: tlx-float 6s ease-in-out calc(var(--tlx-i, 0) * -0.7s) infinite; }
@keyframes tlx-float { 50% { translate: 0 -6px; } }
.tlx-at .at-ic { transition: transform .6s cubic-bezier(.2, .8, .2, 1); transform-style: preserve-3d; }
.tlx-at .at-card:hover .at-ic { transform: rotateY(180deg) scale(1.08); }
.tlx-at .at-card:hover .at-ic svg { transform: scaleX(-1); }

/* Upload areas breathe; their icon floats. */
html.sfx-on .tlx-drop:not(.is-busy) { animation: tlx-breathe 3.6s ease-in-out infinite; }
@keyframes tlx-breathe { 50% { box-shadow: 0 0 0 4px rgba(56, 182, 255, .08), 0 18px 50px -24px rgba(56, 182, 255, .55); } }
html.sfx-on .tlx-drop .tk-drop-icon, html.sfx-on .tlx-drop .rb-drop-inner > svg:first-child { animation: tlx-bob 3.2s ease-in-out infinite; }
@keyframes tlx-bob { 50% { transform: translateY(-6px) rotate(-4deg); } }

@media (max-width: 640px) {
  .tlx-icon { width: 34px; height: 34px; }
  .tlx-icon .sfx-ic { width: 16px; height: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .tlx-orbit { display: none; }
  html .tlx-at > .at-card, html .tlx-drop, html .tlx-drop .tk-drop-icon { animation: none !important; }
}