:root{--hologram-cyan: #00f3ff;--hologram-magenta: #ff00ff;--hologram-purple: #8000ff;--hologram-green: #00ff88;--bg-dark: #0a0a0f;--bg-glass: rgba(255, 255, 255, .05)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:"Exo 2",sans-serif;background:var(--bg-dark);color:#fff;overflow:hidden;min-height:100vh}#hologram-canvas{position:fixed;top:0;left:0;width:100%;height:100%;z-index:1}.holo-nav{position:fixed;top:0;left:0;right:0;height:80px;background:linear-gradient(180deg,rgba(0,0,0,.8),transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:100;display:flex;align-items:center;justify-content:space-between;padding:0 40px;border-bottom:1px solid rgba(0,243,255,.2)}.nav-back{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--hologram-cyan);font-family:Orbitron,sans-serif;font-size:1.1rem;padding:10px 20px;border:1px solid rgba(0,243,255,.3);border-radius:25px;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);transition:all .3s ease}.nav-back:hover{background:#00f3ff1a;border-color:var(--hologram-cyan);box-shadow:0 5px 20px #00f3ff4d;transform:translate(-5px)}.call-info{text-align:center;flex:1}.call-title{font-family:Orbitron,sans-serif;font-size:1.5rem;color:var(--hologram-cyan);margin-bottom:5px;text-shadow:0 0 20px rgba(0,243,255,.5)}.call-timer{font-size:1rem;color:var(--hologram-green);font-family:Courier New,monospace;display:flex;align-items:center;justify-content:center;gap:8px}.timer-icon{animation:pulse 2s ease infinite}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(.9)}}.call-encryption{display:flex;align-items:center;gap:8px;padding:10px 20px;background:#00ff881a;border:1px solid rgba(0,255,136,.3);border-radius:25px;font-size:.9rem;color:var(--hologram-green)}.encryption-icon{font-size:1.2rem}.hud-overlay{position:fixed;top:80px;left:0;right:0;bottom:0;z-index:50;pointer-events:none}.hud-overlay>*{pointer-events:auto}.active-speaker{position:absolute;top:30px;left:50%;transform:translate(-50%);background:#000000b3;border:1px solid rgba(0,243,255,.4);border-radius:50px;padding:15px 30px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;align-items:center;gap:15px;box-shadow:0 5px 30px #00f3ff4d;animation:fadeInDown .5s ease}@keyframes fadeInDown{0%{opacity:0;transform:translate(-50%) translateY(-20px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.speaker-ring{width:50px;height:50px;border:3px solid var(--hologram-cyan);border-radius:50%;display:flex;align-items:center;justify-content:center;position:relative;animation:ringPulse 2s ease infinite}@keyframes ringPulse{0%,to{box-shadow:0 0 20px var(--hologram-cyan)}50%{box-shadow:0 0 40px var(--hologram-cyan),0 0 60px var(--hologram-cyan)}}.speaker-ring:before{content:"";position:absolute;width:60px;height:60px;border:2px solid var(--hologram-cyan);border-radius:50%;opacity:.3;animation:ringExpand 2s ease infinite}@keyframes ringExpand{0%{transform:scale(1);opacity:.5}to{transform:scale(1.5);opacity:0}}.speaker-avatar{font-size:1.5rem}.speaker-info h3{font-family:Orbitron,sans-serif;color:var(--hologram-cyan);font-size:1.2rem;margin-bottom:3px}.speaker-info p{font-size:.85rem;color:#fff9}.participants-panel{position:absolute;right:30px;top:30px;width:280px;max-height:calc(100vh - 240px);background:#000c;border:1px solid rgba(0,243,255,.3);border-radius:20px;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);padding:20px;overflow-y:auto;box-shadow:0 10px 40px #00000080;animation:slideInRight .5s ease}@keyframes slideInRight{0%{opacity:0;transform:translate(50px)}to{opacity:1;transform:translate(0)}}.participants-panel::-webkit-scrollbar{width:6px}.participants-panel::-webkit-scrollbar-track{background:#0003;border-radius:3px}.participants-panel::-webkit-scrollbar-thumb{background:var(--hologram-cyan);border-radius:3px}.panel-header{font-family:Orbitron,sans-serif;font-size:1.2rem;color:var(--hologram-cyan);margin-bottom:20px;display:flex;align-items:center;gap:10px;padding-bottom:15px;border-bottom:1px solid rgba(0,243,255,.2)}.participants-list{display:flex;flex-direction:column;gap:12px}.participant-item{display:flex;align-items:center;gap:12px;padding:12px;background:#ffffff08;border:1px solid rgba(0,243,255,.2);border-radius:12px;transition:all .3s ease;cursor:pointer}.participant-item:hover{background:#00f3ff1a;border-color:var(--hologram-cyan);transform:translate(5px);box-shadow:0 5px 20px #00f3ff33}.participant-avatar{width:45px;height:45px;border-radius:50%;background:linear-gradient(135deg,var(--hologram-cyan),var(--hologram-purple));display:flex;align-items:center;justify-content:center;font-size:1.3rem;flex-shrink:0;border:2px solid rgba(0,243,255,.5)}.participant-details{flex:1;min-width:0}.participant-name{font-weight:600;font-size:.95rem;color:#fff;margin-bottom:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.participant-status{font-size:.8rem;color:var(--hologram-green);display:flex;align-items:center;gap:5px}.status-dot{width:8px;height:8px;background:var(--hologram-green);border-radius:50%;animation:statusBlink 2s ease infinite}@keyframes statusBlink{0%,to{opacity:1}50%{opacity:.3}}.features-panel{position:absolute;left:30px;top:30px;width:280px;background:#000c;border:1px solid rgba(255,0,255,.3);border-radius:20px;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);padding:20px;box-shadow:0 10px 40px #00000080;animation:slideInLeft .5s ease}@keyframes slideInLeft{0%{opacity:0;transform:translate(-50px)}to{opacity:1;transform:translate(0)}}.features-panel .panel-header{color:var(--hologram-magenta);border-bottom-color:#f0f3}.features-list{display:flex;flex-direction:column;gap:15px}.feature-item{display:flex;align-items:center;justify-content:space-between;padding:15px;background:#ffffff08;border:1px solid rgba(255,0,255,.2);border-radius:12px;transition:all .3s ease}.feature-item:hover{background:#ff00ff1a;border-color:var(--hologram-magenta)}.feature-info{display:flex;align-items:center;gap:12px;flex:1}.feature-icon{font-size:1.5rem;width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:#ff00ff1a;border-radius:10px;border:1px solid rgba(255,0,255,.3)}.feature-text h4{font-size:.95rem;color:#fff;margin-bottom:3px}.feature-text p{font-size:.75rem;color:#ffffff80}.feature-toggle{position:relative;width:50px;height:26px}.feature-toggle input{opacity:0;width:0;height:0}.toggle-slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background:#ffffff1a;border-radius:26px;transition:all .3s ease;border:1px solid rgba(255,255,255,.2)}.toggle-slider:before{content:"";position:absolute;height:18px;width:18px;left:4px;bottom:3px;background:#fff;border-radius:50%;transition:transform .3s ease}.feature-toggle input:checked+.toggle-slider{background:linear-gradient(135deg,var(--hologram-magenta),var(--hologram-purple));border-color:var(--hologram-magenta);box-shadow:0 0 20px #ff00ff80}.feature-toggle input:checked+.toggle-slider:before{transform:translate(24px)}.control-bar{position:absolute;bottom:40px;left:50%;transform:translate(-50%);background:#000000e6;border:1px solid rgba(0,243,255,.4);border-radius:50px;padding:20px 30px;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);display:flex;gap:15px;box-shadow:0 10px 50px #000000b3;animation:slideInUp .5s ease}@keyframes slideInUp{0%{opacity:0;transform:translate(-50%) translateY(50px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.control-btn{width:60px;height:60px;border-radius:50%;border:2px solid rgba(0,243,255,.4);background:#00f3ff0d;color:#fff;font-size:1.5rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease;position:relative;overflow:hidden}.control-btn:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle,var(--hologram-cyan),transparent);opacity:0;transition:opacity .3s ease}.control-btn:hover{transform:translateY(-5px);border-color:var(--hologram-cyan);box-shadow:0 10px 30px #00f3ff80}.control-btn:hover:before{opacity:.3}.control-btn:active{transform:translateY(-2px)}.control-btn.active{background:#00f3ff33;border-color:var(--hologram-cyan);box-shadow:0 0 30px #00f3ff66}.control-btn.muted{background:#ff00001a;border-color:#ff000080;color:#f44}.control-btn.muted:hover{border-color:#f44;box-shadow:0 10px 30px #ff444480}.control-btn.leave{background:#f003;border-color:#ff000080;width:70px;height:70px;font-size:1.8rem}.control-btn.leave:hover{background:#ff00004d;border-color:red;box-shadow:0 10px 40px #f009;transform:translateY(-5px) scale(1.05)}.control-label{position:absolute;bottom:-30px;left:50%;transform:translate(-50%);font-size:.75rem;color:#fff9;white-space:nowrap;opacity:0;transition:opacity .3s ease;pointer-events:none}.control-btn:hover .control-label{opacity:1}.stats-overlay{position:absolute;top:30px;left:50%;transform:translate(-50%);display:flex;gap:20px;animation:fadeIn .5s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.stat-card{background:#000000b3;border:1px solid rgba(0,243,255,.3);border-radius:12px;padding:12px 20px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;align-items:center;gap:10px;min-width:120px}.stat-icon{font-size:1.5rem;color:var(--hologram-cyan)}.stat-info{flex:1}.stat-label{font-size:.75rem;color:#ffffff80;margin-bottom:2px}.stat-value{font-family:Orbitron,sans-serif;font-size:1rem;color:var(--hologram-green);font-weight:600}.stat-value.warning{color:#fa0}.stat-value.error{color:#f44}#loading-screen{position:fixed;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,#0a0a0f,#1a0a2f);display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:10000;transition:opacity .5s ease,visibility .5s ease}#loading-screen.hidden{opacity:0;visibility:hidden;pointer-events:none}.loading-rings{position:relative;width:200px;height:200px;margin-bottom:30px}.loading-ring{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);border:3px solid transparent;border-top-color:var(--hologram-cyan);border-radius:50%;animation:spin 1.5s linear infinite}.loading-ring:nth-child(1){width:80px;height:80px;border-top-color:var(--hologram-cyan);animation-duration:1.5s}.loading-ring:nth-child(2){width:120px;height:120px;border-top-color:var(--hologram-magenta);animation-duration:2s;animation-direction:reverse}.loading-ring:nth-child(3){width:160px;height:160px;border-top-color:var(--hologram-purple);animation-duration:2.5s}@keyframes spin{to{transform:translate(-50%,-50%) rotate(360deg)}}.loading-text{font-family:Orbitron,sans-serif;font-size:1.5rem;color:var(--hologram-cyan);text-align:center;animation:textPulse 2s ease infinite}@keyframes textPulse{0%,to{opacity:1;text-shadow:0 0 20px rgba(0,243,255,.5)}50%{opacity:.6;text-shadow:0 0 40px rgba(0,243,255,.8)}}.loading-subtitle{font-size:1rem;color:#fff9;margin-top:10px}@media (max-width: 1024px){.holo-nav{padding:0 20px}.participants-panel,.features-panel{width:240px;right:20px;left:20px}.control-bar{padding:15px 20px;gap:12px}.control-btn{width:55px;height:55px;font-size:1.3rem}.control-btn.leave{width:65px;height:65px}}@media (max-width: 768px){.holo-nav{padding:0 15px;height:70px}.call-title{font-size:1.2rem}.call-timer{font-size:.9rem}.active-speaker{padding:12px 20px}.speaker-ring{width:40px;height:40px}.participants-panel,.features-panel{width:calc(100% - 30px);max-height:40vh;top:auto;bottom:140px;left:15px;right:15px}.control-bar{bottom:20px;padding:12px 15px;gap:10px;flex-wrap:wrap;justify-content:center}.control-btn{width:50px;height:50px;font-size:1.2rem}.control-btn.leave{width:60px;height:60px}.stats-overlay{flex-direction:column;gap:10px;top:80px}.stat-card{min-width:100px;padding:10px 15px}}@media (max-width: 480px){.holo-nav{flex-direction:column;height:auto;padding:10px;gap:10px}.nav-back{font-size:.9rem;padding:8px 15px}.call-title{font-size:1rem}.call-encryption{padding:8px 15px;font-size:.8rem}.active-speaker{display:none}.control-bar{width:calc(100% - 20px)}.control-btn{width:45px;height:45px;font-size:1rem}.control-btn.leave{width:55px;height:55px}.loading-rings{width:150px;height:150px}.loading-ring:nth-child(1){width:60px;height:60px}.loading-ring:nth-child(2){width:90px;height:90px}.loading-ring:nth-child(3){width:120px;height:120px}}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.nav-back:focus,.control-btn:focus,.participant-item:focus,.feature-toggle input:focus+.toggle-slider{outline:2px solid var(--hologram-cyan);outline-offset:2px}@media (prefers-contrast: high){.control-btn,.participant-item,.feature-item{border-width:2px}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}