.route-transition-enter{opacity:0;transform:translateY(20px)}.route-transition-enter-active{opacity:1;transform:translateY(0);transition:opacity 0.3s ease,transform 0.3s ease}.route-transition-exit{opacity:1;transform:translateY(0)}.route-transition-exit-active{opacity:0;transform:translateY(-20px);transition:opacity 0.3s ease,transform 0.3s ease}.drills-nav-indicator{position:relative}.drills-nav-indicator::after{content:'';position:absolute;top:-2px;right:-2px;width:8px;height:8px;background:var(--accent-purple);border-radius:50%;animation:pulse 2s infinite}@keyframes pulse{0%{transform:scale(0.95);opacity:0.8}50%{transform:scale(1.1);opacity:1}100%{transform:scale(0.95);opacity:0.8}}.socket-status{position:fixed;bottom:20px;left:20px;padding:8px 12px;border-radius:20px;font-size:0.75rem;font-weight:500;z-index:1000;transition:all 0.3s ease}.socket-connected{background:var(--success);color:white}.socket-disconnected{background:var(--error);color:white}.socket-connecting{background:var(--warning);color:var(--text-dark)}.realtime-badge{position:absolute;top:-8px;right:-8px;background:var(--error);color:white;border-radius:10px;min-width:20px;height:20px;font-size:0.7rem;display:flex;align-items:center;justify-content:center;animation:bounce 1s infinite}@keyframes bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}