@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&display=swap";:root{--font-sans:"Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--bg-primary:#08090d;--bg-secondary:#0f111a;--bg-glass:#0f111ab3;--bg-glass-hover:#161926cc;--bg-modal:#0b0c12f2;--border-light:#ffffff14;--border-glow:#6366f126;--border-glow-hover:#a855f759;--text-primary:#f8fafc;--text-secondary:#94a3b8;--text-muted:#64748b;--accent-primary:#6366f1;--accent-secondary:#a855f7;--accent-gradient:linear-gradient(135deg, var(--accent-primary), var(--accent-secondary));--accent-glow:0 0 20px #6366f14d;--danger-primary:#ef4444;--danger-secondary:#ec4899;--danger-gradient:linear-gradient(135deg, var(--danger-primary), var(--danger-secondary));--success-primary:#10b981;--info-primary:#3b82f6;--shadow-sm:0 2px 8px #0003;--shadow-md:0 8px 30px #0006;--shadow-lg:0 16px 40px #0009;--radius-sm:8px;--radius-md:14px;--radius-lg:20px;--radius-xl:28px;--radius-round:9999px;--transition-fast:.15s cubic-bezier(.4, 0, .2, 1);--transition-normal:.25s cubic-bezier(.4, 0, .2, 1)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}body{font-family:var(--font-sans);background-color:var(--bg-primary);color:var(--text-primary);-webkit-font-smoothing:antialiased;background-image:radial-gradient(circle at 10% 20%,#6366f10f 0%,#0000 45%),radial-gradient(circle at 90% 80%,#a855f70f 0%,#0000 45%);background-attachment:fixed;min-height:100vh;line-height:1.5;overflow-x:hidden}#root{flex-direction:column;width:100%;min-height:100vh;display:flex}a{color:inherit;text-decoration:none}button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit;background:0 0;border:none;outline:none}button{cursor:pointer}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}@keyframes backdropFade{0%{-webkit-backdrop-filter:blur();backdrop-filter:blur();background-color:#0000}to{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background-color:#0009}}.animate-fade{animation:fadeIn var(--transition-normal) forwards}.animate-scale{animation:scaleIn var(--transition-fast) forwards}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--bg-primary)}::-webkit-scrollbar-thumb{background:var(--border-light);border-radius:var(--radius-round)}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.container{flex-direction:column;flex-grow:1;width:100%;max-width:1200px;margin:0 auto;padding:16px;display:flex}.glass{background:var(--bg-glass);-webkit-backdrop-filter:blur(12px);border:1px solid var(--border-light);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);transition:border-color var(--transition-normal), box-shadow var(--transition-normal), background var(--transition-normal)}.glass:hover{border-color:var(--border-glow-hover);background:var(--bg-glass-hover);box-shadow:var(--shadow-md)}.btn{border-radius:var(--radius-md);transition:transform var(--transition-fast), filter var(--transition-fast), box-shadow var(--transition-fast);cursor:pointer;justify-content:center;align-items:center;gap:8px;padding:10px 18px;font-size:14px;font-weight:500;display:inline-flex}.btn-primary{background:var(--accent-gradient);color:var(--text-primary);box-shadow:var(--accent-glow)}.btn-primary:hover{filter:brightness(1.1);transform:translateY(-1px);box-shadow:0 0 25px #6366f173}.btn-primary:active{transform:translateY(1px)}.btn-secondary{background:var(--border-light);border:1px solid var(--border-light);color:var(--text-primary)}.btn-secondary:hover{border-color:var(--text-muted);background:#ffffff1f}.btn-danger{background:var(--danger-gradient);color:var(--text-primary);box-shadow:0 0 15px #ef444433}.btn-danger:hover{filter:brightness(1.1);transform:translateY(-1px);box-shadow:0 0 20px #ef444459}.btn-icon{border-radius:var(--radius-md);background:var(--bg-glass);border:1px solid var(--border-light);width:40px;height:40px;color:var(--text-secondary);transition:all var(--transition-fast);justify-content:center;align-items:center;display:inline-flex}.btn-icon:hover{color:var(--text-primary);border-color:var(--accent-secondary);background:#a855f71a}.auth-wrapper{justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex}.auth-card{text-align:center;border-radius:var(--radius-lg);width:100%;max-width:400px;padding:32px}.auth-icon{border-radius:var(--radius-md);width:64px;height:64px;color:var(--accent-primary);background:#6366f11a;justify-content:center;align-items:center;margin:0 auto 20px;display:flex}.auth-title{background:var(--accent-gradient);-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin-bottom:8px;font-size:24px;font-weight:700}.auth-desc{color:var(--text-secondary);margin-bottom:24px;font-size:14px}.input-group{width:100%;margin-bottom:16px;position:relative}.input-field{border-radius:var(--radius-md);border:1px solid var(--border-light);width:100%;color:var(--text-primary);transition:all var(--transition-fast);background:#0000004d;padding:12px 48px 12px 16px}.input-field:focus{border-color:var(--accent-primary);box-shadow:0 0 0 2px #6366f126}.input-icon{color:var(--text-muted);cursor:pointer;position:absolute;top:50%;right:16px;transform:translateY(-50%)}.input-icon:hover{color:var(--text-secondary)}header{flex-direction:column;gap:16px;margin-bottom:16px;padding:16px 0;display:flex}.logo-section{justify-content:space-between;align-items:center;display:flex}.logo{background:var(--accent-gradient);-webkit-text-fill-color:transparent;-webkit-background-clip:text;align-items:center;gap:10px;font-size:22px;font-weight:700;display:flex}.storage-stats{border-radius:var(--radius-md);margin-top:8px;padding:16px}.storage-info{color:var(--text-secondary);justify-content:space-between;margin-bottom:8px;font-size:13px;display:flex}.progress-bar-bg{border-radius:var(--radius-round);background:#ffffff0d;width:100%;height:8px;overflow:hidden}.progress-bar-fill{background:var(--accent-gradient);border-radius:var(--radius-round);height:100%;transition:width .5s ease-out}.controls-panel{flex-direction:column;gap:12px;margin-bottom:16px;display:flex}.search-bar{flex-grow:1;position:relative}.search-input{border-radius:var(--radius-md);background:var(--bg-secondary);border:1px solid var(--border-light);width:100%;color:var(--text-primary);transition:border-color var(--transition-fast);padding:10px 16px 10px 42px}.search-input:focus{border-color:var(--accent-primary)}.search-bar-icon{color:var(--text-muted);position:absolute;top:50%;left:14px;transform:translateY(-50%)}.filter-categories{scrollbar-width:none;gap:8px;padding-bottom:4px;display:flex;overflow-x:auto}.filter-categories::-webkit-scrollbar{display:none}.category-chip{border-radius:var(--radius-round);background:var(--bg-glass);border:1px solid var(--border-light);color:var(--text-secondary);transition:all var(--transition-fast);flex-shrink:0;padding:6px 14px;font-size:13px;font-weight:500}.category-chip:hover{color:var(--text-primary);background:#ffffff0d}.category-chip.active{background:var(--accent-gradient);color:var(--text-primary);border-color:#0000;box-shadow:0 4px 12px #a855f733}.actions-row{justify-content:space-between;align-items:center;gap:12px;display:flex}.files-container{flex-grow:1;min-height:250px}.file-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px;margin-top:10px;display:grid}.file-grid.list-view{grid-template-columns:1fr;gap:8px}.file-card{text-align:center;cursor:pointer;background:var(--bg-glass);border-radius:var(--radius-md);border:1px solid var(--border-light);flex-direction:column;align-items:center;padding:12px;display:flex;position:relative;overflow:hidden}.file-card-inner{flex-direction:column;align-items:center;width:100%;display:flex}.file-icon-wrapper{border-radius:var(--radius-md);width:48px;height:48px;transition:transform var(--transition-fast);justify-content:center;align-items:center;margin-bottom:10px;display:flex;position:relative}.file-card:hover .file-icon-wrapper{transform:scale(1.08)}.file-icon-wrapper.video{color:#f87171;background:#ef44441a}.file-icon-wrapper.image{color:#34d399;background:#10b9811a}.file-icon-wrapper.audio{color:#fbbf24;background:#f59e0b1a}.file-icon-wrapper.document{color:#60a5fa;background:#3b82f61a}.file-icon-wrapper.other{color:#9ca3af;background:#6b72801a}.file-image-thumb{object-fit:cover;border-radius:var(--radius-md);width:100%;height:100%}.file-name{color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;width:100%;margin-bottom:4px;font-size:13px;font-weight:500;overflow:hidden}.file-meta{color:var(--text-muted);font-size:11px}.file-card-actions{z-index:10;position:absolute;top:8px;right:8px}.file-menu-btn{border-radius:var(--radius-sm);width:28px;height:28px;color:var(--text-muted);transition:all var(--transition-fast);background:0 0;justify-content:center;align-items:center;display:flex}.file-menu-btn:hover{color:var(--text-primary);background:#ffffff0d}.file-grid.list-view .file-card{text-align:left;flex-direction:row;align-items:center;padding:10px 16px}.file-grid.list-view .file-card-inner{flex-direction:row;justify-content:space-between;align-items:center;gap:16px}.file-grid.list-view .file-icon-wrapper{flex-shrink:0;width:40px;height:40px;margin-bottom:0}.file-grid.list-view .file-info-col{flex-grow:1;min-width:0}.file-grid.list-view .file-name{margin-bottom:2px}.file-grid.list-view .file-meta-col{color:var(--text-secondary);flex-shrink:0;align-items:center;gap:16px;font-size:12px;display:flex}.file-grid.list-view .file-card-actions{position:static}.bottom-sheet-backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:100;animation:backdropFade var(--transition-fast);background:#0009;position:fixed;inset:0}.bottom-sheet{background:var(--bg-modal);border-top-left-radius:var(--radius-xl);border-top-right-radius:var(--radius-xl);border-top:1px solid var(--border-light);z-index:101;animation:slideUp var(--transition-normal) cubic-bezier(.16, 1, .3, 1);max-height:85vh;padding:24px;position:fixed;bottom:0;left:0;right:0;overflow-y:auto;transform:translateY(0);box-shadow:0 -10px 30px #00000080}.bottom-sheet-handle{background:var(--border-light);border-radius:var(--radius-round);width:40px;height:4px;margin:-12px auto 16px}.bottom-sheet-header{align-items:flex-start;gap:16px;margin-bottom:20px;display:flex}.bottom-sheet-icon{border-radius:var(--radius-md);flex-shrink:0;justify-content:center;align-items:center;width:56px;height:56px;display:flex}.bottom-sheet-title-col{flex-grow:1;min-width:0}.bottom-sheet-title{color:var(--text-primary);word-wrap:break-word;word-break:break-all;margin-bottom:4px;font-size:16px;font-weight:600}.bottom-sheet-subtitle{color:var(--text-secondary);font-size:13px}.bottom-sheet-actions{flex-direction:column;gap:8px;display:flex}.bottom-sheet-action-btn{border-radius:var(--radius-md);width:100%;color:var(--text-primary);transition:all var(--transition-fast);background:#ffffff08;align-items:center;gap:12px;padding:12px 16px;font-size:14px;display:flex}.bottom-sheet-action-btn:hover{background:#ffffff14}.bottom-sheet-action-btn.danger{color:#f87171;background:#ef44440d}.bottom-sheet-action-btn.danger:hover{background:#ef44441a}.modal-backdrop{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:100;animation:backdropFade var(--transition-fast);background:#000000bf;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.modal-content{background:var(--bg-modal);border:1px solid var(--border-light);border-radius:var(--radius-lg);width:100%;max-width:600px;box-shadow:var(--shadow-lg);flex-direction:column;max-height:90vh;padding:24px;display:flex;position:relative}.modal-header{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.modal-title{color:var(--text-primary);font-size:18px;font-weight:700}.modal-close{border-radius:var(--radius-round);width:32px;height:32px;color:var(--text-muted);transition:all var(--transition-fast);background:#ffffff08;justify-content:center;align-items:center;display:flex}.modal-close:hover{color:var(--text-primary);background:#ffffff1a}.upload-zone{border:2px dashed var(--border-light);border-radius:var(--radius-lg);text-align:center;cursor:pointer;transition:all var(--transition-fast);flex-direction:column;align-items:center;padding:40px 24px;display:flex}.upload-zone.dragging{border-color:var(--accent-primary);background:#6366f10a}.upload-zone:hover{border-color:var(--accent-secondary);background:#a855f705}.upload-icon{width:48px;height:48px;color:var(--text-secondary);margin-bottom:16px}.upload-title{margin-bottom:4px;font-size:16px;font-weight:600}.upload-subtitle{color:var(--text-muted);font-size:13px}.uploading-list{flex-direction:column;gap:12px;max-height:200px;margin-top:20px;display:flex;overflow-y:auto}.upload-item{border:1px solid var(--border-light);border-radius:var(--radius-md);background:#ffffff05;padding:12px}.upload-item-header{justify-content:space-between;margin-bottom:6px;font-size:12px;display:flex}.upload-item-name{white-space:nowrap;text-overflow:ellipsis;max-width:75%;font-weight:500;overflow:hidden}.upload-progress-bg{border-radius:var(--radius-round);background:#ffffff0d;width:100%;height:6px;overflow:hidden}.upload-progress-fill{background:var(--accent-gradient);border-radius:var(--radius-round);height:100%;transition:width .1s linear}.preview-body{border-radius:var(--radius-md);background:#000;flex-grow:1;justify-content:center;align-items:center;min-height:250px;display:flex;position:relative;overflow:hidden}.preview-image{object-fit:contain;max-width:100%;max-height:60vh}.media-container{flex-direction:column;width:100%;max-height:60vh;display:flex;position:relative}.video-player{background:#000;width:100%;max-height:60vh}.audio-player-container{background:var(--bg-secondary);border-radius:var(--radius-md);flex-direction:column;align-items:center;gap:16px;width:100%;padding:24px;display:flex}.audio-disk{border-radius:var(--radius-round);background:var(--accent-gradient);width:80px;height:80px;color:var(--text-primary);box-shadow:var(--accent-glow);justify-content:center;align-items:center;display:flex}.audio-disk.playing{animation:10s linear infinite rotateDisc}@keyframes rotateDisc{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.custom-audio-controls{width:100%}.doc-viewer{background:var(--bg-secondary);border-radius:var(--radius-md);text-align:left;white-space:pre-wrap;border:1px solid var(--border-light);width:100%;max-height:50vh;padding:16px;font-family:ui-monospace,monospace;font-size:13px;overflow-y:auto}.empty-state{text-align:center;color:var(--text-muted);flex-direction:column;justify-content:center;align-items:center;padding:60px 20px;display:flex}.empty-icon{width:64px;height:64px;color:var(--border-light);margin-bottom:16px}.fab-upload{border-radius:var(--radius-round);background:var(--accent-gradient);width:56px;height:56px;color:var(--text-primary);z-index:90;transition:all var(--transition-fast);justify-content:center;align-items:center;display:flex;position:fixed;bottom:20px;right:20px;box-shadow:0 8px 24px #6366f166}.fab-upload:hover{transform:translateY(-2px)scale(1.05)}.fab-upload:active{transform:translateY(1px)scale(.95)}@media (width>=768px){header{flex-direction:row;justify-content:space-between;align-items:center}.logo-section{flex-grow:0}.storage-stats{width:320px;margin-top:0}.controls-panel{flex-direction:row;align-items:center}.actions-row{flex-shrink:0}.file-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px}.file-card{padding:16px}.file-icon-wrapper{width:64px;height:64px}.file-name{font-size:14px}.file-meta{font-size:12px}.fab-upload{display:none}}.tab-bar{background:var(--bg-glass);border:1px solid var(--border-light);box-shadow:var(--shadow-sm)}.tab-btn{color:var(--text-secondary);border-radius:var(--radius-sm);background:0 0}.tab-btn:hover{color:var(--text-primary);background:#ffffff0a}.tab-btn.active{box-shadow:0 2px 10px #6366f133;background:var(--accent-gradient)!important;color:var(--text-primary)!important}.upload-progress-panel{-webkit-backdrop-filter:blur(16px);transition:all var(--transition-normal);background:var(--bg-glass)!important}.upload-item-compact{border:1px solid var(--border-light);border-radius:var(--radius-sm);background:#ffffff05;flex-direction:column;gap:4px;padding:8px 12px;font-size:12px;display:flex}