:root{--primary:#6366f1;--primary-dark:#4f46e5;--danger:#ef4444;--danger-dark:#dc2626;--success:#22c55e;--success-dark:#16a34a;--gray-100:#f3f4f6;--gray-200:#e5e7eb;--gray-300:#d1d5db;--gray-700:#374151;--gray-900:#111827;--shadow:0 10px 25px -5px rgba(0,0,0,.1);--shadow-lg:0 20px 25px -5px rgba(0,0,0,.1),0 10px 10px -5px rgba(0,0,0,.04);--radius:12px;--radius-lg:16px}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Segoe UI,system-ui,-apple-system,sans-serif;background:linear-gradient(135deg,#f0f4ff,#e6e6ff);color:var(--gray-900);line-height:1.6;min-height:100vh;padding:20px}.container{max-width:1200px;margin:0 auto;background:#fff;padding:40px;border-radius:var(--radius-lg);box-shadow:var(--shadow-lg)}.header{text-align:center;margin-bottom:40px}.header h1{font-size:2.5rem;color:var(--primary);margin-bottom:10px;display:flex;align-items:center;justify-content:center;gap:15px}.header p{font-size:1.2rem;color:var(--gray-700);max-width:600px;margin:0 auto}.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:16px 32px;font-size:1.1rem;font-weight:600;border-radius:var(--radius);border:none;cursor:pointer;transition:all .3s ease;box-shadow:var(--shadow)}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary-dark);transform:translateY(-2px);box-shadow:0 8px 15px rgba(79,70,229,.3)}.btn-danger{background:var(--danger);color:#fff}.btn-danger:hover{background:var(--danger-dark);transform:translateY(-2px);box-shadow:0 8px 15px rgba(239,68,68,.3)}.btn:disabled{opacity:.7;cursor:not-allowed;transform:none!important;box-shadow:none!important}.btn-group{gap:20px;margin-bottom:30px;flex-wrap:wrap}.btn-group,.status{display:flex;justify-content:center}.status{text-align:center;padding:15px;margin:20px 0;border-radius:var(--radius);background:var(--gray-100);font-weight:500;align-items:center;gap:10px}.video-container{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin:40px 0}.video-box{background:var(--gray-100);padding:20px;border-radius:var(--radius);box-shadow:var(--shadow);transition:all .3s ease}.video-box:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg)}.video-box h3{display:flex;align-items:center;gap:10px;margin-bottom:15px;color:var(--gray-700)}video{width:100%;height:250px;object-fit:cover;border-radius:var(--radius);background:#000;transition:all .3s ease}.video-box:hover video{box-shadow:0 8px 15px rgba(0,0,0,.2)}.panels{display:grid;grid-template-columns:1fr 1.5fr;gap:30px;margin-top:40px}.chat-section,.queue-section{background:var(--gray-100);padding:25px;border-radius:var(--radius);box-shadow:var(--shadow)}.chat-section h3,.queue-section h3{display:flex;align-items:center;gap:10px;margin-bottom:20px;color:var(--gray-700)}#queueList{list-style:none;display:flex;flex-wrap:wrap;gap:10px}#queueList li{background:#fff;padding:8px 16px;border-radius:20px;font-size:.9rem;box-shadow:0 2px 5px rgba(0,0,0,.1);display:flex;align-items:center;gap:5px}.chat-messages{height:250px;overflow-y:auto;background:#fff;border-radius:var(--radius);padding:15px;margin-bottom:15px;display:flex;flex-direction:column;gap:10px}.chat-message{padding:12px 16px;border-radius:18px;max-width:80%;font-size:.95rem;line-height:1.4;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.chat-message.me{background:var(--primary);color:#fff;align-self:flex-end;border-bottom-right-radius:5px}.chat-message.other{background:var(--gray-200);color:var(--gray-900);align-self:flex-start;border-bottom-left-radius:5px}.chat-input{display:flex;gap:10px}.chat-input input{flex:1;padding:14px 16px;border:1px solid var(--gray-300);border-radius:var(--radius);font-size:1rem;outline:none;transition:all .3s ease}.chat-input input:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(99,102,241,.2)}.chat-input button{padding:14px 20px;background:var(--success);color:#fff;border:none;border-radius:var(--radius);cursor:pointer;font-weight:600;transition:all .3s ease}.chat-input button:hover{background:var(--success-dark)}.chat-input button:disabled{background:var(--gray-300);cursor:not-allowed}.notification{position:fixed;top:20px;right:20px;padding:15px 20px;background:#fff;border-radius:var(--radius);box-shadow:var(--shadow-lg);display:flex;align-items:center;gap:10px;transform:translateX(150%);transition:transform .3s ease;z-index:1000}.notification.show{transform:translateX(0)}.notification.success{border-left:4px solid var(--success)}.notification.error{border-left:4px solid var(--danger)}.notification.info{border-left:4px solid var(--primary)}.loader{display:inline-block;width:20px;height:20px;border:3px solid rgba(99,102,241,.3);border-radius:50%;border-top-color:var(--primary);animation:spin 1s ease-in-out infinite}@keyframes spin{to{transform:rotate(1turn)}}@media (max-width:900px){.panels,.video-container{grid-template-columns:1fr}.container{padding:25px}}* Стили для переключателей / .media-controls{display:flex;justify-content:center;gap:20px;margin-bottom:25px;flex-wrap:wrap}.media-toggle{display:flex;align-items:center;gap:10px;cursor:pointer;padding:12px 20px;background:var(--gray-100);border-radius:var(--radius);transition:all .3s ease;user-select:none}.media-toggle:hover{background:var(--gray-200);transform:translateY(-2px)}.media-toggle input[type=checkbox]{display:none}.toggle-slider{position:relative;width:50px;height:26px;background:var(--gray-300);border-radius:34px;transition:all .3s ease}.toggle-slider:before{content:"";position:absolute;width:22px;height:22px;border-radius:50%;background:#fff;top:2px;left:2px;transition:all .3s ease}.media-toggle input:checked+.toggle-slider{background:var(--success)}.media-toggle input:checked+.toggle-slider:before{transform:translateX(24px)}.toggle-label{display:flex;align-items:center;gap:8px;font-weight:500;color:var(--gray-700)}.media-status{display:inline-block;width:8px;height:8px;border-radius:50%;margin-left:5px}.media-status.active{background:var(--success)}.media-status.inactive{background:var(--danger)}#queueList li{cursor:pointer}@media (max-width:600px){.btn-group{flex-direction:column;align-items:center}.btn{width:100%;max-width:300px}.header h1{font-size:2rem}.media-toggle{width:100%;max-width:200px;justify-content:space-between}}