.file-browser{width:100%}.toolbar{display:flex;align-items:center;gap:1rem;margin-bottom:1rem;padding:1rem;background:var(--bg-secondary);border-radius:8px;border:1px solid var(--border)}.sort-controls{display:flex;align-items:center;gap:.5rem;margin-bottom:1.5rem;padding:.75rem 1rem;background:var(--bg-secondary);border-radius:8px;border:1px solid var(--border);flex-wrap:wrap}.sort-label{color:var(--text-secondary);font-size:.875rem;margin-right:.5rem;font-weight:500}.sort-btn{display:flex;align-items:center;gap:.25rem;padding:.5rem 1rem;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:6px;color:var(--text-primary);cursor:pointer;font-size:.875rem;transition:all .2s}.sort-btn:hover{background:var(--bg-primary);border-color:var(--accent)}.sort-btn.active{background:var(--accent);color:#fff;border-color:var(--accent)}.sort-btn.active:hover{background:var(--accent-hover);border-color:var(--accent-hover)}.upload-btn{display:flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;background:var(--accent);color:#fff;border:none;border-radius:6px;cursor:pointer;font-weight:500;transition:background .2s}.upload-btn:hover{background:var(--accent-hover)}.upload-status{color:var(--text-secondary);font-size:.875rem}.file-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1.5rem}.file-item{background:var(--bg-secondary);border:1px solid var(--border);border-radius:12px;padding:1rem;cursor:pointer;transition:all .2s;display:flex;flex-direction:column;position:relative;overflow:hidden}.file-item:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000004d;border-color:var(--accent)}.file-icon{display:flex;justify-content:center;align-items:center;height:120px;margin-bottom:.75rem;background:var(--bg-tertiary);border-radius:8px;position:relative;overflow:hidden}.file-icon svg{color:var(--text-secondary)}.file-icon .thumbnail{width:100%;height:100%;object-fit:cover}.file-info{flex:1}.file-name{font-weight:500;color:var(--text-primary);margin-bottom:.5rem;word-break:break-word;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.file-meta{font-size:.75rem;color:var(--text-secondary);display:flex;gap:.5rem;align-items:center}.file-actions{display:flex;gap:.5rem;margin-top:.75rem;padding-top:.75rem;border-top:1px solid var(--border)}.action-btn{flex:1;padding:.5rem;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:6px;color:var(--text-primary);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}.action-btn:hover{background:var(--bg-primary);border-color:var(--accent)}.action-btn.danger:hover{background:var(--danger);border-color:var(--danger);color:#fff}.action-btn.play-btn{background:var(--success);border-color:var(--success);color:#fff}.action-btn.play-btn:hover{background:#059669;border-color:#059669}.action-btn.share-btn{background:var(--accent);border-color:var(--accent);color:#fff}.action-btn.share-btn:hover{background:var(--accent-hover);border-color:var(--accent-hover)}.action-btn.favorite-btn{color:#ff9800;background:transparent;border-color:#ff9800}.action-btn.favorite-btn:hover{background:#fff3e0;border-color:#ff9800}.action-btn.favorite-btn.active{color:#ff9800;background:#fff3e0}.share-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000c;z-index:2000;display:flex;align-items:center;justify-content:center;padding:1rem}.share-modal{background:var(--bg-secondary);border-radius:12px;padding:2rem;max-width:500px;width:100%;box-shadow:0 8px 32px #00000080}.share-modal h3{margin:0 0 1.5rem;color:var(--text-primary);font-size:1.25rem}.share-url-container{display:flex;gap:.5rem;margin-bottom:1rem}.share-url-input{flex:1;padding:.75rem;background:var(--bg-primary);border:1px solid var(--border);border-radius:6px;color:var(--text-primary);font-size:.875rem}.copy-btn{padding:.75rem 1rem;background:var(--accent);border:none;border-radius:6px;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s}.copy-btn:hover{background:var(--accent-hover)}.share-info{color:var(--text-secondary);font-size:.875rem;margin-bottom:1.5rem;line-height:1.5}.loading,.error,.empty-state{text-align:center;padding:3rem;color:var(--text-secondary);font-size:1.1rem}.error{color:var(--danger);margin-bottom:1rem}.btn{padding:.75rem 1.5rem;border:none;border-radius:6px;font-weight:500;cursor:pointer;transition:all .2s}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent-hover)}.btn-secondary{background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border)}.btn-secondary:hover:not(:disabled){background:var(--bg-secondary)}.btn-secondary:disabled{opacity:.5;cursor:not-allowed}@media (max-width: 768px){.file-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1rem}.file-item{padding:.75rem}.file-icon{height:100px}.toolbar{flex-direction:column;align-items:stretch}.upload-btn{justify-content:center}}.video-player-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000e6;z-index:1000;display:flex;align-items:center;justify-content:center;padding:1rem}.video-player-container{width:100%;max-width:1200px;background:var(--bg-secondary);border-radius:12px;overflow:hidden;box-shadow:0 8px 32px #00000080}.video-player-header{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.5rem;background:var(--bg-primary);border-bottom:1px solid var(--border)}.video-player-header h2{font-size:1.25rem;color:var(--text-primary);margin:0;flex:1;word-break:break-word}.video-player-wrapper{position:relative;width:100%;padding-top:56.25%;background:#000}.video-player-wrapper.image-wrapper{padding-top:0;min-height:400px;display:flex;align-items:center;justify-content:center;background:#1a1a1a}.video-player-wrapper video{position:absolute;top:0;left:0;width:100%;height:100%}.video-player-wrapper.image-wrapper img{display:block;margin:auto}.video-error{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:var(--danger);font-size:1.1rem}@media (max-width: 768px){.video-player-container{max-width:100%;border-radius:0;height:100vh;display:flex;flex-direction:column}.video-player-header{padding:.75rem 1rem}.video-player-header h2{font-size:1rem}.video-player-wrapper{flex:1;padding-top:0;height:100%}}.file-editor-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:#000c;z-index:1000;display:flex;align-items:center;justify-content:center;padding:1rem}.file-editor-container{width:100%;max-width:1000px;max-height:90vh;background:var(--bg-secondary);border-radius:12px;overflow:hidden;box-shadow:0 8px 32px #00000080;display:flex;flex-direction:column}.file-editor-header{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.5rem;background:var(--bg-primary);border-bottom:1px solid var(--border)}.file-editor-header h2{font-size:1.25rem;color:var(--text-primary);margin:0;flex:1;word-break:break-word}.close-btn{background:transparent;border:none;color:var(--text-primary);cursor:pointer;padding:.5rem;border-radius:6px;transition:background .2s;margin-left:1rem}.close-btn:hover{background:var(--bg-tertiary)}.error-banner{background:#ef44441a;border:1px solid var(--danger);color:var(--danger);padding:.75rem 1.5rem;margin:1rem 1.5rem 0;border-radius:6px}.file-editor-content{flex:1;overflow:hidden;padding:1.5rem}.editor-textarea{width:100%;height:100%;min-height:400px;background:var(--bg-primary);color:var(--text-primary);border:1px solid var(--border);border-radius:6px;padding:1rem;font-family:Courier New,monospace;font-size:.875rem;line-height:1.6;resize:none;outline:none}.editor-textarea:focus{border-color:var(--accent)}.file-editor-footer{display:flex;gap:1rem;padding:1rem 1.5rem;background:var(--bg-primary);border-top:1px solid var(--border)}.file-editor-footer .btn{display:flex;align-items:center;gap:.5rem}.loading-state,.error-state{padding:3rem;text-align:center;color:var(--text-secondary)}.loading-state .spinner{animation:spin 1s linear infinite;margin:0 auto 1rem;color:var(--accent);width:32px;height:32px;border:3px solid var(--bg-tertiary);border-top:3px solid var(--accent);border-radius:50%}.file-editor-footer .spinner{width:16px;height:16px;border:2px solid var(--bg-tertiary);border-top:2px solid white;border-radius:50%;animation:spin 1s linear infinite}.error-state .error-message{color:var(--danger);margin-bottom:1.5rem}@media (max-width: 768px){.file-editor-container{max-width:100%;max-height:100vh;border-radius:0;height:100vh}.file-editor-header{padding:.75rem 1rem}.file-editor-header h2{font-size:1rem}.file-editor-content{padding:1rem}.editor-textarea{min-height:300px;font-size:.8125rem}.file-editor-footer{padding:.75rem 1rem;flex-direction:column}.file-editor-footer .btn{width:100%;justify-content:center}}.login-container{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--bg-primary);padding:1rem}.login-box{background:var(--bg-secondary);border:1px solid var(--border);border-radius:12px;padding:2.5rem;width:100%;max-width:400px;box-shadow:0 8px 32px #0000004d}.login-box h1{margin:0 0 .5rem;font-size:1.75rem;color:var(--text-primary);text-align:center}.login-box h2{margin:0 0 2rem;font-size:1.25rem;color:var(--text-secondary);text-align:center;font-weight:400}.form-group{margin-bottom:1.5rem}.form-group label{display:block;margin-bottom:.5rem;color:var(--text-primary);font-weight:500;font-size:.875rem}.form-group input{width:100%;padding:.75rem;background:var(--bg-primary);border:1px solid var(--border);border-radius:6px;color:var(--text-primary);font-size:1rem;transition:border-color .2s;box-sizing:border-box}.form-group input:focus{outline:none;border-color:var(--accent)}.form-group input:disabled{opacity:.6;cursor:not-allowed}.error-message{background:#ef44441a;border:1px solid var(--danger);color:var(--danger);padding:.75rem;border-radius:6px;margin-bottom:1rem;font-size:.875rem}.login-btn{width:100%;padding:.75rem;background:var(--accent);color:#fff;border:none;border-radius:6px;font-size:1rem;font-weight:500;cursor:pointer;transition:background .2s}.login-btn:hover:not(:disabled){background:var(--accent-hover)}.login-btn:disabled{opacity:.6;cursor:not-allowed}.favorites{padding:20px;margin-bottom:30px}.favorites-title{display:flex;align-items:center;gap:10px;margin-bottom:20px;font-size:24px;color:#333}.favorites-empty{text-align:center;padding:40px 20px;color:#666;background:#f5f5f5;border-radius:8px}.favorites-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:20px}.favorite-item{position:relative;background:#fff;border:2px solid #e0e0e0;border-radius:12px;padding:20px;cursor:pointer;transition:all .2s;display:flex;flex-direction:column;align-items:center;text-align:center;min-height:140px}.favorite-item:hover{border-color:#4caf50;transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.favorite-icon{color:#4caf50;margin-bottom:10px}.favorite-info{flex:1;width:100%}.favorite-name{font-weight:500;color:#333;word-break:break-word;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.favorite-remove-btn{position:absolute;top:10px;right:10px;background:none;border:none;cursor:pointer;color:#ff9800;padding:5px;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:all .2s;opacity:.7}.favorite-remove-btn:hover{opacity:1;background:#fff3e0;transform:scale(1.1)}@media (max-width: 768px){.favorites-grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:15px}.favorite-item{padding:15px;min-height:120px}}.app{min-height:100vh;display:flex;flex-direction:column}.app-header{background:var(--bg-secondary);border-bottom:1px solid var(--border);padding:1rem 2rem;display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;z-index:100;box-shadow:0 2px 8px #0003}.user-info{color:var(--text-secondary);font-size:.875rem;margin-right:1rem}.app-header h1{font-size:1.5rem;font-weight:600;color:var(--text-primary)}.header-actions{display:flex;gap:.5rem;align-items:center}.header-actions .btn{display:flex;align-items:center;justify-content:center;gap:.5rem}.app-main{flex:1;padding:2rem;max-width:1400px;width:100%;margin:0 auto}@media (max-width: 768px){.app-header{padding:1rem;flex-direction:column;gap:1rem;align-items:flex-start}.app-header h1{font-size:1.25rem}.app-main{padding:1rem}}.loading-screen{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--text-secondary)}.loading-spinner{width:40px;height:40px;border:4px solid var(--bg-tertiary);border-top:4px solid var(--accent);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:1rem}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}*{margin:0;padding:0;box-sizing:border-box}:root{--bg-primary: #0f172a;--bg-secondary: #1e293b;--bg-tertiary: #334155;--text-primary: #f1f5f9;--text-secondary: #cbd5e1;--accent: #3b82f6;--accent-hover: #2563eb;--danger: #ef4444;--danger-hover: #dc2626;--success: #10b981;--border: #475569}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:var(--bg-primary);color:var(--text-primary);overflow-x:hidden}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-secondary)}::-webkit-scrollbar-thumb{background:var(--bg-tertiary);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--border)}