/* Frosted layers, an orbit of light, and a slow reflection across the skeleton. */
.glass-loader { --loader-blue: #9bc7ff; display: flex; position: relative; align-items: center; justify-content: center; gap: 22px; max-width: 100%; box-sizing: border-box; white-space: normal; color: #e6edf6; font-style: normal; font-weight: 400; }
.glass-loader--panel, .glass-loader--chart { flex-direction: column; min-height: 300px; width: 100%; padding: 36px 24px; border: 1px solid #c2d9f919; border-radius: 22px; background: radial-gradient(ellipse at 50% 30%, #9bc7ff09, transparent 65%), linear-gradient(135deg,#c2ddff07,#8babd202); box-shadow: inset 0 1px 0 #ffffff0a; text-align: center; }
.glass-loader-art { position: relative; display: block; flex: 0 0 auto; width: 88px; height: 88px; }
.glass-loader-halo { position: absolute; inset: -12px; border-radius: 50%; background: radial-gradient(circle,#9bc7ff1a,transparent 68%); animation: glass-breathe 3.6s ease-in-out infinite; }
.glass-loader-orbit { position: absolute; inset: 0; border-radius: 50%; border: 1px solid #b5d3fb14; border-top-color: #b5d3fb9c; border-right-color: #b5d3fb44; animation: glass-orbit 3.2s linear infinite; }
.glass-loader-orbit::after { content: ''; position: absolute; top: 10px; right: 10px; width: 5px; height: 5px; border-radius: 50%; background: #d4e7ff; box-shadow: 0 0 12px #9bc7ff99; }
.glass-loader-orbit--inner { inset: 8px; border-color: #b5d3fb0b #b5d3fb0b #9bc7ff55; animation-duration: 5.4s; animation-direction: reverse; }
.glass-loader-orbit--inner::after { width: 3px; height: 3px; background: #65d6b0; box-shadow: 0 0 9px #65d6b066; }
.glass-loader-core { position: absolute; inset: 22px; display: grid; place-items: center; border-radius: 15px; border: 1px solid #c2d9f938; background: linear-gradient(135deg,#d7e9ff23,#9bc7ff09 65%,#9bc7ff16); box-shadow: inset 0 1px 0 #ffffff32, inset 0 -1px 0 #ffffff08, 0 8px 18px #0003; color: #c5dfff; animation: glass-float 3.6s ease-in-out infinite; }
.glass-loader-core img { width: 100%; height: 100%; display: block; object-fit: contain; }
.glass-loader-copy { display: flex; min-width: 0; flex-direction: column; gap: 8px; max-width: 380px; }
.glass-loader-title { font-size: 14px; line-height: 1.5; letter-spacing: -.015em; font-weight: 550; overflow-wrap: anywhere; }
.glass-loader-detail { font-size: 12px; line-height: 1.65; color: #93a4b8; overflow-wrap: anywhere; }
.glass-loader-skeleton { display: flex; flex-direction: column; gap: 8px; width: min(210px, 80%); align-items: center; }
.glass-loader-skeleton i { display: block; position: relative; overflow: hidden; width: 100%; height: 6px; border: 1px solid #c2d9f909; border-radius: 6px; background: #b5d3fb08; }
.glass-loader-skeleton i:nth-child(2) { width: 78%; }.glass-loader-skeleton i:nth-child(3) { width: 52%; }
.glass-loader-skeleton i::after { content: ''; position: absolute; inset: 0; background: linear-gradient(100deg,transparent,#c2d9f92b,transparent); transform: translateX(-100%); animation: glass-reflection 2.6s ease-in-out infinite; }
.glass-loader-skeleton i:nth-child(2)::after { animation-delay: .15s; }.glass-loader-skeleton i:nth-child(3)::after { animation-delay: .3s; }
.glass-loader--compact { justify-content: flex-start; gap: 16px; padding: 22px 4px; text-align: left; }
.glass-loader--compact .glass-loader-art { width: 54px; height: 54px; }.glass-loader--compact .glass-loader-core { inset: 13px; border-radius: 10px; }.glass-loader--compact .glass-loader-orbit--inner { inset: 5px; }.glass-loader--compact .glass-loader-orbit::after { top: 5px; right: 5px; width: 3px; height: 3px; }
.glass-loader--inline { display: inline-flex; justify-content: flex-start; vertical-align: middle; gap: 9px; padding: 0; text-align: left; }
.glass-loader--inline .glass-loader-art { width: 18px; height: 18px; }.glass-loader--inline .glass-loader-core,.glass-loader--inline .glass-loader-halo,.glass-loader--inline .glass-loader-orbit--inner { display: none; }.glass-loader--inline .glass-loader-orbit::after { top: 0; right: 0; width: 3px; height: 3px; }.glass-loader--inline .glass-loader-title { font-size: inherit; font-weight: 400; color: inherit; }
.glass-loader--chart { height: 100%; min-height: 220px; border: 0; background: transparent; box-shadow: none; gap: 16px; padding: 24px 16px; }.glass-loader--chart .glass-loader-skeleton { width: min(280px, 75%); }
.empty:has(> .glass-loader) { padding: 12px; }.empty > .glass-loader { min-height: 310px; }
.cmp-thinking { animation: none; }.cmp-thinking .glass-loader { color: #93a4b8; }
.dot.loading { position: relative; background: #9bc7ff; box-shadow: 0 0 9px #9bc7ff60; }
.dot.loading::after { content: ''; position: absolute; inset: -4px; border: 1px solid #9bc7ff55; border-radius: 50%; animation: glass-breathe 2.4s ease-in-out infinite; }
.load-progress > div.active { position: relative; overflow: hidden; box-shadow: 0 0 12px #9bc7ff40; }
.load-progress > div.active::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg,transparent,#ffffffb0,transparent); animation: glass-reflection 2.6s ease-in-out infinite; }
@keyframes glass-orbit { to { transform: rotate(360deg); } }
@keyframes glass-float { 0%,100% { transform: translateY(2px) rotate(-7deg); } 50% { transform: translateY(-2px) rotate(4deg); } }
@keyframes glass-breathe { 0%,100% { opacity: .45; transform: scale(.92); } 50% { opacity: 1; transform: scale(1.06); } }
@keyframes glass-reflection { 0%,15% { transform: translateX(-100%); } 75%,100% { transform: translateX(100%); } }
@media(max-width:600px) { .glass-loader--panel { min-height: 270px; padding: 28px 18px; }.glass-loader--compact { gap: 12px; }.glass-loader-detail { font-size: 11px; } }
@media(prefers-reduced-motion:reduce) { .glass-loader *, .glass-loader *::after, .dot.loading::after, .load-progress > div.active::after { animation: none !important; }.load-progress > div { transition: none; }.glass-loader-skeleton i::after { transform: none; opacity: .3; } }
