/* Homepage-only globe. No external fonts, textures or rendering libraries. */
.globe-container.premium-globe { max-width: 490px; margin: 42px auto 0; aspect-ratio: auto; animation: none; }
.premium-globe .globe-stage { position: relative; width: 100%; aspect-ratio: 1; isolation: isolate; }
.premium-globe .globe-stage::before { content: ''; position: absolute; inset: 10%; border-radius: 50%; background: #348ee8; opacity: .1; filter: blur(40px); z-index: -1; }
.premium-globe .globe-fallback, .premium-globe canvas { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; display: block; }
.premium-globe canvas { opacity: 0; }
.premium-globe.is-rendered canvas { opacity: 1; }
.premium-globe.is-rendered .globe-fallback { visibility: hidden; }
.premium-globe .globe-caption { margin-top: -8px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 16px; border: 1px solid var(--border-subtle); border-radius: 14px; background: var(--bg-card,rgba(20,30,50,.55)); text-align: left; }
.premium-globe .globe-origin { display: flex; align-items: center; gap: 10px; color: var(--text-heading); font-size: .76rem; font-weight: 600; }
.premium-globe .globe-origin > span:first-child { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; background: #e8b961; box-shadow: 0 0 12px #e8b96180; }
.premium-globe .globe-origin small { display: block; color: var(--text-body); font-size: .66rem; font-weight: 400; margin-top: 3px; }
.premium-globe .globe-motion { flex-shrink: 0; border: 1px solid var(--border-subtle); color: var(--text-heading); background: transparent; border-radius: 8px; padding: 9px 11px; font: inherit; font-size: .68rem; cursor: pointer; min-height: 38px; transition: border-color .2s,background .2s; }
.premium-globe .globe-motion:hover { border-color: #548ccb; background: #548ccb16; }
.premium-globe .globe-motion:focus-visible { outline: 2px solid #4eacdf; outline-offset: 3px; }
.premium-globe [hidden] { display: none !important; }
@media(max-width:480px) { .premium-globe .globe-caption { padding: 11px; gap: 8px; } .premium-globe .globe-motion { padding: 8px; font-size: .63rem; } .premium-globe .globe-origin { font-size: .68rem; } .premium-globe .globe-origin small { font-size: .6rem; } }
@media(prefers-reduced-motion:reduce) { .premium-globe *, .premium-globe *::before { transition: none !important; animation: none !important; } }